/* COMMON ROOT */

html {
  font-size: 10px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  box-sizing: border-box;
}


body { background-color: #ffffff; font-family: "Roboto Condensed", "Helvetica", "Arial", sans-serif;   box-sizing: border-box; }
p { margin: 0px; padding: 0px; }
img { border: 0pt none; }
table.md-struct { border: 0 none; border-collapse:collapse;}
table.md-struct td { padding: 0;}


/* COMMON PANELS */ 

.md-splash { position: absolute; width: 400px; height: 200px; left: 50%; top: 50%; margin-left: -200px; margin-top: -120px; background-color: #ffffff; }

.md-root { position: absolute; width: 100%; height: 100%; left: 0px; top: 0px; overflow: hidden; disablemin-width: 700px; min-height: 605px; }

.md-panel-logo { position: absolute; top: 20px; left: 20px; }
.md-panel-logo img { height: 33px; }

.md-panel-title { position: absolute; top: 20px; right: 20px; }
.md-panel-title p { font-size: 44px; line-height: 0.7; color: #dddddd; }

.md-panel-navigation { position: absolute; bottom: 20px; left: 20px; }
.md-panel-navigation a, a.md-back, .md-panel-logo span { display: inline-block; *display: inline; zoom: 1; margin-right: 20px; font-size: 12px; line-height: 1.0; color: #777777; vertical-align: bottom; text-transform: uppercase; }
.md-panel-navigation a:link, .md-panel-navigation a:visited, a.md-back:link, a.md-back:visited { color: #777777; text-decoration: none; }
.md-panel-navigation a:hover, .md-panel-navigation a.active, a.md-back:hover, a.md-back:active { color: #000000; text-decoration: none; }
   
.md-panel-footer { font-weight: 300; position: absolute; bottom: 0; right: 0; cursor: pointer; padding: 10px; }
.md-panel-footer p { font-size: 10px; text-transform: uppercase; line-height: 1.0; color: #777777; white-space: nowrap; }
.md-panel-footer a { font-size: 10px; line-height: 1.0; color: #777777; }
.md-panel-footer a:link, .md-panel-footer a:visited { color: #777777; text-decoration: none; }
.md-panel-footer a:hover { color: #000000; text-decoration: none; }



/* STUDIO */

.md-panel-studio { position: absolute; left: 20px; top: 50%; margin-top: -140px; white-space: nowrap; }
.md-panel-studio p { font-size: 12px; text-transform: uppercase; line-height: 1.8; color: #777777; text-align: justify; white-space: normal; }

.md-studiopanel { display: inline-block; *display: inline; zoom: 1; vertical-align: top; }

.md-black { color: black; }


/* STUDIO */

.md-panel-careers-root {
	position: absolute; 
	left: 20px;
	top: 50%;
	transform: translateY(-55%);
}

.md-panel-careers-root a {
/* 	font-family: "Cuprum", sans-serif;  */
	font-size: 32px;
	color: #777777;
	text-decoration: none;
	line-height: 2.0;
}

.md-panel-careers-root a:hover {
	color: black;
	text-decoration: none;
}


.md-panel-careers {/*  font-family: "Cuprum", sans-serif; font-weight: 400;  */
	position: absolute; 
	width: 100%; 
	height: calc(100% - 160px); 
	left: 0; 
	top: 80px;
}


.md-panel-careers-gradient {
	position: absolute;
	left: 0;
	width: 100%;
	bottom: 0;
	height: 100px;
	background: linear-gradient(180deg, rgba(255,255,255,0.0) 0%, rgba(255,255,255,1.0) 100%);
}


.md-panel-careers-gradient-top {
	position: absolute;
	left: 0;
	width: 100%;
	top: 0;
	height: 20px;
	background: linear-gradient(180deg, rgba(255,255,255,1.0) 0%, rgba(255,255,255,0.0) 100%);
}


.md-panel-careers-scroll {
	position: absolute;
	overflow: auto; 
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.md-panel-careers-inner {
	width: 560px;
	margin-top: 40px;
	margin-bottom: 100px;
	padding: 0 20px;
	box-sizing: border-box;
	position: relative;
	
}

.md-panel-careers-section {
	margin-bottom: 50px;
	font-weight: 400; 
}

.md-panel-careers-section {
	font-weight: 300;
}

.md-panel-careers p,
.md-panel-careers li { font-size: 16px; line-height: 1.4; color: #777777; text-align: justify; white-space: normal; }

.md-panel-careers p {
	margin-bottom: 10px;
}

.md-panel-careers ul { 
	-webkit-padding-start: 20px;
	list-style-type: square;
	padding-left: 18px;
}

.md-panel-careers li { 
	margin-bottom: 2px;
}

.md-panel-careers h2 {
	margin-top: 0;
	margin-bottom: 10px;
}

.md-panel-careers .switch-language {
	position: absolute;
	top: 4px;
	right: 20px;
	font-weight: 300;
	font-size: 16px;
/* 	color: #777; */
	text-decoration: none;
	background-color: black;
	color: white;
	width: 24px;
	line-height: 24px;
	text-align: center;
}

.md-panel-careers .switch-language:hover {
/* 	color: black; */
	text-decoration: none;
	background-color: #777;
}

.md-panel-careers h2 {
	margin-bottom: 20px;
}

.md-panel-careers h3 {
	margin-top: 20px;
	margin-bottom: 10px;
}

.md-panel-careers-emailLink {
	font-size: 24px;
	color: black;
	text-decoration: none;
}

.md-panel-careers-emailLink:hover {
	color: #777;
}



.md-studiopanel { display: inline-block; *display: inline; zoom: 1; vertical-align: top; }

.md-black { color: black; }



/* CONTACT */

.md-panel-contact { position: absolute; left: 20px; top: 50%; width: 1040px; margin-top: -140px; }
.md-panel-contact span { white-space: nowrap; }
.md-contactpanel { font-size: 12px; text-transform: uppercase; line-height: 1.8; color: #777777; text-align: justify; display: inline-block; *display: inline; zoom: 1; vertical-align: top; }


textarea, input { background-color: #eeeeee; height: 16px; border: 0px; font-size: 12px; width: 240px; font-family: "Roboto Condensed", "Helvetica", "Arial", sans-serif; color: #7f7f7f; margin-top: 0px; margin-bottom: 4px; padding: 10px; text-transform: uppercase;}
input.button { background-color: #575757; color: #ffffff; width: auto; margin-top: 3px; font-family: "Roboto Condensed", "Helvetica", "Arial", sans-serif; height: auto; margin-left: 10px; cursor: pointer; }

.md-return { position: absolute; top: 50%; margin-right: 20px; right: 0px; margin-top: 210px; overflow: hidden; }

.md-panel-thanks { color: #777777; position: absolute; left: 20px; top: 50%; width: 1040px; margin-top: -140px; }
.md-panel-thanks p { font-size: 96px; text-transform: uppercase; line-height: 1.0; color: #dddddd; white-space: normal; letter-spacing: -4px; }

.md-panel-thanks a { line-height: 1.0; color: #dddddd; }
.md-panel-thanks a:link { color: #dddddd; text-decoration: none; }
.md-panel-thanks a:hover { color: #000000; text-decoration: none; }


/* PRESS */

.md-panel-press { position: absolute; left: 20px; top: 50%; width: 1040px; margin-top: -140px; }
.md-panel-press p { font-size: 200px; text-transform: uppercase; line-height: 1.0; color: #dddddd; text-align: justify; white-space: normal; letter-spacing: -4px; }


/* PRODUCTS */

.md-panel-products { position: absolute; left: 20px; top: 50%; width: 1040px; margin-top: -140px; }
.md-panel-products p { font-size: 200px; text-transform: uppercase; line-height: 1.0; color: #dddddd; text-align: justify; white-space: normal; letter-spacing: -7px; }



/* INTERIORS */

.md-panel-interiors { position: absolute; height: 400px; top: 50%; left: 0px; width: 100%; margin-top: -200px; white-space: nowrap; overflow: hidden; }




.md-panel-interiors-N {
	position: absolute; 
	height: 400px; 
	top: 50%; 
	left: 0px; 
	width: 100%; 
	margin-top: -200px; 
	white-space: nowrap; 
	overflow: hidden;
}

.md-panel-interiors-N .md-selector {
	width: 50%;
	height: 100%;
	position: absolute;
	top: 0;
	background-position: center center;
	filter: grayscale(100%);
}

.md-panel-interiors-N .md-selector:hover {
	filter: grayscale(0%);
}

.md-panel-interiors-N .md-selector .md-selectorLabel {
	position: absolute;
	font-size: 120px;
	letter-spacing: -4px;
	color: #ffffff;
	bottom: 0;
	line-height: 82px;
	cursor: pointer;
	font-weight: 400; 
	text-transform: uppercase;
}

.md-panel-interiors-N .md-selector.mod-residential {
	left: 0;
	background-image: url("../images/interiors-private-hover.jpg");
	background-size: cover;
}

.md-panel-interiors-N .md-selector.mod-residential .md-selectorLabel {
	left: 20px;
}

.md-panel-interiors-N .md-selector.mod-commercial {
	right: 0;
	background-image: url("../images/interiors-public-hover.jpg");
	background-size: cover;

}

.md-panel-interiors-N .md-selector.mod-commercial .md-selectorLabel {
	right: 20px;
}


@media (max-width: 1439px) {
	.md-panel-interiors-N .md-selector .md-selectorLabel {
		font-size: 100px;
		line-height: 68px;
	}
}


@media (max-width: 1279px) {
	.md-panel-interiors-N .md-selector .md-selectorLabel {
		font-size: 80px;
		line-height: 54px;
	}
}

@media (max-width: 1023px) {
	.md-panel-interiors-N .md-selector .md-selectorLabel {
		font-size: 64px;
		line-height: 42px;
	}
}

@media (max-width: 767px) {
	
	.md-panel-interiors-N {
		height: 600px; 
		margin-top: -300px; 
	}
	.md-panel-interiors-N .md-selector {
		width: 100%;
		height: 50%;	
	}
	.md-panel-interiors-N .md-selector.mod-residential {
		top: 0;	
		left: 0;
	}
	.md-panel-interiors-N .md-selector.mod-commercial {
		top: auto;
		bottom: 0;
		left: 0;
	}
	.md-panel-interiors-N .md-selector .md-selectorLabel {
		font-size: 64px;
		line-height: 42px;
	}
	.md-panel-interiors-N .md-selector.mod-commercial .md-selectorLabel {
		left: 20px;
		right: auto;
	}
}




.md-gallery { position: absolute; top: 50%; left: 0px; width: 100%; white-space: nowrap; overflow: hidden; }
.md-gallery-main { margin-top: -200px; }
.md-gallery-inside { margin-top: -200px; }

.md-galleryitem { disablemax-width: 100vw; display: inline-block; *display: inline; zoom: 1; margin-right: 1px; vertical-align: top; }
.md-galleryitem img { width: 100%; }

.md-image { position: relative; }

.md-image-normal { position: absolute; top: 0px; left: 0px; z-index: 400; cursor: pointer; }
.md-image-hover { z-index: 500; }
.md-title { position: absolute; font-size: 80px; letter-spacing: -4px; color: #ffffff; bottom: 0px; line-height: 54px; cursor: pointer; font-weight: 400; }


.md-info { margin-left: 20px; margin-top: 10px; font-size: 16px; color: #777777; text-transform: uppercase; }
.md-gallery-inside-mask .md-info { position: absolute; top: 50%; margin-top: 210px; }

.md-year, .md-name, .md-button-info { display: inline-block; vertical-align: top; }
.md-year { margin-right: 5px; color: #000000; }
.md-name { margin-right: 10px; }
.md-button-info { background: url("../images/info.png") no-repeat; margin-top: 1px; margin-right: 10px; width: 24px; height: 14px; display: inline-block; *display: inline; zoom: 1; display: none; }
.md-details { font-size: 12px; font-size: 12px; width: 900px; display: inline-block; text-align: justify; }

.md-selector { position: absolute; height: 430px; top: 0; width: 50%; white-space: nowrap; overflow: hidden; }
.md-selector img { margin-top: 30px; }

.md-back { position: absolute; top: 50%; margin-right: 20px; right: 0px; margin-top: 210px; overflow: hidden; }