@media only screen and (max-width: 768px) {
    #inner_firstPage{
        border: 1px solid white;
        margin: 25% auto 63%;
    }
    
    .header{
        padding-top: 20px;
        margin: 0 auto 1%;
    }

    .logo{
        font-size: 20px;
        width: 70%;
    }

    .navbar{
        display: flex;
        justify-content: center;
        width: 60%;
        margin-left: 15%;
    }

   .navbar a{
        display: inline;
        font-size: 15px;
    } 

        /******************** SECTION BODY ********************/
    #inner_landing_view{
        display: block;
        text-align: center;
        margin-top: 1%;
    }

    #inner_landing_view h1{
        font-size: 25px;
        margin-top: 10%;
        line-height: 40px;
    }

    #inner_landing_view h1:nth-child(1){
        margin-top: 5%;
    }

    #inner_landing_view h2{
        font-size: 20px;
        margin-top: 5%;
    }

    #startBtn{
        margin-top: 14%;
    }

    .inner_section{
        display: block;
        overflow: auto;
        height: 600px;
    }

        /***** ABOUT US *****/
    .about-contact{
        /* border: 1px solid red; */
        background: rgb(8, 77, 34, .4);
        width: 97%;
        margin: 7% auto;
        padding-right: 10px;
    }

    #about, #contact{
        width: inherit;
        margin: 0;
        display: none;
    }

        /***** LOGIN CODE *****/
    .home-login{
        width: 80%;
        margin: 7% auto;
    }

    .login > h2, .register > h2{
        font-size: 30px;
    }

    .login .inputBox, .register .inputBox{
        padding: 5px 0;
        width: 70%;
        margin: 0 auto 7%;
    }

    .login .inputBox label{
        font-size: 15px;
    }

    .login .inputBox input, .register .inputBox input,
    .login .inputBox input, .register .inputBox select{
        font-size: 12px;
    }

    #forget_signUp{
        display: flex;
        flex-direction: row;
        margin-top: 4%;
    }

    .login #forget, .login #sign_up{
        font-size: 12px;
        text-align: left;
    }

    .login #sign_up{
        margin-left: 25%;
        width: 30%;
        text-align: right;
    }

            /***** REGISTER CODE *****/
   .home-register{
        width: 90%;
        margin: 2% auto;
        height: 570px
    }

    .register h2{
        font-size: 18px;
    }

    #reg_select_type{
        width: 60%;
        margin-top: 5%;
    }

    #reg_select_type label, #staff_register_form label{
        font-size: 15px;
    }

    #stud_register_form, #staff_register_form{
        display: none;
    }

    #stud_register_form label{
        font-size: 15px;
    }

    .reg_phase_one, .reg_phase_two, #reg_leftRight_sponsor{
        display: block;
        margin: .5%;
    }

    .reg_top_phaseOne, .reg_bottom_phaseTwo, .reg_sponsor{
        width: 90%;
        margin: 0 auto;
    }

    #regNextBtn button{
        font-size: 15px;
    }

            /***** FORGET PASSWORD CODE *****/
    #inner_forget_pass{
        margin-top: 20%;
    }


    /******************** STUDENT PAGE ********************/
    .drop-down{
        width: 25%;
    }

    #fresh_box{
        margin-top: 3%;
    }

    .accRej{
        width: 80%;
        margin: 16% auto;
    }

    .accRej > p{
        font-size: 20px;
    }
    
    #acceptBox{
        margin-top: 11.5%;
        margin-bottom: 40%;
    }

    #h-grad{
        margin-top: 27%;
        margin-bottom: 50%;
    }

    #non{
        margin-bottom: 40.3%;
    }

    #h-non, #rejectBox{
        margin-top: 20%;
        margin-bottom: 57%;
    }

        /***** VERIFICATION CODE *****/
    #verification{
        border: 1px solid white;
        height: 590px;
        overflow-y: auto;
    }

    .instruction{
        width: 90%;
    }

    .instruction > p{
        font-size: 13px;
    }

    .instruction ul{
        margin: 4% 1.5%;
    }

    .instruction ul li{
        margin-bottom: 1%;
        font-size: 15px;
    }

    .instruction ul li:nth-child(1), .instruction ul li:nth-child(3){
        margin-left: 2%;
    }

    #instr{
        font-size: 15px;
        margin-top: 1%;
    }

    .verifyBox{
        border: 1px solid black;
        width: 80%;
        margin: 5% auto;
    }

    .verifyBox > h2{
        font-size: 20px;
    }
    
        /***** RECFEIPT UPLOAD CODE *****/
    .receipt_box, #get_receipt{
        width: 80%;
        margin: 0 auto;
    }

    .receipt_box{
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    #get_receipt_box{
        margin: 4% 0 27%;
        padding: 5.5px;
    }

    #get_receipt{
        display: flex;
        justify-content: center;
        align-items: center;
    }

    #getReceipt_form{
        width: 70%;
    }

    #get_receipt .inputBox{
        width: 100%;
    }


            /******************** ADMIN PAGE ********************/
    /***** DASHBOARD HOME CODE *****/
    .drop-down{
        width: 30%;
        right: 10px;
    }

    .drop-down ul li{
        font-size: 15px;
        background-color: rgba(0, 0, 0, .3);
    }

    #deptList, #sublist{
        top: 131px;
        width: 80%;
    }

    #deptList{
        top: 206px;
    }

    #sublist{
        top: 38px;
        width: 100%;
    }

    .dash_home_body marquee{
        margin-top: 1%;
        font-size: 18px;
    }

    .inner_dash_home{
        width: 98%;
        margin: 13% auto;
    }

    .inner_dash_home h2{
        font-size: 15px;
        padding-left: 0;
    }

    .inner_dash_home > ul{
        padding-left: 0;
    }

    .inner_dash_home > ul > li{
        font-size: 15px;
    }

    .inner_dash_home > ul ul > li{
        font-size: 13px;
    }

        /***** VALIDATION CODE *****/
    #stud-validate{
        height: 628px;
        padding: 0 3px 0;
    }

    .section_status_box{
        width: 90%;
        margin: 4% 0 3% 5%;
    }

    .section_status_box .inputBox input, .section_status_box input[type="submit"]{
        padding: 8px;
    }

    .section_status_box .inputBox input[type="text"]{
        width: 35%;
        font-size: 13px;
    }

    .validateBox, .validateBox_status{
        width: 100%;
        padding: 0;
        margin-left: 0;
    }

    .validateBox_status{
        height: 477px;
    }

    .validateBox select{
        padding: 5px;
    }

    td, th{
        text-align: center;
        padding: 10px;
        font-size: 11px;
    }

    td a{
        font-size: 11px;
    }

    .iframe iframe{
        width: 95%;
    }

        /***** ACCOUNT UPDATE CODE *****/
    #account-update, #acc_status{
        height: 550px;
        overflow-y: scroll;
    }

    #acc_status{
        height: 580px;
    }

    .account-wrapper{
        display: block;
    }

    .acc-update{
        width: 75%;
        margin: 0 auto;
    }

    .acc-update > h2, .passportUpd > h2{
        font-size: 20px;
    }

    .acc-update .inputBox{
        width: 70%;
        margin-left: 10%;
    }

    .acc-update .inputBox input{
        font-size: 18px;
        width: 100%;
    }

    .acc-update input[type="submit"], .passportUpd input[type="submit"]{
        margin-bottom: 3%;
    }

    .passportUpd{
        width: 75%;
        margin: 5% auto;
    }

            /***** DEPARTMENT ADMIN UNIQUE CODE GENERATOR CODE *****/
    #generate_code h2{
        font-size: 18px;
    }
    .inner_code_gen .inputBox{
        width: 60%;
        margin: 3% auto;
    }

    .inner_code_gen .inputBox select{
        margin-top: 4%;
    }

        /***** DEPARTMENT STATISTIC CODE *****/
    #deptBox{
        overflow: auto;
    }

    #deptView{
        width: 95%;
        margin-top: 1%;
    }

    #deptView h2, #deptView span{
        font-size: 18px;
    }

    #deptView span{
        font-size: 13px;
    }

    #deptView h3, #deptView p{
        font-size: 13px;
    }

    .top_deptView{
        margin-bottom: 6%;
    }

    .left_deptView, .right_deptView{
        width: 50%;
        margin-left: 1%;
    }

    .left_deptView p, .right_deptView p{
        padding-left: 10px;
    }

    .left_deptView span, .right_deptView span{
        margin-right: 4%;
    }
    
    #inner_deptStat{
        display: block;
    }

    #deptStat{
        width: 100%;
    }

    #bt{
        display: block;
    }

    .levStat{
        border: none;
        width: 70%;
        margin: 5% auto;
    }

    .levStat h3{
        font-size: 30px;
    }

    #levStat_box{
        /* border: 1px solid red; */
        width: 90%;
        margin: 1% auto;
    }

    #levStat_box p, #levStat_box span{
        font-size: 13px;
    }

        /***** ALL DEPARTMENTS STATISTIC CODE *****/
    #inner_all_deptView{
        height: 540px;
        margin-top: 5px;
    }

    .inner_all_deptViewBox{
        width: 90%;
        margin: 0 auto;
        float: none;
    }

    .inner_all_deptViewBox:nth-child(1), .inner_all_deptViewBox:nth-child(4),
    .inner_all_deptViewBox:nth-child(7), .inner_all_deptViewBox:nth-child(10){
        margin-left: 5%;
    }

    .inner_all_deptViewBox p, .inner_all_deptViewBox h3, .inner_all_deptViewBox span{
        font-size: 11px;
    }

        /***** FORGET PASSWORD CODE *****/
    #forgetPass, #verify_accessCode, #new_passwordBox,
    #adm_reg_code, #adm_reg_fac{
        width: 80%;
        padding: 3px;
    }
    
    #forgetPass, #new_passwordBox{
        margin-top: 3.5%;
        margin-bottom: 6% ;
    }

    .forgetPass h2, .new_passwordBox h2{
        font-size: 22px;
    }

    #verify_accessCode{
        margin-top: 5%;
        margin-bottom: 9% ;
    }

    .verify_accessCode h2{
        font-size: 25px;
    }

    #new_passwordBox{
        margin-top: 3.5%;
        margin-bottom: 7% ;
    }

    .adm_reg_fac h2{
        font-size: 18px;
    }

    .adm_reg_fac .inputBox label{
        font-size: 15px;
    }

    #forget_form, #pass_form, #code_form, #fac_form{
        width: 70%;
    }
}

