/* ===============================
   RESPONSIVE (HEADER + HERO)
================================= */
@media (max-width: 767.98px) {
  
    .testimonial-carousel{
        position:relative;
    }
    .map {
        margin-top: 30px;
        margin-bottom: 30px;
    }
    .odd2{
        order:2
    }
    .map-frame {
        width: 100%;
        height: 250px;
        border: 0;
        border-radius: 20px !important;
    }
    .testimonial-carousel:after{
        content: "";
        background: url(../img/mrfboy1.webp) no-repeat;
        background-size: contain;
        width: 76%;
        height: 276px;
        position: absolute;
        bottom: 7%;
        left: 11%;
        z-index: -1;
    }
    .mobilesizelogo{
        width:90%!important;
    }
    .testdost{
        width:40%!important;
    }
    .manufacturer-model-container {
        flex-direction: column;
        gap: 15px;
    }
    .hero {
         height: auto;
        background: none;
        display: block;
        padding-bottom: 22px;
    }
    .curve2::after{
        background: none;
        content:none;
    }
    .twocontainer img {
        border-radius: 20px;
    }
    #container-right img {
    border-radius: 20px;
    padding-top: 15px;
} 
#text-right{ 
        padding-left: 15px!important;
}
.mss {
    margin-left: 0% !important;
    margin: auto;
    width: 100%;
}
.shape-content h3 {
    font-size: 12px;
}
    
.base-shape{ 
    bottom: 12px;
    left: 80%;
    height: 118px;
    border-radius: 312px 60px 104px 20px;
    width: 163px;
    transform: translateX(-78%);
}
.section4 {  
    padding-left: 15px;
    padding-right: 15px;
        height: auto;
}
    .prod img {
        width: 100%;
        height: 44%;
        object-fit: contain;
    }
    .header {
        height: auto;
        padding: 5px 0;
    }
    
    .select-group {
        padding: 20px 15px;
    }
     
.textdarkmobile{
    color:#000;
}
.mf-32 {
    font-size:32px;
}
.mf-33 {
    font-size:33px ;
}
.mf-24 {
    font-size:24px ;
}
.mf-20 {
    font-size:20px!important;
}
.mf-26 {
    font-size:26px ;
}
.mf-40 {
    font-size:40px;
}
.topsm{
    margin-top:-20px;
}
.per{
    margin-left: 18%;
}
 section,body{
     overflow-x:hidden;
 }
    .footer-links li
    {
        padding-bottom:2px;
    }
    #footer-lets
    {
        padding-top: 58%;
    }
    .footer { 
        background-image:url("../img/banner/footer-mobile.webp") !important;
        background-size: contain!important;
        background-position: top!important;
        height: auto !important;
    }
    .overlay-footer{
        background: linear-gradient(180deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 50%, rgba(0, 0, 0, 1) 100%) !important;
    }
    .footer-logo {
    position: absolute;
    top: 10%;
    left: 52%;
    }
  #story-imgg{
        display:none;
    }
    .features-list p
    {
        text-align:left !important;
    }
    .about-section
    {
        height: 200px !important;
    }
    .story-image-section-right img, .story-image-section-left img
    {
        border-radius: 20px;
    }
   
    .menu-toggle {
      display: flex;
    }
     
    #MenuItems {
      display: none;
      position: absolute;
      top: 100%;
      left: 0;
      right: 0;
      background: #eb1c24 !important;
      flex-direction: column;
      padding: 20px;
      gap: 12px;
      box-shadow: 0 5px 15px rgba(0,0,0,0.2);
    }
    #MenuItems a {
      color: #fff;
    }
    #MenuItems.active {
      display: flex;
    }
    
    .logo img {
      height: 30px;
    }
    #calcu-btnn-sec h3{ 
        text-align:center;
    }
    #calcu-btnn-sec p{ 
        text-align:left;
    }
    #cal-sectionn {
        padding:0 15px 30px !important;
        text-align:left;
        box-shadow: rgba(50, 50, 93, 0.25) 0px 30px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px !important;
    }
