/* General */
@media screen and (min-width: 641px) {body {margin: 50px;}}
@media screen and (max-width: 640px) {body {margin: 25px;}}
body {max-width: 512px; overflow-x: hidden;}
body.black {background-color: #2d2d2d;}
body.black section a:not(.hashover-more-link),
body.black footer a:not(.hashover-more-link) {color: rgb(229,87,44);}
body.black a > span {color: inherit !important;}
body.black code {background-color: inherit;}
body.black li {color: white;}
p, blockquote, li, figcaption, details, aside {text-align: left;}

/* Header */

header {padding: .25em; color: white; background: rgb(229,87,44);}
header > * {margin: 0;}
header a:link, header a:visited, header a:hover, header a:active {color: white;}
header h1 {font-size: 1.5em; line-height: 1.15;}
header p {font-size: 0.85em;}

/* Buttons */

div#controllers {
  position: fixed;
  right: .75em;
  bottom: 2.25em;
  width: 1.5em;
  height: 4.5em;
  clear: both;
}

div#controllers * {
  float: left;
  width: 1.5em;
  height: 1.5em;
  text-align: center;
  font-size: 1.5em;
  cursor: pointer;
  color: white;
  background: rgb(229,87,44);
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Section */

section {margin-top: 50px}
section > * {text-align: left !important;}
section h1 {margin: 0em; margin-bottom: 1em; font-size: 1.15em;}
section code {font-size: 0.75em;}
section .post {margin-top: 1em;}
section .post p {text-indent: 0;}
section .post p:first-child {font-size: 1.15em;}

/* Entry */

.published {
  margin: 0;
  margin-top: -1.5em;
  margin-bottom: 1.5em;
  font-size: .85em;
}

figure {
  margin: 1em auto;
}

figcaption:before {
  content: '▣';
}

figcaption {
  margin: 0;
  padding: 0 0 .5em 0;
  border-bottom: 1px solid lightgray;
}

@media screen and (max-width: 640px) {
  img {
    width: 100vw;
    margin-left: -25px;
  }
}

@media screen and (min-width: 768px) {
  figcaption {
    float: right;
    width: calc(35% - 2em);
    margin-top: 0;
    margin-right: -35%;
    padding: 0 1em;
    border: none;
    -webkit-hyphens: none;
    -ms-hyphens: none;
    hyphens: none;
  }

  figcaption:before {
    display: block;
  }
}

/* Footer */

footer {margin-top: 50px;}
footer {font-size: .85em;}