:root {
  --highlight-color: #458588;
  --bg-color: #282828;
  --text-color: #fbf1c7;
}

@font-face {
  font-family: Pochaevsk;
  src: url(/assets/Pochaevsk-Regular.ttf);
}

header {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}

html {
  margin: 0% 10% 0% 10%;
  font-family: Pochaevsk;
  font-size: 150%;
  color: var(--text-color);
  background: var(--bg-color);
  word-wrap: break-word;
}

img {
  width: 50%;
}

header {
  --pagefind-ui-border-radius: 0px;
  --pagefind-ui-image-border-radius: 0px;
  --pagefind-ui-font: initial;
  --pagefind-ui-primary: var(--highlight-color);
  --pagefind-ui-text: var(--text-color);
  --pagefind-ui-background: var(--bg-color);
  --pagefind-ui-border: var(--text-color);
  --pagefind-ui-tag: var(--highlight-color);
}

a {
  text-decoration: underline dotted;
  color: var(--text-color);
}

a:hover {
  text-decoration: underline solid;
  background: var(--text-color);
  color: var(--bg-color);
}

code {
	font-family: "Fira Code", "Fira Mono", Menlo, Consolas, "DejaVu Sans Mono", monospace;
  font-size: 80%;
}

blockquote {
    background: #45858860;
	border-radius: 0;
	padding: 0.1em 0.6em;
}

table, th, td {
  border: 1px solid var(--text-color);
  justify-content: center;
}

table {
  white-space: nowrap;
}

th, td {
  margin-left: 5%;
  margin-right: 5%;
}


/* tablet/mobile view */
@media only screen and (max-width: 800px) {
    html {
        font-size: 100%;
        margin: 0% 0% 0% 0%;
    }
    header {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-items: center;
    }
}