body {
	background-color: black;
	text-align: center;
}

#page {
	background-color: white;
	width: 90%;
	margin: 0;
	margin-top: 2%;
	margin-left: auto;
    margin-right: auto;
    padding: 0 15px 15px 15px;
    border: 1px solid #d1d1d1;
    
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #4560a5; 
}

/* BLOCS PRINCIPAUX */

/* Header */
#header {
	height: 130px;
	background: url("../../img/design/1/head_0.jpg") no-repeat bottom right;
}
#head_beta {
	margin-top: 10px;
	height: 100px;
	background: url("../../img/design/1/head_v0.3.jpg") no-repeat bottom left;	
}

/* Menu v2 ***********/
#navbarre {
	height: 25px;
	list-style-type: none;
	margin: 0 0 4px 0;
	padding: 0 5px 0 0;
	background-image: url("../../img/design/1/h2.gif");
	background-repeat: repeat-x;
}
.navdroite {
	float: right;
}
.navgauche {
	float: left;
}
#navbarre li {	
	padding-right: 0px;
	line-height: 25px; 
}
#navbarre li a { 
	display: block;
	
	padding: 0 9px 0 9px;
	color: white;
	text-align: left;
}
#navbarre li a:hover {
	color: #d1d1d1;
	
}

#navbarre li a.wrap {
	padding-right: 20px;
	background: url("../../img/design/1/fleche1.png") no-repeat right bottom;	
}

#navbarre li a.wrap:hover {
	background: url("../../img/design/1/fleche2.png") no-repeat right bottom;
}

#navbarre .sous_menu
{
	padding: 2px 0 2px 0;
	margin: -3px 0 0 0;
	list-style: none;
	
	border: 1px solid #0066B9;

	position: absolute;
	background-color: white;
	width: 120px;
	z-index: 500;
}

#navbarre .sous_menu li a {
	text-align: left;
	font-size: 11px;
	color: #0066B9;
	text-decoration: none;
	line-height: 20px;
}

#navbarre .sous_menu li a.jeu {
	color: green;
}

#navbarre .sous_menu li a:hover {
	/*background-color: #88cfea;*/
	color: white;
	background-color: #0066B9;
}

#navbarre .sous_menu li a.jeu:hover {
	color: white;
	background-color: #40a060;
}


/* Contenu */
#main {
	font-size: 12px;
	margin-left: 150px;
	padding: 1px 1px 20px 1px;
	text-align: justify;
	background-color: white;
}

/* ancien Menu */
#menu {
	width: 145px;
	float: left;
	margin-bottom: 15px;
	text-align: left;
	padding-left: 0px;
}

/* Footer */
#footer {
	font-size: 12px;
	color: #a0a0a0;
	border-top: 1px solid #0066B9;
	clear: both;
}

#footer a {
	color: #a0a0a0;
	text-decoration: none;	
}

#footer a:hover {
	text-decoration: underline;	
}

.spacer {
	clear: both;
}

/* liens */
a {
	font-size: 12px;
	color: #0066B9;
	text-decoration: none;
}

a:hover {
	color: #006fc9;
}

/* infobulle d'aide */
a.info {
	position: relative;
	display: block;
	width: 20px;
	height: 20px;
	background: url("../../img/design/1/info.jpg") no-repeat;
}

a.info span {
	display: none;
}

a.info:hover span {
	display: inline;
	position: absolute;
	top: 20px;
	left: 20px;
	padding: 3px;
	color: #4560a5; 
	background-color: #f1f1f1;
	border: 1px solid #4560a5;
	width: 200px;
	text-align: justify;
	z-index: 500;
}

/* blocs de texte */
.fiche_perso {
	margin: auto; 
	width: 460px; 
	border: 1px solid #0066B9; 
	padding: 10px;
}

.cadre1 {
	padding: 5px;
	border: 1px solid #0066B9;
	background-color: white;
	width: 300px;
	margin-bottom: 10px;
}

/* tableau de disponibilites horaires */
div#conteneur_tableau_horaire {
	width:615px; 
	margin: auto;
}

