/*   
Hellbent Games
http://hellbentgames.com/

Hellbent Index CSS v0.1
*/

/* Will probably remove this unless we can get a good scalable version of the font to the pixel sizes we're using. */
@font-face {
        font-family: Hellbent Regular;
        src: url("hellben0.ttf");
        font-style : normal;
        font-weight: normal;
}

/* Using pixel sizes for fonts to match our absolute sizing on layout. */
body {
	background: #000000;
	color: #FCBE76;
	margin: 0;
	padding: 0;
/*	font-family: Hellbent Regular, Calibri, Verdana, sans-serif; // Hellbent font is currently turned off. */
	font-family: Calibri, Verdana, sans-serif;
	font-size: 20px;
}

/* ************ */
/* Basic layout */
/* ************ */
#wrapper {
	background: black;
	width: 1012px;
	margin-left: auto;
	margin-right: auto;
	padding-bottom: 24px;
}
#header {
/*  position must be relative so any containing blocks can be absolutely adjusted into position. */
	position: relative;
	height: 70px;
	background: black url('images/hellbent_header.png') bottom no-repeat;
/*	overflow: hidden removes gaps between divs regardless of content. */
	overflow: hidden;
}
#main {
	position: relative;
	min-height: 680px;
	background: #3F0002 url('images/hellbent_background.png') bottom no-repeat;
	overflow: hidden;
}
#content {
	position: relative;
	top: 0px;
	left: 0px;
	margin-top: 20px;
	margin-left: 40px;
	margin-right: 350px;
	margin-bottom: 10px;
}

/* ********************************* */
/* Content Layout for Specific Pages */
/* ********************************* */
#news_content {
	position: relative;
	z-index: 10;
}
#about_content {
	position: relative;
	margin-top: 30px;
	margin-left: 30px;
	margin-right: 30px;
}
#games_content {
	position: relative;
	margin-left: 10px;
}
#games_legobattles {
	position: relative;
	margin-top: 30px;
	padding-bottom: 12px;
}
#games_supremecommander {
	position: relative;
	margin-left: 12px;
}
#contact_content {
	position: relative;
	margin-top: 50px;
	margin-left: 20px;
}
#contact_address {
	position: relative;
	margin-left: 80px;
}
#contact_address p {
	text-align: left;
}

/* ************** */
/* Main Rollovers */
/* ************** */
/* Rollover images are basically 2-frame sprites: left = frame 1, right = frame 2. */
/* A third frame could be added as left = frame 1, center = frame 2, right = frame 3. */
/* Or a grid could be used with top and bottom. */
#logo_rollover {
	position: absolute;
	top: 42px;
	right: 40px;
	width: 242px;
	height: 72px;
	background: url('images/logo_rollover.png') top left no-repeat;
}
#logo_rollover:hover {
	background: #000000 url("images/logo_rollover.png") top right no-repeat;
}
#logo_rollover:active {
	background: #000000 url("images/logo_rollover.png") top right no-repeat;
}
#bird_rollover {
	position: absolute;
	bottom: 284px;
	right: 139px;
	width: 51px;
	height: 50px;
	background: url('images/bird_rollover.png') top left no-repeat;
}
#bird_rollover:hover {
	background: #000000 url("images/bird_rollover.png") top right no-repeat;
}
#bird_rollover:active {
	background: #000000 url("images/bird_rollover.png") top right no-repeat;
}

/* *********** */
/* Link Styles */
/* *********** */
a:link, a:visited {
	color: #FF880D;
	text-decoration: none;
}
a:hover, a:active {
	color: #FFF7EE;
	text-decoration: underline;
}

/* ******************** */
/* Navigation Rollovers */
/* ******************** */
/* Replaced image rollovers with pure text CSS rollovers. Should give us flexibility for alternative browsers (iPhone, etc.). */
.nav_link {
	position: absolute;
	height: 42%;
	width: 15%;
	margin-top: 6px;
	font-weight: bold;
	color: #FF880D;
	background: #3F0002;
	border: 2px solid #5a0f05;
	text-decoration: none;
	text-align: center;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	border-radius: 6px;
}
.nav_link:hover {
	background: #3F0002;
	color: #FFF7EE;
	text-decoration: none;
}
.nav_link:active, .nav_link:focus {
	background: #3F0002;
	border: 2px solid #FF880D;
	text-decoration: none;
	outline: none;
}
.nav_on {
	border: 2px solid #FF880D;
	text-decoration: none;
}
#nav_news {
	left: 11%;
}

#nav_about {
	left: 32%;
}
#nav_games {
	left: 53%;
}
#nav_contact {
	left: 74%;
}

/* ************ */
/* Basic styles */
/* ************ */
img {
	border: none;
}
.imglink:focus {
/* We hatesss the ugly outline boxes when clicking images... hatesssss them.  */
	outline: none;
}
h1 {
	font-size: 36px;
	color: #FF880D;
	margin: 0;
	padding: 0;
}
h2 {
	font-size: 24px;
	color: #FFF7EE;
}
p {
	text-align: justify;
}

/* ************** */
/* Editing styles */
/* ************** */
#loginbox {
	position: absolute;
	right: -300px;
	top: 120px;
	padding: 6px;
	padding-left: 20px;
	padding-right: 20px;
	color: white;
	background: #4F0002;
	font-size: 14px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	-webkit-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
	-moz-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
	box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
	z-index: 20;
}
.editbox, .edit_buttons {
	padding: 10px;
	padding-left: 20px;
	margin-bottom: 14px;
	background: #4F0002;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	-webkit-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
	-moz-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
	box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
}
.editbox input {
	margin-right: 16px;
}
.editbox textarea {
	width: 572px;
}
.editbox label {
	font-size: 14px;
	color: white;
}
.news_submit {
	margin-left: 460px;
}
.edit_buttons {
	position: absolute;
	right: -88px;
	margin-top: 6px;
	margin-left: 10px;
	padding: 8px;
}

/* ***************** */
/* Additional styles */
/* ***************** */
#games_legobattles img {
	margin-left: 206px;
}
#games_supremecommander img {
	margin-left: 243px;
}
.yellow {
	color: #FF880D;
}
.tiny {
	font-size: 14px;
	color: white;
}
.white {
	color: white;
}
.clear_gap {
	clear: both;
}
.new {
	color: #B30000;
	font-size: 24px;
}
.date {
	color: #FFF7EE;
}
.hidden {
	visibility: hidden;
}
.oldfont {
	font-family: Calibri, Verdana, sans-serif;
}