/* define background image for special states - I use one single image that holds all the colors
************************************************************************************************/
.cal_month ul li.booked_am,
.cal_month ul li.booked_pm,
.cal_month ul li.booked_pr_am,
.cal_month ul li.booked_pr_pm {
	background-image: url(../images/bg_days.png); /* CHANGE THIS PATH ACCORDING TO YOUR THEME !!!!! */
}
#cal_wrapper {
	padding-left: 13px;
}
#the_months {
	clear: left;
	float: left;
/*	width:534px;*/
}
.clear {
	clear: both;
}
#ajax_message {
	text-align: center;
	border-top: 1px solid;
	border-top-color: #CCC;
	border-bottom: 1px solid;
	border-top-color: #CCC;
	background-color: #FFF;
	float: left;
	margin-left: 10px;
	width: 260px;
}
.img_loading_month {
	margin: 50px;	/* month loading animation - push to center*/
}
/* calendar key
***********************************/
#key_wrapper {
	text-align: center;
}
#key {
	width: auto;
	background-color: #FFF;
}
#key .cal_title {
	color:#FFF;
}
#key ul {
	text-align: left;
}
#key ul li {
	float: none;
}
#key ul li span {
	margin-left: 24px;
	width: 120px;
	text-align: left;
	display: block;
}
#footer_data {
	font-size:0.8em;
	clear: left;
	margin-left: 0px;
}
/* calendar controls (back and next)
***********************************/
#cal_controls {
	/*margin-bottom: 10px;*/
	margin-bottom: 5px;
}
#cal_controls #cal_prev {
	float: left;
	margin-right: 5px;
}
#cal_controls #cal_next {
	/*margin-left: 2px;*/
}
#cal_controls #cal_admin {
	float: left;
	/*margin-left: 10px;*/
}
/* calendar month styles
***********************************/
.cal_month {
	/* month div*/
	width: 170px;
	border: 1px solid;
	border-color: #43BADA;
	background-color: #FFF;
	line-height: 20px;
	padding-bottom: 6px;
	float: left;
	margin-right: 8px;
	margin-bottom: 6px;
	min-height: 194px;
	color: #666;
}
#key .cal_title,
.cal_month .cal_title {
	border-bottom: 1px solid;
	border-bottom-color: #CCC;
	background-color:#43bada;
	padding: 2px;
	text-align: center;
	color: #FFF;
}
.cal_month ul {
	clear: both;
	list-style: none;
	margin: 0px;
	padding: 4px;
	margin: auto;
	width: 168px;
	color: #FFF;
}
.cal_month ul li {
	float: left;
	width: 20px;
	height: 20px;
	border: 1px solid;
	border-color: #EEE;
	margin-right: 1px;
	margin-bottom: 1px;
	text-align: center;
	background-color: #EEE;
	color: #544c3e;
	font-size: 90%;
}
/* day titles (m,t,w etc.
***********************************/
.cal_month ul.cal_weekday li {
	color: #FFF;
	background-color:#43bada;
	border:1px solid;
	border-color: #43bada;
}
/* no month date
***********************************/
.cal_month ul li.cal_empty {
	background-color: #FFF;
	border: 1px solid;
	border-color: #fff;
	color: #CCC;
}
.cal_month ul li.booked {
	background-color: #FFB911;		/* complete day booked */
}
.cal_month ul li.booked_pr {
	background-color: #FFB168;		/* complete day provisionally booked */
}
/* calendar date styles
class name must be the same as defined in admin panel
*****************************************************/
.cal_month ul li.offer {
	background-color: #A2C52C;
}
.cal_month ul li.changeover {
	/*background-color: #FFB168;*/
	background-image: url(../images/change-over-days.png); /* CHANGE THIS PATH ACCORDING TO YOUR THEME !!!!! */
	background-repeat: repeat;
}
/* position background image for each state - adjust to your image
******************************************************************/
.cal_month ul li.booked_am {
	background-position: 200px top;
}
.cal_month ul li.booked_pm {
	background-position: 230px top;
}
.cal_month ul li.booked_pr_am {
	background-position: 140px top;
}
.cal_month ul li.booked_pr_pm {
	background-position: 170px top;
}
.cal_month ul li.weekend {	/*
	border:1px solid #3399CC;*//*altered via mootools*/
}
.cal_month ul li.clickable:hover {
	border-color: #cc0000;	/*  */
}
.cal_month ul li.today {
	border: 1px dotted;
	border-color: #43bada;	/* current date - MUST be defined last otherwise other classes might overwrite it*/
	color: #43bada;
	font-weight: bold;
}
/*
.cal_month ul li:hover {
	background-color:#43bada; color:#FFF;}
*/
.tips {
	background-color: #000;
	padding: 6px;
	color: #FFF;
	border: 2px solid;
	border-color: #666;
}
.cal_month ul li.weeknum_spacer {
	width: 4px;
	background-color: #FFF;
	border: none;
}
.cal_month ul li.weeknum {
	width: 4px;
	background-color: green;
}