/*for small devices*/
.equip{
    display: grid;
}
.equip .marg-title{
    margin-left: 0;
    margin-top: 0;
    text-align: center;
}
.equip .marg-text{
    margin-left: 0;
    margin-right: 0;
    margin-top: 10px
}

.equip .equip-img{
    display: flex;
    object-fit: cover;
    width: 100%;
    height: auto;
    background-size: cover;
}
.equip .marg-text-pre{
    display: grid;
    margin-left: 0;
    margin-right: 0;
    margin-top: 20px;
    width: 90vw;
}

.equip .marg-img{
    margin-left: 0;
    margin-top: 20px;
    margin-bottom: 20px;
}


/* Medium devices (tablets, 1024px and up) */
@media screen and (min-width: 1024px){
    .wrapper {
        align-content: center;
        grid-template-columns: repeat(12, 113.83px);
        grid-template-rows:518px 54px 3600px 300px;
        grid-template-areas:
        "header header header header header header header header header header header header"
        "menu menu menu menu menu menu menu menu menu menu menu menu"
        "equipe equipe equipe equipe equipe equipe equipe equipe equipe equipe equipe equipe"
        "footer footer footer footer footer footer footer footer footer footer footer footer";
        grid-gap: unset;
        justify-content: center;
        margin: auto;
    }

    .equip{
        grid-area: equipe;
        display: grid;
        align-items: flex-start;
        grid-template-rows: 240px 300px 20px 30px 370px 20px 70px 300px 20px 30px 190px 20px 70px 300px 20px 30px 240px 20px 70px 300px 20px 30px 190px 20px 70px 300px 20px 30px 190px 20px 70px; 
    }

    .equip .marg-title{
        margin-left: 140px;
        margin-top: 80px;
        text-align: left;
    }
    .equip .equip-img{
        margin-left: 140px;
        display: block;
        object-fit: none;
        width: auto;
        height: auto;
        background-size: none;
    }

    .equip .marg-text-pre{
        white-space: pre;
    }

    .equip .marg-img{
        margin-top: 0;
        margin-left: 140px;
    }
}

/* Extra large devices (large desktops, 1200px and up) */
@media screen and (min-width: 1200px) {
    .wrapper {
        align-content: center;
        grid-template-columns: repeat(12, 100px);
    }		

}