* html {
  font-size: 100%; }

html {
  font-size: 16px;
  line-height: 0.5em; }

html, body {
  padding: 0;
  margin: 0;
  height: 100%; }

h1, h2, h3, h4, h5, h6, p, table {
  padding: 0;
  margin: 0; }

html {
  line-height: 1.5em;
  font-family: Tahoma, Arial, Helvetica, sans-serif; }

h1, h2, h3, h4, h5, h6 {
  font-family: "Francois One", sans-serif;
  color: #1D3E5F; }

h1 {
  font-size: 2em;
  line-height: 1.5em;
  margin: 1.5em 0 0.75em;
  color: #001E30; }
  @media only screen and (min-width: 641px) and (max-width: 1023px) {
    h1 {
      font-size: 1.25em;
      line-height: 1.2em;
      margin: 1.2em 0 1.2em; } }
  @media only screen and (min-width: 321px) and (max-width: 640px) {
    h1 {
      font-size: 1.125em;
      line-height: 1.33333333em;
      margin: 1.33333333em 0 1.33333333em; } }
  @media only screen and (max-width: 320px) {
    h1 {
      font-size: 1em;
      line-height: 1.5em;
      margin: 1.5em 0 1.5em; } }

h2 {
  font-size: 1.5em;
  line-height: 2em;
  margin: 1em 0 0; }
  @media only screen and (min-width: 641px) and (max-width: 1023px) {
    h2 {
      font-size: 1.125em;
      line-height: 1.33333333em;
      margin: 1.33333333em 0 0; } }
  @media only screen and (min-width: 321px) and (max-width: 640px) {
    h2 {
      font-size: 1em;
      line-height: 1.5em;
      margin: 1.5em 0 0; } }
  @media only screen and (max-width: 320px) {
    h2 {
      font-size: 0.875em;
      line-height: 1.71428571em;
      margin: 1.71428571em 0 0; } }

h3 {
  font-size: 1.1875em;
  line-height: 2.52631579em;
  margin: 1.26315789em 0 0; }
  @media only screen and (min-width: 641px) and (max-width: 1023px) {
    h3 {
      font-size: 1em;
      line-height: 1.5em;
      margin: 1.5em 0 0; } }
  @media only screen and (min-width: 321px) and (max-width: 640px) {
    h3 {
      font-size: 0.875em;
      line-height: 1.71428571em;
      margin: 1.71428571em 0 0; } }
  @media only screen and (max-width: 320px) {
    h3 {
      font-size: 0.8125em;
      line-height: 1.84615385em;
      margin: 1.84615385em 0 0; } }

h4 {
  font-size: 1em;
  line-height: 1.5em;
  margin: 1.5em 0 0; }
  @media only screen and (min-width: 641px) and (max-width: 1023px) {
    h4 {
      font-size: 0.875em;
      line-height: 1.71428571em;
      margin: 1.71428571em 0 0; } }
  @media only screen and (min-width: 321px) and (max-width: 640px) {
    h4 {
      font-size: 0.8125em;
      line-height: 1.84615385em;
      margin: 1.84615385em 0 0; } }
  @media only screen and (max-width: 320px) {
    h4 {
      font-size: 0.75em;
      line-height: 2em;
      margin: 2em 0 0; } }

p {
  font-size: 1em;
  line-height: 1.5em;
  margin: 0 0 1.5em; }
  @media only screen and (min-width: 321px) and (max-width: 640px) {
    p {
      font-size: 0.875em;
      line-height: 1.71428571em;
      margin: 0 0 1.71428571em; } }
  @media only screen and (max-width: 320px) {
    p {
      font-size: 0.8125em;
      line-height: 1.84615385em;
      margin: 0 0 1.84615385em; } }

ul, ol {
  font-size: 1em;
  line-height: 1.5em;
  margin: 0 0 1.5em; }
  @media only screen and (min-width: 321px) and (max-width: 640px) {
    ul, ol {
      font-size: 0.875em;
      line-height: 1.71428571em;
      margin: 0 0 1.71428571em; } }
  @media only screen and (max-width: 320px) {
    ul, ol {
      font-size: 0.8125em;
      line-height: 1.84615385em;
      margin: 0 0 1.84615385em; } }

a {
  text-decoration: none;
  color: #369; }
  a:visited {
    color: #903; }
  a:hover {
    color: #669966; }

figure img {
  max-width: 100%; }

footer.inner {
  font-size: 0.8125em;
  line-height: 1.84615385em; }

pre {
  font-size: 1em;
  line-height: 1.5em;
  border-style: solid;
  border-width: 0.1875em;
  padding: 1.3125em;
  margin: 1.5em 0; }
  @media only screen and (min-width: 321px) and (max-width: 640px) {
    pre {
      font-size: 0.875em;
      line-height: 1.71428571em;
      border-style: solid;
      border-width: 0.21428571em;
      padding: 1.5em;
      margin: 1.71428571em 0; } }
  @media only screen and (max-width: 320px) {
    pre {
      font-size: 0.8125em;
      line-height: 1.84615385em;
      border-style: solid;
      border-width: 0.23076923em;
      padding: 1.61538462em;
      margin: 1.84615385em 0; } }

@-webkit-keyframes fadeInDown {
  0% {
    -webkit-transform: translateY(-20px);
    opacity: 0; }

  100% {
    -webkit-transform: translateY(0px);
    opacity: 1; } }

@-moz-keyframes fadeInDown {
  0% {
    -moz-transform: translateY(-20px);
    opacity: 0; }

  100% {
    -moz-transform: translateY(0px);
    opacity: 1; } }

@keyframes fadeInDown {
  0% {
    -webkit-transform: translateY(-20px);
    -moz-transform: translateY(-20px);
    -ms-transform: translateY(-20px);
    -o-transform: translateY(-20px);
    transform: translateY(-20px);
    opacity: 0; }

  100% {
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    -ms-transform: translateY(0px);
    -o-transform: translateY(0px);
    transform: translateY(0px);
    opacity: 1; } }

@-webkit-keyframes lightSpeedIn {
  0% {
    -webkit-transform: translateX(100%) skewX(-30deg);
    opacity: 0; }

  60% {
    -webkit-transform: translateX(-20%) skewX(30deg);
    opacity: 1; }

  80% {
    -webkit-transform: translateX(0%) skewX(-15deg);
    opacity: 1; }

  100% {
    -webkit-transform: translateX(0%) skewX(0deg);
    opacity: 1; } }

@-moz-keyframes lightSpeedIn {
  0% {
    -moz-transform: translateX(100%) skewX(-30deg);
    opacity: 0; }

  60% {
    -moz-transform: translateX(-20%) skewX(30deg);
    opacity: 1; }

  80% {
    -moz-transform: translateX(0%) skewX(-15deg);
    opacity: 1; }

  100% {
    -moz-transform: translateX(0%) skewX(0deg);
    opacity: 1; } }

@keyframes lightSpeedIn {
  0% {
    -webkit-transform: translateX(100%) skewX(-30deg);
    -moz-transform: translateX(100%) skewX(-30deg);
    -ms-transform: translateX(100%) skewX(-30deg);
    -o-transform: translateX(100%) skewX(-30deg);
    transform: translateX(100%) skewX(-30deg);
    opacity: 0; }

  60% {
    -webkit-transform: translateX(-20%) skewX(30deg);
    -moz-transform: translateX(-20%) skewX(30deg);
    -ms-transform: translateX(-20%) skewX(30deg);
    -o-transform: translateX(-20%) skewX(30deg);
    transform: translateX(-20%) skewX(30deg);
    opacity: 1; }

  80% {
    -webkit-transform: translateX(0%) skewX(-15deg);
    -moz-transform: translateX(0%) skewX(-15deg);
    -ms-transform: translateX(0%) skewX(-15deg);
    -o-transform: translateX(0%) skewX(-15deg);
    transform: translateX(0%) skewX(-15deg);
    opacity: 1; }

  100% {
    -webkit-transform: translateX(0%) skewX(0deg);
    -moz-transform: translateX(0%) skewX(0deg);
    -ms-transform: translateX(0%) skewX(0deg);
    -o-transform: translateX(0%) skewX(0deg);
    transform: translateX(0%) skewX(0deg);
    opacity: 1; } }

@-webkit-keyframes fadeIn {
  0% {
    opacity: 0; }

  100% {
    opacity: 1; } }

@-moz-keyframes fadeIn {
  0% {
    opacity: 0; }

  100% {
    opacity: 1; } }

@keyframes fadeIn {
  0% {
    opacity: 0; }

  100% {
    opacity: 1; } }

@font-face {
  font-family: "Francois One";
  font-weight: normal;
  font-style: normal;
  font-display: swap;
  src: url('/fonts/francoisone-webfont.eot');
  src: url('/fonts/francoisone-webfont.eot?#iefix') format('embedded-opentype'), url('/fonts/francoisone-webfont.woff') format('woff'), url('/fonts/francoisone-webfont.ttf') format('truetype'), url('/fonts/francoisone-webfont.svg#Francois One') format('svg'); }

@font-face {
  font-family: "Roboto";
  font-weight: normal;
  font-style: normal;
  font-display: swap;
  src: url('/fonts/Roboto-Regular-webfont.eot');
  src: url('/fonts/Roboto-Regular-webfont.eot?#iefix') format('embedded-opentype'), url('/fonts/Roboto-Regular-webfont.woff') format('woff'), url('/fonts/Roboto-Regular-webfont.ttf') format('truetype'), url('/fonts/Roboto-Regular-webfont.svg#Roboto') format('svg'); }

@font-face {
  font-family: "Roboto";
  font-weight: bold;
  font-style: normal;
  font-display: swap;
  src: url('/fonts/Roboto-Bold-webfont.eot');
  src: url('/fonts/Roboto-Bold-webfont.eot?#iefix') format('embedded-opentype'), url('/fonts/Roboto-Bold-webfont.woff') format('woff'), url('/fonts/Roboto-Bold-webfont.ttf') format('truetype'), url('/fonts/Roboto-Bold-webfont.svg#Roboto') format('svg'); }

@font-face {
  font-family: "Open Sans";
  font-weight: normal;
  font-style: normal;
  font-display: swap;
  src: url('/fonts/OpenSans-Regular-webfont.eot');
  src: url('/fonts/OpenSans-Regular-webfont.eot?#iefix') format('embedded-opentype'), url('/fonts/OpenSans-Regular-webfont.woff') format('woff'), url('/fonts/OpenSans-Regular-webfont.ttf') format('truetype'), url('/fonts/OpenSans-Regular-webfont.svg#Open Sans') format('svg'); }

@font-face {
  font-family: "Open Sans";
  font-weight: bold;
  font-style: normal;
  font-display: swap;
  src: url('/fonts/OpenSans-Bold-webfont.eot');
  src: url('/fonts/OpenSans-Bold-webfont.eot?#iefix') format('embedded-opentype'), url('/fonts/OpenSans-Bold-webfont.woff') format('woff'), url('/fonts/OpenSans-Bold-webfont.ttf') format('truetype'), url('/fonts/OpenSans-Bold-webfont.svg#Open Sans') format('svg'); }

@font-face {
  font-family: "Open Sans";
  font-weight: 600;
  font-style: normal;
  font-display: swap;
  src: url('/fonts/OpenSans-Semibold-webfont.eot');
  src: url('/fonts/OpenSans-Semibold-webfont.eot?#iefix') format('embedded-opentype'), url('/fonts/OpenSans-Semibold-webfont.woff') format('woff'), url('/fonts/OpenSans-Semibold-webfont.ttf') format('truetype'), url('/fonts/OpenSans-Semibold-webfont.svg#Open Sans') format('svg'); }

.grid {
  background-image: -webkit-linear-gradient( rgba(0, 0, 0, 0.1) 1px, rgba(0, 0, 0, 0) 1px), -webkit-linear-gradient( rgba(0, 0, 0, 0.06) 1px, rgba(0, 0, 0, 0) 1px);
  background-image: linear-gradient( rgba(0, 0, 0, 0.1) 1px, rgba(0, 0, 0, 0) 1px), linear-gradient( rgba(0, 0, 0, 0.06) 1px, rgba(0, 0, 0, 0) 1px);
  background-size: 100% 24px, 100% 8px;
  background-position: -1px -1px, -1px -1px; }

.grid2 {
  background-image: -webkit-linear-gradient(-360deg, rgba(0, 129, 202, 0.3) 1px, transparent 1px), -webkit-linear-gradient(-360deg, rgba(0, 129, 202, 0.1) 1px, transparent 1px), -webkit-linear-gradient(-360deg, rgba(129, 158, 202, 0.3) 1px, transparent 1px), -webkit-linear-gradient( rgba(255, 0, 0, 0.3) 1px, rgba(255, 0, 0, 0) 1px), -webkit-linear-gradient( rgba(255, 0, 0, 0.3) 1px, rgba(255, 0, 0, 0) 1px);
  background-image: linear-gradient(90deg, rgba(0, 129, 202, 0.3) 1px, transparent 1px), linear-gradient(90deg, rgba(0, 129, 202, 0.1) 1px, transparent 1px), linear-gradient(90deg, rgba(129, 158, 202, 0.3) 1px, transparent 1px), linear-gradient( rgba(255, 0, 0, 0.3) 1px, rgba(255, 0, 0, 0) 1px), linear-gradient( rgba(255, 0, 0, 0.3) 1px, rgba(255, 0, 0, 0) 1px);
  background-size: 100px 100px, 10px 10px, 20px 20px, 100% 16px, 100% 8px;
  background-position: -1px -1px, -1px -1px, -1px -1px, -1px -1px, -1px -1px; }

#container {
  min-height: 100%;
  margin-bottom: -60px; }
  #container:after {
    height: 60px;
    content: '';
    display: block; }

.page {
  padding: 1.5em;
  margin: 0 auto;
  max-width: 55em; }
  @media only screen and (max-width: 320px) {
    .page {
      font-size: 0.8125em;
      line-height: 1.23076923em; } }

#footer {
  background-color: #4EA9F4;
  height: 60px;
  overflow: hidden; }
  #footer .inner {
    padding: 1em;
    margin: 0 auto;
    max-width: 57em; }
    #footer .inner .copyright {
      font-size: 0.8125em;
      line-height: 1.84615385em;
      text-align: right;
      color: #333; }

#header {
  background: url('/images/spaceman-in-color.svg') #000 repeat-x 2em bottom;
  background-size: auto 100px;
  background-color: #000; }
  @media only screen and (max-width: 320px) {
    #header {
      background-size: auto 60px; } }
  @media only screen and (min-width: 1024px) {
    #header {
      background-size: auto; } }
  #header .inner {
    position: relative;
    padding: 3em 1em 0;
    height: 100px;
    margin: 0 auto;
    max-width: 57em; }
    @media only screen and (max-width: 320px) {
      #header .inner {
        height: 60px; } }
    @media only screen and (min-width: 1024px) {
      #header .inner {
        height: 190px; } }
  #header .menu {
    position: absolute;
    right: 0;
    top: 0;
    text-align: right;
    margin: 1em;
    padding: 0; }
    @media only screen and (max-width: 320px) {
      #header .menu {
        margin: 5px;
        line-height: 1em; } }
    @media only screen and (min-width: 321px) and (max-width: 640px) {
      #header .menu {
        margin: 0.5em;
        font-size: 0.875em; } }
    #header .menu li {
      display: inline-block;
      margin: 0 0 0 1em;
      font-family: 'Open Sans', sans-serif;
      font-weight: bold;
      text-transform: uppercase; }
      @media only screen and (max-width: 320px) {
        #header .menu li {
          font-size: 0.6875em;
          line-height: 1.45454545em; } }
      @media only screen and (min-width: 1024px) {
        #header .menu li {
          font-size: 1.125em;
          line-height: 1.77777778em; } }
      #header .menu li a:link, #header .menu li a:visited {
        color: #ddd;
        text-shadow: 0px 0px rgba(0, 0, 0, 0);
        -webkit-transition: color 0.8s ease;
        -moz-transition: color 0.8s ease;
        transition: color 0.8s ease; }
      #header .menu li a.blue {
        color: #00f; }
      #header .menu li a.red {
        color: #f00; }
      #header .menu li a.white {
        color: #fff; }
      #header .menu li a.green {
        color: #0f0; }
      #header .menu li a.yellow {
        color: #f00; }
      #header .menu li a:hover {
        color: #fff;
        -webkit-transition: color 0.2s ease;
        -moz-transition: color 0.2s ease;
        transition: color 0.2s ease;
        -webkit-transition: text-shadow 0.2s ease;
        -moz-transition: text-shadow 0.2s ease;
        transition: text-shadow 0.2s ease;
        text-shadow: -3px 2px 2px rgba(0, 0, 0, 0.9), 7px 8px rgba(255, 25, 25, 0.6), -8px 7px rgba(5, 255, 255, 0.6), 6px -8px rgba(255, 255, 55, 0.6), -8px -6px rgba(255, 5, 255, 0.6); }

