/*copyright gamebub.com*/
html {
	background-color:#000;
}

body {
	margin:0 auto;
	width:760px;
	color:#ddd;
	font-family:"Georgia", serif;
	line-height:1.5;
	word-spacing:0.025em;
}

blockquote, .one-third {background:url('bgsprites.png') 0 1em no-repeat;}

#container {
	margin:0 auto;
}

#header {
	padding:0 10px 10px;
}

#content {
	padding:1em 10px;
	background:#4d103c url(cloud_bg.png) repeat-y center center fixed;
	border:1px #601846 dotted;/*936*/
}

#header {
	background-color:#000;
}

#nav {
	list-style:none;
	margin:0 auto;
	padding:0;
	width:728px;
	text-align:center;
}

#nav li {
	display:inline;
	margin:10px 20px 0 0;
	padding:0;
}

#intro, #bio {
	width:380px;
	float:left;
}

#artwork, #newsblock {
	width:320px;
	float:right;
}

#artwork {
	background-color:#000;
}

#footer {
	clear:both;
	padding:10px;
	font-size:70%;
	color:#556;
	background-color:#000;
	letter-spacing:0.01em;
	word-spacing:0.01em;
}

/*LINKS*/
a {
	text-decoration:none;
	font-weight:bold;
	color:#f9c;
	border-bottom:1px solid #c69;
}

#footer a {color:#99c;}

a img {
	border:1px #f9c dotted;
}

a:hover {
	text-decoration:underline;
	border-bottom:1px solid #fff;
}

#logo a:hover {
	text-decoration:none;
	border:none;
}

.characters a, .thumbs a {
	display:block;
	border:1px #936 dotted;
	background-color:#000;
}

.characters a:hover, .thumbs a:hover, .pages a:hover {
	background-color:#936;
}

.pages a {
	padding:5px;
}

cite a {
	color:#99c;
}

/*HEADERS*/
h1, h2, h3, h4, h5, h6 {
	color:#ddd;
	line-height:1.1;
	margin-bottom:0;
	font-weight:normal;
}

h1 {font-size:200%; font-variant:small-caps; letter-spacing:0.05em; word-spacing:0.25em; text-align:center; margin:0;}
h1.display_title {font-size:100%; color:#99a; font-variant:normal; letter-spacing:normal; word-spacing:normal;}
.one-third h2, #homepage .half h3 {margin:0;}
h2.ingame {font-size:150%;}

#logo {
	margin:1em auto;
	font-size:100%;
	display:block;
	line-height:1;
	width:651px;
	height:72px;
}

#logo a {
	display:block;
	padding:39px 9px;
	background:url(logo.png) center center no-repeat;
	outline:none;
	text-indent:-9999px;
	border:none;
}

h2 {font-size:200%;}

#tagline {
	width:728px;
	margin:0.5em auto;
	text-align:center;
	display:block;
	color:#778;
	font-size:85%;
	font-style:normal;
	font-weight:normal;
	font-variant:small-caps;
	letter-spacing:0.1em;
	word-spacing:0.25em;
	padding:0;
	line-height:1.1;
}

h3, caption {font-size:150%; letter-spacing:0.05em; word-spacing:0.05em; font-variant:small-caps;}
h3 em {font-style:normal;}
h4 {font-size:125%; background:#223; padding:0.25em 0.2em;}

h3 + p, h4 + p {margin-top:0;}

/*FORMS*/
button, textarea, select, input {
	font-family:"Georgia", serif;
	background-color:#000;
	color:#99c;
	border:1px #936 dotted;
	font-size:100%;
	padding:2px;
}

cite {
	color:#999;
	font-size:90%;
}

cite em {
	font-weight:bold;
}

img {
	background-color:#000;
	border:1px #52133e dotted;
}

blockquote {
	background-position:-780px 0;
	margin:0;
	padding:0 0 0 40px;
	color:#aab;
	font-size:90%;
}

hr {
	color:#99a;
	background-color:#99a;
	width:80%;
	border:none;
	height:1px;
}

hr.clear {clear:both; height:0;}

/*TABLES*/
table {
	border-collapse:collapse;
	background-color:#000;
	margin:0 0 20px;
	width:100%;
	clear:both;
}

table.offline {
	background-color:transparent;
	margin:0;
	width:auto;
	clear:none;
}

table.offline td {
	border:none;
}

caption, th, td {
	padding:2px;
	border:1px #936 dotted;
}

caption, th {
	text-align:left;
}

caption {
	background-color:#936;
}

th {
	background-color:#ccc;
	color:#000;
}

table img, .emoticon {
	background-color:transparent;
	border:none;
	vertical-align:text-bottom;
}

.fullrow img {
	clear:right;
	float:right;
	margin:0 0 5px 5px;
}

.characters img, .thumbs img {
	border:none;
	display:block;
	margin:0 auto;
}

#artwork img {
	margin:0 auto;
	display:block;
	border:none;
}

#bio img {
	clear:left;
	float:left;
	margin:0 5px 5px 0;
}

.display_imagefile img {
	display:block;
	margin:0 auto;
}

.display_imagefile {
	text-align:center;
}

.display_textfile {
	margin:0 -10px;
	padding:0 10px;
	background-color:#000;
}

pre {
	color:#eee;
	font-family:monospace;
	word-spacing:1px;
	font-size:90%;
}

