body{ font-family:'Roboto', sans-serif !important;}
.uic-tree .uic-tree { margin-left:1.25rem; }
.uic-tree--hidden { display:none; }
.uic-tree__icon { float: left; }
.uic-tree__title { margin-left:1.25rem; }
.uic-tree--cursor-pointer {
    cursor: pointer;
    color: #b1b3b5;
}
.text-body {
    color: #b1b3b5 !important;
}
.well {
    background: #ffffff;
    border-radius: 4px;
    padding: 20px;
    width: 100%;
}

.well-legend {
    font-size: 13px;
    font-weight: bold;
}
.legendfont {
    font-size: 12px;
    /* font-family: ui-serif; 
    font: menu;*/
    font-weight: 100 !important;
}
.fieldwidth{
    width:100%;
}
.Selectfontst {
    font-size: 13px;
    /* font-stretch: semi-condensed; 
         font: menu;
    font-family: ui-serif;
    */
    font-kerning: none;
}

.btnstyle {
    width: 100%;
    background-color: white;
    margin: 0px;
    padding: 2px;
    border: 1px;
    border-color: #b1b3b5;
    border-style: solid;
}
.border-radius0 {
    border-radius: 0px;
}




.material-textfield { position:relative;}
.material-textfield label {
        position: absolute;
        font-size: 1rem;
        left: 0;
        top: 50%;
        transform: translateY(-50%);
        background-color: white;
        color: gray;
        padding: 0 0.3rem;
        margin: 0 0.5rem;
        transition: .1s ease-out;
        transform-origin: left top;
        pointer-events: none;
        font-weight: 300 !important;
    }

