@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
*{ padding:0px; margin:0px; }
html{-webkit-box-sizing:border-box; box-sizing:border-box;}
*,*:before, *:after{-webkit-box-sizing:inherit;  box-sizing:inherit;}
img{border:0; max-width:100%; height:auto;}
:focus{outline:0;}
::-moz-focus-inner{border:0;}
input[type=number] {  -moz-appearance: textfield;}
ul,li,ol{list-style: none;}
a{outline:none; text-decoration:none; -webkit-tap-highlight-color:rgba(0, 0, 0, 0); transition:all ease 0.4s; color:#000;}
body{font-family: "Poppins", sans-serif; font-weight:400; font-size: 24px; line-height: 1.2; background-color: #191515; -webkit-font-smoothing:antialiased; -webkit-text-size-adjust:none; -webkit-tap-highlight-color:transparent; text-rendering: optimizelegibility;}
.container {
    width: 1720px;
    max-width: 100%;
    margin: 0 auto;
}
.txt-wt{color: #fff;}
.comm-hdr{ font-size: 45px; line-height: 1.2; font-weight: 600; color: #B50617; margin-bottom: 30px;}
.comm-hdr span{color: #fff;}
.comm-hdr.txt-wt{color: #fff; line-height: 1;}
.comm-hdr.blk-txt,.blk-txt{color: #333;}
.d-flex{display: flex;}
.btn-ui{background-color:#B50617; font-size: 37px; font-weight: 700; border: 2px solid; cursor: pointer; line-height: 2; display: inline-flex; color: #fff;  border-radius: 50px; padding: 0 40px; transition: all ease-in 0.1s;}
.btn-ui:hover{opacity: 0.9;}
.txt-center{text-align: center;}
.wid-50{width: 50%;}
.mtb-6{margin: 80px 0;}
.mr-25{margin-right: 25px;}
.pdtb-6{padding: 80px 0;}
hr{border-color: #00B0CC; border-width: 3px;}
.btn-ui-ep{background-color: #B50617; font-size: 33px; font-weight: 700; box-shadow: 0 8px 5px #333; position: absolute; right:50px; bottom: -20px; border: 2px solid; cursor: pointer; line-height: 1.5; display: inline-flex; color: #fff;  border-radius: 50px; padding: 7px 25px; transition: all ease-in 0.1s;}
.btn-ui-ep:hover{opacity: 0.9;}
.owl-carousel,.relative{position: relative;}
.owl-carousel .owl-nav button.owl-prev,.owl-carousel .owl-nav button.owl-next{
    width: 48px;
    height: 48px;
    position: absolute;
    border: none;
    left: 1vw;
    top: calc(100% - 60%);
    z-index: 9;
}
.owl-carousel .owl-nav button.owl-next{ left: 95vw;}
.brands-lg-crsl .owl-stage{display: flex; align-items: center;}
.top-banner{ background: url(../ht-mahabrands/top-banner.svg) left top no-repeat; background-size: 115% 100%; padding: 10vh 0; background-color: #161a1c; }
.top-banner img.logo{ margin-bottom: 25px; max-width: 322px;}
.top-banner h1{margin-bottom: 0; font-size: 41px; font-weight: 600;}
.top-banner h3{font-size: 37px; position: relative; margin-bottom: 4.5vh; padding-bottom: 3.5vh; font-weight: normal;}
.top-banner h3::before{ content: ""; position: absolute; left: 0; bottom: 0; width: 200px; height: 5px; background-color: #B50617;}
.abt-brands{font-weight: 300;}
.brands-wrap{background-color: #000; padding: 0;}
.brand-crsl h4,.brand-crsl h6{font-size: 23px; min-width: 300px; font-weight: 500; border-left: 3px solid #B50617; background: linear-gradient(90deg, #2E1F23 49%, #191515 95%,#191515 100%); padding: 7px 5px 0 15px; }
.brand-crsl h6{font-size: 16px; padding-top: 2px; font-weight: normal; padding-bottom: 10px;}
.brnd-info{position: absolute; top: 4vh; left: 7vw;}
.brand-crsl .item img{width: 100%;}
.ftr-epsd {background-color: #110E0E; padding: 80px 0 156px; background-image: url(../ht-mahabrands/ftr-btm.png), url(../ht-mahabrands/ftr-rt.png),url('../ht-mahabrands/shades.png') ; background-position: left bottom, right top, right center; background-repeat: no-repeat; background-size: 25%,25%,auto;}
.blue-bx{background: #352525;border: 2.07px solid #B91222; padding: 40px 32px; box-shadow: 0px 10px 42.14px rgba(185, 18, 34, 0.3); }
.ftr-epsd h2{margin-left: 15px; font-size: 68px;}
.ftr-info{width: 45%;}
.ftr-info h3{font-size: 30px;  font-weight: 600;}
.ftr-info h4{font-size: 17px; font-weight: 300; margin-bottom: 60px;}
.blue-bx iframe{border: 2px solid #B91222; width:780px; max-width: 50%; height: auto; }
.epsd-crsl.owl-carousel .owl-nav button.owl-prev{left: -40px; }
.epsd-crsl.owl-carousel .owl-nav button.owl-next{right: -60px; left: auto; }
.owl-carousel.epsd-crsl{width: 90%; padding-left: 15px; position: relative; font-size: 16px; font-weight: 300;}
.epsd-crsl h2{margin-left: 0; font-size: 55px; font-weight: 600;}
.brands-logo{background-color: #fff; padding: 40px 0; text-align: center;}
.brands-logo h3{font-weight: 700;}
.prt-cnvrsn{ background-color: #110E0E;background-image: url(../ht-mahabrands/convt-lt.png), url(../ht-mahabrands/convt-rt.png),url(../ht-mahabrands/conv-bt.svg); background-position: left top, right top, center bottom; background-repeat: no-repeat; background-size: 25%,25%, contain; padding-top: 25vh !important; padding-bottom: 65vh; font-size: 32px;}
.lp-bx{ margin-left: auto; width: 55%; }
.cnvs-info{width: 45%; font-weight: 300;}
.prt-cnvrsn h2{margin-bottom: 60px;}
.social-ico{justify-content: center; gap: 25px; margin: 2vh 0 0;}
.social-ico img{width: 50px; filter: grayscale(1);}
@media only screen and (min-width: 1900px) {
  .top-banner{ background-size: 125% 100%;}
  .btn-ui-ep{ bottom: -40px;}
}
@media only screen and (max-width: 1810px) {
  .container { width: 1559px;}
}
@media only screen and (max-width: 1681px) {
  .container { width: 1379px;}
  .pdtb-6{padding: 70px 0;}
  .btn-ui,.top-banner h3{font-size: 30px;}
  .ftr-info h4{margin-bottom: 40px;}
  .brand-crsl h4,.ftr-bx{font-size: 18px;}
  .brand-crsl h6{font-size: 12px;}
  .btn-ui-ep{font-size: 26px;}
}
@media only screen and (max-width: 1480px) {
  .container { width: 1140px;}
  body,.top-banner, .prt-cnvrsn{font-size: 20px;}
  .top-banner img.logo { max-width: 280px;}
  .comm-hdr{ font-size: 40px;}
  .top-banner h1{font-size: 33px;}
  .mtb-6 { margin: 60px 0;}
  .btn-ui{font-size: 28px;}
  .brand-crsl h4{font-size: 16px;}
  .ftr-bx,.owl-carousel.epsd-crsl{ font-size: 15px;}
  .owl-carousel .owl-nav button.owl-prev, .owl-carousel .owl-nav button.owl-next { width: 40px; height: 40px;}
  hr{border-width: 2px;}
  .prt-cnvrsn{padding-top: 20vh !important;}
  .prt-cnvrsn h2{margin-bottom: 45px;}
.ftr-epsd h2{font-size: 58px;}
.ftr-info h2{font-size: 44px; }
.ftr-info h3{font-size: 24px; }
.ftr-info h4{font-size: 15px; margin-bottom: 40px;}
.btn-ui-ep{font-size: 23px; right: 0; }
}
@media only screen and (max-width: 1320px) {
  .container { width: 1180px;}
  .comm-hdr,h1.comm-hdr{font-size: 30px;}
  .top-banner img.logo { max-width: 250px;}
  .btn-ui, .top-banner h3{font-size: 20px;}
  .brand-crsl h6 { font-size: 11px;}
  .btn-ui-ep{font-size: 21px; right: 50px;}
}
@media only screen and (max-width: 1220px) {
  .container { width: 960px;}
  body, .top-banner, .prt-cnvrsn { font-size: 18px;}
  .pdtb-6 {padding: 50px 0;}
  .owl-carousel .owl-nav button.owl-prev, .owl-carousel .owl-nav button.owl-next { width: 25px; height: 25px;}
  .prt-cnvrsn{padding-top: 17vh !important;}
  .epsd-crsl.owl-carousel .owl-nav button.owl-prev {
    left: -20px;
  }
  .epsd-crsl.owl-carousel .owl-nav button.owl-next {
      right: -40px;
  }
}
@media only screen and (max-width: 992px) {
  .container { width: 100%; padding: 0 20px;}
  .top-banner {
        font-size: 16px;
        padding-top: 12.5vh;
        padding-bottom: 5vh;
        background-size: 100%;
        background-position: right bottom;
        background-color: #161a1c;
    }
    .top-banner .wid-50{width: 60%;}
    .pdtb-6,.brands-logo {
        padding: 20px 0;
    }
    .abt-brands p br{display: none;}
  .top-banner img.logo { max-width: 150px; margin-bottom: 20px;}
  .btn-ui-ep{right: 25px;}
  .comm-hdr,h1.comm-hdr,.ftr-epsd h2{ font-size: 15px;}
  h1.comm-hdr span{display: block;}
  .top-banner h3{margin-bottom: 1vh; padding-bottom: 0.5vh;}
  .owl-carousel .owl-nav button.owl-next{ left: auto; right: -5px;}
  .owl-carousel .owl-nav button.owl-prev { left: -5px; }
  .owl-carousel .owl-nav button.owl-prev, .owl-carousel .owl-nav button.owl-next{width: 20px; height: 20px; top: calc(100% - 55%);}
  .brands-wrap{padding: 25px 15px;}
  .blue-bx{flex-direction: column; background-color: #191515; border-width: 1px 2px 1px 1px; padding: 22px;}
  .epsd-crsl .item{flex-direction: column;}
  .owl-carousel.epsd-crsl .owl-item .item{width: 100%;}
  .ftr-info h4,.ftr-info{margin-bottom: 15px;}
  .blue-bx iframe{max-width: 100%; border-width: 1px;}
  .wid-50,.ftr-info{width: 100%; margin: 0;}
  .mtb-6 {margin: 25px 0;}
  .owl-carousel.epsd-crsl{ margin: 20px auto; box-shadow: 0px 5px 22.14px rgba(185, 18, 34, 0.3); padding-left: 0; }
  .epsd-crsl .owl-item .blue-bx{margin-bottom: 0;}
  .epsd-crsl.owl-carousel .owl-nav button.owl-prev { left: -30px;}
  .epsd-crsl.owl-carousel .owl-nav button.owl-next { right: -30px; }
  .ftr-epsd{padding: 37px 0 50px;  background-size: 50%, 50%, 0;}
  .ftr-epsd h2 { margin-left: 0;}
  hr{border-width: 1px;}
  .btn-ui{padding: 3px 10px; border: 1px solid;}
  .prt-cnvrsn{background-size: 30%,50%, contain; padding: 43px 0 120px !important;}
  .prt-cnvrsn h2 { margin-bottom: 10px;}
  .prt-cnvrsn .d-flex.social-ico {gap: 15px; margin: 2vh 0 0; flex-direction: row;}
  .social-ico img{width: 20px;}
  .blue-bx iframe{margin-top: 28px;}
  .brand-crsl .item{margin: 0 20px; background-color: #191515;}
  .brand-crsl .item h4,.brand-crsl .item h6{text-align: left; padding-left: 10px; width: 155px; min-width: inherit; padding-right: 5px;
  background: linear-gradient(90deg, #000 0%, #191515 100%);}
  .brand-crsl h6{padding: 0 0 5px;}
  .brand-crsl .item img{max-width: 170px; margin-left: auto;}
  .brnd-info {top: 6vh; left: 8vw;} 
  .brand-crsl h4{font-size: 12px;}
  .ftr-bx, .owl-carousel.epsd-crsl,.ftr-bx, .ftr-info h4, .prt-cnvrsn {
        font-size: 10px;
    }
}
@media only screen and (max-width: 768px) {
  body,.top-banner,.brand-crsl h6{font-size: 9px;}
  .comm-hdr,h1.comm-hdr{font-size: 15px; margin-bottom: 10px;}
  h1.comm-hdr{font-size: 10px;}
  .top-banner img.logo{ max-width: 100px;}
  .top-banner p br{display: none;}
  .ftr-bx, .ftr-info h4, .prt-cnvrsn { font-size: 10px;}
  .btn-ui, .top-banner h3, .ftr-info h3{ font-size: 11px;}
  .top-banner h3::before{width: 52px; height: 1.5px;}
 }
 @media only screen and (max-width: 400px) {
 .brand-crsl .item img{max-width: 140px;}
 .brnd-info {top: 5vh; } 
 }
 @media only screen and (max-width: 370px) {
 .brand-crsl .item img{max-width: 125px;}
 }