@font-face {
     font-family: 'Titre';
     src: url('titre.ttf') format('truetype')
 }

 @font-face {
     font-family: 'Texte';
     src: url('texte.ttf') format('truetype')
 }

 html {
     scroll-behavior: smooth !important
 }

 body {
     position: fixed;
     top: 0;
     left: 0;
     right: 0;
     bottom: 0;
     overflow-y: scroll;
     overflow-x: none;
     padding: 0;
     margin: 0;
     -ms-overflow-style: none;
     overflow: -moz-scrollbars-none
 }

 body::-webkit-scrollbar {
     display: none
 }

 ::-webkit-scrollbar {
     width: 0;
     background: transparent
 }

 .slidescreen {
     width: 100%;
     height: 100vh;
     position: fixed;
     top: 0;
     left: 0;
     bottom: 0;
     right: 0;
     display: flex;
     margin: 0;
     padding: 0;
     background-color: #000000;
     gap: 10px;
     z-index: 1
 }

 .slidescreen div {
     height: 100vh;
     width: 100%;
     overflow: hidden;
     display: flex;
     justify-content: center;
     align-items: center
 }

 .homeslide {
     min-height: 100vh;
     min-width: 100%;
     width: auto !important
 }

 .slidescreen2 {
     width: 100%;
     height: 100vh;
     position: fixed;
     top: 0;
     left: 0;
     bottom: 0;
     right: 0;
     margin: 0;
     padding: 0;
     background-color: transparent;
     z-index: 2;
     display: flex;
     flex-direction: column;
     justify-content: center;
     align-items: flex-start;
     background: linear-gradient(rgba(0, 0, 0, .75), transparent)
 }

 .slidescreen3 {
     width: 80%;
     padding: 1vh 10%;
     position: relative;
     display: flex;
     justify-content: center;
     align-items: flex-start;
     gap: 5vw
 }

 .slidescreen3 div {
     width: 100%;
     padding: 0;
     text-align: center
 }

 .slidescreen3 p {
     font-size: 2rem;
     letter-spacing: .8rem;
     color: #FFFFFF;
     font-family: 'Texte';
     text-shadow: 0 0 5px #000000;
     font-weight: normal
 }

 .slidescreen3 h1 {
     font-size: 2rem;
     letter-spacing: .8rem;
     color: #FFFFFF;
     font-family: 'Texte';
     text-shadow: 0 0 5px #000000;
     font-weight: normal;
     margin: 0;
     padding: 0
 }

 .slidescreen3 h2 {
     font-size: 2rem;
     color: #FFFFFF;
     font-family: 'Texte';
     text-shadow: 0 0 5px #000000;
     font-weight: normal;
     margin: 0;
     padding: 0
 }

 .slidescreen3 h3 {
     font-size: 3rem;
     letter-spacing: 1rem;
     color: #FFFFFF;
     font-family: 'Texte';
     text-shadow: 0 0 5px #000000;
     box-shadow: 0 0 5px #000000;
     font-weight: normal;
     margin: 5vh 0;
     padding: 10vh 0;
     border: 5px solid #FFFFFF;
     border-radius: 8px;
     transition: all .5s;
     transform: scale(1);
     cursor: pointer
 }

 .slidescreen3 h3:hover {
     transform: scale(.9)
 }

 @media (max-width:860px) {
     .homeslide {
         height: 100vh;
         min-width: auto;
         width: auto !important
     }

     .slidescreen2 {
         overflow-y: scroll;
         -ms-overflow-style: none;
         overflow: -moz-scrollbars-none
     }

     .slidescreen2::-webkit-scrollbar {
         display: none
     }

     .slidescreen3 {
         width: 90%;
         padding: 1vh 5%;
         position: relative;
         display: flex;
         justify-content: center;
         align-items: flex-start;
         gap: 5vw
     }

     .slidescreen3 p {
         font-size: 1rem;
         letter-spacing: 0;
         color: #FFFFFF;
         font-family: 'Texte';
         text-shadow: 0 0 5px #000000;
         font-weight: normal
     }

     .slidescreen3 h1 {
         font-size: 1rem;
         letter-spacing: 0;
         color: #FFFFFF;
         font-family: 'Texte';
         text-shadow: 0 0 5px #000000;
         font-weight: normal;
         margin: 0;
         padding: 0
     }

     .slidescreen3 h2 {
         font-size: 1rem;
         color: #FFFFFF;
         font-family: 'Texte';
         text-shadow: 0 0 5px #000000;
         font-weight: normal;
         margin: 0;
         padding: 0
     }

     .slidescreen3 h3 {
         font-size: 1.5rem;
         letter-spacing: 0;
         color: #FFFFFF;
         font-family: 'Texte';
         text-shadow: 0 0 5px #000000;
         box-shadow: 0 0 5px #000000;
         font-weight: normal;
         margin: 5vh 0;
         padding: 5vh 0;
         border: 5px solid #FFFFFF;
         border-radius: 8px;
         transition: all .5s;
         transform: scale(1);
         cursor: pointer
     }

     .slidescreen3 h3:hover {
         transform: scale(.9)
     }
 }

 header {
     width: 100%;
     display: flex;
     justify-content: flex-start;
     align-items: flex-start;
     position: fixed;
     top: 0;
     left: 0;
     right: 0;
     z-index: 99;
     margin: 0;
     padding: 0
 }

 .header {
     width: 100%;
     display: flex;
     justify-content: space-evenly;
     align-items: center;
     background-color: transparent;
     margin: 0;
     padding: 0
 }

 .header .div1 {
     width: 100%;
     margin: 0;
     padding: 5px 10px;
     text-align: left;
     display: flex;
     justify-content: flex-start;
     align-items: center;
     gap: 10px;
     z-index: 5;
     cursor: pointer
 }

 .header .div2 {
     width: 100%;
     margin: 0;
     text-align: left;
     display: flex;
     justify-content: flex-start;
     align-items: center;
     gap: 10px;
     z-index: 5;
     cursor: pointer;
     height: auto
 }

 .header .div3 {
     width: 100%;
     margin: 0;
     text-align: right;
     display: flex;
     justify-content: flex-end;
     align-items: center;
     gap: 10px;
     z-index: 5;
     cursor: pointer;
     height: auto
 }

 .header .div4 {
     width: 100%;
     margin: 0;
     padding: 5px 10px;
     text-align: right;
     display: flex;
     justify-content: flex-end;
     align-items: center;
     gap: 10px;
     z-index: 5;
     cursor: pointer
 }

 .header .div5 {
     width: 100%;
     margin: 0;
     text-align: center;
     display: flex;
     justify-content: center;
     align-items: center;
     gap: 10px;
     z-index: 5;
     cursor: pointer;
     height: auto
 }

 @media (max-width:860px) {
     .header .div2 {
         display: none
     }
 }

 .navigation {
     position: fixed;
     top: 0;
     left: 0;
     width: 100vw;
     height: 100vh;
     padding: 8vh 5vw;
     padding-top: 90px;
     background-color: rgba(0, 0, 0, .9);
     display: flex;
     flex-direction: column;
     justify-content: flex-start;
     align-items: center;
     z-index: 4
 }

 .navigation div {
     width: 80%;
     margin-bottom: 2vh;
     margin-left: 2%;
     padding: 1vh 3%;
     border-left: 5px solid #FFFFFF
 }

 .navigation div:hover {
     border-left: 5px solid #004bc4
 }

 .navigation button {
     border: none;
     background-color: transparent;
     font-size: 1.2rem;
     color: #FFFFFF;
     cursor: pointer;
     font-family: 'Texte'
 }

 @media (max-width:860px) {
     .navigation {
         width: 100vw
     }
 }

 .navigation a {
     font-size: 1.5rem;
     color: #FFFFFF;
     font-family: 'Texte';
     text-decoration: none;
     transition: all .5s
 }

 .header * {
     font-size: 1rem;
     color: #FFFFFF;
     font-family: 'Titre'
 }

 .div1 img {
     width: 30px;
     cursor: pointer;
     transition: all .5s;
     transform: scale(1)
 }

 .div1 img:hover {
     transform: scale(.8)
 }

 .div2 img {
     width: 30px;
     cursor: pointer;
     transition: all .5s;
     transform: scale(1)
 }

 .div2 img:hover {
     transform: scale(.8)
 }

 .div5 .logo99 {
     height: auto;
     width: 75px;
     z-index: 99
 }

 main {
     position: fixed;
     top: 0;
     left: 0;
     right: 0;
     bottom: 0;
     padding: 0;
     margin: 0;
     width: 100%;
     height: 100vh;
     z-index: 1;
     overflow-y: scroll;
     overflow-x: hidden
 }

 .overmedia {
     position: relative;
     width: 96vw;
     height: 96vh;
     overflow: hidden;
     margin: 0;
     margin: 2vh 2vw;
     background-color: rgba(0, 0, 0, .4);
     z-index: 2;
     display: flex;
     justify-content: center;
     align-content: center;
     margin-top: -98vh
 }

 .section0 {
     position: relative;
     width: 96vw;
     height: 96vh;
     overflow: hidden;
     margin: 0;
     padding: 2vh 2vw;
     background-color: #FFF;
     z-index: 1;
     display: flex;
     justify-content: center;
     align-content: center
 }

 .section0 video {
     object-fit: cover;
     width: 96vw;
     height: 96vh;
     z-index: 1
 }

 .section0 img {
     object-fit: cover;
     width: 96vw;
     height: 96vh;
     z-index: 1
 }

 .overlay {
     position: relative;
     display: flex;
     justify-content: center;
     align-items: flex-start;
     height: 95vh;
     width: 96vw;
     margin-top: -100vh;
     z-index: 3
 }

 .overlay2 {
     position: relative;
     display: flex;
     justify-content: flex-end;
     align-items: flex-end;
     height: 100vh;
     width: 100vw;
     margin-top: -100vh
 }

 .overlay2 a {
     height: 50px;
     width: 50px;
     line-height: 50px;
     text-align: center;
     background-color: #FFFFFF;
     border-radius: 5px;
     color: #000000;
     font-size: 30px;
     z-index: 5;
     text-decoration: none;
     transition: all .5s
 }

 .overlay2 a:hover {
     color: #004bc4;
     font-size: 25px
 }

 @media (max-width:860px) {
     .overlay2 a {
         opacity: 0
     }
 }

 .overlay3 {
     position: relative;
     display: flex;
     justify-content: flex-end;
     align-items: flex-start;
     flex-direction: column;
     height: 100vh;
     width: 100vw;
     margin-top: -100vh;
     overflow: hidden;
     z-index: 2
 }

 .overlay3 img {
     width: 100%
 }

 @media (max-width:860px) {
     .overlay3 {
         display: none
     }
 }

 .fond_de_page {
     width: 100vw;
     height: auto
 }

 .ariane {
     width: 100%;
     text-align: left
 }

 .ariane a {
     color: #FFFFFF;
     font-size: 1rem;
     text-decoration: none;
     font-family: 'Texte'
 }

 .section0-2 {
     position: relative;
     width: 100%;
     height: 50vh;
     overflow: hidden;
     margin: 0;
     padding: 0;
     background-color: #000;
     z-index: 1
 }

 .section0-2 video {
     min-height: 100vh;
     min-width: 100vw;
     z-index: 1
 }

 .section0-2 img {
     min-height: 100vh;
     min-width: 100vw
 }

 .section1 {
     position: relative;
     width: 30%;
     height: 96vh;
     margin-top: -96vh;
     display: flex;
     justify-content: center;
     align-items: flex-start;
     flex-direction: column;
     padding: 0 65% 0 5%;
     z-index: 3;
     overflow-y: scroll;
     overflow-x: hidden;
     -ms-overflow-style: none;
     overflow: -moz-scrollbars-none
 }

 .section1::-webkit-scrollbar {
     display: none
 }

 .section1 h1 {
     font-size: 2rem;
     color: #FFFFFF;
     font-family: 'Titre';
     text-shadow: 1px 1px 3px #000000;
     margin: 0;
     padding: 0;
     line-height: 100%
 }

 .section1 p {
     font-size: 1.2rem;
     color: #FFFFFF;
     font-family: 'Texte';
     text-shadow: 1px 1px 3px #000000
 }

 .section1 button {
     padding: 8px;
     border: 2px solid #FFFFFF;
     background-color: transparent;
     cursor: pointer;
     font-size: 2rem;
     color: #FFFFFF;
     font-family: 'Texte';
     transition: all .5s
 }

 .section1 button:hover {
     border: 2px solid #FFFFFF;
     background-color: #FFFFFF;
     color: #000000
 }

 @media (max-width:860px) {
     .section1 {
         width: 90%;
         padding: 0 5%
     }

     .section1 h1 {
         font-size: 1.5rem
     }

     .section1 p {
         font-size: 1rem
     }

     .section1 button {
         font-size: 1rem
     }
 }

 .section1-3 {
     position: relative;
     width: 90%;
     height: 100vh;
     margin-top: -100vh;
     display: flex;
     justify-content: center;
     align-items: flex-start;
     padding: 0 5% 0 5%;
     z-index: 3;
     overflow-y: scroll;
     overflow-x: hidden;
     -ms-overflow-style: none;
     overflow: -moz-scrollbars-none
 }

 .section1-3::-webkit-scrollbar {
     display: none
 }

 .section1-3 div {
     width: 45%;
     height: 100vh;
     display: flex;
     justify-content: center;
     align-items: flex-start;
     flex-direction: column;
     overflow: hidden
 }

 .section1-3 div img {
     margin: 0 10%;
     width: 80%;
     height: auto;
     border: 5px solid #FFFFFF;
     border-radius: 15px;
     box-shadow: 0 0 30px #000000
 }

 .section1-3 h1 {
     font-size: 2rem;
     color: #FFFFFF;
     font-family: 'Titre';
     text-shadow: 1px 1px 3px #000000;
     margin: 0;
     padding: 0;
     line-height: 100%
 }

 .section1-3 p {
     font-size: 1.2rem;
     color: #FFFFFF;
     font-family: 'Texte';
     text-shadow: 1px 1px 3px #000000
 }

 .section1-3 button {
     padding: 8px;
     border: 2px solid #FFFFFF;
     background-color: transparent;
     cursor: pointer;
     font-size: 2rem;
     color: #FFFFFF;
     font-family: 'Texte';
     transition: all .5s
 }

 .section1-3 button:hover {
     border: 2px solid #FFFFFF;
     background-color: #FFFFFF;
     color: #000000
 }

 @media (max-width:860px) {
     .section1-3 {
         width: 90%;
         padding: 0 5%
     }

     .section1-3 h1 {
         font-size: 1.5rem
     }

     .section1-3 p {
         font-size: 1rem
     }

     .section1-3 button {
         font-size: 1rem
     }
 }

 .section1-2 {
     position: relative;
     width: 60%;
     padding: 0 20% 0 20%;
     height: 96vh;
     margin-top: -96vh;
     display: flex;
     justify-content: center;
     align-items: center;
     flex-direction: column;
     z-index: 3;
     overflow-y: scroll;
     overflow-x: hidden;
     -ms-overflow-style: none;
     overflow: -moz-scrollbars-none
 }

 .section1-2::-webkit-scrollbar {
     display: none
 }

 .section1-2 h1 {
     font-size: 2.5rem;
     color: #FFFFFF;
     text-shadow: 0 0 3px #000000;
     font-family: 'Titre';
     margin: 0;
     padding: 0;
     line-height: 100%
 }

 .section1-2 h2 {
     font-size: 2.5rem;
     color: #FFFFFF;
     text-shadow: 0 0 3px #000000;
     font-family: 'Titre';
     margin: 0;
     padding: 0;
     line-height: 100%
 }

 .section1-2 p {
     font-size: 2rem;
     color: #FFFFFF;
     font-family: 'Texte';
     text-shadow: 0 0 3px #000000;
     text-align: center
 }

 .section1-2 button {
     padding: 8px;
     border: 2px solid #FFFFFF;
     background-color: rgba(0, 0, 0, .3);
     text-shadow: 1px 1px 3px #000000;
     cursor: pointer;
     font-size: 2rem;
     color: #FFFFFF;
     font-family: 'Texte';
     transition: all .5s
 }

 .section1-2 button:hover {
     border: 2px solid #FFFFFF;
     background-color: #FFFFFF;
     color: #000000
 }

 @media (max-width:860px) {
     .section1-2 {
         width: 90%;
         padding: 0 5%
     }

     .section1-2 h1 {
         font-size: 1.5rem
     }

     .section1-2 h2 {
         font-size: 1.5rem
     }

     .section1-2 p {
         font-size: 1.2rem
     }

     .section1-2 button {
         font-size: 1.2rem
     }
 }

 .section2 {
     position: relative;
     width: 100%;
     min-height: 100vh;
     height: auto;
     display: flex;
     justify-content: center;
     align-items: center;
     flex-direction: column;
     padding: 5vh 0 10vh 0;
     z-index: 1;
     overflow: hidden;
     background-color: #000000
 }

 .section2 h1 {
     font-size: 3rem;
     color: #5e0404;
     font-family: 'Titre';
     margin: 0;
     padding: 0;
     line-height: 100%
 }

 .section2 h2 {
     font-size: 3rem;
     color: #ffffff;
     font-family: 'Titre';
     margin: 0;
     padding: 0;
     margin-bottom: 5vh;
     line-height: 100%
 }

 @media (max-width:860px) {
     .section2 {
         height: auto;
         padding: 5vh 0 5vh 0
     }

     .section2 h2 {
         font-size: 1.5rem
     }

     .section2 p {
         font-size: 1rem
     }
 }

 .section3 {
     width: 100%;
     height: auto;
     display: flex;
     justify-content: space-evenly;
     align-content: flex-start;
     flex-wrap: wrap;
     margin: 0;
     gap: 2vw;
     height: 80vh
 }

 .section3 div {
     width: 30%;
     margin: 0;
     padding: 5vh 0
 }

 .section3 img {
     object-fit: cover;
     width: 100%;
     height: 40vh
 }

 .section3 h2 {
     font-size: 1.5rem;
     color: #FFFFFF;
     font-family: 'Texte'
 }

 .section3 p {
     font-size: 1rem;
     color: #FFFFFF;
     font-family: 'Texte';
     text-align: justify
 }

 .section3 button {
     background-color: #191c1f;
     font-size: 1rem;
     color: #FFFFFF;
     font-family: 'Texte';
     text-align: justify;
     text-transform: uppercase;
     border: none;
     cursor: pointer;
     font-weight: bold;
     padding: 0;
     margin: 0
 }

 @media (max-width:860px) {
     .section3 {
         flex-direction: column;
         height: auto;
         padding: 5vh 5%;
         justify-content: center;
         align-content: center;
         background-color: #ffffff
     }

     .section3 div {
         min-height: 70vh;
         height: auto;
         width: 70%;
         padding: 3vh 15%;
         text-align: center
     }

     .section3 img {
         object-fit: cover;
         width: 100%;
         height: 40vh
     }

     .section3 h2 {
         font-size: 1.5rem;
         text-align: center
     }

     .section3 p {
         font-size: 1rem;
         text-align: center
     }
 }

 .section3-1 {
     width: 90%;
     height: auto;
     display: flex;
     justify-content: space-evenly;
     align-content: flex-start;
     background-color: #000000;
     margin: 0;
     padding: 0 5%;
     gap: 2vw
 }

 .section3-1 div {
     width: 100%;
     min-height: 80vh;
     height: auto;
     margin: 0;
     padding: 2vh 5%
 }

 .section3-1 img {
     width: 100%
 }

 .section3-1 h2 {
     font-size: 1.5rem;
     color: #FFFFFF;
     font-family: 'Texte'
 }

 .section3-1 p {
     font-size: 1rem;
     color: #FFFFFF;
     font-family: 'Texte';
     text-align: justify
 }

 .section3-1 button {
     background-color: #000000;
     font-size: 1rem;
     color: #FFFFFF;
     font-family: 'Texte';
     text-align: justify;
     text-transform: uppercase;
     border: none;
     cursor: pointer;
     font-weight: bold
 }

 @media (max-width:860px) {
     .section3 {
         flex-direction: column;
         height: auto;
         padding: 5vh 5%;
         justify-content: center;
         align-content: center;
         background-color: #000000
     }

     .section3 div {
         min-height: 70vh;
         height: auto;
         width: 70%;
         padding: 3vh 15%;
         text-align: center
     }

     .section3 img {
         width: 100%
     }

     .section3 h2 {
         font-size: 1.5rem;
         text-align: center
     }

     .section3 p {
         font-size: 1rem;
         text-align: center
     }
 }

 .section4 {
     width: 100%;
     display: flex;
     justify-content: center;
     align-content: center;
     flex-wrap: wrap;
     background-color: #191c1f;
     margin: 0;
     padding: 5vh 0
 }

 .section4 .div40 {
     width: 35%;
     min-height: 5vh;
     border-left: 5px solid #000000;
     display: flex;
     justify-content: center;
     align-content: center;
     flex-direction: column;
     margin-bottom: 2vh;
     transition: all .5s;
     padding: 2vh 5%
 }

 .section4 .div40:hover {
     border-left: 5px solid #d80808
 }

 .section4 .div50 {
     width: 55%;
     display: flex;
     justify-content: center;
     align-content: center;
     flex-direction: column;
     font-size: 1rem;
     text-align: left
 }

 .section4 .div60 {
     width: 25%;
     display: flex;
     justify-content: center;
     align-content: center;
     flex-direction: column;
     font-size: 2.5rem;
     font-weight: bold;
     text-align: right
 }

 .section4 h2 {
     font-size: 1rem;
     color: #000000;
     font-family: 'Texte';
     margin: 0;
     padding: 0
 }

 .div40 p {
     font-size: 1rem;
     color: #000000;
     font-family: 'Texte';
     margin: 0;
     padding: 0
 }

 .section2-6 button {
     background-color: #FFFFFF;
     font-size: 1rem;
     color: #000000;
     font-family: 'Texte';
     text-align: justify;
     text-transform: uppercase;
     border: none;
     cursor: pointer;
     font-weight: bold
 }

 @media (max-width:860px) {
     .section4 {
         display: flex;
         justify-content: center;
         align-content: center;
         flex-wrap: wrap
     }

     .section4 .div40 {
         width: 90%;
         min-height: 5vh;
         border-left: none;
         border-bottom: 5px solid #000000;
         display: flex;
         justify-content: center;
         align-content: center;
         flex-direction: column;
         margin-bottom: 2vh;
         transition: all .5s;
         padding: 2vh 5%
     }

     .section4 .div40:hover {
         border-left: none;
         border-bottom: 5px solid #d80808
     }

     .section4 .div50 {
         width: 60%;
         display: flex;
         justify-content: center;
         align-content: center;
         flex-direction: column;
         font-size: 1rem;
         text-align: left
     }

     .section4 .div60 {
         width: 20%;
         display: flex;
         justify-content: center;
         align-content: center;
         flex-direction: column;
         font-size: 1.5rem;
         font-weight: bold;
         text-align: right
     }
 }

 .section5-1 {
     width: 90%;
     height: auto;
     padding: 15vh 5% 10vh 5%;
     background-color: #FFFFFF;
     text-align: center;
     display: none
 }

 .section5-1 h1 {
     font-size: 3rem;
     color: #000000;
     font-family: 'Texte';
     margin: 0;
     padding: 0;
     margin-bottom: 3vh
 }

 .section5-1 p {
     font-size: 1.5rem;
     color: #000000;
     font-family: 'Texte';
     margin: 0;
     padding: 0
 }

 .section5 {
     width: 90%;
     height: auto;
     display: flex;
     justify-content: space-evenly;
     align-content: flex-start;
     background-color: #000000;
     flex-wrap: wrap;
     margin: 0;
     padding: 15vh 5% 10vh 5%;
     gap: 2vw
 }

 .section5 div {
     width: 20%;
     margin-bottom: 3vh;
     border: 1px solid #000000;
     border-radius: 8px;
     transition: all .5s;
     text-align: center;
     cursor: pointer
 }

 .section5 div:hover {
     border: 1px solid #FFFFFF
 }

 .section5 div img {
     position: relative;
     width: 90%;
     margin-top: 8px;
     z-index: 2
 }

 .section5 div .appear {
     position: relative;
     opacity: .5;
     width: 100%;
     border: none;
     text-align: center;
     transform: translateY(0);
     transition: all 1s;
     z-index: 1
 }

 .section5 div:hover .appear {
     opacity: 1;
     transform: translateY(0);
     z-index: 1
 }

 .appear p {
     font-size: .75rem;
     font-family: 'Texte';
     color: #FFFFFF;
     cursor: pointer;
     text-decoration: underline;
     text-underline-offset: 10px
 }

 .appear h2 {
     font-size: 1rem;
     font-family: 'Texte';
     color: #FFFFFF;
     cursor: pointer;
     transition: all 1s
 }

 .appear h2:hover {
     color: #FF0000
 }

 .appear h2 button {
     background-color: transparent;
     border: none;
     color: #FFFFFF;
     font-size: 1rem;
     font-weight: bold;
     font-family: 'Texte';
     cursor: pointer
 }

 @media (max-width:860px) {
     .section5 div {
         width: 45%
     }
 }

 .section5bis {
     width: 100%;
     height: auto;
     display: flex;
     justify-content: space-evenly;
     align-content: flex-start;
     background-color: #000000;
     flex-wrap: wrap;
     margin: 0;
     padding: 0 5%
 }

 .section5bis div {
     width: 45%;
     height: 50vh;
     overflow: hidden;
     margin-bottom: 0;
     text-align: center;
     margin-bottom: 8vh
 }

 .section5bis .div2 {
     width: 22%;
     height: 50vh;
     overflow: hidden;
     margin-bottom: 0;
     text-align: center;
     margin-bottom: 8vh
 }

 .section5bis div .divimg {
     position: relative;
     opacity: 1;
     width: 100%;
     height: 50vh;
     text-align: center;
     transition: all 1s;
     z-index: 1;
     background-color: #e4e4e4;
     overflow: hidden
 }

 .section5bis div .divimg img {
     object-fit: cover;
     width: 100%;
     height: 50vh
 }

 .section5bis div .appearbis {
     position: relative;
     height: 60vh;
     width: 100%;
     display: flex;
     justify-content: center;
     align-items: center;
     flex-direction: column;
     background-color: rgba(0, 0, 0, 0);
     transition: all .8s;
     margin-top: -60vh;
     cursor: pointer;
     transition: all .5s;
     z-index: 2
 }

 .section5bis div .appearbis:hover {
     background-color: rgba(0, 0, 0, .9)
 }

 .section5bis div .appearbis p {
     font-size: 1rem;
     font-family: 'Texte';
     color: #FFFFFF;
     cursor: pointer;
     text-decoration: underline;
     text-underline-offset: 10px;
     opacity: 0;
     transition: all 1s
 }

 .section5bis div:hover .appearbis p {
     font-size: 1rem;
     font-family: 'Texte';
     color: #FFFFFF;
     cursor: pointer;
     text-decoration: underline;
     text-underline-offset: 10px;
     opacity: 1
 }

 .section5bis div .appearbis h2 {
     font-size: 2rem;
     font-family: 'Texte';
     color: #FFFFFF;
     cursor: pointer;
     transition: all 1s;
     opacity: 0
 }

 .section5bis div:hover .appearbis h2 {
     font-size: 2rem;
     font-family: 'Texte';
     color: #FFFFFF;
     cursor: pointer;
     transition: all 1s;
     opacity: 1
 }

 @media (max-width:1024px) {
     .section5bis {
         width: 100%;
         height: auto;
         display: flex;
         justify-content: space-evenly;
         align-content: flex-start;
         background-color: #000000;
         flex-wrap: wrap;
         margin: 0;
         padding: 0 5%;
         gap: 1Opx
     }

     .section5bis div {
         width: 90%;
         height: 30vh;
         overflow: hidden;
         margin-bottom: 0;
         text-align: center;
         margin-bottom: 3vh
     }

     .section5bis .div2 {
         width: 90%;
         height: 30vh;
         overflow: hidden;
         margin-bottom: 0;
         text-align: center;
         margin-bottom: 3vh
     }

     .section5bis div .divimg {
         position: relative;
         opacity: 1;
         width: 100%;
         height: 30vh;
         text-align: center;
         transition: all 1s;
         z-index: 1;
         background-color: #000000;
         overflow: hidden
     }

     .section5bis div .divimg img {
         object-fit: cover;
         width: 100%;
         height: 30vh
     }

     .section5bis div .appearbis {
         height: 50vh;
         margin-top: -40vh
     }

     .section5bis div .appearbis {
         background-color: rgba(0, 0, 0, .5)
     }

     .section5bis div .appearbis:hover {
         background-color: rgba(0, 0, 0, .5)
     }

     .section5bis div .appearbis p {
         font-size: 1rem;
         font-family: 'Texte';
         color: #FFFFFF;
         cursor: pointer;
         text-decoration: underline;
         text-underline-offset: 10px;
         opacity: 1;
         transition: all 1s
     }

     .section5bis div .appearbis h2 {
         font-size: 2rem;
         font-family: 'Texte';
         color: #FFFFFF;
         cursor: pointer;
         transition: all 1s;
         opacity: 1
     }
 }

 .section_fiche {
     width: 100%;
     min-height: 100vh;
     top: 0;
     z-index: 2;
     background-color: #191c1f
 }

 .section_fiche2 {
     width: 90%;
     height: auto;
     display: flex;
     justify-content: space-evenly;
     align-content: flex-start;
     padding: 5vh 5% 10vh 5%
 }

 .section_fiche2 div {
     width: 45%
 }

 .section_fiche2 div img {
     width: 100%
 }

 .section_fiche2 h1 {
     font-size: 2rem;
     font-family: 'Texte';
     color: #FFFFFF
 }

 .section_fiche2 p {
     font-size: 1.2rem;
     font-family: 'Texte';
     color: #FFFFFF
 }

 .section_fiche2 .button {
     text-decoration: none;
     padding: 8px;
     color: #000000;
     background-color: #FFFFFF;
     font-size: 1.2rem;
     font-family: 'Texte'
 }

 @media (max-width:860px) {
     .section_fiche2 {
         width: 90%;
         height: auto;
         display: flex;
         flex-direction: column;
         padding: 5vh 5% 10vh 5%
     }

     .section_fiche2 div {
         width: 100%
     }
 }

 .section6 {
     width: 100%;
     height: auto;
     display: flex;
     justify-content: space-evenly;
     align-content: flex-start;
     background-color: transparent;
     flex-wrap: wrap;
     margin: 0;
     padding: 3vh 0;
     gap: 1vw
 }

 .section6 div {
     width: 24%
 }

 .section6 img {
     width: 100%
 }

 @media (max-width:860px) {
     .section6 {
         justify-content: center;
         align-content: center;
         background-color: transparent;
         flex-wrap: nowrap;
         flex-direction: column
     }

     .section6 div {
         width: 100%
     }

     .section6 img {
         width: 100%
     }
 }

 .section7 {
     width: 100%;
     height: auto;
     display: flex;
     justify-content: space-evenly;
     align-content: flex-start;
     background-color: transparent;
     flex-wrap: wrap;
     margin: 0;
     padding: 3vh 0;
     gap: 1vw
 }

 .section7 .div1 {
     width: 60%;
     display: flex;
     flex-direction: column;
     align-content: flex-start;
     justify-content: flex-start
 }

 .section7 .div2 {
     width: 38%;
     display: flex;
     flex-direction: column;
     align-content: flex-start;
     justify-content: flex-start
 }

 .section7 img {
     width: 100%;
     transform: scale(1)
 }

 .section7 img:hover {
     width: 100%;
     transform: scale(1)
 }

 .section7 .div1 h1 {
     font-size: 1.5rem;
     font-family: 'Texte';
     color: #000000;
     margin: 0;
     padding: 0
 }

 .section7 .div1 h2 {
     font-size: 1.2rem;
     font-family: 'Texte';
     color: #000000;
     margin: 10px 0;
     padding: 0
 }

 .section7 .div1 p {
     font-size: 1rem;
     font-family: 'Texte';
     color: #000000;
     text-align: justify;
     padding-bottom: 10px;
     margin: 0
 }

 .section7 .div1 a {
     font-size: 1rem;
     font-family: 'Texte';
     color: #000000;
     text-align: justify;
     padding-bottom: 10px;
     margin: 0;
     text-decoration: none;
     font-weight: bold
 }

 @media (max-width:860px) {
     .section7 .div1 {
         width: 70%
     }

     .section7 .div2 {
         width: 28%
     }
 }

 .footer {
     width: 90%;
     display: flex;
     justify-content: space-evenly;
     align-content: center;
     background-color: #FFFFFF;
     margin: 0;
     padding: 5vh 5%;
     padding-top: 10vh;
     gap: 2vw
 }

 .footer div {
     width: 100%;
     display: flex;
     flex-direction: column
 }

 .footer .social {
     width: 100%;
     display: flex;
     flex-direction: row;
     gap: 10px
 }

 .footer .line {
     width: 100%;
     display: flex;
     justify-content: flex-end;
     align-content: center;
     flex-direction: row;
     gap: 10px
 }

 .footer .copy {
     width: 100%;
     display: flex;
     justify-content: center;
     align-content: center;
     flex-direction: row;
     gap: 10px
 }

 .footer h3 {
     font-size: 1.5rem;
     color: #000000;
     font-family: 'Texte';
     margin: 0;
     padding: 3vh 0
 }

 .footer button {
     font-size: 1.5rem;
     color: #000000;
     font-family: 'Texte';
     border: 1px solid #000000;
     background-color: transparent;
     padding: 8px;
     cursor: pointer;
     z-index: 99
 }

 .footer p {
     font-size: 1rem;
     color: #000000;
     font-family: 'Texte';
     margin: 0;
     padding: 0;
     padding: 1vh 0;
     border-bottom: 3px solid #000000
 }

 .footer span {
     font-size: 1rem;
     color: #000000;
     font-family: 'Texte';
     margin: 0;
     padding: 0;
     padding: 1vh 0
 }

 .footer img {
     width: 25px;
     height: 25px;
     border: 5px solid #000;
     border-radius: 5px;
 }

 .footer a {
     font-size: 1rem;
     color: #000000;
     font-family: 'Texte';
     margin: 0;
     padding: 0;
     text-decoration: none;
     z-index: 10
 }

 .footer * {
     font-size: 1rem;
     color: #000000;
     font-family: 'Texte';
     margin: 0;
     padding: 0;
     text-decoration: none
 }

 @media (max-width:860px) {
     .footer {
         flex-direction: column
     }

     .footer .line {
         width: 100%;
         display: flex;
         justify-content: flex-start;
         align-content: center;
         flex-direction: column;
         gap: 10px
     }

     .footer .copy {
         width: 100%;
         display: flex;
         justify-content: center;
         align-content: center;
         flex-direction: column;
         gap: 10px
     }
 }

 .font_modale {
     width: 100vw;
     height: 100vh;
     position: fixed;
     top: 0;
     bottom: 0;
     left: 0;
     right: 0;
     background-color: rgba(0, 0, 0, .75);
     z-index: 1
 }

 @keyframes ScaleIN {
     from {
         transform: scale(0)
     }

     to {
         transform: scale(1)
     }
 }

 .modale {
     width: 90vw;
     height: 90vh;
     position: fixed;
     top: 5vh;
     bottom: 5vh;
     left: 5vw;
     right: 5vw;
     background: linear-gradient(rgba(255, 255, 255, 1), rgba(255, 255, 255, .7));
     border: 1px solid #FFFFFF;
     box-shadow: 0 0 3px #FFFFFF;
     padding: 0;
     overflow-y: scroll;
     border-radius: 8px;
     animation-duration: 1s;
     animation-name: ScaleIN;
     z-index: 10
 }

 .modale button {
     cursor: pointer
 }

 .modale h1 {
     font-size: 2rem;
     color: #000000;
     font-family: 'Texte'
 }

 .modale p {
     font-size: 1.2rem;
     color: #000000;
     font-family: 'Texte'
 }

 .form1 {
     width: 100%;
     display: flex;
     justify-content: center;
     align-content: center;
     gap: 10px;
     margin-bottom: 10px
 }

 .form1 div {
     width: 90%
 }

 .form1 input[type=text] {
     width: 90%;
     padding: 2vh 4%;
     background-color: transparent;
     border: 1px solid #000000;
     font-size: 1.2rem;
     color: #000000;
     font-family: 'Texte';
     border-radius: 8px
 }

 .form1 .label_file {
     width: 90%;
     padding: 2vh 4%;
     background-color: transparent;
     border: 1px solid #000000;
     font-size: 1.2rem;
     color: #FFF;
     font-family: 'Texte';
     border-radius: 8px;
     text-align: center
 }

 textarea {
     width: 97%;
     padding: 2vh 1%;
     background-color: transparent;
     border: 1px solid #000000;
     font-size: 1.2rem;
     color: #FFF;
     font-family: 'Texte';
     border-radius: 8px
 }

 .label_file2 {
     width: 98%;
     padding: 2vh 4%;
     background-color: transparent;
     border: 1px solid #000000;
     font-size: 1.2rem;
     color: #FFF;
     font-family: 'Texte';
     border-radius: 8px;
     text-align: center
 }

 .bloc_multi {
     position: relative;
     width: 96vw;
     height: auto;
     overflow-x: hidden;
     margin: 0;
     padding: 2vh 2vw;
     background-color: #FFF;
     z-index: 1;
     display: flex;
     justify-content: center;
     align-items: center;
     flex-direction: row;
     flex-wrap: wrap
 }

 .bloc_multi div {
     width: 48vw;
     height: 92vh;
     text-align: center;
     margin-bottom: 3vh;
     overflow: hidden;
 }

 .bloc_multi div img {
     object-fit: cover;
     width: 47vw;
     height: 92vh;
 }

 .bloc_multi div .overimg {
     width: 48vw;
     height: 94vh;
     display: flex;
     justify-content: center;
     align-items: center;
     z-index: 2;
     margin-top: -94vh;
 }

 .overimg button {
     width: 48vw;
     height: 94vh;
     border: 10px solid #FFF;
     background-color: rgba(0, 0, 0, .3);
     text-shadow: 1px 1px 3px #000000;
     cursor: pointer;
     font-size: 2rem;
     color: #FFFFFF;
     font-family: 'Texte';
     transition: all .5s
 }

 .overimg button:hover {
     font-size: 2.2rem;
     background-color: rgba(0, 0, 0, .75)
 }

 @media (max-width:860px) {
     .bloc_multi {
         position: relative;
         width: 96vw;
         min-height: 100vh;
         height: auto;
         overflow-x: hidden;
         margin: 0;
         padding: 2vh 2vw;
         background-color: #FFF;
         z-index: 1;
         display: flex;
         justify-content: center;
         align-items: center;
         flex-direction: row;
         flex-wrap: wrap
     }

     .bloc_multi div {
         width: 96vw;
         height: 40vh;
         text-align: center;
         margin-bottom: 3vh;
         overflow: hidden
     }

     .bloc_multi div img {
         object-fit: cover;
         width: 96vw;
         height: 40vh
     }

     .bloc_multi div .overimg {
         width: 96vw;
         height: 42vh;
         display: flex;
         justify-content: center;
         align-items: center;
         z-index: 2;
         margin-top: -42vh
     }

     .overimg button {
         width: 96vw;
         height: 42vh;
         border: 10px solid #FFF;
         background-color: rgba(0, 0, 0, .3);
         text-shadow: 1px 1px 3px #000000;
         cursor: pointer;
         font-size: 1.5rem;
         color: #FFFFFF;
         font-family: 'Texte';
         transition: all .5s
     }

     .overimg button:hover {
         font-size: 1.5rem;
         background-color: rgba(0, 0, 0, .75)
     }
 }
