.btn {
    display: inline-flex;

    align-items: center;
    height: 2em;
    vertical-align: middle;
    line-height: 1;

    font-size: 16px;

    border-radius: 6px;
    text-decoration: none;
    padding: 0 12px;

    --btn-font: inherit;
    --btn-font-weight: 400;
    --btn-bg: #000000;
    --btn-color: #ffffff;
    --btn-border: transparent;

    font-family: var(--btn-font);
    font-weight: var(--btn-font-weight);
    background: var(--btn-bg);
    color: var(--btn-color);
    border: 2px solid var(--btn-border);
    box-shadow: 0 4px 2px rgba(0,0,0,0.15);

    cursor: pointer;
}

.btn--osu {
    --btn-font: "Torus", sans-serif;
    --btn-font-weight: 400;
    --btn-bg: #ff66aa;
    --btn-color: #ffffff;
    --btn-border: #ffffff;
}

.btn--github {
    --btn-font: "MonaSans", sans-serif;
    --btn-font-weight: 400;
    --btn-bg: #0A241B;
    --btn-color: #F2F5F3;
    --btn-border: #F2F5F3;
}

.btnContainer {
}

.btn:hover { transform: translateY(-1px); box-shadow: 0 6px 6px rgba(0,0,0,0.16); }
.btn:active { transform: translateY(0); }
.btn:focus { outline: 3px solid rgba(0,0,0,0.12); outline-offset: 2px; }