
@media (max-width:1439px){
	.container{width: 1170px}

	
	/*about*/
	.col-sm-8.col-sm-offset-2{ float: none;  margin: 0 auto;  padding: 0;   width: 80%;}
	/*blog*/
	.blog-detail{margin:60px 15px 51px}

	/*project*/
	.grid-item .figure-caption{padding:15px;}	
	.grid-item .figure-caption h3{font-size:38px;line-height:38px;padding-bottom:10px;}
	.grid-item .figure-caption p{padding-bottom:10px;} 

	.map{padding-bottom:72%}
	.border-btn{padding:15px 0}
	.mac-os .border-btn{padding:19px 0 10px;}


}


@media (max-width:1199px){
	.container{width: 970px}
	h3{font-size:40px; line-height: 40px;}
	h2{font-size: 46px;}
	h1{font-size:50px; line-height:50px; padding-bottom: 43px;}
	.mac-os header, .mac-os.home header{padding:25px 15px 15px}
	.mobile-menu-inner .col-sm-7 {padding-right:0}
	.intro-inner h2{padding: 0; }
	.pRL{padding:0 15px 0 0}
	.smLeft, .colLeft{padding-left: 15px;}
	.smRight, .colRight{padding-right: 15px;}
	.projects-listing.visible .smRight::after{right: 15px;}
	.projects-listing.visible .colLeft::after{left: 15px;}
	.smLeft{width:60%}
	.smRight{width:40%}
	.figure-caption{padding:20px 50px}
	nav{margin-left: 0;}
	.header-logo{margin-left:0}
	nav ul li{margin: 0 12px;}
	.intro-block{padding:150px 0 134px;}
	.close-figure{right:15px; top: 15px}
	.H535 {   height: 390px;}
	.H846 {  height: 680px;}

	/*about*/	
	.col-sm-8.col-sm-offset-2{ width:100%; padding:0 15px;}
	.innerpage main {   padding-top: 110px;}
	.author-block .container{max-width:inherit}

	/*blog*/
	.blog-listing .H325{height:215px;}
	.search-blog em{width: 58px;height: 56px; margin-top: -28px;}
	.blog-detail h2{  font-size: 24px; line-height: 24px;}
	.blog-detail {  margin: 30px 15px;}

	/*project*/
	.grid-item .figure-caption h3{font-size:30px;line-height:30px;}
	.grid-item .figure-caption p{font-size:14px;line-height:18px;}

	/*contact*/
	.contact-form{margin-left: 0; width:100%;}
	.contact-form address{width:100%}
	.mac-os .border-btn{padding:18px 0 10px;}
	.mac-os nav{margin-top: 12px;}

	/*project-detail*/
	.project-detail h1{padding-right: 0; text-align:center}
	.project-detail .pRL{padding-right: 15px;padding-left:0}
	.project-detail-list{margin-left:0; width:100%; padding-top: 50px;}
	.project-detail .main-bg{padding-top: 130px; padding-bottom: 70px;}

	
	.project-detail .intro-inner h2{padding-right:10px;}
}
@media (max-width:1024px){
	.hero-banner{	background-position: 0 0 !important;background-attachment:inherit !important}
	.middle-bg{right:30%}

	.mac-os.safari .middle-bg-outer{top:0%;}
	.mac-os.chrome .middle-bg-outer{top: 18%;}

}

