
/*-----------------------------------------------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------------------------------------------*/
/*-----------new inputrt fieldset design start--------------*/
  fieldset.scheduler-border {
    margin: 0 0 1.5em 0 !important;
    -webkit-box-shadow:  0px 0px 0px 0px #000;
            box-shadow:  0px 0px 0px 0px #000;
    padding: 7px !important;
    border: 1px solid #817777 !important;
    border-radius: 5px !important;
}

legend.scheduler-border {
	border:none;
    font-weight: bold !important;
    text-align: left !important;
	font-size: 12px !important;
    margin: 0px;
    border-radius: 5px;
    padding-left: 4px;
    width: max-content;
}
/*-----------new inputrt fieldset design End--------------*/
/*-----------------------------------------------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------------------------------------------*/




/*-----------------------------------------------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------------------------------------------*/
/*--------------------------------- new css for new update design css Start ---------------------------------------------*/
/*-----------------------------------------------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------------------------------------------*/

.bg-light{
    background-color: #ffffff !important;
	padding: 0px !important;
}

.req{
	border-left:3.5px solid #df5b5b!important;
}

.add{
    color: var(--add-top-color);
	background-color: var(--add-top-bg-color);
    border-color: #b7b9bf;
	position:relative;
	padding:0px;
}

.shadow1 {
	background-color:var(--add-shadow1-bg-color) !important;
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23) !important;
}

.new-bg{
	background-color:#FFFFFF;
	padding-top:20px;
	padding-bottom:20px;
}

.new_left{
	position:absolute;
	float:left;
}

.new_right{
	position:relative;
	float:right;
}

.sr-main-content-padding, .wrapper {
   /* background: #f3f3f3 !important;*/
}

.sr-main-content-heading {
	font-size: 15px !important;
}

#avatar-upload {
    width: 40px !important;
    height: 40px !important;
}

.card-stats .card-header.card-header-icon i {
    font-size: 25px !important;
    line-height: 42px !important;
    width: 45px !important;
    height: 45px !important;
    text-align: center !important;
}

/*-----------------------------------------------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------------------------------------------*/
/*----------------------------------------- Button design is css Start --------------------------------------------------*/
/*-----------------------------------------------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------------------------------------------*/
/*--- Define all color using code ---*/
div.form-container_large form fieldset {
    margin: 0px !important;
    padding: 0px !important;
    border: none !important;
    margin-bottom: 0px !important;
    padding-bottom: 0px !important;
}

/*----------------------------------------------*/
/*-------- button all css or color -----------*/
/*----------------------------------------------*/
.btn1-bg-hrm{
    background-color: var(--btn-hrm-bg-color);
    color: var(--btn-text-color);
    border-color: var(--btn-hrm-bg-color);
}

.btn1-bg-hrm:hover{
    background-color: var(--btn-hover-hrm-color);
    color: var(--btn-text-color);
    border-color: var(--btn-hrm-bg-color);
}

.btn1-bg-update{
    background-color: var(--btn-bg-color-update);
    color: var(--btn-text-color);
    border-color: var(--btn-bg-color-update);
}

.btn1-bg-update:hover{
    background-color: var(--btn-hover-update-color);
    color: var(--btn-text-color);
    border-color: var(--btn-bg-color-update);
}

/*btn1 btn1-bg-submit btn1-bg-cancel btn1-bg-update*/
/*btn1 btn1-submit-input*/
.btn1-bg-submit{
    background-color: var(--btn-bg-color-submit);
    color:var(--btn-text-color);
    border-color: var(--btn-bg-color-submit);
}

.btn1-bg-submit:hover{
    background-color: var(--btn-hover-submit-color);
    color: var(--btn-text-color);
    border-color: var(--btn-bg-color-submit);
}

.btn1-bg-submit::before {
    /*font-family: "Font Awesome 5 Free";*/
    /*content: '\f06e';*/
    /*display: inline-block;*/
    /*padding-right: 3px;*/
    /*vertical-align: middle;*/
    /*font-weight: 900;*/
}

.btn1-bg-cancel{
    background-color: var(--btn-bg-color-cancel);
    color:var(--btn-text-color);
    border-color: var(--btn-bg-color-cancel);
}

.btn1-bg-cancel:hover{
    background-color: var(--btn-hover-cancel-color);
    color:var(--btn-text-color);
    border-color: var(--btn-bg-color-cancel);
}

.btn1-bg-cancel::before {
    /*font-family: "Font Awesome 5 Free";*/
    /*content: '\f0e2';*/
    /*display: inline-block;*/
    /*padding-right: 3px;*/
    /*vertical-align: middle;*/
    /*font-weight: 900;*/
}

.btn1-bg-help{
    background-color: var(--btn-bg-color-help);
    color:var(--btn-text-color);
    border-color: var(--btn-bg-color-help);
}

.btn1-bg-help:hover{
    background-color: var(--btn-hover-help-color);
    color:var(--btn-text-color);
    border-color: var(--btn-bg-color-help);
}

.btn1-submit-input{
    background-color: var(--btn-submit-input);
    font-size: 14px;
    color:var(--btn-text-color);
    border-color: var(--btn-submit-input);
    border-radius: 5px;
}

.btn1-submit-input:hover{
    background-color: var(--btn-hover-input-color);
    color:var(--btn-text-color);
    border-color: var(--btn-submit-input);
}

.btn1-bg-primary{
    background-color: var(--btn-bg-color-update);
    color: var(--btn-text-color);
    border-color: var(--btn-bg-color-update);
}

.btn1-bg-primary:hover{
    background-color: var(--btn-hover-color);
    color: var(--btn-text-color);
    border-color: var(--btn-bg-color-update);
}

.btn1-bg-yellow{
    background-color: var(--btn-bg-color-help);
    color: var(---btn-text-color1);
    border-color: var(--btn-bg-color-help);
}

.btn1-bg-yellow:hover{
    background-color: var(--btn-hover-color);
    color: var(--btn-text-color1);
    border-color: var(--btn-bg-color-help);
}

/*-------- Btn customis css start -----*/
.btn1{
    display: inline-block;
    font-weight: 400;
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    border: 1px solid transparent;
    line-height: 1.5;
    padding: 0.25rem 0.5rem;
    font-size: .875rem;
    border-radius: 0.2rem;
    margin: 1px;
    min-width: 100px!important;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;

}



.btn2{
    display: inline-block;
    font-weight: 400;
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    border: 1px solid transparent;
    line-height: 1.5;
    padding: 0.25rem 0.5rem;
    font-size: .875rem;
    border-radius: 0.2rem;
    margin: 1px;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}


.input-btn-submit{
    width: 50%;
    margin-left: 25%;
    margin-right: 25%;
    border-radius: 5px;
}

/*---------------------------------------------------*/
/*------ background color css or text color ---------*/
/*---------------------------------------------------*/
.bgc-primary{
    background-color: var(--bgc-color-primary);
    color: var(--bgc-text-color);
}

.bgc-info{
    background-color: var(--bgc-color-info);
    color: var(--bgc-text-color);
}

.bgc-success{
    background-color: var(--bgc-color-success);
    color:var(--bgc-text-color);
}

.bgc-yellow{
    background-color: var(--bgc-color-yellow);
    color: var(--bgc-text-color1);
}

.bgc-danger{
    background-color: var(--bgc-color-danger);
    color:var(--bgc-text-color);
}

.bgc-violate{
    background-color: var(--bgc-color-violet);
    color:var(--bgc-text-color);
}

.bgc-light-green{
    background-color: var(--bgc-color-light-green)!important;
    color:var(--bgc-text-color)!important;
}

