@media (max-width: 2560px) {
	.container {max-width: 90%;}
	header {padding: 60px 0;}
	.logo {width: 300px;}
	.logo1 {width: 270px;}
	.hero {height: 1200px;}
	.hero .caption {margin: 350px auto 50px;}
	.herotitle {font-size: 180px; line-height: 170px;}
	.heroleftdiv {width: 54%;}
.herorightdiv {width: 45%; }
	.heroleft img {width: 780px; left: -80%;}
	.heroright img {width: 200px;}
	.heroright span {font-size: 80px;}
	.heroright p {font-size: 40px; line-height: 50px;}
	.hero:before {width: 350px; height: 324px;}
	.hero:after {width: 200px; height: 60px; bottom: 20%;}
	.heroright:before {width: 450px; height: 131px;}
	.wave {height: 400px; bottom: -200px;}
	.cta a {font-size: 40px; padding: 50px;}
	.sec2 {padding: 350px 0 0;}
	.sec2 h1 {font-size: 70px; line-height: 80px; margin-bottom: 50px;}
	.sqbox p {font-size: 40px;  line-height: 45px;}
	.sqboxnum {width: 130px; height: 140px;  font-size: 100px;  line-height: 105px;}
	.sqboxnum:before {font-size: 40px;  line-height: 45px; top: 35px;  left: -20px;}
	.sqboxnum:after {font-size: 40px;  line-height: 45px; top: 35px;  right: -25px;}
}

@media (max-width: 1920px) {	
	h1 {font-size:45px; line-height:60px;}	
	footer .cta {margin: auto;}	
	header {padding: 30px 0;}
	.hero {height: 1000px;}
	.herotitle {font-size: 130px; line-height: 120px;}
	.heroleft img {width: 640px; left: -80%;}
	.heroright img {width: 150px;}
	.heroright span {font-size: 60px;}
	.heroright p {font-size: 30px; line-height: 40px;}
	.hero .caption h1 {margin-top: 0px;}
	.hero:after {height: 300px; bottom: -150px;}
	.sec2 {padding: 250px 0 0;}
	.sec2 h1 {font-size: 60px; line-height: 70px; margin-bottom: 50px;}
	.sqbox p {font-size: 30px;  line-height: 35px;}
	.sqboxnum {width: 90px; height: 100px; font-size: 70px;  line-height: 75px;}
	.sqboxnum:before {font-size: 25px;  line-height: 25px; top: 25px;  left: -10px;}
	.sqboxnum:after {font-size: 25px;  line-height: 25px; top: 25px;  right: -15px;}
}

@media (max-width: 1600px) {
	h1 {font-size:32px; line-height:45px;}
	header {padding: 10px 0;}
	.hero .caption {margin: 300px auto 50px;}
	.logo {width: 200px;}
	.logo1 {width: 185px;}
	.hero {height: 800px;}
	.heroleftdiv {width: 59%;}
.herorightdiv {width: 40%; }
	.herotitle {font-size: 120px; line-height: 100px;}
	.heroleft img {width: 580px; left: -72%;}
	.heroright img {width: 100px;}
	.heroright span {font-size: 40px;}
	.heroright p {font-size: 20px; line-height: 25px;}
	.hero .caption h1 {margin-top: 80px;}
	.cta a {font-size: 25px; padding: 30px;}
	.hero:before {width: 150px; height: 139px;}
	.heroright:before {width: 300px; height: 87px;}
.hero:after {width: 100px; height: 30px; bottom: 10%;}
	.sec2 {padding: 150px 0 0;}
	.sec2 h1 {font-size: 40px; line-height: 50px; margin-bottom: 20px;}
	.sqbox p {font-size: 20px;  line-height: 25px;}
	.sqboxnum {width: 80px; height: 90px; font-size: 60px;  line-height: 65px;}
	.sqboxnum:before {font-size: 20px;  line-height: 25px; top: 25px;  left: -10px;}
	.sqboxnum:after {font-size: 20px;  line-height: 25px; top: 25px;  right: -15px;}
}

@media (max-width: 1440px) {
/*.hero {height: 80%!important; background-size: 45%;} */
}

@media (max-width: 1367px) {
	.heroleft img {width: 500px; left: -62%;}
	.hero {height: 750px;}
	.hero .caption {margin: 250px auto 50px;}
}

@media (max-width: 1280px) {
h1 {font-size:30px; line-height:45px;}
	.hero {height: 700px;}
.heroleftdiv {width: 59%;}
.herorightdiv {width: 40%; }
	.herotitle {font-size: 90px; line-height: 80px;}
	.heroleft img {width: 480px; left: -75%;}
	.sec2 h1 {font-size: 35px; line-height: 50px;}
	.sqbox {width: 100%;}
}

