*:focus,
*:active,
a:active,
a:focus,
input:focus,
input:active {
    -moz-outline-style: none;
    outline: none;
    outline: 0;
}

body {
    margin: 0;
    padding: 0;
}

/* Set padding to keep content from hitting the edges */
.body-content {
    padding-left: 15px;
    padding-right: 15px;
}

img {
    width: 100%;
}

/* Set width on the form input elements since they're 100% wide by default */


input,
select,
textarea {
    max-width: 280px;
}

.HomeEnquiryForm input, select, textarea {
    max-width: 340px;
}

.navbar-default {
    background-color: /*#f8f8f8*/#fff;
    border-color: #e7e7e7;
    box-shadow: 0 0 4px 0px #666;
}

    .navbar-default .navbar-nav > li > a {
        color: #777;
    }
/************************ CSS Modifiy*************************/



.login-page .form-horizontal .form-group, .register-page .form-horizontal .form-group {
    margin-right: -6px;
    margin-left: 0;
}

/*.login-page .has-feedback .form-control, .register-page .has-feedback .form-control {
    padding-right: 42.5px;
    width: 100% !important;
    max-width: 98%;
}*/
.login-page .has-feedback .form-control, .register-page .has-feedback .form-control {
    padding-right: 42.5px;
    width: 100% !important;
    max-width: 98%;
    padding: 20px 4%;
    border-radius: 50px;
    transition: all .4s ease;
    letter-spacing: 0.4px;
}

.login-page .form-horizontal .has-feedback .form-control-feedback, .register-page .form-horizontal .has-feedback .form-control-feedback {
    right: 12px !important;
}

.login-page .form-control-feedback, .register-page .form-control-feedback {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 2;
    display: block;
    width: 42px;
    height: 42px;
    line-height: 42px;
    text-align: center;
    pointer-events: none;
}

.login-page .form-group {
    margin-bottom: 25px;
}
/*.login-page .btn {
    border: none !important;
    margin: 0 !important;
}*/
.BorderBtnStyle {
    border: 2px solid;
    color: #333;
    font-size: 16px;
    letter-spacing: 0.5px;
    border-radius: 50px;
    padding: 10px;
    width: 100%;
    float: left;
    transition: all .4s ease;
    text-align: center;
    font-weight: bold;
}

.login-box-body .LogoBlock, .register-box-body .LogoBlock {
    padding: 10px 10px 10px 10px;
}

.login-page .LightGreenBtn, .register-page .LightGreenBtn {
    background-color: #7ac143;
    border-color: #7ac143;
    transition: all .4s ease;
    color: #fff;
}

    .login-page .LightGreenBtn:hover, .register-page .LightGreenBtn:hover {
        background-color: transparent;
        border-color: #7ac143;
        transition: all .4s ease;
        color: #7ac143;
    }

.login-page .GreyBtn, .register-page .GreyBtn {
    background-color: #434c4b;
    border-color: #434c4b;
    transition: all .4s ease;
    color: #fff;
}

    .login-page .GreyBtn:hover, .register-page .GreyBtn:hover {
        background-color: transparent;
        border-color: #434c4b;
        transition: all .4s ease;
        color: #434c4b;
    }

.login-page input[type="checkbox"] {
}

.login-page .btn {
    border: none !important;
    margin: 0 !important;
    border-radius: 50px;
    padding: 12px;
    letter-spacing: 0.5px;
    font-size: 16px;
}

.login-box {
    width: 80%;
    margin: 5% auto;
    box-shadow: -1px 1px 2px 2px rgba(67,76,75,0.2);
    border-radius: 8px;
}

.register-box {
    width: 600px;
    margin: 5% auto;
    box-shadow: -1px 1px 2px 2px rgba(67,76,75,0.2);
    border-radius: 8px;
}

.login-box-body, .register-box-body {
    border-radius: 8px;
}

.register-box .form-control {
    border-radius: 4px !important;
}

.AddStudentPopup, .AddStaffPopup {
    margin: 0 !important;
    border: none !important;
    box-shadow: none !important;
}

    .AddStudentPopup .form-horizontal .form-group, .AddStaffPopup .form-horizontal .form-group {
        margin-right: 0;
        margin-left: 0;
    }

    .AddStudentPopup input, .AddStudentPopup select, .AddStudentPopup textarea, .AddStaffPopup input, .AddStaffPopup select, .AddStaffPopup textarea {
        max-width: 100%;
    }




.AddStudentPopup, .AddEditPopup {
    margin: 0 !important;
    border: none !important;
    box-shadow: none !important;
}

    .AddStudentPopup .form-horizontal .form-group, .AddEditPopup .form-horizontal .form-group {
        margin-right: 0;
        margin-left: 0;
    }

    .AddStudentPopup input, .AddStudentPopup select, .AddStudentPopup textarea, .AddEditPopup input, .AddEditPopup select, .AddEditPopup textarea {
        max-width: 100%;
    }


.StaffAttendenceBlock {
}

    .StaffAttendenceBlock .dataTables_filter .form-control {
        width: 72%;
    }

.ClassAttendenceBlock {
}





.AddBtnStyle {
    /*color: #333;
    padding: 4px 6px;
    border-bottom: 2px solid #333;
    border-radius: 0;
    margin-right: 16px;
    background-color: #fff;
    transition: all .6s ease-out;*/
    color: #fff;
    padding: 4px 4px;
    border-radius: 2px;
    border: 1px solid transparent;
    border-radius: 2px;
    margin-right: 0px;
    background-color: #333;
    transition: all .6s ease-out;
}

    .AddBtnStyle:hover {
        color: #333;
        padding: 4px 4px;
        border-radius: 2px;
        border: 1px solid #333;
        margin-right: 0px;
        background-color: transparent;
        transition: all .6s ease-out;
    }

#dvtblStaff .col-lg-6, #dvtblStaff .col-lg-2 {
    padding: 0 !important;
}

#dvtblStaff label {
    background-color: #e5e5e5;
    padding: 4px 6px;
}

#dvtblStaff .DataValueBlock {
    padding: 4px 6px;
}

#dvtblStaff .row:hover {
    background-color: #f3f3f3;
}

.DataComingPage {
    border: 1px solid #E2E7EB;
    margin: 4px 0;
    margin-bottom: 4px;
    background-color: #fff;
}

    .DataComingPage .row {
        margin: 0;
    }

#dvtblfilter1 {
    border: 1px solid #E2E7EB;
}

.DataComingPage .row + .row {
    border-top: 1px solid #E2E7EB;
}

.DataComingPage .row:hover {
    background-color: #f0f3f5;
}

.DataComingPage .col-lg-2 {
    border-left: 1px solid #E2E7EB;
}

.DataComingPage .col-lg-2, .DataComingPage .col-lg-6, .DataComingPage .col-lg-1, .DataComingPage .col-lg-3, .DataComingPage .col-lg-4 {
    padding: 0 !important;
}

.DataComingPage label {
    background-color: #333;
    color: #fff;
}

.DataComingPage label, .DataComingPage .DataValueBlock {
    padding: 4px 6px;
    font-size: 12px;
    min-height: 26px;
}

.DataComingPage label {
    font-size: 12px;
    min-width: 87px;
    width: 100%;
}