.bgc-yello1{
    background-color: var(--bgc-color-yellow1);
    color: var(--bgc-text-color1);
}

/*btn btn-bg-success btn-bg-danger btn-bg-info*/
/*-----------------------------------------------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------------------------------------------*/
/*------------------------------------------- Menu design is css Start --------------------------------------------------*/
/*-----------------------------------------------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------------------------------------------*/


/*new font siz*/
.fs-8{font-size:8px !important;}.fs-9{font-size:9px !important;}.fs-10{font-size:10px !important;}.fs-11{font-size:11px !important;}.fs-12{font-size:12px !important;}.fs-13{font-size:13px !important;} .fs-14{font-size:14px !important;}  .fs-15{font-size:15px !important;}  .fs-16{font-size:16px !important;}  .fs-17{font-size:17px !important;}  .fs-18{font-size:18px !important;}  .fs-19{font-size:19px !important;}  .fs-20{font-size:20px !important;} .fs-21{font-size:21px !important;}.fs-22{font-size:22px !important;}
  /*end font siz*/



body{
    overflow-x: hidden;
	background-color: #f5f5f5 !important;
    color: #3C4858 !important;
    font-weight: 300 !important;
	line-height: 1.5em !important;
	margin: 0 !important;
}

.form-container_large {
	padding:0px !important;
}

.round{
    border-radius: 5px !important;
}
.shadowdiv {
    background-color: var(--add-shadow1-bg-color)!important;
    box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.16), 0px 0px 0px rgba(0, 0, 0, 0.23)!important;
}
.sidebar {
    background: #F5F5F2 !important;
    position: fixed;
	box-shadow: 0 0px 11px 0px rgba(0, 0, 0, 0.12), 0 0px 5px 1px rgba(0, 0, 0, 0.15) !important;
}
.sr-main-content, .wrapper {
   /* background-color: #f5f5f5 !important;*/
	background-color: #f9fafc !important;
}
.sr-main-content-padding {
   /* background: #f5f5f5 !important;*/
	background:#f9fafc !important;
    padding: 5px 15px !important;
    border: 1px solid #f5f5f5 !important;
    border-bottom: none !important;
}

.row{
margin:0px !important;
}

.main_content .navbar-fixed-top {
    box-shadow: 0 0px 11px 0px rgba(0, 0, 0, 0.12), 0 0px 5px 1px rgba(0, 0, 0, 0.15) !important;
}

#clock .date{
	font-size:16px;
}

