/* Colours
Background: #262626 or really darker #0d0d0d
Dark Grey: #222
Light Grey: #868686
Light Green: #d7ffaf
Blue: #19c 
Orange: #ffa71f
Green: #85db18 
*/


/* Neutralise styling:  */
html,body,h1,h2,h3,h4,h5,h6,p,blockquote,img,
dd,dl,dt,li,ol,ul,
fieldset,form,label,legend,
table,caption,tbody,tfoot,thead,tr,th,td {
	margin: 0;
	padding: 0;
	font-size: 100%;
	line-height: 1em;
	vertical-align: baseline;}

/* Eliminate border around link images */
a img, :link img, :visited img {border: 0;}

input, select, textarea { font-size: 100%; }

html {height: 1%; }
/* Resets 1em to 10px */
body {font: 62.5% "Lucida Grande", "Lucida Sans Unicode", verdana, geneva, sans-serif;
color: #fff; background: #262626 url("img/pageshadow.jpg") left top repeat-x;}

/* Font sizes and line heights
Keeping the baseline grid */
p, li, li li, td, th { font-size: 1.2em; line-height: 1.5;}
p { margin-bottom: 1.8em; }
li { margin: 0.9em 0;}
h2 { font: 2.8em/1.8 Georgia, serif; color:#d7ffaf; margin-bottom:0.45em;}
h3 { font-size: 1.8em; line-height: 1.8; margin: 0.45em 0;}
h4 { font-size: 1.2em; line-height: 1.5; text-transform: uppercase; color: #d7ffaf; }
ul, ol { margin-bottom: 1.5em; }
blockquote { border: 1px solid #444; padding: 0.8em 1em; margin-bottom: 1.8em;}
blockquote p { margin-bottom: 0; }
blockquote:last-child { margin-bottom: 0; }

/* Apply left margin: Only to the few elements that need it: */
li, dd, blockquote {margin-left: 1.8em;}

/* Miscellaneous conveniences: */
form label { cursor: pointer; }
acronym, abbr {border-bottom:1px dotted; cursor:help;}
fieldset { border: none;}
code {font-family: 'Courier New', Courier, Fixed;}
table {border-collapse: collapse; border-spacing: 0;}
th {text-align: left; text-transform: uppercase; width: 24.3em;}
table td {margin-right: 10px;}
.clear {clear:both;}
.left { float: left; margin: 0 1.8em 1.8em 0; }
.right { float: right; margin: 0 0 1.8em 1.8em; }

/* Links */
a { color: #fff; text-decoration: none;}
#primary h2 {color: #d7ffaf;}
#primary a {color: #d7ffaf; }
#primary a:hover {color: #0d0d0d; background-color: #d7ffaf;}

/* Layout and Positioning 
-----------------------------------*/
#wrapper { position:relative; width: 85.7em; height: 429px; background: url("img/bkg.jpg") left top no-repeat;}

h1 a { position: absolute; left: 21.3em; top: 14.4em; width: 344px; height: 251px; background: url("img/dup.jpg") left top no-repeat;}
h1 { text-indent: -5000px;}

#content { position: absolute; left: 21.6em; top: 28.8em; width: 64.1em; z-index:10;}

#credit { position: absolute; left: 0; top: 407px; width: 13.7em; background:#222; }
#credit p { padding:7px; margin-bottom:0;}
#credit a { color: #868686;}
#credit a:hover { color: #fff; }

#access { position: absolute; width: 85.7em; top: 0.7em; left: 0; color: #868686; text-align: right; z-index:30;}
#access a { color: #868686; text-decoration: none;}
#access li { display:inline; list-style: none; margin:0 0 0 0.7em;}

/* Navigation drop-down menus
-----------------------------------*/
div#nav { position:absolute; top:6.1em; right:0; width: 28.1em; z-index:20;}
div#nav {_width: 28.3em;} /* for IE to fit the top-level tabs */
div#nav a {color: #d7ffaf; text-decoration:none; font-size:1.2em; line-height:1.2em; display:block;}
div#nav li { position:relative; float:left; width: 5.41em; margin-left:7px; list-style: none;}
div#nav li.start {margin-left:0;}
div#nav ul ul.level2 { display:none; position:absolute; left:0; top: 3em; }
div#nav ul ul.level2 li {width:11.41em;background: #262626;}

/*menus colours */
div#nav li.start a {color: #FFA71F;}
div#nav li.shoot a {color: #1199CC;}
div#nav li.edit a {color: #85DB18;}
div#nav li {border-bottom: 1px solid #555;}

/* specific to non-IE browsers */
div#nav li:hover ul {display:block; position:absolute;}
div#nav li:hover ul li {font-size:1em; line-height:1; margin:0; padding:0.3em 0;}


/* Styling main content area 
-----------------------------------*/
#primary {width: 49.7em;}
#primary p {font-size: 1.2em; line-height:1.8em;}
#top { clear: left; }

/* Boxes  and colours on home page 
-----------------------------------*/
#home #primary { float: left; width:35.3em;}
#home #primary {_width: 34.6em;} /* for IE to fit the floating boxes */
#home #secondary { float: right; width: 281px; margin-left:7px; display:inline;}

/* background colours and round corners at the bottom */
#home #secondary .start { background: #FFA71F url("img/orangebottom.jpg") left bottom no-repeat; padding-bottom:0.5em;}
#home #secondary .shoot { background: #1199CC url("img/bluebottom.jpg") left bottom no-repeat; padding-bottom:0.5em;}
#home #secondary .edit { background: #85DB18 url("img/greenbottom.jpg") left bottom no-repeat; padding-bottom:0.5em;}

/* link colours */
#home .links, #home .links a { color: #0d0d0d; clear: left;}
#home #secondary .start a:hover {color:#ffd595;}
#home #secondary .shoot a:hover {color:#94bdcc;}
#home #secondary .edit a:hover {color:#c6dbac;}

#home .links {margin-bottom: 1.8em;}
#home .links a {border-bottom: 1px solid;}
#home .links h2 {padding:0.14em 0.45em 0; background: url("img/boxestop.gif") left top no-repeat;}
#home .links h2 a { font-weight: bold; border-bottom:none;  text-shadow: 0 1px 1px rgba(255,255,255,0.3);}
#home .links p {margin-bottom:0; padding:0 0.9em;}
#home .links ul {padding: 0.2em 0.9em;}
#home .links li {margin: 0 0.7em 0 0; float:left; list-style: none;}

#levels #primary {width: 42.5em;}
#levels table {width: 648px;}

#primary strong {font-style: italic;}
#primary img.pushed {position: relative; margin-right: -13.7em;}

