/*
Background color: #222426
Code background color: #3E3F3A / #323436?
Accent color: #ED7615
Accent dark: #C95000
Text color: #C9CACC
Side color: #666
*/

body {
  box-sizing: border-box;
  min-width: 200px;
  max-width: 700px;
  margin: 0 auto;
  padding: 45px;
  background-color: #222426;
  color: #C9CACC;
  font-family: "Menlo", monospace;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.725;
  -webkit-font-smoothing: antialiased;
  text-rendering: geometricPrecision;
}

.wrapper {
  margin: 10px;
}

small, footer {
  font-size: 12px;
  color: #666;
}
footer {
  margin-top: 50px;
}

input[type=checkbox] {
  color: green;
}

a:link, a:visited {
  color: #ED7615;
  text-decoration: none;
}

a:hover, a:active {
  color: #C95000;
  text-decoration: none !important;
}

@media (max-width: 767px) {
  body {
    padding: 15px;
  }
}

header {
  margin: 0 0 30px 0;
}

#header-top > a {
  display: flex;
}

#logo {
  flex: none;
  margin-right: 20px;
}
#header-top #logo {
  filter: grayscale(100%);
}
#header-top:hover #logo {
  filter: none;
}
#title {
  line-height: 1.2;
  flex: 1;
}
#title h1 {
  margin: 0;
}
#header-top a {
  color: #C9CACC;
}

#navigation {
  font-size: 0.9em;
  margin: 3px;
}
.navigation-item {
  padding-left: 10px;
}
.navigation-item:not(:last-child) {
  border-right: 1px dotted #ED7615;
}

/* Home */
.home > h1:first {
  color: #ED7615;
}
.post-list {
  list-style-type: none;
  padding-left: 5px !important;
}
@media (min-width: 480px) {
  .post-list-item {
    display: flex;
  }
}
.post-list-meta {
  margin-right: 20px;
}
.pagination {
  margin-top: 30px;
  display: flex;
  font-size: 0.9em;
}
.pagination-arrow {
  width: 40px;
  font-weight: 700;
  text-align: center;
}

/* Posts */
.post-title {
  margin-bottom: -10px !important;
  color: #ED7615;
}
.post-content {
  margin: 30px 0;
}