/*#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: 1.5rem;
}
#main-container #step-home img {
	width:auto;
	height: 7rem;
}
#main-container #step-previous {
	position: absolute;
	bottom: 5.5rem;
	left: 1.4rem;
}
#main-container #step-previous img {
	width:auto;
	height: 5.5rem;
}
#main-container #step-next {
	position: absolute;
	bottom:-2rem;
	right: 1.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.5rem;
	left: 29.4rem;
	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: 26.5rem;
	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: 10rem;
}

#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:7rem;
	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: 12rem;
}


.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#cousin-pat		{ top: 34rem;	left: 12rem;	}
/*#peoples_tree  .person#cousine-mat	{ top: 36rem;	left: 22rem;	}*/
#peoples_tree  .person#cousine-pat		{ top: 34rem;	left: 3rem;	}
#peoples_tree  .person#frere			 	{ top: 36rem;	left: 25rem;	}
#peoples_tree  .person#grand_pere-pat	{ top: 6rem;	left: 13rem;	}
#peoples_tree  .person#grand_mere-mat	{ top: 6rem;	left: 40rem;	}
#peoples_tree  .person#grand_mere-pat	{ top: 6rem;	left: 22rem;	}
#peoples_tree  .person#grand_pere-mat	{ top: 6rem;	left: 49rem;	}
#peoples_tree  .person#maman			 	{ top: 21rem;	left: 35rem;	}
#peoples_tree  .person#oncle-pat			{ top: 19rem;	left: 14rem;	}
#peoples_tree  .person#papa				{ top: 21rem;	left: 26rem;	}
#peoples_tree  .person#soeur			 	{ top: 36rem;	left: 34rem;	}
#peoples_tree  .person#tante-pat	 		{ top: 19rem;	left: 5rem;		}
#peoples_tree  .person#oncle-mat	 		{ top: 20rem;	left: 52rem;	}