html, body { 
background-color: black; 
cursor:url(/img/CUrseurZgueg.png), auto;
margin-top: -20px;
}
a img {
border: none;
}
#fond {  
background-image:url(/img/fond/fondepisodes.jpg);
background-repeat:no-repeat;
background-position: center;
background-size: 100% 100%;
-webkit-background-size: 100% 100%;
-moz-background-size: 100% 100%;
-o-background-size: 100% 100%;
margin: auto;
width: 1520px;
height: 950px;
}
.accueil {
position: absolute;
float: left;
margin-top: 870px;
margin-left: 130px;
background-image:url(/img/liens/Home_OFF.png);
background-repeat:no-repeat;
background-size: 100% 100%;
-webkit-background-size: 100% 100%;
-moz-background-size: 100% 100%;
-o-background-size: 100% 100%;
width: 82px;
height: 30px;
}
.accueil:hover {
cursor:url(/img/CUrseurZgueg.png), auto;
background-image:url(/img/liens/Home_ON.png);
background-repeat:no-repeat;
}

.news {
position: absolute;
float: left;
margin-top: 870px;
margin-left: 360px;
background-image:url(/img/liens/News_OFF.png);
background-repeat:no-repeat;
  background-size: 100% 100%;
  -webkit-background-size: 100% 100%;
  -moz-background-size: 100% 100%;
  -o-background-size: 100% 100%;
width: 80px;
height: 30px;
}
.news:hover {
cursor:url(/img/CUrseurZgueg.png), auto;
background-image:url(/img/liens/News_ON.png);
background-repeat:no-repeat;
}

.episodes {
position: absolute;
float: left;
margin-top: 870px;
margin-left: 470px;
background-image:url(/img/liens/Episodes_ON.png);
background-repeat:no-repeat;
  background-size: 100% 100%;
  -webkit-background-size: 100% 100%;
  -moz-background-size: 100% 100%;
  -o-background-size: 100% 100%;
width: 121px;
height: 30px;
}

.boutique {
position: absolute;
float: left;
margin-top: 870px;
margin-left: 626px;
background-image:url(/img/liens/shop_OFF.png);
background-repeat:no-repeat;
  background-size: 100% 100%;
  -webkit-background-size: 100% 100%;
  -moz-background-size: 100% 100%;
  -o-background-size: 100% 100%;
width: 125px;
height: 30px;
}
.boutique:hover {
cursor:url(/img/CUrseurZgueg.png), auto;
background-image:url(/img/liens/shop_ON.png);
background-repeat:no-repeat;
}

.bonus {
position: absolute;
float: left;
margin-top: 870px;
margin-left: 786px;
background-image:url(/img/liens/Bonus_OFF.png);
background-repeat:no-repeat;
  background-size: 100% 100%;
  -webkit-background-size: 100% 100%;
  -moz-background-size: 100% 100%;
  -o-background-size: 100% 100%;
width: 89px;
height: 30px;
}
.bonus:hover {
cursor:url(/img/CUrseurZgueg.png), auto;
background-image:url(/img/liens/Bonus_ON.png);
background-repeat:no-repeat;
}

.contact {
position: absolute;
float: left;
margin-top: 870px;
margin-left: 909px;
background-image:url(/img/liens/Contact_OFF.png);
background-repeat:no-repeat;
  background-size: 100% 100%;
  -webkit-background-size: 100% 100%;
  -moz-background-size: 100% 100%;
  -o-background-size: 100% 100%;
width: 125px;
height: 30px;
}
.contact:hover {
cursor:url(/img/CUrseurZgueg.png), auto;
background-image:url(/img/liens/Contact_ON.png);
background-repeat:no-repeat;
}

.mmc {
position: absolute;
float: left;
margin-top: 857px;
margin-left: 1064px;
background-image:url(/img/liens/MMC_OFF.png);
background-repeat:no-repeat;
  background-size: 100% 100%;
  -webkit-background-size: 100% 100%;
  -moz-background-size: 100% 100%;
  -o-background-size: 100% 100%;
width: 65px;
height: 49px;
}
.mmc:hover {
cursor:url(/img/CUrseurZgueg.png), auto;
background-image:url(/img/liens/MMC_ON.png);
background-repeat:no-repeat;
}