.DataComingPage .col-lg-2, .DataComingPage .col-lg-1 {
    border-left: 1px solid silver;
}

#dvtblStaff {
    background-color: #fff;
    color: #333;
}

    #dvtblStaff .row + .row {
        border-top: 1px solid silver;
    }

    #dvtblStaff .col-lg-2, #dvtblStaff .col-lg-1 {
        border-left: 1px solid silver;
        padding: 2px 4px;
    }

    #dvtblStaff label {
    }

#divTableData {
    float: left;
    width: 100%;
    background-color: #eee;
    padding: 10px;
}
/*********************************************************************************/

#modelChangePasswordContent .form-control {
    width: 100% !important;
    max-width: 98%;
    padding: 20px 4%;
    border-radius: 50px;
    transition: all .4s ease;
    letter-spacing: 0.4px;
}

#modelChangePasswordContent .exampleInputEmail1 {
    padding-top: 15px;
}



.skin-blue .main-header .navbar {
    /* background-color: #66cc33;*/
    background-color: #3c8dbc;
}

    .skin-blue .main-header .navbar .sidebar-toggle:hover {
        background-color: transparent;
    }

.content-wrapper, .right-side {
    background-color: #eeeeee;
}

.skin-blue .main-header .logo {
    background-color: #fff;
}

    .skin-blue .main-header .logo:hover {
        background-color: #fff;
    }

.navbar-custom-menu > .navbar-nav > li > .dropdown-menu {
    background-color: #f9f9f9;
    box-shadow: 0px 0px 4px 0px grey;
}

.skin-blue .main-header li.user-header {
    /*background-color: #66cc33;*/
    background-color: #3c8dbc;
}

.skin-blue .sidebar-menu > li:hover > a, .skin-blue .sidebar-menu > li.active > a {
    color: #fff;
    background: #151d20;
    border-left-color: #66cc33;
}

.main-header .logo .logo-lg img {
    width: 88%;
    padding-top: 0%;
}

.small-box .icon {
    font-size: 70px;
}

.small-box:hover .icon {
    font-size: 80px;
}

.skin-blue .treeview-menu > li.active > a {
    color: #fff;
}

.NewDesignStyleBlock .form-row .row {
    margin-bottom: 10px;
}

    .NewDesignStyleBlock .form-row .row .form-control {
        border-color: #c5c5c5;
        border-radius: 6px;
    }

        .NewDesignStyleBlock .form-row .row .form-control:focus {
            border-color: #6c3 !important;
            outline: 0;
            box-shadow: 0 0 4px 2px #abe391;
        }


.box-header {
    color: #444;
    display: block;
    padding: 10px;
    position: relative;
    display: inline-block;
    font-size: 18px;
    margin: 0;
    line-height: 1;
    width: 100%;
}

.WhiteBox {
    background-color: #fff;
    /*float: left;*/
    /*width: 98%;*/
    margin: 4px 0% !important;
}

    .WhiteBox .box-header {
        border-bottom: 1px solid #f4f4f4;
        width: 100%;
        margin-bottom: 6px;
    }

.GreenBoder {
    border-top: 4px solid #00a65a !important;
}

.RightLabel label {
    text-align: right;
    width: 100%;
}

.PaddingTopLabel label {
    padding-top: 6px;
}

.main-header .logo-mini {
    color: #434c4b;
    font-weight: bold;
    letter-spacing: 1px;
}

    .main-header .logo-mini b {
        color: #66cc33;
    }

/*#divTableData {
    background-color: #eee !important;
}*/


#divOuterTableData {
    padding: 2px !important;
    margin: 0px 0;
    border-radius: 2px;
    border: none !important;
    float: left !important;
    width: 100% !important;
}

    #divOuterTableData .HeadingTr {
        background-color: #fff !important;
    }

.WhiteBox #divOuterTableData {
    margin: 4px 0px !important;
}


#divTableData {
    padding: 2px !important;
    margin: 0px 0;
    border-radius: 2px;
    border: none !important;
    float: left !important;
    width: 100% !important;
}

    #divTableData .HeadingTr {
        background-color: #fff !important;
    }

.WhiteBox #divTableData {
    margin: 4px 0px !important;
}

.modal .bg-primary {
    color: #fff;
    /*background-color: #66cc33 !important;*/
    background-color: #3c8dbc !important;
}

.table.dataTable tbody tr.active td, .table.dataTable tbody tr.active th,
.table.dataTable tbody tr td, .table.dataTable tbody tr th, .table.dataTable tr th {
    word-break: break-word;
    text-overflow: ellipsis;
    overflow: hidden;
}

.WhiteBox .HalfBlock {
    width: 50%;
    float: left;
}

.WhiteBox .CenterBlock80 {
    width: 80%;
    margin: 10px auto;
    float: none;
}

.WhiteBox .MarginZero {
    margin: 0;
}

.MonthYearBlock .Width40 {
    width: 40% !important;
}

.MonthYearBlock .Width70 {
    width: 70% !important;
}

.form-group {
    margin-bottom: 4px !important;
}

.IconImgStyle {
    width: 16px;
}

.ThemeBtnStyle {
    background-color: #66cc33;
    color: #fff;
    transition: all .6s ease-out;
}

    .ThemeBtnStyle:hover {
        background-color: #151d20;
        color: #fff;
        transition: all .6s ease-out;
    }


.FloatLeft {
    float: left;
}

.MarginRight10 {
    margin-right: 10px;
}

.MapBlock {
    height: 550px;
    width: 100%;
    float: left;
}

.mapSplitDetail {
    float: left;
    width: 70%;
}

.Width30 {
    float: left;
    margin: 0 0 0 1%;
    padding: 0;
    width: 29%;
}


.HistoryViewBlock {
    float: left;
    width: 100%;
    border: 1px solid silver;
    margin: 16px 0;
    border-radius: 2px;
    position: relative;
}

    .HistoryViewBlock h4 {
        background-color: #222d32;
        text-align: center;
        margin: 0;
        padding: 2px;
        color: #fff;
        font-size: 15px;
        letter-spacing: 0.5px;
        line-height: 30px;
    }

    .HistoryViewBlock .HisttoryTime {
        float: left;
        width: 100%;
        padding: 6px;
        font-size: 14px;
    }

    .HistoryViewBlock .HisttoryTime {
        border-top: 1px solid silver;
    }

    .HistoryViewBlock .HisttoryRoute {
        float: left;
        width: 100%;
        padding: 6px;
        font-size: 14px;
    }

.ThemeBtnStyle input {
    color: #555;
    font-size: 12px;
    border-radius: 2px;
    border: none;
}

.btn-group-sm > .btn, .btn-sm {
    padding: 4px 8px;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 3px;
    color: #444;
    background-color: #fff;
}

.WhiteBox .table.dataTable tbody tr.active th > a, .WhiteBox .table.dataTable tbody tr.active td > a {
    color: #3c8dbc;
}

.PaddingTop10 {
    padding-top: 10px;
}

.table-striped.dataTable tbody tr.active:nth-child(odd) td, .table-striped.dataTable tbody tr.active:nth-child(odd) th {
    background-color: transparent;
}

