html, body {
    font-family: "Roboto","Helvetica", "Arial", sans-serif !important;
    font-size: 13px;
    margin: 0;
    padding: 0;
    font-weight: 400;
    /*background:#e4e4e4;*/
    height: 100%;
    width: 100%;
    overflow-y: hidden;
}


.pageBody {
    height: calc(100% - 55px);
    padding-bottom: 30px;
    overflow-y: auto;
}

.font-bold {
    font-weight:bold;
}

.required {
    margin: 0 3px;
    color: #ff3b3b;
}

.order_body {
	flex: 1;
    overflow-y: auto;
}

/* INPUT FILDS CSS */

.group {
    margin-bottom: 10px;
}

.group > div > label {
    margin-bottom: 0px;
    height: 20px;
    line-height: 12px;
    font-size: 12px;
    font-weight: 400;
    display: -webkit-box;  display: -webkit-flex; display: -ms-flexbox;  display: flex;
    -webkit-box-align: center;  -webkit-align-items: center;  -ms-flex-align: center;  align-items: center;
    justify-content: flex-end;
    text-align: right;
}



.loaderfix {
    background-color: rgba(255, 255, 255, 0.32);
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 99;
    top: 0;
    left: 0;
}

.loader {
    position: absolute;
    left: 50%;
    top: 50%;
    z-index: 1;
    width: 150px;
    height: 150px;
    margin: -75px 0 0 -55px;
    border: 16px solid rgba(183, 183, 183, .75);
    border-radius: 50%;
    border-top: 16px solid #095aa5;
    width: 120px;
    height: 120px;
    -webkit-animation: spin 2s linear infinite;
    animation: spin 2s linear infinite;
    z-index: 999999999;
}

.loadersmall {
    position: absolute;
    left: 50%;
    top: 50%;
    margin: -25px 0 0 -25px;
    border: 5px solid #f3f3f3;
    -webkit-animation: spin 1s linear infinite;
    animation: spin 1s linear infinite;
    border-top: 5px solid #555;
    border-radius: 50%;
    width: 50px;
    height: 50px;
}


