/* CSS Document */

/* 1. COLOURS  

body background:  #999999;
svp pale blue:  #b7d4fe;
darl blue text:  #303765;
turquoise text:  #268cf0;
sidebar orange: #FF9900
sidebar1 purple: #e4b4eb; header #DB9AE4
siderbar2 green:  #83E783; header #57DD57
siderbar3 purple:  #D1ADD1; header #FFBD35
siderbar4 blue: #74B5F5; header #56A5F3
siderbar5 red: #EA8083; header #E66467


*/




/* 2. TEXT STYLES  */





/* 3. CONTAINER LAYOUT  */

body {
	background-color: #dddddd;
	width: 99%;
	text-align: center;
	margin: 0 1% 0 0;
	padding: 0;
	font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
	font-size: 90%;
	color: #081052;
	}

#frameleft {
	margin: 0 auto;
	background-image: url("../../images/designimages/edge2_left.jpg");
	background-position:left;
	background-repeat:repeat-y;

	}
	
#frametop {
	margin: 0 auto;
	padding: 0;
		}	
		
#frametopleft {
	background-image: url("../../images/designimages/topleft.jpg");
	background-position: top left;
	background-repeat:no-repeat;
	}
	
#frametopright {
	background-image: url("../../images/designimages/topright.jpg");
	background-position: top right;
	background-repeat:no-repeat;
	}	

#frametopmiddle {
	background-image: url("../../images/designimages/edge2_top.jpg");
	background-position:top;
	background-repeat:repeat-x;
	margin: 0 20px 0 20px;
	padding: 0;
	height: 21px;
	}

#frameright {
	background-image: url("../../images/designimages/edge2_right.jpg");
	background-position:right;
	background-repeat:repeat-y;
	}	
	
#framebottom {
background-position:bottom;
		}		

#framebtmleft {
	background-image: url("../../images/designimages/btmleft.jpg");
	background-position: bottom left;
	background-repeat:no-repeat;
	}
	
#framebtmright {
	background-image: url("../../images/designimages/btmright.jpg");
	background-position: bottom right;
	background-repeat:no-repeat;
	}	

#framebtmmiddle {
	background-image: url("../../images/designimages/edge2_btm.jpg");
	background-position:bottom;
	background-repeat:repeat-x;
	margin: 0 20px 0 20px;
	height: 21px;
	}
	
#container {
	background-color:  #ffffff;
	margin: 0px 22px 0 22px;
	text-align:left;
	border: 5px solid #ffffff;
	padding: 0;
	}	



/* 4.1 MASTHEAD LAYOUT */

#masthead {
	height: 158px;
	margin: 0;
	padding: 0;
	background-color: #b7d4fe;
	border-bottom: 5px solid #ffffff;
	}

#mastheadinner {
	margin: 0px;
	padding: 0px;
	}

#contactus {
	width: 172px;
	background-color:#FFA620;
	margin: 0 30px 0 0;
	padding: 1px 1px 5px 1px;
	border: 5px solid #b7d4fe;
	float: left;
	font-size: 90%;
	line-height: 1.2;
	}

#contactus .navheader {
	background-color: #ff9900;
	}
	
#contactus .navheader a {
	display: block;
	width: 162px;
	text-decoration:none;
	color: #081052;
	padding: 1px 5px 1px 5px;
	}
	
#contactus .navheader a:hover {
	font-weight:bold;
	background-color: #ffffff;
	}		
	
#contactus ul {
	margin: 0;
	padding-left: 0;
	list-style-type: none;
	font-size: 90%;	
	}

#contactus ul a {
	display: block;
	width: 162px;
	padding: 0 5px 0 5px;
	margin: 0;
	text-decoration:none;
	color: #081052;
	}
	
#contactus ul a:hover {
	font-weight: bold;
	background-color: #ffffff;
	}	
	
#spacer {
	height: 15px;
	}	
	
#ocnw_head {
	float: left;
	text-align:left;
	}	

/* 4.2 MASTHEAD TEXT STYLES */

#masthead h1, #masthead h2 {
	color: #081052;
	}

#masthead h1 {
	font: 230%/200% "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
	line-height: 1.2;
	padding: 0;
	margin:  0;
	font-weight:bold;
	}
	
#masthead h2 {	
	font: 180%/140% "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
	line-height: 1.2;
	padding: 0;
	margin:  0;
	font-weight:bold;
	}
	
#masthead h3 {	
	font: 180%/140% "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
	line-height: 1.2;
	padding: 0;
	margin:  15px 0 0 0;
	font-weight:bold;
	}	
	
.svplogo {
	float: right;
	margin: 10px;
	padding: 0;
	}
	
.ocnwlogo {
	margin: 10px;
	padding: 0;
	}	

/* 4.3 MASTHEAD LINKS */

