/* mobile */
@media only screen and (min-width: 300px) and (max-width: 700px) {

    /* horizontal menu */
    .nav_logo_img {
        width: 40%;
    }

    .ace-responsive-menu {
        display: none;
    }

    .menu_space_body {
        height: 0px;
    }

    #banneracademy {
        text-align: center;
    }

    #banneracademy p {
        padding: 2%;
    }

    .menu-toggle {
        width: 12%;
        top: -14%;
        position: relative;
    }

    .header-nav nav {
        display: flex;
        align-content: space-between;
        align-items: first baseline;
    }

    header.header-nav a.navbar_brand {
        width: 76%;
        text-align: center;
        margin-right: 0
    }

    .user_setting {
        width: 50%;
    }

    .icon_profile .dropdown-menu.show {
        left: -261% !important;
    }

    .header.header-nav.menu_style_home_five .user_setting .btn {
        height: auto;
    }

    #respMenu {
        position: absolute;
        margin-top: 15%;
        left: 0;
        flex-direction: column;
        width: 50%;
        top: 46%;
        height: 100vh;
        background-color: var(--main-menu-color);
        justify-content: flex-start;
    }

    .projectsMenu {
        width: 81%;
    }

    .projectsMenu span.jobs {
        width: 23%;
        opacity: 0.7;
    }

    #navHorizontal {
        height: 76px;
    }

    .languages {
        display: flex;
        width: 27%;
    }

    .sign_up_btn {
        width: 36%;
    }

    .loginButton a.btn-thm {
        padding: 1% !important;
    }

    /* span#carttotal {
        right: -28px;
        top: 21px;
    } */
    .cart {
        display: none;
    }

    /* footer */

    .footer_social_widget.home5 ul {
        text-align: center;
    }

    .footer_social_widget {
        margin-top: 20px !important;
    }

    .footerlogo {
        max-width: 100% !important;
        width: 100% !important;
    }

    #followText {
        display: none !important;
    }

    #socialFoot {
        display: block !important;
    }

    /* index */
    .bannercompanycourses {
        display: flex;
        align-items: center;
    }

    #bannerForm {
        display: none !important;
    }

    #bannerTitle {
        height: 485px;
    }

    #bannerTitle div {
        margin-top: 0 !important;
    }



    /* courses */
    /* .card.courses img {
        height: 261px;
    } */

    .courseButtons {
        width: 90%;
    }

    /* live courses dashboard */
    #liveCoursesList .fj_post.style2.jlv5 {
        height: 400px;
        flex-direction: column;
    }

    #liveCoursesList .fj_post.style2.jlv5 #description {
        display: none;
    }

    #liveCoursesList .pjlv5 {
        text-align: center;
    }

    /* login */
    .our-log-reg.bgc-fa {
        margin-top: 0;
    }

    /* tables */
    table.table-responsive thead {
        display: none;
    }

    table.table-responsive tr {
        padding: 5px;
        display: block;
        margin: .5rem 0 1rem;
        background-color: #fff;
        border-radius: 2px;
        box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .16), 0 2px 10px 0 rgba(0, 0, 0, .12);
    }

    table.table-responsive td {
        display: block;
        text-align: left;
        border-bottom: 1px dotted #ccc;
    }

    table.table-responsive td:last-child {
        border-bottom: 0;
    }

    table.table-responsive td:before {
        content: attr(data-label);
        float: left;
        font-weight: bold;
    }

    .candidate_job_reivew.style2 .job_review_table .table tr {
        height: auto;
        width: 90vw;
    }

    #textBannerPlus {
        transform: translate(0%, -109%);
        position: absolute
    }

    #textBannerSingle {
        transform: translate(0%, -100%);
        position: absolute
    }

    #backImageBanner {
        padding: 16px 25px !important;
    }

    .videotrailer {
        height: 40vh !important;
    }

    .lessonList {
        margin-top: 5% !important;
    }


    .index_banner_text_primary {
        margin-top: 0 !;
        font-size: 1.7rem;
    }


    .pbs_banner2 {
        padding: 0;
    }

    .pbs_banner2 h1 {
        font-size: xx-large;
    }

    .pbs_areas {
        height: auto;
    }

    .pbs_areas .pbs_title {
        padding: 2% 4%;
    }

    .pbs_areas .card {
        margin-top: 4%;
    }

    .pbs_footer {
        height: auto;
    }

    .pbs_footer p {
        padding: 5%;
        font-size: 2.5rem;
    }

}