/**
 * Astrowars-Tools is a website dedicated to Astro Wars, a massive
 * multiplayer space strategy game, fully exploiting the daily
 * exported CSV files by the game and more.
 *
 * Copyright (C) 2008  Kevin Rieu
 *
 * This file is part of Astrowars-Tools.
 *
 * Astrowars-Tools is free software: you can redistribute it and/or
 * modify it under the terms of the GNU General Public License as
 * published by the Free Software Foundation, either version 3 of
 * the License, or any later version.
 *
 * This program is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 * GNU General Public License for more details.
 *
 * You should have received a copy of the GNU General Public License
 * along with this program. If not, see <http://www.gnu.org/licenses/>.
 *
 * You can contact the author of this program at <ffmandu13@hotmail.com/>.
 */

/* Begin Website Structure */

* {
  margin: 0;
  padding: 0;
  border: none;
  font-family: Verdana, Arial, sans-serif;
}

html {
  font-size: 12px;
}

body {
  color: white;
  background: black url(../images/background.png) center top no-repeat scroll;
  font-size: 1em;
  height: 100%;
}


#header {
  width: 95%;
  height: 110px;
  text-align: center;
}

#menu {
  position: absolute;
  top: 107px;
  left: 0;
  width: 100%;
  height: 35px;
  z-index: 2;
}

#main {
  min-height: 100%;
}

#ads {
  width: 728px;
  height: 90px;
  margin: 2em auto 2em auto;
}

#footer {
  position: relative;
  width: 100%;
  text-align: center;
  padding-top: 20px;
}

.layer {
  clear: both;
  position: relative;
  width: 95%;
  margin: 0 auto 20px auto;
}

.layerBody {
  position: relative;
  color: inherit;
  background: url(../images/fill.png) repeat;
  padding: 15px;
  text-align: center;
}

.layerBodyLeft {
  background: url(../images/left.png) left repeat-y;
  padding-left: 20px;
}

.layerBodyRight {
  background: url(../images/right.png) right repeat-y;
  padding-right: 20px;
}

.layerTop, .layerTopLeft, .layerTopRight {
  height: 20px;
}

.layerTop {
  background: url(../images/top.png) repeat-x;
}

.layerTopLeft {
  background: url(../images/left_top.png) left no-repeat;
  padding-left: 20px;
}

.layerTopRight {
  background: url(../images/top_right.png) right no-repeat;
  padding-right: 20px;
}

.layerBottom, .layerBottomLeft, .layerBottomRight {
  clear: both;
  height: 20px;
}

.layerBottom {
  background: url(../images/bottom.png) repeat-x;
  text-align: center;
  line-height: 20px;
}

.layerBottomLeft {
  background: url(../images/bottom_left.png) left no-repeat;
  padding-left: 20px;
}

.layerBottomRight {
  background: url(../images/bottom_right.png) right no-repeat;
  padding-right: 20px;
}

/* End Website Structure */

/* Begin Forms Design */

form {
  line-height: 2em;
  text-align: left;
}

#hiddenForm {
  display: none;
}

fieldset {
  border: medium ridge white;
  -moz-border-radius: 15px;
  padding: 15px;
}

fieldset.noStyle {
  border: none;
}

legend {
  color: #00cc00;
  background-color: transparent;
  font-size: 1.15em;
  font-weight: bold;
  padding: 5px;
}

label {
  font-weight: bold;
  margin-right: 1em;
}

label.fixedWidth{
  display: block;
  float: left;
  width: 12em;
}

label.fixedWidthLarge{
  display: block;
  float: left;
  width: 24em;
}

select {
  cursor: pointer;
  border: 2px solid green;
  min-width: 8em;
}

option[selected="selected"] {
  font-weight: bold;
}

input[type="text"], input[type="password"], textarea {
  cursor: text;
  border: 2px solid green;
  -moz-border-radius: 10px;
  padding: 1px 6px 1px 6px;
  width: 8em;
  text-align: center;
}

input[type="radio"], input[type="checkbox"] {
  cursor: pointer;
}

input[type="radio"] + label, input[type="checkbox"] + label {
  margin-left: 0.5em;
}

input[type="submit"], input[type="reset"] {
  display: block;
  cursor: pointer;
  border: 2px outset #00cc00;
  font-weight: bold;
  margin: 5px auto 5px auto;
  padding: 1px 10px 1px 10px;
  color: white;
  background-color: green;
}

input[type="submit"]:focus, input[type="reset"]:focus {
  border: 2px inset #00cc00;
}

input[type="submit"].noStyle {
  display: inline;
  margin: 0 0 0 5px;
}

