.homeWrap{} .homeWrap .section{position:relative; background-repeat: no-repeat; background-position: center center; height: 100%; min-height:100%; /*The Magic*/ background-size:cover; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; z-index:100; width:100%; -ms-behavior: url(backgroundsize.min.htc);} .homeWrap .section .caption{position:absolute; bottom:40px; left:20px; display:none; font-size:13px; color:#FFF;} .homeWrap .section.black .caption{color:#333;} .homeWrap .section > .hitArea{position:absolute;} .homeAllWorksLink{position:fixed; background-color:#FFF; bottom:-100px; left:0; z-index:100; width:100%; padding:10px 0 15px 0;} .homeAllWorksLink a{color:#00AEEF; font-size:12px;} .homeAllWorksLink a:hover{color:#333; text-decoration:none;} .homeAllWorksLink a i{padding-left:8px; font-size:10px;} .homeNextPrev{position:fixed; bottom:40px; z-index:0; text-align: right;} .homeNextPrev a{color:#CCC; font-size:10px; cursor:pointer; padding-left:15px; padding-right:0; margin:0; position:relative; float:left; font-weight:bold;} .homeNextPrev a:hover{color:#FFF; text-decoration:none; /*opacity:1;*/} .homeNextPrev.black a{color:#666;} .homeNextPrev.black a:hover{color:#000;} @media screen and (max-width: 480px) { .homeNextPrev{bottom:20px;} .homeWrap .section .caption{bottom:20px; width: 50%;} } #workGridContainer{position:relative; z-index:0; top:184px; opacity:0; overflow-x:hidden;} #workGridContainer a{ text-decoration:none;} #workGridContainer .item {position:relative; background-repeat: no-repeat; background-position: center center; height: 100%; min-height:100%; /*The Magic*/ /*background-size:cover; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover;*/ float:left; width:50%; overflow-x:hidden;} #workGridContainer .item .caption{position:absolute; bottom:20px; left:30px; font-size:13px; color:#FFF;z-index:1;} #workGridContainer .item .caption > .cat{font-family: 'BGRegular', arial, sans-serif; font-size:10px; z-index:1; text-transform:uppercase; /*color:#00ADEF;*/ color:#DDD;} #workGridContainer .item.black .caption{color:#333;} #workGridContainer .item.black .caption > .cat{color:#222;} #workGridContainer .item .overlay{position:absolute; /*background-color:#00AEEF;*/ background-color:#000; z-index:0; width: 100%;} #workGridContainer .item .arrow{position: absolute; font-size:22px; right:35px; color:#FFF; top:45%;} @media screen and (max-width: 480px) { #workGridContainer{top:60px;} #workGridContainer .item { width: 100%; } } @media (min-width:481px) and (max-width: 767px) { #workGridContainer{top:60px;} } /*body.workSingle.loading{background-repeat: no-repeat; background-position: center 55%; background-image:url(../images/loading.gif);}*/ .progressBar{height:1px; width:0; display:block; background-color:/*#FFF*/#00AEEF; position:fixed; bottom:0; left:0; overflow:hidden; z-index:10;} #workDetailsContainer{position:relative; z-index:0; top:-25px; opacity:0;} #workDetailsContainer .workTitle{padding:146px 0 12px 0;} #workDetailsContainer .workTitle .cat{position: relative; font-family: 'BGRegular', arial, sans-serif; text-transform:uppercase; font-size:12px; color:#666; line-height:1;} #workDetailsContainer .workTitle .blueLine{position: relative; top: -8px; width:20px; height:1px; background-color:#00ADEF; display:inline-block; *display:inline; zoom:1; margin:0 auto;} #workDetailsContainer .workTitle .name{position: relative; top: -6px; display:block; margin:0 auto; font-size:15px; color:#444;} #workDetailsContainer .workTitle a{position: relative; top: -6px; font-family: 'BGRegular', arial, sans-serif; text-transform:uppercase; font-size:11.5px; color:#666; line-height:1;} #workDetailsContainer .workTitle a i{padding:0 5px; font-size:10px;} #workDetailsContainer .workTitle a:hover{color:#333; text-decoration:none;} #workDetailsContainer .workDesc{padding:50px 0 30px 0;} #workDetailsContainer .workDesc .workCol{margin-bottom:25px;} #workDetailsContainer .workDesc .cat{position: relative; font-family: 'BGRegular', arial, sans-serif; text-transform:uppercase; font-size:12px; color:#666; line-height:1;} #workDetailsContainer .workDesc .blueLine{position: relative; top: -4px; width:20px; height:1px; background-color:#00ADEF; display:inline-block; *display:inline; zoom:1;} #workDetailsContainer .workDesc .cnt{position: relative; top: 0; display:block; margin:0 auto; font-size:13px; color:#444; line-height:1.5; padding-right:50px;} #workDetailsContainer .workDesc .cnt a{color: #444;} #workDetailsContainer .workDesc .cnt a:hover{text-decoration: none; color: #00AEEF;} #workDetailsContainer .workDesc .cnt .category{position: relative; font-size:12px; color:#999; line-height:1; padding:0 0 10px 0; /*font-style:italic;*/} #workDetailsContainer .workDesc .cnt .category a{padding-bottom:1px; border-bottom:1px solid #BBB; color:#999;} #workDetailsContainer .workDesc .cnt .category a:hover{border-bottom:1px solid #00ADEF; color:#00ADEF;} #workDetailsContainer .workGallery{position:relative; text-align:center; overflow-x:hidden; overflow-y:hidden;} #workDetailsContainer .workGallery .images{/*height:600px;*/ overflow:hidden;} #workDetailsContainer .workGallery .images > .item{position: absolute; background-repeat: no-repeat; background-position: center center; height: 100%; min-height:100%; /*The Magic*/ background-size:cover; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; text-align:center; padding:0; overflow:hidden;} /*#workDetailsContainer .workGallery .images img{max-height:600px;}*/ #workDetailsContainer .workGallery .images img{position:relative;} #workDetailsContainer .workGallery .images > .item > img.thumb{display:none;} #workDetailsContainer .workGallery .images img.centerportrait{margin-top: -18px; padding-bottom:130px; /*padding-bottom:130px;*/} #workDetailsContainer .workGallery .controls{position:absolute; z-index:10; bottom: -50px; left: 50%; width:580px; margin-left: -290px; background-color:#ECECED; padding:7px 10px; color:#666;} #workDetailsContainer .workGallery .controls a{font-size:11px; cursor: default; color:#888; /*font-weight:bold;*/ font-family: 'BGRegular', arial, sans-serif; text-transform:uppercase; letter-spacing:1px; cursor:pointer;} #workDetailsContainer .workGallery .controls a:hover{text-decoration:none; color:#333;} #workDetailsContainer .workGallery .controls a.enable{cursor:pointer;} #workDetailsContainer .workGallery .controls a.enable:hover{color:#333;} #workDetailsContainer .workGallery .controls a#gotoInfo{color:#00AEEF; opacity:0.75; filter:alpha(opacity=75); -moz-opacity:0.75; -khtml-opacity: 0.75;} #workDetailsContainer .workGallery .controls a#gotoInfo:hover{text-decoration:none; color:#00AEEF; opacity:1; filter:alpha(opacity=100); -moz-opacity:1; -khtml-opacity: 1;} #workDetailsContainer .workGallery .controls .col{width: 33.3%; float:left;} #workDetailsContainer .workGallery .hitarea > .forward{position:absolute; z-index:5; width:40%; height: 200px; background-color:transparent; opacity:0.4; top:0; right:0;} #workDetailsContainer .workGallery .hitarea > .backward{position:absolute; z-index:5; width:40%; height: 200px; background-color:transparent; opacity:0.4; top:0; left:0;} #workDetailsContainer .workGallery .hitarea > a{cursor: default;} #workDetailsContainer .workGallery .hitarea > a.enable{cursor:pointer;} #workDetailsContainer .workGallery .hitarea > .arrow{opacity:0; filter:alpha(opacity=0); -moz-opacity:0; -khtml-opacity: 0;} #workDetailsContainer .workGallery .hitarea > .arrowR{position: absolute; font-size:32px; right:65px; color:#FFF; top:45%;} #workDetailsContainer .workGallery .hitarea > .arrowL{position: absolute; font-size:32px; left:65px; color:#FFF; top:45%;} .date{position: relative; font-family: 'BGRegular', arial, sans-serif; text-transform:uppercase; font-size:12px; color:#666; line-height:1; padding:4px 0 0 0;} #newsContainer {position:relative; z-index:1; top:384px;} #newsContainer .date{position: relative; font-family: 'BGRegular', arial, sans-serif; text-transform:uppercase; font-size:12px; color:#666; line-height:1; text-align:center; padding:2px 0 8px 0;} #newsContainer .date .blueLine{position: relative; top: 2px; width:20px; height:1px; background-color:#00ADEF; display:inline-block; *display:inline; zoom:1;} #newsContainer .title{font-size:15px; color:#333; text-align:center; padding:0 0 30px 0;} #newsContainer p{font-size:13px; color:#444; line-height:1.6; padding-bottom:20px; text-align: justify; text-justify: inter-word;} #newsContainer p a, #newsContainer a{color:#444; border-bottom: 1px solid #999;} #newsContainer p a:hover, #newsContainer a:hover{color:#00AEEF; border-bottom: 1px solid #00AEEF; text-decoration:none;} #newsContainer #shareWrap{margin-top: 50px; border-color:#F7F7F7;} #newsContainer p img{display: block; margin:30px auto 0 auto; padding-bottom:8px;} @media screen and (max-width: 480px) { #newsContainer{top:160px;} } @media (min-width:481px) and (max-width: 767px) { #newsContainer{top:160px;} } #shareWrap{border-top:1px solid #EDEDEE; padding:20px 10px; font-family: 'BGRegular', arial, sans-serif; text-transform:uppercase; font-size:11.5px; color:#666; line-height:1.4;} #shareWrap a{color:#666; border-bottom:1px solid transparent;} #shareWrap a i{padding:0 5px; font-size:10px;} #shareWrap a:hover{color:#333; text-decoration:none; border-bottom:1px solid transparent;} #shareWrap .socialLink a{padding:0 5px;} @media screen and (max-width: 480px) { #shareWrap{font-size:10px; padding:10px 10px;} #shareWrap a i{padding:0 2px; font-size:8px;} #workDetailsContainer .workTitle{padding:80px 0 5px 0;} #workDetailsContainer .workTitle .cat{line-height:1.6;} #workDetailsContainer .workTitle .name{font-size:14px; top:3px; padding-bottom:8px;} #workDetailsContainer .workTitle a{font-size:11px;} #workDetailsContainer .workTitle a i.icon-arrowright{font-size:8px; padding-left:3px;} #workDetailsContainer .workTitle a i.icon-arrowleft{font-size:8px; padding-right:3px;} #workDetailsContainer .workDesc{padding:25px 0 0 0;} #workDetailsContainer .workDesc .cnt{padding-right:10px;} #workDetailsContainer .workDesc .cat{font-size:11px;} #workDetailsContainer .workDesc .category{font-size:11px;} #workDetailsContainer .workGallery .controls{width:280px; margin-left:-140px;} /*#workDetailsContainer .workGallery{height:280px;} #workDetailsContainer .workGallery .images{height:280px;} #workDetailsContainer .workGallery .images img{max-height:280px;}*/ } @media (min-width:481px) and (max-width: 767px) { #shareWrap{font-size:10px; padding:15px 10px;} #workDetailsContainer .workTitle{padding:85px 0 10px 0;} #workDetailsContainer .workTitle .name{top:3px; padding-bottom:8px;} #workDetailsContainer .workGallery .controls{width:460px; margin-left:-230px;} #workDetailsContainer .workDesc{padding:25px 0 0 0;} } a.plainLink:hover{text-decoration:none;} /*@media (min-width: 1200px) and (max-width: 3000px) { #aboutWrap{height: 460px;} } @media (min-width: 768px) and (max-width: 1199px) { #aboutWrap{height: 520px;} }*/ body.workSingle #aboutWrap{z-index:5;} #aboutWrap{position:absolute; width: 100%; top:0; z-index:11; padding:50px 0 50px 0; height: 580px; overflow: hidden; font-family: 'BGRegular', arial, sans-serif; overflow-x:hidden;} @media screen and (max-width: 480px) { #aboutWrap{height: 0; padding:0;} } @media (min-width:481px) and (max-width: 767px) { #aboutWrap{height: 0; padding:0;} } #aboutWrap .container{opacity:0;} #aboutWrap a.aboutCloseLink{position: relative; display: inline-block; *display:inline; cursor:pointer; font-size:20px; color:#00AEEF; width: 21px; height: 21px; overflow: hidden;} #aboutWrap a.aboutCloseLink:hover{text-decoration:none; color:#FFF; -webkit-transform: rotate(90deg); transform: rotate(90deg); -ms-transform: rotate(90deg); transition: transform 0.5s; -webkit-transition: -webkit-transform 0.5s; -ms-transition: -ms-transform 0.5s; transform-origin: center center; -webkit-transform-origin: center center;} #aboutWrap .aboutwmw{ text-transform:uppercase;} #aboutWrap .aboutwmw p{font-size:14px; line-height:1.5; color:#00AEEF; position:relative; padding-left:4px; padding-bottom:10px;} #aboutWrap .slashTLRelative{position:absolute; top:-4px; left:-2px;} #aboutWrap .contact{padding-top:20px;} #aboutWrap .contact p{font-size:14px; color:#666; line-height:1.4; position:relative; padding-left:4px; padding-bottom:10px;} #aboutWrap .contact p a{color:#666;} #aboutWrap .contact p a:hover{color:#00AEEF; text-decoration:none;} #aboutWrap .social{padding-top: 10px;} #aboutWrap .social p{font-size:14px; color:#666; line-height:0.7; position:relative; padding-left:4px; padding-bottom:0;} #aboutWrap .social p a{color:#666; display:inline-block; *display:inline; zoom:1; float:left; margin-right:20px;} #aboutWrap .social p a:hover{color:#00AEEF; text-decoration:none;} #aboutWrap .socialLinksWrap{padding-left: 6px;} #aboutWrap .socialLinksWrap a{color:#999; display:inline-block; *display:inline; zoom:1; float:left; margin-right:12px;} #aboutWrap .socialLinksWrap a:hover{color:#666; text-decoration:none;} /*Mobile*/ #aboutPage{font-family: 'BGRegular', arial, sans-serif; } #aboutPage.hidden-xs{padding:160px 20px 80px 20px;} #aboutPage.visible-xs{padding:110px 20px 80px 20px;} #aboutPage .aboutwmw{ text-transform:uppercase;} #aboutPage .aboutwmw p{font-size:14px; line-height:1.5; color:#00AEEF; position:relative; padding-left:4px; padding-bottom:10px;} #aboutPage .slashTLRelative{position:absolute; top:-4px; left:-2px;} #aboutPage .contact{padding-top:20px;} #aboutPage .contact p{font-size:14px; color:#666; line-height:1.4; position:relative; padding-left:4px; padding-bottom:10px;} #aboutPage .contact p a{color:#666;} #aboutPage .contact p a:hover{color:#00AEEF; text-decoration:none;} #aboutPage .social{padding-top: 10px;} #aboutPage .social p{font-size:14px; color:#666; line-height:0.7; position:relative; padding-left:4px;} #aboutPage .social p a{color:#666; display:inline-block; *display:inline; zoom:1; float:left; margin-right:20px;} #aboutPage .social p a:hover{color:#00AEEF; text-decoration:none;} #aboutPage .socialLinksWrap{padding-left: 6px;} #aboutPage .socialLinksWrap a{color:#999; display:inline-block; *display:inline; zoom:1; float:left; margin-right:12px;} #aboutPage .socialLinksWrap a:hover{color:#666; text-decoration:none;} @media screen and (max-width: 480px) { #aboutPage .aboutwmw p{font-size:14px; line-height:1.6;} #aboutPage .contact p{line-height:1.4;} #aboutPage .social p{line-height:1;} }