@media only screen and (min-width:1921px) { }
@media only screen and (min-width:1540px) {
    .container { max-width: 1536px; }
}

@media only screen and (max-width:1740px) {
    .t250{font-size: 200px;}
    .t200{font-size: 150px;}
    .t50, h3{font-size:36px;}
    h1, .th1, h2, .th2, .t80{letter-spacing: -2px;font-size: 70px;}
    .mb-250{margin-bottom: 200px;}
    .pt-250{padding-top: 200px;}
    .pb-250{padding-bottom: 200px;}
    .titleanim .split-char{padding-bottom: 5px;padding-right: 2px;}
    .applicamarqee  .borderboxcol{max-width: 400px;min-height: 400px;}
    .mainheader{padding: 20px 75px;}
    .mainheader.sticky{padding: 15px 75px;}
    .imgrightcontent{padding: 100px;}
    .textanimation{min-width: 290px;height: 70px;}

}
@media only screen and (max-width:1540px) {
    .topherocontentleft{ margin-top: 150px;}
    .t250{font-size: 180px;}
    h1, .th1, h2, .th2{font-size: 60px;}
    h3,.th3,.t50{font-size: 30px;}
    h4, .th4{font-size: 28px;}
    .mainheader{padding: 20px 50px;}
    .mainheader.sticky{padding: 15px 50px;}
    .hmheroelement{padding-left: 70px;}
    .left-padding {padding-left: calc(((100% - 1320px) - 24px) / 2);}
    .right-padding {padding-right: calc(((100% - 1320px) - 24px) / 2);}
    .coolingsysrow{font-size: 18px;}

}

@media only screen and (max-width:1440px) {
    .t250 {font-size: 150px;}
    .t200 {font-size: 120px;}
    h1, .th1, h2, .th2, .t80{font-size: 50px;letter-spacing: -1px;}
    h3,.th3,.t50{font-size: 28px;}
    h4, .th4{font-size: 26px;}
    .t24{font-size: 20px;}
    .mb-200{margin-bottom: 100px;}
    .mb-250{margin-bottom: 150px;}
    .pt-250{padding-bottom: 150px;}
    .pb-250{padding-bottom: 150px;}
    .left-padding {padding-left: calc(((100% - 1140px) - 24px) / 2);}
    .right-padding {padding-right: calc(((100% - 1140px) - 24px) / 2);}
    .topherocontentleft{ margin-top: 120px;}
    .applicamarqee  .borderboxcol{max-width: 350px;min-height: 350px;}
    .accordion-button{padding-right: 120px;}
    .accordion-body{padding-right: 120px;}
    .imgtoprightext {width: 65%;}
    .imgrightcontent {padding: 50px 70px;}
    .buildforarorow .leftopvectorbrand{width: 40%;top: -150px;}
    .buildtextright{padding-right: 50px;}
    .marqeetextover {padding: 0px 50px;}
    .textmarqee{margin-top: 30px;}
    .vidbackside video{width: 75%;}
    .footerinfo .mb-50{margin-bottom: 30px;}
    .textanimation{min-width: 250px;height: 60px;}

}
@media only screen and (max-width:1366px) {
    .buildforarorow .leftopvectorbrand {width: 37%;top: -140px;}
 }
