@media only screen and (min-device-width:320px) and (max-device-width:568px) and (orientation:portrait) {
    .ZE_OVL_left_img {
        top: -118px !important
    }
}

@media only screen and (min-device-width:320px) and (max-device-width:568px) and (orientation:landscape) {
    .ZE_main_video_box {
        width: 400px !important
    }

    .ZE_video_box {
        height: 381px !important;
        width: 381px !important
    }

    .enroll_btn a {
        width: 38% !important
    }
}

@media only screen and (min-device-width:375px) and (max-device-width:812px) and (orientation:portrait) {
    .ZE_OVL_left_img {
        width: 37% !important
    }
}

@media only screen and (min-device-width:375px) and (max-device-width:812px) and (orientation:landscape) {
    .pading1 {
        padding: 0
    }

    .logoimg {
        width: 55%
    }

    #ca-navbar {
        background: linear-gradient(to right,#263582,#00cbff);
        padding: 10px 20px;
        z-index: 1
    }

        #ca-navbar .nav-item {
            border-bottom: 1px solid #fff;
            padding: 10px 0
        }

    .navbar.navbar-light .navbar-nav .nav-item .nav-link {
        padding: 0
    }

    ul#nav {
        margin-bottom: 1rem
    }

    section.z_banner_section {
        padding: 0 0
    }

    .banner_content {
        padding-top: 3rem
    }

        .banner_content img {
            padding-bottom: 1rem;
            width: 20%
        }

        .banner_content h2 {
            font-size: 1rem
        }

        .banner_content h1 {
            font-size: 1.7rem
        }

    .I_Box {
        height: 311px
    }

    .ZE_OL h3 {
        margin-top: 0
    }

    .ZE_main_video_box {
        width: 100%;
        box-shadow: 2px 2px 25px 9px rgba(1,199,251,.2)
    }

    .ZE_video_box {
        height: 200px;
        width: 200px
    }

        .ZE_video_box img {
            top: 17%;
            left: 42%
        }

    .ZE_main_video_box li {
        width: 39%
    }

    .enroll_btn a {
        top: 49px;
        width: 60%
    }
}

