/** Please put all crucial styles here: ie. ned specific things, such as display: none for debug etc.
Note that this style sheet should be able to be used in conjunction with a frontend style sheet without
"breaking" frontend design **/

.feedback {
        font-size: 8pt;
}

.feedback_problem {
        color: red;
}

.feedback_notice {
        color: blue;
}

.feedback_debug {
        color: grey;
        display: none;
}
.nowrap { white-space: nowrap; }
.vbottom { vertical-align: bottom; }
.tr_off  { display: none; }
.tr_on  { display: table-row; }
.comment { 
        color: blue; 
        font-size: x-small;
}
.tiny { font-size: 7pt; }
/*** Start tab style ***/
ul#tabnav {
font: bold 11px verdana, arial, sans-serif;
list-style-type: none;
padding-bottom: 24px;
border-bottom: 1px solid  #7B7984;
margin: 0;
}

ul#tabnav li {
float: left;
height: 21px;
background-color: #7B7984;
margin: 2px 2px 0 2px;
border: 1px solid #7B7984;
}

li.tab {
border-bottom: 1px solid #fff;
background-color: #fff;
}

li.tab a {
color: #fff;
}

#tabnav a {
float: left;
display: block;
color: #fff;
text-decoration: none;
padding: 4px;
}

#tabnav a:hover, #tabnav a:active, #tabnav li.selected a {
background: #fff;
color: #000;
}
/*** End tab style ***/
div.editlink {
        margin-top: 10px;
        margin-right: 5px;
}
div.editlink a {
        background-image: ('/ned/images/button_edit.gif');
        background-position: left;
        background-repeat: no-repeat;
        padding-left: 20px;
        font-weight: bold;
}
.editlink a:hover {
        border-bottom: 1px solid #ddd;
}
.sortingup { background-image: url('/ned/images/sortup.gif'); background-position: right; background-repeat: no-repeat; padding-right: 12px; }
.sortingdown { background-image: url('/ned/images/sortdown.gif'); background-position: right; background-repeat: no-repeat;padding-right: 12px;}


/****** End crucial ned ****** */
* {margin:0;padding:0; border: 0px none;}
ul, ol, li {list-style-type:none;}
a { text-decoration: none; color: #008fbf; font-weight: bold;}
a:hover {color: #ff9d00;}

body {
font: 62.5% "Arial", Helvetica, san-serif;  
background: #090200 url(/images/bg.jpg) center 0 repeat-y;
color: #330000;
}
#top-bg { /* top edge noise gradient  */
background: url(/images/bg-top.jpg) center 0 no-repeat;
width: 1000px;
margin: 0 auto;
padding: 25px 0;
}
#banner { 
width: 728px;
height: 90px;
background: #000;
margin: 8px auto;
padding: 0;
text-align: center;
color: #f5f5db;
font: normal 1.3em/1.1em "Arial", Helvetica, san-serif;
}
#wrapper {
width: 791px;
margin: 0 auto;
}



/* logos and characters image --------------------------------*/
#header {
width: 781px;
height: 260px;
padding: 5px 5px 0;
background: url(/images/header-bg.gif) 0 0 no-repeat;
}
body.home #header {background: url(/images/header-home-bg.gif) 0 0 no-repeat;}
#header #characters {
width: 781px;
height: 186px;
margin: 0 0 5px;
background: #972800 url(/images/header.gif) 0 0 no-repeat;
}
h1 { 
float: left;
width: 252px;
text-align: right;
font: bold 3.5em/1.1em "Arial", Helvetica, san-serif;
}
h1 img { margin: 12px 0 6px ;}
h1 a { color: #8ce1ff;}
#header p { /* magazine titles  */
float: left;
clear: left;
text-align: right;
width: 214px;
}



