/* 
dark blue: #000073
dark teal #055654
teal #017572
undercolour #CFE5E4
*/

/* kludge for FF scroll bar with min-height in body */
html {height: 100%;} 

/* body */
.main {
	background-color: #E5F1F0;
	SCROLLBAR-FACE-COLOR: #017572;
	SCROLLBAR-HIGHLIGHT-COLOR: #ffffff;
	SCROLLBAR-SHADOW-COLOR: #ffffff;
	SCROLLBAR-ARROW-COLOR: #CFE5E4;
	SCROLLBAR-BASE-COLOR: #017572;
	margin-top:20px;
	text-align: center;
	min-height: 100%;
}


/* popup body */
.popup {
	background-color: #E5F1F0;
	SCROLLBAR-FACE-COLOR: #017572;
	SCROLLBAR-HIGHLIGHT-COLOR: #ffffff;
	SCROLLBAR-SHADOW-COLOR: #ffffff;
	SCROLLBAR-ARROW-COLOR: #CFE5E4;
	SCROLLBAR-BASE-COLOR: #017572;
	margin-top:20px;
	margin-left: 20px;
	font-family:  Verdana, Helvetica, sans-serif;
	font-size: 90%;
}

/* sets main centering;this and body definition get around IE 5.5. bug */

#main {
	width: 900px;
	margin-left: auto;
	margin-right: auto;
	position: relative;
	z-index: 2;
	font-family:  Verdana, Helvetica, sans-serif;
	font-size: 100%;
	color: #055654;
	font-weight: normal;
	text-decoration: none;
	height: 552px;
}

/* page elements */
#BgndCog {
	position:absolute;
	width:880px;
	height:115px;
	z-index:101;
	visibility: visible;
	left: 0px;
	top: 15px;
	background : url("img/bgnd_cog.jpg") no-repeat;
}

#LeftBar {
	position:absolute; 
	left:100px; 
	top:0px; 
	width:15px; 
	height:540px; 
	z-index:1004; 
	background-color: #017572; 
	layer-background-color: #017572; 
	visibility: visible; 
	border: 1px none #000000;
}

#BottomBar {
	position:absolute; 
	left:100px; 
	top:535px; 
	width:600px; 
	height:10px; 
	z-index:1005; 
	background-color: #017572; 
	layer-background-color: #017572; 
	visibility: visible; 
	border: 1px none #000000;
}

#Undercolor {
	position:absolute; 
	left:0px; 
	top:80px; 
	width:880px; 
	height:485px; 
	z-index:102; 
	background-color: #CFE5E4; 
	layer-background-color: #CFE5E4; 
	border: 0px none #DAEAF2; 
	visibility: visible;
}

#PhotoBox {
	position:absolute; 
	left:679px; 
	top:297px; 
	width:217px; 
	height:285px; 
	z-index:1003; 
	visibility: visible; 
	text-align:left;
}


#BBPhotoBox {
	position:absolute; 
	left:644px; 
	top:236px; 
	width:217px; 
	height:285px; 
	z-index:1003; 
	visibility: visible; 
	text-align:left;
}


/* logo */
#LogoBox {
	left:270px; 
	top: -13px;
	position:absolute; 
	width:466px; 
	height: 65px; 
	z-index:5013;  
	border: 1px none #000000; 
	visibility: visible; 
	text-align:left; 
	overflow: auto;
}
.logo {
	font-size: 300%;
	color: #00448F;
	text-align: left;
	background : transparent;
}

/* strapline */
#Strapline {
	position:absolute; 
	left:618px; 
	top:36px; 
	width:280px; 
	height:33px; 
	z-index:5011; 
	visibility: visible; 
	text-align:left; 
	overflow: auto;
}
.strap {
	font-size:135%;
	color: #00448F;
	text-align: left;
	background : transparent;
}
#StraplineUnder {
	position:absolute; 
	left:617px; 
	top:37px; 
	width:280px; 
	height:33px; 
	z-index:5007; 
	visibility: visible; 
	text-align:left; 
	overflow: auto;
}
.strapunder {
	font-size:135%;
	color: #CFE5E4;
	text-align: left;
	background : transparent;
}


/* MENU CODE  */

#MainMenu {
	position:absolute; 
	left:101px; 
	top:108px; 
	z-index:5001; 
	width: 171px; 
	height: 261px; 
	text-align: left; 
	border: 1px none #000000; 
	text-align:left; 
	padding-right:5px; 
	overflow: auto; 
	visibility: visible;
	background : transparent;
}
/* active indicator cell  */
.indicatoractive {
	font-size: 80%;
	color: #CFE5E4;
	font-weight: normal;
	text-decoration: none;
	text-align: left;
	background : #017572;
	border: #CFE5E4 1px solid;
	padding-right:1px;
	padding-bottom:1px
}

/* sub menu active indicator cell  */
.subindicatoractive {
	font-size: 80%;
	color: #017572;
	font-weight: normal;
	text-decoration: none;
	text-align: left;
	background : #CFE5E4;
	border: #017572 1px solid;
	padding-right:1px;
	padding-bottom:1px
}

/* spacer cell  */
.empty {
	font-size: 60%;
	color: #00448F;
	text-align: left;
	background : transparent;
}
/* current page cell  */
.cellactive {
	font-size: 80%;
	color: #017572;
	font-weight: normal;
	text-decoration: none;
	text-align: left;
	background : #CFE5E4;
	border: #017572 1px solid;
	padding-left:5px;
	padding-right:5px;
}
/* current page text  */
.nameactive {
	font-size: 100%;
	color: #017572;
	font-weight: normal;
	text-decoration: none;
	text-align: left;
	background : #CFE5E4;
}