.dmr {
position: absolute;
float: left;
margin-top: 857px;
margin-left: 1159px;
background-image:url(/img/liens/Ride_OFF.png);
background-repeat:no-repeat;
  background-size: 100% 100%;
  -webkit-background-size: 100% 100%;
  -moz-background-size: 100% 100%;
  -o-background-size: 100% 100%;
width: 90px;
height: 56px;
}
.dmr:hover {
cursor:url(/img/CUrseurZgueg.png), auto;
background-image:url(/img/liens/Ride_ON.png);
background-repeat:no-repeat;
width: 90px;
height: 54px;
}

.social {
position: absolute;
float: left;
margin-top: 864px;
margin-left: 1279px;
background-image:url(/img/liens/Reseaux_OFF.png);
background-repeat:no-repeat;
  background-size: 100% 100%;
  -webkit-background-size: 100% 100%;
  -moz-background-size: 100% 100%;
  -o-background-size: 100% 100%;
width: 122px;
height: 39px;
}
.social:hover {
cursor:url(/img/CUrseurZgueg.png), auto;
background-image:url(/img/liens/Reseaux_ON.png);
background-repeat:no-repeat;
}
.copyright {
position: absolute;
float: left;
margin-top: 920px;
margin-left: 1233px;
background-image:url(/img/liens/mentions_OFF.png);
background-repeat:no-repeat;
 background-size: 100% 100%;
  -webkit-background-size: 100% 100%;
  -moz-background-size: 100% 100%;
  -o-background-size: 100% 100%;
width: 170px;
height: 15px;
}
.copyright:hover {
cursor:url(/img/CUrseurZgueg.png), auto;
background-image:url(/img/liens/mentions_ON.png);
background-repeat:no-repeat;
}
#bonus1 {
position: absolute;
float: left;
margin-top: 214px;
margin-left: 1115px;
border: none;
background-repeat:no-repeat;
background-size: 100% 100%;
-webkit-background-size: 100% 100%;
-moz-background-size: 100% 100%;
-o-background-size: 100% 100%;
width: 106px;
height: 86px;
}
#bonus1:hover {
cursor:url(/img/CUrseurZgueg.png), auto;
background-image:url(/img/liens_ep/Vignette_BONUS1_ON.png);
background-repeat:no-repeat;
}
#bonus2 {
position: absolute;
float: left;
margin-top: 291px;
margin-left: 1124px;
border: none;
background-repeat:no-repeat;
background-size: 100% 100%;
-webkit-background-size: 100% 100%;
-moz-background-size: 100% 100%;
-o-background-size: 100% 100%;
width: 108px;
height: 84px;
}
#bonus2:hover {
cursor:url(/img/CUrseurZgueg.png), auto;
background-image:url(/img/liens_ep/Vignette_BONUS2_ON.png);
background-repeat:no-repeat;
}
#bonus3 {
position: absolute;
float: left;
margin-top: 367px;
margin-left: 1131px;
border: none;
background-repeat:no-repeat;
background-size: 100% 100%;
-webkit-background-size: 100% 100%;
-moz-background-size: 100% 100%;
-o-background-size: 100% 100%;
width: 100px;
height: 81px;
}
#bonus3:hover {
cursor:url(/img/CUrseurZgueg.png), auto;
background-image:url(/img/liens_ep/Vignette_BONUS3_ON.png);
background-repeat:no-repeat;
}
#bonus4 {
position: absolute;
float: left;
margin-top: 440px;
margin-left: 1138px;
border: none;
background-repeat:no-repeat;
background-size: 100% 100%;
-webkit-background-size: 100% 100%;
-moz-background-size: 100% 100%;
-o-background-size: 100% 100%;
width: 106px;
height: 81px;
}
#bonus4:hover {
cursor:url(/img/CUrseurZgueg.png), auto;
background-image:url(/img/liens_ep/Vignette_BONUS4_ON.png);
background-repeat:no-repeat;
}
#bonus5 {
position: absolute;
float: left;
margin-top: 517px;
margin-left: 1143px;
border: none;
background-repeat:no-repeat;
background-size: 100% 100%;
-webkit-background-size: 100% 100%;
-moz-background-size: 100% 100%;
-o-background-size: 100% 100%;
width: 102px;
height: 80px;
}
#bonus5:hover {
cursor:url(/img/CUrseurZgueg.png), auto;
background-image:url(/img/liens_ep/Vignette_BONUS5_ON.png);
background-repeat:no-repeat;
}