*, *::before, *::after {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.theme_color_bg{
    background-color: var(--nav-item-hover-bg);
}

.theme_color{
	font-size:15px !important;
    color: var(--nav-item-hover-bg);
}

.company_name{
font-size:12px !important;
font-weight:500 !important;
}


.menu_bg{
    display:block;
    height: auto;
    min-height: 100%;
    padding: 0;
    vertical-align: top;
    transition: width 0.3s ease;
    border-top: 1px solid var(--nav-border);
}

.menu_bg {
    background-color: var(--menu-bg-color);
    padding-bottom: 100px !important;
    margin-top: 5px !important;
}

.mhafuz11 a{
    border-left:5px solid var(--menu-bg-red);
    border-right: 5px solid var(--menu-bg-red);
}

.mhafuz22 a{
    border-left:5px solid var(--menu-bg-green);
    border-right: 5px solid var(--menu-bg-green);
}

.mhafuz33 a{
    border-left:5px solid var(--menu-bg-deepskyblu);
    border-right: 5px solid var(--menu-bg-deepskyblu);
}

.mhafuz44 a{
    border-left:5px solid var(--menu-bg-purple);
    border-right: 5px solid var(--menu-bg-purple);
}

.mhafuz55 a{
    border-left:5px solid var(--menu-bg-orange);
    border-right: 5px solid var(--menu-bg-orange);
}

.module-title{
    background-color:var(--module-titel);
    color:var(--module-color);
    width: 100%;
    text-align:left;
    font-size:14px !important;
    margin:0px;
    padding: 5px 0px 10px 7px;
    font-weight: 700;
}

.sidebar ,.title-image{
    background-color: var(--bg-color)!important;
}

.title-image{
    text-align: center;
    margin: 0px !important;
    padding: 0px !important;
}

.h_titel{
	font-weight:bold;
	font-size:16px;
	background-color: var(--theme-color-bgc);
	z-index: 0!important;
	text-transform:uppercase;
	color:#fff;
	padding: 10px 0px 10px 0px;
}

.menu-module-titel{
    background-color:var(--module-titel);
    color:var(--module-color);
    padding:10px;
    text-align:center;
    margin-bottom: 1px;
    margin-top: 1px;
}

.menu-module-titel a{
    color:var(--white-normal0)!important;
}

.dashboard1-app {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-flex: 2;
    -webkit-flex-grow: 2;
    -ms-flex-positive: 2;
    flex-grow: 2;
    margin-top: 84px;
}

.dashboard1-content {
    -webkit-box-flex: 2;
    -webkit-flex-grow: 2;
    -ms-flex-positive: 2;
    flex-grow: 2;
    padding: 25px;
}

.dashboard1-nav-list {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
}

.dashboard1-nav-item {
    min-height: 35px;
    font-size: 14px;
    padding: 13px 10px 10px 50px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    letter-spacing: 0.02em;
    transition: ease-out 0.5s;
    background-color: var(--nav-item-bg);
    color: var(--white-1);
    cursor: pointer;
    border-bottom: 1px solid var(--nav-border);
}

.dashboard1-nav-item i {
    width: 18px;
    font-size: 14px;
    margin-left: -40px;
    /*color: #979494;*/
    /*color: var(--theme-color-bgc);*/
}
.dashboard1-nav-item:hover {
    background-color: var(--nav-item-hover-bg);
    color: var(--color-item-hover) !important;
    font-weight: 500;
}

.dashboard1-nav-item .dashboard1-nav-dropdown-toggle{
    font-size: 14px;
}

.active1 {
background-color: var(--active-bg)!important;
color: var(--white-normal)!important;
font-weight: 400;
}

.dashboard1-nav-dropdown .dashboard1-nav-item{
    line-height: 17px;
    padding-top: 15px;
    padding-bottom: 15px;
    text-align: left;
}

.dashboard1-nav-dropdown {
    color: var(--white-1);
    background: var( --item-main-bg-color);
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
}

.dashboard1-nav-dropdown .show{
    transition:all 0.3s ease-in-out;
}

.dashboard1-nav-dropdown.show .dashboard1-nav-item {
    background-color: var(--nav-item-hover-bg);
    color: var(--color-item-hover) !important;
    font-weight: 500;
    text-shadow: rgb(0 0 0 / 25%) 0 -1px 0;
    box-shadow: rgb(0 0 0 / 25%) 0 1px 0, inset rgb(255 255 255 / 16%) 0 1px 0;
}

.dashboard1-nav-dropdown.show > .dashboard1-nav-dropdown-toggle:after {
    transform: rotate(135deg);
}

.dashboard1-nav-dropdown.show > .dashboard1-nav-dropdown-menu {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    transition:all 0.3s ease-in-out;
}

.dashboard1-nav-dropdown-toggle:after {
    border-style: solid;
    border-width: 0.20em 0.20em 0 0;
    content: '';
    display: inline-block;
	height: 7px;
    width: 7px;
    left: 0.15em;
    position: relative;
    vertical-align: top;
    top: 0;
    transform:rotate(222deg);
    margin-left: auto;
}

.dashboard1-nav-dropdown-menu {
    display: none;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
}

.dashboard1-nav-dropdown-item {
    min-height: 40px;
    padding: 8px 20px 8px 15px;
    font-size: 13px;
    line-height: 14px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: left;
    transition: ease-out 0.5s;
    font-weight: 600;
    color: var(--sub-text);
    background-color: var(--dropdown-item);
    border-bottom: 1px solid var(--nav-border);
}

.dashboard1-nav-dropdown-item:hover {
    background-color: var(--nav-item-dropdown)!important;
    color: var(--nav-item-hover-bg) !important;
}

.dashboard1-nav-dropdown-item:before{
    font-family: "Font Awesome 5 Free";
    content: "\f111";
    display: inline-block;
    padding-right: 5px;
    vertical-align: middle;
    color: var(--nav-item-hover-bg);
    font-size: 9px;
}

.sidebar footer{
    background-color:var(--nav-item-hover-bg);
    bottom: 0px;
    border-radius: 0px;
}

.ul1 .li1:hover .li1 .menu-moule-icon i{
    color: var(--theme-color-bgc);
}

.menu-moule-icon{
    background-color:var(--nav-item-hover-bg);
    border-radius: 0px;
}

.sidebar footer i,.menu-moule-icon i{
    background-color: var(--nav-item-bg);
    color: var(--theme-color-bgc)!important;
    width: 22px;
	font-size: 14px;
	padding-top: 5px;
    border-radius: 5px;
    font-weight: 800;
    height: 25px;
    margin-bottom: 4px;
}

.exit{
    font-weight: 700;
}

.sidebar footer a{
    color: var(--white-normal);
    font-size: 14px;
    padding-right: 15px;
}

@media (max-width: 991px){
    .navbar-header {
        float: none;
        margin-left: 15%!important;
    }

    .sidebar footer{
        position: relative;
        bottom: 0px;
        border-radius: 0px;
        width: 100%;
    }

   .menu_bg {
        padding-bottom: 32px;
    }
}

@media (min-width: 1200px) {
    .dashboard1-nav-item{
        font-size: 13px;
        font-weight: 500;
    }
    .dashboard1-nav-dropdown-item{
        font-size: 12px;
    }
}

/*-------------------------------------------*/
/*------new menu left design start-----------*/
/*--------------------------------------------*/
 .right1{
 	overflow:hidden !important;
}
.sidemenu-top{
 	position:relative !important;
}
.menu_bg{
	overflow-x: scroll;
	position: relative;
	height: 100%;
}
		 
/* Custom Scrollbar (for WebKit browsers) */
.menu_bg::-webkit-scrollbar {
	width: 0px; /* Width of the scrollbar */
}

.left1{
     width: 50px;
     float: left;
     top: 0;
     height: 100%;
     position: fixed;
     overflow: hidden;
	 z-index: 1000!important;
}

.left1 a{
    text-align: center;
    padding: 5px;
    line-height: 2.5em !important;
}

.left1 a i{
    color: #FFFFFF;
}

.right1{
    width: 84%;
    float: right;
    top: 0px;
    height: 100%;
    z-index: 999 !important;
    background-color: white;
}
.li1{
	display: flex;
    justify-content: center;
}
.li1 a{
	line-height: 0.0em !important;
    padding: 0px;
}
.li1 .menu-moule-icon{
	line-height: 0.0em !important;
    padding: 0px;
}

.ul1{
    list-style: none;
    margin: 0;
    padding: 0;
	margin-top: 40px;
}

.active-icon{
    background-color: #fff;
    margin-left: 5px;
    border-top-left-radius: 65px;
    border-bottom-left-radius: 65px;
}

.active-icon a{
    padding: 10px;
}
.active-icon a i{
    color: var(--theme-color-bgc);
}

.ul1 .li1:hover{
    border-top-left-radius: 100px;
    border-bottom-left-radius: 100px;
}

.ul1 .li1:hover a i, .ul1 .li1:hover .menu-moule-icon i, .ul1 .li1:hover .li2{
    color: var(--theme-color-bgc);
    background-color: #8fe5ff;
}

.li2, .ul2{
    margin: 0;
    padding: 0;
    list-style: none;
}

.ul1 .li1:hover .ul2 {
   display: inline-block;
   min-width: 200px;
}

.ul2{
    position: fixed;
    display: none;
    /*margin-left: -5px;*/
	margin-left: 220px;
    width:0px;
    text-align: left;
}

.li2{
    position: relative;
    background-color: var(--theme-color-bgc);
    color: #FFFFFF;
    font-weight: 500;
    padding-top: 2px;
    padding-left: 10px;
    padding-bottom: 2px;
    padding-right: 2px;
    -webkit-transition: all 0.4s cubic-bezier(.5, .24, 0, 1);
    transition: all 0.4s cubic-bezier(.5, .24, 0, 1)
    border-radius: 0px 5px 5px 0px;
    height: 25px;
	left: -2px;
}

@media only screen and (min-width: 1100px){
    .left1{
        width: 32px;
    }
    .left1 a{
        font-size: 15px !important;
        font-weight: bold;
    }
    .right1{
        width: 84%;
    }
}

@media only screen and (min-width: 1200px){
    .left1{
        width: 35px;
    }
    .left1 a{
        font-size: 15px !important;
        font-weight: bold;
    }

    .right1{
        width: 84%;
    }
}

@media only screen and (min-width: 1300px){
    .left1{
        width: 40px;
    }

    .left1 a{
        font-size: 15px !important;
        font-weight: bold;
    }

   .right1{
        width: 84%;
    }
}

@media only screen and (min-width: 1500px){
    .left1{
        width: 42px;
    }
    .left1.active{
        width: 42px !important;
    }
    .left1 a{
        font-size: 15px !important;
        font-weight: bold;
    }
    .right1{
        width: 84%;
    }
}

@media only screen and (min-width: 1600px){
    .left1.active {
        width: 45px !important;
    }
    .left1{
        width: 45px;
    }
    .left1 a{
        font-size: 20px;
    }

    .right1{
        width: 84%;
    }

   .left1 .ul1 .li1 b:nth-child(1){
        top: 35px !important;
        height: 14px !important;
        width: 100% !important;
    }

   .left1 .ul1 .li1 b:nth-child(1)::before{
        content: '';
        width: 88% !important;
        height: 100% !important;
    }

   .left1 .ul1 .li1 b:nth-child(2){
       top: 85px !important;
       height: 14px !important;
       width: 100% !important;
    }

   .left1 .ul1 .li1 b:nth-child(2)::before{
        content: '';
        width: 88% !important;
        height: 100% !important;
    }
}

@media only screen and (min-width: 1700px){
    .left1.active {
        width: 47px !important;
    }
    .left1{
        width: 46px;
    }
    .left1 a{
        font-size: 20px;
    }
    .right1{
        width: 84%;
    }

   .left1 .ul1 .li1 b:nth-child(1){
       top: 35px !important;
       height: 14px !important;
       width: 100% !important;
    }

    .left1 .ul1 .li1 b:nth-child(1)::before{
        content: '';
        width: 89% !important;
        height: 100% !important;
    }

   .left1 .ul1 .li1 b:nth-child(2){
        top: 85px !important;
        height: 14px !important;
        width: 100% !important;
    }

    .left1 .ul1 .li1 b:nth-child(2)::before{
        content: '';
        width: 89% !important;
        height: 100% !important;
    }
}

@media only screen and (min-width: 1800px){
    .left1.active {
        width: 50px !important;
    }
    .left1{
        width: 49px;
    }
    .left1 a{
        font-size: 20px;
    }
    .right1{
        width: 84%;
    }
    .left1 .ul1 .li1 b:nth-child(1){
        top: 35px !important;
        height: 14px !important;
        width: 100% !important;
    }
    .left1 .ul1 .li1 b:nth-child(1)::before{
        content: '';
        width: 89% !important;
        height: 100% !important;
    }
    .left1 .ul1 .li1 b:nth-child(2){
        top: 85px !important;
        height: 14px !important;
        width: 100% !important;
    }
    .left1 .ul1 .li1 b:nth-child(2)::before{
        content: '';
        width: 89% !important;
        height: 100% !important;
    }
}

.left1 .ul1 .li1 b:nth-child(1){
    position: absolute;
	top: 35px;
    height: 14px;
    width: 100%;
    background-color: #FFFFFF;
    display: none;
	margin-left: 5px;
}

.left1 .ul1 .li1 b:nth-child(1)::before{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 87%;
    height: 100%;
    border-bottom-right-radius: 10px;
    background-color: var(--theme-color-bgc);
	
}

.left1 .ul1 .li1 b:nth-child(2){
    position: absolute;
	top: 83px;
    height: 14px;
    width: 100%;
    background-color: #FFFFFF;
    display: none;
	margin-left: 5px;
}

.left1 .ul1 .li1 b:nth-child(2)::before{
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 87%;
    height: 100%;
    border-top-right-radius: 10px;
    background-color: var(--theme-color-bgc);
}

.left1 .ul1 .active-icon b:nth-child(1),
.left1 .ul1 .active-icon b:nth-child(2){
    display: block;
}

/*-----------------------------------------------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------------------------------------------*/
/*------------------------------ Top menu bar icon design is css Start --------------------------------------------------*/
/*-----------------------------------------------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------------------------------------------*/
/*Side Menu hide and open css and js start*/
    .sidemenu {
        position: fixed;
        top: 15px;
        height: 30px;
        width: 30px;
        background-color: var(--theme-color-bgc);
        color: #FFFFFF;
        border-radius: 0px 16px 16px 0px;
        cursor: pointer;
        display: flex;
        justify-content: center;
        align-items: center;
		z-index: 1;
    }

.sidemenu.active{
    background-color: #cfcfcf;
}
.sidemenu i{
    position: absolute;
    color: #FFFFFF;
	font-size: 20px;
    display: none;
}

.sidemenu i.close1{
    margin-left: 2px;
    color: var(--theme-color-bgc);
}
.sidemenu i.open,
.sidemenu.active i.close1{
    display: block;
}
.sidemenu i.close1,
.sidemenu.active i.open{
    display: none;
}
.sidebar.active{
    width: 0%!important;
}
.main_content.active{
    width: 97% !important;
}

.left1.active{
    width: 40px;
}

@media (max-width: 991px){
    .sidemenu{
        height: 0px;
    }
    .notificationblock{
        right: 10px !important;
    }
    .navbar.navbar-absolute{
        width: 40% !important;
    }
	.sr-main-content-heading{
		padding:5px !important;
	}
	
	.sr-main-content-padding{
		padding:0px !important;
	}
}

.circle {
    border-radius: 50%;
    border: 2px var(--theme-color-bgc) solid;
    overflow: hidden
}

.userblock {
    height: 100%;
    width: auto;
    right: 270px !important; 
    position: absolute;
    font-size: 12px;
    font-size: 1.2rem;
}

.notificationblock {
    height: 100%;
    top: 0;
    width: auto;
    background-color: transparent;
    z-index: auto;
    right: 150px;
    position: absolute;
    display: inline-block;
}

.notificationblock a{
	font-size:19px  !important ;
    padding: 5px;
    display: block;
    float: left;
    position: relative;
    background-color: whitesmoke;
	margin-top: 20%;
    border-radius: 5px;
    margin-left: 3px;
    margin-right: 3px;
	width: 29px;
    border: 1px solid #ddd;
	overflow: hidden !important;
	height: 34px;
}

.notificationblock i {
    color: var(--logout-bg-red);
}

.notificationblock .bell-massage i {
    color: var(--theme-color-bgc);
}

.notificationblock a:hover i,.notificationblock a:hover {
    color: #ffffff;
    background-color: var(--logout-bg-red);
    border-radius: 5px;
}

.notificationblock .bell-massage:hover i,.notificationblock .bell-massage:hover {
    color: #ffffff;
    background-color: var(--theme-color-bgc);
    border-radius: 5px;
}

/*-----------------------------------------------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------------------------------------------*/
/*------------------------------------------- Table design is css Start --------------------------------------------------*/
/*-----------------------------------------------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------------------------------------------*/


.table1 {
    width: 100%;
    overflow:auto;
	zoom: 95% !important;
}

.thead1, .tbody tr {
    width:100%;
    table-layout:fixed;
}
.thead1{
    position: sticky;
    top: 0px;
}

.table1 .btn1{
    line-height: 1 !important;
}

#table_head thead .bgc-info,.thead1 .bgc-info, .tabledesign2 th,
.thead1 .bgc-success, #grp thead tr, table thead tr{
    background-color: var(--table-bg-color) !important;
    color: var(--table-color)!important;
	white-space: nowrap;
}

