a{
  text-decoration: none;
}

@font-face {
  font-family: 'DM Sans';
  src: url('path/to/your/font.woff2') format('woff2'),
       url('path/to/your/font.woff') format('woff');
}

p{
  font-family: 'DM Sans', sans-serif;
  font-weight: bold ;
  font-size: 50px;
  color: aliceblue;
  -webkit-text-stroke: 2px; 
  -webkit-text-stroke-color: black;
}

.all{ 
  width: 0px;
}

.Retour p{
  margin-left: 20px;
  margin-top: -20px;
  opacity: 0;
  transition: opacity 1s; 
}

.Retour a:hover p{
  opacity: 1;
}

/*-------------------------*/
/*------- Index.html ------*/
/*-------------------------*/

body#index{
  background-image: url('Images/Entree.jpg');
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
}

.PortePrinc p{
  position: relative;
  top: -300px;
  left: -50px;
  opacity: 0;
  transition: opacity 1s;
}

.PortePrinc a:hover p{
  opacity: 1;
}

.PortePrinc a{
  position: relative;
  top: 750px;
  left: 1000px;
}

.PortePrinc img{
  transform: rotateX(60deg) rotateZ(70deg) rotateY(-13deg);
}


/*-------------------------*/
/*------- Index.html ------*/
/*-------------------------*/

/*-------------------------*/
/*------- Ext_2.html ------*/
/*-------------------------*/

body#Ext_2{
  background-image: url('Images/Ext_2.jpg');
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
}

.Table_Pong p{
  margin-left: 0px;
  margin-top: -200px;
  opacity: 0;
  transition: opacity 1s; 
}

.Table_Pong a:hover p{
  opacity: 1;
}

.Table_Pong a{
  position: relative;
  top: 370px;
  left: 120px ;
}

.Table_Pong img{
  transform: rotateX(60deg) rotateZ(90deg) rotateY(-10deg);
}

.Ext_3 p{
  margin-left: 20px;
  margin-top: -200px;
  opacity: 0;
  transition: opacity 1s; 
}

.Ext_3 a:hover p{
  opacity: 1;
}

.Ext_3 a{
  position: relative;
  top: 300px;
  left: 1120px ;
}

.Ext_3 img{
  transform: rotateX(60deg) rotateZ(110deg) rotateY(-15deg);
}

/*-------------------------*/
/*------- Ext_2.html ------*/
/*-------------------------*/


/*-------------------------*/
/*------- Table_Pong.html ------*/
/*-------------------------*/

body#Table_Pong{
  background-image: url('Images/Table_Pong.jpg');
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
}

#GamePong{
  width: 250px;
  height: 100px;
  background-color: plum;
  border: 2px solid white;
  border-radius: 10px; 
  display: flex;
  justify-content: center;
  align-items: center;
  color: white ; 
  font-family: Arial, sans-serif;
  position: relative;
  left: 800px;
  top: 200px;
} 

#GamePong p{
  color: aliceblue;
  opacity: 1;
}

/*-------------------------*/
/*------- Table_Pong.html ------*/
/*-------------------------*/


/*-------------------------*/
/*------- PortePrinc.html ------*/
/*-------------------------*/

body#PortePrinc{
  background-image: url('Images/PortePrinc.jpg');
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
}

.Hall a{
  position: relative;
  top: 620px;
  left: 890px;
}

.Hall img{
  transform: rotateX(60deg) rotateZ(50deg) rotateY(-5deg);
}

.Hall p{
  margin-left: -90px;
  margin-top: -440px;
  opacity: 0;
  transition: opacity 1s; 
}

.Hall a:hover p{
  opacity: 1;
}

/*-------------------------*/
/*------- PortePrinc.html ------*/
/*-------------------------*/


/*-------------------------*/
/*------- Hall.html ------*/
/*-------------------------*/

body#Hall{
  background-image: url('Images/Hall.jpg');
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
}

div.Droite p{
  margin-left: 1570px;
  margin-top: 240px;
  opacity: 0;
  transition: opacity 1s; 
}

div.Droite a:hover p{
  opacity: 1;
}

div.Droite img{
  position:relative;
  left: 1550px;
  top: 600px;
  transform: rotateX(70deg) rotateZ(140deg);
}

div.Gauche p{
  margin-left: -50px;
  margin-top: -390px;
  opacity: 0;
  transition: opacity 1s; 
}

div.Gauche a:hover p{
  opacity: 1;
}