.ep1 {
position: absolute;
float: left;
margin-top: 607px;
margin-left: 614px;
background-image:url(/img/liens_ep/Menu2_Ep1_OFF.png);
background-repeat:no-repeat;
background-size: 100% 100%;
-webkit-background-size: 100% 100%;
-moz-background-size: 100% 100%;
-o-background-size: 100% 100%;
width: 313px;
height: 40px;
}
.ep1:hover {
cursor:url(/img/CUrseurZgueg.png), auto;
background-image:url(/img/liens_ep/Menu2_Ep1_ON.png);
background-repeat:no-repeat;
}
.ep1_objet:hover .ep1_plac_objet {
	position: absolute;
	float: left;
	margin-top: 227px;
	margin-left: 293px;
	background-image:url(/img/liens_ep/Vignette_EP1_ON.png);
	background-repeat:no-repeat;
	background-size: 100% 100%;
	-webkit-background-size: 100% 100%;
	-moz-background-size: 100% 100%;
	-o-background-size: 100% 100%;
	width:98px;
	height:81px;
}

.ep1_tof {
position: absolute;
float: left;
margin-top: 227px;
margin-left: 293px;
border: none;
background-size: 100% 100%;
-webkit-background-size: 100% 100%;
-moz-background-size: 100% 100%;
-o-background-size: 100% 100%;
width:98px;
height:81px;
}
.ep1_tof:hover {
cursor:url(/img/CUrseurZgueg.png), auto;
background-image:url(/img/liens_ep/Vignette_EP1_ON.png);
background-repeat:no-repeat;
}
.ep1_tof_objet:hover .ep1_tof_plac_objet {
	position: absolute;
	float: left;
	margin-top: 607px;
	margin-left: 614px;
	background-image:url(/img/liens_ep/Menu2_Ep1_ON.png);
	background-repeat:no-repeat;
	background-size: 100% 100%;
	-webkit-background-size: 100% 100%;
	-moz-background-size: 100% 100%;
	-o-background-size: 100% 100%;
	width: 313px;
	height: 40px;
}

.ep2 {
position: absolute;
float: left;
margin-top: 671px;
margin-left: 693px;
background-image:url(/img/liens_ep/Menu2_Ep2_OFF.png);
background-repeat:no-repeat;
background-size: 100% 100%;
-webkit-background-size: 100% 100%;
-moz-background-size: 100% 100%;
-o-background-size: 100% 100%;
width: 154px;
height: 40px;
}
.ep2:hover {
cursor:url(/img/CUrseurZgueg.png), auto;
background-image:url(/img/liens_ep/Menu2_Ep2_ON.png);
background-repeat:no-repeat;
}
.ep2_objet:hover .ep2_plac_objet {
	position: absolute;
	float: left;
	margin-top: 303px;
	margin-left: 281px;
	background-image:url(/img/liens_ep/Vignette_EP2_ON.png);
	background-repeat:no-repeat;
	background-size: 100% 100%;
	-webkit-background-size: 100% 100%;
	-moz-background-size: 100% 100%;
	-o-background-size: 100% 100%;
	width:110px;
	height:83px;
}

.ep2_tof {
position: absolute;
float: left;
margin-top: 303px;
margin-left: 281px;
border: none;
background-size: 100% 100%;
-webkit-background-size: 100% 100%;
-moz-background-size: 100% 100%;
-o-background-size: 100% 100%;
width:110px;
height:83px;
}
.ep2_tof:hover {
cursor:url(/img/CUrseurZgueg.png), auto;
background-image:url(/img/liens_ep/Vignette_EP2_ON.png);
background-repeat:no-repeat;
}
.ep2_tof_objet:hover .ep2_tof_plac_objet {
	position: absolute;
	float: left;
	margin-top: 671px;
	margin-left: 693px;
	background-image:url(/img/liens_ep/Menu2_Ep2_ON.png);
	background-repeat:no-repeat;
	background-size: 100% 100%;
	-webkit-background-size: 100% 100%;
	-moz-background-size: 100% 100%;
	-o-background-size: 100% 100%;
	width: 154px;
	height: 40px;
}