@-webkit-keyframes spin {
  0% {
        -webkit-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

/*dx grid*/
.dx-datagrid-content .dx-datagrid-table.dx-datagrid-table-fixed {
    font-size: 12px;
}
.dx-datagrid-headers .dx-texteditor-input, .dx-datagrid-rowsview .dx-texteditor-input {
    padding: 2px 5px !important;
    min-height: 22px !important;
}
.dx-header-row {
    font-size: 13px;
    padding: 2px 5px !important;
}
.dx-datagrid .dx-row > td {
    padding: 2px 5px !important;
}
.dx-datagrid-header-panel {
     /*min-height: 22px !important;
     max-height: 37px !important;*/
}
.dx-datagrid-group-panel  .dx-group-panel-message {
    padding:1px !important;
}
.dx-header-row {
    padding-bottom:3px!important;
}

.informer {
    height: 70px;
    width: 130px;
    text-align: center;
    background: #2A507C url("https://js.devexpress.com/Demos/WidgetsGallery/JSDemos/images/icons/arrow.png") no-repeat 100% 50%;
}

/*dx grid*/


/*bootstrap*/


.form-control {
    /*padding: 2px 5px !important;
    height: 23px !important;
    font-size: 12px !important;
    border-radius: 0px !important;
    border: 1px solid var(--ThimColorActiveBg) !important;
    box-shadow: none !important;*/
    height: 30px;
    border-radius: 0;
    padding: 2px 5px;
}


.btn {
    padding: 8px 15px;
    font-size: 13px;
    margin: 0 2px;
    /*border-radius: 0;*/
}


.btn.btn-cancel {
    margin:5px;
}

    .btn.active, .btn:active, .btn:focus {
        -webkit-box-shadow: none;
        box-shadow: none;
        outline: none;
    }

label {
    font-weight: 500;
}




.modal-dialog.modal-300
{
    width:300px !important;
}

.modal-dialog.modal-400
{
    width:400px;
}

.modal-dialog.modal-600
{
    width:600px;
}
.modal-dialog.modal-800
{
    width:800px;
}
.modal-dialog.modal-1000
{
    width:1000px;
}
.modal-dialog.modal-1200
{
    width:1200px;
}

.modal-dialog.modal-full
{
   width:80%;
   height:400px;
}


/*bootstrap*/



/* CALENDER */

    .calenderBox + .dropdown-menu {
        position: absolute;
        top: 100%;
        left: 50% !important;
        -ms-transform: translateX(-50%);
        -webkit-transform: translateX(-50%);
        -moz-transform: translateX(-50%);
        -o-transform: translateX(-50%);
        transform: translateX(-50%);
        z-index: 1000;
        display: none;
        float: left;
        min-width: 160px;
        padding: 5px;
        font-size: 14px;
        text-align: left;
        list-style: none;
        background-color: #f7f7f7;
        -webkit-background-clip: padding-box;
        background-clip: padding-box;
        border: 1px solid #ccc;
        border: 1px solid rgba(0,0,0,.15);
        border-radius: 4px;
        -webkit-box-shadow: 0 6px 12px rgba(0,0,0,.175);
        box-shadow: 0 6px 12px rgba(0,0,0,.175);
    }


    .calenderBox + .dropdown-menu table {
        outline: none;
    }

    .calenderBox + .dropdown-menu table thead tr th .btn-default {
        background-color: #03A9F4;
        height: 30px;
        color: #fff !important;
        text-shadow: none;
        width: 100%;
    }

    .calenderBox + .dropdown-menu table thead tr th .btn {
        margin: 0;
        border-radius: 0;
    }

    .calenderBox + .dropdown-menu table thead tr th .btn-default:hover {
        background-color: #0493d4 !important;
    }


    .calenderBox + .dropdown-menu table thead tr:last-child th small {
        font-size: 85%;
        color: #3f3f3f;
        padding: 5px;
        display: block;
        background-color: #fff;
    }

    .calenderBox + .dropdown-menu table .text-muted {
        color: #c4cbe0;
    }

    .calenderBox + .dropdown-menu table tbody tr td .btn-default {
        color: #0493d4 !important;
        font-weight: 400;
        border-radius: 0;
    }
    .calenderBox + .dropdown-menu table tbody tr td .btn {
        margin-bottom:0;
    }

    .calenderBox + .dropdown-menu table tbody tr td .btn-default .text-info {
        color: #026901;
    }

    .calenderBox + .dropdown-menu table tbody tr td .btn-default:hover {
        color: #319065 !important;
        background-color: #fff !important;
        font-weight: 500;
        border: 1px solid #ccc;
    }


    .calenderBox + .dropdown-menu table tbody tr td > .btn-info.active, .calenderBox + .dropdown-menu table tbody tr td > .btn-default.active, .calenderBox + .dropdown-menu table tbody tr td .btn-default.active .text-info {
        color: #fff !important;
        background-color: #03a9f4 !important;
        font-weight: 700;
        text-shadow: none;
        border-radius: 0;
        -webkit-box-shadow: none;
        box-shadow: none;
    }

/* CALENDER */


.icon {
    position: absolute;
    right: 16px;
    top: 0px;
    padding: 0px 10px;
    color: #fff;
    background-color: #20aafb;
    height: 30px;
    line-height: 30px;
    text-decoration: none;
    display: block;
    z-index: 6;
    border-radius: 0 4px 4px 0;
}

    .icon:hover {
        text-decoration: none;
        cursor: pointer;
    }

fieldset[disabled] .form-control + a.icon, fieldset[disabled] .form-control + a:hover {
    background-color: rgba(32, 170, 251, 0.51);
    cursor: not-allowed;
}




.table.table_cust_width {
}

.table.table_cust_width > tbody > tr > td, .table.table_cust_width > tbody > tr > th, .table.table_cust_width > tfoot > tr > td, .table.table_cust_width > tfoot > tr > th, .table.table_cust_width > thead > tr > td, .table.table_cust_width > thead > tr > th {
	min-width: 100px;
	vertical-align:middle;
}
.table.table_cust_width > tbody > tr > td .form-control {
    height: 20px;
    border-radius: 0;
    padding: 1px;
    font-size: 12px;
}





/*New Login*/



.logBody {
    display: -webkit-box;  display: -webkit-flex; display: -ms-flexbox;  display: flex;
    height: 100%;
    -webkit-box-pack:center;  -webkit-justify-content: center;  -ms-flex-pack:center;  justify-content: center;
    -webkit-box-align: center;  -webkit-align-items: center;  -ms-flex-align: center;  align-items: center;
    background-image: url(../../../Images/LoginImg/login_bg.jpg);
    background-repeat: no-repeat;
    background-position: bottom center;
    background-size: cover;
}


.login_area {
    display: -webkit-box;  display: -webkit-flex; display: -ms-flexbox;  display: flex;
    -webkit-box-orient: horizontal;  -webkit-box-direction: normal; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row;
    border-radius:10px;
    /*height: 65%;*/
    max-height: 400px;
    -webkit-box-shadow: 1px 2px 10px  rgba(99,99,99,0.64);
    -moz-box-shadow: 1px 2px 10px  rgba(99,99,99,0.64);
    box-shadow: 1px 2px 10px rgba(99,99,99,0.64);
    position: relative;
}

@media (min-width: 768px) {
    .login_area {
        width: 400px;
    }


    .product_list .product_details .form-inline{
        display: flex;
        /*justify-content: space-between;*/
    }
        
    .product_list .product_details .form-inline .form-group{
        display: flex;
        align-items: center;
        margin-right:5px;
    }
        .product_list .product_details .form-inline .form-group > label {
            margin-right:6px;
            font-weight:normal;
        }
        .product_list .product_details .form-inline .form-group .form-control {
            width: inherit;
            max-width: 65px;
                padding: 2px 8px;
        }

        .order_head .form-group {
            margin-bottom: 5px;
            margin-top: 5px;
            margin-left: 0;
            margin-right: 0;
            display: flex;
            align-items: center !important;
            justify-content: start !important;
        }
            .order_head .form-group .control-label {
                text-align: left;
            padding-top: 0;
            width: 10%;
            }


    .order_head .form-group > div {
        margin:0 5px;
    }


    .sec-cusmr {
        width: 90%;
    }

    .product_list, .order_area_list.order_area_list_product .product_list {
        width:100%;
    }

    .order_area_list {
        display: unset;
    }





}




.login_areaLeft {
    position: relative;
    padding: 10px 30px;
    width: 60%;
    /*height: 100%;*/
    background-image: url(../../Images/Background-Vector-Graphic.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    display: -webkit-box;  display: -webkit-flex; display: -ms-flexbox;  display: flex;
    -webkit-box-orient: vertical;  -webkit-box-direction: normal;  -webkit-flex-direction: column; -ms-flex-direction: column;   flex-direction: column;
    align-items: flex-start;
    -webkit-box-pack:center;  -webkit-justify-content: center;  -ms-flex-pack:center;  justify-content: center;
    color: #fff;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-bottom-left-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-bottomleft: 10px;
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;

    display:none;
}
.areaLeft_dataContent {
    width: 100%;
    
}

.areaLeft_dataContent h2 small{
    color:#fff;
    line-height: 30px;
    width: 100%;
    display: block;
        font-size: 72%;
    font-family:'Georgia', 'sans-serif';
        letter-spacing: 1px;
}

.login_areaRight {
    /*position: relative;*/
    width: 100%;
    padding:25px;
    display: -webkit-box;  display: -webkit-flex; display: -ms-flexbox;  display: flex;
    -webkit-box-align: center;  -webkit-align-items: center;  -ms-flex-align: center;  align-items: center;
    background-color: #fff;
    -webkit-radius: 10px;
    -moz-topright: 10px;
    border-radius: 10px;
}
img.loginLogo {
    max-height: 52px;
    margin-bottom: 5px;
}
.areaRight_dataContent {
    width: 100%;
}

.areaRight_dataContent > a {
    display:block;
    text-align:center;
}

.areaLeft_dataContent h4 {
    font-size: 16px;
    color: #d2e1ff;
    font-weight: 600;
}
.areaRight_dataContent .form-control {
    border: none;
    background-color: transparent;
    border-bottom: solid 1px #ccc;    
    box-shadow: none;
    padding-left: 0px;
    color:#3f3f3f;
}
.areaRight_dataContent > span {
    font-size: 16px;
    font-weight: 700;
    color: #aaa;
    display:block;
}

.areaRight_dataContentHeading {
    margin-top: 5px;
    margin-bottom: 0px;
    padding-bottom: 5px;
    font-size: 16px;
    color:#000;
    /*border-bottom: solid 1px #f3f3f3;*/
    text-align:center;
}


.areaRight_dataContent .locationbox .form-control {
    border: solid 1px #ccc;
 }


.btn-Login {
    background-color: #4b93ff;
    color: #fff;
    min-width: 100px;
}
.btn-Login:hover {
    background-color: #3786ff;
    color: #fff;
}
.btn-Login + .btn {
    padding: 6px 0;
}

.footer-Content {
    position: absolute;
    bottom: -35px;
    left: 50%;
    -ms-transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
    font-size: 14px;
    color:#000;
    margin:0;

    width: 100%;
    text-align: center;
}

    .footer-Content a {
        color:#000;
        display:inline-block;
    }


.error_msg {
    position: absolute;
    top: 0;
    left: 0;
    padding: 15px 25px 5px;
    background-color: rgba(242, 222, 222, .9);
    margin: 10px;
    border-radius: 8px;
    /*-webkit-box-shadow: 0px 0px 6px rgba(99,99,99,0.64);
    -moz-box-shadow: 0px 0px 6px rgba(99,99,99,0.64);
    box-shadow: 0px 0px 6px rgba(99,99,99,0.64);*/
    width: calc(100% - 20px);
    text-align: center; color: #f00; font-weight: normal; text-shadow: none !important;word-break: break-word;
}


.error_msg button.close {
    width: 20px;
    padding: 0px;
    position: absolute;
    right: 5px;
    top: 3px;
    cursor:pointer;
}

    .error_msg button.close:focus {
        outline:none;
    }


    .product_list .product_details .form-inline .form-group.disc-btn label {
        font-size: 18px;
        margin-right: 0;
        margin-bottom: 0;
        padding: 5px;
        color: #095aa5;
    }
    .product_list .product_details .form-inline .form-group.disc-btn label:hover {
        cursor:pointer;
    }
    .product_list .product_details .form-inline .form-group.disc-btn label i {
        display:none;
    }
    .product_list .product_details .form-inline .form-group.disc-btn label i.activeplus {
        display:block;
    }
    .product_list .product_details .form-inline .form-group.disc-btn label i.activeminus {
        display: block;
    }
    .product_list .product_details .form-inline .form-group.disc-fild {
        display:none;
    }
    .product_list .product_details .form-inline .form-group.disc-fild.activeDisc {
        display:flex;
        transition: all .5s;
    }



/*Select Company*/
.main-login-div {
    width: 100%;
	background-color:#fff;
}
.select-company-area .comp_sel_hed h2{
	font-size: 18px;
	margin: 15px 0;
}
.select-company-area .comp_sel_hed.panel {
	padding: 0 15px;
	margin-bottom: 5px;
}
.login_area.select-company-area {
    width: 500px;
    max-height:500px;
}

.companytable .table {
    margin-bottom: 6px;
}

.select-company-table.table-fixed td, .select-company-table.table-fixed th {
	font-size:14px;
	width:100%;
}
.select-company-table.table-fixed th {
border-bottom:none;
background-color: #13519d;
color: #fff;
}
.select-company-table.table-fixed tbody {
    display:block;
    min-height:30px;
    max-height:150px;
    overflow:auto;
    border: 1px solid #ccc;
}
.select-company-table.table-fixed thead, .select-company-table.table-fixed tbody tr {
    display:table;
    width:100%;
    table-layout:fixed;
}
.select-company-table.table-fixed tbody tr {
        border-bottom: 1px solid #ccc;
}
/*.select-company-table.table-fixed tbody tr:last-child {
        border-bottom: none;
}*/

.highlightrow {
	background-color:rgb(211 231 255);
}
.pointer {
	cursor:pointer;
}
@media (max-width: 767px) {
	.login_area.select-company-area {
		width: 90%;
	}
    .login_area.select-company-area .logFormArea .btn_area {
        display: flex;
        align-items: center;
        justify-content: space-between;
        flex-direction: column-reverse;
    }
    .login_area.select-company-area .logFormArea .btn_area a {
          width:100%;
          margin: 0 0 10px 0 !important;  
    }
    .areaRight_dataContent .locationbox .form-control {
        border: solid 1px #ccc;
        padding: 6px 5px;
        height:auto;
    }

    .areaRight_dataContent .locationbox select option:checked {
        background: rgba(0, 0, 0, 0.3);
        color: #fff;
    }

    .form-group {
        margin-bottom: 10px;
    }
}


/*Select Company*/



/*---------23092019--------------*/

/*.order_head {
	display: flex;
	width: 100%;
	flex-direction: row;
	justify-content: space-between;
}*/

.order_area_list {
    flex: 1;
    overflow-y: auto;
}

.order_area_list.order_area_list_cl_app {
    flex-wrap: inherit;
    display:block;
    padding:0;
}




.order_area {
    display: flex;
    flex-direction: column;
    height: 100%;
	/*padding:0 15px;*/
}


.order_head .form-group span.cust_name {		    
	font-size: 12px;
	width: 100%;
	text-align: right;
	display: flex;
	flex-direction: column;
	align-items: flex-end;
}

.order_head .form-group span.cust_name .cust_name_head {
		margin-bottom: 0;
		color: #8e8e8e;
		font-weight: 400;
}

.order_head .form-group .control-label {
    width: auto;
}

/*---------23092019-------------*/

/*---------24092019-------------*/



label.text_label {
    height: 32px;
	width:100%;
    padding: 5px 10px;
	margin-bottom:0;
    font-size: 14px;
	font-weight: 400;
    line-height: 1.42857143;
    color: #555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 0;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    -webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
}


.geo_loc {
	width:100%;
}
.geo_loc .form-group {
	margin-right:0;
	margin-left:0;
	margin-bottom: 5px;
}
.geo_loc .form-group.geo_fild {
	display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

.text_label_head {
	width:110px;
}

.geo_loc .form-group.geo_fild .btn {
    margin-bottom: 0;
}


/*---------24092019-------------*/

.logControl .row.mbl_area_btn > div button.btn, .login_area.select-company-area .logFormArea .btn_area a.btn-primary {
        background-color: #3d3f44;
        border: 1px solid #2b2d32;
}



















@media (max-width: 1440px) {
    /*.login_area {
        width: 54%;
    }*/    
}
@media (max-width: 1024px) {
    /*.login_area {
        width: 65%;
    }*/
}


@media (max-width: 992px) {
    /*.login_area {
        width: 90%;
    }*/

    


}



@media (max-width: 767px) {
    .login_area {
        -webkit-box-orient: vertical;  -webkit-box-direction: normal;  -webkit-flex-direction: column; -ms-flex-direction: column;   flex-direction: column;
        width: 90%;
        height: auto;
        max-height: unset;
    }
    .login_areaLeft {
        width: 100%;
        height: auto;
        padding: 20px 15px 10px;
        
        -moz-border-radius-bottomleft: unset;
        -webkit-border-bottom-left-radius: unset;
        border-bottom-left-radius: unset;
        -webkit-border-top-left-radius: 10px;
        -webkit-border-top-right-radius: 10px;
        -moz-border-radius-topleft: 10px;
        -moz-border-radius-topright: 10px;
        border-top-left-radius: 10px;
        border-top-right-radius: 10px;
    }


    .logControl .row.mbl_area_btn {
        display: flex;
        flex-direction: column-reverse;
    }
    .logControl .row.mbl_area_btn > div {
        width:100%;
    }
    .logControl .row.mbl_area_btn > div button.btn {
            width: 100%;
    }
    .logControl .row.mbl_area_btn > div .forgot > a {
        padding: 6px 10px;
        font-size: 13px;
        margin: 0 2px;
        border-radius: 0;
        color: #333;
        background-color: #fff;
        /*border: 1px solid #ccc;*/
        width: 100%;
        display: block;
        text-align: center;
        margin-bottom: 10px;
    }
    .logControl .row.mbl_area_btn > div .forgot > a.btn-blck {
        border: 1px solid #ccc;
    }
    .areaLeft_dataContent {
        width: 100%;
    }
    .areaLeft_dataContent h2 {
        margin-top: 0;
        font-size: 20px;
        margin-bottom:0;
    }
    .areaLeft_dataContent h2 small {
        display: block;
        font-size: 16px;
    }
    .login_areaRight {
        width: 100%;
        padding: 15px 8px;
        /*-moz-border-radius-topright: unset;;
        -webkit-border-top-right-radius: unset;
        border-top-right-radius: unset; 
        -webkit-border-bottom-right-radius: 10px;
        -webkit-border-bottom-left-radius: 10px;
        -moz-border-radius-bottomright: 10px;
        -moz-border-radius-bottomleft: 10px;
        border-bottom-right-radius: 10px;
        border-bottom-left-radius: 10px;*/
    }

    .footer-Content {
        width: 100%;
        bottom: -35px;
        font-size: 12px;
        text-align: center;
    }

    .product_list .product_details .form-inline{
        display: flex;
        /*justify-content: space-between;*/
    }

    .product_list .product_details .form-inline .form-group{
        display: flex;
        align-items: center;
        margin-right:5px;
    }

    .login_area .login_areaRight {
        padding: 20px;
    }

    .login_area.select-company-area .login_areaRight {
        padding: 15px 10px;
    }
    .table-responsive > .table > tbody > tr > td, .table-responsive > .table > tbody > tr > th, .table-responsive > .table > tfoot > tr > td, .table-responsive > .table > tfoot > tr > th, .table-responsive > .table > thead > tr > td, .table-responsive > .table > thead > tr > th {
        white-space:normal;
    }



}






input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
/*border: none;*/
-webkit-text-fill-color: #777;
-webkit-box-shadow: 0 0 0px 100px #fff inset !important;
transition: background-color 0s ease-in-out 0s !important;
}



/*New Login*/
























.Parsonal_body_area {
    height: 100%;
    background-image: url(../../../Images/LoginImg/login-School-db-bg.jpg);
    background-color: #fff;
    background-repeat: repeat;
    background-position: top center;
    background-size: 100%;
    /*max-width: 60%;*/
    margin: 0 auto;
}



.page-headText {
    /*border-bottom: solid 1px #e8e8e8;*/
    padding-top: 5px;
    padding-bottom: 5px;
}

    .page-headText > * {
        margin: 0;
        font-size: 20px;
        text-align: center;
    }


.mainContainArea {
    /*height: calc(100% - 85px);*/
    height: 100%;
    overflow-y: auto;
}



/*.mainContainArea {
    height: calc(100% - 40px);
}*/
.sec_left > *, .sec_right > * {
    width: 100%;
}
/**/


.mainContainArea > div {
    height: 100%;
}

        .mainContainArea > div > div > section {
            /*max-height: calc(100% - 20px);*/
            overflow-y: auto;
            overflow-x: hidden;
            padding: 0 15px;
            width: 100%;
        }

        .mainContainArea > div > div.withForm > section {
            width: 100% !important;
            height: calc(100% - 5px);
            overflow: hidden;
            padding: 0;
        }

.sec-mid.withForm {
    display: -webkit-box;  display: -webkit-flex; display: -ms-flexbox;  display: flex;
    /*align-items:center;*/
    -webkit-box-pack:center;  -webkit-justify-content: center;  -ms-flex-pack:center;  justify-content: center;
        padding-left: 0;
    padding-right: 0;
}

.mainFooter {
    height: 34px;
    color: var(--ThimTxtDrkColor);
    background-color: #fff;
    border-top: solid 1px var(--ThimColorBorderColor);
    /*display: -webkit-box;  display: -webkit-flex; display: -ms-flexbox;  display: flex;
    flex-wrap: nowrap;*/
    display:flex;
    justify-content: flex-end;
    align-items: center;
}

    .mainFooter p {
        margin: 0;
    }

    .mainFooter .footer-copyrights {
        line-height: 34px;
        float: right;
    }

    .mainFooter .footer-logo {
        padding: 4px;
        float: right;
    }

        .mainFooter .footer-logo img {
            max-height: 25px;
        }





.slide-gallery {
    padding:5px 15px;
    overflow-y: auto;
    height: 100%;
}


.mainFooter {
    height: 34px;
    color: var(--ThimTxtDrkColor);
    background-color: rgba(255, 255, 255, 0.4);
    border-top: solid 1px #e2e2e2;
    /*display: -webkit-box;  display: -webkit-flex; display: -ms-flexbox;  display: flex;
    -webkit-box-orient: vertical;  -webkit-box-direction: normal;  -webkit-flex-direction: column; -ms-flex-direction: column;   flex-direction: column;
    -webkit-box-pack:center;  -webkit-justify-content: center;  -ms-flex-pack:center;  justify-content: center;*/
}

    .mainFooter p {
        margin: 0;
    }

/* >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> menu >>>>>>>>>>>>>>>>>>>>>>>>>>>*/

.fseTopBar {
    position: relative;
    border-bottom: solid 1px #e2e2e2;
    background-color: rgba(255, 255, 255, 0.40);
    padding:0 15px;
}
/*.fseTopBar > div:first-child{height: 20px; background-color: #f3f3f3; border-bottom: solid 1px #e8c5da;}*/
.contactBar a {
    color: #333;
}

.contactBar a {
    color: #a7a7a7;
    margin: 0 15px;
}

    .contactBar a:hover {
        color: #7a7a7a;
        margin: 0 15px;
    }

    .contactBar a .fa {
        margin-right: 5px;
    }

.fseTopBar > div {
    height: 50px;
    padding: 0;
}


.mainMenuBtn {
    float: left;
    width: 60px;
    height: 100%;
    text-align: center;
    font-size: 20px;
    color: var(--mainMenuTxtColor);
    transition: all .4s;
}

    .mainMenuBtn:hover, .mainMenuBtn:focus {
        color: #20aafb;
    }

    .mainMenuBtn .fa {
        line-height: 40px;
    }

.menu_bar {
    display:none;
}

ul.main-menu-btn {
        margin:0;
        padding:0;
    }
    ul.main-menu-btn li {
        margin:0;
        padding:0;
        list-style:none;
    }




.logoBox {
    height: 100%;
    width: calc(100% - 50px);
    padding: 5px 0;
    float: left;
    overflow: hidden;
    display: -webkit-box;  display: -webkit-flex; display: -ms-flexbox;  display: flex;
    -webkit-box-align: center;  -webkit-align-items: center;  -ms-flex-align: center;  align-items: center;
    max-width: 150px;
}

.maniLogo {
    width: auto;
    height: auto;
    max-height: 100%;
    max-width: 100%;
}

.logoBox > * {
    line-height: inherit;
}

span.mainLogo {
    display: block;
    width: 100%;
    height: 45px;
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 100%;
}

.noPad {
    padding: 0;
}

.menuLinks {
    padding: 0;
    margin: 0;
    height: 100%;
    list-style-type: none;
    display: inline-block;
    float: right; /*background-color: var(--ThimColor);*/
    position: relative;
    min-width: 50%;
    /*padding-left: 60px;*/
}

    .menuLinks:before {
        content: '';
        position: absolute;
        top: 0;
        left: -60px;
        width: 0;
        height: 0; /*border-bottom: 60px solid var(--ThimColor); border-left: 60px solid transparent;*/
    }

    .menuLinks li {
        float: right;
        padding: 0;
    }

    .menuLinks li:first-child { /*border-right: solid 0px transparent; margin-right: 15px;*/
    }

    .menuLinks li > a {
        display: block;
        padding: 0px 15px;
        color: #737373;
        height: 50px;
        line-height: 25px;
        transition: all .3s;
        font-size: 16px;
        cursor: pointer;
        position: relative;
    }

    .menuLinks li > a:hover, .menuLinks li > a:focus {
        text-decoration: none;
        color: #20aafb;
        outline: none;
    }

    .menuLinks li > a .fa, .menuLinks li > a span {
        line-height: 40px;
        vertical-align: middle;
    }

    .menuLinks li > a.viewChange {
        display: none;
    }


    .menuLinks a .fa {
        height: 25px;
        line-height: 24px!important;
        width: 25px;
        text-align: center;
        font-size: 13px;
        border-radius: 50%;
        background-color: #737373;
        color: var(--ThimWhite);
        -ms-transform: translateY(50%);
        -webkit-transform: translateY(50%);
        -moz-transform: translateY(50%);
        -o-transform: translateY(50%);
        transform: translateY(50%);
        margin: 0px -10px;
    }

    .menuLinks a:hover .fa-bell {
        background-color: #20aafb;
    }



    .menuLinks li > a span.default-pic {
        /* background-color: #fb8510; */
        border-radius: 50%;
        height: 28px;
        width: 28px;
        display: inline-block;
        line-height: 29px !important;
        text-transform:uppercase;
        text-align: center;
        color: var(--ThimWhite);
        margin-top: 11px;
    }


    .logStatus i:first-child, .logStatusOpen i:first-child {
        color: transparent;
        width: 30px;
        height: 30px;
        border-radius: 50%;
        -ms-transform: translateY (50%);
        -webkit-transform: translateY (50%);
        -moz-transform: translateY (50%);
        -o-transform: translateY (50%);
        transform: translateY(50%);
        margin-top: -10px;
        background-color: var(--ThimWhite);
        text-align: center;
        border: solid 1px var(--ThimColorDrk);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: top center;
    }

    .logStatus:hover i:first-child, .logStatusOpe:hovern i:first-child {
        border: solid 1px var(--ThimColorActiveTxt);
    }



    .dropdown-menu.navbar-profile-area {
        right: 18px !important;
        top: 100%;
        left: unset;
        margin: 0;
        padding: 0;
        border: solid 1px #dcdcdc;
        -webkit-box-shadow: none;
        box-shadow: none;
        z-index: 20;
        border-radius: 0;
    }

    .navbar-profile-area li {
        float: unset;
        display: block;
    }

    .navbar-profile-area .navbar-profile {
        min-width: 315px;
        padding: 10px 15px 0px;
        padding-bottom: 0px;
    }


    .navbar-profile-area .navbar-profile-session {
        padding: 10px 0;
        border-top: solid 1px #dcdcdc;
        background-color: #f9f9f9;
    }

        .navbar-profile-area .navbar-profile-session .btn {
            border-radius: 0;
        }

    .navbar-profile-area .logPanelData {
        display: -webkit-box;  display: -webkit-flex; display: -ms-flexbox;  display: flex;
        -webkit-box-orient: horizontal;  -webkit-box-direction: normal; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row;
        align-items: self-start;
        padding: 5px;
        position: relative;
    }

    .navbar-profile-area .logPanelData .logPanelDataDetails {
        min-height: 120px;
    }

    .navbar-profile-area .logPanelData .logPanelDataDetails h5 {
        margin: 2px 0 5px;
    }

    .navbar-profile-area .logPanelData .logPanelDataDetails p {
        margin: 0;
        line-height: 20px;
    }

    .navbar-profile-area p.Last-Login {
        margin: 0;
        font-size: 10px;
        position: absolute;
        bottom: 0;
        right: 0;
        color: #a9a9a9;
        width: 100%;
        text-align: right;
        padding: 0 10px;
        background-color: #fff;
    }





/* notefication */


    .menuLinks li > a span.noteCount {
        display: inline-block;
        min-width: 20px;
        height: 20px;
        padding: 4px;
        font-size: 9px;
        font-weight: 700;
        line-height: 10px;
        color: #540303;
        text-align: center;
        white-space: nowrap;
        vertical-align: middle;
        background-color: #fbbcbc;
        border-radius: 10px;
        position: absolute;
        top: 2px;
        right: -8px;
        border: solid 2px #fff;
    }

    .notePanel {
        background-color: #f5f5f5;
        width: 100%;
        max-width: 425px;
        position: absolute;
        right: 0px;
        top: 51px;
        z-index: 1000;
        padding: 0 2px;
        max-height: 0px;
        overflow-y: auto;
    }

    .notePanel.active {
        max-height: 470px;
        animation-name: dropdown;
        animation-duration: .5s;
    }

    @-webkit-keyframes dropdown {
        0%   {max-height: 0px; overflow: hidden;}
        100% {max-height: 470px; overflow: auto;}
    }


    .notePanel.deActive {
        max-height: 0px;
        animation-name: putUp;
        animation-duration: .5s;
    }

    @-webkit-keyframes putUp {
        0%   {max-height: 470px; overflow: auto;}
        100% {max-height: 0px; overflow: hidden;}
    }







.notePanelHead {
    display: none;
}
.notePanelBody {
    background-color: #fbfbfb;
}

.notePanel_Item {
    margin-bottom: 2px;
    border-bottom: solid 1px #eaeaea;
}

.note_Item_Icon {
    background-color: #fbfbfb;
    width: 50px;
    height: 50px;
    display: inline-block;
    vertical-align: middle;
    font-size: 26px;
    line-height: 20px;
    text-align: center;
    margin-bottom: 0;
    border-color: #fefefe;
    color: #c3c3c3;
    margin: 3px 5px;
    box-shadow: inset 0px 0px 7px -2px #e6e6e6;
}

    .note_Item_Icon.iconfont:before {
        line-height:50px;
    }

.new .note_Item_Icon {
    color: #20aafb;
}


.note_Item_Date {
    width: calc(100% - 64px);
    height: 56px;
    display: inline-block;
    vertical-align: middle;
    padding: 3px 0px 12px;
    position: relative;
}

.note_Item_Head {
    margin: 0px 0px 2px;
    font-size: 12px;
    font-weight: 700;
    border-bottom: solid 1px #828282;
    padding-bottom: 1px;
    max-width: 100%;
    overflow: hidden;
    display: inline-block;
    color: #828282;
}
.note_Item_Body {
    display: block;
    font-size: 12px;
    color: #969696;
    height: 24px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 98%;
}

.timeNdateOf_post {
    font-size: 10px;
    position: absolute;
    right: 5px;
    bottom: 0;
    font-weight: 500;
    color: #9c9c9c;
}

.dateOf_post {
    color: #00798e;
}

.dateOf_post:after {
    content: ',';
    color: #00798e;
}





@media (max-width:767px) {
   
    .notePanel {
        top: 0px;
    }

        .notePanel.active {
            max-height: unset;
            height: calc(100% - 28px);
            animation-name: dropdown;
            animation-duration: .5s;
        }

        @-webkit-keyframes dropdown {
          0%   {height: 0; overflow: hidden;}
          100% {height: calc(100% - 28px); overflow: hidden;}
        }



.notePanel.deActive {
    max-height: unset;
    height: 0;
}

@-webkit-keyframes putUp {
    0%   {height: calc(100% - 28px); overflow: auto;}
    100% {height: 0px; overflow: hidden;}
}






.notePanelHead {
    display: block;
    background-color: #fff;
    padding: 0px 10px;
    height: 50px;
    line-height: 50px !important;
    border-bottom: solid 1px #e4e4e4;
}

.notePanelHead [class^="icon-"], .notePanelHead [class*=" icon-"] {
    line-height: 50px !important;
    margin-right: 15px;
}


.notePanelBody {
    max-height: calc(100% - 50px);
    overflow-y: auto;
}

.note_Item_Head {
    font-size: 11px;
    color: #292929;
}

}
/* notefication*/











.mainFooter .footer-copyrights {
    height: 34px;
    line-height: 34px;
    float: right;
    overflow: hidden;
    text-align: right;
}

.mainFooter .footer-logo {
    padding: 4px;
    float: right;
}

    .mainFooter .footer-logo img {
        max-height: 25px;
    }


.navbar-profile-area .logPanelData .logPanelDataDetails {
}

    .navbar-profile-area .logPanelData .logPanelDataDetails h5 {
        margin: 2px 0 5px;
    }

    .navbar-profile-area .logPanelData .logPanelDataDetails p {
        margin: 0;
        line-height: 20px;
    }




.parson-dashboard-area {
    padding: 0px 15px;
    height: 100%;
    overflow-y: auto;
}


.parson-container {
    /*display: -webkit-box;  display: -webkit-flex; display: -ms-flexbox;  display: flex;*/
    height: 100%;
    /*align-items: start;*/
    /*-webkit-box-pack:center;  -webkit-justify-content: center;  -ms-flex-pack:center;  justify-content: center;*/
    margin: 0px -15px;
    position: relative;
}


.dashboardOptions {
    height: calc(100% - 44px);
    display: -webkit-box;  display: -webkit-flex; display: -ms-flexbox;  display: flex;
    -webkit-box-align: center;  -webkit-align-items: center;  -ms-flex-align: center;  align-items: center;
    -webkit-box-pack:center;  -webkit-justify-content: center;  -ms-flex-pack:center;  justify-content: center;
}

.flex-container {
    display: -webkit-box;  display: -webkit-flex; display: -ms-flexbox;  display: flex;
    -webkit-flex-wrap: wrap;  -ms-flex-wrap: wrap;  flex-wrap: wrap;
    align-items: Start;
    -webkit-box-pack:center;  -webkit-justify-content: center;  -ms-flex-pack:center;  justify-content: center;
    width: 100%;
    max-height: 100%;
    overflow-y: auto;
    z-index: 5;
}

.parsonArticle {
    /*width: 82%;*/
    margin-bottom: 0;
    text-align: center;
    position: relative;
}

.parsonArticle .personal_page_header {
    padding-top: 5px;
    padding-bottom: 15px;
}
.parsonArticle p {
    position: absolute;
    top: calc(100% - 15px);
    left: 0;
    width: 100%;
    font-size: 11px;
    text-align: center;
    margin: 0;
}
.flex-container > div {
    width: 20%;
    margin: 15px;
    text-align: center;
    line-height: normal;
    font-size: 30px;
    padding: 15px;
    cursor: pointer;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.flex-container > div:hover {
    cursor: pointer;
}

.flex-container > div:hover .iconImage + a {
    text-decoration: underline;
}

.iconImage {
    display: block;
    height: 70px;
    width: 70px;
    margin: 0 auto;
    margin-bottom: 10px;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 40px 40px;
    background-color: #fff;
    border-radius: 50%;
    border: 1px solid #ccc;
}

    .iconImage + a {
        font-size: 15px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        color: #212121;
        font-weight: 500;
    }

.BackgroundXS {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    -webkit-filter: blur(15px);
    filter: blur(15px);
    background-image: url('/Images/school-girls.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: top center;
}




.flex-container > div:nth-of-type(n) .iconImage {
    border: 1px solid rgb(219, 153, 228);
}

.flex-container > div:nth-of-type(2n) .iconImage {
    border: 1px solid rgb(241, 141, 71);
}

.flex-container > div:nth-of-type(3n) .iconImage {
    border: 1px solid rgb(92, 97, 191);
}

.flex-container > div:nth-of-type(4n) .iconImage {
    border: 1px solid rgb(82, 173, 208);
}

.flex-container > div:nth-of-type(5n) .iconImage {
    border: 1px solid rgb(60, 171, 49);
}

.flex-container > div:nth-of-type(6n) .iconImage {
    border: 1px solid rgb(236, 192, 57);
}

.flex-container > div:nth-of-type(7n) .iconImage {
    border: 1px solid rgb(206, 73, 73);
}

.flex-container > div:nth-of-type(8n) .iconImage {
    border: 1px solid rgb(139, 195, 74);
}



.iconfont {
    display: block;
    height: 70px;
    width: 70px;
    margin: 0 auto;
    margin-bottom: 10px;
    /*background-repeat: no-repeat;
    background-position: center center;
    background-size: 40px 40px;*/
    background-color: #fff;
    border-radius: 50%;
    border: 1px solid #ccc;
}

    .iconfont:before {
        line-height: 70px;
    }

    .iconfont + a {
        font-size: 15px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        color: #212121;
        font-weight: 500;
    }



.flex-container > div:nth-of-type(n) .iconfont {
    border: 1px solid rgb(219, 153, 228);
    color: rgb(219, 153, 228);
}

.flex-container > div:nth-of-type(2n) .iconfont {
    border: 1px solid rgb(241, 141, 71);
    color: rgb(241, 141, 71);
}

.flex-container > div:nth-of-type(3n) .iconfont {
    border: 1px solid rgb(92, 97, 191);
    color: rgb(92, 97, 191);
}

.flex-container > div:nth-of-type(4n) .iconfont {
    border: 1px solid rgb(82, 173, 208);
    color: rgb(82, 173, 208);
}

.flex-container > div:nth-of-type(5n) .iconfont {
    border: 1px solid rgb(60, 171, 49);
    color: rgb(60, 171, 49);
}

.flex-container > div:nth-of-type(6n) .iconfont {
    border: 1px solid rgb(236, 192, 57);
    color: rgb(236, 178, 0);
}

.flex-container > div:nth-of-type(7n) .iconfont {
    border: 1px solid rgb(206, 73, 73);
    color: rgb(206, 73, 73);
}

.flex-container > div:nth-of-type(8n) .iconfont {
    border: 1px solid rgb(139, 195, 74);
    color: rgb(139, 195, 74);
}


.flex-container > div:nth-of-type(n) {
    background-color: rgba(219, 153, 228, .1);
    border: 1px solid rgb(219, 153, 228);
}

.flex-container > div:nth-of-type(2n) {
    background-color: rgba(241, 141, 71, .1);
    border: 1px solid rgb(241, 141, 71);
}

.flex-container > div:nth-of-type(3n) {
    background-color: rgba(92, 97, 191, .1);
    border: 1px solid rgb(92, 97, 191);
}

.flex-container > div:nth-of-type(4n) {
    background-color: rgba(82, 173, 208, .1);
    border: 1px solid rgb(82, 173, 208);
}

.flex-container > div:nth-of-type(5n) {
    background-color: rgba(60, 171, 49, .1);
    border: 1px solid rgb(60, 171, 49);
}

.flex-container > div:nth-of-type(6n) {
    background-color: rgba(236, 192, 57, .1);
    border: 1px solid rgb(236, 192, 57);
}

.flex-container > div:nth-of-type(7n) {
    background-color: rgba(206, 73, 73, .1);
    border: 1px solid rgb(206, 73, 73);
}

.flex-container > div:nth-of-type(8n) {
    background-color: rgba(139, 195, 74, .1);
    border: 1px solid rgb(139, 195, 74);
}






/* cliendHeaderMenuBox */


.cliendHeaderMenuBox ul {
    padding: 0;
    margin: 0;
    list-style-type: none;
    float: right;
}

    .cliendHeaderMenuBox ul li {
        display: inline-block;
    }

        .cliendHeaderMenuBox ul li a {
            display: block;
            height: 40px;
            min-width: 45px;
            padding: 0 15px;
            line-height: 40px;
            text-align: center;
        }

/* cliendHeaderMenuBox */

/*/  HHHHHHHHHHHHHHHHHHHH  MENU HHHHHHHHHHHHHHHHHHHHHHHHH /*/
.menuProfileBox {
    height: 250px;
    padding: 10px 0px;
    color: #fff;
}

.menuProfileImgBox {
    padding: 0px 0px 15px;
}

.menuProfileImg {
    width: 70px;
    height: 70px;
    display: block;
    background-color: #ccc;
    border-radius: 50%;
    margin: 0 auto;
}

.menuProfileImgBox + div {
    padding-right: 5px;
}




.slide_nav {
    position: absolute;
    bottom: 0;
    left: -100%;
    font-size: 13px;
    width: 100%;
    max-width: 270px;
    height: calc(100% - 41px);
    background-color: #3f3f3f;
    z-index: 7;
    overflow-x: hidden;
    overflow-y: auto;
    transition: all .5s;
}

    .slide_nav.open {
        transition: all .4s;
        left: 0;
        /*box-shadow: -1px 3px 12px 0px #3f3f3f;*/
        border-right: solid 1px #292929;
    }

    .slide_nav > ul {
        padding: 0;
        list-style-type: none;
        height: calc(100% - 25px);
        overflow-x: hidden;
        margin: 0;
    }

.menuRaper {
    height: calc(100% - 12px);
    overflow-x: hidden;
    overflow-y: auto;
}


.slide_nav > ul > li {
    padding: 0px;
    /* border-bottom: 1px solid var(--ThimColorBorderColor);
        */
}

.slide_nav > ul li.active {
}


.slide_nav > ul > li a {
    padding: 10px 10px;
    display: block;
    color: #fff;
    background-color: #3f3f3f;
    text-decoration: none;
    border-bottom: solid 1px #272727;
}


.slide_nav > ul li.active a {
    color: #fff;
    background-color: #353535;
    text-decoration: none;
}



.profImgBox {
    display: inline-block;
    width: 100%;
    min-width: 80px;
    min-height: 100px;
    position: relative;
    margin-bottom: 10px;
}

.img_contain > label {
    display: inline-block;
    width: 100px;
    height: 100px;
    min-height: 60px;
    background-color: rgba(255, 255, 255, .4);
    margin: 0;
    z-index: 0;
    color: var(--ThimColor);
    padding: 0 4px;
    position: absolute;
    opacity: 0;
    transition: all .3s;
    top: 0;
    left: 50%;
    -ms-transform: translateX(-50px);
    -webkit-transform: translateX(-50px);
    -moz-transform: translateX(-50px);
    -o-transform: translateX(-50px);
    transform: translateX(-50px);
    cursor: pointer;
}

    .img_contain > label:hover {
        opacity: 1;
    }

span.editProfPicBox.blah {
    height: 100px;
    width: 100px;
    display: block;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: top center;
    background-color: #e8e8e8;
    position: absolute;
    top: 0;
    left: 50%;
    -ms-transform: translateX(-50px);
    -webkit-transform: translateX(-50px);
    -moz-transform: translateX(-50px);
    -o-transform: translateX(-50px);
    transform: translateX(-50px);
    border: solid 4px var(--ThimWhite);
}

.profImgBox:hover span.editProfPicBox.blah {
    box-shadow: 0 0 4px var(--ThimColorActiveBg) !important;
}


.editProfPicBtn span {
    display: block;
    text-align: center;
    width: 100%;
    font-size: 13px;
    position: absolute;
    left: 0;
    bottom: 35%;
    padding: 0 10px;
    background-color: rgba(255,255,255, .9);
    color: #20aafb;
    text-decoration: underline;
    font-weight: 400;
}

    .editProfPicBtn span:hover {
        color: #000;
    }

.profDataBox {
    padding: 10px;
}

    .profDataBox > * {
        margin-bottom: 5px;
    }

.logPanelInner .row {
    position: relative;
}

.logPanelInner .logPanelData {
    display: -webkit-box;  display: -webkit-flex; display: -ms-flexbox;  display: flex;
    align-items: flex-start;
    padding: 5px 15px;
}

.logTime {
    position: absolute;
    right: 0;
    bottom: -4px;
    margin: 0;
}

.control_BtnS {
    padding: 6px 15px;
    border-top: solid 1px var(--ThimColorBorderColor);
    background-color: #f9f9f9;
}

    .control_BtnS a {
        float: left;
        margin-bottom: 0;
        background-color: var(--ThimWhite);
        border: 1px solid #e6e6e6;
        font-size: 13px;
    }

        .control_BtnS a:hover, .control_BtnS a:active {
            -webkit-box-shadow: none;
            box-shadow: none;
            background-color: #e6e6e6;
        }

        .control_BtnS a:nth-of-type(2n) {
            float: right;
            margin-right: unset;
            margin-left: 10px;
        }

        .control_BtnS a:last-child {
            float: right;
            margin-right: unset;
            margin-left: 10px;
        }




/* Scroll */

/* width */
::-webkit-scrollbar {
    width: 7px;
    height: 7px;
}

/* Track */
::-webkit-scrollbar-track {
    background: transparent;
    box-shadow: inset 0 0 0px #transparent;
    border-radius: 0px;
}

div *:hover::-webkit-scrollbar-track {
    background: #efefef;
}

/* Handle */
::-webkit-scrollbar-thumb {
    border-radius: 7px;
    background: transparent;
}

div *:hover::-webkit-scrollbar-thumb {
    background: #6c6c6c;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
    background: #6c6c6c;
}




/*custom file upload*/
.custom-file-input, .custom-file-input:focus {
    color: #000;
    line-height: 15px;
    outline: none;
}

    .custom-file-input::-webkit-file-upload-button {
        visibility: hidden;
    }

    .custom-file-input::before {
        content: 'Choose File';
        color: #fff;
        display: inline-block;
        background: #20aafb;
        /*border: 1px solid #095aa5;*/
        border-radius: 0;
        padding: 5px 8px;
        outline: none;
        white-space: nowrap;
        /*-webkit-user-select: none;*/
        cursor: pointer;
        font-weight: 500;
        font-size: 13px;
        outline: none;
    }

    .custom-file-input:hover::before {
        /*border: 1px solid #095aa5;*/
    }

    .custom-file-input:active {
        outline: 0;
    }

        .custom-file-input:active::before {
            background: -webkit-linear-gradient(top, #e3e3e3, #f9f9f9);
        }
/*custom file upload*/






/* student_info_area */



.student_selfInfo_area {
    background-color: rgba(239, 239, 239, 0.4);
    height: calc(100% - 55px);
    overflow-y: auto;
}

.student_otherInfo_area {
    height: calc(100% - 55px);
    overflow-y: auto;
    padding-bottom: 25px;
    background-color: rgba(255, 255, 255, .4);
}

.CommunicationDataBox {
    border-top: solid 1px #cacaca;
}


.selfIdPic {
    display: block;
    width: 100px;
    height: 100px;
    background-color: #f9f9f9;
    margin: 15px auto;
    background-repeat: no-repeat;
    background-size: 99%;
    background-position: top center;
    border: 7px solid #fefefe;
    box-shadow: 0px 0px 3px #ccc;
    border-radius: 50%;
}

.dataColon {
    margin-bottom: 1px;
    display: -webkit-box;  display: -webkit-flex; display: -ms-flexbox;  display: flex;
    align-items: flex-end;
}

    .dataColon:last-child {
        margin-bottom: 10px;
    }

    .dataColon span {
        font-weight: bold;
        width: 50%;
        float: left;
        text-align: right;
    }

        .dataColon span:after {
            content: ':';
            display: inline-block;
            width: 10px;
            text-align: center;
            font-weight: bold;
        }

        .dataColon span + * {
            font-size: 15px;
            color: #03796f;
            width: 50%;
            display: inline-block;
            text-align: left;
        }

.regNo {
    padding-bottom: 10px;
    margin-bottom: 10px;
    border-bottom: solid 1px #e0e0e0;
}

       /*.regNo span:after {
        font-size: 20px;
    }*/

    /*.regNo span + * {
        padding-top: 5px;
    }*/

    .ECN {
        margin-bottom: 5px;
        margin-top: 5px;
        border-bottom: solid 1px #d0d0d0;
        font-size: 15px;
        cursor: pointer;
    }

    .ECN span {
        display: block;
        font-size: 14px;
        font-weight: 900;
    }

   .ECN .dataColondetails {
    padding-bottom: 5px;
    padding-top: 5px;
    display: block;
    font-size: 18px;
    min-height: 28px;
}

    .ECN .dataColondetails i {
        margin: 0 10px;
        float: left;
        color: #ccc;
    }

    .ECN .dataColondetails:hover i {
        color: #777;
    }


    .ECN span {
        display: block;
        font-size: 14px;
        margin-bottom: 10px;
        font-weight: 900;
    }

.heading {
    border-bottom: solid 1px #ccc;
}


.payslip-body {
    /*border:1px solid #dddddd;
    border-radius:4px;
    padding:10px;*/
    border-bottom: solid 1px #ccc;
    margin-bottom:3px !important;
}


.student_otherInfo_area label.editable {
    width: 30%;
    margin-right: 1%;
}

.student_otherInfo_area input.editable {
    width: 68%;
    display: inline-block;
    height: 34px;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    -webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    margin-bottom: 10px;
}

.student_otherInfo_area .editable.editable_fild {
    font-size: 16px;
    font-weight: normal;
    padding: 6px 0px;
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    -webkit-transition: none;
    -o-transition: none;
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    outline: none;
    z-index: 0;
    background-color: transparent;
    cursor: pointer;
    color: #03796f;
    text-transform: capitalize;
}

.student_otherInfo_area input.editable + .editable {
    display: none;
    position: absolute;
    top: 50%;
    right: 16px;
    -ms-transform: translateY(-50px);
    -webkit-transform: translateY(-50px);
    -moz-transform: translateY(-50px);
    -o-transform: translateY(-50px);
    transform: translateY(-50px);
    background-color: #013e02;
    width: 25px;
    height: 25px;
    text-align: center;
    border-radius: 50%;
    cursor: pointer;
}

.student_otherInfo_area input[readonly].editable:hover + .editable, .student_otherInfo_area input + .editable:hover {
    display: block;
}

.student_otherInfo_area input[readonly].editable + .editable .fa {
    line-height: 25px;
    color: #fff;
}

.divTable {
    padding-bottom: 15px;
}

.divTableHead {
    font-size: 14px;
    font-weight: 600;
    padding-top: 5px;
    padding-bottom: 5px;
    /*margin-bottom: 5px;*/
    border-bottom: solid 1px #ccc;
    text-align: center;
}

.divTableBody {
    height: 200px;
    border: solid 1px #ccc;
    border-top: none;
}


    .divTableHead > div:first-child {
        text-align: left;
    }


.divTableRow {
    border-bottom: solid 1px #ccc;
}
    .divTableRow:last-child {
        border-bottom: solid 0px #ccc;
    }

    .divTableRow > div {
        padding-top: 5px;
        padding-bottom: 5px;
        text-align: center;
        font-weight: 500;
    }

        .divTableRow > div:first-child {
            text-align: left;
        }

    /*.divTableRow > div:last-child {
            padding-top: 15px;
            font-weight: 500;
        }*/


    .divTableRow .editable {
        display: none;
        position: absolute;
        top: 50%;
        right: 5px;
        -ms-transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
        -moz-transform: translateY(-50%);
        -o-transform: translateY(-50%);
        transform: translateY(-50%);
        background-color: #013e02;
        width: 25px;
        height: 25px;
        text-align: center;
        border-radius: 50%;
        cursor: pointer;
    }

    .divTableRow:hover {
        position: relative;
    }

        .divTableRow:hover div[data-tipe*="Vaccin Name"] {
            position: unset;
        }

        .divTableRow:hover .editable {
            display: block;
        }

    .divTableRow .editable .fa {
        line-height: 25px;
        color: #fff;
    }

.custom-radio {
    display: inline-block;
    position: relative;
}

    .custom-radio input[type=radio] {
        position: absolute;
        visibility: hidden;
    }

    .custom-radio label {
        display: block;
        position: relative;
        font-weight: 500;
        /* font-size: 1.35em; */
        padding: 0px 15px 0px 35px;
        margin: 10px auto;
        /* height: 30px; */
        z-index: 9;
        cursor: pointer;
        -webkit-transition: all 0.25s linear;
        vertical-align: middle;
    }

    .custom-radio:hover label {
        color: #333;
    }

    .custom-radio .check {
        display: block;
        position: absolute;
        border: 2px solid #AAAAAA;
        border-radius: 100%;
        height: 20px;
        width: 20px;
        top: 8px;
        left: 10px;
        z-index: 5;
        transition: border .25s linear;
        -webkit-transition: border .25s linear;
    }

    .custom-radio:hover .check {
        border: 2px solid #ccc;
    }

    .custom-radio .check::before {
        display: block;
        position: absolute;
        content: '';
        border-radius: 100%;
        height: 8px;
        width: 8px;
        top: 4px;
        left: 4px;
        margin: auto;
        transition: background 0.25s linear;
        -webkit-transition: background 0.25s linear;
    }

    .custom-radio input[type=radio]:checked ~ .check {
        border: 2px solid #03796f;
    }

        .custom-radio input[type=radio]:checked ~ .check::before {
            background: #03796f;
        }

    .custom-radio input[type=radio]:checked ~ label {
        color: #03796f;
    }

/* student_info_area */


.personal_page_header {
    text-align: center;
    font-size: 22px;
    padding: 10px;
    background-color: rgba(255, 255, 255, 0.5);
    margin: 0;
}



.student_Info_edit_btn {
    float: right;
    font-size: 16px;
    background-color: #20aafb;
    padding: 10px;
    border-radius: 50%;
    position: absolute;
    right: 0;
    top: 5px;
    color: #fff;
    cursor: pointer;
}


.student_info_edit_modal_area .modal-header .close {
    margin-top: 2px;
}

.student_info_edit_modal_area {
    padding-top: 0;
}

    .student_info_edit_modal_area .modal-header {
        padding: 6px 10px;
    }

    .student_info_edit_modal_area .modal-body {
        height: 80%;
        overflow-y: auto;
        padding:10px;
    }

    .student_info_edit_modal_area .modal_foot_btnBox {
        padding: 8px 15px;
        border-top: 1px solid #e5e5e5;
    }

    .student_info_edit_modal_area .student_info_edit_area {
    }

.student_info_edit_area h3 {
    font-size: 15px;
    margin: 0 0 5px;
    padding-bottom: 5px;
    border-bottom: 1px solid #e5e5e5;
}

/*.book_list_main_details .personal_page_header {
        display:none;
    }*/


/*assignment details*/
    .assignment_details {
        height: calc(100% - 46px);
        overflow-x: auto;
        background-color: rgba(255, 255, 255, .4);
    }

    .assignment_details .tracking-detail {
        padding: 3rem 0;
    }

    .assignment_details #tracking {
        margin-bottom: 1rem;
    }

    .assignment_details .tracking-status-intransit {
        background-color: #65aee0;
    }

    .assignment_details .tracking-status-outfordelivery {
        background-color: #f5a551;
    }

    .assignment_details .tracking-status-deliveryoffice {
        background-color: #f7dc6f;
    }

    .assignment_details .tracking-status-delivered {
        background-color: #4cbb87;
    }

    .assignment_details .tracking-status-attemptfail {
        background-color: #b789c7;
    }

    .assignment_details .tracking-status-error, .assignment_details .tracking-status-exception {
        background-color: #d26759;
    }

    .assignment_details .tracking-status-expired {
        background-color: #616e7d;
    }

    .assignment_details .tracking-status-pending {
        background-color: #ccc;
    }

    .assignment_details .tracking-status-inforeceived {
        background-color: #214977;
    }

    .assignment_details .tracking-list {
        /*border: 1px solid #e5e5e5;*/
    }

    .assignment_details .tracking-item {
        border-left: 1px solid #e5e5e5;
        position: relative;
        padding: 15px 2px 10px 25px;
        font-size: 16px;
        margin-left: 20px;
        min-height: 5rem;
    }

    .assignment_details .tracking-list-details {
        height: calc(100% - 45px);
        overflow-y: auto;
    }





    .assignment_details .tracking-item.tracking-item-month {
            padding: 0;
            min-height: 0;            
    }
    .assignment_details .tracking-item.tracking-item-month .tracking-content {
            padding: 10px;
            margin-left:25px;
            font-weight: 500;
            border-radius: 7px;
            -webkit-box-shadow: 1px 1px 5px 0px rgba(0,0,0,0.1);
            -moz-box-shadow: 1px 1px 5px 0px rgba(0,0,0,0.1);
            box-shadow: 1px 1px 5px 0px rgba(0,0,0,0.1);
        }


    .assignment_details .tracking-item span {
        font-size:14px;
    }
    .assignment_details .tracking-item p {
        font-size:13px;
        color:#3f3f3f;
        font-weight:normal;
    }

    .assignment_details .tracking-item:last-child {
        padding-bottom: 4rem;
    }

    .assignment_details .tracking-item .tracking-date {
        margin-bottom: .5rem;
    }

    .assignment_details .tracking-item .tracking-date span {
        color: #888;
        font-size: 85%;
        padding-left: .4rem;
        font-weight:normal;
    }

    .assignment_details .tracking-item .tracking-content {
        padding: .5rem .8rem;
        background-color: #f4f4f4;
        border-radius: .5rem;
    }

    
    .assignment_details .dateFilter {
        position: relative;
        padding: 0 !important;
        background-color: #fff !important;
    }
    .dateFilter input {
        border: none;
        outline: none;
        padding: 10px;
    }

    .dateFilter label {
        width: 100%;
        margin: 0;
        height: 28px;
        vertical-align: middle;
        padding: 2px 10px;
        position: absolute;
        left: 0;
        top: -20px;
        z-index: 4;
        background-color: #fff;
        transition: .3s;
        cursor:pointer;
    }

.dateFilter:hover label {
        top: 10px;
}

    

.dateFilter label i {
    float: right;
}



.dateFilter .calenderBox + .dropdown-menu {
    left: 125px !important;
}

    .assignment_details .dateFilter input[type="checkbox"]{display:none;}







    .assignment_details .tracking-item .tracking-content span {
        display: block;
        color: #888;
        font-size: 85%;
    }

    .assignment_details .tracking-item .tracking-content .btn span {
        display: block;
        color: #000;
        font-size: 85%;
    }

.assignment_details .tracking-item .tracking-icon {
    position: absolute;
        left: -1.3rem;
}


    .assignment_details .tracking-item .tracking-icon i {
        line-height: 2.6rem;
        
        width: 2.6rem;
        height: 2.6rem;
        text-align: center;
        border-radius: 50%;
        font-size: 1.1rem;
        background-color: #fff;
        color: #fff;
    }

    .assignment_details .tracking-item.tracking-item-month .tracking-icon {
        top: 4px;
        z-index:99;
        color:#fff;
    }



    .assignment_details .tracking-item:nth-of-type(n) .tracking-icon i {
        background-color: rgb(219, 153, 228);
        color:#fff;
    }

    .assignment_details .tracking-item:nth-of-type(2n) .tracking-icon i {
        background-color: rgb(241, 141, 71);
        color:#fff;
    }

    .assignment_details .tracking-item:nth-of-type(3n) .tracking-icon i {
        background-color: rgb(92, 97, 191);
        color:#fff;
    }

    .assignment_details .tracking-item:nth-of-type(4n) .tracking-icon i {
        background-color: rgb(82, 173, 208);
        color:#fff;
    }

    .assignment_details .tracking-item:nth-of-type(5n) .tracking-icon i {
        background-color: rgb(60, 171, 49);
        color:#fff;
    }

    .assignment_details .tracking-item:nth-of-type(6n) .tracking-icon i {
        background-color: rgb(236, 192, 57);
        color:#fff;
    }

    .assignment_details .tracking-item:nth-of-type(7n) .tracking-icon i {
        background-color: rgb(206, 73, 73);
        color:#fff;
    }

    .assignment_details .tracking-item:nth-of-type(8n) .tracking-icon i {
        background-color: rgb(139, 195, 74);
        color:#fff;
    }




    .assignment_details .tracking-item:nth-of-type(n) .tracking-content {
       background-color:rgba(219, 153, 228, 0.02);
        color:rgb(219, 153, 228);
    }

    .assignment_details .tracking-item:nth-of-type(2n) .tracking-content {
        background-color:rgba(241, 141, 71, 0.02);
        color:rgb(241, 141, 71);
    }

    .assignment_details .tracking-item:nth-of-type(3n) .tracking-content {
        background-color:rgba(92, 97, 191, 0.02);
        color:rgb(92, 97, 191);
    }

    .assignment_details .tracking-item:nth-of-type(4n) .tracking-content {
        background-color:rgba(82, 173, 208, 0.02);
        color:rgb(82, 173, 208);
    }

    .assignment_details .tracking-item:nth-of-type(5n) .tracking-content {
        background-color:rgba(60, 171, 49, 0.02);
        color: rgb(60, 171, 49);
    }

    .assignment_details .tracking-item:nth-of-type(6n) .tracking-content {
       background-color:rgba(236, 192, 57, 0.02);
        color:rgb(236, 192, 57);
    }

    .assignment_details .tracking-item:nth-of-type(7n) .tracking-content {
       background-color:rgba(206, 73, 73, 0.02);
        color:rgb(206, 73, 73);
    }

    .assignment_details .tracking-item:nth-of-type(8n) .tracking-content {
        background-color:rgba(139, 195, 74, 0.02);
        color:rgb(139, 195, 74);
    }


    .assignment_details .tracking-item.tracking-item-heading .tracking-content {
        color:#3f3f3f;
    }

    .assignment_details .tracking-item.tracking-item-heading .tracking-icon i {
        background-color:#fff;
        color:#3f3f3f;
    }

    .assignment_details .tracking-item.tracking-item-month.tracking-item-heading .tracking-content {
        border-radius:0;
    }

    .assignment_details .tracking-item.tracking-item-heading .tracking-content span {
         color:#3f3f3f;
    }


    .assignment_details .tracking-item .tracking-icon.status-sponsored {
        background-color: #f68;
    }

    .assignment_details .tracking-item .tracking-icon.status-delivered {
        background-color: #4cbb87;
    }

    .assignment_details .tracking-item .tracking-icon.status-outfordelivery {
        background-color: #f5a551;
    }

    .assignment_details .tracking-item .tracking-icon.status-deliveryoffice {
        background-color: #f7dc6f;
    }

    .assignment_details .tracking-item .tracking-icon.status-attemptfail {
        background-color: #b789c7;
    }

    .assignment_details .tracking-item .tracking-icon.status-exception {
        background-color: #d26759;
    }

    .assignment_details .tracking-item .tracking-icon.status-inforeceived {
        background-color: #214977;
    }

    .assignment_details .tracking-item .tracking-icon.status-intransit i {
            /*color: #3f3f3f;*/
            border: 1px solid #e5e5e5;
            font-size: 16px;
    }







    @media (min-width:992px) {
        .assignment_details .tracking-item {
            margin-left: 150px;
        }
        .assignment_details .tracking-item.tracking-item-month {
            padding: 0;
            min-height: 0;            
        }
        .assignment_details .tracking-item .tracking-date {
            position: absolute;
            left: -10rem;
            width: 7.5rem;
            text-align: right;
        }
        .assignment_details .tracking-item .tracking-date span {
            display: block;
        }
        .assignment_details .tracking-item .tracking-content {
            padding: 0;
            background-color: transparent;
            font-weight:500;
        }
        .assignment_details .tracking-item.tracking-item-month .tracking-content {
            padding: 10px;
            margin-left:32px;
                font-weight: 500;
            border-radius: 7px;
            -webkit-box-shadow: 1px 1px 5px 0px rgba(0,0,0,0.1);
            -moz-box-shadow: 1px 1px 5px 0px rgba(0,0,0,0.1);
            box-shadow: 1px 1px 5px 0px rgba(0,0,0,0.1);
        }


    }

/*assignment details*/


/*Notice*/
    .notice_area {
        height: calc(100% - 54px);
        overflow-y: auto;
        padding:15px;
    }

    .notice_area .panel {
        margin-bottom: 0px;
    }

    .notice_area .panel-body {
        height: calc(100% - 45px);
        overflow-y: auto;
    }

    .notice_area .section-box h2 {
        margin-top: 0px;
        font-size: 20px;
    }

    .notice_area .section-box hr {
        margin-top: 10px;
        margin-bottom: 10px;
    }

    .notice_area .panel-heading h3 {
        font-size: 20px;
        margin: 0;
        line-height: 30px;
    }

    .notice_area .panel-heading span .form-control {
        max-width: 200px;
    }

    .notice_area .well {
        -webkit-box-shadow: none;
        box-shadow: none;
    }

    .notice_area .well:nth-of-type(n), .notice_area .well:nth-of-type(n) .section-box .media .section-box-date-area {
        border: 1px solid rgba(219, 153, 228, .2);
        background-color: rgba(219, 153, 228, .02);
    }

    .notice_area .well:nth-of-type(2n), .notice_area .well:nth-of-type(2n) .section-box .media .section-box-date-area {
        border: 1px solid rgba(241, 141, 71, .2);
        background-color: rgba(241, 141, 71, .02);
    }

    .notice_area .well:nth-of-type(3n), .notice_area .well:nth-of-type(3n) .section-box .media .section-box-date-area {
        border: 1px solid rgba(92, 97, 191, .2);
        background-color: rgba(92, 97, 191, 0.02);
    }

    .notice_area .well:nth-of-type(4n), .notice_area .well:nth-of-type(4n) .section-box .media .section-box-date-area {
        border: 1px solid rgba(82, 173, 208, .2);
        background-color: rgba(82, 173, 208, 0.02);
    }

    .notice_area .well:nth-of-type(5n), .notice_area .well:nth-of-type(5n) .section-box .media .section-box-date-area {
        border: 1px solid rgba(60, 171, 49, .2);
        background-color: rgba(60, 171, 49, 0.02);
    }

    .notice_area .well:nth-of-type(6n), .notice_area .well:nth-of-type(6n) .section-box .media .section-box-date-area {
        border: 1px solid rgba(236, 192, 57, .2);
        background-color: rgba(236, 192, 57, 0.02);
    }

    .notice_area .well:nth-of-type(7n), .notice_area .well:nth-of-type(7n) .section-box .media .section-box-date-area {
        border: 1px solid rgba(206, 73, 73, .2);
        background-color: rgba(206, 73, 73, 0.02);
    }

    .notice_area .well:nth-of-type(8n), .notice_area .well:nth-of-type(8n) .section-box .media .section-box-date-area {
        border: 1px solid rgba(139, 195, 74, .2);
        background-color: rgba(139, 195, 74, 0.02);
    }



    .notice_area .well:nth-of-type(n) .section-box h2, .notice_area .well:nth-of-type(n) .section-box .media .media-body .media-heading, .notice_area .well:nth-of-type(n) .section-box .media .section-box-date-area, .notice_area .well:nth-of-type(n) .section-box .media .media-body .notice_area_color {
        color: rgb(219, 153, 228);
    }

    .notice_area .well:nth-of-type(2n) .section-box h2, .notice_area .well:nth-of-type(2n) .section-box .media .media-body .media-heading, .notice_area .well:nth-of-type(2n) .section-box .media .section-box-date-area, .notice_area .well:nth-of-type(2n) .section-box .media .media-body .notice_area_color {
        color: rgb(241, 141, 71);
    }

    .notice_area .well:nth-of-type(3n) .section-box h2, .notice_area .well:nth-of-type(3n) .section-box .media .media-body .media-heading, .notice_area .well:nth-of-type(3n) .section-box .media .section-box-date-area, .notice_area .well:nth-of-type(3n) .section-box .media .media-body .notice_area_color {
        color: rgb(92, 97, 191);
    }

    .notice_area .well:nth-of-type(4n) .section-box h2, .notice_area .well:nth-of-type(4n) .section-box .media .media-body .media-heading, .notice_area .well:nth-of-type(4n) .section-box .media .section-box-date-area, .notice_area .well:nth-of-type(4n) .section-box .media .media-body .notice_area_color {
        color: rgb(82, 173, 208);
    }

    .notice_area .well:nth-of-type(5n) .section-box h2, .notice_area .well:nth-of-type(5n) .section-box .media .media-body .media-heading, .notice_area .well:nth-of-type(5n) .section-box .media .section-box-date-area, .notice_area .well:nth-of-type(5n) .section-box .media .media-body .notice_area_color {
        color: rgb(60, 171, 49);
    }

    .notice_area .well:nth-of-type(6n) .section-box h2, .notice_area .well:nth-of-type(6n) .section-box .media .media-body .media-heading, .notice_area .well:nth-of-type(6n) .section-box .media .section-box-date-area, .notice_area .well:nth-of-type(6n) .section-box .media .media-body .notice_area_color {
        color: rgb(236, 192, 57);
    }

    .notice_area .well:nth-of-type(7n) .section-box h2, .notice_area .well:nth-of-type(7n) .section-box .media .media-body .media-heading, .notice_area .well:nth-of-type(7n) .section-box .media .section-box-date-area, .notice_area .well:nth-of-type(7n) .section-box .media .media-body .notice_area_color {
        color: rgb(206, 73, 73);
    }

    .notice_area .well:nth-of-type(8n) .section-box h2, .notice_area .well:nth-of-type(8n) .section-box .media .media-body .media-heading, .notice_area .well:nth-of-type(8n) .section-box .media .section-box-date-area, .notice_area .well:nth-of-type(8n) .section-box .media .media-body .notice_area_color {
        color: rgb(139, 195, 74);
    }


    .notice_area .well:nth-of-type(n) .section-box .media .section-box-date-area {
        border: 1px solid rgba(219, 153, 228, .06);
        background-color: rgba(219, 153, 228, .06);
    }

    .notice_area .well:nth-of-type(2n) .section-box .media .section-box-date-area {
        border: 1px solid rgba(241, 141, 71, 0.06);
        background-color: rgba(199, 131, 132, 0.06);
    }

    .notice_area .well:nth-of-type(3n) .section-box .media .section-box-date-area {
        border: 1px solid rgba(92, 97, 191, 0.06);
        background-color: rgba(92, 97, 191, 0.06);
    }

    .notice_area .well:nth-of-type(4n) .section-box .media .section-box-date-area {
        border: 1px solid rgba(82, 173, 208, 0.06);
        background-color: rgba(82, 173, 208, 0.06);
    }

    .notice_area .well .section-box .media .media-body .notice_area_last_date .notice_area_color {
        color: #fd3e3e;
    }


    .notice_area .notice_area_name {
        font-size: 15px;
        color: #000;
    }

    a.section-box-date-area {
        width: 64px;
        height: 64px;
        display: block;
        text-align: center;
        font-weight: 600;
        /*border:1px solid #ccc;*/
    }

    a.section-box-date-area:hover {
        text-decoration: none;
        cursor: pointer;
    }

    .notice_area .well .section-box .media .media-body .media-heading {
        margin-bottom: 10px;
    }

    .notice_area .panel-default > .panel-heading {
        background-color: rgba(255, 255, 255, 0);
        padding: 5px 15px;
    }

    .notice_area .well .section-box .media .media-body .media-heading span.pull-right {
    }

    .notice_area .well .section-box .media .media-body .notice_area_name {
        margin-bottom: 5px;
    }

    .section-box-date-area span.section-box-date {
        font-size: 24px;
        font-weight: bold;
    }

    .section-box-date-area span.section-box-month {
        font-size: 17px;
        font-weight: normal;
        display: block;
    }


/*Notice*/




/* certificates_area */



    .certificates_area {
        height: calc(100% - 45px);
        padding-top: 20px;
        padding-bottom: 20px;
        display: -webkit-box;  display: -webkit-flex; display: -ms-flexbox;  display: flex;
        align-items: self-start;
        -webkit-box-pack:center;  -webkit-justify-content: center;  -ms-flex-pack:center;  justify-content: center;
        overflow-y: auto;
        background-color: rgba(255, 255, 255, .4);
    }


    .certificate_items_area {
        width: 100%;
        text-align: center;
        padding-left: 1.4287%;
    }

    .certificate_item {
        display: inline-block;
        width: 15%;
        border: solid 1px #eee;
        margin-right: 1.4287%;
        margin-bottom: 15px;
        padding: 10px 5px 20px;
        position: relative;
        overflow: hidden;
        max-width: 190px;
        /*background-color: #fff;*/
        cursor: pointer;
    }

    /*.certificate_item.active,*/ .certificate_item:hover {
        box-shadow: 0px 0px 6px #aba7a7;
    }

    .certificate_item.exlnt {
        border: 1px solid rgba(0, 125, 58, 0.3);
    }

    .certificate_item.good {
        border: 1px solid rgba(139, 196, 31, 0.3);
    }

    .certificate_item.avrg {
        border: 1px solid rgba(253, 144, 1, 0.3);
    }

    .certificate_item.bad {
        border: 1px solid rgba(251, 63, 0, 0.3);
    }

    .certificate_item.exlnt .starsMarking {
        background-color: #007d3a;
        color: #fff;
    }

    .certificate_item.good .starsMarking {
        background-color: #8bc41f;
        color: #fff;
    }

    .certificate_item.avrg .starsMarking {
        background-color: #fd9001;
        color: #fff;
    }

    .certificate_item.bad .starsMarking {
        background-color: #fb3f00;
        color: #fff;
    }



    .certificate_item.flex-container > div:nth-of-type(6n) {
        border: solid 1px rgba(236, 192, 57, 0.5);
    }


    .certificate_item h2 {
        text-transform: capitalize;
        font-size: 26px;
    }

    .starsMarking {
        width: 100%;
        display: block;
        position: absolute;
        top: 45px;
        left: -70px;
        padding: 2px;
        -ms-transform: rotate(-80deg);
        -webkit-transform: rotate(-80deg);
        -moz-transform: rotate(-80deg);
        -o-transform: rotate(-80deg);
        transform: rotate(-80deg);
    }

    .subjectBox {
        position: absolute;
        right: 0;
        bottom: 0px;
        width: 100%;
        text-align: right;
        padding: 0 10px;
        color: #afafaf;
    }

    .subjectBox .fa {
        width: 20px;
        height: 20px;
        line-height: 20px;
        background-color: transparent;
        text-align: center;
    }




    .certificate_category_area {
        display: none;
        position: fixed;
        top: 52px;
        left: 50%;
        -ms-transform: translateX(-50%);
        -webkit-transform: translateX(-50%);
        -moz-transform: translateX(-50%);
        -o-transform: translateX(-50%);
        transform: translateX(-50%);
        width: 95%;
        height: calc(100% - 90px);
        background-color: #fff;
        padding: 15px 20px 0;
        overflow-y: auto;
    }

    .certificate_category_area.active {
        display: block;
    }

    .certificate_category_area_close.close {
        font-size: 34px;
        outline: none;
        line-height: 10px;
        padding: 0;
        margin: 0;
    }


    .categoryBox {
        text-align: center;
    }

    .categoryMenu {
        padding: 0px;
        list-style-type: none;
        display: inline-block;
    }

    .categoryMenu li {
        float: left;
        padding: 15px 20px;
        background-color: #f9f9f9;
        font-size: 16px;
        border-right: solid 1px #ccc;
    }

    .categoryMenu li.active {
            background-color: #20aafb;
            color: #fff;
    }


    .categoryMenu li:hover {
        cursor:pointer;
    }

    .categoryMenu li:last-child {
        border-right: solid 1px transparent;
    }

    .categoryMenu li i {
        height: 50px;
        width: 60px;
        margin: -15px 0px -15px -20px;
        vertical-align: top;
        line-height: 50px;
        font-size: 25px;
    }

    .categoryCertificatesBox {
        width: 100%;
        height: calc(100% - 62px);
        /*margin-top: 40px;*/
    }


    .categoryCertifiHead {
        margin: 0;
        height: 50px;
        line-height: 50px;
        text-align: center;
        position: relative;
        border-bottom: solid 1px #ccc;
    }

        .categoryCertifiHead i {
            margin-right: 15px;
        }

    /*.back {
        position: absolute;
        display: none;
    }*/
    .certificate_category_area .categoryBox .certificate_category_area_close.back {
        font-size: 26px;
        text-align: left;
        float: left;
        vertical-align: middle;
        width: 30px;
        cursor:pointer;
    }

    .certificate_category_area .categoryBox .certificate_category_area_close.back span {
        line-height:60px;
    }

    .categoryCertifiBody {
        height: calc(100% - 50px);
        overflow-y: auto;
        text-align: center;
    }

    .categoryCertificatesBox {
        display: none;
    }
    .categoryCertificatesBox.categoryactive {
        display: block;
    }



    .categoryCertifiBody .categoryCertifi_Item {
        display: inline-block;
        width: calc(20% - 12px);
        margin: 5px 0;
        /*border: solid 1px #fbddd4;*/
    }



        .categoryCertifiBody .categoryCertifi_Item:nth-of-type(n) {
            border: solid 1px rgb(219, 153, 228);
        }

        .categoryCertifiBody .categoryCertifi_Item:nth-of-type(2n) {
            border: solid 1px rgb(241, 141, 71);
        }

        .categoryCertifiBody .categoryCertifi_Item:nth-of-type(3n) {
            border: solid 1px rgba(92, 97, 191, 1);
        }

        .categoryCertifiBody .categoryCertifi_Item:nth-of-type(4n) {
            border: solid 1px rgba(82, 173, 208, 1);
        }

        .categoryCertifiBody .categoryCertifi_Item:nth-of-type(5n) {
            border: solid 1px rgba(60, 171, 49, 1);
        }

        .categoryCertifiBody .categoryCertifi_Item:nth-of-type(6n) {
            border: rgb(236, 192, 57);
        }

        .categoryCertifiBody .categoryCertifi_Item:nth-of-type(7n) {
            border: rgb(206, 73, 73);
        }

        .categoryCertifiBody .categoryCertifi_Item:nth-of-type(8n) {
            border: rgb(139, 195, 74);
        }


        .categoryCertifiBody .categoryCertifi_Item h3 {
            height: 58px;
            display: -webkit-box;  display: -webkit-flex; display: -ms-flexbox;  display: flex;
            margin: 0;
            -webkit-box-align: center;  -webkit-align-items: center;  -ms-flex-align: center;  align-items: center;
            -webkit-box-pack:center;  -webkit-justify-content: center;  -ms-flex-pack:center;  justify-content: center;
            padding: 10px;
            background-color: #ffeee9;
            color: #000000;
            font-size: 20px;
            font-weight: 900;
        }

        .categoryCertifiBody .categoryCertifi_Item h4 {
            margin: 0;
            padding: 5px 10px;
            height: 40px;
            display: -webkit-box;  display: -webkit-flex; display: -ms-flexbox;  display: flex;
            align-items: start;
            -webkit-box-pack:center;  -webkit-justify-content: center;  -ms-flex-pack:center;  justify-content: center;
            text-transform: uppercase;
            background-color: #ffeee9;
            color: #000000;
            font-weight: 600;
            font-size: 16px;
        }


        .categoryCertifiBody .categoryCertifi_Item:nth-of-type(n) h4, .categoryCertifiBody .categoryCertifi_Item:nth-of-type(n) h3 {
            background-color: rgba(219, 153, 228, .25);
            color: rgba(219, 153, 228, 1);
        }

        .categoryCertifiBody .categoryCertifi_Item:nth-of-type(2n) h4, .categoryCertifiBody .categoryCertifi_Item:nth-of-type(2n) h3 {
            background-color: rgba(241, 141, 71, 0.25);
            color: rgb(241, 141, 71);
        }

        .categoryCertifiBody .categoryCertifi_Item:nth-of-type(3n) h4, .categoryCertifiBody .categoryCertifi_Item:nth-of-type(3n) h3 {
            background-color: rgba(92, 97, 191, 0.25);
            color: rgba(92, 97, 191, 1);
        }

        .categoryCertifiBody .categoryCertifi_Item:nth-of-type(4n) h4, .categoryCertifiBody .categoryCertifi_Item:nth-of-type(4n) h3 {
            background-color: rgba(82, 173, 208, 0.25);
            color: rgba(82, 173, 208, 1);
        }

        .categoryCertifiBody .categoryCertifi_Item:nth-of-type(5n) h4, .categoryCertifiBody .categoryCertifi_Item:nth-of-type(5n) h3 {
            background-color: rgba(60, 171, 49, 0.25);
            color: rgba(60, 171, 49, 1);
        }

        .categoryCertifiBody .categoryCertifi_Item:nth-of-type(6n) h4, .categoryCertifiBody .categoryCertifi_Item:nth-of-type(6n) h3 {
            background-color: rgba(236, 192, 57, 0.25);
            color: rgba(236, 192, 57, 1);
        }

        .categoryCertifiBody .categoryCertifi_Item:nth-of-type(7n) h4, .categoryCertifiBody .categoryCertifi_Item:nth-of-type(7n) h3 {
            background-color: rgba(206, 73, 73, 0.25);
            color: rgba(206, 73, 73, 1);
        }

        .categoryCertifiBody .categoryCertifi_Item:nth-of-type(8n) h4, .categoryCertifiBody .categoryCertifi_Item:nth-of-type(8n) h3 {
            background-color: rgba(139, 195, 74, 0.25);
            color: rgba(139, 195, 74, 1);
        }



        .categoryCertifiBody .categoryCertifi_Item .imageBox {
            height: 135px;
            display: block;
            background-repeat: no-repeat;
            background-size: contain;
            background-position: top center;
            position: relative;
            background-color: #efefef;
            /*border-top: solid 1px #ffaf96;*/
        }

        .categoryCertifiBody .categoryCertifi_Item:nth-of-type(n) .imageBox {
            border-top: solid 1px rgb(219, 153, 228);
        }

        .categoryCertifiBody .categoryCertifi_Item:nth-of-type(2n) .imageBox {
            border-top: solid 1px rgb(241, 141, 71);
        }

        .categoryCertifiBody .categoryCertifi_Item:nth-of-type(3n) .imageBox {
            border-top: solid 1px rgba(92, 97, 191, 1);
        }

        .categoryCertifiBody .categoryCertifi_Item:nth-of-type(4n) .imageBox {
            border-top: solid 1px rgba(82, 173, 208, 1);
        }

        .categoryCertifiBody .categoryCertifi_Item:nth-of-type(5n) .imageBox {
            border-top: solid 1px rgba(60, 171, 49, 1);
        }

        .categoryCertifiBody .categoryCertifi_Item:nth-of-type(6n) .imageBox {
            border-top: solid 1px rgb(236, 192, 57);
        }

        .categoryCertifiBody .categoryCertifi_Item:nth-of-type(7n) .imageBox {
            border-top: solid 1px rgb(206, 73, 73);
        }

        .categoryCertifiBody .categoryCertifi_Item:nth-of-type(8n) .imageBox {
            border-top: solid 1px rgb(139, 195, 74);
        }


.gameOn {
    position: absolute;
    right: 0;
    bottom: 0;
    padding: 2px 15px;
    background-color: #fff;
    font-weight: 600;
}

    .gameOn:before {
        content: '';
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 0 0 24px 40px;
        border-color: transparent transparent #ffffff transparent;
        position: absolute;
        top: 0;
        right: calc(100% - 1px);
    }


.categoryCertifiBody .categoryCertifi_Item .imageBox + h4, .categoryCertifiBody .categoryCertifi_Item .imageBox + h4 + h3 {
    height: auto;
    background-color: unset;
    color: #3f3f3f;
    padding-top: 10px;
    font-weight: 500;
}

.categoryCertifiBody .categoryCertifi_Item p {
    padding: 0 15px 20px;
}


.categoryCertifiBody .categoryCertifi_Item .download {
    font-size: 30px;
    color: #3f3f3f;
}








/* certificates_area */



/*Tabs panel */
/*add class in tavset----------class="tabbable-panel"----------*/
.tabbable-panel {
    display: inline-block;
    background-color: rgba(255, 255, 255, .4);
    margin-top: 5px;
    width: 100%;
}

    .tabbable-panel .nav-tabs {
        display: inline-block;
    }

        .tabbable-panel .nav-tabs > li {
            padding: 0;
        }

            .tabbable-panel .nav-tabs > li > a {
                border-radius: 0;
                border: none;
                border-bottom: 4px solid transparent;
                padding: 10px 5px;
                margin-top: 4px;
                margin-right: 4px;
                margin-left: 4px;
                text-decoration: underline;
            }

                .tabbable-panel .nav-tabs > li > a:hover {
                    border: none;
                    background-color: transparent;
                    font-weight: normal;
                    margin-right: 4px;
                    margin-left: 4px;
                    text-decoration: none;
                }

    .tabbable-panel .nav > li > a:focus, .tabbable-panel .nav > li > a:hover {
        border-bottom: 4px solid rgba(255, 148, 38, .4) !important;
        background-color: rgba(255, 148, 38, .07) !important;
    }

    .tabbable-panel .nav-tabs > li.active > a, .tabbable-panel .nav-tabs > li.active > a:focus, .tabbable-panel .nav-tabs > li.active > a:hover {
        color: #555;
        cursor: default;
        font-weight: bold;
        background-color: #fff !important;
        border: none;
        /*border-bottom: 4px solid #ff9426;*/
        text-decoration: none;
    }

        .tabbable-panel .nav-tabs > li.active > a::before {
            border-color: transparent;
        }

        .tabbable-panel .nav-tabs > li.active > a::after {
            border-color: transparent;
        }

    .tabbable-panel .nav-tabs > li.tab_Ctrl {
        border-bottom: none;
    }

    .tabbable-panel .nav-tabs > li.active:nth-of-type(n) > a, .tabbable-panel .nav-tabs > li.active:nth-of-type(n) > a:focus, .tabbable-panel .nav-tabs > li.active:nth-of-type(n) > a:hover {
        border-bottom: 4px solid rgb(219, 153, 228) !important;
    }

    .tabbable-panel .nav-tabs > li.active:nth-of-type(2n) > a, .tabbable-panel .nav-tabs > li.active:nth-of-type(2n) > a:focus, .tabbable-panel .nav-tabs > li.active:nth-of-type(2n) > a:hover {
        border-bottom: 4px solid rgb(241, 141, 71) !important;
    }

    .tabbable-panel .nav-tabs > li.active:nth-of-type(3n) > a, .tabbable-panel .nav-tabs > li.active:nth-of-type(3n) > a:focus, .tabbable-panel .nav-tabs > li.active:nth-of-type(3n) > a:hover {
        border-bottom: 4px solid rgb(92, 97, 191) !important;
    }

    .tabbable-panel .nav-tabs > li.active:nth-of-type(4n) > a, .tabbable-panel .nav-tabs > li.active:nth-of-type(4n) > a:focus, .tabbable-panel .nav-tabs > li.active:nth-of-type(4n) > a:hover {
        border-bottom: 4px solid rgb(82, 173, 208) !important;
    }

    .tabbable-panel .nav-tabs > li.active:nth-of-type(5n) > a, .tabbable-panel .nav-tabs > li.active:nth-of-type(5n) > a:focus, .tabbable-panel .nav-tabs > li.active:nth-of-type(5n) > a:hover {
        border-bottom: 4px solid rgb(60, 171, 49) !important;
    }

    .tabbable-panel .nav-tabs > li.active:nth-of-type(6n) > a, .tabbable-panel .nav-tabs > li.active:nth-of-type(6n) > a:focus, .tabbable-panel .nav-tabs > li.active:nth-of-type(6n) > a:hover {
        border-bottom: 4px solid rgb(236, 192, 57) !important;
    }

    .tabbable-panel .nav-tabs > li.active:nth-of-type(7n) > a, .tabbable-panel .nav-tabs > li.active:nth-of-type(7n) > a:focus, .tabbable-panel .nav-tabs > li.active:nth-of-type(7n) > a:hover {
        border-bottom: 4px solid rgb(206, 73, 73) !important;
    }

    .tabbable-panel .nav-tabs > li.active:nth-of-type(8n) > a, .tabbable-panel .nav-tabs > li.active:nth-of-type(8n) > a:focus, .tabbable-panel .nav-tabs > li.active:nth-of-type(8n) > a:hover {
        border-bottom: 4px solid rgb(139, 195, 74) !important;
    }

    .tabbable-panel .tab-content > .active.tab-pane:nth-of-type(n) {
        border-top: 2px solid rgb(219, 153, 228) !important;
    }

    .tabbable-panel .tab-content > .active.tab-pane:nth-of-type(2n) {
        border-top: 2px solid rgb(241, 141, 71) !important;
    }

    .tabbable-panel .tab-content > .active.tab-pane:nth-of-type(3n) {
        border-top: 2px solid rgb(92, 97, 191) !important;
    }

    .tabbable-panel .tab-content > .active.tab-pane:nth-of-type(4n) {
        border-top: 2px solid rgb(82, 173, 208) !important;
    }

    .tabbable-panel .tab-content > .active.tab-pane:nth-of-type(5n) {
        border-top: 2px solid rgb(60, 171, 49) !important;
    }

    .tabbable-panel .tab-content > .active.tab-pane:nth-of-type(6n) {
        border-top: 2px solid rgb(236, 192, 57) !important;
    }

    .tabbable-panel .tab-content > .active.tab-pane:nth-of-type(7n) {
        border-top: 2px solid rgb(206, 73, 73) !important;
    }

    .tabbable-panel .tab-content > .active.tab-pane:nth-of-type(8n) {
        border-top: 2px solid rgb(139, 195, 74) !important;
    }

    .tabbable-panel .nav > li:nth-of-type(n) > a:hover, .tabbable-panel .nav > li:nth-of-type(n) > a:focus {
        border-bottom: 4px solid rgba(219, 153, 228, .4) !important;
        background-color: rgba(219, 153, 228, .07) !important;
    }

    .tabbable-panel .nav > li:nth-of-type(2n) > a:hover, .tabbable-panel .nav > li:nth-of-type(2n) > a:focus {
        border-bottom: 4px solid rgba(241, 141, 71, .4) !important;
        background-color: rgba(241, 141, 71, .07) !important;
    }

    .tabbable-panel .nav > li:nth-of-type(3n) > a:hover, .tabbable-panel .nav > li:nth-of-type(3n) > a:focus {
        border-bottom: 4px solid rgba(92, 97, 191, .4) !important;
        background-color: rgba(92, 97, 191, .07) !important;
    }

    .tabbable-panel .nav > li:nth-of-type(4n) > a:hover, .tabbable-panel .nav > li:nth-of-type(4n) > a:focus {
        border-bottom: 4px solid rgba(82, 173, 208, .4) !important;
        background-color: rgba(82, 173, 208, .07) !important;
    }

    .tabbable-panel .nav > li:nth-of-type(5n) > a:hover, .tabbable-panel .nav > li:nth-of-type(5n) > a:focus {
        border-bottom: 4px solid rgba(60, 171, 49, .4) !important;
        background-color: rgba(60, 171, 49, .07) !important;
    }

    .tabbable-panel .nav > li:nth-of-type(6n) > a:hover, .tabbable-panel .nav > li:nth-of-type(6n) > a:focus {
        border-bottom: 4px solid rgba(236, 192, 57, .4) !important;
        background-color: rgba(236, 192, 57, .07) !important;
    }

    .tabbable-panel .nav > li:nth-of-type(7n) > a:hover, .tabbable-panel .nav > li:nth-of-type(7n) > a:focus {
        border-bottom: 4px solid rgba(206, 73, 73, .4) !important;
        background-color: rgba(206, 73, 73, .07) !important;
    }

    .tabbable-panel .nav > li:nth-of-type(8n) > a:hover, .tabbable-panel .nav > li:nth-of-type(8n) > a:focus {
        border-bottom: 4px solid rgba(139, 195, 74, .4) !important;
        background-color: rgba(139, 195, 74, .07) !important;
    }

    .tabbable-panel .tab-content {
        padding: 0;
    }

        .tabbable-panel .tab-content > .tab-pane.active {
            padding: 10px;
        }



/* Tabs panel */




.docArea-parent {
    height: calc(100% - 53px);
    overflow-y: auto;
    background-color: rgba(255, 255, 255, .4);
}

    .docArea-parent form {
        /*background-color: rgba(255, 255, 255, .4);
        height:100%;*/
    }

h5.docArea-parent-sub-heading {
    background-color: #f5f5f5;
    margin: 0;
    padding: 10px;
    color: #3f3f3f;
    margin-bottom: 10px;
}

.actionPanel {
    position: fixed;
    bottom: 34px;
    /* width: 100%; */
    right: 0;
    left: 0;
    background-color: rgba(255, 255, 255, .4);
}

.actionPanel.actionPanel-parent {
    position: unset;
}

ul.controlMenu {
    margin: 0;
    padding: 10px 15px;
    clear: both;
    overflow: auto;
}

    ul.controlMenu li {
        margin: 0;
        padding: 0;
        list-style-type: none;
        float: right;
    }


/*11032019 sumallya*/




/*  leaveApplicationArea  */


.leaveApplicationArea {
    height: 100%;
    overflow-y: auto;
}

.leaveBtnArea {
    height: calc(100% - 44px);
    overflow-y: auto;
    display: -webkit-box;  display: -webkit-flex; display: -ms-flexbox;  display: flex;
    -webkit-box-orient: horizontal;  -webkit-box-direction: normal; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row;
    -webkit-box-align: center;  -webkit-align-items: center;  -ms-flex-align: center;  align-items: center;
    -webkit-box-pack:center;  -webkit-justify-content: center;  -ms-flex-pack:center;  justify-content: center;
}

.seclect_application {
    text-align: center;
}
.seclect_application.inactive {
    display:none;
}
.seclect_application.active {
    display:block;
}
.leaveBtn {
    min-width: calc(30% - 40px);
    margin: 15px 20px 0px;
    background-color: #fff;
    padding: 0px;
    text-align: center;
    -webkit-border-top-left-radius: 15px;
    -webkit-border-top-right-radius: 15px;
    -moz-border-radius-topleft: 15px;
    -moz-border-radius-topright: 15px;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
    box-shadow: 0px -10px 15px #fff;
    cursor: pointer;
    display: inline-block;
}

.BtnIcon {
    height: 100px;
    width: 100px;
    display: block;
    margin: 10px auto;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}


.BtnIcon.Apply {
    background-image: url(../../../Images/LoginImg/leaveApplication.jpg);
}

.BtnIcon.History {
    background-image: url(../../../Images/LoginImg/leaveHistory.jpg);
}

.BtnTitle {
    font-size: 20px;
    display: block;
    padding: 10px 60px 35px;
    /* border: solid 1px #88b3f5; */
    border-top: none;
    -webkit-border-bottom-right-radius: 15px;
    -webkit-border-bottom-left-radius: 15px;
    -moz-border-radius-bottomright: 15px;
    -moz-border-radius-bottomleft: 15px;
    border-bottom-right-radius: 15px;
    border-bottom-left-radius: 15px;
    box-shadow: 0px 10px 14px #e8e8e8;
}

.applicationHistoryArea {
    position: absolute;
    top: 0;
    left: 0;
    background-color: rgba(249, 249, 249, .4);
    width: 100%;
    height: 100%;
    padding: 10px;
    display: none;
    align-items: start;
    -webkit-box-pack:center;  -webkit-justify-content: center;  -ms-flex-pack:center;  justify-content: center;
    overflow-y: auto;
    overflow-x: hidden;
}


    .applicationHistoryArea.inactive {
        display: none;
    }
    .applicationHistoryArea.active {
        display: -webkit-box;  display: -webkit-flex; display: -ms-flexbox;  display: flex;
    }

.applicationForm {
    width: 80%;
    max-height: 100%;
    /*height: 100%;*/
    padding: 25px 15px 15px;
    border: solid 1px #ccc;
    border-radius: 15px;
    background-color: rgba(255, 255, 255, .4);
    
}

.form-horizontal .applicationForm .form-group {
    margin-right: 0px;
    margin-left: 0px;
}

.HistoryArea {
    max-height: calc(100% - 68px);
    padding: 0px 15px;
    /*background-color: #ccc;*/
    overflow-y: auto;
    display: none;
    border: solid 1px #ccc;
    
}

    .HistoryArea.active {
        display: block;
    }
.HistoryListHead {
    text-transform: capitalize;
    font-size: 14px;
    font-weight: 600;
    text-align: center;
    background-color: #505050;
    color: #fff;
}


    .HistoryListHead > div > div {
        padding-top: 2px;
        padding-bottom: 2px;
    }

    .leavFrom > div:first-child {
        border-bottom: solid 1px #ccc;
        margin-left: -15px;
    }
    .leavFrom > div {
        border-right: solid 1px #ccc;
    }
    .leavReason {
        height: 50px;
        display: -webkit-box;  display: -webkit-flex; display: -ms-flexbox;  display: flex;
        -webkit-box-align: center;  -webkit-align-items: center;  -ms-flex-align: center;  align-items: center;
        -webkit-box-pack:center;  -webkit-justify-content: center;  -ms-flex-pack:center;  justify-content: center;
        /*border-bottom: solid 1px #ccc;*/
    }

    .HistoryListBody {
        max-height: calc(100% - 220px);
        min-height: 100px;
        overflow-y: auto;
    }

    .HistoryListBody .itemRow {
        display: -webkit-box;  display: -webkit-flex; display: -ms-flexbox;  display: flex;
        -webkit-box-align: center;  -webkit-align-items: center;  -ms-flex-align: center;  align-items: center;
        text-align: center;
    }

    .HistoryListBody .itemRow {
        border-bottom: solid 1px #ccc;
    }

    .HistoryListBody .itemRow:last-child {
        border-bottom: none;
    }

    .itemRow p {
        padding-top: 5px;
        text-align: left;
    }

    .HistoryListBody .itemRow:nth-of-type(2n) {
        background-color: #efefef;
    }


    .itemRow > div:first-child {
        width: 66.66666667%;
    }

    .itemRow > div:last-child {
        width: 33.33333333%;
    }




/*  leaveApplicationArea  */






/*------------Dassbord area 27032019----------------*/

.panel-dashbord.panel {
    -webkit-box-shadow: 0px 0px 1px 0px rgba(0,0,0,0.1);
    -moz-box-shadow: 0px 0px 1px 0px rgba(0,0,0,0.1);
    box-shadow: 0px 0px 1px 0px rgba(0,0,0,0.1);
    transition: all .4s;
}
.panel-dashbord.panel:hover {
    -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.2);
    -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.2);
    box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.2);
}

.dashboard-area .dashboard-list-container {
  display: flex;
  align-items: stretch;
  margin-bottom:20px;
  flex-wrap:wrap;
  justify-content: center;
}

.dashboard-area .dashboard-list-container > a {
    background-color: #fff;
    color: #3f3f3f;
    border:1px solid #ddd;
    border-radius:3px;
    width:22%;
    margin: 10px;
    padding:20px 15px;
    /*text-align: center;
    line-height: 75px;*/
    font-size: 20px;
    
    -webkit-box-shadow: 0px 0px 1px 0px rgba(0,0,0,0.1);
    -moz-box-shadow: 0px 0px 1px 0px rgba(0,0,0,0.1);
    box-shadow: 0px 0px 1px 0px rgba(0,0,0,0.1);
    transition: all .4s;
    display: block;
    text-align:center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;

}
.dashboard-area .dashboard-list-container > a:hover, .dashboard-area .dashboard-list-container > a:focus {
    -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.2);
    -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.2);
    box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.2);
    text-decoration:none;
}


    .dashboard-area .dashboard-list-container > a:nth-child(n) {
            /*border:1px solid #4396d8;
            background-color:rgba(67, 150, 216, 0.2);
            color: #4396d8;*/
    }
    .dashboard-area .dashboard-list-container > a:nth-child(2n) {
            /*border:1px solid #5fb962;
            background-color:rgba(95, 185, 98, .2);
            color: #5fb962;*/
    }
    .dashboard-area .dashboard-list-container > a:nth-child(3n) {
        /*border:1px solid #ea5b50;
        background-color:rgba(234, 91, 80, .2);
        color: #ea5b50;*/
    }
    .dashboard-area .dashboard-list-container > a:nth-child(4n) {
        /*border:1px solid #f7a021;
        background-color:rgba(247, 160, 33, .2);
        color: #f7a021;*/
    }
    .dashboard-area .dashboard-list-container > a:nth-child(5n) {
        /*border:1px solid #42d0c3;
        background-color:rgba(66, 208, 195, .2);
        color: #42d0c3;*/
    }
    .dashboard-area .dashboard-list-container > a:nth-child(6n) {
        /*border:1px solid #c863ca;
        background-color:rgba(200, 99, 202, .2);
        color: #c863ca;*/
    }


    .dashboard-area .dashboard-list-container > a .dashboard-form-area {
        margin-top:6px;
    }

    .dashboard-area .dashboard-list-container > a .dashboard-form-area .btn {
        padding: 2px 10px;
    }


    .dashboard-area .dashboard-list-container > a .dashboard-form-area .form-horizontal .control-label {
        font-size: 13px;
        font-weight: normal;
    }
    .dashboard-area .dashboard-list-container > a .dashboard-form-area .form-horizontal input[type=date].form-control, .dashboard-area .dashboard-list-container > a .dashboard-form-area .form-horizontal input[type=time].form-control, .dashboard-area .dashboard-list-container > a .dashboard-form-area .form-horizontal input[type=datetime-local].form-control, .dashboard-area .dashboard-list-container > a .dashboard-form-area .form-horizontal input[type=month].form-control {
        line-height: 30px;
    height: 30px;
    }
















    .dashboard-area .dashboard-list-container > a div.dashboard-list-details p {
            color:#3f3f3f;
        }

