/** Font Face */
@font-face {
    font-family: 'AvenirLTStd95Black';
    src: url('../fonts/avenirltstd-black.eot');
    src: url('../fonts/avenirltstd-black.eot?#iefix') format('embedded-opentype'),
		 url('../fonts/avenirltstd-black.svg#AvenirLTStd95Black') format('svg'),
         url('../fonts/avenirltstd-black.woff') format('woff'),
         url('../fonts/avenirltstd-black.ttf') format('truetype');
	font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'AvenirLTStd35Light';
    src: url('../fonts/avenirltstd-light.eot');
    src: url('../fonts/avenirltstd-light.eot?#iefix') format('embedded-opentype'),
         url('../fonts/avenirltstd-light.woff') format('woff'),
         url('../fonts/avenirltstd-light.ttf') format('truetype'),
         url('../fonts/avenirltstd-light.svg#AvenirLTStd35Light') format('svg');
	font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'AvenirLTStd85Heavy';
    src: url('../fonts/avenirltstd-heavy.eot');
    src: url('../fonts/avenirltstd-heavy.eot?#iefix') format('embedded-opentype'),
         url('../fonts/avenirltstd-heavy.woff') format('woff'),
         url('../fonts/avenirltstd-heavy.ttf') format('truetype'),
         url('../fonts/avenirltstd-heavy.svg#AvenirLTStd85Heavy') format('svg');
	font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'AvenirLTStd45Book';
    src: url('../fonts/avenirltstd-book.eot');
    src: url('../fonts/avenirltstd-book.eot?#iefix') format('embedded-opentype'),
         url('../fonts/avenirltstd-book.woff') format('woff'),
         url('../fonts/avenirltstd-book.ttf') format('truetype'),
         url('../fonts/avenirltstd-book.svg#AvenirLTStd45Book') format('svg');
	font-weight: normal;
    font-style: normal;
}

html, body {width:100%; height:100%;}

#wrapper {position:relative; width:100%; height:auto; min-height:100%;}

.mainPage {position:relative; width:100%; height:100%;}