@media screen and (max-width:768px) {
    .submenu_dropdown:hover .submenu_ul {
        top: 44px !important;
        left: 0 !important;
        position: initial;
    }
    .logo_nav {
        width: 30% !important;
        padding: 0 0 0 3px !important;
    }

    .fb_s_btn {
        position: absolute;
        top: 3rem
    }

    .Z_Interaction_section .Z_gradient_btn {
        margin: 2rem 0
    }

    .Z_gradient_btn a, .Z_gradient_btn button {
        display: block;
        margin-top: 1rem;
        text-align: center;
    }
    .footer-top img {
        width: 65%;
    }
        .sm_p_0 {
        padding: 0
    }

    .navbar-nav .dropdown-menu {
        left: 0 !important
    }
    ul.dropdown-menu.center-main-ul {
        width: 100% !important;
        padding: 15px 0 15px 15px;
    }
    .center-li {
        display: inline-block;
        width: 40%;
    }
        .stu_home_page {
        margin-top: 4rem
    }

    .ZE_footer {
        padding: 1rem 0 .2rem 0;
    }

        .ZE_footer h5 {
            margin-top: .5rem
        }

    #Admsn_form .modal-dialog {
        max-width: 100%;
        margin: 30px auto
    }

        #Admsn_form .modal-dialog .modal-content {
            padding: 1rem
        }

    .pading1 {
        padding: 0
    }

    .modal-dialog.cascading-modal .modal-header {
        margin: 10rem 1rem 1rem
    }

    

    #ca-navbar {
        background: #fff;
        padding: 10px 20px;
        z-index: 1
    }

        #ca-navbar .nav-item {
            border-bottom: 1px solid #fff;
            width: 100%;
            padding: 10px 0
        }

    .navbar.navbar-light .navbar-nav .nav-item .nav-link {
        padding: 0
    }

    ul#nav {
        margin-bottom: 1rem
    }

    section.z_banner_section {
        padding: 0 0
    }

    .banner_content {
        padding-top: 6rem
    }

        .banner_content img {
            padding-bottom: 1rem;
            width: 20%
        }

        .banner_content h2 {
            font-size: 1rem
        }

        .banner_content h1 {
            font-size: 1.7rem
        }

    h3 {
        font-size: 1.8rem;
        margin-top: 3rem
    }

    .I_Box {
        text-align: center;
        height: auto;
        width: 50%;
        margin: 2rem 1rem
    }

    .tab_video_section .tab .nav-tabs li a:after, .tab_video_section .tab .nav-tabs li a:before {
        height: 2px
    }

    .right_box {
        float: right
    }

    .I_Box img {
        width: 25%
    }

    img.bg_imgs {
        top: 0
    }

    .ZE_OL h3 {
        margin-top: 1rem
    }

    .ZE_main_video_box {
        padding: 5rem 3px 20px 3px
    }

    .ZE_main_video_box {
        height: 100%;
        width: 95%;
        border-radius: 5px;
        padding-bottom: 2rem;
        margin: 2rem auto;
        box-shadow: 2px 2px 25px 9px rgba(1,199,251,.2)
    }

    .ZE_video_box {
        height: auto;
        width: 227px
    }

    .ZE_main_video_box p {
        padding: 0 20px
    }

    .ZE_main_video_box li {
        width: 47%
    }

    .ZE_main_video_box ul li span img {
        width: 12%
    }

    .ZE_main_video_box ul li span {
        font-size: 11px
    }

    .enroll_btn a {
        top: 11px
    }

    .OVL_container {
        width: 100%
    }

    .ul_left li {
        font-size: 16px;
        padding-right: 1rem
    }

    .ul_right li {
        font-size: 16px;
        padding-left: 0
    }

    .ZE_OVL_left_img {
        right: 10px;
        top: -135px;
        width: 48%
    }

    .ZE_OVL_right_img {
        left: 10px;
        width: 55%
    }

    .ZE_TS {
        background-size: cover;
        padding: 5rem 0 0 0
    }

        .ZE_TS h2 {
            padding-top: 4rem
        }

        .ZE_TS .row {
            margin-top: 0
        }

    .ZE_TS_ul {
        padding-left: 0
    }

        .ZE_TS_ul li span {
            font-size: 16px;
            padding-left: 0
        }

    .ZE_Contact_container {
        width: 90%;
        margin: 1rem auto
    }

    .ZE_footer {
        padding: 2rem 0 .2rem 0
    }

        .ZE_footer ul {
            margin-bottom: 0
        }

        .ZE_footer h5 {
            margin-top: 1rem
        }

    .SH_left_button input[type="text"] {
        width: 50%;
        font-size: 12px;
    }


    .SH_btn_orange {
        font-size: 12px;
        padding: 1px 15px;
    }

    .SH_right_button .SH_btn_orange {
        width: 100%;
        padding: 2px 10px;
        /*margin-top: 1rem;*/
    }

    .SHS_mb_2 {
        margin-bottom: 1rem;
    }

    .col_xs_stu1 {
        width: 60%;
    }

    .col_xs_asgn1, .col_xs_asgn2 {
        width: 100%;
        max-height: 100%;
    }

    .col_xs_asgn1, .col_xs_test2 {
        padding-left: 0;
        border-radius: 10px 0 0 10px;
    }

    .col_xs_asgn2, .col_xs_test3 {
        border-radius: 0 10px 10px 0;
    }

    .col_xs_test3, .col_xs_test2 {
        height: 100px;
    }

    .test_div {
        border-radius: 10px;
        padding: 8px;
    }

    .assign_left_div {
        padding: 5px;
    }

        .assign_left_div h5, .left_heding h5 {
            font-size: 12px;
        }

    .col_xs_test1 {
        width: 100%;
        max-height: 100%;
    }

    .col_xs_test2, .col_xs_test3 {
        width: 40%;
        padding: 6px;
        max-height: 100%;
    }

    .col_xs_test2 {
        margin-left: 15px;
    }

    .left_heding h5 {
        font-size: 10px;
    }

    .test_left_box h6, .test_right_box h6 {
        font-size: 11px;
    }

    .col_xs_stu2 {
        width: 40%;
    }

    .TWD .right_icon_box {
        border-radius: 10px;
        padding: 20px;
    }

    .TWD .right_icon img {
        width: 20%;
    }

    .right_icon_box {
        border-radius: 10px;
        padding: 10px 0;
        height: auto;
    }

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

    .left_att {
        font-size: 25px;
    }

    .center_att span {
        font-size: 12px;
    }

    .attendance_div {
        padding: 5px;
        margin-top: 0;
    }

    .SH_left_content {
        margin-top: 0;
    }

    .upc_description {
        height: auto;
        border-radius: 10px;
        width: 100%;
        padding: 8px;
        text-align: center;
    }

        .assign_left_div h5, .left_heding h5, .upc_description h5, .Attenndence_Container h5, .attendance_div h5 {
            font-size: 14px;
            margin-left: 0;
        }

        .upc_description .t_name, .upc_description .sub_name {
            font-size: 12px;
        }

    .upc_pic {
        height: auto;
        border-radius: 10px;
        padding: 8px;
    }

        .upc_pic img {
            border-radius: 0;
        }

    /*-----SH--------*/
    .container_new {
        margin: 10px;
    }

    button.SH_btn_orange {
        padding: 5px 10px;
        width: auto;
        font-weight: bold;
    }

    .VRC {
        text-align: inherit;
        margin-top: 15px;
    }

        .VRC a button {
            width: 140px;
            font-size: 10px;
        }

    .wtsup_icon img {
        width: 35%;
    }

    .right_icon img {
        width: 25% !important;
    }

    .center_att .text-left {
        font-size: 13px;
    }

    .Att_con {
        display: block;
    }

    .View_btn {
        margin: 0 auto;
        width: 90%;
        height: auto;
        border-radius: 5px;
        font-size: 14px;
        display: block;
    }

    .subject_name {
        padding: 5px;
        display: block !important;
        width: 100%;
    }

    .sub_con {
        padding: 5px;
        margin-top: 0;
    }

    .subject_name thead tr th {
        font-size: 14px;
    }

    .owl-carousel .owl-wrapper-outer {
        height: auto;
    }

    .Attenndence_Container {
        height: auto;
        margin-bottom: 15px;
        margin-top: -10px;
    }
    /*----end-SH--------*/
}