/* main navigation */
#nav {
height:64px;
width:781px;
font: bold 1.2em/1em Arial, Helvetica, sans-serif;
float: left;
background: #ff9a00;
}
#nav ul {width:781px;height:64px; }
#nav ul li {float:left;}
#nav ul li a {display:block;height:64px; color: #854b0d; outline: none;}
#nav ul li.home a {background:url(/images/nav-bg.jpg) 0 0;width:113px;}
#nav ul li.home a:hover, #nav ul li.home a.active {background:url(/images/nav-bg.jpg) 0 -64px; }
#nav ul li.what a {background:url(/images/nav-bg.jpg) -113px 0;width:111px;}
#nav ul li.what a:hover, #nav ul li.what a.active {background:url(/images/nav-bg.jpg) -113px -64px; }
#nav ul li.times a {background:url(/images/nav-bg.jpg) -224px 0;width:111px;}
#nav ul li.times a:hover, #nav ul li.times a.active {background:url(/images/nav-bg.jpg) -224px -64px; }
#nav ul li.games a {background:url(/images/nav-bg.jpg) -335px 0;width:111px;}
#nav ul li.games a:hover, #nav ul li.games a.active {background:url(/images/nav-bg.jpg) -335px -64px; }
#nav ul li.char a {background:url(/images/nav-bg.jpg) -446px 0;width:111px;}
#nav ul li.char a:hover, #nav ul li.char a.active {background:url(/images/nav-bg.jpg) -446px -64px; }
#nav ul li.comp a {background:url(/images/nav-bg.jpg) -557px 0;width:111px;}
#nav ul li.comp a:hover, #nav ul li.comp a.active {background:url(/images/nav-bg.jpg) -557px -64px; }
#nav ul li.about a {background:url(/images/nav-bg.jpg) -668px 0;width:113px;}
#nav ul li.about a:hover, #nav ul li.about a.active {background:url(/images/nav-bg.jpg) -668px -64px; }
#nav ul li a span {display:none;}



/* main content area --------------------------------*/
#content {
width: 791px;
float: left;
background: url(/images/content-btm.gif) 0 bottom no-repeat;
}
#content-top {
width: 781px;
float: left;
background: url(/images/content-top.gif) 0 0 no-repeat;
padding: 0 5px 5px;
}
body.home #content {
width: 791px;
float: left;
background: url(/images/content-home-btm.gif) 0 bottom no-repeat;
}
body.home #content-top {
width: 781px;
float: left;
background: url(/images/content-home-top.gif) 0 0 no-repeat;
padding: 14px 5px;
}
body.home #content p img a {text-align: center;}



/* common font styles --------------------------------*/
h2 {
font: bold 3.3em/1.1em "Arial", Helvetica, san-serif;
background: url(/images/border.gif) 0 bottom repeat-x;
padding: 0 0 12px;
margin: 12px 12px 15px;
letter-spacing: -0.02em;
}
h2 img.right {
float: right;
padding: 10px 0 0;
}
body.home h2 {margin: 0 0 15px;}
h3 {
font: bold 1.8em/1.2em "Arial", Helvetica, san-serif;
margin: 0 0 3px;
color: #660000;
letter-spacing: -0.02em;
}
h3 span {
color: #ff0000;
font: normal 0.7em/1.2em "Arial", Helvetica, san-serif;
}
p {
font: normal 1.15em/1.3em "Arial", Helvetica, san-serif;
margin: 0 0 12px;
}



/* home page unique elements */
body.home #content #cols { 
width: 781px;
background: #f5f5dc url(/images/home-content-divider.gif) 0 0 repeat-y;
float: left;
}
body.home #content #cols div {
width: 232px;
padding: 5px 13px 0 15px;
float: left;
}
body.home #content #cols p.center { text-align: center;}