.ep3 {
position: absolute;
float: left;
margin-top: 735px;
margin-left: 703px;
background-image:url(/img/liens_ep/Menu2_Ep3_OFF.png);
background-repeat:no-repeat;
background-size: 100% 100%;
-webkit-background-size: 100% 100%;
-moz-background-size: 100% 100%;
-o-background-size: 100% 100%;
width: 135px;
height: 40px;
}
.ep3:hover {
cursor:url(/img/CUrseurZgueg.png), auto;
background-image:url(/img/liens_ep/Menu2_Ep3_ON.png);
background-repeat:no-repeat;
}
.ep3_objet:hover .ep3_plac_objet {
	position: absolute;
	float: left;
	margin-top: 378px;
	margin-left: 274px;
	background-image:url(/img/liens_ep/Vignette_EP3_ON.png);
	background-repeat:no-repeat;
	background-size: 100% 100%;
	-webkit-background-size: 100% 100%;
	-moz-background-size: 100% 100%;
	-o-background-size: 100% 100%;
	width:107px;
	height:81px;
}

.ep3_tof {
position: absolute;
float: left;
margin-top: 378px;
margin-left: 274px;
border: none;
background-size: 100% 100%;
-webkit-background-size: 100% 100%;
-moz-background-size: 100% 100%;
-o-background-size: 100% 100%;
width:107px;
height:81px;
}
.ep3_tof:hover {
cursor:url(/img/CUrseurZgueg.png), auto;
background-image:url(/img/liens_ep/Vignette_EP3_ON.png);
background-repeat:no-repeat;
}
.ep3_tof_objet:hover .ep3_tof_plac_objet {
	position: absolute;
	float: left;
	margin-top: 735px;
	margin-left: 703px;
	background-image:url(/img/liens_ep/Menu2_Ep3_ON.png);
	background-repeat:no-repeat;
	background-size: 100% 100%;
	-webkit-background-size: 100% 100%;
	-moz-background-size: 100% 100%;
	-o-background-size: 100% 100%;
	width: 135px;
	height: 40px;
}

.ep4 {
position: absolute;
float: left;
margin-top: 800px;
margin-left: 701px;
background-image:url(/img/liens_ep/Menu2_Ep4_OFF.png);
background-repeat:no-repeat;
background-size: 100% 100%;
-webkit-background-size: 100% 100%;
-moz-background-size: 100% 100%;
-o-background-size: 100% 100%;
width: 141px;
height: 40px;
}
.ep4:hover {
cursor:url(/img/CUrseurZgueg.png), auto;
background-image:url(/img/liens_ep/Menu2_Ep4_ON.png);
background-repeat:no-repeat;
}
.ep4_objet:hover .ep4_plac_objet {
	position: absolute;
	float: left;
	margin-top: 449px;
	margin-left: 267px;
	background-image:url(/img/liens_ep/Vignette_EP4_ON.png);
	background-repeat:no-repeat;
	background-size: 100% 100%;
	-webkit-background-size: 100% 100%;
	-moz-background-size: 100% 100%;
	-o-background-size: 100% 100%;
	width:109px;
	height:89px;
}

.ep4_tof {
position: absolute;
float: left;
margin-top: 449px;
margin-left: 267px;
border: none;
background-size: 100% 100%;
-webkit-background-size: 100% 100%;
-moz-background-size: 100% 100%;
-o-background-size: 100% 100%;
width:109px;
height:89px;
}
.ep4_tof:hover {
cursor:url(/img/CUrseurZgueg.png), auto;
background-image:url(/img/liens_ep/Vignette_EP4_ON.png);
background-repeat:no-repeat;
}
.ep4_tof_objet:hover .ep4_tof_plac_objet {
	position: absolute;
	float: left;
	margin-top: 800px;
	margin-left: 701px;
	background-image:url(/img/liens_ep/Menu2_Ep4_ON.png);
	background-repeat:no-repeat;
	background-size: 100% 100%;
	-webkit-background-size: 100% 100%;
	-moz-background-size: 100% 100%;
	-o-background-size: 100% 100%;
	width: 141px;
	height: 40px;
}
#plac_bonus1, #plac_bonus2, #plac_bonus3, #plac_bonus4, #plac_bonus5 {
position: absolute;
float: left;
margin-top: 207px;
margin-left: 549px;
width: 444px;
height: 256px;
}
#plac_bonus1, #plac_bonus2, #plac_bonus3, #plac_bonus4, #plac_bonus5 {
  display:none;
  }