.calendar{
    width: 100%;
    display: flex;
    flex-wrap:wrap;
    gap: 1%;
    justify-content: center;
    align-items: center;    
}
.calendar div{
    width: 45%;
    padding: 1vh 0;
    background-color: transparent;
    border: 1px solid #151515;
    border-radius: 5px;
    margin-bottom: 2vh;
    text-align: center;
         font-size: 1.5rem;
}
.calendar input[type=text]{
    width: 45%;
    padding: 1vh 0;
    background-color: transparent;
    border: 1px solid #151515;
    border-radius: 5px;
    margin-bottom: 2vh;
    text-align: center;
         font-size: 1.5rem;
}
.calendar input[type=tel]{
    width: 45%;
    padding: 1vh 0;
    background-color: transparent;
    border: 1px solid #151515;
    border-radius: 5px;
    margin-bottom: 2vh;
    text-align: center;
         font-size: 1.5rem;
}
.calendar input[type=date]{
    width: 45%;
    padding: 1vh 0;
    background-color: transparent;
    border: 1px solid #151515;
    border-radius: 5px;
    margin-bottom: 2vh;
    text-align: center;
         font-size: 1.5rem;
}
.calendar input[type=time]{
    width: 45%;
    padding: 1vh 0;
    background-color: transparent;
    border: 1px solid #151515;
    border-radius: 5px;
    margin-bottom: 2vh;
    text-align: center;
         font-size: 1.5rem;
}
.calendar input[type=datetime-local]{
    width: 45%;
    padding: 1vh 0;
    background-color: transparent;
    border: 1px solid #151515;
    border-radius: 5px;
    margin-bottom: 2vh;
    text-align: center;
         font-size: 1.5rem;
}
.calendar input[type=email]{
    width: 45%;
    padding: 1vh 0;
    background-color: transparent;
    border: 1px solid #151515;
    border-radius: 5px;
    margin-bottom: 2vh;
    text-align: center;
         font-size: 1.5rem;
}
.calendar input[type=submit]{
    width: 91%;
    padding: 2vh 0;
    background-color: #151515;
    border: 1px solid #FFFFFF;
    border-radius: 5px;
    margin-bottom: 2vh;
    text-align: center;
         font-size: 1.5rem;
         color: #FFFFFF;
}
.calendar select{
    width: 91%;
    padding: 1vh 0;
    background-color: transparent;
    border: 1px solid #151515;
    border-radius: 5px;
    margin-bottom: 2vh;
    text-align: center;
         font-size: 1.5rem;
         color: #151515;
}
.calendar textarea{
    width: 91%;
    padding: 1vh 0;
    background-color: transparent;
    border: 1px solid #151515;
    border-radius: 5px;
    margin-bottom: 2vh;
    text-align: center;
         font-size: 1.5rem;
         color: #151515;
}
 @media (max-width:860px) {
.calendar input[type=text]{
    width: 92%;
    padding: 2vh 0;
    background-color: transparent;
    border: 1px solid #151515;
    border-radius: 5px;
    margin-bottom: 2vh;
    text-align: center;
         font-size: 1.5rem;
}
.calendar input[type=tel]{
    width: 92%;
    padding: 2vh 0;
    background-color: transparent;
    border: 1px solid #151515;
    border-radius: 5px;
    margin-bottom: 2vh;
    text-align: center;
         font-size: 1.5rem;
}
.calendar input[type=date]{
    width: 92%;
    padding: 2vh 0;
    background-color: transparent;
    border: 1px solid #151515;
    border-radius: 5px;
    margin-bottom: 2vh;
    text-align: center;
         font-size: 1.5rem;
}
.calendar input[type=datetime-local]{
    width: 92%;
    padding: 2vh 0;
    background-color: transparent;
    border: 1px solid #151515;
    border-radius: 5px;
    margin-bottom: 2vh;
    text-align: center;
         font-size: 1.5rem;
}
.calendar input[type=time]{
    width: 92%;
    padding: 2vh 0;
    background-color: transparent;
    border: 1px solid #151515;
    border-radius: 5px;
    margin-bottom: 2vh;
    text-align: center;
         font-size: 1.5rem;
}
.calendar input[type=email]{
    width: 92%;
    padding: 2vh 0;
    background-color: transparent;
    border: 1px solid #151515;
    border-radius: 5px;
    margin-bottom: 2vh;
    text-align: center;
         font-size: 1.5rem;
}
.calendar input[type=submit]{
    width: 92%;
    padding: 2vh 0;
    background-color: #151515;
    border: 1px solid #FFFFFF;
    border-radius: 5px;
    margin-bottom: 2vh;
    text-align: center;
         font-size: 1.5rem;
         color: #FFFFFF;
}
 }
 .b1 {
     font-size: 1.2rem;
     background-color: transparent;
     border: none;
     color: #151515;
     transition: all .5s
 }

 .b1:hover {
     font-size: 1.2rem;
     background-color: transparent;
     border: none;
     color: #31002b;
     transition: all .5s
 }

 .audio {
     background-color: #dddddd;
     padding: 5px
 }

 .text {
     width: 90%;
     margin-left: 5%
 }

 .b2 {
     font-size: 50px;
     background-color: #151515;
     border: none;
     color: #FFFFFF;
     transition: all .5s;
     width: 75px;
     height: 75px;
     position: fixed;
     bottom: 0;
     right: 0;
     z-index: 99;
     border-top-left-radius: 8px;
     cursor: pointer
 }

 .b2:hover {
     color: #FF0000
 }

 .gonav {
     position: fixed;
     top: 0;
     left: 0;
     height: 50px;
     width: 50px;
     background-color: #FFFFFF;
     border-bottom-right-radius: 8px;
     color: #000;
     display: flex;
     justify-content: center;
     align-items: center;
     font-size: 30px;
     z-index: 10;
     cursor: pointer;
     transition: all .5s
 }

 .gonav:hover {
     font-size: 25px;
     color: #004bc4
 }
 .tosite {
     padding: 8px;
     border: 2px solid none;
     background-color: transparent;
     cursor: pointer;
     font-size: 2rem;
     color: #000000;
     font-family: 'Texte';
     transition: all .5s;
     text-decoration: none;
 }
 .tosite:hover {
    border: none;
    background-color: rgba(0, 0, 0, 1);
     color: #FFFFFF;
 }