body {
  width: 100%;
}
body:before,
body:after {
  content: "";
  display: table;
}
body:after {
  clear: both;
}
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-weight: inherit;
  font-style: inherit;
  font-family: inherit;
  font-size: 100%;
  vertical-align: baseline;
}
body {
  line-height: 1;
  color: #000;
  background: #fff;
}
ol,
ul {
  list-style: none;
}
table {
  border-collapse: separate;
  border-spacing: 0;
  vertical-align: middle;
}
caption,
th,
td {
  text-align: left;
  font-weight: normal;
  vertical-align: middle;
}
a img {
  border: none;
}
input,
button {
  margin: 0;
  padding: 0;
}
input::-moz-focus-inner,
button::-moz-focus-inner {
  border: 0;
  padding: 0;
}
@font-face {
  font-family: FontAwesome;
  font-style: normal;
  font-weight: normal;
  src: url("fonts/fontawesome-webfont.eot?v=#4.0.3");
  src: url("fonts/fontawesome-webfont.eot?#iefix&v=#4.0.3") format("embedded-opentype"), url("fonts/fontawesome-webfont.woff?v=#4.0.3") format("woff"), url("fonts/fontawesome-webfont.ttf?v=#4.0.3") format("truetype"), url("fonts/fontawesome-webfont.svg#fontawesomeregular?v=#4.0.3") format("svg");
}
html,
body,
#container {
  height: 100%;
}
body {
  background: #eee;
  font: 14px "Helvetica Neue", Helvetica, Arial, sans-serif;
  -webkit-text-size-adjust: 100%;
}
a {
  text-decoration: blink;
}
.outer {
  margin: 0 auto;
  padding: 0 20px;
}
.outer:before,
.outer:after {
  content: "";
  display: table;
}
.outer:after {
  clear: both;
}
@media screen and (max-width: 479px) {
  .outer {
    padding: 0 10px;
  }
}
.inner {
  display: inline;
  float: left;
  width: 97.77777777777777%;
  margin: 0 1.111111111111111%;
}
.left,
.alignleft {
  float: left;
}
.right,
.alignright {
  float: right;
}
.clear {
  clear: both;
}
#container {
  position: relative;
}
.mobile-nav-on {
  overflow: hidden;
}
#wrap {
  height: 100%;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  -webkit-transition: 0.2s ease-out;
  -moz-transition: 0.2s ease-out;
  -ms-transition: 0.2s ease-out;
  transition: 0.2s ease-out;
  z-index: 1;
  background: #eee;
}
.mobile-nav-on #wrap {
  left: 130px;
}
.article-date,
.article-category-link,
.archive-year {
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: 2px;
  color: #999;
  line-height: 1em;
  text-shadow: 0 1px #fff;
  font-weight: bold;
}
.article-inner,
.archive-article-inner {
  border-radius: 5px;
}
.article-entry h1 {
  font-size: 2em;
}
.article-entry h2 {
  font-size: 1.5em;
}
.article-entry h3 {
  font-size: 1.3em;
}
.article-entry h4 {
  font-size: 1.2em;
}
.article-entry h5 {
  font-size: 1em;
}
.article-entry h6 {
  font-size: 1em;
  color: #999;
}
.article-entry hr {
  border: 1px dashed #ddd;
}
.article-entry strong {
  font-weight: bold;
}
.article-entry em,
.article-entry cite {
  font-style: italic;
}
.article-entry sup,
.article-entry sub {
  font-size: 0.75em;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}
