/* 

Theme Name: The Image Society
Version: 1.0
Author: Pascal de Man
Author URI: http://www.pascaldeman.com

*/

* {
	padding: 0;
	margin: 0;
	border: 0;
	outline: 0;

    -webkit-backface-visibility: hidden;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

html, body { 
	position: fixed; 
	width: 100%; 
	height: 100%; 
	overflow: hidden;
}

body {
	font-family: 'Roboto Condensed', "Helvetica Condensed", "Arial Narrow", 'Arial Nova Condensed Bold', 'TeXGyreHerosCnBold', 'AvenirNextCondensed-Regular', 'Abadi MT Condensed Bold', sans-serif; 
	font-stretch: condensed;
	font-weight: 700;
	font-size: 32px;
	line-height: 1.35em;
	color: #000;

	text-rendering: optimizeLegibiity;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	-webkit-text-size-adjust: none;

	background: #fff;

	overflow: hidden;
	overflow-y: auto;

	-webkit-overflow-scrolling: touch;
}
body.projects,
body.visual-impression { text-align: center }

p, h1, h2, h3, h4, h5, h6, ul, ol { margin-bottom: 1em }
h6 { line-height: 1.5em; margin-bottom: 1.5em }

div, a {
	position: relative;

	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
			box-sizing: border-box;
}
a {
	text-decoration-skip: skip;
	text-decoration-skip: ink;
}
img { max-width: 100%; height :auto }

.wp-caption {
	width: 100% !important;
	font-size: 0.8em;
	font-weight: 100;
	line-height: 1.2em;
	text-align: left;
}
.wp-caption-text { margin-top: 0.5em }

.video-container { width: 100%; height: 0; margin-bottom: 1em }
.video-container > iframe { 
	position: absolute;
	top: 0; left: 0;
	width: 100%;
	height: 100%;
}

#wrapper { 
	width: 1440px;
	max-width: 100%;
	height: 100%;
	margin: 0 auto;
	color: #fff;
	overflow-x: hidden;
}
#wrapper, #header,
#content, #content h1, #content h2, #content h6, #content p, #content img, 
#content .lazy, #content .lazy *, 
#content .content, #content .content *, #content .product
#content .items, #content .items *, #content .items + div, #content .items + div * {
	transform: translate3d(0,0,0);
}

#menu { 
	width: 100%; 
	height: 100%;
	max-height: calc(1440 * 1440px / 936);
}

#menu > * {
	position: absolute;

	-webkit-touch-callout: none;
	-webkit-user-select: none;
	 -khtml-user-select: none;
	   -moz-user-select: none;
	    -ms-user-select: none;
			user-select: none;
}

#menu > div.title { 
	top: 0; right: 0;
	
	width: 85%;
	height: calc(21600% / 936); 

	background: #D0181F;
}
#menu > div.title:before, 
#menu > div.title:after {
	position: absolute;
	
	content: '';

	display: inline-block;
}

#menu > div.title:before { 
	top: 0; left: 0; 
	
	width: 45%;
	height: 100%;

	background: #00AEEF url(images/home-image.svg) 100% 50% / contain no-repeat;
}
#menu > div.title:after { 
	top: 0; right: 0; 
	
	width: 55%;
	height: 100%;

	background: #D0181F url(images/home-society.svg) 0 50% / contain no-repeat;
}

#menu > div.logo { 
	top: 0; left: 0;
	
	width: 15%;
	height: calc(21600% / 936); 

	background: #fff url(images/home-hamburger.svg) center / auto 100% no-repeat;
}

#menu > a[href="/projects"] { 
	top: calc(21600% / 936); left: 0; 

	width: 70%;
	height: calc(100% - (43200% / 936));

	background: #FFF200 url(images/home-projects.svg) center / contain no-repeat;
}

#menu > a[href="/mission-statement"], 
#menu > a[href="/agenda"],
#menu > a[href="/shop"],
#menu > a[href="/about"], 
#menu > a[href="/contact"] { 
	height: calc(12600% / 936); 
}
#menu > a[href="/mission-statement"] { 
	top: calc(21600% / 936); right: 0; 
	width: 30%;
	
	background: #D0B0AE url(images/home-mission-statement.svg) center / contain no-repeat;
}
#menu > a[href="/shop"] { 
	top: calc(34200% / 936); right: 0; 
	width: 30%;
	
	background: #FDB201 url(images/home-shop.svg) center / contain no-repeat;
}
#menu > a[href="/about"] {
	top: calc(46800% / 936); right: 0; 
	width: 30%;

	background: #857D31 url(images/home-about.svg) center / contain no-repeat;
}
#menu > a[href="/contact"] {
	top: calc(59400% / 936); right: 0; 
	width: 30%;

	background: #6E9A8F url(images/home-contact.svg) center / contain no-repeat;
}

#menu > a[href="/visual-impression"] {
	bottom: 0; left: 0; 

	width: 100%;
	height: calc(21600% / 936); 
	
	background: #000 url(images/home-visual-impression.svg) center / contain no-repeat;
}

#header { 
	position: absolute;
	top: 0; left: 0;
	width: 100%;
	height: 216px;
	background: #fff;
	z-index: +1;
}


#header .banner {
	position: absolute;
	right: 0; top: 0;
	width: 100%;
	height: 375px;
	margin: 0;
}

		
div.logo { 
	position: absolute;
	left: 0; top: 0;
	width: 15%;	
	min-width: 15%;
	height: 100%;
	transition: min-width .3s;
}
div.logo:hover,
div.logo.selected { min-width: 166px }

body.home div.logo:hover,
body.home div.logo.selected { min-width: auto }

div.logo > div.menu { 	
	position: absolute;
	top: calc(48% - (266 * 36.5% / 438));
	left: 50%; width: 73%;
	
	padding: calc(214 * 73% / 438) 0 
			 calc(58 * 73% / 438);
			 			 
	-webkit-transform: translate(-50%,0);			 
		-ms-transform: translate(-50%,0);
			transform: translate(-50%,0);
			
	transition: top .15s, width .15s, padding .15s, transition .15s;
/*		-webkit-transform .15s, -ms-transform .15s, transform .15s; */
	
	z-index: +1;
}

div.logo > div.menu:before,
div.logo > div.menu:after,
div.logo > div.menu > a {
	background-size: 100% auto;
	background-position: center;
	background-repeat: no-repeat;
	display: block;
}
div.logo > div.menu:before,
div.logo > div.menu:after {
	position: absolute;
	left: 0; width: 100%;
	content: '';
}	
div.logo > div.menu:before { 
	top: 0;
	padding-bottom: calc(21100% / 438);
	background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 438.6 211'%3E%3Cpath d='M437.8,100.5C443.4,44.1,341.9,0.3,219,0S-4.7,43.5,0.2,100.5'/%3E%3Cpath d='M16.7,123.2v86.9H1.9v-86.9H16.7z'/%3E%3Cpath d='M40.4,123.2l5.5,41.6h0.7l5.5-41.6h17.3v86.9H56.1l0.5-51.4h-0.9L50,210.1h-7.8l-5.7-51.4h-0.9l0.5,51.4H23v-86.9H40.4z'/%3E%3Cpath d='M102,123.2l8.8,86.9H96.4l-1.1-18.5h-6.2L88,210.1H73.7l8.6-86.9C82.3,123.2,102,123.2,102,123.2z M89.6,180h5l-2.2-39.6 H92L89.6,180z'/%3E%3Cpath d='M132.5,122.7c15.1,0,17.1,2.9,17.1,17.4v12.8h-14.9v-15c0-2.5-0.3-3.7-2.5-3.7s-2.5,1.4-2.5,3.7v57.5 c0,2.5,0.5,3.6,2.6,3.6c2,0,2.4-1.3,2.4-3.6v-18.9h-2.2v-11.4h17.1v45h-6.2l-2.5-5c-3.3,4.4-6.7,5.7-12.7,5.7 c-10.2,0-13.2-4.9-13.2-15v-55.6C115.1,125.5,116.9,122.7,132.5,122.7z'/%3E%3Cpath d='M179.3,123.2v11.3h-8.9v22.1h8.9V168h-8.9v30.5h8.9v11.4h-23.8v-86.7H179.3z'/%3E%3Cpath d='M238.1,153.1h-14.8v-15.3c0-2.6-0.6-3.6-2.5-3.6c-1.7,0-2.1,1.3-2.1,3.6v13.5c0,2.8,0.3,3.9,3.3,5.6l9.1,5.2 c5.9,3.3,7,7.5,7,13.2v18.1c0,14.9-1.7,17.3-17.2,17.3c-15,0-17.1-2.7-17.1-17.3v-19.2h15v21.2c0,2.5,0.6,3.7,2.5,3.7 c1.6,0,2.1-1.3,2.1-3.7V177c0-2.8-0.2-3.6-3.3-5.5l-9.5-5.6c-5.6-3.2-6.7-7.5-6.7-13.6v-12.4c0-14.8,2.2-17.3,17.2-17.3 c15.4,0,17.1,2.8,17.1,17.3v13.2H238.1z'/%3E%3Cpath d='M260.7,122.7c15.1,0,17.2,2.4,17.2,17.3v53.3c0,14.7-1.9,17.4-17,17.4c-15.2,0-17.3-2.5-17.3-17.4V140 C243.6,125.2,245.3,122.7,260.7,122.7z M258.3,195.4c0,2.6,0.6,3.6,2.5,3.6c1.8,0,2.2-1.2,2.2-3.6v-57.5c0-2.5-0.5-3.7-2.5-3.7 c-1.7,0-2.2,1.3-2.2,3.7V195.4z'/%3E%3Cpath d='M317.6,152.8h-14.9v-14.9c0-2.5-0.5-3.7-2.5-3.7c-1.7,0-2.2,1.3-2.2,3.7v57.5c0,2.6,0.6,3.6,2.5,3.6c1.8,0,2.2-1.2,2.2-3.6 v-22.1h14.9v20c0,14.7-1.9,17.4-17,17.4c-15.2,0-17.3-2.5-17.3-17.4V140c0-14.8,1.7-17.3,17.1-17.3c15.1,0,17.2,2.4,17.2,17.3 L317.6,152.8L317.6,152.8z'/%3E%3Cpath d='M337.7,123.2v86.9h-14.9v-86.9H337.7z'/%3E%3Cpath d='M367.8,123.2v11.3h-8.9v22.1h8.9V168h-8.9v30.5h8.9v11.4H344v-86.7H367.8z'/%3E%3Cpath d='M400.3,123.2v11.6H393v75.3h-14.9v-75.3h-7.3v-11.6H400.3z'/%3E%3Cpath d='M414.3,123.2l3.9,33.5l3.5-33.5h14l-9.8,51.8v35.1h-15.4V175l-10.6-51.8H414.3z'/%3E%3C/svg%3E");
}
div.logo > div.menu:after { 
	bottom: 0; 
	padding-bottom: calc(5800% / 438);
	background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 438 56'%3E%3Cpath d='M0,0H438a0,0,0,0,1,0,0V39.85A16.15,16.15,0,0,1,421.85,56H16.15A16.15,16.15,0,0,1,0,39.85V0A0,0,0,0,1,0,0Z'/%3E%3C/svg%3E");
	background-position: 50% 100%;
	background-size: 100% 100%; /* contain; */
}
div.logo:hover > div.menu,
div.logo.selected > div.menu,
.banner > div.logo:hover > div.menu,
.banner > div.logo.selected > div.menu { top: 14.4px }

