body {
	margin: 0;
	padding: 0;
	text-align: center;
	color: #000;
	background: #FFF;
	font: 80%/1.6 Verdana, Arial, Helvetica, sans-serif;
	/*-- background-image: url(../DesignImages/back.gif); --*/
}

.skipper {display: none;}
#extraText {display: none;}
a {text-decoration: underline;}
a:link {color: #4C5A83;}
a:visited {color: #4C5A83;}
a:hover {text-decoration: underline;}
#container {	width: 780px;	/*-- use if centered first figure is top margin change to suit --*/margin: 0 auto 0; 
padding: 0;	text-align: left; background: url(../DesignImages/contentBackground.jpg) 0 0px repeat; 
	}

#pageHeader { background: url(../DesignImages/TopBanner2.jpg) top left no-repeat;	height: 170px; width: 780px; margin: 0 0 0 0; padding: 0 0 0 0; }
#pageHeader h1 {
/*-- do not remove or change padding and margin --*/ padding: 0 0 0 0; margin: 0 0 0 0; }
#pageHeader h1 span {visibility: hidden;/*-- do not remove or change padding and margin --*/ padding: 0 0 0 0; 	margin: 0 0 0 0; }

#interfaceImage{ position:relative; text-align:left; padding: 0 ; margin: 0 0 0 40px; width:500px; }
#interfaceImage img{ position:relative; top: 0; left: 0; }
#wrapper {padding: 0; margin: 0;  }
#spacer { clear:both; padding: 0; margin: 0; }
#main { padding: 0; margin: 0; background: url(../DesignImages/maincontentBackground1.jpg) 100% 100% no-repeat;}






/*-- Next controls page layout and sets column and content widths --*/

#QPpageContent {float:right;/* width of main content area - set margin-right of left panel to same width--*/
width:72%; color: #000; position:relative; 
/*-- background image for behind content --*/
/*-- background: url(../DesignImages/maincontentBackground.jpg)  top right no-repeat; --*/
}
.ContentArea td{
font-size: .8em; }
#contentMain { }
#QPpageContent p {}

#QPpageContent h2 {
	font-size: 1.2em; 	color: #C41F39; 	font-family: Arial, Helvetica, sans-serif;
	font-weight:900;
	padding-top: 0; margin-top: 5px; padding-left: 0px;  letter-spacing: 2px;}
/*-- dont need to edit these h3 h4 h5 h6--*/
#QPpageContent h3 {	font-size: 1em; color:  #C41F39;}
#QPpageContent h4 {	font-size: 1em; color: #000; }
#QPpageContent h5 {	font-size: 1em; color: #000; margin: 0;}
#QPpageContent h6 {	font-size: 0.9em; color: #000;}
	
	
/*-- content area --*/

.ContentArea {
 padding: 0px 60px 20px 0px; float: left; }
.ContentArea p{ text-align:left;  padding-top:0;  vertical-align:top; height:auto; }
/* \*/
* html .ContentArea {
	overflow: hidden;
	o\verflow: visible;
	width: 100%;
	w\idth: auto;
	he\ight: 1%;
}

/* */  

