/* Calendar Styles */
#wide-format #frame {background-color:transparent;}
#overlay {position: absolute; top:0; left:0px; width:100%; height:100%; text-align:center; padding-top:40%; background: #444; z-index:5; -moz-opacity:.30; filter:alpha(opacity=30); opacity:.30;}

#calendar-wrapper {font-family:arial;line-height:1.2em;}
#main-content {position: relative;}
#side-content {font-size:11px;}
#side-content h2 {border-bottom:1px dotted #bbb; padding:0px; margin:0px 0px 10px 0px;}

#upcoming {margin-top:20px;}
#upcoming ul {list-style:none; margin:0px; padding:0px;}
#upcoming li a {text-decoration:none; padding:5px; margin: 2px 0px; display:block; border-bottom:1px solid #ddd;}
#upcoming li a small {color:#444;}
#upcoming li a:hover {background: #d1ece8; border-radius:2px;}

#ongoing {margin-top:20px;}
#ongoing ul {list-style:none; margin:0px; padding:0px;}
#ongoing li a {text-decoration:none; padding:5px; margin: 2px 0px; display:block; border-bottom:1px solid #ddd;}
#ongoing li a small {color:#444;}
#ongoing li a:hover {background: #d1ece8; border-radius:2px;}

#online {margin-top:20px;}

.table-calendar { width:100%; table-layout:fixed; background:#fefefe; }
.table-calendar td { padding:3px; vertical-align: top;}
.table-calendar th { padding:4px; background:#333; color:#fff; font-weight:bold; }
.table-calendar .day { height:120px; border:1px solid #ddd; white-space:nowrap; }
.table-calendar .noDay { height:120px; background:#eee; border-bottom-color:#aaa; white-space:nowrap; }
.table-calendar .passed { height:120px; border:1px solid #ddd; white-space:nowrap; opacity: 0.5; }
.table-calendar .wgbw {height:120px; background:#addfff; border-bottom-color:#aaa; white-space:nowrap;}
.table-calendar .day:hover { background-color:#ebf3fd; }
.table-calendar .today { background-color:#d3edf5; }

.event {border: 1px solid #5fcab6; background:#d1ece8;}
.event:hover {background-color:#5fcab6;}
.course {border: 1px solid #63b4f1; background:#bbdcf5;}
.course:hover {background-color:#63b4f1;}
.nongbca {border: 1px solid #c688ee; background:#dec6ee;}
.nongbca:hover {background-color:#c688ee;}
.postponed {border: 1px solid #888; background:#d8d8d8;}
.postponed:hover {background-color:#d2d2d2;}
.soldout {border: 1px solid #ee5a4e; background:#ee8e86;}
.soldout:hover {background-color:#ee5a4e;}
.webinar {border: 1px solid #e5c384; background:#ffd993;}
.webinar:hover {background-color:#e5c384;}

.dn {color:#555;}
.legend {width:12px; height:12px; float:left; margin-right:5px; border-radius:2px;}

.buttons {list-style:none; padding:0px; margin:5px 0px;}
.buttons a {
	text-decoration:none;
	font-family: arial;
	color:#00B3F0;
	cursor: pointer;
	padding: 0.83em 1em;
	display: block;
	border: solid 1px #adc0ed;
	border-radius:3px; moz-border-radius:3px; webkit-border-radius:3px;
}
.buttons a:hover {color:white; text-shadow: #000 0 1px 0; background: #00B3F0;}
.buttons li {
	display:inline;
	color: #2e4987;
	float:left;
	font-weight: bold;
	font-size: 10px;
	line-height: 100%;
	margin: 1px;
	position: relative;
	text-shadow: #fff 0 1px 0;
	vertical-align: middle;
	white-space: nowrap;
	/* gecko */
	-moz-user-select: none;
	-moz-border-radius: 3px;
	background-image: -moz-linear-gradient(-90deg, #eeeeee 1%, #f3f5fa 5%, #e4eafa 70%, #c9d5f6 100%);
	/* webkit */
	-webkit-user-select: none;
	-webkit-border-radius: 3px;
	background-image: -webkit-gradient(linear,left top,left bottom, color-stop(0.01, #eee), color-stop(0.05, #f3f5fa), color-stop(0.70, #e4eafa), color-stop(1, #c9d5f6));
}

.pressed {background: #00B3F0 !important; border-radius:3px !important;}
.pressed a {color:white; text-shadow: #000 0 1px 0; border-radius:3px;}

.filter-box {padding-top:5px;}
.filter-box h3 {font-size:12px; border-bottom: 1px solid #ddd; margin:0px 0px 5px 0px; padding-top:0px;}
.filter-box div {max-height:250px; overflow:auto;}

.e {
	height:15px;
	font-size:10px;
	line-height: 15px;
	white-space: nowrap;
	overflow: hidden;
	padding:0px 2px;
	margin-bottom:1px;
	border-radius: 2px; -moz-border-radius: 2px; -webkit-border-radius: 2px;
}
.e a {text-decoration:none; color:#222;}

.tt {
	position: absolute;
	z-index: 99;
	top: 19px;
	padding: 10px 10px 10px 25px;
	margin-left: -999em;
	background-image: url(/images/icons/16/2.png);
	background-repeat: no-repeat;
	background-position: 5px 5px;
	background-color: #fff;
	border-radius: 2px; -moz-border-radius: 2px; -webkit-border-radius: 2px;
	box-shadow: 1px 1px 5px #888; -webkit-box-shadow: 1px 1px 5px #888; -moz-box-shadow: 1px 1px 5px #888;
	border-collapse: separate;
	min-width: 200px;
	font-weight: normal;
	font-size: 11px;
	white-space: normal;
	<!--[if IE 7]>
		zoom: 1;
		filter: progid:DXImageTransform.Microsoft.Shadow(color='#969696', Direction=135, Strength=3);
	<![endif]-->
}

.ttwrapper:hover .tt {
	margin-left: 0;
}