html {
   -ms-overflow-style: scrollbar;
   -ms-touch-action: manipulation;
    touch-action: manipulation;
}

@font-face {
    font-family: 'dinotregular';
    src: url('../fonts/Dinot/dinot-regular-webfont.eot');
    src: url('../fonts/Dinot/dinot-regular-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/Dinot/dinot-regular-webfont.woff2') format('woff2'), url('../fonts/Dinot/dinot-regular-webfont.woff') format('woff'), url('../fonts/Dinot/dinot-regular-webfont.ttf') format('truetype'), url('../fonts/Dinot/dinot-regular-webfont.svg#dinotregular') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'dinotmedium';
    src: url('../fonts/Dinot/dinot-medium-webfont.eot');
    src: url('../fonts/Dinot/dinot-medium-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/Dinot/dinot-medium-webfont.woff2') format('woff2'), url('../fonts/Dinot/dinot-medium-webfont.woff') format('woff'), url('../fonts/Dinot/dinot-medium-webfont.ttf') format('truetype'), url('../fonts/Dinot/dinot-medium-webfont.svg#dinotmedium') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'dinotbold';
    src: url('../fonts/Dinot/dinot-bold-webfont.eot');
    src: url('../fonts/Dinot/dinot-bold-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/Dinot/dinot-bold-webfont.woff') format('woff'), url('../fonts/Dinot/dinot-bold-webfont.ttf') format('truetype'), url('../fonts/Dinot/dinot-bold-webfont.svg#dinotbold') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Merriweather Regular';
    src: url('../fonts/Merriweather/Merriweather-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Merriweather Bold';
    src: url('../fonts/Merriweather/Merriweather-Bold.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Roboto Regular';
    src: url('../fonts/Roboto/Roboto-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Roboto Bold';
    src: url('../fonts/Roboto/Roboto-Bold.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Roboto Medium';
    src: url('../fonts/Roboto/Roboto-Medium.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Palatino Regular';
    src: url('../fonts/Palatino/Palatino.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Palatino Bold';
    src: url('../fonts/Palatino/Palatino-Bold.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Arial Regular';
    src: url('../fonts/Arial/arial-regular.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'Arial Bold';
    src: url('../fonts/Arial/arial-bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'Material Symbols Outlined';
    src: url('../fonts/MaterialSymbols/MaterialSymbolsOutlined[FILL,GRAD,opsz,wght].woff2') format('woff2');
    font-weight: 100 700;
    font-style: normal;
}

body {
    height: 100%;
    min-height: 100%;
    background: #FFF;
    margin: 0;
    padding: 0;
    font-size: 14px;
    line-height: 18px;
    font-family: 'dinotregular', arial;
    color: #505759;
}
html {
    height: 100%;
    font-size: 12px;
}

@media screen and (min-width: 768px) {
    html {
        font-size: 14px;
    }
}

@media screen and (min-width: 992px) {
    html {
        font-size: 16px;
    }
}


/* * * * * *  html 5 fix  * * * * * */
section, article, header, footer, nav, aside, hgroup, details, figure { display: block; }


/* * * * * *  General  * * * * * * */
table { border-collapse:collapse; border-spacing: 0; border:0;  /******  cellspacing="0"  ******/}   
/*cellspacing for table { border-collapse:separate; border-spacing: 5px; } // cellspacing="5"    align (center) =  table { margin: 0 auto; }*/    
th, td { padding:0px; }
a, a:focus {
    color: #fff;
    text-decoration: none !important;
    outline: none !important;
}
    a:hover {
        color: #fff;
        text-decoration: none;
    }

#pnl_msg_colour a,  #pnl_msg_colour a:focus {
    color: #F50707;
    text-decoration: underline !important;
    outline: none !important;
}

    #pnl_msg_colour a:hover {
        color: #F50707;
        text-decoration: underline;
        font-weight: bold; 
    }

#pnl_confirm_status_change a, #pnl_confirm_status_change a:focus {
    color: #82acec;
    text-decoration: underline !important;
    outline: none !important;
}

    #pnl_confirm_status_change a:hover {
        color: #82acec;
        text-decoration: underline;
        font-weight: bold;
    }

img {
    border: none;
}
h1, h2, h3, h4, h5, h6, ul, li, p{ margin:0; padding:0;}
ul, li{ list-style:none; list-style-type:none;}
.clear{ clear:both; padding:0; margin:0; height:0;}
.clr{ clear:both;}
input[type=text], input[type=password]{ border:#ddd 1px solid; padding:4px; margin:0; font-family:Calibri, Arial; font-size:14px; color:#313131; -webkit-appearance:none;}
textarea { border:#ddd 1px solid; padding:4px; margin:0; font-family:Calibri, Arial; font-size:14px; color:#313131; -webkit-appearance:none;}
select { border:#ddd 1px solid; margin:0; padding:3px; font-family:Calibri, Arial; font-size:14px; color:#313131; background-color:#fff;}
.inputbutton { background:#2f5082; border:none; height:27px; padding:0 17px; cursor:pointer; font-family:Arial; font-size:14px; color:#FFF; vertical-align:middle; overflow:visible; }
.inputbutton:hover{ background:#14376c;}
.clearfix:before, .clearfix:after { content: " "; display: table; }
.clearfix:after { clear: both; }
.clearfix { *zoom: 1; }


.form-control{height: 32px; box-sizing:border-box; font-size: 14px; line-height: 18px; outline: none!important; border:solid 1px #d0dbe6!important; width: 100%; border-radius: 0; -moz-border-radius: 0; -webkit-border-radius: 0; box-shadow:none!important; -moz-box-shadow:none!important; -webkit-box-shadow:none!important; outline:none!important;}
input[type='file'].form-control{padding:5px 0; border:0!important;}
label{font-weight:normal;}
textarea.form-control{height: 100px; resize:none}
.form-inline .input-group-addon{padding:0; border:0;}
.form-horizontal .control-label{padding-right: 0; font-size: 15px;}
.control-label{font-size: 15px;}
.control-value{font-family: 'dinotbold'; padding-top: 8px; display:inline-block;}


.btn{border: 0; padding: 0 20px; height: 32px; cursor: pointer; outline: none!important; text-transform: uppercase; color: #fff; border-radius: 0!important; -moz-border-radius: 0!important; -webkit-border-radius: 0!important; box-shadow:none!important; -moz-box-shadow:none!important; -webkit-box-shadow:none!important;background-color:transparent;}
.btn-grey{border: solid 1px #d0dbe6; background: #f4f7f9; color: #6b787d; text-transform: none;}
.btn-grey:hover{background: #d0dbe6; color: #fff;}
.btn-primary, .btn-primary:focus{background: #0094cc!important; color:#fff!important;}
.btn-primary:hover{background: #00a0dc!important;}
.btn-secondary, .btn-secondary:focus{background: #6b787d!important; color:#fff!important;}
.btn-secondary:hover{background: #77858b!important;}
.btn-default{background: #ffffff; border: solid 1px #d0dbe6;}
.btn-default:hover{background: #d0dbe6;}
.btn-primary-rounded, .btn-primary-rounded:focus{background: #0094cc!important; color:#fff!important; border-radius:20px !important;}
.btn-primary-rounded:hover{background: #00a0dc!important;}
.btn-info {
    background-color: #5bc0de;
}

.btn:hover {background-color: #eee ; color: #0094cc;}

/* * * * * *  Wrapper  * * * * * */
#wrapper{width:100%; position:relative; min-height:100%; height:auto !important; padding-bottom: 46px; box-sizing:border-box; overflow: hidden;}

/* * * * * *  Header  * * * * * */
#header{padding: 15px;}
#header .content-block{min-height: 80px; box-sizing:border-box; padding:12px 15px 13px; float: left; border-left: solid 1px #d5dce0;}
#header p{font-size: 12px; line-height: 16px;}
#header p b{font-family: 'dinotbold'; font-weight: normal;}
.header-left{float: left;}
.header-left .logo{float: left; border-right: solid 1px #d5dce0; padding-right: 20px; margin-right: 20px; max-width:150px; line-height:16px; min-height:80px;}
.header-left .logo a{color:#505759; font-weight:800;}
.page-desc{float: left; padding-top: 13px;}
.page-desc img{float: left; margin:4px 10px 0 0;}
.page-desc h5 {font-weight: normal; font-size: 20px; line-height: 19px; font-family: 'dinotmedium'; font-weight: normal; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
    
.header-right{float: right;}
#header .header-right .content-block:last-child{padding-right: 0;}
.header-right h4{font-size: 15px; line-height: 20px; font-weight: normal; font-family: 'dinotmedium'; color: #0094cc;}
.logout{display: block; width: 36px; height: 36px; background: url(../images/logout.png) 0 0 no-repeat; margin-top: 7px;}
.logout:hover{background-position: left bottom;}


/* * * * * *  Main Navigation  * * * * * */
.page-icon{float: right; border-left: 1px solid #35AEDB; padding:5px!important; display:none!important;}
.page-icon img{display:block; width:30px;}
.main-nav-block{background: #0094cc; position: absolute; width: 100%; z-index: 999; padding: 0 0 0 40px;}
.main-nav-block.fixed{position: fixed; top: 0;}
.main-nav-block a{height: 40px; line-height: 16px; padding:9px 11px; display: block;}
.main-nav-block a:hover{background: #0785b4;}
.nav-icon{position:absolute; left:0;}
.main-nav-block .main-nav-icon{float: right; border-left: solid 1px #35aedb; display:none;}
#main-nav{border-left: solid 1px #35aedb;}
#main-nav ul{margin-right: 45px;}
#main-nav li{float: left; border-right: solid 1px #35aedb;}
#main-nav li a{padding:11px; color:#fff; text-decoration: none;}
#main-nav li.currentTab { background: #0785b4; } 

.dropdown-menu{position: absolute; background: #fff; border: solid 1px #ccc; width: 330px; box-sizing:border-box; z-index: 9; top: 100%; left: 0; box-shadow: 5px 5px 10px 0 rgba(0,0,0,0.15); display: none; padding:0; margin:0;}
.dropdown-menu:before{position: absolute; content: ""; left: 12px; bottom: 100%; border-bottom: solid 7px #fff; border-left: solid 7px transparent; border-right: solid 7px transparent;}
.dropdown-menu ul{ padding:10px 15px; font-size: 14px; }

.scroll-box{max-height: 535px; overflow: hidden; -webkit-overflow-scrolling: touch;}
.default-scroll .scroll-box{overflow: auto;}
.dashboard.default-scroll .scroll-box {
    overflow-y: auto !important;
    overflow-x: hidden !important;
}
.scroll-box-div-left{max-height: 535px; overflow: hidden; -webkit-overflow-scrolling: touch;}
.default-scroll .scroll-box-div-left{overflow: hidden;}
/*.dropdown-menu .nicescroll-rails-vr{left: auto!important; right:0;}*/
/*.SubMenuDivLeft .nicescroll-rails-vr{left: auto!important; right:0;}*/
.main-menu > li{width: 33.33%; text-align: center; float: left; padding: 10px 0 0; height:130px; overflow:hidden;}
.main-menu > li > a{display: block; padding: 0; background: none; color: #494b4d; height: auto;}
.main-menu > li > a:hover{background: none; color: #0094cc;}
.main-menu .menu-icon{display: block; width: 60px; height: 60px; box-sizing:border-box; padding: 15px 0; text-align: center; margin: 0 auto; border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; margin-bottom: 10px;}
.main-menu > li > a:hover .menu-icon{opacity: 0.8;}
.color1 .menu-icon{background: #09b304;}
.color2 .menu-icon{background: #b33df2;}
.color3 .menu-icon{background: #f59402;}
.color4 .menu-icon{background: #fc4e4e;}
.color5 .menu-icon{background: #ffcc14;}
.color6 .menu-icon{background: #28a5fc;}
.color7 .menu-icon{background: #1969fc;}
.color8 .menu-icon{background: #53c437;}
.color9 .menu-icon{background: #db58a0;}
.color10 .menu-icon{background: #06bfb9;}
.color11 .menu-icon{background: #f86afc;}
.color12 .menu-icon{background: #3b3b3b;}
.color16 .menu-icon {
    background: #1c2938;
}


.sub-menu .scroll-box{max-height: 482px; overflow: hidden; width: 100%!important;}
.sub-menu{position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: #fff; text-align: left; display: none; z-index: 1;}
.sub-menu h4{font-size: 18px; line-height: 22px; font-weight: normal; font-family: 'dinotbold'; padding: 15px; border-bottom: solid 1px #cccccc;}
.sub-menu .menu-back{background: none; position: absolute; right: 15px; top: 15px; height: 24px; width: 24px; display: block; padding: 0;}
.sub-menu .menu-back:hover{background: none; opacity: 0.5;}
.sub-menu ul{padding: 15px;}
.sub-menu ul li{padding-bottom: 5px;}
.sub-menu ul li:last-child{padding-bottom: 0;}
.sub-menu ul li a{background: #ebedef; color: #333333; position: relative; padding-left: 35px;}
.sub-menu ul li a:hover{background: #e2e3e4;}
.sub-menu .scroll-box li > a img{position: absolute; left: 11px;}
.sub-menu .scroll-box li > a:hover img{opacity: 0.8;}

/* * * * * *  Page Heading  * * * * * */
.page-heading{background: #e9eef2; border-bottom: solid 1px #d0dbe6; border-top: solid 1px #d0dbe6; padding:40px 0 0 25px;}
.top-pad-0 { padding-top: 0 !important }
.page-heading .left-part{float: left; padding: 15px 0;}
.breadcrumbs{padding-bottom: 5px;}
.breadcrumbs li{float: left; padding-right: 12px; position: relative;}
.breadcrumbs li:after{position: absolute; content: ">"; right: 2px; top: -1px; line-height: 16px;}
.breadcrumbs li:last-child{padding-right: 0;}
.breadcrumbs li a{color: #494b4d; font-size: 12px; line-height: 16px; display: block;}
.breadcrumbs li a:hover{color: #0094cc;}
.main-heading{font-size: 20px; line-height: 24px; font-weight: normal;font-family: 'dinotbold'; color: #494b4d;}
.FlexiHeader{font-size: 16px !important; line-height: 18px; font-weight: normal;font-family: 'dinotregular'; color: #494b4d;}
.actions{float: right;}
.actions li{float: left; border-left: solid 1px #d0dbe6;}
.actions li a{padding:15px 20px 5px; display: block; color: #505759; font-size: 12px; line-height: 14px; text-align: center; min-height: 75px; box-sizing:border-box;}
.actions li a img{display: block; margin: 0 auto 7px;}
.actions li a:hover{background: #e1e6eb;}

.page-heading-popup{background: #0094cc; border: solid 1px #0094cc; padding: 0px 0px 0px;}
.page-heading-popup .left-part{float: left; padding: 15px 0;}
.page-heading-popup .left-part h1{ color: #fff;padding-left: 25px;font-size:16px}
.actions-Popup {float: none; border-top: solid 1px #d0dbe6; display: table; width: 100%; background: #e9eef2 !important;}
.actions-Popup li{height: 40px; display: table-cell; float: none; border-left: solid 1px #0094cc;}
.actions-Popup li:first-child{border-left: 0;}
.actions-Popup li a{padding:15px 20px 5px; display: block; color: #505759; font-size: 12px; line-height: 14px; text-align: center; min-height: auto; box-sizing:border-box;}
.actions-Popup li a span{display: none;}
.actions-Popup li a img{margin: 0 auto;}
.actions-Popup li a:hover{background: #e1e6eb;}

/* * * * * *  Content  * * * * * */
#content {
    padding: 25px;
    position: relative;
    z-index: 1;
}
.filter-form{border-bottom: solid 1px #d0dbe6; padding-bottom: 25px; margin-right: 15px;}
.filter-form label{padding-right: 10px; font-weight:normal;}
.filter-form .form-control{width: 218px!important;}
.filter-form .input-group .btn{margin: 0;}
.filter-form .btn{margin-left: 7px;}
/*.filter-form .input-group{float: left;}
.filter-form .btn{float: left; margin-right: 10px;}
*/
select.form-control{padding-left: 6px; padding-right:6px;}
.filter-form input.form-control{float: left; width: 218px; border-right: 0!important;}

.filter-form2 {border-bottom: solid 1px #d0dbe6; padding-bottom: 25px;}

.doc-type{float: right; padding: 15px 15px;}
.doc-type li{float: left; padding-right: 7px;}
.doc-type li:last-child{padding-right: 0;}
.doc-type li a:hover{opacity: 0.7;}


.grid-header{background: #6b787d; color: #fff; font-weight: normal; font-size: 14px; line-height: 18px; padding: 8px 15px; border-top: solid 1px #d0dbe6;}
.table{width: 100%; text-align: left; margin:0; color:inherit;}
.table th{font-weight: normal; background: #f4f7f9; text-align:left; border:solid 1px #d0dbe6; font-size: 14px; line-height: 18px; padding: 10px;}
.table th.text-center{text-align: center;}
.table td{padding: 10px; border:solid 1px #d0dbe6;}
.table td a{color:#6b787d;}
.table td a:hover{color:#0094cc;}

.ref-id{background: #f4f7f9;}
.grid-footer{background: #f4f7f9; border: solid 1px #d0dbe6; border-top: 0; padding: 5px;}
.grid-footer-inner{float: right;}
.grid-footer .form-control{width: 50px; text-align: right; padding:3px;}
.grid-footer .btn{position: relative; padding: 0; width: 34px;}
.grid-footer .btn:after{content: ""; position: absolute;border-top: solid 5px transparent; border-bottom: solid 5px transparent; top: 50%; margin-top: -5px;  left: 50%;}
.grid-footer .prev-btn:after{border-right: solid 5px #808080; margin-left: -3px;}
.grid-footer .next-btn:after{border-left: solid 5px #808080; margin-left: -3px;}

.bktop{position: fixed; bottom: 25px; right: 35px; z-index: 9; background: #6b787d; display: block; width: 50px; height: 50px; padding:10px 5px; display: none; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; letter-spacing: 2px; text-transform: uppercase; font-size: 8px;}
.bktop:hover{background: #77858b;}
.bktop i:before {font-size: 24px;}
.bktop span{top:-10px; left:1px;}
a.bktop, a.bktop:link, a.bktop:focus {
    color: #fff;
    text-decoration: none !important;
    outline: none !important;
}



/* * * * * *  Dashboard Page  * * * * * */
.dashboard #wrapper{display: table; padding-top: 108px; height: 100%!important;}
.dashboard .page-background{position: absolute; top: 0; left: 0;z-index: -1; width: 100%; height: 100%;}
.dashboard #header{background: rgba(255,255,255, 0.1); border-bottom:  solid 1px rgba(255,255,255, 0.2); position: absolute; width: 100%; box-sizing:border-box; top: 0; left: 0;}
.dashboard .header-left .logo{border-right: solid 1px rgba(255,255,255, 0.2);}
.dashboard .logout{background-image: url(../images/logout-white.png);}
.dashboard .header-right h4{color: #fff;}
.dashboard #header p{color: #e1e1e1;}
.dashboard #header .content-block{border-left: solid 1px rgba(255,255,255, 0.2);}
.dashboard .page-desc{padding-top: 18px;}
.dashboard .page-desc h5{color: #fff;}
.dashboard-content{display: table-cell; vertical-align: middle; width: 100%;}
.dashboard-content .inner-content{max-width: 1090px; margin: 0 auto; padding: 0 15px;}
.dashboard-content .dashboard-listing{position: relative; padding:0;}
.dashboard-content .dashboard-listing li{position: absolute; width: 120px; height: 120px;}
.dashboard-content .dashboard-listing li[data-ss-colspan="2"]{width: 245px;}
.dashboard-content .dashboard-listing li a{background: #00a0dc; display: block; text-align: center; height: 120px; box-sizing:border-box;}
.dashboard-content .dashboard-listing li a img{margin-top: 20px; width: auto; height: 52px; transition:all 0.2s;-o-transition:all 0.2s;-ms-transition:all 0.2s;-moz-transition:all 0.2s;-webkit-transition:all 0.2s;}
.dashboard-content .dashboard-listing li a:hover img{height: 40px; margin-top: 26px;}
.dashboard-content .dashboard-listing li a span{text-align: left; position: absolute; bottom: 0; left: 0; padding: 10px; width: 100%; box-sizing:border-box; /*text-transform:uppercase;*/ font-size:12px; font-family: 'dinotmedium', arial; text-align:center;}

    .dashboard-content .dashboard-listing2,
    .dashboard-content .dashboard-listing3 {
        position: relative;
        padding: 0;
    }
        .dashboard-content .dashboard-listing2 li,
        .dashboard-content .dashboard-listing3 li {
            position: absolute;
            width: 210px;
            height: 151px;
        }

#pnl_assessment_selection .dashboard-listing2 li,
#pnl_assessment_selection .dashboard-listing3 li {
    position: absolute;
    width: 256px;
    height: 170px;
}
            .dashboard-content .dashboard-listing2 li a,
            .dashboard-content .dashboard-listing3 li a {
                background: #00a0dc;
                display: block;
                text-align: center;
                height: 120px;
                box-sizing: border-box;
            }
                .dashboard-content .dashboard-listing2 li a img,
                .dashboard-content .dashboard-listing3 li a img {
                    margin-top: 20px;
                    width: auto;
                    height: 75px;
                    transition: all 0.2s;
                    -o-transition: all 0.2s;
                    -ms-transition: all 0.2s;
                    -moz-transition: all 0.2s;
                    -webkit-transition: all 0.2s;
                }
                .dashboard-content .dashboard-listing2 li a:hover img,
                .dashboard-content .dashboard-listing3 li a:hover img {
                    height: 63px;
                    margin-top: 26px;
                }
                .dashboard-content .dashboard-listing2 li a span,
                .dashboard-content .dashboard-listing3 li a span {
                    text-align: left;
                    position: absolute;
                    bottom: 0;
                    left: 0;
                    padding: 10px;
                    width: 100%;
                    box-sizing: border-box; /*text-transform:uppercase;*/
                    font-size: 12px;
                    font-family: 'dinotmedium', arial;
                    text-align: center;
                }

.dashboard-content .left-listing{float: left; width: 790px;}
.dashboard-content .right-listing{float: right; width: 270px;}

.dashboard-content .dashboard-listing li a.color1{background: #09b304;}
.dashboard-content .dashboard-listing li a.color2{background: #b33df2;}
.dashboard-content .dashboard-listing li a.color3{background: #f59402;}
.dashboard-content .dashboard-listing li a.color4{background: #fc4e4e;}
.dashboard-content .dashboard-listing li a.color5{background: #ffcc14;}
.dashboard-content .dashboard-listing li a.color6{background: #28a5fc;}
.dashboard-content .dashboard-listing li a.color7{background: #1969fc;}
.dashboard-content .dashboard-listing li a.color8{background: #53c437;}
.dashboard-content .dashboard-listing li a.color9{background: #db58a0;}
.dashboard-content .dashboard-listing li a.color10{background: #06bfb9;}
.dashboard-content .dashboard-listing li a.color11{background: #f86afc;}
.dashboard-content .dashboard-listing li a.color12{background: #3b3b3b;}
.dashboard-content .dashboard-listing li a.color13{background: #dd780d;}
.dashboard-content .dashboard-listing li a.color14{background: #13c7a2;}
.dashboard-content .dashboard-listing li a.color15{background: #50aeff;}
.dashboard-content .dashboard-listing li a.color16 {
    background: #1c2938;
}



/* * * * * *  Profile index  * * * * * */
.content-outer{position: relative; min-height: 500px;}
.sidebar{position: absolute; right: 0; top: 15px; width: 230px; border: solid 1px #d0dbe6;}
.sidebar h4{color: #494b4d; font-family: 'dinotbold'; font-size: 18px; line-height: 22px; background: #e9eef2; padding: 7px 10px; border-bottom: solid 1px #d0dbe6; font-weight: normal;}
.sidebar-content{padding: 20px;}
.user-icon{text-align: center; padding-bottom: 15px;}
.user-detail{width: 100%; padding-bottom: 10px;}
.user-detail:last-child{padding-bottom: 0;}
.user-detail label{font-family: 'dinotbold'; display:block;}

.slide-panel{background: #fff; border-right: 0; left: 100%; position: fixed; z-index: 2; top: 250px;}
.slide-panel .form-group{margin-bottom: 15px;}
.slide-panel .form-group label{padding-bottom: 2px; display: block;}
.slide-panel .show-panel{position: absolute; right: 100%; top: -1px; border: solid 1px #d0dbe6; display: inline-block; padding: 6px; background: #e9eef2;}
.slide-panel .show-panel:hover{background: #d0dbe6;}
.slide-panel .show-panel img{width: 24px; height: 24px; display: block;}


/* * * * * *  Login Page  * * * * * */
.dashboard.login{overflow:hidden;}
.dashboard.login #wrapper{padding: 0;}
.overlay{position: fixed; height: 100%; width: 100%; left: 0; top: 0; background: rgba(0,0,0,0.6); z-index: 2;}
#login-modal.modal{overflow:auto;}
.login-header{text-align: center; border-bottom: solid 1px #d0dbe6; padding: 0 0 15px;}
.login-form{padding: 20px 0 0;}
.login-form .form-group label{color: #333f48; padding-bottom: 5px; display: inline-block;}
.login-form .form-group .checkbox-label{padding:5px 0 0;}
.login-form .terms-and-condition{padding: 5px 0 0; font-size: 11px; color: #333f48;}
.login-form .terms-and-condition a{color: #0094cc;}
.login-form .terms-and-condition a:hover{color: #6b787d;}
.btn-outer a{float: right;color: #0094cc; font-size: 12px; margin-top: 7px;}
.btn-outer a:hover{color: #6b787d;}
.login-links a {
    color: #0094cc;
    font-size: 11px;
}
.login-links a:hover {
    color: #6b787d;
}


/* * * * * *  footer  * * * * * */
#footer {
    background: #f2f4f5;
    color: #808486;
    margin-top: -47px;
    position: fixed;
    z-index: 1;
    border-top: 1px solid #d0dbe6;
    bottom: 0px;
    width: 100%;
}

.dashboard #footer {
    background: rgba(255,255,255,0.1);
    color: #fff;
    border: none !important;
    position: relative;
}

    .dashboard #footer a {
        color: #fff;
    }

        .dashboard #footer a:hover {
            color: #000;
        }

#footer a{color: #808486;}
#footer a:hover{color: #0094cc;}
#footer p{font-size: 12px; line-height: 16px; padding: 15px 25px;}
#footer .copyright {
    float: left;
}

#footer .version {
    float: right;
    padding: 0;
}

.version img{ vertical-align:-15px; margin-left:15px;}


/* * * * * *  07-Jul-2016  * * * * * */
.ep{ border-bottom: 5px solid #0094cc; }
.entry-page #wrapper{display: table; padding-top: 108px; height: 100%!important; table-layout: fixed}
.entry-page #header{position: absolute; width: 100%; box-sizing:border-box; top: 0; left: 0;}
.copyright a{ color:#0094cc;}
.copyright a:hover{ text-decoration:underline;}
.pd_title{ color:#000; padding:0; margin:0; font-size:20px; font-family: 'dinotbold', arial; text-transform:uppercase;}
.toppad5{ padding-top:5px !important;}
.pd_text{ font-size:18px !important; margin:0; padding:5px 0 0 0 !important;}


/* * * * * *  Popup  * * * * * */
.popup-overlay{position: fixed; height: 100%; width: 100%; left: 0; top: 0; background: rgba(0,0,0,0.6); z-index: 2; display: none;}
.popup{position: absolute; top: 50%; left: 50%; background: #fff; width: 690px; margin: -250px 0 0 -345px; z-index: 3; display: none;}
.popup-header{position: relative; padding: 15px; border-bottom: solid 1px #d0dbe6;}
.popup-header .close-btn{position: absolute; right: 15px; top: 16px;}
.popup-header .close-btn:hover img{opacity: 0.8;}
.popup-header .popup-heading{font-size: 18px; line-height: 22px; color:#333f48; font-family: 'dinotbold'; font-weight:normal;}
.modal-body h5{font-family: 'dinotbold'; font-weight:normal;}
.modal-body p{padding: 0 0 30px;}
.modal-body .grid{margin-bottom: 30px;}
.grid-header .left-part{float: left;}
.grid-header .right-part{float: right;}
.popup-table td{border:0; border-bottom: solid 1px #d0dbe6; padding: 5px 10px;}

.form-block .left-part{float: left; width: 320px;}
.form-block .right-part{float: right; width: 320px;}
.form-block h4{padding-bottom: 10px;}
.form-block .form-group{margin-bottom: 10px;}
.popup .btn-outer{text-align: right;}

.popup .form-group{float: left; width: 100%;}
.popup .form-group .control-label{float: left; width: 200px; text-align: right; padding:6px 10px 0 0;}
.popup .form-group .control-outer{float: left; width: 300px;}
.popup .checkbox-label, .popup .radio-label{padding-top: 6px; display: inline-block; margin-right: 10px;}

.uf{width: 100%;}
.fileUpload { position: relative; overflow: hidden; margin: 0; padding: 0; }
.fileUpload span{line-height: 32px; display: block; text-align: center;}
.fileUpload input.upload { position: absolute; top: 0; right: 0; margin: 0; padding: 0; font-size: 20px; cursor: pointer; opacity: 0; filter: alpha(opacity=0); }

.fileUploadSin { position: relative; overflow: hidden;}
.fileUploadSin span { margin: 7px 0px 0px 0px; display: block }
.fileUploadSin input.upload { position: absolute; top: 0; right: 0; margin: 0; padding: 0; font-size: 20px; cursor: pointer; opacity: 0; filter: alpha(opacity=0); }






/************************* ADD NEW 11-Jul-16 ******************************/
.btn{font-family: 'dinotmedium', arial; font-size:13px;}
.db-new{ display:block; padding-top:30px;}
.db_btn{ border-left:none !important; padding-top:22px !important;}
.dashboard-content.db-new .dashboard-listing li{ height: 160px;}
a.btn{ padding:6px 12px; text-transform:none;}
a.ic-btn{ display:inline-block; padding:0px; position:relative; padding:7px 12px 0 40px !important; box-sizing: border-box; -moz-box-sizing: border-box;}
a.ic-btn span{ position:absolute; top:0; left:0; border-right: 1px solid rgba(255, 255, 255, 0.3); height:32px; width:32px;}
a.ic-btn span.new-header-button { width: auto; position: relative; border: none }
a.ic-btn-sur{ display:inline-block; padding:0px; position:relative; padding:7px 12px 0 40px; box-sizing: border-box; -moz-box-sizing: border-box;}
a.ic-btn-sur span{ position:absolute; top:0; left:0; border-right: 1px solid rgba(255, 255, 255, 0.3); height:32px; width:32px;}
a.ic-btn-sur span.new-header-button { width: auto; position: relative; border: none }

a.cca_box.color1 {background: #09b304 !important;} /* bright green */
a.cca_box.color2{background: #b33df2 !important;} /* purple */
a.cca_box.color3{background: #f59402 !important;} /* orange */
a.cca_box.color4{background: #fc4e4e !important;} /* red orange */
a.cca_box.color5{background: #ffcc14 !important;} /* yellow */
a.cca_box.color6{background: #28a5fc !important;} /* bright blue */
a.cca_box.color7{background: #1969fc !important;} /* blue */
a.cca_box.color8{background: #53c437 !important;} /* green */
a.cca_box.color9{background: #db58a0 !important;} /* pink */
a.cca_box.color10{background: #06bfb9 !important;} /* turquois */
a.cca_box.color11{background: #f86afc !important;} /* bright pink */
a.cca_box.color12{background: #3b3b3b !important;} /* dark gray */
a.cca_box.color13 {
    background: #dd780d !important; /* dark orange */
}

/* Clinical App menu box */
a.clinical-app.cca_box.color1,
a.clinical-app.cca_box.color2,
a.clinical-app.cca_box.color3,
a.clinical-app.cca_box.color4,
a.clinical-app.cca_box.color5,
a.clinical-app.cca_box.color6,
a.clinical-app.cca_box.color7,
a.clinical-app.cca_box.color8,
a.clinical-app.cca_box.color9,
a.clinical-app.cca_box.color10,
a.clinical-app.cca_box.color11,
a.clinical-app.cca_box.color12 {
    background: none !important;
    color: inherit;
    border: 1px solid #ccc;
}

a.cca_box{ display:block; height: 160px !important; position:relative; font-family: 'dinotmedium', arial !important;background:#FFF;} /*border:1px solid #d0dbe6 !important;*/ 
a.cca_box:hover{border:1px solid #0094cc !important;}
.cca_img{ height:125px; padding:10px !important; overflow:hidden; box-sizing: border-box; -moz-box-sizing: border-box;}
.cca_title{ height:33px; background:#e9eef2; border-top:1px solid #d0dbe6; color:#494b4d; /*text-transform:uppercase;*/ padding:6px 6px 0 6px; box-sizing: border-box; -moz-box-sizing: border-box; overflow: hidden; text-overflow: ellipsis; white-space:nowrap;}
a.cca_box:hover .cca_title{ background:#0094cc; border-top:1px solid #0094cc; color:#FFF;}
.cca_img img{ max-width:100%; height:100% !important; margin:0 !important;}
.db_new_btn{ text-align:center; padding:10px 0 30px 0;}
.popup-footer{ text-align:right; padding:12px; border-top:1px solid #ddd;}






.one-column{max-width:265px; margin:0 auto;}
.two-column{max-width:530px; margin:0 auto;}
.three-column{max-width:790px; margin:0 auto;}

.modal-header{background: #f3f6f8; border-radius: 6px 6px 0 0; -moz-border-radius: 6px 6px 0 0; -webkit-border-radius: 6px 6px 0 0; padding:10px 10px 10px 15px;}
.modal-title{font-family: 'dinotbold'; max-width: 95%;}
.modal-header .close{width:24px; height:24px; background: url(../images/popupclose.png) 0 0 no-repeat; opacity:1; outline:none!important; margin-top: 1px;}
.modal-header .close:hover{background-position: left bottom;}
.modal-body h4{padding-bottom: 15px;}

.file-upload-wrapper{position:relative; padding-right: 110px;}
.file-upload-wrapper .file-upload-input{}
.file-upload-wrapper .file-upload-button{position:absolute; right:0; top:0;}

.modal-body .table-responsive{border-top: solid 1px #d0dbe6; margin-top: 3px;}

.tag-form-outer{border-bottom: solid 1px #d0dbe6; padding-bottom: 15px;}
.tag-form{position:relative; padding: 0 176px 0 130px;}
.tag-form .form-control{height:auto; min-height:32px;}
.tag-form > label {position:absolute; left:0; top: 6px;}
.tag-form .btn-box{position:absolute; right: 0; top: 0;}








/*************************************** ADD NEW CSS 16-08-16 ************************************************/
.innermain{ /*overflow:hidden;*/ display:table; width:100%;} /*To Solved Issue of Calendar Popup half cut in 125% scale and full resolution*/
.leftside{ width:310px; display:table-cell; vertical-align:top; background:#FFF url(../images/leftsidebg.png) top right repeat-y;}
.rightside{ display:table-cell; vertical-align:top;}
.rs_body{ padding: 25px;min-height: 520px}
.ls_top{ min-height:54px; border-bottom:1px solid #d0dbe6; width:310px; padding:8px 40px 0 10px; position:relative;}
.ls_top p{ padding:0 !important; color:#1f1f1f; font-family: 'dinotmedium', arial;}
.ls_top span{ padding:0 !important;}
.ls_top a{ position:absolute; top:18px; right:15px; font-size:16px;}
a.iclink{ color:#6b787d;}
a.iclink:hover{ color:#0094cc;}

.ls_treeview{ padding:13px;}
.subtitle{ border-bottom:1px solid #d0dbe6; position:relative; padding:0 0 9px 0; margin:0 0 20px 0;}
.subtitle h2{ color:#1f1f1f; font-family: 'dinotmedium', arial; font-size:20px; padding:0; margin:0; line-height:1;}

.subtext{ padding-bottom:10px;}
.st1{ font-size:16px;}
.st1 span{ color:#fc4e4d;}
.st2{ text-align:right;}
.st2 span{color:#1f1f1f; font-family: 'dinotmedium', arial;}


.graybox{ padding:20px; border:1px solid #c9d4df; background:#f3f6f8; margin-bottom:30px;}
.mistygraybox {
    padding: 20px;
    border: 1px solid #c9d4df;
    background: #edf0f2;
    margin-bottom: 30px;
}
.whitebox {
    padding: 20px;
    border: 1px solid #c9d4df;
    background: #fff;
    margin-bottom: 30px;
}
.ls_spac{width:310px; height:50px;}
.leftfix.fixed{ position:fixed; top:40px; bottom:0; height:auto; overflow:auto; overflow-x:hidden;}
.rs_top{ border-bottom: 1px solid #d0dbe6; min-height: 54px; padding:10px 25px 0 25px;}
.rs_name{ font-size:18px; color:#333; font-family: 'dinotbold', arial; padding-top:6px; }
.btn_right{ text-align:right; }
.btn_right a.btn{ margin-left:5px;}

.r_tip, .r_tip:hover, .r_tip:focus{ background-image:url(../images/ic-tip.png) !important; background-position:7px 8px !important; background-repeat:no-repeat !important; padding-left:30px !important;}
.r_cmt, .r_cmt:hover, .r_cmt:focus{ background-image:url(../images/ic-committee.png) !important; background-position:7px 8px !important; background-repeat:no-repeat !important; padding-left:30px !important;}
.r_htr, .r_htr:hover, .r_htr:focus{ background-image:url(../images/ic-history.png) !important; background-position:7px 8px !important; background-repeat:no-repeat !important; padding-left:30px !important;}
.alert{ border-radius:0px; padding:10px;}
.alert strong{font-family: 'dinotmedium', arial; font-weight:normal;}
.ig_img{ padding:4px 8px 0 8px !important;}
.cfont{ color:#fc4e4d;}
.top_pad{ padding-top:16px;}
.cr_list{ list-style:none; padding:0; margin:0; overflow:hidden;}
.cr_list li{ list-style-type:none; padding:0; margin:0 30px 0 0; float:left;}
.cr_list li input[type=radio], .cr_list li input[type=checkbox]{ vertical-align:-2px; margin:0 5px 0 0 !important;}


.exp-col{ border:1px solid #d0dbe6; color:#505759 !important;} 
.exp-col-link{ display:block; color:#505759 !important; height:30px; padding:6px 6px 0 38px; background:#FFF url(../images/ic-min.png) 0px 0px no-repeat; text-overflow:ellipsis; overflow: hidden; white-space: nowrap; }
.exp-col-link:hover, .exp-col-link:focus{ color:#505759;}
.exp-col-link.collapsed{ background:#FFF url(../images/ic-plus.png) 0px 0px no-repeat;}
.exp-col-body{ border-top:1px solid #d0dbe6; background:#FFF;}
.col-pad{ padding:20px;}
.subtexttitle{ font-size:20px; color:#333;}
.btlink{ color:#0094cc !important;}

.graybox .table-responsive{ background:#FFF;}
.table th{ color:#333 !important; font-family: 'dinotmedium', arial;}
.graybox table .more{ font-size:12px;  font-family: 'dinotmedium', arial; text-align:center; }
.graybox table .more a{color:#0094cc !important;}
.grid_toplink { text-align:right;  margin: 8px; }
.grid_toplink a{ color:#505759 !important; font-size:13px; display:inline-block; margin-left:10px; }
.grid_toplink a img{ vertical-align:-6px; margin-right:3px;}


.innermain.fullwidth{ display:block !important;}
.toptreeview{background:#FFF url(../images/leftsidebg_mob.png) bottom left repeat-x;}
.toptreeview .ls_top{ width:auto !important;}
.modal-subtitle{ font-size:18px; font-family: 'dinotmedium', arial; color:#333; margin:0; padding:0 0 8px 0;}
.grbg{ background:#f3f6f8;}
.grbg .exp-col-link, .grbg .exp-col-body{ background-color:#f3f6f8 !important;}

@media screen and (max-width:1200px){
	.innermain{ display:block;}
	.leftside{ width:auto; display:block; background:#FFF url(../images/leftsidebg_mob.png) bottom left repeat-x;}
	.rightside{ display:block;}
	.rs_body{ padding: 20px;min-height: 365px}
	.ls_top{ width:auto; }
	.leftfix.fixed{ position:static;}
	.rs_top{ padding:10px 20px 0 20px;}


}



@media screen and (max-width:767px){
	.rs_body{padding: 15px;min-height: 560px}
	.st2{ text-align:left;}
	.st2 span{display:block; padding:8px 0 0 0;}
	.subtitle{ margin:0 0 15px 0; }
	.btn_right{ text-align:left; }
	.rs_top{ padding:10px 15px 0 15px;}
	.btn_right a.btn{ margin:0 5px 5px 0;}
	.rs_top .btn_right{ margin-top:6px; margin-bottom:15px;}
	.graybox{ margin-bottom:20px;}
	.top_pad{ padding-top:0;}
	.col-pad{ padding:15px;}

}





/**************************** 24-08-16 ************************************/
.inner-header{ width:100% !important; margin:0 !important;}
.inner-header .header-left{ float:none !important; width:10px;}
.inner-header .page-desc{ float:none !important; padding:0 !important; width:100% !important; max-width:none !important;}
.inner-header .person-detail{ white-space:nowrap;}
.inner-header .page-desc p{white-space:normal !important;}
.inner-header h5{font-weight: normal; font-size: 15px; line-height: 19px; font-family: 'dinotmedium'; font-weight: normal;}
.inner-header .pageiconimg{ padding-right:10px;}
.lgb{ padding-right:0 !important;}
.inner-header h4 { color: #0094cc; font-family: "dinotmedium"; font-size: 15px; font-weight: normal; line-height: 20px;}
.pageinfo{ margin-right:20px;}

@media screen and (max-width:991px){
	.inner-header h5, .inner-header p{ overflow: hidden; text-overflow: ellipsis; white-space: nowrap; width:200px; }
}

@media screen and (max-width:767px){
	.pageinfo{ display:none;}
}





/**************************** 02-09-16 ************************************/
.radiolist-outer{padding:10px;}
.radiolist-outer .st1{padding-bottom: 10px;}

.detail-search-outer{position: relative; padding-right: 17px;}
.search-outer{padding:10px; position:absolute; right: 0; top:0;}
.search-outer .sidebar{position:static;}

@media screen and (max-width: 1200px){
	.detail-search-outer{padding-right: 0;}
    .detail-search-outer .col-sm-4{margin-left:1px} /*Added this for Chart pages Ticket #2520*/
}
@media screen and (max-width:767px){ /*Seperated this for Search panel pages to Look proper when screen is half Ticket #2520*/
    .search-outer{display: block; padding:20px; position:static;}
	.search-outer .sidebar{width: auto; margin:0;}
}


/**************************** 14-10-16 ************************************/
.steps{display:table; width:100%; max-width:1200px; margin: 0 auto;}
.steps li{display:table-cell; position: relative; text-align: center;}
.steps li:before{content:""; position: absolute; top: 23px; height:4px; width:100%; right: 50%; background: #e9eef2; z-index: -1;}
.steps li:first-child:before{display:none;}
.steps li a{display:inline-block; width:50px; height:50px; background: #e9eef2; border-radius: 50px; color:#505759; overflow:hidden; line-height: 50px;  font-size: 24px; font-weight:bold;}
.steps li a:hover{background: #e1e6eb;}

.steps li.active a{background: #6b787d; color:#fff;}
.steps li.active a:hover{background: #7c898e;}
.steps li.active:before{background: #6b787d;}

.steps li.active.current a{background: #0094cc; cursor: default;}

@media screen and (max-width: 767px){
	.steps li a{width:30px; height:30px; line-height: 30px; font-size:14px;}
	.steps li:before{top: 14px; height:2px;}	
}


/**************************** 13-12-16 ************************************/
.profile-header{background: #e9eef2;  padding:10px 200px 10px 66px; position:relative; min-height:66px; border:solid 0px #d0dbe6;}
.profile-header .profile-img{position:absolute; left: 10px; top: 10px; border:solid 1px #d0dbe6; width:46px; height: 46px;}
.profile-header h4{font-family: 'dinotbold'; color:#000; padding-bottom:8px;}
.profile-detail li{float: left; color:#000; padding-right: 25px; margin:0;}
.profile-detail li span{color:#5e6871;}
.profile-header .edit-detail{position:absolute; right: 10px; top: 10px; color:#6b787d;}
.profile-header .edit-detail:hover{color:#000;}
.profile-header .edit-detail span{padding-left: 5px;}

.profile-content{text-align: center;}
.profile-content h4{font-family:"dinotbold"; padding-bottom: 15px; text-transform: uppercase;}

.flip-box {
	margin: 0 auto 30px;
	height: 130px;  
	position: relative;
	-webkit-perspective: 600px;
	-moz-perspective: 600px;
}


.flip-box .front, .flip-box .back{
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	-ms-backface-visibility: hidden;
	backface-visibility: hidden;
	-webkit-transition: 0.6s;
	-webkit-transform-style: preserve-3d;
	-webkit-transform: rotateY(0deg);
	-moz-transition: 0.6s;
	-moz-transform-style: preserve-3d;
	-moz-transform: rotateY(0deg);
	-o-transition: 0.6s;
	-o-transform-style: preserve-3d;
	-o-transform: rotateY(0deg);
	-ms-transition: 0.6s;
	-ms-transform-style: preserve-3d;
	-ms-transform: rotateY(0deg);
	transition: 0.6s;
	transform-style: preserve-3d;
	transform: rotateY(0deg);
	position: absolute;
	top: 0;	
	height: 100%;
}

.flip-box .front {
	cursor: pointer;	
	padding: 25px;
	left: 50px;
	right: 50px;
	z-index: 900;
	text-align: center;
}

.flip-box.color1 .front{background: #09b304;}
.flip-box.color2 .front{background: #b33df2;}
.flip-box.color3 .front{background: #f59402;}
.flip-box.color4 .front{background: #fc4e4e;}
.flip-box.color5 .front{background: #ffcc14;}
.flip-box.color6 .front{background: #28a5fc;}
.flip-box.color7 .front{background: #1969fc;}
.flip-box.color8 .front{background: #53c437;}
.flip-box.color9 .front{background: #db58a0;}
.flip-box.color10 .front{background: #06bfb9;}
.flip-box.color11 .front{background: #f86afc;}
.flip-box.color12 .front{background: #3b3b3b;}
.flip-box.color13 .front{background: #dd780d;}
.flip-box.color14 .front{background: #13c7a2;}
.flip-box.color15 .front{background: #50aeff;}


.flip-box .front span{display:block; color:#fff; padding:10px 0 0; /*text-transform: uppercase;*/}



.flip-box .back{
	width:100%;	
	padding:5px 5px 5px 55px;
	z-index: 1000;	
	border:solid 1px #d0dbe6;
	-webkit-transform: rotateY(-180deg);
	-moz-transform: rotateY(-180deg);
	-o-transform: rotateY(-180deg);
	-ms-transform: rotateY(-180deg);
	transform: rotateY(-180deg);
}

.flip-box.color1 .back-icon-box{background: #09b304;}
.flip-box.color2 .back-icon-box{background: #b33df2;}
.flip-box.color3 .back-icon-box{background: #f59402;}
.flip-box.color4 .back-icon-box{background: #fc4e4e;}
.flip-box.color5 .back-icon-box{background: #ffcc14;}
.flip-box.color6 .back-icon-box{background: #28a5fc;}
.flip-box.color7 .back-icon-box{background: #1969fc;}
.flip-box.color8 .back-icon-box{background: #53c437;}
.flip-box.color9 .back-icon-box{background: #db58a0;}
.flip-box.color10 .back-icon-box{background: #06bfb9;}
.flip-box.color11 .back-icon-box{background: #f86afc;}
.flip-box.color12 .back-icon-box{background: #3b3b3b;}
.flip-box.color13 .back-icon-box{background: #dd780d;}
.flip-box.color14 .back-icon-box{background: #13c7a2;}
.flip-box.color15 .back-icon-box{background: #50aeff;}

.flip-box .back-icon-box{position:absolute; width:50px; top: -1px; bottom:-1px; left: -1px; padding:50px 10px;}
.flip-box .back-icon{width:100%;}
.flip-box .back-content{text-align:left; position:absolute; top: 5px; bottom:5px; right: 5px; left: 55px; outline: none!important;}
.flip-box .back-content h5{text-transform: uppercase; color:#000; font-family:"dinotmedium"; padding:0 0 5px;}
.flip-box .back-content ul li{color:#333f48; padding:0 0 5px; line-height: 14px;}
.flip-box .back-content ul li:last-child{padding:0;}
.flip-box .back-content ul li a{color:#0094cc;}
.flip-box .back-content ul li a:hover{color:#0094cc;}
.flip-box .back-content a{color:#0094cc;}
.flip-box .back-content a:hover{color:#0094cc;}

.flip-box .jspVerticalBar{width:4px; background: none;}
.flip-box .jspPane{margin-left: 0!important;}
.flip-box .jspTrack{display:block; background: #ececec; border-radius: 4px;}
.flip-box .jspDrag{border-radius: 4px; background: #0094cc;}

    .flip-box .jspHorizontalBar {
        height: 0;
        background: none;
        display: block;
        bottom: 0;
    }

.flip-box.flip .front {
	z-index: 900;
	-webkit-transform: rotateY(180deg);
	-moz-transform: rotateY(180deg);
	-o-transform: rotateY(180deg);
	transform: rotateY(180deg);
}
.flip-box.flip .back {
	z-index: 1000;
	-webkit-transform: rotateY(0deg);
	-moz-transform: rotateY(0deg);
	-o-transform: rotateY(0deg);
	-ms-transform: rotateY(0deg);
	transform: rotateY(0deg);
}

.copyright span{color:#0094cc;}

input[type="checkbox"], input[type="radio"] {
    margin: 5px;
}

.top-bottom-buffer7 { margin: 7px; }
.pad-right15 { padding-right: 15px }
.pad-left15 { padding-left: 15px }
.printonly { display: none }
.grey-table { background: #f3f6f8 !important; }
.formGrptd { padding-bottom: 15px; vertical-align: top }
.password-policy { padding-left: 25px }
    .password-policy li { list-style-type: disc !important; list-style: disc !important; }

.sys-icon { float:left; height:50px; width:50px; } 
.sys-container { width:100%; height:auto; padding:1%; }

.survey_question ul li { list-style-type: disc; }
.survey_question ol.deci li { list-style-type: decimal; }
.survey_question ol.rom li { list-style-type: lower-roman; }

.page-desc-form-head { position: absolute; left: 200px; right: 300px; padding-top: 20px; }

.flagme { background-color: #FFE4E1; border-top: solid 1px white; }

.message_label a { color: #337ab7; text-decoration: underline !important; text-transform: capitalize; }


/*This is only for Tree controls*/
.div_box2  {
    padding: 3px;
}
.ob_tree {
    padding-top: 3px
}

/*This is only for Survey*/
.likertscale .table-responsive {
    overflow: unset !important;    
}

.has-heading{position:relative; margin-left:30px;}
.has-heading .heading-text{position:absolute; right:100%; top:0; font-size:16px; line-height:18px; white-space:nowrap; margin:-1px 34px 0 0; 
transform-origin: 100% 0; transform: rotate(-90deg); font-weight: bold; color: #c9d4df; border: 1px solid #c9d4df; padding: 7px; border-radius: 10px 10px 0px 0px;}

.aspNetDisabled div
{
    background-color: #eeeeee !important;
}
.inactiveLink {
   pointer-events: none !important;
   cursor: default !important;
}
/* compatibility Issue -  float left is not supported in ie @2013*/
.btn-group-vertical > .btn-group::after, .btn-toolbar::after, .clearfix::after, .container-fluid::after, .container::after, .dl-horizontal dd::after, .form-horizontal .form-group::after, .modal-footer::after, .modal-header::after, .nav::after, .navbar-collapse::after, .navbar-header::after, .navbar::after, .pager::after, .panel-body::after, .row::after {
    display: block;
}
/*compatibility Issue - no space between tables  ie @2013*/ 
.form-group {
    display: block
}

/* filter form in linked record popup */
.filter-box {
    padding: 15px;
}

.exp-col-link.filter-box-toggle {
    background-color: #f4f7f9;
}

.filter-box-mr-15 {
    margin-right: 15px;
}

.filter-linked-mb-10 {
    margin-bottom: 10px;
}

.filter-linked-mb-5 {
    margin-bottom: 5px;
}

.filter-linked-mt-10 {
    margin-top: 10px;
}

.filter-linked-pr-7 {
    padding-right: 7px;
}

#rb_filter_operator.rb-filter-linked-pr-10 td:first-child,
#rb_link_method.rb-filter-linked-pr-10 td:first-child {
    padding-right: 10px;
}

.filter-linked-label {
    display: block;
    margin: 8px 0;
}

#pnl_grid.filter-linked-grid {
    margin-top: 25px;
}

/* beautifying ddl show rows in jqxgrid */
.ddlSelf.jqx-widget {
    margin-top: 0 !important;
}

.btn-action-reply {
    cursor: pointer;
    display: block;
    padding-bottom: 15px;
}

.box-post-reply, 
.linked-record-msg-box {
    padding-bottom:15px;
}

.textarea-reply {
    margin-bottom: 15px;
}

.pnl-filter-api-lookup {
    padding: 15px 15px 15px 0;
    margin-bottom: 15px;
}

fieldset.filter-border {
    border: 1px solid #d0dbe6 !important;
    padding: 0 1.4em 1.4em 1.4em !important;
    margin: 0 0 1.5em 0 !important;
}

legend.filter-border {
    font-size: 1.2em !important;
    font-weight: bold !important;
    text-align: left !important;
    width: auto;
    padding: 0 10px;
    border-bottom: none;
    color: inherit;
}

/* reset pointer events to enabled click on icon inside the textbox */
.form-control-feedback {
    pointer-events: unset;
}

/* bootstrap 4 custom */

.has-feedback {
    position: relative;
}

.has-feedback .form-control {
    padding-right: 42.5px;
}

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

.termination-steps .btn-dark {
    color: #fff;
    background-color: #343a40;
    border: 1px solid #343a40;
}

.termination-steps .btn-light {
    color: #505759;
    background-color: #f8f9fa;
    border: 1px solid #343a40;
}

.nav-step {
    font-size: 14px;
}

.sw-theme-arrows > ul.step-anchor > li.done > a {
    border-color: #77B8DF !important;
    color: #fff !important;
    background: #77B8DF !important;
}

    .sw-theme-arrows > ul.step-anchor > li.done > a:after {
        border-left: 30px solid #77B8DF !important;
    }

.sw-theme-arrows > ul.step-anchor > li.active > a {
    border-color: #0094cc !important;
    color: #fff !important;
    background: #0094cc !important;
}

    .sw-theme-arrows > ul.step-anchor > li.active > a:after {
        border-left: 30px solid #0094cc !important;
    }

#smartwizard .step-anchor {
    background-color: #fff;
}

.sw-theme-default > ul.step-anchor > li.done > a {
    color: #0094cc !important;
}

    .sw-theme-default > ul.step-anchor > li.done > a:after {
        background: #0094cc;
    }

.sw-theme-default > ul.step-anchor > li.active > a {
    color: #fff !important;
    background: #0094cc !important;
    border-radius: 0;
}

    .sw-theme-default > ul.step-anchor > li.active > a:after {
        background: #0094cc;
    }

.risk-assessment-associate-assessment.pnl-before legend,
.risk-assessment-associate-assessment.pnl-after legend {
    padding: 20px 0;
}

.dropdown-menu > li > a {
    color: #333;
    font-size: 14px;
}

    .dropdown-menu > li:focus, .dropdown-menu > li:hover {
        color: #262626;
        text-decoration: none;
        background-color: #f5f5f5;
    }

.list-box {
    overflow: auto;
}

textarea, textarea.form-control {
    resize: vertical;
}

.jqx-rc-all {
    border-radius: 0;
}

.jqx-listbox-container span, .jqx-dropdownlist-content.jqx-disableselect span {
    font-size: 12px;
    color: #505759;
}

.jqx-fill-state-pressed {
    border: none;
}

.jqx-dropdownlist, .jqx-fill-state-normal, .jqx-fill-state-hover {
    background: #fff;
    border: solid 1px #d0dbe6;
}

/* force jqxddl height stay at 32px so it won't shrinked if there is issue with cache or zoom */
/* for single select */
    .jqx-dropdownlist.sddl.jqx-fill-state-normal, .jqx-dropdownlist.sddl.jqx-fill-state-hover {
        min-height: 32px;
    }

/* for msb */
    .jqx-dropdownlist.msb.jqx-fill-state-normal, .jqx-dropdownlist.msb.jqx-fill-state-hover {
        min-height: 45px;
    }

.jqx-listitem-element {
    max-height: 32px;
}

.jqx-listbox-filter-input {
    padding: 0 0 0 5px;
}

.checkedItems {
    word-break: break-word;
    white-space: pre-wrap;
}

.btn-flexi-apps, .btn-flexi-apps:hover {
    color: #fff;
    background-color: #f59402;
    font-size: 14px;
    width: 50%;
    text-transform: uppercase !important;
}

/* SSO LOGIN sytle */
.pnl_SSO_User {
    padding: 30px 0 0;
}

.lbl_SSO_Welcome {
    padding-bottom: 30px;
}

.btn-diff-user, .btn-diff-user:hover {
    padding-left: 5px;
    color: #0094cc;
    font-size: 16px;
    -webkit-appearance: none !important;
    text-decoration: underline;
    background-color: transparent;
    text-transform: inherit;
}

.label-not-you {
    padding: 0;
    margin: 0;
}

.or-container {
    margin: 30px auto;
    width: 100%;
}

.user-login-form {
    padding: 15px;
}

    .user-login-form .form-group label.or {
        text-align: center;
        background-image: linear-gradient(#aaa,#aaa),linear-gradient(#aaa,#aaa);
        background-size: 40% 1px;
        background-position: center left,center right;
        background-repeat: no-repeat;
        text-transform: uppercase;
        letter-spacing: 3px;
        color: #aaa;
        font-family: arial;
        padding-bottom: 0;
        display: block;
    }

    .user-login-form .form-group label.lbl-login {
        text-transform: uppercase;
        text-align: left;
        display: block;
        font-size: 12px;
        color: #777;
    }

#btnLoginAzure, #LoginBtn {
    width: 100%;
}

#pnl_forgot_password small a {
    padding-bottom: 15px;
    margin: 0;
}



@media screen and (min-width: 768px) {
    .user-login-form {
        /*width: 75%;*/
        margin: 0 auto;
    }

    .user-login-modal {
        width: 500px;
    }
}

.container.print {
    width: 1024px;
}

.likertscale .table > tbody > tr > th, .likertscale .table > tbody > tr > td {
    min-width: 100px;
    word-break: break-word;
}

/* Dashboard Container (copy from container grid bootstrap) 
    differentiate dashboard container with general container 
    so the dashboard won't have too wide container on wide screen
    and make the menus design too empty because of it 
*/
.dashboard-container {
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
}

/* For ASP radiobuttonlist and checkboxlist, the system rendered them in table format.
    Below is the override style for radiobuttonlist and checkboxlist that generated inside the table to avoid general table style.
*/

.table .table-cb-list tr:first-child td,
.table-cb-list tr:first-child td,
.table-cb-list tr td,
.table .table-rb-list tr:first-child td,
.table-rb-list tr:first-child td,
.table-rb-list tr td {
    border: none;
    background: none;
    padding: 0;
    font-weight: normal;
    color: #505759 !important;
    font-family: inherit;
}


.table .table-cb-list.table-cb-list-horizontal tr:first-child td,
.table-cb-list.table-cb-list-horizontal tr:first-child td,
.table-cb-list.table-cb-list-horizontal tr td,
.table .table-rb-list.table-rb-list-horizontal tr:first-child td,
.table-rb-list.table-rb-list-horizontal tr:first-child td,
.table-rb-list.table-rb-list-horizontal tr td {
    padding-right: 15px;
}

    .table-cb-list tr td input[type=checkbox],
    .table-rb-list tr td input[type=checkbox],
    .table-rb-list tr td input[type=radio] {
        vertical-align: middle;
    }

.clinical.btn-outline-dark {
    color: #6c757d;
    border: 1px solid;
    border-color: #6c757d;
    text-transform: uppercase;
}

.survey-overflow,
.table-alert-watch {
    overflow-x: auto !important;
}

.likertscale .table {
    background-color: #fff;
}

.likertscale .table .bootstrap-datetimepicker-widget .datepicker table th,
.likertscale .table .bootstrap-datetimepicker-widget .datepicker table td,
.likertscale .table .bootstrap-datetimepicker-widget .datepicker table tr:first-child td {
    padding: 0;
    font-size: inherit;
    text-align: center;
    background: #fff;
}

    .likertscale .table .bootstrap-datetimepicker-widget .datepicker table tbody tr:first-child td {
        font-family: inherit;
    }

    .likertscale .table .bootstrap-datetimepicker-widget .datepicker table td.active {
        background-color: #337ab7;
    }

/* enabling list style for action note reply and discussion item reply */
#pnl_action_replies .switchcontent.applyToMakeItEnable ul,
#pnl_action_replies .switchcontent.applyToMakeItEnable ul li,
#pnl_action_replies .switchcontent.applyToMakeItEnable ol,
#pnl_action_replies .switchcontent.applyToMakeItEnable ol li,
#pnl_item_replies .switchcontent ul,
#pnl_item_replies .switchcontent ul li,
#pnl_item_replies .switchcontent ol,
#pnl_item_replies .switchcontent ol li {
    margin-left: 1em !important;
}
    #pnl_action_replies .switchcontent.applyToMakeItEnable ul,
    #pnl_action_replies .switchcontent.applyToMakeItEnable ul li,
    #pnl_item_replies .switchcontent ul,
    #pnl_item_replies .switchcontent ul li{
        list-style-type: initial;
    }

    #pnl_action_replies .switchcontent.applyToMakeItEnable ol,
    #pnl_action_replies .switchcontent.applyToMakeItEnable ol li,
    #pnl_item_replies .switchcontent ol,
    #pnl_item_replies .switchcontent ol li {
        list-style-type: decimal;
    }

#pnl_action_replies .switchcontent.applyToMakeItEnable span,
#pnl_item_replies .switchcontent span {
    padding: 0 5px;
}

.form-group a.BtnAssessmentForm {
    color: #fff;
    display:block;
}

    .form-group a.BtnAssessmentForm.dodgerblue {
        background-color: dodgerblue;
        border: 2px solid dodgerblue;
        color: #fff;
    }

    .form-group a.BtnAssessmentForm.red {
        background-color: red;
        border: 2px solid red;
        color: #fff;
    }

    .form-group a.BtnAssessmentForm.orange {
        background-color: orange;
        border: 2px solid orange;
        color: #fff;
        font-size: 14px;
    }

#pnl_parent_items {
    overflow: auto;
}

#txt_parent_breadcrum_list {
    height: 280px;
}

.ionmy-purple-color {
    color: #8543C0;
}

    a.ionmy-purple-color:hover {
        color: #3e2357;
    }

.ionmy-dark-gray-color {
    color: #303133;
}

.ionmy-blue-color {
    color: #0094cc;
}

.ionmy-red-color {
    color: #C5001D;
}

.ionmy-blue-background {
    background-color: #0094cc;
}

.ionmy-blue-border-color {
    border-color: #0094cc;
}

.ionmy-yellow-color {
    color: #FF9F43;
}

#lblFileName {
    word-break: break-all;
}

.section-upload-scrollable {
     height: 150px;
     overflow: auto;
}

.button-menu-solid-svg {
    width: 20px;
    opacity: 50%;
}

.ul-disc-style {
    list-style: disc;
    list-style-type: disc;
}

    .ul-disc-style .li-disc-style {
        list-style: disc;
        list-style-type: disc;
        margin-left: 15px;
    }

.ul-number-style {
    list-style: decimal;
    list-style-type: decimal;
}

    .ul-number-style .li-number-style {
        list-style: decimal;
        list-style-type: decimal;
        margin-left: 15px;
        padding-top: 5px;
    }

.ul-bullet-style {
    list-style: disc;
    list-style-type: disc;
}

    .ul-bullet-style .li-bullet-style {
        list-style: disc;
        list-style-type: disc;
        margin-left: 15px;
        padding-top: 5px;
    }

.w-90 {
    width: 90% !important;
}

.msb-clear-selection {
    font-size: 1.25rem;
}

.logo-image-background-pattern {
    background-position: 0px 0px, 10px 10px;
    background-size: 20px 20px;
    background-image: linear-gradient(45deg, #ddd 25%, transparent 25%, transparent 75%, #ddd 75%, #ddd 100%),linear-gradient(45deg, #ddd 25%, #eee 25%, #eee 75%, #ddd 75%, #ddd 100%);
}

.cursor-pointer {
    cursor: pointer;
}

.tpp-termination-finish p {
    margin-bottom: 5px;
    line-height: 1.5;
}

.data-watch.alert-type.active,
.data-watch.alert-area.active {
    background: #f1f1f1;
}

/* Custom styles for the toggle switch */
/* Hide the original checkbox */
.cb-toggle-switch {
    display: none;
}

/* Style for the toggle switch container */
.cb-toggle-switch-label {
    position: relative;
    display: inline-block;
    cursor: pointer;
    padding-left: 3.5rem; /* Adjust for spacing before the label text */
    line-height: 1.5rem;
    font-size: 1rem;
}

    /* Before pseudo-element for the track of the toggle switch */
    .cb-toggle-switch-label::before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        height: 1.5rem;
        width: 3rem;
        border-radius: 1.5rem;
        background-color: #ccc;
        transition: all 0.3s ease;
    }

    /* After pseudo-element for the handle of the toggle switch */
    .cb-toggle-switch-label::after {
        content: '';
        position: absolute;
        left: 0.2rem;
        top: 0.2rem;
        height: 1.1rem;
        width: 1.1rem;
        border-radius: 50%;
        background-color: #fff;
        transition: all 0.3s ease;
    }

/* Checked state - change track and handle position */
.cb-toggle-switch:checked + .cb-toggle-switch-label::before {
    background-color: #28a745;
}

.cb-toggle-switch:checked + .cb-toggle-switch-label::after {
    transform: translateX(1.5rem);
}

.datawatch-dashboard {
    background-color: #f1f1f1;
    padding: 20px;
    border-radius: 25px;
}
.datawatch-dashboard-tile {
    border-radius: 25px;
}

#datawatch_dashboard_clinical .datawatch-dashboard-tile,
#datawatch_dashboard_governance .datawatch-dashboard-tile,
#datawatch_dashboard_hr .datawatch-dashboard-tile {
    flex: 0 0 18%;
    cursor: pointer;
}

.datawatch-dashboard-clinical-color {
    color: #51bdfe;
}

.datawatch-dashboard-governance-color {
    color: #3590ee;
}

.datawatch-dashboard-hr-color {
    color: #4360e5;
}

.datawatch-dashboard-menu.menu-tabs {
    display: flex;
    list-style-type: none;
    padding-bottom: 20px;
    margin: 0;
}

.datawatch-dashboard-menu.tab {
    padding: 10px 20px;
    margin-right: 10px;
    background-color: #f0f0f0;
    border-radius: 20px;
    cursor: pointer;
    transition: background-color 0.3s, color 0.3s;
}

    .datawatch-dashboard-menu.tab.selected {
        background-color: #3690ee; /* Highlighted tab color */
        color: #ffffff;
        font-weight: bold;
    }

    .datawatch-dashboard-menu.tab:hover {
        background-color: #6badee;
    }

.datawatch-button-primary {
    background: #2b73bb !important;
}

.datawatch-wizard.table tr td,
.datawatch-wizard.table tr:first-child td {
    background: none;
    text-align: left;
    border: none;
    font-size: 16px;
    color: #505759 !important;
    font-family: 'dinotregular', arial;
}

.datawatch-wizard.cb-label {
    font-size: 20px;
}

.iframe_insightshub {
    border: 1px solid #ececec;
}
.jqx-fill-state-normal, .jqx-fill-state-normal-office {
    top: 0% !important;
    margin-top: 0px !important;
}
.material-symbols-outlined {
    font-family: 'Material Symbols Outlined';
    font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 24;
    font-size: 24px;
    display: block;
    vertical-align: middle;
    padding-bottom: 3px;
    line-height: 1;
    color: #6b787d;
}
/* DO NOT let the tooltip steal the mouse */
.jqx-tooltip {
    pointer-events: none;
    z-index: 99999;
    max-width: 500px; /* adjust as needed */
}
#gridRowTip .jqx-tooltip-content {
    white-space: normal;
    word-break: break-word; /* break long tokens */
    overflow-wrap: anywhere; /* modern browsers */
    line-height: 1.35;
}