:root {
    --bg-color: rgb(23, 26, 28);
    --text-color: #e2e2e2;
    --button-color: #78009c;
    --border-color: #d64dff;
}

html {
    background-color: var(--bg-color);
    color: var(--text-color);
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

button {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

#chair {
    position: fixed;
    width: 100vw;
    height: 100vh;
    font-family: "Scream";
    font-size: 13em;
    text-align: center;
    color: rgb(23, 26, 29);
    z-index: -1;
}

#wtasm {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 5em;
}

.weclome-to-a {
    font-family: "PhutureRndClsd";
    font-size: 4em;
    margin: 0px;
}

.scary-movie {
    font-family: "Scream";
    font-size: 8em;
    width: 4.6em;
    line-height: 0.9em;
    margin: 0px;
}

.developers {
    font-family: "PhutureRndClsd";
    font-size: 1.5em;
    width: 15em;
    text-align: center;
    margin: 0px;
}

.developers:hover span {
    display: none;
}

.developers:hover::before {
    content: "Formerly a mod for Welcome to the Game, now a fangame!";
}

#pageContent {
    display: flex;
    flex-direction: column;
    align-items: center;
}

#gameButtons {
    display: flex;
    justify-content: space-between;
}

.buttonHelper {
    width: 15em;
    display: flex;
    align-items: center;
    justify-content: center;
}

.bigButtonHelper {
    width: 20em;
}

.wtasmButton {
    background-color: var(--button-color);
    border: solid var(--button-color);
    color: var(--text-color);
    padding: 16px 32px;
    text-align: center;
    font-size: 1em;
    font-size: 16px;
    text-decoration: none;
}

.wtasmButton:active,
.wtasmButton:hover {
    background-color: transparent;
    border: solid var(--border-color);
    cursor: pointer;
}

.wtasmButton:active {
    border: solid var(--text-color);
}

.disabledwtasmButton {
    background-color: var(--button-color);
    border: solid var(--button-color);
    color: var(--text-color);
    padding: 16px 32px;
    text-align: center;
    font-size: 1em;
    opacity: 0.25;
    text-decoration: none;
}

.downloadbutton:hover span {
    display: none;
}

.downloadbutton:hover::before {
    content: "when it's released";
}

.godotLetUs:hover span {
    display: none;
}

.godotLetUs:hover::before {
    content: "if Godot will let us export to web";
}

#factText {
    text-align: center;
}

#discord {
    color: #abddff;
}

#discord:visited {
    color: #d19ffa;
}

#foot {
    margin: 0px;
    margin-top: 25em;
    font-size: 0.8em;
    text-align: center;
}

@font-face {
    font-family: 'Scream';
    src: url('SCREAM.ttf');
}

@font-face {
    font-family: 'PhutureRndClsd';
    src: url('PhutureRndClsd\ Bold.ttf');
}

@font-face {
    font-family: 'Screengem';
    src: url('Screengem.otf');
}