﻿html{height: auto;
	width: auto;}

body
{
background-image: url(images/texture-7.jpg);
background-attachment:fixed;
position: absolute;
	min-width: 1200px;
	margin: 0; padding: 0;
}


.compet{ 
		 position:fixed;
		 width:624px;
		 top: 480px;
		 left:540px;
		 z-index:2;
		 }
		 
.compet2{
		 position :fixed;
		 width: 624px;
		 top: 480px;
		 left:540px;
		 z-index:2;
		 transition: 1s;
		 }
		 
.compet3{
		 position :fixed;
		 width:650px;
		 top: 150px;
		 left:150px;
		 z-index:2;
		 transition: 1s;
		 }
		 
.titrecompet{ position: absolute;
			top: 10px;
			left: 30px;}

.jack{ width: 1100px;}

#blabla2{ position: absolute;
			top: 50px;
			left: 30px;
			max-width: 550px;
			min-height:500px;}

#blabla3{ position: absolute;
			top: 50px;
			left: 120px;
			max-width: 500px;
			min-height:500px;}
			
#blabla4{ position: absolute;
			top: 320px;
			left: 30px;
			max-width: 550px;
			min-height:500px;}

			
#titrefaction{
	position: absolute;
	top: 300px;
	left: 60px;
}
#second{ position: relative;
			top: 15px;
			left: 30px;}
			
#description{ 
position: absolute;
max-width: 880px;
top: 350px;
left: 270px;
}
#description2{ 
position: relative;
max-width: 880px;
left: 270px;
}

#symbole{
	position: absolute;
	top: 360px;
	left: 30px;
	height:220px;
}

#contenus{
	position: absolute;
	top: 570px;
	left: 30px;
	
}


#visuel{						/* place la photo du combattant */
	position: absolute;
	top: 75px;
	left: 30px;
	max-height: 300px;
	z-index:2;
}

#bouto4{
	position: absolute;
	top: 380px;
	left: 25px;
	max-height: 120px;
	z-index:3;
}


#blabla{						/* texte du profil */
	position: absolute;
	top: 30px;
	left:270px;
	z-index:3;
	height:400px;
	width: 330px;
}
#blabla3{						/* texte du profil */
	position: absolute;
	top: 60px;
	left:270px;
	z-index:3;
	height:400px;
	width:600px;
}


#name{						/* positionne le nom du combattant sur son profil */
	position: absolute;
	top: 20px;
	left:50px;
	z-index:3;
}

.mini{							/* pour donner la taille du premier visuel*/ 
	max-height: 200px;
}

div.toggle-info{
	display: inline-block;
	margin-left:2px;
	max-width:150px;
	}


div.deux{
	display: block;
	margin-left:2px;
	max-width:150px;
	float: none;
	}
	
div.info-panel { 
	background-image:url(images/fondiv.png);
	display: none;
	position: fixed;
	left: 500px;
	top: 130px;
	width:630px;
	height:424px;;
}

div.info-panel2 { 
	background-image:url(images/fondiv6.png);
	background-image:url(images/fondiv5.png);
	display: none;
	position: fixed;
	left: 200px;
	top: 130px;
	width:860px;
	height:579px;
}




#compétence{
	position: absolute;
	top:40px;
	left:50px;
	z-index:3
}

#conseils{				/* texte du bas */
	position: absolute;
	top: 1600px;
	left: 30px;
}

#achat{				/* positionne le logo pour le site officiel */
	position: absolute;
	top: 20px;
	left: 900px;
}

#logoff:hover{box-shadow: black 5px 5px 5px; } /* modif de l'image logo officielle */

h3.image{text-align: center;
		 position: relative;
		 top: -15px;}
		 

#wip{
	position: absolute;
	top:400px;
	left:300px;
}
#menu{
	width: 1200px;
	height: 200px;
}

#titre1{
	position: absolute;
	top: 40px;
	left: 50px;
}

#titre2{
	position: absolute;
	top: 280px;
	left: 500px;
}

#paragraphe{
	max-width: 1000px;
}

#p1{
	position: relative;
	left:30px;
	top: 300px;
	min-height: 300px;
	min-width: 500px;
	z-index:2
}

#p01{
	position: relative;
	left:0px;
	top: 0px;
	min-height: 200px;
	min-width: 1000px;
	
}
#p02{
	position: relative;
	left:0px;
	top: 0px;
	min-height: 200px;
	min-width: 1000px;
	z-index: 1}

#p2{
	position: absolute;
	left: 100px;
	top: 150px;
	min-height: 200px;
	min-width: 500px;
}

ul.faction li {
	margin-left:2px;
	float:left; /*pour IE*/
}

#degage{ float: none;
		 margin-right:5px;}


ul.faction li a {
	display:block;
	margin-left:2px;
	margin-top:10px;
	float:left; /*pour IE*/
}


a{text-decoration: none;}


ul {list-style-type:none;
margin-top: 5px;
margin-left: 5px;
margin-right:5px;}


h1{
	position: relative;
	left: 250px;
}

h2{ min-width: 300px;}



img.bouton2 {
	display:none;
	position: relative;
	height:150px;
	}
	
img.bouton1  {
	height:150px;
	}
	
img.bouto  {
	height:150px;
	width:100px;
	}

img.bouton3 {
	height:150px;
	}
	
img.bouto6{
	display: block;
	height:150px;
	width:110px;
	z-index:2;
}


a:hover img.bouton2 {display: block;}
a:hover img.bouton1 {display: none;}

a:hover /* par défaut: halo blanc */
    {text-shadow: white 0px 0px 10px;
	z-index: 1}

img.bouto6:hover {box-shadow: black 4px 4px 4px;}
	

img.mini:hover{
	 position: relative;
	 top: -10px;
    }
	
img.titre:hover{
	 position: relative;
	 top: -10px;
    }
	
img.bouton:hover{
	 position: relative;
	 top: -10px;
    }



#basdepage{
		text-align: center;
		}

#bas {
	position: relative;  bottom: 0; left: 0; right: 0;
	height: 100px; /* à titre d'exemple */
	}

#game {
	position: absolute;
	left: 50px;
	margin-left: 5px;
	margin-top: 5px;
	margin-right: 5px;
	background-color:rgba(255,255,240,0.6);
	width: 1100px; /* à titre d'exemple */
	}
#textgame {
	margin-left: 15px;
	margin-top: 10px;
	margin-right: 10px;
	margin-bottom: 10px;
	}
#imagegame {
	margin-left: 200px;
	width:600px;
}
#regles{
	width:1100px;
}
#compendium{
	margin-top: 50px;
	margin-left: 40px;
	width:1100px;

}
#presentcompendium{
	text-align: center;
}	