textarea {
  width: 99%;
  padding-right: 0;
  padding-bottom: 0;
  overflow: scroll;
}

#battles label, #mapForm label {
  margin-left: 1.2em;
}

#mangleLogin {
  margin: 20px auto 20px auto;
  width: 45%;
}

#search {
  position: absolute;
  right: 0;
  top: -5px;
}

#search fieldset {
  border: none;
  padding: 0;
}

#search input[type="text"] {
  border-right: none;
  -moz-border-radius: 7px 0 0 7px;
  padding: 1px 8px 1px 1px;
  margin: 0;
}

#search input[type="submit"] {
  display: inline;
  margin: 0;
  padding: 0;
  background-color: green;
  border-top: 2px solid green;
  border-left: none;
  border-bottom: 2px solid green;
  border-right: 2px solid green;
  color: white;
  cursor: pointer;
  font-weight: bold;
  -moz-border-radius: 0 7px 7px 0;
}

#pageNavForm {
  position: absolute;
  bottom: -15px;
  right: 26px;
}

.colors option {
  font-weight: bold;
}

/* End Forms Design */

/* Begin images design */

img {
  border: none;
}

.imgLeft {
  float: left;
  margin: 0 10px 10px 0;
}

.imgRight {
  float: right;
  margin: 0 0 10px 10px;
}

/* End images design */

/* Begin Links Design */

a {
  cursor: pointer;
  color: #3be419;
  background-color: transparent;
  font-weight: bold;
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
}

.externalLink {
	padding-right: 18px;
	background: url(../images/external_link.png) no-repeat center right;
}

th a, #footer a, .layerBottom a {
  color: white;
  background-color: transparent;
}

th a:hover, #footer a:hover, .layerBottom a:hover, .onclick:hover {
  text-decoration: underline;
}

.winner, .winner a {
  color: #00cc00;
  background-color: transparent;
  font-weight: bold;
}

.looser, .looser a {
  color: red;
  background-color: transparent;
  font-weight: bold;
}

#map a {
  display: block;
  position: absolute;
  height: 25px;
  width: 25px;
  font-size: 0.8em;
  text-decoration: none;
}

#map a.highlight {
  border: thin solid white;
}

a#mapLeft, a#mapUp, a#mapDown, a#mapRight {
  height: 16px;
  width: 16px;
}

a#mapLeft {
  top: 50%;
  left: -20px;
}

a#mapUp {
  top: -20px;
  left: 50%;
}

a#mapDown {
  bottom: -20px;
  left: 50%;
}

a#mapRight {
  top: 50%;
  right: -20px;
}

.level0 { background: url(../images/starmap/star0.png) center no-repeat; }
.level1 { background: url(../images/starmap/star1.png) center no-repeat; }
.level2 { background: url(../images/starmap/star2.png) center no-repeat; }
.level3 { background: url(../images/starmap/star3.png) center no-repeat; }
.level4 { background: url(../images/starmap/star4.png) center no-repeat; }
.level5 { background: url(../images/starmap/star5.png) center no-repeat; }
.level6 { background: url(../images/starmap/star6.png) center no-repeat; }
.level7 { background: url(../images/starmap/star7.png) center no-repeat; }
.level8 { background: url(../images/starmap/star8.png) center no-repeat; }

/* End Links Design */

/* Begin Lists Design */

ol {
	list-style-type: upper-roman;
	font-size: 1.5em;
	font-weight: bold;
	margin-bottom: 0;
}

ol li { margin-top: 15px; }

ol ol {
	list-style-type: upper-alpha;
	font-size: 0.9em;
	font-weight: bold;
	margin-left: 20px;
}

ol ol li { margin-top: 10px; }

ol ol ol {
	list-style-type: decimal;
	font-size: 0.9em;
	font-weight: bold;
	margin-left: 20px;
}

ol ol ol li { margin-top: 5px; }

ol ol ol ol {
	list-style-type: lower-alpha;
	font-size: 0.9em;
	font-weight: bold;
	margin-left: 20px;
}

ol ol ol ol li { margin-top: 3px; }

ul {
  list-style-type: none;
  list-style-image: url(../images/puce.png);
  list-style-position: outside;
	font-size: 1em;
	font-weight: normal;
}

#footer ul, #menu ul, .pageNav ul, #mangleMenu, #seeAlso, #shortcuts {
  list-style-type: none;
  list-style-image: none;
}

#footer li, .pageNav li, #mangleMenu li {
  display: inline;
  padding: 0 1em 0 1em;
}

.siteMap * ul, .siteMap * ol {
  display: block;
  float: left;
}

.siteMap * li {
  text-align: left;
  display: list-item;
}

#menu ul {
  width: 861px;
  margin: 0 auto;
}