/** Slider **/
.slides li {position:relative;}
.slides li span {position:absolute; bottom:54px; width:90%; padding:0px 5%; font-family:AvenirLTStd95Black; font-size:30px; color:#fff; line-height:45px; text-align:center; display:block; filter:alpha(opacity=0); z-index:9;}
.slide-black {position:absolute; top:0px; left:0px; width:100%; height:100%; background:url(../img/slider-bg.png); z-index:8;}

.logo-menu {position:fixed; width:60px; top:25px; left:25px; z-index:99;}
.logo {float:left; width:60px; height:47px; background:url(../img/logo.png) center bottom no-repeat;}
.logo a {float:left; width:60px; height:47px; display:block;}
.line {float:left; width:60px; height:1px; margin:18px auto 4px; background:#000000; opacity:0.5; filter:alpha(opacity=50);}
.menu {float: left; width:60px; height:18px; background:url(../img/menu.png) center bottom no-repeat; cursor:pointer;}
.menu-open {pointer-events: none; cursor:default;}

.logo-main {background:url(../img/logo.png) center top no-repeat;}
.line-main {background:#ffffff;}
.menu-main {background:url(../img/menu.png) center top no-repeat;}

.logo-menu-close {position:fixed; width:60px; top:25px; left:25px; display:none; z-index:99999;}
.logo-close {float:left; width:60px; height:47px; background:url(../img/logo.png) center top no-repeat;}
.line-close {float:left; width:60px; height:1px; margin:18px auto 22px; border-bottom:1px solid #ffffff; opacity:0.5; filter:alpha(opacity=50);}
.menu-close {float: left; width:60px; height:18px; background:url(../img/menu-close.png) center top no-repeat; cursor:pointer;}

.language {position:fixed; top:32px; right:30px; font-size: 12px; color: #000; z-index:9;}
.language a {font-family:AvenirLTStd95Black; font-size: 11px; color: #828282; padding-bottom:2px; margin:0 10px; transition: all 0.5s ease;}
.language a:hover {color:#000; border-bottom:1px solid #000;}
.language a.selected {color: #000; border-bottom:1px solid #000;}

.language-main {color: #828282;}
.language-main a {color: #828282; padding-bottom:2px; border-bottom:1px solid #828282; transition: all 0.5s ease;}
.language-main a:hover {color:#fff; border-bottom:1px solid #fff;}
.language-main a.selected {color: #fff; border-bottom:1px solid #fff;}

.menu-bg {position:fixed; width:100%; height:90px; background:#fff; z-index:8; display:none;}

.about-image {width:100%; height:auto; display:block;}

/** Portfolio **/
.portfolio {position:relative; float:left; width:100%; height:auto; text-align:center; padding-bottom:20px;}
.portfolio ul {position:relative; width:928px; height:auto; margin:0 auto; margin-top:90px; display:inline-block;}
.portfolio ul li {position:relative; float:left; width:460px; height:273px; margin:2px; text-align:left; overflow:hidden;}
.portfolio-head {position:relative; float:left; width:434px; height:auto; background:url(../img/head-bg.png); padding:13px; z-index:2;}
.portfolio-head .title {font-family:AvenirLTStd85Heavy; font-size:20px; color:#fff; line-height:20px; display:block;}
.portfolio-head .date {font-family:AvenirLTStd85Heavy; font-size:12px; color:#fff; display:block;}
.portfolio-line {position:relative; float:left; width:100%; height:0%; background:url(../img/head-bg.png); z-index:2;}
.portfolio-image {position:absolute; top:0px; left:0px; z-index:1;}
.portfolio-image img {width:100%; height:auto;}
.portfolio ul li .detail {position:absolute; left:50%; top:50%; font-family:AvenirLTStd85Heavy; font-size:12px; color:#fff; border:2px solid #fff; padding:13px 20px; z-index:3; display:none;}
.portfolio ul li .detail::after {content: ''; width:6px; height:12px; background:url(../img/detail.png) right center no-repeat; padding-left:16px;}

/** Portfolio Detail **/
.portfolio-detail {position:relative; width:80%; height:auto; margin:0 auto; text-align:center;}
.detail-image {float:left; width:60%; height:auto; margin-right:3%;}
.detail-image li {float:left; width:100%; height:auto; margin-bottom:5px;}
.detail-image img {width:100%; height:auto; display:block;}

.detail-content {position:fixed; top:80px; left:60%; width:32%; height:auto;}
.detail-head {float:left; width:100%; height:auto; margin-bottom:20px; text-align:left;}
.detail-head .title {font-family:AvenirLTStd85Heavy; font-size:40px; color:#000; line-height:40px; display:block;}
.detail-head .date {font-family:AvenirLTStd45Book; font-size:20px; color:#000; line-height:20px; display:block;}

.property {float:left; width:100%; height:auto; margin-bottom:20px; text-align:left;}
.property li {float:left; width:100%; height:auto; font-size:13px; margin:4px auto; display:block;}
.property li span {font-family:AvenirLTStd45Book; font-size:13px;}
.property .a {float:left; width:25%;}
.property .b {float:left; width:10%; text-align:center;}
.property .c {float:left; width:65%;}

.detail-detail {float:left; width:95%; height:auto; text-align:left;}
.detail-detail .title {font-family:AvenirLTStd85Heavy; font-size:13px; margin-bottom:6px; display:block;}
.detail-detail .cont {font-family:AvenirLTStd45Book; font-size:12px; margin-bottom:6px; display:block;}

.detail-prev-next {position:relative; float:left; width:100%; height:auto; margin-top:28px; padding-top:15px; margin-bottom:20px; border-top:1px solid #21282a;}
.detail-prev {font-family:AvenirLTStd85Heavy; float:left; font-size:13px; cursor:pointer;}
.detail-prev::before {content: ''; background:url(../img/detail-prev.png) left center no-repeat; padding-left:16px;}
.detail-next {font-family:AvenirLTStd85Heavy; float:right; font-size:13px; cursor:pointer;}
.dn-select {opacity:0.5!important; cursor:default;}
.detail-next::after {content: ''; background:url(../img/detail-next.png) right center no-repeat; padding-left:16px;}
.all-proje {position:absolute; width:18px; height:16px; top:15px; left:50%; margin-left:-9px; background:url(../img/all-proje.png) no-repeat; cursor:pointer;}

.loading-works {position:fixed; width:100%; height:100%; left:0px; top:0px; background:url(../img/black-loading.gif) center center no-repeat; background-size:100px 100px; display:none; z-index:99;}

/** Contact **/
.contact {position:relative; width:100%; height:auto; margin:0 auto; text-align:center;}
#map-canvas {position:relative; float:left; width:60%; height:auto; min-height:100%; margin-right:3%;}

.contact-content {position:absolute; top:80px; left:63%; width:32%; height:auto; text-align:left;}
.contact-content .title {font-family:AvenirLTStd85Heavy; font-size:20px; line-height:20px; margin-bottom:5px; display:block;}
.contact-content .contact-text {font-family:AvenirLTStd45Book; font-size:14px; margin-bottom:40px; display:block;}
.contact-social-title {font-family:AvenirLTStd85Heavy; font-size:20px; line-height:20px; margin-bottom:11px; display:block;}
.contact-social {float: left; width:100%; height:auto; margin-bottom:40px;}

.contact-social .facebook {float:left; width:15px; height:23px; margin-right:10px; padding:5px; background:url(../img/social.png) 8px 8px no-repeat; display:block; transition: all 0.5s ease;}
.contact-social .linkedin {float:left; width:18px; height:18px; margin-right:37px; padding:8px; background:url(../img/social.png) -48px 8px no-repeat; display:block; transition: all 0.5s ease;}
.contact-social .google {float:left; width:23px; height:20px; margin-right:17px; padding:8px; background:url(../img/social.png) -107px 8px no-repeat; display:block; transition: all 0.5s ease;}
.contact-social .instagram {float:left; width:20px; height:20px; padding:8px; background:url(../img/social.png) -170px 8px no-repeat; display:block;}

.contact-social .facebook:hover {background-position:8px -37px;}
.contact-social .linkedin:hover {background-position:-48px -37px;}
.contact-social .google:hover {background-position:-107px -39px;}
.contact-social .instagram:hover {background-position:-170px -39px;}

/** Main **/
.main {position:relative; width:60%; height:auto; margin:0 auto;}
.main-text {position:relative; float:left; width:100%; height:auto; margin-top:115px;}
.main-text .title {font-family:AvenirLTStd95Black; font-size:100px; line-height:100px; margin-bottom:10px; display:block;}
.main-text .text {font-family:AvenirLTStd35Light; font-size:15px; margin-bottom:20px; line-height:22px; display:block;}
.main-text a {font-family:AvenirLTStd85Heavy; font-size:13px; border:1px solid #000; padding:12px 32px; display:inline-block;}
.main-text a:after {content: ''; background:url(../img/blog.png) left center no-repeat; padding-left:6px; margin-left:10px;}
.main-text a:hover {color:#fff; background:#000;}
.main-text a:hover:after {background:#000 url(../img/blogOver.png) left center no-repeat;}

/** Press **/
.press {position:relative; width:60%; height:auto; margin:0 auto;}
.press-text {position:relative; float:left; width:100%; height:auto; margin-top:115px;}
.press-text .title {font-family:AvenirLTStd95Black; font-size:100px; line-height:100px; margin-bottom:10px; display:block;}
.press-text .text {font-family:AvenirLTStd35Light; font-size:15px; margin-bottom:20px; line-height:22px; display:block;}
.press-image {float:left; width:100%; height:auto;}
.press-image img {width:100%; height:auto;}

/** Error **/
.error {position:absolute; width:100%; height:100%; z-index:9999; background:#141213; display:table;}
.error span {font-family:AvenirLTStd95Black; font-size:14px; color:#fff; display:table-cell; vertical-align:middle;}

@media screen and (min-width:1590px) {
	.portfolio ul {width:1392px;}
	.portfolio ul li {width:460px; height:273px;}
	.portfolio-head {width:434px;}
}

@media screen and (max-width:1224px) {
	.portfolio ul {width:808px;}
	.portfolio ul li {width:400px; height:237px;}
	.portfolio-head {width:374px;}
}

@media screen and (max-width:1024px) {
	.portfolio ul {width:688px;}
	.portfolio ul li {width:340px; height:201px;}
	.portfolio-head {width:314px;}
}

@media screen and (max-width:900px) {
	.portfolio ul {width:304px;}
	.portfolio ul li {width:300px; height:178px;}
	.portfolio-head {width:274px;}
	.logo-menu {position:fixed; width:145px; top:25px; left:25px;}
	.menu {margin-top:15px;}
	.line {float:left; width:1px; height:47px; margin:0px 2px 0px 18px; background:#000;}
	.line-main {background:#ffffff;}
	.menu-bg {display:block;}
	
	.logo {background: url(../img/logo_mobil.png) no-repeat center bottom; background-size: 51px auto;}
	.logo-main {background:url(../img/logo_mobil.png) center top no-repeat; background-size: 51px auto;}
	
	.logo-menu-close {position:fixed; width:141px;}
	.line-close {float:left; width:1px; height:47px; margin:0px 2px 0px 18px; background:#ffffff;}
	.menu-close {margin-top:15px;}
	
	.overlay nav {top:58%!important;}
	.overlay ul li a {font-size:50px!important; line-height:50px!important;}
	
	.portfolio-detail {width:100%;}
	.detail-content {position:relative; width:80%; left:0px; top:0px; margin-top:100px; display:inline-block;}
	.detail-image {float:left; width:100%; height:auto; margin-right:0%;}
	
	.contact {width:80%;}
	.contact-content {position:relative; float:left; left:0px; top:0px; margin-top:120px; width:100%;}
	#map-canvas {width:100%; margin-right:0%;}
	
	.main {width:80%;}
	.main-text .title {font-size:50px; line-height:50px;}
	
	.press {width:80%;}
	.press-text .title {font-size:50px; line-height:50px;}
	.press-image {width:100%;}
}