html{

scroll-padding-top: 5rem/*pour le saut de page, a ajuster selon les besoins*/

}


*{box-sizing: border-box;
    margin:0;
    padding:0;
}
body{
    text-align:center;
    background-color:#EDE9E6;
}
.citation,.gallerie,.gallerie2,footer,article{
    margin-top:5em;
}

.citation{
    grid-aera:centre;
    background-image: url("backgroundvoyage3.jpg");
    height:250px;
    background-position:center;
    
}

 .gallerie{
    grid-aera:main;
    
    background-position:center;
}

 .myheader{
    grid-aera:header;
   
}
 .gallerie2{
    grid-aera:section;
    
  
    background-position:center;
    
}

 footer{
    grid-aera:footer;
    background-color: #EDE9E6;
    columns: 3;
    height:10em;
}
.page{
    
      display: grid;
      width: 100vw;
      height: 100vh;
      grid-template-areas:
       " header  "
       " centre"
       " section"
       " main"
       "footer ";

   grid-template-rows: 2fr 2fr 2fr 2fr 2fr ;
   grid-template-columns: 1fr  ;
   padding:10px;
   grid-gap:10px
}




.gallerie2 img:hover{
-ms-transform: scale(1.2); /* IE 9 */
-webkit-transform: scale(1.2); /* Safari 3-8 */
transform: scale(1.2);
border:1px solid black;
}
.gallerie2 img{
    width : 250px;
   height : 250px;
   transition: transform .1s;
   border:1px solid black;
}

header{
    background-color:#EDE9E6;
    height:200px;
}

.slider-scroll {

width: 1062px;
max-width: 100%;
max-height:600px;
margin: 2rem auto;
display: flex;
overflow-x: hidden;
scroll-behavior: smooth;
scroll-snap-type: x mandatory;
-webkit-overflow-scrolling: touch;
}

.slider-scroll img {
scroll-snap-align: center;
min-width: 100%;
 border-radius: 5px;
	
}

.ancre {
	
margin: 1rem auto;
display: flex;
justify-content: center;

}
	
.ancre li{
	
display: inline-flex;
justify-content: center;
align-items:center;
width: 30px;
height: 30px;
background: black;
border-radius: 50%;
}
	
.ancre li a{color:white}
	
.ancre li:not(:last-child){
  margin-right: 30px;
}


.ancre li a:hover {
  opacity: 0.5;
  color:#fff;
}

.navBarre{
    text-align:center;
    background-color:#fff;
    margin-top:80px;
}

.navBarre ul li{
    display: inline-block;
    margin-left:6em;
    font-size:1.3em;
   
}



.navBarre


.navBarre ul li a{
     color:black;
    text-shadow:1px #fff;}

nav ul {
    list-style:none;
}
a{

text-decoration:none;
}

h1,h2,h3,p,li{
    font-family: 'Parisienne', cursive;
    
    
}

h1{
    font-size:3em;
    color:black;
    text-shadow: 1px 1px 2px #fff;
   
}
h2{
    font-size:2.5em;
     color:black;
    text-shadow: 1px 1px 2px #fff;
   
}


h3{
    font-size:1.8em;
     color:black;
    
}
blockquote{
    font-size:1.8em;
    color:#FFFAFA;
    text-shadow: 1px 1px 2px black;
}
.citation h2{
    color:black;
    text-shadow: 2px 2px 2px #fff;
}

    
.titreGallerie2{
    margin-bottom:1em;
}
footer{
    display:flex;
    justify-content: space-between;
    margin:4em 7em 0 7em;
}

header li a{
    color:black;
}
header li a:hover{
    background-color:#EDE9E6;
}

footer li a{
    color:black;
}

footer li a:hover{
    
    background-color:#fff;
}
.citation a{
    color:#fff;
}

.citation a:hover{
    background-color:#EDE9E6;
}



@media screen and (max-width: 600px) {
    
    .page{
    
      display: grid;
      width: 100vw;
      height: 100vh;
      grid-template-areas:
       " header  "
       " centre"
       " section"
       " main"
       "footer ";

   grid-template-rows: 2fr 2fr 2fr 2fr 2fr ;
   grid-template-columns: 1fr  ;
   padding:10px;
   grid-gap:10px
}
.slider-scroll{
    width:300px;
}
.gallerie2 img{
    display:flex;
    margin-left:30px;
    width:90%;
}

}