.dashboard-area .dashboard-list-container > a div.dashboard-list-icon {
    background-color:#ccc;
    color:#fff;
    padding:3px;
    margin:10px auto;
    text-align:center;
    border-radius:50%;
    font-size:25px;
    width:50px;
    height:50px;
    display: flex;
    justify-content: center;
    align-items: center
}

    .dashboard-area .dashboard-list-container > a:nth-child(n) div.dashboard-list-icon{
        border:1px solid #4396d8;
        background-color:#fff;
        color:#4396d8;
    }
    .dashboard-area .dashboard-list-container > a:nth-child(2n) div.dashboard-list-icon{
        border:1px solid #5fb962;
        background-color:#fff;
        color:#5fb962;
    }
    .dashboard-area .dashboard-list-container > a:nth-child(3n) div.dashboard-list-icon{
        border:1px solid #ea5b50;
        background-color:#fff;
        color:#ea5b50;
    }
    .dashboard-area .dashboard-list-container > a:nth-child(4n) div.dashboard-list-icon{
        border:1px solid #f7a021;
        background-color:#fff;
        color:#f7a021;
    }
    .dashboard-area .dashboard-list-container > a:nth-child(5n) div.dashboard-list-icon{
        border:1px solid #42d0c3;
        background-color:#fff;
        color:#42d0c3;
    }
    .dashboard-area .dashboard-list-container > a:nth-child(6n) div.dashboard-list-icon{
        border:1px solid #c863ca;
        background-color:#fff;
        color:#c863ca;
    }

    
