@media (max-width: 768px) {
    .carousel-item .row {
        flex-direction: column;
        justify-content: center;
    }

    .carousel-item .card {
        width: 100%;
    }
    .navbar-nav {
     text-align: center;
 }

 .mega-menu {
     position: static;
     box-shadow: none;
 }
}
@media (min-width: 992px) {
    .carousel-item .col-md-4 {
        flex: 1 1 33%;
    }
}

/* Show 2 items on tablet */
@media (min-width: 768px) and (max-width: 991px) {
    .carousel-item .col-md-4 {
        flex: 1 1 50%;
      
    }
}

/* Show 1 item on mobile */
@media (max-width: 767px) {
    .carousel-item .col-md-4 {
        flex: 1 1 100%;
        /* 1 item per row */
    }
}
@media (max-width: 1199px) {

    /* On large screens (tablets or smaller), columns will stack */
    .mu-footer-widget {
        text-align: start;
    }
}

@media (max-width: 991px) {


    .mu-footer-area .row {
        flex-direction: column;
    }

    .mu-footer-widget {
        margin-bottom: 30px;
        /* Space between stacked sections */
    }
}

@media (max-width: 767px) {

    /* On mobile screens (phones), make the layout even more compact */
    #mu-footer {
        padding: 30px 0;
    }

    .mu-footer-widget h4 {
        font-size: 18px;
        /* Slightly smaller heading on mobile */
    }
}

