/* ============
   E8Micovision
   ============ */

/* ==========================================================================
   modern-normalize v2.0.0 | MIT License | https://github.com/sindresorhus/modern-nocrmalize
   ========================================================================== */

*,::after,::before{box-sizing:border-box}html{font-family:system-ui,'Segoe UI',Roboto,Helvetica,Arial,sans-serif,'Apple Color Emoji','Segoe UI Emoji';line-height:1.15;-webkit-text-size-adjust:100%;-moz-tab-size:4;tab-size:4}body{margin:0}hr{height:0;color:inherit}abbr[title]{text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Consolas,'Liberation Mono',Menlo,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}::-moz-focus-inner{border-style:none;padding:0}:-moz-focusring{outline:1px dotted ButtonText}:-moz-ui-invalid{box-shadow:none}legend{padding:0}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}

/* --------------------------------------------
BASE
----------------------------------------------- */

* {margin: 0; padding: 0;}
*, *:before, *:after {-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}
html * {-webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;}
html {height: 100%; background: #fff;}
body {font-family: 'Archivo', sans-serif; font-weight: normal; line-height: 1.5; font-size: 100%; color: #2e2925;}
img {vertical-align: middle; border: none; image-rendering: optimizeQuality; -ms-interpolation-mode: bicubic;}
a, button {transition: ease all .25s;}
.sr-only {position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; -webkit-clip-path: inset(50%); clip-path: inset(50%); border: 0;}

::selection {background: #222; color: #fff; text-shadow: none;}
::-moz-selection {background: #222; color: #fff; text-shadow: none;}
::-webkit-selection {background: #222; color: #fff; text-shadow: none;}

/* --------------------------------------------
LOGIN
----------------------------------------------- */

.login-page {background: #E5E5E5; border: 20px solid #fff; border-radius: 50px; height: 100%; display: flex; align-items: center; flex-wrap: wrap;}
.login-container {margin: 25px auto; padding: 50px; border-radius: 10px; background: #fff; box-shadow: 0 25px 25px rgba(0,0,0,.15);}
.login-container h1 {font-size: 1.6em; text-align: center;}
.login-container hr {border: 0; padding-bottom: 3px; margin: 15px 0 30px 0; width: 100%; background: #000; display: block; border-radius: 100px;}
.login-container form {max-width: 270px;}
.login-container label {font-size: 1.1em; margin-bottom: 5px; display: block;}
.login-container input {width: 100%; padding: 12px 15px; margin: 0 0 25px 0; border-radius: 100px; border: 1px solid #B1B1B1; font-size: 1.1em;}
.login-container input[type="submit"] {background-color: #000; color: #fff; border: 0; cursor: pointer; margin: 0; font-weight: bold; letter-spacing: 1px; text-transform: uppercase; transition: all ease .25s;}
.login-container input[type="submit"]:hover, .login-container input[type="submit"]:active, .login-container input[type="submit"]:focus {background-color: #51A946;}
.login-container .warning {color: red; text-align: center; margin-top: 15px;}

/* --------------------------------------------
GALLERY
----------------------------------------------- */

.gallery-page {padding: 50px;}
.gallery-page h1 {font-size: 1.8em; line-height: 1.2em;}
.gallery-page hr {border: 0; padding-bottom: 3px; margin: 15px 0 30px 0; width: 150px; background: #000; display: block; border-radius: 100px;}
.gallery-page .filter-buttons {display: block; margin: 0 0 30px 0; display: flex; flex-wrap: wrap;}
.gallery-page .filter-buttons span, .gallery-page .filter-buttons a {display: inline-block; padding: 10px 15px; border-radius: 100px; margin: 0 5px 5px 0; text-decoration: none; font-size: .9em; color: #000; line-height: 1.1em;}
.gallery-page .filter-buttons span {font-weight: bold; padding: 10px 5px 10px 0;}
.gallery-page .filter-buttons a:nth-of-type(1) {background: #000; color: #fff;}
.gallery-page .filter-buttons a:nth-of-type(2) {background: #e9a9ce;}
.gallery-page .filter-buttons a:nth-of-type(3) {background: #ff678c;}
.gallery-page .filter-buttons a:nth-of-type(4) {background: #F78C6B;}
.gallery-page .filter-buttons a:nth-of-type(5) {background: #FFD166;}
.gallery-page .filter-buttons a:nth-of-type(6) {background: #2FB3DE;}
.gallery-page .filter-buttons a:nth-of-type(7) {background: #06D6A0;}
.gallery-page .filter-buttons a:hover, .gallery-page .filter-buttons a:active.gallery-page .filter-buttons a:focus {scale: .95;}

.gallery {display: flex; flex-wrap: wrap; justify-content: center;}
.gallery .image-container {margin: 0 10px 20px 10px; border-radius: 10px; overflow: hidden;}
.gallery .image-container img {max-width: 300px; width: 100%; height: auto;}
.gallery .image-container .image-label {text-align: center; color: #000; padding: 15px 10px; line-height: 1.1em;}

.hr-pagination {margin: 30px auto 30px auto !important;}
.pagination {text-align: center; display: flex; align-items: center; justify-content: center; flex-wrap: wrap;}
.pagination a {padding: 10px 15px; border-radius: 100px; margin: 10px; text-decoration: none; font-size: .9em; color: #fff; line-height: 1.1em; background: #000;}
.pagination a:hover, .pagination a:active, .pagination a:focus {scale: .95;}
.pagination span {font-weight: bold;}

/* --------------------------------------------
RESPONSIVE
----------------------------------------------- */

@media all and (max-width: 600px) {
.gallery-page {padding: 25px;}
}

@media all and (max-height: 525px) {
.login-page {border: 10px solid #fff; border-radius: 25px;}
.login-container {margin: 10px auto; padding: 25px;}
.login-container h1 {font-size: 1.4em;}
}

@media all and (max-width: 470px) {
.login-page {border: 10px solid #fff; border-radius: 25px;}
.login-container {margin: 10px auto; padding: 25px;}
.login-container h1 {font-size: 1.4em;}
.gallery-page .filter-buttons span, .gallery-page .filter-buttons a {width: 100%; margin-right: 0;}
.pagination {flex-direction: column;}
}

/* --------------------------------------------
FONTS
----------------------------------------------- */

/* Generated by https://transfonter.org/: On (Add local rule, Fix vertical metrics), Formats (All), Font directory (Add) */
/* Compressed with https://csscompressor.com/: High (moderate readability, smaller size) */

/* Archivo */

@font-face{font-family:'Archivo';src:url(fonts/archivo/Archivo-BlackItalic.eot);src:local('Archivo Black Italic'),local(Archivo-BlackItalic),url(fonts/archivo/Archivo-BlackItalic.eot?#iefix) format("embedded-opentype"),url(fonts/archivo/Archivo-BlackItalic.woff2) format("woff2"),url(fonts/archivo/Archivo-BlackItalic.woff) format("woff"),url(fonts/archivo/Archivo-BlackItalic.ttf) format("truetype"),url(fonts/archivo/Archivo-BlackItalic.svg#Archivo-BlackItalic) format("svg");font-weight:900;font-style:italic;font-display:swap}
@font-face{font-family:'Archivo';src:url(fonts/archivo/Archivo-Black.eot);src:local('Archivo Black'),local(Archivo-Black),url(fonts/archivo/Archivo-Black.eot?#iefix) format("embedded-opentype"),url(fonts/archivo/Archivo-Black.woff2) format("woff2"),url(fonts/archivo/Archivo-Black.woff) format("woff"),url(fonts/archivo/Archivo-Black.ttf) format("truetype"),url(fonts/archivo/Archivo-Black.svg#Archivo-Black) format("svg");font-weight:900;font-style:normal;font-display:swap}
@font-face{font-family:'Archivo';src:url(fonts/archivo/Archivo-BoldItalic.eot);src:local('Archivo Bold Italic'),local(Archivo-BoldItalic),url(fonts/archivo/Archivo-BoldItalic.eot?#iefix) format("embedded-opentype"),url(fonts/archivo/Archivo-BoldItalic.woff2) format("woff2"),url(fonts/archivo/Archivo-BoldItalic.woff) format("woff"),url(fonts/archivo/Archivo-BoldItalic.ttf) format("truetype"),url(fonts/archivo/Archivo-BoldItalic.svg#Archivo-BoldItalic) format("svg");font-weight:700;font-style:italic;font-display:swap}
@font-face{font-family:'Archivo';src:url(fonts/archivo/Archivo-Bold.eot);src:local('Archivo Bold'),local(Archivo-Bold),url(fonts/archivo/Archivo-Bold.eot?#iefix) format("embedded-opentype"),url(fonts/archivo/Archivo-Bold.woff2) format("woff2"),url(fonts/archivo/Archivo-Bold.woff) format("woff"),url(fonts/archivo/Archivo-Bold.ttf) format("truetype"),url(fonts/archivo/Archivo-Bold.svg#Archivo-Bold) format("svg");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'Archivo';src:url(fonts/archivo/Archivo-ExtraBold.eot);src:local('Archivo ExtraBold'),local(Archivo-ExtraBold),url(fonts/archivo/Archivo-ExtraBold.eot?#iefix) format("embedded-opentype"),url(fonts/archivo/Archivo-ExtraBold.woff2) format("woff2"),url(fonts/archivo/Archivo-ExtraBold.woff) format("woff"),url(fonts/archivo/Archivo-ExtraBold.ttf) format("truetype"),url(fonts/archivo/Archivo-ExtraBold.svg#Archivo-ExtraBold) format("svg");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'Archivo';src:url(fonts/archivo/Archivo-MediumItalic.eot);src:local('Archivo Medium Italic'),local(Archivo-MediumItalic),url(fonts/archivo/Archivo-MediumItalic.eot?#iefix) format("embedded-opentype"),url(fonts/archivo/Archivo-MediumItalic.woff2) format("woff2"),url(fonts/archivo/Archivo-MediumItalic.woff) format("woff"),url(fonts/archivo/Archivo-MediumItalic.ttf) format("truetype"),url(fonts/archivo/Archivo-MediumItalic.svg#Archivo-MediumItalic) format("svg");font-weight:500;font-style:italic;font-display:swap}
@font-face{font-family:'Archivo';src:url(fonts/archivo/Archivo-SemiBoldItalic.eot);src:local('Archivo SemiBold Italic'),local(Archivo-SemiBoldItalic),url(fonts/archivo/Archivo-SemiBoldItalic.eot?#iefix) format("embedded-opentype"),url(fonts/archivo/Archivo-SemiBoldItalic.woff2) format("woff2"),url(fonts/archivo/Archivo-SemiBoldItalic.woff) format("woff"),url(fonts/archivo/Archivo-SemiBoldItalic.ttf) format("truetype"),url(fonts/archivo/Archivo-SemiBoldItalic.svg#Archivo-SemiBoldItalic) format("svg");font-weight:600;font-style:italic;font-display:swap}
@font-face{font-family:'Archivo';src:url(fonts/archivo/Archivo-ThinItalic.eot);src:local('Archivo Thin Italic'),local(Archivo-ThinItalic),url(fonts/archivo/Archivo-ThinItalic.eot?#iefix) format("embedded-opentype"),url(fonts/archivo/Archivo-ThinItalic.woff2) format("woff2"),url(fonts/archivo/Archivo-ThinItalic.woff) format("woff"),url(fonts/archivo/Archivo-ThinItalic.ttf) format("truetype"),url(fonts/archivo/Archivo-ThinItalic.svg#Archivo-ThinItalic) format("svg");font-weight:100;font-style:italic;font-display:swap}
@font-face{font-family:'Archivo';src:url(fonts/archivo/Archivo-Medium.eot);src:local('Archivo Medium'),local(Archivo-Medium),url(fonts/archivo/Archivo-Medium.eot?#iefix) format("embedded-opentype"),url(fonts/archivo/Archivo-Medium.woff2) format("woff2"),url(fonts/archivo/Archivo-Medium.woff) format("woff"),url(fonts/archivo/Archivo-Medium.ttf) format("truetype"),url(fonts/archivo/Archivo-Medium.svg#Archivo-Medium) format("svg");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Archivo';src:url(fonts/archivo/Archivo-Thin.eot);src:local('Archivo Thin'),local(Archivo-Thin),url(fonts/archivo/Archivo-Thin.eot?#iefix) format("embedded-opentype"),url(fonts/archivo/Archivo-Thin.woff2) format("woff2"),url(fonts/archivo/Archivo-Thin.woff) format("woff"),url(fonts/archivo/Archivo-Thin.ttf) format("truetype"),url(fonts/archivo/Archivo-Thin.svg#Archivo-Thin) format("svg");font-weight:100;font-style:normal;font-display:swap}
@font-face{font-family:'Archivo';src:url(fonts/archivo/Archivo-ExtraBoldItalic.eot);src:local('Archivo ExtraBold Italic'),local(Archivo-ExtraBoldItalic),url(fonts/archivo/Archivo-ExtraBoldItalic.eot?#iefix) format("embedded-opentype"),url(fonts/archivo/Archivo-ExtraBoldItalic.woff2) format("woff2"),url(fonts/archivo/Archivo-ExtraBoldItalic.woff) format("woff"),url(fonts/archivo/Archivo-ExtraBoldItalic.ttf) format("truetype"),url(fonts/archivo/Archivo-ExtraBoldItalic.svg#Archivo-ExtraBoldItalic) format("svg");font-weight:700;font-style:italic;font-display:swap}
@font-face{font-family:'Archivo';src:url(fonts/archivo/Archivo-SemiBold.eot);src:local('Archivo SemiBold'),local(Archivo-SemiBold),url(fonts/archivo/Archivo-SemiBold.eot?#iefix) format("embedded-opentype"),url(fonts/archivo/Archivo-SemiBold.woff2) format("woff2"),url(fonts/archivo/Archivo-SemiBold.woff) format("woff"),url(fonts/archivo/Archivo-SemiBold.ttf) format("truetype"),url(fonts/archivo/Archivo-SemiBold.svg#Archivo-SemiBold) format("svg");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'Archivo';src:url(fonts/archivo/Archivo-ExtraLightItalic.eot);src:local('Archivo ExtraLight Italic'),local(Archivo-ExtraLightItalic),url(fonts/archivo/Archivo-ExtraLightItalic.eot?#iefix) format("embedded-opentype"),url(fonts/archivo/Archivo-ExtraLightItalic.woff2) format("woff2"),url(fonts/archivo/Archivo-ExtraLightItalic.woff) format("woff"),url(fonts/archivo/Archivo-ExtraLightItalic.ttf) format("truetype"),url(fonts/archivo/Archivo-ExtraLightItalic.svg#Archivo-ExtraLightItalic) format("svg");font-weight:200;font-style:italic;font-display:swap}
@font-face{font-family:'Archivo';src:url(fonts/archivo/Archivo-Regular.eot);src:local('Archivo Regular'),local(Archivo-Regular),url(fonts/archivo/Archivo-Regular.eot?#iefix) format("embedded-opentype"),url(fonts/archivo/Archivo-Regular.woff2) format("woff2"),url(fonts/archivo/Archivo-Regular.woff) format("woff"),url(fonts/archivo/Archivo-Regular.ttf) format("truetype"),url(fonts/archivo/Archivo-Regular.svg#Archivo-Regular) format("svg");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Archivo';src:url(fonts/archivo/Archivo-Light.eot);src:local('Archivo Light'),local(Archivo-Light),url(fonts/archivo/Archivo-Light.eot?#iefix) format("embedded-opentype"),url(fonts/archivo/Archivo-Light.woff2) format("woff2"),url(fonts/archivo/Archivo-Light.woff) format("woff"),url(fonts/archivo/Archivo-Light.ttf) format("truetype"),url(fonts/archivo/Archivo-Light.svg#Archivo-Light) format("svg");font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:'Archivo';src:url(fonts/archivo/Archivo-ExtraLight.eot);src:local('Archivo ExtraLight'),local(Archivo-ExtraLight),url(fonts/archivo/Archivo-ExtraLight.eot?#iefix) format("embedded-opentype"),url(fonts/archivo/Archivo-ExtraLight.woff2) format("woff2"),url(fonts/archivo/Archivo-ExtraLight.woff) format("woff"),url(fonts/archivo/Archivo-ExtraLight.ttf) format("truetype"),url(fonts/archivo/Archivo-ExtraLight.svg#Archivo-ExtraLight) format("svg");font-weight:200;font-style:normal;font-display:swap}
@font-face{font-family:'Archivo';src:url(fonts/archivo/Archivo-Italic.eot);src:local('Archivo Italic'),local(Archivo-Italic),url(fonts/archivo/Archivo-Italic.eot?#iefix) format("embedded-opentype"),url(fonts/archivo/Archivo-Italic.woff2) format("woff2"),url(fonts/archivo/Archivo-Italic.woff) format("woff"),url(fonts/archivo/Archivo-Italic.ttf) format("truetype"),url(fonts/archivo/Archivo-Italic.svg#Archivo-Italic) format("svg");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:'Archivo';src:url(fonts/archivo/Archivo-LightItalic.eot);src:local('Archivo Light Italic'),local(Archivo-LightItalic),url(fonts/archivo/Archivo-LightItalic.eot?#iefix) format("embedded-opentype"),url(fonts/archivo/Archivo-LightItalic.woff2) format("woff2"),url(fonts/archivo/Archivo-LightItalic.woff) format("woff"),url(fonts/archivo/Archivo-LightItalic.ttf) format("truetype"),url(fonts/archivo/Archivo-LightItalic.svg#Archivo-LightItalic) format("svg");font-weight:300;font-style:italic;font-display:swap}