
html, body { height: 100%; }
.c-container { min-height: 100%; max-width: 960px; margin: 0 auto; }

body { overflow: auto; }
html, body { scrollbar-width: none; -ms-overflow-style: none; }
html::-webkit-scrollbar, body::-webkit-scrollbar { display: none; }

/* prevent browser gestures (issue: pinch zoom on ios safari) */
* { touch-action: pan-y; }
body > :not(.c-container), body > :not(.c-container) * { touch-action: none; }

html, body { font-size: 16px; line-height: 1.2; color: rgba(0, 0, 0, 0.87); }

h1, h2, h3,/* h4,*/ h5, h6 { text-transform: uppercase; }
h1 { font-size: 1.16rem; font-size: calc(19px + (28 - 19) * ((100vw - 300px) / (1600 - 300))); min-height: 0vw; }
h2 { font-size: 4.74rem; font-size: calc(60px + (102 - 60) * ((100vw - 300px) / (1600 - 300))); min-height: 0vw; }
h3 { font-size: 1.16rem; font-size: calc(19px + (28 - 19) * ((100vw - 300px) / (1600 - 300))); min-height: 0vw; }
h4 { font-size: 1rem; /*font-size: 1.16rem; font-size: calc(13px + (22 - 13) * ((100vw - 300px) / (1600 - 300)));*/ }
h5 { font-size: 0.625rem; /*font-size: 0.70rem; font-size: calc(10px + (17 - 10) * ((100vw - 300px) / (1600 - 300)));*/ letter-spacing: 0.025rem; }
h6 { font-size: 1em; padding: 1rem 0; }
p { padding-bottom: 1rem; text-align-last: center; }
img { max-width: 100%; vertical-align: middle; }
a { color: rgba(0, 0, 0, 0.87); text-decoration: none; border-bottom: 1px solid transparent; }
a.t-external { color: #0000ff; }
a:hover { text-decoration: none; border-bottom: 1px solid; }

h1, h2, h3, h4 { display: inline-block; border-bottom: 2px solid white; }
h4 { display: inline-block; border-bottom: 1px solid white; }
.c-header.js-hover h1, .c-header-fake.js-hover h1, .c-title.js-hover h2, .c-title-fake.js-hover h2, .c-title.js-hover h3, .c-title-fake.js-hover h3, .c-title.js-hover h4, .c-title-fake.js-hover h4 { border-bottom: 2px solid rgba(0, 0, 0, 0.87); }
.c-title.js-hover h4, .c-title-fake.js-hover h4 { border-bottom: 1px solid rgba(0, 0, 0, 0.87); }
.c-header.js-active h1, .c-title.js-active h2, .c-title.js-active h3, .c-title.js-active h4 { border-bottom: 2px solid rgba(0, 0, 0, 0.87); }
.c-title.js-active h4 { border-bottom: 1px solid rgba(0, 0, 0, 0.87); }
.c-header, .c-header-fake, .c-title, .c-title-fake { cursor: pointer; }

.c-header { z-index: 1; }
.c-level-category { z-index: 32; }
.c-title-category { z-index: 31; }
.c-accordion-category { z-index: 30; }
.c-level-entry { z-index: 22; }
.c-title-entry { z-index: 21; }
.c-accordion-entry { z-index: 20; }
.c-level-listing { z-index: 12; }
.c-title-listing { z-index: 11; }
.c-accordion-listing { z-index: 10; }

.c-header, .c-header-fake { background-color: transparent; }
.c-menu, .c-title, .c-title-fake, .c-accordion { background-color: white; }

.c-accordion { display: none; }

/*
.c-header { position: fixed; top: 2vw; width: 100%; max-width: 960px; padding-bottom: 0.33rem; }
@media screen and (max-width: 768px) {
	.c-header { top: 4vw; }
}
*/
/*.c-header { position: fixed; bottom: 0; padding-bottom: 0.33rem; }*/
/*.c-header { padding-top: 0.66rem; padding-bottom: 0rem; }*/
.c-header, .c-header-fake { padding-top: 2vw; padding-bottom: 0.33rem; }
/*.c-menu { padding-top: 8rem; padding-bottom: 8rem; padding-left: 1rem; padding-right: 1rem; }*/
.c-menu { padding-top: calc(8rem - 2vw - 0.33rem - (19px + (28 - 19) * ((100vw - 300px) / (1600 - 300)))); padding-bottom: 8rem; padding-left: 1rem; padding-right: 1rem; }
.c-accordion-category { padding-top: 0rem; padding-bottom: 0rem; }
/*.c-accordion-category::after { padding-top: 4rem; content:""; display: block; width: 74%; margin: 0 auto; border-bottom: 2px solid black; }*/
.c-accordion-category::after { padding-top: 4rem; content:""; display: block; width: calc(300px + (500 - 300) * ((100vw - 300px) / (1600 - 300))); margin: 0 auto; border-bottom: 2px solid black; }
.c-accordion-entry { padding-top: 0rem; padding-bottom: 0rem; }
.c-accordion-entry::after { padding-top: 2rem; content:""; display: block; width: 66%; margin: 0 auto; border-bottom: 2px solid white; }
.c-accordion-listing { padding-top: 0rem; padding-bottom: 0rem; }
.c-accordion-listing::after { padding-top: 0rem; content:""; display: block; width: 50%; margin: 0 auto; border-bottom: 2px solid white; }
@media screen and (max-width: 768px) {
	.c-header, .c-header-fake { padding-top: 4vw; }
	.c-menu { top: calc(8rem - 4vw - 0.33rem - 1.2 * (19px + (28 - 19) * ((100vw - 300px) / (1600 - 300)))); }
}

.c-header, .c-header-fake {/* text-transform: uppercase;*/ text-align: center; line-height: 1.2; } 
.c-title, .c-title-fake {/* text-transform: uppercase;*/ text-align: center; line-height: 1.2; box-sizing: border-box; }
.c-title-listing { line-height: 1.3; }

.c-content-wrap { overflow: auto; }
.c-content-wrap { scrollbar-width: none; -ms-overflow-style: none; }
.c-content-wrap::-webkit-scrollbar { display: none; }

.c-content { box-sizing: border-box; width: 100%; max-width: 700px; margin: 0 auto; padding: 1rem; overflow-x: hidden; }

.c-content .c-content-caption { font-size:0.9rem; }
.c-content .c-content-caption img { margin:2rem 0 0 0; width: auto; max-width: 550px; height: auto; max-height: 75vh; max-height: calc(var(--vh, 1vh) * 75);}
.c-content .c-content-caption:first-child img { margin:0 0 0 0; }
@media screen and (max-width: 768px) {
	.c-content .c-content-caption img { max-width:100%; }
}



.c-splash { z-index: 1000; position: fixed; top: 0; width: 100vw; height: 100vh; height: calc(var(--vh, 1vh) * 100); background-color: white; cursor: pointer; }
.c-splash div { position: absolute; top: 0; /* width: 100%; height: 100%; (issue: dom ready delay on windows/linux chrome, solution: set in js) */ background-size: cover; background-position: center bottom; background-repeat: no-repeat; background-color: white; opacity: 1; transition: opacity 0.4s; }

.c-badge { cursor: pointer; box-sizing: border-box; width: 100%; max-width: 700px; margin: 2rem auto 0.5rem auto; text-align: center; background-color: white; }
.c-badge img { width: auto; max-width: 100%; height: auto; max-height: 50vh; max-height: calc(var(--vh, 1vh) * 50); }
.m-archive .c-badge img { max-height: 13vh; max-height: calc(var(--vh, 1vh) * 13); }
.c-ref .c-badge { margin-top: 0.5rem; }
.c-ref .c-badge img { max-height: 13vh; max-height: calc(var(--vh, 1vh) * 13); }

.c-thumb img { width: auto; max-width: 100%; height: auto; max-height: 20vh; max-height: calc(var(--vh, 1vh) * 20); }

.c-photo img { width: auto; max-width: 100%; height: auto; max-height: 30vh; max-height: calc(var(--vh, 1vh) * 30); }



.c-filter-container { box-sizing: border-box; width: 100%; margin: 0 auto; padding: 1rem 1rem 0 1rem; background: white; }
.c-filter-wrap { display: inline-block; width: 25%; margin-bottom: 1rem; vertical-align: top; }
.c-filter { width: 90%; margin: auto; user-select: none; }
@media screen and (max-width: 1024px) {
	.c-filter-wrap { width: 50%; }
}
@media screen and (max-width: 768px) {
	.c-filter-wrap { width: 100%; }
}

.c-filter-range { padding-top: 0.5rem; }
.c-filter-search { padding-top: 0.5rem; }

.o-range { border: 0; border-radius: 0; box-shadow: none; background: transparent; display: flex; }
.o-range .noUi-connects { height: 2px; background: #eee; border-radius: 0; }
.o-range .noUi-connect { height: 2px; background: rgba(0, 0, 0, 0.87); }
.o-range .noUi-handle { box-shadow: none; border: 0.5rem solid transparent; border-bottom-color: rgba(0, 0, 0, 0.87); border-radius: 0; background: transparent; width: 1rem; height: 1rem; top: -0.125rem; right: -0.5rem; outline: 0; }
.o-range .noUi-handle:after, .o-range .noUi-handle:before { width: 0; height: 0; }
.o-range .noUi-touch-area { margin-top: -1rem; margin-left: -1rem; width: 2rem; height: 2rem; cursor: pointer; }
.o-range .noUi-base { order: 1; margin-top: 0.5rem; cursor: pointer; }
.o-range-lower { order: 0; margin-right: 0.5rem; }
.o-range-upper { order: 2; margin-left: 0.5rem; }

.o-select .selectize-input { font-size: 1rem; border: 0; box-shadow: none; color: rgba(0, 0, 0, 0.87); cursor: pointer !important; }
.o-select .selectize-input input { display: none !important; }
.o-select .selectize-dropdown { z-index: 22; font-size: 1rem; border: 0; box-shadow: 0px 0px 10px 5px rgba(0, 0, 0, 0.25); border-radius: 0; }
.o-select .selectize-dropdown .active { background-color: #eee; color: rgba(0, 0, 0, 0.87); }
.o-select .selectize-dropdown-content { max-height: 70vh; max-height: calc(var(--vh, 1vh) * 70); }
@media screen and (max-width: 768px) {
	.o-select .selectize-dropdown-content { max-height: 30vh; max-height: calc(var(--vh, 1vh) * 30); }
}
.o-select .selectize-control.single .selectize-input:after { border-width: 0.5rem 0.5rem 0 0.5rem; border-color: rgba(0, 0, 0, 0.87) transparent transparent transparent; }
.o-select .selectize-control.single .selectize-input.dropdown-active::after { border-width: 0 0.5rem 0.5rem 0.5rem; border-color: transparent transparent rgba(0, 0, 0, 0.87) transparent; }

.o-search input { font-size: 1rem; border: 1px solid black; outline: 0; }


.c-slider-full { display: none; z-index: 999; position: fixed; top: 0; width: 100%; height: 100%; background-color: white; }
.c-slider-close { z-index: 101; position: absolute; right: 0; font-size: 4rem; line-height: 1; cursor: pointer; }

.c-slider-embed .o-slider-slide img { width: auto; max-width: 100%; height: auto; max-height: 66vh; max-height: calc(var(--vh, 1vh) * 66); margin: 0 auto; }
.c-slider-embed .o-slider-slide { cursor: pointer; cursor: url('/img/icon-fullscreen.png'),pointer; cursor: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" ><path fill="currentColor" d="M5,5H10V7H7V10H5V5M14,5H19V10H17V7H14V5M17,14H19V19H14V17H17V14M10,17V19H5V14H7V17H10Z" /></svg>'),pointer; }
.c-slider-full .o-slider-slide div { width: 100vw; height: 100vh; height: calc(var(--vh, 1vh) * 100); background-size: contain; background-position: center; background-repeat: no-repeat; }
.c-slider-full .o-slider-slide { cursor: auto; }

/* prevent visible next/previous slide (issue: vertical line on ios/macos safari) */
.c-slider-embed .o-slider-slide { padding: 0 1px; }

.o-slider-caption { position: relative; margin: 1rem 0 1rem 0; text-align: right; font-size: 0.9rem; }
.o-slider-page { display: inline-block; width: 6rem; text-align: right; }
.o-slider-btn { position: absolute; right: 3rem; cursor: pointer; font-size: 1.5rem; margin-top: -0.4rem; }

.o-slider .slick-prev, .o-slider .slick-next { z-index: 100; height: 100%; width: 40%; }
.o-slider .slick-prev { margin-left: -20%; left: 0; text-align: left; cursor: w-resize; cursor: url('/img/icon-prev.png'),w-resize; cursor: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" ><path fill="currentColor" d="M20,10V14H11L14.5,17.5L12.08,19.92L4.16,12L12.08,4.08L14.5,6.5L11,10H20Z" /></svg>'),w-resize; }
.o-slider .slick-next { margin-right: -20%; right: 0; text-align: right; cursor: e-resize; cursor: url('/img/icon-next.png'),e-resize; cursor: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" ><path fill="currentColor" d="M4,10V14H13L9.5,17.5L11.92,19.92L19.84,12L11.92,4.08L9.5,6.5L13,10H4Z" /></svg>'),e-resize; }
.o-slider .slick-prev:before { color: black; content: ""; }
.o-slider .slick-next:before { color: black; content: ""; }
.o-slider .slick-track { display: flex; align-items: center; }
.o-slider .slick-slide { outline: 0; }

.c-slider-full .o-slider .slick-prev, .c-slider-full .o-slider .slick-next { width: 100%; }
.c-slider-full .o-slider .slick-prev { margin-left: -50%; }
.c-slider-full .o-slider .slick-next { margin-right: -50%; }

.c-group { padding-bottom: 1rem; }
.c-group-title { padding-top: 0.5rem; padding-bottom: 0.2rem; }
.c-group-item { padding-bottom: 1rem; }
.c-group-item:last-child { padding-bottom: 0; }

.m-awards .c-group-item, .m-clients .c-group-item, .m-collaborations .c-group-item { padding-bottom: 0.2rem; }



.c-tracking { z-index: 998; position: fixed; left:0; bottom: 0; width: 100%; font-size: 1rem; line-height: 2; text-align: center; background-color: rgba(0, 0, 0, 0.87); color: white; padding: 0 1rem; box-sizing: border-box; }
.c-tracking p { padding: 0; }
.c-tracking a { color: white; }



.c-cms { z-index: 998; position: fixed; top: 2vw; right: 2rem; font-size: 1.16rem; font-size: calc(19px + (28 - 19) * ((100vw - 300px) / (1600 - 300))); min-height: 0vw; }
.c-cms a { color: rgba(0, 0, 0, 0.87); }
.c-cms a:hover { border-bottom-color: transparent; }



@media print {
	.u-sticky { position: relative; top: auto !important; }
	.c-tracking { display: none; }
	.c-header:not(.js-print) { display: none; }
	.c-header:not(.js-print) ~ .c-menu { padding-top: 0; }
	.c-menu:not(.js-print) { display: none; }
	.c-level:not(.js-print) { display: none; }
	.c-badge:not(.js-print) { display: none; }
	.c-content-wrap { height: auto !important; }
	.c-filter-wrap { width: 50%; }
	img.obs-load { display: none; }
}



.c-env {
	z-index: 9999;
	position: fixed;
	bottom: 2rem;
	right: 2rem;
	width: 8rem;
	height: 8rem;
	background: #2eaad4;
	border-radius: 4rem;
	text-align: center;
	line-height: 8rem;
	font-size: 2rem;
	color: white;
	opacity: 0.25;
	transform: rotate(15deg);
}



.c-loading {
	z-index: 9999;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	padding: 1rem;
    box-sizing: border-box;
	background: white;
}

.c-loading-bar {
	width: 80%;
	max-width: 480px;
	height: 2px;
	margin: 0 auto;
	position: relative;
	top: 50%;
	transform: translateY(-50%);
	background: black;
	animation: 6s ease-in-out 0s loading-bar-animation;
}
@keyframes loading-bar-animation {
	from {
		width: 0%;
		max-width: 0px;
	}
	to {
		width: 80%;
		max-width: 480px;
	}
}