#activities .table1{
    width: 100%;
}

.thead1 tr:hover,#table_head tr:hover,.tbody1 tr:hover,#grp tr:hover,.dataTable tr:hover {
    background-color: var(--table-hover-bg-color) !important;
	color:#333333 !important;
}

/*datatable even and odd change start*/
table.dataTable.display tbody tr.odd>.sorting_1, table.dataTable.order-column.stripe tbody tr.odd>.sorting_1 {
    background-color: var(--child-odd-color) !important;
    color: var(--child-text-color) !important;
}

table.dataTable.display tbody tr.even>.sorting_1, table.dataTable.order-column.stripe tbody tr.even>.sorting_1{
    background-color: var(--child-even-color)!important;
}

/*datatable even and odd change end*/
tr:nth-child(odd){
    background-color: var(--child-odd-color) !important;
    color: var(--child-text-color) !important;
}

tr:nth-child(even){
    background-color: var(--child-even-color)!important;
}

/*---------- Date type design ----------*/
.ui-datepicker-calendar tr{
    background-color: #f8ffc0 !important;
}

.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight{
    border: 1px solid #5c1074 !important;
    background: #be13c9 !important;
    color: #ffffff !important;
    font-weight: bold !important;
}

/*---------------------- end -----------------*/
@media only screen and (max-width: 991px){
    .table1 {
        display:block;
        max-height:500px;
        max-width: fit-content;
        width: 100%;
        overflow:auto;
    }
    .table1,.thead1,.tbody1{
        font-size: 12px !important;
    }
}

.dataTables_wrapper .dataTables_paginate .paginate_button{
    padding: 0px !important;
}

.dataTables_info{
    font-size: 12px !important;
}

.dataTables_length label, .dataTables_filter label{
	font-size: 12px !important;
    width: 100% !important;
    margin: 0px !important;
    margin-bottom: 5px !important;
}

.dataTables_filter label input::placeholder {
    color: var(--table-bg-color) !important;
	font-size:12px !important;
    opacity: 1; /* Ensures full visibility in some browsers */
}

.dataTables_length label select, .dataTables_filter label input{
	height:30px !important;
}
.paginate_button a{
	height:30px !important;
	font-size: 10px !important;
}

.dataTables_wrapper div{
	padding:0px !important;
}

table ,table tr th, table tr td{
	border-collapse: collapse !important;
}

