:root{
    --white: #fff;
    --color: #2fc69f;
}
.demo{ background-color: #eee; }
.serviceBox {
    color: #000;
    background: var(--color);
    text-align: center;
    margin: 0 auto;
    border-radius: 10px;
    position: relative;
    z-index: 1;
}
body{
    font-size:18px;
}
.top-headerr {
    margin-bottom: 15px;
    border-bottom: 1px dashed #ddd;
}
.top-headerr h1 {
    font-weight: 600;
    font-size: 30px;
}
.serviceBox:before {
    content: "";
    background: var(--white);
    width: calc(100% - 20px);
    height: calc(100% - 20px);
    border-radius: 10px 10px;
    transform: translateX(-50%) translateY(-50%);
    position: absolute;
    top: 50%;
    left: 50%;
    box-shadow: 6px 6px 6px rgb(0 0 0 / 16%);
    z-index: -1;
    background-image: url(../images/assets-bg.png);
    background-size: cover;
    background-position: center;
}
.serviceBox .service-icon {
    color: var(--white);
    background: var(--color);
    font-size: 36px;
    height:60px;
    line-height: 55px;
    border-radius: 20px 20px 0 0;
    margin: 0 auto 15px;
    position: relative;
}
.serviceBox .description {
    font-size: 28px;
    line-height: 23px;
    margin: 0 20px 10px;
    font-weight: 800;
}
.serviceBox .title {
    color: var(--white);
    background: var(--color);
    font-size: 15px;
    font-weight: 500;
    text-transform: uppercase;
    padding: 10px 18px;
    display: inline-block;
    border-radius: 15px 15px 0 0;
    margin: 0;
}

.serviceBox.green{ --color: #0ba7a5; }
.serviceBox.orange{ --color: #e97e21; }
.serviceBox.blue{ --color: #0193bf; }
@media only screen and (max-width: 1199px){
        .serviceBox {
        margin: 5px 0;
    }
    .hgtt {
    padding: 0 0 !important;
}
}
@media only screen and (max-width: 767px){
.apexcharts-element-hidden.apexcharts-selected {
    cursor: pointer;
    width: 20px;
    height: 20px;
    line-height: 24px;
    color: #6e8192;
    text-align: center;
}
.customer_registration li {
    margin-left: 5px !important;
    margin-bottom: 10px;
    margin-right: 5px !important;
}
.top-headerr h1 {
    font-size: 24px;
}
section.content.profilehead .card {
    margin-bottom: 15px !important;
}
.content-body .wrapper1 .container {
    margin-top: 90px !important;
    padding-bottom: 90px;
}
}

.header .header-content {
    border-radius: 18px 0 0 0;
    border-left: 1px dashed #ddd;
    box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.08);
}
.nav-header .brand-logo img {
    height: 55px;
    position: relative;
    top: 5px;
    margin-right: auto;
}

.chart-img img {
    width: 100%;
}

.deznav .metismenu li a svg {
    fill: rgba(255, 255, 255, 0.1);
}
.deznav .metismenu li.mm-active a svg {
    color: #318534 ;
    fill: #f0f0f3;
}
.deznav .metismenu > li {
    margin-bottom:5px;
}
form .form-group label span {
    color: #e4080f;
    float: right;
}
select.form-control {
    appearance: auto;
}
.menu-toggle .nav-header .brand-logo img {
    height: 35px;
    margin-right: auto;
    margin-left: auto;
}
.dropdown-menu.show {
    padding: 0;
}
/*.form-group .dropdown-menu{
    height: 300px;
}*/
.logo2{
    display: none;
}
.menu-toggle .logo1 {
  display: none;
}
.menu-toggle .logo2 {
  display: block;
}
.menu-toggle .deznav .metismenu li.mm-active a svg {
  fill: #fff;
}
.state-box {
  background-image: url(../images/hrcard-bg.png);
  background-size: cover;
  background-position: center;
}
#homechart {
    height:380px;
}
.akkk{
    padding:20px 10px !important;
}
.top-home-box .card-body {
  padding: 1rem;
}
.footer .copyright p {
  text-align: center;
  margin: 0;
  font-size: 18px;
}
.menu-toggle .footer{
    padding-left: 0 !important;
}
.beteel_banner img{
    width: 100%;
}
.breadcrumb li a {
  font-size: 14px;
}
.card-header .card-title {
  font-weight: 600;
  margin-bottom: 0;
}
.bootstrap-select .dropdown-menu.show {
  z-index: 99;
}
.filter-option-inner-inner {
  font-size: 15px;
}
.detl-select-btn {
  display: flex;
  align-content: center;
  gap: 20px;
}
.detl-select-btn label{
    cursor: pointer;
}
form .form-group label {
    color: #000;
    font-weight: 700;
    font-size: 18px;
}
.form-top-left .fa {
    font-size: 20px;
    margin-right: 5px;
}
table td, th {
    vertical-align: middle;
    font-size: 16px;
}
table td{
    border: 1px solid #eee !important;
}
.col-form-label{
color: #000;
  font-weight: 500;
}
.initasted {
  float: left;
  font-size: 15px;
  margin-right: 40px;
}
.table > thead > tr > th {
  /* background: #318534 ; */
  background: linear-gradient(179deg, rgb(241 147 17) 0%, rgb(37 113 41) 35%, rgb(242 142 6) 100%) ;
  color: #fff !important;
  padding: .85rem !Important;
  border: 1px solid #f4f4f4;
}
.table td:nth-child(2n+1) {
  background-color: #93ebff26 !important;
}
table.dataTable>thead>tr>th, table.dataTable>thead>tr>td{
    border-bottom: none !important;
}
.card-body {
  padding:15px 15px !important;
}
.boxx{
    border: 1px solid #dadada !important;
    padding: 10px;
}
.btn-boxes {
    text-align: center;
    margin-top: 30px;
}
.btn:focus{
    box-shadow: none;
}
.form-files .form-control {
    padding: 9px;
    padding-left: 15px;
}
.metismenu li ul li a:before {
    font-family: 'FontAwesome';
    position: absolute;
    left: 22px;
    font-size: 12px;
    top: 13px;
    content: "\f192";
}
.fa-calendar:before {
    content: "\f073";
    font-family: 'FontAwesome';
}
.apexcharts-tooltip-series-group {
    font-family: var(--bs-body-font-family) !important;
    font-weight: 700;
}
.apexcharts-tooltip-title {
    font-family: var(--bs-body-font-family) !important;
    font-weight: 600;
}
.metismenu li ul li {
    margin:4px 0;
}
.deznav .metismenu > li > ul a {
    padding-right: 0;
}
.authincation {
    padding-top: 40px;
    padding-bottom: 40px;
}

.authincation .container {
    margin-top: 0 !important;
}
.auth-form {
    position: relative;
    overflow: hidden;
    z-index: 1;
}
.space-com {
    border-bottom: 1px dashed #eee;
    margin: 20px 0;
}
.log-title {
    font-size: 24px !important;
}
.forr {
    color: #318534;
    font-weight: 500;
    font-size: 16px;
}
.login-logo img {
    height: 85px;
}
.form-control{
  font-size: 18px;
}
.auth-form .form-group {
    position: relative;
}
.lock-icon {
    font-size: 22px !important;
    position: relative;
    top: 2px;
    margin-right: 4px;
}
.log-title {
    font-size: 20px;
}
.over-icon {
    position: absolute;
    top: 10px;
    right: 12px;
    font-size: 20px !important;
}
.auth-form::before {
    content: "";
    height: 95%;
    width: 95%;
    background: transparent;
    position: absolute;
    top: 0px;
    bottom: 0;
    left: 0;
    border: 1px dashed #cbc9c9;
    margin-left: auto;
    margin-right: auto;
    right: 0;
    margin-top: auto;
    margin-bottom: auto;
    border-radius: 30px;
    z-index: -1;
    display: none;
}

.menu-toggle .deznav .metismenu > li.mm-active > a:after{
    display: none !important;
}
.text-header .card-title {
    text-align: center;
    margin-bottom: 20px !important;
}
.text-header b {
    font-weight: 500;
    font-size: 14px;
}
.password-textt p {
    line-height: 8px;
    font-size: 14px;
}
./*reportt .bootstrap-select .btn.dropdown-toggle.btn-light {
    display: none;
}*/
.bootstrap-select .btn-group {
    width: 100%;
}
.multiselect-container li:nth-child(2){
    display: none;
}
button.multiselect.dropdown-toggle.btn.btn-default {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

ul.multiselect-container.dropdown-menu li label {
    cursor: pointer;
    font-weight: 500;
    font-size: 14px;
}
ul.multiselect-container.dropdown-menu {
    padding: 15px;
    height: 195px;
    overflow-y: scroll;
}
ul.multiselect-container.dropdown-menu::-webkit-scrollbar {
    background: #eee;
    width: 8px;
    height: 10px;
    border-radius: 8px;
}
ul.multiselect-container.dropdown-menu::-webkit-scrollbar-thumb{
    background: #318534 ;
    border-radius: 8px;
}
.mb-3.form-group {
    margin-bottom:4px !important;
}
.col-form-label{
    padding-bottom:5px !important;
}
li.nav-item.dropdown.notification_dropdown {
    display: none;
}
.menu-toggle .deznav .metismenu{
    padding-left: 0;
}
.des-mrquue-box {
    background: #f5d8e2;
    padding:5px 4px;
    border-radius: 8px;
    margin-bottom: 20px;
    margin-top: -20px;
    display: flex;
    align-items: center;
    position: relative;
    z-index: 1;
}

.box-hd-flex {
    display: flex;
    align-items: center;
    column-gap:15px;
    justify-content: space-between;
}
.box-hd-flex span {
    position: relative;
    top: 2px;
    color: #000;
    font-size: 14px;
}
.card.state-box {
    margin-bottom:10px;
    height: auto;
}
.home-img{
    margin-right:10px;
}
text.highcharts-title{
    font-weight: 700 !important;
}
.my-box {
    position: relative;
    overflow: hidden;
    cursor: pointer;
}
body::-webkit-scrollbar {
    background: #eee;
    width: 10px;
}
body::-webkit-scrollbar-thumb {
    background: #3cad40;
}
.my-box:hover:before{
    background: #318534 ;
}
.my-box:hover:after{
    border-color: #318534 ;
}
.my-box:before{
    content: "";
    width: 70px;
    height: 70px;
    background-color: #e1e1e1;
    border: none;
    border-radius: 6px;
    position: absolute;
    bottom: 22px;
    right: -40px;
    z-index: 11;
    transform: rotate(50deg);
    transition: all 0.3s ease-in-out;
}
.my-box:after{
    content: "";
    width: 70px;
    height: 70px;
    border: 2px solid #e1e1e1;
    border-radius: 6px;
    position: absolute;
    right: -45px;
    bottom: -12px;
    z-index: 10;
    transform: rotate(50deg);
    transition: all 0.3s ease-in-out;
}
.password-textt.mt-2 {
    margin-top: 20px !important;
}
.new-btn {
    border-radius: 0 !important;
    padding: 0.25rem 0.5rem !important;
}
button:focus{
    box-shadow: none !important;
}
.new-btn:hover{
    background:#f54279;
}
button.btn.btn-primary {
    border-radius:0.75rem !important;
    padding: 5px 20px;
    font-size: 18px;
    font-weight: 600;
}
button.btn.btn-secondary {
    padding: 5px 20px;
    font-size: 18px;
    font-weight: 600;
    color: #fff;
}
button.btn.btn-secondary:hover{
    background-color: #f19311;
}
div#debug-icon {
    display: none !important;
}
.dataTables_wrapper .dataTables_info {
    font-size: 13px;
}
.dataTables_wrapper .dataTables_length{
    font-size: 13px;
}
.dataTables_filter{
    font-size: 13px;
}


/*===============07-12-2023 css start from here==================*/
.profiltb-box.card {
    overflow: hidden;
    height: ;
}
.profiltb-box ul li a {
    position: relative;
    display: block;
    padding: 10px 15px;
    margin-bottom: -1px;
    background-color: #fff;
    border-bottom: 1px dashed #ddd;
    border-top: 1px dashed #ddd;
    color: #323131;
}
.profiltb-box ul li a.active {
    background:var(--primary);
    color: #fff;
}
.profiltb-box ul li a:hover {
    background:var(--primary);
    color: #fff;
}
.profiltb-box ul li:first-child a{
    border-top:none;
}
.profiltb-box ul{
    display: block;
}
.profiltb-box ul li a i{
    margin-right:3px;
}
.tab-detail-content .card-header .card-title {
    font-size: 16px;
}
/*.dataTables_wrapper .dataTables_length{
    float: none !important;
}*/
.dt-buttons.btn-group .btn {
    background: var(--primary);
    font-size: 13px;
    border-color: #fff;
    padding: 8px 12px;
    border-radius: 5px;
}
.dt-buttons.btn-group.flex-wrap {
    margin-bottom: 10px;
}

.dataTables_filter{
    margin-top: 3px;
}


/*=====================*/
#homechart2 {
    height: 200px;
}   
#homechart3 {
    height: 200px;
}
.chart-titlee {
    background: var(--primary);
    color: #fff;
    padding: 8px;
    text-align: center;
    font-size: 17px;
    font-weight: 600;
    border-radius: 0.625rem;
    box-shadow: 0rem 0.3125rem 0.3125rem 0rem rgba(82, 63, 105, 0.05);
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}
#homechart4 {
    height: 340px;
}