/*Draggable*/
#draggableDiv {
        position: fixed;
        z-index: 999;
        text-align: right;
        min-width: 250px;
        max-width: 400px;
        -webkit-border-top-left-radius: 5px;
        -webkit-border-bottom-right-radius: 5px;
        -moz-border-radius-topleft: 5px;
        -moz-border-radius-bottomright: 5px;
        border-top-left-radius: 5px;
        border-bottom-right-radius: 5px;
        padding: 5px 2px;
        border: 1px solid #eee;
        background-color: #fff;
 }
 #draggableDiv .fa{
        position: absolute;
        top: 0px;
        right: 0px;
        background-color: #f1f1f1;
        height: 16px;
        width: 16px;
        line-height: 15px;
        border-radius: 50%;
        color: #908888;
        font-size: 10px !important;
        text-align: center;
		cursor: pointer;
 }
 
 #draggableDivBody {
        padding: 15px 10px;
        cursor: move;
        z-index: 10; 
        text-align: left;
        -webkit-border-top-left-radius: 5px;
        -webkit-border-bottom-right-radius: 5px;
        -moz-border-radius-topleft: 5px;
        -moz-border-radius-bottomright: 5px;
        border-top-left-radius: 5px;
        border-bottom-right-radius: 5px;
 }

 #draggableDiv.success {
		color: #3c763d;
		background-color: #dff0d8;
		border-color: #d6e9c6;
    } 

    #draggableDiv.success .fa {
        background-color: #dff0d8;
        color: #3c763d;
    }

	#draggableDiv.success .fa:hover {
		background-color: #3c763d;
        color: #dff0d8;		
    }

    #draggableDiv.error {
	        color: #a94442;
            background-color: #f2dede;
            border-color: #ebccd1;
    }

	#draggableDiv.error .fa {
		background-color: #f2dede;
		color: #a94442;
	}

	#draggableDiv.error .fa:hover {
		background-color: #a94442;
        color: #f2dede;		
    }	

    #draggableDiv.info {
	        color: #31708f;
            background-color: #d9edf7;
            border-color: #bce8f1;
    }

	#draggableDiv.info .fa {
		background-color: #d9edf7;
		color: #31708f;
	}

	#draggableDiv.info .fa:hover {
		background-color: #31708f;
        color: #d9edf7;		
    }	


	#draggableDivBody p {
		padding-bottom: 5px;
		/*border-bottom: solid 1px #b1b1b1;*/
	}


