body.theme-fresk.pagelayout-login:not(#page-login-signup):not(#page-login-forgot_password) {
    position: relative;
    #page {
        padding: 0 !important;
        background-color: $secondary;
        #page-content {
            margin: 0 !important;
            #region-main-box {
                padding: 0 !important;
                #region-main {
                    padding: 0 !important;
                    .login-wrapper {
                        .login-container {
                            max-width: 100%!important;
                            width: 100%;
                            height: 100%;
                            margin: 0 !important;
                            border-radius: 0;
                            padding: 0;
                            position: relative;
                            h2.login-heading {
                                font-size: 20px;
                                font-weight: 400;
                            }
                            div[role="main"] {
                                #maincontent {
                                    position: absolute;
                                    height: auto;
                                }
                                .loginform {
                                    height: 100%;
                                    display: flex;
                                    flex-flow: row nowrap;
                                    justify-content: flex-start;
                                    align-items: flex-start;
                                    min-width: 100%;
                                    p{
                                        text-align: center;
                                    }
                                    .side-login {
                                        height: 100%;
                                        .side-left-mobile {
                                            display: none;
                                        }
                                    }
                                    .side-login-left {
                                        width: 60%;
                                        display: flex;
                                        flex-flow: column nowrap;
                                        justify-content: center;
                                        align-items: center;
                                    }
                                    .login-instructions,
                                    .login-guest {
                                        .login-signup{
                                            margin-top: 7px;
                                        }
                                        display: flex;
                                        flex-flow: column nowrap;
                                        justify-content: center;
                                        align-items: center;
                                        background: rgba(0, 0, 0, 0.2);
                                        backdrop-filter: blur(10px);
                                        border-radius: 10px;
                                        padding: 20px;
                                        color: white !important;
                                        max-width: 90%;
                                        h2, p {
                                            color: white !important;
                                            padding: 0 20px;
                                        }
                                    }

                                    .side-login-right {
                                        width: 40%;
                                        display: flex;
                                        flex-flow: column nowrap;
                                        justify-content: center;
                                        align-items: center;
                                        #loginlogo.login-logo {
                                            #logoimage {
                                                max-height: 120px;
                                                &.img-fluid{
                                                    max-width: 100% !important;
                                                }
                                            }
                                        }
                                        .login-identityproviders {
                                            display: flex;
                                            flex-flow: row nowrap;
                                            justify-content: center;
                                            align-items: center;
                                            width: 100%;
                                            margin-bottom: 2em;
                                            .provider_link {
                                                margin: 1em;
                                            }
                                        }
                                        .content-form-collapse {
                                            width: 100%;
                                            padding: 0 1em;
                                            display: flex;
                                            flex-flow: column nowrap;
                                            justify-content: center;
                                            align-items: center;
                                            margin-bottom: 1em;
                                            .collapse-form {
                                                width: 100%;
                                                flex-flow: row nowrap;
                                                justify-content: center;
                                                &.show,
                                                &.collapsing {
                                                    display: flex;
                                                }
                                            }
                                        }
                                        form#login {
                                            width: 40%;
                                            .login-form-username.form-group,
                                            .login-form-password.form-group {
                                                input#username,
                                                input#password {
                                                    border: 0;
                                                    border-bottom: 1px solid;
                                                    padding-left: 0.5em;
                                                    font-size: 1em;
                                                }
                                            }
                                            .login-form-password.form-group {
                                                margin-bottom: 0.3em;
                                            }
                                            .login-form-forgotpassword {
                                                text-align: right;
                                                margin-bottom: 1rem;
                                                a {
                                                    font-size: .8em;
                                                    text-align: right;
                                                    color: $secondary;
                                                }
                                            }
                                            .login-form-submit {
                                                button#loginbtn {
                                                    width: 60%;
                                                    display: block;
                                                    margin: 0 auto;
                                                }
                                            }
                                        }
                                        .login-languagemenu {
                                            .dropdown-toggle {
                                                box-shadow: none;
                                            }
                                        }
                                    }
                                }
                            }
                        }
                    }
                }
            }
        }
    }
    .top-decorations {
        z-index: 1000;
        position: absolute;
        width: 100%;
        .first-top-decoration {
            width: 0;
            height: 0;
            border-left: 135px solid transparent;
            border-right: 135px solid transparent;
            border-top: 135px solid $primary;
            position: absolute;
            left: calc(37% - 135px);
        }
        .second-top-decoration {
            width: 0;
            height: 0;
            border-left: 92px solid transparent;
            border-right: 92px solid transparent;
            border-top: 92px solid $primary;
            position: absolute;
            left: calc(47% - 92px);
            opacity: .8;
        }
    }
    .left-decorations {
        z-index: 1000;
        position: absolute;
        height: 100%;
        .first-left-decoration {
            width: 0;
            height: 0;
            border-top: 76px solid transparent;
            border-bottom: 76px solid transparent;
            border-left: 76px solid $primary;
            position: absolute;
            top: 20%;
            left: -25px;
        }
        .second-left-decoration {
            width: 0;
            height: 0;
            border-top: 76px solid transparent;
            border-bottom: 76px solid transparent;
            border-left: 76px solid $primary;
            position: absolute;
            top: 12%;
            left: -25px;
            opacity: .8;
        }
    }
    &:not(.notloggedin) {
        #page {
            #page-content {
                .login-container {
                    background-color: transparent;
                    div[role="main"] {
                        display: flex;
                        flex-flow: row nowrap;
                        justify-content: center;
                        align-items: center;
                    }
                    .side-login-right {
                        background-color: #FFFFFF;
                    }
                }
            }
        }
    }
    &.login_default_left {
        #page {
            #page-content {
                #region-main-box {
                    #region-main {
                        .login-wrapper {
                            .login-container {
                                div[role="main"] {
                                    .loginform {
                                        flex-direction: row-reverse !important;
                                    }
                                    .side-login-right{
                                        padding: 1rem;
                                    }
                                }
                            }
                        }
                    }
                }
            }
        }
    }
    &.login_default_right {
        #page {
            #page-content {
                #region-main-box {
                    #region-main {
                        .login-wrapper {
                            .login-container {
                                div[role="main"] {
                                    .side-login-right{
                                        padding: 1rem;
                                    }
                                }
                            }
                        }
                    }
                }
            }
        }
    }
    &.login_floating_center {
        #page {
            #page-content {
                #region-main-box {
                    #region-main {
                        .login-wrapper {
                            .login-container {
                                div[role="main"] {
                                    #maincontent {
                                        position: relative;
                                    }

                                    .loginform {
                                        height: 100%;
                                        display: flex;
                                        flex-flow: row nowrap;
                                        justify-content: flex-start;
                                        align-items: flex-start;
                                        min-width: 100%;
                                        flex-direction: row;
                                        .side-login {
                                            height: 100%;
                                            .side-left-mobile {
                                                display: none;
                                            }
                                        }
                                        .side-login-left {
                                            width: 100%;
                                            display: flex;
                                            flex-flow: column nowrap;
                                            justify-content: center;
                                            align-items: center;
                                            background-repeat: no-repeat;
                                            background-position: center;
                                            min-height: 100vh;
                                        }
                                        .login-instructions{
                                            .instruction-text{
                                                color: black !important;
                                            }
                                            p{
                                                a{
                                                    color: $secondary;
                                                }
                                            }
                                        }
                                        .login-instructions,
                                        .login-guest {
                                            margin-top: 20px;
                                            display: flex;
                                            flex-flow: column nowrap;
                                            justify-content: center;
                                            align-items: center;
                                            background: none !important;
                                            padding: 0 !important;
                                            h2, p {
                                                color: black !important;
                                            }
                                            h2.login-heading-signup {
                                                padding: 0 !important;
                                            }
                                        }
                                        .card-login {
                                            background-color: white;
                                            padding: 20px;
                                            border-radius: 20px;
                                            width: 35%;
                                            display: flex;
                                            flex-flow: column nowrap;
                                            justify-content: center;
                                            align-items: center;
                                            #loginlogo.login-logo {
                                                #logoimage {
                                                    max-height: 120px;
                                                }
                                            }
                                            .login-identityproviders {
                                                display: flex;
                                                flex-flow: row nowrap;
                                                justify-content: center;
                                                align-items: center;
                                                width: 100%;
                                                margin-bottom: 2em;
                                                .provider_link {
                                                    margin: 1em;
                                                }
                                            }
                                            .content-form-collapse {
                                                width: 100%;
                                                padding: 0 1em;
                                                display: flex;
                                                flex-flow: column nowrap;
                                                justify-content: center;
                                                align-items: center;
                                                margin-bottom: 1em;
                                                .collapse-form {
                                                    width: 100%;
                                                    flex-flow: row nowrap;
                                                    justify-content: center;
                                                    &.show,
                                                    &.collapsing {
                                                        display: flex;
                                                    }
                                                }
                                            }
                                            form#login {
                                                width: 60%;
                                                .login-form-username.form-group,
                                                .login-form-password.form-group {
                                                    input#username,
                                                    input#password {
                                                        border: 0;
                                                        border-bottom: 1px solid;
                                                        padding-left: 0.5em;
                                                        font-size: 1em;
                                                    }
                                                }
                                                .login-form-password.form-group {
                                                    margin-bottom: 0.3em;
                                                }
                                                .login-form-forgotpassword {
                                                    text-align: center;
                                                    a {
                                                        font-size: .8em;
                                                        text-align: center;
                                                        color: $secondary;
                                                    }
                                                }
                                                .login-form-submit {
                                                    button#loginbtn {
                                                        display: block;
                                                        margin: 0 auto;
                                                    }
                                                }
                                            }
                                            .login-languagemenu {
                                                .dropdown-toggle {
                                                    box-shadow: none;
                                                }
                                            }
                                        }
                                    }
                                }
                            }
                        }
                    }
                }
            }
        }
    }
    &.login_floating_right {
        #page {
            #page-content {
                #region-main-box {
                    #region-main {
                        .login-wrapper {
                            .login-container {
                                div[role="main"] {
                                    #maincontent {
                                        position: relative;
                                    }
                                    .loginform {
                                        height: 100%;
                                        display: flex;
                                        flex-flow: row nowrap;
                                        min-width: 100%;
                                        flex-direction: row;

                                        .side-login {
                                            height: 100%;
                                            .side-left-mobile {
                                                display: none;
                                            }
                                        }

                                        .side-login-left {
                                            width: 100%;
                                            display: flex;
                                            flex-flow: column nowrap;
                                            justify-content: center;
                                            align-items: flex-end;
                                            background-repeat: no-repeat;
                                            background-position: center;
                                            min-height: 100vh;
                                            padding: 20px 40px 20px 0;
                                        }
                                        .login-instructions{
                                            .instruction-text{
                                                color: black !important;
                                            }
                                            p{
                                                a{
                                                    color: $secondary;
                                                }
                                            }
                                        }
                                        .login-instructions,
                                        .login-guest {
                                            margin-top: 20px;
                                            display: flex;
                                            flex-flow: column nowrap;
                                            justify-content: center;
                                            background: none !important;
                                            padding: 0 !important;
                                            h2, p {
                                                color: black !important;
                                            }
                                        }

                                        .card-login {
                                            background-color: white;
                                            padding: 20px;
                                            border-radius: 20px;
                                            width: 35%;
                                            display: flex;
                                            flex-flow: column nowrap;
                                            justify-content: center;
                                            align-items: center;
                                            #loginlogo.login-logo {
                                                #logoimage {
                                                    max-height: 120px;
                                                }
                                            }

                                            form#login {
                                                width: 60%;
                                                .login-form-username.form-group,
                                                .login-form-password.form-group {
                                                    input#username,
                                                    input#password {
                                                        border: 0;
                                                        border-bottom: 1px solid;
                                                        padding-left: 0.5em;
                                                        font-size: 1em;
                                                    }
                                                }
                                                .login-form-password.form-group {
                                                    margin-bottom: 0.3em;
                                                }
                                                .login-form-forgotpassword {
                                                    text-align: center;
                                                    a {
                                                        font-size: .8em;
                                                        text-align: center;
                                                        color: $secondary;
                                                    }
                                                }
                                                .login-form-submit {
                                                    button#loginbtn {
                                                        display: block;
                                                        margin: 0 auto;
                                                    }
                                                }
                                            }
                                        }
                                    }
                                }
                            }
                        }
                    }
                }
            }
        }
    }

    &.login_floating_left {
        #page {
            #page-content {
                #region-main-box {
                    #region-main {
                        .login-wrapper {
                            .login-container {
                                div[role="main"] {
                                    #maincontent {
                                        position: relative;
                                    }
                                    .loginform {
                                        height: 100%;
                                        display: flex;
                                        flex-flow: row nowrap;
                                        min-width: 100%;
                                        flex-direction: row;

                                        .side-login {
                                            height: 100%;
                                            .side-left-mobile {
                                                display: none;
                                            }
                                        }

                                        .side-login-left {
                                            width: 100%;
                                            display: flex;
                                            flex-flow: column nowrap;
                                            justify-content: center;
                                            align-items: flex-start;
                                            background-repeat: no-repeat;
                                            background-position: center;
                                            min-height: 100vh;
                                            padding: 20px 0 20px 40px;
                                        }
                                        .login-instructions{
                                            .instruction-text{
                                                color: black !important;
                                            }
                                            p{
                                                a{
                                                    color: $secondary;
                                                }
                                            }
                                        }
                                        .login-instructions,
                                        .login-guest {
                                            margin-top: 20px;
                                            display: flex;
                                            flex-flow: column nowrap;
                                            justify-content: center;
                                            background: none !important;
                                            padding: 0 !important;
                                            h2, p {
                                                color: black !important;
                                            }
                                            h2.login-heading-signup {
                                                padding: 0 !important;
                                            }
                                        }


                                        .card-login {
                                            background-color: white;
                                            padding: 20px;
                                            border-radius: 20px;
                                            width: 35%;
                                            display: flex;
                                            flex-flow: column nowrap;
                                            justify-content: center;
                                            align-items: center;
                                            #loginlogo.login-logo {
                                                #logoimage {
                                                    max-height: 120px;
                                                }
                                            }

                                            form#login {
                                                width: 60%;
                                                .login-form-username.form-group,
                                                .login-form-password.form-group {
                                                    input#username,
                                                    input#password {
                                                        border: 0;
                                                        border-bottom: 1px solid;
                                                        padding-left: 0.5em;
                                                        font-size: 1em;
                                                    }
                                                }
                                                .login-form-password.form-group {
                                                    margin-bottom: 0.3em;
                                                }
                                                .login-form-forgotpassword {
                                                    text-align: center;
                                                    a {
                                                        font-size: .8em;
                                                        text-align: center;
                                                        color: $secondary;
                                                    }
                                                }
                                                .login-form-submit {
                                                    button#loginbtn {
                                                        display: block;
                                                        margin: 0 auto;
                                                    }
                                                }
                                            }
                                        }
                                    }
                                }
                            }
                        }
                    }
                }
            }
        }
    }

    &.login_floating_center,
    &.login_floating_right,
    &.login_floating_left {
        #page {
            #page-content {
                #region-main-box {
                    #region-main {
                        .login-wrapper {
                            .login-container {
                                div[role="main"] {
                                    .content-form-collapse {
                                        width: 100%;
                                        padding: 0 1em;
                                        display: flex;
                                        flex-flow: column nowrap;
                                        justify-content: center;
                                        align-items: center;
                                        margin-bottom: 1em;
                                        .collapse-form {
                                            width: 100%;
                                            flex-flow: row nowrap;
                                            justify-content: center;
                                            &.show,
                                            &.collapsing {
                                                display: flex;
                                            }
                                        }
                                    }
                                }
                            }
                        }
                    }
                }
            }
        }
    }
}