.table-striped > tbody > tr:hover, .table-striped > tbody > tr:hover td {
    background-color: #e6e6e6 !important;
}

.table-striped > tbody > tr:nth-of-type(even), .table-striped.dataTable tbody tr.active:nth-child(even) {
    background-color: #fff;
    color: #000;
}

    .table-striped > tbody > tr:nth-of-type(even) td, .table-striped.dataTable tbody tr.active:nth-child(even) td {
        background-color: #fff;
        color: #000;
    }

.table-striped > tbody > tr:nth-of-type(odd) {
    color: #000;
}

.table-bordered > thead > tr > th, .table-bordered > tbody > tr > th, .table-bordered > tfoot > tr > th, .table-bordered > thead > tr > td, .table-bordered > tbody > tr > td, .table-bordered > tfoot > tr > td {
    color: #000;
}

.FromToStyle {
}

    .FromToStyle input {
        font-size: 14px;
        max-width: 190px;
    }

    .FromToStyle .btn {
    }

.CollapseExpandBlock {
}

    .CollapseExpandBlock table tr td {
        padding: 6px;
        line-height: 20px;
        vertical-align: top;
        font-size: 16px;
    }

    .CollapseExpandBlock .btn {
        background-color: #151d20;
        border-color: #151d20;
        width: 100%;
        color: #fff;
    }

    .CollapseExpandBlock .HistoryViewBlock {
        float: left;
        width: 100%;
        border: none;
        margin: 5px 0;
        border-radius: 2px;
    }

    .CollapseExpandBlock #dvHistoryDetails {
        border: 1px solid silver;
        clear: both;
        float: left;
        height: 58vh;
        overflow-y: scroll;
        overflow-x: hidden;
    }

    .CollapseExpandBlock .RFIDViewBlock {
        float: left;
        width: 100%;
        border: none;
        margin: 5px 0;
        border-radius: 2px;
    }

    .CollapseExpandBlock #dvRFIDHistoryDetails {
        border: 1px solid silver;
        clear: both;
        float: left;
        height: 40vh;
        overflow-y: scroll;
        overflow-x: hidden;
    }

.HistoryViewBlock .HisttoryTime {
    border-top: none;
    background-color: #fff;
}


#dvRFIDHistoryDetails span {
    float: left;
    width: 100%;
    font-size: 11px;
    padding: 6px 2px;
    font-family: arial;
}


















@media only screen and (min-width:300px) and (max-width:1199px) {
    .DataComingPage {
        border: none;
    }

        .DataComingPage .row {
            margin: 6px 0;
            border: 1px solid silver;
        }

            .DataComingPage .row + .row {
                border-top: 1px solid silver;
                padding-bottom: 6px;
            }

            .DataComingPage .row label {
                float: none;
                width: 45%;
                background-color: transparent !important;
                color: #333;
                font-size: 12px;
            }

        .DataComingPage .col-lg-2 {
            border-top: 1px solid #E2E7EB;
        }

        .DataComingPage .row .DataValueBlock {
            color: #333;
            float: right;
            width: 50%;
            font-size: 12px;
        }

    #dvtblStaff .col-lg-6, #dvtblStaff .col-lg-2 {
        padding: 0 !important;
        float: left;
        width: 100%;
    }

    #dvtblStaff .row .col-lg-2 {
        border-top: 1px solid silver;
        border-left: none;
    }

    .content-wrapper .content {
        /*background-color: rgba(0, 0, 0, 0.4);*/
        height: 100%;
        color: #fff;
    }

        .content-wrapper .content .LabelBlackReposive {
            color: #000;
        }

            .content-wrapper .content .LabelBlackReposive input, .content-wrapper .content .LabelBlackReposive select {
                max-width: 70%;
            }

            .content-wrapper .content .LabelBlackReposive input, .content-wrapper .content .LabelBlackReposive select, .content-wrapper .content .LabelBlackReposive textarea {
                max-width: 75% !important;
            }

            .content-wrapper .content .LabelBlackReposive .Width75 {
                width: 75%;
            }

                .content-wrapper .content .LabelBlackReposive .Width75 .modal-footer {
                    width: 75%;
                }

                .content-wrapper .content .LabelBlackReposive .Width75 textarea {
                    max-width: 100% !important;
                }

                .content-wrapper .content .LabelBlackReposive .Width75 input {
                    max-width: 86% !important;
                }

    #modal_ClassAdmissionFee .modal-footer {
        width: 75%;
    }

    .content-wrapper .content .FeeStructureResposive label {
        color: #000;
    }

    .content-wrapper .content .FeeStructureResposive .col-lg-4 {
        width: 40%;
        float: left;
    }

    .content-wrapper .content .FeeStructureResposive .col-lg-8 {
        width: 60%;
        float: left;
    }

    .content-wrapper .content .ClassFeeResponsive label {
        color: #000;
    }

    .content-wrapper .content .ClassFeeResponsive .Width75 {
        width: 75%;
    }

        .content-wrapper .content .ClassFeeResponsive .Width75 .modal-footer {
            width: 75%;
        }

    .content-wrapper .content .ClassFeeResponsive .modal-footer {
        width: 75%;
    }

    .content-wrapper .content .ClassFeeResponsive .Width75 textarea {
        max-width: 100% !important;
    }

    .content-wrapper .content .ClassFeeResponsive .Width75 input {
        max-width: 86% !important;
    }

    .content-wrapper .content .ClassFeeResponsive .ClassFeeStructureResponsive .row .col-lg-3.w2 {
        width: 50%;
        float: left;
    }

    .content-wrapper .content .ClassFeeResponsive .ClassFeeStructureResponsive {
        width: 75%;
    }

    .PopupDesign700 .box-body .col-md-6, .PopupDesign700 .box-body .HalfBlock {
        width: 50%;
        float: left;
    }

    .WhiteBox .box-body label {
        color: #333;
    }

    .WhiteBox .box-body label {
        text-align: left;
    }

    .MonthYearBlock .col-lg-2, .MonthYearBlock .col-lg-3 {
        padding-left: 0px !important;
        width: 18%;
        float: left;
        display: block;
    }

    .MonthYearBlock select {
        width: 86% !important;
    }

    .MonthYearBlock .Width40 {
        width: 86% !important;
    }
}

@media only screen and (min-width:300px) and (max-width:699px) {
    .StaffAssignedClasses .nav-stacked li {
        width: 100%;
        float: left;
    }
    .main-header .logo .logo-lg {
        display: block;
        height: 100%;
    }
        .main-header .logo .logo-lg img {
            width: auto !important;
            padding-top: 0 !important;
            height: 100%;
        }
        .MonthYearHeader .exampleInputEmail1 {
        float: left;
    }

    .MonthYearHeader .ui-formwizard-button.pull-right {
        float: left !important;
        margin: 0 9%;
    }

    .HomeEnquiryForm input, select, textarea {
        max-width: 100%;
    }

    .StaffInnerBlock table tr th {
        font-weight: bold;
        color: #333;
    }

    div#divTableData, #dvclassFeeList {
        overflow: auto;
    }

    .StaffInnerBlock table tr th, .StaffInnerBlock table tr td {
        text-align: center;
        font-weight: normal;
        font-size: 12px;
        border-color: #ddd;
        color: #333;
    }

    .ColorPatten {
        float: left;
        margin-top: 0px;
        margin-bottom: 8px;
        color: #333;
    }

    .StudentInnerBlock table tr th, .StudentInnerBlock table tr th + th, .StudentInnerBlock table tr td, .StudentInnerBlock table tr td + td {
        text-align: left;
        padding-left: 4px;
        color: #333;
    }

    .content-wrapper .content .ClassFeeResponsive .ClassFeeStructureResponsive {
        width: 100%;
    }

    .content-wrapper .content .ClassFeeResponsive input, .content-wrapper .content .ClassFeeResponsive select, .content-wrapper .content .ClassFeeResponsive textarea {
        max-width: 100%;
    }
}

