﻿/*body/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/

body {
  margin: 0px;
  padding: 0px;
  background-size: 100%;
}
body div {
  margin: 0px;
  padding: 0px;
}

.bloc {
  position: relative;
  height: 100vh;
  width: 100%;
  overflow: hidden;
}
.bloc video {
  position: relative;
  min-width: 100%;
  min-height: 100%;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.vert {
  color: rgb(128, 0, 0);
}
.condgenevente {
  font-family: Arial;
  position: absolute;
  top: 2vh;
  width: 80vw;
  left: 5vw;
}

.bouton_valider {
  border-radius: 5px;
  background-color: grey;
  border: none;
  padding: 8px;
  margin: 10px;
  font-size: 1.5em;
  color: rgb(50, 50, 255);
  font-weight: bold;
  letter-spacing: 4px;
}
.bouton_valider_option {
  border-radius: 5px;
  padding: 6px;
  font-size: 1.3em;
  left: 80%;
  top: 70%;
  color: rgb(50, 50, 255);
  font-weight: bold;
  letter-spacing: 1px;
}
.bouton_valider_inscription {
  width: 24vw;
  color: white;
  font-size: 1.5em;
  background: blue;
  position: absolute;
  left: 70vw;
  top: 46vh;
}
.bouton_annuler {
  border-radius: 4px;
  background-color: grey;
  padding: 5px;
  font-size: 1.3em;
  color: white;
  font-weight: bold;
  letter-spacing: 4px;
}
.bouton_annuler_modif_code {
  border-radius: 4px;
  background-color: grey;
  padding: 5px;
  font-size: 1.3em;
  color: white;
  font-weight: bold;
  letter-spacing: 4px;
  position: absolute;
  top: 44vh;
  left: 31vw;
}

.bouton_retour,
.bouton_retour_validation_gestion {
  position: absolute;
  border-radius: 5px;
  background-color: grey;
  padding: 8px;
  margin: 10px;
  font-size: 1.3em;
  color: white;
  font-weight: bold;
  letter-spacing: 1px;
  font-family: arial;
  z-index: 5;
}
.bouton_retour {
  top: 95%;
  left: 84%;
}
.bouton_retour_validation_gestion {
  top: 20%;
  left: 84%;
}

.retour_option_haut {
  position: absolute;
  top: 25%;
  left: 50%;
  border-radius: 5px;
  background-color: grey;
  box-shadow: 2px 3px 4px 0px rgba(250, 250, 250, 0.8) inset,
    2px 3px 4px 1px rgba(0, 0, 0, 0.7);
  padding: 8px;
  margin: 10px;
  font-size: 1.3em;
  color: white;
  font-weight: bold;
  letter-spacing: 1px;
  font-family: arial;
  z-index: 5;
}
.retour_option_bas {
  position: absolute;
  top: 250%;
  left: 50%;
  border-radius: 5px;
  background-color: grey;
  box-shadow: 2px 3px 4px 0px rgba(250, 250, 250, 0.8) inset,
    2px 3px 4px 1px rgba(0, 0, 0, 0.7);
  padding: 8px;
  margin: 10px;
  font-size: 1.3em;
  color: white;
  font-weight: bold;
  letter-spacing: 1px;
  font-family: arial;
  z-index: 5;
}
.bouton_autre {
  display: inline-block;
  border-radius: 6px;
  background-image: -webkit-linear-gradient(
    top,
    rgb(150, 150, 200) 30%,
    rgb(220, 220, 250) 100%
  );
  box-shadow: 1px 1px 4px 3px rgba(250, 250, 250, 0.8) inset,
    2px 3px 4px 1px rgba(0, 0, 0, 0.7);
  text-shadow: 1px 1px 5px rgba(0, 0, 0, 0.7);
  padding: 6px;
  margin: 14px;
  font-size: 1.1em;
  font-weight: bold;
}
.bouton_autre a {
  color: rgb(75, 75, 255);
}
.bouton_connexion:hover,
.bouton_valider:hover,
.bouton_valider_option:hover,
.bouton_annuler:hover,
.bouton_autre:hover {
  background-image: -webkit-linear-gradient(
    top,
    rgb(200, 200, 200) 50%,
    rgb(255, 255, 255) 100%
  );
}
.bouton_connexion:active,
.bouton_valider:active,
.bouton_valider_option:active,
.bouton_annuler:active,
.bouton_autre:active {
  box-shadow: 1px 2px 2px 0px rgba(250, 250, 250, 0.8) inset,
    0px 1px 1px rgba(0, 0, 0, 0.7);
}

.petitlogo {
  height: 30px;
  display: inline-block;
  vertical-align: middle;
  margin: 10px;
}
.petitlogo:hover {
  box-shadow: 0px 0px 8px 4px rgba(250, 250, 250, 0.5);
  background-color: rgba(250, 250, 250, 0.6);
}
.fleche {
  padding: 4px;
  margin: 0px 40px;
}
.fleche:hover {
  border-radius: 12px;
  box-shadow: 0px 0px 8px 4px rgba(220, 200, 50, 0.5);
  background-color: rgba(220, 200, 50, 0.6);
}
.doublefleche {
  padding: 4px;
  margin: 0px 40px;
}
.doublefleche:hover {
  border-radius: 12px;
  box-shadow: 0px 0px 8px 4px rgba(220, 200, 50, 0.5);
  background-color: rgba(220, 200, 50, 0.6);
}
.main {
  height: 40px;
  display: inline-block;
  vertical-align: middle;
  margin: 10px;
}
.warning_g {
  height: 100px;
  display: inline-block;
  vertical-align: middle;
  margin: 10px;
}
.warning_g + p {
  display: inline-block;
  vertical-align: middle;
  width: 55%;
}
h1 {
  text-align: center;
  font-family: arial;
  font-size: 2em;
}
.option {
  position: absolute;
  top: 16%;
}
.recherche {
  position: absolute;
  top: 15vh;
  left: 35vw;
}
.text_membre {
  display: inline-block;
  padding: 10px;
  font-family: arial;
  vertical-align: top;
}
.taille_tab_gestion_compte {
  width: 100%;
}
.tableau_dispo,
.tableau_dispo_gestion {
  position: absolute;
  display: inline-block;
  text-align: center;
  padding: 10px;
  font-family: arial;
  vertical-align: top;
}
.calendrier_dispo {
  font-size: 1vw;
}

.tableau_gestion {
  top: 25%;
}

.tableau_dispo_gestion {
  top: 25%;
  width: 40%;
  left: 43vw;
}

.gestion {
  position: absolute;
  top: 21%;
}
.niveau {
  font-size: 1vw;
}
.type_de_compte {
  font-size: 1vw;
}
.presentation {
  position: absolute;
  top: 25vh;
  left: 1vw;
  width: 100vw;
}

.page_muscu {
  display: flex;
  flex-direction: column;
}

.titremusculation {
  position: absolute;
  left: 0%;
  top: 200px;
  width: 100%;
}

.le_squash {
  position: absolute;
  width: 100vw;
  top: 20vh;
}
.annulation {
  position: absolute;
  top: 21%;
  width: 100%;
  text-align: center;
  font-family: arial;
  font-size: 2.6em;
}
.reservation {
  position: absolute;
  top: 19vh;
  left: 1vw;
  width: 50%;
  text-align: center;
  font-family: arial;
  font-size: 1 em;
}
.vous_reservez {
  position: absolute;
  top: 30vh;
  left: 15vw;
  width: 70vw;
  text-align: center;
  font-family: arial;
  font-weight: bold;
  font-size: 1.5em;
}
.validez_reservation {
  position: absolute;
  top: 22vh;
  left: 0vw;
  width: 74vw;
}
.position_bouton_valider {
  border-radius: 5px;
  padding: 3px;
  margin: 0px;
  left: 5vw;
  position: absolute;
  top: 8vh;
  font-size: 1.5em;
  color: rgb(50, 50, 255);
  font-weight: bold;
  letter-spacing: 4px;
  border: none;
}
.retour_recherche {
  position: absolute;
  top: 19vh;
  left: 80vw;
}

.position_bouton_annuler {
  position: absolute;
  top: 25%;
  left: 80%;
}
.position_bouton_annuler_squash {
  position: absolute;
  top: 9vh;
  left: 56vw;
}
.taille_selecteur {
  height: 4vh;
  width: 6vw;
}
.taille_checkbox {
  width: 2vw;
  height: 2vw;
}
.si_vous_invitez {
  position: absolute;
  top: 93%;
  left: -10;
  width: 120%;
  text-align: center;
  font-family: arial;
  font-size: 1 em;
}
h3 {
  display: inline-block;
  font-size: 1.7em;
}
.pseudo {
  display: inline-block;
  font-size: 1em;
}
h4 {
  display: inline-block;
  margin: 8px;
  font-size: 10 px;
}
h5 /*pour le text_option*/ {
  display: inline-block;
  font-size: 1.5em;
  width: 100%;
  font-family: arial;
  margin: 1px 6px 14px 2px;
  text-align: center;
}
.les_membres {
  position: absolute;
  top: -5%;
  left: 1%;
}
.code_de_la_porte {
  position: absolute;
  top: 10%;
  left: 10%;
}
.option_de_tri {
  position: absolute;
  left: 32vw;
  top: 23vh;
}
a {
  text-decoration: none;
  font-size: 1.1em;
}