@media (max-height: 638px) {
    body.theme-fresk.pagelayout-login:not(#page-login-signup):not(#page-login-forgot_password) {
        #page {
            #page-content {
                height: 100%;
                #region-main-box {
                    #region-main {
                        .login-wrapper {
                            .login-container {
                                div[role="main"] {
                                    .loginform {
                                        .card-login{
                                            margin: 30px 0 30px 0;
                                        }
                                    }
                                }
                            }
                        }
                    }
                }
            }
        }
    }
}

@media (max-width: 1600px) {
    body.theme-fresk.pagelayout-login:not(#page-login-signup):not(#page-login-forgot_password) {
        #page {
            #page-content {
                height: 100%;
                #region-main-box {
                    #region-main {
                        .login-wrapper {
                            .login-container {
                                div[role="main"] {
                                    .loginform {
                                        .card-login{
                                            width: 40% !important;
                                        }
                                    }
                                }
                            }
                        }
                    }
                }
            }
        }
    }
}

@media (min-width: 768px) and (max-width: 1200px) {
    body.theme-fresk.pagelayout-login:not(#page-login-signup):not(#page-login-forgot_password) {
        #page {
            #page-content {
                height: 100%;
                #region-main-box {
                    #region-main {
                        .login-wrapper {
                            .login-container {
                                div[role="main"] {
                                    .loginform {
                                        .card-login{
                                            width: 50% !important;
                                        }
                                        .login-form-submit {
                                            button#loginbtn {
                                                width: 70% !important;
                                            }
                                        }
                                    }
                                }
                            }
                        }
                    }
                }
            }
        }
    }
}

