footer > .logos {
    margin: 0 0 0 0;
    display: flex;
    flex-flow: row nowrap;
    align-items: flex-start;
}

footer > .logos a.bouton_logos {
    border-radius: 50%;
    border: 2px solid #4B4B4D;
    padding: .6rem;
    margin: -4.5rem 1rem 0 0;
    width: 6rem;
    height: 6rem;
    background-color: white;
    display: flex;
    align-items: center;   
    transition: border .3s ease-in-out; 
}
footer > .logos a.bouton_logos:hover {
    border: 2px dotted #4B4B4D ;
    transition: all .5s ease-in-out;
}
footer > .logos a.bouton_logos img {
    width: 100%;
}

/* -- triptyque --- */

/* Les icones des cartes web */
.hap {

    background-image: url(IMG/logo/arton16.png?1616499215);

content: "dans hap";
background-repeat: no-repeat;
background-size: contain;
overflow: hidden;
}

.as {
    
        background-image: url(IMG/logo/arton17.png?1616499227);
    
    background-repeat: no-repeat;
    background-size: contain;
    overflow: hidden;
}

/* Fonds de carte web triptyque */

    .card-hap {
        background-color: #36b7c1;
    }    



    .card-as {
        background-color: #F08A00;
    }



    .card-hap .card-ill {
        
        background-image: url(IMG/jpg/partenariat_maimosine.jpg);
                
    background-repeat: no-repeat;
    background-size: cover;
    }



    .card-as .card-ill {
        
        background-image: url(IMG/png/bg_as_tr.png);
        
        background-repeat: no-repeat;
        background-size: cover;
    }