.article-entry sup {
  top: -0.5em;
}
.article-entry sub {
  bottom: -0.2em;
}
.article-entry small {
  font-size: 0.85em;
}
.article-entry acronym,
.article-entry abbr {
  border-bottom: 1px dotted;
}
.article-entry ul,
.article-entry ol,
.article-entry dl {
  margin: 0 15px;
  line-height: 1.6em;
}
.article-entry ul ul,
.article-entry ol ul,
.article-entry ul ol,
.article-entry ol ol {
  margin-top: 0;
  margin-bottom: 0;
}
.article-entry ul {
  list-style: disc;
}
.article-entry ol {
  list-style: decimal;
}
.article-entry dt {
  font-weight: bold;
}
.header {
  height: 600px;
  position: relative;
  border-bottom: 1px solid #ddd;
}
@media screen and (max-width: 479px) {
  .header {
    height: 300px;
  }
}
header.hdpage {
  height: 70px;
  background: #333;
}
@media screen and (max-width: 479px) {
  header.hdpage {
    height: 50px;
  }
}
#header-outer {
  height: 100%;
  position: relative;
}
@media screen and (max-width: 479px) {
  #header-outer {
    height: 85%;
  }
}
#header-inner {
  position: relative;
  overflow: hidden;
  z-index: 999;
}
#banner {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url("images/banner.jpg") center #000;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  background-size: cover;
  z-index: -1;
}
#header-title {
  text-align: center;
  height: 70px;
  position: absolute;
  top: 48%;
  left: 0;
  margin-top: -35px;
}
#logo,
#subtitle {
  text-decoration: none;
  color: #fff;
  font-weight: 300;
  text-shadow: 0 1px 4px rgba(0,0,0,0.3);
}
#logo {
  font-size: 70px;
  font-weight: 700;
  text-shadow: 0 1px 3px rgba(0,0,0,0.4), 0 0 30px rgba(0,0,0,0.075);
  font-style: italic;
  line-height: 70px;
  letter-spacing: 2px;
  padding-bottom: 30px;
  display: inline-block;
}
@media screen and (max-width: 479px) {
  #logo {
    font-size: 52px;
    padding-bottom: 5px;
  }
}
#subtitle {
  font-size: 24px;
  line-height: 44px;
  letter-spacing: 1px;
  display: inline-block;
  width: 80%;
}
@media screen and (max-width: 479px) {
  #subtitle {
    font-size: 14px;
    line-height: 18px;
  }
}
#subtitle-wrap {
  margin-top: 24px;
}
#main-nav {
  float: left;
  margin-left: -15px;
  padding: 6px 0;
}
#main-nav:first-child {
  margin-left: 0px;
}
@media screen and (max-width: 479px) {
  #main-nav {
    padding: 6px 0;
  }
}
.nav-icon,
.main-nav-link {
  float: left;
  color: #fff;
  opacity: 0.6;
  text-decoration: none;
  text-shadow: 0 1px rgba(0,0,0,0.2);
  -webkit-transition: opacity 0.2s;
  -moz-transition: opacity 0.2s;
  -ms-transition: opacity 0.2s;
  transition: opacity 0.2s;
  display: block;
  padding: 20px 10px;
}
.nav-icon:hover,
.main-nav-link:hover {
  opacity: 1;
}
.nav-icon {
  font-family: FontAwesome;
  text-align: center;
  font-size: 14px;
  width: 14px;
  height: 14px;
  padding: 20px 15px;
  position: relative;
  cursor: pointer;
}
@media screen and (max-width: 479px) {
  .nav-icon {
    padding: 12px 15px;
  }
}
.main-nav-link {
  letter-spacing: 1px;
}
@media screen and (max-width: 479px) {
  .main-nav-link {
    display: none;
  }
}
#main-nav-toggle {
  display: none;
}
#main-nav-toggle:before {
  content: "\f0c9";
}
@media screen and (max-width: 479px) {
  #main-nav-toggle {
    display: block;
  }
}
#sub-nav {
  float: right;
  margin-right: -15px;
  padding: 6px 0;
}
@media screen and (max-width: 479px) {
  #sub-nav {
    padding: 6px 0;
  }
}
#nav-rss-link:before {
  content: "\f09e";
}
#nav-search-btn:before {
  content: "\f002";
}
#search-form-wrap {
  position: absolute;
  top: 15px;
  width: 150px;
  height: 30px;
  right: -150px;
  opacity: 0;
  -webkit-transition: 0.2s ease-out;
  -moz-transition: 0.2s ease-out;
  -ms-transition: 0.2s ease-out;
  transition: 0.2s ease-out;
}
#search-form-wrap.on {
  opacity: 1;
  right: 0;
}
@media screen and (max-width: 479px) {
  #search-form-wrap {
    width: 100%;
    right: -100%;
  }
}
.search-form {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  background: #fff;
  padding: 5px 15px;
  border-radius: 15px;
  -webkit-box-shadow: 0 0 10px rgba(0,0,0,0.3);
  box-shadow: 0 0 10px rgba(0,0,0,0.3);
}
.search-form-input {
  border: none;
  background: none;
  color: #555;
  width: 100%;
  font: 13px "Helvetica Neue", Helvetica, Arial, sans-serif;
  outline: none;
}
.search-form-input::-webkit-search-results-decoration,
.search-form-input::-webkit-search-cancel-button {
  -webkit-appearance: none;
}
.search-form-submit {
  position: absolute;
  top: 50%;
  right: 10px;
  margin-top: -7px;
  font: 13px FontAwesome;
  border: none;
  background: none;
  color: #bbb;
  cursor: pointer;
}
.search-form-submit:hover,
.search-form-submit:focus {
  color: #777;
}
.page-toc {
  float: right;
}
.page-toc .toc-number {
  color: rgba(51,51,51,0.34);
}
@media screen and (min-width: 480px) and (max-width: 767px) {
  .page-toc {
    display: none;
  }
}
@media screen and (max-width: 479px) {
  .page-toc {
    display: none;
  }
}
.page-toc ul,
.page-toc ol,
.page-toc dl,
.page-toc li {
  list-style: none;
}
.page-toc ol.toc {
  margin: 0;
  position: relative;
  margin: 0px 0 0 20px;
  background: #f4f4f4;
  padding: 10px;
  border-radius: 0px 0px 5px 5px;
  max-width: 250px;
  display: block;
  overflow: hidden;
  top: 0;
  right: 0;
  z-index: 999;
}
.article {
  margin: 20px 0;
}
.article-inner {
  overflow: hidden;
  background: #fff;
}
.article-meta:before,
.article-meta:after {
  content: "";
  display: table;
}
.article-meta:after {
  clear: both;
}
.article-date {
  float: left;
  margin-top: 3px;
}
.article-category {
  float: left;
  line-height: 1em;
  color: #ccc;
  text-shadow: 0 1px #fff;
  margin-left: 8px;
}
.article-category:before {
  content: "\2022";
}
.article-category-link {
  margin: 0 12px 1em;
}
.article-header {
  padding: 20px 20px 0;
}
.article-title {
  text-decoration: none;
  font-size: 2em;
  font-weight: bold;
  color: #555;
  line-height: 1.1em;
  -webkit-transition: color 0.2s;
  -moz-transition: color 0.2s;
  -ms-transition: color 0.2s;
  transition: color 0.2s;
  padding: 0 0 27px 0;
}
a.article-title:hover {
  color: #258fb8;
}
.article_api {
  padding: 0 0px 0 270px;
  background-color: #fff;
}
@media screen and (max-width: 479px) {
  .article_api {
    padding: 0 0px 0 0px;
  }
}
.article_api .article-inner {
  padding: 0 20px;
  border-radius: 0;
}
.article_api .article-entry {
  padding: 0 0 0 0;
}
.article_api .article-entry a img {
  display: inline-block;
}
.article_api .page-toc {
  position: fixed;
  overflow: auto;
  left: 0;
  height: 100%;
  background: #f4f4f4;
}
@media screen and (min-width: 480px) and (max-width: 767px) {
  .article_api .page-toc {
    display: block;
  }
}
.article_api .page-toc ol.toc {
  margin: 0;
}
.article-entry {
  color: #555;
  padding: 0 20px;
}
.article-entry:before,
.article-entry:after {
  content: "";
  display: table;
}
.article-entry:after {
  clear: both;
}
.article-entry p,
.article-entry table {
  line-height: 1.6em;
  margin: 1.6em 0;
}
.article-entry h1,
.article-entry h2,
.article-entry h3,
.article-entry h4,
.article-entry h5,
.article-entry h6 {
  font-weight: bold;
}
.article-entry h1,
.article-entry h2,
.article-entry h3,
.article-entry h4,
.article-entry h5,
.article-entry h6 {
  line-height: 1.1em;
  margin: 1.1em 0;
}
.article-entry a {
  color: #258fb8;
  text-decoration: none;
}
.article-entry a:hover {
  text-decoration: underline;
}
.article-entry img,
.article-entry video {
  max-width: 100%;
  height: auto;
  display: block;
  margin: auto;
}
.article-entry iframe {
  border: none;
}
.article-entry table {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
}
.article-entry th {
  font-weight: bold;
  border-bottom: 3px solid #ddd;
  padding-bottom: 0.5em;
}
.article-entry td {
  border-bottom: 1px solid #ddd;
  padding: 10px 0;
}
.article-entry blockquote {
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1em;
  margin: 1.6em 10px;
  border-color: #008e59;
  border-left: 5px solid #eee;
  padding: 10.5px 21px;
  color: #555;
}
.article-entry blockquote p {
  margin: 0;
}
.article-entry blockquote footer {
  font-size: 14px;
  margin: 1.6em 0;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}
