body{
    background: #eee;
    font-size: 14px;
    font-family: font4;
    letter-spacing: -0.5px;
}
@font-face{
    font-family:font1;
    src:url(../fonts/Roboto-Regular.ttf) format('truetype')
}
@font-face{
    font-family:font5;
    src:url(../fonts/fira-sans.medium.ttf) format('truetype')
}
@font-face{
    font-family:font4;
    src:url(../fonts/fira-sans.regular.ttf) format('truetype')
}


@font-face{
    font-family:font3;
    src:url(../fonts/Roboto-Medium.ttf) format('truetype')
}
@font-face{
    font-family:error;
    src:url(../fonts/error.ttf) format('truetype')
}
@font-face {
    font-family: font6;
    src: url(../fonts/a.woff2) format('woff2')
}
.p-0{
    padding: 0px;
}
.m-0{
    margin: 0px;
}
.m-t-10{
    margin-top: 10px;
}
.m-t-0{
    margin-top:0px !important;
}
.m-b-10{
    margin-bottom: 10px;
}
.m-b-15{
    margin-bottom: 15px;
}
.m-t-15{
    margin-top: 15px;
}
.m-t-20{
    margin-top: 20px !important;
}
.top_header{
    background: #fff;
    min-height: 60px;
    box-shadow:0 1px 4px 0px rgba(0, 0, 0, 0.16);
    width: 100%;
    position: fixed;
    top: 0;
    z-index: 1;
}
.site-logo{
    height: 60px;
    width: 260px;
    float: left;
    border-right: 1px solid #cac4c6;
}
.site-logo img{
    max-width: 100%;
    max-height: 100%;
}
.site-nav{
    margin: 0px;
    width: 13%;
    /* margin-top: 20px; */
    text-align: right;
    float: right;
}
.site-nav .menu{
    /* width: 300px; */
    /* margin: 30px 0px; */
    text-align: center;
    display: unset;
    /* padding-top: 30px; */
}
.notification{
   /* display: unset;
    margin: 0px;*/
    position: relative;
    float: left;
}
.notification i{
    color: #343a40;
    font-size: 20px;
}
.notification span{
    background: #ff5274;
    color: #fff;
    display: block;
    width: 17px;
    height: 17px;
    border-radius: 100px;
    position: absolute;
    top: 1px;
    font-size: 11px;
    right: 3px;
    text-align: center;
    line-height: 17px;
}
.site-nav ul{
        width: 200px;
    position: absolute;
    right: 5px;
    background: #fff;
    /* box-shadow: 0px 4px 5px #ccc; */
    top: 60px;
    padding: 10px 20px;
    display: none;
    text-align: left;
    border-bottom: 3px solid #006cca;
}
.site-nav ul li{
    padding-bottom: 5px;
    border-bottom: 1px solid #ccc;

}
.site-nav ul li:last-child{
    border-bottom: none;
}
.site-nav ul li a{
    font-size: 15px !important;
    padding: 10px 0px !important;
}
.site-nav .menu a{
    color: #444;
    text-decoration: none;
    font-size: 15px;
    display: inline-block;
    padding-top: 14px;
    padding-right: 11px;
}
.site-nav ul li a{
    text-decoration: none;
    color: #666 !important;
}
.leftside{
    /* width: 260px;
    background: url(../images/05.jpg);
    background-size: cover;
    position: fixed;
    left: 0;
    height: 100%;
    top: 60px;
    z-index: 100; */
    width: 260px;
    background: #282A35;
    position: fixed;
    left: 0;
    height: 100%;
    top: 43px;
    padding-right: 0px;
    z-index: 20;
    box-shadow: 0 1px 3px rgb(0 0 0 / 12%), 0 1px 2px rgb(0 0 0 / 24%);
    padding-left: 0px;
    overflow-y: auto;
}
.leftside ul{
    padding: 0px;
    padding-top: 10px;
    padding-bottom: 150px;
    height: 100%;
    overflow-y: auto;
    position: relative;

}
.leftside ul h1{
   color: #fff;
    font-size: 17px;
    padding-left: 15px !important;
    margin: 0px;
    margin-bottom: 4px;
}
.leftside ul::-webkit-scrollbar{
    width:10px;
    background: #01062d;
    border-radius: 10px;
}
.head_menu{
    margin: 15px 0px;
}
.leftside ul li a{
    color: #adb5bd;
    text-decoration: none;
    position: relative;
    padding: 4px 20px 8px 17px;
    display: block;
    text-transform: capitalize;
    font-family: font6;
    font-size: 14px;
    line-height: 1.5;
    letter-spacing: -0.8px;
    position: relative;
}
.leftside ul li a::before{
    position: absolute;
    content: "";
    background: #006cca;
    width: 9px;
    height: 9px;
    top: 10px;
    left: 0px;
    transform: rotate(45deg);
    border: 1px solid #3ba8ff;
}
.leftside ul li{
    list-style: none;
    padding-left: 20px;
}
/* .leftside ul li a:before{
    position: absolute;
    content: "";
    background: #a1a1a1;
    height: 8px;
    width: 8px;
    border-radius: 100px;
    top: 15px;
    left: 17px;
} */
.leftside ul span{
    font-size: 14px;
    /* position: absolute; */
}
.short-menu{
    float: left;
    width: 65px;
    text-align: center;
    cursor: pointer;
    border-right: 1px solid #cac4c6;
    padding: 10px 0px;
}
.short-menu i{
    color: #343a40;
    font-size: 27px;
}
.menu-overlay{
    position: fixed;
    background: rgba(0, 0, 0, 0.63);
    top:0;left:0;
    height: 100%;
    width: 100%;
    display: none;
        z-index: 200;
}
.menu-overlay .close{
    color: #202020;
    opacity: 1;
    font-size: 20px;
    top: 25px;
    right: 30px;
    position: relative;
    cursor: pointer;
    display: block;
    width: 40px;
    height: 40px;
    text-align: center;
    line-height: 40px;
}
.menu-overlay ul{
    padding: 100px;
}
.menu-overlay ul li{
        border-bottom: 1px solid #c1c1c1;
    border-right: 1px solid #c1c1c1;
    padding: 0px;
}
.menu-overlay ul li a{
    color: #d6d6d6;
    font-size: 18px;
    text-align: center;
    padding: 16px 0px;
    font-family: font4;
    background: #0e83cd7d;
    color: #fff;
    /* text-transform: uppercase; */
}

.menu-overlay .nav .active{
    background: rgba(0, 197, 0, 0.38);
    color: #fff;
}
/*
.leftside ul .active{
    background: #656565;
}
*/
.loader-overlay{
    position: fixed;
    background: rgba(0, 0, 0, 0.63);
    top:0;left:0;
    height: 100%;
    width: 100% ;
    display: none;
        z-index: 1000;
        padding-top: 100px;
        text-align: center;
}
.loader{ 
    height: 500px;
    padding-top: 100px;
}

/*login*/
#login-page{
    background: url(../images/slide41.jpg);
    font-family: font1;
    background-attachment: fixed;
    background-position: center;
    background-size: cover;
}
.login_main{
    background: #fff;

    margin:2% auto;
}
.login_main .button input{
    background: #03A9F4;
    color: #fff !important;
    font-size: 14px;
    border: none;
    padding: 9px 20px;
    height: unset;
    width: unset;
    text-transform: uppercase;
    padding: .5em 2em;
    margin-bottom: 30px;
    font-family: font4;
}
.login_main .head{
    position: relative;
    margin-bottom: 170px;
}
.login_main .head:before{
    content: '';
    position: absolute;
    top: 0px;
    left: 0px;
    width: 0;
    height: 0;
    border-top: 134px solid #03A9F4;
    border-right: 322px solid transparent;
    border-left: 0px solid transparent;
    z-index: 1;
}
.login_main .head:after{
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 0;
    height: 0;
    border-top: 150px solid #3be8b0;
    border-right: 0px solid transparent;
    border-left: 340px solid transparent;
    z-index: 0;
}
.ribbon-front h2{
   position: relative;
    margin: 0px;
    font-size: 20px;
padding: 13px 25px;
    text-align: left;
    background: #ffa300;
    color: #fff;
    display: inline-block;
    margin-top: 18px;
    left: -21px;
    font-family: font3;
}
.ribbon-front h2:before{
   position: absolute;
    bottom: -20px;
    left: 1px;
    border-top: 20px solid #e17e02;
    border-left: 20px solid transparent;
    content: "";
}
.ribbon-front h2:after{
        position: absolute;
    top: 7px;
    right: -17px;
    border-top: 35px solid #ffa300;
    border-left: 35px solid transparent;
    content: "";
    transform: rotate(44deg);
}
.login_main{
    margin: 2% auto;
    box-shadow: 0px 2px 3px #2d2d2d;
}
.login_main input{
    border: none;
    border-bottom: 1px solid #525252;
    height: 45px;
    outline: none;
    width: 100%;
    color: #666 !important;
    font-size: 15px;
    text-align: center;
    font-family: font4;
}
.login_main .button input{
    background: #03A9F4;
    color: #fff !important;
    font-size: 14px;
    border: none;
    padding: 9px 20px;
    height: unset;
    width: unset;
    text-transform: uppercase;
    padding: .5em 2em;
    margin-bottom: 30px;
    font-family: font4;
}
.login_main input:-webkit-autofill{
    background: #fff !important;
}
.login_main .block{
    position: relative;
    margin-bottom: 30px;
}
.login_main img{
    position: absolute;
    left: 11px;
    top: 10px;
    border-right: 1px solid #ccc;
    padding-right: 4px;
}
.login_main input:focus{
    border:1px solid #ccc;
    outline:none;
}
.login_main .button input{
     /* background: deepskyblue;
    color: #fff !important;
    text-transform: uppercase;
    font-size: 21px;
    border: none;
    font-family: font3;
    padding: 14px 0px;
    height: initial; */
}
.login_inside{
    padding: 5px 30px 35px 30px;
    padding-bottom: 20px;
}
::-webkit-input-placeholder{
    color: #9f9f9f;
}
.small-checkbox input[type="checkbox"]{
    height: 14px !important;
    width: 14px !important;
    box-shadow: inset 2px 2px 2px #a7a7a7;
    margin-right: 5px;
}
.dual_checkbox{
    text-align: center;
    background: lavender;
    padding: 5px;
}
/*common form*/
.common-form{
    background: #fff;
    padding: 13px 13px !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
    border-radius: 5px;
    margin-bottom: 10px;
}
.common-table, .new-table {
    background: #fff;
    box-shadow: 0px 2px 4px rgb(0 0 0 / 20%);
    padding: 0;
    margin-bottom: 10px;
}
.commonform-topblock{
    background: url(../images/pattern_icon.png);
    background-size: 150px;
    padding: 20px;
}
.common-form h3,.common-heading h3{
    margin: 10px 0px 20px 0px;
    color: #000000;
    font-size: 18px;
    background: #fff0eb;
    padding: 10px 10px;
    border: none;
    display: block;
    border-left: 3px solid #000000;
    background: #efefef47;
    font-family: font5;
    letter-spacing: -0.5px;
}
.common-heading h3{
    background: #fff;
    margin: 10px 0px;
}