@media (max-width: 768px) {
    body.theme-fresk.pagelayout-login:not(#page-login-signup):not(#page-login-forgot_password) {
        #page {
            #page-content {
                height: 100%;
                #region-main-box {
                    #region-main {
                        .login-wrapper {
                            .login-container {
                                div[role="main"] {
                                    .loginform {
                                        .side-login-left {
                                            align-items: center !important;
                                            padding: 0 !important;
                                            margin-bottom: 45px !important;
                                        }
                                        .card-login{
                                            width: 80% !important;
                                        }
                                    }
                                }
                            }
                        }
                    }
                }
            }
        }
        &.login_default_left,
        &.login_default_right
        {
            #login {
                width: 80% !important;
            }
        }
        .top-decorations,
        .left-decorations {
            display: none;
        }
    }
}


@media (max-width: 750px) and (min-width: 581px) {
    body.theme-fresk.pagelayout-login:not(#page-login-signup):not(#page-login-forgot_password) {
        #page {
            #page-content {
                #region-main-box {
                    #region-main {
                        .login-wrapper {
                            .login-container {
                                div[role="main"] {
                                    .loginform {
                                        .side-login-right .card-login {
                                            p {
                                                padding: 1em;
                                            }

                                            .login-identityproviders {
                                                flex-flow: row wrap;
                                                padding: 1em;
                                            }

                                            div.d-flex {
                                                flex-flow: row wrap;
                                                padding: .7em;
                                            }
                                        }
                                        .lenguaje-cookie-buttons{
                                            flex-direction: column;
                                        }
                                    }
                                }
                            }
                        }
                    }
                }
            }
        }
        .top-decorations,
        .left-decorations,
        #page-footer {
            display: none;
        }
    }
}