.immmg{
        height: auto;
        background-image:none;
}
#section631 {
    display: block;
}
.botm-right {
    padding: 5px 15px;
    bottom: auto;
}
.hehe{
        justify-content: center;
}
.bgg-image.mmmm{
    background:none;
    height: auto;
}
.botm-right.uu{
        padding: 15px 15px;
        bottom: auto;
        left: auto;

}
.iimmgg{
        padding: 15px;
    border-radius: 30px;
}
.curve-box::after{
    content:none;
}
    .mrfsize{
        display: none;
    }
    .rotation-wheel{
        display:none;
    }
         
    
    .red-textt{
        color:#eb1c24;
        font-size:30px;
    }
    .btn {
      width: 100%;
      font-size: 16px !important;
      max-width: 320px;
      padding: 20px 25px;
    }
    .icon {
      width: 60px;
      height: 60px;
      font-size: 24px;
    }
    #brand-check{
        width:90vw;
        margin:0 auto;
    }
    
    .prod-cat {
        height:200px;
        
    }

    
    #products-index{
        padding:5px !important;
    }
    .section6 , .section7{
        /*width:105vw;*/
    }
    #near-faq{
        display:none;
    }
    #faq-btnn{
        display:none !important;
    }
    .faq-leftt{
        text-align:center;
    }
    .testi-mar{
        margin-top:2px !important;
    }
    .section-content .hero-buttons{
        display:none;
    }    
    

    /* About / story section */
    .story-text-section {
      padding-left: 20px;
      padding-top: 10px;
    }
    .story-title {
        padding:0 5%;
        font-size: 2rem;
        text-align:start;
    }
    .section1-button{
        width:auto;
        position: relative;
        z-index: 4999;
        text-align: center !important;
    }
    .our-story{
        padding: 0px;
        margin-top: 0px !important;
        margin-bottom:0px !important;
    }
    .button-cta{
        margin-top:10px !important;
    }
    #abt-butn{
        padding:0 15px;
    }
    .story-title{
        font-size:28px;

    
    /*Tyre Section*/
    .about-header h1{
        font-size:28px;
    }
    .select-group{
        width:90vw;
        padding:5px !important;
    }
    
    
    .tcent p{
        font-size:10px !important;
    }
    .twocontainer img {
        border-radius: 0px;
    }
    #container-right img{
        border-radius: 0px;
        padding-top:0px;
    }
    .section2{
        padding:0px 0px 20px 0px;
        overflow-x:hidden;
    }
    .section2 img{
        border-radius:10px
    }
    #container-right img{
        border-radius:10px;
    }
    
    .section-2-text{
        padding:0 5% 0 5%;
    }
    .section-2-text h1{
        font-size:24px;
        text-align:center !important;
    }
    .section-2-text p{
        text-align:center !important;
    }
    #text-right{
        padding:5%;
        text-align:left;
    }
    .ps-5 {
        padding-top:6px !important;
        padding-left: 0rem !important;
        border-radius:0px !important;
    }
    .section4 {
        height:auto !important;
        margin-top:10px !important;
        padding:0 !important;
    }
    .text-center{
        text-align:left !important;
        width:90vw;
        margin-top:20px !important;
    }

    .mss{
        margin:auto !important;
    }
    /*.model-selection{*/
    /*    margin:auto;*/
    /*    width:80vw !important;*/
    /*}*/
    .model-selection{
        /*border:2px solid blue;*/
        background: linear-gradient(131deg, #FFE8E8, #D4D4D4);
        border-radius:20px;
    }

    .bgg-image{
        height:400px;
        
    }
    .section7-imggg{
        display:block;
    }
    .section7-imggg img{
        border-radius:10px;
    }
    .botm-right{
        padding:0% 0%;
        margin-top:0px;
        border-radius:0px;
        bottom:0;
    }
    .botm-right h2{
        font-size:25px;
        text-align:center;
    }
    .text-center h1{
        font-size:28px;
        padding:0 5px;
        text-align:center;
    }
    
    .botm-right p{
        width:auto !important;
    }
    .text-center p{
        text-align:center !important;
        padding:0 5px;    
    }
    #text-right p{
        font-size:16px !important;
        text-align:left;
    }
    /*.owl-carousel .owl-item img {*/
    /*    height:125px;*/
    /*    width:auto !important;*/
    /*}*/
    .no-js .owl-carousel, .owl-carousel.owl-loaded {
        /*padding-left:35px;*/
        /*margin-left: 30px;*/
    }
    #category_carousel{
        margin-left:30px;
    }
    /*#carosu-owl{*/
    /*    margin-left:0px ; !important;*/
    /*}*/
    #carousellll{
        border-radius:0px !important;
    }
    .testimonial-controls {
        margin-bottom:-135px;
    }
    #owl-carousel-imgg {
        width:160px !important;
    }
    #mrftoon-selectt{
        display:none;
    }
    .mrftoon{
        position:inherit;
        right:0!important;
    }
    .mrftyres{
        display:none;
        top: 47%;
        left: 10%;
        height: auto;
        width: 331px;
    }
    

    .prod {
        position: absolute;
        height:200px;
        top: -10px;
        left: 90%;
    }
    .prod img {
        width: auto !important;
        height: 80%;
    
    }
    .shape-content h3{
        font-size:12px;
    }
    .shape-content p{
        display:none;
        font-size:8px !important;
    }
    .base-shape{
        position: absolute;
        bottom: 20px;
        left: 50%;
        transform: translateX(-50%);
        background-color: #D9D9D9;
        width: 232px;
        height: 140px;
        z-index: 2;
        margin: 0px 32px !important;
        clip-path: polygon(0% 0%, 100% 0%, 90% 100%, 0% 100%);/
    }
    .bgg-image{
        background-image: none;
    }
    #section631{
        display:block;
    }
     .bgg-image img{
        border-radius:10px;         
     }
    .curve-box::after{
        display:none;
    }
    .bgg-image2{
        /*background-image: url(../img/section7m.webp);*/
        background-image: none;
        height:min-content;
    }
    .section-content{
        padding:0 5%;
        position:relative;
        bottom:0px;
        color:black;
        text-align:center;
        
    }
    .section-content p{ 
        color:black;
        margin-bottom:-5px;
    }
    #testi-headl{
        /*text-align:left !important;*/
        /*padding-left:15px;*/
    }
    #testimonials-texts p{
        text-align:center !important;
    }
    #indexx-faq{
        margin-top:50px;
    }
    .faq-section{
        padding-left:5%;
        padding-right:5%;
    }
    
