.Login {
}

    .Login .Wide {
        background-color: rgba(218,220,221,1);
        min-height: 100vh;
    }

        .Login .Wide .Stripes {
            display: block;
            height: 8px;
            width: 100vw;
        }

        .Login .Wide .Body {
            background-image: url("../../assets/login-background-wide.png?V=1");
            background-position: center;
            height: 800px;
        }

        .Login .Wide .LogoContainer {
            justify-content: center;
            padding-top: 80px;
            text-align: center;
        }

            .Login .Wide .LogoContainer img {
                width: 144px;
            }

        .Login .Wide .PageTitle {
            color: #ffffff;
            font-size: 30px;
            font-weight: 500;
            margin-top: 30px;
            text-align: center;
        }

        .Login .Wide .FormContainer {
            background-color: #ffffff;
            border-radius: 16px;
            margin-bottom: 50px;
            margin-left: auto;
            margin-right: auto;
            margin-top: 50px;
            padding-bottom: 20px;
            padding-left: 40px;
            padding-right: 40px;
            padding-top: 20px;
            width: 400px;
        }

            .Login .Wide .FormContainer .Title {
                color: var(--custom-color-1);
                font-size: 16px;
                font-weight: 700;
            }

            .Login .Wide .FormContainer .LoginName {
                margin-top: 10px;
            }

            .Login .Wide .FormContainer .Password {
                margin-top: 10px;
            }

            .Login .Wide .FormContainer .LoginButton {
                margin-top: 10px;
            }

                .Login .Wide .FormContainer .LoginButton button {
                }

            .Login .Wide .FormContainer .LoginText {
                margin-top: 10px;
                text-align: center;
            }

        .Login .Wide .Icons {
            justify-content: center;
            text-align: center;
        }

            .Login .Wide .Icons img {
                width: 100px;
            }




        .Login .Wide > .Footer {
            background-color: #565b60;
            color: #b6b9bc;
            font-size: 1.6rem;
            margin-top: 5rem;
            padding-bottom: 20px;
            padding-left: 20px;
            padding-right: 20px;
            padding-top: 20px;
        }

            .Login .Wide > .Footer a {
                color: #b6b9bc;
            }

            .Login .Wide > .Footer .Logo {
                padding: 20px;
                text-align: center;
            }

                .Login .Wide > .Footer .Logo img {
                    height: 5rem;
                    margin-right: 1rem;
                }

            .Login .Wide > .Footer .Contact {
                border-top: solid 1px rgba(182, 185, 188, 1);
                color: rgba(182, 185, 188, 1);
                font-size: 15px;
                margin-top: 10px;
                margin-left: 10px;
                margin-right: 10px;
                padding-top: 10px;
            }

            .Login .Wide > .Footer .Social {
                border-top: solid 1px rgba(182, 185, 188, 1);
                padding: 20px;
                margin-top: 10px;
                margin-left: 10px;
                margin-right: 10px;
            }

                .Login .Wide > .Footer .Social a {
                    color: rgba(182, 185, 188, 1);
                    font-size: 30px;
                    margin-left: 10px;
                    margin-right: 10px;
                }

            .Login .Wide > .Footer .Credits {
                color: rgba(182, 185, 188, 1);
                font-size: 13px;
                margin-top: 10px;
                margin-left: 10px;
                margin-right: 10px;
                padding: 20px;
            }

                .Login .Wide > .Footer .Credits a {
                    color: rgba(182, 185, 188, 1);
                }


    .Login .Narrow {
        background-color: rgba(218,220,221,1);
        min-height: 100vh;
    }

        .Login .Narrow .Stripes {
            display: block;
            height: 8px;
            width: 100vw;
        }

        .Login .Narrow > .Header {
        }

            .Login .Narrow > .Header .Header2 {
                top: 0.4rem;
            }

                .Login .Narrow > .Header .Header2 .Theme {
                    width: 100vw;
                }

                .Login .Narrow > .Header .Header2 .Logo {
                    position: absolute;
                    right: calc(50vw - 45px);
                    top: 1.5rem;
                }

        .Login .Narrow .Body {
            margin-top: 4rem;
            padding-left: 2rem;
            padding-right: 2rem;
        }

            .Login .Narrow .Body input.form-control {
                padding: 1.2rem;
            }

        .Login .Narrow .Title {
            color: #d5001a;
            font-size: 1.8rem;
            font-weight: bold;
        }

        .Login .Narrow .Login .NarrowName {
            margin-top: 1.5rem;
        }

        .Login .Narrow .Password {
            margin-top: 1.5rem;
        }

        .Login .Narrow > .Body .LoginName {
            margin-top: 15px;
        }

        .Login .Narrow > .Body .LoginButton {
            margin-top: 1.5rem;
        }

            .Login .Narrow > .Body .LoginButton button {
                background-image: linear-gradient(to right, #b6b9bc, #565b60);
                border: none;
                border-radius: 1rem;
                color: #ffffff;
                font-size: 1.1em;
                font-weight: 600;
                padding: 1.7rem;
                width: 100%;
            }

        .Login .Narrow > .Body .LoginText {
            margin-top: 10px;
            text-align: center;
        }

        .Login .Narrow > .Body .Error {
            color: #d5001a;
            text-align: center;
        }

        .Login .Narrow > .Footer {
            background-color: #565b60;
            color: #b6b9bc;
            font-size: 1.6rem;
            margin-top: 5rem;
            padding-left: 2rem;
            padding-right: 2rem;
        }

            .Login .Narrow > .Footer a {
                color: #b6b9bc;
            }

            .Login .Narrow > .Footer .Logo {
                border-bottom: solid 1px #b6b9bc;
                padding: 2rem;
                text-align: center;
            }

                .Login .Narrow > .Footer .Logo img {
                    height: 5rem;
                    margin-right: 1rem;
                }

            .Login .Narrow > .Footer .Contact {
                border-bottom: solid 1px #b6b9bc;
                padding: 2rem 5rem;
            }

            .Login .Narrow > .Footer .Social {
                padding: 2rem;
                text-align: center;
            }

                .Login .Narrow > .Footer .Social a {
                    font-size: 3rem;
                    margin-left: 1rem;
                    margin-right: 1rem;
                }

        .Login .Narrow .Credits {
            background-color: #ffffff;
            color: #b6b9bc;
            font-size: 1.5rem;
            padding: 1rem;
        }

            .Login .Narrow .Credits a {
                color: #b6b9bc;
            }