div.logo > div.menu > a { margin: 3.6% 0; cursor: pointer }
div.logo > div.menu > a:nth-child(6) { transition: margin .1s, padding .1s, -webkit-transform .05s, -ms-transform .05s, transform .05s }
div.logo > div.menu > a:nth-child(5) { transition: margin .1s .05s, padding .1s .05s, -webkit-transform .05s, -ms-transform .05s, transform .05s }
div.logo > div.menu > a:nth-child(4) { transition: margin .1s .10s, padding .1s .10s, -webkit-transform .05s, -ms-transform .05s, transform .05s }
div.logo > div.menu > a:nth-child(3) { transition: margin .1s .15s, padding .1s .15s, -webkit-transform .05s, -ms-transform .05s, transform .05s }
div.logo > div.menu > a:nth-child(2) { transition: margin .1s .20s, padding .1s .20s, -webkit-transform .05s, -ms-transform .05s, transform .05s }
div.logo > div.menu > a:nth-child(1) { transition: margin .1s .25s, padding .1s .25s, -webkit-transform .05s, -ms-transform .05s, transform .05s }

div.logo > div.menu > a:hover { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1) }

div.logo > div.menu > a[href="/projects"] { background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 438 89.55'%3E%3Crect width='438' height='89.55' rx='16.15' ry='16.15'/%3E%3Cpath fill='%23fff' d='M132.37,30h10.7c7.25,0,8.8,5.35,8.8,9,0,5.35-2.59,9-9.49,9h-2.93V59.59h-6.9V30Zm7.07,12.77h1.9c2.76,0,3.45-1.73,3.45-3.8,0-2.24-.69-4-3.62-4h-1.73Z' /%3E%3Cpath fill='%23fff' d='M155.5,30h11.73c5.87,0,7.94,3.62,7.94,7.76,0,4.31-1.73,6.38-5,7.25h0c4.49.69,4.66,3.45,4.83,7.42.17,5.87.35,6.38,1.38,6.9v.17h-7.59c-.52-1-.69-2.59-.69-6,0-5.18-.69-6.21-2.93-6.21h-2.6V59.57h-6.9V30Zm6.9,12.42h2.07c2.76,0,3.62-2.07,3.62-3.8,0-2.24-.86-3.8-3.62-3.8H162.4Z' /%3E%3Cpath fill='%23fff' d='M189,60c-9.15,0-10.35-6-10.35-15.36S179.83,29.33,189,29.33c9.84,0,10.35,7.25,10.35,15.36C199.33,53,198.81,60,189,60Zm0-4.66c2.76,0,3.28-2.59,3.28-10.7S191.91,34,189,34c-2.76,0-3.11,2.59-3.11,10.7s.35,10.72,3.11,10.72Z' /%3E%3Cpath fill='%23fff' d='M212.44,30h6.9V50.74c0,5.52-2.24,9.49-9.15,9.49-6.21,0-8.8-2.93-8.8-8.11v-1.9h6.38v1.21c0,2.07,0,4.14,2.24,4.14,2.07,0,2.24-2.07,2.24-4.83V30Z' /%3E%3Cpath fill='%23fff' d='M223.65,30h17.08v5.69H230.56v5.87H240v5.69h-9.49V54h10.7v5.52h-17.6Z' /%3E%3Cpath fill='%23fff' d='M256.78,40.21c0-4.31-.52-6.21-2.76-6.21-2.76,0-3.11,2.59-3.11,10.35,0,8.8.35,11,3.11,11,2.59,0,2.93-2.93,2.93-7.59h6.73v1c0,6.38-1.73,11.22-10.35,11.22-9,0-9.66-6.73-9.66-15.53,0-7.59.35-15.18,10.35-15.18,6.21,0,9.49,2.59,9.49,9.66v1.21Z' /%3E%3Cpath fill='%23fff' d='M271,35.55h-6.21V29.86h19.33v5.69h-6.21v24H271Z' /%3E%3Cpath fill='%23fff' d='M292.33,50.56v1c0,2.24.69,4,3.11,4s3.11-1.9,3.11-3.45c0-6.38-12.77-2.76-12.77-13.8,0-4.66,2.59-8.63,9.66-8.63,6.9,0,9.49,3.45,9.49,8.11v.69H298.2a7.21,7.21,0,0,0-.52-3.11,2.09,2.09,0,0,0-2.07-1c-1.73,0-2.76,1-2.76,3.11,0,6.21,12.77,3.11,12.77,13.46,0,6.73-3.8,9.32-10.18,9.32-5,0-9.66-1.55-9.66-7.76V50.6Z' /%3E%3C/svg%3E") }

div.logo > div.menu > a[href="/visual-impression"] { background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 438 89.55'%3E%3Crect width='438' height='89.55' rx='16.15' ry='16.15'/%3E%3Cpath fill='%23fff' d='M46.36,30h7.42L57.23,52.8h0L60.85,30h7.42L61.54,59.53h-8.8Z' /%3E%3Cpath fill='%23fff' d='M70.86,30h6.9V59.53h-6.9Z' /%3E%3Cpath fill='%23fff' d='M88,50.55v1c0,2.24.69,4,3.11,4s3.11-1.9,3.11-3.45c0-6.38-12.77-2.76-12.77-13.8,0-4.66,2.59-8.63,9.66-8.63,6.9,0,9.49,3.45,9.49,8.11v.69H93.84a7.21,7.21,0,0,0-.52-3.11,2.09,2.09,0,0,0-2.07-1c-1.73,0-2.76,1-2.76,3.11,0,6.21,12.77,3.11,12.77,13.46,0,6.73-3.8,9.32-10.18,9.32-5,0-9.66-1.55-9.66-7.76V50.63Z' /%3E%3Cpath fill='%23fff' d='M123.49,49.69c0,5.87-1.73,10.35-9.66,10.35-8.11,0-9.66-4.49-9.66-10.35V30h6.9V51.76c0,2.24.86,3.62,2.76,3.62s2.76-1.38,2.76-3.62V30h6.9Z' /%3E%3Cpath fill='%23fff' d='M132.46,30h8.63l7.42,29.51h-7.25l-1-5.69h-7.07l-1,5.69h-7.32Zm4.14,5.35h0L134,48.48h5Z' /%3E%3Cpath fill='%23fff' d='M150.75,30h6.9V54h10v5.69H150.58V30Z' /%3E%3Cpath fill='%23fff' d='M180.78,30h6.9V59.53h-6.9Z' /%3E%3Cpath fill='%23fff' d='M192.34,30h10.18l3.62,19.5h0L209.59,30h10V59.53h-6.38V36.58h0l-4.49,23h-5.35l-4.83-23h0V59.53h-6.21Z' /%3E%3Cpath fill='%23fff' d='M224.43,30h10.7c7.25,0,8.8,5.35,8.8,9,0,5.35-2.59,9-9.49,9h-3.11V59.53h-6.9Zm6.9,12.77h1.9c2.76,0,3.45-1.73,3.45-3.8,0-2.24-.69-4-3.62-4h-1.73Z' /%3E%3Cpath fill='%23fff' d='M247.38,30h11.73c5.87,0,7.94,3.62,7.94,7.76,0,4.31-1.73,6.38-5,7.25h0c4.49.69,4.66,3.45,4.83,7.42.17,5.87.35,6.38,1.38,6.9v.35h-7.42c-.52-1-.69-2.59-.69-6,0-5.18-.69-6.21-2.93-6.21h-2.59V59.74h-6.9V30Zm6.9,12.42h2.07c2.76,0,3.62-2.07,3.62-3.8,0-2.24-.86-3.8-3.62-3.8h-2.07Z' /%3E%3Cpath fill='%23fff' d='M271.19,30h17.08v5.69H278.1v5.87h9.49v5.69H278.1V54h10.53v5.69H271V30Z' /%3E%3Cpath fill='%23fff' d='M297.59,50.55v1c0,2.24.69,4,3.11,4s3.11-1.9,3.11-3.45c0-6.38-12.77-2.76-12.77-13.8,0-4.66,2.59-8.63,9.66-8.63,6.9,0,9.49,3.45,9.49,8.11v.69h-6.73a7.21,7.21,0,0,0-.52-3.11,2.09,2.09,0,0,0-2.07-1c-1.73,0-2.76,1-2.76,3.11,0,6.21,12.77,3.11,12.77,13.46,0,6.73-3.8,9.32-10.18,9.32-5,0-9.66-1.55-9.66-7.76V50.63Z' /%3E%3Cpath fill='%23fff' d='M319.85,50.55v1c0,2.24.69,4,3.11,4s3.11-1.9,3.11-3.45c0-6.38-12.77-2.76-12.77-13.8,0-4.66,2.59-8.63,9.66-8.63,6.9,0,9.49,3.45,9.49,8.11v.69h-6.73a7.21,7.21,0,0,0-.52-3.11,2.09,2.09,0,0,0-2.07-1c-1.73,0-2.76,1-2.76,3.11,0,6.21,12.77,3.11,12.77,13.46,0,6.73-3.8,9.32-10.18,9.32-5,0-9.66-1.55-9.66-7.76V50.63Z' /%3E%3Cpath fill='%23fff' d='M336.42,30h6.9V59.53h-6.9Z' /%3E%3Cpath fill='%23fff' d='M357.64,60c-9.15,0-10.35-6-10.35-15.36s1.21-15.36,10.35-15.36c9.84,0,10.35,7.25,10.35,15.36C368,53,367.48,60,357.64,60Zm0-4.66c2.76,0,3.28-2.59,3.28-10.7S360.57,34,357.64,34c-2.76,0-3.11,2.59-3.11,10.7S354.88,55.38,357.64,55.38Z' /%3E%3Cpath fill='%23fff' d='M371.62,30h7.94l5.69,19.15h0V30h6.38V59.53h-7.94l-6-20.36h0V59.53h-6.21V30Z' /%3E%3C/svg%3E") }

div.logo > div.menu > a[href="/mission-statement"] { background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 438 89.55'%3E%3Crect width='438' height='89.55' rx='16.15' ry='16.15'/%3E%3Cpath fill='%23fff' d='M41.27,30H51.45l3.62,19.5h0L58.52,30h10V59.53H62.14V36.58h0l-4.49,23H52.3l-4.66-23h0V59.53H41.43V30Z' /%3E%3Cpath fill='%23fff' d='M73.36,30h6.9V59.53h-6.9Z' /%3E%3Cpath fill='%23fff' d='M90.62,50.55v1c0,2.24.69,4,3.11,4s3.11-1.9,3.11-3.45c0-6.38-12.77-2.76-12.77-13.8,0-4.66,2.59-8.63,9.66-8.63,6.9,0,9.49,3.45,9.49,8.11v.69H96.49A7.21,7.21,0,0,0,96,35.36a2.09,2.09,0,0,0-2.07-1c-1.73,0-2.76,1-2.76,3.11,0,6.21,12.77,3.11,12.77,13.46,0,6.73-3.8,9.32-10.18,9.32-5,0-9.66-1.55-9.66-7.76V50.63Z' /%3E%3Cpath fill='%23fff' d='M112.88,50.55v1c0,2.24.69,4,3.11,4s3.11-1.9,3.11-3.45c0-6.38-12.77-2.76-12.77-13.8,0-4.66,2.59-8.63,9.66-8.63,6.9,0,9.49,3.45,9.49,8.11v.69h-6.73a7.21,7.21,0,0,0-.52-3.11,2.09,2.09,0,0,0-2.07-1c-1.73,0-2.76,1-2.76,3.11,0,6.21,12.77,3.11,12.77,13.46,0,6.73-3.8,9.32-10.18,9.32-5,0-9.66-1.55-9.66-7.76V50.63Z' /%3E%3Cpath fill='%23fff' d='M129.44,30h6.9V59.53h-6.9Z' /%3E%3Cpath fill='%23fff' d='M150.49,60c-9.15,0-10.35-6-10.35-15.36s1.21-15.36,10.35-15.36c9.84,0,10.35,7.25,10.35,15.36C161,53,160.33,60,150.49,60Zm0-4.66c2.76,0,3.28-2.59,3.28-10.7S153.42,34,150.49,34c-2.76,0-3.11,2.59-3.11,10.7S147.73,55.38,150.49,55.38Z' /%3E%3Cpath fill='%23fff' d='M164.64,30h7.94l5.69,19.15h0V30h6.38V59.53h-7.94l-6-20.36h0V59.53h-6.24V30Z' /%3E%3Cpath fill='%23fff' d='M205.71,50.55v1c0,2.24.69,4,3.11,4S212,53.63,212,52.11c0-6.38-12.77-2.76-12.77-13.8,0-4.66,2.59-8.63,9.66-8.63,6.9,0,9.49,3.45,9.49,8.11v.69h-6.73a7.21,7.21,0,0,0-.52-3.11,2.09,2.09,0,0,0-2.07-1c-1.73,0-2.76,1-2.76,3.11,0,6.21,12.77,3.11,12.77,13.46,0,6.73-3.8,9.32-10.18,9.32-5,0-9.66-1.55-9.66-7.76V50.63Z' /%3E%3Cpath fill='%23fff' d='M226.42,35.54h-6.21V29.85h19.33v5.69h-6.21v24h-6.9v-24Z' /%3E%3Cpath fill='%23fff' d='M245.22,30h8.63l7.42,29.51H254l-1-5.69H246l-1,5.69h-7.25Zm4.14,5.35h0l-2.59,13.11h5Z' /%3E%3Cpath fill='%23fff' d='M265.59,35.54h-6.22V29.85H278.7v5.69h-6.21v24h-6.9Z' /%3E%3Cpath fill='%23fff' d='M281.12,30H298.2v5.69H288v5.87h9.49v5.69H288V54H298.5v5.69H281V30Z' /%3E%3Cpath fill='%23fff' d='M302,30h10.2l3.62,19.5h0L319.24,30h10V59.53h-6.37V36.58h0l-4.49,23H313l-4.83-23h0V59.53H302Z' /%3E%3Cpath fill='%23fff' d='M334.09,30h17.08v5.69H341v5.87h9.49v5.69H341V54H351.5v5.69H334.09Z' /%3E%3Cpath fill='%23fff' d='M354.8,30h7.94l5.69,19.15h0V30h6.38V59.53h-7.94l-6-20.36h0V59.53h-6Z' /%3E%3Cpath fill='%23fff' d='M383.61,35.54H377.4V29.85h19.33v5.69h-6.21v24h-6.9v-24Z' /%3E%3C/svg%3E") }

div.logo > div.menu > a[href="/agenda"] { background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 438 89.55'%3E%3Crect width='438' height='89.55' rx='16.15' ry='16.15'/%3E%3Cpath fill='%23fff' d='M158,30.13h8.63l7.42,29.52h-7.25l-1-5.7h-7.08l-1,5.7h-7.25Zm4.32,5.35h0L159.77,48.6h5Z' transform='translate(0 0)'/%3E%3Cpath fill='%23fff' d='M188.08,39.1c0-1.9-.17-5-2.76-5-2.93,0-3.11,2.93-3.11,10.7,0,8.11.35,10.7,3.11,10.7,2.42,0,3.11-2.07,3.11-6.21v-1h-3.28V43.59h9.67V59.47H190l-.17-2.76h0c-1,2.59-3.63,3.45-6.39,3.45-7.42,0-8.63-5.52-8.63-14.67,0-9.67.69-16.06,10.53-16.06,9,0,9.32,6.21,9.32,9.49h-6.56Z' transform='translate(0 0)'/%3E%3Cpath fill='%23fff' d='M198.61,30.13H215.7v5.7H205.52v5.87h9.67v5.7h-9.49v6.73h10.53v5.7H198.61Z' transform='translate(0 0)'/%3E%3Cpath fill='%23fff' d='M219.33,30.13h7.94L233,49.29h0V30.13h6.39V59.65h-7.94l-6-20.37h0V59.65h-6.21V30.13Z' transform='translate(0 0)'/%3E%3Cpath fill='%23fff' d='M244,30.13h10.36c6.91,0,9.84,3.63,9.84,13.81,0,10.7-1.38,15.71-10.53,15.71H244Zm6.91,24.34h1.9c3.28,0,4.32-1.21,4.32-10.19,0-7.25-.52-9.15-4.32-9.15h-1.9Z' transform='translate(0 0)'/%3E%3Cpath fill='%23fff' d='M272.5,30.13h8.63l7.42,29.52H281.3l-1-5.7h-7.08l-1,5.7H264.9Zm4.14,5.35h0L274.05,48.6h5Z' transform='translate(0 0)'/%3E%3C/svg%3E") }

div.logo > div.menu > a[href="/shop"] { background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 438 89.6'%3E%3Cpath d='M16.1,0h405.7c8.9,0,16.1,7.2,16.1,16.1v57.2c0,8.9-7.2,16.2-16.1,16.2H16.1C7.2,89.6,0,82.3,0,73.4V16.1 C0,7.2,7.2,0,16.1,0z'/%3E%3Cpath fill='%23fff' d='M180.8,51.3c0,0.7,0.1,1.3,0.2,1.9c0.1,0.6,0.3,1.1,0.6,1.4c0.3,0.4,0.7,0.7,1.2,0.9c0.5,0.2,1.2,0.3,2,0.3 c0.9,0,1.8-0.3,2.5-0.9c0.7-0.6,1.1-1.5,1.1-2.8c0-0.7-0.1-1.3-0.3-1.7c-0.2-0.5-0.5-0.9-0.9-1.3c-0.4-0.4-1-0.7-1.7-1.1 c-0.7-0.3-1.5-0.7-2.5-1c-1.3-0.4-2.5-0.9-3.5-1.5c-1-0.5-1.8-1.2-2.5-1.9c-0.7-0.7-1.1-1.5-1.4-2.5c-0.3-0.9-0.5-2-0.5-3.3 c0-3,0.8-5.2,2.5-6.6c1.7-1.5,3.9-2.2,6.8-2.2c1.3,0,2.6,0.1,3.7,0.4c1.1,0.3,2.1,0.8,2.9,1.4c0.8,0.7,1.5,1.5,1.9,2.5 c0.5,1,0.7,2.2,0.7,3.7v0.8h-5.8c0-1.4-0.3-2.5-0.8-3.3c-0.5-0.8-1.3-1.2-2.5-1.2c-0.7,0-1.2,0.1-1.7,0.3c-0.4,0.2-0.8,0.5-1.1,0.8 c-0.3,0.3-0.4,0.7-0.5,1.1c-0.1,0.4-0.1,0.9-0.1,1.3c0,0.9,0.2,1.7,0.6,2.3c0.4,0.6,1.2,1.2,2.5,1.7l4.7,2c1.1,0.5,2.1,1,2.8,1.6 c0.7,0.5,1.3,1.1,1.7,1.8c0.4,0.6,0.7,1.3,0.9,2.1s0.3,1.6,0.3,2.5c0,3.2-0.9,5.5-2.8,6.9c-1.8,1.4-4.4,2.2-7.7,2.2 c-3.4,0-5.9-0.7-7.3-2.2s-2.2-3.6-2.2-6.4v-1.2h6V51.3z'/%3E%3Cpath fill='%23fff' d='M203.8,29.8v11.5h7.1V29.8h6v30h-6V46.5h-7.1v13.3h-6v-30H203.8z'/%3E%3Cpath fill='%23fff' d='M220.8,38.6c0.2-1.9,0.7-3.6,1.4-4.9c0.7-1.4,1.7-2.4,3.1-3.2c1.3-0.8,3.2-1.2,5.4-1.2c2.3,0,4.1,0.4,5.4,1.2 c1.3,0.8,2.4,1.8,3.1,3.2c0.7,1.4,1.2,3,1.4,4.9c0.2,1.9,0.3,4,0.3,6.3c0,2.3-0.1,4.4-0.3,6.3c-0.2,1.9-0.7,3.5-1.4,4.9 c-0.7,1.4-1.7,2.4-3.1,3.2c-1.3,0.7-3.1,1.1-5.4,1.1c-2.3,0-4.1-0.4-5.4-1.1s-2.4-1.8-3.1-3.2c-0.7-1.4-1.2-3-1.4-4.9 c-0.2-1.9-0.3-4-0.3-6.3C220.4,42.6,220.6,40.5,220.8,38.6z M226.6,50c0.1,1.4,0.3,2.6,0.6,3.4s0.7,1.5,1.3,1.9s1.3,0.6,2.2,0.6 s1.6-0.2,2.2-0.6s1-1.1,1.3-1.9s0.5-2,0.6-3.4c0.1-1.4,0.1-3.1,0.1-5.1c0-2,0-3.7-0.1-5.1c-0.1-1.4-0.3-2.5-0.6-3.4 c-0.3-0.9-0.7-1.5-1.3-2c-0.5-0.4-1.3-0.6-2.2-0.6s-1.6,0.2-2.2,0.6c-0.5,0.4-1,1.1-1.3,2c-0.3,0.9-0.5,2-0.6,3.4 c-0.1,1.4-0.1,3.1-0.1,5.1C226.5,46.9,226.5,48.6,226.6,50z'/%3E%3Cpath fill='%23fff' d='M255,29.8c1.5,0,2.8,0.3,3.9,0.8c1,0.5,1.9,1.2,2.5,2c0.6,0.8,1.1,1.8,1.4,2.9c0.3,1.1,0.4,2.2,0.4,3.3 c0,1.5-0.2,2.9-0.7,4c-0.5,1.1-1.1,2.1-1.9,2.8c-0.8,0.7-1.8,1.3-3,1.6c-1.2,0.4-2.5,0.5-3.9,0.5h-3.2v12h-6v-30H255z M253.2,43.4 c1.2,0,2.2-0.4,2.9-1.1c0.7-0.7,1.1-1.9,1.1-3.4c0-1.5-0.3-2.7-1-3.4c-0.6-0.8-1.7-1.2-3.2-1.2h-2.5v9.1H253.2z'/%3E%3C/svg%3E") }

div.logo > div.menu > a[href="/about"] { background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 438 89.55'%3E%3Crect width='438' height='89.55' rx='16.15' ry='16.15'/%3E%3Cpath fill='%23fff' d='M169.65,30.11h8.63l7.42,29.51h-7.25l-1-5.69h-7.07l-1,5.69h-7.25Zm4.14,5.35h0L171.2,48.57h5Z' /%3E%3Cpath fill='%23fff' d='M188,30.11h10.87c5,0,8.45,2.42,8.45,7.25,0,3.45-1.9,6.21-4.66,6.73h0c2.24.35,5.52,1.21,5.52,7.25,0,3.45-1.55,8.28-9.84,8.28H188Zm6.9,11.73h1.9a3.1,3.1,0,0,0,3.45-3.45A2.94,2.94,0,0,0,197,35.3h-2.1Zm0,12.6H197a3.44,3.44,0,0,0,3.8-3.8c0-2.93-1.55-4.14-3.62-4.14h-2.24Z' /%3E%3Cpath fill='%23fff' d='M221.41,60.13c-9.15,0-10.35-6-10.35-15.36s1.21-15.36,10.35-15.36c9.84,0,10.35,7.25,10.35,15.36C231.76,53.06,231.25,60.13,221.41,60.13Zm0-4.66c2.76,0,3.28-2.59,3.28-10.7s-.35-10.7-3.28-10.7c-2.76,0-3.11,2.59-3.11,10.7S218.65,55.47,221.41,55.47Z' /%3E%3Cpath fill='%23fff' d='M254.54,49.78c0,5.87-1.73,10.35-9.66,10.35-8.11,0-9.66-4.49-9.66-10.35V30.11h6.9V51.85c0,2.24.86,3.62,2.76,3.62s2.76-1.38,2.76-3.62V30.11h6.9Z' /%3E%3Cpath fill='%23fff' d='M262.82,35.63h-6.21V29.94H276v5.69h-6.21v24h-6.9Z' /%3E%3C/svg%3E") }

div.logo > div.menu > a[href="/contact"] { background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 438 89.55'%3E%3Crect width='438' height='89.55' rx='16.15' ry='16.15'/%3E%3Cpath fill='%23fff' d='M156.36,40.29c0-4.31-.52-6.21-2.76-6.21-2.76,0-3.11,2.59-3.11,10.35,0,8.8.35,11,3.11,11,2.59,0,2.93-2.93,2.93-7.59h6.73v1c0,6.38-1.73,11.22-10.35,11.22-9,0-9.66-6.73-9.66-15.53,0-7.59.35-15.18,10.35-15.18,6.21,0,9.49,2.59,9.49,9.66v1.21Z' /%3E%3Cpath fill='%23fff' d='M175.86,60.13c-9.15,0-10.35-6-10.35-15.36s1.21-15.36,10.35-15.36c9.84,0,10.35,7.25,10.35,15.36C186.21,53.06,185.69,60.13,175.86,60.13Zm0-4.66c2.76,0,3.28-2.59,3.28-10.7s-.35-10.7-3.28-10.7c-2.76,0-3.11,2.59-3.11,10.7S173.1,55.47,175.86,55.47Z' /%3E%3Cpath fill='%23fff' d='M190,30.11h8l5.69,19.15h0V30.11H210V59.59h-7.76l-6-20.36h0V59.59H190Z' /%3E%3Cpath fill='%23fff' d='M218.82,35.59h-6.21V29.9H232v5.69h-6.21v24h-6.9Z' /%3E%3Cpath fill='%23fff' d='M237.63,30.11h8.63l7.42,29.48h-7.25l-1-5.69h-7.07l-1,5.69h-7.25Zm4.14,5.35h0l-2.59,13.13h5Z' /%3E%3Cpath fill='%23fff' d='M267.48,40.29c0-4.31-.52-6.21-2.76-6.21-2.76,0-3.11,2.59-3.11,10.35,0,8.8.35,11,3.11,11,2.59,0,2.93-2.93,2.93-7.59h6.73v1c0,6.38-1.73,11.22-10.35,11.22-9,0-9.66-6.73-9.66-15.53,0-7.59.35-15.18,10.35-15.18,6.21,0,9.49,2.59,9.49,9.66v1.21Z' /%3E%3Cpath fill='%23fff' d='M281.63,35.59h-6.21V29.9h19.33v5.69h-6.21v24h-6.9Z' /%3E%3C/svg%3E") }

div.logo:hover > div.menu > a,
div.logo.opened > div.menu > a { padding-bottom: calc(8955% / 438) }
div.logo:hover > div.menu > a[href="/"],
div.logo.opened > div.menu > a[href="/"] { margin-top: -20.5% }


body.projects #header .banner,
body.agenda #header .banner,
body.product #header .banner,
body.visual-impression #header .banner,
body.contact #header .banner { height: 100% }

body.projects #header div.logo,
body.product #header div.logo,
body.visual-impression #header div.logo { background: #fff }

body.projects #header { background-color: #D0181F }
body.projects #header .banner {
	right: 15%; width: 70%;
	background-color: #FFF200;
	background-image: url(images/banner-projects.svg);
	background-size: calc(100% / 0.7) auto;
}

body.agenda #header .banner {
	background-color: #b4d8b2;
	background-image: url(images/banner-agenda.svg);
}

body.product #header { background: #000 }
body.product #header .banner {
	width: 85%;
	background-color: #000;
	background-image: url(images/banner-shop.svg);
}
body.mission-statement #header .banner {
	background-color: #D0B0AE;
	background-image: url(images/banner-mission-statement.svg);
}
body.about #header .banner {
	background-color: #857D31;
	background-image: url(images/banner-about.svg);
}
body.contact #header .banner {
	background-color: #6E9A8F;
	background-image: url(images/banner-contact.svg);
}
body.visual-impression #header { background: #000 }
body.visual-impression #header .banner {
	width: 85%;
	background-color: #000;
	background-image: url(images/banner-visual-impression.svg);
}