.ContentArea ul { list-style: none; margin: 0; padding: 0 0 0 0}
.ContentArea li { margin: 0px; padding: 0px 0 8px 20px; color:#000; font-size: 1em;  background:url(../DesignImages/iconBullet.gif)  0 0 no-repeat; }
.ContentArea li a {color:#cc0000; padding: 0px 0 8px 10px;  margin: 0; width:280px; display:block;
background:url(../DesignImages/icon.gif)  0 0 no-repeat; text-decoration:none; font-weight:bold; font-size: .8em; letter-spacing:1px;}
	.ContentArea li a:link {color:#cc0000; padding: 0px 0 8px 10px;  margin: 0; 
background:url(../DesignImages/icon.gif)  0 0 no-repeat; text-decoration:none; font-weight:bold; font-size: .8em; letter-spacing:1px;}
	.ContentArea li a:active {color:#cc0000; padding: 0px 0 8px 10px;  margin: 0; 
background:url(../DesignImages/icon.gif)  0 0 no-repeat; text-decoration:none; font-weight:bold; font-size: .8em; letter-spacing:1px;}
	.ContentArea li a:hover {color:#cc0000; padding: 0px 0 8px 10px;  margin: 0; 
background:url(../DesignImages/icon.gif)  0 0 no-repeat; text-decoration:none; font-weight:bold; font-size: .8em; letter-spacing:1px;}
.ContentArea li a:visited {color:#cc0000; padding: 0px 0 8px 10px;  margin: 0; 
background:url(../DesignImages/icon.gif)  0 0 no-repeat; text-decoration:none; font-weight:bold;font-size: .8em;  letter-spacing:1px;}


.ContentArea p strong{ color:#000; }

strong{ color:#000; }
.contentPicBox { margin-bottom: 0; display: block;
	/*-- use this style to float the text around the image i.e. float: left; --*/
	float: left; }
.contentPicBox img{ margin: 0 0 20px 0 ; border: 0 solid #7E604E;
/*-- use margin to create space around the image --*/
margin-right: 20px; padding-left:0; }
.contentPicBox span{ margin-bottom: 20px; }
/*-- image border is for gallery detail page images --*/
.ImageBorder { border: 1px solid #000 }
/*--more link style below--*/
.contentPic a{ 	padding-left:0; border-color: #000; border-style: solid; border-width: 1px; padding:0px 2px 0px 2px; text-decoration: none; }
.contentPic span{ margin-bottom: 0px; font-size:9px; }


/*-- nav panel --*/


#navPanel { margin-right:72%;  padding: 1px 0 1px 0;}
#leftpannel { 
/*-- set to control column width width --*/ margin-right:72%;
/*-- this must be set to ensure hover links work on page content  width: 160px;--*/
/* line-height: 1px; helps out IE 5.01 pc */
/*-- do not change position --*/ position:relative; top: 0; 
/*-- use to set background image behind nav panel 
	background-image:url(../DesignImages/button1.jpg); background-position:top left ; 	background-repeat:no-repeat; --*/
	padding: 0 0 0 0;
/*-- can use margin to set the possition of the navigation--*/
	margin-top: 0 ;
	margin-bottom: 0;
	margin-left: 0;
	background-color: transparent;}
	
#leftpannel .menuBase {
	background-image:url(../DesignImages/navBase.jpg); background-position:bottom left ; background-repeat:no-repeat; 
	padding: 10px 0 0 0; background-color: transparent; }

/* button styles */
.NavList {  }
.NavList ul { list-style: none;	margin: 0 ; padding: 0; background-color:transparent; width: 170px; background-image: url(../DesignImages/navBack.jpg) top left repeat-y  ;}
.navlist li { list-style: none; margin:0; padding:0; }
.navlist a {width: 99%;  /* only required for IE */}
.NavList a { voice-family: "\"}\"";
voice-family: inherit;
width: 150px; margin:0 0 -1px 0  ;
/* Tantek-hack should only used if Internet-Explorer 6 is in standards-compliant mode */
}
#leftpannel>#NavList a
{
width: auto; 
/* necessary due to the use the hacks above for the Internet Explorer */
}

.NavList li a{
	display: block; letter-spacing: 2px;
	text-decoration: none; 	color: #666;
	font-weight:bold;
	padding: 5px 10px 8px 25px; 
	padding: 0;  text-align:left;  font-size: 0.8em; 
	
}




/*-- remove navList styles below adjust above style and then duplicate to create a:link a:visited a:hover---*/
.NavList li a:link{
	display: block; text-decoration: none; color: #C41F39; font-weight:bold;
	background:  url(../DesignImages/buttonbase2.gif) 0 100% no-repeat; 
	padding: 5px 10px 8px 25px; 
	}
* html .NavList li a:link {   width:150px; /*-- IE width fix --*/
}
.NavList li a:visited{ display: block; text-decoration: none; color: #C41F39; font-weight:bold;
	background:  url(../DesignImages/buttonbase2.gif) 0 100% no-repeat; 
	padding: 5px 10px 8px 25px; 
	}

.NavList li a:hover{ color:#000000;}
/* sub nav */
.NavList li.sub{
font-style: normal;
}
.NavList li span{
}

	.NavList li.sub a:link{ visibility:hidden; padding:0; line-height:1px;}
.office .NavList li.sub a:link{ visibility:visible; line-height:15px;
	color: #807F83; padding: 5px 25px 10px 25px; margin:0 ;}
	
.NavList li.sub a:visited{ visibility:hidden; padding:0; line-height:1px;}
.office .NavList li.sub a:visited{ visibility:visible; line-height:15px;
color: #807F83; padding: 5px 25px 10px 25px; margin:0 ; }

.NavList li.sub a:hover{ visibility:hidden; padding:0; line-height:1px;}
.office .NavList li.sub a:hover{ visibility:visible; line-height:15px;
color: #807F83; padding: 5px 25px 10px 25px; margin:0 ; }

.NavList li.sub a:active{  visibility:hidden; padding:0; line-height:1px;}
.office .NavList li.sub a:active{ visibility:visible; line-height:15px;
color: #807F83; padding: 5px 25px 10px 25px; margin:0 ; }
/*-- image possition below menu i.e.logo --*/
.belowMenu { clear:left; 
height:100px;
padding: 0; margin: 0;}
/*-- footer --*/
 
#footer { clear:both; text-align:left; 	margin: 0  0 0 0;
height: 40px;
	/*-- footer text possition --*/ padding: 10px 40px 0px 220px; 	font-size:10px;
	/*-- footer background image --*/ background: url(../DesignImages/BottomBar.gif) left top no-repeat;}

#footer span {
/*-- footer text colour spacing ect --*/
color:#828282; padding-right: 20px; text-align:right; }
#footer span a {
/*-- footer text link colour spacing ect --*/
color:#828282; padding-left: 60px; padding-right: 20px; text-align:right; }
#footer p {margin: 0; padding: 0; border: 1px solid yellow;}
/*-- Print link --*/
#print { float: right; padding:0 40px 20px 20px; background: url(../DesignImages/icon-print-file.gif) 0 0 no-repeat; }
/*-- image gallery --*/
#gal {


}
#gal img{

}
.galpicarea {
border: 1px solid #cccccc;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size:10px;
padding:0;
margin:0;


}
.galpicarea td{
padding:20px 20px 0 20px;

}
.Image {

}
.galpicarea img{
vertical-align:top;
border: 1px solid #cccccc;

}
.galpicarea ul{
	list-style-type: none;
	padding:0;
	margin:0;



}
.galpicarea td ul li{
display:block; 
	text-align:left;
}

.galfooter {
clear:both; 
padding-top: 20px;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:80%;
text-align:right;}

/*-- Form --*/

#form {
margin:6px 0;
}
#form td{
margin:6px 0;
font-size: 12px;
padding:4px 4px 4px 4px;
vertical-align:top;
}
.FormSubmitButton {
margin: 10px 10px 10px 10px;
}
#emailLinkArea {
position:relative; width:250px; height:20px; z-index:1; left: 500px; top: 122px;
}
table {
border: 1px solid #FFF;
padding: 2px }

/*-- Extra divs --*/
#extraDiv1 { position: relative; padding: 0;
/*-- use if centered first figure is top margin change to suit --*/left:  520px;
top: 223px;


}

#extraDiv1 a { 
font-weight:bold;
color: white;
font-size:9px;
}

