 .p {
   font-family: Helvetica;
   text-align: justify;
   font-size: 1.05em;
   color: black;
 }

 .h1,
 h2 {
   text-align: center;
   font-family: Helvetica;
 }

 .menu ul {
   border: 1px solid rgb(240, 0, 0);
   background-color: floralwhite;
   padding: 0;
   display: flex;
   justify-content: center;
   border-radius: 10px;
 }

 .menu li {
   list-style-type: none;
   flex-basis: 120px;
   text-align: center;
   margin: 2px;
   font-family: Helvetica;
 }

 .menu a {
   display: block;
   padding: 10px;
   background-color: beige;
   text-decoration: none;
   margin: 5px;
   text-align: center;
   color: black;
   border: 1px solid floralwhite;
   border-radius: 4px;
   transition: all 1s;
 }

 .menu a:hover {
   color: black;
   background-color: rgb(240, 0, 0);
   border-color: rgb(240, 0, 0);
 }

 .menu a.actif {
   background-color: rgb(200, 20, 0);
   color: black;
   border-color: floralwhite;
 }

 .menu a:hover.actif {
   background-color: rgb(240, 0, 0);
   color: black;
   border-color: rgb(240, 0, 0);
 }

 /*le menu vient du site internet:https://juliencrego.com/astuces/creer-un-menu-horizontal-simplissime-en-css/ */

 .intro h2 {
   font-family: Helvetica;
   text-align: center;
   background-color: rgb(240, 0, 0);
   text-shadow: 1px 1px 2px black;
   padding-top: 5px;
   padding-bottom: 5px;
 }

 .intro h3 {
   font-family: Helvetica;
 }

 .intro p {
   font-family: Helvetica;
 }

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

 .histoire h3 {
   font-family: Helvetica;
 }

 .histoire h4 {
   font-family: Helvetica;
   color: rgb(240, 0, 0);
 }

 .histoire p {
   font-family: Helvetica;
 }

 .histoire h5 {
   font-family: Helvetica;
   color: rgb(240, 0, 0);
 }

 .carousel-items {
   list-style-type: none;
   display: flex;
   overflow-x: scroll;
   padding: 1rem 0;
   scroll-snap-type: x mandatory;
 }

 .carousel-item {
   flex: 1 0 250px;
   margin-left: 1rem;
   scroll-snap-align: start;
 }

 ::-webkit-scrollbar-track {
   background-color: #F5F5F5;
 }

 ::-webkit-scrollbar {
   height: 6px;
   background-color: #F5F5F5;
 }

 ::-webkit-scrollbar-thumb {
   background-color: #3d4852;
   border-radius: 3px;
 }

 /*le carousel vient du site internet:https://vincentdubroeucq.com/slider-carrousel-sans-js-css-scoll-snap/ */

 .culture h2 {
   background-color: #ff1a1a;
   border-radius: 10px;
   padding: 10px;
   box-shadow: 10px 10px 5px #888888;
 }

 .culture h3 {
   background-color: #ff4d4d;
   border-radius: 10px;
   margin: 10px;
   padding: 9px;
   box-shadow: 10px 10px 5px #888888;
   font-family: Helvetica;
   text-align: center;
   text-decoration: underline;
 }

 .c-gauche {
   display: flex;
 }

 .c-gauche p {
   background-color: #ffebe6;
   border-radius: 15px;
   padding: 10px;
   width: 50%;
   margin: 3px;
 }

 .c-gauche img {
   border-radius: 15px;
   margin: 3px;
   border: 2px solid black;
 }

 .c-droite {
   display: flex;
 }

 .c-droite img {
   border-radius: 15px;
   margin: 3px;
   border: 2px solid black;
 }

 .c-droite p {
   margin-right: 10px;
   background-color: #ffebe6;
   border-radius: 15px;
   padding: 10px;
   width: 33%;
   margin: 3px;
 }

 .c-italique {
   font-style: italic;
   color: #33ccff;
 }

 .titre {
   display: flex;
   justify-content: center;
   align-items: center;
 }

 .titre img:hover {
   width: 300px;
   transition: 1s;
 }

 .culture h4 {
   font-size: 1.2em;
   font-family: Helvetica;
   background-color: #ff6666;
   margin: 10px;
   padding: 7px;
   border-radius: 10px;
   box-shadow: 10px 10px 5px #888888;
 }

 .accueil h3 {
   font-family: Helvetica;
   background: #ED213A;
   background: -webkit-linear-gradient(to right, #93291E, #ED213A);
   background: linear-gradient(to right, #93291E, #ED213A);
   /*vient de internet */
   padding-top: 10px;
   padding-bottom: 10px;
   padding-left: 5px;
 }

 .accueil h2 {
   font-size: 1.5em;
   font-family: Helvetica;
   background-color: red;
   padding-top: 20px;
   padding-bottom: 20px;
   padding-left: 5px;
   border-radius: 50px;
 }

 .image_accueil {
   display: flex;
 }

 .image {
   display: flex;
   justify-content: center;
   align-items: center
 }

 .accueil p {
   font-family: Helvetica;
   text-align: justify;
 }

 .accueil p:hover {
   background-color: #cc0000;
   padding-left: 6px;
   padding-right: 6px;
 }

 .map {
   display: flex;
   justify-content: center;
   align-items: center;
 }

 .map iframe:hover {
   width: 500px;
   transition: 1s;
 }

 .activités {
   display: flex;
 }

 .activités p {
   text-align: left;
 }

 .activités img {
   border-radius: 5px;
   margin: 3px;
   border: 2px solid black;
 }

 .activités img:hover {
   width: 350px;
   transition: 1s;
   float: right;
 }

 .titre-activités {
   color: rgb(240, 0, 0);
 }