/* inactive indicator cell  */
.indicator {
	font-size: 80%;
	color: #CFE5E4;
	font-weight: normal;
	text-decoration: none;
	text-align: left;
	background : transparent;
	border: #017572 1px solid;
	padding-right:1px;
	padding-bottom:1px
}

/* menu items */
a {
	font-size: 80%;
	font-style:normal;
	color: #CFE5E4;
	font-weight: normal;
	text-decoration: none;
	background : #017572;
	padding-left:5px;
	padding-right:5px;
	border: #017572  solid;
	width: 100%;
	border-bottom : 0px;
	border-left : 1px;
	border-right : 1px;
	border-top : 1px;
}
/* menu items hover */
a:hover
{
	font-size: 80%;
	font-style:normal;
	color: #017572;
	font-weight: normal;
	text-decoration: none;
	background : #CFE5E4;
	padding-left:5px;
	padding-right:5px;
	border: #017572 1px solid;
	width: 100%;
}
/* background colour for inactive menu items */
.greencell
{
	background : #017572;
}

/* END MENU CODE  */


/* small text for footers etc  */
.small {
	font-size: 70%;
	color: #CFE5E4;
	font-weight: normal;
	text-decoration: none;
	text-align: left;
	background : transparent;
}

.small:hover {
	font-size: 70%;
	color: #CFE5E4;
	font-weight: normal;
	text-decoration: none;
	text-align: left;
	background : transparent;
	border: #017572 0px solid;
}

/* standard text  */
p {
	font-size: 80%;
	color: #055654;
	text-align: left;
	background : transparent;
}



blockquote {
	font-size: 80%;
	color: #055654;
	text-align: left;
	background : transparent;
	margin-left: 15px;
}

/*  lists  */
ul {
	font-size: 80%;
	color: #055654;
	text-align: left;
	background : transparent;
	margin-top: 7px;
	margin-bottom: 17px;
}

li {
	margin-left: 10px;
}

.spacedlist {
	color: #055654;
	text-align: left;
	background : transparent;
	margin-top: 7px;
	margin-bottom: 7px;
}


/* quote box and text  */
#QuoteBox {
	position:absolute;
	left:679px;
	top:108px;
	width:217px;
	height: auto;
	z-index:5022;
	visibility: visible;
	text-align: left;
	background : #017572;
	overflow: auto;

	}
.quote
 {
	font-size: 70%;
	color: #CFE5E4;
	margin : 5px 5px 5px 5px;
}


/* used for more and back buttons */

.formbutton {
	font-size: 70%;
	font-weight: normal;
	color : #CFE5E4;
	border-top : 1px solid #858383;
	border-right : 2px solid #055654;
	border-bottom : 2px solid #055654;
	border-left : 1px solid #858383;
	background-color: #017572; 
	font-family:  Verdana, Helvetica, sans-serif;
}

.backbutton {
	font-size: 70%;
	font-weight: normal;
	color : #017572;
	background-color: #CFE5E4; 
	font-family:  Verdana, Helvetica, sans-serif;
	border-top : 1px solid #017572;
	border-right : 1px solid #017572;
	border-bottom : 1px solid #017572;
	border-left : 1px solid #017572;
}


/* h4 and tight used for example products */

h4 {
	color: #017572; 
	margin-bottom : 4px;
}

.tight {
	font-size: 80%;
	color: #055654;
	text-align: left;
	background : transparent;
	margin-top : 5px;
}

/* tight versions used for around lists */

.tighttb {
	font-size: 80%;
	color: #055654;
	text-align: left;
	background : transparent;
	margin-bottom : 5px;
	margin-top : 10px;
}

.tightb {
	font-size: 80%;
	color: #055654;
	text-align: left;
	background : transparent;
	margin-bottom : 5px;
}
/* form elements */

.formfields {
	font : normal 11px Verdana, Arial, Helvetica, sans-serif;
	color : #055654;
	border-top : 1px solid #055654;
	border-right : 1px solid #055654;
	border-bottom : 1px solid #055654;
	border-left : 1px solid #055654;
	background : transparent;
}
.formcopy {
	font-size: 80%;
	color: #CFE5E4;
	text-align: right;
	background : #017572;
	font-style: normal;
	padding-top: 5px;
	padding-right: 0px;
	padding-bottom: 2px;
	padding-right: 5px;
	font-weight: normal;
}

.formcopynopad {
	font-size: 80%;
	color: #055654;
	text-align: left;
	background : #CFE5E4;
	font-style: normal;
	padding-top: 5px;
	padding-right: 0px;
	padding-bottom: 0px;
	font-weight: normal;
	}

.formresults {
	font-size: 80%;
	color: #055654;
	text-align: left;
	background : transparent;
}

/* in page link*/
#bodylink {
	font-size: 100%;
	font-style:normal;
	color: #017572;
	font-weight: normal;
	text-decoration: none;
	background: #CFE5E4;
	padding-left:0px;
	padding-right:0px;
}
#bodylink:hover {
	font-size: 100%;
	font-style:normal;
	color: #017572;
	font-weight: normal;
	text-decoration: underline;
	background: #CFE5E4;
	border: #017572 0px solid;
	padding-left:0px;
	padding-right:0px;
}

/* about page link*/
.aboutlink {
	font-size: 100%;
	font-style:normal;
	color: #017572;
	font-weight: normal;
	text-decoration: none;
	background: #CFE5E4;
	padding-left:0px;
	padding-right:0px;
	width: 170px;
}
.aboutlink:hover {
	font-size: 100%;
	font-style:normal;
	color: #017572;
	font-weight: normal;
	text-decoration: underline;
	background: #CFE5E4;
	border: #017572 0px solid;
	padding-left:0px;
	padding-right:0px;
}