.Gauche a{
  position: relative;
  left: 90px;
  top: 110px;
}

.Gauche img{
  transform: rotateX(70deg) rotateZ(30deg);
}

.Etage p{
  margin-left: 250px;
  margin-top: -400px;
  opacity: 0;
  transition: opacity 1s; 
}

.Etage a:hover p{
  opacity: 1;
}  

.Etage img{
  transform: rotateX(60deg) rotateZ(110deg) rotateY(-2deg);
}

.Etage a{
  position: relative;
  left: 190px;
  top: -50px;
}

/*-------------------------*/
/*------- Hall.html ------*/
/*-------------------------*/


/*-------------------------*/
/*------- Hall_R.html ------*/
/*-------------------------*/

body#Hall_R{
  background-image: url('Images/Hall_R.JPG');
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
}

div.Amphi p{
  margin-left: 1030px;
  margin-top: 200px;
  opacity: 0;
  transition: opacity 1s; 
}

.Amphi a:hover p{
  opacity: 1;
}

.Amphi img{
  position: relative;
  top: 530px;
  left: 1000px;
  transform: rotateX(55deg) rotateZ(115deg) rotateY(-20deg);
}

.Scene img{
  position: relative;
  top: 200px;
  left: 1100px;
  transform: rotateX(60deg) rotateZ(180deg) rotateY(-5deg);
}

div.Scene p{
  margin-left: 1410px;
  margin-top: -240px;
  opacity: 0;
  transition: opacity 1s; 
}

.Scene a:hover p{
  opacity: 1;
}

.Hall_F img{
  position: relative;
  top: 110px;
  left: 200px;
  transform: rotateX(65deg) rotateZ(30deg) rotateY(-7deg);
}

.Hall_F p{
  margin-left: 200px;
  margin-top: -300px;
  opacity: 0;
  transition: opacity 1s; 
}

.Hall_F a:hover p{
  opacity: 1;
}

/*-------------------------*/
/*------- Hall_R.html ------*/
/*-------------------------*/


/*-------------------------*/
/*------- Scene.html ------*/
/*-------------------------*/

body#Scene{
  background-image: url('Images/Scene.JPG');
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
}

#Jeux{
  width: 250px;
  height: 100px;
  background-color: plum;
  border: 2px solid white;
  border-radius: 10px; 
  display: flex;
  justify-content: center;
  align-items: center;
  color: white; 
  font-family: Arial, sans-serif;
  position: relative;
  left: 720px;
  top: 220px;
} 

/*-------------------------*/
/*------- Scene.html ------*/
/*-------------------------*/


/*-------------------------*/
/*------- Amphi.html ------*/
/*-------------------------*/

body#Amphi{
  background-image: url('Images/Amphi_Ext.JPG');
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
}

.Regarder img{
  position: relative;
  top: 100px;
  left: 700px;
}

.Regarder p{
  margin-left: 680px;
  margin-top: 80px;
  opacity: 0;
  transition: opacity 1s;
}

.Regarder a:hover p{
  opacity: 1;
}

/*-------------------------*/
/*------- Amphi.html ------*/
/*-------------------------*/


/*-------------------------*/
/*------- Amphi_Int.html ------*/
/*-------------------------*/

body#Amphi_Int{
  background-image: url('Images/Amphi_Int.JPG');
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
}

.video{
  border: 6px;
  border-color: black;
  background-color: black;
  border-radius: 5px;
  border-style: solid;
  background-color: none;
  width: 560px;
  height: auto;
  position: relative;
  top: -140px;
  left: 600px;
}

/*-------------------------*/
/*------- Amphi_Int.html ------*/
/*-------------------------*/

/*-------------------------*/
/*------- Hall_F.html ------*/
/*-------------------------*/

body#Hall_F{
  background-image: url('Images/Hall_F.JPG');
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
}

.Porte_Ext p{
  margin-left: 320px;
  margin-top: -30px;
  opacity: 0;
  transition: opacity 1s; 
}

.Porte_Ext a:hover p{
  opacity: 1;
}

.Porte_Ext img{
  position: relative;
  top: 380px;
  left: 220px;
  transform: rotateX(65deg) rotateZ(100deg) rotateY(-2deg);
}

.Cafe p{
  margin-left: 1200px;
  margin-top: -290px;
  opacity: 0;
  transition: opacity 1s; 
}

.Cafe a:hover p{
  opacity: 1;
}

.Cafe img{
  position: relative;
  top: 170px;
  left: 1050px;
  transform: rotateX(60deg) rotateZ(160deg) rotateY(-10deg);
}