.common-form input,.common-form select{
    border: 1px solid #aaa;
    width: 100%;
    height: 37px;
    font-size: 15px;
    padding-left: 5px;
    border-radius: 0px;
    font-family: font4;
    border-radius: 3px;
    background: #fff;

}
.common-form select:focus{
    outline:none;
    border:1px solid #bbb;
}
.common-form textarea{
    border: 1px solid #bbb;
    resize: none;
    width: 100%;
    padding-left: 10px;
    font-family: font5;
    font-size: 14px;
    border-radius: 0px;
    font-family: font4;
    font-size: 14px;
    letter-spacing: -0.5px;
}
.common-form textarea:focus{
    outline: none;
    border: 1px solid #bbb;
}
.common-form select{
     border: 1px solid #bbb;
}
.common-form input:focus,.common-form select:focus{
    outline:none;
    border-bottom: 1px solid #bbb;
}
.common-form label{
    color: #666;
    font-size: 15px;
    font-weight: 100;
    margin-top: 4px;
    margin-left: 0px;
    line-height: 17px;
    padding: 0px;
    font-family: font3;
    text-align: left;
}
.common-form label .required{
    color:red;
    font-size: 20px;
}
.common-form .button{
    text-align: center;
}
.common-form .button input,.common-form .button button{
    /* background: radial-gradient(circle,#FF9800,#FF5722,#F44336); */
    color: #fff !important;
    text-decoration: none;
    /* padding: 6px 22px !important; */
    /* border-radius: 3px !important; */
    /* box-shadow: 0px 4px 5px rgba(0,0,0,0.2); */
    font-size: 14px !important;
    text-transform: uppercase;
    /* border-bottom: 4px solid #d8392e !important; */
    margin-bottom: 10px;
    width: initial;
    height: initial !important;
    cursor: pointer;
    border: none;



    background: #0e83cd !important;
    border: none;
    border-radius: 3px;
    padding: 11px 25px;
    font-family: font4;
    /* letter-spacing: -0.5px; */
}
.common-form .inner{
    border-right: 1px solid #ddd;
    padding: 0px 20px;
}
.rightside{
    margin-left:260px;
    padding: 25px;
    margin-top: 60px;
}
.rightside h1{
    /* margin: 0px;
    color: #444;
    position: relative;
    border-bottom: 2px solid #ddd;
    padding-bottom: 5px;
    font-family: font3;
    font-size: 18px;
    margin: 0px;
    color: #101010;
    font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    font-size: 20px;
    padding-bottom: 5px;
    letter-spacing: -0.5px;
    line-height: 26px;
    top: 0px; */
    margin: 0px;
    color: #101010;
    font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    font-size: 20px;
    padding-bottom: 5px;
    letter-spacing: -0.5px;
    line-height: 26px;
    top: 0px;
}
.rightside h1 span{
    /* color: #0275d8; */
    font-family: font3;
}
.on-off-view{

}
.heading{
    /* margin-top:55px; */
    margin-bottom: 20px;
}
.heading .right a:hover,.heading .right a:focus{
    background-color: #0275d8;
    border-color: #0275d8;
    color:#fff;
    outline: none;
    box-shadow: none;
}
.heading .link a{
    background: #0e83cd;
    color: #fff;
    box-shadow: 0 2px 4px rgba(0, 0, 0, .2);
    text-decoration: none;
    padding: 10px 13px;
    border-radius: 3px;
    font-family: font3;
    text-transform: uppercase;
    border: none;
    /* margin-left: 10px; */
}
.rightside h1:before{
    position: absolute;
    bottom: -3px;
    left: 0;
    width: 43px;
    height: 4px;
    /* background: #0e83cd; */
    content: "";
}
.note{
    color: #666;
}
.note .required{
    color: red;
    font-size: 20px;
}
.star{
    color: red;
    font-size: 20px;
}
.upload_image input{
    border: none;
}
.upload_image ::-webkit-file-upload-button{
    border: none;
    background:linear-gradient(to right, rgb(0, 0, 0), rgb(15, 155, 15));
    border-radius: 24px;
    color: #fff;
    box-shadow: 0px 2px 4px rgba(0,0,0,0.2);
    padding: 5px 20px;
    color: #fff;
    font-size: 14px;
}
.upload_image input:focus{
    outline:none;
}
/*teachers_table*/

.common-table table{
    border-bottom:1px solid #ccc;
}
.common-table table thead tr{
    /* background: #607d8b !important; */
    /* background: linear-gradient(45deg,#004b91,#78cc37); */
    background: #5aaaba;
}
.common-table tr th{
    font-weight: 100;
    text-align: center;
    color: #fff;
    padding: 8px 10px;
/*    text-transform: uppercase;*/
    font-size: 14px;
}
.common-table tr th a{
    color:#fff;
    text-decoration: none;
}
.sorting_table tr th a{
    position: relative;
}
.sorting_table tr th a:after{
    content: "\f149";
    position: absolute;
    color: #ccc;
    font-family: FontAwesome;
    bottom: -11px;
    font-size: 17px;
    right: -11px;
}
.common-table tr td{
    text-align: center;
    padding: 7px 5px;
    font-family: font4;
    font-size: 14px;
    letter-spacing: -0.5px;
}
.common-table tr td select{
    width:100%;
    border-radius: 0px;
    border:1px solid #ccc;
    height: 30px;
    background: oldlace;
}
.common-table tr td select:focus{
    border:1px solid #ccc;
    outline: none;
}
.common-table td,.common-table th{
    border-right: 1px solid #ccc;
    border-bottom: none !important;
}
.under_row{
    border-top: 1px solid #ccc;
}
.common-table tr td a{
    color: #0e679e;
    text-decoration: none;
    border-right: 1px solid #ccc;
    padding: 0px 10px;
}
.common-table tr:nth-child(even){
    background: #eaeaea;
}
.common-table tr:nth-child(2) th{
    color: #000;
}
/*banner*/
main{
    /* margin-top:60px; */
}
.banner{
    margin-left: 260px;
    margin-top: 60px;
    position: relative;
}
.banner .overlay{
    position: absolute;
    top:0;left:0;
    width:100%;
    height: 100%;
    background: linear-gradient(to right, rgb(102, 125, 182), rgba(0, 130, 200, 0.6), rgba(0, 130, 200, 0.85), rgba(102, 125, 182, 0.8));
}
.banner .title{
    position: absolute;
    top: 40px;
    left: 0;
    right: 0;
    color: #fff;
    text-align: center;
}
.banner .title h1{
    font-family: font3;
    font-size: 45px;
    color: #FFEB3B;
}
.banner .title span{
    font-size: 22px;
    text-transform: capitalize;
}
.banner img{
    width: 100%;
}
/*payroll content*/
.payroll_content{
    padding: 0px 40px;
    text-align: center;
}
.payroll_content h2{
    text-align: center;
    font-family: error;
    font-weight: 600;
    font-size: 33px;
    color: #bbbbbb;
    margin: 0px auto;
}
/*payroll_db_inner*/
.payroll_db_inner{
        /* margin-top: 30px; */
    padding: 0px 0px;
}
.payroll_db_inner .block{
    padding: 0px 5px;
    margin-bottom: 15px;
    text-align: center;
    font-size: 20px;
    width: 20%;
}
.payroll_db_inner .block .inner a{
    background: #fff;
    padding: 10px 15px;
    display: block;
    color: #fff;
    text-decoration: none;
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.06), 0 3px 6px rgba(0, 0, 0, 0.08);
    position: relative;
    border-radius: 0px;
    font-family: font4;
    letter-spacing: 0px;

}
.payroll_db_inner .block .inner a i{
    color: #03A9F4;
    font-size: 31px;
    margin-bottom: 0px;
    display: block;
    line-height: 37px;
}
.payroll_db_inner .block .inner a span{
    position: relative;
    top: 0px;
    font-size: 19px;
    color: #000;
    font-family: font1;
    font-size: 14px;
    text-transform: capitalize;
    line-height: 22px;
}
/* .payroll_db_inner .block .inner a:before{
    position: absolute;
    content: "";
    top: 0;
    left: 0px;
    border-top: 2px solid #ddd;
    border-left: 2px solid #ddd;
    height: 20px;
    width: 20px;transition:all 1s ease;
}
.payroll_db_inner .block .inner a:after{
    position: absolute;
    content: "";
    bottom: 0;
    right: 0px;
    border-bottom: 2px solid #ddd;
    border-right: 2px solid #ddd;
    height: 20px;
    width: 20px;transition:all 1s ease;
} */
.payroll_db_inner .block .inner:hover a:before,.payroll_db_inner .block .inner:hover a:after{
    height: 100%;
    width:100%;
    transition:all 1s ease;
}

/* .payroll_db_inner .block:nth-child(1) .inner a{
    color: #f874a4;
}
.payroll_db_inner .block:nth-child(2) .inner a{
    color: #43b51f;
}
.payroll_db_inner .block:nth-child(3) .inner a{
    color: #00aeef;
}
.payroll_db_inner .block:nth-child(4) .inner a{
    color: #f58d00;
}
.payroll_db_inner .block:nth-child(5) .inner a{
    color: #7765E3;
}
.payroll_db_inner .block:nth-child(6) .inner a{
    color: #DE3C4B;
} */
/*common-search*/
.common-search{
    position: relative;
    text-align: center;
}
.common-search input{
    border-radius: 24px;
    border: 1px solid #ccc;
    height: 40px;
    padding-left: 35px;
    width: 70%;
}
.common-search input:focus{
    outline:none;
    border:1px solid #ccc;
}
.common-search i{
    color: #ccc;
    font-size: 20px;
    position: relative;
    left: 35px;
    top: 2px;
}
/*.genrt-exl*/
.genrt-exl{
    margin-top: 20px;
    margin-bottom: 10px;
}
.genrt-exl a:first-child{
    background: linear-gradient(to bottom,#2e990d 0%,#1d6108 100%);
    color: #fff;
    padding: 6px 25px;
    border-radius: 3px;
    text-decoration: none;
    font-size: 14px;
    margin-right: 10px;
    position: relative;
}
.genrt-exl a:last-child{
    background: linear-gradient(45deg,goldenrod,#0e83cd);
    color: #fff;
    padding: 6px 25px;
    border-radius: 3px;
    text-decoration: none;
    font-size: 14px;
    position: relative;
}
.genrt-exl a:first-child:before{
    position: absolute;
    content: "\f02f";
    top: 4px;
    left: 5px;
    font-family: FontAwesome;
}
.genrt-exl a:last-child:before{
    position: absolute;
    content: "\f019";
    top: 4px;
    left: 5px;
    font-family: FontAwesome;
}
/*salary_rep_checkbox*/
.salary_rep_checkbox ul li{
    margin-bottom: 10px;
}
.grand_total td{
    background: #EFB9CB;
}
/*NEW oct 12*/
/*select2-container*/
.select2-container .select2-choice{
    color: #495057;
    background-color: #fff;
    background-image: none;
    background-clip: padding-box;
    border: 1px solid rgba(0, 0, 0, 0.31);
    border-radius: 3px;
    height: 40px;
    width: 100%;
    line-height: 40px;
    font-size: 14px;
}
.employee_searc_buttons{
   text-align: center;
}
.employee_searc_buttons ul{
   display: inline-flex;
}
.employee_searc_buttons ul li{
    margin-right: 10px;
}
.employee_searc_buttons ul li button,.employee_searc_buttons ul li button:hover,.employee_searc_buttons ul li a,.employee_searc_buttons ul li a:focus,.employee_searc_buttons ul li a:hover{
    border-radius: 3px;
    border: none;
    background: #f70;
    border-bottom: 4px solid #f50;
    text-decoration: none;outline: none;
    box-shadow: none;
} 
.employee_searc_buttons ul li button:focus{
    box-shadow: none;
     background: #f70;
    border-bottom: 4px solid #f50;
}
.employee_searc_buttons ul li a{
    color:#fff;
}
.employee_searc_buttons ul li button:focus{
    outline: none;
}
.employee_searc_buttons ul li a,.employee_searc_buttons ul li a:hover,.employee_searc_buttons ul li a:focus{
    background: deepskyblue;
    border-bottom: 4px solid #2181af;
}
.m-b-20{
    margin-bottom: 20px;
}
.select2-container .select2-choice:focus,.select2-container:focus{
    box-shadow: none;
    outline:none;
}
.select2-drop-active{
    border:1px solid #ccc;
}
.select2-search{
    margin-top: 10px;
}
.table-striped tbody tr:nth-of-type(odd){
    background: #fff;
}
.summary{
    text-align: center;
    margin-bottom: 10px;
    color: #0e83cd;
    font-size: 14px;
}
.button-column{
    width:100px;
}
.button-column img{
   width: 21px;
}
.errorMessage{
    color:red;
    font-size: 14px;
    /*text-align: center;*/
    text-align: left;
}
.help-block{
    font-size: 14px;
}
.help-block span{
    color:red;
    font-size: 20px;
}
#bulk_csv_upload input{
     border: none;
    width: initial;
}
#bulk_csv_upload::-webkit-file-upload-button{
    background: linear-gradient(to right, rgb(0, 0, 0), rgb(15, 155, 15));
    border-radius: 24px;
    padding: 6px 22px;
    border:none;
    color: #fff;
    font-size: 14px;
    cursor: pointer;
}
#bulk_csv_upload::-webkit-file-upload-button:focus{
    outline: none;
}
.choose_file{
    text-align: center;
}
.choose_file label{
    font-size: 20px;
}
/*datepicker*/

