@charset "utf-8"; 


*  {margin:0; padding:0}


html, body {width:100%; height:100%; }

body {font-family: arial, verdana, sans-serif; color:#000; font-size:9pt; background:#121730; }

p {font-family:verdana,sans-serif; font-size:12px; line-height:1.5em; padding:5px 5px 10px 25px; color:#000;}

a, a:link, a:active, a:visited, a:hover{ color: #369; text-decoration: none; }
a:hover{ color: #821a19; border: 0 none; }
.clear {clear:both; }
.banner {margin-left:15px;}

h2 {color:#0b2b41; font-weight:bold; font-size:12pt; padding:25px 15px 15px 25px; }
h4 {color:#121730; font-size:9pt; padding-top:20px; padding-left:25px; padding-bottom:15px;}

hr {border:1px dotted #666; margin:15px; }

span {color:#ff6600; font-weight:bold; font-size:10pt; padding-top:25px; }

.imgright {float:right; padding:10px; }
.test {padding-left:8px; padding-right:8px; font-size:10px; }

#container {margin:0 auto; width:800px; background:#fff url(images/left_fixed_bg.jpg) repeat-y left top;}
#container_home {margin:0 auto; width:800px; background:#333 }

#header {height:100px; background:#4a59a7 url(images/header_bg.jpg) no-repeat; position:relative}
div#header_nav {position:relative; float:right; padding:5px 10px 0 0;}
div#header_nav ul {margin:0; }
div#header_nav li {list-style-type:none; display:inline; padding-right:8px; }
div#header_nav a {color:#fff; font-size:8pt;}
div#header_nav a:hover {color:#fff; text-decoration:underline;}

div#logo {clear:both; position:relative; float:left; }
#bottomnav {position:relative; }
#emailform {position:absolute; width:120px; top:45px; left:3px; color:#fff; font-size:90%; }

#col1 {width:180px; float:left; background:#ececec; margin-bottom:40px;}
#col2 {width:620px; float:left; margin-bottom:40px;background:#fff;overflow:auto}

#cola {width:470px; float:left; }
#colb {width:145px; float:right; }

#colb img {margin:5px 0 5px 0; border:4px solid #999;}

#gallery {margin-left:65px; }
#studentform {margin-left:25px; }
.downloads {margin-left:45px; }

#contact {padding-left:25px; }

#navcontainer {width: 800px;background-color: #000; height:28px; }

#navcontainer ul { padding: 0; }

#navcontainer ul li { display: inline; }

#navcontainer ul {margin: 0;padding: 0 0 0 7%;color: #FFFFFF;font-size: .95em;border-top:1px solid #fff;}
*html #navcontainer ul {border:0; }

#navcontainer ul li a {padding: 0.5em 5px;background-color: #000;color: #FFFFFF;text-decoration: none;float: left;border-right: 1px solid #94B473;font-size:7pt;}
#navcontainer ul li a:hover {background-color: #333;color: #FFFFFF;}
#navlist li a:hover, #navlist li a:active {color: #FFFFFF;text-decoration: none;background: #CC3333;text-align: left;}

#footer {clear:both;color:#999; margin:0 auto; width:800px; }
#footer a {color:#999;padding:1px 2px 0 2px;font-size:7pt;text-decoration:underline;}
#footer a:hover {color:#999; }
#footer p {color:#999; font-size:7pt; padding-bottom:0;}
.credits {float:right; }
.copyright {float:left; }

#menu {background:#000; width:800px;height:29px;}
.menu {

width:800px; 

font-size:7pt;
background:#000;
z-index:100;

}



.menu tr {height:28px; }



/* remove all the bullets, borders and padding from the default list styling */

.menu ul {background:#000;border-top:1px solid #fff; width:800px;

padding:0;

margin:0;

list-style-type:none;

}



/* float the list to make it horizontal and a relative positon so that you can control the dropdown menu positon */

.menu li {

float:left;


position:relative;

}

/* style the links for the top level */

.menu a, .menu a:visited {

display:block;

font-size:7pt;

text-decoration:none; 

color:#fff; 

padding: 0 5px;border-right: 1px solid #666;

height:28px; 

background:#000; 

line-height:28px;

text-align:center;

}

/* a hack so that IE5.5 faulty box model is corrected */

* html .menu a, * html .menu a:visited {
padding: 7px 5px;border-right: 1px solid #666;display:inline;


}



/* style the second level background */

.menu ul ul a.drop, .menu ul ul a.drop:visited {

background:#d4d8bd url(../../graphics/drop.gif) bottom right no-repeat;



}

/* style the second level hover */

.menu ul ul a.drop:hover{

background:#333 url(../../graphics/drop.gif) bottom right no-repeat;

}

.menu ul ul :hover > a.drop {

background:#c9ba65 url(../../graphics/drop.gif) bottom right no-repeat;

}

/* style the third level background */

.menu ul ul ul a, .menu ul ul ul a:visited {

background:#e2dfa8; 

}

/* style the third level hover */

.menu ul ul ul a:hover {

background:#333;

}





/* hide the sub levels and give them a positon absolute so that they take up no room */

.menu ul ul {
border:0;
width:100px;


visibility:hidden;

position:absolute;

height:0;

top:28px;

left:0; 


}

/* another hack for IE5.5 */

* html .menu ul ul {
border:0;
top:28px;

t\op:28px;

}



/* position the third level flyout menu */

.menu ul ul ul{

left:74px; 

top:0;

width:75px;

}

/* position the third level flyout menu for a left flyout */

.menu ul ul ul.left {

right:-75px;

}



/* style the table so that it takes no ppart in the layout - required for IE to work */

.menu table {position:absolute; top:0; left:0;}



/* style the second level links */

.menu ul ul a, .menu ul ul a:visited {

background:#ffae00); 

color:#fff; 

height:auto; 

line-height:2em; 

padding:5px 10px; 

width:100px;border:0;display:block;

/* yet another hack for IE5.5 */

}

* html .menu ul ul a{
width:175px;
w\idth:150px;


}





/* style the top level hover */

.menu a:hover, .menu ul ul a:hover{

color:#fff; 

background:#333;}

.menu :hover > a, .menu ul ul :hover > a {

color:#fff;

background:#333;



}



/* 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; 

}

/* keep the third level hidden when you hover on first level list OR link */

.menu 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;

}