body.product .content { padding: 0 5% 1em }
body.product.checkout .content { padding: 0 calc(216px + 2.5%) 1em }
body.product .content img { margin-left: 0; width: auto; display: inline }


body.product.cart .product-thumbnail img { max-width: 120px; max-height: 120px }
body.product .content .woocommerce-message,
body.product .content .woocommerce-info,
body.product .content .woocommerce-error {
	margin-bottom: -2px;
	color: #fff;
	background: transparent;
	border: 2px solid #fff;
	border-width: 2px 0;
	box-sizing: border-box; 
}
body.product .content .woocommerce-message a,
body.product .content .woocommerce-message button,
body.product .content .woocommerce-message .button,
body.product .content .woocommerce-info a,
body.product .content .woocommerce-info button,
body.product .content .woocommerce-info .button,
body.product .content .woocommerce-error a,
body.product .content .woocommerce-error button,
body.product .content .woocommerce-error .button {
	margin-left: 1em;
	margin-bottom: 1px;
}

body.product.cart .content .woocommerce-message,
body.product.cart .content .woocommerce-info,
body.product.cart .content .woocommerce-error { 
	top: -1em; 
}

body.product.cart #content .restore-item,
body.product.cart #content .checkout-button { float: right }

body.product.cart .cart_totals h2 { padding-bottom: 0.5em; margin-bottom: 0.5em; border-bottom: 2px solid #fff }
body.product.cart .woocommerce .cart-collaterals .cart_totals, 
body.product.cart .woocommerce-page .cart-collaterals .cart_totals { max-width: 480px }

body.product form.cart { 
	position: absolute;
	top: 0; right: 10%;
}
body.product .quantity { display: inline-block }
body.product .quantity input[type="number"] { 
	padding: 0 6px;
	font-family: 'Roboto Condensed', "Helvetica Condensed", "Arial Narrow", 'Arial Nova Condensed Bold', 'TeXGyreHerosCnBold', 'AvenirNextCondensed-Regular', 'Abadi MT Condensed Bold', sans-serif;
    font-stretch: condensed;
    font-weight: 700;
    font-size: 32px;
    line-height: 1.35em;
	border-radius: 4px;
}
/* body.product .quantity.hidden + button { margin-left: -6px } */
body.product .woocommerce-Price-currencySymbol { margin-right: 0.2em }
body.product .woocommerce-product-details__short-description { margin-top: 1em }

body.product input[type="button"], 
body.product input[type="submit"], 
body.product input[type="reset"], 
body.product button,
body.product .content .woocommerce-message a,
body.product .content .woocommerce-message button,
body.product .content .woocommerce-message .button,
body.product .content .woocommerce-info a,
body.product .content .woocommerce-info button,
body.product .content .woocommerce-info .button,
body.product .content .woocommerce-error a,
body.product .content .woocommerce-error button,
body.product .content .woocommerce-error .button,
#content .woocommerce #respond input#submit.alt, 
#content .woocommerce a.button.alt, 
#content .woocommerce button.button.alt, 
#content .woocommerce input.button.alt,
#content .woocommerce #respond input#submit, 
#content .woocommerce a.button, 
#content .woocommerce button.button, 
#content .woocommerce input.button,
#content .restore-item {
	padding: 0px 12px;
    font-family: 'Roboto Condensed', "Helvetica Condensed", "Arial Narrow", 'Arial Nova Condensed Bold', 'TeXGyreHerosCnBold', 'AvenirNextCondensed-Regular', 'Abadi MT Condensed Bold', sans-serif;
    font-stretch: condensed;
    font-weight: 700;
    font-size: 32px;
    line-height: 1.35em;
    color: #000 !important;
	text-align: center;
	text-decoration: none;
	text-transform: uppercase;
	background: #fff;
	border-radius: 4px;
	cursor: pointer;
	
	-webkit-appearance: none;
	   -moz-appearance: none;
}