/*-------------------------*/
/*------- Hall_F.html ------*/
/*-------------------------*/


/*-------------------------*/
/*------- Cafe.html ------*/
/*-------------------------*/

body#cafe{
  background-image: url('Images/Cafe.JPG');
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
}

#Utiliser{
  width: 200px;
  height: 100px;
  background-color: plum;
  border: 2px solid white;
  border-radius: 10px; 
  display: flex;
  justify-content: center;
  align-items: center;
  color: white; 
  font-family: Arial, sans-serif;
  position: relative;
  left: 720px;
  top: 220px;
}

/*-------------------------*/
/*------- Cafe.html ------*/
/*-------------------------*/


/*-------------------------*/
/*------- Ext.html ------*/
/*-------------------------*/

body#Ext{
  background-image: url('Images/Exterieur.JPG');
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
}

.Table p{
  margin-left: 20px;
  margin-top: -20px;
  opacity: 0;
  transition: opacity 1s; 
}

.Table a:hover p{
  opacity: 1;
}

.Table a{
  position: relative;
  top: 180px;
  left: 480px ;
}

.Ext_2 p{
  margin-left: 20px;
  margin-top: -250px;
  opacity: 0;
  transition: opacity 1s; 
}

.Ext_2 a:hover p{
  opacity: 1;
}

.Ext_2 a{
  position: relative;
  top: 100px;
  left: 1230px ;
}

.Ext_2 img{
  transform: rotateX(60deg) rotateZ(100deg) rotateY(-10deg);
}

/*-------------------------*/
/*------- Ext.html ------*/
/*-------------------------*/


/*-------------------------*/
/*------- Table.html ------*/
/*-------------------------*/

body#Table{
  background-image: url('Images/Table.JPG');
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
}

/*-------------------------*/
/*------- Table.html ------*/
/*-------------------------*/


/*-------------------------*/
/*------- Hall_L.html ------*/
/*-------------------------*/

body#Hall_L{
  background-image: url('Images/Hall_L.png');
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
}

.Couloir_1 p{
  margin-left: 20px;
  margin-top: -400px;
  opacity: 0;
  transition: opacity 1s; 
}

.Couloir_1 a:hover p{
  opacity: 1;
}  

.Couloir_1 img{
  transform: rotateX(60deg) rotateZ(95deg);
}

.Couloir_1 a{
  position: relative;
  left: 750px;
  top: 500px;
}

/*-------------------------*/
/*------- Hall_L.html ------*/
/*-------------------------*/


/*-------------------------*/
/*------- Couloir_1.html ------*/
/*-------------------------*/

body#Couloir_1{
  background-image: url('Images/Couloir_1.JPG');
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
}

div.BabyFoot p{
  margin-left: 230px;
  margin-top: -450px;
  opacity: 0;
  transition: opacity 1s; 
}

.BabyFoot a:hover p{
  opacity: 1;
}

.BabyFoot img{
  transform: rotateX(60deg) rotateZ(150deg) rotateY(-7deg);
}

.BabyFoot a{
  position: relative;
  top: 450px;
  left: 700px;
}

div.Couloir2 p{
  margin-left: 30px;
  margin-top: -250px;
  opacity: 0;
  transition: opacity 1s; 
}

.Couloir2 a:hover p{
  opacity: 1;
}

.Couloir2 img{
  transform: rotateX(60deg) rotateZ(90deg) rotateY(-17deg);
}

.Couloir2 a{
  position: relative;
  top: 200px;
  left: 600px;
}

/*-------------------------*/
/*------- Couloir_1.html ------*/
/*-------------------------*/


/*-------------------------*/
/*------- BabyFoot.html ------*/
/*-------------------------*/

body#BabyFoot{
  background-image: url('Images/BabyFoot.JPG');
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
}

#JeuxB{
  width: 250px;
  height: 100px;
  background-color: plum;
  border: 2px solid white;
  border-radius: 10px; 
  display: flex;
  justify-content: center;
  align-items: center;
  color: white; 
  font-family: Arial, sans-serif;
  position: relative;
  left: 720px;
  top: 220px;
} 

/*-------------------------*/
/*------- BabyFoot.html ------*/
/*-------------------------*/


/*-------------------------*/
/*------- Couloir_2.html ------*/
/*-------------------------*/

body#Couloir_2{
  background-image: url('Images/Couloir_2.JPG');
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
}