#menu li {
  float: left;
  height: 35px;
  width: 103px;
  margin: 0 10px 0 10px;
  font-weight: bold;
  font-size: 1.3em;
  background: transparent url(../images/button.png) ;
}

#menu li:hover {
  color: inherit;
  background: transparent url(../images/button_up.png);
}

#validations {
  position: absolute;
  top: 30px;
  left: 5px;
}

#validations li {
  display: list-item;
  text-align: left;
}

.centeredLeft {
  width: 24em;
  margin: 0 auto;
}

.centeredLeft li {
  text-align: left;
}

ol#rankings {
  list-style-type: decimal;
}

ol#rankings li {
  font-size: 1em;
}

ol.tools {
  list-style-type: decimal;
  width: 9em;
  font-weight: normal;
}

ol.tools li {
  font-size: 0.8em;
  margin-top: 2px;
}

#aTrades ul, #pTradesList, #bestsList {
  margin: 1em 0 1em 2em;
}

#pTradesList {
  margin-left: 35%;
}

#bestsList {
  margin-left: 25%;
}

#pTradesList li, #bestsList {
  text-align: left;
}

.message li {
  text-align: left;
  margin-left: 4em;
}

ul.simList {
  display: none;
}

ul.liLinks {
  position: absolute;
  top: 32px;
  display: none;
  width: 15em;
  list-style-type: none;
  list-style-image: none;
  background: url(../images/fill.png) repeat;
  border: 2px solid green;
  -moz-border-radius: 0 15px 15px 15px;
  padding: 10px 5px 5px 5px;
  font-size: 0.8em;
  text-align: left;
}

.cat {
  width: 45%;
  float: left;
  margin: 2%;
  border: thin ridge white;
}

.cat h2 {
  color: white;
  background: url(../images/th.png) repeat;
  height: 23px;
  font-weight: bold;
  line-height: 23px;
  font-size: 1.2em;
}

.cat ul {
  list-style-type: none;
  list-style-image: none;
  text-align: center;
}

.cat ul li {
  display: block;
  width: 50%;
  height: 30px;
  line-height: 30px;
  float: left;
}

.cat ul li:hover {
  color: white;
  background-color: green;
}

.cat ul li:hover a, .cat ul li a:hover {
  color: white;
  font-size: 1.1em;
}

#menu li:hover ul.liLinks {
  display:block;
  width: 15em;
  height: auto;
}

#menu ul.liLinks li {
  clear: both;
  margin: 0;
  width: 15em;
  background-image: none;
}

#menu ul.liLinks li:hover {
  background-image: none;
}

#shortcuts {
  position: relative;
  top: 4px;
  width: 230px;
  margin: 0 auto;
}

#shortcuts li {
  display: inline;
  font-size: 0.7em;
  color: #3be419;
  background-color: transparent;
}

/* End Lists Design */

/* Begin Table Design */

table {
  width: 100%;
  border-spacing: 0;
  text-align: center;
  border: thin ridge white;
  border-collapse: collapse;
}

.message table {
  width: 400px;
}

h1, caption {
  font-family: Verdana, Arial, sans-serif;
  font-size: 1.5em;
  font-weight: normal;
  line-height: 2em;
  text-align: center;
}

tr:hover {
  background-color: #006600;
}

th, td {
  padding: 3px 2px 3px 2px;
  vertical-align: middle;
}

th, #mapList h3 {
  color: inherit;
  background: url(../images/th.png) repeat;
  height: 23px;
  font-weight: bold;
}

.message h3 {
  background: none;
  margin: 0 0 10px 0;
  text-align: left;
  text-decoration: underline;
}

td {
  color: inherit;
  background-color: transparent;
}

.stats th {
  width: 20%;
}

.stats td {
  width: 30%;
}

td.alignLeft {
  text-align: left;
  padding-left: 2em;
}

#owner, .owner {
  width: 40%;
}

.siege td {
  color: inherit;
  background: url(../images/sieged.png) repeat;
}

.freePlanet td {
  color: inherit;
  background: url(../images/free.png) repeat;
}

.memberNotCounted td, .darkerRow td {
  color: inherit;
  background-color: green;
}

.homeSys {
  font-weight: bold;
}

.sysOverview {
  width: 400px;
  background-color: black;
  color: inherit;
}

.sysOverview caption {
  font-size: 1em;
  font-weight: bold;
  margin: 0;
  padding: 2px 0 2px 0;
}

.sysOverview th {
  font-size: 0.8em;
}

.sysOverview td {
  font-weight: normal;
  font-size: 0.8em;
}

.sysOverview th#owner {
  width: 100%;
}

.sysOverview td.homeSys {
  font-weight: bold;
}