#content .woocommerce #respond input#submit:hover, 
#content .woocommerce a.button:hover, 
#content .woocommerce button.button:hover, 
#content .woocommerce input.button:hover {
	color: #000;
	background: #fff;
}

#content .woocommerce #respond input#submit.alt a, 
#content .woocommerce a.button.alt a, 
#content .woocommerce button.button.alt a, 
#content .woocommerce input.button.alt a{ color: #000 }

body.product .product_meta { margin: -0.4em 0 -0.5em }



body.product.cart tr.woocommerce-cart-form__cart-item.cart_item td,
body.product.cart thead > tr > th { border-bottom: 2px solid #fff }
body.product.cart tr td.actions { padding-top: 1em }


body.product .woocommerce .col2-set#customer_details .col-1, 
body.product .woocommerce-page .col2-set#customer_details .col-1,
body.product .woocommerce .col2-set#customer_details .col-2, 
body.product .woocommerce-page .col2-set#customer_details .col-2 {
	float: none;
	width: auto;
	margin-top: 1em;
	margin-bottom: 2em;
	display: block;
}
body.product.checkout .woocommerce form .form-row .input-text, 
body.product.checkout .woocommerce-page form .form-row .input-text, 
.woocommerce select, 
.woocommerce-page select {
	padding: 0px 12px;
	
    font-family: 'Roboto Condensed', "Helvetica Condensed", "Arial Narrow", 'Arial Nova Condensed Bold', 'TeXGyreHerosCnBold', 'AvenirNextCondensed-Regular', 'Abadi MT Condensed Bold', sans-serif;
    font-stretch: condensed;
    font-weight: 700;
    font-size: 32px;
    line-height: 1.35em;
    color: #000 !important;
	
	background: #fff;
	border-radius: 4px;
	
	-webkit-appearance: none;
	   -moz-appearance: none;
}
body.product.checkout .woocommerce form .form-row select option, 
body.product.checkout .woocommerce-page form .form-row select option {
    font-family: 'Roboto Condensed', "Helvetica Condensed", "Arial Narrow", 'Arial Nova Condensed Bold', 'TeXGyreHerosCnBold', 'AvenirNextCondensed-Regular', 'Abadi MT Condensed Bold', sans-serif;
	font-stretch: condensed;
}