/*About Us Section*/
   
    .about-section {
        width: 100% !important;
        height: 200px !important;
    }
    
    .story-image-section-left img {
        border-radius:10px !important;
    }
    .story-image-section-right img{
        border-radius:10px !important;
    }
    .story-text-section h3{
        padding:0 5%;
    }
    .features-list {
        padding:0 5%;
    }
    


/*Contact Page*/
    #conta-detai1{
        width:auto !important;
    }
    #conta-detai1 p{
        text-align:center !important;
    }
    .contact-form{
        padding: 0px !important;
    }
    .contact-card{
        padding:15px 10px !important;
    }
    .form-control , #cont-form-btnn {
        width:90% !important;
    }
    .form-title{
        letter-spacing:0px !important;
    }
    .form-label , .form-control , #cont-form-btnn{
        margin: 0px 15px;
    }
    

  .form-title{
      position: relative;
      right: 45px;
      
  } 
 
    .map{
        overflow-x: hidden;
    }
    #locationn{
        text-align:center !important;
    }
    
    
    
  .map-frame {
      height: 250px;
      border-radius:30px !important;
      padding: 13px;
  }
  .footer-btn-whatsapp .wa-inner{
      height:40px;
      width:40px;
  }
  .footer-btn-whatsapp i{
      font-size:24px;
  }
  
/*Footer Section*/

    .footer {
    width:100%;
    height:1200px !important;
    background-image: url("../img/banner/footer-mobile.webp") !important;
    background-size: cover;
    }
    #footer-formm{
        display:none;
    }

    .footer-content{
        top:10px !important;
    }
    
    #social-iconsss{
        /*display:none !important;*/
    }
    #explore-more{
        /*display:none;*/
    }
    #akashtyre-copyright p{
        text-align:center !important;
        padding;0px !important;
    }
    #clarion-copyright p {
        text-align: center !important;
        width: 100% !important;
    }
    
    
    .copyright .row {
        justify-content: center !important;
    }
    .footer-links li {
        margin-bottom:6px;
    }
    .column-title{
        font-size:22px !important;
    }
    
    
    /* Blogs section */
    .lat-blog-section{
        display:none;
    }
    #left-side-blog,
    #right-side-blog {
      width: 100%;
      height: auto;
      border-radius: 10px;
      margin-bottom: 20px;
    }
    #right-side-blog {
      padding: 20px;
    }
    #right-side-blog h1 {
      font-size: 24px;
    }
    .blog-card img {
      height: 200px;
    }
     
     
}