body {
color:rgba(132, 10, 181, 0.71); /*changes text color*/
font-size:13px; /*changes size of font*/
font-family:"trebuchet ms",Times, serif; /*sets default font style*/
line-height:21px; /*increases line height to 21 pixels, default is 16px*/
background-color:#e6e6d9; /*sets the background colour to a light grey*/
text-align:left; /*sets the default alignment of text to left*/
margin:0px; /*zeroes off the top, right, bottom and left margins*/
}
header{
background-color:rgba(131, 172, 137, 0.84); /*sets header colour to brown*/
background-image:url(images/moonscape.jpg); /*path to the image*/
background-repeat:no-repeat; /*header image is used once only*/
background-position:top center; /* image appears centred top */
height:68px;
}

nav {
color:#ffffff; /*sets color of text to white*/
font-size:10px; /*sets size of font in the nav to 10 pixels*/
font-weight:bold; /*bolds text in the navigation bar*/
line-height:16px; /*ensure nav line height is 16 pixels*/
background-color:#660000; /*changes nav back color to burgundy*/
text-align:center; /*centres the text on the navigation bar*/
letter-spacing:4px; /*increases spacing between chars in nav*/
margin-bottom:15px; /*adds 15 pixel margin to bottom of nav*/
height:16px;
}
nav a:link, nav a:visited, nav a:active {
color:#ffffff; /*ensures the color of the basic link is white*/
text-decoration:none; /*removes underlining from the basic link*/
}
nav a:hover {
color:#ffcc00; /* mouse hovers over a link, change to yellow*/
text-decoration:underline; /*underlining will appear on hover*/
}
#logo {
margin-top:0px; /*zero off the top margin*/
margin-right:10px; /*make a 10 pixel right margin*/
margin-bottom:10px; /*make a 10 pixel bottom margin*/
margin-left:180px; /* 180 pixel left margin - room for the left column*/
}
#leftcol {
text-align:center; /*centres text appearing in the leftcol*/
width:180px; /*makes width of #leftcol id to 180 pixels*/
float:left; /*positions the leftcol to the left of the page*/
}
.menuitem {
margin-top:20px; /*sets the top margin to 20 pixels*/
margin-left:20px; /*sets left margin to 20 pixels*/
font-weight:bold; /*bolds text surrounded by the menuitem class*/
border-bottom-style:dashed; /*places a dashed border on bottom*/
border-bottom-width:1px; /*adjusts width of border to 1 pixel*/
border-bottom-color:#758642; /*set colour of bottom border green*/
}
/* basic links within the menuitem class only*/
.menuitem a:link, .menuitem a:visited, .menuitem a:active {
color:#660000; /*change color of link to burgundy*/
text-decoration:none; /*remove the underlinine*/
}
/* change to hovered over links within menuitem */
.menuitem a:hover{
color:#cc6633; /*when hovered over, links to light brown-orange*/
text-decoration:underline /*when hovered over, show underlining*/
}
#midcol {
padding-left:36px; /*add spacing between the left & mid columns*/
width:59%; /* width of the middle column 50% of the screen width*/
float:left; /*line the mid col on the left, immediately next to the left column*/
}
#rightcol {
text-align:center; /*centre all text in the right column*/
font-size:10px; /*make the font size 10 pixels*/
font-style:italic; /*change the font to italics*/
line-height:18px; /*increase the line height to 18 pixels*/
padding-left:10px; /*add some spacing between middle and right columns*/
width:150px; /*make the width of the right column 150 pixels*/
float:left; /*line the right column to the left, next to the middle column*/
}
footer {
clear:left; /* clears the all floats on the columns so the footer appears beneath them*/
color:#ffffff; /*change the footer text color to white*/
font-size:11px; /*change footer text size to 11 pixels*/
font-weight:bold; /*bold text appearing in the footer*/
background-color:#660000; /*make footer background colour burgundy*/
text-align:center; /*center all text in the footer*/
letter-spacing:2px; /*make spacing between footer chars 2 pixels*/
height:16px; /*make the height of the footer 16 pixels*/
}