/* Diane Rayfield CSS*/

/* this is the code that controls the basic page including the font in the white section*/
body {
 margin: 20px 0;
 color: #333;
 background:#CCFFCC;
 padding:25;
 font: 0.86em/1.6 Arial, Helvetica, sans-serif;
 }
 
/* this is the code that controls the banner area of the page*/
#hdr {
 padding-top: 100px;
 background: #fff url(backgroundfiles/header-bg2.jpg) no-repeat;
 }

/* this is the code that controls the outside table on the page*/
#outer {
 width: 950px;
 margin: 0 auto;
 background: #fff url(backgroundfiles/bg.gif) repeat-y;
 }

/* this is the code that controls the area around diane's name and her name colour*/
#hdr h1 {
 border-left:0px solid #CCFFCC; 
 border-right:0px solid #CCFFCC; 
 border-top:1px solid #CCFFCC;   
 border-bottom:1px solid #CCFFCC;     
 color: #006600;
 background:#CCFFCC;
 font-size: 1.5em;
 font-weight: bold;
 text-align: center;
 margin: 0;
 padding: 0em;
 }

/* this is the code that controls the navigation area and the links*/
#nav {
 float:left;
 width:130px;
 text-align: center;
 padding-bottom: 10px; 
 padding-left:1em; 
 padding-right:1em; 
 padding-top:1em
}
#nav ul {
 margin: 0;
 list-style-type:none; 
 padding-left:0;
 padding-right:0; 
 padding-top:10px; 
 padding-bottom:0
}
#nav li {
	margin: 0;
}
#nav h2 {

}

/* this is the code that controls the navigation link colours*/
a:link {
color: #006600;
text-decoration: none;
font-weight:bold;
font-size: 0.9em;
}
a:visited {
text-decoration: none;
color: #006600;
font-weight:bold;
font-size: 0.9em;
}
a:hover {
text-decoration: none;
color: #fff;
font-weight:bold;
font-size: 0.9em;
}
a:active {
text-decoration: none;
color: #006600;
font-weight:bold;
font-size: 0.9em;
}

/* this is the code that controls the content area in white*/
#cont {
 float: right;
 width:745px;
 padding: 1.0em;
 }
#cont h2 {
color: #006600;
}

/* this is the code that controls the headers in the content area*/

h1 {
 font-size: 1.5em;
}

h2 {
 font-size: 1.3em;
}

/* this is the code that controls where left aligned images appear*/
#leftImg
{
float:left;
width: 125px;
height: 93px;
padding: 0 5px 5px 0;
}

/* this is the code that controls where right aligned images appear*/
#rightImg
{
float:right;
width: 125px;
height: 93px;
padding: 0 0 5px 5px;
}

/* this is the code that controls the footer of the page*/
#ftr {
 clear: both;
 color: #fff;
 background:#B7734B;
 font-size: 0.8em;
 text-align: center;
 border-top: 1px solid #000;
 margin: 1em 0 0 0;
 }