
body {
	font-family:Arial, Helvetica, sans-serif;
	background-color:#000;
	cursor:crosshair;
	font-size:100%;
	overflow:hidden;
}

a {
	color:#666;
	font-size:80%;
	text-decoration:none;
	
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}

a:hover {
	color:#fff;
	text-decoration:none;
	text-shadow:0 0 0.4em black;
	/*cursor:alias;*/
}
#chargement {
	position:relative;
		font-size: 3em;
		text-align: center;
		position: absolute;
		text-transform:uppercase;
		text-align:center;
		width: 60%;
		margin:25% 20% 20% 20%;
		color:#FFF;
		 font-weight:bold;
	}
	#chargement-infos {
		font-size:0.4em;
		text-align:right;
		white-space: nowrap;
		display: block;
		border-bottom:1px solid #CCC;
		width: 0%;
	}
	
#cm{
		 position:absolute;
		 width: 600px;
		 font-size: 0.9em;
		 color:red;
		 top:25px;
		 font-weight:100;
	}
	

#page-wrap-index800 {
	position:relative;
	width:80%;
	max-width:800px;
	height:80%;
	margin:1% auto;
	background-position:center;
	background-size:contain;
	text-align:center;
	z-index: 999;

}


.overover{
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
	opacity:0.8;
}
.overover:hover{
	opacity:1;
	-webkit-transform: scale(1.2);
	-moz-transform: scale(1.2);
	-ms-transform: scale(1.2);
	transform: scale(1.2);
	
}

/*page menu*/
#FondmenuTitre {
	position:absolute;
	width:80%;
	height:20%;
	left:10%;
	right:10%;
	bottom:4%;
	background-position:center;
	background-size:contain;
	z-index:800;
}

#deuxChats {
		position:absolute;
		width:15%;
		height:20%;
		background:transparent;
		bottom:-4%;
		left:87%;
		text-align:right;
		background-position:center;
		background-size:contain;
		z-index:900;
		border-radius: 50%;
	}
	
#chatPop {
		position:absolute;
		width:15%;
		height:20%;
		background:transparent;
		bottom:4%;
		left:-2px;
		background-position:center;
		background-size:contain;
		z-index:900;
		border-radius: 50%;
		
}

#chouette {
		position:absolute;
		width:25%;
		height:20%;
		background:transparent;
		top:9%;
		left:48%;
		background-position:center;
		background-size:contain;
		z-index:1000;	
		border-radius: 50%;
	}

#immemory {
		position:absolute;
		width:40%;
		height:40%;
		background:transparent;
		top:33%;
		left:41%;
		background-position:center;
		background-size:contain;
		z-index:700;
		border-radius: 50%;
		
	}
#ouvroir {
		position:absolute;
		width:25%;
		height:20%;
		background:transparent;
		top:20%;
		left:23%;
		background-position:center;
		background-size:contain;
		z-index:900;
		border-radius: 50%;
	}
	
#stopOver {
		position:absolute;
		width:20%;
		height:20%;
		background:transparent;
		top:50%;
		left:24%;
		background-position:center;
		background-size:contain;
		z-index:800;
		border-radius: 50%;
	}




#memo24 {
		position:absolute;
		width:20%;
		height:20%;
		background:transparent;
		top:16%;
		left:-5%;
		background-position:center;
		background-size:contain;
		z-index:200;	
		border-radius: 50%;
		 }
		 
#jetee {
		position:absolute;
		width:15%;
		height:15%;
		background:transparent;
		top:23%;
		right:0;
		background-position:center;
		background-size:contain;
		z-index:200;	
		border-radius: 50%;
		 }
#jetee span{
	position:absolute;
	display:none;
	font-size:1em;
	font-weight:bold;
	left:10%;
	bottom:2%;
}
#jetee:hover span{
	display:block;
}		 
		 
#immemory span{
	position:absolute;
	display:none;
	font-size:1em;
	font-weight:bold;
	left:10%;
	bottom:2%;
}
#immemory:hover span{
	display:block;
}

#stopOver span{
	position:absolute;
	display:none;
	font-size:1em;
	font-weight:bold;
	left:0px;
	bottom:0px;
}
#stopOver:hover span{
	display:block;
}

#chouette span{
	position:absolute;
	display:none;
	font-weight:bold;
	font-size:1em;
	left:0px;
	bottom:0px;
}

#chouette:hover span{
	display:block;
}

#memo24 span{
	position:absolute;
	display:none;
	font-weight:bold;
	font-size:1em;
	right:0px;
	top:0px;
}

#memo24:hover span{
	display:block;
}
#ouvroir span{
	position:absolute;
	display:none;
	font-size:1em;
	font-weight:bold;
	left:30px;
	bottom:40px;
	z-index:9999;
}	
#ouvroir:hover span{
	display:block;
	
}

#deuxChats span{
	position:absolute;
	font-size:1em;
	font-weight:bold;
	display:none;
	left:0px;
	top:-30px;
}
#deuxChats:hover span{display:block;}
#chatPop span{position:absolute;font-size:1em;font-weight:bold;display:none;right:0px;top:0px;}
#chatPop:hover span{
	display:block;}


#infoCM{
	position:absolute;margin-top:5%;width:100%;text-align:center;z-index:9999;}
#infos{position:absolute;bottom:0;width:100%;text-align:center;z-index:9999;
}

#infos a{
	font-family:Arial, Helvetica, sans-serif;
	font-size:0.6em;
	font-weight:200;
	margin-left:4%;
	font-style:normal;
	color:#FFFFFF;
	text-shadow:none;
	
}
#infos a:hover{
	color:#C00;
}

/*page immemory*/
#memory{ background:#000; background-size:contain; width:100%; height:90%; max-width:600px; margin:5% auto;  position:relative; text-transform:uppercase;}

/*page immemory*/
#aide{width:70%; max-width:730px; max-height:580px; margin:2%; color:#ffffff;background-color: rgba(0, 0, 0, 0.5);}

@media screen and (max-width: 940px) {

}

@media screen and (max-width: 500px) {
#page-wrap-index800 {
	position:relative;
	width:96%;
	max-width:800px;
	height:100%;
	margin:30% auto;
	background-attachment:fixed;
	background-position:center;
	background-size:cover;
	text-align:center;
	z-index: 999;
}
#fd { display:none;}
.video-container {
	font-size:1em;
	max-height:400px;
}
.video-container h2{
	font-size:1em;
}
#aide{ width:100%; margin:-30% 0 2% 0;max-height:400px; color:#fff;background-color: rgba(0, 0, 0, 0.5); overflow:hidden;}

#katwoman {
	position:absolute;
	width:100%;
	height:100%;
	margin:0 auto;
}
#katwoman img
{
max-width:100%;
}
}
