/* @media (min-width:992px) and (max-width:1268px) */
@media (min-width:992px) and (max-width:1280px) {
    nav .navbar-brand img {
       width: 151.42px;
       height: 49.83px;
    }
 
    nav .btn-Nav1 {
       padding: 12px 40px;
       font-size: 14px;
    }

    
    .filter-media{
      display: block;
  }
 
    header nav .navbar-nav .nav-item .nav-link::before {
       bottom: 25px !important;
    }


    .Categories .courses{
      width: 100%;
      margin: auto;
    }
.Categories .courses .card{
   width: 32%;
}

.Categories .Categories__filter{
   display: none;
}
    

   /* footer */
   footer {
    height: 450px;
 }

 footer .footer__content {
    width: 90%;
 }


}

/* @media (min-width:676px) and (max-width:992px) */
@media (min-width:767px) and (max-width:991px) {
    nav {
       width: 92% !important;
       padding: 0px !important;
 
    }

 
    header nav .navbar-nav .nav-item .nav-link::before {
       display: none;
    }
 
    nav .navbar-toggler:focus {
       box-shadow: none;
    }
 
    nav .navbar-brand img {
       width: 151.42px;
       height: 49.83px;
    }
 
    header nav .navbar-nav .nav-item .nav-link {
       color: var(--blackNav);
    }
 
    nav .btn-Nav1 {
       background-color: var(--blueNav);
       padding: 13px 30px;
       font-size: 12px;
    }
 
    nav .btn-Nav2 {
       background-color: transparent;
       border: none;
       color: var(--blackNav);
       font-size: 14px;
    }

nav .user_nav h5{
    color:var(--black);
}

/* banner */

.banner .cap,
.banner .book{
   display: none;
}



.Categories .courses{
   width: 100%;
   margin: auto;
 }
.Categories .courses .card{
width: 49%;
}

.card-container{
display: flex !important;
justify-content: space-between !important;
}

.card-container .card{
   margin-left: 0px !important;
   margin-right: 0px !important;

}

.Categories .Categories__filter{
display: none;
}


.filter-media{
display: block;
}
   /* footer */
   footer {
    height: auto;
    margin-top: 0px;
 }

 footer .footer__content {
    width: 90%;
    display: flex;
 }

 footer .foot__pic {
    width: 258px;
    height: 173px;
 }

 footer .footer__content h5 {
    font-size: 12px !important;
 }

 footer .footer__content li a {
    font-size: 12px !important;

 }

 .subscribe form h5 {
    font-size: 16px !important;
 }

 footer .footer__content form div {
    width: 300px !important;
 }
}




/* @media (min-width:320px) and (max-width:676px) */
@media (min-width:320px) and (max-width:767px) {
    header{
       height: auto;
    } 
    
    nav {
        width: 92% !important;
        padding: 0px !important;
  
     }
  
     .filter-media{
      display: block;
  }
     header nav .navbar-nav .nav-item .nav-link::before {
        display: none;
     }
  
     nav .navbar-toggler:focus {
        box-shadow: none;
     }
  
     nav .navbar-brand img {
        width: 151.42px;
        height: 49.83px;
     }
  
     header nav .navbar-nav .nav-item .nav-link {
        color: var(--blackNav);
     }
  
     header nav .navbar-nav .nav-item .nav-link::after {
        display: none !important;
     }
  
     nav .btn-Nav1 {
        background-color: var(--blueNav);
        padding: 13px 30px;
        font-size: 12px;
     }
  
     nav .btn-Nav2 {
        background-color: transparent;
        border: none;
        color: var(--blackNav);
        font-size: 14px;
     }
 
 
     nav .user_nav h5{
         color:var(--black);
     }
 
     /* banner */
 
 .banner .cap,
 .banner .book{
    display: none;
 }
 
 
 .banner {
   width: 100%;
   padding: 50px 0px;
}

 .banner h2{
    font-size: 24px;
 
 }


 .top-course{
display: none !important;
 }
.Categories .courses{
   width: 100%;
   margin: auto;
 }
.Categories .courses .card{
width: 310px;
margin-bottom: 20px !important;
margin: auto;
}
.search{
   width: 90% !important;

}

.card-container{
   display: flex !important;
   justify-content: center !important;
   
   }
   
   .card-container .card{
      margin-left: 0px !important;
      margin-right: 0px !important;
   
   }

.Categories .Categories__filter{
display: none;
}

/* footer */
footer {
height: auto;
}

footer .footer__content {
width: 90%;
}

footer .footer__content form div {
width: 280px !important;

} 
}