.dataTables_wrapper table{
	border: 1px solid var(--table-bg-color) !important;
}

.dataTables_wrapper table thead tr{
	background-color: var(--table-bg-color) !important;
    color: var(--table-color) !important;
    white-space: nowrap;
}

.pagination, .dataTables_info{
    margin: 0px !important;
    margin-top: 5px !important;
}

.page-link{
    background-color: #fcfcfc !important;
    border: 1px solid #dee2e6 !important;
}

.page-item.active .page-link{
    z-index: 1;
    color: #ffffff !important;
    background-color: #2196f3 !important;
    border: 1px solid #2196f3 !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover,
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled:active{
    color: #000 !important;
    cursor: pointer !important;
    background-color: #0be3ff !important
	box-shadow: none;
}

.paginate_button a:hover{
    color: #000!important;
    font-weight: bold!important;
}

.paginate_button a:active{
    color: #000!important;
    font-weight: bold!important;
}

/*-----------------------------------------------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------------------------------------------*/
/*------------------------------------------- Form design is css Start --------------------------------------------------*/
/*-----------------------------------------------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------------------------------------------*/
.re-titel{
    font-weight: bolder;
}

.n-form-titel1{
    background-color: var(--form-info);
    color: var(--form-white);
    padding-top: 5px;
    padding-bottom: 5px;
    border-radius: 5px 5px 0px 0px;
}

.setup-fixed{
	position: sticky !important;
	top: 0 !important;
	z-index: 100 !important;
}

.n-form{
    background-color: var(--white-smoke);
    padding-bottom: 10px;
    border-radius: 5px;
    border: 1px solid rgba(0, 0, 0, 0.125) !important;
}

.n-form1{
    background-color: var(--white-smoke);
    padding-top: 10px;
    padding-bottom: 10px;
    border-radius: 5px;
    border: 1px solid rgba(0, 0, 0, 0.125) !important;
	
}

.n-form2{
    background-color: var(--white-smoke);
    padding-top: 10px;
    padding-bottom: 10px;
    border: 0px solid rgba(0, 0, 0, 0.125) !important;
	padding: 0px !important;
}

.n-form-btn-class{
    text-align: center;
    padding-top: 10px;
    padding-bottom: 10px;
}

.req-input::after{
    content: '\*';
    color: var(--req-input-after);
}

.fo-width{
    min-width: 850px !important;
}

.fo-width1{
    min-width: 650px !important;
}

.fo-short{
    min-width: 500px !important;
}

.bg-form-titel{
    background-color: var(--form-titel-bg-color);
    padding-top: 20px;
    padding-bottom: 20px;
    box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.16), 0px 0px 0px rgba(0, 0, 0, 0.23) !important;
	border-radius: 5px !important;
}

.bg-form-titel-text{
    font-size: 15px;
    font-weight: bold;
}

.bold{
    font-weight: bold;
}

.form-tabel-bg-color-info{
    background-color: var(--form-tabel-bg-color-info);
    color: var(--white);
}

.bg-titel{
    background-color: var(--bgc-sallmon);
    color: var(--black);
}

.bg-table1{
    background-color: var(--bgc-sallmon1);
    color: var(--black);
}

.menusearch{
	border: 1px solid  var(--theme-color-bgc) !important; 
	border-left: 1px solid var(--theme-color-bgc) !important;
	padding-left: 5px !important;
}

.menusearch::placeholder {
	color: #b5b5b5 !important;  
}

.menusearch-span i{
	color: var(--theme-color-bgc) !important; 
}

input[type=search]{
    margin: 0px !important;
    width: 100% !important;
    background-color: var(--form-white) !important;
    border: 1px solid #9fb2c5 !important;
    outline: none !important;
    border-radius: 5px !important;
}

input[type=text],input[type=password],select,input[type=date]{
    margin: 0px !important;
    width: 100% !important;
    background-color: var(--form-white) !important;
    border: 1px solid #e5e3e3 !important;
	border-radius: 4px !important;
    outline: none!important;
}

.req{
	border-left:3.5px solid #df5b5b!important;
}

.req1{
	border-left:3.5px solid #3fa31f!important;
}

input[type=submit],input[type=button]{
    min-width: 100px!important;
    outline: none!important;
}

input[type=date]{
    margin: 0px !important;
    width: 100% !important;
    background-color: var(--form-white) !important;
    outline: none!important;
}

input[type=file]{
    margin: 0px !important;
    width: 100% !important;
    cursor: pointer  !important;
    outline: none!important;
	padding: 3px !important;
    position: unset !important;
    opacity: unset !important;
	border: 1px solid #ced4da !important;
    border-radius: 4px !important;

}

input[type=number]{
    margin: 0px !important;
    width: 100% !important;
    background-color: var(--form-white) !important;
    outline: none!important;
}

textarea{
    width: 100% !important;
    border: 1px solid #E0E0E0 !important;
    background-color: var(--form-white)!important;
    height: auto !important;
    resize: both!important;
    line-height: 1.428571 !important;
    outline: none!important;
	border: 1px solid #ced4da !important;
    border-radius: 4px !important;

}

input[type=file]:focus,
input[type=text]:focus,
input[type=submit]:focus,
input[type=date]:focus,
input[type=password]:focus,
select:focus, textarea:focus{
    border: 1px solid #dee2e6!important;
}

input[type=date],input[type=password],input[type=text],input[type=file],input[type=number],input[type=search],textarea,select{
	background-image: none !important;
	height: 30px !important;
}

/*input[type=date],input[type=text],input[type=file],input[type=number],textarea,select{
	border-left: 3.5px solid #3fa31f !important;
}

input[type=date]:required ,input[type=text]:required ,input[type=file]:required ,input[type=number]:required,textarea:required ,select:required{
    border-left: 3.5px solid #df5b5b !important;
}*/

.vendor_info_img img{
    width: 100%;
    height:155px;
}

.vendor_label_text{
    font-size: 12px !important;
    font-weight: bold;
}

.custom-combobox-input{
    margin: 0px !important;
    padding: 0px !important;
    width:92%!important;
    background: var(--form-white) !important;
}

.custom-combobox-toggle{
    background-color: #efefef !important;
}

.font-size12{
    font-size: 12px !important;
}

.font-size13{
    font-size: 13px !important;
}

.font-size14{
    font-size: 14px !important;
}

.font-size15{
    font-size: 15px !important;
}

@media only screen and (max-width: 991px){
    .form-group .justify-content-end{
        justify-content: flex-start!important;
    }

    .fo-width{
        min-width: 100% !important;
    }

    .fo-width1{
        min-width: 100% !important;
    }
    .fo-short{
        min-width: 100% !important;
    }
}

/*-----------------------------------------------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------------------------------------------*/
/*---------------------------------------- Dashboard design is css Start ------------------------------------------------*/
/*-----------------------------------------------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------------------------------------------*/
/*.card {
    border: 0 !important;
    margin-bottom: 10px !important;
    margin-top: 0px !important;
    border-radius: 6px !important;
    color: #333333 !important;
    background: #fff !important;
    width: 100% !important;
    box-shadow: 0 2px 2px 0 rgb(0 0 0 / 14%), 0 3px 1px -2px rgb(0 0 0 / 20%), 0 1px 5px 0 rgb(0 0 0 / 12%) !important;
}*/
.card .card-header{
    border-bottom: none !important;

}
.card .card-body{
padding-top:0px !important;
}
.card .card-body .dataTables_wrapper,.card .dataTables_wrapper{
	overflow:hidden !important;
	overflow-x: auto !important;
	zoom: 80% !important;
}
#localsales7day,#possales7day,#sales7day,#salesReturn,
#inventoryValue,#presentStock,#grnValue,#invoiceValue{
   font-size: 17px;
   font-weight: bold;
}
#onemounth{
    height: 268px;
}
@media(max-width: 1200px) {
    #onemounth{
        height: 212px;
    }
}

