/*#############################################################
Name: Dark Ritual
Date: 2006-11-06
Description: Tribal-style three column layout.
Author: Viktor Persson
URL: http://templates.arcsin.se

Feel free to use and modify but please provide credits.
#############################################################*/

/* standard elements */
* {
	margin: 0;
	padding: 0;
}

a {color: #682; text-decoration: none;}

a:hover {color: #CBCF99; text-decoration:underline;}

a img
{  border-style: none; }

body {
	background: #333 url(img/bg.gif);
	color: #333;
	font: normal 62.5% "Lucida Sans Unicode",sans-serif;
	margin: 3% 0;
}

p,ul {
	padding-bottom: 1em;
}

ul {margin-left: 1.2em;}

li {list-style: none;}
li a { text-decoration:none;}
li a:hover { text-decoration:underline;}
.main li {list-style-image: url(img/li.gif);}


blockquote {
	background: #FFF;
/*	border-top: 1px solid #6C6E58;
	border-bottom: 1px solid #6C6E58;
*/	color: #111;
	display: block;
	font-size: 0.9em;
	margin-bottom: 1.2em;
	padding: 6px 10px 6px 10px;
}
/* blockquote p {padding: 3px 0;} 
blockquote a { color:#3E423A;}
blockquote a:hover { color:#6C6E58;}
*/

h1 {color: #682;}

h1 {font-size: 16px;}
h1.up {text-transform:uppercase;}
h2 {font-size:14px;}
h3 {font-size:12px;}
h4 {font-size:10px;}

/* misc */
.clearer {clear: both;}
.main_right .padded {padding: 6px 2px 18px 16px;}
.main .padded {padding: 8px 10px; margin-bottom: 22px;}
.mainW .padded {padding: 8px 12px; margin-bottom: 28px; }
.meta {font-size: 0.8em; color: #666;}
.left {float: left;}
.right {float: right;}

/* structure */
.container {
	font-size: 1.2em;
	background: url(img/bgcontainer.gif) repeat-y;
	margin: 0 auto;
	width: 840px;
	border: 12px solid #222;
}

.containerW {
	font-size: 1.2em;
	background: url(img/bgcontainerW.gif) repeat-y;
	margin: 0 auto;
	width: 840px;
	border: 12px solid #222;
}

/* header */
.header {
	float: left;
	width: 640px;
 	background: url(img/header.jpg) no-repeat;
/* 	background: url(i/bg-logo.gif) no-repeat;  */
	font: normal 2.4em Verdana,sans-serif;
	line-height: 150px;
	text-align: center;	
}

.header a {	text-decoration:none; color:#1A1A1A; }
/* .header a:hover {	text-decoration:underline; color:#000000; }  */

/* structure */
.top {
	background: #222;
	color: #DDD;
	float: left;
	font: normal 1.4em Verdana;
	height: 50px;
	text-align: center;
	width: 639px;
}
.subnav {
	float: left;
	width: 160px;
}
.subnav1 {
	float: left;
	width: 160px;
}
.main {
	float: left;
	width: 480px;
}
.mainW {
	float: left;
	width: 630px;
	background-color:#F7F7F7;
/*	margin-top:-7px;
*/
	background: url(img/bgcontainerW.gif) repeat-y;

}
.main_right {
	float: right;
	width: 200px;
	color: #CCC;
}



/* sub-navigation */
.subnav h1 {
	background: #222;
	color: #FFE;
	font: bold 1.1em Verdana,sans-serif;
	line-height: 20px;
/*	padding-left: 2px;  */
	text-align:center;
}
.subnav ul {margin: 0; padding: 0;}
.subnav li {
	border-bottom: 1px solid #3E423A;
	list-style: none;
}
.subnav li a {
	background: #6C6E58;
	color: #111;
	display: block;
	padding: 1px 0px 1px 5px;
	width: 155px;
	text-decoration: none;
	text-align:center;
	color: #000000;
}
.subnav li a:hover {
/*	text-decoration:underline; */
	background: #748A51;
	color: #000000;
}



/*
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	Tables Styling
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
*/
td, th {
	font: 10px verdana;
}
.datatable {
	clear:both;
	border: 1px solid #D6DDE6;
	border-collapse: collapse;
/*	width: 89%; */
}
.datatable a {
	text-decoration: none;
}
.datatable a:hover {
	text-decoration:underline;
}
.datatable td {
	border: 1px solid #D6DDE6;	
	padding: 4px;
}
.datatable th {
	border: 1px solid #828282;
	background-color: #cbcbcb;
/*	text-align: left; */
	padding-left: 4px;
	color: #333;
	font-weight: bold;
}
.datatable caption {
	font: bold 0.9em Arial, Helvetica, sans-serif;
	color: #33517A;
/*	text-align: left;  */
	padding-top: 3px;
	padding-bottom: 8px;
}
.datatable tr.altrow {
	background-color: #DFE7F2;
}
tr.altrow td {
	color: #333!important;
}
.datatable tr:hover {
	background-color: #dff;
	color: #111;
}



.search { border: 1px solid #222; background: #fff; color: #529214; padding: 1px 2px 1px 2px; margin: 0; font-weight: bold; font-size: 1.3em;  }
/*
.button { border: 1px solid #000; color: #000000; background: #89866F; padding: 0px; }
.button:hover { border: 1px solid #89866F; color: #89866F; background: #000000; font: bold; }
*/

/* BUTTONS */

.buttons a, .buttons button{
    display:block;
    float:none;
    margin:0 7px 0 0;
    background-color:#f5f5f5;
    border:1px solid #dedede;
    border-top:1px solid #eee;
    border-left:1px solid #eee;

    font-family:"Lucida Grande", Tahoma, Arial, Verdana, sans-serif;
    font-size:100%;
    line-height:130%;
    text-decoration:none;
    font-weight:bold;
    color:#565656;
    cursor:pointer;
    padding:3px 10px 4px 7px; /* Links */
}
.buttons button{
    width:auto;
    overflow:visible;
    padding:2px 10px 1px 7px; /* IE6 */
}
.buttons button[type]{
    padding:3px 10px 3px 7px; /* Firefox */
    line-height:17px; /* Safari */
}


  /* IE7 */
/*
*:first-child+html button[type]{
    padding:2px 10px 1px 7px; 
} 
*/

/*
.buttons button img, .buttons a img{
    margin:0 3px -3px 0 !important;
    padding:0px;
    border:none;
    width:16px;
    height:16px;
}
*/
/* STANDARD */

button:hover, .buttons a:hover{
    background-color:#dff4ff;
    border:1px solid #c2e1ef;
/*     color:#336699; */
}
.buttons a:active{
    background-color:#6299c5;
    border:1px solid #6299c5;
/*    color:#fff; */
}

/* POSITIVE */

button.positive, .buttons a.positive{
    border:1px solid #529214;
    background-color:#E6EFC2;
	padding: 4px 6px 4px 6px;
}
.buttons a.positive:hover, button.positive:hover{
    background-color:#d3e173; 
    border:1px solid #529214;
/*    color:#529214; */
}
.buttons a.positive:active{
    background-color:#529214;
    border:1px solid #529214;
/*    color:#fff; */
}

/* NEGATIVE */

/*.buttons a.negative, button.negative{ */
button.negative, .buttons a.negative{
	border:1px solid #d12f19;
    background:#fbe3e4;
	padding: 4px 6px 4px 6px;
}
.buttons a.negative:hover, button.negative:hover{
    background:#f598a1;
/*     border:1px solid #fbcdce;  */
/*    color:#fff; */
}
.buttons a.negative:active{
    background-color:#d12f19;
    border:1px solid #d12f19;
/*    color:#fff; */
}

/* Formatting Game Buttons */
#gameBs {
	height: 25px;
	margin: 15px 0; padding:0 48px;
	border-bottom: 1px solid black;
	}
#showUsers {
	}
	
div.outer {
	float: left;
	width: 114px; height: 25px;
	margin: 0 5px 0 0;
	background: url( 'bars.gif' ) 0 -50px no-repeat;
	}

div.outer a {
	display: block;
	margin: 0;
	padding:0;
	width:100%;
	height:100%;
	text-align: center;
	line-height: 25px;
	overflow:hidden;
/*	font: bold 10px;  */
	color:#FFFF99;
	text-decoration: none;
	background: url( 'i/tabclosed.gif' ) top left no-repeat;
	}
div.outer span {
	display: block;
	margin:0; /*padding: 7px 0 0 13px;*/
	}
div.outer a:hover {
	background-image: url( 'i/tabopen.gif' );
	color: #FFFF00;
	}
div.outer a:active {
	color: #FFFF11;
	}

div.inner {
	padding:6px 6px 6px 6px;
	width: 30%;
	float:left;
	height:65px;
	margin-bottom: 7px;
	margin-left: 3px;
	}
/* div.inner a:hover {
	background-color:#CCFFCC;
	}
*/

div.comments {
	background-color:#f7f7f7;
	float:left;
	padding: 7px;
	margin-left: 3px;
	width: 440px;
	}
	
div.msgtitle {
	float:left;
	width: 96.56%;
	padding: 8px;
	margin-bottom: 6px;
	background-color:#222222;
	color:#F4F4F4;
	}

div.commPost {float: right;}

hr.spacer {margin: 3px 0px 3px 0px;}


a#up {
    display:inline-block;
    width: 20px;
    height: 20px;
    background-image: url(/i/up1.gif);
    margin: 0 auto;
}
a#up:hover {
    background-image: url(/i/up2.gif);
}
a#down {
    display:inline-block;
    width: 20px;
    height: 20px;
    background-image: url(/i/down1.gif);
    margin: 0 auto;
}
a#down:hover {
    background-image: url(/i/down2.gif);
}
a .alt { display: none; }