.main-image {
  width: 100%;
  height:40%;
}
.carousel-thumbs {
  list-style: none;
  padding: 0;
}
.carousel-thumb {
  background-size: cover; 
  background-position: center; 
  height: 100px; 
  float: left;
  text-align: center;
  color: #fff;
  text-shadow: 0 1px 2px rgba(0,0,0,.6);
  cursor: pointer;
}


    .dashboard-area .dashboard-list-container > a div.dashboard-list-details {
        line-height: 22px;
        font-size:15px;
        font-weight:600;
    }


    .dashboard-area .dashboard-list-container > a div.dashboard-list-details p {
        margin-bottom:0;
        margin:5px 0;
        font-size: 15px;
    }



    .dashboard-area .dashboard-list-container > a div.dashboard-list-icon i {
        text-align:center;
        line-height: 36px;
    }

	.dashboard-area .dashboard-list-container > a div.dashboard-list-icon > span {
		font-size: 28px;
	}


@media (max-width: 900px) {

    .dashboard-area .dashboard-list-container {
        /*flex-direction: column;*/
    }
    .dashboard-area .dashboard-list-container > a {
        width:100%;
    }
    .dashboard-area .dashboard-list-container > a div.dashboard-list-details {
        line-height: 20px;
        font-size: 18px;
    }



}






