/*
	(Original) Author	:	Christopher Robinson
	Email		:	christopher@edg3.co.uk
	Website	:	http://www.edg3.co.uk/
*/
* {
	border:0;
	margin:0;
	padding:0;
}

/* general */
a {
	color:#777;
	text-decoration:none;
    font-weight:bold;
}

a:hover {
	color:#333;
	text-decoration:none;
}

/* body */
body {
	background:#fafafa;
	color:#555;
	font:0.8em Arial, Helvetica, "bitstream vera sans", sans-serif;
}

#left-bar {
	font-size:120%;
	padding-top:5px;
	padding-left:5px;
	padding-right:15px;
	float:left;
}

/* sitelink */
#left-bar a.sitelink {
    font-weight:normal;
}

#right-bar {
	padding-top:5px;
	padding-left:5px;
	padding-right:5px;
    text-align:right;
	float:right;
}

/* example debates, for the help section. */
div.example_debate {
	font-size:120%;
    margin-left:35px;
    background-color:#EEEEEE
}

/* example debates, for the help section. */
div.example_debate div.example_subdebate {
	padding:5px;
    margin:10px;
    background-color:#DDDDDD
}

div.example_debate div.example_post {
    padding:5px;
}

div.example_debate span.example_debater1 {
    color:red;
    font-weight:bold;
}

div.example_debate span.example_debater2 {
    color:blue;
    font-weight:bold;
}

div.example_debate span.example_mediator {
    color:green;
    font-weight:bold;
}

div.example_debate span.example_spawn {
    padding-left:10px;
    font-weight:bold;
    font-style:italic;
}

* header */

/* note that I put the margin:auto after the margin-left. At least in epiphany it seems to override
 * the previous. In the offchance we find a browser that accepts auto AND 150 without the px,
 * there's a chance that the auto will at least override it now */

#header {
	border-bottom:1px solid #999;
	/*height:80px;*/
	margin-left:150; /* For IE. Firefox and Epiphany don't pick up on it for lack of "px" */
	margin:0 auto;
	width:850px;
}
#header h1 {
	color:#888;
	font-size:300%;
	letter-spacing:-3px;
	text-align:left;
	margin-bottom:-20px;
}
#header h2 {
	color:#CCC;
	font-size:200%;
	letter-spacing:-2px;
	padding:5px;
	padding-top:20px;
	text-align:left;
}



/* navigation */

/* note that I put the margin:auto after the margin-left. At least in epiphany it seems to override
 * the previous. In the offchance we find a browser that accepts auto AND 150 without the px,
 * there's a chance that the auto will at least override it now */

#navigation {
	background:#fafafa;
	border-right:1px solid #999;
	margin-left:150; /* For IE. Firefox and Epiphany don't pick up on it for lack of "px" */
	margin:0 auto;
	width:750px;
	height:50px;
	list-style:none;
}
#navigation li {
	border-left:1px solid #999;
	float:left;
	width:124px;
	list-style:none;
}
#navigation a {
	color:#555;
	display:block;
	line-height:50px;
	text-align:center;
}
#navigation a:hover {
	background:#e3e3e3;
	color:#555;
}
#navigation .active {
	background:#e3e3e3;
	color:#777;
}




/* content */

/* note that I put the margin:auto after the margin-left. At least in epiphany it seems to override
 * the previous. In the offchance we find a browser that accepts auto AND 150 without the px,
 * there's a chance that the auto will at least override it now */
#content {
	height:auto;
	margin-left:150; /* For IE. Firefox and Epiphany don't pick up on it for lack of "px" */
	float:left;
	margin:0 auto; 
	padding:0 0 20px;
	width:850px;
}

#content h1 {
	border-bottom:1px dashed #999;
	font-size:1.8em;
	font-weight: bold;
	padding:20px 0 0;
}

#content h2 {
	padding:20px 10px 0;
}

#content h3 {
	padding:10px 15px 0;
	margin-bottom:10px;
}

#content div.debatelistitems {
    font-weight:bold;
	font-size:1.2em;
    vertical-align:top;
}

#content div.debatelistitem0, div.debatelistitem1 {
	padding:10px;
    min-height:2.3em;
}

#content div.debatelistitem0 {
	background:#f4f4f4;
}
#content div.debatelistitem1 {
	background:#f9f9f9;
}

#content div.debatelistitemdetails {
	padding-left:20px;
	padding-top:2px;
	font-weight: normal;
	font-size: 0.8em;
	font-style: italic;
}

#content ul {
	font-size:1.0em;
	margin-left:50px;
	margin-top:10px;
}


/* footer */

/* note that I put the margin:auto after the margin-left. At least in epiphany it seems to override
 * the previous. In the offchance we find a browser that accepts auto AND 150 without the px,
 * there's a chance that the auto will at least override it now */

#footer {
	border-top:1px solid #999; 
	height:50px;
	margin:0 auto;
	margin-left:150; /* For IE. Firefox and Epiphany don't pick up on it for lack of "px" */
	margin-top:20px;
	padding:10px;
	text-align:center;
	width:751px;
    clear:both;
}


/* forms */

#id_name, #id_email, #id_url, #id_comment, #id_fakename{
    border:2px solid;
    border-color:#999;
    }

#id_name, #id_email, #id_url, #id_fakename {
    width:20em;
    }

#id_comment {
    width:40em;
    }

#commentsform {
	padding-top:10px;
	padding-left:20px;
	padding-bottom:20px;
}

label {
    float: top;
    display: block;
    font-weight: bold;
    margin-bottom:5px;
}

input.readonlyfield {
	color:#777;
	background-color:#EEE;
    font-weight: bold;
}

p {
    margin:1em;
}