/* Custom CSS to handle cases not supported by bootstrap 3.3.7 */

.custom-logo-container {
  display: flex; 
  align-items: center; 
  justify-content: center; 
  flex-wrap: wrap; 
  gap: 20px; 

  .a {
    display: block;
    flex: 0 1 auto;
  }
}

.custom-revo-content {
  height: 85vh; 
  display: flex; 
  flex-direction: column; 
  align-items: center; 

  @media only screen and (max-width: 480px) {
    width: 90vw; 
    justify-content: end;
    gap: 10px;
  }

  @media only screen and (min-width: 480px) {
    width: 60vw;
    justify-content: center;
    gap: 20px;
  }

  h3 {
    margin: 0 !important;
    max-width: 100%; 
    text-wrap: wrap;
  }
}

/* Override default padding for small screens */
.custom-container-padding {
  @media only screen and (max-width: 480px) {
    padding: 30px !important;
  }
}

.custom-products {
  width: 100%; 
  display: flex; 
  flex-wrap: wrap;

  .custom-product-container {
    flex: 1 1 50%; 
    width: 100%; 
    display: flex; 
    flex-wrap: wrap;  
    gap: 20px; 
    justify-content: center; 
    align-items: center;

    @media only screen and (max-width: 992px) {
      padding: 20px;
    }

    @media only screen and (min-width: 992px) {
      padding: 60px;
    }

    img {
      display: block; width: 100%; height: auto; max-width: 350px;"
    }

    div {
      width: 100%;
      min-width: 300px;
    }
  }

  .custom-product-container:nth-child(odd) {
    flex-direction: column;
    text-align: end;
    background-color: #eff3f5;
  }

  .custom-product-container:nth-child(even) {
    flex-direction: column-reverse;
    text-align: start;
    background-color: #f0ece8;
  }
}

/* Footer base text */
.c-layout-footer,
.c-layout-footer p,
.c-layout-footer li {
  color: #cccccc !important;
}

/* All footer links (including email) */
.c-layout-footer a {
  color: #cccccc !important;
  text-decoration: none;
}

/* Hover = blanc, comme avant */
.c-layout-footer a:hover {
  color: #ffffff !important;
  text-decoration: underline;
}

.c-layout-footer h3 {
  color: #f2f2f2 !important; /* au lieu de #fff */
}