/*------------Dassbord area 27032019----------------*/
/*24052019*/

/*Bootstrap*/
.carousel-control.left, .carousel-control.right {
    background-image: none !important;
    background-image: none !important;
    background-image: none !important;
    background-image: none !important;
    filter: none !important;
    background-repeat: repeat-x;
        color: #000;
}




.btn.btn-default.form-control.ui-select-toggle {
	margin: 0;
	padding-left:5px;
}

.sec-cusmr .btn.btn-default.form-control.ui-select-toggle {
	margin-bottom: 0;
	padding-left:5px;
}
	.btn.btn-default.form-control.ui-select-toggle:hover, .btn.btn-default.form-control.ui-select-toggle:focus {
		background-color: transparent;

	}



.ui-select-match:focus {
	outline:none;
}



/*Bootstrap*/

.topslider h3.main-image {
    color:orange;
    line-height:45px;
}
.topslider .carousel-caption p {
    color:#3f3f3f;
}
.topslider .carousel-caption {
        text-shadow: none;
}
.topslider .carousel-inner {
    background-image:url(/images/slider_bg.png);
    background-size: cover;
    background-position: center center;
    height: 200px;
}
.topslider .carousel-inner > div {
    height:100%;
}






.panel-heading {
    padding: 5px;
}


.dashboard-area-karma {
    padding: 0 15px;
    height:100%;
    overflow-y:auto;
}

.dashboard-list-details .form-group {
    text-align:left;
}
.dashboard-list-details .form-group label {
    font-weight: 400;
}

.dashboard-list-details .form-group input.form-control {
    height: 26px !important;
}
.dashboard-list-details .btn {
    padding: 3px 10px;
}


.search-area-sales {
    background-color: #b9b9b9;
    padding: 8px;
    margin-top: 10px;
}


.sales-order-list .table p{
    margin-bottom: 2px;
}


.sales-order h2 {
    border-bottom: 1px solid #f1f1f1;
    padding-bottom: 5px;
    margin-bottom: 5px;
}

.order-area {
    display:flex;
    flex-direction: row;
    justify-content: space-between;
}
.order-area .comp_name, .order_date {
    padding:10px;
    width: 300px;
}

    .order-area .comp_name .comp_name_head, .order_date .order_date_head {
        font-size:13px;
        border-bottom: 1px solid #ccc;
        font-weight: 500;
    }

.order-area-details {
    display:flex;
    flex-direction: column;
}


.order-area-footer {
    border-top: 1px solid #f1f1f1;
    padding-top: 5px;
    margin-top: 10px;
}

.order-details-area {
    display:flex;
    flex-direction: row;
    justify-content: space-between;
}

.order-details-area > div {
    padding:10px;
    max-width: 300px;
}
.order-details-area .billing-details {
 
}
.order-details-area .shiping-details {


}
.order-details-area .billing-details .billing-head {
    border-bottom: 1px solid #ccc;
        margin-bottom: 10px;
    padding-bottom: 5px;
 
}
.order-details-area .shiping-details .shiping-head {
    border-bottom: 1px solid #ccc;
        margin-bottom: 10px;
    padding-bottom: 5px;

}
.net-amount {
    display:flex;
    flex-direction: row;
    justify-content: flex-end;
}

.net-amount > div {
    padding:0;
    max-width: 500px;
    display: flex;
    align-items: center;
}
.net-amount > div h4 {
    padding-right:10px;
}

.net-amount > div h3 {
        margin-top: 10px;
    }


.seles_pro_nam {
    margin:0;
    font-size:13px;
    color:#095aa5;
    font-weight: 600;
}
.seles_pro_nam_sub {
    margin:0;
    font-size:11px;
}


.top-menu {
    display:block;
}
.top-menu > ul {
    margin:0;
    padding:0;
}
.top-menu > ul > li {
    margin:0;
    padding:0;
    list-style-type:none;
    float:left;
    
}

.top-menu > ul > li a {
    color:#3f3f3f;
    padding: 10px 10px 6px 10px;
    margin:0 2px;
    display: block;
    transition:all 0.5s;
    border-bottom: 2px solid transparent;
}
.top-menu > ul > li a:hover, .top-menu > ul > li a:focus, .top-menu > ul > li.active a {
    color:#42d0c3;
    border-bottom:2px solid #42d0c3;
    text-decoration:none;
}


/*Template Loading*/

.template_loading {  
	text-align: center;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    background-color: rgba(255, 255, 255, 0.4);
    z-index: 999;

}
span.template_loading_area {
	position: absolute;
    width: 70px;
    top: 50%;
    left: 50%;
    margin-top: -11px;
    margin-left: -35px;
}
.template_loading span div {
  width: 15px;
  height: 15px;
  margin-right:5px;
  background-color: #20aafb;
  border-radius: 100%;
  display: inline-block;
  -webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both;
  animation: sk-bouncedelay 1.4s infinite ease-in-out both;
}

.template_loading .template_loading_bounce1 {
  -webkit-animation-delay: -0.32s;
  animation-delay: -0.32s;
}

.template_loading .template_loading_bounce2 {
  -webkit-animation-delay: -0.16s;
  animation-delay: -0.16s;
}

@-webkit-keyframes sk-bouncedelay {
  0%, 80%, 100% { -webkit-transform: scale(0) }
  40% { -webkit-transform: scale(1.0) }
}

@keyframes sk-bouncedelay {
  0%, 80%, 100% { 
    -webkit-transform: scale(0);
    transform: scale(0);
  } 40% { 
    -webkit-transform: scale(1.0);
    transform: scale(1.0);
  }
}

/*Template Loading*/

/*Larg Loader*/

.loading_lrg {  
	text-align: center;
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    background-color: rgba(255, 255, 255, 0.4);
    z-index: 999;

}
span.loading_lrg_area {
	position: absolute;
    width: 115px;
    top: 50%;
    left: 50%;
    margin-top: -15px;
    margin-left: -57px;
}
.loading_lrg span div {
  width: 25px;
  height: 25px;
  margin-right:8px;
  background-color: #20aafb;
  border-radius: 100%;
  display: inline-block;
  -webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both;
  animation: sk-bouncedelay 1.4s infinite ease-in-out both;
}

.loading_lrg .loading_lrg_bounce1 {
  -webkit-animation-delay: -0.32s;
  animation-delay: -0.32s;
}

.loading_lrg .loading_lrg_bounce2 {
  -webkit-animation-delay: -0.16s;
  animation-delay: -0.16s;
}

@-webkit-keyframes sk-bouncedelay {
  0%, 80%, 100% { -webkit-transform: scale(0) }
  40% { -webkit-transform: scale(1.0) }
}

@keyframes sk-bouncedelay {
  0%, 80%, 100% { 
    -webkit-transform: scale(0);
    transform: scale(0);
  } 40% { 
    -webkit-transform: scale(1.0);
    transform: scale(1.0);
  }
}

/*Larg Loader*/


/*24052019*/

/*29072019 start*/



 .order_area_list {
        /*display: flex;*/
        flex-direction: column;
        flex-wrap: wrap;
        padding:0 15px;
    }

.order_head {
    padding:0 15px;
}



    .order_area_list.order_area_list_product {
        flex-direction: row;
    }

   


    .order_head .form-group {
        margin-bottom: 5px;
        margin-top: 5px;
        margin-left: 0;
        margin-right: 0;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    .product_details .form-inline .form-group {
        display: inline-block;
        margin-right: 0px;
        margin-left: 0;
        margin-bottom: 5px;
    }

    .product_list {
        display: flex;
        flex-direction: row;
        /* padding-bottom: 5px; */
        border: 1px solid #eee;
        /* border-right: 1px solid #eee; */
        margin-bottom: 5px;
        margin-right: 5px;
        width: calc(50% - 5px);
        padding: 15px;
    } 
    
    .order_area_list.order_area_list_product .product_list {
        width: calc(25% - 5px);
    }

    .product_list.product_list_order {
        width:100%;
    }
    .product_list.product_list_order .product_details {
        width: 100%;
    }
    .product_details .table > tbody > tr > td, .product_details .table > tbody > tr > th, .product_details .table > tfoot > tr > td, .product_details .table > tfoot > tr > th, .product_details .table > thead > tr > td, .product_details .table > thead > tr > th {
        font-size: 14px;
        
    }

    .product_details .table > thead > tr > th {
    }

    .seles_pro_nam {
        font-size: 15px;
        margin-bottom: 8px;
    }

    .seles_pro_nam_sub {
        margin: 0;
        font-size: 13px;
        margin-bottom: 5px;
    }

    span.product_img {
        height: 100px;
        width: 100px;
        display: block;
        background-repeat: no-repeat;
        background-size: contain;
        background-position: center center;
        background-color: #ffffff;
        border: solid 0px #f1f1f1;
        cursor:pointer;
    }




    .order_area_footer {
        display: flex;
        justify-content: flex-end;
    }

    .order_area_footer .confirm_order {
        display: flex;
        justify-content: flex-end;
        width: 100%;
    }

    .order_area_footer .confirm_order h4 {
        color: #000;
        margin: 0;
        margin-right: 10px;
    }

    .order_area_footer .confirm_order h4 i {
            margin-right:5px;
    }

    .order_area_footer .confirm_order h4 span.price_details {
        display: block;
        font-size: 12px;
        color: #095aa5;
    }

    .product_code {
        color: #095aa5 !important;
    }

    .order-search-area .order-search-btn {
        display: none;
    }


    @media (max-width: 1024px) {


        .order_area {
            height: 100%;
            display: flex;
            flex-direction: column;
        }

            .order_area h3 {
            }

        .order_area_list {
            flex: 1;
            overflow-y: auto;
			flex-direction: column;
            /*display: unset;*/
            flex-wrap: wrap;
        }

        .order_head {
            border-bottom: 1px solid #ccc;
            margin-bottom: 5px;
            padding:0 15px;
        }
        .order_head .back-btn {
            margin-right: 10px;
            width: 20px;
            height: 14px;
            text-align: center;
            vertical-align: middle;
        }
        .order_area_footer {
            padding-top: 5px;
            display: flex;
            justify-content: flex-end;
            border-top: 1px solid #ececec;
        }







        .order_head .form-group {
            margin-bottom: 5px;
            margin-top: 5px;
            margin-left: 0;
            margin-right: 0;
            display: flex;
            align-items: center;
        }

            .order_head .form-group .form-control {
                padding: 2px 0;
                font-size: 12px;
            }

        .product_list, .order_area_list.order_area_list_product .product_list {
            display: flex;
            flex-direction: row;
            padding: 0;
            padding-bottom: 5px;
            border: none;
            border-bottom: 1px solid #eee;
            margin-bottom: 5px;
            width: 48%;
        }

        .sec-cusmr {
            width: 100%;
            /*max-width: 185px;*/
            margin: 0 5px;
        }
        .ui-select-bootstrap .ui-select-match-text {
            padding-right: 22px;
        }


        span.product_img {
            max-width: 100%;
            max-height: 100%;
        }

        .product_details {
            position: relative;
            width: 70%;
            display: flex;
            flex-direction: column;
            justify-content: center;
        }

        .product_list:last-child {
            border-bottom: none;
        }

        .product_pic {
            margin-right: 10px;
            width:30%;
        }


        .product_details .seles_pro_nam {
            margin: 0 0 5px 0;
            font-size: 13px;
            color: #095aa5;
            font-weight: 600;
            /*padding-right:50px;*/
            max-height: 44px;
            overflow: hidden;
            text-overflow: ellipsis;
            -webkit-line-clamp: 2;
            display: -webkit-box;
            -webkit-box-orient: vertical;
            display: flex;
            justify-content: space-between;
            align-items: start;
        }

        .product_details .seles_pro_nam_sub {
            margin: 0 0 5px 0;
            font-size: 11px;
            color: #000;
            max-height: 44px;
            overflow: hidden;
            text-overflow: ellipsis;
            -webkit-line-clamp: 2;
            display: -webkit-box;
            -webkit-box-orient: vertical;
            font-weight: 400;
        }

        .inr_icon {
            font-size: 14px;
        }


        .order_area .order_area_footer .btn {
            margin-bottom: 0;
        }



        #draggableDiv.success {
            left: 10px;
        }



        .order_head .form-group .control-label {
            /*width: 100px;*/
        }


		.order_head .form-group span.cust_name {
		    
		    font-size: 12px;
		    width: 100%;
		    text-align: right;
			display: flex;
			flex-direction: column;
			align-items: flex-end;
		}

		.order_head .form-group span.cust_name .cust_name_head {
			    margin-bottom: 0;
			    color: #8e8e8e;
			    font-weight: 400;
		}


            .order_head .form-group .control-label.btn_back {
                width: 50px;
                color: #095aa5;
            }

        /*.product_list {
            width: 99% !important;
        }*/



        .order_area_list h2 {
            line-height: initial;
            font-size: 18px;
            text-align: center;
            margin: 0;
            height: auto;
        }

        .product_details .table-bordered > tbody > tr > td, .product_details .table-bordered > tbody > tr > th, .product_details .table-bordered > tfoot > tr > td, .product_details .table-bordered > tfoot > tr > th, .product_details .table-bordered > thead > tr > td, .product_details .table-bordered > thead > tr > th {
            border: 1px solid #f1f1f1;
        }


        .product_details .form-group {
            margin-right: 0;
            margin-left: 0;
        }

        .product_details .form-inline .form-group {
            display: inline-block;
            margin-right: 0px;
            margin-bottom: 5px;
        }

        .product_details .form-inline label {
            display: inline-block !important;
            max-width: 100%;
            margin-bottom: 0 !important;
            margin-right: 5px;
            font-size: 12px;
            font-weight: normal !important;
            color: #000;
        }

        .product_details .form-inline .form-control {
            height: 24px;
            max-width: 50px;
            padding: 2px;
        }

        .product_details .form-control-static {
            min-height: 24px;
            padding-top: 3px;
            padding-bottom: 3px;
        }

        .order-search-area .order-search-btn {
            display: block;
            margin-bottom: 0;
            width: 30px;
            height: 30px;
            padding: 6px;
            border-radius: 50%;
        }
        .order-search {
            display: none;
            position: absolute;
            max-width: 100%;
            padding: 2px 12px !important;
            right: 0;
            border-width: 4px;
            left: 0;
            top: 42px;
            z-index: 9;
            font-size: 14px !important;
            height: 40px;
            transition: all .5s;
        }

        .order-search-btn ~ .order-search.active {
            display: block;
        }

        .order-filter-area .order-filter-btn {
            display: block;
            margin-bottom: 0;
            width: 30px;
            height: 30px;
            padding: 6px;
            border-radius: 50%;
        }
            .order-filter-area .order-filter-btn i {
                line-height:16px;
            }

        .product_details .table {
            margin-bottom: 0;
        }

            .product_details .table > tbody > tr > td, .product_details .table > tbody > tr > th, .product_details .table > tfoot > tr > td, .product_details .table > tfoot > tr > th, .product_details .table > thead > tr > td, .product_details .table > thead > tr > th {
                font-size: 11px;
                font-weight: normal;
                padding: 3px;
                /*white-space: nowrap;*/
                color: #000;
            }





        .product_details .table-bordered {
            border: none;
        }

            .product_details .table-bordered > thead > tr > th {
                border: none;
                font-size: 12px;
                color: #757575;
            }

		.ui-select-placeholder {
			line-height: 16px;
		}
		.ui-select-bootstrap .ui-select-match-text span {
			line-height: 16px;
		}

		.sec-cusmr .ui-select-placeholder {
			line-height: 25px;
		}
		.sec-cusmr .ui-select-bootstrap .ui-select-match-text span {
			line-height: 25px;
		}
    }


/*lightbox*/

.product_pic label[for] { cursor: pointer; }
.product_pic input[type='checkbox'] { display: none; }

.product_pic .lightbox{ width: 100%; position: fixed; top: 0; left: 0; }

.product_pic .lightbox-grid { width: 100%;  }

.product_pic .lightbox {
z-index: 1;
min-height: 100%;
overflow: auto;
transform: scale(0);
/*background-color: rgba(255, 255, 255, 0.5);*/
transition: transform .5s ease-out;
}

.product_pic .lightbox img {
background: #fff;
padding: 10px;
position: fixed;
top: 50%;
left: 50%;
max-width: 96%;
max-height: 96%;
transform: translate(-50%, -50%);
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
}

.product_pic input[type='checkbox']:checked + .lightbox { transform: scale(1); }
.product_pic input[type='checkbox']:checked ~ .lightbox-grid { opacity: 0.125; }