#masthead a {
	text-decoration:none;
	color: #081052;
	}
	
#masthead a:hover {
	font-weight:bold;
	background-color:#ffffff;
	}	



/* 5.1 SIDENAV LAYOUT */

#main {
	margin: 0;
	padding: 0;
	clear:both;
	}

#sidenav {
	position:relative;
	width: 180px;
	margin: 0;
	padding: 0;
	float: left;
	font-size: 90%;
	}

#sidenav_ocnw {
	position:relative;
	width: 180px;
	margin: 0;
	padding: 0;
	float: left;
	font-size: 90%;
	}

#subnav1 {
	border-top: 5px solid #ffffff;
	margin:0;
	padding:1px;
	background-color: #e4b4eb;
	}
	
#subnav1 .navheader {
	background-color: #D689E0;
	}	
	
#subnav2 {
	border-top: 5px solid #ffffff;
	margin:0;
	padding: 1px;
	background-color:#83E783;
	}

#subnav2 .navheader {
	background-color: #57DD57;
	}	
		
#subnav3 {
	border-top: 5px solid #ffffff;
	margin:0;
	padding:1px;
	background-color:#ffcd62;
	}

#subnav3 .navheader {
	background-color: #FFBD35;
	}	
	
#subnav4 {
	border-top: 5px solid #ffffff;
	margin:0;
	padding: 1px;
	background-color:#74B5F5;
	}

#subnav4 .navheader {
	background-color: #56A5F3;
	}	
	
#subnav5 {
	border-top: 5px solid #ffffff;
	margin:0;
	padding:1px;
	background-color:#EA8083;
	}
	
#subnav5 .navheader {
	background-color: #E66467;
	}	
	
#subnav6 {
	border-top: 5px solid #ffffff;
	border-bottom: 5px solid #ffffff;
	margin:0;
	padding:1px;
	background-color:#dddddd;
	}
	
#subnav6 .navheader {
	background-color: #bbbbbb;
	}		
	
#subnav_ocnw {
	border-top: 5px solid #ffffff;
	margin:0;
	padding:0;
	font-size: 140%;
	font-weight: bold;
	}






/* 5.2 SIDENAV TEXT STYLES */

.navheader {
	font-weight:bold;
	margin: 0;
	font-size: 110%;
	padding: 0;
	line-height: 1.1;
	}
	

/* 5.3 SIDENAV LINKS */

#sidenav ul, #sidenav ul ul, #sidenav_ocnw ul
{
margin: 0;
padding-left: 0;
list-style-type: none;
font-size: 90%;	
}

.navlist {
margin: 0;
padding-left: 0;
font-size: 95%;	
}

#sidenav .navheader a {
	display: block;
	width: 168px;
	text-decoration:none;
	color: #081052;
	padding: 2px 5px 2px 5px;
	}
	
#sidenav .navheader a:hover {
	font-weight:bold;
	background-color: #ffffff;
	}	
	
#sidenav ul a {
	display: block;
	width: 168px;
	padding: 0 5px 0 5px;
	margin: 0;
	text-decoration:none;
	color: #081052;
	}
	
.navlist a {
	display: block;
	width: 168px;
	padding: 0 5px 0 5px;
	margin: 0;
	text-decoration:none;
	color: #081052;
	}	
	
#sidenav ul a:hover {
	font-weight: bold;
	background-color: #ffffff;
	}	
	
.navlist a:hover {
	font-weight: bold;
	background-color: #ffffff;
	}	

#sidenav ul ul a {
	display: block;
	width: 163px;
	text-decoration:none;
	color: #5a638c;
	padding: 0 0 0 15px;
	margin: 0;	
		}
	
#sidenav ul ul a:hover {
	font-weight:bold;
	background-color:#ffffff;
		}		

.navlistb a {
	display: block;
	width: 163px;
	text-decoration:none;
	color: #5a638c;
	padding: 0 0 0 15px;
	margin: 0;	
	font-size: 90%;
		}
	
.navlistb a:hover {
	font-weight:bold;
	background-color:#ffffff;
		}		
	
#sidenav ul ul ul a {
	display: block;
	width: 153px;
	text-decoration:none;
	color: #5a638c;
	padding: 0 0 0 25px;
	margin: 0;	
		}
	
#sidenav ul ul ul a:hover {
	font-weight:bold;
	background-color:#ffffff;
		}		
		
.navlistc a {
	display: block;
	width: 153px;
	text-decoration:none;
	color: #5a638c;
	padding: 0 0 0 25px;
	margin: 0;	
	font-size: 85%;
		}
	
.navlistc a:hover {
	font-weight:bold;
	background-color:#ffffff;
		}				

