
body{
    margin: 0px;
    padding: 0px;
    font-family: Arial, Helvetica, sans-serif;
}

.bd-placeholder-img {
    font-size: 1.125rem;
    text-anchor: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
  }

  @media (min-width: 768px) {
    .bd-placeholder-img-lg {
      font-size: 3.5rem;
    }
  }
  .reservation{
    background-color: rgb(243, 100, 48);
    color: white;
    
  }
  .Mybtn{
    border-top-left-radius: 20px;
    border-bottom-right-radius: 20px;
    padding: 10px;
  }
  .Mybtn-black{
    border-top-left-radius: 20px;
    border-bottom-right-radius: 20px;
    width: 100px;
    padding: 10px;
  }
  .image{
    border-radius: 60px;
  }
  #rowA{
    display: flex;
   flex-wrap: wrap;
  align-content: center;
  box-sizing: border-box;
  margin-left: auto;
  margin-right: auto;

  }
  .image{
    border-radius: 20px;
    height: 450px;
    margin-left: 10%;
  }
  .fornisson{
    color: black;
    margin-top: 10%;
    margin-left: 13%;
    /* position: absolute; */
  }
  .dish{
    position: absolute;
    width: 200px;
    height: 200px;
    margin-left: 43%;
    margin-top: 17%;
  }
  #Mycont{
    width: 200px;
    border-radius: 20px;
  }
  .icone{
    border-radius: 100%;
    padding: 5px;
    border: 1px solid black;    
    margin: 10px;
    margin-top: 30px;
    
  }
  .icone:hover{
    background-color: rgb(243, 100, 48);
    border: 1px solid white;
    color: white;
  }
 #Mycont{
  width: 70%;
  border-top-left-radius: 60px;
  border-bottom-right-radius: 60px;
  border-top-right-radius: 20px;
  border-bottom-left-radius: 20px;
 }
 .b1{
  width: auto;
  height: 70%;
  display: block;
  z-index: 1;
 }
 .Post{
  margin-left: 10%;
  position: relative;
  height: 500px;
 }
 .b2{
  width: 30%;
  height: 35%;
  position: absolute;
  right: 38%;
  top: 35%;
 }
 .post1{
  display: flex;
 }
.Mybtns{
  margin: 20px;
}
.boutton{
  position: absolute;
  right: 19%;
  /* top: 10%; */
  bottom: 0%;
}
.goBa{
  display: none;
}
@media (max-width: 766px) {
  .Navb{
    background-color: black !important;
  }
  .nav-link{
    color: white !important;
  }
  .dish{
    visibility: hidden;
  }
  .monContainer{
    justify-content: center;
    display: flex;
    margin-right: 20px;
    
  }
  .mobile{
   justify-content: center;
   display: grid;
   grid-template-columns: 1fr 1fr;
  
  }
  .mobiles{
    justify-content: center;
   display: grid;
   grid-template-columns: 1fr 1fr;
   display: flex;
   width: 400px;
  }
  .plat{
    width: 170px;
    height: 170px;
    display: flex;
  }
  .cercle, .cercle20, .cercle120{
    visibility: hidden;

  }
  .cercleg{
    visibility: hidden;
    display: none;
  }
  .invisible{
    display: none;
  }
  .carree20, .carree120{
    visibility: hidden;
    display: none;
  }
  .b2{
    visibility: hidden;
  }
  .bienvenue{
    display: flex;
    justify-content: center;
  }
  .goBa{
    display: flex;
    margin-bottom: 20px;
  }
  
}

/* @media (min-width: 600px) {
  .Navb{
    background-color: white !important;
  }
} */

.cercle{
  position: absolute;
  left: 10%;

}
.cercle1{
  border-radius: 100%;
  width: 200px;
  height: 200px;
  position: absolute;position: absolute;
  border: 2px solid gray;
}
.cercle2{
  border-radius: 100%;
  width: 150px;
  height: 150px;
  position: absolute;
  border: 2px solid gray;
  left: 13%;
  bottom: 12%;
  
}
.cercle3{
  border-radius: 100%;
  width: 100px;
  height: 100px;
  position: absolute;
  border: 2px solid gray;
  left: 15%;
  top: 15%;
 
}
.cercle4{
  border-radius: 100%;
  width: 50px;
  height: 50px;
  position: absolute;
  border: 2px solid gray;
  background-color: rgb(186, 181, 181);
  left: 25%;
  top: 25%;
}