@media only screen and (max-width:1280px) {

}
@media only screen and (max-width:1200px) {
    body{font-size: 18px;line-height: 26px;}
    .t250 {font-size: 120px;letter-spacing: -3px;}
    .t200{font-size: 100px;}
    .mb-250{margin-bottom: 100px;}
    .mb-200{margin-bottom: 100px;}
    .pb-250{padding-bottom: 100px;}
    .pt-250{padding-top: 100px;}
    .mb-30{margin-bottom: 20px;}
    p{margin-bottom: 15px;}
    h1, .th1, h2, .th2, .t80 {font-size: 36px;margin-bottom: 20px;}
    h3,.th3,.t50{font-size: 24px;}
    h4, .th4 {font-size: 22px;}
     h5, .th5{font-size: 20px;}
    .textLoad .split-char, .titleanim .split-char{padding-bottom: 10px;}
   .left-padding {padding-left: calc(((100% - 900px) - 24px) / 2);}
    .right-padding {padding-right: calc(((100% - 900px) - 24px) / 2);}
    .topherocontentleft{margin: 150px 0px 20px;}
    .hmheroelement{padding: 0px 50px 50px;}
    .topherocontentleft h1 {margin-bottom: 30px;}
    .accordion-button, .accordion-body{padding-right: 50px;}
    .accordion-button{font-size: 18px;padding-top: 15px;padding-bottom: 15px;}
    .buildforelem .brandvectorleft{width: 30%;bottom: auto;top: 0px;z-index: -1;}
    .coolgridtext{grid-template-columns: 1fr;gap: 15px;}
    .imgtoprightext{width: 100%;}
    .buildforarorow .leftopvectorbrand{top: -50px;}
    .textmarqee {margin-top: 0px;}
    .marqeetextover  img{width: 300px;}
    .footerinfo .mb-50{margin-bottom: 20px;}
   .mainfooter{padding: 70px 0px;}
   .applicamarqee  .borderboxcol{max-width: 350px;min-height: 300px;}
   .imgleftcol{height: initial;}
   .footerlink ul li{font-size: 18px;}
   .imgtoprightext{margin-bottom: 30px;}
   .textanimation {min-width: 170px;height: 44px;margin-left: 8px;}
   .imgslidecol{padding-right: 20px;}
   .coolcontent .lg-text{right: 10px;}
   .buildforarorow{padding: 0px 40px;}
    .buildforarorow img{width: 190px;}
    .nextitemrow [class*="col-"]{margin-bottom: 30px;}
    .coolcontent{grid-template-columns: 1fr;gap: 0px;}
    .h3title{margin-bottom: 20px;}
    .coolingsysrow.mb-100{margin-bottom: 70px;}
    .cooltitle{top: 80px;}
    
}
@media only screen and (max-width:992px) {
    .mb-200{margin-bottom: 70px;}
    .t250{font-size: 90px;}
    .t200 {font-size: 70px;}
    .t80{font-size: 30px;}
    h5, .th5{font-size: 20px;}
    h3, .th3, .t50 {font-size: 22px;}
    .left-padding{padding-left: calc(((100% - 700px) - 24px) / 2);}
    .accordion-button{padding: 15px 20px;}
     .accordion-body{padding:0px 20px 10px;}
     .hardwarerow .left-padding{padding: 0px 30px;}
     .hardwarerow h3 br{display: none;}
     /* .hardwarerow img{height: 400px;} */
     .accordion {border-right: 1px solid #555555 ;}
     .buildforelem h2{margin-left: -5px;}
     .appmarqshade{padding-left: 0px;padding-top: 30px;}
     .imgrightcontent{padding: 30px;}
     .marqeetextover img{width: 250px;}
     .coolinglabrow .mb-50{margin-bottom: 30px;}
     .letalkright{padding:0px 12px;}
     .letstalkcol [class*="col-"]:first-child{padding-right: 20px;}
     .textLoad .split-char, .titleanim .split-char{padding-bottom: 0px;line-height: 1.2;}
     .cooltitle{top: 50px;}
}
@media only screen and (max-width:767px) {
    .container{padding: 0px 20px;}
    .t250 {font-size: 60px;}
    h1, .th1, h2, .th2, .t80{font-size: 28px;}
    h3, .th3, .t50 {font-size: 20px;}
    .mb-100{margin-bottom: 50px;}
    .mb-250{margin-bottom: 70px;}
    .pt-250{padding-top: 70px;}
    .pb-250{padding-bottom: 70px;}
    .pb-100{padding-bottom: 50px;}
    .pt-100{padding-top: 50px;}
    .mainheader.sticky, .mainheader{padding: 10px 20px;}
    .mainheader.sticky .logo a,.mainheader .logo a{width: 140px;}
    .hmheroelement{padding: 0px 20px 50px;}
    .topherocontentleft{margin-bottom: 20px;margin-top: 100px;}
    .topherocontentleft h1{margin-bottom: 20px;font-size: 24px;}
    .titleanim .split-char{padding-right: 0px;}
    .accordion-button{font-size: 16px;justify-content: space-between;}
    .accordion-button::after{margin-left: 10px;}
    .buildforelem{padding: 0px 20px;}
    .applicamarqee {margin-bottom: 0px;}
    .coolgridtext {margin-top: 20px;}
    .coolingsysrow .mb-100{margin-bottom: 30px;}
    .borderbottomcol [class*="col-"]:first-child, .productslider .row [class*="col-"]:first-child{margin-bottom: 20px;}
    .h3title{margin-bottom: 20px;}
    .borderbottomcol{margin-bottom: 30px;padding-bottom: 30px;}
    .imgleftcol, .imgtoprightext{display: none;}
    .imgrightcontent{padding: 70px 20px;}
    .britemcol h4{margin-bottom: 20px;margin-top: 20px;color: #000;}
    .mobileshow :last-child{margin-bottom: 0px;}
    .britemcol{padding-bottom: 30px;margin-bottom: 30px;opacity: 0;transform: translateY(50px);}
    .marqeetextover, .buildtextright{padding: 0px 20px;}
    .marqeetextover {margin-bottom: 25px;}
    .footerlogo img{width: 150px;margin-bottom: 20px;}
    .mainfooter .mb-200{margin-bottom: 40px;}
    .footerbotrow{flex-direction: column-reverse;}
    .marqeetextover img {width: 200px;}
    .footerinfo .mb-50{margin-bottom: 10px;}
    .footerinfo{margin-bottom: 20px;}
    .footerlink {margin-bottom: 20px;}
    .buildtextright p:last-child{margin-bottom: 0px;}
    .hardwarerow .left-padding{padding: 0px 20px;}
    .hardwarerow img{height: 300px;margin-bottom: 20px;}
    .vidbackside{left: 0px;}
    .buildforarorow .leftopvectorbrand{top: -50px;}
    .buildforelem .brandvectorleft{left: auto;right: 0px;width: 40%;}
    .imgslidecol{padding-right: 0px;}
    .imgslidecol img{width: 100%;}
    .textanimation {min-width: 145px;height: 35px;margin-left: 5px;}
    .coolcontent{grid-template-columns: 1fr;}
    .marqeelogorow {padding-bottom: 0px;}
    .marqeelogorow .borderboxcol{position: relative;padding: 0px 20px 30px;width: 100%;text-align: center;}
    .marqeelogorow span img{width: 140px;}
    .footerinfo a{font-size: 24px;}
    .buildforarorow{padding: 0px 20px;}
    .buildforarorow img { width: 150px;}
    .fetureitems [class*="col-"]{margin-bottom: 30px;}
    .fetureitems [class*="col-"]:last-child{margin-bottom: 0px;}
    .buildforarorow{text-align: center;}
    .cooltitle{top: 150px;}
    .liquidcaption {position: relative;}
    .letalkright .btn-theme {font-size: 18px;}
    .mainfooter .mb-50{margin-bottom: 30px;}
    .fetureitems{text-align: center;}
    .fetureitems img{width: 100%;}
    .nextitemrow [class*="col-"]:last-child{margin-bottom: 0px;}
    .coolingsysrow .mb-50{margin-bottom: 25px;}
    .liquidcaption .bg-white{padding-right: 0px;padding-left: 0px;}
}
@media only screen and (max-width:580px) {
    
 }
@media only screen and (max-width:375px) {

}

/* animation keyframe css */
.animated { animation-duration: 1s; animation-fill-mode: both; }
.animated.infinite { animation-iteration-count: infinite; }
@keyframes fadeInDown {
    0% { opacity: 0; transform: translateY(-100px); }
    100% { opacity: 1; transform: translateY(0); }
}
.fadeInDown { animation-name: fadeInDown; }
@keyframes fadeInLeft {
    0% { opacity: 0; transform: translateX(-100px); }
    100% { opacity: 1; transform: translateX(0); }
}
.fadeInLeft { animation-name: fadeInLeft; }
@keyframes fadeInRight {
    0% { opacity: 0; transform: translateX(100px); }
    100% { opacity: 1; transform: translateX(0); }
}
.fadeInRight { animation-name: fadeInRight; }
@keyframes fadeInUp {
    0% { opacity: 0; transform: translateY(100px); }
    100% { opacity: 1; transform: translateY(0); }
}
.fadeInUp { animation-name: fadeInUp; }

@keyframes fadeIn {
    0% { opacity: 0; transform: translateY(100px); }
    100% { opacity: 1; transform: translateY(0); }
}
.fadeIn { animation-name: fadeIn; }