#cal_wrapper{
	font: 12px/1.6 Arial, sans-serif;
	color: #444;
	width:860px;
	margin:0px;
	/*overflow: hidden;*/
	}

#the_months{ 	float:left;  width:534px;	}
.clear{	clear:both;}

#key{ width:40px;  background: #EEE;	color:#111;	margin-right: 1px;	}
#key .cal_title{ color:#FFF;	}
#key .cal_legend{ color:#000;	}

#key ul{ text-align:left;}
#key ul li{ float:none;}
#key ul li span{ margin-left:22px;	width:30px;	text-align:left;	display:block;	}
#key { 	font-size:0.7em;}

#interact{ width:250px; background: #EEE;	color:#111;	margin-right: 1px;	position:relative; top:2em; left:2em;}
#interact .cal_title{ color:#FFF;	}
#interact .cal_legend{ color:#000;	}

#interact ul{ text-align:left;}
#interact ul li{ float:none;}
#interact ul li span{ margin-left:22px;	width:30px;	text-align:left;	display:block;	}
#interact { 	font-size:1.4em;}
#interact .little{font-size:0.9em; color:blue;}


#cal_prev{
	float:left;
	position: relative;
    left: -4px;
    top: -3px;
	}
#cal_next{	
	float:right; 
	position: relative;
    left: 5px;
    top: 2px;
	
	}

/*
calendar month styles
***************************/
.cal_month{
	/* month div*/
	width:169px;
	border:1px solid #006699;
	background-color:#ddf;

	line-height:20px;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
    border-radius : 6px; 
	padding-bottom:4px;
	float:left;
	margin-right:5px;
	margin-bottom:5px;
	min-height:183px;
	color:#666;
    box-shadow: 6px 6px 3px #333355;
	}
#key .cal_title,
.cal_month .cal_title{
	border-bottom: 1px solid #CCC;
    line-height:13px;
	padding:2px;
	text-align:center;
	color:#FFF;
	background-color: #373;
	}	
.cal_month ul{
	clear:both;
	list-style:none;
	margin:0px;
	padding:1px;
	margin:auto;

	color:#FFF;
	}
.cal_month ul li{
	float:left;
	width:20px;
	height:20px;
	border:1px solid #CCC;
	margin-right:1px;
	margin-bottom:1px;
	text-align:center;
	background-color:#DDD;
	color:#000;
	font-size:90%;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	}

/* day titles (m,t,w etc. */
.cal_month ul.cal_weekday li{
	color:#000;
	background-color:#bbd;
    height:15px;
	border:1px solid #f96;
	}
/* no month date */
.cal_month ul li.cal_empty{		
	background-color:#EEE;
	border:1px solid #EEE;
	color:#CCC;
	}
.cal_month ul li.available			{
	background-color: #6C6; width:20px; height:20px; border-width:1px;
}
.cal_month ul li.clickable			{
	background-color: #6C6; font-weight:bold; cursor:pointer;width:20px; height:20px; border-width:1px;
}
.cal_month ul li.clickable svg		{
	background-color: #6C6; font-weight:bold; cursor:pointer;width:20px; height:20px; border-width:1px; fill: #6C6;
}

.cal_month ul li.booked			{
	background-color: #E22; color:#aaa; width:20px; height:20px; border-width:1px;
}

.cal_month ul li.query	svg		{
	background-color: #e22; font-weight:bold ;width:20px; height:20px; border-width:1px; fill: yellow;
}
.cal_month ul li.query			{
	background-color: yellow; font-weight:bold ;width:20px; height:20px; border-width:1px;
}

.cal_month ul li.queryend	svg		{
	background-color: yellow; font-weight:bold ;width:20px; height:20px; border-width:1px; fill: #6C6;
}
.cal_month ul li.querystart	svg		{
	background-color: yellow; font-weight:bold ;width:20px; height:20px; border-width:1px; fill: #6C6;
}


li {position:relative;}
.back1 {position: absolute; top:0px; left:5px; z-index:1; color:#000; font-weight:600;}	

.cal_month ul li	{ background:#6c6; }
.cal_month ul li.booked_am svg {
  display: block;
  cursor: pointer;
  width: 100%;
  height: 100%;
  background: #f00;
  fill: #6c6;
  border-width:1px;
}

.cal_month ul li.query_am svg {	
  display: block;
  width: 100%;
  height: 100%;
  background: yellow;
  fill: #6c6;
  border-width:1px;
}

.cal_month ul li.booked_pm svg {	
  display: block;
  width: 100%;
  height: 100%;
  cursor: pointer;
  background: #f00;
  fill: #6c6;
  border-width:1px;
}

.cal_month ul li.query_pm svg {
  display: block;
  width: 100%;
  height: 100%;
  background: yellow;
  fill: #6c6;
  border-width:1px;
}


.cal_month ul li.clickable		{	background:#6C6;}
.cal_month ul li.past		{	background:#777;}

.cal_month ul li.weekend		{	/*border:1px solid #3399CC;*//*altered via mootools*/}
.cal_month ul li.today			{		width:20px; height:20px; border:1px dotted #006699; background: #eee;	}	/* current date - MUST be defined last otherwise other classes might overwrite it*/
/*.cal_month ul li:hover{	background:#006699; color:#FFF;}*/

div.day{ display:inline-block; width:22px; height:16px; max-height:16px; overflow:hide;}

.tips{
	background: #000;
	padding:6px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	color:#FFF;
	border:2px solid #666;
}
.cal_month ul li.weeknum_spacer{
	width:4px;
	background-color:#FFFFEE;
	border:none;
	}
.cal_month ul li.weeknum{
	width:4px;
	background-color:green;
	}