/* style */

body {
min-width: 630px;      
background-color: #fff;
text-align:left; 
font-family: verdana, arial, sans-serif; 
line-height: 140%;  
font-size: 80%;
color: #666; 
margin:10px 0;}

p {margin-top:0; margin-bottom:1em;}
h5 { color: #018B98; margin-top:0em;}
h4 { color: #018B98; margin-top:1em;}
h3 { color: #018B98; margin-top:1em;}
h2 { color: #018B98; margin-bottom:1em; line-height: 120%;  }
h1 {letter-spacing:4px; color: #018B98; margin-bottom:1em;}
a:link, a:visited, a:active {color: #03c; text-decoration:none;}
a:hover {color: #036; 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;}
.rover { background-color:#009AE7; color: #fff; width:288px; float:right; padding:2px; margin:4px; text-align:center; }
.traintimes { background-color:#018B98; color: #fff; width:285px; float:right; padding:2px; margin:4px; text-align:center; }
.railcard { background-color:#fff; color: #018B98; width:102px; float:right; padding:2px; margin:4px; text-align:center; }
#littletrains  { background-color:#018B98; color: #fff; width:300px; float:right; padding:2px; margin:4px; text-align:center; }
.trailways { background-color:#018B98; background-image: url (i/Cambrian_Trailways.jpg); color:#fff; width:175px; float:right; padding:5px; margin:4px;}
.special {font-weight:bold; color:#933;
font-size: 120%; }

.specialh {font-weight:bold; color:#933;
font-size: 100%; }
#player1{width:100%; height:100%;}

/* 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 */

#box {
border-width: 1px;
border-style:outset;
border-color: #018B98;
height:65px;}

#banner {
height:188px;
margin:0;
border-top-width: 1px;
border-right-width: 1px;
border-bottom-width: 0px;
font-size:.7em;
}

/*** 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: #fff;
width:750px;
}

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

#block1 .inner {
margin:0 0 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 {
clear:both;
padding:10px 0px 5px 0px;
font-size:.8em;
text-align:center;
background-color: #018B98;
color: #fff; 
margin-top: 10px;
border-top-width: 10px;
border-style:outset;
border-color: #fff;
border-left-width: 0px;
border-right-width: 0px;
border-bottom-width: 0px;
}

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

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

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

a.menu  {color: #fff;  font-size:11pt; padding:1px;}
a.menu:hover {color: #036; font-size:11pt; padding:1px;}

#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: #018B98 url(../i/g.gif) 3px 50% no-repeat;
color:#FEEE75;	/* 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:#FEEE75 url(../i/g2.gif) 3px 50% no-repeat; font-family: Verdana, Arial, Helvetica, sans-serif; color: #036;  text-decoration: none; 		
}