@media (min-width: 769px) and (max-width: 1024px) {
    #inner_firstPage{
        margin: 15% auto 39.2%;
    }

    .header{
        padding-top: 20px;
        margin: 0 auto 1%;
    }

    .logo{
        font-size: 25px;
        width: 70%;
    }

    .navbar{
        display: flex;
        justify-content: center;
        width: 60%;
        margin-left: 22%;
    }

   .navbar a{
        display: inline;
        font-size: 18px;
    } 

        /******************** SECTION BODY ********************/
   #inner_landing_view{
        display: block;
        text-align: center;
        margin-top: 1%;
    }

    #inner_landing_view h1{
        font-size: 25px;
        margin-top: 8%;
    }

    #inner_landing_view h1:nth-child(1){
        margin-top: 5%;
    }

    #inner_landing_view h2{
        font-size: 20px;
        margin-top: 5%;
    }

    #startBtn{
        margin-top: 13%;
        margin-bottom: 4%;
    }
    
    .section{
        margin: 0;
        padding: 0;
    }

    .inner_section{
        display: block;
        overflow: auto;
        height: 600px;
    }

        /***** ABOUT US *****/
    .about-contact{
        background: rgb(8, 77, 34, .4);
        width: 98%;
        margin: 1% 0;
    }

    #about, #contact{
        width: inherit;
        margin: 0;
        display: none;
    }

    
        /***** LOGIN CODE *****/
    .home-login{
        width: 60%;
        margin: 2% auto;
    }

    .login .inputBox, .register .inputBox{
        padding: 5px 0;
        width: 70%;
        margin: 0 auto 4%;
    }

    #forget_signUp{
        display: flex;
        flex-direction: row;
        margin-top: 4%;
    }

    .login #forget, .login #sign_up{
        font-size: 12px;
        text-align: left;
    }

    .login #sign_up{
        margin-left: 25%;
        width: 30%;
        text-align: right;
    }

            /***** REGISTER CODE *****/
    .home-register{
        width: 98%;
        margin: 0 auto;
        height: 590px
    }

    .register h2{
        font-size: 20px;
    }

    #reg_select_type{
        width: 40%;
        margin-top: 3%;
    }

    #reg_select_type label{
        font-size: 15px;
    }

    #stud_register_form, #staff_register_form{
        display: none;
    }

    #stud_register_form label, #staff_register_form label{
        font-size: 15px;
    }

    #student_info .inputBox, #staff_register_form .inputBox{
        width: 90%;
    }

    .reg_phase_one, .reg_phase_two, #reg_leftRight_sponsor{
        overflow: auto;
        display: block;
        margin: .5%;
    }

    .reg_top_phaseOne, .reg_bottom_phaseTwo, .reg_sponsor{
        border: 1px solid rgb(8, 77, 34, .5);
        width: 45%;
        float: left;
        margin: 0 1% 2%;
    }

    #leftTop_phaseOne, #rightTop_phaseTwo, #leftBottom_phaseTwo, 
    #rightBottom_phaseTwo, #reg_left_sponsor, #reg_right_sponsor,
    #staff_leftTop_phaseOne, #staff_rightTop_phaseTwo, 
    #staff_leftBottom_phaseTwo, #staff_rightBottom_phaseTwo{
        margin-left: 4%;
    }

    .reg_sponsor .inputBox{
        margin-top: 2%;
    }

    #regNextBtn button{
        font-size: 15px;
    }

            /***** FORGET PASSWORD CODE *****/
    #inner_forget_pass{
        margin-top: 15%;
    }


    /******************** STUDENT PAGE ********************/
    .admin-home{
        top: 80px;
    }

    .drop-down{
        width: 25%;
    }

    #fresh_box{
        margin-top: 3%;
    }

    .accRej{
        width: 80%;
        margin: 10% auto;
    }

    .accRej > p{
        font-size: 20px;
    }
    
    #h-non, #rejectBox{
        margin-bottom: 36.3%;
    }

        /***** VERIFICATION CODE *****/
    #verification{
        border: 1px solid white;
        height: 590px;
        overflow: auto;
    }

    .instruction{
        width: 93%;
    }

    .instruction ul{
        margin: 4% 0;
    }

    .instruction ul li{
        margin-bottom: 1%;
    }

    .instruction ul li:nth-child(1){
        margin-left: 0;
    }

    #instr{
        font-size: 16px;
        margin-top: 0;
    }

    .verifyBox{
        border: 1px solid black;
        width: 60%;
        margin: 3% auto;
    }

    .verifyBox > h2{
        font-size: 20px;
    }
    
    .receipt_box, #get_receipt{
        width: 80%;
        margin: 0 auto;
    }

    .receipt_box{
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    #get_receipt_box{
        margin: 4% 0 10%;
        /* padding: px; */
    }

    #get_receipt{
        display: flex;
        justify-content: center;
        align-items: center;
    }

    #getReceipt_form{
        width: 55%;
    }

    #get_receipt .inputBox{
        width: 100%;
    }

            /******************** ADMIN PAGE ********************/
    /***** DASHBOARD HOME CODE *****/
    .drop-down{
        width: 20%;
        right: 10px;
    }

    .drop-down ul li{
        font-size: 15px;
    }

    #deptList, #sublist{
        top: 114px;
        width: 70%;
    }

    #deptList{
        top: 189px;
    }

    #sublist{
        top: 37px;
        width: 100%;
    }

    .dash_home_body marquee{
        margin-top: 1%;
        font-size: 18px;
    }

    .inner_dash_home{
        width: 98%;
        margin: 10% auto;
    }

    .inner_dash_home h2{
        font-size: 17px;
        padding-left: 0;
    }

    .inner_dash_home > ul{
        padding-left: 0;
    }

    .inner_dash_home > ul > li{
        font-size: 17px;
    }

    .inner_dash_home > ul ul > li{
        font-size: 15px;
    }

        /***** VALIDATION CODE *****/
    #stud-validate{
        height: 628px;
        padding: 0 3px 0;
    }

    .validateBox, .validateBox_status{
        width: 100%;
        padding: 0;
        margin-left: 0;
    }

    .validateBox select{
        padding: 5px;
    }

    td, th{
        text-align: center;
        padding: 10px;
        font-size: 13px;
    }

    td a{
        font-size: 13px;
    }

    .iframe iframe{
        width: 90%;
    }

        /***** ACCOUNT UPDATE CODE *****/
    .acc-update{
        width: 46%;
        margin: 0 auto;
    }

    .acc-update > h2, .passportUpd > h2{
        font-size: 20px;
    }

    .acc-update .inputBox{
        width: 80%;
    }

    .acc-update .inputBox input{
        font-size: 18px;
        width: 100%;
    }

    .passportUpd{
        width: 46%;
        margin: 5% auto;
    }

    #addImgBox, #studImgBox{
        width: 70%;
        margin-left: 15%;
    }

            /***** DEPARTMENT ADMIN UNIQUE CODE GENERATOR CODE *****/
    #generate_code h2{
        font-size: 18px;
    }

    .inner_code_gen .inputBox{
        width: 37%;
        margin: 3% auto;
    }

    .inner_code_gen .inputBox select{
        margin-top: 4%;
    }

        /***** DEPARTMENT STATISTIC CODE *****/
    #deptBox{
        overflow: auto;
    }

    #deptView{
        width: 70%;
        margin-top: 1%;
    }

    #deptView h2{
        font-size: 20px;
    }

    #deptView h3{
        font-size: 15px;
    }

    #deptView span, #deptView p{
        font-size: 13px;
    }

    .top_deptView{
        margin-bottom: 6%;
    }

    .left_deptView, .right_deptView{
        width: 48%;
        margin-left: 0;
    }

    .right_deptView{
        margin-left: 1%;
    }

    .left_deptView span, .right_deptView span{
        margin-right: 12%;
    }

        /***** ALL DEPARTMENTS STATISTIC CODE *****/
    #inner_all_deptView{
        height: 530px;
        overflow: auto;
        margin-top: 5px;
    }

    .inner_all_deptViewBox{
        width: 49%;
        float: left;
    }

    .inner_all_deptViewBox:nth-child(1), .inner_all_deptViewBox:nth-child(3),
    .inner_all_deptViewBox:nth-child(5), .inner_all_deptViewBox:nth-child(7), 
    .inner_all_deptViewBox:nth-child(9){
        margin-left: .5%;
    }

    .inner_all_deptViewBox p, .inner_all_deptViewBox h3, .inner_all_deptViewBox span{
        font-size: 11px;
    }

    #left_deptView p, #right_deptView p{
        font-size: 10px;
    }

    #left_deptView span, #right_deptView span{
        float: right;
        margin-right: 2%;
    }
    
    #inner_deptStat{
        display: block;
    }

    #deptStat{
        width: 100%;
    }

    #bt{
        display: block;
    }

    .levStat{
        border: none;
        width: 80%;
        margin: 5% auto;
    }

    .levStat h3{
        font-size: 30px;
    }

    #levStat_box{
        width: 70%;
        margin: 1% auto;
    }

    #levStat_box p, #levStat_box span{
        font-size: 13px;
    }

        /***** FORGET PASSWORD CODE *****/
    #forgetPass, #verify_accessCode, #new_passwordBox,
    #adm_reg_code, #adm_reg_fac{
        width: 60%;
        padding: 3px;
    }
    
    #forgetPass{
        margin-top: 3.5%;
        margin-bottom: 2% ;
    }

    .forgetPass h2, .new_passwordBox{
        font-size: 25px;
    }

    #verify_accessCode{
        margin-top: 2%;
        margin-bottom: 4% ;
    }

    .verify_accessCode h2{
        font-size: 25px;
    }

    #new_passwordBox{
        margin-top: 2%;
        margin-bottom: 2% ;
    }

    .adm_reg_fac h2{
        font-size: 20px;
    }

    .adm_reg_fac .inputBox label{
        font-size: 15px;
    }

    #forget_form, #pass_form, #code_form, #fac_form{
        width: 60%;
    }
}

