/* style */

body {
min-width:630px;
  
 
background-color: #666;
text-align:center; 
font-family:verdana, arial, sans-serif; 
line-height: 140%;  
font-size: 80%;
color: #603; 
margin:10px 0px;}
p {margin-top:0;  margin-bottom:1em;}
p.rightmargin { margin-right: 5em; } 
h5 { color: #603; margin-top:0em;}
h4 { color: #603; margin-top:1em;}
h3 { color: #603; margin-top:1em;}
h2 { color: #603; margin-bottom:1em; line-height: 120%;  }
h1 {letter-spacing:4px; color: #603; margin-bottom:1em; font-size:250%; }
a:link, a:visited, a:active {color: #006; text-decoration:none;}
a:hover {color: #990066; text-decoration:none;}
ul {  margin-left:25px;}
ol {  margin-left:25px;}

.red  {color:#933;}
.w  {color:#fff;}
.terms {font-size:smaller;}
.quote {font-style:italic; float:right;}
.i {font-style:italic;}
.b {font-weight:bold;}
.q {border-width: 1px; border-style:inset; border-color: #FFF374; width:180px;}
.bold {font-weight:bold; color: #018B98;}
.border {border-width: 1px; border-style:outset; border-color: #036;}

/* positioning ================= for fixed width centred box design */
* { margin:0; padding:0; }
html { height:100.2%; }
.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden; }

/*** Banner */

#banner {
text-align:left; 
padding:20px;
background-color:#ccc;
}

/*** Layout */

#pg-wrap:after {content: '[DO NOT LEAVE IT IS NOT REAL]'; display: block; height: 0; clear: both; visibility: hidden;}
#pg-wrap {margin:0 auto;background-color: #ccc;width:755 px;text-align:left; border-width: 1px; border-style:inset; border-color: #333;}
.box2 {background-color: #ccc; width:100%; margin:0px;text-align: left; padding:10px 0px 0px 0px; border-top: #333 1px solid;  }
.box3 {background-color: #fff; width:100%; margin:0px; text-align: left; padding:10px 0px 0px 0px; border-top: #333 1px solid;  }
.br {background-color: #fff; padding:10px 10px 10px 40px; text-align: left; border-bottom: #333 1px solid; border-top: #333 1px solid;  }
.br2 {background-color: #fff; padding:10px 10px 10px 40px; text-align: left;  }

/*
#block1 {
float:left;
width:100%;
margin:0;
}

#box2 .inner {
margin:0 200 0 200px;
padding:20px;
}

#col3 #block1 .inner {
margin-right:150px;
}

#block2 {
float: left;
margin-left:-150px; 
width: 150px;
}

#block3 {
float:left;
margin-left:-100%;
padding: 0px 20px 0px 10px;  
width:170px;
border-width: 0px 1px 0px 0px;  
border-style: dotted;
border-color: #333;
}

*/
#foot {
padding:10px 0px 5px 0px;
font-size:.8em;
text-align:center;
background-color: #ccc;
color: #603;
}

/* main-menu ========== */

#main-menu ul {
list-style:none;		/* removes bullets */
margin:0;
 padding:0px;
 border-width: 1px; border-style:outset; border-color: #333;
}

#main-menu li {
line-height:normal;
font-size:10pt;
 margin-left:0px;
}


#main-menu li a {
display:block;
padding:3px 4px 3px 25px;	/* the last number (16px) must be big enough to accomodate the width of your rollover image */
margin-bottom:0px;
/* you can change background color of button here (#ddd). the pixel measurement (3px) is x-axis of your rollover image */
background: #fff url(../i/g.gif) 3px 50% no-repeat;
color:#039;	/* color of button text */
text-decoration:none;
}

/* nasty hack for IE/pc (you must leave all of this in including comments)*/
/* hide from Mac IE \*/
* html #main-menu li a {
height:1%;
}
/* end hack */

/* the magic bit */
#main-menu li a:hover {
/* this line MUST be the same as the one above except with your rollover image in it instead */
background:#603 url(../i/g2.gif) 3px 50% no-repeat;  color: #fff;  text-decoration: none; 		
}