.Couloir p{
  margin-left: 270px;
  margin-top: -450px;
  opacity: 0;
  transition: opacity 1s; 
}

.Couloir a:hover p{
  opacity: 1;
}

.Couloir a{
  position: relative;
  left: 700px;
  top: 450px;
}

.Couloir img{
  transform: rotateX(60deg) rotateZ(130deg) rotateY(-12deg);
}

.Couloir_4 p{
  margin-left: 0px;
  margin-top: -200px;
  opacity: 0;
  transition: opacity 1s; 
}

.Couloir_4 a:hover p{
  opacity: 1;
}

.Couloir_4 a{
  position: relative;
  left: 520px;
  top: 130px;
}

.Couloir_4 img{
  transform: rotateX(60deg) rotateZ(90deg) rotateY(-20deg);
}

/*-------------------------*/
/*------- Couloir_2.html ------*/
/*-------------------------*/


/*-------------------------*/
/*------- Couloir_3.html ------*/
/*-------------------------*/

body#Couloir_3{
  background-image: url('Images/Couloir_3.JPG');
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
}

.Perso img{
  position: relative;
  top: 230px;
  left: 900px;
  width: 400px;
}

/*-------------------------*/
/*------- Couloir_3.html ------*/
/*-------------------------*/


/*-------------------------*/
/*------- Etage.html ------*/
/*-------------------------*/

body#Etage{
  background-image: url('Images/Etage.JPG');
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
}

.Bibliotheque p{
  margin-left: -130px;
  margin-top: -450px;
  opacity: 0;
  transition: opacity 1s; 
}

.Bibliotheque a:hover p{
  opacity: 1;
}

.Bibliotheque a{
  position: relative;
  top: 540px;
  left: 280px;
}

.Bibliotheque img{
  transform: rotateX(61deg) rotateZ(60deg) rotateY(-2deg);
}

.CouloirH1 p{
  margin-left: 80px;
  margin-top: -400px;
  opacity: 0;
  transition: opacity 1s; 
}

.CouloirH1 a:hover p{
  opacity: 1;
}

.CouloirH1 a{
  position: relative;
  top: 410px;
  left: 1240px;
}

.CouloirH1 img{
  transform: rotateX(61deg) rotateZ(120deg) rotateY(-7deg);
}

/*-------------------------*/
/*------- Etage.html ------*/
/*-------------------------*/


/*-------------------------*/
/*------- Etage.html ------*/
/*-------------------------*/

body#Bibliotheque{
  background-image: url('Images/Bibliotheque.JPG');
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
}

.Livre p{
  margin-left: -20px;
  margin-top: -20px;
  opacity: 0;
  transition: opacity 1s; 
}

.Livre a:hover p{
  opacity: 1;
}

.Livre a{
  position: relative;
  top: 380px;
  left: 830px;
}

/*-------------------------*/
/*------- Etage.html ------*/
/*-------------------------*/


/*-------------------------*/
/*------- Couloir_H1.html ------*/
/*-------------------------*/

body#Couloir_H1{
  background-image: url('Images/Couloir_H1.JPG');
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
}

.Couloir_H2 p{
  margin-left: -20px;
  margin-top: -300px;
  opacity: 0;
  transition: opacity 1s; 
}

.Couloir_H2 a:hover p{
  opacity: 1;
}

.Couloir_H2 a{
  position: relative;
  top: 500px;
  left: 700px;
}

.Couloir_H2 img{
  transform: rotateX(60deg) rotateZ(95deg) rotateY(-10deg);
}

/*-------------------------*/
/*------- Couloir_H1.html ------*/
/*-------------------------*/


/*-------------------------*/
/*------- Couloir_H2.html ------*/
/*-------------------------*/

body#Couloir_H2{
  background-image: url('Images/Couloir_H2.JPG');
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
}

.Couloir_H3 p{
  margin-left: -35px;
  margin-top: -300px;
  opacity: 0;
  transition: opacity 1s; 
}

.Couloir_H3 a:hover p{
  opacity: 1;
}

.Couloir_H3 a{
  position: relative;
  top: 350px;
  left: 60px;
}

.Couloir_H3 img{
  transform: rotateX(60deg) rotateZ(80deg) rotateY(-10deg);
}

.Affiche p{
  margin-left: -20px;
  margin-top: -30px;
  opacity: 0;
  transition: opacity 1s; 
}

.Affiche a:hover p{
  opacity: 1;
}

