/* CSS Document */
* { font-family: Verdana, Arial, Helvetica, sans-serif; }
html, body { margin: 0; padding: 0; height: 100%; min-height: 100%; }
body { font-size: 80%; }
h1 { font-size: 2em; }
h2 { font-size: 1.6em; }
h3 { font-size: 1.4em; }
h4 { font-size: 1em; }
h5 { font-size: 0.9em; }
h6 { font-size: 0.9em; }
h1, h2, h3, h4, h5, h6 { font-family: Arial, Helvetica, sans-serif; margin: 0 0 0.6em 0; }
p { margin: 0 0 0.6em 0; }
a { color: #000066; text-decoration: none; }
a:hover { text-decoration: underline; }
.small { font-size: 0.8em; }
.clearer { clear: both; }
.ajaxloader { height: 16px; background: url('../../../media/images/icon/loading.gif') center center no-repeat; }
/*======================================================================
Structure
======================================================================*/
#pageWrapper { position:relative; margin:0; padding:0; height:auto !important; height:100%; min-height:100%; }
#contentWrapper { padding-bottom: 55px; }
#content { margin: 0; }
#contentInner { width: 960px; margin: 0 auto; padding: 0 20px; }
#footer { position: absolute; left: 0; bottom: 0; width: 100%; }

/*======================================================================
Hexcell Header
======================================================================*/
#hexcellHeader { padding: 0; background: #666 url('../images/header_bg.jpg') top left repeat-x; color: #FFF; margin-bottom: 10px; }
.hexcellHeaderInner { width: 960px; height: 30px; margin: 0 auto; color: #FFF; }
.headerRight { float:right; width:350px; text-align:right; position:relative; }
.headerLeft { width:600px; }
.hexcellHeaderInner a,
.headerRight a, 
.headerLeft a { color:#FFF; text-decoration:none; }
.hexcellHeaderInner a:hover,
.headerRight a:hover, 
.headerLeft a:hover { color:#FFF; text-decoration:none; }
/*.hexcellHeaderInner .padded { padding-top: 6px; }*/
.hexcellHeaderInner .headerLeft.padded { padding-left:36px; }

.hexcellHeaderLevel2 a { display:block; float:left; height:22px; padding:6px 8px 0 8px; border-left:1px solid #666; border-right:1px solid #444; }
.hexcellHeaderLevel2 .headerRight a { float:right; }
.hexcellHeaderLevel2 a:hover { background:#555; }
.hexcellHeaderLevel2 a.selected { background:#222; height:24px; border-left:1px solid #333; border-right:1px solid #000; }

.hexcellHeaderSub { height:26px; background:#222; border-bottom:1px solid #000; }
.hexcellHeaderSub .hexcellHeaderInner { width:888px; color:#CCC; }
.hexcellHeaderSub .hexcellHeaderInner a { color:#CCC; display:block; float:left; height:22px; padding:4px 6px 0 6px; border-left:1px solid #333; border-right:1px solid #000; }
.hexcellHeaderSub .hexcellHeaderInner a.selected { color:#FFF; }

#tools { position: absolute; right:-10px; width: 240px; z-index:2000; } 
#tools form { padding: 0; margin: 0; }
#tools .loginInput { width:120px; padding:2px 3px; border:none; background:#FFF; }
#tools .body { padding: 0 10px; background: #666 url('../../media/images/tools_bg.gif') bottom left no-repeat; color: #FFF; text-align:left; border:1px solid #555; border-width:0 2px; }
#tools .base { padding: 3px 10px 0 10px; height:19px; background: #666 url('../images/tools_base.jpg') bottom left repeat-x; color: #FFFFFF; text-align:right; }

#tools a { color:#FFF; text-decoration:none; }
#tools a:hover { color:#FFF; text-decoration:underline; }

ul.navigation { float:left; position:relative; list-style:none; margin:0; padding:0; }
ul.navigation li { float:left; }
ul.navigation li a { display:block; height:22px; padding:6px 10px 0 10px; }
ul.navigation ul { display:none; list-style:none; margin:0; padding:0; width:120px; }
ul.navigation ul li { float:none; }
ul.navigation ul a { display:block; height:20px; padding:2px 8px 0 8px; border:2px solid #77B701; border-width:0 2px; background:#77B701; }
ul.navigation ul li.last a { border-width:0 2px 2px 2px; border-radius:0 0 6px 6px; -moz-border-radius:0 0 6px 6px; -webkit-border-radius:0 0 6px 6px; -khtml-border-radius:0 0 6px 6px; }
ul.navigation ul a:hover { background:#85CD01; }

/*======================================================================
Notice
======================================================================*/
.notice { background-color: #FF9; padding: 4px 8px; margin: 0 0 0.6em 0; border: 2px solid #C90; -moz-border-radius: 8px; border-radius: 8px; }
.featureBox { padding:5px 10px; margin: 0 0 0.6em 0; color:#604D37; border:1px solid #9F805D; }


/*======================================================================
Columns
======================================================================*/
.columnLeft { width: 310px; float: left; }
.columnRight { width: 310px; float: right; }
.columnCenter { margin: 0 325px; }
.columnTwoLeft { margin: 0 325px 0 0; }
.columnTwoRight { margin: 0 0 0 325px; }
.columnHeader { background: url('../images/columnHeader_blue.jpg') top left repeat-x; color: #FFF; font-weight: bold; padding: 18px 5px 0 5px; margin: 0 0 8px 0; height: 20px; }
/*======================================================================
Footer
======================================================================*/
#footer { font-size: 0.9em; background: #666; color: #FFF; padding: 8px 0 0 0; height: 22px; font-size: 80%; margin: 25px 0 0 0; }
#footer a{ color: #FFF; }
.footerInner { width: 960px; margin: 0 auto; }
.debug { background: #999; color: #666; }

/*======================================================================
Modules
======================================================================*/
.moduleContainer { background: #EEE; border: 1px solid #999; padding: 4px; margin: 0 0 0.6em 0;
	border-radius: 8px; -moz-border-radius: 8px; -webkit-border-radius: 8px; -khtml-border-radius: 8px;	}
.moduleTitle { padding: 4px 8px 0 8px; height: 20px; font-weight: bold; color: #FFF; background: #858DD7;
	border-radius: 6px; -moz-border-radius: 6px; -webkit-border-radius: 6px; -khtml-border-radius: 6px; }
.moduleSection { margin: 4px 0 0 0; padding: 4px; background: #FFF; border: 1px solid #DDD;
	border-radius: 6px; -moz-border-radius: 6px; -webkit-border-radius: 6px; -khtml-border-radius: 6px; }
.moduleSectionTransparent { padding: 0; background: none; border: none;
	border-radius: 0; -moz-border-radius: 0; -webkit-border-radius: 0; -khtml-border-radius: 0; }

/*======================================================================
Game list table
======================================================================*/
.gameListTable {}
.gameListTable td { padding: 2px 5px; vertical-align: top; }
.gameListTable .subhead td { font-weight: bold; color: #FFF; background: #858DD7; padding: 8px 4px 4px 4px; border-top: 10px solid #FFF; }
.gameListTable .subhead2 td { background: #EEE; color: #666; font-size: 0.8em; border-bottom: 1px solid #CCC; }
.gameListTable tfoot td { background: #EEE; vertical-align: middle; border-top: 1px solid #CCC; border-bottom: 1px solid #CCC; }
.gameListTable tr.odd td { background: #EEF; }
.gameListTable tr.hover td { background: #C8CCEE; }

.gameListTable.inline { margin: 0 0 0.6em 0; }

/*======================================================================
	Buttons
======================================================================*/
.buttonLarge { border: none; width: 186px; height: 23px; background: url('../images/btn_large.gif') top left no-repeat; color: #FFF; text-align: center; font-family: Arial, Helvetica, sans-serif; margin: 0 auto; text-transform:uppercase; font-weight: bold; padding: 7px 0 0 0; font-size: 0.9em; cursor: pointer; }
.buttonMiddle { display: inline-block; border: none; width: 96px; height: 23px; background: url('../images/btn_middle.gif') top left no-repeat; color: #FFF; text-align: center; font-family: Arial, Helvetica, sans-serif; margin: 0 auto; text-transform:uppercase; font-weight: bold; padding: 7px 0 0 0; font-size: 0.9em; cursor: pointer; }
.buttonSmall { display: inline-block; border: none; width: 51px; height: 23px; background: url('../images/btn_small.gif') top left no-repeat; color: #FFF; text-align: center; font-family: Arial, Helvetica, sans-serif; margin: 0 auto; text-transform: uppercase; font-weight: bold; padding: 7px 0 0 0; font-size: 0.9em; cursor: pointer; }
button.buttonMiddle,
button.buttonLarge,
button.buttonSmall { height: 30px; padding: 0; }

/*======================================================================
	Plane selection background
======================================================================*/
.airfield { background: #B7BE9D url('../images/grass.jpg') left center repeat; };

/*======================================================================
Combat table
======================================================================*/
.combatTable { border: 1px solid #CCC; border-width: 1px 0 0 1px; }
.combatTable td { text-align: right; padding: 3px 8px; border: 1px solid #CCC; border-width: 0 1px 1px 0; }
.combatTable td.label { text-align: left; }

/*======================================================================
	Rounded Corners
======================================================================*/
.rounded3 { border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px; -khtml-border-radius:3px; }
.rounded4 { border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px; -khtml-border-radius:4px; }
.rounded6 { border-radius:6px; -moz-border-radius:6px; -webkit-border-radius:6px; -khtml-border-radius:6px; }
.rounded8 { border-radius:8px; -moz-border-radius:8px; -webkit-border-radius:8px; -khtml-border-radius:8px; }

.roundtop3 { border-radius:3px 3px 0 0; -moz-border-radius:3px 3px 0 0; -webkit-border-radius:3px 3px 0 0; -khtml-border-radius:3px 3px 0 0; }
.roundtop4 { border-radius:4px 4px 0 0; -moz-border-radius:4px 4px 0 0; -webkit-border-radius:4px 4px 0 0; -khtml-border-radius:4px 4px 0 0; }
.roundtop6 { border-radius:6px 6px 0 0; -moz-border-radius:6px 6px 0 0; -webkit-border-radius:6px 6px 0 0; -khtml-border-radius:6px 6px 0 0; }
.roundtop8 { border-radius:8px 8px 0 0; -moz-border-radius:8px 8px 0 0; -webkit-border-radius:8px 8px 0 0; -khtml-border-radius:8px 8px 0 0; }

.roundbot3 { border-radius:0 0 3px 3px; -moz-border-radius:0 0 3px 3px; -webkit-border-radius:0 0 3px 3px; -khtml-border-radius:0 0 3px 3px; }
.roundbot4 { border-radius:0 0 4px 4px; -moz-border-radius:0 0 4px 4px; -webkit-border-radius:0 0 4px 4px; -khtml-border-radius:0 0 4px 4px; }
.roundbot6 { border-radius:0 0 6px 6px; -moz-border-radius:0 0 6px 6px; -webkit-border-radius:0 0 6px 6px; -khtml-border-radius:0 0 6px 6px; }
.roundbot8 { border-radius:0 0 8px 8px; -moz-border-radius:0 0 8px 8px; -webkit-border-radius:0 0 8px 8px; -khtml-border-radius:0 0 8px 8px; }