/* ------------------ HEADER ------------------ */


.header .header_valeurs {
    background-image: url(../IMG/Shapes/forme\ 0\ magenta_rotated.png);
    background-size: 80%;
    background-repeat: no-repeat;
    background-position: center;
    color: white;
}











/* SHAPES */



.shape1 {
    background-image: url("../IMG/Shapes/forme\ 20\ mandarine.png");
    left: -5%;
    top: 5%;
    transform: rotate(10deg) scale(0.9);
}

.shape2 {
    background-image: url("../IMG/Shapes/forme\ 18\ jaune.png");
    left: 35%;
    top: 0%;
    transform: rotate(0);
}

.shape3 {
    background-image: url("../IMG/Shapes/forme\ 24\ magenta.png");
    right: 10%;
    top: 3%;
    transform: rotate(10deg) scale(0.9);
}

.shape4 {
    background-image: url("../IMG/Shapes/forme\ 6\ magenta-orange.png");
    left: -5%;
    top: 70%;
    transform: rotate(20deg);
  
}

.shape5 {
    background-image: url("../IMG/Shapes/forme\ 16\ bleu.png");
    left: 72%;
    top: 72%;
}








h1 {
    text-align: left;
}

/* VALEURS */

.valeurs {
    display: flex;
    height: 100vh;
    padding: 0vh 2vw;
    gap: 2vw;
    align-items: center;
    justify-content: space-evenly;
  
}
p,
h1,
li,
ul {
    position: relative;
    z-index: 10;
}
.valeur_1,
.valeur_2,
.valeur_3 {
    width: 100%;
    /* min-height: 50vh; */
    height: auto; /* put percent or vh to force a specific size/make it bigger */
    border: dashed 0.3vh #F5924A;
    padding: 2vh;
    align-content: center;
}

.valeur_1,
.valeur_3 {
    border-radius: 15px 255px 225px 15px/255px 15px 15px 255px;
    border: dashed 0.3vh #F3B08A;
}

.valeur_2 {
    border-radius: 255px 15px 225px 15px/15px 225px 15px 255px;
}