#plac_bonus1:target, #plac_bonus2:target, #plac_bonus3:target, #plac_bonus4:target, #plac_bonus5:target {
  display:block;
}


#plac_video1, #plac_video2, #plac_video3, #plac_video4 {
position: absolute;
float: left;
margin-top: 207px;
margin-left: 549px;
width: 444px;
height: 256px;
}
#plac_video1, #plac_video2, #plac_video3, #plac_video4 {
  display:none;
  }
#plac_video1:target, #plac_video2:target, #plac_video3:target, #plac_video4:target {
  display:block;
}

#plac_video1_tof, #plac_video2_tof, #plac_video3_tof, #plac_video4_tof {
position: absolute;
float: left;
margin-top: 207px;
margin-left: 549px;
width: 444px;
height: 256px;
}
#plac_video1_tof, #plac_video2_tof, #plac_video3_tof, #plac_video4_tof {
  display:none;
  }
#plac_video1_tof:target, #plac_video2_tof:target, #plac_video3_tof:target, #plac_video4_tof:target {
  display:block;
}
#menu
{      
	height: auto;      
	list-style-type: none;  
	margin: 0 auto;    
	padding: 0;      
	border: 0;    
    /* pour placer mon menu dans son élément prenant en compte la hauteur du sous menu */ 
	position:relative;	/* important pour bien placer le menu par rapport aux 250px indiqué avant */
	}
#menu > li
{
	float: left;
	margin: 0 5px;  /* une marge de 0 pour le haut est importante pour ne pas avoir d'espace entre le menu et le sous menu sinon vous rencontreriez des soucis */
	padding: 0;
	border: 0;
}
#menu li a{
	cursor:url(/img/CUrseurZgueg.png), auto;	
	display: block;         
	color: #FFFFFF;         
	margin: 0;
	padding: 4px 8px;
	border:none;
	width: 97px;
	height: 25px;
	margin-left: -4px;
	text-decoration: none;
}
#menu .menuderoulant
{
	display: none;
	list-style-type: none;
	margin: 0;   
	padding: 0;
	border: 0;
	bottom:0;
	position:absolute; /* c'est ici que j'inverse mon menu pour le faire partir vers le haut */

}
#menu .menuderoulant li
{
	float: none;
	margin: 0;
	padding: 0;
	border: 0;
	width: 140px;
    border-top: 1px solid transparent;
	border-right: 1px solid transparent;
}
#menu .menuderoulant li a
{
	display: block;
	margin: 0;
	border: 0;       
    margin-bottom: 10px;	
	background: white;
	border-radius: 4px;
}
#menu .menuderoulant li a:hover
{
cursor:url(/img/CUrseurZgueg.png), auto;	
color: #777777;
background: none;
text-decoration: none;
}
#menu li:hover > .menuderoulant { display: block;}

#facebook {
background-image:url(/img/liens/Facebook_OFF.png);
background-repeat:no-repeat;
background-size: 100% 100%;
-webkit-background-size: 100% 100%;
-moz-background-size: 100% 100%;
-o-background-size: 100% 100%;
width: 100px;
height: 22px;
}
#twitter {
background-image:url(/img/liens/twitter_OFF.png);
background-repeat:no-repeat;
background-size: 100% 100%;
-webkit-background-size: 100% 100%;
-moz-background-size: 100% 100%;
-o-background-size: 100% 100%;
width: 95px;
height: 21px;
}
#youtube {
background-image:url(/img/liens/YouTube_OFF.png);
background-repeat:no-repeat;
background-size: 100% 100%;
-webkit-background-size: 100% 100%;
-moz-background-size: 100% 100%;
-o-background-size: 100% 100%;
width: 70px;
height: 28px;
}
#tooltip{
    background: none repeat scroll 0 0 black;
    border: none;
    color: whitesmoke;
    display: none;
    padding: 2px 2px;
    position: absolute;
    overflow: auto;
    box-shadow: 0px 0px 10px 10px black;
    opacity: 0.7;
    font-family: 'Trebuchet MS';
    font-size: 15px;
    margin-top: -35px;
    border-radius: 2px;
	margin-top: -45px;
	margin-left: -93px;
}