/*#panel { 
	width: 5rem; 
	height: 5rem; 
	padding: 0.5rem; 
	position: absolute; 
	bottom:0rem; 
	left:50%; 
	margin-left:-2.5rem; 
}*/


#main-container #family-title {
	position: absolute;
	top:0rem;
	left: 3rem;
}
#main-container #family-title img {
	width:auto;
	height: 9rem;
}
#main-container #step-home {
	position: absolute;
	bottom: -0.5rem;
	left: 11.5rem;
}
#main-container #step-home img {
	width:auto;
	height: 7rem;
}
#main-container #step-previous {
	position: absolute;
	bottom: 5.5rem;
	left: 11.4rem;
}
#main-container #step-previous img {
	width:auto;
	height: 5.5rem;
}
#main-container #step-next {
	position: absolute;
	bottom: -2rem;
	right: 17.5rem;
}
#main-container #step-next img {
	width:auto;
	height: 9rem;
}
#main-container #game-play {
	position: absolute;
	top: 9rem;
	left: 16.5rem;
	cursor: pointer;
	z-index: 100;
}
#main-container #game-play img {
	width:auto;
	height: 38rem;
}
#main-container.step-0 #panel {
	position: absolute;
	bottom: 1.6rem;
	left: 26.7rem;
	z-index: 30;
}
#main-container.step-0 #panel img {
	width:auto;
	height: 8rem;
}
#main-container.step-1 #panel, 
#main-container.step-3 #panel {
	position: absolute;
	bottom: 3.3rem;
	left: 26.8rem;
	z-index: 30;
}
#main-container.step-2 #panel {
	position: absolute;
	bottom: -0.2rem;
	left: 28rem;
	z-index: 30;
}
#main-container.step-1 #panel img, 
#main-container.step-3 #panel img {
	width:auto;
	height: 4.5rem;
}
#main-container.step-2 #panel img {
	width:auto;
	height: 8rem;
}

#main-container.step-0 #end-panel, 
#main-container.step-1 #end-panel, 
#main-container.step-2 #end-panel, 
#main-container.step-3 #end-panel {
	position: absolute;
	bottom: -1rem;
	left: 24rem;
	z-index: 30;
}
#main-container.step-0 #end-panel img, 
#main-container.step-1 #end-panel img, 
#main-container.step-2 #end-panel img, 
#main-container.step-3 #end-panel img {
	width:auto;
	height: 9.5rem;
}

#main-container.step-1 #panel #panel_handler, 
#main-container.step-2 #panel #panel_handler, 
#main-container.step-3 #panel #panel_handler {
	position: absolute;
	top: 50%;
	left: 50%;
	width:50%;
	height:50%;
	margin-left:-25%;
	margin-top:-18%;
	cursor: pointer;
}

#main-container #flash-block {
	position: absolute;
	top:0rem;
	left:0rem;
	width:80rem;
	height:60rem;
	z-index:1000;
	background-color:#FFFFFF;
	display:none;
}

#main-container #peoples_tree {
	position: absolute;
	top:0rem;
	left:2rem;
	width:auto;
	height:auto;
}
#peoples_tree  .person {
	position: absolute;
	width:auto;
	height:auto;
	cursor:pointer;
}
.step-0 #peoples_tree  .person, 
.step-1 #peoples_tree  .person, 
.step-1 #peoples_tree  .person.selected, 
.step-2 #peoples_tree  .person {
	opacity:0.7;
	filter:alpha(opacity=70);
}
.step-0 #peoples_tree  .person.selected,
.step-2 #peoples_tree  .person.selected, 
.step-3 #peoples_tree  .person, 
.step-3 #peoples_tree  .person.selected  {
	opacity:1.0;
	filter:alpha(opacity=100);
}


/* temporaire, il faudra redimensionner les images */
#peoples_tree  .person img {
	height: 11.8rem;
}


.step-3 #peoples_tree  .person img.no-face { z-index:10; }
.step-3 #peoples_tree  .person img.one-face { z-index:20; }

.step-3 #peoples_tree  .person img.one-face {
	opacity:0;
	filter:alpha(opacity=0);
	position:absolute;
	top:0px;
	left:0px;
}

#peoples_tree  .person#grand_cousin		{ top: 34rem;	 left: 67rem;	}
#peoples_tree  .person#petit_cousin		{ top: 34rem;	 left: 58rem;	}
#peoples_tree  .person#grande_cousine	{ top: 32rem;	 left: 0rem;	}
#peoples_tree  .person#petite_cousine	{ top: 32rem;	 left: 9rem;	}
#peoples_tree  .person#grand_frere		{ top: 34rem;	 left: 46rem;	}
#peoples_tree  .person#petit_frere		{ top: 35rem;	 left: 38rem;	}
#peoples_tree  .person#grand_mere-mat	{ top: 5rem;	 left: 40rem;	}
#peoples_tree  .person#grand_mere-pat	{ top: 4rem;	 left: 27rem;	}
#peoples_tree  .person#grand_pere-mat	{ top: 5rem;	 left: 50rem;	}
#peoples_tree  .person#grand_pere-pat	{ top: 4rem;	 left: 18rem;	}
#peoples_tree  .person#maman			 	{ top: 18rem;	 left: 40rem;	}
#peoples_tree  .person#oncle-mat			{ top: 18rem;	 left: 64rem;	}
#peoples_tree  .person#oncle-pat			{ top: 17rem;	 left: 6rem;	}
#peoples_tree  .person#papa				{ top: 19rem;	 left: 31rem;	}
#peoples_tree  .person#grande_soeur		{ top: 35rem;	 left: 30rem;	}
#peoples_tree  .person#petite_soeur		{ top: 34rem;	 left: 22rem;	}
#peoples_tree  .person#tante-mat	 		{ top: 18rem;	 left: 55rem;	}
#peoples_tree  .person#tante-pat	 		{ top: 18rem;	 left: 15rem;	}