table#tableau_horaire {
	border-collapse: collapse;
	text-align: center;
	margin-bottom: 15px;
}

td.jour {
	width: 75px;
	border-bottom: 1px solid #0066B9;
	font-weight: bold;
}

td.heure {
	border-right: 1px solid #0066B9;
	font-weight: bold;
}

/* fil d'arianne */
#arianne {
	margin: 0 0 10px 0;
	padding: 0;
	background-color: #f1f1f1;
	height: 18px;
	font-size: 10px;
}

#arianne .text {
	float: left;
}

#arianne a {
	font-size: 10px;
	line-height: 18px;
}

#arianne a:hover {
	text-decoration: underline;
}

#arianne a.accueil {
	margin-left: 14px;
}
#arianne .arianne_gauche {
	width: 14px;
	height: 18px;
	background: url("../../img/design/1/arianne0.jpg") no-repeat;
	position: absolute;
	float: left;
}
#arianne .arianne_droite {
	width: 14px;
	height: 18px;
	background: url("../../img/design/1/arianne1.jpg") no-repeat;
	float: right;
}

/* titres */
h1 {
	color: #0066B9;
	font-size: 20px;
	text-align: center;
}
h2 {
	font-size: 14px;
	font-family: Arial, serif;
	color: #0066B9;
}

/* Messages */
.msg_erreur {
	padding: 4px;
	font-size: 11px;
	color: #0066B9;
	text-align: center;
	margin-bottom: 3px;
	border: 1px solid #ff2020;
	background-color:#ffe0e0;	
}

.msg_info {
	padding: 4px;
	font-size: 11px;
	color: #0066B9;
	text-align: center;
	margin-bottom: 3px;
	border: 1px solid #19A0FF; 
	background-color: #D9EFFE;	
}

/* News */
.news_conteneur {
	margin-bottom: 15px;
	border-bottom: 1px solid #0066B9;
	padding-bottom: 7px;
}

.news_titre {
	font-weight: bold;
	color: #0066B9;
	border-bottom: 1px solid #0066B9;
}
.news_info {
	color: #a0a0a0;
	font-size: 10px;
	text-align: right;
}

/* boutons d'agrandissement du main */
.bouton {
	border: 1px solid white;
	width: 15px;
	height: 15px;
	float: right;
	text-align: center;
}
.bouton a {
	color: white;
}

/* barre de mise en forme */
.form_barre {
	text-align: center;
	margin-bottom: 3px;
}

.form_barre .titre {
	color: #808080;
	font-size: 11px;
}

.form_barre img {
	vertical-align: middle;
}
/* Autres */
.warning {
	background-image: url("../../img/design/1/warning.png");
	background-repeat: repeat-x;
	height: 25px;
	line-height: 25px;
	color: black;
}
.con {
	float: left;
	width: 100px;
}
form {
	margin: 0px;
}

.center {
	text-align: center;
}

fieldset {
	border: 1px solid #4560a5;
	margin-bottom: 15px;
}

legend {
	font-weight: bold;
}
label {
	width: 170px; 
	display: block; 
	float: left;
}

.underline {
	text-decoration: underline;
}

.strike {
	text-decoration: line-through;
}

.img {
	margin: 5px;
}

.quote {
	background-color: #f1f1f1;
	padding: 5px;
}

img {
	border: 0;
}

.th, th {
	border-bottom: 1px solid #0066B9;
}

.cadreBleu {
	border: 1px solid #0066B9; 
	padding: 5px; 
	margin: 0 0 15px 0;
}

/* actions disponibles sur une page */
a.action {
	display: block;
	height: 20px;
	line-height: 20px;
	margin: 0 0 2px 0;	
	padding-left: 23px;
	background: url("../../img/design/1/icone_action.jpg") no-repeat;
}

a.action:hover {
	background: url("../../img/design/1/icone_action2.jpg") no-repeat;
	background-color: #f1f1f1;
}

/* listes */

/* liste 1 */
ul.liste1 {
	border: 1px solid #0066B9;
	list-style: none;
	padding: 3px;
	/*width: 40%;*/
		width: 250px;
}

