body
{
position: relative;
background-color: #000055;
min-width: 974px;
font-size: 95%;
font-family: "Trebuchet MS", Helvetica, sans-serif;
background-repeat: no-repeat;
background-attachment: fixed;
background-position: center; 
}

/*The background image*/
img.bgImage
{
position: fixed;
bottom: 0px;
left: 0px;
z-index: -1;
}

/*Container for the logo image to keep it centred*/
div.header
{
font-family: Arial;
position: relative;
border: 2px none #00DD00;
text-align: center;
}

/*Div containing the site logo*/
div.header img
{
display: inline-block;
margin-left: auto;
margin-right: auto;
border: 1px none #00DD00; 
}

/*The navigation links*/
div.nav
{
display:inline;
margin-top: 5px;
margin-bottom: 2px;
border: 2px none red;
}

/*The images used in the navigation div*/
div.nav img 
{
display: inline;
margin-left: 17px;
margin-right: 18px;
margin-top: 3px;
border: 1px none #00DD00; 
}

/*Joomla makes the nav links a list, this makes them inline*/
#nav li, ul.menu
{
  display: inline;
  list-style-type:none;  
  margin: 0px 0px 0px 0px;
  padding: 0px 0px 0px 0px;
}

/*The name of the ROM file the hacking info relates to*/
p.romFileName
{
  border: 1px solid black;
  padding: 10px;
}

/*The navigation links for jumping forward and backwards on projects/videos that are spread over multiple pages*/
p.previousVideoNav
{
float: left;
margin-top: 0px;
}

p.nextVideoNav
{
float: right;
margin-top: 0px;
}

/*Clears floating after a 'float' element*/
.clear
{
clear: both;
}

/*The main text area on each page*/
div.main
{
-moz-border-radius: 15px;
border-radius: 15px;
margin-left:auto;
margin-right:auto;
color: #000000;/*ffffff;*/
background-color: #99D9EA; /*aabbcc;*/
padding: 10px;
bottom: 0px;
border: 2px solid #000000;
height: 100%;
min-height: 800px;
width: 100%;
min-width: 974px;
max-width: 974px;
z-index:1;
display: block;
visibility: visible;
}

/*26/06/2015 not believed to be used.*/
iframe.wrapper{
margin-left:auto;
margin-right:auto;  
display: block;
}

/*The text titles on each page when images aren't used*/
div.main h1
{
text-align: center;
font-size: 350%;
z-align: 1;
margin-top: 0px;
margin-bottom:0px;
}

/*Removed top and bottom margin, used in subheadings*/
.noMargin
{
margin-top: 0px !important;
margin-bottom: 0px !important; 
}

/*Subheadings on pages*/
div.main h2
{
text-align: center;
font-size: 250%;
margin-top: 5px;
margin-bottom: 20px;
}

/*Centres text and images in the given div, used on the homepage*/
div.centre
{
display: block;
margin-left: auto;
margin-right: auto;
}

/*Used for the places where we have an image and text link to somewhere such as the hacking
index page or the individual game links*/
div.imgtextpair
{
display: inline-block;
margin-left: auto;
margin-right: auto;
text-align: center;
width: 300px;
border: 2px none red;
font-size: 150%;
}

/*Like the above but used when there is a single item on its own that has to be centred*/
div.imgtextpairsingle
{
display: block;
margin-left: auto;
margin-right: auto;
text-align: center;
width: 300px;
border: 2px none red;
font-size: 150%;
}

/*A container for the img text pairs which keeps them all centred on each line*/
div.selections
{
margin-left: auto;
margin-right: auto;
text-align: center;
border: 2px none green;
}

/*An image that uses all the available space in the main page area.*/
img.allSpaceImg
{
width: 950px;
}

/*The heading image on each page*/
img.header
{
display: block;
margin-left: auto;
margin-right: auto;
}

/*The show and hide button*/
img.ShowHideImage
{
position: relative;
display: inline;
margin-left: auto;
margin-right: auto;
float: left;
}

/*The title for the 'What's been happening section'*/
p.blurbheader
{
margin-left: 3%;
margin-bottom: -1%;
font-size:125%;
font-weight:bold;
}