/* comman page elements */
#content #left { 
width: 154px;
background: #2c0c00 ;
float: left;
}
#content #right { 
width: 622px;
float: right;
}
#content #right #inside-left {
float: left;
width: 315px;
} 
#content #right #inside-right {
float: left;
width: 307px;
text-align: center;
} 
body.games #content #right #inside-right { text-align: left;}
#content #left #play-the-game, #content #left #win-great-prizes, #content #left #got-skillz {
width: 154px;
height: 41px;
text-align: center;
padding: 211px 0 0;
}
#content #left #play-the-game {background: #008fbf url(/images/play-the-game-bg.gif) 0 0 no-repeat; margin: 0 0 5px;}
#content #left #win-great-prizes {background: #ffc300 url(/images/win-great-prizes-bg.gif) 0 0 no-repeat;} 
#content #left #got-skillz {background: #00cbfe url(/images/got-skillz-bg.gif) 0 0 no-repeat;margin: 0 0 5px;} 
#content #left #play-the-game p, #content #left #win-great-prizes p {margin: 0;}
#content #left #play-the-game p a, #content #left #win-great-prizes p a {color: #fff; font-size: 1.4em;}
#content #right h3 {margin: 0 12px 5px;}
#content #right p {margin: 0 12px 10px;}
#content #right p.logos img { margin: 0 25px 0 0;}
#content #right ul{
font: normal 1.15em/1.25em "Arial", Helvetica, san-serif;
margin: 0 0 12px;
}
#content #right ul li {
margin: 0 12px 2px;
background: url(/images/bullet.gif) 0 5px no-repeat;
padding: 0 0 0 8px;
}
#content #right img.right { float: right; clear: right; margin: 0 12px 12px;}
#content #right #inside-left img.center { margin: 0 0 5px 25px;}
#content #right p.pages {
background: url(/images/border.gif) 0 0 repeat-x;
padding: 12px 0 5px;
font-size: 1.2em;
}
#content #right p.pages a { padding: 0 2px; }
#content #right p.pages a.gap { margin-left: 25px; }
.pages .active { font-weight: bold; color: #999; }

/* login are (on left hand side) */
#content #left #login {
width: 154px;
text-align: center;
background: #00ccff url(/images/login-left-bg.gif) 0 0 no-repeat;
margin: 0 0 5px;
}
#content #left #login div {
width: 140px;
padding: 7px 7px 12px;
background: transparent url(/images/login-left-bg-btm.gif) 0 bottom no-repeat;
}
#content #left #login h4 {
font: bold 1.3em/1.1em "Arial", Helvetica, san-serif;
color: #660000;
background: #ffd806;
margin: 0 0 15px;
}
#content #left #login form p {
margin: 0 5px;
font: normal 1.3em/1.2em "Arial", Helvetica, san-serif;
}
#content #left #login form input {
width: 120px;
margin: 0 0 5px;
}
#content #left #login form input.btn {
width: auto;
height: auto;
background: #00a1d7;
border: 0;
font: bold 1.2em/1.2em "Arial", Helvetica, san-serif;
color: #fff;
padding: 0;
margin: 0 0 2px 0; 
}



/* character rollovers */
ol#char-rolls, div.characters {
width:101px;
font: bold 1.4em/1em Arial, Helvetica, sans-serif;
float: left;
padding: 0 0 0 12px;
}
ol#char-rolls li {float:left;  background: none;margin: 0 0 5px 0;}
ol#char-rolls li a {display:block; height:89px; width:89px; color: #854b0d; }
ol#char-rolls li.zeno a {background:url(/images/characters/characters-rollovers.jpg) 0 0;}
ol#char-rolls li.zeno a:hover, ol#char-rolls li.zeno a.active {background:url(/images/characters/characters-rollovers.jpg) -89px 0; }
ol#char-rolls li.rozi a {background:url(/images/characters/characters-rollovers.jpg) 0 -89px;}
ol#char-rolls li.rozi a:hover, ol#char-rolls li.rozi a.active {background:url(/images/characters/characters-rollovers.jpg) -89px -89px; }
ol#char-rolls li.fenn a {background:url(/images/characters/characters-rollovers.jpg) 0 -178px;}
ol#char-rolls li.fenn a:hover, ol#char-rolls li.fenn a.active {background:url(/images/characters/characters-rollovers.jpg) -89px -178px; }
ol#char-rolls li.maz a {background:url(/images/characters/characters-rollovers.jpg) 0 -267px;}
ol#char-rolls li.maz a:hover, ol#char-rolls li.maz a.active {background:url(/images/characters/characters-rollovers.jpg) -89px -267px; }
ol#char-rolls li a span {display:none;}



