/* 
  ##Device = Desktops
  ##Screen = 1440px to higher resolution desktops
*/

@media (max-width: 1440px) {

    section.our-course .card .card-body .content .join-now span {
        font-size: 25px;
    }

    section.kids-education.index-2 .single-service .icon a.btn {
        font-size: 14px;
        padding: 8px;
    }

    section.kids-education .card .single-service .content .icon img {
        width: 30px;
    }

    section.slider-section.index-3 .slider-content-group ul {
        grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    }

    section.slider-section .slider-content-group h1 {
        font-size: 40px;
    }

    section.joining-now .joining-box .single-box:nth-child(4) {
        margin-top: 0px;
    }

    section.joining-now .joining-box .single-box:nth-child(2) {
        margin-top: 0px;
    }

    section.joining-now .joining-box {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
        gap: 15px;
    }

    .joining-box .single-box .content h4 {
        font-size: 20px;
    }

}

/* 
  ##Device = Desktops
  ##Screen = 1281px to higher resolution desktops
*/

@media (min-width: 1281px) {

    .header__logo,
    .header__toggle {
        display: none;
    }

    .nav {
        width: 100%;
        text-align: center;
        justify-content: center;
        margin: 0 auto;
    }

    .nav__content {
        grid-template-columns: repeat(3, -webkit-max-content);
        grid-template-columns: repeat(3, max-content);
        -ms-grid-rows: 1fr;
        grid-template-rows: 1fr;
        -webkit-column-gap: 1rem;
        column-gap: 1rem;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        height: auto;
        text-align: center;
        /* justify-content: center; */
        width: 100%;
        margin: 0 auto;
    }

    .nav__close,
    .nav__profesion {
        display: none;
    }

    .nav__perfil {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
    }

    .nav__img {
        width: 100%;
        height: 100%;
        margin-right: .5rem;
        margin-bottom: 0;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
    }

    .nav__img img {
        width: 140px;
    }

    .nav__list {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        justify-content: center;
        text-align: center;
        justify-content: center;
    }

    .nav__item {
        margin: 0 .25rem;
    }

    .nav__link {
        padding: .5rem .8rem;
        border-radius: .25rem;
    }
    
    /* about us */


}

/* 
    ##Device = Laptops, Desktops
    ##Screen = B/w 1025px to 1280px
*/

@media (min-width: 1025px) and (max-width: 1280px) {
    
    .nav {
        position: fixed;
        top: 0;
        left: -100%;
        background-color: #070D1F;
        color: #E6E7E9;
        width: 100%;
        height: 100vh;
        padding: 1.5rem 0;
        z-index: 9999;
        -webkit-transition: .5s;
        transition: .5s;
    }

    .nav.show {
        left: 0;
        height: 100%;
    }

    .main-navbar-section header.header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 5px 8px;
    }

    .header {
        padding:  10px;
    }

    /* about us */

    section.about-us h4 {
        font-size: 25px;
    }

    section.about-us .education-features .single-feature h5 {
        font-size: 18px;
    }

    section.our-course .card .card-body .content .join-now span {
        font-size: 22px;
    }

    /* blog page design */
    
    section.blogs .card .card-body .content h5 {
        font-size: 20px;
    }

    
    /* blog details page */
    section.blog-details .cover-images .content .right ul h6 {
        font-size: 16px;
        margin: 0px;
    }

    section.blog-details .cover-images .content .left h6 {
        font-size: 16px;
        margin: 0;
    }

    section.blog-details .cover-images .content .left p {
        margin: 0px;
    }

    section.blog-details .cover-images .content {
        padding: 15px;
    }

    section.blog-details h2 {
        font-size: 25px;
    }

    section.blog-details .massage-ceo {
        padding: 15px;
    }

    section.blog-details .massage-ceo article {
        margin-top: 0px;
    }

    section.blog-details .comments .card .card-body {
        flex-direction: column;
    }

    section.blog-details .comments .card {
        padding: 15px;
    }

    section.blog-details .card {
        padding: 15px;
    }

    section.blog-details .recent-posts ul li .single-blog {
        flex-direction: column;
    }

    section.blog-details .recent-posts ul li .single-blog .image img {
        width: 100%;
        border-radius: 15px;
    }

    /* contact us page */

    section.contact-form form {
        padding: 15px;
    }

    section.contact-form .card {
        padding: 15px;
    }

    /* events page design */

    section.our-events .card .single-event {
        display: flex;
        flex-direction: column;
        align-items: start;
        justify-content: start;
        width: 100%;
        gap: 10px;
    }

    section.our-events .card .single-event .event-img {
        max-width: 100%;
    }

    section.our-events .card .single-event .event-img img {
        width: 100%;
    }
    
    /* event details page */
    section.event-details .cover-images .content .right ul h6 {
        font-size: 16px;
        margin: 0px;
    }

    section.event-details .cover-images .content .left h6 {
        font-size: 16px;
        margin: 0;
    }

    section.event-details .cover-images .content .left p {
        margin: 0px;
    }

    section.event-details .cover-images .content {
        padding: 15px;
    }

    section.event-details h2 {
        font-size: 25px;
    }

    section.event-details .massage-ceo {
        padding: 15px;
    }

    section.event-details .massage-ceo article {
        margin-top: 0px;
    }

    /* our shop page */

    section.our-shop .card .product-info h4 {
        font-size: 20px;
    }

    /* product details page */

    section.product-details .cart-section .form-group {
        justify-content: end;
    }

    section.product-details .related-product .card .product-info h4 {
        font-size: 20px;
    }

    /* about us */

    section.kids-education .card .single-service {
        padding: 0 40px;
    }

    section.joining-now .joining-box {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(215px, 1fr));
        gap: 15px;
    }

    section.joining-now .images {
        display: none;
    }

    section.course-details .header-background-img .card .course-info {
        display: none;
    }

    section.course-details .header-background-img .card-body .course-header .course-content {
        max-width: 100%;
    }

    section.course-details .course-contents-wrapper .course-content {
        max-width: 100%;
    }

    section.course-details .course-contents-wrapper .course-content nav .nav {
        position: unset;
        background: transparent;
        height: auto;
    }

}

