.logout-page {
    text-align: center;
}

@keyframes play {
    100% {
        background-position: -6400px;
    }
}

body {
    background: black;
    color: white;
    margin: 0;
    min-height: 100%;
}

#background {
    background-image: radial-gradient(
            circle farthest-corner at -25% -50%,
            #0d1117 36%,
            rgba(13, 17, 23, 0) 48%
        ),
        radial-gradient(
            circle farthest-corner at -25% 150%,
            #0d1117 45%,
            rgba(13, 17, 23, 0) 89%
        ),
        radial-gradient(
            circle farthest-corner at -25% -100%,
            rgba(13, 17, 23, 0) 55%,
            rgba(13, 17, 23, 0.28) 65%,
            rgba(13, 17, 23, 0) 68%
        ),
        radial-gradient(
            circle farthest-corner at -33% -75%,
            #1f00cc 48%,
            rgba(131, 5, 49, 0) 56%
        ),
        radial-gradient(
            circle farthest-side at 0% -50%,
            rgba(13, 17, 23, 0) 64%,
            rgba(1, 2, 36, 0.4) 69%,
            rgba(13, 17, 23, 0) 81%
        ),
        radial-gradient(
            circle farthest-corner at 0% -50%,
            rgba(13, 17, 23, 0) 33%,
            #010c5f 51%,
            rgba(13, 17, 23, 0) 72%
        );
    background-repeat: no-repeat;
    background-size: auto;
    margin: 0;
    min-height: 100vh;
}

#logo-center {
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    overflow: hidden;
    width: 50vw;
    margin: 0 auto;
    padding-top: 25vh;
    padding-bottom: 3em;
}

.content-centered {
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    margin: 0px auto;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: center;
}

.login-button {
    height: auto;
    border-radius: 20px;
    background-color: transparent;
    background-image: linear-gradient(120deg, #ff4713 28%, #fdb825);
    -webkit-transition: none 0ms ease;
    transition: none 0ms ease;
    color: white;
    font-size: 1em;
    position: relative;
    z-index: 5;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    overflow: hidden;
    padding: 0.75em 1.25em;
    margin: 0.5em;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 9999px;
    background-color: #0052cc;
    -webkit-transition: color 200ms cubic-bezier(0.165, 0.84, 0.44, 1);
    transition: color 200ms cubic-bezier(0.165, 0.84, 0.44, 1);
    font-family: 'IBM Plex Sans', sans-serif;
    font-size: 1.125em;
    line-height: 1;
    font-weight: 600;
    text-align: center;
    letter-spacing: -0.01em;
}

h1 {
    font-family: 'IBM Plex Mono', sans-serif;
    color: #ccdae7;
    font-size: 3em;
    line-height: 1.1;
    font-weight: 700;
    letter-spacing: -0.02em;
}

a:link {
    text-decoration: none;
}

a:visited {
    text-decoration: none;
}

a:hover {
    text-decoration: none;
    color: purple;
}

a:active {
    text-decoration: none;
}

.btn-geolumina {
    color: black;
    font-size: 1.2rem;
    padding: 0.6rem !important;
    background: linear-gradient(#ffa724, #ff8300) !important;
    border-radius: 0.4rem !important;
    border-width: 0 !important;
    text-shadow: 0px -1px 0px rgba(255, 131, 0) !important;
    box-shadow:
        0px 2px 0px #ff8400d7,
        0px 1px 5px rgba(0, 0, 0, 0.3),
        inset 0px 1px 0px rgba(255, 255, 255, 0.2),
        inset 0px 0px 1px rgba(255, 255, 255, 0.4) !important;
}

.btn-geolumina:hover {
    background: linear-gradient(#ffc524, #ff9900) !important;
    color: whitesmoke;
}

.btn-geolumina:focus {
    background: linear-gradient(bottom, #ff8300, #ffa724) !important;
    border: none;
    outline: none;
}
