::-webkit-scrollbar {
      width: 0.3em;
      height: 0.5em
  }
  ::-webkit-scrollbar-button {
      background: #f8f8f8;
  }
  ::-webkit-scrollbar-track-piece {
      background: #f8f8f8;
  }
  ::-webkit-scrollbar-thumb {
      background: #3c8dbc;
  } 



/*input[type=checkbox]:checked {
  background: #f00 !important;
}*/




.togler{
  content: "+";
  width: 27px;
  height: 30px; padding: 6px;
  background: #3c8dbc;
  color: #fff;
}
.classbox_container{
  width: 100%;
  min-height: 50px; overflow: hidden;
  background: #f3f3f3;
  display: none;
  border: 1px solid #3c8dbc; padding: 2px 0 0 2px;
}
.classbox{
  width:9%;  padding-left: 0; height: 90px; border:1px solid #ccc; float:left; overflow: hidden;
  margin-right: 3px; margin-bottom: 5px; background: #fff; 
}
.classboxtop{
  width:100px; height: 30px; border:1px solid #ccc; padding-left: 5px; font-weight: 600;
}
.classboxbottom{
  width:98%; height: 60px; overflow: hidden;
  overflow-y: scroll;
}
.classbox ul{
  padding-left: 10px; list-style: none;
  padding-bottom: 10px;  display: block; overflow: auto;
}

.classbox ul li{
  float: left; margin-right: 3px;
}
.classboxbottom ul li{
  float: left; margin-right: 3px;
}

input[type='checkbox']{
  margin: 4px 2px; vertical-align: top;
}


    .caption{
      font-size: 18px;
      background: #6e787d;
      padding: 20px 0 5px 10px;
      color: #fff;
      font-weight: 300; 
    }
    .caption a{
      color: #fff;
    }
    table{
      border: 1px solid #ddd;
    }
    .calendar{
        font-family: 'Roboto', sans-serif;  float: left; margin-left: 15px;
        border-collapse: collapse; overflow: hidden;
      }

      .calendar .header{                
        width: 145px;
        padding: 18px 0 5px 0;
        font-weight: normal;
        font-size: 16px;
         
        border-right: 1px solid #ddd;
        border-bottom: 1px solid #ddd;
        text-align: center;
      }
      .calendar .day{

        border: 1px solid #ddd;
        padding: 0 0 0 5px;
        /*background: #f3f3f3;*/
        position: relative;
        height: 100px;
        font-size: 12px;
        color: #908f85;
        vertical-align: top;
      }

      .calendar .day span{

        top: 3px;
        
      }
      .calendar .day span.today{

        color: #01c2a5;
        font-weight: bold;
        font-size: 14px;
        border-bottom: 3px solid #01c2a5;

        
        /*padding: 10px;
        border: 2px solid #fff;
        position: absolute;
        top: 3px;
        height: 37px;
        border-radius: 50%;
        display: inline-block;
        vertical-align: top;
        border-color: #01c2a5;*/
      }

      

      .holi, .exam, .eca{
        position: absolute; margin: 0; padding: 0;
        background: #01c2a5;
        color: #fff;
        bottom: 2px;
        height: 22px;
        padding: 4px;
        min-width: 21px; display: none;
      }
      .exam{
        background: #a393b1;
        bottom: 25px;
      }
      .eca{
        background: #acb168;
        bottom: 48px;
      }
      .holi span, .exam span, .eca span {
        display: none;
        float: left;
      }

      .holi i, .exam i, .eca i {
        width: 14px; height: 22px; overflow: hidden;  float: left;
        cursor: pointer;
      }

      .plus{
        background: #88ec4a;
        position: absolute;
        margin: 0;
        padding: 0;
        bottom: 4px;
        right: 3px;
        height:  21px;
        padding: 3px 0 0 5px;
        width: 30px; display: block; overflow: hidden;
        border-radius: 12px;
      }
      .plus_icon{
        width: 100%; clear: both;
        margin-left: 4px; color: #fff;
      }

      .plus:hover{
         
        height: 92px;
        border-radius: 12px;
        background: #f1f1f1 !important;
       
      }

      .plus_in{
        width: 19px;
        height: 21px;
        padding: 1px 0 0 3px;
        clear: both; color: #fff;  background: #01c2a5; 
        border: 1px solid #01c2a5; 
        margin-bottom: 3px; cursor: pointer;
        display: block;

        }
      
       

 

     /* .calendar .sunday{
        background: #b84dff; position: relative; color: #fff;
      }
      .calendar .sunday:before {
          content: "S";
          right: 0;
          position: absolute;
          top: 0;
          font-size: 9px;
          color: #9a2929;
       }*/