/* Override some defaults */
html, body, p {
  font-size: 16px;
  line-height: 1.4em;
}

body {
  width: auto;
}

.navbar {
  margin-bottom: 0;
}

.navbar .brand {
  font-weight: normal;
}

h1, h2, h3, h4, h5, h6 {
  margin: 0.25em 0;
}

h4 {
  font-size: 1em;
}

ol {
  margin: 1em 0 1em 2em;
}

li {
  margin-bottom: 0.5em;
  line-height: inherit;
}

html, body, .page-header {
  background-color: white;
}

#info > div, #info > ul {
  margin-bottom: 1em;
}

.container, .navbar {
  width: auto;
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
}

.container > footer {
  margin-top: 1.5em;
}

.container > footer p {
  text-align: center; /* center align it with the container */
  margin-bottom: 1.5em;
}

/* The white background content wrapper */
.content {
  background-color: #fff;
  padding: 0 20px 20px 20px;
}

.content .row-fluid {
  margin-bottom: 2em;
}

h1 > a {
  color: black;
}

h1 > a:hover {
  text-decoration: none;
}

.posts {
  list-style-type: none;
  margin: 0px;
}

.navbar-inner {
  background-image: none;
  background-color: #ebebeb;
  text-transform: lowercase;
  padding-right: 20px;
  border-radius: 0;
  box-shadow: none;
  /* color here is duplicated by border top of page-header */
  border-bottom: 3px solid #c1c1c1;
}

.content .page-header:nth-child(1) {
  border-top: none;
}

.content iframe {
  max-width: 97%;
}

.navbar .brand {
  color: black;
}

.navbar .nav > li > a {
  color: #333;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.1);
}

.nav > li.active > a {
  -webkit-box-shadow: inset 0 0 1px rgba(0,0,0,.3);
  -moz-box-shadow: inset 0 0 1px rgba(0,0,0,.3);
  box-shadow: inset 0 0 px rgba(0,0,0,.3);
}

.navbar .nav > li > a:hover {
  color: #999;
}

.navbar .nav .active > a, .navbar .nav .active > a:hover {
  color: #333;
  text-decoration: none;
  background-color: #f9f9f9;
}

.nav > li, nav > li.active {
  margin-bottom: 0px;
}

.navbar .nav {
  margin: 0;
}

hr, .page-header, .content {
  /* color here duplicates page-header and navbar-inner */
  border-bottom: 2px solid #C1C1C1;
  border-top: 0;
}

/* Page header tweaks */
.page-header {
  padding: 20px 20px;
  margin: 0px -20px 0;
  /* color here duplicates boder on the bottom of navbar-inner */
  border-top: 2px solid #C1C1C1;
  border-bottom: 0;
}

.social-media {
  float: right;
}

.social-media i {
  margin: 8px 4px 0 0;
  font-size: 24px;
  color: #555;
}

.social-media a:hover {
  text-decoration: none;
}

.topbar .btn {
  border: 0;
}

.tag_box {
	list-style:none;
	margin:0;
	overflow:hidden;
}

.tag_box li {
	line-height: 1.7em;
  margin-bottom: 0;
}

.tag_box.inline li {
	float:left;
}

.tag_box a {
	padding: 3px 6px;
	margin: 0.1em;
	background: #eee;
	border-radius: 2px;
	text-decoration:none;
}

.tag_box a span{
	vertical-align:super;
	font-size:0.8em;
}

.tag_box a.active {
	background:#57A957;
	border:1px solid #4C964D;
	color:#FFF;
}

code {
  /* font-lock-variable-name-face */
  color: #08C;
  padding: 0.16em 0.4em;
  line-height:
}

pre, code {
  font-family: Menlo, Monaco, monospace;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
}

pre {
  margin: 1em 0;
}

div.highlight {
  margin: 1.5em 0;
}

pre code {
  font-weight: normal;
}

.pagination {
  margin: 0.5em;
}

.pagination a {
  border: none;
}

.pagination ul {
  box-shadow: none;
  -webkit-box-shadow: none;
  -mozilla-box-shadow: none;
}

.builtin {
  /* font-lock-builtin-face */
  color: #62124b;
}

.comment, .doc, .cm {
  /* font-lock-comment-face */
  color: #aea79f;
}

.comment-delimiter {
  /* font-lock-comment-delimiter-face */
  color: #aea79f;
  font-style: italic;
}

.function-name {
  /* font-lock-function-name-face */
  /* color: #860e73; */
  /* font-weight: bold; */
}

.keyword, .k, .kc, .kd, .kn, .kp, .kr, .kt {
  /* font-lock-keyword-face */
  font-weight: bold;
}

.string, pre.sh_sourceCode .sh_string, .s1, .s2 {
  /* font-lock-string-face */
  color: #dd1144;
}

pre.sh_sourceCode > code > span {
  color: #333;
}

b .variable-name {
  color: white;
}

.css-property {
  /* css-property */
  color: #8b005a;
}
.css-selector {
  /* css-selector */
  color: #860e73;
  font-weight: bold;
}

