body{
	margin:0 auto;
	padding:0;
	background:#512800 url(../images/background.gif) top center repeat-y;
	color:#006;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 75%;
}

/* This wrapper sizes the page and encloses everything including header and footer */
#wrapper{
	background:#FFF;
	color:#006;
	margin:0 auto;
	width:760px;
	padding: 0em;
}

/* This is for the navigation to show the ACTIVE page - makes it easier to navigate for users with this */
body#search-engine-optimisation-reports a#wco-active,
body#search-engine-optimisation a#seo-active,
body#website-useability a#wu-active,
body#search-engine-promotion a#sep-active,
body#web-marketing a#im-active,
body#website-optimisation a#wso-active,
body#website-design a#wd-active,
body#home a#hm-active,
body#articles a#ima-active,
body#tutorials a#t-active,
body#directory a#rd-active,
body#forums a#f-active,
body#seo-reports a#lcsr-active
{
color: #fff;
background: #512800;
}

/* Navigation Menu CSS */
#menu{
font-weight:bold;
float:right;
width:220px;
margin:5px 0 10px 0;
padding:0;
font-size:1.3em;
}

#menu ul{
font-size:0.7em;
list-style:none;
width:220px;
margin:10px 0px 10px 0px;
padding:0;
}	

#menu li{
margin-bottom:4px;
}

#menu li a{
font-weight:bold;
height:20px;
text-decoration:none;
color:#C60;
display:block;
padding:6px 0 0 10px;
background:#FFEAD5;
border-left:4px solid #C60;
border-bottom:none;
}	
	
#menu li a:hover{
background:#C60;
color:#FFF;
border-left:4px solid #F93;
border-bottom:none;
}


img {
border:0;
}


/* Announcement - Under Menu */
.announcement{
font-weight:normal;
font-size:0.7em;
margin:20px 0px 20px 0px;
border:2px #C60 solid;
padding:5px 5px 10px 5px;
text-align:center;
width:206px;
color:#006;
}

/* Links - how they are handled and coloured (within the ANNOUNCEMENT DIV) */
.announcement a:link, .announcement a:visited {
text-decoration:none; color:#006; border-bottom:1px dotted #999;
}

.announcement a:hover {
text-decoration:none; color:#006; border-bottom:1px solid #333;
}

.announcement a:active {
text-decoration:none; color:#006; border-bottom:1px solid #999;
}



/* This is the content DIV where information is added */
#content{
margin:10px 230px 20px 0px;
border-left:none;
border-right:1px solid #FFEAD5;
padding:0 10px 0 10px;
line-height:1.6em;
}

/* Alignment and wrap for images WITHIN the content DIV along with image border */
#content img{
margin:0px 10px 10px 0px;
float:left;
border:thin #FFEAD5 solid;
}

/* Paragraph margins */
#content p{
margin:10px 0px 10px 0px;
}

/* Hey, yep this is the settings for all of your <H> tags */
/* Note: Margins are controlled in the following fashion Top Right Bottom Left e.g. 25px top 0px right 20px bottom and 0px left ;) */
h1{
margin:25px 0px 20px 0px;
font-size:18px;
}

h2{
margin:25px 0px 5px 0px;
font-size:16px;
}

h3{
margin:35px 0px 5px 0px;
font-size:14px;
}

h4{
margin:10px 0px 5px 0px;
font-size:12px;
}


/* Links - how they are handled and coloured (within the CONTENT DIV) */
#content a:link, #content a:visited {
text-decoration:none; color:#006; border-bottom:1px dotted #999;
}

#content a:hover {
text-decoration:none; color:#006; border-bottom:1px solid #333;
}

#content a:active {
text-decoration:none; color:#006; border-bottom:1px solid #999;
}


#footer{
clear:both;
margin:0px auto;
padding:10px 0 10px 0;
border-top:1px solid #FFEAD5;
width:720px;
text-align:center;
font-size:0.8em;
}

/* Links - how they are handled and coloured (within the FOOTER DIV) */
#footer a:link, #footer a:visited {
text-decoration:none; color:#006; border-bottom:1px dotted #999;
}

#footer a:hover {
text-decoration:none; color:#006; border-bottom:1px solid #333;
}

#footer a:active {
text-decoration:none; color:#006; border-bottom:1px solid #999;
}