#bio ul {
	list-style-position:inside;
	list-style-type:none;
	font-weight:bold;
}

.news {
	border-bottom:1px #936 dotted;
}

.date, .categories {
	font-size:8pt;
	color:#99a;
}

.pages {
}

.caption {
	display:inline;
	width:33%;
	font-size:90%;
	line-height:1.1;
	text-align:right;
	color:#c69;
	clear:right;
	float:right;
	margin:0 0 10px 20px;
	padding:0 0 10px;
}

.fullrow, .row {
	clear:both;
	margin-top:10px;
	border-top:1px #936 dotted;
}

.characters, .thumbs {
	list-style:none;
	margin:0;
	padding:0;
}

.characters li, .thumbs li {
	float:left;
	margin:0;
	padding:0;
	width:20%;
	margin:0 20px 20px 0;
	text-align:center;
}

/*
#content ul {
	margin-left:0;
	padding-left:0;
	list-style-position:inside;
}

#content li li {
	margin-left:10px;
	padding-left:10px;
}*/

ul.characters:after, ul.thumbs:after, #intro:after, #newsblock:after, #homepage .row:after {
	content:".";
	display:block;
	height:0;
	clear:both;
	visibility:hidden;
}

#homepage .row {border:none; margin-bottom:1em;}
#homepage .row ul {margin:0; padding:0; list-style-position:inside;}
#homepage .row li {list-style-position:outside;}
#homepage .third {}

.headlines li {
	margin:0 0 10px;
}

.headlines {font-size:80%;}

.timestamp {display:block; color:#99a;}

table .notes {
	font-size:80%;
	color:#777;
	background-color:#223;
}

.error {
	background-color:#f9c;
	color:#000;
}

acronym {border:none;}
.half {width:350px; float:left;}
.one-third {width:160px; float:left; padding-left:70px; margin:0 10px;}
#homepage .half {margin-right:20px;}
#homepage .half.last {margin:0;}
.second {background-position:-520px 1em;}
.third {background-position:-260px 1em; margin:0;}
.one-third ul {margin:0; padding:0;}
.one-third li {font-size:90%; list-style-type:none; list-style-position:outside; margin:0 0 5px 0; padding:0;}
.intro {font-size:300%; line-height:1; margin:0;}
.t_l1 {display:block;}
.t_super {vertical-align:super; font-size:50%;}

@media only screen and (max-width:759px) {
	embed, object {
		max-width:100% !important;
	}
	
	img, iframe {
		max-width:100% !important;
		height:auto !important;
	}
	
	body, #logo, #tagline, #nav, .half, .one-third, .caption {
		width:auto;
	}
	
	#logo {
		height:auto;
	}
	#logo a {
		background:none;
		padding:0;
		text-indent:0;
		font-size:150%;
	}
	#logo a:after {
		content:' Arena';
	}
	
	.one-third, .half, #homepage .half, #homepage .half.last,
	.fullrow img, #artwork, #newsblock, #intro, #bio, .caption {
		background:none;
		clear:both;
		float:none;
		margin:auto;
		padding:0;
	}
	
	.caption {
		display:block;
		text-align:left;
	}
	
	#bio, #artwork {
		margin:0;
	}
	
	#artwork {
		background:#000;
	}
	
	#nav li {
		margin:10px;
	}
	
	.characters li, .thumbs li {
		float:none;
		width:auto;
		margin:10px;
	}
	
	.characters li, .thumbs li, .characters a, .thumbs a, .characters img, .thumbs img {
		display:inline;
		text-align:left;
	}
	
	.characters li, .characters a {
		display:block;
		background:#000;
	}
	
	.characters li {
		max-width:480px;
	}
	
	.characters a {
		border:none;
	}
	
	pre, code {
		word-break: break-all; /* webkit */
		word-break: keep-all;
		word-wrap: break-word;
		white-space: -pre-wrap;/*opera 4-6*/
		white-space: -o-pre-wrap;/*opera 7*/
		white-space: pre;
		white-space: -moz-pre-wrap; /* fennec */
		white-space: pre-wrap;
		white-space: pre\9; /* IE7+ */
		-webkit-hyphens: auto;
		-moz-hyphens: auto;
		-ms-hyphens: auto;
		hyphens: auto;
	}
}

@media only screen and (max-width:480px) {
	#bio img {
		clear:both;
		float:none;
		margin:0;
	}
	
	#bio ul {
		margin-left:0;
		padding-left:0;
	}
}

@media only screen and (max-width:479px) {
	table {
		border-collapse:collapse;
		background:transparent;
	}
	
	th, td {
		display:block;
	}
	
	td {
		background:#000;
	}
	
	tr {
		display:block;
		padding:0 0 20px;
	}
	
	tr:nth-child(even) td {
		border:1px solid #000;
	}
	
	tr:nth-child(odd) td {
		border:1px solid #223;
		background:#223;
	}
	
	tr:nth-child(odd) {
	}
}

@media only screen and (max-width:320px) {
	.intro {
		font-size:200%;
	}
	.t_l1 {
		display:inline;
	}
	.t_super {
		font-size:100%;
		vertical-align:baseline;
	}
}

/*REMOVE THIS LAST LINE WHEN DONE TESTING!*/
/*.offline {display:none;}*/