/* ===============================================================
TABLE OF CONTENTS

01. RESET CSS
02. CSS BASIC
03. HEADER & FOOTER
04. ABOUT / INDEX
05. WORK
06. CONTACT
...
10. PLUGINS & OTHERS


=================================================================*/
/* ===============================================================
01. RESET CSS
=================================================================*/
/* http://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126 License: none (public domain) */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; }

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }

body { line-height: 1; }

ol, ul { list-style: none; }

blockquote, q { quotes: none; }

blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }

table { border-collapse: collapse; border-spacing: 0; }

/* http://meyerweb.com/eric/tools/css/reset/  v2.0 | 20110126 License: none (public domain) */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; }

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }

body { line-height: 1; }

ol, ul { list-style: none; }

blockquote, q { quotes: none; }

blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }

table { border-collapse: collapse; border-spacing: 0; }

/* My additions */
a { text-decoration: none; }

/* End of Reset */
/* ===============================================================
02. SITEWIDE BASIC
=================================================================*/
body { font-family: 'Inter', Sans-serif; font-size: calc(7px + 1.65vmin); line-height: 1.25; color: white; background-color: black; margin-bottom: 25vmin; }

*, *:before, *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

.style--hidden { display: none; }

/* For anchor links to land while taking into consideration the fixed header */
/*[id*='anchor'] { display: block; height: 10vmin; margin-top: -10vmin; visibility: hidden; } */
/* 404 Error Page */
.Error404Page { width: 80vmin; margin: 10vmin auto; text-align: center; }

.Error404Page__h1 { font-weight: 800; font-size: 2.35; }

/* End of 404 Error Page */
/* ===============================================================
03. HEADER & FOOTER
=================================================================*/
/* header */
.siteWideHeader { border-bottom: 0.1vmin solid gray; }

.siteWideHeader__logoLink { height: 30vh; display: flex; align-items: center; border-bottom: 0.1vmin solid gray; }

.siteWideHeader__logoLink__img { max-width: 100%; max-height: 100%; display: block; margin: auto; }

.siteWideHeader__nav { display: grid; grid-template-columns: 33.33% 33.33% 33.33%; width: max-content; margin: auto; text-align: center; }

.siteWideHeader__nav__href { padding: 0 5vmin; min-width: max-content; line-height: 9.5vmin; font-size: 0.8em; color: gray; border-right: 0.1vmin solid gray; border-left: 0.1vmin solid gray; }

