body {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: 0;
  width: 100%;
  padding: 4pt;
  line-height: 1.4em; }
  body header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 28pt;
    margin-bottom: 0;
    padding: 2pt;
    background: #fff;
    box-shadow: 0 0 10pt rgba(50, 16, 64, 0.6);
    z-index: 1;
    display: flex;
    flex-direction: row; }
    body header #header-logo {
      width: initial;
      flex: 0 0 auto; }
      body header #header-logo img {
        height: 28pt; }
    body header #google-search {
      display: none;
      visibility: hidden; }
  body #main {
    margin-top: 35pt; }
    body #main #main-main {
      display: block;
      width: 100%;
      margin-top: 3pt; }
      body #main #main-main .post-body {
        overflow-y: auto; }
    body #main #main-sub {
      display: block;
      width: 100%; }
      body #main #main-sub .sidebar {
        margin: 0; }
      body #main #main-sub .twitter-container {
        display: none;
        visibility: hidden; }
  body #foot-ads {
    overflow: hidden; }

.contents h1, .contents h2, .contents h3 {
  padding-left: 0.1em;
  line-height: 1.20em; }
.contents ul > li {
  margin-left: 1.5em; }
.contents .post-nav {
  display: flex;
  flex-direction: row; }
  .contents .post-nav > li {
    position: static;
    flex: 0 1 50%;
    margin-left: 4px; }
    .contents .post-nav > li > a {
      padding: 4.5pt;
      display: block;
      min-width: inherit;
      max-width: inherit; }
    .contents .post-nav > li:first-child {
      margin-left: 0; }
.contents .post-body img {
  width: 100%;
  margin-left: 0; }
.contents .highlight {
  margin-left: 0.2em;
  margin-right: 0.2em;
  padding: 0.3em; }
.contents nav + h1 {
  margin-top: 0;
  padding-top: 3pt; }

header > label.top-nav-switch {
  display: inline-block;
  visibility: visible;
  width: 28pt;
  height: 28pt;
  flex: 0 0 auto;
  background-image: url("/assets/images/bars.svg");
  background-size: 75%;
  background-repeat: no-repeat;
  background-position: center center; }

body nav#top-nav {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  width: 100%;
  z-index: 2;
  display: flex;
  flex-direction: row; }
  body nav#top-nav ul.top-nav {
    display: block;
    max-width: 50%;
    height: 100%;
    flex: 0 1 auto;
    box-sizing: border-box;
    border-radius: initial;
    border: none;
    overflow-x: hidden;
    overflow-y: auto;
    background: #fff;
    color: #000; }
    body nav#top-nav ul.top-nav > li {
      display: block; }
      body nav#top-nav ul.top-nav > li > a {
        display: block;
        width: 100%;
        border: none;
        box-sizing: border-box;
        padding: 1.0em 1.5em; }
      body nav#top-nav ul.top-nav > li.selected > a {
        background: none; }
      body nav#top-nav ul.top-nav > li > a:hover, body nav#top-nav ul.top-nav > li > a:active {
        background: #f00;
        color: #fff; }
  body nav#top-nav label.top-nav-back {
    visibility: initial;
    display: block;
    height: 100%;
    flex: 1 1 auto; }
body input[type='checkbox'] + nav#top-nav {
  visibility: hidden;
  transition: visibility 0s 0.1s; }
  body input[type='checkbox'] + nav#top-nav ul.top-nav {
    width: 0;
    transition: width 0.1s 0s; }
  body input[type='checkbox'] + nav#top-nav label.top-nav-back {
    visibility: hidden;
    background: rgba(0, 0, 0, 0);
    transition: background-color 0.1s 0s, visibility 0s 0.1s; }
body input[type='checkbox']:checked + nav#top-nav {
  visibility: visible;
  transition: visibility 0s 0s; }
  body input[type='checkbox']:checked + nav#top-nav ul.top-nav {
    width: inherit;
    transition: width 0.2s 0s; }
  body input[type='checkbox']:checked + nav#top-nav label.top-nav-back {
    visibility: visible;
    background: rgba(0, 0, 0, 0.75);
    transition: background-color 0.2s 0s, visibility 0s 0s; }