/* @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;
    }

    .course-watch{
        width: 95%;
    }

  .quiz-container ul li {
    font-size: 14px;
    font-weight: bold;
  }

  .comments .rate{
    font-size: 40px;
  }
  .comments .progress{
    width: 200px !important;
  }

  .overview ul li{
    font-size: 14px;
  }

.course-watch-content{
    width: 70%;
}

.course-watch .course-watch-cat{
    width: 25%;
}

.course-watch .course-watch-cat li{
    font-size: 14px !important;
}
   /* footer */
   footer {
    height: 450px;
 }

 footer .footer__content {
    width: 90%;
 }


}

/* @media (min-width:992px) and (max-width:1268px) */
@media  (min-width:767px) and (max-width:992px) {
 
    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);
 }
 
    .course-watch{
        width: 90%;
        flex-direction: column-reverse;
    }

  .quiz-container ul li {
    font-size: 14px;
    font-weight: bold;
  }

  .comments .rate{
    font-size: 40px;
  }
  .comments .progress{
    width: 200px !important;
  }

  .overview ul li{
    font-size: 14px;
  }

.course-watch-content{
    width: 100%;
    margin-bottom: 50px;
}

.course-watch .course-watch-cat{
    width: 100%;
    margin-bottom: 50px;
}

.course-watch .course-watch-cat li{
    font-size: 14px !important;
}


   /* 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;
  
     }
  
  
     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);
     }

     .course-watch{
        width: 90%;
        flex-direction: column-reverse;
    }

  .quiz-container ul li {
    font-size: 14px;
    font-weight: bold;
  }

  .comments .rate{
    font-size: 40px;
  }
  .comments .progress{
    width: 200px !important;
  }

  .overview ul li{
    font-size: 14px;
  }

.course-watch-content{
    width: 100%;
    margin-bottom: 50px;
    margin-top: 50px;
}

.course-watch .course-watch-cat{
    width: 100%;
    margin-bottom: 20px;
}

.course-watch .course-watch-cat li{
    font-size: 14px !important;
}

.personal-navbtns button{
   font-size: 10px;
}
   .cardd{
       width: 100% !important;
   }
   
   
   .course-card{
       width: 100%;
       top: -100px;
       padding: 10px;
   }

.overview h3{
   font-size: 16px;
}

.overview p{
   font-size: 12px;
}

.overview .list-overview {
flex-direction: column;
}
.overview ul li{
   font-size: 10px;
   font-weight: bold;
}

.cards h4{
   font-size: 13px;
}

.trainer img{
   width: 70px;
   height: 70px;

}

.trainer h4{
   font-size: 12px;
}

.trainer span{
   font-size: 10px;
}

.trainer p{
   font-size: 14px;
}

.comments__content{
flex-direction: column;
}

.comments__content .progress{
   width: 150px !important;
}

.quiz-container h2{
   font-size: 16px;

}

.quiz-container ul li {
   font-size: 9px;
   padding: 10px 3px;

   font-weight: bold;
 }

 .quiz-container button{
   padding: 10px ;
   font-size: 13px;

 }

 .quiz-result{
   width: 95%;
   margin: auto;
   overflow: hidden;
 }

.quiz-result p{
   font-size: 12px;

 
}


.your-review button{
   width: 50% !important;
   font-size: 14px !important;
   padding: 10px 20px !important;

}

     /* footer */
     footer {
        height: auto;
     }
    
     footer .footer__content {
        width: 90%;
     }
    
     footer .footer__content form div {
        width: 280px !important;
     }
    }