html, body { 
background-color: black; 
cursor:url(/img/CUrseurZgueg.png), auto;
margin-top: -15px;
} 
a img {
border: none;
}
#fond {  
background-image:url(/img/fond/fondaccueil.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: 1168px;
height: 730px;
}

  #but {
  z-index: 1;
  position: absolute;
  margin-left: 905px;
  margin-top: 328px;
  border: none;
  width: 20px;
  height: 20px;
  }
  #monImage {
  display: none;
  position: absolute;
  background: url('/img/fond/fondaccueilnuit.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-top: -15px;
  width: 1168px;
  height: 730px;
  margin: auto; 
  }
  
.accueil {
position: absolute;
float: left;
margin-top: 670px;
margin-left: 100px;
background-image:url(/img/liens/Home_ON.png);
background-repeat:no-repeat;
width: 60px;
height: 22px;
}

.news {
position: absolute;
float: left;
margin-top: 670px;
margin-left: 280px;
background-image:url(/img/liens/News_OFF.png);
background-repeat:no-repeat;
width: 59px;
height: 22px;
}
.news:hover {
cursor:url(/img/CUrseurZgueg.png), auto;
background-image:url(/img/liens/News_ON.png);
background-repeat:no-repeat;
}
.news_objet:hover .news_plac_objet
{
	position: absolute;
	float: left;
	margin-top: 140px;
	margin-left: 653px;
	background-image:url(/img/PS1_Halo.png);
	background-repeat:no-repeat;
	background-size: 125px 97px;
	width:125px;
	height:97px;
}
.news_tof {
position: absolute;
float: left;
margin-top: 140px;
margin-left: 653px;
border: none;
background-repeat:no-repeat;
background-size: 125px 97px;
width:125px;
height:97px;
}
.news_tof:hover {
cursor:url(/img/CUrseurZgueg.png), auto;
background-image:url(/img/PS1_Halo.png);
background-repeat:no-repeat;
}
.news_tof_objet:hover .news_tof_plac_objet
{
	position: absolute;
	float: left;
	margin-top: 670px;
	margin-left: 280px;
	background-image:url(/img/liens/News_ON.png);
	background-repeat:no-repeat;
	width: 59px;
	height: 22px;
}

.episodes {
position: absolute;
float: left;
margin-top: 670px;
margin-left: 365px;
background-image:url(/img/liens/Episodes_OFF.png);
background-repeat:no-repeat;
width: 89px;
height: 22px;
}
.episodes:hover {
cursor:url(/img/CUrseurZgueg.png), auto;
background-image:url(/img/liens/Episodes_ON.png);
background-repeat:no-repeat;
}
.episodes_objet:hover .episodes_plac_objet
{
	position: absolute;
	float: left;
	margin-top: 195px;
	margin-left: 338px;
	background-image:url(/img/N64_Halo.png);
	background-repeat:no-repeat;
	background-size: 115px 98px;
	width:115px;
	height:98px;
}
.episodes_tof {
position: absolute;
float: left;
margin-top: 195px;
margin-left: 338px;
border: none;
background-repeat:no-repeat;
background-size: 115px 98px;
width:115px;
height:98px;
}
.episodes_tof:hover {
cursor:url(/img/CUrseurZgueg.png), auto;
background-image:url(/img/N64_Halo.png);
background-repeat:no-repeat;
}
.episodes_tof_objet:hover .episodes_tof_plac_objet
{
	position: absolute;
	float: left;
	margin-top: 670px;
	margin-left: 365px;
	background-image:url(/img/liens/Episodes_ON.png);
	background-repeat:no-repeat;
	width: 89px;
	height: 22px;
}