@media only screen and (min-width:1200px) and (max-width:3333333333333333333333333px) {
    .DataComingPage .row + .row label {
        display: none;
    }

    #divTableData {
        float: left;
        width: 100%;
        padding: 0 2px;
    }
}


.MonthYearBlock {
    padding-left: 26px;
}

    .MonthYearBlock .col-lg-5, .MonthYearBlock .col-lg-4, .MonthYearBlock .col-lg-3 {
        padding: 2px 6px;
    }

    .MonthYearBlock label {
        float: left;
        padding-right: 6px;
        padding-top: 6px;
        width: auto;
    }

    .MonthYearBlock select {
        width: 60%;
        padding: 2px;
    }




@media only screen and (min-width:300px) and (max-width:767px) {
    .MonthYearBlock {
    }

        .MonthYearBlock .col-lg-9, .MonthYearBlock .col-lg-3 {
            float: left;
            width: 100%;
        }


        .MonthYearBlock #dvClass label {
            float: left;
            width: 20%;
            font-size: 14px;
        }

        .MonthYearBlock #dvClass label {
            float: left;
            width: 20%;
            font-size: 14px;
        }

        .MonthYearBlock select {
            width: 54% !important;
            padding: 2px;
        }

        .MonthYearBlock #routebtn {
            float: left;
            margin: 0;
        }

        .MonthYearBlock .ThemeBtnStyle {
            float: right !important;
            margin: 0 0 0 4px !important;
            padding: 0 1px 1px 4px;
            width: auto !important;
        }

    .FromToStyle .btn span {
        display: none;
    }

    .FromToStyle {
        font-size: 14px;
    }

    div#dvHistorySelect {
        padding-top: 8px;
        float: left;
        width: 100%;
    }
}

@media only screen and (min-width:768px) and (max-width:1200px) {
    .MonthYearBlock {
    }

        .MonthYearBlock .col-lg-9 {
            float: left;
            width: 70% !important;
        }

        .MonthYearBlock .col-lg-3 {
            float: left;
            width: 30% !important;
        }

        .MonthYearBlock #dvClass label {
            float: left;
            width: 20%;
            font-size: 14px;
        }

        .MonthYearBlock #dvClass label {
            float: left;
            width: 20%;
            font-size: 14px;
        }

        .MonthYearBlock select {
            width: 50% !important;
            padding: 2px;
        }

        .MonthYearBlock #routebtn {
            float: left;
            margin: 0;
        }

        .MonthYearBlock .ThemeBtnStyle {
            float: right !important;
            margin: 3% !important;
            width: auto !important;
        }




    @media only screen and (min-width:300px) and (max-width:479px) {
        .register-box {
            width: 300px !important;
            margin: 7% auto;
            margin-top: 7%;
            margin-top: 3%;
        }
    }

    @media only screen and (min-width:300px) and (max-width:369px) {
        .StaffAttendenceBlock, .ClassAttendenceBlock {
            width: 100% !important;
        }

        .MonthYearBlock label {
            float: left;
            padding-right: 6px;
            padding-top: 6px;
            width: 76px;
        }

        .MonthYearBlock select {
            width: 60%;
            padding: 2px;
        }

        .MonthYearBlock .btn {
            width: 92px;
            letter-spacing: 0.5px;
            margin-left: 0px;
        }

        .MonthYearHeader .btn-group-sm {
            margin-top: -34px;
        }
    }

    @media only screen and (min-width:370px) and (max-width:549px) {
        .StaffAttendenceBlock, .ClassAttendenceBlock {
            width: 100% !important;
        }

        .MonthYearBlock label {
            float: left;
            padding-right: 6px;
            padding-top: 6px;
            width: 76px;
        }

        .MonthYearBlock select {
            width: 60%;
            padding: 2px;
        }

        .MonthYearBlock .btn {
            width: 92px;
            letter-spacing: 0.5px;
            margin-left: 76px;
        }

        .MonthYearHeader .btn-group-sm {
            margin-top: -34px;
        }

        #dvtblStaff_wrapper .col-sm-6 {
            width: 50%;
            float: left;
        }
    }

    @media only screen and (min-width:550px) and (max-width:1200px) {

        .MonthYearBlock label {
            float: left;
            padding-right: 6px;
            padding-top: 6px;
            width: 76px;
        }

        .MonthYearBlock select {
            width: 60%;
            padding: 2px;
        }

        .MonthYearBlock .btn {
            width: 92px;
            letter-spacing: 0.5px;
            margin-left: 76px;
        }

        .MonthYearHeader .btn-group-sm {
            margin-top: -106px;
        }

        #dvtblStaff_wrapper .col-sm-6 {
            width: 50%;
            float: left;
        }
    }
    /*thead{
    background-color: blue;
    background: linear-gradient(#3c8dbc,lightblue);
    color: white;
}*/



    /************************ 24 Oct 2017 **********************/
    table tr.active {
        background-color: #fff !important;
        background: transparent !important;
        color: #333 !important;
    }

    .table-striped.dataTable tbody tr.active:nth-child(2n+1) td, .table-striped.dataTable tbody tr.active:nth-child(2n+1) th {
        background-color: #f1f3f5 !important;
    }

    table tbody tr:hover {
        background-color: #aacce8 !important;
    }

    .table.dataTable tbody tr.active th > a, .table.dataTable tbody tr.active td > a {
        color: #333 !important;
    }

    .content-header {
        position: relative;
        padding: 0 !important;
    }

    .box {
        position: relative;
        border-radius: 3px;
        background: #ffffff;
        border-top: none !important;
        margin-bottom: 20px;
        width: 100%;
        box-shadow: 0 1px 1px rgba(0,0,0,0.1);
    }

    .content {
        min-height: 250px;
        padding: 4px !important;
        margin-right: auto;
        margin-left: auto;
        padding-left: 15px;
        padding-right: 15px;
    }



    table thead {
        background: rgba(73,155,234,1) !important;
        background: -moz-linear-gradient(top, rgba(73,155,234,1) 0%, rgba(32,124,229,1) 100%) !important;
        background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(73,155,234,1)), color-stop(100%, rgba(32,124,229,1))) !important;
        background: -webkit-linear-gradient(top, rgba(73,155,234,1) 0%, rgba(32,124,229,1) 100%) !important;
        background: -o-linear-gradient(top, rgba(73,155,234,1) 0%, rgba(32,124,229,1) 100%) !important;
        background: -ms-linear-gradient(top, rgba(73,155,234,1) 0%, rgba(32,124,229,1) 100%) !important;
        background: linear-gradient(to bottom, rgba(73,155,234,1) 0%, rgba(32,124,229,1) 100%) !important;
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#499bea', endColorstr='#207ce5', GradientType=0 ) !important;
    }

        table thead th {
            color: #fff !important;
        }

            table thead th:hover, table thead:hover, table thead th.active, table thead.active {
                color: #fff !important;
                background: rgba(73,155,234,1) !important;
                background: -moz-linear-gradient(top, rgba(73,155,234,1) 0%, rgba(32,124,229,1) 100%) !important;
                background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(73,155,234,1)), color-stop(100%, rgba(32,124,229,1))) !important;
                background: -webkit-linear-gradient(top, rgba(73,155,234,1) 0%, rgba(32,124,229,1) 100%) !important;
                background: -o-linear-gradient(top, rgba(73,155,234,1) 0%, rgba(32,124,229,1) 100%) !important;
                background: -ms-linear-gradient(top, rgba(73,155,234,1) 0%, rgba(32,124,229,1) 100%) !important;
                background: linear-gradient(to bottom, rgba(73,155,234,1) 0%, rgba(32,124,229,1) 100%) !important;
                filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#499bea', endColorstr='#207ce5', GradientType=0 ) !important;
            }

    /*
.icon-exam::before {
    content: "\e604";
}
.treeview a .glyphicon, .sidebar-mini.sidebar-collapse .sidebar-menu > li > a > .glyphicon {
    display:block !important;
}
.treeview a  {
float:left !important;
min-height: 40px;
}
.treeview a .glyphicon {
float:left !important;
}
.sidebar-menu > li {
   
    width: 100% !important;
    float: left;
}
.skin-blue .sidebar-menu > li > a {
    
    width: 100%;
}
.sidebar-menu > li ul li  {
   
    width: 100% !important;
    float: left;
}
.skin-blue .sidebar-menu > li > a {
    
    width: 100%;
}*/
}