/* game instructions */
#instructions {
width: 610px;
margin: 0 0 12px;
padding: 0 0 0 12px;
text-align: left;
float: left;
}
#instructions div {
width: 598px;
float: left;
background: url(/images/instructions-bg.gif) 0 bottom no-repeat;
margin: 0;
padding: 0 0 5px;
}
#content #right #instructions h3 {
background: url(/images/instructions-top.gif) 0 0 no-repeat;
height: 36px;
padding: 11px 0 0 15px;
margin: 0 0 3px;
}
#content #right #instructions p { margin: 0 15px 10px; background: url(/images/controls-arrow.gif) 0 0 no-repeat; text-indent: 19px;}
#content #right #instructions p.none { background: none; text-indent: 0;}
#content #right #instructions img { float: right; margin: 15px;}



/* table elements (competitions page) */
table {
width: 598px;
font: normal 1em/1em "Arial", Helvetica, san-serif;  
margin: 0 12px 12px;
text-align: left;
clear: both;
background: #fff url(/images/table-bg.gif) 0 0 repeat-y;
}
table thead th {
background: #ffc003 url(/images/table/thead.gif) 0 0 no-repeat; 
height: 41px;
color: #660000;
padding: 0 17px;
font: bold 1.7em/2em "Arial", Helvetica, san-serif;  
}
table span { color: #660000; font-weight: bold;}
table thead th b { color: #ff0000;}
table tbody th {
padding: 7px 10px;
background: #33cc66;
font: bold 1.5em/1.2em "Arial", Helvetica, san-serif;  
border-left: 2px solid #660000;
}
table tbody th.greenleft {
background: #33cc66 url(/images/table/tbody-th-left.gif) 0 0 no-repeat;
border-left: 7px solid #660000;
}
table tbody th.greenright {
background: #33cc66 url(/images/table/tbody-th-right.gif) right 0 no-repeat;
border-right: 7px solid #660000;
}
table thead th.right { background: #665546 url(/images/th-right.gif) right 0 no-repeat;}
table thead tr th.topright { background: url(/images/th-topright.gif) right 0 no-repeat;}
table tbody td {
padding: 7px 10px 14px;
border-top: 2px solid #660000;
border-left: 2px solid #660000;
font: normal 1.15em/1.3em "Arial", Helvetica, san-serif;  
}
table tbody td.btmleft { background: url(/images/table/tbody-td-btmleft.gif) 0 bottom no-repeat;border-left: 0; padding-left: 17px;}
table tbody td.btm { background: url(/images/table/tbody-td-btm.gif) 0 bottom repeat-x; }
table tbody td.btmright{ background: url(/images/table/tbody-td-btmright.gif) right bottom no-repeat;}
table .winners {
background: #f5f5dc;
border: 1px solid #330000;
margin: 0 6px 6px 0;
padding: 6px 10px;
}
#content #right table .winners h3 {
margin: 0 0 3px;
font: bold 1.35em/1.2em "Arial", Helvetica, san-serif;  
}
#content #right table .winners h4 {
margin: 0;
font: bold 1.1em/1.2em "Arial", Helvetica, san-serif;  
}
#content #right table .winners p {
margin: 0;
padding: 6px 0 0;
font: normal 1em/1.35em "Arial", Helvetica, san-serif;  
}




/* top 10 scorers */
#content #left #top-ten {
width: 154px;
background: #00ccff url(/images/top-ten-container-top.gif) 0 0 no-repeat;
}
#content #left #top-ten div {
width: 154px;
text-align: center;
padding: 7px 0;
background: transparent url(/images/top-ten-container-btm.gif) 0 bottom no-repeat;
}
#content #left #top-ten div h4 {
margin: 0 0 3px;
font: bold 1.4em/1.2em "Arial", Helvetica, san-serif;  
}


