@import "header.css";
@import "footer.css";
@import "front-page.css";


@font-face {
    font-family: 'Roboto';
    src: url(../fonts/Roboto-Regular.woff2) format("woff2");
    font-style: normal;
    font-weight: 400;
}
@font-face {
    font-family: 'Roboto';
    src: url(../fonts/Roboto-Bold.woff2) format("woff2");
    font-style: bold;
    font-weight: 700;
}

:root {
    --white-color: #ffffff;
    --white-02-color: #f9f4f0;
    --black-color: #161616;
    --GREEN-01-color: #004800;
    --GREEN-02-color: #14975D;
    --GREEN-03-color: #71E979;
    --GREEN-03bis-color: #2AC157;
    --GREEN-04-color: #6EE4CD;
    --RED-01-color: #DC0000;
    --RED-02-color: #FB455C;
    --RED-03-color: #FFB1BB;
}


/* fichier PAGE.PHP - réglages */
.container-content {
    padding: 0 120px 0 120px;
}
@media (max-width: 768px) {
    .container-content {
        padding: 0 30px 0 30px;
    }
}


body {
    margin: 0; /* Supprime les marges par défaut */
    padding: 0; /* Supprime le padding par défaut */
    width: 100%; /* Permet de s'adapter à la largeur de la fenêtre */
    max-width: 1216px; /* Limite la largeur maximale à 1440px */
    margin-left: auto; /* Centre horizontalement si plus petit que 1440px */
    margin-right: auto; /* Centre horizontalement si plus petit que 1440px */
    background-color: var(--white-02-color);
}

h1 {
    font-family: 'Roboto';
    font-weight: 700;
    font-size: 36px;
    color: var(--white-color);
    margin: 0;
}

h2 {
    font-family: 'Roboto';
    font-weight: 700;
    font-size: 24px;
    line-height: 105%;
    text-transform: uppercase;
    margin: 0;
    color: var(--black-color);
}

h3 {
    font-family: 'Roboto';
    font-weight: 400;
    font-style: normal;
    font-size: 18px;
    text-transform: uppercase;
    color: var(--black-color);
}

li, p, a {
    font-family: 'Roboto';
    font-weight: 400;
    font-style: normal;
    font-size: 16px;
    line-height: 135%;
    margin: 0;
    color: var(--black-color);
}