@charset "utf-8";
/* CSS Document */
/*xs @media only screen and (min-width:375px)*/
	html{scroll-behavior: smooth;}
	body {padding-top:5.8rem;font-family: 'Roboto', sans-serif;}/*font-family: 'Paytone One', sans-serif; */
	.logo {border:0px solid red;max-width:50%;}
	.bg-blue{background-color:#102842;}
	
	.trxbkgd{
		background:rgba(0,0,0,.4);
		color:#f3f3f3;			
	}
	
	.text-blue{color:#102842;}}
	.phonebanr .h1,.phonebanr a{color:#d93846;font-family: 'Paytone One', sans-serif;text-decoration:none;}
	
	.form-hdr{font-size:1rem;color:#f1f1f1;}
	
	.canadabkgd{background-image:url(../_new/images/bkgd-usa.png);background-repeat: no-repeat;background-position:0 275px;background-attachment: fixed;background-size:contain;}
	
	.clearance-section{background-image:url(../_new/images/bkgd-clearance.png)}
	.clearance-section .h1{font-family: 'Paytone One', sans-serif;}
	
	.appdesc {
		padding: 0 6%;
		min-height:100px;
		position: relative;
		top: -50px;
		margin-bottom: -50px;
		background: rgba(246,246,246,0.8);
		border: 1px solid rgba(255,255,255,0.05);
	}
	
	/*parallax*/
	.paralax-1{background: url(../_new/images/airpac-commercial-building.jpg) no-repeat center center fixed;}
	.paralax-2{background: url(../_new/images/a-model-building.jpg) no-repeat center center fixed;}
	.paralax-1,.paralax-2,.content-space-two,.content-space-three {
	  padding: 0px;
	  margin-bottom: 0px;
	  color: inherit; 
	  -webkit-background-size: contain;
	  -moz-background-size: contain;
	  -o-background-size: contain;
	  background-size: contain;
	  padding-top: 0px;
	  padding-bottom: 0px;
	}
	.paracup{
		background:rgba(0,0,0,.4);
		color:#f3f3f3;
		font-family: 'Paytone One', sans-serif;
	}
	.paracup .h1{font-size:100%;}
	.paracup .h3{font-size:75%;}
	.paracup a{font-size:100%;}
	/*end parallax*/
	
	.models .btn-primary {
		color: #fff;
		background-color: #063464;
		border-color: #063464;
	}
	.models .btn-primary:hover {
		color: #fff;
		background-color: #094a8e;
		border-color: #094a8e;
	}
	.grayarea{
		background-color:#f6f6f6;	
	}
	.energystar{
		max-width:120px;	
	}
	.trans-success{
		background-color: rgba(209, 231, 221, 0.8);	
	}
	.ferngreen{background-color:#124b2b;width:100%;height:13.25em;}
	.polarwhite{background-color:#f0f2f2;width:100%;height:13.25em;}
	.lightstone{background-color:#d2c497;width:100%;height:13.25em;}
	.galv{background-image:url(../_new/images/box-galvalume.jpg);background-repeat: no-repeat; background-size:100% 100%;width:100%;height:13.25em;}
	
	.app-uses a{color:#212529;text-decoration:none;}
/*mobile, portrait*/
@media only screen and (min-width:375px) {
	.logo {border:0px solid blue;}
}

/*mobile, portrait*/
@media only screen and (min-width:414px) {
	.logo {border:0px solid green;max-width:39%;}
	.form-hdr{font-size:1.25rem;}
	.ferngreen{height:16em;}
	.polarwhite{height:16em;}
	.lightstone{height:16em;}
	.galv{height:16em;}
}

/*mobile, landscape*/
@media only screen and (min-width:576px) {
	.app-page{padding-top:6.8rem;}
	.logo {border:0px solid pink;max-width:35%;}
	.ferngreen{height:23em;}
	.polarwhite{height:23em;}
	.lightstone{height:23em;}
	.galv{height:23em;}
}

/*mobile, landscape*/
@media only screen and (min-width:667px) {
	.logo {border:0px solid yellow;max-width:30%}
}

/*mobile, landscape*/
@media only screen and (min-width:736px) {
	.logo {border:0px solid orange;max-width:26%}
}

/*tablet, portrait*/
@media only screen and (min-width:768px) {
	.logo {border:0px solid indigo;}
	body{padding-top:6.8rem;}
	.ferngreen{height:17em;}
	.polarwhite{height:17em;}
	.lightstone{height:17em;}
	.galv{height:17em;}
}

/*mobile, landscape*/
@media only screen and (min-width:812px) {
	.logo {border:0px solid gray;}
}

/*tablet, portrait*/
@media only screen and (min-width:834px) {
	.logo {border:0px dashed red;max-width:20%;}
}

/*tablet, portrait*/
@media only screen and (min-width:992px) {
	.logo {border:0px solid pink;max-width:20%;}
	.ferngreen{height:12em;}
	.polarwhite{height:12em;}
	.lightstone{height:12em;}
	.galv{height:12em;}
}

/*tablet, landscape*/
@media only screen and (min-width:1024px) {
	body{padding-top:4.8rem;}
	.logo {border:0px dashed blue;max-width:15%;}	
}

/*tablet, landscape*/
@media only screen and (min-width:1112px) {
	.logo {border:0px dashed green;}
}
@media only screen and (min-width:1200px) {
	.logo {border:0px solid green;}
	body{padding-top:6.4rem;}
	.phonebanr p.h1{font-size:2rem;}
	.phonebanr .h1,.phonebanr a{font-size:2.1rem;-webkit-text-stroke: 1px #ffffff;}
	#WebToLeadForm p.h5{font-size:1rem;}
	#splashbanner img{min-width:156%;position:relative;left:-55%;}
	#a-banner img{min-width:140.5%;position:relative;left:0%;}
	#p-banner img{min-width:140.5%;position:relative;left:-20.5%;}
	#s-banner img{min-width:140.5%;position:relative;left:-40%;}
	#q-banner img{min-width:140.5%;position:relative;left:-40%;}	
	.ugh,.ogeez{display:none;}
	.app-page .carousel-item img{height:430px;}
}
/*laptop-1*/
@media only screen and (min-width:1366px) {
	.logo {border:0px dashed pink;max-width:12%;}
	header nav .nav-link{font-size:initial;}
	.app-page .form-label{font-size:.75rem;}
	.phonebanr .h1,.phonebanr a{-webkit-text-stroke: initial;}
	#s-banner img{min-width:140%;position:relative;left:-21%;}
	.ugh {display:block;}
	.app-page .carousel-item img{height:492px;}
	.ferngreen{height:15em;}
	.polarwhite{height:15em;}
	.lightstone{height:15em;}
	.galv{height:15em;}
}

/*laptop-2*/
@media only screen and (min-width:1440px) {
	.logo {border:0px dashed purple;}
	#s-banner img{min-width:126%;position:relative;left:-14%;}
	.app-page .carousel-item img{height:525px;}
}

/*tc home screen*/
@media only screen and (min-width:1600px) {
	.logo {border:0px dashed brown;}
	.maxsvgh{max-height:285px !important;}
	.maxsvgh2{max-height:245px !important;}
	.maxsvgh3{max-height:80px !important;}
	.maxsvgh4{max-height: 160px !important;}
	#splashbanner img{min-width:117%;position:relative;left:-17%;}
	#s-banner img{min-width:112.75%;position:relative;left:0%;}
	#q-banner img{min-width:112.75%;position:relative;left:0%;}
	.chktxt{font-size:.8rem;}
	.ogeez {display:block;}
	.app-page .carousel-item img{height:571px;}
}

/*desktop*/
@media only screen and (min-width:1680px) {
	.logo {border:0px dashed orange;}
	#WebToLeadForm p.h5{font-size:1rem;}
	#p-banner img{min-width:106%;position:relative;left:-3.5%;}
	#q-banner img{min-width:106%;position:relative;left:-5%;}
	.app-page .carousel-item img{height:initial;}
}

/*desktop 1080p*/
@media only screen and (min-width:1920px) {
	.logo {border:0px dashed black;max-width:inherit;}
	body,.app-page {padding-top:9.7rem;}
	
	.canadabkgd{background-position:0 -50px;background-attachment: initial;background-size:initial;}
	.col-form{max-height:650px;}
	
	.appdesc {
		padding: 0 6%;
		min-height:130px;
		position: relative;
		top: -130px;
		margin-bottom: -130px;
		background: rgba(246,246,246,0.8);
		border: 1px solid rgba(255,255,255,0.05);
	}
	.paralax-1,.paralax-2,.content-space-two,.content-space-three {
	  padding: 0px;
	  margin-bottom: 0px;
	  color: inherit; 
	  -webkit-background-size: cover;
	  -moz-background-size: cover;
	  -o-background-size: cover;
	  background-size: cover;
	  padding-top: 200px;
	  padding-bottom: 200px;
	}
	.paracup .h1{font-size:200%;}
	.paracup .h3{font-size:125%;}
	.paracup a{margin-top:20px;font-size:150%;}
	
	.models .h4{color:#063464;font-size:xx-large;}
	.phonebanr{
	}
	.phonebanr .h1,.phonebanr a{font-size:2.7rem;}
	#WebToLeadForm p.h5{font-size:1.25rem;}
	.app-page .form-label{font-size:initial;}
	
	
	#splashbanner img{min-width:initial;position:initial;left:initial;}
	#p-banner img{min-width:initial;position:initial;left:initial;}
	#s-banner img{min-width:initial;position:initial;left:initial;}
	#q-banner img{min-width:initial;position:initial;left:initial;}
	#a-banner img{min-width:initial;position:initial;left:initial;}
	.ferngreen{height:18em;}
	.polarwhite{height:18em;}
	.lightstone{height:18em;}
	.galv{height:18em;}
}

@media only screen and (min-width:2560px) {
	.logo {border:0px dashed pink;}
}
