/* LAYOUT */

* { 							
margin: 0;
padding: 0;
} 
/* sets all margin and padding (browser defaults) back to zero for ease of use */

body {
background: url("../images/background.gif") repeat;
}

html, body, div {
font-family: Optima, Tahoma, Arial, sans-serif;
font-size: 14px; 
}

div#container { 				
width: 850px;
margin: 10px auto;
text-align: center; 
border: 1px solid #ccd8e6;
background-color: #fff;
}
/* centers layout (text-align: center for IE), defines overall width and sets background colour of main container div */

div#container * {
text-align: left;
}
/* restores text-align to left in elements contained in container div */

div#header {
position: relative;
width: 850px;
height: 80px;
float: left;
background: url("../images/swanbanner2.jpg") no-repeat top left;
}
/* defines header background image (1600px x 150px image with overflow: hidden) */

div#menu {
width: 170px;
padding: 5px; 
background: #5a648f url("../images/menubackground.jpg") no-repeat top left; 
float: left;
color: #fff;
}

div#content {
width: 640px;
padding: 10px;
float: left;
}
/* padding+width of #menu and padding+width of #content must add up to 100% */

* html div#content {
width: 612px; }
/* hack for IE due to float problem (makes content div 4% narrower so it doesn't float below the menu) */

div#footer { 
width: 830px;
padding: 10px;
clear: both;
background-color: #ccd8e6;
}

/* IMAGES WITHIN CONTENT */

img {
border: 0;
margin: 0;
}

.imgleft {
float: left;
padding: 0 10px 10px 0;
}

.imgright {
float: right;
padding: 0 0 10px 10px;
}

.flag{
padding: 0px;
}

div#menu .staraward{
float: left;
border: 0;
margin: 0;
padding: 0px 0px 10px 0px;
}
 
div#menu .greenaward{
float:left;
border: 0;
margin: 0;
padding: 0px 0px 10px 0px;
}

.clearl {
clear: left;
}

/* use <div class="clearl"></div> to clear the following section from the image above it on the left */

.clearr {
clear: right;
}

/* use <div class="clearr"></div> to clear the following section from the image above it on the right */


/* GENERAL TEXT AND SPECIALIST TEXT */

p {
padding: 0 0 10px 0;
font-size:14px;
color:#000;
line-height:16px;
}

strong {
font-weight: bold;
}

em {
font-style: italic;
}

h1,h2,h3,h4,h5,ul#navigation li a {
margin: 0 0 10px 0;
color: #003e82;
}

h1 {font-size: 24px;}

h2 {font-size: 18px;}

h3 {font-size: 18px;}

h4 {font-size: 16px;}

h5 {font-size: 14px;}

address {
font-size: 14px;
font-style: normal;
}

blockquote {
padding: 3px;
font-size: 14px;
line-height: 16px;
text-align: justify;
border: 1px solid #ccd8e6;
background: url("../images/quoclose.jpg") right bottom no-repeat;
border: 2px solid;
border-color: #003e82 #5a648f #809ec0 #ccd8e6;
position: relative;
}

blockquote div {
padding: 10px 46px;
background: url("../images/quoopen.jpg") left top no-repeat;
}

ul {
font-size: 14px;
list-style-type: circle;
list-style-position: inside;
}

ol {
	font-size: 14px;
	list-style-type:disc;
	list-style-position:outside;
	margin-left: 10px;	
}

/* LINKS */

a {
color: #003e82;
font-weight: bold;
text-decoration: underline;
}

h2 a {
color: #003e82;
font-weight: bold;
text-decoration: none;
}

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

/* ACCESSABILITY */

.accessaid {
position: absolute;
height: 0;
overflow: hidden;
}

.accessaid a {
font-size: 1px;
text-indent: -999em;
color: #fff
}

/* MENU */

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

div#menu a:hover {
color: #ff00ff;
text-decoration: underline;
}

dl#facilities {
font-size: 14px;
list-style-type: disc;
list-style-position: inside;
}

dl#facilities dd {
font-size: 14px;
list-style-type: circle;
list-style-position: inside;
text-indent: 12px;
}

ul#navigation , ul#links {
list-style-type: none;
font-size: 14px;
}

ul#navigation li a {
display: block;
width: 160px;
padding: 2px;
border: 1px solid #003e82;
background-color: #e5ebf2;
text-decoration: none;
position: relative;
}

ul#navigation li a:hover {
color: #e5ebf2;
background-color: #003e82;
border-color: #e5ebf2;
text-decoration: none;
}

/* CONTENT */

div.section {
margin-bottom: 20px;
}

div.section h2 {
border: 1px solid #ccd8e6;
background: #e5ebf2;
padding: 10px;
position: relative;
}
/* position:relative fixes random IE bug which means borders aren't displayed */

/* FORM */

div#form{
width:612px;
background-color: #e5ebf2;
border: 1px solid #ccd8e6;
padding:12px;
}

div#form fieldset{
border:none;
}

div#form legend{
font: 18px bold Optima, Tahoma, Arial, sans-serif;
color: #27518A;
}

div#form fieldset label{
font:14px Geneva, Arial, Helvetica, sans-serif;
float:left;
display:inline;
width:150px;
line-height:18px;
margin: 3px 5px;
text-align:center;
background-color: #FFF;
border: 1px solid #ccd8e6;
}

div#form input,textarea, select{
margin:3px 0px 8px;
border: 2px solid #ccd8e6;
width: 440px;
line-height:18px;
}

div#form select.date{
width:100px;
}

div#form input.go{
margin: 10px 0 0 130px;
border-style:solid;
border-color: #FFF #333 #333 #FFF;
border-width:1px 2px 2px 1px;
background: #CCC;
width:auto;
height: auto;
}