.apexcharts-text {
    font-family: var(--bs-body-font-family) !important;
    font-weight: 600;
}
.apexcharts-legend-text {
    position: relative;
    font-size: 14px !important;
}
.apexcharts-legend-text{
    font-family: var(--bs-body-font-family) !important;
    font-weight: 600 !important;
}
.card {
    border: none !important;
    border-radius: 0!important;
}
.card-body {
    box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
}
[data-header-position="fixed"] .header{
    z-index: 99;
}
.nav-header {
    z-index: 999 !important;
}
.hgtt {
    min-height: auto !important;
}
.card-header {
    border-color: #f0f1f5;
    position: relative;
    background: #fff !important;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px dashed #dcdbdb !important;
    border-radius: 0 !important;
}
.form-control{
    background: #fff !important;
}
.table > :not(:first-child) {
    border-top: none !important;
}

.form-select:focus{
    box-shadow:none !important;
}
thead, tbody, tfoot, tr, td, th {
    border-style: none;
}
.dataTables_paginate {
    border: 1px solid #ddd;
    border-radius: 8px;
    margin-top: 10px;
}
.aktabl thead th{
    white-space: nowrap;
}
.aktabl tbody td{
    white-space: nowrap;
}
.table-responsive::-webkit-scrollbar-thumb {
    background: #318534;
    background-image: -webkit-linear-gradient(45deg, rgba(255,255,255,0.3) 25%, transparent 20%, transparent 50%, rgba(255,255,255,0.3) 50%, rgba(255,255,255,0.3) 75%, transparent 75%, transparent);
    border-radius: 10px;
}
.table-responsive::-webkit-scrollbar {
    background: #eee;
    width: 10px;
    height: 12px;
    border-radius: 10px;
}
.profilehead table td {
    border: 1px solid #eee;
}
.profilehead table th {
    border: 1px solid #eee;
}
li {
    font-size: 16px;
}
.profilehead .card-header .card-title {
    color: rgb(255 255 255 / 81%);
    font-size: 20px;
}
.modal-header .modal-title {
    color: #fff;
    font-weight: 700;
    font-size: 20px;
}
.modal-header button.close {
    background: transparent;
    border: none;
    color: #fff;
    font-size: 35px;
    position: absolute;
    right: 10px;
}
.modal-header {
    background: #318534;
    padding: 10px 15px;
}
.profilehead .card-header {
    padding: 5px 10px;
    background: linear-gradient(0deg, rgb(241 147 17) 0%, rgb(37 113 41) 35%, rgb(225 145 19) 100%) !important;
}
.table-responsive{
    padding-bottom: 10px;
}
.service-icon svg {
    stroke: none;
    height: 28px;
    width: 28px;
}
.service-icon span {
    border: 1px dashed;
    border-radius: 50%;
    width: 45px;
    display: inline-block;
    height: 45px;
    margin-top: 6px;
    line-height: 41px;
}
.nav-header {
    border-bottom: 1px solid #eeeeee3b;
    padding-bottom: 10px;
}
.actionbtn .btn {
    border: none;
    color: initial;
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.15), 0 2px 8px 0 rgba(0, 0, 0, 0.2) !important;
    padding: 0.25rem 0.5rem !important;
    border-radius: 4px;
    margin-right: 3px;
    background: #fff;
}
.piechart .apexcharts-text {
    font-family: var(--bs-body-font-family) !important;
    font-weight: 600;
    font-size: 16px;
    color: #ddd !important;
    fill: #000;
    text-shadow: none;
    stroke: none;
    white-space: nowrap !important;
}
.apexcharts-legend {
    padding: 0 0 !important;
}
.thick-slides .owl-nav .owl-prev i, .owl-next i {
    background-color: #fff;
    height: 30px;
    width: 45px;
    line-height: 30px;
    border-radius: 8px;
    font-size: 22px;
    border: 1px solid #ddd;
    color: #001d37;
    text-align: center;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}