@media (max-width:991px){
	.container{width: 750px}

	header .col-sm-7{padding:0}
	nav ul li {   margin: 0 5px; font-size:12px;}
	nav {    margin-left:0px;}
	.header-logo em{width:170px; height:26px;}
	header, .home  header {    padding: 15px 0;}
	.mac-os header, .mac-os.home header{padding:15px 15px 10px}
	.mac-os nav{margin-top: 8px;}
	.intro-block{padding: 120px 0;}
	.projects-outer{padding-top:80px;}
	.sep {    padding-top: 60px;}
	.intro-inner h2{font-size: 36px;    line-height: 42px;}
	.intro-inner p {   font-size: 18px;    line-height: 25px;}
	.intro-inner strong{line-height:22px;}
	.H846 {	height: 520px;	}
	// .middle-bg::before{background-size:100%;width: 297px;    height: 370px;}
	.middle-bg{right:30%;width: 300px;}
	.middle-bg img{max-width:100%}
	.H776 {   height: 570px;}

	/*about*/
	.filterTabContent .col-sm-8{padding: 0 15px}

	/*blog-article*/
	.arrows .prev a:before{left:-35px;}
	.arrows .next a:after{right:-35px;}
	.arrows .next a:after, .arrows .prev a:before{width:15px; height:32px;}

	/*blog*/
	.blog-detail h2 {  font-size: 20px;  line-height: 20px;	}
	.blog-detail {  margin: 30px 0;}

	/*project*/
	.grid-item .figure-caption h3{font-size:26px;line-height:30px;}
	.grid-item .figure-caption p{display:none;}	

	/*contact*/
	.contact-detail, .form-detail{width:100%; padding:0 15px}
	.map {   padding-bottom: 50%;}
	.contact-detail{margin-bottom: 50px;}
	.map img{width:100%}
	.form-col-7, .form-col-5{width:50%; float:none; margin:0 auto; text-align:center}
	.form-col-7 img{display:inline-block; width:100%}
	.form-col-7{margin-bottom: 20px;}
	.contact-form{padding:0 15px}
	.thank-message h3{letter-spacing:0; font-size:35px;line-height:35px;}

	/*project-detail*/
	.project-detail .main-bg{    padding-top: 100px;}
	
}


