#menu {
float: left ;
width: 150px;
height: 700px;
border-right: 1px dotted gray ;
}
#page {
float: left ;
margin-left: 10px ;
}

#page_carte {
float: left ;
margin-left: 10px ;
}
#page_construction {
float: left ;
margin-left: 10px ;
}

table.TABLEcarte {
background: url('images/brouillard.gif') ;
background-position: center center;
background-repeat: no-repeat;
background-color: black;
}


input.INPUTressources {
width: 20px;
border: none;
}
input.INPUTcommerce {
width: 20px;
border: 1px solid black;
}

.plus, .moins, .deplacer {
width: 20px;
height: 20px;
border: 1px solid black;
background-color: gray;
color: white;
font-weight: bold;
font-size: 10px;
}

td.TDcommerce {
text-align: right;
}

.centrer {
  text-align: center;
}

td.tdIcone {
border: 1px solid black;
padding: 0px;
text-align: right;
vertical-align: bottom;
width: 50px; height: 50px;
background-position: center center;
background-repeat: no-repeat;
background-color: black;
color: white;
}

span.spanIcone {
font-weight: bold;
color: white;
}

td.Bois {
background: url('images/_Foret_.jpg') ;
}
td.Viande {
background: url('images/_Gibier_.jpg') ;
}
td.Pierre {
background: url('images/_Pierre_.jpg') ;
}
td.Poisson {
background: url('images/_Lac_.jpg') ;
}
td.Montagne {
width: 145px;
background: url('images/_Montagne_.jpg') ;
}

span.Charbon {
color: black;
}
span.Fer {
color: silver;
}
span.Or {
color: gold;
}


/* Carte */

input.INPUTbascarte {
width: 40px; height: 25px;
padding-top: 3px; padding-right: 5px;
border: 2px solid black;
text-align: right;
}
input.BOUTONbascarte {
width: 40px; height: 25px;
border: 2px solid black;
color: white;
background-color: gray;
}

div.zonehover {
  background: url('images/transparent.gif') ;
}

div.construction1 {
  background: url('images/icones/bat_taille1.gif') no-repeat center center;
}

div.construction1hover {
  background: url('images/icones/taille1/bat_taille1.gif') no-repeat center center;
}

div.construction2 {
  background: url('images/icones/bat_taille2.gif') no-repeat center center;
}

div.construction2hover {
  background: url('images/icones/taille1/bat_taille2.gif') no-repeat center center;
}

div.construction3 {
  background: url('images/icones/bat_taille3.gif') no-repeat center center;
}

div.construction3hover {
  background: url('images/icones/taille1/bat_taille3.gif') no-repeat center center;
}

div.construction_NE {
  background: url('images/icones/upgrade_NE.gif') no-repeat center center;
}
div.construction_SE {
  background: url('images/icones/upgrade_SE.gif') no-repeat center center;
}
div.construction_NO {
  background: url('images/icones/upgrade_NO.gif') no-repeat center center;
}
div.construction_SO {
  background: url('images/icones/upgrade_SO.gif') no-repeat center center;
}
div.construction_O {
  background: url('images/icones/upgrade_O.gif') no-repeat center center;
}

ul.charette li { 
  display : inline;
  padding : 0em 0em 0em 0.5em ; /* Pour espacer les boutons entre eux */
}
ul.charette {
  list-style-type : none; /* Car sinon les puces se placent n'importe oł */
  margin: 0;
  padding: 0;
}