body.product.checkout .woocommerce ul.order_details li { float: none; position: relative; padding-right: 0; margin-right: 0; border: 0 }
body.product.checkout .woocommerce ul.order_details li,
body.product.checkout .woocommerce ul.order_details li strong { font-size: 1em;  line-height: 1.35em }
body.product.checkout .woocommerce ul.order_details li strong { position: absolute; left: 50%; top: 0; display: inline-block }

#content { 
	min-height: 100%;
	padding: 375px 0 1em;
	background: #000;
}
#content a { color: #fff }

body.visual-impression #content, body.projects #content, body.product #content,
body.agenda #content, body.contact #content { padding-top: 216px }

body.visual-impression #content { width: 1444px; padding-bottom: 0 }
body.visual-impression #content:after {
	clear: both;
	width: 100%;
	height: 0;
	content:'';
	display:block;
}

body.visual-impression #content .item { 
	float: left; 
	width: calc(4px + 1444px / 6); 
	height: calc(4px + 1444px / 6);
	margin: 0 0 -4px -4px;

	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	border: 4px solid #fff;

	overflow: hidden;
}
body.visual-impression #content .item .text {
	position: absolute;
	top: 100%; 
	width: 100%; 
	height: 100%;

	font-size: 0.6em;
	line-height: 1.2em;
	color: #000;

	transition: opacity 0.2s;

	-webkit-touch-callout: none;
	-webkit-user-select: none;
	 -khtml-user-select: none;
	   -moz-user-select: none;
	    -ms-user-select: none;
			user-select: none;

	background: rgba(255,255,255,0.7);
	cursor: default;
	opacity: 0;
}
body.visual-impression #content .item:hover .text { top: 0; opacity: 1 }

body.visual-impression #content .item .text > div {
	position: absolute;
	top: 50%; left: 0;
	width: 100%;
	max-height: 100%;
	padding: 0.5em 1em;
	
	-webkit-transform: translate(0,-50%);
		-ms-transform: translate(0,-50%);
			transform: translate(0,-50%);
}
body.visual-impression #content .item .text >div > p:last-child { margin-bottom: 0 }

body.visual-impression #content .item .text h1 { font-size: 2em; line-height: 1em; margin-bottom: 0.25em }
body.visual-impression #content .item .text h2 { margin-bottom: 0.25em; line-height: 1em }
body.visual-impression #content .item .text p { margin-bottom: 0.5em; line-height: 1.125em }
body.visual-impression #content .item .text a { color: #000; cursor: pointer }
body.visual-impression #content .item .text a.link,
body.visual-impression #content .item .text p.credits { 
	font-size: 0.9em;
	text-decoration: none;
}
body.visual-impression #content .item .text p.credits,
body.visual-impression #content .item .text h6 { 
	margin: 0.7em 0 0.35em; 
	font-size: 0.75em; 
	font-weight: 400;
}
body.visual-impression #content .item .text a.link:hover { text-decoration: underline }





body.product #content { width: 1444px; max-width: calc(100% + 4px); padding-bottom: 0 }
body.product #content:after {
	clear: both;
	width: 100%;
	height: 0;
	content:'';
	display:block;
}







.project-list { 
	padding-top: 1em; 
	padding-bottom: 2em;
	margin-bottom: 1em;
}
.project-list:after {
	position: absolute;
	bottom: -0.5em; left: 0; right: 0;
	height: 2em;
	content:'';
	background: url(images/arrow.svg) center/contain no-repeat;
}
.project-list > a {
	font-size: 1.5em;
	line-height: 1.25em;
	color: #fff;
	text-transform: uppercase;
	text-decoration: none;
}
.project-list > a:hover { font-style: italic }

.banner { height: 375px; margin: -1px 0 }
.banner > a {
	position: absolute;
	left: 0; right: 0;
	top: 0; bottom: 0;
}
.banner, .banner > a {
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
}
.banner > div.logo { height: calc(36000% / 375) }
.banner > div.logo > div.menu { top: calc(48% - (390 * 36.5% / 438)) }


.content { 
	padding: 1em 10%; 
	margin-bottom: -1em;
}
.content img { /* max- */ width: 125%; max-width: none; margin-left: -12.5%; display: block }
.content .video-container { width: 125%; margin-left: -12.5% }
.content .video-container.ratio-4x3 { padding-top: calc(0.75 * 25%) }
.content .video-container.ratio-16x10 { padding-top: calc(0.625 * 25%) }
.content .video-container.ratio-16x9 { padding-top: calc(0.5625 * 25%) }
.content:last-child > *:last-child { margin-bottom: 0 }

.content .columns { 
	margin: 0.1em 0 calc(1em / 0.9);

	text-align: left; 
	column-count: 4;
	column-gap: 2em;

	-moz-column-fill: balance;
		 column-fill: balance;

	opacity: 0;
}

.read-more { 
	position: relative;
	top: -0.8em;
	font-size: 0.8em; 
	font-weight: 400;
	line-height: 2.2em;
	text-decoration: none;
}
.read-more:hover { text-decoration: underline }


.indexes { 
	width: 100%; 
	padding: 0;
	font-size: 66px;
	line-height: 1em;
	text-align: center;
	display: block;
}
.indexes > a { 
	padding: 0.175em .115em;
	margin: 0;
	text-transform: uppercase;
	text-decoration: none;
	display: inline-block;

	-webkit-touch-callout: none;
	-webkit-user-select: none;
	 -khtml-user-select: none;
	   -moz-user-select: none;
	    -ms-user-select: none;
			user-select: none;

	cursor: pointer;
}

.indexes > a:hover { text-decoration: underline }
.indexes > a.selected { background: #fff }

.indexes > a.disabled:hover,
.indexes > a.disabled { text-decoration: none; opacity: 0.25; cursor: default }


#content .items,
#content .items + div  { 
	height: calc(100vh - 360px - 66px - 0.9em);
	min-height: calc(100vh - 360px - 66px - 0.9em);
	vertical-align: top;
}
body.image-society-index .content > h1:first-child,
#content .items + div .text > h1:first-child { padding-right: 1.5em }
#content .items + div .text span.close { 
	position: absolute;
	top: 0; right: 0; 
	height: 1em;
	cursor: pointer;
}
#content .items + div .text span.close:after { content: 'x' }
#content .items + div .text > *:last-child { margin-bottom: 0 }

#content .items { 
	min-width: 288px;
	padding: 1em 0.8em 0 1em; 

	font-size: 0.8em; 
	line-height: 1.2em;
	color: #fff;
	text-align: left;

	background: #000;

	-webkit-touch-callout: none;
	-webkit-user-select: none;
	   -moz-user-select: none;
		-ms-user-select: none;
			user-select: none;

	display: table-cell;
}
#content .items .intro-link { 
	margin: .45em 0 1.35em;
	text-transform: uppercase;
}
#content .items .intro-link > a { text-decoration: none }
#content .items .intro-link > a:hover,
#content .items .intro-link > a.selected { text-decoration: underline }

body.mobile #content .items .intro-link > a:hover,
body.mobile #content .items .intro-link > a.selected { text-decoration: none }

#content .items .index,
#content .items .item,
#content .columns .item { 
	cursor: pointer;
	display: block;
}
#content .items a.item:hover,
#content .columns a.item:hover { text-decoration: underline }
#content .items span.item,
#content .columns span.item { 
	opacity: calc(2 / 3);
	cursor: default;
}
#content .items span.item { opacity: 0.5 }

#content .columns .item { 
	padding-bottom: 0.3em; 
	padding-right: 10%;

	font-size: 0.9em; 
	line-height: 1.25em;

	-webkit-column-break-inside: avoid;
			  page-break-inside: avoid;
				   break-inside: avoid-column; 
}
#content .columns span.item { opacity: 0.4 }
#content .columns a.item { text-decoration: none }
#content .columns a.item:hover { text-decoration: underline }


#content .columns .index { margin-top: 1em; margin-bottom: 0.25em; letter-spacing: 0.1em }
#content .columns .index:first-child { margin-top: 0 }
#content .columns .index + .item {
	-webkit-column-break-inside: avoid;
			  page-break-inside: avoid;
				   break-inside: avoid-column; 
}

#content .items p { max-height: auto; margin-bottom: 0.5em; overflow: hidden }
#content .items p.disabled { display: none !important }
#content .items .item { max-height: 0; padding-bottom: 0; overflow: hidden;
	transition: padding-bottom .15s, max-height .15s, margin-bottom .15s, opacity .15s;
}

#content .items p.opened .item { max-height: 3em; padding-bottom: 0 }
#content .items p.opened .index { margin-bottom: 0.45em }

#content .items p.hidden,
#content .items p.opened .item.hidden,
#content .items .item.hidden,
#content .columns .item.hidden { max-height: 0; margin-bottom: 0; padding-bottom: 0; opacity: 0 }
#content .items p.opened .item:not(.hidden) { padding-bottom: 0.3em }

#content .items .index { 
	position: relative; 
	padding: 0 1.5em 0.1em 0; 
	font-weight: 600; 
	line-height: 1.1em;
	text-transform: uppercase;
}
#content .items .index:after { 
	position: absolute; 
	right: 0; bottom: 0.05em;

	font-size: 0.7em;
	line-height: calc(1.2em / 0.7);
	content: '\25B6 \FE0E';

	transform-origin: center;
	-webkit-transform: translate(0,0) rotate(0deg);
		-ms-transform: translate(0,0) rotate(0deg);
			transform: translate(0,0) rotate(0deg);
	
	transition: -webkit-transform 0.15s, -ms-transform 0.15s, transform 0.15s;
}
#content .items p.opened .index:after { 
	-webkit-transform: translate(0,calc(-0.1em / 0.7)) rotate(90deg);
		-ms-transform: translate(0,calc(-0.1em / 0.7)) rotate(90deg);
			transform: translate(0,calc(-0.1em / 0.7)) rotate(90deg);
}

#content .items .item { 
	font-size: 0.9em; 
	line-height: 1em; 
	color: #fff; 
	text-decoration: none;
}
#content .items .item.selected { text-decoration: underline }


#content .items + div { 
	width: 100%; 
	padding: 1em 1.2em;
	display: table-cell;
}
body.image-society-index .content h1,
#content .items + div h1 { 
	margin-bottom: 0.5em;
	font-size: 1em; 
	font-weight: 600;
	line-height: 1.2em; 
	text-transform: uppercase; 
	text-align: left;
}
#content .items + div img { 
	/* max- */width: calc(100% + 2.4em ); 
	max-width: none;
	margin-left: -1.2em;
}
#content .items + div .video-container { 
	width: calc(100% + 2.4em ); 
	margin-left: -1.2em;
}
#content .items + div .video-container.ratio-4x3 { padding-top: calc(0.75 * 2.4em) }
#content .items + div .video-container.ratio-16x10 { padding-top: calc(0.625 * 2.4em) }
#content .items + div .video-container.ratio-16x9 { padding-top: calc(0.5625 * 2.4em) }


