/* formulaire-demande-ouverture-compte */
.layout-container[data-alias="formulaire-demande-ouverture-compte"] #mainPage,
.layout-container[data-alias="signup"] #mainPage{
    background-image: url('../img/background-login.jpg');
    background-position: left top;
    background-repeat: repeat;
    background-color: #FFF;
    margin-left: -30px;
    margin-right: -30px;
}
.layout-container[data-alias="formulaire-demande-ouverture-compte"] #mainPage h1,
.layout-container[data-alias="signup"] #mainPage h1{
    color:#FFF;
}
.layout-container[data-alias="formulaire-demande-ouverture-compte"] #mainPage .bloc-fond,
.layout-container[data-alias="signup"] #mainPage .bloc-fond{
    background-color:#FFF !important;
    border-radius: 0 !important;
}
/* Login / Reset */
.layout-container[data-alias="login"] #mainPage,
.layout-container[data-alias="reset"] #mainPage{
    background-image: url('../img/background-login.jpg');
    background-position: left top;
    background-repeat: repeat;
    background-color: #FFF;
    margin-left: -30px;
    margin-right: -30px;
    padding: 0;
}
.layout-container[data-alias="login"] #mainPage > .container.mx-auto,
.layout-container[data-alias="reset"] #mainPage > .container.mx-auto{
    margin: 0 !important;
    max-width: inherit !important;
}
.layout-container[data-alias="login"] #mainPage .login-page .login-section,
.layout-container[data-alias="reset"] #mainPage .reset-page .reset-password-page{
    width: 810px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 70px;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}
.layout-container[data-alias="login"] #mainPage .login-page .login-section .titre,
.layout-container[data-alias="reset"] #mainPage .reset-page .reset-password-page .titre{
    font-weight: 300 !important;
    margin-bottom: 20px !important;
}
.layout-container[data-alias="login"] #mainPage .login-page .login-section label,
.layout-container[data-alias="reset"] #mainPage .reset-page .reset-password-page label{
    display: block !important;
    font-size: 15px !important;
    font-weight: 300 !important;
}
.layout-container[data-alias="login"] #mainPage .login-page .login-section input,
.layout-container[data-alias="reset"] #mainPage .reset-page .reset-password-page input{
    max-width: 490px !important;
    border-radius: 50px !important;
}
.layout-container[data-alias="login"] #mainPage .login-page .login-section .link{
    display: block;
    font-size: 12px !important;
    font-weight: 300 !important;
    font-style: normal !important;
    margin: 0 auto;
}
.layout-container[data-alias="login"] #mainPage .login-page .login-section .button,
.layout-container[data-alias="reset"] #mainPage .reset-page .reset-password-page .button{
    width: 200px;
    height: 50px;
    line-height: 48px;
}
.layout-container[data-alias="login"] #mainPage .login-page .login-section hr{
    display: none;
}
.layout-container[data-alias="login"] #mainPage .login-page .login-section:after{
    color: #686868;
    font-size: 13px;
    text-align: center;
}
html[lang="fr"] .layout-container[data-alias="login"] #mainPage .login-page .login-section:after{
    content: "L'utilisation de l'extranet BENJAMIN est réservé aux distributeurs de sa marque. Le contenu de l'extranet est protégé par les lois internationales sur le copyright et la propriété intellectuelle. Pour des raisons légales et de sécurité, tous les accès à l'extranet sont enregistrés. Toute intrusion ou toute tentative d'intrusion pourra faire l'objet de poursuites légales adaptées."
}
html[lang="en"] .layout-container[data-alias="login"] #mainPage .login-page .login-section:after{
    content: "texte texte texte texte texte texte texte texte texte texte texte texte texte texte"
}
@media screen and (max-width: 1023px) {
    .layout-container[data-alias="login"] #mainPage .login-page,
    .layout-container[data-alias="reset"] #mainPage .reset-page{
        background-image: url('../img/logo-background-login.jpg');
        background-size: 125px auto;
        background-position: center 25px;
        background-repeat: no-repeat;
    }
    .layout-container[data-alias="login"] #mainPage .login-page .login-section,
    .layout-container[data-alias="reset"] #mainPage .reset-page .reset-password-page{
        margin-top: 170px !important;
    }
}
@media (min-width: 1024px) {
    .layout-container[data-alias="login"] #mainPage .login-page,
    .layout-container[data-alias="reset"] #mainPage .reset-page{
        display: flex;
        align-items: center;
        padding-right: 0 !important;
    }
    .layout-container[data-alias="login"] #mainPage .login-page:before,
    .layout-container[data-alias="reset"] #mainPage .reset-page:before{
        content: "";
        display: block;
        width: 243px;
        height: 233px;
        background-image: url('../img/logo-background-login.jpg');
        background-repeat: no-repeat;
        margin-right: -75px;
        z-index: 1;
    }
    .layout-container[data-alias="login"] #mainPage .login-page .login-section,
    .layout-container[data-alias="reset"] #mainPage .reset-page .reset-password-page{
        min-height: 100vh !important;
    }
}