/**************************** 09 Sep. 2020 ********************/
.navbar .LogoBlock {
    width: 180px;
}
.navbar .LogoBlock.navbar-brand
{
    
    height: 52px !important;
    padding: 0 15px !important;
    background-color: #fff !important;
}

.navbar-default .navbar-header .LogoBlock.navbar-brand {
    background-color: #fff !important;
}
.navbar .LogoBlock.navbar-brand img {
    width:88% !important
}
.navbar-default .navbar-nav > li > a:hover {
    color: #777;
    background-color: #434c4b;
    color: #fff;
}

.navbar-default .navbar-nav > li > a.active {
    color: #777;
    background-color: #7ac143;
    color: #fff;
}
/*.DefaultImageBg {
    background-image: url(Images/default_image.jpg);
    background-repeat: no-repeat;
    background-position: right;
    background-size: auto 100%;
  
}*/
.DefaultImageBg #imgOrgLogo {
    width: 120px;
    float: right;
    background-image: url(Images/default_image.jpg);
    background-repeat: no-repeat;
    height: 120px;
    background-size: 80px;
    background-position: center;
}

.AddressHeightFixed textarea {
    height: 80px;
    resize: none;
    width: 100%;
}

.FloatRight {
    float: right;
}

.MarginTop6 {
    margin-top: 6px;
}


