a.spoiler {
    background-color: var(--main-text);
    color: var(--main-text);
    transition-duration: 0.1s;
}

a.spoiler:focus,
a.spoiler:active,
a.spoiler:hover {
    background-color: unset;
    color: unset;
} 

div.quote {
    background-color: var(--quote-bg, #cacaca);
    border: var(--quote-border, 1px solid #9b9481);
    padding: 4px;
    margin: 2px;
}

div.quote .subq {
    font-family: var(--spfont1, Pixio);
    margin: -4px -4px 2px -4px;
    border-bottom: var(--quote-border, 1px solid #9b9481);
    display: flex;
    padding: 2px;
}

div.quote .subq .userlink { flex-grow: 1; }

div.quote .subq .qjump a {
    padding: 4px;
}

div.spoiler {
    padding: 4px;
    margin: 2px;
    overflow-y: hidden;
}

div.spoiler > div.contents {
    display: none;
    background-color: var(--spoiler-bg, #b0b0b0);
    border: var(--spoiler-border, 1px solid #1c1c1c);
    border-top: none;
    margin: -2px -4px;
    padding: 4px;
}

div.spoiler.shown > div.contents {
    display: block;
}

div.spoiler > .title {
    background: var(--spoiler-header-bg, #1c1c1c);
    border-bottom: var(--spoiler-border, 1px solid #1c1c1c);
    color: var(--spoiler-header-text, #E8E8E8);
    font-family: var(--spfont1, Pixio);
    margin: -4px -4px 2px -4px;
    padding: 4px;
    cursor: pointer;
}

div.codeblock {
    background-color: var(--code-bg, #ffffff63);
    border: var(--menu-border, 1px solid #bdbdbd);
    color: var(--code-text, #000000);
    padding: 4px;
    margin: 2px;
}

div.codeblock pre {
	white-space: normal;
}

div.codeblock > .title {
    font-family: var(--spfont1, Pixio);
    margin: -4px -4px 2px -4px;
    padding: 4px;
    border-bottom: var(--quote-border, 1px solid #9b9481);
}

embed-container {
    display: inline-flex;
    vertical-align: middle;
    margin: 4px;
    width: 550px;
    height: 400px;
    background-color: #000C;
    align-items: center;
    flex-direction: column;
}

embed-container > a {
    margin: auto;
    width: 96px;
    cursor: pointer;
    text-align: center;
}

embed-container .flashbar {
    display: flex;
    color: white;
    height: 32px;
    padding: 0px 4px;
    width: 90%;
}

embed-container .flashbar * {
    cursor: pointer;
}
embed-container .flashbar a:link,
embed-container .flashbar a:visited {
    color: white;
}

embed-container .flashbar a img {
    vertical-align: middle;
}

embed-container .flashbar .pause {
    font-size: 24px;
    font-family: Pixio;
}