@media only screen and (max-width:760px) and (orientation:landscape) {
    .Z_gradient_btn a {
        font-size: 14px
    }

    .tab_video_section .tab .nav-tabs li a {
        font-size: 11px
    }

    .modal-dialog.cascading-modal .modal-header {
        margin: 7rem 1rem 1rem
    }

    .I_Box {
        width: 100%;
        margin: 1.5rem auto;
        padding: 5px
    }

    .left_interactive_class .col-sm-12 {
        padding: 0
    }

    .ZE_video_box {
        height: 210px;
        width: 210px
    }

    .ZE_main_video_box {
        height: 100%
    }

        .ZE_main_video_box li {
            width: 47%
        }

    .enroll_btn a {
        top: 15px;
        width: 66%
    }

    .ZE_OVL_left_img {
        width: 34%
    }

    .ZE_OVL_right_img {
        width: 40%
    }

    .ZE_TS {
        padding: 8rem 0 0 0
    }

    .ZE_footer ul li span img {
        width: 10%
    }

    .social_icon a img {
        width: 30%
    }

    .SH_left_button input[type="text"] {
        width: 77%;
        font-size: 12px;
    }


    .SH_btn_orange {
        font-size: 12px;
        padding: 1px 15px;
    }

    .SH_right_button .SH_btn_orange {
        width: 100%;
        padding: 2px 10px;
        /*margin-top: 1rem;*/
    }

    .SHS_mb_2 {
        margin-bottom: 1rem;
    }

    .col_xs_stu1 {
        width: 60%;
    }

    .col_xs_asgn1, .col_xs_asgn2 {
        width: 100%;
        max-height: 100%;
    }

    .col_xs_asgn1, .col_xs_test2 {
        padding-left: 0;
        border-radius: 10px 0 0 10px;
    }

    .col_xs_asgn2, .col_xs_test3 {
        border-radius: 0 10px 10px 0;
    }

    .col_xs_test3, .col_xs_test2 {
        height: 100px;
        flex: 0 0 33.333333%;
    }

    .test_div {
        border-radius: 10px;
        padding: 8px;
    }

    .assign_left_div {
        padding: 5px;
    }

        .assign_left_div h5, .left_heding h5 {
            font-size: 12px;
        }

    .col_xs_test1 {
        width: 100%;
        max-height: 100%;
    }

    .col_xs_test2, .col_xs_test3 {
        width: 40%;
        padding: 6px;
        max-height: 100%;
    }

    .col_xs_test2 {
        margin-left: 15px;
    }

    .left_heding h5 {
        font-size: 10px;
    }

    .test_left_box h6, .test_right_box h6 {
        font-size: 11px;
    }

    .col_xs_stu2 {
        width: 30%;
    }

    .TWD .right_icon_box {
        border-radius: 10px;
        padding: 20px;
    }

    .TWD .right_icon img {
        width: 20%;
    }

    .right_icon_box {
        border-radius: 10px;
        padding: 10px 0;
        height: 78px;
    }

        .right_icon_box p {
            font-size: 7px;
        }

    .left_att {
        font-size: 25px;
    }

    .center_att span {
        font-size: 12px;
    }

    .attendance_div {
        padding: 5px;
        margin-top: 0;
    }

    .SH_left_content {
        margin-top: 0;
    }

    .upc_description {
        height: auto;
        border-radius: 10px;
        width: 100%;
        padding: 8px;
        text-align: center;
    }

        .assign_left_div h5, .left_heding h5, .upc_description h5, .Attenndence_Container h5, .attendance_div h5 {
            font-size: 14px;
            margin-left: 0;
        }

        .upc_description .t_name, .upc_description .sub_name {
            font-size: 12px;
        }

    .upc_pic {
        height: auto;
        border-radius: 10px;
        padding: 8px;
    }

        .upc_pic img {
            border-radius: 0;
        }

    .col-xs_slider1 {
        padding-right: 0;
    }

    .col-xs_slider2 {
        padding-left: 0;
    }

    .upc_description {
        height: 170px;
        border-radius: 10px 0 0 10px;
    }

    .upc_pic {
        height: 170px;
        border-radius: 0px 10px 10px 0;
    }
    /*-----SH--------*/
    .container_new {
        margin: 10px;
    }

    button.SH_btn_orange {
        padding: 2px 10px;
        width: auto;
        font-weight: bold;
    }

    .wtsup_icon img {
        width: 35%;
    }

    .right_icon img {
        margin-left: 0;
        width: 25% !important;
    }

    .center_att .text-left {
        font-size: 13px;
    }

    .Att_con {
        display: block;
    }

    .View_btn {
        margin: 0 auto;
        width: 90%;
        height: auto;
        border-radius: 5px;
        font-size: 14px;
        display: block;
    }

    .subject_name {
        padding: 5px;
        display: block !important;
        width: 100%;
    }

    .sub_con {
        padding: 5px;
        margin-top: 0;
    }

    .subject_name thead tr th {
        font-size: 14px;
    }

    .owl-carousel .owl-wrapper-outer {
        height: auto;
    }

    .Attenndence_Container {
        height: auto;
        margin-bottom: 15px;
        margin-top: -10px;
    }
    /*----end-SH--------*/
}