@media (max-width: 1024px) {
h1 {font-size:25px; line-height:30px;}
	.logo {width: 120px;}
	.logo span {font-size: 14px;}
	.logo1 {width: 150px;}
	.hero {height: 600px;}
	.herotitle {font-size: 80px; line-height: 70px;}
	.heroleft img {width: 380px; left: -60%;}
	.heroright {padding: 0 0 0 70px;}
	.heroright img {width: 80px;}
	.heroright span {font-size: 35px;}
	.heroright p {font-size: 15px; line-height: 20px;}
	.cta a {padding: 20px 40px;}
	.wave {height: 200px; bottom: -100px;}
	.sec2 h1 {font-size: 30px; line-height: 40px;}
	.sqbox .col-md-9 {padding-left: 40px;}
	.sec2 .cta a.w-50 {width: auto!important;}
}

@media (max-width: 1024px) and (max-height: 1366px) {}

@media (max-width: 1023px) {
    
   
}

@media (max-width: 991px) {
.hero .caption h1 {margin-top: 0px;}
	.hero .caption {margin: 200px auto 50px;}
	.heroright:before {width: 200px; height: 58px;  top: -20%;}
	.sqbox .col-9 {padding-left: 20px;}
	.sec2 {overflow: hidden;}
	.sec2 .col-md-5 img {max-width: 150%;}
}

@media (max-width: 800px) {
	.herotitle {font-size: 70px; line-height: 60px;}
	.heroleft {padding: 0 20px;}
	.heroleft img {width: 300px; left: -72%; bottom: -45px;}
	.heroright {padding: 0 0 0 50px;}
	.heroright img {width: 60px;}
	.heroright span {font-size: 25px;}
	.cta a {font-size: 20px;}
	.sec2 h1 {font-size: 26px; line-height: 35px;}
}

@media (max-width: 768px) {
	.herotitle {font-size: 60px;}
	.heroleft img {width: 300px; left: -80%;}
}

@media (max-width: 767px) {
.col, .col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-auto, .col-lg, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-auto, .col-md, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-auto, .col-sm, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-auto, .col-xl, .col-xl-1, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-auto {padding:0 20px;}
.left, .right, footer {text-align:center;}
	.container {max-width: 100%;}
	header {margin: 20px 0;}
.w-25, .w-50, .w-75, .w-65, .w-85, .w-40 {width:100% !important;}
.logo {width: 110px;}
	.logo span {font-size: 9px; line-height: 12px;}
	.logo1 {width: 100px;}	
	.hero {height: auto;}
	.hero .caption {width: 100%; text-align: left;/* margin-top:100px;*/}
	.heroleftdiv, .herorightdiv {width: 100%;}
	.heroleft {border: none; padding: 0; margin-bottom: 50px;}
	.heroright {padding: 0 50px;}
	.heroleft img {left: -110%;}
	.hero:before {top: 15%;}
	.hero:after {bottom: 20%;}
	.heroright:before {display: none;}
	.sec2 {padding: 70px 0 0;}
	.sqbox p {font-size: 16px; line-height: 22px;}
	.sec2 .col-md-5 img {position: relative; width: 100%; margin-left: 10%;}
	.sec2 .cta a {margin: 30px 0;}

	/*footer {padding: 50px 0;}
	.footerbtm {margin-top: 50px;}*/
	.footerbtm li a {width: 35px; height: 35px; padding: 6px 0;}
	.footerbtm li a .fa:before {font-size: 18px;}
	.cta {margin-left: auto;}
	.tc br {display: none;}
	/*.tc {    transform: rotate(-90deg);    width: 530px;    display: block;    position: absolute;    left: -250px;    bottom: 220px;    font-size: 8px; overflow: hidden;}*/
	.herpimgline {bottom: 10px;}
	/*.float a {position: fixed; bottom: 0; left: 0;  width: 100%; text-align: center; z-index: 2; display: block;}*/
}

@media (max-width: 576px) {    
	
	
	.hero .caption {margin: 150px auto 50px;}
	.heroright {padding: 0 20px;}
	.heroright img {margin: 0 20px 0 0;}
	.sec2 h1 br{display: none;}
	
}

@media (max-width: 455px) {
    .formdiv iframe {width: 350px;}
}

@media (max-width: 414px) {
   
}

@media (max-width: 383px) {
	.herotitle {font-size: 50px; line-height: 50px;}
	.heroleft img {width: 270px; left: -120%; bottom: -25px} 
	.heroright .mb-3 {margin-bottom: 10px!important;}
	.sqboxnum {width: 60px;height: 70px; font-size: 40px;  line-height: 45px;}
	.sqboxnum:before, .sqboxnum:after {top: 15px;}
	.sqbox:first-of-type .align-items-center {align-items: flex-start!important;}

}

@media (max-width: 375px) {

}

@media (max-width: 360px) {
	h1 {font-size: 20px; line-height: 25px;} 
	.formdiv input {padding: 5px 10px;}
	.heroleft {margin-bottom: 30px;}
	
}

@media (max-width: 320px) {
	.heroright p {font-size: 12px; line-height: 15px; margin-bottom: 10px;}
	.heroleft img {width: 210px; left: -90%;}
	.cta a {padding: 10px 30px;}
}