/* The ultimate debugger */
/*
* {
    border:1px solid #FF0000;
}
/**/

.clickable {
    cursor: pointer;
}

.navComp {
    font-weight:bold;
    /*color:#00ff00;*/
}



/*a:link { color: rgb(255, 255, 0); }*/

/*A:visited { color: rgb(128, 255, 255); }*/


aside {
    width: 20%;
    /* border: 1px solid #FFFFFF;*/
    float:right;
    text-align:center;
}


article {
    clear:both;
    width: 79%;
    /* border: 1px solid #999999;*/
    float:left;
}


body {
    /* border:1px solid gray;*/
    margin-left:auto;
    margin-right:auto;
    margin-top:0px;
    min-width:950px;
    /* Make sure to set max-width in the nav as well */
    /*max-width:1310px;*/
    max-width:1230px;
    font-family: "Trebuchet MS", Arial, Verdana,  Helvetica, sans-serif;
    font-size: 1em;
}

button.onSide {
    position:relative;
    top:-0.4em;
}


div.anchorshot {
    clear: right;
    float:left; 
    /*border: 1px solid #FFFFFF; */
}

div.anchorshot img {
    width:320px
}

div.content {
    width: 78%;
    /* border: 1px solid #999999;*/
    float:left;
}


div.footer {
    clear: both;
}





div.centerall {
    text-align:center;
}

div.desctext {
    float:right;
    width: 55%;
    /*border: 1px solid #FFFFFF;*/
}



div.nopics {
    /*float:right;*/
    clear:both;
    margin-left: 1%;
    width: 99%;
     /*border: 1px solid #FFFFFF;*/
}



div.rank {
    clear:both;
    /*border: 1px solid blue;*/
}

div.rank a.gameDrag, button.removeGame {
    padding-top: 0.5em;
    padding-bottom: 0.5em;
}

div.rank a.gameDrag {
    display:block;
    border: 1px solid;
    width:320px;
    text-decoration: none;
}

button.removeGame {
    float:left;
}


div.reldate {
    text-align:center;
	 /*border: 1px solid #FFFFFF;*/
    margin-bottom: 1em;
}


div.sidebar {
    width: 20%;
    /* border: 1px solid #FFFFFF;*/
    float:right;
    text-align:center;
}


div.tooltip:hover:after {
    content: attr(data-tooltip);
}


div.youtube {
    text-align: center;
}

div.youtube iframe {
    border: none;
}



footer {
    /*clear: left;*/
    clear: both;
}




/* For Left side scrolling images up/down with text on right. */
div.articleText {
    padding-left: 340px;
    position:relative;
}

div.screenShots {
    overflow: hidden;
    height:100%;
    position:absolute;
    top:0px;
    left:0px;
}

div.screenShots img {
    width:320px;
    /* Screenshot images must be in block to flow downwards instead of across*/
    display:block; 
    border:none;
}

img.scrollies {
    width:auto; 
    position: absolute; 
    left:139px; 
    display:none;
}

img#screenShotScrollDown {
    bottom:50px;
}

img#screenShotScrollUp {
    top:50px;
}




/*
html { 
    background-color: rgb(0, 0, 0);
    color: rgb(255, 255, 255);
}
*/



/* Default h1-h3 font sizes based on HTML 4 default style sheet.  
Overrides browsers.
*/
h1 { 
    text-align: center; 
    margin-bottom:0.2em;
    /*border: 1px solid #ff0000;*/
    font-size:2em;
}

h2 {
    font-size:1.5em;
}

h3 {
    font-size:1.17em;
   padding: 0em;
   margin-top: 1.5em;
}

h2, h3 { 
    text-align: center;
    margin-bottom: 0em;
}

h1, h2, h3 {
    font-family:"Courier New", Courier;
}



img.toTheTop {
    position: fixed;
    bottom: 2em;
    right: 2em;
    display: none;
    opacity: 0.5;
}
img.toTheTop:hover {    
    opacity:1;
}




img.thumb { 
    width:320px ;
}



img.borderless { border:none}