.boutique {
position: absolute;
float: left;
margin-top: 670px;
margin-left: 480px;
background-image:url(/img/liens/shop_OFF.png);
background-repeat:no-repeat;
width: 92px;
height: 22px;
}
.boutique:hover {
cursor:url(/img/CUrseurZgueg.png), auto;
background-image:url(/img/liens/shop_ON.png);
background-repeat:no-repeat;
}
.boutique_objet:hover .boutique_plac_objet
{
	position: absolute;
	float: left;
	margin-top: 424px;
	margin-left: 378px;
	background-image:url(/img/MDrive_Halo.png);
	background-repeat:no-repeat;
	background-size: 132px 103px;
	width:132px;
	height:103px;
}
.boutique_tof {
position: absolute;
float: left;
margin-top: 424px;
margin-left: 378px;
border: none;
background-repeat:no-repeat;
background-size: 132px 103px;
width:132px;
height:103px;
}
.boutique_tof:hover {
cursor:url(/img/CUrseurZgueg.png), auto;
background-image:url(/img/MDrive_Halo.png);
background-repeat:no-repeat;
}
.boutique_tof_objet:hover .boutique_tof_plac_objet
{
	position: absolute;
	float: left;
	margin-top: 670px;
	margin-left: 480px;
	background-image:url(/img/liens/shop_ON.png);
	background-repeat:no-repeat;
	width: 92px;
	height: 22px;
}

.bonus {
position: absolute;
float: left;
margin-top: 670px;
margin-left: 600px;
background-image:url(/img/liens/Bonus_OFF.png);
background-repeat:no-repeat;
width: 65px;
height: 22px;
}
.bonus:hover {
cursor:url(/img/CUrseurZgueg.png), auto;
background-image:url(/img/liens/Bonus_ON.png);
background-repeat:no-repeat;
}
.bonus_objet:hover .bonus_plac_objet
{
	position: absolute;
	float: left;
	margin-top: 439px;
	margin-left: 673px;
	background-image:url(/img/DCast_Halo.png);
	background-repeat:no-repeat;
	background-size: 115px 105px;
	width:115px;
	height:105px;
}
.bonus_tof {
position: absolute;
float: left;
margin-top: 439px;
margin-left: 673px;
border: none;
background-repeat:no-repeat;
background-size: 115px 105px;
width:115px;
height:105px;
}
.bonus_tof:hover {
cursor:url(/img/CUrseurZgueg.png), auto;
background-image:url(/img/DCast_Halo.png);
background-repeat:no-repeat;
}
.bonus_tof_objet:hover .bonus_tof_plac_objet
{
	position: absolute;
	float: left;
	margin-top: 670px;
	margin-left: 600px;
	background-image:url(/img/liens/Bonus_ON.png);
	background-repeat:no-repeat;
	width: 65px;
	height: 22px;
}

.contact {
position: absolute;
float: left;
margin-top: 670px;
margin-left: 690px;
background-image:url(/img/liens/Contact_OFF.png);
background-repeat:no-repeat;
width: 92px;
height: 22px;
}
.contact:hover {
cursor:url(/img/CUrseurZgueg.png), auto;
background-image:url(/img/liens/Contact_ON.png);
background-repeat:no-repeat;
}
.contact_objet:hover .contact_plac_objet
{
	position: absolute;
	float: left;
	margin-top: 158px;
	margin-left: 778px;
	background-image:url(/img/Objet_KenRyu_ON.png);
	background-repeat:no-repeat;
	background-size: 100px 121px;
	width:100px;
	height:121px;
}
.contact_tof {
position: absolute;
float: left;
margin-top: 158px;
margin-left: 778px;
border: none;
background-repeat:no-repeat;
background-size: 100px 121px;
width: 100px;
height: 121px;
}
.contact_tof:hover {
cursor:url(/img/CUrseurZgueg.png), auto;
background-image:url(/img/Objet_KenRyu_ON.png);
background-repeat:no-repeat;
}
.contact_tof_objet:hover .contact_tof_plac_objet
{
	position: absolute;
	float: left;
	margin-top: 670px;
	margin-left: 690px;
	background-image:url(/img/liens/Contact_ON.png);
	background-repeat:no-repeat;
	width: 92px;
	height: 22px;
}

