html, body {
  background:#666;
  color: #ffffff;
  height: 100%;
  font-family: Century Gothic, Arial, sans-serif;
  font-size: small;
  margin: 0px

}

html { min-height: 100%; margin-bottom: 1px; }

#whitelink a:hover {color:#FFFFFF}

	 
table { border-color:#FFFFFF;
		border-width: 0 0 1px 1px;
		border-style: solid;
		}
		
td { border-color:#FFFFFF;
		border-width: 1px 1px 0 0;
		border-style: solid;
		}		
	
table, td, tr, thead, tfoot, tbody, th, tf { 
border-collapse: collapse; 
margin: 0px; 
padding: 0px; }


blockquote {
	width: 285px;
	float: right;
	margin: 0px;
	padding: 0px;
} 

hr { 

	border: 0;
	border-top: 2px solid #666666; 
	width: 97%;
}


a {
	text-decoration: none;
	color:#fff;
}

img {border-width:0px}

p { line-height:125%;}

h1 {
	margin:0px;
	font-weight:bold;
	font-size:20px;
	background-color: #666666;
	padding:4px;
	color: #FFFFFF;
}

h4 {
	margin:0px;
	font-weight:bold;
	font-size:16px;
	background-color: #666666;
	padding:4px;
	color: #FFFFFF;
}

h5 {
  background-color: #CC3333; 
  font-weight:normal;
  padding-top:5px;
  padding-bottom:5px;
}

.redhighlight {background:#CC3333}


h3 {margin:0px; font-family:Arial, Helvetica, sans-serif; font-weight:normal; color:#CC3333; font-size:11px; background-color: #EEEEEC; padding:4px; }

a:hover {
	text-decoration: underline;
	color: #999999;
}

* html #wrapper {
height:100%
}


	#wrapper {
		width:900px;
		margin:0px auto 0px auto; 
		border-left:1px solid #333;
        border-right:1px solid #333;
		padding:0px;
		min-height: 100%;
		padding-left:35px;
		padding-right:35px;
		background:#202020

	}

#header {
		border:0px solid #bbb;
		height:90px;
		padding:0px;
	}
    #newsflash {
    border:0px solid #333;
    height:20px
    width:100%;
    }


	#content {
		margin-top:30px;
		padding-bottom:10px;
	}
	#content div {

		border:0px solid #333;
		float:left;
	}
	#content-left {
	width:300px;
	background-color: #EEEEEC;
	background-image:url(sidebanner.jpg);
	background-repeat:no-repeat;
	min-height:455px;
		
		
	}
	#content-main {
	margin-left:0px;
	padding:0px;
	width:580px;
	font-size:13px;
	min-height: 455px;
	margin-right: 20px;
}
	
	#content-main p {text-align:justify;}

	
	#footer {
		float:left;
		margin-top:30px;
		margin-bottom:0px;
		padding:0px;
		border:0px solid #bbb;
		width:900px;
		font-size:10px;

}
	#bottom {
		clear:both;
		text-align:right;
	}
	


