

@media screen and (max-width: 1500px){
	
	nav.main-menu > ul{padding-right: 60px;}
	main{ padding:80px 120px; }

	.region-sidebar-second:has(.show-side){ width:350px; padding-left:100px; }
	.region-banner{ padding:0px 120px; }
	main:has(.show-side) .layout-content {width: calc(100% - 450px);}

	.hp-banner .inner {padding: 425px 0px 0 120px;}
	.hp-banner .red {width: 550px; padding: 80px;}
	.hp-banner .red .content {bottom: 110px; left: 80px; right: 80px;}

	.hp-grid{width: calc(100% - 550px);}
	.hp-solutions{width: 550px; padding: 0 80px;}

	.hp-about .item {width: calc(100% - 120px);}
	.hp-about .item .text{right: -120px; padding: 80px;}

	.hp-footer .item .text{padding: 80px;}

}

@media screen and (max-width: 1400px){
	.region-banner {background-position: bottom right -100px;}
	.intro-txt,
	.region-banner h2,
	h1{max-width: 575px;}

	.hp-banner .inner {padding: 450px 0px 0 120px;}
	.hp-banner h1 {font-size: 80px; line-height: 70px;}
	.hp-banner h1 span {font-size: 62px;}

}



@media screen and (max-width: 1300px){
	
	main{ padding:80px 90px; }
	.region-sidebar-second:has(.show-side){ width:350px; padding-left:80px; }
	.region-banner{ padding:0px 90px; background-position: bottom right -120px; }
	.intro-txt,
	.region-banner h2,
	h1{max-width: 550px}
	main:has(.show-side) .layout-content {width: calc(100% - 430px);}

	.paragraph--type--single-block.img-left .item{ padding-left:0; }
	.paragraph--type--single-block.img-right .item{ padding-right:0; }
	.paragraph--type--single-block.img-right .image,
	.paragraph--type--single-block.img-left .image{ position:static; float:right; margin:0 0 40px 40px; }
	.field__item:has(.full-width) { padding:80px 90px; }

	.hp-banner .inner {padding: 460px 0px 0 90px;}
	.hp-banner h1 {font-size: 75px; line-height: 65px;}
	.hp-banner h1 span {font-size: 57px;}

	.hp-banner .red {width: 475px; padding: 60px;}
	.hp-banner .red .content {left: 60px; right: 60px;}

	.hp-grid{width: calc(100% - 475px);}
	.hp-solutions{width: 475px; padding: 0 60px;}

	.hp-about .item {width: calc(100% - 90px);}
	.hp-about .item .text{right: -90px; padding: 60px;}

	.hp-footer .item .text{padding: 60px;}

	.hp-projects{padding: 100px 90px 150px;}

	.footer .left .flex .footer-nav li a {font-size: 16px;}
	.footer .left .flex .footer-nav li{padding-right: 20px;}

}

@media screen and (max-width: 1200px){

	.region-banner {height: 580px; background-position: bottom right -175px;}
	.region-banner:before {width: 277.57px; height: 444px; top: unset; bottom: 0;}
	h1{font-size: 82px;}
	.intro-txt,
	.region-banner h2,
	h1 {max-width: 500px;}

	.hp-banner h1 {font-size: 70px; line-height: 60px;}
	.hp-banner h1 span {font-size: 52px;}
	.hp-banner .red {width: 450px; padding: 40px;}
	.hp-banner .red .content {left: 40px; right: 40px; bottom: 80px;}

	.hp-grid {width: calc(100% - 450px);}
	
	.hp-solutions{width: 450px; padding: 0 40px;}

}


/*@media screen and (max-width: 1120px){
	
	.region-sidebar-second:has(.show-side){ width:300px; }
	.footer{ padding:30px 45px; }
	ul.triple{ columns:2; }
	
}*/

@media screen and (max-width: 1100px){
	
	.region-sidebar-second:has(.show-side);{ width:300px; }
	.footer{ padding:45px 45px; }
	ul.triple{ columns:2; }
	
	nav.main-menu > ul{padding-right: 35px;}

	.hp-banner .wrap {height: unset; background-position: top;}
	.hp-banner .swiper{height: 100%;}
	.hp-banner .swiper .swiper-slide{background-position: top;}
	.hp-banner .inner {padding: 460px 0px 30px 90px;}

	.hp-banner .red {width: unset; height: unset; background-size: 50%; background-position: top -200px right -200px; position: relative; display: flex; flex-direction: column; justify-content: center; box-sizing: unset; padding: 50px 90px;}
	.hp-banner .red .content {left: unset; right: unset; bottom: unset; max-width: 600px; position: relative;}

	.region-upper-content{display: block;}

	.hp-grid{width: unset;}
	.hp-solutions{width: unset; height: auto; padding: 80px 90px;}

	.hp-grid .item .wrap .text .content p.excerpt {max-height: 600px; padding-bottom: 10px;}
	.hp-grid .item .wrap .learn:after{ width:100%; }
	.hp-grid .item .wrap .text{padding: 40px 30px 35px}
}