/* -------------------------------------------problem ----------------------------------- */
/* responsive */
@media (max-width: 991.98px) {
    .navbar-nav .nav-item {
        position: relative;
    }

    .mega-menu {
        position: static;
        box-shadow: none;
        padding: 0 15px;
    }

    .navbar-nav .nav-item:hover .mega-menu {
        display: none;
    }
}

    @media (max-width: 1199px) {
        #mu-slider .mu-slider-single .mu-slider-content {
          padding: 0 10%;
        }
      
        #mu-slider .mu-slider-single .mu-slider-content {
          top: 13%;
        }
      }
      @media (max-width: 991px) {
      
        #mu-slider .mu-slider-single .mu-slider-content h2 {
          font-size: 35px;
          line-height: 65px;
          margin-bottom: 0;
        }
      
        #mu-slider .mu-slider-single .mu-slider-img {
          height: 400px;
        }
      
        #mu-slider .mu-slider-single .mu-slider-content a {
          font-size: 15px;
          margin-top: 5px;
          padding: 5px 15px;
        }
      
        #mu-slider .mu-slider-single .mu-slider-content p {
          font-size: 16px;
          line-height: 1.5;
        }
      
        #mu-abtus-counter {
          background-size: 100% 100%;
          padding: 60px 0;
        }
      
        #mu-abtus-counter .mu-abtus-counter-area .mu-abtus-counter-single span {
          font-size: 40px;
        }
      
        #mu-abtus-counter .mu-abtus-counter-area .mu-abtus-counter-single h4 {
          font-size: 30px;
          margin-top: 15px;
        }
      
        #mu-features {
          padding: 60px 0;
        }
      
        .mu-title p {
          padding: 0 20px;
        }
      
        #mu-features .mu-features-area .mu-features-content {
          margin-top: 30px;
        }
      
        ;
      }
      @media (max-width: 767px) {
      
        #mu-slider .mu-slider-single .mu-slider-content h2 {
          font-size: 30px;
          line-height: 60px;
        }
      
        #mu-abtus-counter {
          background-position: center center;
          background-size: cover;
        }
      
        #mu-abtus-counter .mu-abtus-counter-area .mu-abtus-counter-single {
          border: medium none;
          margin-bottom: 25px;
        }
      
        #mu-features .mu-features-area .mu-features-content .mu-single-feature {
          text-align: center;
        }
      
        #mu-features .mu-features-area .mu-features-content .mu-single-feature h4::after {
          display: none;
        }
      
      }
      @media (max-width: 640px) {
      
        #mu-slider .mu-slider-single .mu-slider-content h2 {
          font-size: 25px;
          line-height: 50px;
        }
      
        #mu-slider .mu-slider-single .mu-slider-img {
          height: 350px;
        }
      
        #mu-slider .mu-slider-single .mu-slider-content h4 {
          letter-spacing: 0;
        }
      
        #mu-slider .mu-slider-single .mu-slider-img figure img {
          width: auto;
        }
      }
      @media (max-width: 480px) {
      
        #mu-slider .mu-slider-single .mu-slider-content h2 {
          font-size: 18px;
          line-height: 35px;
        }
      
        #mu-slider .mu-slider-single .mu-slider-content h4 {
          font-size: 15px;
          line-height: 16px;
        }
      
        #mu-slider .mu-slider-single .mu-slider-content p {
          font-size: 14px;
          line-height: 1.5;
        }
      
        #mu-slider .mu-slider-single .mu-slider-content {
          padding: 0 2%;
        }
      
        #mu-slider .mu-slider-single .mu-slider-content {
          top: 5%;
        }
      
        #mu-slider .mu-slider-single .mu-slider-img {
          height: 270px;
        }
        .page{
            padding: 1rem 0.5rem !important;
        }
        .list-div {
            padding-left: 0rem !important;
        }
        .navbar-brand{
            margin-right: 0rem !important;
        }
      }
         
       @media (max-width: 991.98px) {
        .navbar-nav .nav-item {
            position: relative;
        }
      
        .mega-menu {
            position: static;
            box-shadow: none;
            padding: 0 15px;
        }
      
        .navbar-nav .nav-item:hover .mega-menu {
            display: none;
        }
      
        .navbar-nav .nav-item.show .mega-menu {
            display: block;
        }
      }

      @media (max-width: 767px) {
        .carousel-item img{
            width:225% !important;
            margin-left: -200px;
        }
        .eye{
            flex-direction: column !important;
        }
        .w-50{
            width: 100% !important;
        }
   
      .list-div{
          flex-wrap: wrap !important;
      }
      .navbar-brand{
          font-size: 15px !important;
          font-weight: 500;
        }
        .navbar-brand img{
          width: 60px !important;
        }
        .list-div li{
          width: 100% !important;
        }
        .eye{
                padding: 2rem 10px !important;
        }
        .layout{
          width: fit-content !important;
        }
        .left.con{
          width: 100% !important;
        }
        .main-head{
            text-align: center !important;
            font-size: 1.4rem;
        }
        }
        @media (min-width:360px) and (max-width:767px){
          .top-head1{
            display: flex;
            justify-content:space-around !important;
             flex-direction: column;
            align-items: center !important;
            padding: 0 10px;
            font-size: 12px !important;
            gap: 10px;
          }
          .top-head1 span{
            text-align: center;
          }
          .top-head2{

            all: unset !important;
            padding-top: 5px !important;
            width: 100% !important;
            display: flex !important;
            flex-direction: row !important;
            justify-content: space-around !important;
            align-items: center !important; 
            
            
          }
        }
        .top-head1{
          display: flex;
          justify-content: space-between;
          flex-wrap: wrap;
          flex-direction: row;
          align-items: center;
          padding: 0 10px;
          font-size: 1rem;
          gap: 10px;
        }
        
        .top-head2{
          display: flex;
          flex-direction: row;
          justify-content: center;
          align-items: center;
          gap: 30px;
      
        }
        .top-head2 a{
         
          color: rgb(241, 233, 233) !important;
          font-size: 15px !important;
          font-weight: 500;
        }
        .top-head2 a:hover{
          color: rgb(4, 5, 5) !important;
          transition: 0.6s;
        }
        .position-f{
          display: flex;
          position: fixed;
          flex-direction: column;
          margin-top: 50px;
          right: 10px;
          padding: 10px;
          background-color: rgb(31, 214, 50);
          z-index: 1000;
          bottom: 10px;
          border-radius: 30px;
          
          
          
      }
      .position-f a{
          margin-bottom: 5px;
          font-size: 25px;
          /* color: #fff; */
          /* background-color: #007bff; */
          padding: 5px;
          border-radius: 50%;
      }