.navbar-nav .LightGreenBtn {
    background-color: #2a2a2a;
    display: inline-flex;
    flex-flow: column;
    vertical-align: top;
    border-radius: 4px;
    padding: 6px 10px;
    margin: 6px 6px 6px 6px;
    float: left;
    width: 100%;
    height: 100%;
    color: #fff !important;
    background: linear-gradient(36deg, transparent 30%, #7ac143 1em ), linear-gradient(to top, #434c4b 20%, #434c4b 20%, #434c4b 40%, #434c4b 40%, #434c4b 60%, #434c4b 60%, #434c4b 80%, #434c4b 80%);
    transition: all .6s ease-out;
}

    .navbar-nav .LightGreenBtn:hover {
        background-color: transparent;
        border-color: #434c4b;
        border-radius: 4px;
        padding: 6px 10px;
        margin: 6px 6px 6px 6px;
        float: left;
        color: #434c4b;
        transition: all .6s ease-out;
    }

.PaddingRight12 {
    padding-right: 12px;
}

.register-page .has-feedback .form-control {
    padding-right: 42.5px;
    width: 100% !important;
    max-width: 98%;
    padding: 20px 4%;
    border-radius: 6px;
    transition: all .4s ease;
    letter-spacing: 0.4px;
}

/*****************************************/
.carousel-inner > .item > a > img, .carousel-inner > .item > img, .img-responsive, .thumbnail a > img, .thumbnail > img {
    display: block;
    max-width: 100%;
    min-height: 517px;
}

.ReportTableBlock {
    width: 100%;
}

.Width33 {
    width: 33%;
}

.HomePage {
}

    .HomePage h1 {
        color: #454d4c;
        font-weight: 600;
        text-align: center;
    }

        .HomePage h1 span {
            color: #7ac143;
        }

    .HomePage h3 {
        text-align: center;
    }

.RelativePostion {
    position: relative;
}

.HomeEnquiryForm {
    position: absolute;
    top: 12%;
    width: 340px;
    right: 6%;
    background-color: #7ac143;
    border-radius: 4px;
}

    .HomeEnquiryForm h3 {
        color: #fff;
        border-bottom: 1px solid #454d4c;
        text-align: center;
        width: 90%;
        margin: 16px auto;
        padding-bottom: 10px;
    }

    .HomeEnquiryForm form {
        width: 90%;
        float: left;
        margin: 4px 5%;
    }

    .HomeEnquiryForm input {
        width: 100%;
        margin-bottom: 6px;
        padding: 6px;
        letter-spacing: 0.5px;
    }

::placeholder {
    color: #454d4c;
    opacity: 0.5;
}

.HomeEnquiryForm textarea {
    width: 100%;
    margin-bottom: 6px;
    border-radius: 2px;
    padding: 6px;
    letter-spacing: 0.5px;
    height: 66px;
    resize: none;
    font: Arial;
}

.HomeEnquiryForm button[type="submit"] {
    background-color: #454d4c;
    color: #fff;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border: none;
    width: 100%;
    border-radius: 2px;
    font-size: 16px;
    margin-bottom: 10px;
    transition: all .4s ease;
    border: 1px solid transparent;
    box-shadow: 2px 2px 4px 0 #454d4c;
}

    .HomeEnquiryForm button[type="submit"]:hover {
        transition: all .4s ease;
        background-color: transparent;
        width: 100%;
        border: 1px solid #fff;
        color: #fff;
        letter-spacing: 1.5px;
        box-shadow: 2px 2px 4px 0 #fff;
    }



.PaddingSection {
    padding: 48px 0 16px !important;
}

.PaddingZero {
    padding: 0;
}



/********************** ProcuctList **************************/

.ProcuctList {
    padding: 26px 0;
    background-color: #f8f8f8;
    border-top: 1px solid silver;
}

.MarginTop26 {
    margin-top: 26px;
}

.ProcuctListBlock {
    float: left;
    width: 90%;
    text-align: center;
    height: 226px;
    border: 3px dashed #fff;
    margin: 5%;
    background-color: #454d4c;
    color: #fff;
    cursor: crosshair;
    transition: all .6s ease-out;
}

.ProcuctListBlockBlackColor {
    background-color: #212121;
}

.ProcuctListBlock .fa {
    font-size: 50px;
    margin: 18px 0;
    height: 50px;
}

.ProcuctListBlock h4 {
    font-size: 26px;
    width: 80%;
    margin: 0 auto;
    line-height: 34px;
}

.ProcuctListBlock:hover {
    float: left;
    width: 90%;
    text-align: center;
    height: 226px;
    border: 3px dashed #fff;
    margin: 5%;
    background-color: #7ac143;
    color: #fff;
    cursor: crosshair;
    transition: all .6s ease-out;
}
/********************** About **************************/

.AboutPageDesign {
    padding: 13px 0 48px;
}

    .AboutPageDesign h2 {
        color: #333;
        text-align: center;
        font-size: 46px;
        font-weight: bold;
        letter-spacing: 1px;
        text-transform: uppercase;
        padding-bottom: 30px;
        font-family: 'RalewayRegular';
    }

    .AboutPageDesign hr {
        background-color: #333;
        border-color: #333;
        max-width: 100px;
    }

    .AboutPageDesign p {
        font-size: 18px;
        line-height: 38px;
        color: #666;
        font-family: 'RalewayRegular';
        font-weight: normal;
        letter-spacing: 0.5px;
        margin-top: 38px;
    }


/********************* ImgBtnEffect **********************/
.ImgBtnEffect {
    position: relative;
    border-radius: 4px;
    overflow: hidden;
    float: left;
    vertical-align: middle;
    text-align: center;
    margin-bottom: 30px;
    background-color: #333;
}

    .ImgBtnEffect img {
        opacity: 0.8;
        height: 230px;
    }

    .ImgBtnEffect h1 {
        position: absolute;
        top: 30%;
        color: #fff;
        width: 100%;
        text-align: center;
        text-shadow: 0 0 20px black;
    }

.OverEffect {
    position: absolute;
    background-color: rgba(0, 0, 0, 0.7);
    z-index: 10;
    top: 100%;
    width: 100%;
    height: 100%;
    transition: all .6s ease-out;
}

.ImgBtnEffect:hover .OverEffect {
    transition: all .6s ease-out;
    top: 0;
}

.OverEffect h3 {
    color: #fff;
    font-weight: 300;
    letter-spacing: 0.5px;
    line-height: 40px;
    padding: 40px;
}
/************************* ContactSectionBlock ********************/
.pdfIcon {
    /* background-image: url(../Content/Images/Icons/pdf_icon.png);
    width: 24px;
    height: 24px;*/
    border: none;
    background-position: center;
    background-repeat: no-repeat;
    background-color: transparent;
    font-size: 26px;
    transition: all 1s ease-out;
    float: right;
    margin-right: 6px;
}

    .pdfIcon .fa {
        color: red;
    }

    .pdfIcon:hover {
        rotate: 360deg;
        transition: all 3s ease-out;
    }

.excelIcon {
    /* background-image: url(../Content/Images/Icons/pdf_icon.png);
    width: 24px;
    height: 24px;*/
    border: none;
    background-position: center;
    background-repeat: no-repeat;
    background-color: transparent;
    font-size: 26px;
    transition: all 1s ease-out;
    float: right;
    margin-right: 6px;
}

    .excelIcon .fa {
        /*color: red;*/
    }

    .excelIcon:hover {
        rotate: 360deg;
        transition: all 3s ease-out;
    }


.ContactDiv {
    background-color: #f9f9f9;
    float: left;
    width: 100%;
}

.ContactSectionBlock {
    background-color: #f8f8f8;
}

.MapDiv {
    float: left;
    width: 100%;
    height: 560px;
}

.FindUsDiv {
    background-color: /*#00aff0*/ #7ac143;
    color: #fff;
    float: left;
    width: 100%;
    color: #fff;
    padding: 24px 24px 170px 24px;
}

    .FindUsDiv .PaddingContact {
        padding-top: 52px;
    }

    .FindUsDiv h3, .EnquiryDiv h3 {
        color: #333;
        text-transform: uppercase;
        font-weight: bold;
        font-size: 28px;
        letter-spacing: 0.5px;
        margin: 0 0 20px 0;
    }

    .FindUsDiv h3 {
        color: #fff;
    }

    .FindUsDiv h4 {
        color: #005677;
        font-weight: bold;
    }

    .FindUsDiv p {
    }

    .FindUsDiv a {
        color: #dfdfdf;
        text-decoration: none;
    }

        .FindUsDiv a:hover {
            color: #fff;
            text-decoration: none;
        }

.EnquiryDiv {
    padding: 24px;
    float: left;
    width: 100%;
}

    .EnquiryDiv .mandatory {
        float: right;
    }

    .EnquiryDiv input[type="text"], .EnquiryDiv input[type="email"] {
        width: 100%;
        padding: 8px;
        margin-bottom: 10px;
        border-radius: 2px;
        border: 1px solid #b6b6b6;
        color: #333;
        max-width: 100%;
    }

        .EnquiryDiv input[type="text"]:focus, .EnquiryDiv input[type="email"]:focus, .EnquiryDiv textarea:focus {
            border: 1px solid #ff8000;
        }

    .EnquiryDiv textarea {
        width: 100%;
        padding: 8px;
        margin-bottom: 10px;
        border-radius: 2px;
        border: 1px solid #b6b6b6;
        color: #333;
        resize: none;
        height: 120px;
        max-width: 100%;
    }

    .EnquiryDiv .SubmitBtn {
        background-color: #ff8000;
        color: #fff;
        border: 1px solid #ff8000;
        font-size: 18px;
        padding: 10px 30px;
        float: right;
        border-radius: 2px;
        transition: transform .25s linear;
    }

        .EnquiryDiv .SubmitBtn:hover {
            background-color: transparent;
            color: #ff8000;
            border: 1px solid #ff8000;
            transition: transform .25s linear;
        }




.ContactFormStyle {
    background-color: #fff;
    padding: 8px 24px;
    margin-top: -100px;
    box-shadow: 0 0px 4px #000;
    margin-bottom: 32px;
    width: 600px;
    margin-left: auto;
    margin-right: auto;
    border-radius: 2px;
}

    .ContactFormStyle h3 {
        color: #333;
        font-family: 'Roboto-Light' !important;
        letter-spacing: 0.5px;
    }

    .ContactFormStyle .mandatory {
        color: #f55448;
        float: right;
        font-size: 12px;
        padding: 4px 0;
    }

    .ContactFormStyle .form-control {
        height: auto;
        margin-bottom: 6px;
        padding: 10px 12px;
    }

    .ContactFormStyle textarea {
        resize: none;
    }

    .ContactFormStyle .SubmitBtn {
        background-color: #00afef;
        border: 1px solid #00afef;
        color: #fff;
        padding: 6px 24px;
        border-radius: 4px;
        font-size: 14px;
        letter-spacing: 0.5px;
        text-transform: uppercase;
        transition: all 0.5s;
    }

        .ContactFormStyle .SubmitBtn:hover {
            background-color: #fff;
            border: 1px solid #333;
            color: #333;
            transition: all 0.5s;
        }


/******************************* ContactPersonBlock ******************************/

.ContactPersonBlock {
}

    .ContactPersonBlock .ImgBlock {
        transition: all 0.5s;
        border-radius: 50%;
        overflow: hidden;
        box-shadow: 0 0 2px 0 #333;
        margin: 10px 0;
    }

        .ContactPersonBlock .ImgBlock:hover {
            transition: all 0.5s;
            transform: scale(1.06); /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */
        }

        .ContactPersonBlock .ImgBlock img {
        }

    .ContactPersonBlock .LocationContact {
        text-align: center;
        text-transform: uppercase;
        letter-spacing: 1px;
        background-color: maroon;
        width: 100%;
        position: relative;
        border-radius: 4px;
        padding: 14px 4px;
        line-height: 0;
        font-weight: bold;
        font-size: 17px;
        margin-bottom: 18px;
    }

        .ContactPersonBlock .LocationContact .fa {
            position: absolute;
            color: maroon;
            left: 46%;
            right: auto;
            bottom: -18px;
            font-size: 30px;
        }

    .ContactPersonBlock .NameBlock {
        text-align: center;
        font-weight: 500;
        font-size: 20px;
        padding: 6px 0;
        letter-spacing: 0.5px;
        font-family: 'RalewayRegular';
    }

    .ContactPersonBlock .PhoneBlock {
        text-align: center;
        font-weight: 500;
        font-size: 17px;
        padding: 6px 0;
    }

        .ContactPersonBlock .PhoneBlock a {
            background-color: #333;
            color: #dfdfdf;
            padding: 4px 8px;
            border-radius: 38px;
            transition: all 0.5s;
        }

            .ContactPersonBlock .PhoneBlock a:hover {
                background-color: #fff;
                color: #333;
                transition: all 0.5s;
            }

    .ContactPersonBlock .AdressBlock {
        text-align: center;
        font-weight: 400;
        font-size: 16px;
        padding: 10px 2px;
        font-family: arial;
        text-transform: capitalize;
        line-height: 26px;
        letter-spacing: 0.3px;
    }
/***************************** ImgPopupStyle **************************/

.ImgPopupStyle {
}

    .ImgPopupStyle .close {
        position: absolute;
        right: -15px;
        z-index: 2;
        background-color: #333;
        color: #fff;
        opacity: 1;
        font-weight: 500;
        padding: 10px;
        border-radius: 39px;
        width: 40px;
        height: 40px;
        top: -20px;
        transition: all 0.5s;
    }

        .ImgPopupStyle .close:hover {
            background-color: #000;
            transition: all 0.5s;
        }

    .ImgPopupStyle .modal-body {
        padding: 0;
        position: relative;
    }

        .ImgPopupStyle .modal-body p {
            padding: 10px;
            margin: 0;
            min-height: 200px;
        }

.ImgPopupStyle {
}

.ImgPopupStyle {
}

.CodeImgBlock {
    min-height: 100%;
    background-size: cover;
    background-repeat: no-repeat;
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    background-position: center;
}

#Manage .CodeImgBlock {
    background-image: url("Images/Manage.jpg");
}

