/* Css originally by mejobloggs  Design by Aran @ stuio7designs.com  Please email me if you use this, as I would love to see how it is being used, also you can join my linkshare to help you with your google ranking */



body {
	font-family: trebuchet ms, verdana, arial, tahoma;
	font-size: 90%;
	color: #888;
	background-color: #a6c3e9;
	line-height: 180%;
	margin: 0;
	padding: 0;
	text-align: center;
}

/* Set the page width */
#wrapper-menu-top, #wrapper-menu-topR, #header, #wrapper-content, #wrapper-footer {
	width: 1061px;	
	max-width: 1087px;
	margin: 0 auto;
	text-align: left;
}

#wrapper-menu-top {
	background: #ffffff url('images/bg02-white-left.png') no-repeat left top;
}
#wrapper-menu-topR {
	width: 100%;
	background: transparent url('images/bg02-white-right.png') no-repeat right top;
}



#wrapper-header {
	background: transparent url('images/bg.png') top center repeat-x;
}

#header {
	background: #ffffff center top;
	height:350px;
}
#nav {width: 1030px; margin-left: auto; margin-right: auto; align:centre;}

	
}


#wrapper-header2 {
	background: transparent url('images/bg02-blue-left.png') top left no-repeat;
}

#wrapper-header3 {
	background: transparent url('images/bg02-blue-right.png') top right no-repeat;
}

#header h1 {
	margin: 0 20px;
	padding: 0;
	height: 192px;
	line-height: 3em;
	color: #fff;
	font-weight: bold;
	font-size: 150%;
}

#wrapper-content {
	background: white url('images/bg02-white-left.png') no-repeat left top;
	margin-top:0px;
}

* html #wrapper-content { height: 1%; }

#content {
	background: transparent url('images/bg02-white-right.png') no-repeat right top;
	padding: 35px 40px 5px 40px;
	margin-top:0px;
}

#page-photo {
	float:right;
	margin-bottom: 50px;}

#wrapper-menu-page {
	float: right;
	width:180px;
	margin: 20px 30px 3em 2em;
	text-align: center;
	line-height: 140%;
	font-family:"Lucida Grande","Lucida Sans Unicode",arial,sans-serif;
}

* html #wrapper-menu-page { margin-right: 15px; }

#menu-page { padding-top: 5px; }


#menu-page ul {
	margin: 0;
	margin-bottom: 20px;
	padding: 0;
	padding-bottom: 10px;
	list-style: none;
	font-size: 90%;
	background: transparent url('images/menu2.png') bottom no-repeat;
}


#menu-page h3 {
	font-size: 75%;
	text-transform: uppercase;
	margin: 1em 0 0.3em 0;
	color: #5b8fbe;
	font-weight: normal;
	letter-spacing: 0.15em;
	background: transparent url('images/menu1.png') bottom no-repeat;
}

#menu-page a:link, #menu-page a:visited { color: #888; }
#menu-page a:hover { color: #5b8fbe; }

.quote {
	width: 80%;
	margin-left: 10%;
	padding-left: 2%;
	display:block;
	font-style: italic;
	border-left: 1px solid #ccc;	
}

/*********** image styles *****************/

img{border-style: none;}
img.frameShadow{padding: 5px 5px 5px 5px; 
		margin-top: 5px;
		margin-bottom: 5px;
		background-color: #fff;
		border-left: 2px solid #bfafa3;
		border-right: 1px solid #dcd7c8;
		border-top: 1px solid #dcd7c8;
		border-bottom: 2px solid #bfafa3;
		}

img.centered {display:block; margin: 0 auto 5px auto; border:0; padding:0; }

img.alignright { 	display: inline; 	
			vertical-align: middle; 
			float:right; 
			margin-left: 5px; 
			}


img.alignleft { 	display: inline; 
			vertical-align: middle; 
			float:left; 
			margin-right:5px; 
			}
img.noFrame{padding: 5px;}

.alignleft { float:left;}

.alignright { float:right;}



.imgleft {
	float: left;
	padding: 5px;

}

.imgright {
	float: right;
	padding: 5px;
}

#wrapper-footer {
	margin-top: 1em;
	text-align: center;
}

#footer {
	margin: 0 20px;
	background-color: #e5f0fc;
	border: 1px solid #ccc;
	border-bottom: 0;
	clear: both;
}