p {
  text-decoration: none;
  font-size: 1em;
}
.reservations {
  top: 65%;
  left: 14%;
}
.modification_effectuee {
  top: 10%;
  left: 80%;
}
.nombre_membres {
  position: relative;
  top: 0%;
  text-decoration: none;
  font-size: 1.1em;
}

.valider_inscription {
  position: fixed;
  top: -7%;
  right: 95%;
  font-size: 1.1em;
}
.retour_valider {
  position: absolute;
  top: 25%;
  z-index: 5;
  right: 15%;
  font-size: 0.8em;
}
.retour_membres {
  width: 100%;
  position: absolute;
  top: 91%;
  left: 82%;
}
.leçons,
.squash_regles,
.squash_facile {
  position: absolute;
  margin: 27px;
  font-size: 1.4em;
  text-decoration: none;
  font-family: arial;
  width: 50vw;
}
.leçons {
  top: 44vh;
}

.squash_regles {
  top: 60vh;
}

.squash_facile {
  top: 30vh;
}
.image_squash2 {
  position: absolute;
  top: 27vh;
  left: 65vw;
}

mark {
  text-decoration: underline;
  background-color: transparent;
}
.background_image {
  margin: 0px;
  padding: 0px;
  position: absolute;
  background-image: url("images/GYM 2F.jpg");
  width: 100vw;
  background-size: 100vw;
}

.background_imageF {
  margin: 0px;
  padding: 0px;
  position: absolute;
  background-image: url("images/GYM 1F.jpg");
  background-repeat: repeat;
  width: 100vw;
  background-size: 100vw;
}