@media (min-width: 1025px) and (max-width: 1400px) {
    #inner_firstPage{
        margin: 10% auto 30.8%;
    }

    .header{
        padding-top: 20px;
        margin: 0 auto 1%;
    }

    .logo{
        font-size: 25px;
        width: 70%;
    }

    .navbar{
        display: flex;
        justify-content: center;
        width: 60%;
        margin-left: 45%;
    }

   .navbar a{
        display: inline;
        font-size: 18px;
    } 

        /******************** SECTION BODY ********************/
    .landing_view{
        padding-bottom: 10px;
    }

    #inner_landing_view{
        display: block;
        text-align: center;
        margin-top: 1%;
    }

    #inner_landing_view h1{
        font-size: 25px;
        margin-top: 6%;
    }

    #inner_landing_view h1:nth-child(1){
        margin-top: 2%;
    }

    #inner_landing_view h2{
        font-size: 20px;
        margin-top: 5%;
    }

    #startBtn{
       margin-top: 10%;
        margin-bottom: 2%;
    }

            /***** LOGIN CODE *****/
    #forget_signUp{
        display: flex;
        flex-direction: row;
        margin-top: 4%;
    }

    .login #forget, .login #sign_up{
        font-size: 12px;
        text-align: left;
    }

    .login #sign_up{
        margin-left: 25%;
        width: 30%;
        text-align: right;
    }


            /***** REGISTER CODE *****/
    .home-register{
        width: 98%;
        margin: 0 auto;
        height: 580px
    }

    .register h2{
        font-size: 20px;
    }

    .register .inputBox{
        margin: 12% auto 5%;
    }

    #reg_select_type{
        width: 35%;
        margin-top: 2%;
    }

    #reg_select_type label{
        font-size: 15px;
    }

    #stud_register_form, #staff_register_form{
        display: none;
    }

    #stud_register_form label, #staff_register_form label{
        font-size: 15px;
    }

    #student_info .inputBox, #sponsor_info .inputBox, 
    #staff_register_form .inputBox{
        width: 90%;
    }

    .reg_phase_one, .reg_phase_two, #reg_leftRight_sponsor{
        overflow: auto;
        display: block;
        margin: .5% .5% 2%;
    }

    .reg_top_phaseOne, .reg_bottom_phaseTwo, .reg_sponsor{
        border: 1px solid rgb(8, 77, 34, .5);
        width: 40%;
        float: left;
        margin: 0 2% 0;
    }

    #leftTop_phaseOne, #rightTop_phaseTwo, #leftBottom_phaseTwo, 
    #rightBottom_phaseTwo, #reg_left_sponsor, #reg_right_sponsor,
    #staff_leftTop_phaseOne, #staff_rightTop_phaseTwo,
    #staff_leftBottom_phaseTwo, #staff_rightBottom_phaseTwo{
        margin-left: 8%;
    }

    .reg_sponsor .inputBox{
        margin-top: 6%;
    }

    #regNextBtn button{
        font-size: 15px;
    }

            /***** FORGET PASSWORD CODE *****/
    #inner_forget_pass{
        margin-top: 15%;
    }

    
    /******************** STUDENT PAGE ********************/
    .admin-home{
        top: 80px;
    }

    .drop-down{
        width: 25%;
    }

    #fresh_box{
        margin-top: 3%;
    }

    .accRej{
        width: 60%;
        margin: 10% auto;
    }

    .accRej > p{
        font-size: 20px;
    }
    
    #h-non, #rejectBox{
        margin-bottom: 24.1%;
    }

        /***** VERIFICATION CODE *****/
    #verification{
        border: 1px solid white;
        height: 590px;
        overflow: auto;
    }

    .instruction{
        width: 70%;
    }

    .instruction ul{
        margin: 4% 0;
    }

    .instruction ul li{
        margin-bottom: 1%;
    }

    .instruction ul li:nth-child(1){
        margin-left: 0;
    }

    #instr{
        font-size: 16px;
        margin-top: 0;
    }

    .verifyBox{
        border: 1px solid black;
        width: 40%;
        margin: 4% auto;
    }

    .verifyBox > h2{
        font-size: 20px;
    }
    
        /***** RECFEIPT UPLOAD CODE *****/
    .receipt_box, #get_receipt{
        width: 80%;
        margin: 0 auto;
    }

    .receipt_box{
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    #get_receipt{
        display: flex;
        justify-content: center;
        align-items: center;
    }

    #getReceipt_form{
        width: 45%;
    }

    #get_receipt .inputBox{
        width: 100%;
    }

    /******************** ADMIN PAGE ********************/
    /***** DASHBOARD HOME CODE *****/
    .drop-down{
        width: 15%;
        right: 10px;
    }

    .drop-down ul li{
        font-size: 15px;
    }

    #deptList, #sublist{
        top: 114px;
        width: 70%;
    }

    #deptList{
        top: 189px;
    }

    #sublist{
        top: 37px;
        width: 100%;
    }

    .dash_home_body marquee{
        margin-top: 1%;
        font-size: 18px;
    }

    .inner_dash_home{
        width: 98%;
        margin: 6% auto;
    }

    .inner_dash_home h2{
        font-size: 17px;
        padding-left: 0;
    }

    .inner_dash_home > ul{
        padding-left: 0;
    }

    .inner_dash_home > ul > li{
        font-size: 17px;
    }

    .inner_dash_home > ul ul > li{
        font-size: 15px;
    }

        /***** VALIDATION CODE *****/
    #stud-validate{
        /* border: 1px solid blue; */
        height: 628px;
        padding: 0 3px 0;
    }

    .validateBox, .validateBox_status{
        width: 100%;
        padding: 0;
        margin-left: 0;
    }

    .validateBox_status{
        height: 460px;
    }

    .validateBox select{
        padding: 5px;
    }

    td, th{
        text-align: center;
        padding: 10px;
        font-size: 15px;
    }

    td a{
        font-size: 15px;
    }

    .iframe iframe{
        width: 90%;
    }

        /***** ACCOUNT UPDATE CODE *****/
    .account-wrapper{
        margin-top: 4%;
    }
    .acc-update{
        width: 40%;
        margin: 0 auto;
    }

    .acc-update > h2, .passportUpd > h2{
        font-size: 20px;
    }

    .acc-update .inputBox{
        width: 60%;
    }

    .acc-update .inputBox input{
        font-size: 18px;
        width: 100%;
    }

    .passportUpd{
        width: 40%;
        margin: 0 auto;
        height: inherit;
    }

            /***** DEPARTMENT ADMIN UNIQUE CODE GENERATOR CODE *****/
    #generate_code h2{
        font-size: 20px;
    }

    .inner_code_gen .inputBox{
        width: 30%;
        margin: 3% auto;
    }

    .inner_code_gen .inputBox select{
        margin-top: 4%;
    }

    /***** DEPARTMENT STATISTIC CODE *****/
    #deptBox{
        overflow: auto;
    }

    #deptView{
        width: 80%;
        margin-top: 1%;
    }

    #deptView h2{
        font-size: 20px;
    }

    #deptView h3{
        font-size: 15px;
    }

    .top_deptView{
        margin-bottom: 6%;
    }

    .left_deptView, .right_deptView{
        width: 45%;
        margin-left: 3%;
    }

    .right_deptView{
        margin-left: 1%;
        margin-right: 3%;
    }

    .left_deptView p, .right_deptView p{
        padding-left: 20px;
    }

    .left_deptView span, .right_deptView span{
        margin-right: 7%;
    }

    /***** ALL DEPARTMENTS STATISTIC CODE *****/
    #inner_all_deptView{
        height: 540px;
        overflow: auto;
        margin-top: 5px;
    }

    .inner_all_deptViewBox{
        width: 49%;
        float: left;
    }

    .inner_all_deptViewBox:nth-child(1), .inner_all_deptViewBox:nth-child(3),
    .inner_all_deptViewBox:nth-child(5), .inner_all_deptViewBox:nth-child(7), 
    .inner_all_deptViewBox:nth-child(9){
        margin-left: 1%;
    }

    .inner_all_deptViewBox p, .inner_all_deptViewBox h3, .inner_all_deptViewBox span{
        font-size: 14px;
    }

    #left_deptView span, #right_deptView span{
        float: right;
        margin-right: 2%;
    }

        /***** FORGET PASSWORD CODE *****/
    #forgetPass, #verify_accessCode, #new_passwordBox,
    #adm_reg_code, #adm_reg_fac{
        width: 50%;
        padding: 3px;
    }

    .adm_reg_fac h2{
        font-size: 20px;
    }

    .adm_reg_fac .inputBox label{
        font-size: 18px;
    }

    #forget_form, #pass_form, #code_form{
        width: 50%;
    }

    #fac_form{
        width: 65%;
    }
}

@media (min-width: 319px)  and (max-width: 460px) {
    #inner_landing_view{
        /* border: 1px solid red; */
        display: block;
        text-align: center;
        margin-top: 1%;
    }
}