/* ================================================================ 
This copyright notice must be untouched at all times.

The original version of this stylesheet and the associated (x)html
is available at http://www.cssplay.co.uk/menus/final_drop3.html
Copyright (c) 2005-2007 Stu Nicholls. All rights reserved.
This stylesheet and the associated (x)html may be modified in any 
way to fit your requirements.
=================================================================== */
/* style the outer div to give it width */
.menu {font-size:11px;padding-bottom:0px;border-left-style: solid; border-left-width: 0px; border-left-color: #000;}

/* remove all the bullets, borders and padding from the default list styling */
.menu ul {padding:0;margin:0;list-style-type:none; height:30px; background:#666666;}

/* style the sub-level lists */
.menu ul ul {width:15em;}

/* float the top list items to make it horizontal and a relative positon so that you can control the dropdown menu positon */
.menu ul li {float:left;height:30px;line-height:30px;}

/* style the sub level list items */
.menu ul ul li {display:block;width:12em;height:auto;position:relative;line-height:11px;}

/* style the links for the top level */
.menu a, .menu a:visited {display:block;float:left;border-right-style: solid; border-right-width: 1px; border-right-color: #202020;height:100%;font-size:11px;text-decoration:none;color:#fff;#666666;padding:0 5px 0 5px;}

/* style the sub level links */
.menu ul ul a, .menu ul ul a:visited {display:block;background:#666;border-right-width: 0px; color:#fff;width:12em;height:100%;line-height:11px; padding:0.5em 11px;}
.menu ul table ul a, .menu ul table ul a:visited  {width:14em; w\idth:12em;}


/* style the table so that it takes no part in the layout - required for IE to work */
.menu table {position:absolute; left:0; top:0; font-size:11px; z-index:-1;}
.menu ul ul table {lef\t:-1px;}
.menu ul ul table ul.left {margin-lef\t:2px;}

.menu li:hover {position:relative;}
* html .menu a:hover {position:relative;}

/* style the third level background */
.menu ul ul ul a, .menu ul ul ul a:visited {background:#ccc;}
/* style the fourth level background */
.menu ul ul ul ul a, .menu ul ul ul ul a:visited {background:#ddd;}
/* style the sub level 1 background */
.menu ul :hover a.sub1 {background:#ccc;}
/* style the sub level 2 background */
.menu ul ul :hover a.sub2 {background:#ddd;}

/* style the level hovers */
/* first */
.menu a:hover {color:#fff;background:#CC3333;}
.menu :hover > a {color:#fff;background:#CC3333;}
/* second */
.menu ul ul a:hover{color:#fff;background: #333;}
.menu ul ul :hover > a {color:#fff;background: #333;}
/* third */
.menu ul ul ul a:hover {background:#ddd;}
.menu ul ul ul :hover > a {background:#ddd;}
/* fourth */
.menu ul ul ul ul a:hover {background:#eee;}


/* hide the sub levels and give them a positon absolute so that they take up no room */
.menu ul ul {visibility:hidden;position:absolute;height:0;top:30px;left:0;width:14em;}

/* position the third level flyout menu */
.menu ul ul ul{left:14em;top:0;width:14em;}

/* position the third level flyout menu for a left flyout */
.menu ul ul ul.left {left:-14em;}


/* make the second level visible when hover on first level list OR link */
.menu ul li:hover ul, .menu ul a:hover ul {visibility:visible; height:auto; padding-bottom:30px; background:transparent url(images/trans.gif);}
/* keep the third level hidden when you hover on first level list OR link */
.menu ul :hover ul ul{visibility:hidden;}
/* keep the fourth level hidden when you hover on second level list OR link */
.menu ul :hover ul :hover ul ul{visibility:hidden;}
/* make the third level visible when you hover over second level list OR link */
.menu ul :hover ul :hover ul{visibility:visible;}
/* make the fourth level visible when you hover over third level list OR link */
.menu ul :hover ul :hover ul :hover ul {visibility:visible;}

#home .home, #contactus .contactus, #facility .facility, #departments .departments, #news .news, #prospectus .prospectus, #admissions .admissions, #policies .policies, #catering .catering, #yha .yha, #vacancies .vacancies, #aboutus .aboutus, #bestatus .bestatus
{
background:#CC3333;
} 

#lightbox{	position: absolute;	left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0;}
#lightbox img{ width: auto; height: auto;}
#lightbox a img{ border: none; }

#outerImageContainer{ position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; }
#imageContainer{ padding: 10px; }

#loading{ position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; }
#hoverNav{ position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; }
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{ width: 49%; height: 100%; background-image: url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */ display: block; }
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(images/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(images/nextlabel.gif) right 15% no-repeat; }

#imageDataContainer{ font: 10px Century Gothic, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%	; }

#imageData{	padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em; outline: none;}	 	

#overlay{ position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000; }

#frontbox {background-color:EEEEEC;
			width:180px;
			height:150px;
			color: #CC3333;
			font-size:10px;
			margin-right:10px;
			} 

#department-links {
	width: 220px;
	color: #CC3333;
	font-size: 12px;
	margin-left:20px;
	margin-bottom: 10px;
	margin-top: 10px;
	padding-bottom: 15px;
	
}

#department-links h2 {
	font-family: "Century Gothic", Helvetica, sans-serif;
	font-size: 16px;
	padding-top:0px;
	border-top:0px;
	margin-top:0px;

}

#department-links  ul{
    list-style:none;
	list-style-image:url(nav-arrow.gif);
    margin-left:30px;
	margin-top:0px;
	
    padding-left: 0;
}

#department-links a {
	color:#CC3333
}
#department-links a:hover {
	color:#CC3333
}

#content-main li {
	list-style-type: square;
}

h2 {
	font-family: "Century Gothic", Helvetica, sans-serif;
	font-size: 16px;
	border-top:2px solid #666666;
	padding-top:5px;
	padding-bottom:3px;
	margin-top:20px;
}
.thumbs {
	margin-top: 5px;
	margin-right: 5px;
	margin-bottom: 5px;
	margin-left: 0px;
	
}

.nav {list-style-image:url(nav-arrow-wh.gif)}

.noborders {padding:0px; border:none}

div.float {
	float: left;
	width: 100px;
	background-color: #999999;
	height: 100px;
	text-align: center;
	clear: none;
	vertical-align: text-bottom;
  }
  
div.float p {
   text-align: center;
   }

div.hr {
  height: 1px;
  width:100%;
  background:#666666;
  margin-bottom:5px;
}

#termdates {width:580px}

#termdates table { border-color:#FFFFFF;
		border-width: 0 0 0 0;
		padding:0px;
		margin:0px;
		
		}
		
#termdates td { border-color:#FFFFFF;
		border-width: 0 0 0 0;
		padding:0px;
		margin:0px;
		font-size:12px;
		
		}		
		
#termdates p {border-bottom:1px solid #666666; padding-bottom:5px; margin-bottom:5px;}

#prospectusmain {background-image:url(prospectus-choose-main.jpg);width:290px;height:100px;}
#prospectusmain:hover {background-image:url(prospectus-choose-main-ov.jpg);width:290px;height:100px; cursor:pointer;}
#prospectus6th {background-image:url(prospectus-choose-6th.jpg);width:290px;height:100px;}
#prospectus6th:hover {background-image:url(prospectus-choose-6th-ov.jpg);width:290px;height:100px; cursor:pointer;}

					
.whitelinks a {color:#FFFFFF}

#tickettable {width:400px}

#tickettable table { border-color:#FFFFFF;
		border-width: 0 0 0 0;
		padding:0px;
		margin:0px;
		
		}
		
#tickettable td { border-color:#FFFFFF;
		border-width: 0 0 0 0;
		padding:0px;
		margin:0px;
			
		}