#Attendance .CodeImgBlock {
    background-image: url("Images/Attendance.jpg");
}

#Account .CodeImgBlock {
    background-image: url("Images/Account.jpg");
}

#Transport .CodeImgBlock {
    background-image: url("Images/Transport.jpg");
}

#SkyBooks .CodeImgBlock {
    background-image: url("Images/Books.jpg");
}

#Announcement .CodeImgBlock {
    background-image: url("Images/Announcement.jpg");
}


.autocomplete-items {
    width: 100% !important;
    cursor: pointer;
    padding: 1% !important;
    position: absolute;
    z-index: 1;
    background-color: #fff;
    box-shadow: 0px 0px 6px silver;
    border-radius: 3px;
}

    .autocomplete-items span {
        float: left;
        width: 100%;
        font-size: 13px;
        padding: 6px;
        font-family: arial;
    }

.autoitemOdd {
    background-color: #f0f0f0;
}

.autoitemEven {
    background-color: #fff;
}

.autohover:hover {
    background-color: lightgrey;
    color: #000;
    font-weight: 600;
}

.OverNormal .autohover:hover {
    background-color: lightgrey;
    color: #000;
    font-weight: normal !important;
}


.autohover {
    font-size: 15px;
    padding: 4px 0;
}



.StudentCompleteDetailStyle td {
    text-align: left;
    font-size: 14px;
    font-weight: 500;
    font-family: sans-serif !important;
    padding: 4px;
    color: #333;
}

.StudentCompleteDetailStyle b {
    font-weight: 700;
    text-align: right;
    width: 100%;
    float: left;
    font-size: 14px
}



.StudentPaymentDetailStyle h4 {
    background-color: #f2f2f2;
    color: #333;
    padding: 8px;
    letter-spacing: 0.5px;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    margin: 0;
    font-family: sans-serif;
    font-weight: 500;
    font-size: 18px;
}

.StudentPaymentDetailStyle td {
    font-size: 14px;
    font-weight: 500;
    font-family: sans-serif;
}

    .StudentPaymentDetailStyle td label {
        font-size: 14px;
        font-weight: 500;
        font-family: sans-serif;
    }

.StudentPaymentDetailStyle textarea {
    width: 100%;
    max-width: initial;
    min-height: 70px;
    border-color: grey;
    border-radius: 4px;
}

.StudentPaymentDetailStyle input[type="radio"] {
}

.StudentPaymentDetailStyle .form-control {
    border-color: #c5c5c5;
    border-radius: 6px;
}

    .StudentPaymentDetailStyle .form-control:focus {
        border-color: #6c3 !important;
        outline: 0;
        box-shadow: 0 0 4px 2px #abe391;
    }

.StudentPaymentBorder {
    border: 1px solid silver;
    border-radius: 4px;
    min-height: 206px;
}


.StudentPaymentModeDetail td {
    text-align: right;
}


.DefinitionOrangeDiv {
    float: right;
    margin-right: 4px;
    margin-top: 4px;
    position: relative;
    width: 322px;
    padding: 0 16px;
}

    .DefinitionOrangeDiv .DefinitionDiv {
        float: left;
        width: 100%;
    }

    .DefinitionOrangeDiv .DefinitionTitle {
        background-color: #f2f2f2;
        color: #333;
        float: left;
        font-size: 14px;
        padding: 6px 10px;
    }

    .DefinitionOrangeDiv textarea {
        border: 1px solid #C0C0C0;
        border-radius: 0;
        color: #333333;
        float: left;
        font-family: arial;
        font-size: 11px;
        padding: 1%;
        width: 98%;
        letter-spacing: 0;
        min-height: 60px;
    }






.StudentFinalPaymentDetail .FinalSessionPaymentList {
    margin: 0 !important;
    border: none !important;
    box-shadow: none !important;
    font-family: 'Source Sans Pro';
    font-weight: 500 !important;
    font-size: 16px;
    color: #333 !important;
}