div.product { 
/*	padding: 1em 10%;  */
	margin-top: 1em;
	margin-bottom: -1em;
}
div.product > div {
	margin-right: -4px;
	vertical-align: top;
	display: inline-block;
}
div.product > div:nth-child(1) { width: 45%; margin-right: calc(5% - 4px) }
div.product > div:nth-child(2) { width: 50%; padding-right: 5% }
div.product .video-container { width: 100% }
div.product .video-container.ratio-4x3 { padding-top: calc(0.75 * 25%) }
div.product .video-container.ratio-16x10 { padding-top: calc(0.625 * 25%) }
div.product .video-container.ratio-16x9 { padding-top: calc(0.5625 * 25%) }
div.product:last-child > *:last-child { margin-bottom: 0 }


ul.products { width: calc(100% + 4px); margin: 0; list-style-type: none }
ul.products:after {
	clear:both;
	content: '';
	display: block;
}
ul.products .product {
	position: relative;
    float: left;
    width: calc(12.5% + 4px); /* 184.5px; */
    height: 184.5px;
	margin: 0 0 -4px -4px;
	
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	border: 4px solid #fff;
	
    box-sizing: border-box;
    cursor: pointer;
}
ul.products .product > div { 
	position: absolute; 
	bottom: 0; 
	max-width: 50%;
	padding: 4px 6px;
	font-size: 0.6em;
	line-height: 1em;
	opacity: 0;
	transition: opacity .25s;
	pointer-events: none;
}
ul.products .product > div.short-description { left: 0; text-align: left }
ul.products .product > div.price { right: 0; text-align: right }
ul.products .product:before {
	position: absolute;
	top: 0; left: 0;
	bottom: 0; right: 0;
	content: '';
	background: rgba(0,0,0,.5);
	opacity: 0;
	transition: opacity .25s;
}
ul.products .product:hover:before { opacity: 1 }
body.mobile ul.products .product:hover:before { opacity: 0 }
ul.products .product:hover > div,
body.mobile ul.products .product > div { opacity: 1 }


ul.products .product.sold:after { 
	position: absolute;
	top: 0; left: 0; 
	bottom: 0; right: 0;
	content: '';
	background-image: url(images/sold.png);
	background-size: 100% auto;
	background-repeat: no-repeat;
	background-position: center;
}
.woocommerce h2 { font-size: 1em; text-transform: uppercase }
.woocommerce-product-gallery { 
	height: calc(100vh - 216px - 2em);
	max-height: 200vh;
	opacity: 1 !important; 
	text-align: center;
}
.woocommerce-product-gallery .slide { height: 100% }
.woocommerce-product-gallery img {
	width: auto; max-width: 100%;
	height: auto; max-height: 100%;
}
.woocommerce-message,
.woocommerce-error { margin-left: calc(-5% / 0.9); width: calc(100% / 0.9) }

.woocommerce table.shop_table.order_details,
.woocommerce table.shop_table.woocommerce-checkout-review-order-table { 
	padding: 0.25em 0;
	margin-bottom: 1.5em;
	border: 2px solid #fff;
}
.woocommerce table.shop_table.order_details tr > *:first-child,
.woocommerce table.shop_table.woocommerce-checkout-review-order-table tr > *:first-child { padding-left: 0.5em }
.woocommerce table.shop_table.order_details tr > *:last-child,
.woocommerce table.shop_table.woocommerce-checkout-review-order-table tr > *:last-child { padding-right: 0.5em }


#add_payment_method #payment, .woocommerce-cart #payment, .woocommerce-checkout #payment {
	background: #000;
	border: 2px solid #fff;
}

#add_payment_method #payment select, 
.woocommerce-cart #payment select, 
.woocommerce-checkout #payment select {
	width: 100%;
	border: 2px solid #000;
}
.payment_box.payment_method_mollie_wc_gateway_ideal p { 
	width: 50%; 
	margin-right: -4px;
	display:inline-block;
	vertical-align: middle;
}
.payment_box.payment_method_mollie_wc_gateway_ideal p:first-child { margin-bottom: 0 }

#add_payment_method #payment div.payment_box, 
.woocommerce-cart #payment div.payment_box, 
.woocommerce-checkout #payment div.payment_box { color: #000; background: #fff }

#add_payment_method #payment div.payment_box::before, 
.woocommerce-cart #payment div.payment_box::before, 
.woocommerce-checkout #payment div.payment_box::before { border-bottom-color: #fff }

.woocommerce-checkout #payment ul.payment_methods { border-bottom: 2px solid #fff }

.woocommerce .cart-collaterals .cart_totals th { padding-left: 0 }

.woocommerce table.shop_table th,
.woocommerce table.shop_table td { line-height: 1em }


.woocommerce-checkout-review-order-table thead > tr > th:last-child,
.woocommerce-checkout-review-order-table tr > td:last-child,
.cart_totals td, 
.order_details thead > tr > th:last-child,
.order_details tr > td:last-child,
.order_details tfoot > tr > td { text-align: right }
.tax_label, .shipped_via { display: none }
.order_details tfoot > tr:nth-child(2) .woocommerce-Price-amount.amount { margin-right: -0.5em }

table.shop_table.order_details thead > tr > th,
.woocommerce-checkout-review-order-table thead > tr > th { padding-bottom: 0.5em !important; border-bottom: 2px solid #fff }
table.shop_table.order_details tbody > tr:first-child > *,
.woocommerce-checkout-review-order-table tbody > tr:first-child > * { padding-top: 0.5em !important }
table.shop_table.order_details tbody > tr > *:first-child:before,
.woocommerce-checkout-review-order-table tbody > tr > *:first-child:before { content: '– ' }
table.shop_table.order_details tbody > tr:last-child > *,
.woocommerce-checkout-review-order-table tbody > tr:last-child > * { padding-bottom: 0.5em !important }
table.shop_table.order_details tfoot > tr > th,
.woocommerce-checkout-review-order-table tfoot > tr > th { text-align: right }
table.shop_table.order_details tfoot > tr:first-child > *,
.woocommerce-checkout-review-order-table tfoot > tr:first-child > *,
table.shop_table.order_details tfoot > tr:last-child > *,
.woocommerce-checkout-review-order-table tfoot > tr:last-child > * { padding-top: 0.5em !important; border-top: 2px solid #fff !important } 

.woocommerce #payment #place_order, .woocommerce-page #payment #place_order { margin-bottom: 0 }

#order_review { margin-bottom: 1em }

div[data-thumb] { float: left; max-width: 25% }
p.price { margin: 0 }
/* p.stock { display: none } */
p.stock.in-stock { display: none }
p.stock.out-of-stock { font-style: italic }

div.product_meta { font-size: 0.8em; line-height: 1.35em }
body.product .addtoany_shortcode { margin: 1.35em 0 0.35em -4px !important }

.woocommerce form .form-row .required { text-decoration: none }

.banner .cart-customlocation { 
	position: absolute;
	left: auto; right: calc(3.75% / 0.85); top: 50%;
	width: calc(7.5% / 0.85); height: 50%;
	
	background-image: url(images/cart.svg);
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	
	-webkit-transform: translate(0,-50%);
		-ms-transform: translate(0,-50%);
			transform: translate(0,-50%);
	
	display: inline-block;
	overflow: hidden;
}
.banner .cart-customlocation > span {
	position: absolute;
	top: 45%; left: 60%;

	font-size: 0.6em;
	color: #fff;
	text-align: center;
	text-decoration: none;
	
	-webkit-transform: translate(-50%,-50%);
		-ms-transform: translate(-50%,-50%);
			transform: translate(-50%,-50%);
	
	display: inline-block;
}

body.projects #content, 
body.project #content { padding-bottom: 0 }

body.projects .content { 
	padding: 1em 10% 0; 
	margin-bottom: 0;
}

body.mobile .indexes > a:hover { text-decoration: none }


.addtoany_shortcode { margin: 1.35em 0 0.35em !important; text-align: center }
body.agenda .addtoany_shortcode,
body.product .addtoany_shortcode,
body.contact .addtoany_shortcode { text-align: left }

@media \0screen\,screen\9 {
	body { 
		font-family: 'Roboto Condensed', 'HelveticaNeueBoldCondensed', 'HelveticaNeue-Bold-Condensed', 'Helvetica Neue Bold Condensed', 'Helvetica Condensed', 
					 'Arial Narrow', 'TeXGyreHerosCnBold', 'AvenirNextCondensed-Regular', 'Abadi MT Condensed Bold', sans-serif-condensed, sans-serif; 
		font-weight:600; 
		font-stretch: condensed; 
	}

	#wrapper { width: 100%; height: auto; min-height: 100%; background: #000 }
	body.home #wrapper { height: 100% }

	#content,
	body.visual-impression #content { width: 100% }

	#menu > *, div.logo { 
		background-repeat: no-repeat;
		background-position: center;
		background-size: contain;
		behavior: url(/wp-content/themes/the-image-society/scripts/background-size.min.htc); 
	}

/*	#menu > *:before, #menu > a:after, #menu > div.logo { display: none }
	#menu > div.title, #menu > a[href="/visual-impression"] { height: 20% }

	#menu > div.title { 
		left: 0; width: 100%;
		background-color: #D0181F;
		background-image: url(images/home-header.png);
		background-position: 0 50%;
	}

	#menu > a[href="/projects"] { 
		top: 20%; height: 60%;
		background-color: #FFF200;
		background-image: url(images/home-projects.png);
	}

	#menu > a[href="/mission-statement"], #menu > a[href="/agenda"], #menu > a[href="/shop"],
	#menu > a[href="/about"], #menu > a[href="/contact"] { height: 15% }
	#menu > a[href="/mission-statement"] { top: 20%; background-color: #D0B0AE; background-image: url(images/home-mission-statement.png) }
	#menu > a[href="/agenda"], #menu > a[href="/shop"] { top: 35%; background-color: #B4D8B2; background-image: url(images/home-agenda.png) }
	#menu > a[href="/about"] { top: 50%; background-color: #857D31; background-image: url(images/home-about.png) }
	#menu > a[href="/contact"] { top: 65%; background-color: #6E9A8F; background-image: url(images/home-contact.png) }

	#menu > a[href="/visual-impression"] { background-color: #000; background-image: url(images/home-visual-impression.png) }
*/
	div.logo { 
		width: 216px; height: 216px;
		background-image: url(images/menu-hamburger.png);
		cursor: pointer;
		z-index: 999999;
	}

	body.projects #header div.logo,
	body.visual-impression #header div.logo { 
		background-color: #fff;
		background-image: url(images/menu-hamburger.png);
		background-position: center;
	}
	body.projects #header .banner,
	body.visual-impression #header .banner { 
		position: relative;
		width: auto; right: auto;
		margin-left: 216px;
		display: block;
	}

	.banner { text-decoration: none }
	.banner:before {
		width: 100%;
		height: 100%;
		padding-top: 20px; 
		font-size: 180px; 
		font-weight: 1200; 
		color: #000;
		letter-spacing: -.02em; 
		line-height: 170px; 
		text-align: center;
		white-space: pre-wrap;
		overflow: hidden;
		display: inline-block;
	}

	body.projects #header .banner:before { line-height: 180px; content: 'PROJECTS' }
	body.mission-statement #header .banner:before { content: 'MISSION\A STATEMENT' }
	body.agenda #header .banner:before { line-height: 180px; content: 'AGENDA' }
	body.product #header .banner:before { line-height: 180px; content: 'SHOP' }
	body.about #header .banner:before { content: 'ABOUT THE IMAGE SOCIETY' }
	body.contact #header .banner:before { line-height: 180px; content: 'CONTACT' }
	body.visual-impression #header .banner:before { font-size: 120px; line-height: 180px; color: #fff; content: 'VISUAL IMPRESSION' }

	body.projects .banner#designing-power:before,
	body.project.designing-power #header .banner:before { content: 'DESIGNING\A POWER' }
	body.projects .banner#heroes-museum:before,
	body.project.heroes-museum #header .banner:before { content: 'HEROES\A MUSEUM' }
	body.projects .banner#image-society-index:before,
	body.project.image-society-index #header .banner:before { content: 'IMAGE\A SOCIETY INDEX' }
	body.projects .banner#my-friends:before,
	body.project.my-friends #header .banner:before { content: 'MY\A FRIENDS' }
	body.projects .banner#slogan-world:before,
	body.project.slogan-world #header .banner:before { content: 'SLOGAN\A WORLD' }
	body.projects .banner#the-art-of-control:before,
	body.project.the-art-of-control #header .banner:before { content: 'THE ART\A OF CONTROL' }

	.project-list:after {
		background-image: url(images/arrow.png);
		background-position: center;
		background-repeat: no-repeat;
		display: inline-block;
	}

	#content .items span.item { color: #808080 }
	#content .indexes {
		padding: 0 20px; 
		font-size: 36px;
		font-weight: 900;
		text-align: justify;
    	text-justify: distribute-all-lines;
	}
	#content .indexes > a.disabled { color: #cecb78 !important }
	#content .columns span.item { color: #6b7673 }
	#content .items p.hidden, #content .items p.opened .item.hidden, 
	#content .items .item.hidden, #content .columns .item.hidden { display: none }

	body.visual-impression #content .item { width: 240px; height: 240px }
	body.visual-impression #content .item .text { background-image: url(images/visual-background.png); display: none }
	body.visual-impression #content .item .text > div { top: 0; padding-top: 40px }
	body.visual-impression #content .item:hover .text { display: block }
	
	body.shop #content .item { width: 180px; height: 180px }
	body.product.checkout .content { padding: 0 calc(15vw + 2.5%) 1em }
}

