/* Déclaration des polices personnalisées avec @font-face */
@font-face {
    font-family: 'AvenirNext';
    src: url('fonts/AvenirNextLTPro-Regular.otf') format('opentype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Raleway';
    src: url('fonts/Raleway-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

/* Positionner la liste déroulante en haut à droite de la page */
.language-selector {
    position: absolute;
    top: 20px;
    right: 20px;
    display: flex;
    align-items: center;
}

.language-selector select {
    padding: 5px 10px;
    margin-left: 10px;
    border-radius: 4px;
    border: 1px solid #ccc;
    background-color: #f8f8f8;
    cursor: pointer;
}

.flag {
    width: 24px;
    height: 16px;
    display: inline-block;
    margin-right: 5px;
    vertical-align: middle;
}
.lang-en {
    display: none;
}


body, html {
    font-family: 'AvenirNext', 'Raleway', sans-serif; /* Application des polices personnalisées */
    background-color: #f4f4f4;
    margin: 0;
    padding: 0;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: center;  /* Centre le contenu verticalement */
}

/* Index page specific styles */
.content {
    /* flex: 1; */
    padding: 20px;
}

.content-coming-soon {
    text-align: center;
    margin-top: 50px;
    font-size: 32px;
    color: #008c8e;
}

.content-cgu {
    max-width: 800px;
    margin: 0;
    text-align: left;
}

iframe.footer-frame {
    border: none; /* Removes iframe border */
    width: 100%;
    height: 220px; /* Increased to accommodate larger images */
    margin-top: auto;
    display: block; /* Helps with removing certain browser default styles */
}

.footer-content {
    text-align: center;
    padding: 20px;
    background-color: #f4f4f4;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;  /* Assure que tout est centré horizontalement */
}

.footer-images {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
    margin-bottom: 10px;  /* Réduit l'écart sous les images */
}

.footer-images img {
    max-width: 150px;
    height: auto;
    object-fit: contain; /* Preserves aspect ratio */
}

.footer-copyright {
    font-size: 14px;
    color: #008c8e;
    margin: 0;
    margin-bottom: 10px;
    padding: 0;
    text-align: center; /* Centrer le texte */
    width: 100%; /* S'assure que l'élément prend toute la largeur disponible */
    display: block; /* Assure que l'élément est sur une ligne à part */
}


.back-button {
    background-color: #008c8e; /* Fond du bouton */
    color: white; /* Couleur du texte */
    border: none;
    padding: 10px 20px;
    font-size: 16px;
    cursor: pointer;
    margin: 20px;
    margin-left:auto;
    position:absolute;
    left:0

}

/* Button styles */
.button-container {
    margin-top: 40px;
    margin-bottom: 30px;
}

.button {
    display: inline-block;
    background-color: #008c8e;
    color: #f4f4f4;
    padding: 12px 24px;
    text-align: center;
    text-decoration: none;
    font-size: 16px;
    border-radius: 4px;
    transition: background-color 0.3s;
}

.button:hover {
    background-color: #006f71;
}

.copyright {
    padding-top: 5px;
    padding-bottom: 5px;
    margin-left: 0;
    text-align: center;
    font-size: 1 rem;
    width: 100%;
    background-color: #666;
    color: #f4f4f4;
}

.CGU, .mailto, .RGPD {
    color: #008c8e;
    font-weight: normal;
    text-decoration: none;
}


.CGU:hover, .mailto:hover, .RGPD:hover {
    color: #008c8e;
    font-weight: bold;
    text-decoration: underline;
    cursor: pointer;
}