﻿@media screen and (max-width: 1150px) {
	.project-detail .left img{width:100%;}
    .project-footer .get-in-touch .contact .span50{margin-bottom:10px;}
    .project-footer .get-in-touch .contact p.min{font-size:16px;}
    .project-result .desc-container .statistics{margin-top:5%;}
    .works-content.get-in-touch .left h1,
    .works-content.where-we-work h1{font-size: 5vw; }
    .works-content.where-we-work h1,
    .works-content.get-in-touch .left{padding-left: 5%; width: 45%;}
    .works-content.where-we-work p{width: 43%;}
    .works-content.brands p,
    .works-content.strategy p{width:80%;}
    .works-content-block{width:90%; padding:0 5%;}
    .center-text.artema-strategy{width:90%; padding:5%;}
    .center-text.artema-strategy .left{width:50%; float:left;}
    .center-text.artema-strategy .right{width:50%; float:left;}
    .artema-design{width: 90%; padding: 10% 5%;}
    .project-result.project-result-eak .desc-container{ margin-left:5%; width:90%; }
    .project-result.project-result-eak .bg{right:5%; width:33%;}
    .project-result.project-result-eak .statistics span{font-size:6vw; }
    .center-text h2,
    .center-text p{width:90%;}
    .design-sub-base{width: 90%; padding: 0 5% 10%;}
    .design-base{width: 90%; padding: 10% 5% 10%;}
    .project-result.project-result-avea .desc-container{margin: 10% 0 10% 5%; width: 65%;}
    .project-result.project-result-avea .desc-container .statistics{width:100%;}
    .project-result.project-result-avea .desc-container p{width:80%;}
    .project-result.project-result-avea .statistics span{font-size:6vw;}
    .center-text2 div{ width:80%;}
	.center-text2 div p { font-size:2vw; line-height:2.5vw; padding: 0 25%; }
	.center-text2 div h5 { font-size:3.8vw; margin: 10% 25%; }
	.magazine { margin-left:20% }
	.recent-work #portfolio .item { width:33.333333333%;}
	.blog header .tag-open-container{right:11%;}
	.blog header .search-open-container{right:18%;}
	.blog-detail-right{padding: 0 5%; width:40%;}
}
@media screen and (max-width: 1024px) {
    .project-footer .get-in-touch .contact .span50{width:100%; margin: 10px 0;}
    .project-footer .get-in-touch .top h1{font-size:3vw;}
	.project-footer .more-work p {font-size:2vw;}
    .project-footer .get-in-touch .contact p{margin-top:0; font-size:18px;}
    .works-content.get-in-touch .left,
    .works-content.get-in-touch .right{width:90%; padding:0 5%;}
    .works-content.get-in-touch .right{margin-top:80px;}
    .works-content.get-in-touch .right .span45{width:50%;}
    #map {height: 450px;}
    .center-text.artema-strategy{width:90%; padding:5%;}
    .center-text.artema-strategy .left{width:50%; float:left;}
    .center-text.artema-strategy .right{width:50%; float:left;}
	
}
@media screen and (max-width: 1050px) {
	.recent-work #filter-list li {font-size: 14px;}
}
@media screen and (max-width: 950px) {
    .project-detail .right h2{font-size:20px;}
    .center-text h1,
    .center-text h2,
    .center-text p,
    .project-result .desc-container h1,
    .project-result .desc-container p{width:80%;}
    .works-content.what-we-do h2{font-size:3vw; padding:0 5%;}
    .works-content.what-we-do h2 br{display:none;}
    .top-cover .text p{padding:0 5%;}
    .top-cover .text p br{display:none} 
    .works-content.strategy h2{padding:0 5%;}
    .works-content.brands p, 
    .works-content.strategy p{width:90%;}
    .project-result .desc-container .statistics p{font-size:18px;}
    .project-result.project-result-thc .desc-container{margin: 14% 5% 12% 0;}
    .project-result.project-result-thc .bg{width:53%;}
}
@media screen and (max-width: 855px) {
	.opr-cnt .project-desc,
	.detail-page .detail-top .project-desc { bottom: 6%; }
	.project-result .desc-container p{font-size:18px;}
	.opr-cnt .project-desc h2,
	.detail-page .detail-top .project-desc h2 { font-size:9vw; line-height:9vw; }
	.slider-size { bottom: 4%; }
	.project-detail .right h1,
	.project-result .desc-container h1,
	.center-text h1,
	.share-this h1 { font-size:6vw; }
    .project-footer .more-work-container { width:100%; }
	.project-footer .more-work p {font-size:3.5vw;}
    .project-footer .get-in-touch{width:90%;}
    .project-footer .get-in-touch .top{height:auto !important; padding:10% 5%;}
    .project-footer .get-in-touch .top h1{font-size: 5vw; margin-top:12%;}
    .project-footer .get-in-touch .top h2{font-size:10vw}
    .project-footer .contact{height:auto !important; padding:10% 5%; width:90%;}
    .project-footer .get-in-touch .contact h1{font-size:3.5vw; }
    .project-footer .get-in-touch .contact p{font-size: 6vw; margin:3% 0 5% 0; }
	.project-footer .get-in-touch .contact p.min {font-size:3.5vw; }
    .project-footer .more-work h1{font-size:10vw; line-height:10vw;}
    .project-footer figcaption div{font-size: 8vw}
    .works-content.brands ul li{width:15.4%}
	.recent-work #filter-list {clear: left; position: relative; bottom: 0; margin-right: 0; margin-left: 8%; left:-15px; float:left; margin-top: 90px;}
	.recent-work #filter-list li{font-size: 16px; margin: 0 13px}
    .recent-work #filter-list li.filter-title{  font-size: 26px; position: absolute; bottom: 50px;}
    .recent-work #portfolio .item{width:50%;}
	.project-img .span50 {width:100%;}
	.project-img .span25 {width:50%;}
	.center-text2 div p { font-size:3vw; line-height:4vw; padding: 0 10%; }
	.center-text2 div h5 { font-size:6vw; margin: 10% 10%; }
	.magazine { margin-left:8%; }
	.center-text2 { margin: 12% 0; }
	.more-work-img figcaption h3{font-size: 2.5vw; }
	.more-work-img figcaption span{font-size: 5vw;}
    .main-page .opr-img{ background-position: 25% !important}	
	.tile.work .hovercaps h3{font-size:2.5vw}
	.tile.work .hovercaps span{font-size:5vw}
	.design-sub-base .right2 .icon-cont {width: 100%; margin: 30px 0;}
}
@media screen and (max-width: 800px) {
    .project-result.project-result-thc .desc-container{margin: 14% 0% 12% 0;}
    .project-result.project-result-thc .desc-container{width: 48%;}
	.project-detail .left { width:80%; margin-bottom:10%;}
	.project-detail .left a,
	.project-detail .left p,
	.project-detail .left p span { font-size:24px; }
	.project-detail .right { width:80%; margin:10%; }
    .works-content.get-in-touch .left p{font-size: 3vw}
	.works-content.where-we-work .ping-halleri p{font-size:24px;}
	.works-content.where-we-work .ping-halleri h2{font-size:34px;}
	.design-base.basic-case-slide .bx-wrapper .bx-controls-direction{display:none;}
	.design-base.basic-case-slide .bx-wrapper .bx-pager{text-align:right; bottom:32px}
}
@media screen and (max-width: 768px) {
    .top-cover img{position:absolute; min-height:100%;}    
    .top-cover .text{position:relative; padding:100px 0;}
	.footer .footer-logo{background:url(../images/new/footer-logo2x.png); background-size: 144px 22px;}
    .footer {text-align:center;}
    .footer-logo-container{width: 495px; padding-left: 30px;}
    .footer .socials{width: 525px; text-align:center; margin-bottom: 40px; display:inline-block; float:none;}
    .footer .socials li{display:inline-block; float:left; margin: 15px;}
    .footer .socials li a{width: 45px; height:39px;}
    .footer .socials li a.fb{ background-position:-20px -321px}
    .footer .socials li a.tw{ background-position:-65px -321px}
    .footer .socials li a.in{ background-position:-110px -321px}
    .footer .socials li a.vim{ background-position:-155px -321px}
    .footer .socials li a.yt{ background-position:-200px -321px}
    .footer .socials li a.be{ background-position:-245px -321px}
    .footer .socials li a.dr{ background-position:-290px -321px}
    .footer .copyright{line-height: 36px; font-size: 20px; clear:left; padding:0; margin-top: 10px;}
    .design-sub-base.fonts .right2 .span33{width: 100%;}
	.works-content.what-we-do .block{width:86% !important; border-right:0 !important; margin:5% 7% !important; padding:0 !important}
	.works-content.what-we-do .block h3{font-size:6vw;}
	.works-content.where-we-work .where-we-work-desc{padding: 10%; width:80%; height:auto !important;}
	.works-content.where-we-work .where-we-work-desc h1,
	.works-content.strategy h1,
	.works-content.what-we-do h1,
	.top-cover .text h1,
	.works-content.get-in-touch .left h1,
	.works-content.brands h1 {font-size:8vw;}
	.where-we-work .span50{width:100%; height: auto !important;}
	.where-we-work .span25{width:50%; height: auto !important;}
	.works-content.where-we-work .ping-halleri{padding: 10% 0;}
	.works-content.where-we-work .ping-halleri h2,
	.works-content.where-we-work .ping-halleri p{width:80%;}
	.blog header .tag-open-container{right:14%;}
	.blog header .search-open-container{right:24%;}
	.blog-detail-right-container{padding: 60px 0;}
	.blog-page{position:relative; display:inline-block;}
	.blog-detail-left{width:100%; position:relative; height:auto}
	.blog-detail-left img{min-height:initial}
	.blog-detail-right{width:90%; position:relative; height:auto;}
	.blog-page .blog-content-left{width:100%;}
	.blog-page .blog-content-left .blog-item .blog-item-right{  width: 40%;  padding: 0 5%;}
	.blog-page .blog-content-right{width:100%; height:auto;}
	.blog-page .blog-content-right .right-container{width:90%; padding:0 5%;}
}
@media screen and (max-width: 767px) {
	.blog-page .blog-content-left .blog-item .blog-item-left{width:100%;}
	.blog-page .blog-content-left .blog-item .blog-item-right{width:90%; padding: 20px 5%;}
	.blog-page .blog-content-left .blog-item .blog-item-right .tags{ margin-top: 25px;}
	.blog-page .blog-content-left .blog-item{padding:20px 0;}
}