@media(max-width: 1400px) {
    #onemounth{
        height: 212px;
    }
}

@media(max-width: 1500px) {
    #onemounth{
        height: 357px;
    }
}

/*-----------------------------------------------------------------------------------------------------------------------*/
/*------------------------------------------- New Clock design is css Start ---------------------------------------------*/
/*-----------------------------------------------------------------------------------------------------------------------*/
                       .today-clock div{
							margin: 0px !important;
							padding:0px !important;
						}
						
						.today-clock {
							display: block;
							font-family: 'Share Tech Mono', monospace;
							color: #000000 !important;
							text-align: center;
							right: 10px !important;
							line-height: 1;
							position: absolute;
						}

                        .today-clock #now_time {
                            font-size: 28px;
                            padding: 1px 0;
                            font-weight:800;
                        }

                        .today-clock #today_date{
                            font-size: 9px !important;
                        }

                        .today-clock .text {
                            font-size: 12px;
                            padding: 1px 0;
                        }

                        .today-clock span{
                            display: block;
                        }

/*-----------------------------------------------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------------------------------------------*/
/*------------------------------------------- Clock design is css Start --------------------------------------------------*/
/*-----------------------------------------------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------------------------------------------*/
#clock span{
    display: block;
}

#clock{
    display:block;
    line-height: 1;
    justify-content: center;
    right:12px!important;
    width: 150px !important;
    position: absolute !important;
    color: var(--theme-color-bgc) !important;
}

.time,.date,.text{
    font-family: 'Zen Dots', cursive !important;
}

.text,.date{
    font-size: 8px !important;
    color: #3e4a5a;
}

.date{
    overflow: hidden!important;
    margin-top: 2px !important;
    margin-bottom: 2px !important;
    margin-left: 1px;
}

.time{
	overflow: hidden!important;
    position: absolute !important;
    font-size: 13px !important;
    font-weight: 800;
    margin-left: 28px;
    margin-top: 2px;
}

.text{
    overflow: hidden!important;
    margin-top: 22px !important;
}

@media only screen and (max-width: 700px) {
    #clock, .today-clock /*.navbar-toggler*/{
        display: none!important;
    }
}

@media only screen and (max-width: 820px) {
    #clock{
        display: none!important;
    }
}

@media only screen and (max-width: 991px) {
    #clock{
        display: none!important;
    }
}

/* Styles for custom combobox toggle */
.custom-combobox-toggle {
    position: relative;
    display: inline-block;
    cursor: pointer;
    background-color: #d0dcec !important;
    width: 25px;
    border: 1px solid #7b7979;
}

/* Styles for the before element */
.custom-combobox-toggle::before {
   content: "\f0d7"; /* fa-caret-down */
   font-family: "Font Awesome 6 Free"; 
   font-weight: 900; /* Solid */
   position: absolute;
   left: 8px;
   color: blue;
}

.ui-datepicker .ui-datepicker-title{
    display: flex !important;
}

.ui-datepicker-month{
    margin-right: 5px !important;
}
.ui-datepicker-year{
    margin-left: 5px !important;
}

.nav-pills .nav-link.active, .nav-pills .show>.nav-link{
	color: #fff ! IMPORTANT;
    background-color: var(--theme-color-bgc);
}
  .custom-combobox {
    position: relative;
    display: inline-block;
  }

  .custom-combobox-toggle {
    position: absolute;
    height: calc(1.5em + .75rem + 1.5px);
    padding: .1rem .2rem;
    font-size: 1rem;
  }
  
  .form-check, label{
  	color: black !important;
  }

  .custom-combobox-input {
    margin: 0;
    padding: .1rem .2rem;
    font-size: 1rem;
    height: calc(1.5em + .75rem + 1.5px);
    margin-left: .25rem;
    width:95%;
  }

.page_title{
    border: solid .1rem #dfdfdf;
    border-radius: 5px;
    margin-bottom: 10px;
    background: transparent;
    border: none;
    float: left;
    top: 3px;
    margin-bottom: 15px;
}

.breadcrumb {
    background-color: transparent;
    border: none;
    padding: 9px 13px;
    margin-bottom: 0px;
    padding-left: 0;
    padding-bottom: 0;
}

.ol {
    list-style-position: outside;
    padding-left: 22px;
}

ol, ul {
    margin-top: 0;
    margin-bottom: 10px;
}

* {
   -webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
    box-sizing: border-box;
}		

ol {
    display: block;
    list-style-type: decimal;
    margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    padding-inline-start: 40px;
}
#cke_notifications_area_terms_condition{
display: none !important;
}


/*=================== Notification Star ===================*/
    .notification_sr {
		position: absolute;
		display: inline-block;
		right: 222px;
		margin-top: 2px !important;
	  
    }
    .notification_sr .notification_toggle {
    background-color: #f8f9fa;
    border: 1px solid #ddd;
    border-radius: 5px;
    padding: 7px 7px;
    cursor: pointer;
    display: flex;
    align-items: center;
    }
    .notification_sr .notification_toggle i {
      font-size: 18px;
      margin-right: 2px;
    }
    .notification_sr .notification_toggle .badge {  
    background-color: #dc3545;
    color: white;
    font-size: 8px !important;
    border-radius: 50%;
    padding: 5px 6px;
    margin-top: -25px !important;
    margin-left: -18px !important;
	  
    }
    .notification_sr .notification_menu {
      display: none;
      position: absolute;
      /*right: 0;*/
	  right: -150px;
      background-color: white;
      box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
      border-radius: 5px;
      width: 300px;
      z-index: 1000;
    }
    .notification_sr .notification_menu.show {
      display: block;
    }
    .notification_sr .notification_header {
    padding: 5px;
    border-bottom: 1px solid #ddd;
    font-weight: bold;
    color: #0f742e;
    background-color: #f4f4f4;
    }
    .notification_sr .notification_item {
    padding: 1px;
    display: flex;
    align-items: flex-start;
    text-decoration: none;
    color: #333;
    background-color: #ffffff;
    }
    .notification_sr .notification_item:hover {
      background-color: #f8f9fa;
    }
    .notification_sr .notification_item i {
/*      font-size: 20px;
      margin-right: 10px;*/
		font-size: 16px;
		margin-right: 5px;
    }
    .notification_sr .notification_time {
      font-size: 12px;
      color: gray;
      margin-top: 5px;
    }
    .notification_sr .notification_divider {
      border-top: 1px solid #ddd;
      margin: 0;
    }
    .notification_sr .text_center {
      text-align: center;
      font-size: 14px;
      padding: 10px;
    }
	
	.notification_item_sub{
		width: 100% !important;
		display: flex !important;
		justify-content: center;
		align-items: center;
		padding: 4px;

	}
	.notification_item :hover .notification_item_sub{
			background-color: #fafafa;
	}
	
	.item_sub_left{
		width:10% !important;
	}
	
	.item_sub_right{
		width:90% !important;
	}
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	.sidebar {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  z-index: 2;
  width: 260px;
  background: #fff;
  box-shadow: 0 16px 38px -12px rgba(0, 0, 0, 0.56), 0 4px 25px 0px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2);
}