ul.liste1 li {
	margin: 1px;
	height: 20px;
	line-height: 20px;
	display: block;
}

ul.liste1 li a {
	display: block;
	padding: 0 0 0 4px;
}

ul.liste1 li a:hover {
	background-color: #f1f1f1;
}

/* Chat ************************/
#chat {	
	width: 143px; 
	margin: 0 0 15px 0;
	background-color: #0565b9;
	text-align: center;
}
	
#chat_top {
	width: 145px;
	height: 20px;
	background: url("../../img/design/1/chat_top.jpg") no-repeat;
}
	
#chat_bottom {
	width: 145px;
	height: 10px;
	background: url("../../img/design/1/chat_bottom.jpg") no-repeat;
}
	
#show_chat {
	padding: 1px;
	margin: 3px;
	background-color: white;
		
	text-align: left;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #4560a5; 
	overflow: hidden;
}

/* Carte des membres ***********/
table.map_membres {
	border-collapse: collapse; 
	text-align: center;
	margin-bottom: 20px;
}

.map_membres td {
	width: 12%;
	height: 50px;
	border: 1px solid #0066B9;
}

a.detail {
	color: white;
	position: relative;
}

a.detail span {
	display: none;
}

a.detail:hover {
	z-index: 500;
}

a.detail:hover span {
	display: inline;
	position: absolute;
	top: 20px;
	left: -95px;
	padding: 3px;
	color: #4560a5; 
	background-color: #f1f1f1;
	border: 1px solid #4560a5;
	width: 170px;
	text-align: left;
}

/* Carte d'un monde ***********/
table.map_monde {
	border-collapse: collapse; 
	text-align: center;
	margin-bottom: 20px;
	width: 560px;
	margin: auto;
}

.map_monde td {
	width: 20px; 
	height: 20px; 
	border: 1px solid #0066B9;
	z-index: 1;
}

table.nav_monde {
	border-collapse: collapse; 
	text-align: center;
	margin: auto;
}

.nav_monde td {
	width: 30px;
	height: 30px;
}

/* Affichage du matos de toute la guilde */

fieldset.inventaire {
	border: 1px solid #0066B9;
	width: 80%;
	margin: 0 auto 15px auto;
	text-align: left;
}

.inventaire .elem_invent {
	float: left;
	width: 32%;
	margin: 3px;
}

.inventaire ul {
	list-style: none;
	padding: 0;
}

.inventaire img {
	vertical-align: middle;
	margin: 3px;
}

/* Calendrier */
table#calendrier {
	text-align: center; 
	border-collapse: collapse;
	margin: auto;
}

#calendrier td {
	/*border: 1px solid #0066B9;	*/
	width: 40px;
	height: 40px;
	line-height: 40px;
}

#calendrier td.today {
	border: 1px solid #0066B9;
	font-weight: bold;
}

#calendrier td.busy {
	background-color: #a3c3dc;
}

#calendrier td a {
	height: 40px;
	width: 40px;
	display: block;
	color: #4560a5;
}

#calendrier td a:hover {
	background-color: #88cfea;
}

/* Formulaire type 2 */
.form2 {
	padding: 15px;
	margin: auto;
	width: 75%;
}

.form2 .legende {
	color: #808080;
	font-size: 11px;
	font-style: italic;
	margin-bottom: 15px;	
}

/* Pop up */
.popup {
	width: 300px; 
	display: none; 
	z-index:1000; 
	position: absolute; 
	font-size: 13px;
}

.popup #close {
	width: 20px; 
	height: 16px;
	font-weight: bold;
}

.popup h2 {
	margin-top: 0;
}

/* Planning */
#planning {
	padding: 0 0 0 10px; 
	background: #0066B9; 
	border-top: 1px solid #0066B9;	
}

#planning .event {
	border-bottom: 1px solid #0066B9; 
	background: white; 
	padding: 2px 0 2px 5px;
}

#planning .event .desc {
	padding-left: 25px; 
	color: #808080; 
	font-size: 11px;
}