/* top ten table elements */
table#scoreboard {
width: 140px;
font: normal 1em/1em "Arial", Helvetica, san-serif;  
margin: 0 0 0 7px;
text-align: left;
background: #fff;
}
table#scoreboard thead th {
padding: 5px 0 5px 5px;
border: 0;
font: bold 1.1em/1.2em "Arial", Helvetica, san-serif;  
background: #2c0c00;
color: #fff;
height: auto;
}
table#scoreboard thead th.topleft { background: #2c0c00 url(/images/table/top-10-th-left.gif) 0 0 no-repeat;}
table#scoreboard thead th.topright { background: #2c0c00 url(/images/table/top-10-th-right.gif) right 0 no-repeat;}
table#scoreboard tbody td {
padding: 3px 0 3px 5px;
border: 0;
font: normal 1.1em/1.2em "Arial", Helvetica, san-serif;  
}
table#scoreboard td span { color: #ff0000; font-weight: bold;}
table#scoreboard tbody tr.alt td {background: #e9e6e5;}
table#scoreboard tbody td.btmleft { background: url(/images/table/top-10-td-left.gif) 0 bottom no-repeat;}
table#scoreboard tbody td.btmright { background: url(/images/table/top-10-td-right.gif) right bottom no-repeat;}



/* top ten table elements */
#gamers-lounge {
width: 598px;
font: normal 1em/1em "Arial", Helvetica, san-serif;  
margin: 0 0 12px 12px;
text-align: left;
float: left;
background: #00ccff url(/images/gamers-lounge-top.gif) 0 0 no-repeat;
}
#gamers-lounge div {
width: 582px;
padding: 8px 8px 1px;
float: left;
margin: 0;
background: transparent url(/images/gamers-lounge-btm.gif) 0 bottom no-repeat;
}
#gamers-lounge div div {
background: #fff url(/images/gamers-lounge-div-top.gif) 0 0 no-repeat;
width: 287px;
padding: 0;
float: left;
margin: 0 0 7px;
}
#gamers-lounge div div#scoreboard {float: right;}
#gamers-lounge div div div {
background: transparent url(/images/gamers-lounge-div-btm.gif) 0 bottom no-repeat;
width: 269px;
padding: 9px 9px 1px;
float: left;
text-align: center;
margin: 0;
}
#content #right #gamers-lounge h3 {
background: transparent url(/images/gamers-lounge-h3-bg.gif) 0 0 no-repeat;
width: 547px;
height: 27px;
font: bold 1.65em/1.7em "Arial", Helvetica, san-serif;  
color: #660000;
padding: 0 0 0 35px;
margin: 0 0 7px;
text-align: left;
}
#gamers-lounge h4 {
background: transparent url(/images/gamers-lounge-h4-bg.gif) 0 0 no-repeat;
width: 261px;
height: 27px;
font: bold 1.55em/1.8em "Arial", Helvetica, san-serif;  
color: #660000;
padding: 0 0 0 8px;
margin: 0 0 7px;
text-align: left;
}
#content #right #gamers-lounge p {
padding: 0;
margin: 0 5px 7px;
}
#gamers-lounge table#scoreboard {
width: 269px;
margin: 0 0 10px; 
border-bottom: 1px dotted #79705d;
}
#gamers-lounge table#scoreboard thead th.topleft { background: #2c0c00 url(/images/table/lounge-th-left.gif) 0 0 no-repeat;}
#gamers-lounge table#scoreboard thead th.topright { background: #2c0c00 url(/images/table/lounge-th-right.gif) right 0 no-repeat;}
#content #right #gamers-lounge p {text-align: left; clear: left;}
#content #right #gamers-lounge ul{
font: normal 1.15em/1.25em "Arial", Helvetica, san-serif;
margin: 0 0 8px;
text-align: left;
}
#content #right #gamers-lounge ul li {
margin: 0 0 2px;
background: none;
padding: 0 0 2px;
border-bottom: 1px dotted #79705d;
clear: left;
font-weight: bold;
}
#content #right #gamers-lounge ul li span { 
width:95px;
float: left;
clear: left;
font-weight: normal;
}
#content #right #gamers-lounge b { color: #ff0000;}
#gamers-lounge div div div div {
background: 0;
width: 185px;
padding: 0;
float: right;
margin: 0;
}
#content #right #gamers-lounge div div div div p { margin: 0 0 7px;}
#content #right #gamers-lounge div div div img.left {float: left;}
#content #right #login p.arrow, #content #right #gamers-lounge p.arrow {clear: both;}
#content #right p.arrow a {
padding: 0 0 0 20px;
background: url(/images/controls-arrow.gif) 0 0 no-repeat;
}