.article-entry blockquote footer cite:before {
  content: "—";
  padding: 0 0.5em;
}
.article-entry .pullquote {
  text-align: left;
  width: 45%;
  margin: 0;
}
.article-entry .pullquote.left {
  margin-left: 0.5em;
  margin-right: 1em;
}
.article-entry .pullquote.right {
  margin-right: 0.5em;
  margin-left: 1em;
}
.article-entry .caption {
  color: #999;
  display: block;
  font-size: 0.9em;
  margin-top: 0.5em;
  position: relative;
  text-align: center;
}
.article-entry .video-container {
  position: relative;
  padding-top: 56.25%;
  height: 0;
  overflow: hidden;
}
.article-entry .video-container iframe,
.article-entry .video-container object,
.article-entry .video-container embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  margin-top: 0;
}
.article_box {
  padding: 20px 0 70px 0;
}
.article_index {
  float: left;
  width: 50%;
  min-height: 1px;
  margin-top: 35px;
}
@media screen and (min-width: 480px) and (max-width: 767px) {
  .article_index {
    width: 100%;
  }
}
@media screen and (max-width: 479px) {
  .article_index {
    width: 100%;
  }
}
.article_index h4 {
  font-size: 17.5px;
  margin: 10px 0;
  color: #585858;
  padding: 0 0 0 17px;
  font-weight: bold;
  text-rendering: optimizelegibility;
}
.article_index p {
  margin: 0 0 10px;
  line-height: 23px;
  color: #626262;
  padding: 0 30px 0 15px;
}
.article-more-link a {
  display: inline-block;
  line-height: 1em;
  padding: 6px 15px;
  border-radius: 15px;
  background: #eee;
  color: #999;
  text-shadow: 0 1px #fff;
  text-decoration: none;
}
.article-more-link a:hover {
  background: #258fb8;
  color: #fff;
  text-decoration: none;
  text-shadow: 0 1px #1e7293;
}
.article-footer {
  font-size: 0.85em;
  line-height: 1.6em;
  padding-top: 1.6em;
  margin: 0 20px 20px;
}
.article-footer:before,
.article-footer:after {
  content: "";
  display: table;
}
.article-footer:after {
  clear: both;
}
.article-footer a {
  color: #999;
  text-decoration: none;
}
.article-footer a:hover {
  color: #555;
}
.article-tag-list {
  list-style: none;
  display: inline-block;
  padding-left: 5px;
}
.article-tag-list-item {
  float: left;
  margin-right: 10px;
}
.article-tag-list-link {
  background: #e9e9e9;
  border-radius: 3px;
  line-height: 14px;
  padding: 0 2px;
}
.article-tag-list-link:before {
  content: "#";
}
.article-comment-link {
  float: right;
}
.article-comment-link:before {
  content: "\f075";
  font-family: FontAwesome;
  padding-right: 8px;
}
.article-share-link {
  cursor: pointer;
  float: right;
  margin-left: 20px;
}
.article-share-link:before {
  content: "\f064";
  font-family: FontAwesome;
  padding-right: 6px;
}
.icon-github-alt,
.icon-book,
.icon-bolt,
.icon-lab {
  display: inline-block;
  font-style: normal;
}
.icon-github-alt:before,
.icon-book:before,
.icon-bolt:before,
.icon-lab:before {
  font-family: FontAwesome;
  padding-right: 6px;
}
.icon-github-alt:before {
  content: "\f113";
}
.icon-book:before {
  content: "\f02d";
}
.icon-bolt:before {
  content: "\f135";
}
.icon-lab:before {
  content: "\f0f0";
}
#article-nav {
  position: relative;
}
#article-nav:before,
#article-nav:after {
  content: "";
  display: table;
}
#article-nav:after {
  clear: both;
}
@media screen and (min-width: 768px) {
  #article-nav {
    margin: 20px 0;
  }
  #article-nav:before {
    width: 8px;
    height: 8px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -4px;
    margin-left: -4px;
    content: "";
    border-radius: 50%;
    background: #ddd;
    -webkit-box-shadow: 0 1px 2px #fff;
    box-shadow: 0 1px 2px #fff;
  }
}
.article-nav-link-wrap {
  text-decoration: none;
  text-shadow: 0 1px #fff;
  color: #999;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  margin-top: 20px;
  text-align: center;
  display: block;
}
.article-nav-link-wrap:hover {
  color: #555;
}
@media screen and (min-width: 768px) {
  .article-nav-link-wrap {
    width: 50%;
    margin-top: 0;
  }
}
@media screen and (min-width: 768px) {
  #article-nav-newer {
    float: left;
    text-align: right;
    padding-right: 20px;
  }
}
@media screen and (min-width: 768px) {
  #article-nav-older {
    float: right;
    text-align: left;
    padding-left: 20px;
  }
}
.article-nav-caption {
  text-transform: uppercase;
  letter-spacing: 2px;
  color: #ddd;
  line-height: 1em;
  font-weight: bold;
}
#article-nav-newer .article-nav-caption {
  margin-right: -2px;
}
.article-nav-title {
  font-size: 0.85em;
  line-height: 1.6em;
  margin-top: 0.5em;
}
.article-share-box {
  position: absolute;
  display: none;
  background: #fff;
  -webkit-box-shadow: 1px 2px 10px rgba(0,0,0,0.2);
  box-shadow: 1px 2px 10px rgba(0,0,0,0.2);
  border-radius: 3px;
  margin-left: -145px;
  overflow: hidden;
  z-index: 1;
}
.article-share-box.on {
  display: block;
}
.article-share-input {
  width: 100%;
  background: none;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  font: 14px "Helvetica Neue", Helvetica, Arial, sans-serif;
  padding: 0 15px;
  color: #555;
  outline: none;
  border: 1px solid #ddd;
  border-radius: 3px 3px 0 0;
  height: 36px;
  line-height: 36px;
}
.article-share-links {
  background: #eee;
}
.article-share-links:before,
.article-share-links:after {
  content: "";
  display: table;
}
.article-share-links:after {
  clear: both;
}
.article-share-twitter,
.article-share-facebook,
.article-share-pinterest,
.article-share-google {
  width: 50px;
  height: 36px;
  display: block;
  float: left;
  position: relative;
  color: #999;
  text-shadow: 0 1px #fff;
}
.article-share-twitter:before,
.article-share-facebook:before,
.article-share-pinterest:before,
.article-share-google:before {
  font-size: 20px;
  font-family: FontAwesome;
  width: 20px;
  height: 20px;
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: -10px;
  margin-left: -10px;
  text-align: center;
}
.article-share-twitter:hover,
.article-share-facebook:hover,
.article-share-pinterest:hover,
.article-share-google:hover {
  color: #fff;
}
.article-share-twitter:before {
  content: "\f099";
}
.article-share-twitter:hover {
  background: #00aced;
  text-shadow: 0 1px #008abe;
}
.article-share-facebook:before {
  content: "\f09a";
}
.article-share-facebook:hover {
  background: #3b5998;
  text-shadow: 0 1px #2f477a;
}
.article-share-pinterest:before {
  content: "\f0d2";
}
.article-share-pinterest:hover {
  background: #cb2027;
  text-shadow: 0 1px #a21a1f;
}
.article-share-google:before {
  content: "\f0d5";
}
.article-share-google:hover {
  background: #dd4b39;
  text-shadow: 0 1px #be3221;
}
.article-gallery {
  background: #000;
  position: relative;
}
.article-gallery-photos {
  position: relative;
  overflow: hidden;
}
.article-gallery-img {
  display: none;
  max-width: 100%;
}
.article-gallery-img:first-child {
  display: block;
}
.article-gallery-img.loaded {
  position: absolute;
  display: block;
}
.article-gallery-img img {
  display: block;
  max-width: 100%;
  margin: 0 auto;
}
#comments {
  background: #fff;
  padding: 5px 20px 20px 20px;
  border-radius: 5px;
  margin: 20px 0;
}
#comments a {
  color: #258fb8;
}
#comments #ds-thread #ds-reset .ds-login-buttons .ds-social-links {
  float: left;
  width: inherit;
  overflow: hidden;
}
.archives-wrap {
  margin: 20px 0;
}
.archives:before,
.archives:after {
  content: "";
  display: table;
}
.archives:after {
  clear: both;
}
.archive-year-wrap {
  margin-bottom: 1em;
  padding-left: 10px;
}
.archives {
  -webkit-column-gap: 10px;
  -moz-column-gap: 10px;
  column-gap: 10px;
}
@media screen and (min-width: 480px) and (max-width: 767px) {
  .archives {
    -webkit-column-count: 2;
    -moz-column-count: 2;
    column-count: 2;
  }
}
@media screen and (min-width: 768px) {
  .archives {
    -webkit-column-count: 3;
    -moz-column-count: 3;
    column-count: 3;
  }
}
.archive-article {
  -webkit-column-break-inside: avoid;
  page-break-inside: avoid;
  overflow: hidden;
  break-inside: avoid-column;
}
.archive-article-inner {
  margin-bottom: 5px;
}
.archive-article-inner a {
  display: block;
  padding: 3px 3px 3px 6px;
  border-radius: 3px;
  color: #333;
}
.archive-article-inner a:hover {
  background: #e4e4e4;
  color: #000bff;
}
.archive-article-inner a:active {
  background: #7d7d7d;
  color: #fff;
}
.archive-article-inner a time {
  font-size: 12px;
  color: #c5c5c5;
}
.archive-article-title {
  text-decoration: none;
  font-weight: bold;
  color: #555;
  -webkit-transition: color 0.2s;
  -moz-transition: color 0.2s;
  -ms-transition: color 0.2s;
  transition: color 0.2s;
  line-height: 1.6em;
}
.archive-article-title:hover {
  color: #258fb8;
}
.archive-article-footer {
  margin-top: 1em;
}
.archive-article-date {
  color: #999;
  text-decoration: none;
  font-size: 0.85em;
  line-height: 1em;
  margin-bottom: 0.5em;
  display: block;
}
#page-nav {
  margin: 20px auto;
  background: #fff;
  -webkit-box-shadow: 1px 2px 3px #ddd;
  box-shadow: 1px 2px 3px #ddd;
  border: 1px solid #ddd;
  border-radius: 3px;
  text-align: center;
  color: #999;
  overflow: hidden;
}
#page-nav:before,
#page-nav:after {
  content: "";
  display: table;
}
#page-nav:after {
  clear: both;
}
#page-nav a,
#page-nav span {
  padding: 10px 20px;
  line-height: 1;
  height: 2ex;
}
#page-nav a {
  color: #999;
  text-decoration: none;
}
#page-nav a:hover {
  background: #999;
  color: #fff;
}
#page-nav .prev {
  float: left;
}
#page-nav .next {
  float: right;
}
#page-nav .page-number {
  display: inline-block;
}
@media screen and (max-width: 479px) {
  #page-nav .page-number {
    display: none;
  }
}
#page-nav .current {
  color: #555;
  font-weight: bold;
}
#page-nav .space {
  color: #ddd;
}
.category-list {
  padding: 0 0 50px 0;
}
.category-list a {
  color: #222;
}
.category-list a sup {
  color: #bababa;
  font-size: 10px;
  vertical-align: super;
  display: inline-block;
  padding: 0 4px 0 4px;
}
.category-list .category-tag {
  background: #ccc;
  border-radius: 3px;
  display: inline-block;
  padding: 0 3px 0 3px;
}
.category-list .tag-list {
  padding: 0 0 30px 0;
}
.category-list .tag-list a {
  border: 1px dashed #afafaf;
  background: #ddd;
  border-radius: 3px;
  padding: 0px 0 2px 4px;
  margin: 4px 0 0 0;
  display: inline-block;
}
.category-list .tag-list a:hover {
  background: #ccc;
}
.category-list .tag_name {
  font-weight: bold;
}
.category-list h2 {
  margin: 20px 0 5px 0;
}
.category-list article {
  border-left: 2px solid #d6d6d6;
  padding: 6px 0 6px 8px;
  margin: 0 10px 0 10px;
  line-height: 23px;
}
.category-list article a {
  padding: 0 3px 0 3px;
}
.category-list article a:hover {
  background: #333;
  color: #fff;
  border-radius: 3px;
}
#footer {
  background: #e2e2e2;
  padding: 50px 0;
  color: #999;
}
#footer a {
  color: #258fb8;
  text-decoration: none;
}
#footer a:hover {
  text-decoration: underline;
}
#footer-info {
  line-height: 1.6em;
  font-size: 0.85em;
}
#content table th pre,
#content table td pre,
.article-entry pre,
#content table th .highlight,
#content table td .highlight,
.article-entry .highlight {
  background: #f4f4f4;
  margin: 0 0;
  padding: 12px 15px;
  overflow: auto;
  color: #424242;
  border-radius: 3px;
  line-height: 18px;
}
#content table th .highlight .gutter pre,
#content table td .highlight .gutter pre,
.article-entry .highlight .gutter pre,
#content table th .gist .gist-file .gist-data .line-numbers,
#content table td .gist .gist-file .gist-data .line-numbers,
.article-entry .gist .gist-file .gist-data .line-numbers {
  color: #666;
  font-size: 0.85em;
}
#content table th code,
#content table td code,
.article-entry code,
#content table th .highlight pre,
#content table td .highlight pre,
.article-entry .highlight pre {
  text-shadow: 0 1px #fff;
  font-family: Monaco, Menlo, Consolas, "Courier New", monospace;
  -webkit-font-smoothing: antialiased;
  -webkit-font-smoothing: antialiased;
  direction: ltr;
  text-align: left;
  white-space: pre;
  word-spacing: normal;
  -moz-tab-size: 4;
  -o-tab-size: 4;
  -moz-tab-size: 4;
  tab-size: 4;
  -webkit-hyphens: none;
  -moz-hyphens: none;
  -ms-hyphens: none;
  -webkit-hyphens: none;
  -moz-hyphens: none;
  -ms-hyphens: none;
  hyphens: none;
  font-size: 12px;
  padding: 0.1em;
  border-radius: 0.3em;
}
#content table th pre,
#content table td pre,
.article-entry pre,
#content table th code,
#content table td code,
.article-entry code {
  font-family: "Source Code Pro", Consolas, Monaco, Menlo, Consolas, monospace;
}
#content table th code,
#content table td code,
.article-entry code {
  background: #f5f2f0;
  color: #f50000;
  text-shadow: 0 1px #fff;
  padding: 0.1em 0.3em 0 0.3em;
  border-radius: 3px;
  display: inline-block;
  vertical-align: text-top;
  border: 1px solid #e2e2e2;
  line-height: 12px;
}
#content table th pre code,
#content table td pre code,
.article-entry pre code {
  background: none;
  text-shadow: none;
  padding: 0;
}
#content table th .highlight pre,
#content table td .highlight pre,
.article-entry .highlight pre {
  border: none;
  margin: 0;
  padding: 0;
  line-height: 16px;
  font-weight: normal;
}
#content table th .highlight table,
#content table td .highlight table,
.article-entry .highlight table {
  margin: 0;
  width: auto;
}
#content table th .highlight td,
#content table td .highlight td,
.article-entry .highlight td {
  border: none;
  padding: 0;
}
#content table th .highlight figcaption,
#content table td .highlight figcaption,
.article-entry .highlight figcaption {
  font-size: 0.85em;
  color: #999;
  line-height: 1em;
  margin-bottom: 1em;
}
#content table th .highlight figcaption:before,
#content table td .highlight figcaption:before,
.article-entry .highlight figcaption:before,
#content table th .highlight figcaption:after,
#content table td .highlight figcaption:after,
.article-entry .highlight figcaption:after {
  content: "";
  display: table;
}
#content table th .highlight figcaption:after,
#content table td .highlight figcaption:after,
.article-entry .highlight figcaption:after {
  clear: both;
}
#content table th .highlight figcaption a,
#content table td .highlight figcaption a,
.article-entry .highlight figcaption a {
  float: right;
}
#content table th .highlight .gutter pre,
#content table td .highlight .gutter pre,
.article-entry .highlight .gutter pre {
  text-align: right;
  border-radius: 0;
  padding-right: 6px;
  border-right: 1px #d2d2d2 solid;
  margin-right: 10px;
}
#content table th .highlight .line,
#content table td .highlight .line,
.article-entry .highlight .line {
  height: 22.400000000000002px;
}
#content table th .gist,
#content table td .gist,
.article-entry .gist {
  margin: 0 -20px;
  border-style: solid;
  border-color: #ddd;
  border-width: 1px 0;
  background: #2d2d2d;
  padding: 15px 20px 15px 0;
}
#content table th .gist .gist-file,
#content table td .gist .gist-file,
.article-entry .gist .gist-file {
  border: none;
  font-family: "Source Code Pro", Consolas, Monaco, Menlo, Consolas, monospace;
  margin: 0;
}
#content table th .gist .gist-file .gist-data,
#content table td .gist .gist-file .gist-data,
.article-entry .gist .gist-file .gist-data {
  background: none;
  border: none;
}
#content table th .gist .gist-file .gist-data .line-numbers,
#content table td .gist .gist-file .gist-data .line-numbers,
.article-entry .gist .gist-file .gist-data .line-numbers {
  background: none;
  border: none;
  padding: 0 20px 0 0;
}
#content table th .gist .gist-file .gist-data .line-data,
#content table td .gist .gist-file .gist-data .line-data,
.article-entry .gist .gist-file .gist-data .line-data {
  padding: 0 !important;
}
#content table th .gist .gist-file .highlight,
#content table td .gist .gist-file .highlight,
.article-entry .gist .gist-file .highlight {
  margin: 0;
  padding: 0;
  border: none;
}
#content table th .gist .gist-file .gist-meta,
#content table td .gist .gist-file .gist-meta,
.article-entry .gist .gist-file .gist-meta {
  background: #2d2d2d;
  color: #999;
  font: 0.85em "Helvetica Neue", Helvetica, Arial, sans-serif;
  text-shadow: 0 0;
  padding: 0;
  margin-top: 1em;
  margin-left: 20px;
}
#content table th .gist .gist-file .gist-meta a,
#content table td .gist .gist-file .gist-meta a,
.article-entry .gist .gist-file .gist-meta a {
  color: #258fb8;
  font-weight: normal;
}
#content table th .gist .gist-file .gist-meta a:hover,
#content table td .gist .gist-file .gist-meta a:hover,
.article-entry .gist .gist-file .gist-meta a:hover {
  text-decoration: underline;
}
pre .comment,
pre .title {
  color: #999;
}
pre .variable,
pre .attribute,
pre .tag,
pre .regexp,
pre .ruby .constant,
pre .xml .tag .title,
pre .xml .pi,
pre .xml .doctype,
pre .html .doctype,
pre .css .id,
pre .css .class,
pre .css .pseudo {
  color: #db5f62;
}
pre .number,
pre .preprocessor,
pre .built_in,
pre .literal,
pre .params,
pre .constant {
  color: #f99157;
}
pre .class,
pre .ruby .class .title,
pre .css .rules .attribute {
  color: #4a9c4a;
}
pre .string,
pre .value,
pre .inheritance,
pre .header,
pre .ruby .symbol,
pre .xml .cdata {
  color: #4a9c4a;
}
pre .css .hexcolor {
  color: #6cc;
}
pre .function,
pre .python .decorator,
pre .python .title,
pre .ruby .function .title,
pre .ruby .title .keyword,
pre .perl .sub,
pre .javascript .title,
pre .coffeescript .title {
  color: #69c;
}
pre .keyword,
pre .javascript .function {
  color: #b95ab9;
}
.article-entry td,
.article-entry th {
  border: 1px solid #ddd;
  padding: 6px 13px;
}
table {
  max-width: 100%;
  display: block;
  background-color: transparent;
  border-collapse: collapse;
  border-spacing: 0;
}
table th {
  padding: 0;
td
}
table tr:nth-child(2n) {
  background-color: #f8f8f8;
}
table tr:nth-child(2n) td {
  border: 1px solid #ddd;
  padding: 6px 13px;
}
.article-entry th {
  font-weight: bold;
  background: #ebebeb;
}
@media screen and (max-width: 479px) {
  #mobile-nav {
    position: absolute;
    top: 0;
    left: 0;
    width: 130px;
    height: 100%;
    background: #191919;
    border-right: 1px solid #fff;
  }
}
@media screen and (max-width: 479px) {
  .mobile-nav-link {
    display: block;
    color: #999;
    text-decoration: none;
    padding: 15px 20px;
    font-weight: bold;
  }
  .mobile-nav-link:hover {
    color: #fff;
  }
}