/* This whole nav stuff is the make the nav bar centered AND fixed to top of
browser */
nav {
    position:fixed;
    max-width:1310px;
    width:100%;
    text-align:center;
    background-color: #FFFFFF;
    z-index:1000;
    font-weight: bold;
}
nav ul {
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    /* for submenus */
    list-style:none;
    position: relative; 
    display: inline-table;
}
/********** display:inline-block????? Doesn't look like this fix is needed*****/
/*
nav ul:after { 
    content: ""; 
    clear: both; 
    display: block;
}
/**/
nav ul li {
    float:left;
}
nav ul li a {
    display:block;
    padding:5px;
    text-decoration:none;
}
/*
nav ul li a:link, nav ul li a:visited {
    color: #00ff00;
    background-color: #000000;
    background:transparent;
}
*/
nav ul li a:hover {
    color: #00FF00;
    background-image:url('/imgs/gradientbuttongreen.jpg');
    background-repeat:repeat-y;
    background-size:contain;
}
nav ul li img {
    padding:0;
    margin:0;
    text-decoration:none;
    border:none;
}

/*submenus stuff */
nav ul ul {
    display:none;
    position: absolute; 
    top: 100%;
}
nav ul ul li {
    float:none;
    position: relative;
    background:#FFFFFF;
}
/* Only the specific hovered over li's child ul will display in block 
** ie make it appear. */
nav ul li:hover > ul {
    display:block;
}




p.gamelink { text-align: center ;
}

p.logo { 
    margin-left:auto;
    margin-right:auto;
    text-align:center;   
    line-height:0%;
    padding: 0px;
    margin: 0px;
}



/*DEBUG*/
/*
table, td { 
    border:1px solid white;
}
/**/


table.arenas,  table.rsslga, table.centerMe { 
    /* Centers the table */
    margin-left:auto;
    margin-right:auto;
}
table.rsslga th {
    /* This should match h2 */
    font-size:1.5em;
    font-family: "Courier New", Courier;
}

table.borders {
    border:1px solid gray;
}

table.borders td, table.borders th {
    border:1px solid gray;
    padding: 0.25em;
}


table.comparer {
    border:1px solid gray;
    margin-left:auto;
    margin-right:auto;
}

table.comparer td {
    border:1px solid gray;
}

table.comparer th {
    border:none;
    padding:0px;
    margin:0px;
}


table.gameList {
    border:0px solid white;
    margin-left:auto;
    margin-right:auto;
    width:320px;
}

table.gameList img {
    border: none;
}

table.gameList td.thumb {
    border:0px solid white;
    width:160px;
    font-size:0px;
}

table.gameList td {
    text-align:left;
}


table.logo {
    /*border:1px solid #FF0000;*/
    width: 100%;
    margin-left:auto;
    margin-right:auto;
}

table.logo td {
    /*border:1px solid #FF0000;*/
    /*evenly split the left and right table colums.*/
    width: 25%;
    text-align: center;
}

table.logo td.logo {
    width: 370px;
    /*border:1px solid #FF0000;*/
}



td.arenas { 
    width: 7em;
    text-align: left;
}


/* Only used by SOASE and TDU. */
td.ImageCol { 
    width:330px ;
    vertical-align:top ;
    }

td.picAd {
    /* this stops gaps from appearing in a cell that has an image only. */
    font-size:0px;
    margin:0px;
    padding:0px;
}

td.textAd {
    border:1px solid #505050;
    height:100%;
    padding:0.3em;
}






ul {
    margin-top:0em;
}

ul.paragraph li {
    margin-bottom:1em;
}

ul.navlinks { 
    list-style-type:none;
    text-indent:-20px;
}

ul.navlinks li {
    margin-bottom:1em;
}



div.pageControl {
    display:inline;
}
div.pageControl p {
    display:inline;
}

div.ddl {
    /*float:right;*/
    display:inline;
}
div.ddl ul {
	padding :0 1em;
	list-style: none;
	position: relative;
	display: inline-table;
}
div.ddl ul li:hover > ul {
    display: block;
}
div.ddl ul ul {
    display: none;
    font-weight:normal;
}

div.ddl ul:after {
	content: ""; clear: both; display: block;
}

div.ddl ul li {
    display:inline;
    /*float: left;*/
}


div.ddl ul li:hover a {
	/*color: #fff;*/
}

div.ddl ul li a {
    display: block;
}

/*
div.ddl ul ul {
    background: #000000;
    padding-bottom: 1em;
    position: absolute; 
    top: 100%;
}
*/
div.ddl ul ul li {
	/*float: none; */
	/*border-top: 1px solid #6b727c;*/
	/*border-bottom: 1px solid #575f6a;*/
	position: relative;
}
/*
div.ddl ul ul li a {
	background:#000000;
}	
*/




span.timestamp {
    margin-right:5em;
}
span.timestamp, span.authorship {
    font-size:0.70em;
}