.cercle20{
  position: absolute;
  left: 0%;

}
.cercle12{
  border-radius: 100%;
  width: 200px;
  height: 200px;
  position: absolute;position: absolute;
  border: 2px solid gray;
}
.cercle22{
  border-radius: 100%;
  width: 150px;
  height: 150px;
  position: absolute;
  border: 2px solid gray;
  left: 13%;
  bottom: 12%;
  
}
.cercle32{
  border-radius: 100%;
  width: 100px;
  height: 100px;
  position: absolute;
  border: 2px solid gray;
  left: 15%;
  top: 15%;
 
}
.cercle42{
  border-radius: 100%;
  width: 50px;
  height: 50px;
  position: absolute;
  border: 2px solid gray;
  background-color: rgb(186, 181, 181);
  left: 25%;
  top: 25%;
}

.carree20{
  position: absolute;
  left: 0%;

}
.carree12{
  
  width: 200px;
  height: 200px;
  position: absolute;position: absolute;
  border: 2px solid gray;
}
.carree22{
  
  width: 150px;
  height: 150px;
  position: absolute;
  border: 2px solid gray;
  left: 13%;
  bottom: 12%;
  
}
.carree32{
  
  width: 100px;
  height: 100px;
  position: absolute;
  border: 2px solid gray;
  left: 15%;
  top: 15%;
 
}
.carree42{
  
  width: 50px;
  height: 50px;
  position: absolute;
  border: 2px solid gray;
  background-color: rgb(186, 181, 181);
  left: 25%;
  top: 25%;
}
.cercle120{
  position: absolute;
  left: 10%;

}
.cercle112{
  border-radius: 100%;
  width: 200px;
  height: 200px;
  position: absolute;
  border: 2px solid gray;
}
.cercle122{
  border-radius: 100%;
  width: 150px;
  height: 150px;
  position: absolute;
  border: 2px solid gray;
  left: 13%;
  bottom: 12%;
  
}
.cercle132{
  border-radius: 100%;
  width: 100px;
  height: 100px;
  position: absolute;
  border: 2px solid gray;
  left: 15%;
  top: 15%;
 
}
.cercle142{
  border-radius: 100%;
  width: 50px;
  height: 50px;
  position: absolute;
  border: 2px solid gray;
  background-color: rgb(186, 181, 181);
  left: 25%;
  top: 25%;
}
.carree120{
  position: absolute;
  left: 80%;

}
.carree112{
  
  width: 200px;
  height: 200px;
  position: absolute;
  border: 2px solid gray;
}
.carree122{
  
  width: 150px;
  height: 150px;
  position: absolute;
  border: 2px solid gray;
  left: 13%;
  bottom: 12%;
  
}
.carree132{
  
  width: 100px;
  height: 100px;
  position: absolute;
  border: 2px solid gray;
  left: 15%;
  top: 15%;
 
}
.carree142{
  
  width: 50px;
  height: 50px;
  position: absolute;
  border: 2px solid gray;
  background-color: rgb(186, 181, 181);
  left: 25%;
  top: 25%;
}
.cercleg{
  position: absolute;
  left: 90%;

}
.cercleg112{
  
  width: 200px;
  height: 200px;
  position: absolute;
  border: 2px solid gray;
}
.cercleg122{
  
  width: 150px;
  height: 150px;
  position: absolute;
  border: 2px solid gray;
  left: 13%;
  bottom: 12%;
  
}
.cercleg132{
  
  width: 100px;
  height: 100px;
  position: absolute;
  border: 2px solid gray;
  left: 15%;
  top: 15%;
 
}
.cercleg142{
  
  width: 50px;
  height: 50px;
  position: absolute;
  border: 2px solid gray;
  background-color: rgb(186, 181, 181);
  left: 25%;
  top: 25%;
}
.notres{
  margin-top: 50px;
}
.group{
  background-color: rgba(81, 81, 112, 0.073);
}
h1, h2{
  color: black;
  font-weight: bold;
}
h1:hover{
  color: rgb(243, 100, 48) !important;
}
h2:hover{
  color: rgb(243, 100, 48) !important;
}
#Mycont:hover{
  border: 4px solid rgb(243, 100, 48);
}
.numero{
  margin-right: 100px; 
  font-weight: 900;
}
.numero:hover{
  font-size: 15px;
  color: rgb(243, 100, 48);
}
.menus{
  width: 150px;
}
.as{
  margin-right: 2%;
  position: absolute;
}