/* login page */
#login {
width: 350px;
margin: 0 auto;
text-align: center;
}
#login div {
width: 350px;
text-align: left;
background: url(/images/login-bg-top.gif) 0 0 no-repeat;
}
#login div div {
width: 336px;
text-align: left;
padding: 7px;
background: url(/images/login-bg-btm.gif) 0 bottom no-repeat;
}
#content #right #login h3 {
background: transparent url(/images/login-h3-bg.gif) 0 0 no-repeat;
width: 336px;
height: 27px;
font: bold 1.6em/1.7em "Arial", Helvetica, san-serif;  
color: #660000;
padding: 0 0 0 35px;
margin: 0 0 17px;
text-align: left;
}
#content #right #login p { margin: 0 0 15px;}
#content #right #login div div p { margin: 0 10px 8px;}
#content #right form p {font: normal 1.3em/1.2em "Arial", Helvetica, san-serif; margin: 0;}
form input, form select {
font: normal 1em/1.1em "Arial", Helvetica, san-serif;
padding: 4px;
background: #fff;
border: 1px solid #cccccc;
margin: 0 0 7px;
color: #330000;
}
form input.checkbox {
padding: 0;
background: auto;
border: 0;
margin: 0 0 7px;
}
form select {padding: 3px;}
form label {
float: left;
clear: left;
width: 80px;
text-align: right; 
padding-right: 15px;
line-height: 2em;
}
form input.btn {
width: auto;
height: auto;
background: #00a1d7;
border: 0;
font: bold 1.2em/1.2em "Arial", Helvetica, san-serif;
color: #fff;
padding: 0;
margin: 5px 2px 0 0; 
}
form input#Login {margin-left: 95px; }
textarea:focus, 
input:focus,
select:focus { border: 1px solid #00ccff; background: #f5f5dc; }




/* register page */
#register {
width: 550px;
margin: 0 auto 10px;
text-align: center;
background: url(/images/register-bg-top.gif) 0 0 no-repeat;
}
#register #bottom {
width: 536px;
text-align: left;
padding: 7px 7px 15px;
background: url(/images/register-bg-btm.gif) 0 bottom no-repeat;
}
#content #right #register h3 {
background: transparent url(/images/register-h3-bg.gif) 0 0 no-repeat;
width: 500px;
height: 27px;
font: bold 1.65em/1.7em "Arial", Helvetica, san-serif;  
color: #660000;
padding: 0 0 0 36px;
margin: 0 0 17px;
text-align: left;
}
#register form label {width: 135px;}
#register form p.captcha {
float: left;
width: 380px;
padding-left: 10px;
margin: 0;
}
#register form p.captcha img {
float: right;
margin: 0 0 7px;
}
#register form input#Submit {margin-left: 150px; }
#register form input#Exit {margin-left: 207px; }




/* contact box */
#contact-box {
width: 295px;
float: left;
background: url(/images/contact-box.gif) 0 bottom no-repeat;
margin: 0 0 12px;
text-align: left;
}
#content #right #contact-box h3 {
background: url(/images/contact-box-top.gif) 0 0 no-repeat;
height: 36px;
padding: 11px 0 0 15px;
margin: 0 0 3px;
}
#content #right #inside-right #contact-box p { margin: 0 15px 15px;}




/* clear everything (IE6 bug fix) */
#clearall { 
width: 100%;
clear: both;
}



/* footer area outside container */
#footer {
clear: both;
margin: 0 auto;
padding: 15px 0 0;
width: 791px;
height: 50px;
}
#footer p {
text-align: center;
margin: 0;
font: normal 1.1em/1.6em "Arial", Helvetica, san-serif;
color: #fff;
}
#footer a { color: #fff; padding: 0 5px;}
#footer a:hover {color: #ffd100;}