.Affiche a{
  position: relative;
  top: 330px;
  left: 1380px;
}

.Affiche img{
  transform: rotateY(40deg) rotateX(2deg) rotateZ(5deg);
}

/*-------------------------*/
/*------- Couloir_H2.html ------*/
/*-------------------------*/


/*-------------------------*/
/*------- Couloir_H3.html ------*/
/*-------------------------*/

body#Couloir_H3{
  background-image: url('Images/Couloir_H3.JPG');
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
}

.Couloir_H4 p{
  margin-left: 5px;
  margin-top: -500px;
  opacity: 0;
  transition: opacity 1s; 
}

.Couloir_H4 a:hover p{
  opacity: 1;
}

.Couloir_H4 a{
  position: relative;
  left: 770px;
  top: 630px;
}

.Couloir_H4 img{
  transform: rotateX(60deg) rotateZ(90deg) rotateY(-5deg);
}

/*-------------------------*/
/*------- Couloir_H3.html ------*/
/*-------------------------*/


/*-------------------------*/
/*------- Couloir_H4.html ------*/
/*-------------------------*/

body#Couloir_H4{
  background-image: url('Images/Couloir_H4.JPG');
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
}

.Couloir_H5 p{
  margin-left: 200px;
  margin-top: -430px;
  opacity: 0;
  transition: opacity 1s; 
}

.Couloir_H5 a:hover p{
  opacity: 1;
}

.Couloir_H5 a{
  position: relative;
  left: 820px;
  top: 480px;
}

.Couloir_H5 img{
  transform: rotateX(60deg) rotateZ(140deg) rotateY(-12deg);
}

.EDT p{
  margin-left: -20px;
  margin-top: -160px;
  opacity: 0;
  transition: opacity 1s; 
}

.EDT a:hover p{
  opacity: 1;
}

.EDT a{
  position: relative;
  left: 810px;
  top: 70px;
}

/*-------------------------*/
/*------- Couloir_H4.html ------*/
/*-------------------------*/


/*-------------------------*/
/*------- EDT.html ------*/
/*-------------------------*/

body#EDT{
  background-image: url('Images/EDT.JPG');
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
}

#JeuxC{
  width: 250px;
  height: 100px;
  background-color: plum;
  border: 2px solid white;
  border-radius: 10px; 
  display: flex;
  justify-content: center;
  align-items: center;
  color: white; 
  font-family: Arial, sans-serif;
  position: relative;
  left: 720px;
  top: 220px;
}

/*-------------------------*/
/*------- EDT.html ------*/
/*-------------------------*/


/*-------------------------*/
/*------- EDT2.html ------*/
/*-------------------------*/

body#EDT2{
  background-image: url('Images/EDT2.png');
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
}

/*-------------------------*/
/*------- EDT2.html ------*/
/*-------------------------*/


/*-------------------------*/
/*------- Couloir_H5.html ------*/
/*-------------------------*/

body#Couloir_H5{
  background-image: url('Images/Couloir_H5.JPG');
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
}

.Salle_Ordi p{
  margin-left: -100px;
  margin-top: -400px;
  opacity: 0;
  transition: opacity 1s; 
}

.Salle_Ordi a:hover p{
  opacity: 1;
}

.Salle_Ordi a{
  position: relative;
  left: 940px;
  top: 390px;
}

.Salle_Ordi img{
  transform: rotateX(60deg) rotateZ(25deg) rotateY(-2deg); 
}

.Ordi2 p{
  margin-left: -100px;
  margin-top: -450px;
  opacity: 0;
  transition: opacity 1s; 
}

.Ordi2 a:hover p{
  opacity: 1;
}

.Ordi2 a{
  position: relative;
  left: 820px;
  top: 460px;
}

.Ordi2 img{
  transform: rotateX(60deg) rotateZ(45deg) rotateY(-2deg); 
}

/*-------------------------*/
/*------- Couloir_H5.html ------*/
/*-------------------------*/


/*-------------------------*/
/*------- Salle_Ordi.html ------*/
/*-------------------------*/

body#Salle_Ordi{
  background-image: url('Images/Salle_Ordi.JPG');
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
}

.Ordi p{
  margin-left: -20px;
  margin-top: -20px;
  opacity: 0;
  transition: opacity 1s; 
}

.Ordi a:hover p{
  opacity: 1;
}

.Ordi a{
  position: relative;
  left: 780px;
  top: 110px;
}

.Ordi img{
  transform: rotateY(-40deg) rotateZ(-3deg);
}