p {
  font-family: Roboto, sans-serif; }

pre {
  color: #fff;
  margin-left: 1em;
  border-radius: 5px;
  border-color: #888;
  overflow-x: auto; }

p code, ul code, ol code {
  border-radius: 5px;
  vertical-align: bottom; }

figure {
  display: inline-block;
  margin: 1em 0.75em;
  box-shadow: 0px 0px 0px 4px #222, 0px 0px 0px 8px #fff; }
  @media only screen and (max-width: 320px) {
    figure {
      box-shadow: 0px 0px 0px 2px #222, 0px 0px 0px 4px #fff; } }
  figure.retina {
    box-shadow: 0px 0px 0px 4px #222, 0px 0px 0px 8px #3E89B3; }
    figure.retina img {
      width: 300px; }
  figure.normal {
    box-shadow: 0px 0px 0px 4px #222, 0px 0px 0px 8px #B33E3E; }
  figure.hidef {
    box-shadow: 0px 0px 0px 4px #222, 0px 0px 0px 8px #539470; }
    figure.hidef img {
      width: 300px; }
  figure.oversized {
    box-shadow: 0px 0px 0px 4px #222, 0px 0px 0px 8px #D2B943; }
    figure.oversized img {
      width: 600px; }

figcaption {
  font-family: monospace;
  text-align: center;
  font-size: 0.75em;
  padding: 1em; }

.center {
  text-align: center; }

blockquote {
  border-left: 5px solid #DDE0E3;
  padding-left: 1em; }

@media only screen and (max-width: 320px) {
  blockquote {
    margin: 1em 0; } }

@media only screen and (min-width: 321px) and (max-width: 640px) {
  blockquote {
    margin: 1em 0; } }

.about h1 {
  -webkit-animation: fadeInDown 1s;
  -moz-animation: fadeInDown 1s;
  animation: fadeInDown 1s;
  -webkit-animation-delay: 2s;
  -moz-animation-delay: 2s;
  animation-delay: 2s;
  -webkit-animation-fill-mode: both;
  -moz-animation-fill-mode: both;
  animation-fill-mode: both;
  opacity: 0; }
.about h2, .about ul {
  -webkit-animation: lightSpeedIn 0.5s;
  -moz-animation: lightSpeedIn 0.5s;
  animation: lightSpeedIn 0.5s;
  -webkit-animation-delay: 3s;
  -moz-animation-delay: 3s;
  animation-delay: 3s;
  -webkit-animation-fill-mode: both;
  -moz-animation-fill-mode: both;
  animation-fill-mode: both;
  opacity: 0; }
.about p {
  -webkit-animation: fadeInDown 1s;
  -moz-animation: fadeInDown 1s;
  animation: fadeInDown 1s;
  -webkit-animation-delay: 4s;
  -moz-animation-delay: 4s;
  animation-delay: 4s;
  -webkit-animation-fill-mode: both;
  -moz-animation-fill-mode: both;
  animation-fill-mode: both;
  opacity: 0; }
.about h2:last-of-type {
  -webkit-animation: fadeIn 4s;
  -moz-animation: fadeIn 4s;
  animation: fadeIn 4s;
  -webkit-animation-delay: 7s;
  -moz-animation-delay: 7s;
  animation-delay: 7s;
  -webkit-animation-fill-mode: both;
  -moz-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-transform-origin: left center;
  -moz-transform-origin: left center;
  -ms-transform-origin: left center;
  -o-transform-origin: left center;
  transform-origin: left center;
  -webkit-animation-timing-function: ease-in;
  -moz-animation-timing-function: ease-in;
  animation-timing-function: ease-in;
  opacity: 0; }

.index table {
  width: 80%;
  border-collapse: collapse;
  margin: 0 auto; }
  @media only screen and (max-width: 320px) {
    .index table {
      width: 100%; } }
  @media only screen and (min-width: 321px) and (max-width: 640px) {
    .index table {
      width: 90%; } }
.index .row {
  border-bottom: 1px solid #eee; }
.index .cell.date {
  font-size: 0.8125em;
  line-height: 1.84615385em;
  color: #767676;
  text-align: right;
  white-space: nowrap;
  padding-left: 1em; }
@media only screen and (min-width: 321px) and (max-width: 640px) {
  .index td {
    display: block; }
  .index tr {
    display: block;
    margin-bottom: 1em; }
  .index .cell.date {
    font-size: 0.6875em;
    line-height: 1.45454545em;
    text-align: left;
    padding-left: 0; } }
@media only screen and (max-width: 320px) {
  .index td {
    display: block; }
  .index tr {
    display: block;
    margin-bottom: 1em; }
  .index .cell.date {
    font-size: 0.84615385em;
    line-height: 1.45454545em;
    text-align: left;
    padding-left: 0; } }

.posted-on {
  font-size: 0.6875em;
  line-height: 2.18181818em;
  color: #767676;
  text-align: right; }

.prettyprint {
  font-size: 1em;
  line-height: 1.5em;
  border-style: solid;
  border-width: 0.1875em;
  padding: 1.3125em;
  display: block;
  background-color: #333;
  color: #fff;
  margin-left: 1em;
  border-radius: 5px;
  border-color: #888;
  overflow-x: auto;
  margin: 1.5em 0; }
  @media only screen and (min-width: 321px) and (max-width: 640px) {
    .prettyprint {
      font-size: 0.875em;
      line-height: 1.71428571em;
      border-style: solid;
      border-width: 0.21428571em;
      padding: 1.5em;
      margin: 1.71428571em 0; } }
  @media only screen and (max-width: 320px) {
    .prettyprint {
      font-size: 0.8125em;
      line-height: 1.84615385em;
      border-style: solid;
      border-width: 0.23076923em;
      padding: 1.61538462em;
      margin: 1.84615385em 0; } }

.nocode {
  background-color: none;
  color: #000; }

.str {
  color: #ffa0a0; }

.kwd {
  color: #f0e68c;
  font-weight: bold; }

.com {
  color: #87ceeb; }

.typ {
  color: #98fb98; }

.lit {
  color: #cd5c5c; }

.pun {
  color: #fff; }

.pln {
  color: #fff; }

.tag {
  color: #f0e68c;
  font-weight: bold; }

.atn {
  color: #bdb76b;
  font-weight: bold; }

.atv {
  color: #ffa0a0; }

.dec {
  color: #98fb98; }

.fun {
  color: #d00; }

.linenums {
  margin-top: 0;
  margin-bottom: 0;
  color: #aeaeae; }

.L0, .L1, .L2, .L3, .L5, .L6, .L7, .L8 {
  list-style-type: none; }

/*# sourceMappingURL=style.css.map */