.login-block .auth-box h3{font-weight: 700;}
.login-block .auth-box .form-primary{margin-bottom: 20px;}
.login-block .auth-box .form-primary label{margin-bottom: 8px;}
.login-block .auth-box .form-primary input{padding: 10px 15px; border-radius: 5px;}
.login-block .auth-box .btn-primary{ margin-top: 20px; padding: 10px; border-radius: 30px;}
.annoncement-message{padding: 4px 0px; background: #0e2a46; margin: 10px 0px; color: #fff; height: 30px;}
.annoncement-message marquee li{list-style: none; position: relative; padding-left: 20px; font-size: 14px; margin-right: 20px; display: inline-block;}
.annoncement-message marquee li::before{ content: "\f005"; font: normal normal normal 14px/1 FontAwesome; position: absolute; left: 0px; top: 4px; color: yellow;}
.dash-box{background: #fff; border-radius: 8px; position: relative; overflow: hidden; padding: 15px; padding-top: 20px;}
.dash-box h5{font-weight: 700; font-size: 16px; border-bottom: 2px solid #E6E9ED; padding-bottom: 10px; margin-bottom: 15px; position: relative; text-transform: capitalize; }
.box-shadow{ box-shadow: 0 0 35px 0 rgb(154 161 171 / 15%);}
.dash-box h5 .count{ width: 40px; height: 40px; line-height: 40px; border-radius: 50%; background: #0e2a46; color: #fff; text-align: center;
position: absolute; right: 0px; font-size: 14px; top: -14px;}
.dash-box h4{font-weight: 700; font-size: 20px; color: #0e2a46; margin-bottom: 25px;}
.dash-box .approvals{ list-style: none; counter-reset: item; padding: 0px; margin: 0px; overflow-y: auto; height: 80%;}
.dash-box .approvals li{list-style: decimal; padding-right: 50px; position: relative; margin-bottom: 15px; display: -webkit-box; -webkit-line-clamp:1; 
-webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden; counter-increment: item; padding-left: 20px; padding-bottom: 4px;}
.dash-box .approvals li button{border: 1px solid var(--brd-red); color: var(--brd-red); border-radius: 30px; background: none; font-size: 12px; min-width: 45px;
position: absolute; top: 0px; right: 3px; cursor: pointer;}
button:focus{outline: none;}
.dash-box .approvals li button:hover{background: var(--brd-red); color: #fff;}
.dash-box .approvals li:last-child{margin: 0px;}
.dash-box .approvals li::before{  content: counter(item); position: absolute; left: 0px;}
.dash-box .pendings li{padding-right: 60px;}
.dash-box .pendings li button{border-color: #fe9365; color: #fe9365;}
.dash-box .pendings li button:hover{background: #fe9365; color: #fff;}
.hight270{height: 270px; overflow: hidden;}
.approval-box{border-radius: 4px; overflow: hidden; position: relative; background: #fff; border: 1px solid transparent; margin-bottom: 20px; text-align: center;}
.Approval-sc h4, .quick-links h4{font-weight: 700; color: #0e2a46; margin-bottom: 10px;}
.approval-box-count{padding: 12px; position: relative;}
.approval-box-count .count{ font-size: 26px; font-weight: 700; text-align: center; width: 120px; height: 80px; line-height: 80px; border-radius: 50%;
display: inline-block; background: transparent; color: var(--white); margin-bottom: 20px;}
.approval-box-bottom{padding-bottom: 20px;}
.approval-box-bottom button{border-radius: 30px; background: transparent;  border: 1px solid transparent; padding: 2px 10px; min-width: 100px; cursor: pointer; color: var(--white);}
.brd-blue, .brd-blue .approval-box-bottom{border-color: var(--brd-blue);}
.brd-blue p, .brd-blue .approval-box-count .count{ background: var(--brd-blue);}
.brd-blue button{background: var(--brd-blue);}
.brd-yellow, .brd-yellow .approval-box-bottom{border-color: var(--brd-yellow);}
.brd-yellow p, .brd-yellow .approval-box-count .count{ background: var(--brd-yellow);}
.brd-yellow button{background: var(--brd-yellow);}
.brd-green, .brd-green .approval-box-bottom{border-color: var(--brd-green);}
.brd-green p, .brd-green .approval-box-count .count{ background: var(--brd-green);}
.brd-green button{background: var(--brd-green);}
.brd-red, .brd-red .approval-box-bottom{border-color: var(--brd-red);}
.brd-red p, .brd-red .approval-box-count .count{ background: var(--brd-red);}
.brd-red button{background: var(--brd-red);}
.dash-box .pendings li .doc-expired{position: absolute; right: 0px;}
.dash-box .requests li button{border-color: var(--brd-green); color: var(--brd-green);}
.dash-box .requests li button:hover{background: var(--brd-green); color: #fff;}
.quick-links{padding: 0px 15px;}
.quick-links h5{margin-bottom: 15px; font-weight: 700; color: var(--primary-colour);}
.quick-links-box{background: #fff; border-radius: 5px; padding: 10px 10px; text-align: center;  box-shadow: 0 0 35px 0 rgb(154 161 171 / 15%);
transition: 0.3s all ease-in-out; margin-bottom: 20px; min-height: 78px;}
.quick-links-box h6{margin: 0px;}
.quick-links-box i{margin-bottom: 10px; font-size: 14px;}
.quick-links-box:hover{ box-shadow: 0 10px 35px 0 rgb(154 161 171 / 30%); transform: translateY(-10px);}
.dash-box .approvals::-webkit-scrollbar {width: 3px;}
.dash-box .approvals::-webkit-scrollbar-track { box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);}
.dash-box .approvals::-webkit-scrollbar-thumb { background-color: darkgrey;}
.approval-box-count h3{font-size: 18px;}
.pcoded .pcoded-navbar[navbar-theme=theme1] .pcoded-item .pcoded-hasmenu .pcoded-submenu li.active:hover > a{color: var(--white) !important;}
.swal-button, .swal-button:hover{background: var(--primary-colour) !important;}
.dataTable thead{background: var(--primary-colour) !important;}
table.dataTable, table.dataTable th, table.dataTable td {  box-sizing: border-box !important;}
.datepicker table tr td.active:hover, .datepicker table tr td.active:hover:hover, .datepicker table tr td.active.disabled:hover,
.datepicker table tr td.active.disabled:hover:hover, .datepicker table tr td.active:focus, .datepicker table tr td.active:hover:focus, 
.datepicker table tr td.active.disabled:focus, .datepicker table tr td.active.disabled:hover:focus, .datepicker table tr td.active:active, 
.datepicker table tr td.active:hover:active, .datepicker table tr td.active.disabled:active, .datepicker table tr td.active.disabled:hover:active, 
.datepicker table tr td.active.active, .datepicker table tr td.active:hover.active, .datepicker table tr td.active.disabled.active, 
.datepicker table tr td.active.disabled:hover.active, .open .dropdown-toggle.datepicker table tr td.active, 
.open .dropdown-toggle.datepicker table tr td.active:hover, .open .dropdown-toggle.datepicker table tr td.active.disabled, 
.open .dropdown-toggle.datepicker table tr td.active.disabled:hover{ background: var(--primary-colour) !important;}
.approval-count{position: relative; display: inline-block; width: 49%; margin-bottom: 8px;}
.approval-count .count{margin-bottom: 5px; height: 80px; width: 110px; line-height: 18px; font-size: 14px; position: relative;}
.approval-count h5{font-size: 14px;}
.approval-count .count .count-number{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.approval-count .count .count-number label{display: block; font-weight: 100;}

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

@media only screen and (max-width:767px) {
  .approval-box{margin-bottom: 20px;}
  .quick-links-box{min-height: 80px;}
}

:root {
    --primary-colour: #0e2a46;
    --white: #ffffff;
    --secondary-colour:#FC652C;
    --dark-green:#005559;
    --light-green:#34BBC3;
    --bg-colour:#F9F9FF;
    --bgcolour2:#42E8E0;
    --bgcolour3:#7AC08B;
    --bgcolour4:#004A4E;
    --brd-yellow:#fe9365;
    --brd-green:#0ac282;
    --brd-red:#fe5d70;
    --brd-blue:#01dbdf;
  }