body{background-color: white;
    margin: 0;}

header{height: 100vh;
    width: 100%;
    background-image: url(../images/placeFlagey.jpg);
    background-size: cover;
    background-position: center;
    margin-bottom: 20px;}

nav{height: 5rem;
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-left: 20px;
  padding-right: 20%;
  background-color: #3C7BC2;
  position: fixed;}

#logo{height: 2rem;
    width: auto;}

#nav_list{display: flex;
    gap: 6rem;
    list-style: none;
    padding-right: 11%;}

a{color: white;
    text-decoration: none;
    font-family: 'Inter', sans-serif;
    font-size: 12px;}

h1{color: white;
    text-decoration: none;
    font-family: 'Inter', sans-serif;
    font-size: 32px;
    margin-left: 53.5%;
    margin-bottom: -35px;
    padding-top: 9rem;
    margin-top: 0;}

h2{color: white;
    text-decoration: none;
    font-family: jsMath-cmbx10;
    font-size: 140px;
    margin-left: 53.5%;
    margin-top: 20px;}

#description{border: 1px solid black;
    margin: 10px;
    display: flex;
    justify-content: center;}

.text{border: none;
    padding: 5px;}

.text p{color: black;
    font-family: 'Inter', sans-serif;
    font-size: 16px;}

.decouvrir{display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 2rem;}

.decouvrir img{max-width: 354px;
    height: auto;}

.batiment_flagey{height: 845px;
    border: 1px solid black;
    margin: 10px;}

.batiment_flagey h3{color: black;
    font-family: 'Inter', sans-serif;
    font-weight: bold;
    font-size: 20px;
    text-align: center;
    margin: 47px;}
    
.ensemble{height: 708px;
    width: auto;
    display: flex;
    justify-content: space-between;
    margin: 20px 60px;}

#batiment{height: 708px;
  width: auto;}

.cote_droit{height: 708px;
    width: 45%;}

.cote_droit p{color: black;
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    margin: 0;}

#commerces_flagey{width: 778px;
    height: 468px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    padding-top: 38px;}

#commerces_flagey img{width: 304px;
    height: 196px;}



#bar_resto{display: flex;
    justify-content: space-between;
    margin: 20px 10px;}
    
   
.bar{width: 48%;
    border: 1px solid black;
    display: flex;
    justify-content: space-between;}

#bgauche{width: 41%;
  height: auto;
  margin-left: 60px;
  overflow: hidden;}

#bgauche p{color: black;
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    margin: 0;}

#bgauche div{width: 40%;
    height: 541px;
    margin-left: 60px;}



#bar{width: auto;
  height: 537px;
  margin-top: 27px;
  display: block;
  margin-bottom: 25px;}
    
#bdroit p{color: black;
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    margin-top: 144px;}

#bdroit{width: 49%;
  height: auto;}

#bdroit img{width: 386px;
  height: 402px;}


.resto{width: 44.5%;
  border: 1px solid black;
  padding-left: 60px;
  padding-right: 60px;}

.resto p{color: black;
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    margin-bottom: 20px;
    margin-top: 20px;}

#foto_resto{height: 426px;
    width: 840px;
    display: flex;
    justify-content: space-between;}

.foto1{height: 426px;
    width: 405px;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;}

#resto1{width: 100%;
  height: auto;}

.foto2{height: 426px;
    width: 405px;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;}

#resto2{width: 100%;
  height: auto;}


#belle{height: 94vh;
    width: 100%;
    background: #4E8DD3;
    background: linear-gradient(180deg, rgba(78, 141, 211, 1) 30%, rgba(137, 192, 255, 1) 83%);}

.frase{text-align: center;
    padding: 44px;}


.island{font-family: 'Island Moments', cursive;
    font-size: 96px;
    color: white;}

.inter{font-family:'Inter', sans-serif;
    font-size: 40px;
    color: white;}

.video{width: 1073px;
    height: auto;
    display: block;
    margin-left: auto;
    margin-right: auto;}


footer{height: 110px;
    width: auto;
    background-color: #86BEFD;
    text-align: center;}

footer a{color:  black;
    font-family: 'Inter', sans-serif;
    font-size: 10px;
    margin-bottom: 20px;}



@media (max-width: 765px) {


header{height: 300px;}



nav{display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;}

#nav_list{display: flex;
        flex-direction: column;
        text-align: center;}

.batiment_flagey{display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;}

.ensemble{ display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;}

}