/*lightbox*/





    /*31072019 end*/

 /*07082019 start*/

    .white-space {
        white-space:normal !important;
    }

    .order_area.spa_app {
        padding: 10px 0 0 0;
    }

    .order_area.spa_app .order_area_footer .confirm_order {
        justify-content: flex-end;
    }

    .order_area.spa_app .order_head {
        display: flex;
        flex-direction: row;
        align-items: center;
        /*justify-content: space-between;*/
        justify-content: flex-start;
        padding-bottom: 10px;
    }

    .order_area.spa_app .order_head h4 {
        margin-top: 0px;
        margin-bottom: 0;
        font-size:16px;

    }

    .order_area.spa_app .product_details {
        width: 100%;
        display: flex;
    }

    .order_area.spa_app .product_details_accordion {
        width: 100%;
    }

    .order_area.spa_app .product_details_accordion .comp_area {
        display: flex;
        flex-direction: row;    
        align-items: center;  
        width: calc(100% - 15px); 
    }

    .order_area.spa_app .product_details_accordion .comp_area .comp_detl {
        display: flex;
        flex-direction: column;
        width:70%;
    }

    .order_area.spa_app .product_details_accordion .comp_area .comp_amut {
       /*margin-top:7px;*/
       width:30%;
       text-align:right;
    }

    .order_area.spa_app .product_details_accordion .comp_area .comp_amut i {
        width: inherit !important;
    }

    .spa_app .product_details_accordion .panel-group .panel {
        position: relative;
    }

    .spa_app .product_details_accordion .panel-group .panel .panel-body {
        padding: 5px;
    }

    .spa_app .product_details_accordion .panel-group .panel .panel-body .table {
        margin-bottom: 0;
    }

    .spa_app .product_details_accordion .panel-group .panel .panel-body .checkbox label {
        padding-left: 10px;
        padding: 3px 5px;
    }

    .spa_app .product_details_accordion .panel-group .panel .panel-heading {
        background-color: #fff;
    }


    .spa_app .product_details_accordion .panel-group .panel .panel-heading h4.panel-title {
        font-size: 12px;
        font-weight: 400;
    }

    .spa_app .product_details_accordion .panel-group .panel .panel-heading h4.panel-title > a.accordion-toggle:focus, .spa_app .product_details_accordion .panel-group .panel .panel-heading h4.panel-title > a.accordion-toggle:hover {
        outline: none;
        text-decoration: none;
    }

    .spa_app .product_details_accordion .panel-group .panel .panel-heading h4.panel-title > a.accordion-toggle {
        line-height: 18px;
    }

    .spa_app .product_details_accordion .panel-group .panel .panel-heading h4.panel-title > a.accordion-toggle > span {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
    }

    .spa_app .product_details_accordion .panel-group .panel .panel-heading h4.panel-title > a.accordion-toggle > span i {
        width: 12px;
        text-align: center;
    }

    .spa_app .product_details_accordion .panel-group .panel .panel-heading h4.panel-title .pro-accd-c-name {
        color: #212121;
        font-size: 14px;
        font-weight: 500;
    }

    .spa_app .product_details_accordion .panel-group .panel .panel-heading h4.panel-title .pro-accd-c-nmbr {
        font-size: 14px;
        color: #848484;
        font-weight: 400;
        margin-top: 4px;
    }

    .spa_app .product_details_accordion .panel-group .panel .panel-heading h4.panel-title .pro-accd-c-amut {
        font-size: 14px;
        color: #337ab7;
    }

    .spa_app .product_details_accordion .panel-group .panel .panel-heading h4.panel-title .pro-accd-c-amut i {
        width: 16px;
        text-align: center;
    }

    .spa_app .product_details_accordion .panel-group .panel .panel-heading h4.panel-title .pro-accd-c-spa .my_approve {
        margin-right:5px;
    }
    .spa_app .product_details_accordion .panel-group .panel .panel-heading h4.panel-title .pro-accd-c-spa .my_approve .approve {        
        color:green;
    }
    .spa_app .product_details_accordion .panel-group .panel .panel-heading h4.panel-title .pro-accd-c-spa .my_approve .not_approve {
        color:red;
    }




    /*checkbox*/

    .spa_app .order_head .checkbox{
        padding-top: 0;
    }
    .spa_app .order_head .checkbox label {
        padding-left:10px;
    }

    .spa_app .order_head .badgebox {
        opacity: 0;
    }

    .spa_app .order_head .badgebox + .badge{
        text-indent: -999999px;
        width: 20px;
        color: #333;
        border: 1px solid #333;
        background-color: #fff;
        border-radius:0;
        margin-left: 4px;
        padding: 3px;
    }

    .spa_app .order_head .badgebox:focus + .badge {
        box-shadow: inset 0px 0px 5px;
    }

    .spa_app .order_head .badgebox:checked + .badge {
        text-indent: 0;
    }

   
    .spa_app .product_details_accordion .panel-group .panel .ctsm-checkbox input {
        padding: 0;
        height: initial;
        width: initial;
        margin-bottom: 0;
        display: none;
        cursor: pointer;
    }

    .spa_app .product_details_accordion .panel-group .panel .ctsm-checkbox label {
        position: relative;
        cursor: pointer;
        margin-bottom:0;
    }

    .spa_app .product_details_accordion .panel-group .panel .ctsm-checkbox label:before {
        content: '';
        -webkit-appearance: none;
        background-color: transparent;
        border: 2px solid #0079bf;
        box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), inset 0px -15px 10px -12px rgba(0, 0, 0, 0.05);
        padding: 8px;
        display: inline-block;
        position: relative;
        vertical-align: middle;
        cursor: pointer;
        margin-right: 10px;
    }

    .spa_app .product_details_accordion .panel-group .panel .ctsm-checkbox input:checked + label:after {
        content: '';
        display: block;
        position: absolute;
        top: 2px;
        left: 7px;
        width: 6px;
        height: 12px;
        border: solid #0079bf;
        border-width: 0 2px 2px 0;
        transform: rotate(45deg);
    }


    /*checkbox end*/


.login-stat{text-align:center; margin-top:10px;}

    @media (max-width: 767px) {
        .spa_app .order_area_list .checkbox {
            margin-top: 0;
            margin-bottom: 10px;
            padding-top: 0;
        }
    }


    /*07082019 end*/




    
            .order_area_footer.order_area_type {                
                display:none;
            }
            .order_area_footer.order_area_type.in {
               display:flex;
            }

            .order_area_footer.order_area_type {
                justify-content: center;
                border-top: none;
                border-bottom: 1px solid #ececec;
                margin-bottom: 5px;
                padding-top: 0;
                position: fixed;
                background-color: rgba(0, 0, 0, 0.5);
                top: 0;
                right: 0;
                bottom: 0;
                left: 0;
                z-index: 9999;
                top: 0;
                left: 0;
                
            }

            .order_area_type_modal {
                position: absolute;
                width: 40%;
                background-color: #fff;
                padding: 0;                
                top: 5%;
                border-radius:5px;
                display: flex;
                flex-direction: column;
                
            }

            .order_area_type_modal_head {
                display: flex;
                flex-direction: row;
                justify-content: space-between;
                font-size: 15px;
                font-weight: 600;
                border-bottom: 1px solid #e8e8e8;
                padding: 5px 10px;
            }

            .order_area_type_modal_body {
                padding: 10px;
                min-height: 200px;
            }

            .order_area_type_modal_footer {
                padding: 5px 10px;
                text-align: right;
                border-top: 1px solid #e8e8e8;
            }
            .order_area_type_modal_footer .btn {
                padding: 3px 20px;
            }




.modal-body.product_pic_popup {
    padding: 4px;
}


.modal.in .modal-dialog.modal-popup {
    max-width:70%;
}

.modal.in .modal-dialog.modal-popup h4.modal-header {
    font-size: 14px;
}



.seles_pro_nam span.seles_pro_nam_desc {
    margin-left: 10px;
    color: #000;
    padding: 4px;
    cursor:pointer;
}


.modal-dialog.modal-popup .modal-content h4.modal-title {
    font-size: 16px;
}

.modal-dialog.modal-popup .modal-content .modal-header {
    padding: 8px 10px;
}



/*18102019 Outanding--------------*/
.order_head.order-os-area {
    display: flex;
    justify-content: space-between;
    align-items: center;
}


	.order_head.order-os-area .order-os .btn {
		margin-bottom:0;
	}

/*22102019 Edit Menoreceipt*/

.order-os {
    display: flex;
}

.memo_edit {
    background-color: #56a2f1;
    border-radius: 50%;
    width: 35px;
    height: 35px;
    color: #fff;
    text-align: center;
    margin-left: 6px;
	cursor:pointer;
}
.memo_edit i {
line-height: 35px;
}


.edit_del {
	    text-align: center;
}
.edit_del span {
	padding:4px;
	margin:2px;
	cursor:pointer;
	font-size: 14px;
}
.edit_del .del {
	color: #fb0000;
}
.edit_del .edit {
	color: #0089ff;
}





.order_head .back-btn {
    margin-right: 10px;
    width: 20px;
    height: 14px;
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
}




.select_search_area {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.select_search_area .ui-select-container {
    width: calc(100% - 70px);
}

.select_search_area .search_btn{
    margin-bottom: 0;
    padding: 5px 12px;
}
.select_search_area .ui-select-bootstrap .ui-select-choices-row > span {
    padding: 3px;
}















/*--------------------------Responsive screen (portrait and landscape) ----------------------- */


#printSectionId {
    display: none;
    
}

@media print {

    .page-break {
        display: block;
        page-break-before: always;
    }
}



@media (max-width:1400px) {
    /*.book_list_others_details {
        width: 70%;
        margin: 0 auto;
    }

    ul.seclect_class.clearfix {
        width: 70%;
    }*/
}


@media (max-width:1366px) {
    .dashboard-area .dashboard-list-container > a {
        width: 22%;
    }
}

@media (max-width:1350px) {
    .flex-container > div {
        margin: 5px;
        width: 20%;
        padding: 18px;
    }

    .dashboard-area .dashboard-list-container > a {
        width:30%;
    }





}

@media (max-width:1280px) {
    .student_otherInfo_area label.editable {
        width: 40%;
    }

    .student_otherInfo_area input.editable {
        width: 58%;
    }
}

@media (max-width:1200px) {

    .certificate_item {
        width: 22%;
    }

    .categoryCertifiBody .categoryCertifi_Item {
        width: calc(25% - 10px);
    }

        .categoryCertifiBody .categoryCertifi_Item .imageBox {
            height: 125px;
        }
}

@media (max-width:1024px) {

     .Parsonal_body_area {
        max-width: 100%;
        margin: 0 auto;
    }


    .book_list_details_class_seclect ul.seclect_class li {
        width: 100%;
        height: auto;
    }



    ul.seclect_class.clearfix {
        width: 100%;
    }

    .book_list_others_details {
        width: 100%;
    }

    .dashboard-area-karma {
        padding: 0 15px;
        height:100%;
        overflow-y: auto;
        display: flex;
        align-items: center;
        background-color: #f9f9f9;
    }   



}

@media (max-width:900px) {
    .flex-container > div {
        width: 30%;
    }

    .attendance_abesent_area .media .media-left {
        width: 70px;
    }

    .attendance_abesent_area .media-body {
        width: calc(100% - 77px);
    }

    .attendance_area ul.attendance_month_list li {
        width: 48%;
    }
}


@media (max-width:786px) {

    .certificate_item {
        width: 31%;
    }

    .categoryCertifiBody .categoryCertifi_Item {
        width: calc(50% - 10px);
    }
}



@media (min-width: 769px) {
    .holiday-flex-container {
        position: relative;
    }

    .holiMonth {
        height: 20%;
        font-size: 22px;
        padding: 10px;
        display: -webkit-box;  display: -webkit-flex; display: -ms-flexbox;  display: flex;
        -webkit-box-orient: vertical;  -webkit-box-direction: normal;  -webkit-flex-direction: column; -ms-flex-direction: column;   flex-direction: column;
        -webkit-box-align: center;  -webkit-align-items: center;  -ms-flex-align: center;  align-items: center;
        -webkit-box-pack:center;  -webkit-justify-content: center;  -ms-flex-pack:center;  justify-content: center;
        background-color: #efefef;/*#ffd100*/
    }
    
       
    .holiday-flex-container > div:nth-of-type(n) .holiMonth {
        border-bottom: solid 3px rgb(219, 153, 228);
        background-color: rgba(219, 153, 228, .04);
        color: rgb(219, 153, 228);
    }
    .holiday-flex-container > div:nth-of-type(2n) .holiMonth {
        border-bottom: solid 3px rgb(241, 141, 71);
        background-color: rgba(241, 141, 71, .04);
        color: rgb(241, 141, 71);
    }
    .holiday-flex-container > div:nth-of-type(3n) .holiMonth {
        border-bottom: solid 3px rgb(92, 97, 191);
        background-color: rgba(92, 97, 191, .04);
        color: rgb(92, 97, 191);
    }
    .holiday-flex-container > div:nth-of-type(4n) .holiMonth {
        border-bottom: solid 3px rgb(82, 173, 208);
        background-color: rgba(82, 173, 208, .04);
        color: rgb(82, 173, 208);
    }
    .holiday-flex-container > div:nth-of-type(5n) .holiMonth {
        border-bottom: solid 3px rgb(60, 171, 49);
        background-color: rgba(60, 171, 49, .04);
        color: rgb(60, 171, 49);
    }
    .holiday-flex-container > div:nth-of-type(6n) .holiMonth {
        border-bottom: solid 3px rgb(236, 192, 57);
        background-color: rgba(236, 192, 57, .04);
        color: rgb(236, 192, 57);
    }
    .holiday-flex-container > div:nth-of-type(7n) .holiMonth {
        border-bottom: solid 3px rgb(206, 73, 73);
        background-color: rgba(206, 73, 73, .04);
        color: rgb(206, 73, 73);
    }
    .holiday-flex-container > div:nth-of-type(8n) .holiMonth {
        border-bottom: solid 3px rgb(139, 195, 74);
        background-color: rgba(139, 195, 74, .04);
        color: rgb(139, 195, 74);
    }


    .holiday-flex-container > div:nth-of-type(n) .holiDates .holiDays {
        border: solid 1px rgba(219, 153, 228, .4);
    }
    .holiday-flex-container > div:nth-of-type(2n) .holiDates .holiDays {
        border: solid 1px rgba(241, 141, 71, .4);
    }
    .holiday-flex-container > div:nth-of-type(3n) .holiDates .holiDays {
        border: solid 1px rgba(92, 97, 191, .4);
    }
    .holiday-flex-container > div:nth-of-type(4n) .holiDates .holiDays {
        border: solid 1px rgba(82, 173, 208, .4);
    }
    .holiday-flex-container > div:nth-of-type(5n) .holiDates .holiDays {
        border: solid 1px rgba(60, 171, 49, .4);
    }
    .holiday-flex-container > div:nth-of-type(6n) .holiDates .holiDays {
        border: solid 1px rgba(236, 192, 57, .4);
    }
    .holiday-flex-container > div:nth-of-type(7n) .holiDates .holiDays {
        border: solid 1px rgba(206, 73, 73, .4);
    }
    .holiday-flex-container > div:nth-of-type(8n) .holiDates .holiDays {
        border: solid 1px rgba(139, 195, 74, .4);
    }


    .holiMonth i {
        font-size: 14px;
        font-weight: 600;
        color: #000;
    }

    .holiDates {
        display: -webkit-box;  display: -webkit-flex; display: -ms-flexbox;  display: flex;
        -webkit-box-orient: vertical;  -webkit-box-direction: normal;  -webkit-flex-direction: column; -ms-flex-direction: column;   flex-direction: column;
        font-size: 18px;
        padding: 0 5px;
        max-height: calc(100% - 20%);
        overflow-y: auto;
        border: solid 1px #efefef;
    }

    .holiDates span {
        text-align: center;
        padding-top: 15px;
        padding-bottom: 15px;
        margin-top: 15px;
        /*background-color: rgba(0, 0, 0, .05);*/
        box-shadow: inset 0px 0px 15px 0px #efefef;
        font-weight: 900;
        /*border: solid 1px rgb(236, 192, 57);*/
    }

    .holiDates span:last-child {
        margin-bottom: 5px;
    }

    .holiDates span i {
        font-size: 12px;
        font-weight: 600;
        display: block;
        padding: 0 10px;
    }

    /*.holiDates span i::after {
        content: 'day ';
    }*/

    .attendance_body .row {
        text-align: center;
    }


    .attendance_body .row > div:nth-of-type(2) {
        display: inline-block;
        float: right;
    }

    .attendance_body .row > div {
        display: inline-block;
        float: unset;
    }


    .categoryCertifiHead .back {
        display: none;
    }






}



@media (max-width:768px) {

    /* Scroll */

    /* width */
    ::-webkit-scrollbar {
        width: 0px;
        height: 0px;
    }
    /* Scroll */



    .know {
        float: right;
        display: none;
    }



    .dateDuration {
        text-align: unset;
    }




    .listNumbering {
        /*margin-left: -10px;*/
        font-size: 16px;
    }

    .student_otherInfo_area label.editable {
        width: 100%;
        margin-right: 0;
    }

    .student_otherInfo_area input.editable {
        width: 100%;
    }

    .divTableHead {
        display: none;
    }

    .divTableRow {
        border-bottom: none;
    }

        .divTableRow > div {
            text-align: right;
            padding-left: 30%;
            border-bottom: solid 1px #ccc;
        }

            .divTableRow > div:first-child {
                background-color: #20aafb;
                color: #fff;
                padding-top: 5px;
                padding-bottom: 5px;
                font-size: 16px;
                text-align: right;
            }


            .divTableRow > div:before {
                content: attr(data-tipe);
                display: inline-block;
                position: absolute;
                top: 50%;
                left: 0;
                -ms-transform: translateY(-50%);
                -webkit-transform: translateY(-50%);
                -moz-transform: translateY(-50%);
                -o-transform: translateY(-50%);
                transform: translateY(-50%);
                font-weight: 900;
                padding-left: 15px;
            }



        
.divTableBody {
    border: solid 5px #fff;
    box-shadow: 0px 0px 3px #ccc, inset 0px 0px 1px 1px #dadada;
    max-height: 300px;
    margin: 0 1px;
}

.divTableRow .editable {
            display: block;
            right: 50%;
            background-color: transparent;
        }
            .divTableRow .editable .fa {
                font-size: 13px;
                color: #013e02;
            }

        .divTableRow > div:first-child .editable .fa {
            color: #fff;
        }








        .divTableRow:hover {
            /*position: unset;*/
        }

            .divTableRow:hover div[data-tipe*="Vaccin Name"] {
                position: relative;
            }

    .custom-radio {
        display: inline-block;
        margin-right: unset;
        margin-left: 15px;
    }


    .page-headText > * {
        margin: 0;
        font-size: 16px;
    }


    .slide_nav {
        height: calc(100% - 46px);
        border-top: var(-mainMenuBorderColor);
    }

    .mainMenuBtn {
        width: 45px;
        line-height: 45px;
    }

        .mainMenuBtn .fa {
            line-height: 50px;
        }

    .fseTopBar > div {
        height: 50px;
    }

        .fseTopBar > div.searchBox {
            display: none;
            position: absolute;
            z-index: 2;
            width: 100%;
            padding: 10px;
            top: 45px;
            left: 0;
            background-color: #ccc;
            height: 65px;
        }


    .cliendHeaderMenuBox ul li a {
        height: 45px;
        line-height: 45px;
    }

    /*.book_list_details_class_seclect ul.seclect_class li label {
        padding: 6px 15px 6px 30px;
    }
    .book_list_details_class_seclect ul.seclect_class li .check {
        left: 0px;
    }*/


    .book_list_card_details .table-responsive {
        margin-bottom: 0px;
    }

    .book_list_card_details table {
        max-height: calc(100% - 40px);
        overflow-y: auto;
    }

    .book_list_card_details thead {
        display: none;
    }

    .book_list_card_details tbody, .book_list_card_details tbody tr, .book_list_card_details tbody tr td {
        display: block;
        width: 100%;
    }

    .book_list_card_details tbody {
        height: calc(100% - 0px);
        overflow-y: auto;
    }

        .book_list_card_details tbody tr {
            /*padding: 8px 0px;
        margin: 5px 0px;*/
        }

    .book_list_card_details .table tr td {
        padding-left: 40%;
        white-space: unset !important;
        position: relative;
        font-weight: 600;
    }

        .book_list_card_details .table tr td:first-child {
            padding-left: 10px;
            font-size: 15px;
            background-color: #e8e8e8;
        }

        .book_list_card_details .table tr td::before {
            content: attr(data-need);
            position: absolute;
            top: 7px;
            left: 25px;
            font-weight: 500;
        }


    .book_list_area .book_list_others_details .book_list_subject_list .book_list_card_details .table tr th.book_list_card_fixwid, .book_list_area .book_list_others_details .book_list_subject_list .book_list_card_details .table tr td.book_list_card_fixwid {
        width: 100%;
        text-align: left;
    }

   .book_list_subject_list {
    		display: none;
    		margin-bottom: 0px;
	}
    .book_list_details_class_seclect {
        display:none;
    }





    .holiday-flex-container {
        -webkit-box-orient: vertical;  -webkit-box-direction: normal;  -webkit-flex-direction: column; -ms-flex-direction: column;   flex-direction: column;
    }

    .holiday-flex-container > div {
        margin: 4px;
        padding: 15px 5px;
        -webkit-box-shadow: 1px 1px 5px 0px rgba(0,0,0,0.1);
        -moz-box-shadow: 1px 1px 5px 0px rgba(0,0,0,0.1);
        box-shadow: 1px 1px 5px 0px rgba(0,0,0,0.1);
        background-color: #fff;
    }

    .holiday-flex-container > div > div {
        /*display: inline-block;*/
        vertical-align: middle;
        text-align: center;
    }
    

    .holiday-flex-container > div:nth-of-type(n) .holiMonth, .holiday-flex-container > div:nth-of-type(n) .holiDates span {
        color: rgb(219, 153, 228);
        border-color:rgb(219, 153, 228);
    }
    .holiday-flex-container > div:nth-of-type(2n) .holiMonth, .holiday-flex-container > div:nth-of-type(2n) .holiDates span {
        color: rgb(241, 141, 71);
        border-color:rgb(241, 141, 71);
    }
    .holiday-flex-container > div:nth-of-type(3n) .holiMonth, .holiday-flex-container > div:nth-of-type(3n) .holiDates span {
        color: rgb(92, 97, 191);
        border-color:rgb(92, 97, 191);
    }
    .holiday-flex-container > div:nth-of-type(4n) .holiMonth, .holiday-flex-container > div:nth-of-type(4n) .holiDates span {
        color: rgb(82, 173, 208);
        border-color:rgb(82, 173, 208);
    }
    .holiday-flex-container > div:nth-of-type(5n) .holiMonth, .holiday-flex-container > div:nth-of-type(5n) .holiDates span {
        color: rgb(60, 171, 49);
        border-color:rgb(60, 171, 49);
    }
    .holiday-flex-container > div:nth-of-type(6n) .holiMonth, .holiday-flex-container > div:nth-of-type(6n) .holiDates span {
        color: rgb(236, 192, 57);
        border-color:rgb(236, 192, 57);
    }
    .holiday-flex-container > div:nth-of-type(7n) .holiMonth, .holiday-flex-container > div:nth-of-type(7n) .holiDates span {
        color: rgb(206, 73, 73);
        border-color:rgb(206, 73, 73);
    }
    .holiday-flex-container > div:nth-of-type(8n) .holiMonth, .holiday-flex-container > div:nth-of-type(8n) .holiDates span {
        color: rgb(139, 195, 74);
        border-color:rgb(139, 195, 74);
    }

    .holiday-flex-container > div i, .holiday-flex-container > div:nth-of-type(n) .holiDates span{
        color:#3f3f3f;
    }
    .MonthlyDetailsItem .MonthlyDetailsItem_Head span.headDate i {
        color:#fff;
    }
   





    .holiMonth {
        display: inline-block;
        font-size: 20px;
        font-weight: 900;
        width: 60px;
    }
    

        .holiMonth i {
            display: block;
            font-size: 14px;
            font-weight: 500;
        }

    /*.holiDates span i::after {
        content: 'day ';
    }*/

    .holiDates {
        display: inline-block;
        -webkit-box-align: center;  -webkit-align-items: center;  -ms-flex-align: center;  align-items: center;
    }

        .holiDates span {
            padding: 0px 10px;
            border-right: solid 1px #9da2a1;
            color: #909090;
            font-size: 16px;
            font-weight: 600;
        }

            .holiDates span:last-child {
                border-right: none;
            }

            .holiDates span i {
                display: none;
            }

    .applicationHistoryArea + .active > .applicationForm {
        width: calc(100% - 10px);
        padding: 5px 15px 5px;
         border: none;
    }



    .MonthlyDetails.active {
            -webkit-box-orient: vertical;  -webkit-box-direction: normal;  -webkit-flex-direction: column; -ms-flex-direction: column;   flex-direction: column;
            align-items: flex-end;
    }

    .MonthlyDetailsItem {
       width: calc(100% - 16px);
    margin:12px 1px;
    -webkit-border-bottom-right-radius: 30px;
    -moz-border-radius-bottomright: 30px;
    border-bottom-right-radius: 30px;
    -webkit-border-top-left-radius: 15px;
    -moz-border-radius-topleft: 15px;
    border-top-left-radius: 15px;
    }

    span.headDate {
          top: -1px;
    left: -15px;
    border-radius: 50%;
    border: none !important;
        border-right:1px solid #ccc !important;
    }

    .headName {
         border-bottom: 2px solid;
    padding-left: 60px;
    }

    .MonthlyDetailsItem_Body {
        padding-left: 60px;
    display: block;
    min-height: unset;
    text-align: left;
    -webkit-border-bottom-right-radius: 20px;
    -moz-border-radius-bottomright: 20px;
    border-bottom-right-radius: 20px;
    }

    .attendance_area {
        padding:0;
    }











}