.siteWideHeader__nav__href:hover, .siteWideHeader__nav__href:active, .siteWideHeader__nav__href--currentPage { background-color: white; color: #808080; background: -webkit-linear-gradient(white, #ddd); background: -o-linear-gradient(white, #ddd); background: -moz-linear-gradient(white, #ddd); background: linear-gradient(white, #ddd); /*	border-left: 1px solid white; border-right: 1px solid white;*/ }

/* end of header */
/* Footer */
.siteWideFooter { display: block; padding: 2vmin; position: fixed; width: 100%; bottom: 0; text-align: center; font-size: calc(6px + 1.5vmin); background: #222; border-top: 0.1vmin solid gray; }

/* end of footer */
/* ===============================================================
04. ABOUT / INDEX
=================================================================*/
.aboutIndexPage__topSlideshow { width: 90vw; display: block; height: 34vw; overflow: hidden; margin: 0 auto 5vmin; }

.aboutIndexPage__topSlideshow__pic { display: block; position: absolute; width: 90vw; overflow: hidden; }

.aboutIndexPage__topSlideshow__pic__img { display: block; width: 100%; height: 34vw; object-fit: cover; position: relative; top: 0; left: 0; }

.aboutIndexPage__text { width: 90vmin; margin: 6vmin auto; }

.aboutIndexPage__text h1 { font-weight: 800; font-size: 1.85em; }

.aboutIndexPage__text p { margin: 2vmin 0; }

.aboutIndexPage__text strong { font-weight: 800; }

/* ===============================================================
05. WORK
=================================================================*/
.workPage { width: 80vw; margin: auto; }

.workPage__header__h1 { margin: 7vmin 0; font-weight: 800; font-size: 1.85em; }

.workPage__categories { display: grid; grid-template-columns: 32% 32% 32%; grid-column-gap: 2%; }

@media screen and (max-width: 1000px) { .workPage__categories { display: grid; grid-template-columns: 49% 49%; grid-row-gap: 2vmin; } }

@media screen and (max-width: 500px) { .workPage__categories { display: grid; grid-template-columns: 100%; grid-row-gap: 2vmin; } }

.workPage__categories__href { width: 100%; display: block; border-radius: 1vmin; border: 0.1vmin solid #808080; overflow: hidden; }

.workPage__categories__href__h { padding: 2vmin; font-size: 1.25em; color: white; }

.workPage__categories__href__img { display: block; height: 13vw; width: 100%; object-fit: cover; background: #333333; }

@media screen and (max-width: 1000px) { .workPage__categories__href__img { height: 20vw; } }

@media screen and (max-width: 500px) { .workPage__categories__href__img { height: 40vmin; } }

/* workCategoryPage */
.workCategoryIndex { width: 70vw; margin: auto; }

.workCategoryIndex__h1 { margin: 7vmin 0; font-weight: 800; font-size: 1.85em; }

.workCategoryIndex__items { display: grid; grid-template-columns: 31% 31% 31%; grid-column-gap: 3.5%; grid-row-gap: 4vmin; }

.workCategoryIndex__items__href { width: 100%; display: block; text-transform: uppercase; border-radius: 1vmin; border: 0.1vmin solid #808080; overflow: hidden; }

.workCategoryIndex__items__href__h { padding: 2vmin; display: block; height: 7vmin; font-size: 3vmin; color: white; white-space: nowrap; }

.workCategoryIndex__items__href__pic__img { width: 100%; height: 11vw; display: block; object-fit: cover; }

.workCategoryIndex__items__href__info { min-height: 16vw; }

.workCategoryIndex__items__href__info__ul { padding: 1.5vmin; }

.workCategoryIndex__items__href__info__ul__li { margin: 1.5vmin 0; font-size: 0.5em; font-weight: 600; letter-spacing: 0.1vmin; }

.workCategoryIndex__items__href__info__ul__li__key { display: block; margin-bottom: 0.15vmin; color: #808080; }

.workCategoryIndex__items__href__info__ul__li__value { display: block; color: white; }

.workCategoryIndex__items__href__footer { padding: 1vmin; font-size: 0.75em; text-align: right; color: #808080; border-top: 0.1vmin solid #808080; }

.workCategoryIndex__items__href:hover, .workCategoryIndex__items__href:active { border: 0.1vmin solid white; }

.workCategoryIndex__items__href:hover .workCategoryIndex__items__href__footer, .workCategoryIndex__items__href:active .workCategoryIndex__items__href__footer { border-top: 0.1vmin solid white; color: white; }

/* media queries for workCategoryPage */
@media screen and (max-width: 1000px) { .workCategoryIndex { width: 80vw; } .workCategoryIndex__items { display: grid; grid-template-columns: 48% 48%; grid-column-gap: 4%; } .workCategoryIndex__items__href__pic__img { height: 20vw; } .workCategoryIndex__items__href__info { min-height: 25vw; } }

@media screen and (max-width: 500px) { .workCategoryIndex__items { display: grid; grid-template-columns: 100%; } .workCategoryIndex__items__href__pic__img { height: 40vw; } .workCategoryIndex__items__href__info { min-height: 50vw; } }

/* Work Single Page */
.workSinglePage { width: 60vw; margin: auto; }

.workSinglePage__header__h1 { padding: 4vmin; text-align: center; text-transform: uppercase; }

.workSinglePage__header__pic { width: 100%; display: block; margin-bottom: 3vmin; }

.workSinglePage__header__pic__img { height: 30vw; width: 100%; object-fit: cover; overflow: hidden; border-radius: 1vmin; }

.workSinglePage__info { text-transform: uppercase; }

.workSinglePage__info__ul { padding: 1.5vmin; }

.workSinglePage__info__ul__li { margin: 1.5vmin 0; font-size: 0.85em; font-weight: 600; letter-spacing: 0.1vmin; }

.workSinglePage__info__ul__li__key { display: block; margin-bottom: 0.15vmin; color: #808080; }

.workSinglePage__info__ul__li__value { display: block; color: white; }

.workSinglePage__gallery { margin: 5vmin 0 15vmin; padding-top: 5vmin; display: grid; grid-template-columns: 15% 15% 15% 15% 15% 15%; grid-column-gap: 2%; grid-row-gap: 1vmin; border-top: 0.1vmin solid #808080; }

.workSinglePage__gallery__href { display: block; width: 100%; height: max-content; overflow: hidden; }

.workSinglePage__gallery__href__img { width: 100%; height: 10vmin; object-fit: cover; filter: grayscale(100%); }

.workSinglePage__gallery__href:hover .workSinglePage__gallery__href__img, .workSinglePage__gallery__href:active .workSinglePage__gallery__href__img { filter: grayscale(0%); }

/* media queries for Work Single Page */
@media screen and (max-width: 1000px) { .workSinglePage { width: 80vw; margin: auto; } .workSinglePage__header__pic__img { height: 40vw; width: 100%; } }

@media screen and (max-width: 840px) { .workSinglePage__gallery { grid-template-columns: 24% 24% 24% 24%; grid-column-gap: 2.66%; } }

/* ===============================================================
06. CONTACT
=================================================================*/
.contactPage { width: 80vw; margin: auto; }

.contactPage__header__h1 { margin: 7vmin 0; font-weight: 800; font-size: 1.85em; }

.contactPage__contactDetails__h { font-weight: 800; font-size: 1.35em; }

.contactPage__contactDetails__ul { padding: 1.5vmin 0; }

.contactPage__contactDetails__ul__li { margin: 3vmin 0; font-size: 1em; font-weight: 800; letter-spacing: 0.1vmin; }

.contactPage__contactDetails__ul__li__key { display: block; margin-bottom: 0.15vmin; font-size: 0.85em; font-weight: 600; color: #808080; }

.contactPage__contactDetails__ul__li__value { display: block; font-size: 0.85em; font-weight: 600; color: white; }

/* ===============================================================
10. PLUGINS & OTHERS
=================================================================*/

/*# sourceMappingURL=style.css.map */