.cssAppointmentChart {
     border-collapse: separate; border-spacing: 0; border: 2px double #FFFFFF; border-radius: 0; width: 100%;     
     background-color: #72adb0 !important;
     color:white;    
    
      }

    .cssAppointmentChart > tbody > tr > th { 
        border-right: none; border-left: none; 
        padding: 3px 5px 3px 5px; border-bottom-color: #dc4343; 
        text-align: center; border: solid 1px; border-color: #deb0b0; 
        background-color:#ef6161;
         
       }
    
    .cssAppointmentChart > tbody > tr > td { 
                border-right: none; border-left: none;  border: solid 1px;  border-color: #c8c4c4;  
                  /*padding: 0px 5px 0px 5px;*/
            text-align: center;     
            
              min-width:80px;             
              border-radius: 1px;            

    }



    /*Fisrt Header Column For Title*/
    .cssAppointmentChart > tbody > tr > th:nth-child(2) {  
        padding: 0px 0px 0px 0px; border:none;background-color:#f2eeee;color:#f2eeee; }    
     .cssAppointmentChart > tbody > tr:nth-child(2) > td:nth-child(2) { background-color:#f2eeee; }  
    


    /*Hide First Column Of data*/
    .cssAppointmentChart > tbody > tr > td:nth-child(1) { display: none; }
    .cssAppointmentChart > tbody > tr > th:nth-child(1) { display: none; }        
   

      /*row Hover Style*/
    /*.cssAppointmentChart > tbody > tr:nth-child(2)  hover { background-color: #ECF5F9; color:black; }*/
    .cssAppointmentChart > tbody > tr { transition: 0.3s background-color;  }


    
     /* First Row Day Name*/
    .cssAppointmentChart > tbody > tr:nth-child(2)  { background-color:#72adb0; }
    .cssAppointmentChart > tbody > tr:nth-child(2):hover  { background-color:#72adb0; color:white; }      
     .cssAppointmentChart > tbody > tr:nth-child(2) > td{  height:5px; padding:2px!important;  font-size:10px!important;  }


    







.AppointmentChartOverlayEffect { background-color: black; filter: alpha(opacity=70); opacity: 0.2; width: 100%; 
                              
                                   height: 100%; z-index: 400; 
                                position: fixed; top: 0; left: 0; margin-top: 0%; margin-bottom: 0%;


}

.AppointmentChartPopupPanelEffect {
     border-color: #808080; border-style: solid; color: #414040; border-width: 1px;
      top: 0%; left: 0%; 
      /*padding: 10px 10px 10px 10px;*/
       text-align: left;
        /*-ms-transform: translateX(-50%) translateY(-50%);
         -webkit-transform: translate(-50%,-50%); 
         transform: translate(-50%,-50%);*/
          z-index: 1000; position: absolute; 
          background-color: White;
           display: block;
 
           padding-right:10px;
            padding-top:10px;
        height:100%;

        width:95%;
}




.count_top_Time
{
    font-size:smaller;
    color:rgba(128, 128, 128, 0.53);
    padding:0px;

    /*color:#77c6a2;*/

}


.NotAvailable{
    background-color:#e9dad6;
    content:none;
      cursor:cell;
}

.OldDay{
     background-color:#efea89;     
}




.NormalDay
{
    background-color:#ffffff;
      cursor:pointer;
}
.NormalDay:hover{
  background-color:#d6ebbc;

}


.SlotFullStyle{

    background-color:#eb8282;
    cursor:not-allowed;
}

.SlotFullStyle .count_top_Time{

    color:#FFFFFF;
}



.ActiveSlotStyle{
    background-color:#9cbe73;
  color:#FFFFFF;
    cursor:pointer;
    text-decoration:none;   
}
.ActiveSlotStyle:hover{
  background-color:#bbd59c;

}
.ActiveSlotStyle .count_top_Time{

    color:#FFFFFF;
}