#ui-datepicker-div {
    box-shadow: 0px 4px 5px rgba(0, 0, 0, 0.2);
    width: 300px !important;
    border: none;
    border-radius: 0px;
}

.ui-datepicker .ui-datepicker-header {
    background: linear-gradient(45deg,#004b91,#78cc37);
    border-radius: 0px;
    color: #fff;
    font-family: font1;
    font-weight: 100;
    border: none;
}

.ui-datepicker th {
    background: #0d5888;
    color: #fff;
    font-weight: 100 !important;
    font-family: font4 !important;
    font-size: 14px;
}

.ui-datepicker td a {
    border: none !important;
    text-align: center !important;
    padding: 10px !important;
    background: none !important;
    border-radius: 0px;
    width: 35px;
    height: 35px;
    line-height: 19px;
    font-family: font5;
    font-size: 14px;
}
.ui-state-default{
    font-family: font1;
    text-align: center;
}

.ui-datepicker td a:hover,
.ui-state-active,
.ui-widget-content .ui-state-active {
    background: yellowgreen !important;
    color: #fff;
}

.ui-datepicker-next,
.ui-datepicker-next:hover,
.ui-icon-circle-triangle-e {
    background: url(../images/right.png) !important;
    height: 24px !important;
    width: 24px !important;
    cursor: pointer;
    border: none !important;
}

.ui-datepicker-prev,
.ui-datepicker-prev:hover,
.ui-icon-circle-triangle-w {
    background: url(../images/left.png) !important;
    height: 24px !important;
    width: 24px !important;
    cursor: pointer;
    border: none !important;
}

.ui-datepicker .ui-datepicker-prev span,
.ui-datepicker .ui-datepicker-next span {
    left: 34% !important;
    top: 35% !important;
}


/*----------------------*/
.warning{
    background: #f2dede;
    border: 1px solid #ffbebd;
    padding:8px 20px;
    margin-bottom: 20px;
}
.warning ul{
    margin: 0px;
    text-align: center;
}
.warning ul li{
    list-style: none;
    color: red;
}

.alert alert-success in fade{
    padding: 0px;
    margin: 0px;
}
.ui-datepicker select.ui-datepicker-month{
    border-right:1px solid #aaa !important;
}
.ui-datepicker select.ui-datepicker-month, .ui-datepicker select.ui-datepicker-year{
    border: none;
    font-family: font1!important;
    height: 30px !important;
    font-family: font4 !important;
}
.ui-datepicker .ui-datepicker-title select:focus{
    outline: none;
}
.ui-datepicker .ui-datepicker-buttonpane button{
    background: #62b448;
    border: none;
    color: #fff;
    font-family: font4;
    border-radius: 0px;
    font-weight: 100;
    padding: 3px 20px;
}
.ui-datepicker .ui-datepicker-next,.ui-datepicker .ui-datepicker-prev{
    top:5px;
}
.common-form ::-webkit-input-placeholder{
    color: #aaa;
}
.p-b-0{
    padding-bottom: 0px;
}
.p-t-0{
    padding-top: 0px;
}
.ui-datepicker-calendar th span{
    font-family: font1;
}
.employee_update_button .button-column a:first-child{
    display: block;
}
.pagination {
    margin-top: 6px !important;
    margin-bottom: 8px !important;
    display: flex;
    padding-left: 0;
    list-style: none;
    border-radius: 0.25rem;
    margin: auto;
}
.pagination li a{
    background: #0e83cd;
    color: #fff;
    padding: 8px 12px;
    text-decoration: none;
    border-right: 1px solid #ccc;
}
.pagination .active a{
  background: #157dad;
}
.pagination li:first-child a{
    border-top-left-radius: 15px;
    border-bottom-left-radius: 15px;
}
.pagination li:last-child a{
    border-top-right-radius: 15px;
    border-bottom-right-radius: 15px;
}


.common-form label,label{
    color: #000;
    font-size: 14px;
    margin-top: 15px;
    font-family: font3;
    padding: 0px !important;
}
.highlight{
    background: #eee;
    border:1px solid #ccc;
}
.m-r-15{
    margin-right:15px;
}
.highlight label{
    color: #fff;
background: #60b249;
margin: 0px;
padding-top: 8px important;
text-transform: uppercase;
line-height: 35px;
}
.highlight .right{
    padding: 10px !important;
}
.highlight{
    text-align: center;
}
.description input{
    /* height: 150px; */
border: 1px solid #ccc;
}
.border{
    border:1px solid #ccc;
    padding: 10px;
}
.m-b-20{
    margin-bottom: 20px;
}
.m-b-10{
    margin-bottom: 10px;
}
.attach input[type="file"]{
     padding: 0px;
     border:none;
}
.with-preview::-webkit-file-upload-button{
    background: rgba(0, 0, 0, 0) linear-gradient(to right, rgb(255, 65, 108), rgb(255, 75, 43)) repeat scroll 0% 0%;
    border:none;
    border-radius: 20px;
    color: #fff;
    padding:8px 20px;
}
input[type="checkbox"]{
    width:15px;
    box-shadow: inset 0px 0px 0px 4px #222;width: 14px;
    height: 15px !important;
    box-shadow: inset 0px 0px 0px 2px #9a9a9a;
    margin-right: 6px;
}
.mark_button p{
    background: #0275d8;
padding: 8px 20px !important;
display: block;
color: #fff;
display: inline;
margin-bottom: 20px;
/* font-weight: 600; */
}
.mark_button{
    margin-top: 20px;
}


.logo{
    position: relative;
    height: 100px;
}
.logo img{
    position: absolute;
    top:0;
    left:0;
    right:0;
    max-width:100%;
    max-height: 100%;
    margin: auto;
    border: none;
}
.common-form input[type="radio"]{
    width:13px !important;
    height: 13px !important;
    top: 4px;
    position: relative;
}
.back_button,.add_button{
    color: #fff !important;
    text-decoration: none;
    padding: 13px 22px !important;
    border-radius: 3px !important;
    /* box-shadow: 0px 4px 5px rgba(0,0,0,0.2); */
    font-size: 14px;
    text-transform: uppercase;
    /* border-bottom: 4px solid green !important; */
    margin-bottom: 10px;
    width: initial;
    height: initial !important;
    cursor: pointer;
    border: none;
    text-decoration: none;
    background: #03A9F4 !important;
    border: none;
    border-radius: 3px;
    padding: 11px 25px;
    font-family: font4;
}
.back_button:hover,.add_button:hover{
    text-decoration: none;
    background: #03A9F4;
    color: #fff !important;
}
.back_button{
    background: gray !important;
    color: #000;
}
.app_level{
    display: flex;
}
.app_level li{
    padding: 0px 20px;
    border-right: 2px solid #ccc;
}
.app_level li:last-child{
    border-right: none;
}
.with-preview{
    border-bottom: none;
}
.foot-login{
    color: #fff;
    text-align: center;
    position: relative;
    font-family: font4;
    font-size: 14px;
}
.foot-login a{
    text-decoration: underline;
    color: #3be8b0;
}
hr{
    margin-top: 0.8rem;
    margin-bottom: 0.8rem;
    border-top: 1px solid rgba(255, 255, 255, 0.34);
    position: relative;
}
.powered{
    position: absolute;
    bottom: 60px;
    left: 0;
    right: 0;
    text-align: center;
    background: #0e83cd;
}
.powered p{
    color: #fff;
    font-size: 14px;
    padding: 10px;
    margin:0px;
}
.powered p a{
    color: #fff;
    text-decoration: underline;
}
.one .inner a{
    background: linear-gradient(45deg,#843cf7,#38b8f2);
}
.two .inner a{
    background: linear-gradient(to right, rgb(173, 209, 0), rgb(123, 146, 10));
}
.five .inner a{
    background: linear-gradient(to right, rgb(101, 78, 163), rgb(234, 175, 200));
}
.six .inner a{
    background: linear-gradient(to right, rgb(241, 39, 17), rgb(245, 175, 25));
}
.three .inner a{
    background: linear-gradient(45deg,#004b91,#78cc37);
}
.four .inner a{
    background: linear-gradient(45deg,#9b3cb7,#ff396f);
}
.banner img{
    width:100%;
}
main{
    overflow-x:hidden;
}
.banner .title i{
    font-size: 45px;
    color: #fff;
}
.banner .title h1{
    color: #fff;
    font-size: 27px;
    font-family: font4;
    letter-spacing: -0.5px;
    text-align: left;
    padding-left: 30px;
}
.empty{
    font-family: font4;
    font-size: 14px;
    letter-spacing: -0.5px;
}
.common-table h4{
    font-family: font5;
    letter-spacing: -0.5px;
    font-size: 23px;
    padding-top: 20px;
}
.btn-primary{
    background: #0e83cd !important;
    border:none;
    border-radius: 3px;
    padding: 11px 25px;
    font-family: font4;
    letter-spacing: -0.5px;
}
.btn-primary:hover{
    border:none;
}
.btn-primary:focus{
    box-shadow: none;
}
.subhead{
    background: #03a9f4 !important;
}
body input::-webkit-file-upload-button{
    background: linear-gradient(45deg,#004b91,#78cc37) !important;
    border-radius: 3px !important;
    font-family: font4 !important;
    font-size: 14px !important;
}
.btn-danger{
    background: gray !important;
    color: #fff;
    text-transform: uppercase;
    font-size: 14px;
    font-family: font4;
    border:none;
    padding: 13px 20px;
    border-radius: 2px;
}
.checkmark{
    position: absolute;
    top: 2px !important;
    left: -22px !important;
    height: 17px !important;
    width: 17px !important;
    background-color: #bdbdbd ;
    border-radius: 100% !important;
}
.container .checkmark:after{
    top: 5px !important;
    left: 5px !important;
    width: 8px !important;
    height: 8px !important;
    border-radius: 50%;
    background: white;
}




/* CHAT */
#frame {
    width: 100%;
      height: 92vh;
      min-height: 300px;
      max-height: 720px;
      background: #E6EAEA;
  }
  #frame #sidepanel {
    float: left;
    width: 28%;
    height: 100%;
    background: #2c3e50;
    color: #f5f5f5;
    overflow: hidden;
    position: relative;
  }
  #frame #sidepanel #profile {
    width: 80%;
    margin: 25px auto;
  }
  #frame #sidepanel #profile.expanded .wrap {
    height: 210px;
    line-height: initial;
  }
  #frame #sidepanel #profile.expanded .wrap p {
    margin-top: 20px;
  }
  #frame #sidepanel #profile.expanded .wrap i.expand-button {
    -moz-transform: scaleY(-1);
    -o-transform: scaleY(-1);
    -webkit-transform: scaleY(-1);
    transform: scaleY(-1);
    filter: FlipH;
    -ms-filter: "FlipH";
  }
  #frame #sidepanel #profile .wrap {
    height: 60px;
    line-height: 60px;
    overflow: hidden;
    -moz-transition: 0.3s height ease;
    -o-transition: 0.3s height ease;
    -webkit-transition: 0.3s height ease;
    transition: 0.3s height ease;
  }
  #frame #sidepanel #profile .wrap img {
    width: 50px;
    border-radius: 50%;
    padding: 3px;
    border: 2px solid #e74c3c;
    height: auto;
    float: left;
    cursor: pointer;
    -moz-transition: 0.3s border ease;
    -o-transition: 0.3s border ease;
    -webkit-transition: 0.3s border ease;
    transition: 0.3s border ease;
  }
  #frame #sidepanel #profile .wrap img.online {
    border: 3px solid #726dbf;
      padding: 0px;
  }
  #frame #sidepanel #profile .wrap img.away {
    border: 2px solid #f1c40f;
  }
  #frame #sidepanel #profile .wrap img.busy {
    border: 2px solid #e74c3c;
  }
  #frame #sidepanel #profile .wrap img.offline {
    border: 2px solid #95a5a6;
  }
  #frame #sidepanel #profile .wrap p {
      float: left;
      margin-left: 15px;
      padding: 0px;
      color: #fff;
      font-family: font3;
  }
  #frame #sidepanel #profile .wrap i.expand-button {
    float: right;
    margin-top: 23px;
    font-size: 0.8em;
    cursor: pointer;
    color: #435f7a;
  }
  #frame #sidepanel #profile .wrap #status-options {
    position: absolute;
    opacity: 0;
    visibility: hidden;
    width: 150px;
    margin: 70px 0 0 0;
    border-radius: 6px;
    z-index: 99;
    line-height: initial;
    background: #435f7a;
    -moz-transition: 0.3s all ease;
    -o-transition: 0.3s all ease;
    -webkit-transition: 0.3s all ease;
    transition: 0.3s all ease;
  }
  #frame #sidepanel #profile .wrap #status-options.active {
    opacity: 1;
    visibility: visible;
    margin: 75px 0 0 0;
  }
  #frame #sidepanel #profile .wrap #status-options:before {
    content: '';
    position: absolute;
    width: 0;
    height: 0;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-bottom: 8px solid #435f7a;
    margin: -8px 0 0 24px;
  }
  #frame #sidepanel #profile .wrap #status-options ul {
    overflow: hidden;
    border-radius: 6px;
  }
  #frame #sidepanel #profile .wrap #status-options ul li {
    padding: 15px 0 30px 18px;
    display: block;
    cursor: pointer;
  }
  #frame #sidepanel #profile .wrap #status-options ul li:hover {
    background: #496886;
  }
  #frame #sidepanel #profile .wrap #status-options ul li span.status-circle {
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    margin: 5px 0 0 0;
  }
  #frame #sidepanel #profile .wrap #status-options ul li span.status-circle:before {
    content: '';
    position: absolute;
    width: 14px;
    height: 14px;
    margin: -3px 0 0 -3px;
    background: transparent;
    border-radius: 50%;
    z-index: 0;
  }
  #frame #sidepanel #profile .wrap #status-options ul li#status-online span.status-circle {
    background: #2ecc71;
  }
  #frame #sidepanel #profile .wrap #status-options ul li#status-online.active span.status-circle:before {
    border: 1px solid #2ecc71;
  }
  #frame #sidepanel #profile .wrap #status-options ul li#status-away span.status-circle {
    background: #f1c40f;
  }
  #frame #sidepanel #profile .wrap #status-options ul li#status-away.active span.status-circle:before {
    border: 1px solid #f1c40f;
  }
  #frame #sidepanel #profile .wrap #status-options ul li#status-busy span.status-circle {
    background: #e74c3c;
  }
  #frame #sidepanel #profile .wrap #status-options ul li#status-busy.active span.status-circle:before {
    border: 1px solid #e74c3c;
  }
  #frame #sidepanel #profile .wrap #status-options ul li#status-offline span.status-circle {
    background: #95a5a6;
  }
  #frame #sidepanel #profile .wrap #status-options ul li#status-offline.active span.status-circle:before {
    border: 1px solid #95a5a6;
  }
  #frame #sidepanel #profile .wrap #expanded {
    padding: 100px 0 0 0;
    display: block;
    line-height: initial !important;
  }
  #frame #sidepanel #profile .wrap #expanded label {
    float: left;
    clear: both;
    margin: 0 8px 5px 0;
    padding: 5px 0;
  }
  #frame #sidepanel #profile .wrap #expanded input {
    border: none;
    margin-bottom: 6px;
    background: #32465a;
    border-radius: 3px;
    color: #f5f5f5;
    padding: 7px;
    width: calc(100% - 43px);
  }
  #frame #sidepanel #profile .wrap #expanded input:focus {
    outline: none;
    background: #435f7a;
  }
  #frame #sidepanel #search {
    border-top: 1px solid #32465a;
    border-bottom: 1px solid #32465a;
    font-weight: 300;
    background: #3e5267;
  }
  #frame #sidepanel #search label {
    position: absolute;
    margin: 10px 0 0 20px;
  }
  #hospital_agency_list{
      
  }
  .meta p{
      padding: 0px;
      font-family: font1;
      color: #fff;
      margin: 0px;
  }
  .preview{
      color: #9f9f9f !important;
  }
  .meta p b{
      font-weight: normal !important;
  }
  #frame #sidepanel #search input {
      padding: 10px 0 10px 46px;
      width: calc(100% - 25px);
      border: none;
      background: #3e5267;
      color: #f5f5f5;
      font-family: font1;
      font-size: 14px;
  }
  #frame #sidepanel #search input:focus {
    outline: none;
    background: #3e5267;
  }
  #frame #sidepanel #search input::-webkit-input-placeholder {
    color: #f5f5f5;
  }
  #frame #sidepanel #search input::-moz-placeholder {
    color: #f5f5f5;
  }
  #frame #sidepanel #search input:-ms-input-placeholder {
    color: #f5f5f5;
  }
  #frame #sidepanel #search input:-moz-placeholder {
    color: #f5f5f5;
  }
  #frame #sidepanel #contacts {
    height: calc(100% - 177px);
    overflow-y: scroll;
    overflow-x: hidden;
  }
  #frame #sidepanel #contacts.expanded {
    height: calc(100% - 334px);
  }
  #frame #sidepanel #contacts::-webkit-scrollbar {
    width: 8px;
    background: #ccc;
  }
  #frame #sidepanel #contacts::-webkit-scrollbar-thumb {
    background-color: #adadad;
  }
  #frame #sidepanel #contacts ul li.contact {
    position: relative;
    padding: 10px 0 5px 0;
    font-size: 0.9em;
    cursor: pointer;
    border-bottom:1px solid #555;
  }
  #frame #sidepanel #contacts ul li.contact:hover {
    background: #32465a;
  }
  #frame #sidepanel #contacts ul li.contact.active {
    background: #32465a;
    border-right: 5px solid #555;
  }
  #frame #sidepanel #contacts ul li.contact.active span.contact-status {
    border: 2px solid #32465a !important;
  }
  #frame #sidepanel #contacts ul li.contact .wrap {
    width: 88%;
    margin: 0 auto;
    position: relative;
  }
  #frame #sidepanel #contacts ul li.contact .wrap span {
    position: absolute;
    left: 0;
    margin: -2px 0 0 -2px;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    border: 2px solid #2c3e50;
    background: #95a5a6;
  }
  #frame #sidepanel #contacts ul li.contact .wrap span.online {
    background: #2ecc71;
  }
  #frame #sidepanel #contacts ul li.contact .wrap span.away {
    background: #f1c40f;
  }
  #frame #sidepanel #contacts ul li.contact .wrap span.busy {
    background: #e74c3c;
  }
  #frame #sidepanel #contacts ul li.contact .wrap img {
    width: 40px;
    border-radius: 50%;
    float: left;
    margin-right: 10px;
  }
  #frame #sidepanel #contacts ul li.contact .wrap .meta {
    padding: 5px 0 0 0;
  }
  #frame #sidepanel #contacts ul li.contact .wrap .meta .preview {
    margin: 5px 0 0 0;
    padding: 0 0 1px;
    font-weight: 400;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    -moz-transition: 1s all ease;
    -o-transition: 1s all ease;
    -webkit-transition: 1s all ease;
    transition: 1s all ease;
  }
  #frame #sidepanel #contacts ul li.contact .wrap .meta .preview span {
    position: initial;
    border-radius: initial;
    background: none;
    border: none;
    padding: 0 2px 0 0;
    margin: 0 0 0 1px;
  }
  #frame #sidepanel #bottom-bar {
    position: absolute;
    width: 100%;
    bottom: 0;
  }
  #frame #sidepanel #bottom-bar button {
    float: left;
    border: none;
    width: 50%;
    padding: 10px 0;
    background: #32465a;
    color: #f5f5f5;
    cursor: pointer;
    font-size: 0.85em;
  }
  #frame #sidepanel #bottom-bar button:focus {
    outline: none;
  }
  #frame #sidepanel #bottom-bar button:nth-child(1) {
    border-right: 1px solid #2c3e50;
  }
  #frame #sidepanel #bottom-bar button:hover {
    background: #435f7a;
  }
  #frame #sidepanel #bottom-bar button i {
    margin-right: 3px;
    font-size: 1em;
  }
  #frame .content {
    width: 72% !important;
    height: 100%;
    overflow: hidden;
    position: relative;
    background: #fff;
    border:1px solid #ccc;
  }
  #frame .content .contact-profile {
    width: 100%;
    height: 60px;
    line-height: 60px;
    background: #03a9f4;
  }
  #frame .content .contact-profile img {
    width: 40px;
    border-radius: 50%;
    float: left;
    margin: 9px 12px 0 9px;
  }
  #frame .content .contact-profile p {
    float: left;
    color:#fff;
    font-family:font1;
    padding-left: 10px;
  }
  #frame .content .contact-profile .social-media {
    float: right;
  }
  #frame .content .contact-profile .social-media i {
    margin-left: 14px;
    cursor: pointer;
  }
  #frame .content .contact-profile .social-media i:nth-last-child(1) {
    margin-right: 20px;
  }
  #frame .content .contact-profile .social-media i:hover {
    color: #435f7a;
  }
  #frame .content .messages {
    height: auto;
    min-height: calc(100% - 93px);
    max-height: calc(100% - 93px);
    overflow-y: scroll;
    overflow-x: hidden;
  }
  #frame .content .messages::-webkit-scrollbar {
    width: 8px;
    background: transparent;
  }
  #frame .content .messages::-webkit-scrollbar-thumb {
    background-color: rgba(0, 0, 0, 0.3);
  }
  #frame .content .messages ul li {
    display: inline-block;
    clear: both;
    margin: 15px 15px 5px 15px;
    width: calc(100% - 25px);
    font-size: 0.9em;
  }
  #frame .content .messages ul li:nth-last-child(1) {
    margin-bottom: 20px;
  }
  #frame .content .messages ul li.replies img {
    margin: 6px 8px 0 0;
  }
  #frame .content .messages ul li.replies p {
      background: #fff;
      color: #2c3e50;
      border-radius: 24px;
      padding: 8px 20px;
      border-bottom-left-radius: 0px;
      box-shadow: 0 19px 38px rgba(0, 0, 0, 0.08), 0 15px 12px rgba(0, 0, 0, 0.13);
  }
  #frame .content .messages ul li.replies p small{
      color: #2c3e50;
      font-size: 13px;
  }
  #frame .content .messages ul li.sent img {
    float: right;
    margin: 6px 0 0 8px;
  }
  #frame .content .messages ul li.sent p {
      background: #746dbd;
      float: right;
      border: none;
      color: #fff;
      border-radius: 24px;
      padding: 8px 20px;
      border-bottom-right-radius: 0px;
      box-shadow: 0 19px 38px rgba(0, 0, 0, 0.08), 0 15px 12px rgba(0, 0, 0, 0.13);
  }
  #frame .content .messages ul li.sent p small{
      color: #d6d6d6;
      font-size: 13px;
  }
  .dd-cc a{
      background: #fff;
      padding: 10px;
      box-shadow: 0 19px 38px rgba(0, 0, 0, 0.15), 0 15px 12px rgba(0, 0, 0, 0.08);
      font-family: font1;
      position: absolute;
      top: 60px;
      right: 0px;
      line-height: 17px;
      width: 100px;
      display: none;
      cursor: pointer;
  }
  .individual_cnt{
      font-size: 14px;
      font-family: font2;
  }
  #chatmain_div{
      width: 100%;
  }
  #chatmain_div ul{
      padding-left: 20px;
  }
  #frame .content .messages ul li img {
    width: 22px;
    border-radius: 50%;
    float: left;
  }
  #frame .content .messages ul li p {
    display: inline-block;
    padding: 10px 15px;
    border-radius: 20px;
    max-width: 205px;
    line-height: 130%;
  }
  #frame .content .message-input {
    position: absolute;
    bottom: 0;
    width: 100%;
    z-index: 99;
  }
  #frame .content .message-input .wrap {
    position: relative;
  }
  #frame .content .message-input .wrap input {
      float: left;
      border: none;
      width: 90%;
      padding: 15px 32px 10px 8px;
      font-size: 0.8em;
      color: #32465a;
      height: 60px;
      font-size: 14px;
  }
  #frame .content .message-input .wrap input:focus {
    outline: none;
  }
  #frame .content .message-input .wrap .attachment {
    position: absolute;
    right: 60px;
    z-index: 4;
    margin-top: 10px;
    font-size: 1.1em;
    color: #435f7a;
    opacity: .5;
    cursor: pointer;
  }
  #frame .content .message-input .wrap .attachment:hover {
    opacity: 1;
  }
  #frame .content .message-input .wrap button {
      float: right;
      border: none;
      width: 69px;
      height: 60px;
      cursor: pointer;
      background: #03a9f4;
      color: #f5f5f5;
      position: relative;
  }
  #frame .content .message-input .wrap button::before{
      position: absolute;
      top: 0;
      left: -14px;
      background: #03a9f4;
      width: 30px;
      height: 100%;
      transform: skewX(-17deg);
      content: "";
  
  }
  #frame .content .message-input .wrap button i{
      font-size: 25px;
  }
  #frame .content .message-input .wrap button:hover {
    background: #5a52a5;
  }
  #frame .content .message-input .wrap button:focus {
    outline: none;
  }
  .activity-view{box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.05), 0 3px 1px -2px rgba(0, 0, 0, 0.08), 0 1px 5px 0 rgba(0, 0, 0, 0.08);
    margin-bottom: 10px;}