@media screen and (min-width: 1440px) and (min-height: 932px) {
	#menu > div.title, #menu > div.logo,
	#menu > a[href="/visual-impression"] { height: 216px }
	#menu > a[href="/projects"] { top: 216px; height: calc(100% - 432px) }
	#menu > a[href="/agenda"], #menu > a[href="/shop"], #menu > a[href="/about"], #menu > a[href="/contact"],
	#menu > a[href="/mission-statement"] { height: calc(1px + 126 * (100% - 432px) / 504) }
	#menu > a[href="/mission-statement"] { top: 216px }
	#menu > a[href="/agenda"], #menu > a[href="/shop"] { top: calc(216px + 126 * (100% - 432px) / 504) }
	#menu > a[href="/about"] { top: calc(216px + 252 * (100% - 432px) / 504) }
	#menu > a[href="/contact"] { top: calc(216px + 378 * (100% - 432px) / 504) }
}

@media screen and (max-width: 1440px) {
	#menu { max-height: calc(1440 * 100vw / 936) }
	#menu > div.title,#menu > div.logo,
	#menu > a[href="/visual-impression"] { height: 15vw }
	#menu > a[href="/projects"] { top: 15vw; height: calc(100% - 30vw) }
	#menu > a[href="/agenda"], #menu > a[href="/shop"], #menu > a[href="/about"], #menu > a[href="/contact"],
	#menu > a[href="/mission-statement"] { height: calc(1px + 126 * (100% - 30vw) / 504) }
	#menu > a[href="/mission-statement"] { top: 15vw }
	#menu > a[href="/agenda"], #menu > a[href="/shop"] { top: calc(15vw + 126 * (100% - 30vw) / 504) }
	#menu > a[href="/about"] { top: calc(15vw + 252 * (100% - 30vw) / 504) }
	#menu > a[href="/contact"] { top: calc(15vw + 378 * (100% - 30vw) / 504) }

	#header { height: 15vw }
	#header .banner { height: calc(37500vw / 1440) }

	#content { padding-top: calc(37500vw / 1440)  }
	#content .items { min-width: 20vw }
	#content .items, 
	#content .items + div  { 
		height: calc(100vh - 25vw - 1.35 * 6600vw / 1440);
		min-height: calc(100vh - 25vw - 1.35 * 6600vw / 1440);
	}
	#content .items + div { padding: 1em 1.2em }

	body.visual-impression #content, body.projects #content,
	body.agenda #content, body.product #content, body.contact #content { padding-top: 15vw }

	div.logo:hover > div.menu,
	div.logo.selected > div.menu,
	.banner > div.logo:hover > div.menu,
	.banner > div.logo.selected > div.menu { top: 1vw }
	.banner { height: calc(37500vw / 1440) }
	.indexes { font-size: calc(6600vw / 1440) }

	.woocommerce-product-gallery { height: calc(100vh - 15vw - 2em) }
	
	body.visual-impression #content { width: calc(100vw + 4px) }
	body.visual-impression #content .item { 
		width: calc(4px + (100vw + 4px) / 6); 
		height: calc(4px + (100vw + 4px) / 6);
	}
	body.visual-impression #content .item .text { 
		font-size: calc(0.6 * 3200vw / 1440);
	}
	
	body.product ul.products .product {
		width: calc(4px + 100% / 8); 
		height: calc(4px + (100vw + 4px) / 8);
	}
	body.product ul.products .product > div {
		font-size: calc(0.6 * 3200vw / 1440);
	}
	
	.banner .cart-customlocation { right: 3.75vw; width: 7.5vw; height: 7.5vw }
	.banner .cart-customlocation > span { font-size: calc(4vw / 3) }
}
@media screen and (max-width: 1280px) {
	.content .columns { column-gap: 1em }
	
	body.product.checkout .content { max-width: 1040px; padding: 0 5% 1em; margin: 0 auto }
}

@media screen and (max-width: 1200px) {
	body.visual-impression #content .item { 
		width: calc(4px + (100vw + 4px) / 5); 
		height: calc(4px + (100vw + 4px) / 5);
	}
	body.visual-impression #content .item .text { 
		font-size: calc(6 * 0.6 * 3200vw / (5 * 1440));
	}
	
	body.product ul.products .product {
		width: calc(4px + 100% / 7); 
		height: calc(4px + (100vw + 4px) / 7);
	}
	body.product ul.products .product > div {
		font-size: calc(6 * 0.6 * 3200vw / (5 * 1440));
	}
}

@media screen and (max-width: 1152px) {
	.content .columns { column-count: 3 }
	
	.woocommerce-product-details__short-description {
		font-size: 0.8em;
		line-height: 1.35em;
	}
}

@media screen and (max-width: 1024px) {
	#menu > a[href="/projects"] { 
		width: calc(0.725 * 85%);
	}
	#menu > a[href="/mission-statement"],
	#menu > a[href="/agenda"],
	#menu > a[href="/shop"],
	#menu > a[href="/about"],
	#menu > a[href="/contact"] {
		width: calc(15% + 0.275 * 85%);
	}

	div.logo:hover > div.menu,
	div.logo.selected > div.menu { 
		width: 90%;
		padding: calc(211 * 90% / 438) 0 
				 calc( 56 * 90% / 438);
	}
	.banner > div.logo:hover > div.menu,
	.banner > div.logo.selected > div.menu { 
		top: 1vw;/*calc(48% - (390 * 53% / 438)); */
		width: 88%;
		padding: calc(211 * 88% / 438) 0 
				 calc( 56 * 88% / 438);
	}

	#content .items + div  { font-size: 0.9em; line-height: 1.2em }
	#content .items .intro-link { margin: 0.25em 0 1em }
	
/*	body.product .content { padding-right: 0 } */
	div.product > div:nth-child(2) { padding-right: 2.5% }
	body.product form.cart { right: 2.5% }
}

@media screen and (max-width: 960px) {
	body.visual-impression #content .item { 
		width: calc(4px + (100vw + 4px) / 4); 
		height: calc(4px + (100vw + 4px) / 4);
	}
	body.visual-impression #content .item .text { 
		font-size: calc(0.9 * 3200vw / 1440);
	}
	
	body.product ul.products .product {
		width: calc(4px + 100% / 6); 
		height: calc(4px + (100vw + 4px) / 6);
	}
	body.product ul.products .product > div {
		font-size: calc(5 * 0.6 * 3200vw / (4 * 1440));
	}
}

@media screen and (max-width: 864px) {
	.content .columns { column-count: 2 }
}
@media screen and (max-width: 800px) {
	#content .items + div  { font-size: 0.8em; line-height: 1.2em }
	
	body.product ul.products .product {
		width: calc(4px + 100% / 5); 
		height: calc(4px + (100vw + 4px) / 5);
	}
	body.product ul.products .product > div {
		font-size: calc(1.0 * 3200vw / 1440);
	}
}

@media screen and (max-width: 768px) {
	.content,
	/* div.product, */ body.projects .content { padding: 1em 5% }
	div.product, body.projects .content { padding-bottom: 0 }
	/* div.product img, */ .content img { 
		/* max- */ width: calc(100% / 0.9); 
		margin-left: calc(-5% / 0.9);
	}
	/* div.product .video-container, */
	.content .video-container { 
		width: calc(100% / 0.9); 
		margin-left: calc(-5% / 0.9);
	}
	div.product .video-container.ratio-4x3,
	.content .video-container.ratio-4x3 { padding-top: calc(0.75 * 10% / 0.9) }
	div.product .video-container.ratio-16x10,
	.content .video-container.ratio-16x10 { padding-top: calc(0.625 * 10% / 0.9) }
	div.product .video-container.ratio-16x9,
	.content .video-container.ratio-16x9 { padding-top: calc(0.5625 * 10% / 0.9) }
	
	
	
	.woocommerce table.shop_table_responsive tbody tr:first-child td:first-child, .woocommerce-page table.shop_table_responsive tbody tr:first-child td:first-child {}
	
	body.product.cart .content { padding-right: 5% }
	body.product.cart tr.woocommerce-cart-form__cart-item.cart_item td,
	body.product.cart thead > tr > th { border: 0 }
	body.product.cart tr.woocommerce-cart-form__cart-item.cart_item td:last-child {
		padding-bottom: 0.5em;
		border-bottom: 2px solid #fff;
	}
	body.product.cart .woocommerce .cart-collaterals .cart_totals, 
	body.product.cart .woocommerce-page .cart-collaterals .cart_totals { margin-top: 1em; max-width: none }
	body.product.cart #content .checkout-button { float: none; margin: 6px 12px; display: block }
	
}