/* 
    ##Device = Tablets, Ipads (portrait)
    ##Screen = B/w 768px to 1024px
*/

@media (min-width: 768px) and (max-width: 1024px) {
    
    .nav {
        position: fixed;
        top: 0;
        left: -100%;
        background-color: #070D1F;
        color: #E6E7E9;
        width: 100%;
        height: 100vh;
        padding: 1.5rem 0;
        z-index: 9999;
        -webkit-transition: .5s;
        transition: .5s;
    }

    .nav.show {
        left: 0;
        height: 100%;
    }

    .main-navbar-section header.header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 5px 8px;
    
    }

    /* .index-2 page */

    section.kids-education.index-2 .single-service .icon a.btn {
        padding: 8px;
        font-size: 14px;
    }

    section.kids-education .card .single-service .content .icon img {
        width: 30px;
    }

    section.kids-education .card .single-service .content .icon {
        margin-top: 5px;
    }

    section.kids-education .card .single-service {
        padding: 0 30px;
    }

    section.our-course .card .card-body .content .join-now span {
        font-size: 22px;
    }

    /* about us */

    section.about-us h4 {
        font-size: 25px;
    }

    section.about-us .education-features .single-feature h5 {
        font-size: 18px;
    }

    section.our-testimonial .testimonial-content .content {
        padding: 30px;
    }

    section.our-testimonial .testimonial-content .star ul i {
        font-size: 18px;
    }

    section.about-us .about-us-video {
        height: 100%;
        background: #000;
        border-radius: 25px;
        padding: ma;
    }

    /* blog page design */

    section.blogs .card .card-body .content h5 {
        font-size: 20px;
    }

    
    /* blog details page */
    section.blog-details .cover-images .content .right ul h6 {
        font-size: 16px;
        margin: 0px;
    }

    section.blog-details .cover-images .content .left h6 {
        font-size: 16px;
        margin: 0;
    }

    section.blog-details .cover-images .content .left p {
        margin: 0px;
    }

    section.blog-details .cover-images .content {
        padding: 15px;
    }

    section.blog-details h2 {
        font-size: 25px;
    }

    section.blog-details .massage-ceo {
        padding: 15px;
    }

    section.blog-details .massage-ceo article {
        margin-top: 0px;
    }

    section.blog-details .comments .card .card-body {
        flex-direction: column;
    }

    section.blog-details .comments .card {
        padding: 15px;
    }

    section.blog-details .card {
        padding: 15px;
    }

    section.blog-details .recent-posts ul li .single-blog {
        flex-direction: column;
    }

    section.blog-details .recent-posts ul li .single-blog .image img {
        width: 100%;
        border-radius: 15px;
    }

    /* contact us page */

    section.contact-form form {
        padding: 15px;
    }

    section.contact-form .card {
        padding: 15px;
    }

    /* events page design */

    section.our-events .card .single-event {
        display: flex;
        flex-direction: column;
        align-items: start;
        justify-content: start;
        width: 100%;
        gap: 10px;
    }

    section.our-events .card .single-event .event-img {
        max-width: 100%;
    }

    section.our-events .card .single-event .event-img img {
        width: 100%;
    }

    
    /* event details page */
    section.event-details .cover-images .content .right ul h6 {
        font-size: 16px;
        margin: 0px;
    }

    section.event-details .cover-images .content .left h6 {
        font-size: 16px;
        margin: 0;
    }

    section.event-details .cover-images .content .left p {
        margin: 0px;
    }

    section.event-details .cover-images .content {
        padding: 15px;
    }

    section.event-details h2 {
        font-size: 25px;
    }

    section.event-details .massage-ceo {
        padding: 15px;
    }

    section.event-details .massage-ceo article {
        margin-top: 0px;
    }

    /* our shop page */

    section.our-shop .card .product-info h4 {
        font-size: 20px;
    }

    /* product details page */

    section.product-details .cart-section .form-group {
        justify-content: end;
    }

    section.product-details .related-product .card .product-info h4 {
        font-size: 20px;
    }

    /* index 2 page */
    section.our-results .card.left-side .content img {
        width: 30%;
    }

    .index-2 section.slider-section .slider-group-imges {
        display: none;
    }

    .index-2 .slider-content-group {
        padding: 50px 0;
    }



    section.course-details .header-background-img .card .course-info {
        display: none;
    }

    section.course-details .header-background-img .card-body .course-header .course-content {
        max-width: 100%;
    }

    section.course-details .course-contents-wrapper .course-content {
        max-width: 100%;
    }

    section.course-details .course-contents-wrapper .course-content nav .nav {
        position: unset;
        background: transparent;
        height: auto;
    }

}

