:root{
    --z-index-manage-gp:50;
    --z-index-bottom-slideMenu:60;
    --z-index-bottom-menu:20;
}


.isMobile{}

body.isMobile{ 
    font-size: 12px;
    margin:20px;
    overflow: auto;
    background-image: none;
}
body.isMobile.isSmallScreen{ 
    font-size: 10px;
/*    margin:10px;*/
}

.isMobile .main-holder{
    width:100%;
    height: auto;
    padding: 0;
}
  
.isMobile .box-title{
    font-size: 1.5em;
}

.isMobile .hightlight-gp .label{
    font-size: 1.1em;
}

.isMobile .legend-gp .itm-gp.target{
    -ms-flex-pack: center!important;
    justify-content: center!important;
}

.isMobile .legend-gp .icon{
    padding-right: 5px;
    padding-left:5px;
}

.isMobile .legend-gp .itm.blank{
    padding-left:0;
    padding-right: 0;
}
.isMobile .legent-txt{
    padding-left:0;
    padding-right:0;
    text-transform: uppercase;
    font-size: 0.7em;
    color:rgba(255,255,255,0.5);
}

/**************************************************************************************************/
/*** POWER :COMMOM ******************************************************************************/
/**************************************************************************************************/
.isMobile.power .today-info-gp .title{
    margin-bottom:20px;
}
.isMobile.power .equip-info-gp{
    margin-top:50px;
    overflow-x: hidden;
}
.isMobile.power .equip-info-gp >.row >div{
    padding-left:5px;
    padding-right:5px;
}
    .isMobile.power .equip-info-gp .box-round{
        border-radius: 20px;
        min-height: 210px;
        padding:10px;
    }
    .isMobile.power .equip-info-gp .unit-statement{
        margin-top:15px;
    }
    .isMobile.power .equip-info-gp .label-gp > div img{
        width:30px;
    }
    .isMobile.power .equip-info-gp .label-gp .label{
        font-size: 1.1em;
    }

.isMobile.power .bottom-pane .box{
    margin-left:0;
    margin-bottom: 20px;
      min-height: auto;
}

.isMobile .power-consumption-gp, .isMobile .seven-day-consumption-gp{
    m-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
}


.isMobile.power .daily-consumption-gp .hightlight-gp{
    margin-left:0;
    margin-right:0;
}
.isMobile.power .daily-consumption-gp .hightlight-gp > div{
    padding-left:15px;
    padding-right: 15px;
}

.isMobile.power .daily-consumption-gp .hightlight-gp > div:nth-child(even) .itm-gp{
    padding-left:8%;
}
.isMobile.power .daily-consumption-gp .hightlight-gp > div:nth-child(2){
    border-right:0;
}

.isMobile.power .daily-consumption-gp .hightlight-gp .itm{
    margin-bottom: 20px;
}

.isMobile.power .daily-consumption-gp .box > .row >div{
    padding-left:0;
    padding-right:0;
}

.isMobile.power .daily-consumption-gp .box-title{
    padding-left:50px!important;
    padding-right:50px!important;
}



/**************************************************************************************************/
/*** CHILLER:COMMOM ******************************************************************************/
/**************************************************************************************************/

.isMobile.chiller .top-pane .logo{
    text-align: center;
}
.isMobile.chiller .top-pane .logo img {
    width:70%;
    margin-bottom: 20px;
}
.isMobile.chiller .top-pane .time-date-gp, .isMobile.chiller .top-pane .time-date-gp .date{
    text-align: center;
}

.isMobile.chiller .top-pane .temp-hum-gp{
    margin-top:20px;
    margin-bottom:20px;
    margin-left: 0;
    margin-right: 0;
    text-align: center;
}
.isMobile.chiller.isSmallScreen .top-pane .temp-hum-gp > .row > .col-1{
    padding-left: 5px;
    padding-right: 5px;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: auto;
    max-width: 100%;
}
.isMobile.chiller.isSmallScreen .top-pane .temp-hum-gp > .row > div{
    padding-left: 0;
    padding-right: 0;
}
.isMobile.chiller .top-pane .temp-hum-gp .temp-gp > div, .isMobile.chiller .top-pane .temp-hum-gp .hum-gp > div{
    margin-left:0;
}