.image_muscu {
  margin: 0px;
  padding: 0px;
  position: relative;
  top: 0px;
  left: 0px;
  background-image: url("images/GYM2.jpg");
  background-repeat: no-repeat;
  height: 100%;
  background-size: 50%;
}
.imgmuscu {
  z-index: -1;
  margin: 20%;
  padding: 0px;
  position: relative;
  bottom: 37%;
  left: 66%;
  height: 100%;
}

.post-it {
  background-color: rgb(99, 157, 253);
  border-radius: 50%;
  padding: 15px;
  position: absolute;
  top: 50px;
  z-index: 5;
  font-family: arial;
  font-style: italic;
  font-weight: bold;
  text-align: center;
  font-size: 1.3em;
}

.galerie {
  display: inline-block;
  width: 35%;
  text-align: right;
}

.galeriemuscu > img {
  width: 26%;
  box-shadow: 4px 4px 8px black;
  margin: 35px;
  position: absolute;
  top: 300px;
  left: 60vw;
}

.galeriesquash > img {
  position: absolute;
  width: 19vw;
  top: 28vh;
  left: 71vw;
}
.galeriecoaching {
  width: 51%;
}
.galeriecoaching > img {
  display: inline-block;
  vertical-align: middle;
  width: 40vw;
  box-shadow: 4px 4px 8px black;
  margin: 5px;
  position: absolute;
  top: 32vh;
  left: 55vw;
}
.coach {
  position: absolute;
  top: 20vh;
  width: 100vw;
}
.texte_coach {
  position: absolute;
  top: 29vh;
  padding: 40px;
  width: 50vw;
  font-size: 1.4vw;
  text-align: justify;
  font-family: Arial;
  vertical-align: top;
}

.galeriedcoaching1 > img {
  display: inline-block;
  vertical-align: middle;
  max-height: 27%;
  max-width: 23%;
  box-shadow: 4px 4px 8px black;
  margin: 5px;
  position: absolute;
  top: 270px;
  left: 900px;
}

.galerie > img {
  display: inline-block;
  vertical-align: middle;
  max-height: 55%;
  max-width: 120%;
  box-shadow: 4px 4px 8px black;
  margin: 5px;
}
.videopresentation {
  display: inline-block;
  position: absolute;
  top: 40vh;
  left: 57vw;
  z-index: -1;
  width: 42%;
}

.videocrossfit {
  display: inline-block;
  position: absolute;
  top: 35vh;
  left: 57vw;
  z-index: 2;
  width: 39vw;
}

.non_modifiable /*donnée non modifiable melanger avec des modifiables*/ {
  background-color: rgb(235, 235, 235);
  border: 1px solid rgb(175, 175, 175);
}
.block_text1,
.block_recherche_partenaire,
.block_text_gestion_compte {
  position: absolute;
  font-family: arial;
}
.block_text1 {
  top: 32vh;
  left: 25vw;
}
.block_recherche_partenaire {
  top: 27vh;
}
.gestion_du_compte {
  position: absolute;
  top: 18vh;
  left: 42vw;
}
.block_text_gestion_compte {
  top: 25%;
  width: 94.5%;
  left: 2vw;
}
.cadre_gestion_membres {
  position: absolute;
  top: 30%;
  width: 97.5%;
  border-radius: 10px;
  background-color: rgba(214, 214, 214, 0.8);
  padding: 20px;
  font-family: arial;
  margin: 50px 0px;
  box-shadow: 2px 2px 6px black inset;
}
.block_text2 /*conteneur de plusieur zone de texte*/ {
  position: absolute;
  width: 100%;
  font-family: Arial;
  padding: 20px;
  margin: 0px 0px;
}
.block_text3 /*conteneur de plusieur zone de texte de couleur inverse a block_text1*/ {
  display: inline-block;
  position: absolute;
  top: 76%;
  left: 1%;
  border-radius: 10px;
  background-color: rgba(250, 250, 250, 0.8);
  font-family: arial;
  box-shadow: 1px 1px 6px rgba(0, 0, 0, 0.5) inset,
    4px 4px 6px rgba(0, 0, 0, 0.5);
}
.tab_dispo {
  position: absolute;
  top: 0vh;
  left: 62vw;
  width: 59vh;
}
.text1 /*zone de texte 1/3 d'ecran*/ {
  position: absolute;
  top: 125%;
  padding: 40px;
  width: 45%;
  font-size: 1.1em;
  text-align: justify;
  font-weight: bold;
  font-family: Arial;
  vertical-align: top;
}
.texte_presentation {
  position: absolute;
  top: 43vh;
  padding: 16px;
  width: 50%;
  font-size: 1.5em;
  left: 2%;
  text-align: justify;
  font-family: Arial;
  vertical-align: top;
}

.texte_cross_training {
  position: relative;
  padding: 40px;
  width: 50vw;
  font-size: 1.4em;
  text-align: justify;
  font-family: Arial;
  vertical-align: top;
  top: 27vh;
}
.leçons_cours {
  position: absolute;
  top: 20vh;
  width: 100vw;
}

.cours_squash {
  position: absolute;
  top: 27vh;
  padding: 40px;
  width: 50vw;
  font-size: 1.4em;
  text-align: justify;
  font-family: Arial;
  vertical-align: top;
}
.planning_gym {
  position: fixed;
  top: 187px;
  left: -11%;
}
.cours_co {
  position: absolute;
  top: 24vh;
  left: 10vw;
}
.texte_cours_co {
  position: absolute;
  top: 32vh;
  padding: 40px;
  font-size: 1.1em;
  text-align: justify;
  font-family: Arial;
  vertical-align: top;
}
.tab_activites {
  width: 45%;
}
.col_logo {
  width: 10%;
}
.col_texte_activite {
  width: 85%;
}
.galeriegym > img {
  width: 40vw;
  box-shadow: 4px 4px 8px black;
  position: absolute;
  top: 34vh;
  left: 55vw;
}
.musculation {
  position: absolute;
  top: 36vh;
  padding: 5px;
  left: 2%;
  width: 51%;
  font-size: 1.5vw;
  text-align: center;
  font-family: Arial;
}