.StudentFinalPaymentDetail td {
    text-align: right;
}


.StudentFinalPaymentDetail h4 {
    background-color: #f2f2f2;
    color: #333;
    padding: 8px;
    letter-spacing: 0.5px;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    margin: 0;
    font-family: sans-serif;
    font-weight: 500;
    font-size: 18px;
}

.StudentFinalPaymentDetail input[type=checkbox], .StudentFinalPaymentDetail input[type=radio] {
    margin: 4px 10px 0 0;
    margin-top: 1px\9;
    line-height: normal;
}

.StudentFinalPaymentDetail td label {
    font-size: 14px;
    font-weight: 500;
    font-family: sans-serif;
    text-align: left;
    float: left;
    margin-left: 26%;
}




.StudentSubmitedPayments .FinalSessionPaymentList {
    margin: 0 !important;
    border: none !important;
    box-shadow: none !important;
    font-family: 'Source Sans Pro';
    font-weight: 500 !important;
    font-size: 16px;
    color: #333 !important;
}

.StudentSubmitedPayments td {
    text-align: right;
}

.StudentSubmitedPayments h4 {
    background-color: #f2f2f2;
    color: #333;
    text-align-last: center;
    padding: 8px;
    letter-spacing: 0.5px;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    margin: 0;
    font-family: sans-serif;
    font-weight: 500;
    font-size: 18px;
}

.StudentSubmitedPayments input[type=checkbox], .StudentSubmitedPayments input[type=radio] {
    margin: 4px 10px 0 0;
    margin-top: 1px\9;
    line-height: normal;
}

.StudentSubmitedPayments td label {
    font-size: 14px;
    font-weight: 500;
    font-family: sans-serif;
    text-align: left;
    float: left;
    margin-left: 26%;
}

/*.row {
    background-color: #f2f2f2;
    color: #333;
    padding: 8px;
    letter-spacing: 0.5px;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    margin: 0;
    font-family: sans-serif;
    font-weight: 500;
    font-size: 18px;
}*/

.StudentAlreadyPaymentDeposit {
    min-height: auto !important;
    width: 100%
}
    /*

.StudentAlreadyPaymentDeposit table td {
    font-size: 14px;
    font-weight: 500;
    font-family: sans-serif;
    text-align: left;
    float: left;
    margin-left: 26%;
    color:red;
}*/

    .StudentAlreadyPaymentDeposit .FinalSessionPaymentList {
        margin: 0 !important;
        border: none !important;
        box-shadow: none !important;
        font-family: 'Source Sans Pro';
        font-weight: 500 !important;
        font-size: 16px;
        color: #333 !important;
        width: 99% !important;
    }


    .StudentAlreadyPaymentDeposit .FinalSessionPaymentList {
        margin: 0 !important;
        border: none !important;
        box-shadow: none !important;
        font-family: 'Source Sans Pro';
        font-weight: 500 !important;
        font-size: 16px;
        color: #333 !important;
    }

    .StudentAlreadyPaymentDeposit td {
        text-align: right;
    }


.StudentAlreadySubmitedPayments h4 {
    background-color: #f2f2f2;
    color: #333;
    text-align: center;
    padding: 8px;
    letter-spacing: 0.5px;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    margin: 0;
    font-family: sans-serif;
    font-weight: 500;
    font-size: 18px;
}


.StudentAlreadySubmitedPayments input[type=checkbox], .StudentAlreadyPaymentDeposit input[type=radio] {
    margin: 4px 10px 0 0;
    margin-top: 1px\9;
    line-height: normal;
}

.StudentAlreadySubmitedPayments label {
    font-size: 18px;
    font-weight: 500;
    font-family: sans-serif;
    text-align: left;
    float: left;
    width: 100%;
}

.StudentAlreadySubmitedPayments ul {
    margin: 0 0 0 0;
    padding: 0;
    float: left;
    display: inline-block;
    width: 25%;
}

    .StudentAlreadySubmitedPayments ul li {
        margin: 0 10px 0 0;
        display: inline-block;
    }


.TimerCountDownDisplay {
    text-align: center;
    float: left;
    color: #fff;
    font-size: 14px;
    letter-spacing: 0.5px;
    width: 98%;
    background-color: red;
    margin: 0px 0% 2px 1%;
    line-height: normal;
    height: 20px;
}


/*#modal_DeleteSubmitedPayments .form-control {
    width: 100% !important;
    max-width: 98%;
    padding: 20px 4%;
    border-radius: 50px;
    transition: all .4s ease;
    letter-spacing: 0.4px;
}

#modal_DeleteSubmitedPayments .exampleInputEmail1 {
    padding-top: 15px;
}*/


@media only screen and (min-width:300px) and (max-width:639px) {
    .ContactPersonBlock {
    }

        .ContactPersonBlock .ImgBlock {
            margin: 22px 0;
        }

    .register-box {
        width: 80%;
    }
}

@media only screen and (min-width:640px) and (max-width:1200px) {
    .ContactPersonBlock {
    }

        .ContactPersonBlock .col-lg-3 {
            width: 48%;
            float: left;
            margin: 1%;
        }

        .ContactPersonBlock .ImgBlock {
            margin: 22px 0;
        }

    .ProcuctList .col-lg-4 {
        width: 48%;
        float: left;
        margin: 1%;
    }

    .register-box {
        width: 600px;
        margin: 7% auto;
        margin-top: 3%;
    }
}

.AddAccessPopup .PaddingTopLevel label {
    float: left;
}

.AddAccessPopup .PaddingTopLevel input [type="checkbox"] {
    margin: 8px;
    float: left;
}

.ImgApplyLeaveBorder {
    border: 1px solid silver;
    border-radius: 4px;
    padding: 6px;
}

    .ImgApplyLeaveBorder img {
        float: left;
        width: 100%;
        height: auto !important;
        min-width: 50% !important;
        min-height: auto !important;
    }

.NoteHeaderBox {
    color: #444;
    display: block;
    padding: 10px !important;
    position: relative;
    display: inline-block;
    font-size: 14px;
    margin: 0;
    line-height: 1;
    width: auto;
    background-color: lightgrey;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    font-weight: 500;
    font-family: sans-serif;
}

.GreenBg {
    background-color: #008000;
    color: #fff;
}

.GreenLogBg {
    background-color: #008000;
    font-size: 9px !important;
    color: #fff;
}

.YellowBg {
    background-color: #ffff00;
    color: #000000;
}

.PurpleBg {
    background-color: #800080;
    color: #fff;
}

.OrangeBg {
    background-color: #ffa500;
    color: #fff;
}

.BlueBg {
    background-color: #0000ff;
    color: #fff;
}

.RedBg {
    background-color: #ff0000;
    color: #fff;
}

.AttendanceBoxColor {
    width: 25px;
    float: left;
    height: 16px;
    border-radius: 0px;
    margin: 3px 4px 0 0;
    padding: 2px 0;
    margin: 8px 0 0 0 !IMPORTANT;
    float: left !important;
}
/*table.table-bordered.dataTable {
        border-collapse: separate !important;
        background-color: #fafafa;
        color: #333;
        border-color: grey !important;
    }*/