/**************************************************************************************************/
/*** CHILLER:DAILY PLANT CONSUMPTION **************************************************************/
/**************************************************************************************************/

.isMobile.chiller .daily-plant-cons-gp .itm{
    margin-top: 30px;
    margin-bottom: 30px;
}
.isMobile.chiller .daily-plant-cons-gp .itm:nth-child(2){
    border-right:0;
}
.isMobile.chiller .daily-plant-cons-gp .value-m{
    font-size: 2em;  
}
.isMobile.chiller .daily-plant-cons-gp .txt-desc{
    font-size: 1.3em!important;
}

/**************************************************************************************************/
/*** CHILLER:TOTAL SYSTEM EFFICIENCY **************************************************************/
/**************************************************************************************************/
.isMobile.chiller .total-sys-eff .itm{
     margin-top: 30px;
    margin-bottom: 30px;
}

/**************************************************************************************************/
/*** CHILLER:COOLING LOAD **************************************************************/
/**************************************************************************************************/
.isMobile.chiller .cooling-load-gp .color-bar{
    margin-bottom: 50px;
}
.isMobile.chiller .cooling-load-gp .grey-bar{
    margin-bottom: 30px;
}
.isMobile.chiller .cooling-load-gp .cooling-load-bar{
    background-size: 100% 100%;
}
.isMobile.chiller .cooling-load-gp .grey-bar-gp > div{
    padding:4px 2px;
}
/**************************************************************************************************/
/*** CHILLER: HEADER TEMP **************************************************************/
/**************************************************************************************************/

.isMobile.chiller .header-temp-gp .info-gp .label{
    margin-left:0
}
.isMobile.chiller .info-gp > .row > div{
    padding-left:5px;
    padding-right: 5px;
    text-align: center;
}

.isMobile.chiller .info-gp > .row > div:nth-child(4){
    -ms-flex: 0 0 2%;
    flex: 0 0 2%;
    max-width: 2%;
}
.isMobile.chiller .header-temp-gp  .temp-round > div > span:first-child{
    font-size: 3.5em;
}
.isMobile.chiller .header-temp-gp .itm-gp .temp-round{
    padding-top:115px;
}

/**************************************************************************************************/
/*** WATER:BUILDING INFO **************************************************************/
/**************************************************************************************************/
.isMobile.water .top-pane .building-gp div:first-child{
   text-align: center;
}
.isMobile.water .top-pane .building-gp img{
    width:100px;
}
.isMobile.water .building-info .itm-1{
      -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%; 
    height: auto;
}

.isMobile.water .box-reflect{
    background-position: left -20px;
}

.isMobile.water .building-info .itm .value:after{
    left:30px;
}
.isMobile.water.isSmallScreen .building-info .itm .value:after{
    left:-10px;
}
/**************************************************************************************************/
/*** WATER:TOTAL WATER CONSUMPTION BY DAY **************************************************************/
/**************************************************************************************************/

.isMobile.water .bottom-pane .box{
    margin-left:0;
    min-height: auto;
}
.isMobile.water .water-consumption-byday-gp, .isMobile.water .seven-day-water-consumption-gp{
     -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
}

.isMobile.water .water-consumption-byday-gp .circle{
    padding-top:75px;
}
.isMobile.water.isSmallScreen .water-consumption-byday-gp .circle{
    padding-top:90px;
}


.isMobile.water .hightlight-gp{
    margin-left:0;
    margin-right: 0;
}
.isMobile.water .water-consumption-equ-gp .hightlight-gp .itm-gp{
    margin-left:0;
}

.isMobile.water .water-consumption-equ-gp .hightlight-gp  .value-m{
    font-size: 1.7em;
}
.isMobile.water.isSmallScreen .water-consumption-equ-gp .hightlight-gp  .value-m{
    font-size: 1.5em;
}

.isMobile.water.isSmallScreen .water-consumption-equ-gp .hightlight-gp .itm{
    padding-left:5px;
    padding-right:5px;
    
}

/**************************************************************************************************/
/*** BTN START ******************************************************************************/
/**************************************************************************************************/
.isMobile .btn-fill{padding: 5px 22px;}