.cross_training {
  position: absolute;
  top: 20vh;
  width: 100vw;
}
.validez_annulez {
  position: absolute;
  top: 58%;
  left: 25%;
  padding: 40px;
  width: 45%;
  font-size: 1.1em;
  text-align: center;
  font-weight: bold;
  font-family: Arial;
  vertical-align: top;
}
.vous_annulez {
  position: absolute;
  top: 30%;
  left: 24%;
  padding: 40px;
  width: 45%;
  font-size: 1.1em;
  text-align: center;
  font-weight: bold;
  font-family: Arial;
  vertical-align: top;
}
.vous_invitez {
  position: absolute;
  top: 30%;
  left: 24%;
  padding: 40px;
  width: 45%;
  font-size: 1.1em;
  text-align: center;
  font-weight: bold;
  font-family: Arial;
  vertical-align: top;
}

.reservation_effectuee {
  display: none;
  width: 100%;
  font-size: 1em;
  text-align: center;
  font-weight: bold;
  margin: 10px;
}
.tableau_partenaires {
  display: block;
  width: 100%;
  font-size: 1em;
  text-align: center;
  font-weight: bold;
  margin: 10px;
}
.calendrier {
  display: block;
  position: relative;
}
.liste_joueurs_dispos {
  font-size: 1vw;
}
.style_colonne2 {
  border-right: 5px double black;
}

.consignes_reservation /*zone texte demi ecran*/ {
  position: absolute;
  top: 19vh;
  left: 5%;
  width: 85%;
  text-align: center;
  font-weight: bold;
  font-family: Arial;
}
.text3 /*zone texte demi ecran*/ {
  display: inline-block;
  position: absolute;
  top: 100%;
  left: 7%;
  width: 85%;
  padding: 10px;
  margin: 0px 80px 0px 0px;
  font-size: 1em;
  text-align: justify;
  font-weight: bold;
  font-family: Arial;
  vertical-align: top;
}
.selectionnez {
  font-size: 1em;
}

.text3_r {
  display: inline-block;
  position: absolute;
  top: 11vh;
  left: 2%;
  padding: 5px;
  margin: 0px;
  font-size: 1em;
  font-family: arial;
  vertical-align: middle;
  border: 3px solid white;
  border-radius: 11px;
  background-image: -webkit-linear-gradient(
    top,
    rgb(200, 200, 200) 30%,
    rgb(180, 180, 250) 100%
  );
}
.nombreticketsrestants {
  display: inline-block;
  position: absolute;
  top: 175%;
  padding: 5px;
  margin: 0px;
  font-size: 1em;
  text-align: justify;
  font-weight: bold;
  font-family: arial;
  vertical-align: middle;
  border: 3px solid white;
  border-radius: 2px;
  box-shadow: 2px 2px 5px 3px black, 0px 0px 6px 1px white inset;
  background-image: -webkit-linear-gradient(
    top,
    rgb(200, 200, 200) 30%,
    rgb(180, 180, 250) 100%
  );
}

.text4 /*zone de texte de 31 % caler a gauche*/ {
  padding: 3px;
  vertical-align: top;
  position: absolute;
  top: -4px;
  left: 3%;
}

.text4_r /*zone de texte de 35% caler a droite*/ {
  display: inline-block;
  width: 35%;
  font-weight: bold;
  font-size: 1.4em;
  padding: 2px;
  vertical-align: top;
  text-align: right;
}
.text5 /*recherche membre salle*/ {
  padding: 3px;
  vertical-align: top;
  position: absolute;
  top: -4px;
}
.recherche_membres {
  padding: 3px;
  vertical-align: top;
  position: relative;
}
.text_option /*zone de texte 100% aligner sur la gauche*/ {
  display: block;
  width: 100%;
  font-size: 1em;
  font-family: arial;
  text-align: left;
  font-weight: bolder;
  padding: 0px 6px 6px 4px;
  margin: 10px auto;
  border: 2px solid black;
  border-radius: 4px;
}
.text_option p {
  padding-left: 20px;
}
.text_option form {
  padding-left: 20px;
}
.formulaire_admin {
  display: block;
  width: auto;
  margin: 20px;
  padding: 15px;
  font-size: 1em;
  border: 3px solid black;
  border-radius: 20px;
}
.formulaire_admin select {
  font-size: 22px;
}
.message {
  display: block;
  width: 100%;
  font-size: 1em;
  text-align: center;
  margin: auto;
  border: 2px solid black;
  border-radius: 8px;
  background-color: rgb(255, 200, 200);
}
.si_votre {
  top: 100%;
}
.carte {
  display: block;
  margin: auto;
  border: 2px solid black;
  box-shadow: 6px 6px 10px black;
}
.text_center {
  width: 100%;
  font-family: arial;
  top: 41vh;
  left: 0vw;
  text-align: center;
  position: absolute;
}
.option_inline {
  display: inline-block;
  vertical-align: middle;
  margin: 8px;
}
.check_box {
  width: 3vw;
}
.puce_colorer {
  width: 20px;
  height: 15px;
}
.boutonModifierCodePersonnel {
  border: 1px solid black;
  border-radius: 6px;
  background-color: rgb(180, 180, 180);
  padding: 1px;
  display: block;
  text-align: center;
  color: black;
  font-size: 1.2em;
}
/*    SCROLLER////////////////////*/
.scroll-container {
  display: flex;
  align-items: center;
  overflow: hidden;
  width: 80%;
  margin: 20 px auto;
  border: 1px solid #ccc;
  position: relative;
}
.scroll-button {
  background-color: #4caf50;
  border: none;
  color: white;
  padding: 10px;
  cursor: pointer;
  font-size: 24px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 1;
}
#leftArrow {
  left: 0;
}
#rightArrow {
  right: 0;
}
.scrolL-content {
  display: flex;
  overflow-x: auto;
  scroll-behavior: smooth;
  width: 100%;
}

