/* Global properties ======================================================== */
html, body {width:100%; padding:0; margin:0;user-select:none;user-select:none;}
body{font-family:'Open Sans', Arial, Helvetica, sans-serif;}
a,img,a:active,a:visited{ border:none; outline:none; text-decoration:none;  -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-tap-highlight-color: rgba(255, 255, 255, 0); }
.container{width:65%;height:auto; overflow:hidden; margin:0 auto;}
.container1{width:95%;height:auto;margin:0 auto;}
.clear{width:0px; height:0px; display:block; clear:both;}
img{width: 100%;}
a,a:hover{transition:all 0.3s;}

body{}
.login-header{width:100%;height:250px;overflow:hidden;background:#0b57a5;}
.login-header img{width:120px;}
.wrapper{width:100%;position:relative;}
.wrapper .box{padding:50px;box-sizing:border-box;width:500px;position:relative;top:100px;left:50%;transform: translate(-50%, -50%);background:#fff;height:auto;border-radius:30px;box-shadow:0 17px 50px 0 rgba(11,20,26,.19),0 12px 15px 0 rgba(11,20,26,.24);/*display:flex;align-items:center;*/}

.btn{width:100%;overflow:hidden;box-sizing:border-box;background:#0b57a5;color:#fff;display:inline-block;text-align:center;padding:10px 15px;height:45px;border-radius:26px;font-size:17px;border:none;cursor:pointer;}
.btn:hover{transition:all 0.3s;background:#0b4886;box-shadow:0 8px 25px -8px rgb(96, 93, 94);}
.btn.red{background:#f00;}

/* .with-menu{position:relative;width:100px;max-width:auto;background:#0a56a4;padding:10px;border-radius:5px;cursor:pointer;color:#fff;font-size:13px;}
.with-menu i{}
.with-menu ul{position:absolute;top:40px;left:0;width:auto;min-width:150px;border-radius:5px;background:#fff;overflow:hidden;box-shadow:1px 2px 15px -6px rgb(96, 93, 94);}
.with-menu li{width:100%;box-sizing:border-box;}
.with-menu li a{padding:10px 5px;display:block;} */

.loader{position:fixed;width:100%;height:auto;top:0;left:0;bottom:0;background:rgba(255, 255, 255, 0.97);z-index:99;display:grid;align-content:center;}
.loader img{margin:0 auto;width:100px;display:block;}
.loader p{text-align:center;display:block;}

input,select,textarea{width:100%;height:45px;border-radius:20px;background:none;border:1px solid #8e8181;padding:10px;box-sizing:border-box;margin-bottom:10px;font-size:15px;transition:all 0.3s;}
input:hover{border-color:#0b57a5;transition:all 0.3s;}
input:focus-within{border-color:#0b57a5;}

.login h1{font-size:30px;text-align:center;margin:25px auto;color:#0b57a5;}
.login label{color:#3f4245;font-weight:600;}
.login .btn{height:50px;margin-top:25px;}
.login-logo{position:absolute;width:130px;top:-65px;left:50%;transform:translateX(-50%);overflow:hidden;border-radius:50%;padding:10px;box-sizing:border-box;background:#0b57a5;border:5px solid #fff}
.login-logo img{width:100%;}

.dataTable td{font-size:14px;}

.model-wrap{z-index:9;display:none;padding-top:100px;position:fixed;left:0;top:0;width:100%;height:100%;overflow:auto;background-color:rgb(0,0,0);background-color:rgba(0,0,0,0.4);box-sizing:border-box;}
.model-wrap .model{margin:auto;width:80%;height:auto;overflow:hidden;position:relative;animation:animatetop 0.5s;margin-bottom:25px;}
@keyframes animatetop{from{top:-300px;opacity:0} to{top:0;opacity:1}}
.model-wrap .model p{margin:0;text-transform:none;}
/* .model-wrap .model-header{background:#0199db;color:#fff;padding:20px 50px 20px 10px;;box-sizing:border-box;width:100%;font-size:20px;} */
.model-wrap .model span.model-close{position:absolute;top:0;right:0;color:#fff;cursor:pointer;user-select:none;font-weight:bold;;box-sizing:border-box;padding:7px 10px 10px;}
.model-wrap .model span.model-close:hover{background:#b0b0b0;}
.model-wrap .model-header{background:#21a2da;color:#fff;padding:13px 50px 13px 10px;box-sizing:border-box;width:100%;font-size:20px;border-radius:5px 5px 0 0;}
.model-wrap .model-body{width:100%;height:auto;background:#fff;overflow:hidden;padding:20px 10px;box-sizing:border-box;border-radius:0 0 5px 5px;}
.model-wrap .model-body table{width: 100%;}
.model-wrap .model-body img{width: 100%;}
.model.alert{width:30%;}
.model .btn{width:auto;height:auto;padding:8px 15px;font-size:12px;}

/* ------------------------------------------------------------------------------------ */

header{width:100%;height:auto;padding:5px 0;background:#e9eeff;float:left;position:fixed;z-index:9;}
header .logo{width:73px;height:auto;float:left;}
nav{display:block;width:auto;float:right;padding-left:80px;margin-top:20px;}
nav ul{}
nav li{float:left;display:block;margin-right:20px;}
nav p.label, .menu-open{display:none;}
nav li a{display:block;padding:10px 12px;box-sizing:border-box;border-radius:14px;font-size:13px;font-weight:600;line-height:13px;color:#333;transition:all 0.3s;}
nav li a i{margin-right:5px;}
nav li a.active{background:#21a2da;color:#fff;}
nav li a:hover{background:#21a2da;color:#fff;transition:all 0.3s;}
li.parent{position:relative;}
ul.child{position:absolute;width:200px;background:#fff;padding:5px;box-sizing:border-box;border-radius:10px;display:none;box-shadow:0px 7px 10px -4px #0000006e;}
ul.child li{width:100%;}
ul.child li a{}
ul.child li a:hover{background:none;color:#b1b1b1;}

.dashboard{padding-top:90px;background:#e9eeff;min-height:100vh;height:auto;overflow:hidden;}
.overview{padding-top:30px;background:#e9eeff;min-height:80vh;}
.main-chart{width:25%;height:auto;overflow:hidden;background:#fff;border-radius:20px;text-align:center;padding:40px 10px;box-sizing:border-box;box-shadow:0 2px 4px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12);float:left;margin-bottom:15px;}
.main-chart h3{font-size:20px;margin-bottom:30px;}
.main-chart .time{background:#333;color:#fff;border-radius:10px;display:inline-block;margin-top:20px;padding:10px 20px;box-sizing:border-box;}
.main-chart .count{width:80%;overflow:hidden;margin:25px auto;}
.main-chart .count div{width:50%;float:left;text-align:center;padding:10px;box-sizing:border-box;color:#fff;}
.main-chart .count div p{font-size:14px;}


.sub-chart{float:left;width:75%;}
.sub-chart .qtr{float:left;width:23.5%;background:#fff;overflow:hidden;margin-right:1.5%;padding:20px 15PX;box-sizing:border-box;border-radius:15px;box-shadow:0 2px 4px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12);}
.qtr h4{text-align:center;font-size:25px;margin-bottom:0px;}
.qtr p{text-align:center;font-size:13px;}
.qtr span{border-radius:100%;color:#eef1ff;display:block;font-size:25px;height:50px;line-height:60px;text-align:center;width:50px;margin:0 auto 15px auto;}
.qtr span i{line-height:52px;}
.sub-chart.sub .qtr{margin-top:10px;}
.sub-chart.sub .inside{color:green;}
.sub-chart.sub .outside{color:red;}

.dashboard-75{width:75%;float:left;}
.dashboard-75 .sub-chart{width:100%;float:left;}
.dashboard-75 .sub-chart.sub{width:49%;margin-right:1%;float:left;margin-top:20px;background:#fff;padding:20px 5px 10px 5px;box-sizing:border-box;border-radius:10px;box-shadow:0 2px 4px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12);}
.dashboard-75 .sub-chart.sub h3{margin-left:20px;}

.dashboard h2{color:#000;font-size:25px;margin-bottom:15px;font-weight:400;}

.line-chart{width:100%;}

h2{font-size:20px;color:#0a56a4}
h2 b{color:#f00;font-weight:600;}
label{display:block;}

h2 span{font-size:13px;font-weight:400;line-height:30px;color:#444;}
h2 span a{color:#21a2da;border-left: 1px solid #000;padding-left: 9px;margin-left: 9px;}

h2.with-btn{display:block;width:100%;float:left;}
h2.with-btn a.btn{display:block;width:auto;float:right;height:auto;font-size:11px;padding:5px 10px;}
h2.with-btn a.btn i{line-height:15px;}

.row{width:100%;overflow:hidden;}

.search{width:100%;padding:20px;box-sizing:border-box;background:#fff;overflow:hidden;box-shadow:0 2px 4px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12);border-radius:10px;margin-bottom:20px;}
.search h2{margin-bottom:30px;text-transform:uppercase;}
.form-item{float:left;width:25%;margin-right:20px;}
/* form input{border:1px solid #9b9393;padding:5px; display:block;box-sizing:border-box;height:40px;width:100%;border-radius:10px;font-size:16px;text-transform:uppercase;} */
form label{font-size:14px;font-weight:600;display:block;margin-bottom:5px;}
button{background:#21a2da;color:#fff;transition:all 0.3s;border:none;padding:0 20px;height:40px;border-radius:10px;}

#myTable th, #myTable td{text-align:center;}

.fifty{width:50%;float:left;}
.twenty{width:20%;float:left;}

.popup{width:100%;position:fixed;top:0;left:0;bottom:0;background:rgba(0,0,0,0.7);z-index:9;align-items:center;display:grid;}
.popup .popup-wrapper{width:50%;margin:0 auto;}
.popup .popup-title{border-radius:10px 10px 0 0;background:#eee;border-bottom:1px solid  #ddd;padding:10px;box-sizing:border-box;}
.popup .popup-body{background:#eee;border-bottom:1px solid  #ddd;padding:10px;box-sizing:border-box;overflow:hidden;}
.popup .popup-footer{border-radius:0 0 10px 10px;background:#eee;border-bottom:1px solid  #ddd;padding:10px;box-sizing:border-box;overflow:hidden;text-align:right;}
.popup .btn{width:auto;float:right;padding:5px 15px;height:auto;margin-left:10px;font-weight:400;font-size:14px;}
.popup a.btn{background:#f00;}
.popup button.btn{background:#0b4886;}
.popup .btn i{line-height:19px;}
.popup .input-box{width:50%;}
.popup .input-box input{border:1px solid #aaa;}

/* .inner-section{background:#F9F9FC;min-height:80vh;padding:30px 0;float:left;width:100%;padding-top:120px;height:auto;background:url(../images/dbg.jpg) no-repeat center;background-size:cover;background-attachment:fixed;} */
.inner-section{background:#F9F9FC;min-height:80vh;padding:30px 0;float:left;width:100%;padding-top:120px;height:auto;background:url(../images/dot.jpg) repeat center;background-attachment:fixed;}
.inner-section h2{display:block;margin-bottom:15px;}

.pannel{background:#fff;border-radius:5px;padding:15px;box-sizing:border-box;overflow:hidden;box-shadow:2px -3px 7px 1px #e3e3e3a3;}
.pannel-header{border-bottom:1px solid #ddd;overflow:hidden;padding-bottom:15px;}
.pannel-header-normal{border:none;padding:0;}
.pannel-header .input-wrapper{position:relative;overflow:hidden;}
.pannel-header .input-wrapper i{position:absolute;left:13px;top:15px}
.pannel-header input, .pannel-body input{border-radius:5px;box-shadow:0px 4px 4px 0px rgba(219, 219, 219, 0.2509803922);border-color:#E8E8E8;width:100%;padding-left:40px;}
.pannel-header .btn, .pannel-body .btn{width:150px;float:right;border-radius:5px;font-size:16px;line-height:25px;background:#21a2da;}
.pannel-header .btn:hover, .pannel-body .btn:hover{background:#0b4886;transition:all 0.3s;}
.pannel-header .btn i, .pannel-body .btn i{line-height:25px;margin-right:5px;}
.pannel-header-normal input{padding:10px;}
.pannel-header-normal select{padding:10px;border-color:#E8E8E8;border-radius:10px;}
.pannel-header-normal .input-wrapper{padding:10px;box-sizing:border-box;}
.pannel-body{overflow:hidden;}

ul.staffs{width:100%;overflow:hidden;margin-top:25px;}
ul.staffs li{width:20%;float:left;padding:5px;box-sizing:border-box;}
.staff-card{border:1px solid #ccc;border-radius:10px;padding:15px;box-sizing:border-box;}
.staff-title{overflow:hidden;margin-bottom:10px;}
.staff-dp{width:30px;height:30px;background:#00BBDE;overflow:hidden;display:flex;align-items:center;text-align:center;float:left;margin-right:5px;border-radius:5px;}
.staff-dp i{margin:0 auto;color:#fff;}
.staff-name{height:30px;float:left;display:flex;align-items:center;}
.staff-name h5{font-size:16px;color:#636060;}
.staff-data{overflow:hidden;}
.staff-data p{color:#636060;margin:15px 0;display:block;line-height:14px;}
.staff-data p i{margin-right:5px;}
.staff-footer{overflow:hidden;margin-top:10px;}
.staff-footer .btn{float:right;width:auto;height:30px;padding:5px 10px;font-size:12px;line-height:19px;}
.staff-footer .btn.edit{float:left;background:#abaeb1;}
.staff-footer .btn i{line-height:22px;}

.side-bar-wrapper{width:100%;left:0;top:60px;bottom:0;background:rgba(0,0,0,0.6);position:fixed;display:none;}
.side-bar{width:50%;float:right;background:#fff;min-height:100vh;overflow-y:auto;overflow-x:hidden;display:none;}
.side-bar-title{padding:20px;box-sizing:border-box;border-bottom:1px solid #eff2f5;position:relative;}
.side-bar-title h2{color:#262a2a;font-weight:600;}
.close-side-bar{position:absolute;right:25px;top:25px;width:25px;height:25px;border-radius:50%;text-align:center;font-size:14px;padding-top:5px;box-sizing:border-box;transition:all 0.3s;background:#fff;box-shadow:0 4px 4px 0 rgba(219,219,219,.2509803922);border:1px solid #E8E8E8;}
.close-side-bar:hover{transform:rotate(360deg);transition:all 0.3s;background:#f00;color:#fff;box-shadow:none;}
.side-bar-body{padding:20px;box-sizing:border-box;}
.side-bar-form{overflow:hidden;border:1px solid #e8e8e8;border-radius:10px;box-sizing:border-box;padding:10px;box-shadow:0 4px 74px 0 rgba(208,208,208,.2509803922);}
.side-bar .input-box{width:50%;float:left;padding:15px;box-sizing:border-box;}
.input-box label{font-size:13px;}
.input-box label i{color:#f00;}
.input-box select, .input-box input{border-radius:6px;border:1px solid #e8e8e8;color:#6f6f6f;box-shadow:0 4px 4px 0 rgba(219,219,219,.2509803922);margin:0;font-size:14px;height:40px;}
.input-box input::placeholder{color:#afa6a6;}
.side-bar .row{padding:15px;box-sizing:border-box;}
.side-bar .btn{width:auto;float:right;height:auto;border-radius:5px;font-size:14px;line-height:15px;font-weight:400;border:1px solid #103b67;}
.side-bar .btn.cancel{background:#f5f5f5;color:#262a2a;border:1px solid #e8e8e8;margin:0 15px;}
.side-bar .btn i{margin-right:5px;}

#myTable_wrapper select, #myTable_wrapper input{width:auto;height:auto;}

form.small{width:100%;overflow:hidden;}
form.small .form-field{overflow:hidden;margin-bottom:10px;}
form.small label{color:#7c7c7c;font-weight:600;}
form.small input, form.small select{height:32px;border-radius:6px;border:1px solid #d3cfcf;margin-bottom:0;font-size:13px;padding:10px;}
form.small input::placeholder{color:#9e9a9a;}

th.upi{}
th.upi input{width:auto;}
th.upi .btn{width:auto;}

#upi{border:2px solid #133494;background:#fff;width:109px;height:40px;padding:6px 15px;}
div.dt-container .dt-search input{width:auto;height:auto;}

/* -----------------------------invoice dtyles------------------ */
.invoice-pannel{border-radius:10px;padding:0;width:80%;margin:0 auto;}
.invoicer{background: #fff;border-radius: 10px;float: left;width: 100%;}
.inv-title{border-bottom:2px solid #d5c3c3;padding:15px;}
.invoicer .inv-body{padding:15px;}
.invoicer .new-item{width:100%;float:left;margin-bottom:0px;}
.invoicer .more{width:19%;font-size:13px;border-radius:5px;height:50px;}
.invoicer .more i{margin:2px 2px 0 0;}
.invoicer .service-list{width:80%;float:left;height:auto;border-radius:5px;}
.invoicer .inv-table{overflow:hidden;width:100%;}
.invoicer .inv-table .inv-table div{overflow:scroll;}
.invoicer table{border-collapse: collapse;width: 100%;}
.invoicer td i.fa{cursor:pointer;color:red;}
.invoicer th{background:#f2f2f2;}
.invoicer th, .invoicer td{border:1px solid #dddddd;text-align:left;padding:8px;}
.invoicer table tfoot th{background:#f2f2f2;}
.invoicer table select, .invoicer table input{margin:0;height:35px;padding:5px 10px;border-radius:5px;}
.invoicer table input:read-only{background:#ccc;}
.invoicer .inv-footer{padding:15px;border-top:2px solid #d5c3c3;overflow: hidden;}
.inv-footer .more{float:left;margin:0;width:auto;font-size:13px;line-height:20px;float:right;height:auto;}
.pannel-body .invoicer .inv-footer .more i{line-height:unset;margin:0 5px 0 0 !important}
.inv-footer #pending{float:left;margin:0;}

.selectize-control.single .selectize-input{height:50px;display:grid;align-content:center;}
.selectize-control.single .selectize-input input{height:23px;}
.selectize-control{margin-bottom:20px;}

.calculator{position:fixed;top:400px;width:300px;background:#fff;left:50%;right:50%;transform:translate(-50%, -50%);border-radius:10px;box-shadow:1px -1px 12px 0px #00000063;z-index:9;border:2px solid #c4b9b9;overflow:hidden;}
.calculator .calc-head{padding:10px;box-sizing:border-box;border-bottom:1px solid #ccc;overflow:hidden;position:relative;background:#e9eeff;}
.calculator .calc-head p{width:95%;float:left;font-weight:600;}
.calculator .calc-head a{position:absolute;right:15px;top:15px}
.calculator .calc-body{padding:10px;box-sizing:border-box;overflow:hidden;}
.calculator .calc-footer{padding:10px;box-sizing:border-box;border-top:1px solid #ccc;overflow:hidden;}
.calculator .calc-footer a.btn{width:auto;width:auto;font-size:14px;padding:5px 19px;height:auto;line-height:unset;float:left;background:#f00;color:#fff;}
.calculator .half{width:100%;float:left;}
.calculator .half label{font-size:14px;}
.calculator .half input, .calculator .half select{border-radius:5px;width:99%;margin-right:1%;height:35px;font-size:14px;}
.calculator button.btn{width:auto;height:auto;padding:5px 19px;font-size:14px;margin-left:10px;float:right;}


.token{width:100%;min-height:100vh;height:auto;background:url(../images/kerala-bg.jpg) no-repeat;background-size:cover;background-attachment:fixed;position:relative;display:grid;align-items:center;}
.token-wrapper{width:50%;height:auto;margin:0 auto;/*overflow:hidden;*/background:#fff;border-radius:15px;box-shadow:0 0 26px 0 rgba(144, 139, 139, 0.71);}
.token-wrapper .title{margin-bottom:15px;box-sizing:border-box;border-bottom:1px solid #ccc;background:#bad5e9;padding:10px;box-sizing:border-box;border-radius:15px 15px 0 0;}
.token-wrapper .title h3{font-size:25px;}
.token-wrapper .token-image{float:left;width:50%;overflow:hidden;}
.token-wrapper .token-search{float:left;width:100%;/*overflow:hidden;*/padding:10px;box-sizing:border-box;}
.token-wrapper .input-cover{width:50%;float:left;padding:5px;box-sizing:border-box;}
.input-cover input, .input-cover select{border-radius:10px;}
.input-cover button.btn{border-radius:10px;width:auto;line-height:unset;}
.input-cover a.btn{border-radius:10px;width:auto;float:right;line-height:unset;}
.input-cover a.btn i{line-height:unset;}
.input-cover .btn i{line-height:20px;font-size:16px;}
.input-cover .btn{line-height:25px;font-size:16px;height:auto;}

#quickTable{text-align:left;}
#quickTable tr{border-bottom:1px solid #ccc;}
#quickTable tr:nth-child(even){background:#f9f9f9;}
#quickTable tr:hover{background:#eee;}
#quickTable th{padding:5px;box-sizing:border-box}
#quickTable td{padding:10px 5px;box-sizing:border-box}

.user-home{width:100%;height:auto;min-height:90vh;overflow:hidden;padding-top:90px;background:#fff;/*background:linear-gradient(-45deg, #EE7752, #E73C7E, #23A6D5, #23D5AB);animation:Gradient 15s ease infinite;*/}
.user-home hr{background:#dfdfdf;border-color:transparent;margin-bottom:20px;}
/* @keyframes Gradient {
	0% {
		background-position: 0% 50%
	}
	50% {
		background-position: 100% 50%
	}
	100% {
		background-position: 0% 50%
	}
} */
.token-grid{width:100%;background:#e9eeff;padding:10px;box-sizing:border-box;margin-bottom:30px;overflow:hidden;border-radius:5px;border:1px solid #eee;}
.token-grid .title{overflow:hidden;}
.token-grid .title h2{float:left;color:#383b3c;}
.token-grid .title a.btn{float:right;width:auto;padding:5px 15px;height:auto;font-size:12px;margin-left:5px;background:#21a2da;}
.token-grid .title a.btn i{line-height:16px;font-size:11px;}
.token-items{display:flex;flex-wrap:wrap;}
.token-grid .tkns{width:20%;padding:7px;box-sizing:border-box;float:left;flex-grow:1;flex:0 1 20%;margin-bottom:5px;}
.token-grid .tkns .tkn-body{background:#fff;border-radius:10px;padding:15px 15px 50px 15px;box-sizing:border-box;overflow:hidden;box-shadow:0 -1px 5px 1px #d4cece96;text-align:center;min-height:280px;transition:all 0.3s;position:relative;}
.token-grid .tkns .tkn-body:hover{box-shadow:0 8px 25px -8px rgb(96, 93, 94);transition:all 0.3s;}
.token-grid .tkns .tkn-body h4{font-size:18px;color:#848484;}
.token-grid .tkns p{font-size:12px;color:#848484;}
.token-grid .tkns .tkn-body a{font-size:12px;width:auto;padding:5px 15px;background:#949e98;border-radius:20px;display:inline-block;color:#fff;margin:10px auto;}
.token-grid .tkns .tkn-body a:hover{box-shadow:1px 2px 2px 2px #a9e5a9f7;}
.token-grid .tkns .tkn-body a i{line-height:18px;}
.token-grid .token-no{width:60px;height:60px;margin:10px auto;border-radius:50%;text-align:center;display:grid;align-content:center;border:4px solid #ddd;}
.token-grid .token-no h5{color:#fff;font-weight:900;}
.token-grid .token-no.pending{background:#45a03d;}
.token-grid .token-no.opened{background:#f66;}
.token-grid .personal{margin:10px 0;}
.token-grid .srvs{margin-bottom:10px;}
.token-grid .srvs p{text-transform:capitalize;color:#5a6860;font-weight:600;}
.token-grid .action-btn{width:100%;position:absolute;left:50%;bottom:0;text-align:center;background:#fcf8f8;transform:translate(-50%);border-radius:0 0 15px 15px;}

.statistics{overflow:hidden;margin-top:30px;}
.statistics-item{width:25%;float:left;display:flex;align-items:center;padding-right:10px;box-sizing:border-box;margin-bottom:30px;}
.avatar{width:60px;height:60px;border-radius:50%;float:left;background:#ece0e3;display:grid;align-items:center;text-align:center;}
.avatar a{color:#d25070;}
.avatar i{font-size:30px;}
.statistics-content{padding-left:20px;display:grid;align-items:center;float:left;text-align:left;box-sizing:border-box;}
.statistics-content h4{font-weight:900;font-size:19px;}
.statistics-content p{font-weight:600;font-size:14px;}


.detailed-report{width:25%;float:left;padding:5px;box-sizing:border-box;}
.detailed-columns{width:100%;background:#e9fff5;padding:15px;box-sizing:border-box;border-radius:8px;}
.detailed-columns h5{margin-bottom:10px;font-size:17px;}
.detailed-columns table{width:100%;font-size:14px;}
table.wallet-report th, table.wallet-report td{text-align:left;}
table.wallet-report td span{font-size:11px;font-weight:600;color:#f00;}
table.wallet-report th:nth-child(even), table.wallet-report td:nth-child(even){float:right;text-align:right;}
.detailed-columns table tbody tr{border-bottom:1px solid #7ad71d;padding:8px 0;box-sizing:border-box;display:block;overflow:hidden;}
.detailed-columns table tbody tr:hover{background:#c2f1dc;}


.attendance{width:50%;overflow:hidden;background:#fff;margin:0 auto;padding:10px;box-sizing:border-box;text-align:center;border-radius:10px;}
.attendance hr{background:none;border-color:#eee;}
.attendance h5{font-weight:600;font-size:20px;}
.attendance h4{font-weight:600;font-size:18px;}
.attendance .user{width:120px;height:120px;border-radius:50%;margin:0 auto;background:#eee;}
.attendance .user img{width:100%;}
.attendance .time{margin:10px 0;}
.attendance .time p{font-size:30px;line-height:30px;color:#0a56a4;}
.attendance .time p span{font-size:18px;color:#333;}
.attendance .button{text-align:center;}
.attendance .label{padding:10px 0}
.pannel-header .attendance button{text-align:center;float:none;width:auto;height:auto;line-height:unset;font-size:16px;}

.user-overview{width:100%;overflow:hidden;}
.user-overview li{width:20%;float:left;padding:5px;box-sizing:border-box;}
.user-overview li div{padding:10px;box-sizing:border-box;background:#eee;border-radius:10px;position:relative;}
.user-overview li div p{font-size:15px;color:#333;}
.user-overview li div p span{font-size:20px;font-weight:900;}
.user-overview li div i{width:40px;height:40px;border-radius:50%;position:absolute;right:5px;top:5px;text-align:center;display:grid;align-items:center;background:#eee;}

.wallet-usage{width:100%;overflow:hidden;}
.wallet-usage li{width:20%;float:left;padding:5px;box-sizing:border-box;}
.wallet-usage li div table{width:100%;}
.wallet-usage li div tr{border:1px solid #bfbfbf;display:block;}
.wallet-usage li div th{padding:10px;text-align:center;background:#eee;display:block;}
.wallet-usage li div td{padding:10px;text-align:center;display:block;}