#subnav_ocnw ul a  {
	border-bottom: 5px solid #ffffff;
	padding: 3px 6px 3px 6px;
	display: block;
	background-color: #FFBD35;
	width: 168px;
	margin: 0;
	text-decoration:none;
	color: #081052;
	}
	
#subnav_ocnw ul a:hover {
	background-color: #081052;
	color: #FFBD35;
	}
	
	
/* 6.1 CONTENT LAYOUT */

#content {
	margin: 0px 0 0 190px;
	padding: 0;
	position: relative;
	}
	
#col3 {
	float:right;
	clear: right;
	margin: 0 0 0 10px;
	padding: 0;
	}	
	
#col3home {
	float:right;
	clear: right;
	margin: 0 0 0 10px;
	padding: 0;
	}	
	
.rightcol {
	float:right;
	margin: 0 0 0 10px;
	padding: 0;
	text-align: right;
	}		
	

#breadcrumb {
	font-size: 80%;
	margin: 5px 0 5px 0;
	color:  #984E41;
	}
	
#breadcrumb a {
	color: #A9A9ba;
	}	


/* 6.2 CONTENT TEXT STYLES */

#content h1 {
	margin: 10px 0 10px 0;
	padding: 0;
	font-size:200%;
	color:#1079E2;
	}

#content h2 {
	margin: 1.2em 0 10px 0;
	padding: 0;
	font-size: 120%;
	color: #1079E2;
	}

#content h3 {
	margin: 15px 0 10px 0;
	padding: 0;
	font-size: 100%;
	}
	
#content h4 {
	margin: 10px 0 10px 0;
	padding: 0;
	font-size: 100%;
	font-style:italic;
	}	
	
#content h5 {
	font-size: 110%;
	color: #1079E2;
	}
	
.newsitem {
	padding: 0 0 15px 0;
	border-top: 1px solid #cccccc;	
	clear: right;
	}
		
#content p {
	margin: 5px 0 10px 0;
	padding: 0;
	line-height:1.3;
	font-size: 90%;
	}
	
#content .specialworks p {
	margin: 0;
	padding: 0;
	font-size: 90%;
	}
	
#content ul {
	margin: 0 0 11px 20px;
	font-size: 90%;
	list-style-type:square;
	}
	
#content li { 
	margin: 4px 0 4px 15px;
	}	
	
#content ul ul {
	margin: 0 0 11px 30px;
	font-size: 100%;
	}	
	
.thoughtforday {
	border: 1px solid #b7d4fe;
	margin: 0 0 20px 0;
	padding: 0 5px 0 5px;
	color: #1079E2;
	font-size: 90%;
	} 
	
.thoughtforday img {
	margin: 0 0 0 20px;
	clear: right;
	}				
	
#col3 img, .rightcol img  {
	margin: 0px 0 10px 0px;
	padding: 5px 5px 20px 5px;
	border: 2px outset #eeeeee;
	clear: right;
	text-align: right;
	display:block;
	}	
	
.photo {
	margin: 0px 0 10px 20px;
	padding: 5px 5px 20px 5px;
	border: 2px outset #eeeeee;
	clear: right;
}	

.imgleft {
	margin: 0 10px 10px 0;
	}
	
.imgright {
	margin: 0px 0 10px 20px;
	clear: right;
	}	
	
#col3 p {
	text-align:center;
	}	
	
#col3 h4 {
	padding: 0;
	margin: 0;
	}	
	
.seealso {
	width: 182px;
	background-color: #dedede;
	border: 1px solid #AFCDE9;
	padding: 5px;
	color: #1079E2;
	margin: 0 0 10px 20px;
	font-size: 90%;
	text-align:right;
	float: right;
	}
	
.thumb {
	float: left;
	margin: 0px 10px 10px 0px;
	}	
	
.contacts {
	text-align:left;
	padding: 1px 10px;
	margin: 0;
	font-size: 75%;
	}	
	
.contactsheader {
	background-color: #dddddd;
	font-size: 110%;
	padding-top: 2px;
	padding-bottom: 2px;
	}	
	
.contacts p {
	padding: 0;
	margin: 0;
	}	
	
.single {
	padding: 0;
	margin: 0;
	}		
	
tr {
	vertical-align: top;
	text-align:left;
	font-size: 100%;
	}
	
.pdf  {
	display: block;
	background-image:  url(../../images/designimages/pdf.gif);
	background-repeat: no-repeat;
	margin: 0;
	padding: 10px 10px 0 45px;
	height: 30px;
	}

.word  {
	display: block;
	background-image: url(../../images/designimages/word.gif);
	background-repeat: no-repeat;
	padding: 10px 10px 0 45px;
	margin: 0;
	height: 30px;
	}	
	
.excel  {
	display: block;
	background-image: url(../../images/designimages/excel.gif);
	background-repeat: no-repeat;
	margin: 0;
	padding: 10px 10px 0 45px;
	height: 30px;
	}			
	
