@import url("/static/videojs/video-js.min.css");
@font-face {
  font-family: noto-sans-mono;
  src: url(/static/NotoSansMono-Regular.ttf);
}

body {
  font-family: noto-sans-mono;
  background-color: #000;
  color: #33ff00;
  font-size: 14pt;
  font-smooth: none;
  -webkit-font-smoothing: none;
  -moz-osx-font-smoothing: grayscale;
}

header#miniblog-header, section#miniblog-left, section#miniblog-main, nav#miniblog-nav {
  background-color: #282828;
  border-radius: 0.2em;
  box-sizing: border-box;
  border: 2px solid;
}

header#miniblog-header {
  text-align: center;
  margin-bottom: 0.4em;
}

section#miniblog-left, nav#miniblog-nav {
  padding: 2px
}

h1 {
  margin: 0;
}

a {
  color: #33ff00;
}

a:visited {
  color: #24b300;
}

a:hover {
  color: #282828;
  background-color: #33ff00;
}

a:active {
  color: #282828;
  background-color: #33ff00;
  text-decoration: none;
}

img {
  padding: 5px;
  border: 1px solid #33ff00;
  max-width: 80%;
}

iframe {
  padding: 5px;
  border: 1px solid #33ff00;
}

blockquote {
  padding: 10px;
  border: 3px double #33ff00;
}

blockquote > footer {
  text-align: right;
}

code {
  font-weight: bold;
}

pre {
  border: 3px double #33ff00;
  padding: 10px;
  overflow-x: scroll;
}

li {
  margin-bottom: 5px;
}

section.comments {
  padding: 10px;
  border: 1px solid #33ff00;
}

div.comment-block {
  margin-top: 2px;
}

div.comment-reply {
  margin-left: 10px;
  margin-top: 2px;
}

section.comments h3 {
  margin: 0 0 5px 0;
}

div.comment-block h4 {
  margin: 0;
}

div.single-comment {
  border: 1px solid #33ff00;
  padding: 5px;
  isolation: isolate;
}

div#username,div#title {
  margin-bottom: 2px;
}

div#reply-to {
  display: none;
}

input[type=text] {
  background: #000;
  color: #3f0;
  caret-color: #3f0;
  font-family: noto-sans-mono;
  border: 0;
  font-size: 14pt;
  padding: 2px;
}
@media screen and (max-aspect-ratio: 1/1) {
  table.calendar { font-size: 26pt; }
  section#miniblog-left { margin-bottom:0.4em; }
  section#miniblog-main { margin-bottom:0.4em; }
  nav#miniblog-nav { background-color: #282828; border-radius: 0.2em; box-sizing: border-box; border: 2px solid; padding:2px; }
}

@media screen and (min-aspect-ratio: 1/1) {
  section#miniblog-main { margin-left:0.5%; margin-right:0.5%; width:62%; }
  nav#miniblog-nav { width: 22%; }
}