/* 
    ##Device = Tablets, Ipads (landscape)
    ##Screen = B/w 768px to 1024px
*/

@media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
    
    .nav {
        position: fixed;
        top: 0;
        left: -100%;
        background-color: #070D1F;
        color: #E6E7E9;
        width: 100%;
        height: 100vh;
        padding: 1.5rem 0;
        z-index: 9999;
        -webkit-transition: .5s;
        transition: .5s;
    }

    .nav.show {
        left: 0;
        height: 100%;
    }

    .main-navbar-section header.header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 5px 8px;
    }

    nav#nav-menu li.nav__item.active .dropdown-items {
        display: block;
        position: unset;
        margin-top: 20px;
    }


    .section-top h4 {
        font-size: 35px;
    }

    /* about us */

    section.about-us {
        padding: 50px 0;
    }

    section.about-us h4 {
        font-size: 35px;
    }

    section.about-us .education-features .single-feature h5 {
        font-size: 22px;
    }

    /* foundation-of-knowledge */

    section.foundation-of-knowledge {
        padding: 50px 0;
    }

    section.foundation-of-knowledge .card {
        border: 0;
    }

    section.foundation-of-knowledge .foundation-list {
        grid-template-columns: repeat(auto-fill, minmax(330px, 1fr));
    }

    /* our customer */

    section.our-customers {
        padding: 50px 0;
    }

    /* quality section */

    section.our-quality .background-img {
        padding: 80px 0;
        padding-bottom: 0px;
    }

    section.our-quality .background-img .bottom-shap {
        padding-top: 80px;
    }

    section.our-quality .card .card-body h4 {
        font-size: 45px;
    }

    /* our course section */

    section.our-course {
        padding: 50px 0;
    }

    /* mission-vission */

    section.mission-vission .background-img {
        padding: 50px 0;
    }

    section.mission-vission .our-mission {
        margin: 25px 0;
    }

    section.mission-vission .our-mission .icon {
        display: none;
    }

    section.mission-vission .our-mission .content-details {
        flex-direction: column;
    }

    section.mission-vission .our-mission .content-details article {
        width: 100%;
    }

    section.mission-vission .our-values {
        margin: 25px 0;
    }

    section.mission-vission .our-values .icon {
        display: none;
    }

    section.mission-vission .our-values .content-details {
        flex-direction: column;
    }

    section.mission-vission .our-values .content-details article {
        width: 100%;
    }

    section.mission-vission .our-vision {
        margin: 25px 0;
    }

    section.mission-vission .our-vision .icon {
        display: none;
    }

    section.mission-vission .our-vision .content-details {
        flex-direction: column;
    }

    section.mission-vission .our-vision .content-details article {
        width: 100%;
    }

    /* joining-now */

    section.joining-now .joining-box .single-box:nth-child(2)::before {
        display: none;
    }

    section.joining-now .images {
        display: none;
    }

    section.joining-now .shape {
        top: 0;
        right: 0;
    }

    section.joining-now .shape img {
        width: 150px;
    }

    section.joining-now {
        padding-bottom: 50px;
    }

    /* event section */

    section.our-events {
        padding: 50px 0;
    }

    /* our gallery */

    section.our-gallery {
        padding: 50px 0;
    }

    /* our testimonial section */

    section.our-testimonial {
        padding: 50px 0;
    }

    section.our-testimonial .testimonial-content .star ul {
        margin: 0;
    }

    section.our-testimonial .content article {
        font-size: 15px;
        line-height: normal;
    }

    /* footer section */

    footer.footer .footer-content h5 {
        margin-bottom: 10px;
    }

    /* blog page design */
    
    section.blogs .card .card-body .content h5 {
        font-size: 20px;
    }

    /* blog details page */
    section.blog-details .cover-images .content .right ul h6 {
        font-size: 16px;
        margin: 0px;
    }

    section.blog-details .cover-images .content .left h6 {
        font-size: 16px;
        margin: 0;
    }

    section.blog-details .cover-images .content .left p {
        margin: 0px;
    }

    section.blog-details .cover-images .content {
        padding: 15px;
    }

    section.blog-details h2 {
        font-size: 25px;
    }

    section.blog-details .massage-ceo {
        padding: 15px;
    }

    section.blog-details .massage-ceo article {
        margin-top: 0px;
    }

    section.blog-details .comments .card .card-body {
        flex-direction: column;
    }

    section.blog-details .comments .card {
        padding: 15px;
    }

    section.blog-details .card {
        padding: 15px;
    }

    section.blog-details .recent-posts ul li .single-blog {
        flex-direction: column;
    }

    section.blog-details .recent-posts ul li .single-blog .image img {
        width: 100%;
        border-radius: 15px;
    }

    /* contact us page */

    section.contact-form .section-top .icon {
        display: none;
    }

    section.contact-form form {
        padding: 15px;
    }

    section.contact-form .card {
        padding: 15px;
    }

    /* event page design */

    section.upcoming-course .card .card-body img {
        width: 100%;
    }
    
    /* event details page */
    section.event-details .cover-images .content .right ul h6 {
        font-size: 16px;
        margin: 0px;
    }

    section.event-details .cover-images .content .left h6 {
        font-size: 16px;
        margin: 0;
    }

    section.event-details .cover-images .content .left p {
        margin: 0px;
    }

    section.event-details .cover-images .content {
        padding: 15px;
    }

    section.event-details h2 {
        font-size: 25px;
    }

    section.event-details .massage-ceo {
        padding: 15px;
    }

    section.event-details .massage-ceo article {
        margin-top: 0px;
    }

    /* home page 3 design */

    section.slider-section.index-3 .slider-imges-leftside {
        display: none;
    }

    section.slider-section.index-3 .slider-imges-rightside {
        display: none;
    }

    section.slider-section.index-3 .slider-content-group {
        padding: 50px 0;
    }

    /* login page */

    section.login-form .images {
        display: none;
    }

    /* gallery page */

    section.gallery .gallery-items {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(440px, 1fr));
        gap: 15px;
    }

    /* forgot password */

    section.login-form.forgot-password form {
        max-width: 60%;
        padding: 15px;
    }

    /* cart page */

    section.wishlist.cart-page .cart-calculation .cupon {
        text-align: right;
    }


    section.course-details .header-background-img .card .course-info {
        display: none;
    }

    section.course-details .header-background-img .card-body .course-header .course-content {
        max-width: 100%;
    }

    section.course-details .course-contents-wrapper .course-content {
        max-width: 100%;
    }

    section.course-details .course-contents-wrapper .course-content nav .nav {
        position: unset;
        background: transparent;
        height: auto;
    }

}