@media (max-width: 580px) {
    body.theme-fresk.pagelayout-login:not(#page-login-signup):not(#page-login-forgot_password) {
        #page {
            #page-content {
                height: 100%;
                #region-main-box {
                    #region-main {
                        .login-wrapper {
                            .login-container {
                                div[role="main"] {
                                    .loginform {
                                        .side-login {
                                            .side-left-mobile {
                                                display: block !important;
                                                h2, p {
                                                    color: black !important;
                                                    padding: 0 20px;
                                                }
                                                p {
                                                    margin-bottom: 0 !important;
                                                }
                                                .login-instructions{
                                                    margin-bottom: 0 !important;
                                                }
                                                .login-instructions,
                                                .login-guest{
                                                    .login-signup{
                                                        margin-top: 20px;
                                                    }
                                                    display: flex;
                                                    align-items: center;
                                                    justify-content: center;
                                                    background: none !important;
                                                    text-align: center;
                                                    margin: auto;
                                                    color: black !important;
                                                }
                                            }
                                        }
                                        .side-login-left {
                                            width: 0;
                                            display: none;
                                        }
                                        .side-login-right {
                                            width: 100%;
                                        }
                                    }
                                }
                            }
                        }
                    }
                }
            }
        }
    }
}

@include media-breakpoint-up(md) {
    .login-container {
        width: 100% !important; /* stylelint-disable-line declaration-no-important */
        @include border-radius();
    }
}
@include media-breakpoint-up(md) {
    .login-wrapper {
        padding-top: 0!important;
        padding-left: 0!important;
    }
}