/*** General default settings first ***/
* {margin: 0; padding: 0;}

h1, h2, h3, h4, h5, h6, pre, p, blockquote, ul, ol, dl, fieldset, address, form
{ margin: .5em 5%; } 

li, dd { margin-left:5%; }

fieldset { padding: .5em; }
	
img {border: 0; }

a:link {
color: #000066;
font-weight: 700;
text-decoration: none; 
}

a:visited {
color: #663366;
font-weight: 700;
text-decoration: none; 
}

a:focus, a:hover, a:active {
color: #CC0000;
font-weight: 700;
text-decoration: none; 
}

body {
margin: 0;
padding: 0;
font-family: Verdana, Arial, Helvetica, sans-serif;
background-color: #cccccc; 
word-spacing: 0.1em;
text-align: center;
}

/*** Getting consistent text sizes across browsers (IE5) ***/
body { font-size: 82%; }
/* Resets 1em to 12px - more or less. The more accurate value of 80% can cause a small gap at the bottom of the mainbox (due to rounding errors?)*/

h1 { font-size: 200%; font-weight: 700; color: #660099; text-align: center}
h2 { font-size: 150%; font-weight: 400; }
h3 { font-size: 125%; font-weight: 700; }
h4 { font-size: 100%; font-weight: 700; }
h5 { font-size: 125%; font-weight: 700; color: #660099; text-align: center}
h6 { font-size: 80%; font-weight: 700; }
/* Headers sized taking body font-size into account to give equivalent to 150%, 120%, 100%, 80%, 70%, 64%. */

pre {font-size: 100%;}
/* To stop pre being too small */

/*** Layout stuff ***/
.centerpage {
width: 90%;
margin: 0 auto;
text-align: left;
background-color: #ffffff;
border: 2px solid #000000;
}

.header {
padding: 1em .5em;
margin: 0 1px 0 9em;
border-left: 2px solid #000000;
border-bottom: 2px solid #000000;
background-color: #cccccc;
color: #000000;
}

.footer {
padding: .5em;
border-top: 2px solid #000000;
background-color: #ffffff;
color: #000000;
}

/* Hide hack from IEmac \*/
* html .footer {height: 1%;}
/* End hide hack from IEmac */

.leftbox {      
/* No side padding or borders to avoid IE5 box model problem */
position: absolute;
margin-left: .5em;
left: 5%;
width: 8em;
color: #000000;
}

.mainbox {
margin: 0 1px 0 9em;
border-left: 2px solid #000000;
padding-top: 1em;
background-color: #e4e6e7;    
color: #000000; 
line-height: 1.4em;
background-image: url(../background.jpg); 

}

.mainbox h2, h4, h3 { margin-top: 1em; } /* Nice for sub-headings in text */

/* A hack to stop IEwin breaking the layout if a floated right element reaches the bottom in .mainbox */

/* Hide hack from IEmac \*/
* html .mainbox {height: 1%;}
/* End hide hack from IEmac */

/*** Simple floats ***/
.floatleft {
float: left;
}

.floatright {
float: right;
}

/*** Floats for images in the textflow (not inside p tags etc.) ***/
.imageright {
float: right;
clear: right;
margin: 0 0 .5em 1em;
}

.imageleft {
float: left;
clear: left;
margin: 0 1em .5em 0;
}

.imageright350 {
float: right;
clear: right;
margin: 1em 5% .5em 1em;
width: 350px;
text-align: center;
}
.imageright350 p {
font-family: Georgia, "Times New Roman", Times, serif;
margin: .5em 2em; 
text-align: left;
}

.fdgbfloat80 {
/* Width should be changed to suit image size */
float: left;	
margin: 0 1.5em 1em 0;
padding-top: .5em;
width: 80px;
height: 160px;
text-align: center;
display: inline; /* To fix IE double margin bug */
background-color: #ffffff;
/*border: 2px solid #cccccc;*/
}

.fdgbfloat80 p {text-align: left;}


.fdgbfloat120 {
/* Width should be changed to suit image size */
float: left;	
margin: 0 1.5em 1em 0;
padding-top: .5em;
width: 120px;
height: 160px;
text-align: center;
display: inline; /* To fix IE double margin bug */
background-color: #ffffff;
/*border: 2px solid #cccccc;*/
}

.fdgbfloat120 p {text-align: left;}


.fdgbfloat100 {
/* Width should be changed to suit image size */
float: left;	
margin: 0 1.5em 1em 0;
padding-top: .5em;
width: 100px;
height: 180px;
text-align: center;
display: inline; /* To fix IE double margin bug */
background-color: #ffffff;
/*border: 2px solid #cccccc;*/
}

.fdgbfloat100 p {text-align: left;}

.fdgbfloat150 {
/* Width should be changed to suit image size */
float: left;	
margin: 0 1.5em 1em 0;
padding-top: .5em;
width: 150px;
height: 180px;
text-align: center;
display: inline; /* To fix IE double margin bug */
background-color: #ffffff;
/*border: 2px solid #cccccc;*/
}

.fdgbfloat150 p {text-align: left;}

.fdgbfloat80a {
/* Width should be changed to suit image size */
float: left;	
margin: 0 1.5em 1em 0;
padding-top: .5em;
width: 80px;
height: 190px;
text-align: center;
display: inline; /* To fix IE double margin bug */
background-color: #ffffff;
/*border: 2px solid #cccccc;*/
}

.fdgbfloat80 p {text-align: left;}




/*** Image gallery styling ***/
.container { 
margin: .5em 5%; 
}

.portfolioimage {
float: left;
margin: .5em 2em .5em 0;
font-family: Georgia, "New Century Schoolbook", Times, serif;
text-align: center;
color: #660000;
}

.skateright {
/* Apply to p tag etc. */
float: right;
/*clear: left;*/
width: 22em; 
/*margin-left: 1em;*/
padding: 1em;
display: inline; /* To fix IE double margin bug */
border: 3px solid #999999; 
/*text-align: justify;*/
color: #660000;
background-color: #E1EFFA;
line-height: 1.5em;
}
/*** Miscellaneous bits and bobs ***/
.marginshalfem { 
margin: .5em; 
vertical-align: middle; 
} 

.usualmargins { margin: .1em 3%; }

.marginhack { margin: 0 5%; } 
/* To sort out IE5 float bug between header and mainbox */

.quotebox {
/* Apply to p tag etc. */
float: right;
clear: right;
width: 8em; 
margin-left: 1em;
padding: .5em;
display: inline; /* To fix IE double margin bug */
border: 3px solid #999999; 
font-family: Georgia, "New Century Schoolbook", Times, serif;
text-align: center;
color: #660000;
background-color: #FFFFFF;
line-height: 1.2em;
}

/* hack needed for IE5win - corrected for IE6win and IE5mac */
* html .quotebox {
width: 10em;
w\idth: 9em;
}

.monored {
/* For special text */
font-family: "Courier New", Courier, mono;
color: #660000;
margin: .5em 8%;
border: 2px solid #666666; 
padding: .5em 1em;
background-color:#FFFFFF;
}

.spacer {clear: both; } 	

.clearleft {clear: left; }

.center {text-align: center;}

/*** Menu stuff with popups ***/
.nav span {display:none;} 
a.nav:link, a.nav:visited { 
display: block; 
position: relative; 
width: 8em; 
height: 1.6em; 
border: 1px solid #000000; 
margin-bottom: .5em;
margin-left: 0em;
text-align: center; 
text-decoration: none; 
color: #000000; 
line-height: 1.6em; 
font-family: Arial, Helvetica, sans-serif;
font-weight: 400;
background-color: #c0c0c0
} 

a.nav:focus, a.nav:hover, a.nav:active {
background-color:#e4e6e7;
border-width: 1px 2px 1px 1px; /* A hack to get IE5 to show the popups */
} 

a.nav:focus span, a.nav:hover span {
display: block;
position: absolute;
top: -.1em;
left: 10em;
width: 8em;
background-color:#ffffff;
padding: .5em;
border: 2px solid #000000;
text-align: left;
color: #000000;
line-height: 1.3em;
font-weight: 400;
}

/*** Form styling ***/
label {
display: block;
float: left;
width: 7em;
text-align: right;
padding-right: 1em;
}

.formbutton {
display: block;
float: left;
padding-left: 8em;
}

a.nav { 
display: block; 
position: relative; 
width: 6em; 
height: 1.6em; 
border: 1px #000000 solid; 
margin-bottom: 0.5em;
margin-left: 1em;
text-align: center; 
text-decoration: none; 
color: #000000; 
line-height: 1.6em; 
font-family: Arial, Helvetica, sans-serif;
font-weight: 400;
background-color: #999933
 } 

.background {  
background-image: url(../images/background3.jpg); 
background-repeat: no-repeat;
}