.type {
  /* font-lock-type-face */
  color: #83a525;
}
.constant {
  /* font-lock-constant-face */
  color: #f68d47;
}

p > code {
  white-space: nowrap;
}

.hll { background-color: #ffffcc }
.err { color: #a40000; border: 1px solid #ef2929 } /* Error */
.k, .keyword, .builtin { color: #204a87; font-weight: bold } /* Keyword */
.c1, .cm, .doc, .cs { color: #9b9b9b;} /* Comment.Single */
.s, .string { color: #4e9a06 } /* Literal.String */

div.center {
  text-align: center;
}

div.center > img {
  max-width: 85%;
  margin: 3em auto 3em auto;
}

div.center > img.wide {
  max-width: 95%;
}

div.center > img.slim {
  width: 60%;
  min-width: 200px;
}

div.side-by-side > img {
  max-height: 250px;
  margin: 2em 4em;
}

#vote {
  list-style: none;
  margin: 4px 0 0 0;
}

#info h4:nth-child(1) {
  margin-top: 0;
}

#hn {
  color: #ff6600;
}

.video-link {
  display: none;
}

@media all and (max-width: 720px) {
  .row-fluid > .text {
    width: 100%;
  }

  div.center > img {
    max-width: 100%;
  }

  .social-media, #info {
    display: none;
  }

  .navbar .nav {
    float: right;
  }
}

@media all and (max-width: 580px) {
  iframe {
    display: none;
  }

  .video-link {
    display: inline;
  }
}

@media all and (max-width: 500px) {
  .navbar .nav {
    display: none;
  }

  html, body, p {
    font-size: 14px;
    line-height: 1.4em;
  }
}

.highlight { background: #ffffff; color: black }
.highlight .c { color: #999988; font-style: italic; }
.highlight .err { background-color: #e3d2d2; color: #a61717; }
.highlight .k { font-weight: bold; }
.highlight .o { font-weight: bold; }
.highlight .cm { color: #999988; }
.highlight .cp { color: #999999; font-weight: bold; }
.highlight .c1 { color: #999988; }
.highlight .cs { color: #999999; font-weight: bold; }
.highlight .gd { background-color: #ffdddd; color: #000000; }
.highlight .gd .x { background-color: #ffaaaa; color: #000000; }
.highlight .ge { font-style: italic; }
.highlight .gr { color: #aa0000; }
.highlight .gh { color: #999999; }
.highlight .gi { background-color: #ddffdd; color: #000000; }
.highlight .gi .x { background-color: #aaffaa; color: #000000; }
.highlight .go { color: #888888; }
.highlight .gp { color: #555555; }
.highlight .gs { font-weight: bold; }
.highlight .gu { color: #800080; font-weight: bold; }
.highlight .gt { color: #aa0000; }
.highlight .kc { font-weight: bold; }
.highlight .kd { font-weight: bold; }
.highlight .kn { font-weight: bold; }
.highlight .kp { font-weight: bold; }
.highlight .kr { font-weight: bold; }
.highlight .kt { color: #445588; font-weight: bold; }
.highlight .m { color: #009999; }
.highlight .s { color: #d14; }
.highlight .na { color: #008080; }
.highlight .nb { color: #0086B3; }
.highlight .nc { color: #445588; font-weight: bold; }
.highlight .no { color: #008080; }
.highlight .ni { color: #800080; }
.highlight .ne { color: #990000; font-weight: bold; }
.highlight .nf { color: #990000; font-weight: bold; }
.highlight .nn { color: #555555; }
.highlight .nt { color: #000080; }
.highlight .nv { color: #008080; }
.highlight .ow { font-weight: bold; }
.highlight .w { color: #bbbbbb; }
.highlight .mf { color: #009999; }
.highlight .mh { color: #009999; }
.highlight .mi { color: #009999; }
.highlight .mo { color: #009999; }
.highlight .sb { color: #d14; }
.highlight .sc { color: #d14; }
.highlight .sd { color: #d14; }
.highlight .s2 { color: #d14; }
.highlight .se { color: #d14; }
.highlight .sh { color: #d14; }
.highlight .si { color: #d14; }
.highlight .sx { color: #d14; }
.highlight .sr { color: #009926; }
.highlight .s1 { color: #d14; }
.highlight .ss { color: #990073; }
.highlight .bp { color: #999999; }
.highlight .vc { color: #008080; }
.highlight .vg { color: #008080; }
.highlight .vi { color: #008080; }
.highlight .il { color: #009999; }
.highlight .gc { background-color: #EAF2F5; color: #999; }

body.missing h1 {
  font-size: 10em;
  margin: 0.4em;
  text-align: center;
}

body.missing .content p {
  text-align: center;
  font-size: 1.6em;
}

body.missing .content {
  margin-top: 100px;
  min-height: 400px;
}

video {
  background-color: black;
}

video, iframe {
  margin: 1em 0 2em 0;
}

.highlight + .highlight {
  margin-top: -1.1em;
}