.imgSize{
    position: absolute;
    right: 15px;
    top: 0;
    bottom: 0;
    margin: auto;
    height:20px;
    width:20px;
}

.addClass{
    background-color: #269DB8;
      width: 80px;
      height: 80px;
      right: 8%;
      position: fixed;
      color: white;
      bottom: 5%;
      border-radius: 50%;
      z-index: 999;
      -webkit-box-shadow: 2px -1px 13px 0px rgba(0,0,0,0.59);
      -moz-box-shadow: 2px -1px 13px 0px rgba(0,0,0,0.59);
      box-shadow: 2px -1px 13px 0px rgba(0,0,0,0.59);
  }

  .grids{
    border-radius: 20px !important;
    background: white;
    padding-left: 1px;
    padding-right: 1px;
    margin: 13px;
    padding-top: 0px;
    padding-bottom: 3px;
    padding-left: 13px;
    padding-right: 13px;
    border: 1px solid #cac8c8;
    margin-bottom: 10% !important;
   }
  
   .bgcolor {
  
    color: white;
    border-top-right-radius: 19px;
    border-top-left-radius: 15px;
    padding-top: 1;
    padding-bottom: 0;
    margin-top: 0;
    margin-bottom: 0;
    /* border-radius: 12px !important; */
    background: #269DB8;
    border-bottom: 1px solid #a7a4a4;
    border-top: 1px solid #cac8c8;
    margin-left: -13px;
    margin-right: -13px;
  }
  
  
  .header-div {
    background-color: #269DB8;
    text-transform: capitalize;
    height: 100px;
  }
  
  .header-toolbar-new{
    --background: #269DB8;
  }
  
 
  .hrClass{
    border-width: 0;
      box-sizing: content-box;
      border-bottom: 1px solid #e6e6e6;
      background: #fff !important;
      height: 1px;
  }

  //////////////////////////////////////////////down

  .colorBG{
    --background: #f0efef;
   }




  .Title{
    text-align: center;
    color: white;
    margin-top: -33px;
    font-size: 17px;
  }

  .result-graph{
    font-size: 14px;
    margin-left: -48px;
    margin-right: 3px;
    margin-bottom: -30px;
   }

   .datetime{
    text-align: center;
    font-family: WorkSans-Bold;
    margin-left: -120px;
    margin-top: -19px;

   } 
   .datelabel{
    margin-left: 150px;
    color: black !important;
    font-family: WorkSans-Bold;
   }   
   .iconCalendar{
    // margin-left: -241px;
    // margin-top: 5px;
    margin-left: -12px !important;
    width: 22% !important;
    height: 26px !important;
    margin-top: -50px !important;
    margin-bottom: 23px !important;
   }  
// .today-graph{
 
//   display: block !important;
//   height: 196px;
//   width: 385px;
//   padding-left: 51px;
//   // padding-top: 29px;
//   margin-left: -70px !important;
// }
// .today-graph-ar{
//     display: block !important;
//     height: 175px;
//     width: 320px;
//     padding-left: 51px;
//     font-size: 14px;
//     margin-right: 75px;
//     margin-bottom: -30px;
// }

   .headerGrid{
    background-color: white !important;
    border: 1px solid #cac8c8 !important;
    border-radius: 20px !important;
    padding-top: 28px;
    padding-bottom: 26px;
    margin-left: 13px;
    margin-right: 13px;
    margin-top: -93px;
    margin-bottom: 10px;

   }
   .header{

    margin-top: -126px;
  }
   .result-text-container {
    padding: 0;
    margin: 0;
    position: absolute;
    left: 31%;
    top: 23%;
    display: block;
    text-align: center;
    transform: translate(-50%, -50%);

    h2 {

        font-size: 25px;
        font-family: WorkSans-Bold;
        margin: 0 auto;
        // margin-top: 289px;
        line-height: 36px;

    }

    span {

        width: 125px;
        display: block;
        margin: 0 auto;
        font-size: 12px;
        // margin-top: 289px;
        font-family: workSans-Regular;
    }
  }
.green-label{
font-size: 12px;
margin-top: -13px;
}

.green-amount{
  font-size: 15px;
  font-family: WorkSans-Bold;
  margin-top: 0px;
}


.red-label{
  font-size: 12px;
  margin-top: -13px;
  }
  
  .red-amount{
    font-size: 15px;
    font-family: WorkSans-Bold;
    margin-top: 0px;
  }

 

  .orng-label{
    font-size: 12px;
    margin-top: -13px;
    }
    
   
    .orng-amount{
      font-size: 15px;
      font-family: WorkSans-Bold;
      margin-top: 0px;
    }
  
  .contentEit:before {
    position: absolute;
  content: "";
  // background: #269DB8;
  height: 140px;
  width: 100%;
  left: 0;
  top: 0px;
  z-index: 1;
  }
 .div-green{
  position: relative;
  left: 82%;
  bottom: 141px;
  color: black;
  background-color: #1FA269;
  width: 11%;
  height: 6px;
 }

 .div-red-ar{
  position: relative;
  bottom: 59px;
  color: black;
  // background-color: #DDB017;
  background-color: #CB3232;
  width: 11%;
  height: 6px;
  right: 16px;

 }
