body,h1,h2,p,ul {color:black}
body 
{

margin:0;
padding-left:5%;
padding-right:5%;
padding-top:0;
width:80%;
background-color:#ed1c24;
font-family:arial;
font-size:1em;
text-align:justify;}




/*
Spacer Div - used on contacts page
*/


.spacer{
clear: both
 

}


/* the following is for the banner, haven't used the hover effect but left the code in for later*/


div.topbanner
{
position:relative;
float:left;
width:100%;
height:auto;
margin:0;
padding:0;
border:1px;

background-color:black;
z-index:0;
}



div.img
  {
  
margin-top:15px;
margin-bottom:0px;
margin-right:22px;
  border:1px solid black;
  height:auto;
  width:auto;
  float:left;
  text-align:center;
z-index:0;
  }

div.img img
  {
  display:inline;
  margin:3px;
  border:0px solid black;
  }
div.img a:hover img
  {
  border:1px solid #0000ff;
  }
div.desc
  {
  text-align:center;
  font-weight:normal;
  width:120px;
  margin:2px;
  }

ul.nav
{
float:left;
position:relative;
top:0px;
left:0px;
z-index:2;
width:100%;
padding:0px 0px 0px 0px;
margin:0;
list-style-type:none;
font-family:arial,sans-serif;
font-size:1em;
}

a.nav
{
float:left;
position:relative;
left:0px;
top:0px;
width:132px;
text-decoration:none;
text-align:center;
color:white;
background-image:url('images/gradbutton1.jpg');
padding:10px 5px;
border-right:0px solid black;
border-top:0px solid black;
border-bottom:0px solid black;
}

a.nav:hover{color:black;}

li.nav
{
display:inline
}



div.top
{
position:relative;
float:left;
z-index:0;
top:0px;
left:0px;
background-color:white;
width:100%;
padding:0px;
border:2px solid black;
margin:0px;

}

h1 
{
margin:0px;
padding-right:0em;
padding-left:0;
text-align:left;
background-color:white;

}

h4.centred{
text-align:center;
color:#ed1c24
}
h4.right
{
text-align:right;
color:#ed1c24
}


h2 
{
position:relative;
left:10px;
border-top:2px solid #ed1c24;
border-bottom:2px solid #ed1c24;
border-left:0px solid white;
border-right:0px;
background: white;
padding-top:3px;
padding-bottom:3px;
padding-left:5px;
padding-right:5px;
width:8em;
text-align:center;
font-size: 1em;
display:block;
}


h3
{
position:relative;
left:10px;

border-top:0px solid #ed1c24;
border-bottom:0px solid #ed1c24;
border-left:2px solid #ed1c24;
border-right:0px;
background: white;

padding-top:3px;
padding-bottom:3px;
padding-left:5px;
padding-right:5px;
width:20em;
text-align:left;
font-size: 1em;
display:block;
}


p 
{
margin:0;
border:0px;
padding:0px 80px 10px 10px;
line-height:1.2em;
background-color:white ;

}

li
{width: 75%}

div {
position:relative;
left:0px;
background-color:white;
width:100%;
padding:0px;
border:2px solid #ed1c24;
margin:0px

}

#footer 
{
margin:0px;
padding:10px 10px 10px 10px;
clear: left;
border:0px solid #ed1c24;
background: black;
font-size:10px;
color:white;
letter-spacing:0.25em;
}




/*for the contacts page gallery*/


div.contactscontainer
{
position:relative;
float:left;
width:60%;
height:auto;
margin:0;
padding:0;
border:1px;

background-color:black;
z-index:1;
}


div.contacts
  {
  margin-top:1px;
margin-bottom:0px;
margin-right:5px;
  border:0px solid black;
  height:auto;
  width:auto;
  float:left;
  text-align:center;
z-index:0;
  }

div.contacts img
  {
  display:inline;
  margin:5px;
  border:1px solid black;
  }
div.contacts a:hover img
  {
  border:1px solid #0000ff;
  }
div.desc
  {
  text-align:center;
  font-weight:normal;
  width:145px;
  margin:1px;
border:0px;
  }


a.index:link {color:#333333; text-decoration:none}
a.index:visited {color:#333333; text-decoration:none}
a.index:hover{color:#333333; text-decoration:none}
a.index:active{color:#333333; text-decoration:none}

a.link:link {color:#333333; text-decoration:none}
a.link:visited {color:#333333; text-decoration:none}
a.link:hover{color:#ff5e00; text-decoration:none}
a.link:active{color:#333333; text-decoration:none}

a.footer:link {color:white; text-decoration:none}
a.footer:visited {color:white; text-decoration:none}
a.footer:hover{color:#ed1c24; text-decoration:none}
a.footer:active{color:#ed1c24; text-decoration:none}




/*not used floatlink but will leave in in case useful if future*/
.floatlink 
{

float:right;
width:120px;
height:100px;
border:2px dotted #333333;
background-color: white;
margin:20px;
z-index:2;
text-decoration:none;
font-size:2em;
line-height:1.5em;
}


.rightimage

{
float:right;
padding: 0px;
border:1px solid#333333;
background-color: white;
margin:15px;
z-index:-2;
}


.virginimage

{
float:right;
padding: 0px;
border:0px solid#333333;
background-color: white;
margin:15px;
z-index:-2;
}

/*not used, but leave for future use*/

.leftimage

{

float:left;
text-align:center;
padding: 10px;
border:1px solid#333333;
background-color: white;
margin:10px;
z-index:2;

}


.leftimagesmall

{

float:left;
text-align:center;
padding: 10px;
border:0px solid#333333;
background-color: white;
margin:10px;
z-index:2;

}



.lists {

font-weight:normal;
position:relative;
float:left;
left:10px;
list-style:square inside;
z-index:1;
}

.lists2
{
background-image:url('images/square.jpg');
background-repeat:no-repeat;
background-position:0px 5px; 
padding-left:14px;
}
.ul2
{
list-style-type: none;
padding: 20px;
margin: 10px;
z-index:-1;
}