*{
    box-sizing: border-box;
}
body{
    max-width: 100%!important;
}
.container{
   min-width: 100%;
   padding:0;
 
display:grid;
grid-column-gap:0;
grid-template-columns: 16 16 16 16 16 20;

grid-row-gap: 100px;
grid-template-areas:
 " . menuhaut robedemariée robedemariée  robedemariée . "
"presentationhaut  presentationhaut presentationhaut presentationhaut  presentationhaut presentationhaut "
  " . robe1 robe2 robe3 robe4 . "  
  " situe situe contact menufooter news news "                
                 
}


.robedemariée{
    position: relative;
    grid-area:robedemariée;
    padding-bottom: -300px!important;
   }
#menuhaut{
       grid-area: menuhaut;
       padding-top: 100px;
       text-align: end;
       margin-right: -250px;
   }

.robe1{
       grid-area: robe1;
      
   }
.robe2{
    grid-area: robe2;
}
.robe3{
    grid-area: robe3;
}
.robe4{
    grid-area: robe4;
}
.sesituer{
grid-area: situe;
background-color: #4e4c4c;
padding-left: 26vh;
padding-right: 15vh;
margin-left: -10px;
margin-bottom: -10px;
}
.contact{
    grid-area: contact; 
    background-color: #4e4c4c; 
    margin-bottom: -10px;

}
.menubas{
    grid-area: menufooter;
    background-color: #4e4c4c;
    margin-bottom: -10px;
}
.presentation{
    grid-area:presentationhaut;
   margin-top: -100px!important;
   padding-top: 100px!important;
   margin-left: -10px;
   margin-right: -10px;;
}
.Newsletter{
    background-color: #4e4c4c;
    grid-area:news; 
    text-align: left;
    margin-left: -80px;
    margin-bottom: -10px;
    margin-right: -10px;
}
.menubas ul li a {
    font-size:1em ;
   margin-left: -50px!important;
   padding-left: -50px;
}
.menubas ul li :before{
    content: "\0020 \0020 \0020 \00BB \0020";
    color: #aaa9a9;
}
.menubas ul li .premier:before {
    content: " ";
   }

.kasalhaut{
    font-family: 'Allura-Regular','Great Vibes', serif;
    
    font-weight: normal;
    
    font-size: 3em;
    
    color: #ddd;
}

a{
    color:#aaa9a9;
    text-decoration: none;
    font-family:'Open sans';
    font-size: 1.5em;
}
ul{
    list-style-type: none;
}
h1{
    font-family: 'Allura','Great Vibes', serif;
    color:#cdcdcd;
}

 h2{
    font-family: 'Open Sans';
    text-transform: uppercase;
  font-size: 2.5em;
    color: white;
    
 }
 h3{
    margin-top: 0;
 
    font-family: 'Open Sans'; 

color: black;}
.h3footer{
    margin-top: 100px;
    margin-bottom: 4vh;
    color:#898989;
}
.h1footer{
margin-top:100px;
}
p{
    font-family: 'Open Sans';
    color:#878787;
}

a:hover{
    opacity: 0.6;
}
.presentation{

    text-align: center;
    background-color: #ddd;
    padding-top: 100px;
    margin-top: -100px!important;
   padding-bottom: 100px;
   z-index:0 inherit!important;
}
strong{
color:black;
text-transform: uppercase;
}
.robe1{
    width: 20vh;
}
.robe2{
    width: 20vh;
}
.robe3{
    width:20vh;
}

.robe4{
    width: 20vh;
}

#robemarié{
    position: relative;
    padding-top: 100px;
width: 80%;
    z-index:9999!important;
   
    margin-bottom: -50px!important;
}

@media screen and (max-width:1023px) {
  #menuhaut{
      display:block;
  }
  .robedemariée{
      display:flex;
      flex-wrap:wrap;
  }
  .container{
      display:block;
  }
}
@media screen and (max-width:639px) {
    .section {
        padding: 2rem 2rem;
    }
}