@charset "utf-8";
/* CSS Document */

html {
	height:100%
}

body	{	
	margin:0px; 
	background-color:#060303;	
	background-image:url(../../img/design/marron/bg.jpg); 
	background-repeat:repeat-x; 
	height:100%; 
	font-family:Arial; 
	font-size:13px; 
	color:#fff7d2;	
	width:100%
}

img {
	border: 0px;
}

form {
	margin:0;
}

#cadre_principal	{
	width:1123px; 
	height:873px; 
	margin:auto; 
	padding-top:20px; 
	position:absolute; 
	margin-left:70px
}

#fenetre_principale	{	
	margin:auto; height:720px; 
	width:1123px; 
	background-image:url(../../img/design/marron/fenetres/final2.png); 
	padding-top:150px	
}

#fenetres_gauche {
	width:420px; 
	margin-left:130px; 
	height:490px; 
	float:left
}

.fenetre_verte_1 {	
	width:390px; 
	height:214px;
	background-image:url(../../img/design/marron/fenetres/fenetre_verte_1.png);
	padding-left:15px; 
	padding-right:15px 
}
.fenetre_verte_2						{	width:390px; height:460px; background-image:url(../../img/design/marron/fenetres/fenetre_verte_2.png); padding-left:15px; padding-right:15px }


.masque	{	
	width:100%; 
	height:100%; 
	background-color:#000; 
	position:absolute;
	text-align:center; 
	filter:alpha(opacity=50);   /* IE */
	-moz-opacity:0.5;           /* Firefox */
	opacity: 0.5;               /* standard CSS3 */
	-khtml-opacity: 0.5;        /* Konqueror */
	z-index:999; 

	/*display:none */
}


#popup_loading {
	width:220px; 
	height:26px; 
	position:absolute; 
	left:50%; 
	top:50%;
	 margin-left:-175px; 
	margin-top:-25px; 
	background:url(../../img/design/marron/fenetres/chargement.png); 
	padding-top:30px; 
	padding-left:30px;
	z-index:999; 
}


.txt_arial { 
	font-family:Arial; 
	font-size:12px; 
	color:#fff7d2 
}

.txt_arial_titre { 
	font-family:Arial; 
	font-size:16px; 
	color:#fff7d2; 
	font-weight:bold 
}

.txt_arial_sous_titre { 
	font-family:Arial; 
	font-size:12px; 
	color:#f4bb3c 
}


a:visited				{ color:#fff7d2}
a						{ color:#fff7d2}
a.black_link:visited			{ color:#000000}
a.black_link					{ color:#000000}


div.avatars_display						{	width:100px; height:100px; }


/*#############################################################*/


.texte_arial_noir					{ font-family:Arial; font-size:12px; color:#000000 }



div.fenetre_1	{
	height:250px;
	width:368px;
	background-image:url(../../img/design/marron/fenetres/modele_1.png);
	position:absolute;
	margin-left:700px;
	margin-top:-125px;
	left: 364px;
	top: 134px;
}

/* la personalisation du perso su rl apage d'inscription */
div.skin_display							{	width:349px; height:400px; }
div.choix_coiffure						{	width:260px; height:59px; background-image:url(../../img/design/marron/fenetres/coiffure.png);  padding-top:20px; padding-left:30px }
div.choix_coiffure_couleurs		{	width:260px; height:49px; background-image:url(../../img/design/marron/fenetres/coiffure_couleurs.png); padding-top:30px; padding-left:30px }
div.choix_skins								{	width:260px; height:49px; background-image:url(../../img/design/marron/fenetres/skins.png); padding-top:30px; padding-left:30px }
div.choix_couleurs_primaires	{	width:260px; height:49px; background-image:url(../../img/design/marron/fenetres/couleurs_primaires.png); padding-top:30px; padding-left:30px }
div.choix_couleurs_secondaires{	width:260px; height:49px; background-image:url(../../img/design/marron/fenetres/couleurs_secondaires.png); padding-top:30px; padding-left:30px }
div.nom_du_perso							{	width:250px; height:51px; background-image:url(../../img/design/marron/fenetres/nom_du_perso.png); margin-left:450px;}
div.race											{	width:136px; height:32px; background-image:url(../../img/design/marron/fenetres/race.png); padding-left:20px; padding-top:25px}
div.sexe											{	width:136px; height:32px; background-image:url(../../img/design/marron/fenetres/sexe.png); padding-left:20px; padding-top:25px}
div.caracteristiques					{	width:196px; height:167px; background-image:url(../../img/design/marron/fenetres/caracteristiques.png); }
div.informations							{	width:196px; height:111px; background-image:url(../../img/design/marron/fenetres/informations.png);	}
div.barre_infos								{ width:100px; height:11px; position:absolute; font-size:10px; margin:0; padding:0; text-align:center; visibility:hidden }

/* la page d'accueil */

/* la carte */
div.map_case									{ float:left; position:absolute; width:44px; height:100px; }

/* info bulle */
.infobulle{
    position: absolute;   
    visibility : hidden;
    border: 1px solid Black;
    padding: 10px;
    font-family: Verdana, Arial;
    font-size: 10px;
    background-color: #FFFFCC;
}

div.banniere_clicjeux					{ position:absolute; margin-left:76px; margin-top:700px; border-style:solid; border-width:1px; border-color:black }
div.banniere_luditools				{ position:absolute; margin-left:564px; margin-top:700px; border-style:solid; border-width:1px; border-color:black }
div.banniere_jeugratuit				{ position:absolute; margin-left:76px; margin-top:790px }
div.banniere_pbem							{ position:absolute; margin-left:310px; margin-top:700px; border-style:solid; border-width:1px; border-color:black }

table#pierres td#heroique			{background-image:url(../../img/items/pierre_heroique___false.png);  }
table#pierres td#heroique:hover			{background-image:url(../../img/items/pierre_heroique.png); }
table#pierres td#loyaute			{background-image:url(../../img/items/pierre_de_loyaute___false.png);  }
table#pierres td#loyaute:hover{background-image:url(../../img/items/pierre_de_loyaute.png); }
table#pierres td#guide				{background-image:url(../../img/items/pierre_du_guide___false.png);  }
table#pierres td#guide:hover	{background-image:url(../../img/items/pierre_du_guide.png); }
table#pierres td#aragon				{background-image:url(../../img/items/pierre_aragon___false.png);  }
table#pierres td#aragon:hover	{background-image:url(../../img/items/pierre_aragon.png); }