/*footer/////////////////////////////////////////////////////////////////////////////////////////////////////////////*/

footer {
  color: black;
  font-family: arial;
  text-align: center;
  position: absolute;
  width: 70%;
  top: 385vh;
  left: 10vw;
}

.adresse {
  line-height: 25px;
}

.body_footer {
  background-color: rgb(0, 0, 0, 0.5);
  color: white;
  position: fixed;
  width: 100%;
  bottom: 0%;
  left: 0px;
  text-align: center;
  font-family: arial;
  font-weight: bold;
  font-size: 25px;
  letter-spacing: 0.2vw;
}
.mentionslegales {
  bottom: -228%;
}

.grande_checkbox {
  transform: scale(1.5);
}
.modification_code {
  font-size: 1em;
  position: absolute;
  top: 20vh;
  font-family: arial;
  left: 50vh;
}

@media only screen and (max-width: 1000px) and (orientation: portrait) {
  .fleche {
    padding: 4px;
    margin: 0px 15px;
  }
  .doublefleche {
    display: none;
  }
  .bloc {
    height: 100vh;
    width: 324%;
    z-index: -2;
    position: relative;
  }
  .largeur_body {
    width: 38%;
  }
  footer {
    width: 100%;
    left: 8vw;
    top: 350vh;
  }

  .adresse {
    font-size: 16px;
    position: absolute;
    left: 0%;
    width: 83%;
    top: -51vh;
  }

  .text1 {
    display: block;
    padding: 10px;
    margin: 10%;
    width: 91%;
    height: 121%;
    font-size: 2.5em;
    top: 85%;
    left: 1%;
    z-index: -1;
  }
  .leçons_cours {
    top: 11vh;
    left: 10vw;
    font-size: 1.2em;
  }
  .cours_squash {
    top: 12vh;
    left: 0%;
    vertical-align: top;
    width: 24%;
    font-size: 1em;
  }

  .musculation {
    top: 49vh;
    width: 96vw;
    font-size: 1em;
    z-index: -1;
  }
  .cross_training {
    top: 200px;
    left: -25%;
    font-size: 8vw;
  }

  .texte_cross_training {
    width: 40%;
    font-size: 2vw;
    top: 21vh;
    left: 2%;
  }

  .text4 {
    left: 42%;
  }

  .videopresentation {
    width: 90vw;
    display: block;
    left: 5vw;
    top: 24vh;
    z-index: -1;
  }

  .background_image,
  .background_imageF {
    margin: 0px;
    padding: 0px;
  }
  .background_image {
    width: 100vw;
    background-size: 100vw;
  }
  .background_imageF {
    width: 100vw;
    background-size: 200vw;
  }
  .galeriemuscu > img {
    top: 11vh;
    left: 7vw;
    width: 65vw;
    z-index: -1;
  }
  .galeriesquash > img {
    top: 64vh;
    left: 20vw;
    width: 20%;
  }
  .galeriegym > img {
    top: 20vh;
    left: 10vw;
    width: 80vw;
    z-index: -1;
  }
  .cours_co {
    top: 8vh;
    left: 10vw;
    width: 80vw;
    font-size: 1.3em;
  }
  .tab_activites {
    width: 96%;
  }
  .col_logo {
    width: 10%;
  }
  .col_texte_activite {
    width: 85%;
  }
  .texte_cours_co {
    top: 45vh;
    width: 90vw;
    left: -7vw;
    font-size: 0.8em;
    z-index: -1;
  }
  .galeriecoaching {
    width: 51%;
  }

  .galeriecoaching > img {
    top: 15vh;
    left: 2vh;
    width: 84vw;
    z-index: -1;
  }
  .coach {
    top: 9vh;
    width: 100vw;
    font-size: 1.2em;
    z-index: -1;
  }
  .texte_coach {
    top: 47vh;
    width: 93vw;
    left: 0vw;
    font-size: 0.6em;
    padding: 3vw;
  }
  .videocrossfit {
    top: 169%;
    left: 5%;
    width: 1100px;
    z-index: -1;
  }

  .le_squash {
    left: 7%;
    top: 10vh;
    font-size: 2em;
  }

  .squash_facile,
  .squash_regles,
  .leçons {
    left: 1vw;
  }

  .squash_facile {
    top: 16vh;
    font-size: 1em;
    width: 88%;
  }
  .squash_regles {
    top: 47vh;
    font-size: 4vw;
    width: 28%;
    left: 0vw;
  }
  .leçons {
    top: 31vh;
    font-size: 1em;
    width: 88%;
  }
  .image_squash2 {
    width: 46%;
    top: 59vh;
    left: 44%;
  }
  .presentation {
    top: 12vh;
    left: 4vw;
    width: 90vw;
    font-size: 1em;
  }

  .texte_presentation {
    top: 45vh;
    width: 90vw;
    font-size: 1em;
    left: 1vw;
  }

  .titremusculation {
    z-index: -1;
    top: 10vh;
    width: 100vw;
    font-size: 1em;
  }

  .retour_option_haut {
    display: none;
  }
  .retour_option_bas {
    top: 310vh;
    left: 32vw;
  }
  .block_text1 {
    left: 6%;
    width: 79%;
    top: 32vh;
    font-size: 2vh;
  }
  .block_recherche_partenaire {
    top: 4vh;
    left: 5vw;
    width: 96%;
  }
  .option {
    display: none;
  }
  .post-it {
    font-size: 2.5em;
    height: 94%;
    padding: 31px;
    width: 17%;
  }

  .selectionnez {
    display: none;
  }
  /* gestions des membres*/
  .boutonModifierCodePersonnel {
    font-size: 2em;
  }

  .cadre_gestion_membres {
    top: 16vw;
    width: 89%;
  }
  .gestion {
    display: NONE;
  }
  .niveau {
    font-size: 1vw;
  }
  .type_de_compte {
    font-size: 1vw;
  }
  .les_membres {
    display: none;
  }
  .recherche_membres {
    font-size: 4vw;
  }
  .text_membre {
    font-size: 2vw;
  }
  .champs_formulaire {
    font-size: 4vw;
  }
  .text_tableau_gestion_compte {
    font-size: 255%;
  }
  .text_saisie_gestion_compte {
    font-size: 46%;
  }
  .text_option {
    font-size: 1em;
  }
  .text_option p {
    padding-left: 20px;
  }
  .text_option form {
    font-size: 5vw;
  }

  .retour_valider {
    top: 21%;
    right: 21%;
  }
  .bouton_valider_option {
    width: 45vw;
    position: absolute;
    height: 5vh;
    top: 292vh;
    left: 22vw;
  }
  .bouton_valider_code {
    position: absolute;
    height: 5vh;
    top: 51vh;
    left: 1vw;
  }
  .bouton_valider_inscription {
    font-size: 1em;
    left: 25vw;
    height: 4vh;
    width: 45vw;
    top: 130vh;
  }
  .retour_membres {
    left: 69vw;
    top: 9vh;
  }
  .valider_inscription {
    top: -122vh;
    left: -16vw;
    font-size: 0.8em;
  }
  .text3_r /*nombre de tickets restants*/ {
    top: 106vh;
    left: -2%;
    width: 100%;
  }
  .text3  /*explications pour réservation*/ {
    left: -3%;
    width: 100%;
    top: 120vh;
  }
  h3 {
    display: inline-block;
    font-size: 1.7em;
  }
  .gestion_du_compte {
    top: 9vh;
    font-size: 1.5em;
    left: 27vw;
  }
  .bouton_retour {
    top: 134vh;
    left: 63vw;
    font-size: 3em;
  }
  .bouton_retour_validation_gestion {
    top: 15vh;
    left: 40vw;
    font-size: 1em;
  }
  .block_text_gestion_compte {
    top: 17%;
    width: 82%;
    left: 6vw;
  }
  .taille_tab_gestion_compte {
    width: 100%;
  }
  .tableau_dispo {
    top: 100%;
    left: 5%;
    font-size: 4.5vw;
  }
  .calendrier_dispo {
    font-size: 3vw;
    text-align: center;
  }
  .tableau_dispo_gestion {
    top: 100vh;
    left: 0vw;
  }
  .grande_checkbox {
    transform: scale(2);
  }

  .pseudo {
    display: inline;
    font-size: 1em;
    color: green;
  }
  .recherche {
    display: none;
  }
  .option_de_tri {
    display: none;
  }
  .option_inline {
    display: inline-block;
    vertical-align: middle;
    font-size: larger;
  }
  .taille_selecteur {
    height: 3vh;
    width: 9vw;
  }
  .taille_checkbox {
    width: 9vw;
    height: 5vw;
    margin: 0vw;
  }
  .tab_dispo {
    top: -28vh;
    left: 0vw;
    font-size: 3vw;
    width: 89vw;
  }
  .liste_joueurs_dispos {
    font-size: 3vw;
    top: 4vh;
    left: -11vw;
    position: absolute;
  }
  .tableau_partenaires {
    position: absolute;
    top: 37vh;
  }
  .retour_recherche {
    top: 11vh;
    left: 2vw;
  }
  .reservation {
    display: none;
  }
  .vous_reservez {
    top: 19vh;
    font-size: 5vw;
    left: 10vw;
    width: 80vw;
  }
  .validez_reservation {
    width: 81vw;
    left: 10vw;
    top: 20vh;
  }
  .formulaire_admin {
    height: 50vh;
    width: 65vw;
    left: -10vw;
    top: -3vh;
    position: absolute;
  }
  .formulaire_admin select {
    font-size: 1em;
  }
  .si_vous_invitez {
    top: 23vh;
    left: 0vw;
    font-size: 0.9em;
    line-height: 5vh;
    width: 60vw;
  }
  .message {
    top: 19vh;
    font-size: 4vw;
    position: absolute;
  }
  .position_bouton_valider {
    left: 13vw;
    top: 48vh;
    font-size: 1em;
    width: 36vw;
  }
  .position_bouton_annuler_squash {
    left: 17vw;
    top: 56vh;
  }
  .annulation {
    display: none;
  }
  .vous_annulez {
    width: 86%;
    font-size: 6vw;
    left: 1vw;
    top: 1vh;
  }
  .position_annuler_annulation_squash {
    top: 67vh;
    left: 19vw;
    position: absolute;
  }
  .bouton_valider {
    font-size: 5vw;
    position: ABSOLUTE;
    margin: 0vh;
    left: 0vw;
    top: 47vh;
  }
  .bouton_annuler {
    font-size: 5vw;
    letter-spacing: 4px;
  }
  .nombreticketsrestants {
    position: fixed;
    top: 21%;
    right: 25%;
    font-size: 2em;
  }
  .validez_annulez {
    position: absolute;
  }
  .taille_preference {
    font-size: 1em;
  }

  .petitlogo {
    height: 4vw;
  }
  .main {
    height: 4vh;
    margin-right: 0vw;
  }
  .text_center {
    top: 10vh;
    left: 0vw;
  }
  .modification_code {
    top: 11vh;
    left: 12vh;
  }
  .bouton_annuler_modif_code {
    top: 58vh;
    left: 39vw;
  }
}