.centre {
	text-align:center;
	}	

/* 6.3 CONTENT LINKS */


/* 7.1 FOOTER AND DIVIDER BAR */

#footer  {
	clear: both;
	background-color: #1079E2;
	margin: 0;
	border-top: 5px solid #ffffff;
	color: #ffffff;
	position: relative;
	padding: 0 5px 3px 5px;
	font-size: 75%;
	text-align:center;
	}
#divider	{
	margin: 0;
	color: #ffffff;
	padding: 1px 5px 1px 5px;
	background-color: #1079E2;
	font-weight:bold;
	}

#dividerright {
	float: right;
	text-align: right;
	}

/* 7.2 FOOTER AND DIVIDER BAR LINKS */

#footer a {
	text-decoration:none;
	color: #ffffff;
	}
	
#footer a:hover {
	font-weight:bold;
	}
	
#divider a {
	text-decoration:none;
	color: #ffffff;
	}
	
#divider a:hover {
	color: #1079E2;
	background-color:#ffffff;
	}	
	
/* 8.1 HOMEPAGE STYLES */

#boxtable {
	line-height: 1.2;
	vertical-align:top;
	}
	
.boxtop1 {
	background-color:#DB9AE4;
	color: #ffffff;
	font-weight:bold;
	font-size:110%;
	}
	
.boxborder1 {
	border: 2px solid #DB9AE4;
	font-size: 90%;
	}	
	
.boxtop2 {
	background-color:#57DD57;
	color: #ffffff;
	font-weight:bold;
	font-size:110%;
	}
	
.boxborder2 {
	border: 2px solid #57DD57;
	font-size: 90%;
	}	
	
.boxtop3 {
	background-color:#FFBD35;
	color: #ffffff;
	font-weight:bold;
	font-size:110%;
	}
	
.boxborder3 {
	border: 2px solid #FFBD35;
	font-size: 90%;
	}		
	
.boxtop4 {
	background-color:#56A5F3;
	color: #ffffff;
	font-weight:bold;
	font-size:110%;
	}
	
.boxborder4 {
	border: 2px solid #56A5F3;
	font-size: 90%;
	}		

.boxtop5 {
	background-color:#E66467;
	color: #ffffff;
	font-weight:bold;
	font-size:110%;
	}
	
.boxborder5 {
	border: 2px solid #E66467;
	font-size: 90%;
	}		
	
.boxspacer {
	height: 15px;
	}	
	
.boxtop1 a, .boxtop2 a, .boxtop3 a, .boxtop4 a, .boxtop5 a  {	
	text-decoration:none;
	color: #ffffff;
	display: block;
	width: 100%;
	}	
	
	
/* 8.1 SECURE AREA SIDE NAVIGATION */

#rightnav {
	width: 182px;
	background-color: #dddddd;
	border: 1px solid #bbbbbb;
	padding: 0px;
	margin: 5px 0 5px 0;
	font-size: 90%;
	}
	
#rightnav .navheader a {
	display: block;
	width: 172px;
	text-decoration:none;
	color: #081052;
	padding: 2px 5px 2px 5px;
	background-color: #C0C0C0;
	}
	
#rightnav .navheader a:hover {
	font-weight:bold;
	background-color: #ffffff;
	}			
	
.label {
	font-weight: bold;
	line-height: 1.1;
	padding:0;
	margin: 0;
	font-size: 90%;
	}	
	
form {
	padding: 0;
	margin: 5px 4px 5px 5px;
	}

.textfield {
	width: 155px;
	}
	
#rightnav .button {
	width: 50px;
	font-weight:bold;
	float: left;
	margin: 4px 0 6px 0;
	}	
	
#register {
	width: 400px;
	text-align:right;
	}
	
#register input {
	text-align: left;
	}
			
	

.reg {
	font-size: 70%;
	float: right;
	width: 100px;
	margin: 0;
	padding: 0;
	clear: right;
	}	
	
#rightnav ul {
	margin: 20px 0px 5px 0;
	padding: 0;
	list-style-type: none;
	font-size: 90%;
	}	

#rightnav ul ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
	}	
	
#rightnav ul a {
	display: block;
	width: 170px;
	padding: 0px 5px 0px 5px;
	margin: 0;
	text-decoration:none;
	color: #081052;
	}
	
#rightnav ul a:hover {
	font-weight: bold;
	background-color: #ffffff;
	}	

#rightnav ul ul a {
	display: block;
	width: 160px;
	text-decoration:none;
	color: #5a638c;
	padding: 0 5px 0 15px;
	margin: 0;	
		}
	
#rightnav ul ul a:hover {
	font-weight:bold;
	background-color:#ffffff;
		}