body{
  background-color: #FFE6D6;
  width: 100%;
  height: 100%;
}

p{
font-family: Playfair Display;
}

h1{
font-family: Libre Baskerville;
}
h2{
font-family: Libre Baskerville;
}
header{
    background-image:url('../images/banniere.jpg');
    background-color: #5D828D;
    background-repeat: no-repeat;
    background-size: 110%;
    height: 200px;
    position: relative;
    top: -10px;
	  box-shadow: 0 0 30px rgba(0,0,0,.2);
}

nav{
    
  background-color: #7A6355;
  width: 100%;
    height: 50px;
    top: 130px;
	  padding-top: 10px;
    padding-bottom: 10px;
    display: flex;
    justify-content: center;
    position:absolute;
	
}
ul {
        width: 800px;
        display: flex;
        justify-content: center;
        flex-wrap: wrap ;
        padding: 10px;
        margin: 5px;
        list-style-type: none;
       }


       a{
        text-decoration:none;
        color:#ffffff;
        margin:10px;
        padding: 10px;
        background-color:#C9B1A4;
        width: 104px;
      
        
       }


    
    
    a:hover {
      background-color: #C9B1A4;
      color:#ffffff ;
      margin:15px;
      padding: 15px;
      
    }

    .active {
      color:#000000;
      margin:10px;
      padding: 10px;
 
  }

  
  .site{
    display: flex;
    justify-content: center;
  }  


main{
 
  width:1080px;
  margin: 0 auto;
  margin-bottom: 50px;
  padding-bottom: 50px;
  min-height: 680px;


}

#haut{
background-color: transparent;
}


#bas{
background-color: transparent;
}



#fleche{
  width: 35px;
}

#globale{
  width: 200px;

}

#ensemble{
  display: flex;
  justify-content: center;
}

form{
    display: flex;
    flex-direction: column;
    box-shadow: 0 0 30px rgba(0,0,0,.2);
    border-radius: 5px;
    padding: 10px;
    width:300px ;
    box-sizing: border-box;
    margin: 0 auto;   
    border-color:#7A6355 ; 


  }
textarea{
  height: 213px;
}

#en-tete {
display: flex;
justify-content: space-around;
}

#prenom{
width:130px ;
}

#nom{
width: 130px;
}
.etoile{
  color: #E01200;
}
#envoyer {
  margin: 20px;
  background-color:#5D828D ;
  color: #ffffff;
  }
  #envoyer:hover{
    background-color: black;
  }

.perso{
  display: flex;
  justify-content: space-around;
  align-items: center;
}

#pat{
  display: flex;
  justify-content: center;
}

  footer{
    background-color: #5D828D;
    width:100%;
    text-align: center;
    padding-top: 5px;
    padding-bottom: 5px;
    color: #ffffff;
    margin-top: -50px;

    align-items: center;
    
  }
  
  .autre{
display: flex;
flex-direction: column;



  }



  #lien{
    background-color: transparent;

  }
  /*
  @media (prefers-color-scheme: dark) {
      body {
        background-color: #333333; 
        color: #ffffff; 
    }}*/

#information{
  padding-top: 10px;
}
  
#reclamation{
  padding-bottom: 10px;
}





hr{

  border-color: #7A6355;
}

#galerie{
 height: 250px;
 padding: 5px;


}
#galerie:hover{
  filter: drop-shadow(5px 10px 30px #F5890A);
}