
#conteneur{
    display: flex;
    flex-direction: column;
}

img#logo{
    width: 343px;
    hight: 343px;
    margin: 2rem auto;
}

#side-by-side{
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    height: 87px ;
}
#side-by-side .left{
    width: 48%;
    font-size: var(--fs-normal-14);
    transform: translate(45px, 0);
}
#side-by-side #mid{
    background-color: var(--color-gray-ligne);
    width: 1px;
    height: 100%;
    margin: 0 2rem;
}
#side-by-side .right{
    width: 48%;
    font-size: var(--fs-title);
}

img.arrowdown{
    width: 30px;
    margin: 5rem auto;
}

iframe.video-container{
    aspect-ratio: 16 / 9;
}

#presentation{
    margin: 5rem auto;
    width: 100%;
    display: flex;
    flex-direction: row;
    align-items: center;
    font-size: var(--fs-small);
    font-weight: bold;
}
#presentation span{
    color: var(--color-blue-light);
}
#presentation img{
    width: 129px;
    height: 129px;
}


#new_tools{
    font-size: var(--fs-normal);

}
#new_tools h1{
    font-size: var(--fs-title);

}
#new_tools p{
    font-size: var(--fs-small);

}
#partie_img{
    height: 600px;

}
#partie_img img{
    border: 2px solid white;
    border-radius: var(--br-small);
    box-shadow: 5px 5px 10px black;
    width: 120px;
    position: relative;
}
#partie_img .p1{
    width: 180px;
    position: absolute;
    transform: translate(-10px, 60px) rotate(10deg);
    z-index: 3;

}
#partie_img .p2{
    width: 160px;
    position: absolute;
    transform: translate(140px, 160px) rotate(13deg);
    z-index: 2;

}
#partie_img .p3{
    width: 140px;
    position: absolute;
    transform: translate(260px, 260px) rotate(16deg);
    z-index: 1;

}
#new_tools {
    overflow-x: hidden;
    position: relative;
}
#new_tools .text{
    height: 120px;
    display: flex;
    flex-direction: column;
}
#new_tools .text p{
    margin: 0.5rem 0 1rem 1rem;

}