.pHistory {
  position: static;
  clear: none;
  float: left;
  width: 28%;
  margin: 0 0 2em 4em;
}

.pHistory th {
  width: 35%;
}

.phistory td {
  overflow: hidden;
}

#pProfile {
  width: 40%;
  margin: 0 auto;
}

#customizeRace {
  width: 50%;
  float: left;
  margin-right: 1em;
}

#mangleNews td {
  padding: 0.7em 0 0.7em 0;
}

#mangleNews tr:hover, .stats tr:hover, #pProfile tr:hover, #aTrades tr:hover, #alliance2 tr:hover {
  color: inherit;
  background-color: transparent;
}

/* End Table Design */

/* Begin Texts Design */

abbr, acronym, .title {
  cursor: help;
  border-bottom: thin dotted;
}

h2 {
  color: red;
}

.smaller {
  font-size: 0.9em;
}

#copyright {
  font-size: 0.8em;
}

/* Map coordinates */
#map {
  position: relative;
  background-image: url(../images/starmap/bg.png);
  background-repeat: repeat;
  margin: 40px auto 0 15em;
}

.coordsX, .coordsY {
  color: white;
  background-color: transparent;
  display: block;
  height: 25px;
  width: 25px;
  text-align: center;
  line-height: 25px;
}

.coordsX {
  float: left;
}

/* Map tags colors */
.color1, .color2, .color3, .color4, .color5, .color6, .color7, .color8, .color9, .color10, .color11,
.color12, .color13, .color14, .color15, .color16, .color17, .color18, .color19, .color20, .color21   {
  background-color: transparent;
}
.color1 { color: green; }
.color2 { color: #f87217; }
.color3 { color: red; }
.color4 { color: yellow; }
.color5 { color: gray; }
.color6 { color: #00ffff; }
.color7 { color: lime; }
.color8 { color: fuchsia; }
.color9 { color: #fcfcfc; }
.color10 { color: #b041ff; }
.color11 { color: #736aff; }
.color12 { color: #e18b6b; }
.color13 { color: #6cc417; }
.color14 { color: #f75d59; }
.color15 { color: #ee9a4d; }
.color16 { color: #faafbe; }
.color17 { color: #ecd672; }
.color18 { color: #3bb9ff; }
.color19 { color: #e9ab17; }
.color20 { color: #f87431; }
.color21 { color: #ffe87c; }

.raceColor1 { background-color: #631010; }
.raceColor2 { background-color: #561010; }
.raceColor3 { background-color: #491410; }
.raceColor4 { background-color: #422115; }
.raceColor5 { background-color: #352820; }
.raceColor6 { background-color: #283525; }
.raceColor7 { background-color: #214230; }
.raceColor8 { background-color: #144935; }
.raceColor9 { background-color: #105640; }

#errorBox {
  width: 95%;
  margin: 1em auto 1em auto;
  padding: 10px;
  border: 2px dashed red;
  font-weight: bold;
  color: white;
  background-color: transparent;
  text-align: center;
}

.fillFloat {
  clear: both;
  visibility: hidden;
}

.note {
  border: 2px dashed green;
  margin-top: 0.5em;
  padding: 0.3em;
}

.onclick {
  cursor: pointer;
}

.sysOverview {		
  display: none;
  position: absolute;
  z-index: 30;
}

.resigned {
  font-style: italic;
}

.mangleFailed {
  font-style: italic;
  font-weight: bold;
  color: red;
  background-color: transparent;
}

.mangleNews {
  color: inherit;
  background-color: #f2a036;
}

.goldMember {
  color: #e4cc47;
  background-color: transparent;
  font-weight: bold;
}

#mangleLogin img {
  height: 5em;
  width: 20em;
}

.message {
  padding: 2em;
  margin-bottom: 1em;
  /* border: 5px double #415dcd; */
}

.message p {
  margin: 1em;
  text-align: justify;
  font-size: 1.2em;
  text-indent: 0.7em;
  overflow: hidden;
}

.message p:first-letter {
  font-weight: bold;
  font-size: 1.4em;
}

.message .date {
  font-weight: normal;
  font-style: italic;
  font-size: 0.85em;
}

.contact {
  clear: both;
  text-align: left;
}


#mapList {
  float: left;
  width: 12em;
  max-height: 700px;
  overflow: auto;
  border: solid 2px green;
  margin-top: 30px;
}

#mapList h3 {
  line-height: 23px;
}

#mapList ul {
  list-style-type: none;
  list-style-image: none;
  margin: 10px;
}

hr {
  border: 2px outset #006600;
  margin: 20px auto 20px auto;
  width: 30%;
}

/* End Texts Design */