.thick-slides .owl-nav .owl-prev i {
    margin-right: 5px;
}
.apexcharts-datalabel {
    fill: #000;
    font-size: 15px;
    font-weight: 800;
}

.thick-slides .owl-nav {
    position: absolute;
    top: -45px;
    right: -10px;
    z-index: 99999;
}
.body1{
    min-height: auto !important;
}
.stripp {
    height: 3px;
    background: #cdd5dc;
    position: relative;
    top: -18px;
    width: 91%;
}
.fa-envelope:before{
    font-family:"FontAwesome";
}
.fa-ban:before {
    font-family: "FontAwesome";
}
.alert button.close {
    position: absolute;
    right: 15px;
    background: #f23411;
    color: #fff;
    width: 20px;
    height: 20px;
    font-size: 20px;
    line-height: 18px;
    border: none;
    border-radius: 5px;
}
.alert {
    font-size: 18px;
}
.alert a {
    background: #30b634;
    color: #fff;
    padding: 2px 15px;
    border-radius: 6px;
    font-weight: 500;
    -webkit-animation: glowing 1500ms infinite;
    -moz-animation: glowing 1500ms infinite;
    -o-animation: glowing 1500ms infinite;
    animation: glowing 1500ms infinite;
}
@-webkit-keyframes glowing {
    0% { background-color: #30b634; -webkit-box-shadow: 0 0 3px #30b634; }
    50% { background-color: #30b634; -webkit-box-shadow: 0 0 10px #30b634; }
    100% { background-color: #30b634; -webkit-box-shadow: 0 0 3px #30b634; }
  }
  
  @-moz-keyframes glowing {
    0% { background-color: #30b634; -moz-box-shadow: 0 0 3px #30b634; }
    50% { background-color: #30b634; -moz-box-shadow: 0 0 10px #30b634; }
    100% { background-color: #30b634; -moz-box-shadow: 0 0 3px #30b634; }
  }
  
  @-o-keyframes glowing {
    0% { background-color: #30b634; box-shadow: 0 0 3px #30b634; }
    50% { background-color: #30b634; box-shadow: 0 0 10px #30b634; }
    100% { background-color: #30b634; box-shadow: 0 0 3px #30b634; }
  }
  
  @keyframes glowing {
    0% { background-color: #30b634; box-shadow: 0 0 3px #30b634; }
    50% { background-color: #30b634; box-shadow: 0 0 10px #30b634; }
    100% { background-color: #30b634; box-shadow: 0 0 3px #30b634; }
  }
  #info_alert_success {
    display: none;
    position: absolute;
    right: 45%;
    top: 5px;
    z-index: 1000000;
    opacity: 1;
}

#info_alert_fail {
    display: none;
    position: absolute;
    right: 45%;
    top: 5px;
    z-index: 1000000;
    opacity: 1;
}

#info_alert_delete {
    display: none;
    position: absolute;
    right: 45%;
    top: 5px;
    z-index: 1000000;
    opacity: 1;
}

#info_alert_update {
    display: none;
    position: absolute;
    right: 45%;
    top: 5px;
    z-index: 1000000;
    opacity: 1;
}

.alert-info {
    color: #f9f9fc;
    background-color: #bf6f2b;
    border-color: #bf6f2b;
    font-size: 16px;
}
.alert-danger {
    padding: 0px 7px !important;
    border: 0 !important;
}
.alert-dismissible {
    padding: 15px !important;
}
.dashboard_bar h2 {
    background: -webkit-linear-gradient(87deg, rgb(241 147 17) 0%, rgb(20 76 23) 35%, rgb(225 145 19) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 22px;
    font-weight: 700;
    letter-spacing: 0;
    margin-bottom: 0;
}
.table > thead > tr > th {
    white-space: nowrap;
}
span.mobile-heading {
    display: none;
}
.form-control::-webkit-input-placeholder {
    color: #939191 !important;
}
.tab-pane .btn-primary.active {
    background: #f29311;
    border-color: #f29311;
}
.header-info span {
    text-transform: capitalize;
}