
div#calendar-box { 
}


table#grid tr#days th {
   color: #9FCFCF; 
   background-color: #752F7B;
   font-weight: bold; 
   text-align: center;
   padding: 2px 2.33em;
   width: auto;
 }

table#grid tr#title th, table#grid tr#foot th {
   background: #9FCFCF; 
   color: #333;
   font-size: 1.5em;
}

table#grid tr#foot th { /*padding: 0.7em; */}
table#grid tr#title th.prev, table#grid tr#foot th.prev { 
   font-size: 1em;
   text-align: left;
 }

table#grid tr#title th.next, table#grid tr#foot th.next { 
   font-size: 1em;
   text-align: right;
}

table#grid td {
   vertical-align: top;
   border: 0px solid #333 ;
   border-width: 0 0 1px 1px;
}

table#grid tr#title a:hover, table#grid tr#foot a:hover {background: #CBCBCB;}


table#grid a {text-decoration: none;}

table#grid a {}

table#grid a:link {}

table#grid a:visited {}

table#grid td.sat {border-right: 1px solid #333;}

/*table#grid td.sat, table#grid td.sun {background: #FDD;}*/

table#grid td.p-month {
   background: #CBCBCB; 
   color: #889;
}

table#grid td.holiday {
   background: #FAA;
   border-color: #BBB #FCC #FCC #BBB;
}

table#grid div.event { 
   display: block;   
   margin: 0.3em 0.6em;    
   padding: 0.3em;
   border: 1px inset #399;
}
table#grid div.event span { 
   font-size: 0.9em;
}
table#grid div.event span.time {
  /* white-space: nowrap;*/
   font-size: 0.9em;
   }

table#grid div.event span.expr_controls { 
   display: block;
}

table#grid div.date { 
   float: right; 
   text-align: center;
   border: 1px solid #666;
   border-width: 0 0 1px 1px;
   padding: 0 0.25em 0.25em 0.25em;
   margin: 0;
   background: #CBCBCB;
   color: #636;
}

table#grid td.p-month div.date { 
   color: gray;
   background: #CBCBCB;
}

table#grid div.add {
   padding: 0.1em 0.3em; 
}

table#grid div#event {
  padding: 0 0.25em;
  font-size: 0.9em;}

table#grid div#event div.booked_appointment {
   background-color: #E3A1A1;
   color: #555;
   border: 1px solid #DEE;
}

.booked { background: #e3a1a1; }

table#grid div#event div.pending_appointment {
   background-color: #E0DC98;
   color: #399;
   border: 1px solid #DEE;
}

.pending { background: #e0dc98; }

table#grid div#event div.available_appointment {
   background-color: #9FCFCF;
   border: 1px solid #DEE;
}

.available { background: #9fcfcf; }

.appointment-details { 
  position: absolute; 
  border: 1px solid black; 
  margin: 2ex; 
  padding: 2ex;
  background-color: white; 
  top: 50%;
  left: 40%;
  right: 30%;
  width: 300px;
}
