
.aspectPopupLegendeIcones{
    /* width: 100%; */
    padding: 0;
    /* transform: translateX(100px); */
    transform: translateX(25%);
    color: #CA7032;
    background-color: white;
    border-radius: 20px;
    padding: 0 10px 0 0;
    border: solid 3px #CA7032;
}
.containerLegendesNatureImage{
    position: absolute;
    display: none;
    /* display: flex !important; */
    top: 0;
    /* transform: translateY(-50%); */
    /* background-color: white; */
    width: 50vw;
    height: 80vh;
}
.containerLegendesNatureImage p{
    line-height: unset !important;
    margin-bottom: unset !important;
}
.conteneurIcone3D{
    position: absolute;
    top: 0;
    left: 13px;
    z-index: 3;
    /* border: 2px solid #CA7032; */
    border: 2px solid #e4dfdc;
    border-radius: 60px;
    /* background-color: #504a4a; */
    background-color: #d1803b;
    transform: perspective(9cm) rotateX(-9deg) rotateY(33deg);
    box-shadow: -10px 10px 10px rgb(0 0 0 / 50%);
}
.icone3D{
    width: 55px;
    padding: 10px;
}
.callageIcones3D{
    display: flex;
    align-items: center;
}

/* ------------------------------------------------ */
/*-------------------////////////// page Menu CREATIONS */
/* ------------------------------------------------ */

/* (inférieur à 1366) */
@media screen and (max-width: 1366px) {
    .icone3D{
    width: calc(18px + 3vw);
}
}


@media screen and (max-width: 412px) and (orientation: portrait) {
    .aspectPopupLegendeIcones{
        transform: translateX(0);
    }
    .containerLegendesNatureImage p{
        font-size: 1em;
    }
    .callageIcones3D{
        flex-wrap: wrap;
    }
    .containerLegendesNatureImage{
        position: relative;
        height: auto;
        width: 75vw;
        margin: 20px auto;
    }
    
}