h2 { font-size: 120%; color: #5b8fbe; padding-top:10px;}
h3 { font-size: 100%; color: #5b8fbe; padding-top:10px;}

a:link, a:visited { color: #5b8fbe; text-decoration: none; }
a:hover{ color: #666; text-decoration: none; }


/* ================================================================ 
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.cssmenus.co.uk
Copyright (c) 2009- Stu Nicholls. All rights reserved.
This stylesheet and the associated (x)html may be modified in any 
way to fit your requirements.
=================================================================== */
ul#menu {padding:0; 
		 list-style:none; 
		 text-align:center; 
		 margin:0 auto; 
		 font-size:85%; 
		 font-family:arial, sans-serif; 
		 height:0px; 
		 position: relative; 
		 left:0; 
		 top:0px; 
		 font-weight: bold;
		 }
		 
ul#menu ul {padding:0; margin:0; list-style:none; position:absolute; left:-9999px;}
ul#menu table {border-collapse:collapse; font-size:1em; float:left; margin:-1px;}

ul#menu ul li {float:left; margin:0; text-align:left;}
ul#menu ul li a {display:block; line-height:20px; margin:0; padding:0 0px; background:transparent; width:150px;}

ul#menu li {display:inline; margin:0 -2px; text-align:left;}
ul#menu li a {display:inline-block; height:23px; margin:17px 0 0 0;padding:0 0px 0 4px; background:url(button.gif) right top; line-height:1.5em; text-decoration:none; color:#000;}
ul#menu li a.sub {background:url(button-arrow.gif) right top;}

html>/**/body ul#menu li {display:inline-block; padding:0;}

* html ul#menu li a.sub {margin-right:3px;}
* html ul#menu li a {margin-bottom:-4px;}

ul#menu li a b {display:block; height:36px; float:left; padding:0 0 0 20px; background:url(button.gif) left top; cursor:pointer;}

ul#menu li a:hover {position:relative; background-position:right bottom; color:#fff;}
ul#menu li a:hover b {background-position:left bottom;}

ul#menu li:hover {position:relative;}
ul#menu li:hover > a {background-position:right bottom; color:#fff; }
ul#menu li:hover > a b {background-position:left bottom;}

ul#menu :hover ul {left:1px; width:210px; top:41px;}
* html ul#menu :hover ul {top:36px;}

ul#menu :hover ul li {display:block; float:left; margin:0; border:1px solid #006699; background:#ddd;}
ul#menu :hover ul li a {display:block; float:left; margin:0; padding-left: 5px; height :25px; line-height:25px; width:200px; background:#ddd; color:#000; font-weight: bold;}
ul#menu :hover ul li a.fly {background:#ddd url(arrow.gif) no-repeat right center;}
ul#menu :hover ul li a:hover {background:#c60; color :#fff;}
ul#menu :hover ul li:hover > a {background:#c60; color:#006699;}

ul#menu :hover ul li a.fly:hover {background:#c60 url(arrow-over.gif) no-repeat right center;}
ul#menu :hover ul li:hover > a.fly {background:#c60 url(arrow-over.gif) no-repeat right center;}

ul#menu :hover ul ul {left:-9999px;}

ul#menu :hover ul :hover ul {left:105px; top:0; width:150px;}

ul#menu :hover ul :hover ul li {display:block; float:left; margin:0; border-bottom:1px solid #fff;}
ul#menu :hover ul :hover ul li a {display:block; float:left; margin:0; height:25px; line-height:25px; background:#bbb; color:#000;}
ul#menu :hover ul :hover ul li a:hover {color:#fff; background:#840;}

ul#menu {
	background: transparent url('images/bg02-white-right.png') no-repeat right top;
	/*overflow: hidden; /* no idea why this works, but it fixes a FF problem */
}

#menu a, #courses-menu a {
	float: left;
	background:url(images/menuleft.png) no-repeat left top !important;
}

#menu  a span, #courses-menu a span {
	background: transparent url(images/menuright.png) no-repeat right top;
	padding:5px 10px 0px 10px;
	color:#5b8fbe;
	display: block;
	float: left;
	cursor: pointer; /* IE doesnt display the hand when you roll over the link for some reason. This fixes it */
} 

 #menu a:hover, #courses-menu a:hover { background-position:0% -42px}
 #menu a:hover, #courses-menu a:hover span {background-position:100% -42px; }
 #menu {
			 background: transparent url('images/bg02-white-right.png') no-repeat right top;
			 /* right border of menu - does not work anyway*/

}
 #courses-menu ul {
	margin: 0 20px;
	padding: 1em 0 0 0;
	list-style: none;
	font-size: 85%;
	float: left;
}

#courses-menu {
	font-size: 120%;
	font-weight: bold;
	padding-left: 40px;
}

#courses-menu li {
	display: inline;
	float: left;
}


#courses-menu a {
	border-bottom: 2px solid #ccc;
}

ol {
  color: #ccc;
  list-style-type: none;
}
 
ol li {
  position: relative;
  font: bold 14px/1.5 Helvetica, Verdana, sans-serif;
  margin-bottom: 20px;
}


  ul {list-style: none;padding: 0px;margin: 0px;}
  ul li {display: block;position: relative;float: left;border:1px solid #000;}
  li ul {display: none;}
  ul li a {display: block;background: #d8dadb;padding: 5px 10px 5px 10px;text-decoration: none;
           white-space: nowrap;color: #fff;}
  ul li a:hover {background: #f6e80d;}
  li:hover ul {display: block; position: absolute;}
  li:hover li {float: none;}
  li:hover a {background: #f6e80d;}
  li:hover li a:hover {background: #a6c3e9;}

  #drop-nav li ul li {border-top: 0px;}