div.ctitle {
	float:right;
	margin: 4px 4px 0px 0px;
/*	font-size: 14px;
	height: 28px;
	text-decoration:none;
	border:none;
	padding:0px;
	color:FFF;
*/
	}

/*

div.ctitle a img {
 	display:block;  
	background-color:#FFFFFF;
	color:FFF;
	border:none;
	height: 20px; width:20px;
/*	background-image: url(i/up1.gif);

	}
div.ctitle a:hover img:hover {
	background-image: url(i/up2.gif);
	}
*/
/*
input   {
	border-top: 1pt solid #cccccc;
	border-bottom: 1pt solid #cccccc;
	border-right: 1pt solid #cccccc;
	border-left: 1pt solid #cccccc;
	font: normal 10px tahoma;
	width:115px;
	color: #707070;
	margin:0px 0px 5px 0px;
}

textarea.sidebar   {
	border-top: 1pt solid #cccccc;
	border-bottom: 1pt solid #cccccc;
	border-right: 1pt solid #cccccc;
	border-left: 1pt solid #cccccc;
	font: normal 10px tahoma;
	width:115px;
	height:80px;
	color: #707070;
	margin:5px 0px 5px 25px;
}

input.sidebar   {
	border-top: 1pt solid #cccccc;
	border-bottom: 1pt solid #cccccc;
	border-right: 1pt solid #cccccc;
	border-left: 1pt solid #cccccc;
	font: normal 10px tahoma;
	width:115px;
	color: #707070;
	margin:0px 0px 5px 25px;
}

input.button_sidebar   {
	border-top: 1pt solid #cccccc;
	border-bottom: 1pt solid #cccccc;
	border-right: 1pt solid #cccccc;
	border-left: 1pt solid #cccccc;
	font: normal 10px tahoma;
	width:119px;
	color: #707070;
	margin:0px 0px 5px 25px;
}

input.button_content   {
	border-top: 1pt solid #cccccc;
	border-bottom: 1pt solid #cccccc;
	border-right: 1pt solid #cccccc;
	border-left: 1pt solid #cccccc;
	font: normal 10px tahoma;
	width:119px;
	color: #707070;
	margin:5px 0px 5px 0px;
}
*/
/* footer */
.footer {
	background: url(img/bgfooter.gif) repeat-x;
	color: #CCC;
	font-size: 0.9em;
	line-height: 39px;
	width: 100%;
	text-align: center;
}
.footer .left,.footer .right {padding: 0 16px;}
.footer a {color: #EEE;}
.footer a:hover {color: #FAFCB0;}