.material-textfield input {
        font-size: 1rem;
        outline: none;
        border: 1px solid #ced4da;
        border-radius: 5px;
        padding: 1rem 0.7rem;
        color: gray;
        transition: 0.1s ease-out;
        width: 100%;
        color:#000;
    }

 .material-textfield input:focus { border: 1px solid #1976d2;}
 .material-textfield input:focus + label { color:#1976d2; top:0; transform: translateY(-50%) scale(.9);}
 .material-textfield input:not(:placeholder-shown) + label { top:0; transform: translateY(-50%) scale(.9);}
/*input:-internal-autofill-selected{background-color:#ffffff!important;}*/

.validation-message { font-size:12px; color:#f00; padding-left:5px; padding-top:4px;}
.dropdown-title {
    position: absolute;   
    font-weight: 300;
    background: #fff;
    font-size: 1rem;
    background-color: white;
    color: gray;
    transform: translateY(-50%) scale(.9);
    padding: 0 8px;
    left: 3px; font-weight:300 !important;
}
.dropdown-field{
     height:42px;
}
.sidebar {
    overflow: auto;
    height: calc(100vh - 57px);
    padding:0px;
}

/* tree structure */
.uic-tree__icon {
    float: left;
    background:transparent;
    padding:5px;
    position:relative;
    z-index:1;
}
   /* .uic-tree__icon .fa-minus-square {
        color: #00ff08;
    }*/
.uic-tree--cursor-pointer {
    cursor: pointer;
    color: #c2c7d0;
}
.uic-tree__title {
    margin-left: 0;
    background: #343a40;
    padding:5px 5px 5px 8px;
}
.text-body {
    color: #c2c7d0 !important;
    font-size: 12px;
    font-weight: 400;
    text-transform: capitalize; transition:.2s all ease-in-out;
}
.text-body:hover{color:#fff !important;}

/***** Custom Css *****/
/* width */
::-webkit-scrollbar { width:5px; height:5px;}
/* Track */
::-webkit-scrollbar-track { background:#343a40; }
 /* Handle */
::-webkit-scrollbar-thumb { background:rgba(255,255,255,.55); border-radius:15px; }
/* Handle on hover */
::-webkit-scrollbar-thumb:hover { background:rgba(255,255,255,.55);}
.wrapper .content-wrapper{min-height:100vh;}
#TblData {max-height:450px;width:100%;overflow:auto;}
.alert-info {display: block !important;}
.card-title{ text-transform: capitalize; font-size: 20px; color: #4e4e4e;}
.layout-fixed .brand-link { width:290px; height:auto; text-align:center; padding:8px;}
.layout-fixed .brand-link img{ max-width:170px; width:100%; margin:0 auto;}
.main-sidebar, .main-sidebar::before{ width:290px;}
.sidebar-collapse .main-sidebar, .sidebar-collapse .main-sidebar::before{margin-left:-290px;}
.uic-tree{position:relative; overflow:hidden;}
.uic-tree > div{clear:both;}
.uic-tree > div > .uic-tree__title{position:relative;}
.uic-tree:before{ content:''; height:100%; width:1px; background:#909090; position:absolute; left:11px; z-index:-1;}
/*.uic-tree__icon:after{content:''; width:7px; height:1px; background:#b1b1b1; position:absolute; top:17px; right:0px;}*/
.uic-tree .uic-tree .uic-tree .uic-tree > div > .uic-tree__title{}
.uic-tree .uic-tree .uic-tree .uic-tree > div > .uic-tree__title:before {content: ''; width: 7px; height: 1px; background:#909090;
    position: absolute; top: 17px; left: 0px;}
.content-header h1 { font-size: 2rem !important; font-weight: 300; color: #8a8a8a;}
.table{color:#636262 !important; font-weight: 300; font-size: 15px;}
.table thead th{ font-weight:500; color: #000000 !important; border:0;}
.col-form-label, .form-check-label{ font-weight: 500 !important; color: #3a3939; font-size: 15px !important;}
.custom-table tbody i:hover{cursor:pointer; color:#000;}
.custom-table tbody a{color:#636262;}
    .custom-table tbody .btn-info{ color:#fff !important;}
    .uic-tree .uic-tree .uic-tree .uic-tree > div > .uic-tree__title span.uic-tree--cursor-pointer,
    .uic-tree .uic-tree .uic-tree .uic-tree > div > .uic-tree__title span.bg-primary.text-white {
        font-family: "Font Awesome 5 Free";
        font-weight: bold;
    }
.uic-tree .uic-tree .uic-tree .uic-tree > div > .uic-tree__title span.uic-tree--cursor-pointer:before,
/*.uic-tree .uic-tree .uic-tree .uic-tree > div > .uic-tree__title span.bg-primary.text-white:before{content:'\f3fd'; margin-right:4px; font-size:12px;}*/
.uic-tree .uic-tree .uic-tree .uic-tree > div > .uic-tree__title span.uic-tree--cursor-pointer > span,
.uic-tree .uic-tree .uic-tree .uic-tree > div > .uic-tree__title span.bg-primary.text-white > span{font-family:'Roboto', sans-serif !important; font-weight:normal; font-size:12px;}
.uic-tree .uic-tree .uic-tree > div > .uic-tree__title span.uic-tree--cursor-pointer,
.uic-tree .uic-tree .uic-tree > div > .uic-tree__title span.bg-primary.text-white{font-family:"Font Awesome 5 Free"; font-weight:bold;}
.uic-tree .uic-tree .uic-tree > div > .uic-tree__title span.uic-tree--cursor-pointer:before,
/*.uic-tree .uic-tree .uic-tree > div > .uic-tree__title span.bg-primary.text-white:before{content:'\f0e7'; margin-right:4px; font-size:12px;}*/
.uic-tree .uic-tree .uic-tree > div > .uic-tree__title span.uic-tree--cursor-pointer > span,
.uic-tree .uic-tree .uic-tree > div > .uic-tree__title span.bg-primary.text-white > span{font-family:'Roboto', sans-serif !important; font-weight:normal; font-size:12px;}
.uic-tree .uic-tree > div > .uic-tree__title span.uic-tree--cursor-pointer,
.uic-tree .uic-tree > div > .uic-tree__title span.bg-primary.text-white{font-family:"Font Awesome 5 Free"; font-weight:bold;}
.uic-tree .uic-tree > div > .uic-tree__title span.uic-tree--cursor-pointer:before,
/*.uic-tree .uic-tree > div > .uic-tree__title span.bg-primary.text-white:before{content:'\f1ad'; margin-right:4px; font-size:12px;}*/
.uic-tree .uic-tree > div > .uic-tree__title span.uic-tree--cursor-pointer > span,
.uic-tree .uic-tree > div > .uic-tree__title span.bg-primary.text-white > span{font-family:'Roboto', sans-serif !important; font-weight:normal; font-size:12px;}
.uic-tree > div > .uic-tree__title span.uic-tree--cursor-pointer,
.uic-tree > div > .uic-tree__title span.bg-primary.text-white{font-family:"Font Awesome 5 Free"; font-weight:bold;}
.uic-tree > div > .uic-tree__title span.uic-tree--cursor-pointer:before,
/*.uic-tree > div > .uic-tree__title span.bg-primary.text-white:before{content:'\f007'; margin-right:4px; font-size:12px;}*/
.uic-tree > div > .uic-tree__title span.uic-tree--cursor-pointer > span,
.uic-tree > div > .uic-tree__title span.bg-primary.text-white > span{font-family:'Roboto', sans-serif !important; font-weight:normal; font-size:12px;}
.apexcharts-legend-marker{width: 25px !important; height: 4px !important;  top: -2px !important;}
.apexcharts-legend.position-bottom.apexcharts-align-right {bottom:0 !important;}
.navbar-light .navbar-nav .nav-link {padding: 10px 5px; font-size: 13px;}
.login-page, .register-page { background: url('/_content/TZCApp.Shared/dist/img/pm-bg.jpg') center center; 
                              background-size:cover;}
.chartWrapper .chart > div > div{ height:auto !important; min-height:auto !important;}
.chartWrapper .card-body {padding:10px 1.25rem;}
.login-page .login-logo a{color:#ffffff;}
#loading-bar .bar{background:#23a6fc;}
.bg-gradient-info.btn{background:#23a6fc !important; color:#ffffff !important;}
.btn.btn-info { color: #fff; background-color: #23a6fc !important; border-color: #23a6fc !important;}
.btn.btn-info:hover { background-color: #23a6fc linear-gradient(180deg,#23a6fc,#008eeb) repeat-x!important; border-color: #007acb !important;}
.bg-gradient-info.btn:hover{border-color:#007acb; color:#ffffff; 
                            background:#23a6fc linear-gradient(180deg,#23a6fc,#008eeb) repeat-x!important;}
.user-guide-nav{color:#ffffff !important; position:fixed; bottom:0; display:block; width:290px; text-align:center; background-color:#007dcf;
    padding:3px; font-size:14px;z-index:5 !important}
.dashboardTiles{}
.dashboardTiles .tiles{display:flex; justify-content:space-between; padding:25px; min-height:120px; align-items:center;
    background-color:purple; color:#fff; margin-bottom:15px;}
.dashboardTiles .tiles:hover{cursor:pointer; transition:.3s all ease-in-out;}
.dashboardTiles .tiles:hover .iconBox i{font-size:55px; transition:.3s all ease-out;}
.dashboardTiles .tiles.tile1{background-color:#019317;}
.dashboardTiles .tiles.tile2{background-color:#01a9e9;}
.dashboardTiles .tiles.tile3{background-color:#dd9616;}
.dashboardTiles .tiles.tile4{background-color:#483d8b;}
.dashboardTiles .tiles.tile5{background-color:#d3552c;}
.dashboardTiles .tiles.tile6{background-color:#1ca965;}
.dashboardTiles .tiles.tile7{background-color:#ad193d;}
.dashboardTiles .tiles.tile8{background-color:#23459c;}
.dashboardTiles .iconBox{}
.dashboardTiles .iconBox i{font-size:45px;}
.dashboardTiles .contentBox{font-size:16px; font-weight:500; text-align:right;}
.dashboardTiles .contentBox a{color:#fff;}
.dashboardTiles .tiles.dynamicTiles{padding:12px; display:block;}
.dashboardTiles .tiles.dynamicTiles .dynamicCntnt{display:flex; justify-content:space-between; align-items:baseline; font-weight:500;}
.dashboardTiles .tiles.dynamicTiles .dynamicCntnt:first-child{margin-bottom:20px;}
.dashboardTiles .tiles.dynamicTiles .dynamicCntnt .mainTxt{margin-bottom:5px;}
.dashboardTiles .tiles.dynamicTiles .dynamicCntnt .duration{margin-bottom:5px; text-align:right; line-height:10px;}
.dashboardTiles .tiles.dynamicTiles .dynamicCntnt .duration span{margin-bottom:7px; display:inline-block;}
.dashboardTiles .tiles.dynamicTiles .dynamicCntnt .duration small{font-size:10px;}
.dashboardTiles .tiles.dynamicTiles .dynamicCntnt .value{font-size:30px;}
.dashboardTiles .tiles.dynamicTiles .dynamicCntnt .unit{}

.show:hover + .list-categories {
    max-height: inherit;
    opacity: 1;
}

.list-categories {
    list-style-type: none;
    padding: 0px;
    margin: 0px;
    max-height: 0px;
    opacity: 0;
    overflow: hidden;
    transition: opacity 300ms ease;
}

/** Profile Page Css **/
#profilePage h3{font-size:1.5rem !important; font-weight:300; color:#565656; margin-bottom:0;}
#profilePage .leftSec .card img{max-width:170px; margin:20px auto; border-radius:100%;}
#profilePage .leftSec .card .nav button.nav-link{border-radius:0; border:none; color:#343a40 !important; background-color:transparent; 
                                                 padding:12px; border-top:1px solid #d3d3d3;}
#profilePage .leftSec .card .nav button.active{background-color:#f0f0f0;}
#profilePage .leftSec .card .nav button:focus{outline:none;}

/** Energy Report Page Css **/
.crudBtns{}
.crudBtns .btnsWrap{display:flex; justify-content:space-between; align-items:center; min-width:65px; visibility:hidden;}
.crudBtns:hover .btnsWrap{visibility:visible;}

.downloadBtn{width:70px; display: flex; justify-content: space-between; font-size: 22px; margin:0 auto;}

.ClientsSection .text-gray-dark{ width:25%; }


@media screen and (max-width:1350px) {
    .navbar-light .navbar-nav .nav-link {padding:10px 12px;}
    .main-header .nav-link span{display:none;}
}

@media screen and (max-width:1199px) {
    
}
@media screen and (max-width:991px) {
    .login-page .login-logo{display:none;}
    .login-page, .register-page {
        background: url('/_content/TZCApp.Shared/dist/img/pm-bg-mobile.jpg') center center;
        background-size: cover;
    }
    .ClientsSection .text-gray-dark{ width:25%; }
}
@media screen and (min-width:768px) {
    body:not(.sidebar-mini-md) .content-wrapper, body:not(.sidebar-mini-md) .main-footer, body:not(.sidebar-mini-md) .main-header {
        margin-left: 290px;
    }
}
@media screen and (max-width:767px) {
    .content-header h1{ font-size:1.5rem !important;}
    .main-sidebar, .main-sidebar::before { margin-left:-290px; box-shadow:none !important;}
    .ClientsSection .text-gray-dark{ width:50%; }
}
@media screen and (max-width:575px) {
    .content-header h1 {font-size: 1.1rem !important;}
    .customButton {padding: 5px; font-size:12px;}
    .navbar-light .navbar-nav .nav-link{padding:10px 5px;}
    .ClientsSection .text-gray-dark{ width:100%; }
}
.btn-primary {
    color: #fff !important;   
}
.btn-danger {
    color: #fff !important;
}


#demo {
    height: 300px;
    width: 300px;
}

#preview-textfield {
    width: 300px;
    text-align: center;
    font-size: 2em;
    font-weight: bold;
    color: black;
    font-family: 'Amaranth', sans-serif;
}

.card-info .card-title {
    color: #fff !important;
}