/*The text in the above section*/
p.blurb
{
margin-left: 5%;
margin-right: 5%;
}

/*The title for the updates*/
p.updateheader
{
margin-left: 12%;
margin-bottom: -1%;
font-size:125%;
font-weight:bold;
}

/*The majority of text on the site*/
p.normal
{
margin-left: 5%;
margin-right: 5%;
}

/*Used when a div needs to be moved the same amount as p.normal*/
div.normal
{
margin-left: 5%;
margin-right: 5%;
}

/*Used when a div is expandable onClick (a js function handles the actual click)*/
div.expandable
{
border: 1px dashed black;
border-image: none;
margin-left: 5%;
margin-right: 5%;
}

/*Used for code blocks*/
p.code, pre.code
{
font-family: Andale Mono, Lucida Console, Monaco, fixed, monospace;
color: #000000;
background-color: #eee;
font-size: 12px;
border: 1px dashed #999999;
line-height: 14px;
padding: 5px;
overflow: auto;
margin-left: 5%;
margin-right: 5%;  
}

/*Underlined text*/
.underline
{
text-decoration:underline;
font-weight:bold;
}

.bold
{
font-weight:bold;
}

/*Normal unordered / ordered lists*/
div.main ul, div.main ol
{
margin-left: 10%;
margin-right: 5%;
}

div.main ol.facebook
{
margin-left: 30%;
margin-right: 20%;
}

/*Colors links green*/
.green a:link
{
color: #00B600;
}
.green a:visited
{
color: #007700;
}
.green a:hover
{
color: #00DD00;
}
.green a:active
{
color: #00DD00;
}

/*Colors links green permenatly*/
.greenPerm a:link
{
color: #00DD00;
}
.greenPerm a:visited
{
color: #00DD00;
}
.greenPerm a:hover
{
color: #00DD00;
}
.greenPerm a:active
{
color: #00DD00;
}

/*Removes the underline from links, used for titles*/
.noLine a:link
{
text-decoration:none;
}
.noLine a:visited
{
text-decoration:none;
}
.noLine a:hover
{
text-decoration:none;
}
.noLine a:active
{
text-decoration:none;
}

/*Increases font sizes, used for titles*/
.large
{
font-size: 150%;
}

div.tableDiv
{
margin: 0px 160px 0px 160px;
padding:0px;
border: 0px solid red;
}

div.main2
{
color: #000000;
background-color: #FFFFFF;
margin: 0px 150px 0px 150px;
padding: 10px;
bottom: 0px;
border: 2px solid #00DD00;
height: auto;
}

div.main2 h1
{
text-align: center;
font-size: 350%;
}

div.spacer1
{
background-color: #000000;
margin: 0px 150px 0px 150px;
padding: 0px;
bottom: 0px;
border: 0px solid #00DD00;
height: 25px;
}

.links1
{
font-size: 50px;
font-family: "Segoe Print",Modern,"Comic Sans MS",arial;
text-align: center;
}

.font1
{
font-family: "Segoe Print",Modern,"Comic Sans MS",arial;
}
.para1
{
font-family: "Times New Roman",arial,"Segoe Print",Modern,"Comic Sans MS",arial;
line-height: 0.05cm;
margin-bottom: 0.15cm;
}
.centre
{
text-align: center;
}
.right
{
text-align: right;
}
.list1
{
margin-left: 30%;
}

/*creates borders around tables*/
.bordered
{
border: 1px solid black;
}
.bordered td
{
border: 1px solid black;
}
.bordered tr
{
border: 1px solid black;
}


.table1 /*Used for the Main pages' pictures and file data*/
{
margin-left: auto;
margin-right: auto;
padding: 1px;
float: left;
border: medium none rgb(255,255,0);
}

.table1 td /*Used for the Main pages' pictures*/
{
width: 300px;
text-align: center;
padding: 0px;
margin: 0px;
border: 0px none rgb(0,255,0);
}

.table2 /*Used for Video Main*/
{
margin-left: auto;
margin-right: auto;
border: medium none rgb(255,0,0);
}

div.romMap, div.ramMap, div.notes, div.downloads
{
  border: 1px dashed #709AD1;
  overflow: auto;
}