@media only screen and (min-device-width:768px) and (max-device-width:1024px) and (orientation:portrait) {
    .logoimg {
        width: 100%
    }

    .center-li {
        width: 44%;
    }
    .modal-dialog.cascading-modal .modal-header {
        margin: 6rem 1rem 1rem
    }

    .banner_content {
        padding-top: 5rem
    }

    .body_left_img img {
        bottom: 65px;
        width: 3%
    }

    .left_interactive_class .col-md-12, .left_interactive_class .col-md-6 {
        padding: 0
    }

    .ZE_main_video_box {
        padding: 8rem 3px 20px 3px
    }

    .ZE_main_video_box {
        width: 53%
    }

    .video_icon_maindiv {
        width: 320px;
        height: auto
    }

    .ZE_video_box {
        height: auto;
        width: 320px
    }

        .ZE_video_box img {
            top: 23%
        }

    .ZE_main_video_box li {
        width: 38%
    }

    .enroll_btn a {
        width: 60%;
        top: 82px
    }

    .ZE_OVL_left_img {
        width: 23%;
        top: -34px
    }

    .OVL_container {
        width: 62%
    }

    .ZE_OVL_right_img {
        width: 30%
    }

    .ZE_TS h2 {
        padding-top: 7rem
    }

    .ZE_video_box .video_icon_div {
        box-shadow: 2px 2px 25px 9px rgba(1,199,251,.2)
    }

    .ZE_OVL_left_img {
        width: 20% !important
    }

    .col-xs_slider1 {
        padding-right: 0;
    }

    .col-xs_slider2 {
        padding-left: 0;
    }

    .upc_description {
        height: 215px;
        border-radius: 10px 0 0 10px;
    }

    .upc_pic {
        height: 215px;
        border-radius: 0px 10px 10px 0;
    }

    .right_icon_box {
        padding: 26px 0;
    }

    .Att_con {
        display: flex;
    }

    .View_btn {
        border: 0px solid black;
        margin: 26px;
        width: 190px;
        height: 33px;
        border-radius: 47px;
        color: white;
        font-size: 20px;
        background-color: #EB7926;
    }

    .subject_name thead tr th {
        font-size: 1.6rem;
    }

    .col_xs_test2, .col_xs_test3 {
        flex: 0 0 33.333333%;
    }
}