@media (max-width:767px){
	.container{width: auto}

	.nav-icon {position:absolute; right:0;    top: 0px;width:60px; z-index: 11; height: 60px;   -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); cursor: pointer; }
	.nav-icon span { display: block; position: absolute; height:2px; width:28px; background: #b38f56;  opacity: 1; right: 16px; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: .25s ease-in-out; -moz-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out; }
	.nav-icon span:nth-child(1) { top:24px; }
	.nav-icon span:nth-child(2){top: 33px;}
	.menu-open .nav-icon span {background: #fff;}
	.menu-open .nav-icon span:nth-child(2) {top:24px; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); }
	.menu-open .nav-icon span:nth-child(1) { -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); }
	
	header, .home header{position:fixed; background:#fff; padding:16px 15px}
	.mac-os nav{margin-top: 0px;}
	.home header{background:transparent}
	.home header .logo-img{opacity:0}
	
	.headerInBg header {background:#fff; }
	.headerInBg header .logo-img{opacity:1}
	.header-logo em{width:153px; height:26px;}
	
	#animation_container,#canvas, #dom_overlay_container, .logo{width:265px !important; height:46px !important;}
	.banner-text{  margin-top: -47px;}
	.anchor{background-position: 0 bottom;    width:20px;  height:21px; bottom:26px; background-size:100%}

	.mobile-menu{ background:rgba(104,153,173,0.9);padding-top:60px;z-index: 9;position:fixed; right:-100%;top: 0; height:100%; width:100%;overflow-y: auto; }
	.menu-open .mobile-menu{right:0}
	
	nav{text-align:left; border-top:1px solid #d5d5d5; margin:0 0 50px;}
	nav ul li a{  padding: 13px 45px;position:relative;    color: #fff; display:block; }
	nav ul li a:after{display:none}
	nav ul li{cursor:pointer; letter-spacing:1.1px;  font-family:'Nexa-L';display:block; margin:0; font-size:18px;line-height:24px;}
	nav .menu-main-container > ul > li{ border-bottom:1px solid #d5d5d5;}
	
	.mac-os nav > ul > li.submenu, .mac-os nav ul li a{padding: 17px 45px 9px;}
	nav > ul > li.submenu > a{padding:0}

	nav ul li.submenu .arrow {padding: 0 18px; position: absolute; left:0px; top:0px;background:url(../images/right-arrow-white.svg) no-repeat 0 0; width:12px; height:52px;  background-size:12px; background-position:center center;}
	nav ul li.submenu ul{ padding:5px 60px 16px;}
	nav ul li.submenu.open .arrow{-webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg); }
	nav ul li.submenu.open {background:rgba(0,0,0,0.1)}
	nav ul li.submenu ul li a{padding:0px; border-bottom:0;   display: inline-block;}
	nav ul li.submenu ul li a:hover, nav ul li.submenu ul li a.active, nav ul li.submenu ul li a:focus{text-decoration: underline; color:#fff}
	nav ul li.submenu ul li{ line-height: 22px;    margin-bottom: 23px;}
	nav ul li.submenu ul li:last-child{margin-bottom: 0;}
	nav .menu-main-container > ul > li:hover,nav .menu-main-container ul > li.active {background:rgba(0,0,0,0.1); color:#fff}
	nav .menu-main-container > ul > li:focus{color:#fff}
	nav ul li a:hover, nav ul li.active a, nav ul li a:focus{color:#fff}
	nav ul li.submenu.open > a:hover{background:transparent;}

	.mobile-menu-inner{ min-height: 100%;}
	.mobile-footer .social-icons{background:rgba(0,0,0,0.1); padding:15px 45px 13px; text-align:left; margin-top: 0;}
	.mobile-footer .social-icons li{margin-left:11px;}
	.mobile-footer .social-icons li a{width:24px;}
	.mobile-footer .social-icons li a:hover img{opacity:0.8}
	.mobile-footer label{ color:#fff; font-weight:normal; font-size: 20px;   margin-bottom: 11px;    margin-left: 43px;font-family:'Nexa-L';}
	.menu-open{overflow: hidden;}

	.sep:after{display:none}
	.main-bg{background:transparent}
	.intro-block {margin-top: 6px; background:#eeeeee; padding:0}
	.intro-inner h2{letter-spacing: -1px;   line-height: 36px;}
	.intro-inner .col-sm-6{padding:0 44px 32px;}
	.intro-inner{opacity:1;padding-top: 44px;}

	.intro-inner .col-sm-6.pRL{padding-top:44px;  padding-bottom: 61px;}
	.pRL:before{ background: #a17842;content: "";left: 44px;height: 1px;		position: absolute;		right: 0;		top: 0;		width:auto;}	
	.intro-inner strong{ letter-spacing:0.2px;  margin-bottom: 20px;font-size:17px;    line-height: 23px;}
	.intro-inner p{letter-spacing:-0.3px; font-size:15px; line-height:21px; padding-bottom:20px;}

	.projects-outer {  padding-top: 47px;}
	h1{font-size:30px;  margin-bottom: 24px; letter-spacing: -0.4px;    line-height: 30px;  padding-bottom: 16px;}
	h1:after{height: 1px;width:64px;}
	.middle-text p{font-size:20px;line-height:26px;}
	.projects-outer .middle-text p{font-size: 15px;line-height:21px;     padding: 0 9px;}
	.projects-outer .middle-text{margin-bottom: 48px;}
	.figure .fill-img{height:auto !important}
	.figure .fill-img img{position:inherit !important;width:100%  !important; height:auto  !important; max-width:100%; left: 0  !important; top: 0  !important; }
	.smRight, .colLeft, .colRight, .smLeft{opacity:1; width:100%; padding:0 15px;}
	
	.figure-caption{padding:15px;}
	h3{   font-size: 22px;  line-height: 22px;}
	.figure-caption h3{  padding-bottom: 10px;}
	.figure-caption p{   font-size: 14px;   line-height: 20px;   padding-bottom:10px;    letter-spacing: 0;}
	.close-figure em{ height: 20px;    width: 20px;}
	.close-figure {  right: 10px;   top: 10px;	}
	.smRight{margin-top: 0;}	
	.projects-listing h4{margin-top: 11px;text-align: left; font-size:15px;border-bottom:1px solid #9F753D; padding-bottom: 10px;line-height: 20px;}
	.projects-listing {  margin-bottom: 32px;}
	.middle-bg:before, .view-all a:after{display:none}
	.view-all{font-size:15px; line-height:20px;padding: 0;}
	.view-all a{text-transform:uppercase;  padding-top:0; letter-spacing: 1px;}
	main {    margin-bottom: 31px;}
	footer ul li{ margin: 0 12px;font-size:12px;  line-height: 16px;}
	footer ul li a:after{bottom:-5px;}
	.copyrights{display:block;margin-bottom: 5px;}
	footer{padding:11px 0;}

	/*about*/
	.innerpage h1{font-size:36px;line-height: 36px;    padding-bottom: 14px;   margin-bottom: 25px;}
	.innerpage main {   padding-top:113px;}
	.card{height:inherit !important}
	.innerpage h2{padding:20px 0;font-size: 30px;  letter-spacing: -0.5px; line-height:30px;}
	.image-block.left{float: none; margin:0 0 15px; padding:0}
	.image-block.right{padding-left:0; float: none;}
	#OurStory{padding:0}
	.filterTab li{ margin: 0 10px;}
	.innerpage .middle-text{margin-bottom: 11px;}

	/*blog-article*/
	
	.blog-social li a{width:35px; height:35px;}
	.blog-social li.share-img em{width:16px; height:16px;}
	.blog-social{margin-top: 42px;}
	.tag ul li.tag-img{position:absolute;   left: -7px;  top: 20px;}
	.tag ul li{  letter-spacing: 1px;   margin: 0 12px;}
	.tag {position:relative; margin-top: 25px; text-align:left;padding:10px 0 14px 18px}
	.tag-img em{width:12px; height:12px;}
	.arrows p{display:none}
	.arrows a{  margin: 0;font-size:15px;text-transform:uppercase}
	.arrows div{    padding: 0 22px;}
	.arrows {   margin-top: 14px;}
	.arrows .next a::after, .arrows .prev a::before{  top: 3px;height:21px;width:11px;}
	.arrows .prev a::before {   left: -23px;}
	.arrows .next a::after {   right: -23px;}
	.author-block{ margin-top: 20px;padding:32px 0 31px }
	.author-block h4{margin-top: 8px; padding-bottom: 14px;}
	.author-block .col-sm-2{display:block}
	.author-block .container{display:block;    text-align: center;}
	.author-block .col-sm-2 img{display:inline-block; max-width:90px;}
	.author-block p {  font-size: 15px;   line-height: 21px;    padding:0 32px 28px;}

	/*blog*/
	.blog-detail h2{
		/*display:none*/
		font-size: 15px !important;
		text-align: left;
		padding: 0;
	}
	.blog-detail .read-more{display:none}

	.blog-link{float: left; width:32%}
	.blog-detail{height:inherit !important; width:68%; float: left;   padding-left: 15px;   text-align: left;  margin: 0;}
	.blog-item{overflow:hidden}
	.blog-listing .blog-item{margin-bottom: 13px;}
	.blog-detail p{padding-bottom: 0;  font-size: 15px;    line-height: 21px;}
	.search-blog em{width:30px; height:30px; margin-top: -15px;}
	.blog-listing .H325{height:78px}
	.blog-listing {   margin-top: 13px;}
	.blog-listing  .view-all a::after{display:block; width:51px}
	.blog-listing .view-all {   padding-top: 32px;}
	.blog-listing .view-all a {   padding-top: 28px;}

	.pLpR{padding: 0 11px;}

	/*project*/
	.mixup-gallery{padding: 0 0px 30px;}
	.project-header{padding-bottom:35px;}
	.project-block .middle-text{margin-bottom:15px;}
	.project-header li{padding-right:10px !important;}
	.grid-item .figure-caption{padding:15px;}
	.grid-item{padding:0 3px; margin-bottom: 4px;}
	.mixup-gallery{margin:0;}
	.grid-item .figure-caption h3{font-size:22px;line-height:22px;}

	/*contact*/
	.contact-form{padding:0 15px;}
	.contact-form .text-left{text-align: center}

	.mb-block, .mb-block span a{letter-spacing:0.6px; font-size:18px; font-family:'Nexa-L';position:relative; vertical-align:middle; color:#9f753d}
	.mb-block span{border-top:1px solid #d5d5d5; padding:20px 0}
	.mac-os .mb-block span{padding:20px 0 12px}
	.mb-block span:last-child{border-bottom:1px solid #d5d5d5;}
	
	.ic-phone:before{top: -3px; left: -26px;position:relative;margin-right: -20px;vertical-align:middle;display:inline-block; background:url(../images/ic-phone.svg) no-repeat 0 0; width:19px; height:19px; background-size:100%; content: '';}
	.ic-phone:hover:before{background-image:url(../images/ic-phone-h.svg) }
	.ic-mob:before{top: -3px; left: -26px;position:relative;margin-right: -15px;vertical-align:middle;display:inline-block; background:url(../images/ic-mob.svg) no-repeat 0 0; width:13px; height:23px; background-size:100%; content: '';}
	.ic-mob:hover:before{background-image:url(../images/ic-mob-h.svg) }
	.mb-block{margin-top: 4px;  margin-bottom: 20px;}

	h5{border-top:0; padding:0 0 5px;   letter-spacing: -1px;}
	.contact-detail p{font-size:15px;  padding-bottom: 22px;}
	.contact-form address {  font-size: 15px;  line-height: 18px;  margin: 7px auto;   width: 72%;}
	.map {   margin-top: 20px;}
	.contact-detail {   margin-bottom: 37px;}
	.form-col{text-align:left}
	.form-group .form-control{height:35px;   padding: 5px 10px;}
	.mac-os .form-group .form-control{   padding: 6px 10px 2px;}
	.form-group textarea.form-control{padding:10px;}
	.form-detail form {   margin-top: 15px;}
	.form-group {   margin-bottom: 15px;}
	.form-group textarea.form-control{height:90px;}
	.form-col-7 img, .form-col-7, .form-col-5{width:100%}
	.form-col-7{margin-top: 17px; margin-bottom: 26px;}
	.contact-form{margin-bottom: 0;}

	/*process*/
	.step-block{padding-top:30px;}
	.step-content h2{padding:20px 0 15px;text-align:center;}
	.step-image{display:block;width:100%;float:none !important;padding-top:25px;height: auto !important;}
	.step-image .step-left{display:block; width:100px;margin: 0 auto;}
	.step-content{margin-left: 0;width:100%;float:none !important;border-top:0;padding-bottom: 5px;}

	/*project-detail*/
	.project-detail .main-bg{ background:#eeeeee;padding:93px 0 30px;}
	.project-detail-list {   padding: 20px 15px;}
	.project-detail h1{text-align:left; padding-bottom:0; margin-bottom: 0;}
	.project-detail .col-sm-6.pRL{padding-top: 30px; padding-bottom:0}
	.projecthideInBg .intro-inner{opacity:1}
	.projecthideInBg .header-logo{opacity:0}
	.projectList .header-logo{opacity:1}
	.project-detail .intro-inner .col-sm-6{padding:0 44px 20px}
	.project-detail .col-sm-6.pRL{padding-top: 15px;}
	.project-detail-list div {   margin-bottom: 6px;}
	.col-sm-14{padding:0 3px;}
	.project-detail-list .row{margin:0 -3px;}

	.logo-img{padding-left:0}
	.middle-bg {display:none}
	
}
@media (max-width:567px){

	.form-col-4,.form-col-8{display:block; width:100%; padding: 0;}
	.form-col-8{margin-bottom: 15px;}
	.form-last-row{display:block}
	.form-last-row .wpcf7-form-control > div{margin:0 auto}
	

}

@media (max-width:374px){
	/*home*/
	.intro-inner .col-sm-6, .project-detail .intro-inner .col-sm-6{padding:0 15px 32px}
	.project-detail .main-bg{  padding: 70px 0 10px;}
	.pRL:before{left:15px;}
	.intro-inner{ padding-top:40px;}
	.intro-inner h2 {   font-size: 30px; line-height:30px;}
	.intro-inner .col-sm-6.pRL{padding-top: 30px;padding-bottom: 20px;}
	.projects-outer .middle-text p{padding:0}
	.figure-caption h3{font-size:18px;line-height: 18px;}
	/*about*/
	.innerpage h2{font-size:25px; line-height:25px;}

	/*project*/
	.grid-item{width:100%;padding:0; margin-bottom: 10px;}	
	.project-header{padding-bottom:20px;}
	.project-header li{display:block;padding-right:0;padding-bottom:5px;}
	.mixup-gallery{padding-bottom:20px;}


}