pre.romMap, pre.ramMap
{
  font-size: inherit;
  white-space: pre-line;
  display: inline;
}

.romMapTable, .ramMapTable /*Used for Toejam and Earl rom map*/
{
  font-family: "Courier New", monospace;
  font-size: 14px;
  white-space: normal;   
  margin-left: 1px;
  margin-right: 1px;
  margin-top: 5px;
  margin-bottom: 5px;
  padding: 1px;
  float: left;
  border: 1px solid black;
}

.romMapTable td.col0 /*Expander*/
{
  text-align: center;
}

.romMapTable td.col1 /*Offset*/
{
  width: 100px;
  padding-left: 2px;
}

.ramMapTable td.col1 /*Offset*/
{
  width: 90px;
  padding-left: 2px;
}

.romMapTable td.col2 /*Length*/
{
  width: 55px;
  text-align: center;
  padding-right: 5px;
}

.ramMapTable td.col2 /*GENS Offset*/
{
  width: 90px;
}

.romMapTable td.col3 /*Opcode*/
{
  width: 165px;
  padding-right: 5px;
}

.ramMapTable td.col3 /*Length*/
{
  width: 55px;
  text-align: center;
  padding-right: 5px;
}

.romMapTable td.col4 /*Instruction*/
{
  width: 245px;
  padding-right: 5px;
}

.ramMapTable td.col4 /*Original Value*/
{
  width: 150px;
  text-align: center;
}

.romMapTable td.col5 /*Description Header*/
{
  width: 332px;
}

.ramMapTable td.col5 /*Useful Value*/
{
  width: 150px;
  text-align: center;
}

.romMapTable td.col5_Content /*Description Content*/
{
  width: 315px;
  vertical-align: top;
}

.ramMapTable td.col6 /*Description Content*/
{
  width: 390px;
}

/*Colour for ROM and RAM Mapping sections*/
div.romMapKey, div.ramMapKey
{
  border: 1px solid black;
  padding: 10px 10px 10px 10px; 
  margin-left: 32px;
  margin-right: 32px;
  margin-top: 5px;
}

span.romMapKeyItem, span.ramMapKeyItem
{
  border: 1px solid black;
  padding: 2px;
}

.romHeader /*Standard ROM header*/
{
  background-color: #006CF8;
}

.generalRoutines /*General, uninteresting routines*/
{
  background-color: #00DCF8;
}

.dataBlock /*Blocks of Data*/
{
  background-color: #FFFF44;
}

.graphicsData /*Image Data*/
{
  background-color: #FFFFAA;
}

.gameDynamics /*Game Dynamics*/
{
  background-color: #66FF66;
}

.emptySpace /*Empty Space*/
{
  background-color: #FFFFFF;
}

.errorHandling /* Error Handling */
{
  background-color: #FF8080;
}

/*Used for the update text*/
.update 
{
margin-left: 15%;
margin-right: auto;
margin-bottom: 0px;
}

.update td
{
vertical-align: top;
}

/*used for notes and downloads section*/
.notesnumber 
{
margin-left:2%;
margin-right: auto;
margin-top:0px;
margin-bottom:0px;
}

/*used for notes and downloads section*/
.notestable 
{
margin-left: 4%;
margin-right: auto;
}

/*used for notes and downloads section*/
.notestable td 
{
padding-left: 25px;
padding-right: 25px;
}

.videotabletop
{
margin-left: auto;
margin-right: auto;
border: medium solid rgb(0,0,0);
}
.videotabletop td
{
text-align: left;
border: medium solid rgb(0,0,0);
}


.videotable
{
margin-left: auto;
margin-right: auto;
border: medium solid rgb(0,0,0);
border-top: medium none rgb(0,0,0);
}
.videotable td
{
text-align: left;
border: medium solid rgb(0,0,0);
}

/*Used to display all the main images such as game screenshots*/
.img1 
{
height: 224px;
width: 300px;
padding: 0px;
margin: 0px;
border: 0px none;
}

/*Used for screen shots on the project pages*/
.img2
{
height: 224px;
width: 300px;
margin-left: 2%;
margin-right: 0%;
border: 0px none;
}

.img3
{
height: 31px;
width: 88px; 
border: 0px none;
margin-bottom: 10px;
}