body { font-family: 'Trebuchet MS', Arial, sans-serif;   background: rgb(230,217,233);
		behaviour: url(csshover.htc); }

div#container { margin: 20px auto;   width: 1000px;   
		border: 1px solid rgb(40,14,93);   background: white; }

div#nav { float: left;   width: 13em;   margin: 20px 0 0 -1px;   background: rgb(230,217,233); }
div#nav ul { margin: 0;   padding: 0;   width: 13em;    border: 1px solid rgb(40,14,93); }
div#nav li { position: relative;   list-style: none;   margin: 0;   line-height: 1.2em;
		border-bottom: 1px solid silver; }
div#nav li:hover { background: rgb(190,175,210); }
div#nav li.submenu, div#nav li.subsubmenu 
		{ background: url(../images/arrow1.gif) 90% 50% no-repeat; }
div#nav li.submenu:hover, div#nav li.subsubmenu:hover  
		{background: rgb(190,175,210) url(../images/arrow2.gif) 90% 50% no-repeat;}

div#nav li.subsubmenu { padding-left: 1em; }

div#nav li a { display: block;   padding: .25em 0 .25em .5em;   text-decoration: none; }
div#nav li a:link { color: rgb(40,14,93); }
div#nav li a:visited { color: gray; }
div#nav li a:hover { color: white; }
div#nav li a:active { color: maroon; }

div#main { margin: 0 0 2em 14em; }

#logo { float: left;   padding: .5em .5em 0 2em; }
h1 { margin: 0 0 .5em 7.5em;   padding: 1em 0 .5em 1em;
		color: #4b0082;   letter-spacing: .1em; }
#cartoon { float: right;   margin-right: 0;   padding: 0 1em 1em 2em;   background: white; }

p.blurb { margin: 2em;   width: 380px;   text-align: justify;   line-height: 1.3em; }
p.tutorial { margin: 1em;   width: 700px;   text-align: justify;   line-height: 1.3em; }

div#credits-box { margin: 4em 2em 1em;   text-align: center; }
div.credits { margin: 0 1em;   color: gray;   font: italic .9em 'Arial Narrow', sans-serif; }

div#badges { margin-bottom: 2em; }
div#badges img { margin: 0 65px; }
div#badges ul { list-style: none; }
div#badges ul li { display: inline; }

.maroon { color: maroon; }
.purple { color: purple; }
.bold { font-weight: bold; }

div#main a, div#credits-box a { text-decoration: none; }
div#credits-box a:link { color: rgb(40,14,93);   border-top: 1px dotted; }
div#main a:link { color: rgb(40,14,93);   border-bottom: 1px dotted; }
div#main a:visited, div#credits-box a:visited { color: gray; }
div#main a:hover, div#credits-box a:hover { color: rgb(148,0,211);   border-bottom: 1px dotted; }
div#main a:active, div#credits-box a:active { color: maroon; }

.pic { margin-left: 50px;   margin-top: 15px;   padding-bottom: 1em;   vertical-align: top; }

div#home-paragraph { padding-bottom: 40px; }
div#privacy-paragraph { padding-bottom: 340px; }
div#life-paragraph { padding-bottom: 150px; }

#topbutton, #php { margin: 0 2em;   width: 140px;   color: #646464;
		font: italic .9em 'Trebuchet MS', Arial, Sans-Serif; }
#topbutton a { border-bottom: 1px dotted; }

li#top-button { padding-top: 20px;   text-align: center;   color: #646464;
		 font: italic .9em 'Trebuchet MS', Arial, Sans-Serif; }
li#top-button a { border-bottom: 1px dotted; }

div#links { margin-bottom: 80px;   width: 400px;   text-align: center;   color: #303; }
div#links ul { margin-left: 1em; }
div#links ul li { list-style: none;   margin: 0 5px 15px;   padding-bottom: 10px;   
		border-bottom: 1px dotted gray; }
div#links ul li a { text-decoration: none; }
div#links ul li a:link { border: none;   color: purple; } 
div#links ul li a:visited { color: gray; }
div#links ul li a:hover { color: rgb(148,0,211);   border-bottom: 1px dotted; }
div#links ul li a:focus { color: maroon; }

span#redcross { display: block;   background: #c10;   color: white;   font-weight: bold;
		margin: 2px 0;   padding: 1px 0 10px;   letter-spacing: .5em; }
span.cross { font-size: 1.5em; }

div#links img { margin: 5px;   padding: 0; }

div#links ul ul, div#links ul ul li { margin: 0;   padding: 0;   border: none; }

ul#tutorial { list-style: disc;   width: 680px; }

p#copyright { color: white; }
	
/* colours
pale purple - rgb(230,217,233) - background body & nav background
light purple - rgb(190,175,210) - background list hover
darkest purple - rgb(40,14,93) - link text, unvisited
maroon - rgb(128,0,0) - #800000 - link active, "New!" tutorial link text, arrow
indigo - #4b0082 - h1
silver - #c0c0c0 - list border-bottoms
gray - #808080 - link unvisited, credits
white - nav link hover text
darkviolet - #9400d3 rgb(148,0,211) - email active links
mid gray - #646464 - #topbutton
 */