html {
  max-width: 1200px;
  margin: 0 auto;
  background-color: #282a36;
  color: #fff
}

body {
  line-height: 1.6;
  font-size: 18px;
  margin: 1em auto;
  padding: 0 .55em
}

header {
  display: flex;
  justify-content: center;
}

header ul {
  float: right
}

header span {
  list-style-type: none;
  display: inline;
  padding: 0 .2rem 0 .2rem;
  vertical-align: middle
}

a {
  text-decoration: none;
  color: #FF6266
}

.post {
  margin-bottom: 25px;
}

.tag, time.post {
  color: #fff;
  text-transform: uppercase;
  font-size: 10px;
  border: #fff solid 1px;
  border-radius: 2px;
  padding: 4px;
  margin-right: 5px
}

ul.nav {
  list-style: none;
  padding-left: 0
}


h1.title {
  margin-bottom: -10px
}

pre, code {
  background-color: #44475a;
  color: #fff;
  border-radius: 5px;
  padding: 5px;
  font-size: 12px;
  overflow-x: auto;
  width: 90%;
  margin: auto;
}

.inserted-sign {
  background-color: hsl(126, 31%, 39%)
}

.token.prefix.inserted, .token.prefix.deleted {
  background-color: #15202b
}

.deleted-sign {
  background-color: hsl(0, 51%, 37%)
}

mark {
  background-color: #f1fa8c
}

.post-nav-next {
  float: right
}

blockquote {
  background-color: #44475a;
  border-left: 10px solid #ccc;
  margin: 1.5em 10px;
  padding: .5em 10px
}

blockquote p {
  display: inline
}

.more-posts-notification {
  margin-top: 30px;
}

.contact-in-about {
  margin-top: 20px;
}

.contact-in-about > * {
  margin-right: 10px;
}

.active > a {
  text-decoration: underline;
}

.read-time {
  color: #FF6266
}

#search {
  border-radius: 10px;
  height: 28px;
  padding-left: 10px;
}

#search:focus {
  outline: none;
}