/*-------------------------*/
/*------- Salle_Ordi.html ------*/
/*-------------------------*/

/*-------------------------*/
/*------- Ordi.html ------*/
/*-------------------------*/

body#Ordi{
  background-image: url('Images/Ordi.JPG');
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
}

#JeuxD{
  width: 200px;
  height: 100px;
  background-color: plum;
  border: 2px solid white;
  border-radius: 10px; 
  display: flex;
  justify-content: center;
  align-items: center;
  color: white; 
  font-family: Arial, sans-serif;
  position: relative;
  left: 720px;
  top: 220px;
}

/*-------------------------*/
/*------- Ordi.html ------*/
/*-------------------------*/


/*-------------------------*/
/*------- Livre.html ------*/
/*-------------------------*/

body#Livre{
  background-image: url('Images/Livre.JPG');
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
}

#JeuxE{
  width: 250px;
  height: 100px;
  background-color: plum;
  border: 2px solid white;
  border-radius: 10px; 
  display: flex;
  justify-content: center;
  align-items: center;
  color: white; 
  font-family: Arial, sans-serif;
  position: relative;
  left: 720px;
  top: 220px;
}

/*-------------------------*/
/*------- Livre.html ------*/
/*-------------------------*/


/*-------------------------*/
/*------- Ordi2.html ------*/
/*-------------------------*/

body#Ordi2{
  background-image: url('Images/Ordi_2.jpg');
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
}

#JeuxF{
  width: 230px;
  height: 60px;
  background-color: plum;
  border: 2px solid white;
  border-radius: 10px; 
  display: flex;
  justify-content: center;
  align-items: center;
  color: white; 
  font-family: Arial, sans-serif;
  position: relative;
  left: 549px;
  top: 315px;
  transform: rotateY(60deg) rotateZ(5deg) rotateX(-6deg);
}

/*-------------------------*/
/*------- Ordi2.html ------*/
/*-------------------------*/


/*-------------------------*/
/*------- Couloir_4.html ------*/
/*-------------------------*/

body#Couloir_4{
  background-image: url('Images/Couloir_4.jpg');
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
}

.Couloir_5 p{
  margin-left: 20px;
  margin-top: -300px;
  opacity: 0;
  transition: opacity 1s; 
}

.Couloir_5 a:hover p{
  opacity: 1;
}

.Couloir_5 a{
  position: relative;
  left: 780px;
  top: 350px;
}

.Couloir_5 img{
  transform: rotateX(60deg) rotateZ(110deg) rotateY(-10deg);
}

/*-------------------------*/
/*------- Couloir_4.html ------*/
/*-------------------------*/


/*-------------------------*/
/*------- Couloir_5.html ------*/
/*-------------------------*/

body#Couloir_5{
  background-image: url('Images/Couloir_5.jpg');
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
}

.Salle_Reu p{
  margin-left: 200px;
  margin-top: -500px;
  opacity: 0;
  transition: opacity 1s; 
}

.Salle_Reu a:hover p{
  opacity: 1;
}

.Salle_Reu a{
  position: relative;
  left: 980px;
  top: 550px;
}

.Salle_Reu img{
  transform:rotateX(60deg) rotateZ(150deg) rotateY(-10deg);
}

/*-------------------------*/
/*------- Couloir_5.html ------*/
/*-------------------------*/


/*-------------------------*/
/*------- Salle_Reu.html ------*/
/*-------------------------*/

body#Salle_Reu{
  background-image: url('Images/Salle_Reu.jpg');
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
}

#JeuxG{
  width: 350px;
  height: 100px;
  background-color: plum;
  border: 2px solid white;
  border-radius: 10px; 
  display: flex;
  justify-content: center;
  align-items: center;
  color: white; 
  font-family: Arial, sans-serif;
  position: relative;
  left: 750px;
  top: 220px;
}

/*-------------------------*/
/*------- Salle_Reu.html ------*/
/*-------------------------*/


/*-------------------------*/
/*------- Ext_3.html ------*/
/*-------------------------*/

body#Ext_3{
  background-image: url('Images/Ext_3.jpg');
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
}

.Snake p{
  margin-left: 20px;
  margin-top: -350px;
  opacity: 0;
  transition: opacity 1s; 
}

.Snake a:hover p{
  opacity: 1;
}

.Snake a{
  position: relative;
  left: 780px;
  top: 190px;
}

/*-------------------------*/
/*------- Ext_3.html ------*/
/*-------------------------*/