@media screen and (max-width: 736px) {
	body { font-size: 24px }
	h6 { font-size: 0.8em; line-height: 1.25em; margin-bottom: 1.25em }

	.indexes { 
		-webkit-transform: translate(0, calc(100% - 1px));
			-ms-transform: translate(0, calc(100% - 1px));
				transform: translate(0, calc(100% - 1px));
	}

	#content .items,
	#content .items + div { height: auto; min-height: auto; display: block }
	#content .items { 
		padding: 0; 
		
		-webkit-transform: translate(0, calc(-100% - 1px));
			-ms-transform: translate(0, calc(-100% - 1px));
				transform: translate(0, calc(-100% - 1px));
	}
	#content .items p.intro-link { 
		margin: 0; 
		font-size: calc(0.9 * 6600vw / 1440);
		line-height: calc(10 * 1.35em / 9 );
		text-align: center;
	}
	#content .items p.intro-link a { top: 1px }
	#content .items p[class^="char-"] { display: none }

	#content .items + div { padding: 0.75em 1em; font-size: 1em; line-height: 1.35em }
	#content .items + div img { width: calc(100% + 2em); margin-left: -1em }
	#content .items + div .video-container { width: calc(100% + 2em); margin-left: -1em }
	#content .items + div .video-container.ratio-4x3 { padding-top: calc(0.75 * 2em) }
	#content .items + div .video-container.ratio-16x10 { padding-top: calc(0.625 * 2em) }
	#content .items + div .video-container.ratio-16x9 { padding-top: calc(0.5625 * 2em) }

	#content .columns .item { padding-right: 10%  }
	#content .columns .item.hidden { padding-bottom: 0 }
	.content .columns { padding: 0 0.3em; /* margin: -0.25em 0; */ column-count: 3; column-gap: 1em }
	
	.woocommerce-product-gallery { height: auto; max-height: none }
	.woocommerce-product-gallery img { height: auto; max-height: none }
	
	body.product input[type="button"], 
	body.product input[type="submit"], 
	body.product input[type="reset"], 
	body.product button,
	body.product .content .woocommerce-message a,
	body.product .content .woocommerce-message button,
	body.product .content .woocommerce-message .button,
	body.product .content .woocommerce-info a,
	body.product .content .woocommerce-info button,
	body.product .content .woocommerce-info .button,
	body.product .content .woocommerce-error a,
	body.product .content .woocommerce-error button,
	body.product .content .woocommerce-error .button,
	#content .woocommerce #respond input#submit.alt, 
	#content .woocommerce a.button.alt, 
	#content .woocommerce button.button.alt, 
	#content .woocommerce input.button.alt,
	#content .woocommerce #respond input#submit, 
	#content .woocommerce a.button, 
	#content .woocommerce button.button, 
	#content .woocommerce input.button,
	#content .restore-item { font-size: 24px }
	
	body.product.checkout .woocommerce form .form-row .input-text, 
	body.product.checkout .woocommerce-page form .form-row .input-text, 
	.woocommerce select, 
	.woocommerce-page select { font-size: 24px }
	
	
	body.visual-impression #content .item { 
		width: calc(4px + (100vw + 4px) / 3); 
		height: calc(4px + (100vw + 4px) / 3);
	}
	body.visual-impression #content .item .text { 
		font-size: calc(1.2 * 3200vw / 1440);
	}
	
	body.product ul.products .product {
		width: calc(4px + 100% / 4); 
		height: calc(4px + (100vw + 4px) / 4);
	}
	body.product ul.products .product > div {
		font-size: calc(3 * 0.7 * 3200vw / (2 * 1440));
	}
}

@media screen and (max-width: 600px) {
	body.product form.cart {
		position: static;
		margin-top: 0.8em;
		margin-left: -6px;
	}
}

@media screen and (max-width: 480px) {
	body { font-size: 20px }

	#header { height: 15vw }

	#menu { max-height: none }
	#menu > div.logo {
		width: 100vw;
		height: 15vw;
		background-size: auto 21.75vw;
	}
	#menu > div.title {
		top: 15vw;
		width: 100vw;
		height: 20vw;
	}
	#menu > a[href="/projects"] {
		top: 35vw; 
		width: 100%;
		height: calc(3 * (100% - 55vw) / 11 + 1px);
		background-size: 75% auto;

	}
	#menu > a[href="/mission-statement"], #menu > a[href="/agenda"], #menu > a[href="/shop"], #menu > a[href="/about"], 
	#menu > a[href="/contact"] { top: auto; width: 100%; height: calc(2 * (100% - 55vw) / 11 + 1px)  }

	#menu > a[href="/mission-statement"] { top: calc(35vw + 3 * (100% - 55vw) / 11) } 
	#menu > a[href="/agenda"] { top: calc(35vw + 5 * (100% - 55vw) / 11) } 
	#menu > a[href="/shop"] { top: calc(35vw + 5 * (100% - 55vw) / 11) } 
	#menu > a[href="/about"] { top: calc(35vw + 7 * (100% - 55vw) / 11) } 
	#menu > a[href="/contact"] { top: calc(35vw + 9 * (100% - 55vw) / 11) } 

	#menu > a[href="/visual-impression"] { height: 20vw }


	#header > div.logo {
		width: 100vw;
		height: 15vw;
		background-color: #fff;
		transition: height .3s, background-color .3s;
	}
	#header div.logo:hover,
	#header div.logo.opened { 
		height: 100vh; 
		background-color: #fff !important; 
		z-index: +9;
	}
	#header div.logo:hover:after,
	#header div.logo.opened:after {
		position: absolute;
		top: 0; right: 0;
		width: 2em;
		font-size: 1.5em;
		font-weight: 800;
		line-height: 2em;
		text-align: center;
		color: #000;
		content: 'x';
		cursor: pointer;
	}

	#header > div.logo > div.menu {
		top: 50%;
		width: 16.5vw;
		padding: calc(211 * 16.5vw / 438) 0 
			 	 calc(56 * 16.5vw  / 438);
			 	 
		-webkit-transform: translate(-50%,-50%);
			-ms-transform: translate(-50%,-50%);
				transform: translate(-50%,-50%);
	}
	#header div.logo:hover > div.menu,
	#header div.logo.opened > div.menu { 
		width: 64vw;
		padding: calc(211 * 64vw / 438) 0 
			 	 calc(56 * 64vw  / 438);
			 	 
	    -webkit-transform: translate(-50%,calc(-50% - 36px));
	    	-ms-transform: translate(-50%,calc(-50% - 36px));
	    	    transform: translate(-50%,calc(-50% - 36px));
	}

	#header .banner { top: 15vw; margin-top: 4px; height: calc(37500vw / 1440) }
	body.project #header .banner { margin-top: 0; background-position: 50% calc(50% + 1.5px) }

	body.visual-impression #header .banner { background-position: 50% calc(50% - 2px) }
	body.visual-impression #header .banner,
	body.projects #header .banner { right: 0; width: 100vw }
	body.projects #header .banner { background-size: 100% auto }
	body.projects #header .banner, body.visual-impression #header .banner,
	body.agenda #header .banner, body.product #header .banner, body.contact #header .banner { height: 15vw }
	body.product #header .banner { background-image: url(images/banner-shop-portrait.svg) }
	
	#content { padding-top: calc(15vw + 37500vw / 1440) }

	body.projects #content, body.agenda #content, body.product #content, 
	body.contact #content { padding-top: 30vw }
	body.product #content,
	body.visual-impression #content { padding-top: calc(30vw + 4px) }

	.content .columns { margin-top: 0; column-count: 2 }

	.indexes { font-size: calc(6500vw / 720) }
	.indexes a { padding-top: 0.0875em; padding-bottom: 0.0875em }
	.indexes a:nth-child(n+15) { margin: -0.0875em 0 0 }

	.indexes { 
		-webkit-transform: translate(0, calc(1.35 * 6500vw / 720 - 2px));
			-ms-transform: translate(0, calc(1.35 * 6500vw / 720 - 2px));
				transform: translate(0, calc(1.35 * 6500vw / 720 - 2px));
	}
	#content .items { 
		padding: 0; 
		
		-webkit-transform: translate(0, calc(-2.2625 * 6500vw / 720 + 1px));
			-ms-transform: translate(0, calc(-2.2625 * 6500vw / 720 + 1px));
				transform: translate(0, calc(-2.2625 * 6500vw / 720 + 1px));
	}
	#content .items p.intro-link { font-size: calc(0.9 * 6500vw / 720) }
	.banner > div.logo > div.menu { display: none }

	
	body.product input[type="button"], 
	body.product input[type="submit"], 
	body.product input[type="reset"], 
	body.product button,
	body.product .content .woocommerce-message a,
	body.product .content .woocommerce-message button,
	body.product .content .woocommerce-message .button,
	body.product .content .woocommerce-info a,
	body.product .content .woocommerce-info button,
	body.product .content .woocommerce-info .button,
	body.product .content .woocommerce-error a,
	body.product .content .woocommerce-error button,
	body.product .content .woocommerce-error .button,
	#content .woocommerce #respond input#submit.alt, 
	#content .woocommerce a.button.alt, 
	#content .woocommerce button.button.alt, 
	#content .woocommerce input.button.alt,
	#content .woocommerce #respond input#submit, 
	#content .woocommerce a.button, 
	#content .woocommerce button.button, 
	#content .woocommerce input.button,
	#content .restore-item { font-size: 20px }
	
	body.product.checkout .woocommerce form .form-row .input-text, 
	body.product.checkout .woocommerce-page form .form-row .input-text, 
	.woocommerce select, 
	.woocommerce-page select { font-size: 20px }
	
	#add_payment_method #payment ul.payment_methods li img, 
	.woocommerce-cart #payment ul.payment_methods li img, 
	.woocommerce-checkout #payment ul.payment_methods li img { width: auto }
	
	body.visual-impression #content .item { 
		width: calc(4px + (100vw + 4px) / 2); 
		height: calc(4px + (100vw + 4px) / 2);
	}
	body.visual-impression #content .item .text { 
		font-size: calc(1.8 * 3200vw / 1440);
	}
	
	body.product ul.products .product {
		width: calc(4px + 100% / 3); 
		height: calc(4px + (100vw + 4px) / 3);
	}
	body.product ul.products .product > div {
		font-size: calc(3 * 1.1 * 3200vw / (2 * 1440));
	}
	
	body.product div[id^="product"] { margin-top: 4px }
}

@media screen and (max-width: 480px) {
	body.product #content .content { padding-right: 5% }
	body.product div[id^="product"] > div { 
		width: 100%; 
		margin-bottom: 1em; 
		display: block;
	}
	
	body.product form.cart { position: absolute; right: 2px; margin: 0 }
	body.product .summary.entry-summary { padding-right: 0 }
	body.product .woocommerce-product-details__short-description { font-size: 1em; line-height: 1.35em }
	body.product .content img { width: 100%; height: auto; max-height: none }
	
	body.product.checkout .woocommerce ul.order_details li strong { position: static; padding-bottom: 0.5em; display: block }
	body.product.checkout .woocommerce .col2-set .col-2,
	body.product.checkout .woocommerce-page .col2-set .col-2 { margin-top: 1em }
}



@media screen and (max-height: 414px) {
	#menu { height: 100vh; min-height: 320px }
	#menu > div.title, #menu > div.logo,
	#menu > a[href="/visual-impression"] { height: 12.5vw }
	#menu > a[href="/projects"] { top: 12.5vw; width: 70%; height: calc(100% - 25vw) }
	#menu > a[href="/agenda"], #menu > a[href="/shop"], #menu > a[href="/about"], #menu > a[href="/contact"], 
	#menu > a[href="/mission-statement"] { width: 30%; height: calc(1px + 126 * (100% - 25vw) / 504); background-size:auto 110% }
	#menu > a[href="/mission-statement"] { top: 12.5vw }
	#menu > a[href="/agenda"], #menu > a[href="/shop"] { top: calc(12.5vw + 126 * (100% - 25vw) / 504) }
	#menu > a[href="/about"] { top: calc(12.5vw + 252 * (100% - 25vw) / 504) }
	#menu > a[href="/contact"] { top: calc(12.5vw + 378 * (100% - 25vw) / 504) }
}