@media only screen and (min-device-width:768px) and (max-device-width:1024px) and (orientation:landscape) {
    .navbar.navbar-light .navbar-nav .nav-item .nav-link {
        padding: 0 10px
    }

    ul.dropdown-menu.center-main-ul {
        width: 790px !important;
    }
    .center-li {
        width: 21% !important;
    }
    .center-sub-ul li a {
        width: 170px !important;
    }
        .modal-dialog.cascading-modal .modal-header {
        margin: 4rem 1rem 1rem
    }

    .z_banner_section .bg_img {
        width: 71%
    }

    .ZE_main_video_box {
        padding: 6rem 3px 20px 3px
    }

    .ZE_main_video_box {
        width: 277px
    }

    .ZE_video_box {
        height: auto;
        width: 268px
    }

    .banner_content {
        padding-top: 0
    }

        .banner_content h2 {
            font-size: 1.4rem
        }

        .banner_content h1 {
            font-size: 2.7rem
        }

    .body_left_img img {
        bottom: 227px;
        width: 3%
    }

    .I_Box {
        height: 295px
    }

    .ZE_video_box img {
        left: 42%
    }

    .ZE_OL h3 {
        margin-top: 1rem
    }

    .upc_description, .upc_pic {
        height: 265px;
    }

    .right_icon_box {
        padding-top: 15px;
        height: 125px;
    }

        .right_icon_box p {
            font-size: 13px;
        }

    .owl-carousel .owl-wrapper-outer {
        height: auto;
    }

    .SH_left_button input[type="text"] {
        max-width: 77%;
    }
}

@media only screen and (min-device-width:1024px) and (max-device-width:1366px) and (orientation:portrait) {
    .navbar.navbar-light .navbar-nav .nav-item .nav-link {
        padding: 0 10px
    }
    .dropdown-menu.center-main-ul {
        width: 780px !important;
    }
    .center-li {
        width: 21%;
    }
    .center-sub-ul li a {
        width: 165px;
    }
    .ZE_main_video_box {
        padding: 9rem 3px 20px 3px
    }

    .ZE_main_video_box {
        width: 95%
    }

    .z_banner_section .bg_img {
        width: 71%
    }

    .ZE_main_video_box li {
        width: 48%
    }

    .banner_content {
        padding-top: 1rem
    }

        .banner_content h2 {
            font-size: 1.2rem
        }

        .banner_content h1 {
            font-size: 3.2rem
        }

    .body_left_img img {
        bottom: 218px
    }

    .left_interactive_class .col-md-12 {
        padding: 0 9px
    }

    .enroll_btn a {
        top: 14px
    }

    .ZE_OL h3 {
        margin-top: 2rem
    }

    .ZE_video_box {
        height: auto;
        width: 264px
    }

    h3 {
        margin-top: 1rem
    }

    .ZE_OVL_right_img {
        bottom: -25px
    }

    .upc_description, .upc_pic {
        height: 340px;
    }

    .right_icon_box {
        padding: 45px 0;
    }
}

@media only screen and (min-device-width:1024px) and (max-device-width:1366px) and (orientation:landscape) {
    ul.dropdown-menu.center-main-ul {
        width: 840px;
    }
    .center-li {
        display: inline-flex;
        width: 22%;
    }
    .center-sub-ul li a {
        width: 178px;
    }
    }