.calSrch td  /* calendar search table */
{
	padding: 0 0 5px 0;
}

table#calendar  /* style of the calendar table */
{
	margin: 0;
	padding: 0;
	width: 100%;
	border-collapse: collapse; 
	border: solid 1px #666666;
}

table#calendar tr#title th /* style of the current Month Year title row */
{
	background: #3d4754; 
	color: #ffffff; 
	font-size: 120%; 
	padding: 3px;
	text-align: center;
}  

tr#title a /* style of the forward/backword month links in title row */
{
	color: #ffffff; 
	text-decoration: none;
} 

select#month, select#year 
{
	padding: 3px 4px;
	display: inline-block;
	vertical-align: top;
	color: #222222;
	font-weight: normal;
	height: 44px;
}

.calGo
{
	display: inline-block;
	padding: 4px;
	vertical-align: top;
}


tr#days th  /* style of the Days title row */
{
	background-color: #4e5a6b; 
	color: #ffffff; 
	border-top: solid 1px #b0b0b0; 
	font-weight: bold; 
	text-align: center; 
	padding: 3px;
}

tr#days th.sun /* Sun Title Column width and border */
{
	width: 10%; 
	border-right: solid 1px #b0b0b0;
} 

tr#days th.mon /* Mon Title Column width and border */
{
	width: 16%; 
	border-right: solid 1px #b0b0b0;
} 

tr#days th.tue /* Tue Title Column width and border */
{
	width: 16%; 
	border-right: solid 1px #b0b0b0;
}

tr#days th.wed  /* Wed Title Column width and border */
{
	width: 16%; 
	border-right: solid 1px #b0b0b0;
}

tr#days th.thu  /* Thu Title Column width and border */
{
	width: 16%; 
	border-right: solid 1px #b0b0b0;
}
tr#days th.fri  /* Fri Title Column width and border */
{
	width: 16%; 
	border-right: solid 1px #b0b0b0;
}

tr#days th.sat  /* Sat Column width*/
{
	width: 10%;
}

table#calendar td   /* style of the weekday cells */
{
	vertical-align: top; 
	padding: 0; 
	border: solid 1px #999999;
}

div.date   /* style of the weekday date box */
{
	float: right;
	margin: 0;
	padding: 1px; 
	text-align: center; 
	border-left: solid 1px #3d4754;
	border-bottom: solid 1px #3d4754;
	background-color: #ffffff;
	font-size: 85%;
}

td.sat, td.sun  /* style of the Sat and Sun cells */
{
	background: #ffffff;
}

td.past   /* style of the Past Days cells */
{
	background-color: #efefef; 
	padding: 0;
}

td.holiday  /* style of the holiday cells*/
{
	background-color: #dce6ed; 
	padding: 2px;
}
 
div.holiday   /* style of the Holiday text */
{
	font-size: 70%; 
	font-style: italic;
}

td.today  /* style of the current date cell */
{
	background-color: #ffdfdf; 
	padding: 2px;
}

td.today div.date   /* style of the current date text and background color in date box */
{
	font-weight: bold;
}

td.prev, td.next  /* color of the non-current month date cells */
{
	background-color: #efefef;
}
 
td.prev div.date, td.next div.date  /* style of the non-current month date box and text */
{
	background-color: #efefef; 
	color: #222222;
	font-weight: normal;
	border: 0;
} 

td.plain   /* style of cells with no borders or padding */
{
	padding: 0; 
	border: 0;
}

div.event  /* style of the event box */
{
	margin: 0;
	padding: 1px 2px 2px 2px;
	font-size: 80%;
}

div.event span  /* style of date events text block  */
{
	display: block;
}

span.blockcourse   /* style of course blocks  */
{
	background-color:  #f3ecab;
}

span.expiredcourse   /* style of expired courses  */
{
	color: #222222;
	background-color: transparent;
}

span.expiredcourse a   /* style of expired courses link  */
{
	color: #222222;
}

div.empty span /* style of empty cells text blocks */
{
	display: block;
}

tr#footer td /* style of the Footer row */
{
	background: #465369; 
	text-align: center; 
	padding: 5px;
} 
 
div.status  /* style of the Footer text */
{
	font-size: 90%; 
	color: #ffffff;
	text-align: center;
}


/* -- For screen width less than 700px -- */
@media screen and (max-width: 700px) 
{	
	#calendar
	{
		position: relative;
	}

	#calendar tr, #calendar th, #calendar td
	{
		display: block;
	}

	#calendar tr.week td
	{
		clear: both;
		border: none;
		border-top: solid 1px #dddddd;	
	}

	#calendar tr.week::before
	{
		display: block;
		background-color: #59687b;
		color: #ffffff;
		text-align: center;
		padding: 2px;
		border-top: solid 1px #444444;	
		border-bottom: solid 1px #444444;	
	}

	#calendar tr.week:nth-child(1)::before
	{
		content: "Week 1";
	}

	#calendar tr.week:nth-child(2)::before
	{
		content: "Week 2";
	}

	#calendar tr.week:nth-child(3)::before
	{
		content: "Week 3";
	}

	#calendar tr.week:nth-child(4)::before
	{
		content: "Week 4";
	}

	#calendar tr.week:nth-child(5)::before
	{
		content: "Week 5";
	}

	#calendar tr.week:nth-child(6)::before
	{
		content: "Week 6";
	}

	#calendar tr.week:nth-child(7)::before
	{
		content: "Week 7";
	}

	#calendar tr.week:nth-child(8)::before
	{
		content: "Week 8";
	}

	#calendar tr.week td.sun
	{
		border: none;
	}

	#calendar tr.week td.sun div.date::before
	{
		content: "Sun ";
	}

	#calendar tr.week td.mon div.date::before
	{
		content: "Mon ";
	}

	#calendar tr.week td.tue div.date::before
	{
		content: "Tue ";
	}
	#calendar tr.week td.wed div.date::before
	{
		content: "Wed ";
	}

	#calendar tr.week td.thu div.date::before
	{
		content: "Thu ";
	}

	#calendar tr.week td.fri div.date::before
	{
		content: "Fri ";
	}

	#calendar tr.week td.sat div.date::before
	{
		content: "Sat ";
	}

	div.date
	{
		display: block;
		float: none;
		width: 50px;
		font-size: 80%;
		margin: 0 4px 4px 0;
		padding: 1px;
		color: #222222;
		border: none;
		text-align: center;
		border-right: solid 1px #dddddd;	
		border-bottom: solid 1px #dddddd;	
		background-color: transparent;
	}

	div.event
	{
		display: block;
	}

	#calendar tr#title
	{
		width: 100%;  
	}

	#calendar tr#title th
	 {
		float: left;
		width: 12%;
		padding: 0;
		box-sizing: border-box; 
		min-height: 38px;
	}

	#calendar tr#title th#thismonth
	 {
		width: 76%;
	 }
	 
	#calendar tr#title th, #calendar tr#title th select, #calendar tr#title th input
	{
	 font-size: 80%;
	}
	 
	#calendar tr#days th, #calendar tr.week td.prev, #calendar tr.week td.next, div.empty
	{
		display: none;
	}
}