@import "general.css";



.sectionProjet {
    background: linear-gradient(180deg, #FAFAFB 59.66%, #FFF 100%);

    padding-top: 150px;
    padding-bottom: 150px;
}

@media (max-width: 500px) {
    padding-top: 100px;
    padding-bottom: 100px;
}

.sectionTexteTitle {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.sectionProjet h3 {
    color: #000;
    font-family: Plush;
    font-size: 25px;
    font-weight: Bold;
}

.sectionFlexProjet {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 50px;
    width: 100%;

}


.sectionProjet1, .sectionProjet2 {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;

    width: 100%;
    max-width: 1400px;
    height: 90vh;
    min-height: 900px;

    background-color: #ffffff;
    border-radius: 33px;
    box-shadow: 0px 41px 12px 0px rgba(0, 0, 0, 0.00), 0px 27px 11px 0px rgba(0, 0, 0, 0.00), 0px 15px 9px 0px rgba(0, 0, 0, 0.01), 0px 7px 7px 0px rgba(0, 0, 0, 0.01), 0px 2px 4px 0px rgba(0, 0, 0, 0.01);
}

@media (max-width: 500px) {
    .sectionProjet1, .sectionProjet2 {
        width: 350px;
        min-height: 300px;
        height: fit-content;

        border-radius: 10px;
    }
}


.textContentProjet {
    width: 780px;
}

@media (max-width: 500px) {
    .textContentProjet {
        width: 300px;
    }
}

.sectionProjet1 p, .sectionProjet2 p {
    font-family: 'Satoshi';
    font-size: 16px;
    color: #120200;

    margin-top: 9px;
    margin-bottom: 40px;
}

.sectionProjet1 h1, .sectionProjet2 h1 {
    font-family: 'Plush';
    font-weight: bold;
    font-size: 30px;
    color: #FF1500;

    margin: 0px;
}

.screenProjet {
    height: 630px;
    width: 1100px;
    border-radius: 15px;

    padding: 10px;

    border: 1px solid rgba(0, 0, 0, 0.13);
}

.screenProjet img {
    height: 100%;
    width: 100%;
}

@media (max-width: 500px) {
    .screenProjet {
        display: none;
    }
}

@media (max-width: 500px) {
    .sectionProjet2 img {
        display: none;
    }

}