@media screen and (max-width: 1025px){
	.footer .left{float: unset;}
	.footer .left .flex{ flex-direction: column;}
	.footer .left .flex .footer-nav{padding-left: 0;}
	.footer .left .flex .footer-nav li{padding-right: 30px;}
	.footer .left .flex .footer-nav li a{font-size: 15px;}
	.footer .left .flex .logo{margin: 0 auto; border-right: none; padding-right: unset;}
	.footer .left p {text-align: center; margin: 0 0;}

	.footer .right{float: unset;}
	.footer .right .socials{padding: 0 0; justify-content: center;}
		.footer .right .socials li:first-of-type{padding-left: 0;}
}

@media screen and (max-width: 1000px) {

	.region-banner{ padding: 0 80px; height: 430px; background-image: none !important; }
	main,
	main:has(.show-side){ display:block !important; padding:0; }
	.layout-content{ padding:60px 80px; }
	.front .layout-content{padding: 0 0;}
	/*.region-sidebar-second{ box-sizing:border-box; padding:60px 80px 40px; background: rgba(244, 218, 62, 1); }*/
	.region-sidebar-second > :last-child{ padding-bottom:0; margin-bottom:0; } 
	.layout-container .primary-img img{ display:block; float:right; width:35%; margin:0 0 30px 30px; }
	aside .primary-img{ display:none; }
	aside .sub-menu{ display:none; }
	aside .box{ background:none; padding:0; }
	aside .spine{ border:none; padding:0; }
	.region-sidebar-second:has(.show-side){ margin:0; width:100%; box-sizing:border-box; padding:60px 80px 40px; background: rgba(244, 218, 62, 1);}
	main:has(.show-side) .layout-content {width: unset;}

	header{ height:122px; }
	.header{height: 122px;}

	#main-logo .main-logo, #env-logo .env-logo, #maint-logo .maint-logo, #roof-logo .roof-logo, .trans-logo .trans-logo{height: 122px;}
	.site-logo{height: 122px;}
	

	#block-mocha-main-menu{ display: none; }
	#main-nav .main-nav, #env-nav .env-nav, #maint-nav .maint-nav, #roof-nav .roof-nav, #trans-nav .trans-nav, #tech-nav .tech-nav{display: none;}

	.top-nav{ display:none; }
	#mt-container { display: block; }

	.field__item:has(.full-width){margin: 60px -80px;}

	.hp-banner .red {padding: 50px 80px;}

	.hp-solutions{padding: 60px 80px;}

	.yellow{padding: 0 0 0; margin-top: 0;}

	/*.hp-about{height: auto; margin: -30px 0 80px;}
	.hp-about .item,
	.hp-footer .item{width: unset; background: none !important; height: auto; display: block;}
	.hp-about  .item .mob-img,
	.hp-footer .item .mob-img{display: block; position: relative;}
	.hp-about  .item .mob-img img,
	.hp-footer .item .mob-img img{display:block;}
	.hp-about  .item .text{padding:55px 80px 110px; width: unset; position: relative; right: 0;}
	.hp-footer .item .text{ left: 0;}
	
	.hp-footer {height: auto;}*/
	.hp-footer .item{flex-direction: column-reverse;}
	.hp-footer .item .text{padding:55px 80px 110px; width: unset; position: relative;}
	.hp-footer .item .text p{max-width: unset;}
	.hp-footer .item .image{width: 100%; background: unset !important;}
	.hp-footer .item .image img{display: block;}

	.hp-projects{padding: 80px 40px 100px;}
	.hp-projects .item {width: unset; padding: 0 10px;}
	.hp-projects .view-content {padding: 50px 68px 1px;}

	.hp-projects header{padding: 0 80px;}
	
}

@media screen and (max-width: 850px) {

	.sm-stack tr{ display:block; padding:15px; }
	.sm-stack td{ display:block; border:none; padding:0; }

	.paragraph--type--multi-column-content .item{ padding: 1rem 0 !important; }

	.hp-banner .wrap{position: relative; background-size: 850px auto;}
	.hp-banner .swiper .swiper-slide{background-size: 850px auto;}
	.hp-banner .wrap:before{position: absolute; content: ""; width: 100%; height: 100%; background: rgba(0, 0, 0, .5);}
	.hp-banner .inner{position: relative; z-index: 4;  padding: 400px 80px 60px;}

	.hp-banner .red {background-position: top -144px right -150px;}

	.hp-grid .item .wrap .text{padding: 50px 30px 45px;}
	.hp-grid .item .wrap h3{font-size: 48px;}

	.hp-types .item .logo {padding: 0 0 20px; max-width: 400px; margin: 0 auto;}

}

