.image-container-20{
    width : 20% !important;
}

.height-65{
    max-height: 40vh;
}
    /* Extra small devices (phones, less than 576px) */
@media (min-width: 575.98px) {
    .section4-flex{
        display:block !important;
    }
     .button-div{
        margin-top : 10% !important;
    }
}
    /* Extra small devices (phones, less than 576px) */
@media (max-width: 575.98px) {
  /* Styles for phones */
      .banner-wrapper {
      height: 100vh !important;
    }
    .section2-heading-content{
        width: 100%;
    }
    
    .section4-flex{
        display:block !important;
    }
    .section4-card{
        width : 100% !important;
    }
    .height-450{
        width: 95% !important;
    }
    .section2-heading{
        font-size : 28px !important;
    }
    
    .button-div{
        margin-top : 10% !important;
    }
    
    .bt{
        font-size: 13px !important;
        letter-spacing : 2px !important;
    }
    .fl{
        font-size : 30px !important;
        line-height : 1em !important;
    }
    .sl{
        font-size : 22px !important;
        width : 95% !important;
    }
    

}

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) and (max-width: 767.98px) {
  /* Styles for small devices */
      .banner-wrapper {
      height: 140vh;
    }
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) and (max-width: 991.98px) {
  /* Styles for tablets */
  
    .header-mobile{
         display : flex !important;
      }
  
      .banner h1 {
        font-size: 2rem;
      }
      .custom-carousel .card {
        flex: 0 0 100%; /* Desktop: 3 cards per slide */
      }
      .section2-heading-content{
          width:95% !important;
      }
      .nav-mobile{
          position: absolute;
      }
      
      .navbar-nav {
        float: none; 
        }
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) and (max-width: 1199.98px) {
  /* Styles for small desktops */
      .header-mobile{
         display : none !important;
      }
      .navbar-nav {
         float: none; 
    }
}

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
  /* Styles for large desktops */
      .header-mobile{
         display : none !important;
      }
     .navbar-nav {
         float: none; 
    }
}