/* Général */

body {
    width: 100vw;
    min-height: 100vh;                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             5px;
    font-size: 2vw;
}

.container {
    max-width: 100%;
    height: 100%;
    position: relative;
    /* background-color: aqua; */
    padding: initial;
}

a {
    text-decoration: initial;
}

/* Fin */

/* Titre */

h1 {
    width: 100%;
    /* font-size: 56px; */
    font-size: 5vw;
    color: #8A59A0;
}

/* Fin */

#annonce {
    color: #E20612;
    font-weight: 600;
    text-decoration: underline;
}

.logo {
    background-size: contain;
    background-repeat: no-repeat;
}

#logo-principal {
    width: 100%;
    min-height: 300px;
    display: flex;
    justify-content: center;
    margin-top: -0px;
    /* margin-left: auto;
    margin-right: auto; */
}

.container > div > .logo {
    min-width: 300px;
    height: ;
    background-image: url(./Docs/logos_groupes/_OTiMas.png);
    background-size:  contain;
}

span {
    width: 100%;
}

#onparticipe-hding {
    bottom: 195px;
}

#facebook-hding {
    bottom: 95px;
}

#liens {
    display: flex;
    justify-content: space-between;
    margin-top: 4px;
    padding-left: 40px;
    padding-right: 40px;
}

#onparticipe a, #facebook a {
    display: flex;
    align-items: center;
    column-gap: 10px;
}

#onparticipe > a > .logo, #facebook > a > .logo {
    width: 50px;
    height: 50px;
}

#onparticipe > a > .logo {
    background-image: url(./Docs/medias/icone-onparticipe.webp);    
}

#facebook > a > .logo {
    background-image: url(./Docs/medias/icone_facebook.svg.png);
}



/* Responsive */

@media screen and (max-width: 768px) {
    body {
        font-size: 4vw;
        display: flex;
        align-items: center;
    }
    h1 {
        font-size: 10vw;
    }
    #annonce {
        font-size: 7vw;
        margin-top: 20px;
    }
    #liens {
        margin-top: 40px;
    }
    #onparticipe-hding, #facebook-hding {
        margin-top: 40px;
    }
    #onparticipe-hding {
        font-size: 3vw;
        margin-top: -10px;
    }
    
    #facebook-hding {
        font-size: 3vw;
        margin-top: 15px;
    }
}

@media screen and (min-width: 320px) {
    #liens {
        justify-content: space-around;
        padding-left: initial;
        padding-right: initial;
    }
    #onparticipe > a > .logo, #facebook > a > .logo {
        width: 30px;
        height: 30px;
    }
}

@media screen and (max-width: 425px) {
    #onparticipe-hding {
        
    }
    
    #facebook-hding {
        
    }
}