:root {
    --color-1: #95C11E;
    --color-2: #BC747E;
    --color-3: #6A6A6A;
    --ff-1 : 'Rubik'
}

.FormsConnexion .site-content {
    width: 100%;
    display: flex;
    justify-content: center;
    align-content: center;
    padding: 100px 20px;
    margin: 0;
    min-width: 100%;
    font-family: var(--ff-1);

    @media (max-width: 767px) {
        padding: 20px;
    }
}

.FormsConnexion .card-container {
    background: #ffffff;
    border-radius: 8px 8px 270px 8px;
    display: flex;
    margin: 0 auto;
    width: 1240px;
    max-height: 747.55px;
    flex-direction: row-reverse;
    overflow: hidden;

    @media (max-width: 992px) {
        flex-direction: row;
        justify-content: center;
    }

    @media (max-width: 767px) {
        border-radius: 8px;
        max-height: fit-content;
    }
}

.FormsConnexion .card-left {
    width: 790px !important;
    border-radius: 0 !important;
    background: none !important;
}

.FormsConnexion .card-left-picture {
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    width: 100%;
    height: 100%;
}

.FormsConnexion .card-left-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.FormsConnexion .card-right {
    width: 450px !important;
    box-shadow: none;
    border-bottom-right-radius: 20px;
    border-top-right-radius: 20px;
    padding: 20px !important;
    margin: 0;
    overflow-y: auto;
    overflow-x: hidden;
    height: 100%;
}

.FormsConnexion .card-picture {
    display: flex;
    justify-content: center;
    align-content: center;
    overflow: hidden;
    width: 240px;
    height: 105px;
    margin: 0 auto 60px auto;
}

.FormsConnexion .card-image {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.FormsConnexion .page-surtitle {
    display: block;
    margin: 0 0 6px 0;
    font-size: 16px;
    line-height: 19px;
    font-weight: 300;
}

.FormsConnexion .site-title {
    color: var(--color-1);
    font-size: 40px;
    line-height: 47px;
    font-weight: 500;
    margin: 0;
    text-align: left;
}

.FormsConnexion .container-main .module_container {
    min-height: fit-content !important;
}

.FormsConnexion .module_body {
    padding: 0;
}

.FormsConnexion .module_title {
    display: none;
}

.FormsConnexion .btn {
    background-color: var(--color-2);
    border: 1px solid var(--color-2);
    border-radius: 8px;
    width: 100%;
    transition: all 250ms;
}

.FormsConnexion .btn:hover {
    background-color: transparent;
    color: var(--color-2);
}

.inscription-identifiant-temporaire .page-surtitle, .inscription-infos-personnelles .page-surtitle, .changer-identifiant .page-surtitle {
    display: none;
}