.sidebar .caret {
  display: inline-block;
  width: 0;
  height: 0;
  margin-left: 2px;
  vertical-align: middle;
  border-top: 4px dashed;
  border-top: 4px solid\9;
  border-right: 4px solid transparent;
  border-left: 4px solid transparent;
}

.sidebar[data-background-color="black"] {
  background-color: #191919;
}

.sidebar .sidebar-wrapper {
  position: relative;
  height: calc(100vh - 75px);
  overflow: auto;
  width: 260px;
  z-index: 4;
  padding-bottom: 30px;
}

.sidebar .sidebar-wrapper .dropdown .dropdown-backdrop {
  display: none !important;
}

.sidebar .sidebar-wrapper .navbar-form {
  border: none;
  box-shadow: none;
}

.sidebar .sidebar-wrapper .navbar-form .input-group {
  font-size: 1.7em;
  height: 36px;
  width: 78%;
  padding-left: 17px;
}

.sidebar .sidebar-wrapper>.nav [data-toggle="collapse"]~div>ul>li>a span,
.sidebar .sidebar-wrapper .user .user-info [data-toggle="collapse"]~div>ul>li>a span {
  display: inline-block;
}

.sidebar .sidebar-wrapper>.nav [data-toggle="collapse"]~div>ul>li>a .sidebar-normal,
.sidebar .sidebar-wrapper .user .user-info [data-toggle="collapse"]~div>ul>li>a .sidebar-normal {
  margin: 0;
  position: relative;
  transform: translateX(0px);
  opacity: 1;
  white-space: nowrap;
  display: block;
}

.sidebar .sidebar-wrapper>.nav [data-toggle="collapse"]~div>ul>li>a .sidebar-mini,
.sidebar .sidebar-wrapper .user .user-info [data-toggle="collapse"]~div>ul>li>a .sidebar-mini {
  text-transform: uppercase;
  width: 30px;
  margin-right: 15px;
  text-align: center;
  letter-spacing: 1px;
  position: relative;
  float: left;
  display: inherit;
}

.sidebar .sidebar-wrapper>.nav [data-toggle="collapse"]~div>ul>li>a i,
.sidebar .sidebar-wrapper .user .user-info [data-toggle="collapse"]~div>ul>li>a i {
  font-size: 17px;
  line-height: 20px;
  width: 26px;
}

.sidebar .logo-tim {
  border-radius: 50%;
  border: 1px solid #333;
  display: block;
  height: 61px;
  width: 61px;
  float: left;
  overflow: hidden;
}

.sidebar .logo-tim img {
  width: 60px;
  height: 60px;
}

.sidebar .nav {
  margin-top: 20px;
  display: block;
}

.sidebar .nav .caret {
  margin-top: 13px;
  position: absolute;
  right: 6px;
}

.sidebar .nav li>a:hover,
.sidebar .nav li>a:focus {
  background-color: transparent;
  outline: none;
}

.sidebar .nav li:first-child>a {
  margin: 0 15px;
}

.sidebar .nav li:hover>a,
.sidebar .nav li .dropdown-menu a:hover,
.sidebar .nav li .dropdown-menu a:focus,
.sidebar .nav li.active>[data-toggle="collapse"] {
  background-color: rgba(200, 200, 200, 0.2);
  color: #3C4858;
  box-shadow: none;
}

.sidebar .nav li.active>[data-toggle="collapse"] i {
  color: #a9afbb;
}

.sidebar .nav li.active>a,
.sidebar .nav li.active>a i {
  color: #fff;
}

.sidebar .nav li.separator {
  margin: 15px 0;
}

.sidebar .nav li.separator:after {
  width: calc(100% - 30px);
  content: "";
  position: absolute;
  height: 1px;
  left: 15px;
  background-color: rgba(180, 180, 180, 0.3);
}

.sidebar .nav li.separator+li {
  margin-top: 31px;
}

.sidebar .nav p {
  margin: 0;
  line-height: 30px;
  font-size: 14px;
  position: relative;
  display: block;
  height: auto;
  white-space: nowrap;
}

.sidebar .nav i {
  font-size: 24px;
  float: left;
  margin-right: 15px;
  line-height: 30px;
  width: 30px;
  text-align: center;
  color: #a9afbb;
}

.sidebar .nav li a,
.sidebar .nav li .dropdown-menu a {
  margin: 10px 15px 0;
  border-radius: 3px;
  color: #3C4858;
  padding-left: 10px;
  padding-right: 10px;
  text-transform: capitalize;
  font-size: 13px;
  padding: 10px 15px;
}

.sidebar .sidebar-background {
  position: absolute;
  z-index: 1;
  height: 100%;
  width: 100%;
  display: block;
  top: 0;
  left: 0;
  background-size: cover;
  background-position: center center;
}

.sidebar .sidebar-background:after {
  position: absolute;
  z-index: 3;
  width: 100%;
  height: 100%;
  content: "";
  display: block;
  background: #FFFFFF;
  opacity: .93;
}

.sidebar .logo {
  padding: 15px 0px;
  margin: 0;
  display: block;
  position: relative;
  z-index: 4;
}

.sidebar .logo:after {
  content: '';
  position: absolute;
  bottom: 0;
  right: 15px;
  height: 1px;
  width: calc(100% - 30px);
  background-color: rgba(180, 180, 180, 0.3);
}

.sidebar .logo p {
  float: left;
  font-size: 20px;
  margin: 10px 10px;
  color: #fff;
  line-height: 20px;
}

.sidebar .logo .simple-text {
  text-transform: uppercase;
  padding: 5px 0px;
  display: inline-block;
  font-size: 18px;
  color: #3C4858;
  white-space: nowrap;
  font-weight: 400;
  line-height: 30px;
  overflow: hidden;
  text-align: center;
  display: block;
}

.sidebar .logo-tim {
  border-radius: 50%;
  border: 1px solid #333;
  display: block;
  height: 61px;
  width: 61px;
  float: left;
  overflow: hidden;
}

.sidebar .logo-tim img {
  width: 60px;
  height: 60px;
}

.sidebar[data-background-color="black"] .nav .nav-item .nav-link {
  color: #fff;
}

.sidebar[data-background-color="black"] .nav .nav-item i {
  color: rgba(255, 255, 255, 0.8);
}

.sidebar[data-background-color="black"] .nav .nav-item.active [data-toggle="collapse"],
.sidebar[data-background-color="black"] .nav .nav-item:hover [data-toggle="collapse"] {
  color: #fff;
}

.sidebar[data-background-color="black"] .nav .nav-item.active [data-toggle="collapse"] i,
.sidebar[data-background-color="black"] .nav .nav-item:hover [data-toggle="collapse"] i {
  color: rgba(255, 255, 255, 0.8);
}

.sidebar[data-background-color="black"] .user a {
  color: #fff;
}

.sidebar[data-background-color="black"] .simple-text {
  color: #fff;
}

.sidebar[data-background-color="black"] .sidebar-background:after {
  background: #000;
  opacity: .8;
}

.sidebar[data-background-color="black"] .nav li .dropdown-menu .dropdown-item {
  color: #fff;
}

.sidebar[data-color="purple"] li.active>a {
  background-color: #9c27b0;
  box-shadow: 0 4px 20px 0px rgba(0, 0, 0, 0.14), 0 7px 10px -5px rgba(156, 39, 176, 0.4);
}

.sidebar[data-color="azure"] li.active>a {
  background-color: #00bcd4;
  box-shadow: 0 4px 20px 0px rgba(0, 0, 0, 0.14), 0 7px 10px -5px rgba(0, 188, 212, 0.4);
}