@media only screen and (max-width: 1000px) and (orientation: landscape) {
  .petitlogo {
    height: 4vw;
  }
  .doublefleche {
    padding: 8px;
    margin: 0px 40px;
  }
  .doublefleche:hover {
    border-radius: 12px;
    box-shadow: 0px 0px 8px 4px rgba(220, 200, 50, 0.5);
    background-color: rgba(220, 200, 50, 0.6);
  }
  .main {
    height: 10vh;
    margin-right: 4vw;
  }

  footer div {
    font-size: 1.2em;
    text-decoration: none;
    color: white;
    font-weight: bold;
    width: 92%;
  }

  .bloc {
    height: 150vh;
    width: 128vw;
  }

  .bloc video {
    position: relative;
    min-width: 100%;
    min-height: 100%;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }

  footer {
    display: none;
  }

  .boutonModifierCodePersonnel {
    font-size: 1em;
  }
  .bouton_valider_option {
    position: relative;
    top: 353vh;
    left: 70vw;
  }
  .bouton_valider_code {
    position: relative;
    top: 36vh;
    left: 12vw;
  }
  .bouton_valider_inscription {
    font-size: 1.5em;
    left: 63vw;
    top: 190vh;
    width: 34vw;
  }
  .text_option {
    width: 94vw;
  }
  .champs_formulaire {
    width: 30vw;
  }
  .text1 {
    display: block;
    padding: 10px;
    margin: 10%;
    width: 91%;
    height: 121%;
    font-size: 2.5em;
    text-align: justify;
    font-weight: bold;
    font-family: Arial;
    top: 85%;
    left: 1%;
    z-index: -1;
  }
  .cours_squash {
    top: 83%;
    left: 5%;
    width: 46%;
    font-size: 2.5em;
    vertical-align: top;
  }
  .musculation {
    top: 13vh;
    left: 5vw;
    width: 55vw;
    font-size: 0.9em;
  }
  .cross_training {
    font-size: 7vw;
    top: 200px;
    left: 0%;
  }
  .texte_cross_training {
    width: 32%;
    font-size: 4vw;
    top: 400px;
    left: 4%;
  }

  .text4 {
    left: 42%;
  }

  .background_image {
    margin: 0px;
    padding: 0px;
    position: absolute;
    background-image: url("images/GYM 1.jpg");
    background-repeat: no-repeat;
    width: 100%;
    background-size: 174%;
    left: -20px;
  }
  .background_imageF {
    margin: 0px;
    padding: 0px;
    position: absolute;
    background-image: url("images/GYM 1F.jpg");
    width: 100vw;
    background-size: 100vw;
    top: 14%;
  }
  .galeriemuscu > img {
    top: 9vh;
    left: 60vw;
    width: 30vw;
    z-index: -1;
  }
  .galeriesquash > img {
    top: 60vh;
    left: 166vw;
    width: 33%;
  }
  .galeriegym > img {
    top: 32vh;
    left: 62vw;
    width: 35vw;
  }
  .cours_co {
    top: 12vh;
    left: 14vw;
    font-size: 1.5em;
    width: 80vw;
  }
  .tab_activites {
    width: 60vw;
  }
  .col_logo {
    width: 10%;
  }
  .col_texte_activite {
    width: 85%;
  }
  .texte_cours_co {
    top: 26vh;
    left: 0vw;
    padding: 0px;
    font-size: 0.8em;
  }
  .galeriecoaching > img {
    top: 40vh;
    left: 62vw;
    width: 36vw;
  }
  .coach {
    top: 11vh;
    left: 23vw;
    font-size: 1.5em;
    z-index: -1;
  }
  .texte_coach {
    top: 16vh;
    width: 55vw;
    left: -2vw;
    font-size: 0.9em;
  }

  .videocrossfit {
    top: 56ch;
    left: 170ch;
    width: 1373px;
    z-index: -1;
  }

  .le_squash {
    left: 1vw;
    top: 1vh;
  }

  .squash_facile,
  .squash_regles,
  .leçons {
    width: 43%;
    font-weight: 300;
    left: 4%;
  }

  .squash_facile {
    top: 13vh;
    font-size: 1em;
    width: 60%;
  }
  .squash_regles {
    top: 70vh;
    font-size: 1em;
  }
  .leçons {
    top: 34vh;
    font-size: 1em;
  }
  .image_squash2 {
    width: 24%;
    top: 7vh;
    left: 72%;
  }
  .presentation {
    top: 10vh;
    left: 11vw;
    font-size: 1em;
    width: 78vw;
  }

  .texte_presentation {
    top: 18vh;
    width: 52vw;
    font-size: 0.8em;
    left: 0vw;
  }
  .videopresentation {
    width: 40vw;
    left: 57vw;
    top: 15vw;
    z-index: -1;
  }
  .titremusculation {
    display: none;
  }

  .block_text1 {
    top: 48vh;
    left: 26vw;
  }
  .retour_option_haut {
    font-size: 1em;
    top: 40vh;
    left: 80vw;
  }
  .retour_option_bas {
    font-size: 1em;
    top: 622vh;
    left: 20vw;
  }

  .post-it {
    font-size: 2.5em;
    height: 94%;
    padding: 31px;
    width: 17%;
  }
  .option {
    display: none;
  }

  .selectionnez {
    display: none;
  }
  /* gestions des membres*/

  .cadre_gestion_membres {
    top: 11vh;
    width: 93vw;
    left: 1vw;
  }
  .gestion {
    display: none;
  }
  .niveau {
    font-size: 1vw;
  }
  .type_de_compte {
    font-size: 1vw;
  }

  .les_membres {
    display: NONE;
  }
  .liste_membres {
    font-size: 1em;
  }
  .recherche_membres {
    font-size: 1em;
  }
  .text_membre {
    font-size: 50%;
    width: 100%;
  }
  .text_tableau_gestion_compte {
    font-size: 2em;
  }
  .text_saisie_gestion_compte {
    font-size: 1em;
  }
  .text_option p {
    padding-left: 20px;
  }
  .text_option form {
    padding-left: 20px;
  }

  .retour_valider {
    top: 21%;
    right: 21%;
  }
  .retour_membres {
    top: 42vh;
  }
  .valider_inscription {
    bottom: 0vh;
    left: 0vw;
    position: absolute;
  }
  .text3_r /*zone texte demi ecran, décaler sur la droite*/ {
    left: 180vw;
    top: 85vh;
  }
  .text3 {
    width: 50%;
    top: 73vh;
  }
  h3 {
    display: inline-block;
    font-size: 1.7em;
  }
  .gestion_du_compte {
    display: none;
  }
  .bouton_retour {
    top: 325%;
    left: 165%;
    font-size: 3em;
  }
  .bouton_retour_validation_gestion {
    top: 50vh;
    left: 81vw;
    font-size: 1em;
  }
  .block_text_gestion_compte {
    top: 29vh;
    width: 93%;
    left: 4vw;
    font-size: 0.8em;
  }
  .taille_tab_gestion_compte {
    width: 100%;
  }
  .tableau_dispo {
    top: 59%;
    left: 14%;
    line-height: 22vh;
  }
  .tableau_dispo_gestion {
    top: 126vh;
    left: 0vw;
  }
  .pseudo {
    display: inline;
    font-size: 1em;
    color: green;
  }
  .recherche {
    top: 24vh;
    left: 20vw;
    font-size: 3vw;
    z-index: 1;
  }
  .option_de_tri {
    display: none;
  }
  .taille_selecteur {
    height: 6vh;
    top: -2vh;
    width: 7vw;
    position: relative;
  }
  .taille_checkbox {
    width: 3vw;
    height: 5vw;
  }
  .calendrier {
    font-size: 0.4em;
  }
  .calendrier_dispo {
    font-size: 2vw;
  }
  .tab_dispo {
    top: 0vh;
    left: 0vw;
  }
  .liste_joueurs_dispos {
    font-size: 2vw;
    position: absolute;
    left: 48vw;
  }
  .option_inline {
    width: 46vw;
  }
  .tableau_partenaires {
    position: absolute;
    top: 0vh;
    left: 0vw;
  }
  .retour_recherche {
    top: 28vh;
    left: 84vw;
    z-index: 1;
  }
  .block_recherche_partenaire {
    top: 37vh;
    width: 112%;
    height: 200%;
    padding: 0px;
  }
  .reservation {
    display: none;
  }
  .vous_reservez {
    top: 15vh;
    font-size: 2vw;
    width: 24%;
    left: 11vw;
  }
  .validez_reservation {
    width: 43%;
    left: 8vw;
    top: 26vh;
  }
  .formulaire_admin select {
    font-size: 44px;
    width: 80%;
  }
  .si_vous_invitez {
    top: 15vh;
    left: 9vw;
  }
  .message {
    font-size: 2vw;
    width: 66vw;
  }
  .position_bouton_valider {
    left: -5vw;
    top: 19vh;
  }
  .annulation {
    display: none;
  }
  .vous_annulez {
    width: 100%;
    font-size: 1em;
    line-height: 3vh;
    top: 17vh;
    left: -5vw;
  }
  .bouton_valider {
    font-size: 3vw;
  }

  .position_bouton_annuler_squash {
    top: 16vh;
    left: 124vw;
  }
  .position_bouton_annuler_squash {
    top: 19vh;
    left: 45vw;
  }

  .bouton_annuler {
    font-size: 3vw;
  }

  .nombreticketsrestants {
    position: fixed;
    top: 21%;
    right: 25%;
    font-size: 2em;
  }
  .centrer_checkbox {
    align-items: center;
  }
  .validez_annulez {
    top: 44vh;
    left: 21vw;
  }
  .grande_checkbox {
    transform: scale(2);
  }
  .taille_preference {
    font-size: 1em;
  }
  .text_center {
    top: 10vh;
    left: 0vw;
  }
  .bouton_annuler_modif_code {
    top: 66vh;
    left: 44vw;
  }
}
