@keyframes appear {
    0% {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0px);
    }
}

.root {
    text-align: center;
    color: #c2c4c2;
    a {
        color: #c2c4c2;
        text-decoration: none;
    }
    h1, h3 {
        font-weight: 400;
    }
    .h1, .h2, .buttons {
        animation: appear 1.5s ease;
    }
    .h1 { margin-top: 10% }
    .h2 { animation-delay: 750ms }
    .buttons {
        animation-delay: 1450ms;
        button {
            background: #0001;
            border: 1px solid #767876;
            border-radius: 6px;
            padding: 6px 12px;
            margin: 3px 2px;
            color: #c2c4c2;
            transition: 150ms ease;

            &:hover {
                transform: translateY(-1px);
            }
            &:active {
                transform: scale(0.98);
                background: #0008;
            }
        }
    }

    .made_in {
        position: fixed;
        bottom: 16px; left: 0%;
        width: 100%;
        text-align: center;
        margin: 0;
        font-size: 12pt;
        color: #ffffff40
    }
}