/* 
    ##Device = Low Resolution Tablets, Mobiles (Landscape)
    ##Screen = B/w 481px to 767px
*/

@media (min-width: 481px) and (max-width: 767px) {
    
    /* navbar  */

    .nav {
        position: fixed;
        top: 0;
        left: -100%;
        background-color: #070D1F;
        color: #E6E7E9;
        width: 100%;
        height: 100vh;
        padding: 1.5rem 0;
        z-index: 9999;
        -webkit-transition: .5s;
        transition: .5s;
    }

    .nav.show {
        left: 0;
        height: 100%;
    }

    .main-navbar-section header.header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 5px 8px;
    }

    nav#nav-menu li.nav__item.active .dropdown-items {
        display: block;
        position: unset;
        margin-top: 20px;
    }


    /* section top  */

    .section-top h4 {
        font-size: 30px;
    }

    /* slider section */

    section.slider-section .slider-content-group h1 {
        font-size: 40px;
    }

    /* about us */

    section.about-us {
        padding: 50px 0;
    }

    section.about-us .education-features {
        display: grid;
        grid-template-columns: 1fr;
    }

    section.about-us h4 {
        font-size: 30px;
    }

    /* foundation-of-knowledge */

    section.foundation-of-knowledge {
        padding: 50px 0;
    }

    section.foundation-of-knowledge .card {
        border: 0;
    }

    /* our customer */

    section.our-customers {
        padding: 50px 0;
    }

    section.our-customers .customer-list {
        grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    }

    /* our-quality */

    section.our-quality .background-img {
        padding: 80px 0;
        padding-bottom: 0px;
    }

    section.our-quality .background-img .bottom-shap {
        padding-top: 80px;
    }

    /* our course */

    section.our-course {
        padding: 50px 0;
    }

    /* joining now */

    section.joining-now {
        padding-bottom: 50px;
    }

    section.joining-now .joining-box .single-box::before {
        display: none;
    }

    section.joining-now .joining-box .single-box:nth-child(4) {
        margin: 0;
    }

    section.joining-now .joining-box .single-box:nth-child(2) {
        margin: 0;
    }

    section.joining-now .shape {
        right: 0;
        top: 0;
    }

    section.joining-now .shape img{
        width: 120px;
    }

    section.joining-now .images {
        display: none;
    }

    /* mission and vission */

    section.mission-vission .background-img {
        padding: 50px 0;
    }

    section.mission-vission .our-mission {
        margin: 25px 0;
        border-radius: 0;
        padding: 15px;
    }

    section.mission-vission .our-mission .content-details {
        flex-direction: column;
    }

    section.mission-vission .our-mission .content-details ul {
        width: 100%;
    }
    
    section.mission-vission .our-mission .content-details article {
        width: 100%;
    }

    section.mission-vission .our-mission .icon {
        display: none;
    }

    section.mission-vission .our-values {
        margin: 25px 0;
        border-radius: 0;
        padding: 15px;
    }

    section.mission-vission .our-values .content-details {
        flex-direction: column;
    }

    section.mission-vission .our-values .content-details ul {
        width: 100%;
    }
    
    section.mission-vission .our-values .content-details article {
        width: 100%;
    }

    section.mission-vission .our-values .icon {
        display: none;
    }
    
    section.mission-vission .our-vision {
        margin: 25px 0;
        border-radius: 0;
        padding: 15px;
    }

    section.mission-vission .our-vision .content-details {
        flex-direction: column;
    }

    section.mission-vission .our-vision .content-details ul {
        width: 100%;
    }
    
    section.mission-vission .our-vision .content-details article {
        width: 100%;
    }

    section.mission-vission .our-vision .icon {
        display: none;
    }

    /* our event  */

    section.our-events {
        padding: 50px 0;
    }

    section.our-events .card .single-event {
        flex-direction: column;
    }

    section.our-events .card .single-event .event-img {
        max-width: 100%;
    }

    section.our-events .card .single-event .event-content {
        padding: 15px;
    }

    /* our gallery */

    section.our-gallery {
        padding: 50px 0;
    }

    /* testimonial  */

    section.our-testimonial {
        padding: 50px 0;
    }

    section.our-testimonial .testimonial-content .star ul {
        margin: 0;
    }

    section.our-testimonial .content article {
        font-size: 14px;
        line-height: normal;
    }

    /* our quality */

    section.our-quality .card .card-body h4 {
        font-size: 30px;
    }

    /* footer  */

    footer.footer .footer-content h5 {
        margin-bottom: 10px;
    }

    /* blog details page */
    section.blog-details .cover-images .content .right ul h6 {
        font-size: 16px;
        margin: 0px;
    }

    section.blog-details .cover-images .content .left h6 {
        font-size: 16px;
        margin: 0;
    }

    section.blog-details .cover-images .content .left p {
        margin: 0px;
    }

    section.blog-details .cover-images .content {
        padding: 5px 10px;
    }

    section.blog-details h2 {
        font-size: 25px;
    }

    section.blog-details .massage-ceo {
        padding: 15px;
    }

    section.blog-details .massage-ceo article {
        margin-top: 0px;
    }

    section.blog-details .comments .card .card-body {
        flex-direction: column;
    }

    section.blog-details .comments .card {
        padding: 15px;
    }

    section.blog-details .card {
        padding: 15px;
    }

    section.blog-details .recent-posts ul li .single-blog {
        flex-direction: column;
    }

    section.blog-details .recent-posts ul li .single-blog .image img {
        width: 100%;
        border-radius: 15px;
    }

    /* contact us page */

    section.contact-form .section-top .icon {
        display: none;
    }

    section.contact-form form {
        padding: 15px;
    }

    section.contact-form .card {
        padding: 15px;
    }

    /* event page design */

    section.upcoming-course .card .card-body img {
        width: 100%;
    }
    
    
    /* event details page */
    section.event-details .cover-images .content .right ul h6 {
        font-size: 16px;
        margin: 0px;
    }

    section.event-details .cover-images .content .left h6 {
        font-size: 16px;
        margin: 0;
    }

    section.event-details .cover-images .content .left p {
        margin: 0px;
    }

    section.event-details .cover-images .content {
        padding: 5px 10px;
    }

    section.event-details h2 {
        font-size: 25px;
    }

    section.event-details .massage-ceo {
        padding: 15px;
    }

    section.event-details .massage-ceo article {
        margin-top: 0px;
    }

    section.event-details .comments .card .card-body {
        flex-direction: column;
    }

    /* feedback page design */ 

    section.feedback-form form {
        padding: 20px 15px;
    }

    /* gallery page design */

    section.gallery .gallery-items {
        display: grid;
        grid-template-columns: none;
        gap: 15px;
    }

    /* login page */

    section.login-form .images {
        display: none;
    }

    /* forgot password */

    section.login-form.forgot-password form {
        max-width: 100%;
        padding: 15px;
    }

    /* cart page */

    section.wishlist.cart-page .cart-calculation .cupon {
        text-align: right;
    }


    section.course-details .header-background-img .card .course-info {
        display: none;
    }

    section.course-details .header-background-img .card-body .course-header .course-content {
        max-width: 100%;
    }

    section.course-details .course-contents-wrapper .course-content {
        max-width: 100%;
    }

    section.course-details .course-contents-wrapper .course-content nav .nav {
        position: unset;
        background: transparent;
        height: auto;
    }

    nav#nav-menu li.nav__item.active .dropdown-items {
        display: block;
        position: unset;
        margin-top: 20px;
    }

    

}

