/*First off set the body margins and page background colour*/
body 
{
	margin: 0px;
	background: #fff url("Untitled-1.gif") repeat-x;
	font-family: Verdana, Arial, Helvetica, sans-serif;
}
.Largeredwriting18ths 
{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: xx-large;
	color: #FF0000;
}
.HiddenText
{
	color: #FFFF66;
}
.Menutext 
{
	font-size: 14px;
	color: #000000;
}

/*next Fonts are defined*/
.StandardText 
{
	font-size: 16px;
	color: #000000;
}

.DText
{
	font-size: 12px;
	color: #000000;
}

.buttons a 
{
	font-family:Arial, Helvetica, sans-serif;
	font-weight: bold;
	text-decoration:none;
	height:29px;
	width:148px;
    text-align:center;
	margin-left:7px;
	margin-right:8px;
	margin-top:5px;
  	padding-top:10px;
    color:black;
    display:block;
    background: url("button.gif") no-repeat;
	font-size:14px;
}

.buttons a:hover 
{
   	background: url("button.gif") 0 -39px no-repeat;
}
/*Here i set the positions and attributes of the div tags
cenrepage makes the entire website centered on the users screen and puts margins down either side*/
#centrepage
{
	margin-right: auto;
	margin-left: auto;
	position: relative; 
	width: 800px; 
	height: auto; 
	visibility: visible; 
	display: block 
}
/*W3C sets the location of the W3C logo */
#W3C	
{
	float:left;
	position:absolute;
	margin-left: 40px;
	bottom: 15px;
}
/*content sets the location of the main page along with how big the scrolling div should be. */
#content
{
	position:absolute;
	width :627px;
	margin-left:165px;
	padding:4px;
	float:left;
	left:0px;
	top:88px;
}
/*menu sets the location of the menu and also adds the background to it and borders */
#menu	
{
	position:absolute;
	float:left;
	height:480px;
	width:163px;
	padding-bottom:10px;
	background-color:#FFFF99;
	border-bottom:#000000 1px solid;
	border-left:#000000 1px solid;
	border-right:#000000 1px solid;
	display:block;
	left:0px;
	top:88px;
}
#frame 
{
	position:absolute;
	width :635px;
	height :490px;
	overflow:auto;
	margin-left:165px;
	float:left;
	left:0px;
	top:88px;
}
.image
{
	margin:5px;
	position:relative;
	float:left;
	width:280px;
}
.image img
{
	width:280px;
	border:0px;
}
.image span.titles 
{
	background:black none repeat scroll 0% 0%;
	bottom:0pt;
	color:white;
	display:block;
	font-size:0.8em;
	font-weight:bold;
	opacity:0.8;
	padding:5px 0px;
	position:relative;
	right:0pt;
	width:280px;
	z-index:2;
}
.image:hover span.titles 
{
	opacity:1;
}
.image a:hover img 
{
	opacity:0.7;
}