/******************************************************************* calendar */
table.calendar {
  margin-bottom: 1em;
}
table.calendar tr.header th, table.calendar tr.subheader th {
  background: #dadada url(../images/cal-head.gif) repeat-x bottom left;
  font-weight: bold;  
  padding: 0.5ex 0 1.5ex 0;
  text-align: center;
}
table.calendar tr.subheader td {
  background: #dadada url(../images/cal-corner.gif) repeat-x bottom left;
}
table.calendar tr.header th {
  background-image: url(../images/cal-head-h.gif);
  padding: 0.6ex 0;
}
table.calendar tr.header td {
  background-image: url(../images/cal-corner-h.gif);
}
table.calendar tr.foot td {
  background: #fff url(../images/cal-border.gif) repeat-x top left;
}
table.calendar tr.foot th {
  background: transparent url(../images/cal-foot.gif) no-repeat top left;
}

/********************************************************************* legend */
ul.legend {
  list-style-type: none;
  margin: 0;
  padding: 0;
  width: 100%;
}
ul.legend li {
  display: inline;
  margin: 0 0 0 1em;
  padding: 0;
  float: right;
  white-space: nowrap;
}

/****************************************************************** timescale */
table.time td, table.time th {
  background: #dadada url(../images/cal-border.gif) repeat-x top left;
  font-weight: normal;
  line-height: 100%;
}
table.time th {
  font-size: 1.2em;
  font-weight: bold;
  vertical-align: middle;
  height: 48px; /* HourSize */
  padding:0 3px;
}
table.time td {
  padding: 3px 2px 0 3px;
  height: 24px; /* HourSize / 2 */
  text-align: right;
}

/******************************************************************* schedule */
div.schedule {
  z-index: 1;
}
div.schedule div {
  height: 24px; /* HourSize / 2 */
  overflow: hidden;
}
div.schedule div.a {
  background: #ffffd5 url(../images/cal-available.gif) no-repeat top left;
}
div.schedule div.sa {
  background: #cccccc url(../images/cal-semiavailable.gif) no-repeat top left;
}
div.schedule div.na {
  background: #fff4bc url(../images/cal-unavailable.gif) no-repeat top left;
}
div.schedule div.p {
  cursor: pointer;
}

/******************************************************************* bookings */
div.events {
  position:relative;  
  z-index: 2;
}
table.event {
  table-layout: fixed;
  position: absolute; 
  top: 0; /* Override this value by setting the style property */
  left: 0; /* Override this value by setting the style property */
  height: 13px; /* Override this value by setting the style property */
  width: 100%; /* Override this value by setting the style property */    
}
table.event td.sb {
  border: 1px solid #000; 
  border-width: 1px 0 1px 0; 
  width: 6px;
}
table.event td.sb {
  background: #fff url(../images/cal-booking.gif) repeat-y top left;
}
table.event td.t {
  background: #fff; 
  border: 1px solid #000; 
  line-height: 100%;
  padding: 2px; 
}
table.event td.t div {
  width: 100%;
  height: 100%;
  position: relative;
}
table.event td.t div p {
  position: absolute;
  top: 0;
  left: 2px;
  line-height: 100%;
  height: 100%;
  width: 100%;
  padding: 0;
  clip: rect(0 auto auto 0); /* Override this value by setting the style property */
}
/** Statuses **/
table.event td.s0 {
  background-color: #339;  
}
table.event td.s1 {
  background-color: #f93;  
}
table.event td.s2 {
  background-color: #696;
}
table.event td.s3 {
  background-color: #999;
}

/***** Booking colors are set in the default style sheet *****/

table.event td.res {
  background-image: url(../images/res.gif);
  background-repeat: repeat;
  background-position: left top;
}
table.event td.tpd {
  background-image: url(../images/tpd.gif);
  background-repeat: repeat;
  background-position: left top;
}
table.event td.p {
  background: transparent; 
  width: 1ex;
}


/********** Tooltip on bookings ****************/
.tooltip
{
	width: 250px; 
	color:#000;
	text-align: left;
}

.tooltip .top
{
	padding: 37px 8px 0 13px;
    background: url(../images/toolt.gif) no-repeat top
}

.tooltip b.bottom
{
	padding: 3px 8px 15px 13px;
	color: #548912;
    background: url(../images/toolt.gif) no-repeat bottom
}