.mmc {
position: absolute;
float: left;
margin-top: 657px;
margin-left: 810px;
background-image:url(/img/liens/MMC_OFF.png);
background-repeat:no-repeat;
width: 54px;
height: 41px;
}
.mmc:hover {
cursor:url(/img/CUrseurZgueg.png), auto;
background-image:url(/img/liens/MMC_ON.png);
background-repeat:no-repeat;
}
.mmc_objet:hover .mmc_plac_objet
{
	position: absolute;
	float: left;
	margin-top: 100px;
	margin-left: 286px;
	background-image:url(/img/Objet_MMC_ON.png);
	background-repeat:no-repeat;
	background-size: 115px 63px;
	width:115px;
	height:63px;
}
.mmc_tof {
position: absolute;
float: left;
margin-top: 100px;
margin-left: 286px;
border: none;
background-repeat:no-repeat;
background-size: 115px 63px;
width:115px;
height:63px;
}
.mmc_tof:hover {
cursor:url(/img/CUrseurZgueg.png), auto;
background-image:url(/img/Objet_MMC_ON.png);
background-repeat:no-repeat;
}
.mmc_tof_objet:hover .mmc_tof_plac_objet
{
	position: absolute;
	float: left;
	margin-top: 657px;
	margin-left: 810px;
	background-image:url(/img/liens/MMC_ON.png);
	background-repeat:no-repeat;
	width: 54px;
	height: 41px;
}

.dmr {
position: absolute;
float: left;
margin-top: 657px;
margin-left: 890px;
background-image:url(/img/liens/Ride_OFF.png);
background-repeat:no-repeat;
width: 74px;
height: 46px;
}
.dmr:hover {
cursor:url(/img/CUrseurZgueg.png), auto;
background-image:url(/img/liens/Ride_ON.png);
background-repeat:no-repeat;
}
.dmr_objet:hover .dmr_plac_objet
{
	position: absolute;
	float: left;
	margin-top: 308px;
	margin-left: 206px;
	background-image:url(/img/Objet_RIDE_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: 93px;
	height: 78px;
}
.dmr_tof {
position: absolute;
float: left;
margin-top: 308px;
margin-left: 206px;
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: 93px;
height: 78px;
}
.dmr_tof:hover {
cursor:url(/img/CUrseurZgueg.png), auto;
background-image:url(/img/Objet_RIDE_ON.png);
background-repeat:no-repeat;
}
.dmr_tof_objet:hover .dmr_tof_plac_objet
{
	position: absolute;
	float: left;
	margin-top: 657px;
	margin-left: 890px;
	background-image:url(/img/liens/Ride_ON.png);
	background-repeat:no-repeat;
	width: 74px;
	height: 46px;
}

.social {
position: absolute;
float: left;
margin-top: 664px;
margin-left: 990px;
background-image:url(/img/liens/Reseaux_OFF.png);
background-repeat:no-repeat;
width: 91px;
height: 29px;
}
.social:hover {
cursor:url(/img/CUrseurZgueg.png), auto;
background-image:url(/img/liens/Reseaux_ON.png);
background-repeat:no-repeat;
}
.social_objet:hover .social_plac_objet
{
	position: absolute;
	float: left;
	margin-top: 596px;
	margin-left: 867px;
	background-image:url(/img/Objet_WEED_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: 49px;
	height: 52px;
}
.social_tof {
position: absolute;
float: left;
margin-top: 596px;
margin-left: 867px;
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: 49px;
height: 52px;
}
.social_tof:hover {
cursor:url(/img/CUrseurZgueg.png), auto;
background-image:url(/img/Objet_WEED_ON.png);
background-repeat:no-repeat;
}
.social_tof_objet:hover .social_tof_plac_objet
{
	position: absolute;
	float: left;
	margin-top: 664px;
	margin-left: 990px;
	background-image:url(/img/liens/Reseaux_ON.png);
	background-repeat:no-repeat;
	width: 91px;
	height: 29px;
}
.copyright {
position: absolute;
float: left;
margin-top: 704px;
margin-left: 959px;
background-image:url(/img/liens/mentions_OFF.png);
background-repeat:no-repeat;
width: 123px;
height: 11px;
}
.copyright:hover {
cursor:url(/img/CUrseurZgueg.png), auto;
background-image:url(/img/liens/mentions_ON.png);
background-repeat:no-repeat;
}
#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: 66px;
	height: 20px;
	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: 72px;
height: 16px;
}
#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: 64px;
height: 14px;
}
#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: 52px;
height: 21px;
}