@keyframes next-in {
  0% {
    opacity: 0;
    transform: translateY(50px); }

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

@keyframes prev-out {
  0% {
    opacity: 1;
    transform: translateY(0px); }

  100% {
    opacity: 0;
    transform: translateY(50px); } }

@keyframes prev-in {
  0% {
    opacity: 0;
    transform: translateX(-50px); }

  100% {
    opacity: 1;
    transform: translateX(0px); } }

@keyframes next-out {
  0% {
    opacity: 1;
    transform: translateX(0px); }

  100% {
    opacity: 0;
    transform: translateX(-50px); } }

@keyframes slide-in {
  0% {
    left: -100%; }

  100% {
    left: 0; } }

@font-face {
  font-family: "Source Sans Pro";
  font-style: normal;
  font-weight: 300;
  src: local("Source Sans Pro Light"), local("SourceSansPro-Light"), url(http://themes.googleusercontent.com/static/fonts/sourcesanspro/v5/toadOcfmlt9b38dHJxOBGNbE_oMaV8t2eFeISPpzbdE.woff) format("woff"); }

@font-face {
  font-family: "Source Sans Pro";
  font-style: normal;
  font-weight: 400;
  src: local("Source Sans Pro"), local("SourceSansPro-Regular"), url(http://themes.googleusercontent.com/static/fonts/sourcesanspro/v5/ODelI1aHBYDBqgeIAH2zlBM0YzuT7MdOe03otPbuUS0.woff) format("woff"); }

@font-face {
  font-family: "Source Sans Pro";
  font-style: normal;
  font-weight: 900;
  src: local("Source Sans Pro Black"), local("SourceSansPro-Black"), url(http://themes.googleusercontent.com/static/fonts/sourcesanspro/v5/toadOcfmlt9b38dHJxOBGHiec-hVyr2k4iOzEQsW1iE.woff) format("woff"); }

@font-face {
  font-family: "Source Sans Pro";
  font-style: italic;
  font-weight: 300;
  src: local("Source Sans Pro Light Italic"), local("SourceSansPro-LightIt"), url(http://themes.googleusercontent.com/static/fonts/sourcesanspro/v5/fpTVHK8qsXbIeTHTrnQH6GGomRtBD2u8FwSY4jjlmeA.woff) format("woff"); }

@font-face {
  font-family: "Source Sans Pro";
  font-style: italic;
  font-weight: 400;
  src: local("Source Sans Pro Italic"), local("SourceSansPro-It"), url(http://themes.googleusercontent.com/static/fonts/sourcesanspro/v5/M2Jd71oPJhLKp0zdtTvoMzNrcjQuD0pTu1za2FULaMs.woff) format("woff"); }

@font-face {
  font-family: "Source Sans Pro";
  font-style: italic;
  font-weight: 900;
  src: local("Source Sans Pro Black Italic"), local("SourceSansPro-BlackIt"), url(http://themes.googleusercontent.com/static/fonts/sourcesanspro/v5/fpTVHK8qsXbIeTHTrnQH6ONg1gFYvjbPSGxSBhvPu6E.woff) format("woff"); }

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

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box; }

body {
  background: white; }

.content-wrapper {
  float: right;
  width: 65%; }
  @media all and (max-width: 830px) {
    .content-wrapper {
      float: none;
      width: 100%; } }
  .content-wrapper .content {
    color: #444444;
    max-width: 630px;
    padding: 20px 20px 20px 40px; }
    .content-wrapper .content a:not(.button) {
      color: #444444; }
    @media all and (max-width: 830px) {
      .content-wrapper .content {
        max-width: 100%;
        margin: 20px 0; } }
    .content-wrapper .content a:not(.button) {
      transition: all 0.25s; }
      .content-wrapper .content a:not(.button):hover {
        color: #387ff2; }

h1, h2, h3, h4, h5, h6 {
  font-family: Source Sans Pro;
  font-weight: 300;
  font-style: italic; }

a {
  font-weight: 400;
  text-decoration: none; }

.button {
  font-family: Source Sans Pro;
  font-weight: 300;
  font-style: italic;
  display: inline-block;
  width: 100px;
  padding: 10px 0;
  position: relative;
  text-align: center;
  cursor: pointer;
  transition: all 0.25s; }
  .button.dark {
    background: #387ff2;
    color: white; }
  .button.light {
    background: white;
    color: #444444; }
  .button:hover {
    transform: translate(-2px, -2px); }
  .button:active {
    transform: translate(1px, 1px); }

.copyright-wrapper {
  background: #387ff2;
  position: fixed;
  bottom: 0;
  width: 35%; }
  @media all and (max-width: 830px) {
    .copyright-wrapper {
      position: static;
      width: 100%; } }
  .copyright-wrapper .copyright {
    font-family: Source Sans Pro;
    font-weight: 300;
    font-style: normal;
    color: white;
    float: right;
    width: 290px;
    padding: 5px 20px;
    font-size: 0.8em;
    text-align: center; }
    .copyright-wrapper .copyright a:not(.button) {
      color: white; }
    @media all and (max-width: 830px) {
      .copyright-wrapper .copyright {
        float: none;
        width: 100%;
        padding: 5px 0; } }

.icon-rss {
  font-family: fontawesome;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  font-smoothing: antialiased;
  display: inline;
  margin-left: 10px; }
  .icon-rss:before {
    content: "\72"; }

nav {
  font-family: Source Sans Pro;
  font-weight: 300;
  font-style: normal;
  padding: 20px;
  text-align: center; }
  nav a {
    color: #444444;
    font-size: 1.5em;
    margin: 0 10px;
    transition: all 0.25s; }
    nav a:hover {
      color: #387ff2; }

.bio {
  font-family: Source Sans Pro;
  font-weight: 300;
  font-style: normal;
  color: white;
  background: #387ff2;
  text-align: center;
  padding: 50px 0; }
  .bio a {
    font-weight: 400;
    color: white; }
  .bio .avatar {
    position: relative;
    z-index: 100; }
  .bio .me,
  .bio .bio-carousel {
    display: inline-block;
    width: 250px; }
  .bio .bio-carousel {
    position: relative;
    width: 300px;
    height: 200px;
    padding: 40px 20px;
    vertical-align: top; }
    @media all and (max-width: 830px) {
      .bio .bio-carousel {
        display: block;
        width: 100%;
        margin: 10px auto;
        padding: 0 20px;
        text-align: center; } }
  .bio .bio-nav {
    text-align: left; }
    @media all and (max-width: 830px) {
      .bio .bio-nav {
        width: 80%;
        margin: 0 auto;
        text-align: center; } }
    .bio .bio-nav a {
      display: inline-block;
      font-size: 2.5em;
      margin-left: 5px;
      transition: all 0.25s; }
      @media all and (max-width: 830px) {
        .bio .bio-nav a {
          margin: 0 10px; } }
      .bio .bio-nav a.prev:hover {
        transform: translate(-2px, -2px); }
      .bio .bio-nav a.prev:active {
        transform: translate(1px, 1px); }
      .bio .bio-nav a.next:hover {
        transform: translate(2px, -2px); }
      .bio .bio-nav a.next:active {
        transform: translate(-1px, 1px); }
  .bio .bio-desc {
    position: relative; }
    @media all and (max-width: 830px) {
      .bio .bio-desc {
        max-width: 80%;
        margin: 0 auto; } }
    .bio .bio-desc .desc-part {
      width: 100%;
      position: absolute;
      text-align: left; }
      @media all and (max-width: 830px) {
        .bio .bio-desc .desc-part {
          margin: 0 auto;
          text-align: center; } }
      .bio .bio-desc .desc-part.name h1 {
        font-size: 4em;
        line-height: 1em; }
      .bio .bio-desc .desc-part:not(.name) {
        font-size: 1.5em; }
      .bio .bio-desc .desc-part a:hover {
        text-decoration: underline; }
      .bio .bio-desc .desc-part:not(.active) {
        display: none; }
      .bio .bio-desc .desc-part.next-in {
        animation: next-in 0.5s; }
      .bio .bio-desc .desc-part.next-out {
        animation: next-out 0.5s; }
      .bio .bio-desc .desc-part.prev-in {
        animation: prev-in 0.5s; }
      .bio .bio-desc .desc-part.prev-out {
        animation: prev-out 0.5s; }

@keyframes next-in {
  0% {
    opacity: 0;
    transform: translateY(50px); }

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

@keyframes prev-out {
  0% {
    opacity: 1;
    transform: translateY(0px); }

  100% {
    opacity: 0;
    transform: translateY(50px); } }

@keyframes prev-in {
  0% {
    opacity: 0;
    transform: translateX(-50px); }

  100% {
    opacity: 1;
    transform: translateX(0px); } }

@keyframes next-out {
  0% {
    opacity: 1;
    transform: translateX(0px); }

  100% {
    opacity: 0;
    transform: translateX(-50px); } }

@keyframes slide-in {
  0% {
    left: -100%; }

  100% {
    left: 0; } }

.site-header {
  position: fixed;
  top: 10%;
  left: 0;
  width: 35%;
  background: #387ff2;
  text-align: left;
  animation: slide-in 0.5s both; }
  @media all and (max-width: 830px) {
    .site-header {
      position: static;
      height: auto;
      width: 100%;
      border-radius: 0;
      animation: none; } }
  .site-header .header-content {
    font-family: Source Sans Pro;
    font-weight: 300;
    font-style: italic;
    color: white;
    float: right;
    width: 290px;
    padding: 20px; }
    .site-header .header-content a:not(.button) {
      color: white; }
    @media all and (max-width: 830px) {
      .site-header .header-content {
        float: none;
        width: 100%;
        padding: 40px; } }
    .site-header .header-content h1 {
      font-size: 4em;
      line-height: 1em;
      margin-bottom: 10px; }

.avatar {
  border-radius: 50%; }

.profile-link {
  margin: 10px 10px 10px 0;
  display: inline-block;
  position: relative;
  transition: transform 0.25s; }
  .profile-link img {
    width: 40px;
    height: 40px; }
  .profile-link:hover {
    transform: scale(1.2); }
    .profile-link:hover:after {
      opacity: 1;
      transform: translate(-50%, 0); }
  .profile-link:active {
    transform: scale(1.1); }
  .profile-link:after {
    font-family: Source Sans Pro;
    font-weight: 300;
    font-style: normal;
    content: "@" attr(data-user);
    font-size: 0.8em;
    position: absolute;
    top: 90%;
    left: 50%;
    text-align: center;
    opacity: 0;
    transform-origin: 0 0;
    transform: translate(-50%, 20px);
    transition: all 0.25s; }

h1 {
  display: inline; }

.latest-posts ul {
  list-style: none;
  margin: 10px 0;
  padding-right: 20px; }
.latest-posts .post-preview {
  margin-bottom: 40px; }
  .latest-posts .post-preview h3 {
    font-family: Source Sans Pro;
    font-weight: 900;
    font-style: normal;
    font-size: 3em;
    font-weight: 300; }
  .latest-posts .post-preview .post-time {
    font-family: Source Sans Pro;
    font-weight: 300;
    font-style: normal;
    display: block; }
  .latest-posts .post-preview .post-excerpt {
    font-family: Source Sans Pro;
    font-weight: 300;
    font-style: normal;
    margin-top: 20px; }
  .latest-posts .post-preview a {
    font-family: Source Sans Pro;
    font-weight: 900;
    font-style: normal; }

.post h1, .post h2, .post h3, .post h4, .post h5, .post h6 {
  font-family: Source Sans Pro;
  font-weight: 900;
  font-style: normal;
  margin-top: 1em; }
.post .post-header {
  margin-bottom: 20px; }
  .post .post-header h1 {
    font-size: 3em;
    font-weight: 300;
    margin-top: 20px;
    display: block; }
  .post .post-header .post-date {
    font-family: Source Sans Pro;
    font-weight: 300;
    font-style: normal;
    display: inline; }
.post p, .post ul {
  font-family: Source Sans Pro;
  font-weight: 300;
  font-style: normal;
  font-size: 1.1em;
  line-height: 1.4em;
  margin: 10px 0; }
.post ul {
  list-style-type: circle;
  margin-left: 30px; }
.post img {
  width: 100%; }

.post-buttons {
  margin-top: 20px; }
  .post-buttons .twitter-share-button,
  .post-buttons .fb-like {
    display: inline-block;
    vertical-align: top; }
  .post-buttons .back-to-blog {
    width: 120px;
    display: block;
    margin-top: 10px; }
    @media all and (max-width: 500px) {
      .post-buttons .back-to-blog {
        width: 100%; } }

#disqus_thread {
  margin-top: 20px; }
  #disqus_thread a {
    color: #387ff2; }

code {
  background-color: #eeeeee; }

.highlight {
  background-color: #eeeeee;
  padding: 1em;
  border-left: 3px solid #387ff2; }
  .highlight pre {
    word-wrap: break-word; }
  .highlight .c {
    color: #888888; }
  .highlight .err {
    color: #a61717;
    background-color: #e3d2d2; }
  .highlight .k {
    color: #008800;
    font-weight: bold; }
  .highlight .cm {
    color: #888888; }
  .highlight .cp {
    color: #cc0000;
    font-weight: bold; }
  .highlight .c1 {
    color: #888888; }
  .highlight .cs {
    color: #cc0000;
    font-weight: bold; }
  .highlight .gd {
    color: black; }
  .highlight .ge {
    font-style: italic; }
  .highlight .gr {
    color: #aa0000; }
  .highlight .gh {
    color: #303030; }
  .highlight .gi {
    color: black; }
  .highlight .go {
    color: #888888; }
  .highlight .gp {
    color: #555555; }
  .highlight .gs {
    font-weight: bold; }
  .highlight .gu {
    color: #606060; }
  .highlight .gt {
    color: #aa0000; }
  .highlight .kc {
    color: #008800;
    font-weight: bold; }
  .highlight .kd {
    color: #008800;
    font-weight: bold; }
  .highlight .kn {
    color: #008800;
    font-weight: bold; }
  .highlight .kp {
    color: #008800; }
  .highlight .kr {
    color: #008800;
    font-weight: bold; }
  .highlight .kt {
    color: #888888;
    font-weight: bold; }
  .highlight .m {
    color: #0000dd;
    font-weight: bold; }
  .highlight .s {
    color: #dd2200; }
  .highlight .na {
    color: #336699; }
  .highlight .nb {
    color: #003388; }
  .highlight .nc {
    color: #bb0066;
    font-weight: bold; }
  .highlight .no {
    color: #003366;
    font-weight: bold; }
  .highlight .nd {
    color: #555555; }
  .highlight .ne {
    color: #bb0066;
    font-weight: bold; }
  .highlight .nf {
    color: #0066bb;
    font-weight: bold; }
  .highlight .nl {
    color: #336699;
    font-style: italic; }
  .highlight .nn {
    color: #bb0066;
    font-weight: bold; }
  .highlight .py {
    color: #336699;
    font-weight: bold; }
  .highlight .nt {
    color: #bb0066;
    font-weight: bold; }
  .highlight .nv {
    color: #336699; }
  .highlight .ow {
    color: #008800; }
  .highlight .w {
    color: #bbbbbb; }
  .highlight .mf {
    color: #0000dd;
    font-weight: bold; }
  .highlight .mh {
    color: #0000dd;
    font-weight: bold; }
  .highlight .mi {
    color: #0000dd;
    font-weight: bold; }
  .highlight .mo {
    color: #0000dd;
    font-weight: bold; }
  .highlight .sb {
    color: #dd2200; }
  .highlight .sc {
    color: #dd2200; }
  .highlight .sd {
    color: #dd2200; }
  .highlight .s2 {
    color: #dd2200; }
  .highlight .se {
    color: #0044dd; }
  .highlight .sh {
    color: #dd2200; }
  .highlight .si {
    color: #3333bb; }
  .highlight .sx {
    color: #22bb22; }
  .highlight .sr {
    color: #008800; }
  .highlight .s1 {
    color: #dd2200; }
  .highlight .ss {
    color: #aa6600; }
  .highlight .bp {
    color: #003388; }
  .highlight .vc {
    color: #336699; }
  .highlight .vg {
    color: #dd7700; }
  .highlight .vi {
    color: #3333bb; }
  .highlight .il {
    color: #0000dd;
    font-weight: bold; }

.cv-back-link {
  font-family: Source Sans Pro;
  font-weight: 900;
  font-style: normal;
  color: #444444;
  text-align: left;
  padding: 10px; }

.cv {
  font-family: Source Sans Pro;
  font-weight: 300;
  font-style: normal;
  width: 90%;
  max-width: 800px;
  margin: 20px auto 50px auto;
  zoom: 1; }
  .cv:after {
    content: "";
    display: table;
    clear: both; }
  @media all and (max-width: 830px) {
    .cv .cv-card {
      text-align: center; } }
  .cv .cv-card .avatar {
    float: left;
    width: 200px;
    height: 200px; }
    @media all and (max-width: 830px) {
      .cv .cv-card .avatar {
        float: none; } }
  .cv .cv-card .cv-card-title,
  .cv .cv-card .cv-card-bio {
    padding-left: 220px; }
    @media all and (max-width: 830px) {
      .cv .cv-card .cv-card-title,
      .cv .cv-card .cv-card-bio {
        padding-left: 0; } }
  .cv .cv-card .cv-card-title {
    margin-bottom: 10px; }
    .cv .cv-card .cv-card-title .cv-card-name {
      font-weight: 400;
      display: inline-block; }
      @media all and (max-width: 830px) {
        .cv .cv-card .cv-card-title .cv-card-name {
          display: block; } }
    .cv .cv-card .cv-card-title .cv-card-job {
      margin: 0 10px;
      font-size: 1.2em; }
  @media all and (max-width: 830px) {
    .cv .cv-card .cv-card-bio {
      padding: 0 20px; } }
  .cv .cv-card .cv-card-contact {
    padding-left: 220px;
    margin-top: 10px; }
    @media all and (max-width: 830px) {
      .cv .cv-card .cv-card-contact {
        padding-left: 0; } }
    .cv .cv-card .cv-card-contact ul {
      display: inline-block;
      list-style: none;
      width: 150px; }
      @media all and (max-width: 650px) {
        .cv .cv-card .cv-card-contact ul {
          display: block;
          width: 100%;
          clear: both; }
          .cv .cv-card .cv-card-contact ul li {
            display: inline; }
            .cv .cv-card .cv-card-contact ul li:first-child {
              float: left; }
            .cv .cv-card .cv-card-contact ul li:last-child {
              float: right; } }
          @media all and (max-width: 650px) and (max-width: 500px) {
            .cv .cv-card .cv-card-contact ul li {
              font-size: 0.8em; } }
      .cv .cv-card .cv-card-contact ul.cv-contact-personal {
        width: 200px; }
        @media all and (max-width: 650px) {
          .cv .cv-card .cv-card-contact ul.cv-contact-personal {
            width: inherit; } }
      .cv .cv-card .cv-card-contact ul .cv-contact-item {
        margin-bottom: 5px; }
        .cv .cv-card .cv-card-contact ul .cv-contact-item .contact-label {
          display: inline-block;
          color: #387ff2;
          width: 20px;
          vertical-align: middle;
          font-family: fontawesome;
          speak: none;
          font-style: normal;
          font-weight: normal;
          font-variant: normal;
          text-transform: none;
          line-height: 1;
          font-smoothing: antialiased; }
          .cv .cv-card .cv-card-contact ul .cv-contact-item .contact-label.icon-email:before {
            content: "\65"; }
          .cv .cv-card .cv-card-contact ul .cv-contact-item .contact-label.icon-phone:before {
            content: "\70"; }
          .cv .cv-card .cv-card-contact ul .cv-contact-item .contact-label.icon-site:before {
            content: "\73"; }
          .cv .cv-card .cv-card-contact ul .cv-contact-item .contact-label.icon-blog:before {
            content: "\62"; }
          .cv .cv-card .cv-card-contact ul .cv-contact-item .contact-label.icon-twitter:before {
            content: "\74"; }
          .cv .cv-card .cv-card-contact ul .cv-contact-item .contact-label.icon-github:before {
            content: "\67"; }
          @media all and (max-width: 650px) {
            .cv .cv-card .cv-card-contact ul .cv-contact-item .contact-label.icon-phone, .cv .cv-card .cv-card-contact ul .cv-contact-item .contact-label.icon-blog, .cv .cv-card .cv-card-contact ul .cv-contact-item .contact-label.icon-github {
              float: right;
              margin-top: 4px;
              margin-left: 4px; } }
    .cv .cv-card .cv-card-contact a {
      color: #444444;
      font-weight: 400;
      transition: all 0.25s; }
      .cv .cv-card .cv-card-contact a:hover {
        color: #387ff2; }
  .cv .cv-full-width-list {
    clear: both;
    margin-top: 30px; }
    .cv .cv-full-width-list .cv-full-width-item {
      margin-bottom: 10px;
      padding: 0 5px; }
      .cv .cv-full-width-list .cv-full-width-item .cv-full-width-item-header {
        margin-bottom: 5px; }
        .cv .cv-full-width-list .cv-full-width-item .cv-full-width-item-header .cv-full-width-item-date,
        .cv .cv-full-width-list .cv-full-width-item .cv-full-width-item-header .cv-full-width-item-link {
          margin-left: 10px; }
        .cv .cv-full-width-list .cv-full-width-item .cv-full-width-item-header .cv-full-width-item-link {
          color: #444444;
          transition: all 0.25s; }
          .cv .cv-full-width-list .cv-full-width-item .cv-full-width-item-header .cv-full-width-item-link:hover {
            color: #387ff2; }
        .cv .cv-full-width-list .cv-full-width-item .cv-full-width-item-header .cv-full-width-item-desc {
          font-weight: 400; }
      .cv .cv-full-width-list .cv-full-width-item h3 {
        display: inline-block; }
    .cv .cv-full-width-list .cv-full-width-item + .cv-full-width-item {
      border-top: 1px solid #387ff2;
      padding-top: 10px;
      margin-bottom: 0; }
  .cv .cv-half-width-list {
    display: inline-block;
    width: 48%;
    vertical-align: top; }
    @media all and (max-width: 650px) {
      .cv .cv-half-width-list {
        display: block;
        width: 100%; } }
  .cv .cv-skills {
    float: left;
    margin-right: 2%; }
    @media all and (max-width: 650px) {
      .cv .cv-skills {
        float: none; } }
    .cv .cv-skills .cv-skill {
      margin-bottom: 10px;
      padding: 0 5px; }
  .cv .cv-languages .cv-language {
    margin-bottom: 10px;
    padding: 0 5px; }
  .cv .cv-meter {
    display: inline-block;
    float: right; }
    .cv .cv-meter li {
      list-style: none;
      display: inline-block;
      width: 0.8em;
      height: 0.8em;
      border-radius: 50%; }
      .cv .cv-meter li.on {
        background: #387ff2; }
      .cv .cv-meter li.off {
        background: #adadad; }
  .cv h2 {
    background-color: #387ff2;
    color: white;
    padding: 5px;
    margin: 20px 0 10px 0; }
  .cv h3 {
    font-weight: 400; }
  .cv li {
    list-style: none; }