@media (max-width:767px) {
    html, body {
        font-size: 14px;
    }




    .login-form {
        width: 300px;
    }

    .logBody .login_area .footer-copyrights {
        width: 300px;
    }

    .logoBox {
        width: calc(100% - 15px);
    }

    .navbar-profile-area .logPanelData {
        -webkit-box-orient: vertical;  -webkit-box-direction: normal;  -webkit-flex-direction: column; -ms-flex-direction: column;   flex-direction: column;
    }

    .navbar-profile-area p.Last-Login {
        position: unset;
    }

    .navbar-profile-area .logPanelData .logPanelDataDetails {
        min-height: 40px;
    }

    .navbar-profile-area .logPanelData .logPanelDataDetails h5, .navbar-profile-area .logPanelData .logPanelDataDetails p.text-left, .navbar-profile-area p.Last-Login {
        text-align: center;
    }


     .mainFooter {
            justify-content: center;
     }

    .dropdown-menu.navbar-profile-area {
        right: 10px !important;
    }
    .Parsonal_body_area {
        background-size: 450%;
    }
    
    .parsonArticle .personal_page_header {
        padding-top: 10px;
        padding-bottom: 10px;
    }

    .parsonArticle p {
        display: none;
    }
    

    .fseTopBar {
        background-color: rgba(255, 255, 255, 0.5);
    }

    
    .student_otherInfo_area input.editable + .editable {
        display: inline-block;
    }

    .mainFooter {
        padding: 0;
    }

    .mainFooter .footer-copyrights {
        font-size: 9px;
        /*line-height: 25px;*/
    }

    .mainFooter .footer-logo {
        padding: 8px 4px;
    }

    .mainFooter .footer-logo img {
        max-height: 16px;
    }

    .mainContainArea {
        /*height: calc(100% - 80px);*/
        height: 100%;
    }

    .dashboard-area .dashboard-list-container {
        flex-direction: row;
        justify-content: space-between;
        height: 100%;
        margin-bottom: 0;
    }

    .dashboard-area .dashboard-list-container > a {
            margin: 5px;
			max-height:200px;
            width:46%;
            padding: 5px;
           -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.07);
            -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.07);
            box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.07);
    }

    .dashboard-area .dashboard-list-container > a div.dashboard-list-icon {
        margin: 5px auto;
    }
    .dashboard-area .dashboard-list-container > a div.dashboard-list-details p {
        font-size:13px;
    }

    img.loginLogo {
        max-height: 40px;
    }

	



    .menu_bar {
        display: none;
    }

    .top-menu {
        display:block;
    }

    .top-menu.active {
        display:block;
    }
    


    /*.order-search {
        max-width: 140px;
        font-weight: normal;
    }*/




    .notice_area .well .section-box .media .media-body h4.media-heading button {
        position: absolute;
        top: 0;
        right: 20px;
    }

    .notice_area .well .section-box .media .media-body, .notice_area .well .section-box .media .media-left, .notice_area .well .section-box .media .media-right {
        display: block;
    }

    .notice_area .well .section-box .media .media-body {
        width: auto;
    }

    .notice_area_name .notice_area_name, .notice_area_name .notice_area_mode, .notice_area_name .notice_area_last_date, .media-heading .notice_area_subject {
        display: block;
    }

    .notice_area .well .section-box .media .media-body .media-heading {
        margin-top: 10px;
    }

    .notice_area .well .section-box .media .media-body .media-heading .notice_area_subject {
        margin: 8px 0;
    }

    .notice_area .panel-heading h3 {
        display: none;
    }

    .notice_area .panel-default > .panel-heading span.pull-right {
        float: left !important;
        margin-top: 0px;
        width: 100%;
    }

    .notice_area .panel-heading span .form-control {
        max-width: unset;
    }

    .student_info_edit_modal_area .modal_foot_btnBox .btn {
        margin-bottom:0;
    }
    .student_Info_edit_btn {
            top: unset;
    right: 5px;
    z-index: 999;
    bottom: 15px;
    }

    .student_infoBody {
        height: calc(100% - 45px);
        overflow-y: auto;
    }

    .student_selfInfo_area {
        height: auto;
    }

    .student_otherInfo_area {
        height: auto;
    }

    .btn {
        margin-bottom: 10px;
    }

    .flex-container > div {
        width: 45%;
        padding: 10px;
    }

    .slide-gallery {
        padding: 0;
    }

    .group > div > label {
        height: inherit;
        display: -webkit-box;  display: -webkit-flex; display: -ms-flexbox;  display: flex;
        -webkit-box-align: center;  -webkit-align-items: center;  -ms-flex-align: center;  align-items: center;
        justify-content: flex-start;
        margin-bottom: 5px;
        font-size: 13px;
    }

    .navbar-profile-area .logPanelData .logPanelDataDetails p {
        line-height: 15px;
    }

    .booklist_print {
        bottom: 8%;
        right: 10px;
    }

    /*.icon {
        top: 17px;
    }*/


    .entryArea {
        /*margin-top: -10px;*/
    }

    span.clientPic {
        margin: unset;
        margin-top: 20px;
    }

    .resultArea {
        margin: 0 auto;
    }

    .resultAreaHeader {
        font-weight: 500;
        font-size: 14px;
    }

    .resultAreaBody {
        height: calc(100% - 130px);
        overflow-y: auto;
    }



    .AttendanceStat .fa {
        height: 17px;
        line-height: 17px;
        width: 17px;
        text-align: center;
        font-size: 12px;
    }

    .AttenNote:hover .AttenNoteDetails, .AttenNote.active .AttenNoteDetails {
        width: calc(100% - 30px);
        max-height: 75%;
        top: 50%;
        left: 0;
        -ms-transform: translate(5%, -50%);
        -webkit-transform: translate(5%, -50%);
        -moz-transform: translate(5%, -50%);
        -o-transform: translate(5%, -50%);
        transform: translate(5%, -50%);
        font-size: 12px;
    }

    .attendance_abesent_area .media {
        margin-left: -15px;
        margin-right: -15px;
    }


    .selfIdPic {
        margin: 10px auto;
        width: 65px;
        height: 65px;
        border: 4px solid #ffffff;
    }

    .naming {
        margin: 0px;
    }
    .regNo {
        padding-bottom: 5px;
    	margin-bottom: 5px;
    	margin-top: 5px;
    	min-height: 20px;
    }
    .dataColon {
        font-size: 12px;
    }

    .dataColon span + * {
        font-size: 12px;
        font-weight: 600;
    }

    .navbar-profile-area .navbar-profile {
        min-width: 300px;
    }

    .slide-gallery {
        padding: 0;
        /*margin: 0 -30px;*/
    }

	.order_area_footer {
		padding-right: 30px;
	}
	.order_area_footer.order_area_type.in {
		padding-right: inherit;
	}
	.sec-cusmr {
		width: 100%;
		max-width: 200px;		
	}
    .book_list_area .book_list_others_details .book_list_subject_list .book_list_card_details .table tr th.book_list_card_fixwid, .book_list_area .book_list_others_details .book_list_subject_list .book_list_card_details .table tr td.book_list_card_fixwid {
        width: auto;
    }

   

    .book_list_details_class_seclect ul.seclect_class li {
        width: 100%;
        height: auto;
    }


    .book_list_details_class_seclect {
        display:none;
    }
    .book_list_details_class_seclect.active {
        display:block;
    }




    .book_list {
        position: absolute;
        top: 44px;
        left: 0;
        width: 100%;
        z-index: 9;
        background-color: #fff;
        padding: 0;
        /*display: none;*/
    }

        .book_list.active {
            display: block;
        }
            .book_list_back {
        display:inline-block;
    }

    .categoryCertificatesBox {
        display: none;
    }
    /*.categoryCertificatesBox.categoryactive {
        display: block;
    }*/
    
    .certificate_item.exlnt {
        border-right-width: 4px;
    }

    .certificate_item.good {
        border-right-width: 4px;
    }

    .certificate_item.avrg {
        border-right-width: 4px;
    }

    .certificate_item.bad {
        border-right-width: 4px;
    }

    .certificate_category_area_close.close {
        display: none;
    }

    .mainContainArea > div > div > section {
        padding: 0;
    }

    .docArea-parent {
        height: calc(100% - 40px);
    }

    .actionPanel {
        bottom: 30px;
    }

    ul.controlMenu {
        margin: 0;
        padding: 3px 15px;
    }

        ul.controlMenu li .btn {
            margin-bottom: 0;
        }

    .flex-container > div {
        background-color: transparent !important;
        border: none !important;
    }

    .iconfont + a {
        font-size: 14px;
        white-space: normal;
        overflow: inherit;
        text-overflow: inherit;
        color: #3f3f3f;
        font-weight: 400;
    }


    .flex-container > div {
        width: 42%;
        padding: 5px;
        margin: 5px;
    }


    .resultAreaBody > div > div {
        padding-top: 8px;
        padding-bottom: 8px;
        padding: 8px 4px;
        font-size: 12px;
    }


    .leaveBtnArea {
        -webkit-box-orient: vertical;  -webkit-box-direction: normal;  -webkit-flex-direction: column; -ms-flex-direction: column;   flex-direction: column;
        justify-content: flex-start;
    }

    .applicationFormArea {
        align-items: flex-start;
    }

    .applicationForm {
        width: calc(100% - 10px);
    }

    .HistoryArea {
        height: calc(100% - 215px);
        padding-top: 0;
        border: none;
    }

    .HistoryListHead {
        display: none;
    }

    .HistoryListBody {
        max-height: calc(100% - 0px);
        min-height: 50px;
        border-radius: 11px;
        /*box-shadow: inset 1px 2px 10px 3px #ccc;*/
    }

    .HistoryListBody .itemRow {
        -webkit-box-orient: vertical;  -webkit-box-direction: normal;  -webkit-flex-direction: column; -ms-flex-direction: column;   flex-direction: column;
        padding-top: 15px;
        padding-bottom: 15px;
        margin-bottom: 10px;
        border: solid 1px #ccc;
        border-radius: 10px;
    }

    .HistoryListBody .itemRow div:first-child {
        width: 100%;
        padding: 0px 0px;
        text-align: right;
    }

    .HistoryListBody .itemRow div:first-child > div {
        padding: 3px 10px 3px 120px;
        border-bottom: solid 1px #efefef;
    }

    .HistoryListBody .itemRow div:first-child > div:before {
        content: attr(data-title);
        position: absolute;
        left: 10px;
        font-weight: 600;
        text-transform: capitalize;
    }

    .itemRow > div:last-child {
        width: 100%;
        padding: 0 10px;
        position: relative;
    }

    .itemRow p {
        padding-top: 30px;
        font-size: 12px;
    }

    .itemRow p:before {
        content: 'Reason Of Leav :';
        position: absolute;
        top: 5px;
        left: 10px;
        font-weight: 600;
        text-transform: capitalize;
        font-size: 14px;
    }

    .HistoryListBody .itemRow:last-child {
        border-bottom: solid 1px #ccc;
        margin-bottom: 0;
    }


    .dataColon span + * {    
        min-height: 19px;
    }

    .holiday_Details_back {
        font-size: 18px;
        color: #000;
        left:0;
    }

    .dateFilter label {
            top: 10px;
    }

    .dateFilter label {
        background-color: transparent !important;
    }
      
    .dateFilter label span {
        display: none !important;
    }
       
    .dateFilter label i {
        margin-right: 6px;
        padding: 4px;
    }

    .assignment_details .tracking-item .tracking-date {
        margin-left: 10px;
        margin-bottom: 4px;
        margin-top: 6px;
    }
    
    .tracking-item .tracking-content .btn {
        margin-bottom:5px;
    }



    .order_area_type_modal {
        width: 90%;
    }


    .modal.in .modal-dialog.modal-popup {
        max-width: 100%;
        
    }



.order_area_list.order_area_list_cl_app {
    padding:0 15px;
}




.addform table.table-fixed tbody {
    display:block;
    min-height:50px;
    max-height:285px;
    overflow:auto;
}



}


@media (max-width:500px) {

    .certificate_category_area {
        height: calc(100% - 80px);
        width: 100%;
        top: unset;
        bottom: 28px;
        -ms-transform: translate(-50%, 0%);
        -webkit-transform: translate(-50%, 0%);
        -moz-transform: translate(-50%, 0%);
        -o-transform: translate(-50%, 0%);
        transform: translate(-50%, 0%);
        padding-top: 35px;
        padding-bottom: 0;
        border: none;
        box-shadow: none;
    }

    .certificate_item {
        width: 95%;
        max-width: unset;
    }

    .starsMarking {
        left: -100px;
    }

    .categoryBox {
        text-align: center;
        height: 100%;
        overflow-y: auto;
    }

    .categoryMenu li {
        width: calc(50% - 5px);
        margin-right: 10px;
        margin-bottom: 10px;
        border: solid 1px transparent;
        height: 140px;
        padding: 10px 5px 5px;
    }

        .categoryMenu li:nth-of-type(2n) {
            margin-right: 0;
        }

        .categoryMenu li:nth-of-type(n) {
            border: solid 1px rgba(219, 153, 228, .5);
        }

        .categoryMenu li:nth-of-type(2n) {
            border: solid 1px rgba(241, 141, 71, 0.5);
        }

        .categoryMenu li:nth-of-type(3n) {
            border: solid 1px rgba(92, 97, 191, 0.5);
        }

        .categoryMenu li:nth-of-type(4n) {
            border: solid 1px rgba(82, 173, 208, 0.5);
        }

        .categoryMenu li:nth-of-type(5n) {
            border: solid 1px rgba(60, 171, 49, 0.5);
        }

        .categoryMenu li:nth-of-type(6n) {
            border: solid 1px rgba(236, 192, 57, 0.5);
        }

        .categoryMenu li:nth-of-type(7n) {
            border: solid 1px rgb(206, 73, 73);
        }

        .categoryMenu li:nth-of-type(8n) {
            border: solid 1px rgb(139, 195, 74);
        }




        .categoryMenu li i {
            display: block;
            width: 100%;
            margin: 0px;
            margin-bottom: 15px;
            font-size: 35px;
        }

    .categoryCertificatesBox {
        position: absolute;
        top: 0;
        left: 0;
        margin: 0;
        height: 100%;
        /*display: none;*/
        background-color: #fff;
    }

        .categoryCertificatesBox.active {
            display: block;
        }

    .categoryCertifiHead {
        height: 40px;
        line-height: 40px;
        border-bottom: solid 1px #ccc;
        font-size: 20px;
    }

        .categoryCertifiHead .back, .certificate_category_area.active > .back {
            margin: 0;
            height: 40px;
            width: 40px;
            position: absolute;
            top: 0;
            left: 0;
            text-align: center;
            line-height: 40px;
            font-size: 30px;
        }
        span.certificate_category_area_close.back {
            position: absolute;
            top: -10px;
            left: 10px;
        }
    .categoryCertifiBody {
        border: none;
        height: calc(100% - 40px);
        padding: 10px;
    }

        .categoryCertifiBody .categoryCertifi_Item {
            width: 100%;
            margin: 5px 0px;
        }

            .categoryCertifiBody .categoryCertifi_Item .imageBox {
                height: 165px;
            }

    .holiday-flex-container {
        /*margin: 0px -15px;*/
    }

    .holiMonth {
        display: inline-block;
        font-size: 12px;
        font-weight: 900;
        text-align: center;
        width: 35px;
    }

        .holiMonth i {
            display: block;
            font-size: 11px;
            font-weight: 500;
        }

    /*.holiDates {
        display: inline-block;
        font-size: 11px;
        width: calc(100% - 40px);
    }*/
    .holiDates {
        display: -webkit-box;  display: -webkit-flex; display: -ms-flexbox;  display: flex;
        -webkit-box-orient: horizontal;  -webkit-box-direction: normal; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row;
        flex-wrap: nowrap;
        float: right;
        font-size: 11px;
        width: calc(100% - 40px);
        overflow-x: auto;
        overflow-y: hidden;
        height: 32px;
    }

        .holiDates span {
            font-size: 13px;
            padding: 0px 8px;
            font-weight: 700;
        }
}



/*@media (max-width:400px) {

    .flex-container > div {
        width: 44%;
        padding: 5px;
    }
}*/




@media (max-height:570px) {
    .leaveBtn {
        margin: 15px 10px 0px;
    }

    /*.applicationForm {
        max-height: initial;
        
    }*/

   



}


@media (min-height: 768px) and (min-height: 768px) and (max-width: 767px) {

    .student_selfInfo_area {
        max-height: 100%;
        height: unset;
    }

}






/*Ui Grid*/
.ui-grid-filter-container .ui-grid-filter-button [class^="ui-grid-icon"] {
    top: 0;
    line-height: 0;
    margin-top: 7px;
}




table.table-fixed tbody {
    display:block;
    min-height:50px;
    max-height:500px;
    overflow:auto;
}
table.table-fixed thead, table.table-fixed tbody tr {
display:table;
width:100%;
table-layout:fixed;
}