.horaires-container {

   
    color: #395569;
    width: 70%;
    height: fit-content;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: 2rem 0;
    border-radius: 3px;
   
    padding: 0 2rem;
}

.iframe-tarifs {
 height: 800px;
    width: 540px;
    
}

.formulaire-horaires-container {
    
    margin: 2rem 0;
text-align: center;
    height: fit-content;
    width: fit-content;
}

.horaires-image {
    object-fit: cover;
    height: 100%;
    /* width: 100%; */
    border-radius: 3px 3px 0 0;
}

.horaires-title {
    margin: 2rem 0;
    font-weight: 600;
    font-size: 30px;
    text-decoration: none;
}

.horaires-infos {
    font-size: 18px;
    max-width: 600px;
    padding: 0 1rem;
}

.horaires-details-container {
  background-color: #EAEAEA;
  color: #395569;
    width: 50%;
    padding: 2rem;
    border-radius: 3px;
    margin: 2rem 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    font-size: 18px;
    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
    font-weight: 600;
    font-family: 'Raleway', sans-serif;
}


.horaires-details {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: auto;
  grid-gap: 10px;
  width: 100%;
 
}

.horaires-details-jour {
    width: 30%;
  grid-column: 1 / span 1;
  grid-row: 1 / span 2;


}

.horaires-details p {
    width: 30%;
  margin: 0px;
 
}

.horaires-details > p {
 width: 100%;
 text-align: center;
}

.details-title { 
    font-size: 25px;
    font-weight: 600;
 }

 .lieux-title {
    font-size: 20px;
    font-weight: 600;
    margin: 2rem 0 ;
  
    width: 100%;
    text-align: center;
    border-bottom: 1px solid #395569;
 }

 .horaires-details-lieu {
  display: flex;
  flex-direction: column;
    text-align: center;
    font-size: 20px;
    padding: 1rem 0;
 
 }

 .horaires-details-link {
  display: flex;
  align-items: center;

 color: #395569;
 text-decoration: none;

 }

 .horaires-details-icon {
    height: 40px;
   margin: 10px;

 }

 .lieu-details-container {
  
 
  color: #395569;
    width: 40%;
    /* padding: 1rem; */
    border-radius: 3px;
    margin: 1rem 0;
    font-size: 18px;
    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
    font-weight: 600;
    
 }

 .lieu-fader {
  background-color: #eaeaeab2;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  border-radius: 3px;
  
 }

 .reneLeGall {
  background-image: url(../img/capturerenelegall.jpg);
  background-position: center;
  background-size: cover;
 }

 .gardette {
  background-image: url(../img/capturegardette.jpg);
  background-position: center;
  background-size: cover;
 }

 .tep {
  background-image: url(../img/capturetep.jpg);
  background-position: center;
  background-size: cover;
 }

.texte-details-tarifs {
  background-color: #EAEAEA;
  color: #395569;
  border-radius: 5px;
  padding: 1rem;
}
 /*                                                 tarifs                            */

 .tarifs-container {
  font-family: 'Raleway', sans-serif;
  background-color: #EAEAEA;
  color: #395569;
    width: 70%;
    padding: 2rem;
    border-radius: 3px;
    margin: 2rem 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    font-size: 18px;
    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
    font-weight: 600;
 }
 
 .tarifs-details-texte {
  font-size: 18px;
 }

 .tarifs-cours {
    width: 100%;
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1fr;
    grid-template-rows: auto;
    grid-gap: 10px;
    border-bottom: 1px solid #395569;
    padding-bottom: 1rem;
    margin-bottom: 1rem;
    
  }

  .tarifs-cours-link {
  
    
    padding: 5px;
  }

  .tarifs-cours-link:hover {
    border: 1px solid #395569;
    border-radius: 3px;
    /* background-color: #dfdddd; */
    box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
   
  }

  .tarifs-cours  strong {
    font-size: 14px;
  }
  
  .tarifs-activite, .col1 {
    width: 100%;
    text-align: start;
  }
  .col2, .col3, .col4 {
    margin: 0;
    text-align: center;
   
  }

  .tarifs-activite {
    color: rgb(185, 102, 7);
  }

  .col1 {
    font-size: 14px;

  }

  .col2 > .tarifs-cours-link, .col2 {
   color: rgb(10, 107, 49);
  }

  .col3 > .tarifs-cours-link, .col3 {
color: rgb(52, 90, 142);
  }

 .col4 > .tarifs-cours-link,  .col4 {
    color: rgb(112, 8, 112);
  }

.tarifs-cours-link{
    text-decoration: none;
    
}

.texte-details-tarifs {
    text-align: center;
}

.image-plan-legall {
    width: 100%;
    border-radius: 5px;
}



@media (max-width: 821px) {
    .horaires-container {
        width: 95%;
        padding: 0 5px;
    }

    .iframe-tarifs {
        height: 985px;
           width: 540px;
     
       }

       .horaires-details-container {
        background-color: #EAEAEA;
        width: 90%;
        padding: 1rem 5px;
        
    }

    .lieu-details-container {
        width: 70%;
    }

    .tarifs-container {
        width: 95%;
        padding: 1rem 5px;
    }
}