@media screen and (max-width: 700px) {
	
	.region-banner{ padding:0 60px; }
	h1{font-size: 75px;}
	.layout-content{ padding:50px 60px; }
	.region-sidebar-second:has(.show-side) { padding:50px 60px; }
	.layout-container .primary-img img{ float:none; margin:0 0 40px; width:100%; }

	header{height: 90px;}
	.header{height: 90px;}
	#main-logo .main-logo,
#env-logo .env-logo,
#maint-logo .maint-logo,
#roof-logo .roof-logo,
#trans-logo .trans-logo{
	height: 90px;}
	.site-logo{height: 90px;}
	#mt-container {top: 12px;}

    .field__item:has(.full-width) { padding:70px 60px; margin:50px -60px; }
/*    .box-wrap { margin:-25px; }*/
	.paragraph--type--single-block.img-right .image,
	.paragraph--type--single-block.img-left .image{ float:none; width:100%; margin:0 0 40px; }
	.accordion .item .content .image{ margin: 0 0 25px 25px; }

	.hp-banner .wrap{background-size: 700px auto;}
	.hp-banner .swiper .swiper-slide{background-size: 700px auto;}
	.hp-banner .inner{padding: 300px 60px 40px;}
	.hp-banner h1 {font-size: 60px; line-height: 50px;}
	.hp-banner h1 span {font-size: 45px;}

	.hp-banner .red {background-position: top -110px right -110px; padding: 50px 60px;}	

	.hp-about .item .text {padding: 55px 60px 110px;}
	.hp-footer .item .text{padding:55px 60px 110px}

	.hp-solutions{padding: 50px 60px;}

	.hp-projects header{padding: 0 60px;}
	
}

@media screen and (max-width: 600px){

	.hp-projects .view-content {padding: 50px 0px 1px;}
	.hp-projects{padding: 60px 0px 80px;}

	.paragraph.slider {margin: 50px -60px}

	.pop-alert .view-content > div{max-width: 400px;}
	.pop-alert .view-content{margin-left: -200px;}
	.pop-alert .inner p{font-size: 16px; line-height: 1.5em}
	.pop-alert .inner{padding: 50px 40px;}

}

@media screen and (max-width: 550px){
	.hp-banner .wrap {background-size: 600px auto;}
	.hp-banner .swiper .swiper-slide{background-size: 650px auto;}
	.hp-banner .inner{padding: 250px 40px 30px;}
	.hp-banner h1 {font-size: 50px; line-height: 42px;}
	.hp-banner h1 span {font-size: 38px;}
	.hp-banner .red {background-position: top -110px right -110px; padding: 50px 60px; height: auto;}	

}

@media screen and (max-width: 500px) {
	
	.region-banner{ padding:0px 40px; height: 460px;}
	h1{ font-size:65px; }
	.layout-content{ padding:60px 40px; }
	.region-sidebar-second:has(.show-side) { padding:50px 40px 20px;  }
	.footer{ padding:30px 35px; }
	.align-right, .align-left{ max-width:100%; margin:0 0 30px; width: 100%;}
	.field__item:has(.box-wrap) { padding:70px 40px; margin:50px -40px; }
	.field__item:has(.full-width) { padding:70px 40px; }
	.paragraph.slider {margin: 50px -40px}

    
	p.big{ font-size:22px; }
	ul{ padding-left:25px; }
	ul.double, ul.triple{ columns:1; }
	.xs-stack tr{ display:block; padding:15px; }
	.xs-stack td{ display:block; border:none; padding:0; }

	main .field__item:has(.box-wrap):last-child{margin: 50px -40px -60px;}

	.hp-banner .red{padding: 50px 40px;}

	.hp-about .item .text {padding: 55px 40px 110px;}
	.hp-footer .item .text{padding:55px 40px 110px}

	.hp-solutions{padding: 50px 40px;}

	.hp-projects header{padding: 0 40px;}

	.hp-footer .item .text h2{font-size: 40px;}

	.footer .left .flex .footer-nav li a{font-size: 11px;}
}

@media screen and (max-width: 450px){
	.pop-alert .view-content > div{max-width: 300px;}
	.pop-alert .view-content{margin-left: -150px;}
	.pop-alert .inner p{font-size: 14px; line-height: 1.5em;}
	.pop-alert .inner{padding: 50px 25px;}
	.pop-alert .inner h2.title,
.pop-alert .inner h2.title a{font-size: 32px;}
}

@media screen and (max-width: 400px) {
	h1 {font-size: 55px;}
}


@media screen and (max-width: 370px) {

	.region-banner{ padding:0 25px; }
	.layout-content{ padding:30px 25px; }
	.region-sidebar-second:has(.show-side) { padding:50px 25px 20px; }
	.footer{ padding:30px 25px; }

	.paragraph.slider {margin: 50px -25px}

	main .field__item:has(.box-wrap):last-child{margin: 50px -40px -30px;}

	.hp-banner .red{padding: 50px 25px;}

	.hp-about .item .text {padding: 55px 25px 110px;}
	.hp-footer .item .text{padding:55px 25px 110px}

	.hp-solutions{padding: 50px 25px;}

	.hp-projects header{padding: 0 25px;}
}