/* 
    ##Device = Most of the Smartphones Mobiles (Portrait)
    ##Screen = B/w 320px to 479px
*/

@media (min-width: 320px) and (max-width: 480px) {

    /* navbar  */
    .nav {
        position: fixed;
        top: 0;
        left: -100%;
        background-color: #070D1F;
        color: #E6E7E9;
        width: 100%;
        height: 100vh;
        padding: 1.5rem 0;
        z-index: 9999;
        -webkit-transition: .5s;
        transition: .5s;
    }

    .nav.show {
        left: 0;
        height: 100%;
    }

    .main-navbar-section header.header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 5px 8px;
    }

    /* breadcrumb */

    section.breadcrumb-area h4 {
        font-size: 25px;
    }

    /* section top  */

    .section-top h4 {
        font-size: 30px;
    }

    /* slider section */

    section.slider-section .slider-content-group h1 {
        font-size: 40px;
    }

    /* sidebar */
    nav.sidebar-navigation {
        display: none;
    }

    .main-content-wrapper {
        margin-left: 0px;
    }

    section.apps-promotions .promotion-content {
        grid-template-columns: 1fr;
    }

    section.apps-promotions .images {
        grid-row: 1 / -1;
    }

    section.bepart-of-family .contents {
        grid-template-columns: 1fr;
    }

    section.bepart-of-family .contents .image {
        grid-row: 1 / -1;
    }

    /* about us */

    section.about-us {
        padding: 50px 0;
    }

    section.about-us .education-features {
        display: grid;
        grid-template-columns: 1fr;
    }

    section.about-us h4 {
        font-size: 30px;
    }

    /* foundation-of-knowledge */

    section.foundation-of-knowledge {
        padding: 50px 0;
    }

    /* our customer */

    section.our-customers {
        padding: 50px 0;
    }

    section.our-customers .customer-list {
        grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    }

    /* our-quality */

    section.our-quality .background-img {
        padding: 80px 0;
        padding-bottom: 0px;
    }

    section.our-quality .background-img .bottom-shap {
        padding-top: 80px;
    }

    /* our course */

    section.our-course {
        padding: 50px 0;
    }

    /* joining now */

    section.joining-now {
        padding-bottom: 50px;
    }

    section.joining-now .joining-box .single-box::before {
        display: none;
    }

    section.joining-now .joining-box .single-box:nth-child(4) {
        margin: 0;
    }

    section.joining-now .joining-box .single-box:nth-child(2) {
        margin: 0;
    }

    section.joining-now .shape {
        right: 0;
        top: 0;
    }

    section.joining-now .shape img{
        width: 120px;
    }

    section.joining-now .images {
        display: none;
    }

    /* mission and vission */

    section.mission-vission .background-img {
        padding: 50px 0;
    }

    section.mission-vission .our-mission {
        margin: 25px 0;
        border-radius: 0;
        padding: 15px;
    }

    section.mission-vission .our-mission .content-details {
        flex-direction: column;
    }

    section.mission-vission .our-mission .content-details ul {
        width: 100%;
    }
    
    section.mission-vission .our-mission .content-details article {
        width: 100%;
    }

    section.mission-vission .our-mission .icon {
        display: none;
    }

    section.mission-vission .our-values {
        margin: 25px 0;
        border-radius: 0;
        padding: 15px;
    }

    section.mission-vission .our-values .content-details {
        flex-direction: column;
    }

    section.mission-vission .our-values .content-details ul {
        width: 100%;
    }
    
    section.mission-vission .our-values .content-details article {
        width: 100%;
    }

    section.mission-vission .our-values .icon {
        display: none;
    }
    
    section.mission-vission .our-vision {
        margin: 25px 0;
        border-radius: 0;
        padding: 15px;
    }

    section.mission-vission .our-vision .content-details {
        flex-direction: column;
    }

    section.mission-vission .our-vision .content-details ul {
        width: 100%;
    }
    
    section.mission-vission .our-vision .content-details article {
        width: 100%;
    }

    section.mission-vission .our-vision .icon {
        display: none;
    }

    /* our event  */

    section.our-events {
        padding: 50px 0;
    }

    section.our-events .card .single-event {
        flex-direction: column;
    }

    section.our-events .card .single-event .event-img {
        max-width: 100%;
    }

    section.our-events .card .single-event .event-content {
        padding: 15px;
    }

    /* our gallery */

    section.our-gallery {
        padding: 50px 0;
    }

    /* testimonial  */

    section.our-testimonial {
        padding: 50px 0;
    }

    section.our-testimonial .testimonial-content .star ul {
        margin: 0;
    }

    section.our-testimonial .content article {
        font-size: 14px;
        line-height: normal;
    }

    section.our-testimonial .testimonial-content .content {
        padding:  0 30px;
    }

    section.our-testimonial .testimonial-content .star ul i {
        font-size: 16px;
    }

    /* our quality */

    section.our-quality .card .card-body h4 {
        font-size: 30px;
    }

    /* footer  */

    footer.footer .footer-content h5 {
        margin-bottom: 10px;
    }

    /* online application page */

    section.application-form form {
        padding: 20px 5px;
    }

    /* blog page design */
    
    section.blogs .card .card-body .content h5 {
        font-size: 20px;
    }

    /* blog details page */
    section.blog-details .cover-images .content .right ul h6 {
        font-size: 16px;
        margin: 0px;
    }

    section.blog-details .cover-images .content .left h6 {
        font-size: 16px;
        margin: 0;
    }

    section.blog-details .cover-images .content .left p {
        margin: 0px;
    }

    section.blog-details .cover-images .content {
        padding: 5px 10px;
    }

    section.blog-details h2 {
        font-size: 25px;
    }

    section.blog-details .massage-ceo {
        padding: 15px;
    }

    section.blog-details .massage-ceo article {
        margin-top: 0px;
    }

    section.blog-details .comments .card .card-body {
        flex-direction: column;
    }

    section.blog-details .comments .card {
        padding: 15px;
    }

    section.blog-details .card {
        padding: 15px;
    }

    section.blog-details .recent-posts ul li .single-blog {
        flex-direction: column;
    }

    section.blog-details .recent-posts ul li .single-blog .image img {
        width: 100%;
        border-radius: 15px;
    }
    
    /* contact us page */

    section.contact-form .section-top .icon {
        display: none;
    }

    section.contact-form form {
        padding: 15px;
    }

    section.contact-form .card {
        padding: 15px;
    }

    /* event page design */

    section.upcoming-course .card .card-body img {
        width: 100%;
    }

    
    /* event details page */
    section.event-details .cover-images .content .right ul h6 {
        font-size: 16px;
        margin: 0px;
    }

    section.event-details .cover-images .content .left h6 {
        font-size: 16px;
        margin: 0;
    }

    section.event-details .cover-images .content .left p {
        margin: 0px;
    }

    section.event-details .cover-images .content {
        padding: 5px 10px;
    }

    section.event-details h2 {
        font-size: 25px;
    }

    section.event-details .massage-ceo {
        padding: 15px;
    }

    section.event-details .massage-ceo article {
        margin-top: 0px;
    }

    section.event-details .comments .card .card-body {
        flex-direction: column;
    }

    /* faq page design */

    section.faq-page .card.faq-card ul li span {
        font-size: 20px;
    }

    section.faq-page .card.faq-card ul li .images img {
        width: 100%;
    }

    section.faq-page .card.faq-card ul li .images {
        grid-template-columns: none;
    }

    section.faq-page .card.faq-card {
        padding: 15px;
    }

    section.faq-page .card.support {
        padding: 15px;
    }

    section.faq-page .card.support .content ul {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
        gap: 15px;
    }

    /* feedback page design */ 

    section.feedback-form form {
        padding: 20px 15px;
    }

    /* gallery page design */

    section.gallery .gallery-items {
        display: grid;
        grid-template-columns: none;
        gap: 15px;
    }

    /* home page 3 design */

    section.our-results .result-information {
        grid-template-columns: repeat(auto-fill, minmax(335px, 1fr));
        gap: 0;
    }

    section.our-results .result-information .single-result:last-child {
        margin: 0px;
    }

    section.our-support .support-service {
        grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    }

    section.slider-section.index-3 .slider-content-group ul {
        grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    }

    section.slider-section.index-3 .slider-imges-leftside {
        display: none;
    }

    section.slider-section.index-3 .slider-imges-rightside {
        display: none;
    }

    section.slider-section.index-2 .slider-group-imges {
        display: none;
    }

    section.slider-section.index-2 form .form-group {
        width: 100%;
        padding-bottom: 50px;
    }

    section.about-us.index-2 .card .about-shape img {
        width: 50px;
    }

    section.our-course .filtering-button button {
        margin: 10px 5px;
    }

    section.course-category .course-category-slider .image img {
        padding: 25px;
    }

    section.slider-section.index-2 .slider-content-group {
        padding-top: 50px;
    }

    section.slider-section.index-3 .slider-content-group {
        padding: 50px 0;
    }


    /* registration page */
    section.registration-form form {
        padding: 15px;
    }

    /* product details page */

    section.product-details .cart-section .form-group {
        justify-content: end;
    }

    /* login page */

    section.login-form .images {
        display: none;
    }

    section.login-form form {
        padding: 15px;
    }

    /* forgot password */

    section.login-form.forgot-password form {
        max-width: 100%;
        padding: 15px;
    }

    /* checkout page */

    section.checkout-page .checkout-info .place-order .btn {
        margin: 0px;
    }

    section.checkout-page .checkout-info h4 {
        font-size: 20px;
    }

    /* cart page */

    section.wishlist.cart-page .cart-calculation .cupon {
        text-align: right;
    }

    /* blog details page */

    section.blog-details .blog-details-content h5 {
        font-size: 20px;
    }

    /* 404 page */

    section.error-page .card .images img {
        max-width: 100%;
    }

    /* index 2 page */

    section.our-results .card.left-side .card-body .content h4 {
        font-size: 30px;
    }


    section.course-details .header-background-img .card .course-info {
        display: none;
    }

    section.course-details .header-background-img .card-body .course-header .course-content {
        max-width: 100%;
    }

    section.course-details .course-contents-wrapper .course-content {
        max-width: 100%;
    }

    section.course-details .course-contents-wrapper .course-content nav .nav {
        position: unset;
        background: transparent;
        height: auto;
    }

    section.course-details .course-overview .author-info {
        grid-template-columns: none;
    }

    section.course-details .course-overview .author-info .auth-info {
        border: none;
        margin: 0px;
    }

    section.course-details .course-overview .author-info .auth-info .about-info {
        width: 100%;
        margin-bottom: 20px;
    }

    nav#nav-menu li.nav__item.active .dropdown-items {
        display: block;
        position: unset;
        margin-top: 20px;
    }

    /* shop filtering */
    section.our-courses.our-shop {
        position: relative;
    }

    aside.filtering-courses {
        position: absolute;
        top: 0;
        left: 0;
        background: #ddd;
        z-index: 9;
        display: none;
    }

}
