<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>
<head>
<title>Traditional User CSS</title>
<style type="text/css">
<!--


/* Setting the body to have a slight margin at the left and right so no objects completly go off the page. Setting the desired fonts */
body {
background-color: #ADD8E6;
margin-left: 5%;
margin right: 10%;
font-family: trebuchet ms, verdana, arial, sans-serif;
}

/* Setting the tob box with which the website logo will be placed */
#top1 {
position: absolute;
top: 0px;
left: 5px;
right: 5px;
padding: 10px;
margin: 5px;
border: 1px solid Black;
background-color: White;
width: 980px;
}

/* Setting an alternative to topbox1 and is only used for print only users so here it has been set so it is not displayed */
#top2 {
display: none;
position: absolute;
top: 0px;
left: 5px;
right: 5px;
padding: 10px;
margin: 5px;
border: 1px solid Black;
background-color: White;
width: 980px;
}


/* Set the box to place each page title in, it is at a reasonable size so most titles should fit. */
#extra {
position: absolute;
top: 150px;
left: 150px;
margin: 5px;
border: 1px solid Black;
background-color: White;
width: 600px;
height: 20px;
}

/* Set the left box to place the menu options in and will always stick to the left of the page  */
#left {
position: absolute;
top: 150px;
left: 0px;
padding: 10px;
margin: 5px;
border: 1px solid Black;
background-color: #00008B;
width: 140px;
}

/* Set the main part where the information will be go, its margins have increased so that it uses more screen
due to the lack of right column as seen in the traditional user site */
#content {
margin: 200px -90px 5px 60px;
padding: 10px;
border: 1px solid Black;
color: Black;
}


/* Setting the right box so that it is not visible so that the screen can be better used to display 
the information and minimize the options on the PSP */
#right {
display: none;
position: absolute;
top: 150px;
right: 0px;
padding: 10px;
margin: 5px;
border: 1px solid Black;
background-color: #00008B;
width: 140px;
}

/* Setting all heading 1 text to black */
H1 {
color: black;  
}

/* Set all heading 4 text to dark blue, increase the size by an extra 10% and space each word apart a little extra so it is easier to read on a small screen */
H4 {
color: #00008B;
font-size: 110%;
word-spacing: 0.3em;
}

/* Set all heading 5 text to dark blue, increase the size by an extra 10% and space each word apart a little extra so it is easier to read on a small screen */
H5 {
font-size: 110%;
color: #00008B;
word-spacing: 0.3em;
}


/* Setting all visited links to yellow text */
a:visited {
color: yellow;
}

/* Setting all unvisited links to white */
a:link {
color: white;
}


/* Setting all links so that when hovered over turn red*/
a:hover {
color: red;
}

-->
</style>
</head>
<body>

</body>
</html>