.activity-view li{padding: 3px 4px 0px 4px;
    border-right: 1px solid #ccc;
    text-align: center;
    display: inline-block;
    padding: 0px 10px;
    width: 24%;
}
.top-activity{
    border: 1px solid #ccc;
    margin-bottom: 15px;
    padding: 0px;
}
.top-activity ul{
    border-bottom: 1px solid #ccc;
    box-shadow: none;
    margin: 0px;
}
.top-activity ul:nth-child(2){
    border-bottom: none;
}
    .activity-description li{
        width: unset;border-bottom: none;
    }
.activity-view li:last-child{border-right: none;}
.activity-view label{
    text-align: center;
}
.second li:nth-child(4){width: 12%;}
.activity-view .act_description{width: 25% !important;}
.sub-view li{width: 31% !important;
    border: 2px solid #aba6a6;
    margin: 1% 1%;
    padding: 0px;
    border-right: 2px solid #aba6a6 !important;}
.sub-view label{margin: 0px;
    padding: 5px;}
    .sub-view a{text-decoration: none;
        color: #006cca;
        font-size: 14px;
        font-family: font4;}
.sub-view .top{text-transform: capitalize;
    text-align: center;
    font-family: font5;
    border-bottom: 2px solid #aba6a6;
    /* background: #e1efef; */
    color: #000000;}
.activity-posted ul li{
    display: inline-block;
    padding: 8px 9px;
    margin-right: 0px;
    margin-bottom: 0px;
    width: unset !important;
    color: #006cca;
    border-right: 1px solid #bbb;
    font-family: font5;
    font-size: 14px;
}
.activity-posted ul li:last-child{
    border-right: none;
}
.activity-posted ul li p{
    margin: 0px !important;
    font-size: 14px;color: #006cca;
    font-family: font5;
}
.three-view li{
    width:32%;
}
.url_assoc_inner label{
    width: 30%;
    float: left;
    text-align: left;
}
.posted{
    box-shadow: none;
    border: 1px solid #bbb;
}
.url_assoc_inner a{
    color: #0275d8;
    text-decoration: none;
    font-size: 14px;
}
.url_assoc_inner .ri{
    width: 70%;
    float: left;
    padding-left: 15px;
    word-break: break-word;
    padding-right: 10px;
    text-align: left;
}
.activity-details a{
    color: #0275d8;
    text-decoration: none;
    font-size: 14px;
}
.url_assoc_inner p{
    color: #000;
    text-decoration: none;
    font-size: 14px;
    margin: 0px;
    margin-top: 5px !important;
}
.activity-posted label{
    margin-top: 6px;
}
h3{
    font-size: 18px;
}
.other_assoc_inner li{
    text-align: center;
}
.other_assoc .inside a{
    color: #0275d8;
    text-decoration: none;
}
.other_assoc .inside{
    text-align: left;
}
.other_assoc .inside label{
    margin-right: 15px;
    margin-top: 5px;
    margin-bottom: 5px;
}
.other_assoc{
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.05), 0 3px 1px -2px rgba(0, 0, 0, 0.08), 0 1px 5px 0 rgba(0, 0, 0, 0.08);
    margin-bottom: 20px;
}
.url_assoc_inner{
    width: 100%;
    float: left;
    border-bottom: 1px solid #ccc;
    padding: 5px !important;
}
.specify{
    font-size: 18px !important;
    color: #0275d8 !important;
    font-family: font5 !important;
    letter-spacing: -0.7px;
}
.added-boxshadow{
    box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
    margin-bottom: 15px; 
}
.added-boxshadow .inner{
    padding: 0px;
    text-align: center;
    border-right: none;
}
.added-boxshadow .col-md-4{
    border-right:1px solid #ccc;
}
.added-boxshadow .col-md-4:last-child{
    border-right: none;
}
.added-boxshadow label{
    text-align: center;
    margin-bottom: 0px;
}
.added-boxshadow ul{
    margin:0px;
}
.added-boxshadow .inner p{
    color: #000;
    margin: 0px;
}
.added-boxshadow .inner li{
    display: inline-block;
    box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
    padding: 5px;
}
.other_assoc .inside li{
    box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
    padding: 5px 10px;
    margin-right: 10px;
    margin-bottom: 10px;
    display: inline-block;
}
.activity-posted .inner{
    box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
    border-right: none;
    padding: 0px 10px;
}
.act_description label{
    margin-top: 5px;
}
.activity-view p{
    font-size: 14px;
    margin: 0px;
    text-align: center;
}
.activity-title h1{
    font-size: 18px;
    border-bottom: 4px double #ccc;
    display: inline-block;
    font-family: font1;
}
.url_assoc_inner p{
    text-align: left;
}
.activity-view .right{
    font-size: 14px;
    margin: 0px;
    word-break: break-all;
    text-align: center;
}
.activity-view li:nth-child(4){
    border-right: none;
}
/* .height-added li{
    height: 90px;overflow-y: auto;
    word-break: break-all;
}  */
.attach-li
{
    padding: 10px;
    margin: 0px;
    padding-top: 0px;
}
.attach-li li{
    display: inline-block;
    /* width: 100% !important; */
    border: none;
    word-break: break-word;
    min-height: 0px;
    margin: 4px 0px;
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.08), 0 3px 1px -2px rgba(49, 49, 49, 0.02), 0 1px 5px 0 rgba(0, 0, 0, 0);;
    width: 32%!important;
    margin-right: 10px;
    padding: 5px 10px;
}
.attach-li li:last-child{
    border-right: none !important;
}
#viewattendancestatusModal .s3_attachment{
    font-size: 14px;
    color: #0275d8;
    text-decoration: none;
}
#viewattendancestatusModal .s3_attachment i{
    font-size: 20px!important;
}
#viewattendancestatusModal a{
    color: #0275d8;
    text-decoration: none;
    font-size: 14px;
    word-break: break-all;
}
#viewattendancestatusModal .right{
    font-size: 14px;
}
#viewattendancestatusModal .modal-header{
    background: #0e83cd;
    color: #fff;
}
#viewattendancestatusModal .modal-header h4{
    font-size: 20px;
}
.close{
    float: right;
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1;
    color: #0275d8;
    text-shadow: 0 1px 0 #fff;
    opacity: 1 !important;
    /* background: #fff !important; */
}
.posted .col-md-4{
    width: 32%;
}
.school li{
    box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
    margin-right: 10px;
    font-size: 14px;
    color: #000;
    height: unset;
    padding: 5px;
    display: inline-block;
    min-height: 50px;
}
.nexttoschool label{
    text-align: left !important;
}
.url_assoc_inner:last-child{
    border-bottom: none;
}
.activity-description li{
    width: 100%;
}
.activity-description label{
    text-align: center;
}
.act-title{
    text-transform: capitalize !important;
    font-size: 14px !important;
    text-align: center !important;
    font-family: font3 !important;
    letter-spacing: -0.7px;
    background: none !important;
    border:none !important;
    margin: 0px !important;
}
.table-bordered{
    border: 1px solid #bbb !important;
}
.table-bordered td, .table-bordered th{
    border: 1px solid #bbb !important;
    font-weight: 100;
    font-family: font4;
}
.table-bordered td{
    font-family: font1;
}
.added-boxshadow p{
    font-size: 14px;
}
.activity-table{
    width: 100%;
    overflow-x: auto;
    padding: 0px;
}
.update_activity{
    border: 1px solid #555;
    padding: 0px;
}
.update_activity .col-md-3{
    border-right: 1px solid #222;
    padding: 13px 10px;
    margin: 0px;
}
.update_activity .inner .one:last-child {
    border-right: none;
}
.update_activity .inner{
    padding: 0px 0px;
    border: 1px solid #222;
    margin: 10px 0px;
}
#posted_school_class_section_div  .col-md-3{
    border-right: none;
}
::-webkit-input-placeholder{
    font-size: 14px;
}
.subhead th{
    background: #5aaaba !important;
}
.m-0{margin: 0px;}
.join_status{
    background: #0e679e;
    color: #fff !important;
    padding: 4px !important;font-family: font1 !important;
}
#question-grid .button-column{
    width: 20%;
}
#question-grid .fa-refresh{
    color: green;
}
.status_all{
    width: 14%;
}
.conference_view{
    padding: 15px;
    background: #ffff;
    box-shadow: 0 2px 2px 0 rgba(0,0,0,.14), 0 3px 1px -2px rgba(0,0,0,.2), 0 1px 5px 0 rgba(0,0,0,.12);
}
.end_status{
    background: tomato;
    color: #fff !important;
    padding: 4px !important;
    margin-left: 3px;font-family: font1 !important;
}
.wait_status{
    background: orange;
    color: #fff !important;
    padding: 4px !important;
    font-family: font1 !important;
}
.start_status{
    background: green;
    color: #fff !important;
    padding: 4px !important;font-family: font1 !important;
}
#question-grid .button-column{
    width: 20%;
}
#question-grid .fa-refresh{
    color: green;
}
.status_all{
    width: 14%;
}
.conference_view{
    padding: 15px;
    background: #ffff;
    box-shadow: 0 2px 2px 0 rgba(0,0,0,.14), 0 3px 1px -2px rgba(0,0,0,.2), 0 1px 5px 0 rgba(0,0,0,.12);
    margin-top: 15px;
}
.wizard_conf li {
    display: inline-block;
    list-style: none;
}
.wizard_conf{
    text-align: center;
    margin: 0px;
    border-bottom: 1px solid #00bcd4;
}
.wizard_conf li a{
    background: #00BCD4 !important;
    border: none !important;
    border-radius: 0px;
    outline: 1px solid white;
    outline-offset: -4px;
    padding: 10px 20px;
    color:  #fff !important;
}
.wizard_conf .btn-success{
    background: green !important;
}
.conf_list label{
color: #000;;letter-spacing: -0.5px;font-size: 16px;
}
.conf_list p{
    color: #000;
    letter-spacing: -0.5px;
    font-size: 14px;
    margin: 0px !important;
    padding: 0px;
}
.conf_list{
    text-align: center;
    border:1px solid #ccc;
    background: #fff;
}
.conf_list .inner{
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    padding: 8px 0px;
}
.conf_list .agenda{
    width: 100%;float: left;
}
.conf_list .moderator{
    width: 100%;float: left;
}
.conf_list .one{
    width: 20%;float: left;
}
.conf_list{
    /* margin-top:15px; */
}
.conf_list .moderator .inn{
    font-size: 14px;
    background: #eee;
    padding: 0px 10px !important;
    margin: 6px 8px !important;
    display: inline-block;
    padding: 8px !important;
}
#host_1{display: inline-flex;}
#host_1 label{margin-top: 0px;}
.confreq_radio{margin-top: 10px;}
.m-t-40{margin-top: 40px;}
.host{display: inline-flex !important;}
.host_field{background: #eee; padding: 10px;border-bottom: 1px solid #ccc;}
.trash{
    box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 3px 1px -2px rgba(0,0,0,0.12), 0 1px 5px 0 rgba(0,0,0,0.2);
    background: tomato;
    border: none;
    border-radius: 2px;
    display: inline-block;
    padding: 8px 16px;
    /* text-transform: uppercase; */
    color: #fff;
    font-family: font4;
    cursor: pointer;
    outline: none !important;
    border: none !important;
}
input[type="file"]{
    background: transparent;
    padding-left: 0px;
}
.MultiFile-wrap input {
    border: none;
}
.MultiFile-wrap input {
    border-bottom: none !important;
}
.common-form input[type="radio"] {
    display: unset;
    margin-right: 3px;
}
input[type="checkbox"]{
    box-shadow: none !important;
}



/* RESPONSIVE */

@media(max-width:1199px){


    .login_main .head:after{border-top: 227px solid #3be8b0;}
    .site-nav{width: 21%;}
    .payroll_db_inner .block{width:25%;}
    .payroll_db_inner .block .inner a{padding: 10px 11px;}

}
@media(max-width:992px){

    .foot-login{font-size: 14px;}
    .login_main{margin: 3% auto;}
    .login_main .head:before{    border-top: 100px solid #03A9F4;}
    .login_main .head:after{    border-top: 121px solid #3be8b0;}
    .login_main .head{margin-bottom: 120px;}
    .login_main .head:after{border-left: 314px solid transparent;}

    .site-logo{width: 100%;text-align: center;border-bottom: 1px solid #ccc;border-right: none;}
        .short-menu{width: 20%;float: left;}
        .site-nav{width: 80%;position: relative;}
        .notification{padding-left: 30px;}
        .site-nav .menu{text-align: right;}
        .site-nav ul{top:40px;padding: 0px 10px;}
        .leftside{margin-left:-260px;}
        .rightside{margin-left:0px;}
        .banner{display: none;}
        .rightside{margin-top: 0px;}
        .heading .link a{margin-top:10px;}
        .rightside{padding: 20px 10px;}
        /* .rightside .container-fluid{padding: 0px;} */
        .app_level{display: unset;}
        .app_level li{padding: 0px;}
        /* .rightside .container-fluid{padding: 0px;} */
        .app_level{display: unset;}
        .app_level li{padding: 0px;}
        .app_level li{border-right:none;font-size: 14px;}
        .admin_req{font-size: 14px;}
        .admin_req th{width: 20%;}
        .pagination{    display: -webkit-box;}
        .pagination li a{    font-size: 12px;}
        .common-table tr td{font-size: 15px;}
        .highlight{margin: 0px;margin-bottom: 15px;}
        .tup{padding: 0px 15px !important;}
        .mob-form input,.mob-form select{width:150px;}
        .menu-overlay ul{padding: 100px 0px;margin: 0px 20px;display: block;}
.mob-menu{    background: #03A9F4;text-align: center;color: #fff;padding: 7px;font-family: font4;font-size: 14px;cursor: pointer;}
.mob-menu i{font-size: 25px;margin-right:8px;}
.top_header{position: unset;}
main{margin-top: 0px;}
.leftmenu{margin-left: 0px;z-index: 1;}
.payroll_content{padding: 0px 15px;}
.common-table h4{font-size: 20px;}
.common-table tr th,.heading .link a{font-size: 14px;}
.common-form h3, .common-heading h3{font-size: 14px;}
.common-form select,.common-form input,.select2-container .select2-choice,.btn-danger{font-size: 14px !important;}
.rightside h1{font-size: 18px;margin-bottom: 10px;}
.common-form .button input, .common-form .button button,.back_button, .add_button{font-size: 14px !important;}
.mobile-dashbaord{padding: 0px 40px;}

.payroll_db_inner .block .inner a{font-size: 19px;}
.menu-overlay ul li{margin:auto;}


    
}
@media(max-width:767px){

    .foot-login{font-size: 14px;}
    .login_main{margin: 3% 3%;}
    .login_main .head:before{    border-top: 100px solid #03A9F4;}
    .login_main .head:after{    border-top: 121px solid #3be8b0;}
    .login_main .head{margin-bottom: 120px;}
    .login_main .head:after{border-left: 314px solid transparent;}

    .site-logo{width: 100%;text-align: center;border-bottom: 1px solid #ccc;border-right: none;}
        .short-menu{width: 20%;float: left;}
        .site-nav{width: 80%;position: relative;}
        .notification{padding-left: 30px;}
        .site-nav .menu{text-align: right;}
        .site-nav ul{top:41px;}
        .leftside{margin-left:-260px;}
        .rightside{margin-left:0px;}
        .banner{display: none;}
        .rightside{margin-top: 0px;}
        .heading .link a{margin-top:10px;}
        .rightside{padding: 20px 10px;}
        /* .rightside .container-fluid{padding: 0px;} */
        .app_level{display: unset;}
        .app_level li{padding: 0px;}
        /* .rightside .container-fluid{padding: 0px;} */
        .app_level{display: unset;}
        .app_level li{padding: 0px;}
        .app_level li{border-right:none;font-size: 14px;}
        .admin_req{font-size: 14px;}
        .admin_req th{width: 20%;}
        .pagination{    display: -webkit-box;
            margin-top: 11px;}
        .pagination li a{    font-size: 12px;}
        .common-table tr td{font-size: 15px;}
        .highlight{margin: 0px;margin-bottom: 15px;}
        .tup{padding: 0px 15px !important;}
        .mob-form input,.mob-form select{width:150px;}
        .menu-overlay ul{padding: 100px 0px;margin: 0px 20px;display: block;}
.mob-menu{    background: #03A9F4;text-align: center;color: #fff;padding: 7px;font-family: font4;font-size: 14px;cursor: pointer;}
.mob-menu i{font-size: 25px;margin-right:8px;}
.top_header{position: unset;}
main{margin-top: 0px;}
.leftmenu{margin-left: 0px;z-index: 1000;}
.payroll_content{padding: 0px 15px;}
.common-table h4{font-size: 20px;}
.common-table tr th{font-size: 14px;color: #fff;}
.heading .link a{font-size: 14px;color: #fff;}
.common-form h3, .common-heading h3{font-size: 14px;}
.common-form select,.common-form input,.select2-container .select2-choice,.btn-danger{font-size: 14px !important;}
.rightside h1{font-size: 18px;margin-bottom: 10px;}
.common-form .button input, .common-form .button button,.back_button, .add_button{font-size: 14px !important;}
.mobile-dashbaord{padding: 0px 40px;}


.site-nav{width: 80%;
    position: relative;
    margin-top: 54px;
    padding-top: 0px;}
    .short-menu{width: 20%;
        float: left;
        margin-top: 60px;}
        .site-logo{position: fixed;
            top: 0px;
            background: #fff;z-index: 1;;}



            #frame #sidepanel{margin-left: -120px;}
            #frame .content{width: 100% !important;}
            .commme{margin-left: 0px !important;width: 85% !important;}
            #frame .content .message-input .wrap input{width: 73%;height: 46px;font-size: 14px;}
            #frame .content .message-input .wrap button{height: 46px;}
            #frame .content .message-input .wrap button i{font-size: 19px;}

            .attach-li li{width: 100% !important;}
            .activity-view li{border-right: 1px solid #ccc;padding: 0px 0px;
                width: 49%;border-bottom: 1px solid #ccc;}
                .activity-description li,.sub-view li {width: 100% !important;}
                .attach-li li{padding: 4px 0px;}
                .common-form label{font-size: 14px;}
                .payroll_db_inner .block{width: 50%;}
                .subhead th{color: #fff !important;}
                .inset{width: 100%; overflow-x: auto;}
                .form-overflow{margin: 20px 0px;
                    width: 100%;
                    overflow-x: auto;
                    background: #fff;}
                    .form-overflow select{width: 100px;}
                    thead tr th, thead tr td{z-index: unset !important;}
                    .topp{padding: 0px;}
thead tr th, thead tr td{top: 0px !important;}
.status1{width: 100%;}
.wizard_conf li{margin: 10px 3px;
    display: block;
    width: 47%;
    float: left;}
    .wizard_conf li a{display: block;padding: 12px 5px !important;}
    .wizard_conf{margin: 0px;padding: 0px;border: none;}
.conf_list .one{width: 100%;}
.join_status,.end_status,.wait_status,.start_status{display: block;padding: 10px 9px !important;}
.radio{padding: 0px 15px !important;}
.confreq_radio{display: flex;}
.confreq_radio label{margin-top: 0px;}
.m-t-40{margin-top:0px;text-align: center;}
#question-grid .button-column a{margin-bottom: 5px;display: block;}
.link{margin-top: 0px;}
.checkk{padding: 0px 20px !important;}
    .m-topp{margin-top: 0px !important;
        width: 100%;
        text-align: center;
        display: block;
        margin: auto;padding: 0px 15px;}
    .attachmentsdiv{border: 1px solid #444;
        padding: 10px;
        text-align: center;margin-bottom: 15px;}
    .lms_remarks_common_div{margin: 0px;padding: 0px;}
    .clear_lms{margin-top:0px;text-align: center;}
    .topp .radio{padding: 0px !important;margin: 0px ;}
    .radio span label {margin: 0px; }
    #add_new_row{padding: 0px 20px 10px 20px;background: #eee;}
    .topp {padding: 0px;}
    .radio1{padding:0px;}
    .common-table{overflow: auto !important;}
    .rightside {margin-top: 0px !important;}
.leftside{top: 0px !important;}
.first-section .site-logo{display:none}
.ac-select{display:none}
.header .right ul li:nth-child(2),.header .right ul li:nth-child(3),.header .right ul li:nth-child(4),.header .right ul li:nth-child(5){display:none}
.short-menu{text-align:center;border-right:none !important;float:left;margin-top:0;}
.short-menu i{font-size:35px}
.header .right ul li:last-child{float:right;margin-top:10px;margin-top: 4px;}
.header .right ul li:last-child i{font-size:27px}
.first-section{min-height: 57px;}
.main-menu {top: 57px; }


    }


    
    /* STICK TABLE */
/* For appearance */
/* .common-table{overflow-x:auto}
.common-table table{display: table;}
.sticky-thead thead tr th,.sticky-thead thead tr td{background:#03A9F4!important;color: #fff !important;text-align: left !important;}
.sticky-thead .subhead th{background:#5aaaba!important;}
.table-responsive{overflow-x:hidden!important}
.sticky-wrap{overflow-x:auto;overflow-y:hidden;position:relative;width:100%}
.sticky-wrap .sticky-thead,.sticky-wrap .sticky-col,.sticky-wrap .sticky-intersect{opacity:0;position:absolute;top:0;left:0;transition:all .125s ease-in-out;z-index: -1;width:auto}
.sticky-wrap .sticky-thead{z-index:100;width:100%;}
.sticky-wrap .sticky-intersect{opacity:1;z-index:-1;opacity:0!important}
.checkbox-table th{z-index: 120;
    position: relative;;} */
    .ui-datepicker{z-index: 1000 !important;}

/*view the box style*/
.box-style ul
{
    margin: 0px;
    text-align: center;
    margin-bottom: 15px;
    background: #fff;
    /* border: 1px solid #767676; */
    box-shadow: 0 0.125rem 0.3125rem rgb(0 0 0 / 26%);
}
.list-unstyled {
    padding-left: 0;
    list-style: none;
}
.box-style ul li {
    border-right: 1px solid #797676;
    width: 25%;
    padding: 5px 10px;
}
.box-style ul li label {
        margin-top: 5px;
        /* font-family: font2; */
        letter-spacing: -0.5px;
        font-size: 16px;
        display: block;
        text-align: center;
    }
.box-style ul li p {
    color: #1173c7;
    margin: 0px;
    font-family: font3;
    padding: 0px;
    font-size: 15px;
}
.box-style ul li:last-child {
    border-right: none;
}




table {
    text-align: left;
    position: relative;
    border-collapse: collapse; 
  }
  th, td {
    padding: 0.25rem;
  }
  thead tr th,thead tr td{
    background: #5a5a5a !important;
    position: sticky;
    top: 63px;
    box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.4);
    z-index: 100;
  }


  /* ---------------------------------------------------------------- */




  .common-table,.new-table {
    width:100%;
  }
  .common-table{
      overflow-x: visible;
  }
  table {
    text-align: left;
    position: relative;
    border-collapse: collapse; 
    width: 100%;
    max-width: 100%;
  }
  th, td {
    padding: 0.25rem;
  }
  thead tr th,thead tr td{
    background: #5a5a5a !important;
    position: sticky;
    top: 63px;
    box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.4);
    z-index: 100;
  }


  .someclass{
    overflow: auto;
  }
  .someclass thead tr th,   .someclass thead tr td {
    background: #5a5a5a !important;
    position: sticky;
    top: 0px;
  }
 

  /* .someclass1 */
  .someclass1{
    overflow: auto;
  }
  .someclass1 thead tr th,   .someclass1 thead tr td {
    background: #5a5a5a !important;
    position: sticky;
    top: 0px;
  }

.exam-button a.a_excel_download,.exam-button a.a_excel_download:hover{
    background: #0e83cd;
    font-weight: 500;
    padding: 12px 25px;
    text-decoration: none;
    color: #fff;
    font-family: font4;
    font-size: 14px !important;
    letter-spacing: -0.5px;
    border-radius: 3px;
    border: none;
    cursor: pointer;
    width: unset;
    height: unset;
    line-height: unset;
    box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 3px 1px -2px rgba(0,0,0,0.12), 0 1px 5px 0 rgba(0,0,0,0.2);
}

.question-paper-icon {
    padding: 100px 0px 0px 0px;
    text-align: left;
}
.question-paper-icon i {
    color: #00aeef;
    font-size: 40px;
}
.text-primary-new
{
    color: #f9a92c !important;
    font-weight: 700;
}


/*Bucket module  developed by Ranjith : date =>18/05/2022*/

.card_new
  {
    /*border-bottom: 50px solid #fec105; /*198555,dc3547*/*/
    /*border-top: 1px solid #fec105;*/
    /*border-left: 1px solid #fec105;*/
    /*border-right: 1px solid #fec105;*/
    border-radius: 0.5rem;
    box-shadow: 0 1.125rem 1.3125rem rgb(0 0 0 / 26%);
  } 
  .card_new2
  {
    border-bottom: 50px solid #f7f7f9;
    border-top: 1px solid #acace385;
    border-left: 1px solid #acace385;
    border-right: 1px solid #acace385;
    
  } 
 
  .card_logo
  {
    margin-top: 10px;
  }
  .card_logo2
  {
    margin-top: 22px;
  }
  .card_header_new
  {
    border-top: 50px solid #f7f7f9; /*f7f7f9*/
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
  }
  .card_header_new2
  {
    border-top: 50px solid #fff; /*f7f7f9*/
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
  }
  .card_title_new
  {
    margin-top: -67px;
  }
  .card_text_hide
  {
    white-space: nowrap; 
    width: 100px; 
    overflow: hidden;
    text-overflow: ellipsis;
  }
  @media(min-width:1911px)
  {
    .card_logo
    {
     margin-top: 35px !important;
    }
    .card_logo2
    {
     margin-top:9px !important;
    }
    .bucket_card_logo_hr
    {
       margin-top: 30px !important;
    }
  }
  @media(max-width:1911px) and (min-width:1410px)
  {
    .card_new
    {
      height: 358px !important;
    }
    .card_new2
    {
      height: 323px !important;
      font-size: 14px;
    }
     .bucket_card_logo_hr
    {
       margin-top: 43px !important;
    }
  }
  @media(max-width:1409px) and (min-width:1250px)
  {
    .card_new
    {
     height: 376px !important;
    }
    .card_new2
    {
     height: 303px !important;
     font-size: 14px;
    }
     .bucket_card_logo_hr
    {
       margin-top: -6px !important;
    }
  }
  @media(max-width:1250px) and (min-width:1065px)
  {
    .card_new
    {
     height: 423px !important;
    }
    .card_new2
    {
     height: 350px !important;
    }
  }
   @media(max-width:1064px) and (min-width:571px)
  {
    .card_new
    {
     height: 423px !important;
    }
    .card_new2
    {
     height: 364px !important;
     font-size: 12px;
    }
    .bucket_card_logo_hr
    {
       margin-top: 78px !important;
    }
  }
  @media(max-width:572px) and (min-width:371px)
  {
    .card_new
    {
     height: 375px !important;
    }
  }
  @media(max-width:572px) and (min-width:414px)
  {
    .card_new2
    {
     height: 350px !important;
     font-size: 12px !important;
    }
    .card_logo2 
    {
     margin-top: 45px !important;
    }
    .bucket_card_logo_hr
    {
       margin-top: 63px !important;
    }
  }
  @media(max-width:413px) and (min-width:395px)
  {
    .card_new2
    {
     height: 350px !important;
     font-size: 12px !important;
    }
    .card_logo2 
    {
     margin-top: 48px !important;
    }
    .card_new2 tbody
    {
        font-size: 12px !important;
    }
    .bucket_card_logo_hr
    {
       margin-top: 66px !important;
    }
  }
  @media(max-width:394px) and (min-width:379px)
  {
    .card_new2
    {
     height: 350px !important;
     font-size: 11px !important;
    }
    .card_logo2 
    {
     margin-top: 57px !important;
    }
    .card_new2 tbody
    {
        font-size: 11px !important;
    }
    .bucket_card_logo_hr
    {
       margin-top: 81px !important;
    }
  }
  @media(max-width:378px) and (min-width:367px)
  {
    .card_new2
    {
     height: 350px !important;
     font-size: 10px !important;
    }
    .card_logo2 
    {
     margin-top: 72px !important;
    }
    .card_new2 tbody
    {
        font-size: 10px !important;
    }
    .bucket_card_logo_hr
    {
       margin-top: 91px !important;
    }
  }
  @media(max-width:366px) and (min-width:331px)
  {
    .card_new2
    {
     height: 350px !important;
     font-size: 8px !important;
    }
    .card_logo2 
    {
     margin-top: 90px !important;
    }
    .card_new2 tbody,a,.re_upload_fonts
    {
        font-size: 8px !important;
    }
    .bucket_card_logo_hr
    {
       margin-top: 112px !important;
    }
  }
  @media(max-width:330px) and (min-width:318px)
  {
    .bucket_card_logo_hr
    {
       margin-top: 112px !important;
    }
  }
  @media(max-width:317px) and (min-width:316px)
  {
    .bucket_card_logo_hr
    {
       margin-top: 112px !important;
    }
  }
  @media(max-width:315px)
  {
    .bucket_card_logo_hr
    {
       margin-top: 112px !important;
    }
  }
  @media(max-width:330px)
  {
    .card_new2
    {
     height: 350px !important;
     font-size: 8px !important;
    }
    .card_logo2 
    {
     margin-top: 94px !important;
    }
    .card_new2 tbody,a ,.re_upload_fonts
    {
        font-size: 8px !important;
    }
  }
  @media(max-width:372px)
  {
    .card_new
    {
     height: 440px !important;
    }
    .card_new2
    {
     height: 347px !important;
    }
  }
  @media(min-width:1912px)
  {
    .card_new
    {
     height: 390px !important;
    }
    .card_new2
    {
     height: 317px !important;
    }
  }
  .card_new tbody
  {
    font-size: 13px;
  }
  .card_new2 tbody
  {
    font-size: 13px;
  }
  .td_clr
  {
    color: #333;
  }
.dt-sc-anytitle {
  border-bottom: 1px solid;
  display: inline-block;
  position: relative;
  text-align: center;
  width: 180px;
  color: #214fa2;
  bottom: 15px;
}
.dt-sc-anytitle:after {
  background-color: #214fa2;
  bottom: -3px;
  border-radius: 20px;
  content: "";
  height: 5px;
  position: absolute;
  left: 0;
  right: 0;
  margin: auto;
  width: 60px;
}
.bucket_card_buttons {
    background-color:#fff  !important; 
    border-color:#129d12!important;  
    border: 2px solid black; 
    color:#129d12 !important;
    font-weight: 900;
    text-decoration: none;
    font-family: font4;
    letter-spacing: -0.5px;
    border-radius: 3px;
    margin: -15px 0px;
    box-shadow:  0 2px 0 rgb(0 0 0 / 12%), 0 2px 2px 0 rgb(0 0 0 / 24%);
}
@media(min-width:1328px)
{
    .card_footer_btn
    {
    

     font-size:12px !important;
     padding: 5px 9px !important; 
    }
}
@media(max-width:1327px)
{
   .card_footer_btn
    {
     font-size:8px !important;
     padding: 8px 8px !important;
    }
}
@media(max-width:1147px) and (min-width:993px)
{
    .card_size
    {
        max-width: 50% !important;
    }

}
@media(max-width:849px) and (min-width:768px)
{
    .card_size
    {
        max-width: 50% !important;
    }

}
@media(max-width:1170px) and (min-width:1103px)
{
    .card_logo2 
    {
     margin-top: 35px !important;
    }
    .bucket_card_logo_hr
    {
       margin-top: 63px !important;
    }
}
@media(max-width:1102px) and (min-width:1065px)
{
    .card_logo2 
    {
     margin-top: 40px !important;
    }
    .card_new2
    {
     font-size: 12px;
    }
    .bucket_card_logo_hr
    {
       margin-top: 63px !important;
    }
}
@media(max-width:1065px) and (min-width:1037px)
{
    .card_logo2 
    {
     margin-top: 54px !important;
    }
    .card_new2
    {
     font-size: 12px;
    }
    .bucket_card_logo_hr
    {
       margin-top: 77px !important;
    }
}
@media(max-width:1036px) and (min-width:1033px)
{
    .card_logo2 
    {
     margin-top: 34px !important;
    }
    .card_new2
    {
     font-size: 12px;
    }
    .bucket_card_logo_hr
    {
       margin-top: 52px !important;
    }
}
@media(max-width:1032px) and (min-width:1007px)
{
    .card_logo2 
    {
     margin-top: 59px !important;
    }
    .card_new2
    {
     font-size: 12px;
    }
    .bucket_card_logo_hr
    {
       margin-top: 77px !important;
    }
}
@media(max-width:996px) and (min-width:993px)
{
    .re_upload_fonts
    {
        font-size: 11px !important;
    }
}
@media(max-width:1006px) and (min-width:993px)
{
    .card_logo2 
    {
     margin-top: 15px !important;
    }
    .card_new2
    {
     font-size: 11px;
    }
    .bucket_card_logo_hr
    {
       margin-top: 77px !important;
    }
}
@media(max-width:992px) and (min-width:900px)
{
    .card_logo2 
    {
     margin-top: 15px !important;
    }
    .card_new2,.re_upload_fonts
    {
     font-size: 11px !important;
    }
    .bucket_card_logo_hr
    {
       margin-top: 40px !important;
    }
}
@media(max-width:984px) and (min-width:739px)
{
    .card_size2
    {
        max-width: 50% !important;
    }
    .card_logo2 
    {
      margin-top: 59px !important;
    }
    .bucket_card_logo_hr
    {
       margin-top: 78px !important;
    }

}
@media(max-width:1170px) and (min-width:993px)
{
    .card_size2
    {
        max-width: 50% !important;
    }

}
@media(max-width:849px) and (min-width:768px)
{
    .card_size2
    {
        max-width: 50% !important;
    }

}
@media(max-width:582px) and (min-width:576px)
{
    .card_footer_btn
    {
        font-size:7px !important;
    }

}
@media(max-width:1390px)  and (min-width:768px)
{
    .advance_logo
    {
        margin-left: -20px !important;
        /*margin-top: 0px !important;*/
    }
}
@media(max-width:767px)
{
    .advance_logo
    {
           margin-left: 150px !important;
           margin-top: -55px !important;
    }
}
@media(max-width:1087px) and (min-width:993px)
{
    .field_font span, label ,ul, button
    {
        font-size:11px !important;
    }
    .field_font2 span, label ,ul, button
    {
        font-size:10px !important;
    }

}
.removed_icon
{
    background: url(../images/removed.png);
    background-repeat: no-repeat;
    background-size: 250px 200px;
    background-position: center;
}
@media(max-width:360px)
{
    .removed_icon
    {
      background-size: 150px 100px !important;
    }
}
.m-tops
{
    margin-top: 30px;
}
.btn-m-top
{
    margin-top: 37px;
}
  /*end bucket*/

.btn-add
{
    color: #fff  !important;
    background-color: #0275d8  !important;
    border-color: #0275d8  !important;
    background: #0e83cd;
    font-size: 11px;
    letter-spacing: 1px;
    font-weight: 500;
    padding: 8px 22px;
    text-decoration: none;
    color: #fff;
    font-family: font4;
    font-size: 14px;
    letter-spacing: -0.5px;
    border-radius: 0px;
    border: none;
    box-shadow: 0 0 2px 0 rgba(0,0,0,.12), 0 2px 2px 0 rgba(0,0,0,.24);
    border-radius: 3px;
    margin: -15px 0px;
}
.innermenu a {
    border-bottom: none !important;
    padding: 3px 10px 6px 18px !important;
}
.leftside ul span{
    color: #fff;
    font-size: 16px;
    padding-left: 0px;
    text-transform: capitalize;
    margin-bottom: -23px;
    margin-left: 0px !important;
    padding: 10px 0px 10px 16px;
    text-align: left;
    font-weight: bold;
    display: block;
}
.home_menu_i {
    border: solid #282a34 !important;
    border-width: initial !important;
    /* position: unset !important; */
    transform: unset !important;
    color: #f0ad4e !important;
    top: 3px !important;
    right: unset !important;
}
.home_menu {
    color: #f0ad4e !important;
    margin-left: 10px;
}
.table thead th {
    vertical-align: middle !important;
}
.btn-add {
    background: red !important;
    font-weight:600;
}
#filterbydate {
    margin-top: 12px;
}
.btn-search {
    background-color: #c78529 !important;
    border: 1px solid #c78529 !important;
    font-size: 14px !important;
    padding:8px 16px !important;
    font-family:font3;
}
.new-common-table table, .new-data-table table {
    border-bottom: none;
    border-collapse: collapse !important;
    border-spacing: 0 1em;
    border: none !important;
}
.new-common-table table, .common-table table {
    margin-bottom: 0px;
}
.table-bordered, .table-bordered td, .table-bordered th {
    border: none !important;
}
.new-common-table tr th, table thead tr th, table thead tr td, .new-data-table tr th {
    font-weight: 100;
    text-align: center;
    color: #fff;
    padding: 8px 10px;
    font-size: 16px;
    font-family: font4;
    border: none;
    border-right: 1px solid #ccc !important;
    background: #5a5a5a;
    font-size: 14px;
}
.btn-excel {
    background: #0e83cd !important;
}
.btn-search, .btn-advanced_search, .btn-excel, .btn-pdf, .btn-add {
    color: #fff !important;
    background-color: #0275d8;
    border-color: #0275d8;
    background: #0e83cd;
    font-size: 11px;
    letter-spacing: 1px;
    font-weight: 500;
    padding: 8px 22px;
    text-decoration: none;
    color: #fff;
    font-family: font4;
    font-size: 14px;
    letter-spacing: -0.5px;
    border-radius: 0px;
    border: none;
    box-shadow: 0 0 2px 0 rgb(0 0 0 / 12%), 0 2px 2px 0 rgb(0 0 0 / 24%);
    border-radius: 3px;
    margin: -15px 0px;
}
.btn {
    display: inline-block;
    line-height: 1.25;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    user-select: none;
    transition: all .2s ease-in-out;
}
.btn-search:hover {
    background-color: white !important;
    color: #0e83cd !important;
    border: 1px solid #0e83cd !important;
    font-family: font4 !important;
    font-size: 14px !important;
}
.common-form button, .common-form button:focus {
    box-shadow: 0 2px 2px 0 rgb(0 0 0 / 14%), 0 3px 1px -2px rgb(0 0 0 / 12%), 0 1px 5px 0 rgb(0 0 0 / 20%);
    background: #0e83cd;
    border: none;
    border-radius: 2px;
    display: inline-block;
    padding: 8px 16px !important;
    /* text-transform: uppercase; */
    color: #fff;
    font-family: font4;
    cursor: pointer;
    outline: none !important;
    border: none !important;
}
.btn-excel:hover {
    background-color: white !important;
    color: #0275d8 !important;
    border: 1px solid #0275d8 !important;
    font-family: font4 !important;
    font-size: 14px !important;
}
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
    font-weight: 500;
}
.rightside {
    margin-left: 260px;
    padding: 50px 19px;
    margin-top: 40px;
    padding-top: 12px;
}
.heading {
    margin: 10px 0px;
    padding: 0px;
}
.scroll-right-class thead tr th, .scroll-right-class thead tr td {
    position: sticky;
    top: 0px;
}
.new-common-table tr th, table thead tr th, table thead tr td, .new-data-table tr th {
    font-weight: 100;
    text-align: center;
    color: #fff;
    padding: 8px 10px;
    font-size: 16px;
    font-family: font1;
    border: none;
    border-right: 1px solid #ccc !important;
    background: #5a5a5a;
    font-size: 14px;
}
@media (min-width: 1200px){
.container-fluid {
    padding-right: 15px;
    padding-left: 15px;
}
}
@media (min-width: 1200px){
.container-fluid {
    padding-right: 15px;
    padding-left: 15px;
}
}
@media (min-width: 768px){
.container-fluid {
    padding-right: 15px;
    padding-left: 15px;
}
}.container-fluid {
    position: relative;
    margin-left: auto;
    margin-right: auto;
    padding-right: 15px;
    padding-left: 15px;
}
.btn-clear:hover {
    background-color: white !important;
    color: #fd6347 !important;
    border: 1px solid #fd6347 !important;
    font-family: font4 !important;
    font-size: 14px !important;
}
.btn-clear {
    background-color: #fd6347 !important;
    font-family: font4 !important;
    font-size: 14px !important;
}
.btn-save {
    color: #fff !important;
    background-color: #0275d8 !important;
    border-color: #0275d8 !important;
    background: #0e83cd;
    font-size: 11px;
    letter-spacing: 1px;
    font-weight: 500;
    padding: 8px 22px;
    text-decoration: none;
    color: #fff;
    font-family: font4;
    font-size: 14px;
    letter-spacing: -0.5px;
    border-radius: 0px;
    border: none;
    box-shadow: 0 0 2px 0 rgb(0 0 0 / 12%), 0 2px 2px 0 rgb(0 0 0 / 24%);
    border-radius: 3px;
    margin: -15px 0px;
}
.btn-back {
    background: tomato !important;
    color: white !important;
    font-family: font4 !important;
    font-size: 14px !important;
}
.close {
    padding: 0px !important;
}
.close {
    z-index: 18;
    position: inherit;
    right: 10px;
}
.close {
    float: right;
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1;
    color: #ff8800;
    text-shadow: 0 1px 0 #fff;
    opacity: .5;
}
.alert-success {
    text-align: center;
}
.common-table tr td a, .new-table tr td a {
    /* color: #0e83cd; */
    text-decoration: none;
    border-right: 1px solid #222;
    padding-right: 10px;
    font-size: 14px;
    letter-spacing: -0.5px;
    color: #423333;
    font-family: font4;
    background-color: white !important;
    box-shadow: 0 2px 2px 0 rgb(0 0 0 / 14%), 0 3px 1px -2px rgb(0 0 0 / 12%), 0 1px 5px 0 rgb(0 0 0 / 20%);
    border-radius: 2px;
    display: inline-block;
    padding: 5px 5px;
    cursor: pointer;
    outline: none !important;
    border: none !important;
    margin: 2px;
}
.button-column a {
    padding: 0px 5px !important;
}
.summary {
    text-align: center;
    margin-bottom: 10px;
    color: #282A35;
    font-size: 16px;
    margin: 0px;
    padding: 10px;
}
.pagination li a, .pagination .yiiPager li a {
    background: #0e83cd;
    color: #fff !important;
    padding: 8px 12px !important;
    border: none;
    text-decoration: none !important;
    border-right: 1px solid #ccc !important;
    font-weight: 100;
}
.pagination .active a, .pagination .yiiPager .selected a, .pagination .selected a {
    background: #0e5879;
}
.btn-pdf:hover {
    background-color: white !important;
    color: #0275d8 !important;
    border: 1px solid #0275d8 !important;
    font-family: font4 !important;
    font-size: 14px !important;
}
@media (max-width: 992px){
.rightside {
    margin-left: 0;
    padding: 20px 10px;
}
}
@media (max-width: 767px){
.rightside {
    margin-left: 0;
    padding: 20px 10px;
}
}
@media(max-width:320px){
    .right{
        display:block !important;
    }
}
.btn-buc-view {
    background-color: #fff !important;
    border-color: #129d12!important;
    border: 2px solid black;
    color: #000000 !important;
    font-weight: 500;
    text-decoration: none;
    font-family: font4;
    letter-spacing: -0.5px;
    border-radius: 3px;
    margin: -15px 0px;
    /* box-shadow: 0 2px 0 rgb(0 0 0 / 12%), 0 2px 2px 0 rgb(0 0 0 / 24%); */
}
.btn-buc-add {
    background-color: #fff !important;
    border-color: #ff0000!important;
    border: 2px solid black;
    color: #000000 !important;
    font-weight: 500;
    text-decoration: none;
    font-family: font4;
    letter-spacing: -0.5px;
    border-radius: 3px;
    margin: -15px 0px;
    /* box-shadow: 0 2px 0 rgb(0 0 0 / 12%), 0 2px 2px 0 rgb(0 0 0 / 24%); */
}
.upload_in_progress{
    color:#ff8300;
    font-weight: 500;
}
.group_approved{
    color:#098322; 
    font-weight: 500;
}
.group_rejected{
    color:red;
    font-weight: 500;
}
.view_upload_in_progress{
    color:#ff8300 !important;
}
.view_group_approved{
    color:#098322 !important; 
}
.view_group_rejected{
    color:red !important;
}
.modal-header {
    background: #0e83cd !important;
    padding: 5px 0px 5px 10px!important;
}
.MultiFile-remove {
    padding: 5px;
    margin-right: 10px;
    color: #fff;
}
.btn-remove {
    background-color: #fd6347 !important;
    font-family: font2 !important;
    font-size: 14px !important;
}
.common-form h5 {
    padding: 10px 0px;
    font-family: font3;
    font-size: 18px;
    margin: 0px;
    margin-top: 0px !important;
}