.sidebar[data-color="green"] li.active>a {
  background-color: #4caf50;
  box-shadow: 0 4px 20px 0px rgba(0, 0, 0, 0.14), 0 7px 10px -5px rgba(76, 175, 80, 0.4);
}

.sidebar[data-color="orange"] li.active>a {
  background-color: #ff9800;
  box-shadow: 0 4px 20px 0px rgba(0, 0, 0, 0.14), 0 7px 10px -5px rgba(255, 152, 0, 0.4);
}

.sidebar[data-color="danger"] li.active>a {
  background-color: #f44336;
  box-shadow: 0 4px 20px 0px rgba(0, 0, 0, 0.14), 0 7px 10px -5px rgba(244, 67, 54, 0.4);
}

.sidebar[data-color="rose"] li.active>a {
  background-color: #e91e63;
  box-shadow: 0 4px 20px 0px rgba(0, 0, 0, 0.14), 0 7px 10px -5px rgba(233, 30, 99, 0.4);
}

.sidebar[data-color="white"] li.active>a {
  background-color: #fff;
  box-shadow: 0 4px 20px 0px rgba(0, 0, 0, 0.14), 0 7px 10px -5px rgba(255, 255, 255, 0.4);
}

.sidebar[data-color="white"] .nav .nav-item.active>a:not([data-toggle="collapse"]) {
  color: #3C4858;
  opacity: 1;
  box-shadow: 0 4px 20px 0px rgba(0, 0, 0, 0.14), 0 7px 10px -5px rgba(60, 72, 88, 0.4);
}

.sidebar[data-color="white"] .nav .nav-item.active>a:not([data-toggle="collapse"]) i {
  color: rgba(60, 72, 88, 0.8);
}

.sidebar[data-background-color="red"] .nav .nav-item .nav-link {
  color: #fff;
}

.sidebar[data-background-color="red"] .nav .nav-item i {
  color: rgba(255, 255, 255, 0.8);
}

.sidebar[data-background-color="red"] .nav .nav-item.active [data-toggle="collapse"],
.sidebar[data-background-color="red"] .nav .nav-item:hover [data-toggle="collapse"] {
  color: #fff;
}

.sidebar[data-background-color="red"] .nav .nav-item.active [data-toggle="collapse"] i,
.sidebar[data-background-color="red"] .nav .nav-item:hover [data-toggle="collapse"] i {
  color: rgba(255, 255, 255, 0.8);
}

.sidebar[data-background-color="red"] .user a {
  color: #fff;
}

.sidebar[data-background-color="red"] .simple-text {
  color: #fff;
}

.sidebar[data-background-color="red"] .sidebar-background:after {
  background: #f44336;
  opacity: .8;
}

.sidebar[data-background-color="red"] .user:after,
.sidebar[data-background-color="red"] .logo:after,
.sidebar[data-background-color="red"] .nav li.separator:after {
  background-color: rgba(255, 255, 255, 0.3);
}

.sidebar[data-background-color="red"] .nav li:hover:not(.active)>a,
.sidebar[data-background-color="red"] .nav li.active>[data-toggle="collapse"] {
  background-color: rgba(255, 255, 255, 0.1);
}

.sidebar[data-image]:after,
.sidebar.has-image:after {
  opacity: .77;
}
.mh-10{min-height:10px!important;}
.mh-20{min-height:20px!important;}
.mh-30{min-height:30px!important;}
.mh-40{min-height:40px!important;}
.mh-50{min-height:50px!important;}
.mh-60{min-height:60px!important;}
.mh-70{min-height:70px!important;}
.mh-80{min-height:80px!important;}
.mh-90{min-height:90px!important;}
.mh-100{min-height:100px!important;}

.mh-110{min-height:110px!important;}
.mh-120{min-height:120px!important;}
.mh-130{min-height:130px!important;}
.mh-140{min-height:140px!important;}
.mh-150{min-height:150px!important;}
.mh-160{min-height:160px!important;}
.mh-170{min-height:170px!important;}
.mh-180{min-height:180px!important;}
.mh-190{min-height:190px!important;}
.mh-200{min-height:200px!important;}

.mh-210{min-height:210px!important;}
.mh-220{min-height:220px!important;}
.mh-230{min-height:230px!important;}
.mh-240{min-height:240px!important;}
.mh-250{min-height:250px!important;}
.mh-260{min-height:260px!important;}
.mh-270{min-height:270px!important;}
.mh-280{min-height:280px!important;}
.mh-290{min-height:290px!important;}
.mh-300{min-height:300px!important;}

.mh-310{min-height:310px!important;}
.mh-320{min-height:320px!important;}
.mh-330{min-height:330px!important;}
.mh-340{min-height:340px!important;}
.mh-350{min-height:350px!important;}
.mh-360{min-height:360px!important;}
.mh-370{min-height:370px!important;}
.mh-380{min-height:380px!important;}
.mh-390{min-height:390px!important;}
.mh-400{min-height:400px!important;}

.mh-410{min-height:410px!important;}
.mh-420{min-height:420px!important;}
.mh-430{min-height:430px!important;}
.mh-440{min-height:440px!important;}
.mh-450{min-height:450px!important;}
.mh-460{min-height:460px!important;}
.mh-470{min-height:470px!important;}
.mh-480{min-height:480px!important;}
.mh-490{min-height:490px!important;}
.mh-500{min-height:500px!important;}

.mh-510{min-height:510px!important;}
.mh-520{min-height:520px!important;}
.mh-530{min-height:530px!important;}
.mh-540{min-height:540px!important;}
.mh-550{min-height:550px!important;}
.mh-560{min-height:560px!important;}
.mh-570{min-height:570px!important;}
.mh-580{min-height:580px!important;}
.mh-590{min-height:590px!important;}
.mh-600{min-height:600px!important;}

.mh-610{min-height:610px!important;}
.mh-620{min-height:620px!important;}
.mh-630{min-height:630px!important;}
.mh-640{min-height:640px!important;}
.mh-650{min-height:650px!important;}
.mh-660{min-height:660px!important;}
.mh-670{min-height:670px!important;}
.mh-680{min-height:680px!important;}
.mh-690{min-height:690px!important;}
.mh-700{min-height:700px!important;}

.mh-710{min-height:710px!important;}
.mh-720{min-height:720px!important;}
.mh-730{min-height:730px!important;}
.mh-740{min-height:740px!important;}
.mh-750{min-height:750px!important;}
.mh-760{min-height:760px!important;}
.mh-770{min-height:770px!important;}
.mh-780{min-height:780px!important;}
.mh-790{min-height:790px!important;}
.mh-800{min-height:800px!important;}

.mh-810{min-height:810px!important;}
.mh-820{min-height:820px!important;}
.mh-830{min-height:830px!important;}
.mh-840{min-height:840px!important;}
.mh-850{min-height:850px!important;}
.mh-860{min-height:860px!important;}
.mh-870{min-height:870px!important;}
.mh-880{min-height:880px!important;}
.mh-890{min-height:890px!important;}
.mh-900{min-height:900px!important;}

.mh-910{min-height:910px!important;}
.mh-920{min-height:920px!important;}
.mh-930{min-height:930px!important;}
.mh-940{min-height:940px!important;}
.mh-950{min-height:950px!important;}
.mh-960{min-height:960px!important;}
.mh-970{min-height:970px!important;}
.mh-980{min-height:980px!important;}
.mh-990{min-height:990px!important;}
.mh-1000{min-height:1000px!important;}

.form-label {
margin:0px !important;
}
.ui-datepicker{
z-index: 999 !important;
}