#timetable {
		position:relative;
		width:600px; 
		height:802px;
		margin-top:20px;
		margin-bottom:20px;
		background:url(../images/timetableBg.jpg) no-repeat;
	}
	
	#datePicker {
		width:218px; 
		height:194px;
	}
	
		.ui-datepicker-header {
			background:url(../images/timetable/theadBg.png) repeat-x;
			position:relative; 
			top:0; 
			left:0;
			width:218px; 
			height:27px; 
		}
		
			.ui-datepicker .ui-datepicker-prev {
				position:absolute; 
				top:2px; 
				left:20px;
				height:27px;
				width:20px;
				line-height:27px;  
				background:url(../images/timetable/iconPrev.png) 0 8px no-repeat;
				color:transparent;
			}
			
			.ui-datepicker .ui-datepicker-next {
				position:absolute; 
				top:2px; 
				right:23px;
				width:20px;
				height:27px;
				line-height:27px;
				background:url(../images/timetable/iconNext.png) right 8px no-repeat;
				color:transparent;
			}
			
			
			.ui-datepicker .ui-datepicker-title {
				text-align:center;
				line-height:27px;
			}
			
			.ui-datepicker table {
				margin:10px 20px 10px 20px;
				width:175px;
				border:collapse;
				border-spacing:0;
				*border-collapse: expression('separate', cellSpacing = '0px'); /*DAMN IE7*/
			}
			
			.ui-datepicker thead tr th {
				border-bottom:1px solid #d0cfcf;
				padding-bottom:1px;
				
			}
			
			.ui-datepicker td {
				margin:0;
				width:15px; 
				height:18px;
				padding:0;
				text-align:center;
				background:#e2e2e2;
				border-top:1px solid #efefef;
				border-right:1px solid #cecece;
				border-bottom:1px solid #cecece;
				border-left:1px solid #efefef;
			}
			
			.ui-datepicker td.ui-state-disabled {
				color:#c8c8c9;
			}
			
			.ui-datepicker td a {
				display:block; 
				color:#58585a;
				font-size:8pt;
				width:23px; 
				height:18px;
				line-height:18px;
				padding:0; 
				margin:0;
			}	
			
			.ui-datepicker .ui-state-active {
				color:#ff7800;
			}
		
	
	#monthSelector {
		width:218px; 
		height:27px;
		background:red;
	}
	
	#eventData {
		position:absolute; 
		left:219px; 
		top:0;
	}
	
		#eventData .head {
			position:absolute; 
			top:0;
			left:0;
			width:381px; 
			height:27px;
			line-height:27px;  
			text-align:center; 
			background:url(../images/timetable/theadBg.png) repeat-x;
		}
		
		#eventData .info {
			position:absolute;
			top:28px; 
			left:0; 
			padding:25px 15px 25px 15px;
			width:331px;
		}
		
			#eventData .info h2 {  
				margin:0 0 10px 0;  
				padding:0;
				color:#ff7900; 
				font-size:16pt;
				font-weight:normal;
				letter-spacing: -0.06em;
			}
			
		#eventData .time {
			position:absolute; 
			top:158px; 
			left:0;
			width:71px; 
			height:36px; 
			line-height:36px;
			text-align:center;
			color:#ff7900;
			font-size:16pt;
			font-weight:normal;
			letter-spacing: -0.06em;
		}		
		
		#eventData .trainer {
			position:absolute; 
			top:158px; 
			left:72px;
			padding:0 20px 0 20px;
			width:269px; 
			height:36px; 
			line-height:36px;
		}
		
			#eventData .trainer A {
				font-weight:bold; 
				
			}
			
		#eventLegendDays {
			position:absolute; 
			top:195px; 
			left:70px; 
		}
		
			#eventLegendDays span {
				display:block;
				float:left;
				width:74px; 
				text-align:center;
				margin:10px 0 2px 0;  
				color:#58585a; 
				font-size:16pt;
				font-weight:normal;
				letter-spacing: -0.06em;
			}
			
		#eventLegendTime {
			position:absolute; 
			top:231px; 
			left:23px; 
		}
		
			#eventLegendTime span {
				display:block;
				font-size:8pt; 
				height:32px;
			}
	
	#eventGroup {
		position:absolute; 
		top:236px; 
		left:70px;
		width:519px; 
		height:515px;
	}
	
		/* event markers */ 
		
		#eventGroup div {
			position:absolute; 
			width:67px;
			height:35px;
			font-size:7pt;
			color:#fff;
			padding:2px;
			cursor:pointer;
			
		}
		
			#eventGroup div span.training {
				text-transform:uppercase; 
				font-size:8pt;
				
			}
		
			/* colors */ 
			.lo { background:#f4af71 url(../images/timetable/eventMarkerLightOrange.png) no-repeat; }
			.o { background:#ff7700 url(../images/timetable/eventMarkerOrange.png) no-repeat;}
			.lg { background:#979694 url(../images/timetable/eventMarkerLightGrey.png) no-repeat;}
			.g { background:#464646 url(../images/timetable/eventMarkerGrey.png) no-repeat;}
			
			
			.lo { background:#ff7700 url(../images/timetable/eventMarkerOrange.png) no-repeat; }
			.o { background:#464646 url(../images/timetable/eventMarkerGrey.png) no-repeat;}
			.lg { background:#979694 url(../images/timetable/eventMarkerLightGrey.png) no-repeat;}
			.g { background:#464646 url(../images/timetable/eventMarkerGrey.png) no-repeat;}
			
		
			/* days */
			
			.mo { left:2px; }
			.tu { left:76px; }
			.we { left:150px; }
			.th { left:224px; }
			.fr { left:298px; }
			.sa { left:372px; }
			.su { left:446px; }
			
			.calline {
				background-image:url(../images/calline.png);
				background-repeat:none; 
				background-position:26px 0px;
				
			}
			
			/* hours , 15mins == 8px (+1) */ 
			/* generated styles */
			.h0700{ top: 2px; }
			.h0715{ top: 10px; }
			.h0730{ top: 18px; }
			.h0745{ top: 26px; }
			.h0800{ top: 34px; }
			.h0815{ top: 42px; }
			.h0830{ top: 50px; }
			.h0845{ top: 58px; }
			.h0900{ top: 66px; }
			.h0915{ top: 74px; }
			.h0930{ top: 82px; }
			.h0945{ top: 90px; }
			.h1000{ top: 98px; }
			.h1015{ top: 106px; }
			.h1030{ top: 114px; }
			.h1045{ top: 122px; }
			.h1100{ top: 130px; }
			.h1115{ top: 138px; }
			.h1130{ top: 146px; }
			.h1145{ top: 154px; }
			.h1200{ top: 162px; }
			.h1215{ top: 170px; }
			.h1230{ top: 178px; }
			.h1245{ top: 186px; }
			.h1300{ top: 194px; }
			.h1315{ top: 202px; }
			.h1330{ top: 210px; }
			.h1345{ top: 218px; }
			.h1400{ top: 226px; }
			.h1415{ top: 234px; }
			.h1430{ top: 242px; }
			.h1445{ top: 250px; }
			.h1500{ top: 258px; }
			.h1515{ top: 266px; }
			.h1530{ top: 274px; }
			.h1545{ top: 282px; }
			.h1600{ top: 290px; }
			.h1615{ top: 298px; }
			.h1630{ top: 306px; }
			.h1645{ top: 314px; }
			.h1700{ top: 322px; }
			.h1715{ top: 330px; }
			.h1730{ top: 338px; }
			.h1745{ top: 346px; }
			.h1800{ top: 354px; }
			.h1815{ top: 362px; }
			.h1830{ top: 370px; }
			.h1845{ top: 378px; }
			.h1900{ top: 386px; }
			.h1915{ top: 394px; }
			.h1930{ top: 402px; }
			.h1945{ top: 410px; }
			.h2000{ top: 418px; }
			.h2015{ top: 426px; }
			.h2030{ top: 434px; }
			.h2045{ top: 442px; }
			.h2100{ top: 450px; }
			.h2115{ top: 458px; }
			.h2130{ top: 466px; }
			.h2145{ top: 474px; }
			.h2200{ top: 482px; }
			.h2215{ top: 490px; }
			.h2230{ top: 498px; }
			.h2245{ top: 506px; }
			.h2300{ top: 514px; }
			
			
			#dayBackgroundLayer {
				position:absolute;
				top:1px;  
				height:509px !important; 
				background-color:#a3a3a3 !important;
				
				filter:alpha(opacity=25);
				-moz-opacity:0.3;
				-khtml-opacity: 0.3;
				opacity: 0.3;
				
			
			}
			
			
			
			/* duration */ 
			/* -4px padding top, bottom #eventGroupDiv */				
			.d15 { height:7px !important; margin-bottom:1px;}
			.d30 { height:11px !important; margin-bottom:1px;}
			.d45 { height:19px !important; margin-bottom:1px;}
			.d60 { height:27px !important; margin-bottom:1px;}
			.d75 { height:35px !important; margin-bottom:1px;}
			.d90 { height:43px !important; margin-bottom:1px;}
			.d105 { height:51px !important; margin-bottom:1px;}
			.d120 { height:59px !important; margin-bottom:1px;}
			.d135 { height:67px !important; margin-bottom:1px;}
			.d150 { height:75px !important; margin-bottom:1px;}
			.d165 { height:83px !important; margin-bottom:1px;}
			.d180 { height:91px !important; margin-bottom:1px;}
			.d195 { height:99px !important; margin-bottom:1px;}
			.d210 { height:107px !important; margin-bottom:1px;}
			.d225 { height:115px !important; margin-bottom:1px;}
			.d240 { height:123px !important; margin-bottom:1px;}
			.d255 { height:131px !important; margin-bottom:1px;}
			.d270 { height:139px !important; margin-bottom:1px;}
			
			
			.ui-datepicker td {
				margin:0;
				width:23px; 
				padding:1px;
				text-align:center;
				background:#e2e2e2;
				border-top:1px solid #efefef;
				border-right:1px solid #cecece;
				border-bottom:1px solid #cecece;
				border-left:1px solid #efefef;
			}
			
			.ui-datepicker td.ui-state-disabled {
				color:#c8c8c9;
			}
			
			.ui-datepicker td a {
				display:block; 
				color:#58585a;
				font-size:8pt;
			}