//  .div-red-ar{
//   position: relative;
//   bottom: 131px;
//   color: black;
//   background-color: #CB3232;
//   width: 11%;
//   height: 6px;
//   right: 92px;
//  }
//  .div-red{
//   position: relative;
//   left: 59%;
//   bottom: 146px;
//   color: black;
//   background-color: #CB3232;
//   // background-color: #269DB8;
//   width: 11%;
//   height: 6px;
//  }
 
 .div-red{
  position: relative;
  left: 82%;
  bottom: 80px;
  color: black;
  background-color: #CB3232;
  // background-color: #DDB017;
  width: 11%;
  height: 6px;
 }
 .div-green-ar{
  position: relative;
  bottom: 124px;
  color: black;
  // background-color: #DDB017;
  background-color: #1FA269;
  width: 11%;
  height: 6px;
  right: 16px;
 }
.subTitle{
  margin-top: -10px;
  margin-left: 10px;
  font-family: WorkSans-Bold;
  font-size: 16px;
}

.subTitle-ar{
  margin-top: -10px;
  margin-right: 10px;
  font-family: WorkSans-Bold;
  font-size: 16px;
}


.today-graph {
  display: block;
  height: 102px;
  width: 211px;
  margin-top: 20px;
margin-left: -39px;
max-height: 4cm;
}

.today-graph-ar {
  display: block;
  height: 102px;
  width: 211px;
  margin-top: 20px;
  /* margin-right: -39px; */
  max-height: 4cm;
  margin-right: 105px;
}

.graph-container{
  margin-left: 160px;
  position: relative;
  margin-top: -98px;
}
// .label-container{
//   position: absolute;
//   // width: 20%;
//   // right: 30px;
//   top: 50%;
//   margin-top: -27px;
//   left: 20px;
  
// }


.green-label-container{
  margin-top: 20px; margin-left: 12px;
  
}
.green-label-container-ar{
  margin-top: 20px; margin-right: 12px;
  
}

.black-label-container{
  margin-left: 12px;
}
.black-label-container-ar{
  margin-right: 12px;
}
.used-label-container{
  // border-top: 5px solid #292F42;
  // padding: 1px 0px;
  // margin: 15px 0px
  width: 12px;
  height: 12px;
  padding-right: -10px;
  border-radius: 100%;
  background-color: #b60c0c;
  margin-top: 30px;
}
.current-label-container{
  width: 12px;
  height: 12px;
  padding-right: -10px;
  border-radius: 100%;
  background-color: black;
  margin-top: 21px;
}
.current-label{
  width: 12px;
  height: 12px;
  padding-right: -10px;
  border-radius: 100%;
  background-color: #269DB8;
  // margin-top: 30px;
}
.span-one{
  // display: block;
  // font-size: 12px;
  // color: black;
  display: block;
  font-size: 12px;
  color: #269DB8;
  margin-left: 6px;
  margin-top: -2px;
  font-weight: bold;
  
}

.span-one-ar{
  display: block;
  font-size: 12px;
  color: #269DB8;
  margin-right: 6px;
  margin-top: -2px;
  font-weight: bold;
  
}

.span-two{
  // display: block;
  // font-size: 22px;
  display: block;
  font-size: 12px;
  color: #269DB8;
  margin-left: 6px;
  margin-top: -2px;
  font-weight: bold;
  font-family: WorkSans-Bold;
  
}

.black-span1{
  // display: block;
  // font-size: 12px;
  // color: black;
  display: block;
  font-size: 12px;
  color: black;
  margin-left: 6px;
  margin-top: 20px;
  font-weight: bold;
  
}
.black-span1-ar{
  // display: block;
  // font-size: 12px;
  // color: black;
  display: block;
  font-size: 12px;
  color: black;
  margin-right: 6px;
  margin-top: 20px;
  font-weight: bold;
  
}
.black-span2{
  // display: block;
  // font-size: 22px;
  display: block;
  font-size: 12px;
  color: black;
  margin-left: 6px;
  margin-top: 20px;
  font-weight: bold;
  font-family: WorkSans-Bold;
  
}
.red-span1{
  // display: block;
  // font-size: 12px;
  // color: black;
  display: block;
  font-size: 12px;
  color: #b60c0c;
  margin-left: 6px;
  margin-top: 28px;
  font-weight: bold;
  
}
.red-span1-ar{
  // display: block;
  // font-size: 12px;
  // color: black;
  display: block;
  font-size: 12px;
  color: #b60c0c;
  margin-right: 6px;
  margin-top: 28px;
  font-weight: bold;
  
}
.red-span2{
  // display: block;
  // font-size: 22px;
  display: block;
  font-size: 12px;
  color: #b60c0c;
  margin-left: 6px;
  margin-top: 28px;
  font-weight: bold;
  font-family: WorkSans-Bold;
  
}
.yearLabel{
  font-size: 13px;
  color: gray;
  font-family: WorkSans-Bold;
  margin-left: 29px;
  margin-top: 5px;
}
.yearLabel-ar{
  font-size: 13px;
  color: gray;
  font-family: WorkSans-Bold;
  margin-right: 29px;
  margin-top: 5px;
}