/* ---------------------------------------------------------------------------------------------------- */
/* =calendar */
/* ---------------------------------------------------------------------------------------------------- */

div.calendar { position : relative; }


/* -------------------------------------------------- */
/* general */

div.shadow div.wrap4 {
	padding : 6px;
	background-color : #FFF;
	border : 1px solid #CCC;
}

.calendar table {
	margin : 0;
	padding : 0;
	cursor : default;
}

.calendar table td {
	margin : 0;
	padding : 4px 2px;
	width : 30px;
}

img#btn_calendar {
	vertical-align : top;
	margin : 0 3px 0 4px;
	cursor : pointer;
}


/* -------------------------------------------------- */
/* header */

.calendar thead td {
	text-align : center;
	background-color : #86A6B5;
}

/* this holds the current "month, year" */
.calendar thead td.title {
	font-weight : bold;
	color : #FFF;
}

.calendar thead td.button {
	color : #FFF;
}

/* row containing navigation btns */
.calendar thead tr.headrow td {
	background-color : #BCD8E6;
	color : #FFF;
}

.calendar .nav {
  background-color : red;
}

/* row containing the day names */
.calendar thead tr.daynames td {
	background-color : #EBF1EF;
}

/* cells containing the day names */
.calendar thead td.name {
	border-bottom: 1px solid #999;
}

/* how a weekend day name shows in header */
.calendar thead td.weekend {
	color : #A66;
}

/* how do the buttons in header appear when hover */
.calendar thead .hilite {
	color : #FFF !important;
	background-color : #000 !important;
}

/* active (pressed) buttons in header */
.calendar thead td.active {
}


/* -------------------------------------------------- */
/* body */

.calendar tbody td {
	background-color : #FFF;
}

/* cells containing month days dates */
.calendar tbody td.day {
	text-align : center;
	color : #666;
}

/* disabled */
.calendar tbody td.disabled {
	background : url(/_gfx/bg_disabled.gif) repeat left top;
}

.calendar tbody .day.othermonth {
	font-size : 80%;
	color : #BBB !important;
}

.calendar tbody .day.othermonth.oweekend {
	color : #FBB;
}

/* cells containing weeknumber */
.calendar table td.wn {	
	border-right : 1px solid #999;
}

.calendar tbody .rowhilite td {
	background-color : #EBF1EF;
}

.calendar tbody .rowhilite td.wn {
	font-weight : bold;
}

/* hovered cells */
.calendar tbody td.hilite {
	color : #FFF !important;
	background-color : #CCC;
}

/* active (pressed) cells */
.calendar tbody td.active {
}

/* cell showing selected date */
.calendar tbody td.selected {
	font-weight : bold;
	color : #FFF !important;
	background-color : #BCD8E6;
}

/* cells showing weekend days */
.calendar tbody td.weekend { 
  color : #A66;
}

/* cell showing todays date */
.calendar tbody td.today {
	font-weight : bold;
	color : #B80808;
}

.calendar tbody .disabled { color: #999; }

/* empty cells (the best is to hide them) */
.calendar tbody .emptycell {
	visibility : hidden;
}

/* empty row (some months need less than 6 rows) */
.calendar tbody .emptyrow {
	display : none;
}


/* -------------------------------------------------- */
/* footer */

.calendar tfoot td {
	text-align : center;
	background-color : #EBF1EF;
	border-top : 1px solid #999;
}


/* -------------------------------------------------- */
/* combo boxes */

.calendar .combo {
	display : none;
	position : absolute;
	top : 0;
	left : 0;
	z-index : 100;
	width : 50px;
	background : #FFF;
	border : 1px solid #999;
	cursor : default;	
}

.calendar .combo .label,
.calendar .combo .label-IEfix {
	padding : 4px 2px;
	text-align : center;
}

.calendar .combo .hilite {
	background : #EBF1EF;
}

.calendar .combo .active {
	font-weight : bold;
	color : #FFF;
	background : #BCD8E6;
}

.calendar td.time {
	padding : 1px 0px;
	text-align : center;
	background-color : #F4F0E8;
	border-top : 1px solid #000;
}

.calendar td.time .hour,
.calendar td.time .minute,
.calendar td.time .ampm {
	padding : 0px 3px 0px 4px;
	font-weight : bold;
	background-color : #FFF;
	border : 1px solid #889;
}

.calendar td.time .ampm {
	text-align : center;
}

.calendar td.time .colon {
	padding : 0px 2px 0px 3px;
	font-weight : bold;
}

.calendar td.time span.hilite {
	color : #FFF;
	background-color : #667;
	border-color : #000;
}

.calendar td.time span.active {
	color : #0F0;
	background-color : #000;
	border-color : #F00;
}