.contact-container{
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;

  justify-content: center;

  align-items: flex-start;

  font-size: clamp(0px, 100%, 18px);
}

.image-c-container{
    height: 360px;
}

.contact-parent{
  width: clamp(0px, (100% / 3), 600px);

  overflow: hidden;

  display: flex;
  flex-direction: column;

  position: relative;
  padding-left: 10px;
  padding-right: 10px;
}

.planning-container{
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}

.horaire-container{

  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;

  height:100%;
}

.horaire-element{
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;

  justify-content: space-between;

  text-transform: uppercase;
    font-weight: 600;
    letter-spacing: 0.15em;

    margin-bottom: 32px;
}

h3.horaire-title{
  margin-top: 0px;
  margin-bottom: 1.5em;
   text-transform: uppercase;
    letter-spacing: 4px;
    font-weight: 500;
    font-size: 16px;
}

.horaire-time{
  text-align: right;
}

.info-button{

  width: 100%;

    margin:auto;

    margin-top: 6px;
  
  text-transform : uppercase;
  font-weight: 500;

  transition-property: all;
  transition-duration: 0.1s;
  transition-timing-function: ease-out;

  cursor: pointer;

  font-size: 13px;
  letter-spacing: 3px;

  text-align: center;
  border:solid black 1px;
  padding:8px;

  background-color: transparent;
}

.info-button:hover{
  border: solid transparent 1px;

  background-color: var(--primary-color);
  
  color: white;
}

.info{
  text-align: justify;
  font-size:16px;
}

.gps{
  position: absolute;
  top:0px;
  right:0px;

  width: 80px;
  height: 40px;
  z-index: 1;
  background-color: dodgerblue;

  text-align: center;
  line-height: 40px;

  box-shadow: 0px -0px 25px rgba(0,0,0,0.8);
}

.gps-link{
  font-family: arial;
  color: white;
  font-weight: 500;
  font-size: 22px;
  letter-spacing: 2px;
}

.gps-link:hover{
  color: white;
}

.map-parent{
  position: relative;
  height:unset;
  justify-content: center;
  display: flex;
  align-items: center;
}

.full-width-map > iframe{
  width: 100%;
}

.contact-image{
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: relative;
}

@media only screen and (min-width: 0px) and (max-width: 1280px){

.contact-container{
  align-items: center;
}

}

@media only screen and (min-width: 1280px) and (max-width: 1500px){

.contact-container{
  margin-left: 0px;
  margin-right: 0px;
}

.contact-parent{
  width: calc((100vw / 3));
}

}

@media only screen and (min-width: 800px) and (max-width: 1279px){

.contact-container{
  margin:0px;

  flex-direction: column;
}

.contact-parent{

  margin-bottom:40px;

    width: calc((100vw / 2));
}

}

@media only screen and (min-width: 480px) and (max-width: 800px){

.contact-container{
  margin-left:100px;
  margin-right:100px;

  flex-direction: column;
}

.contact-parent{

  margin-bottom:40px;

  width: 95vw;
}

}

@media only screen and (min-width: 0px) and (max-width: 480px){

.contact-container{
  margin:0px;

  flex-direction: column;
}

.contact-parent{

  margin-bottom:40px;

  width: 95vw;
}

.horaire-container{
  padding:0px;
}

.horaire-element{

  font-size: clamp(12px,3vw,18px);
}

}