body {
	margin: 0px;
	padding: 0px;
	font-size: 10px;
	font-family: Verdana, sans-serif;
	color: #425f62;	
}

h1 { 
    font-size: 200%;
    margin-bottom:0;
    margin-top:10;
    padding:0; 
 } 
 
h2 { 
    font-size: 150%;
    margin-bottom:0;
    margin-top:10;
    padding-bottom:0; 
 }
 
h3 { 
    font-size: 130%;
    margin-bottom:0;
    margin-top:10;
    padding:0; 
 }
 
h4 { 
    font-size: 110%;
    margin-bottom:0;
    margin-top:10;
    padding:0; 
 }

ul {
	margin-top:1em;
	margin-bottom:1em;
	margin-left:1em;
	padding-left:1em;
	list-style-type:square;
}

p, li { 
	margin-top: 0px;
	padding-top: 0px;
	font-size: 130%; 
}


a {
	color:inherit;
}

a:hover {
	color: #000000; 
	background: #f1fafb; }

div#center {
	width: 100%;
	margin-bottom: 10px;	
}






/* Defines the pagelink width and location */

div#mainpage {
	width: 84%;
	right:0;
	background: white;
	float: right;
}

div#facts {
	width: 19%;
	float: right;
}

 
 div#theInfo { 
     float: left;
     width: 79%; 
     margin-right:2px;
     margin-left:10px; 
 } 
 
 
div#productInfo {
 	clear:both;
 	width:100%;
 }
 
/*
This side menu has a pop out tool tip, which is embedded within a span
element inside of the link.

To ensure that the tool tip displayed relative to the menu item, you have
to do a little trick to prevent the menu item expanding.
	make the a:hover have position:relative
This then acts as the anchor point for future embedded elements,
hence, the span element will display next to the anchor point
*/


div#links {
	float: left;
	position: relative;
	margin-left:2px;
	top: 0px;
	left: 0px;
	width: 14%;
		}

div#links a {
	font-size: 130%;
	display: block; 
	text-align: center; 
	padding: 10px;  
	margin: 0 0 1px; 
	BORDER-RIGHT: 3px solid #9ADDE4; 
	BORDER-LEFT: 3px solid #9ADDE4; 
	text-decoration: none; 
	color: inherit;
	background: #cceef1; 
	width:100%;}

div#links a:hover {
	color: #000000; 
	background: #f1fafb; 
	position:relative;}
 
div#links a span {
	display: none; }

div#links a:hover span {
   display: block;
   position:absolute; 
   top: 5px; 
   left: 100%; 
   width: 125px;
   padding: 10px; 
   margin: 0px; 
   z-index: 100;
   background: #cceef1;
   color: #000000; 
   text-align: center;
 }
 
.rightHandBox {
 	margin-right:2px;
	MARGIN-BOTTOM: 4px;
	BORDER-LEFT: 3px solid #9ADDE4;
	BORDER-RIGHT: 3px solid #9ADDE4;
	width: 95%;
	float:right;
	position: relative;
	background: #cceef1;
	display: block;	
	overflow: hidden;
	color: #425f62;	
 }

   
/* Right Boxes*/
div#specialOffer {	
	color: red;
	text-align: center;	
}

div#specialOffer h1 {
	margin-top: 0;
	margin-bottom: 0;
	padding-top:0; 
	padding-bottom:0; 
	color: inherit;	
}

div#specialOffer p {
	margin: 0px 0px 0px 0px;
	padding:0; 
	color: inherit;	
}


div#contactDetails p {
	margin-left: 0px;
	margin-top: 0px;	
	color: inherit;
}

div#contactDetails a {
	font-size: 130%;
	margin-left: 0px;
	margin-top: 0px;	
	color: inherit;
}

div#contactDetails a:hover {
	color: #000000; 
	background: #f1fafb; }

div#contactDetails h3, div#contactDetails h2, div#contactDetails h1 {
	margin: 0px 0px 0px 0px;
	color: inherit;
}



div#contactDetails2 p {
	margin-left: 0px;
	margin-top: 0px;	
	color: inherit;
}

div#contactDetails2 a {
	font-size: 130%;
	margin-left: 0px;
	margin-top: 0px;	
	color: inherit;
}


div#contactDetails2 a:hover {
	color: #000000; 
	background: #f1fafb; }

div#contactDetails2 h3, div#contactDetails2 h2, div#contactDetails2 h1 {
	margin: 0px 0px 0px 0px;
	color: inherit;
}

div#topRightHandSide {
	float:right;
	width:89%;
}

div#topRight {
	float:right;
	position: relative;
	width:10%;
	
}


div#topLeft {
	float:left;
	position: relative;
	width:10%;
}

div#topTitle {
	float:left;
	position: relative;
	text-align: center;	
	width: 89%;
}

div#top {
	width:100%;
}



div#banner {
	background: #cceef1;
	font: bold; 
	font-size: 150%;
	text-align: center;
	margin-bottom: 4px;
	margin-top: 2px;
	color: #425f62;
}

div#banner a {
	font-size: 100%;
	color: #425f62;
	
}

div#banner a:hover {color: #000000; 
	background: #f1fafb; 
	position:relative;}