@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Fira+Code&display=swap");
html {
  box-sizing: border-box;
  font-size: 18px; }

*, *:before, *:after {
  box-sizing: inherit; }

body {
  margin: 0;
  padding: 0;
  font-size: 100%;
  font-family: "Helvetica", "Arial", sans-serif;
  color: #555; }

h1, h2, h3, h4, h5, h6, strong {
  font-family: Georgia, serif;
  color: #333; }

h1 {
  font-size: 2.5em;
  font-weight: 300; }

h2 {
  font-size: 2em;
  font-weight: 300; }

h3 {
  font-size: 1.5em;
  font-weight: 300; }

h4 {
  font-size: 1em; }

p {
  line-height: 1.5; }

.display-1 {
  font-size: 2.5em;
  font-weight: 300;
  margin-top: 2.5em; }

.display-2 {
  font-size: 2em;
  font-weight: 300;
  margin-top: 2em; }

.display-3 {
  font-size: 1.5em;
  font-weight: 300;
  margin-top: 1.5em; }

.display-4 {
  font-size: 1em;
  margin-top: 1em; }

.figcaption {
  font-size: 0.8em;
  text-align: center; }

.post-content a:hover {
  border-bottom: 1px #59A4D0 dotted; }

a {
  color: #59A4D0; }

.highlight a {
  color: gray;
  text-decoration: underline; }
  .highlight a:hover {
    color: lightgray; }

a.button-link-red {
  background-color: red;
  box-shadow: 0 5px 0 darkred;
  color: white !important;
  padding: 1em 1.5em;
  position: relative;
  text-decoration: none;
  text-transform: uppercase; }
  a.button-link-red:hover {
    background-color: #ce0606;
    cursor: pointer; }
  a.button-link-red:active {
    box-shadow: none;
    top: 5px; }

a.button-link-primary {
  background-color: cadetblue;
  box-shadow: 0 5px 0 #4c7e80;
  color: white !important;
  padding: 1em 1.5em;
  position: relative;
  text-decoration: none;
  text-transform: uppercase; }
  a.button-link-primary:hover {
    background-color: #568e90;
    cursor: pointer; }
  a.button-link-primary:active {
    box-shadow: none;
    top: 5px; }

b, em, strong {
  color: #444; }

pre {
  text-rendering: optimizeLegibility; }

li {
  margin: 10px 0; }

blockquote {
  display: block;
  padding: 15px 20px 15px 45px;
  margin: 0 0 20px;
  position: relative;
  /*Font*/
  font-family: Georgia, serif;
  font-size: 16px;
  line-height: 1.2;
  color: #666;
  text-align: justify;
  /*Borders - (Optional)*/
  border-left: 10px solid #59A4D0;
  /*Box Shadow - (Optional)*/
  background: #f9f9f9; }

blockquote::before {
  content: "\201C";
  /*Unicode for Left Double Quote*/
  /*Font*/
  font-family: Georgia, serif;
  font-size: 60px;
  font-weight: bold;
  color: #999;
  /*Positioning*/
  position: absolute;
  left: 10px;
  top: 5px; }

blockquote::after {
  /*Reset to make sure*/
  content: ""; }

blockquote a {
  text-decoration: none;
  background: #eee;
  cursor: pointer;
  padding: 0 3px;
  color: #59A4D0; }

blockquote a:hover {
  color: #666; }

blockquote em {
  font-style: italic; }

.capitalize {
  text-transform: capitalize; }

.m-x-0 {
  margin-left: 0em;
  margin-right: 0em; }

.m-y-0 {
  margin-top: 0em;
  margin-bottom: 0em; }

.m-a-0 {
  margin: 0em; }

.p-x-0 {
  padding-left: 0em;
  padding-right: 0em; }

.p-y-0 {
  padding-top: 0em;
  padding-bottom: 0em; }

.p-a-0 {
  padding: 0em; }

.m-x-1 {
  margin-left: 0.5em;
  margin-right: 0.5em; }

.m-y-1 {
  margin-top: 0.5em;
  margin-bottom: 0.5em; }

.m-a-1 {
  margin: 0.5em; }

.p-x-1 {
  padding-left: 0.5em;
  padding-right: 0.5em; }

.p-y-1 {
  padding-top: 0.5em;
  padding-bottom: 0.5em; }

.p-a-1 {
  padding: 0.5em; }

.m-x-2 {
  margin-left: 1em;
  margin-right: 1em; }

.m-y-2 {
  margin-top: 1em;
  margin-bottom: 1em; }

.m-a-2 {
  margin: 1em; }

.p-x-2 {
  padding-left: 1em;
  padding-right: 1em; }

.p-y-2 {
  padding-top: 1em;
  padding-bottom: 1em; }

.p-a-2 {
  padding: 1em; }

.m-x-3 {
  margin-left: 1.5em;
  margin-right: 1.5em; }

.m-y-3 {
  margin-top: 1.5em;
  margin-bottom: 1.5em; }

.m-a-3 {
  margin: 1.5em; }

.p-x-3 {
  padding-left: 1.5em;
  padding-right: 1.5em; }

.p-y-3 {
  padding-top: 1.5em;
  padding-bottom: 1.5em; }

.p-a-3 {
  padding: 1.5em; }

.m-x-4 {
  margin-left: 2em;
  margin-right: 2em; }

.m-y-4 {
  margin-top: 2em;
  margin-bottom: 2em; }

.m-a-4 {
  margin: 2em; }

.p-x-4 {
  padding-left: 2em;
  padding-right: 2em; }

.p-y-4 {
  padding-top: 2em;
  padding-bottom: 2em; }

.p-a-4 {
  padding: 2em; }

.m-x-5 {
  margin-left: 2.5em;
  margin-right: 2.5em; }

.m-y-5 {
  margin-top: 2.5em;
  margin-bottom: 2.5em; }

.m-a-5 {
  margin: 2.5em; }

.p-x-5 {
  padding-left: 2.5em;
  padding-right: 2.5em; }

.p-y-5 {
  padding-top: 2.5em;
  padding-bottom: 2.5em; }

.p-a-5 {
  padding: 2.5em; }

.m-x-6 {
  margin-left: 3em;
  margin-right: 3em; }

.m-y-6 {
  margin-top: 3em;
  margin-bottom: 3em; }

.m-a-6 {
  margin: 3em; }

.p-x-6 {
  padding-left: 3em;
  padding-right: 3em; }

.p-y-6 {
  padding-top: 3em;
  padding-bottom: 3em; }

.p-a-6 {
  padding: 3em; }

.m-x-7 {
  margin-left: 3.5em;
  margin-right: 3.5em; }

.m-y-7 {
  margin-top: 3.5em;
  margin-bottom: 3.5em; }

.m-a-7 {
  margin: 3.5em; }

.p-x-7 {
  padding-left: 3.5em;
  padding-right: 3.5em; }

.p-y-7 {
  padding-top: 3.5em;
  padding-bottom: 3.5em; }

.p-a-7 {
  padding: 3.5em; }

.m-x-8 {
  margin-left: 4em;
  margin-right: 4em; }

.m-y-8 {
  margin-top: 4em;
  margin-bottom: 4em; }

.m-a-8 {
  margin: 4em; }

.p-x-8 {
  padding-left: 4em;
  padding-right: 4em; }

.p-y-8 {
  padding-top: 4em;
  padding-bottom: 4em; }

.p-a-8 {
  padding: 4em; }

.m-x-9 {
  margin-left: 4.5em;
  margin-right: 4.5em; }

.m-y-9 {
  margin-top: 4.5em;
  margin-bottom: 4.5em; }

.m-a-9 {
  margin: 4.5em; }

.p-x-9 {
  padding-left: 4.5em;
  padding-right: 4.5em; }

.p-y-9 {
  padding-top: 4.5em;
  padding-bottom: 4.5em; }

.p-a-9 {
  padding: 4.5em; }

.m-x-10 {
  margin-left: 5em;
  margin-right: 5em; }

.m-y-10 {
  margin-top: 5em;
  margin-bottom: 5em; }

.m-a-10 {
  margin: 5em; }

.p-x-10 {
  padding-left: 5em;
  padding-right: 5em; }

.p-y-10 {
  padding-top: 5em;
  padding-bottom: 5em; }

.p-a-10 {
  padding: 5em; }

.m-x-11 {
  margin-left: 5.5em;
  margin-right: 5.5em; }

.m-y-11 {
  margin-top: 5.5em;
  margin-bottom: 5.5em; }

.m-a-11 {
  margin: 5.5em; }

.p-x-11 {
  padding-left: 5.5em;
  padding-right: 5.5em; }

.p-y-11 {
  padding-top: 5.5em;
  padding-bottom: 5.5em; }

.p-a-11 {
  padding: 5.5em; }

.m-x-12 {
  margin-left: 6em;
  margin-right: 6em; }

.m-y-12 {
  margin-top: 6em;
  margin-bottom: 6em; }

.m-a-12 {
  margin: 6em; }

.p-x-12 {
  padding-left: 6em;
  padding-right: 6em; }

.p-y-12 {
  padding-top: 6em;
  padding-bottom: 6em; }

.p-a-12 {
  padding: 6em; }

.m-b-0 {
  margin-bottom: 0; }

.m-t-0 {
  margin-top: 0; }

.mdl-shadow--2dp {
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 0 1px -2px rgba(0, 0, 0, 0.2), 0 2px 5px 0 rgba(0, 0, 0, 0.12); }

.mdl-shadow--3dp, .card {
  box-shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.14), 0 3px 3px -2px rgba(0, 0, 0, 0.2), 0 1px 8px 0 rgba(0, 0, 0, 0.12); }

.mdl-shadow--4dp {
  box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12), 0 2px 4px -1px rgba(0, 0, 0, 0.2); }

.mdl-shadow--6dp {
  box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.14), 0 1px 18px 0 rgba(0, 0, 0, 0.12), 0 3px 5px -1px rgba(0, 0, 0, 0.2); }

.mdl-shadow--8dp {
  box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.2); }

.mdl-shadow--16dp {
  box-shadow: 0 16px 24px 2px rgba(0, 0, 0, 0.14), 0 6px 30px 5px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2); }

.mdl-shadow--24dp {
  box-shadow: 0 9px 46px 8px rgba(0, 0, 0, 0.14), 0 11px 15px -7px rgba(0, 0, 0, 0.12), 0 24px 38px 3px rgba(0, 0, 0, 0.2); }

.align-center {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center; }

.flexbox--space-between {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
      justify-content: space-between; }

/* Bounce In */
.animation--bounce-in, .extend:hover, .page-number:hover {
  display: inline-block;
  vertical-align: middle;
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  backface-visibility: hidden;
  -moz-osx-font-smoothing: grayscale;
  transition-duration: 0.5s; }
  .animation--bounce-in:hover, .extend:hover, .page-number:hover, .animation--bounce-in:focus, .extend:focus:hover, .page-number:focus:hover, .animation--bounce-in:active, .extend:active:hover, .page-number:active:hover {
    transform: scale(1.2);
    transition-timing-function: cubic-bezier(0.47, 2.02, 0.31, -0.36); }

/* Underline From Center */
.animation--underline-from-center {
  display: inline-block;
  vertical-align: middle;
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  backface-visibility: hidden;
  -moz-osx-font-smoothing: grayscale;
  position: relative;
  overflow: hidden; }
  .animation--underline-from-center:before {
    content: "";
    position: absolute;
    z-index: -1;
    left: 50%;
    right: 50%;
    bottom: 0px;
    background: #59A4D0;
    height: 4px;
    transition-property: left, right;
    transition-duration: 0.3s;
    transition-timing-function: ease-out; }
  .animation--underline-from-center:hover:before, .animation--underline-from-center:focus:before, .animation--underline-from-center:active:before {
    left: 0;
    right: 0; }

/* Radial Out */
.animation--radial-out {
  display: inline-block;
  vertical-align: middle;
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  backface-visibility: hidden;
  -moz-osx-font-smoothing: grayscale;
  position: relative;
  overflow: hidden;
  transition-property: color;
  transition-duration: 0.3s; }
  .animation--radial-out:before {
    content: "";
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #59A4D0;
    border-radius: 100%;
    transform: scale(0);
    transition-property: transform;
    transition-duration: 0.3s;
    transition-timing-function: ease-out; }
  .animation--radial-out:hover, .animation--radial-out:focus, .animation--radial-out:active {
    color: white; }
  .animation--radial-out:hover:before, .animation--radial-out:focus:before, .animation--radial-out:active:before {
    transform: scale(2); }

.hidden {
  display: none !important;
  visibility: hidden; }

.not-scaled {
  width: 100px;
  height: 100px; }

.overflow--hidden {
  overflow: hidden; }

.img-responsive {
  max-width: 100%; }

.hidden-mobile-down {
  display: none; }

.hidden-mobile-up {
  display: block; }

.navbar {
  height: 2.5em;
  padding-top: .5em; }

@media screen and (min-width: 768px) {
  .hidden-mobile-down {
    display: inline-block; }
  .hidden-mobile-up {
    display: none; }
  .navbar {
    padding-top: 0em; }
  .flex-row {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column; }
  .navbar--is-active {
    color: white;
    background-color: #59A4D0; }
  .navbar a {
    border-radius: 25px;
    padding: 10px; } }

*, *:before, *:after {
  box-sizing: border-box; }

.row {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -ms-flex-pack: justify;
      justify-content: space-between;
  -ms-flex-direction: column;
      flex-direction: column; }
  .row .col-xs-1 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-xs-2 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-xs-3 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-xs-4 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-xs-5 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-xs-6 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-xs-7 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-xs-8 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-xs-9 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-xs-10 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-xs-11 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-xs-12 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-sm-1 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-sm-2 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-sm-3 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-sm-4 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-sm-5 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-sm-6 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-sm-7 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-sm-8 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-sm-9 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-sm-10 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-sm-11 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-sm-12 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-md-1 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-md-2 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-md-3 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-md-4 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-md-5 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-md-6 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-md-7 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-md-8 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-md-9 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-md-10 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-md-11 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-md-12 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-lg-1 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-lg-2 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-lg-3 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-lg-4 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-lg-5 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-lg-6 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-lg-7 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-lg-8 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-lg-9 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-lg-10 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-lg-11 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-lg-12 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-xl-1 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-xl-2 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-xl-3 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-xl-4 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-xl-5 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-xl-6 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-xl-7 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-xl-8 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-xl-9 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-xl-10 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-xl-11 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }
  .row .col-xl-12 {
    width: calc(12/12 * 100%);
    margin: 8px 0;
    min-height: 1px;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    -ms-flex-order: 12;
        order: 12; }

.row-justify-content--flex-start {
  -ms-flex-pack: start;
      justify-content: flex-start; }

.row-justify-content--flex-end {
  -ms-flex-pack: end;
      justify-content: flex-end; }

.row-justify-content--center {
  -ms-flex-pack: center;
      justify-content: center; }

.row-justify-content--space-between {
  -ms-flex-pack: justify;
      justify-content: space-between; }

.row-justify-content--space-around {
  -ms-flex-pack: distribute;
      justify-content: space-around; }

.row-flex-wrap--nowrap {
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap; }

.row-flex-wrap--wrap {
  -ms-flex-wrap: wrap;
      flex-wrap: wrap; }

.row-flex-wrap--wrap-reverse {
  -ms-flex-wrap: wrap-reverse;
      flex-wrap: wrap-reverse; }

@media screen and (min-width: 360px) {
  .container {
    width: 90%;
    max-width: 1336px;
    padding-left: 8px;
    padding-right: 8px;
    margin-left: auto;
    margin-right: auto; }
    .container .row {
      -ms-flex-direction: row;
          flex-direction: row; }
      .container .row .col-xs-1 {
        width: calc(1/12 * 100%);
        margin: 8px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
      .container .row .col-xs-2 {
        width: calc(2/12 * 100%);
        margin: 8px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
      .container .row .col-xs-3 {
        width: calc(3/12 * 100%);
        margin: 8px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
      .container .row .col-xs-4 {
        width: calc(4/12 * 100%);
        margin: 8px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
      .container .row .col-xs-5 {
        width: calc(5/12 * 100%);
        margin: 8px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
      .container .row .col-xs-6 {
        width: calc(6/12 * 100%);
        margin: 8px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
      .container .row .col-xs-7 {
        width: calc(7/12 * 100%);
        margin: 8px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
      .container .row .col-xs-8 {
        width: calc(8/12 * 100%);
        margin: 8px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
      .container .row .col-xs-9 {
        width: calc(9/12 * 100%);
        margin: 8px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
      .container .row .col-xs-10 {
        width: calc(10/12 * 100%);
        margin: 8px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
      .container .row .col-xs-11 {
        width: calc(11/12 * 100%);
        margin: 8px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
      .container .row .col-xs-12 {
        width: calc(12/12 * 100%);
        margin: 8px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
    .container .col-xs-order--1 {
      -ms-flex-order: 1;
          order: 1; }
    .container .col-xs-order--2 {
      -ms-flex-order: 2;
          order: 2; }
    .container .col-xs-order--3 {
      -ms-flex-order: 3;
          order: 3; }
    .container .col-xs-order--4 {
      -ms-flex-order: 4;
          order: 4; }
    .container .col-xs-order--5 {
      -ms-flex-order: 5;
          order: 5; }
    .container .col-xs-order--6 {
      -ms-flex-order: 6;
          order: 6; }
    .container .col-xs-order--7 {
      -ms-flex-order: 7;
          order: 7; }
    .container .col-xs-order--8 {
      -ms-flex-order: 8;
          order: 8; }
    .container .col-xs-order--9 {
      -ms-flex-order: 9;
          order: 9; }
    .container .col-xs-order--10 {
      -ms-flex-order: 10;
          order: 10; }
    .container .col-xs-order--11 {
      -ms-flex-order: 11;
          order: 11; }
    .container .col-xs-order--12 {
      -ms-flex-order: 12;
          order: 12; }
    .container .col-xs-align-self--auto {
      -ms-flex-item-align: auto;
          align-self: auto; }
    .container .col-xs-align-self--flex-start {
      -ms-flex-item-align: start;
          align-self: flex-start; }
    .container .col-xs-align-self--flex-end {
      -ms-flex-item-align: end;
          align-self: flex-end; }
    .container .col-xs-align-self--center {
      -ms-flex-item-align: center;
          align-self: center; }
    .container .col-xs-align-self--baseline {
      -ms-flex-item-align: baseline;
          align-self: baseline; }
    .container .col-xs-align-self--stretch {
      -ms-flex-item-align: stretch;
          align-self: stretch; } }

@media screen and (min-width: 768px) {
  .container {
    width: 90%;
    max-width: 1336px;
    padding-left: 12px;
    padding-right: 12px;
    margin-left: auto;
    margin-right: auto; }
    .container .row {
      -ms-flex-direction: row;
          flex-direction: row; }
      .container .row .col-sm-1 {
        width: calc(1/12 * 100%);
        margin: 12px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
      .container .row .col-sm-2 {
        width: calc(2/12 * 100%);
        margin: 12px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
      .container .row .col-sm-3 {
        width: calc(3/12 * 100%);
        margin: 12px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
      .container .row .col-sm-4 {
        width: calc(4/12 * 100%);
        margin: 12px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
      .container .row .col-sm-5 {
        width: calc(5/12 * 100%);
        margin: 12px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
      .container .row .col-sm-6 {
        width: calc(6/12 * 100%);
        margin: 12px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
      .container .row .col-sm-7 {
        width: calc(7/12 * 100%);
        margin: 12px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
      .container .row .col-sm-8 {
        width: calc(8/12 * 100%);
        margin: 12px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
      .container .row .col-sm-9 {
        width: calc(9/12 * 100%);
        margin: 12px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
      .container .row .col-sm-10 {
        width: calc(10/12 * 100%);
        margin: 12px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
      .container .row .col-sm-11 {
        width: calc(11/12 * 100%);
        margin: 12px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
      .container .row .col-sm-12 {
        width: calc(12/12 * 100%);
        margin: 12px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
    .container .col-sm-order--1 {
      -ms-flex-order: 1;
          order: 1; }
    .container .col-sm-order--2 {
      -ms-flex-order: 2;
          order: 2; }
    .container .col-sm-order--3 {
      -ms-flex-order: 3;
          order: 3; }
    .container .col-sm-order--4 {
      -ms-flex-order: 4;
          order: 4; }
    .container .col-sm-order--5 {
      -ms-flex-order: 5;
          order: 5; }
    .container .col-sm-order--6 {
      -ms-flex-order: 6;
          order: 6; }
    .container .col-sm-order--7 {
      -ms-flex-order: 7;
          order: 7; }
    .container .col-sm-order--8 {
      -ms-flex-order: 8;
          order: 8; }
    .container .col-sm-order--9 {
      -ms-flex-order: 9;
          order: 9; }
    .container .col-sm-order--10 {
      -ms-flex-order: 10;
          order: 10; }
    .container .col-sm-order--11 {
      -ms-flex-order: 11;
          order: 11; }
    .container .col-sm-order--12 {
      -ms-flex-order: 12;
          order: 12; }
    .container .col-sm-align-self--auto {
      -ms-flex-item-align: auto;
          align-self: auto; }
    .container .col-sm-align-self--flex-start {
      -ms-flex-item-align: start;
          align-self: flex-start; }
    .container .col-sm-align-self--flex-end {
      -ms-flex-item-align: end;
          align-self: flex-end; }
    .container .col-sm-align-self--center {
      -ms-flex-item-align: center;
          align-self: center; }
    .container .col-sm-align-self--baseline {
      -ms-flex-item-align: baseline;
          align-self: baseline; }
    .container .col-sm-align-self--stretch {
      -ms-flex-item-align: stretch;
          align-self: stretch; } }

@media screen and (min-width: 1336px) {
  .container {
    width: 90%;
    max-width: 1336px;
    padding-left: 12px;
    padding-right: 12px;
    margin-left: auto;
    margin-right: auto; }
    .container .row {
      -ms-flex-direction: row;
          flex-direction: row; }
      .container .row .col-md-1 {
        width: calc(1/12 * 100%);
        margin: 12px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
      .container .row .col-md-2 {
        width: calc(2/12 * 100%);
        margin: 12px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
      .container .row .col-md-3 {
        width: calc(3/12 * 100%);
        margin: 12px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
      .container .row .col-md-4 {
        width: calc(4/12 * 100%);
        margin: 12px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
      .container .row .col-md-5 {
        width: calc(5/12 * 100%);
        margin: 12px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
      .container .row .col-md-6 {
        width: calc(6/12 * 100%);
        margin: 12px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
      .container .row .col-md-7 {
        width: calc(7/12 * 100%);
        margin: 12px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
      .container .row .col-md-8 {
        width: calc(8/12 * 100%);
        margin: 12px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
      .container .row .col-md-9 {
        width: calc(9/12 * 100%);
        margin: 12px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
      .container .row .col-md-10 {
        width: calc(10/12 * 100%);
        margin: 12px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
      .container .row .col-md-11 {
        width: calc(11/12 * 100%);
        margin: 12px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
      .container .row .col-md-12 {
        width: calc(12/12 * 100%);
        margin: 12px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
    .container .col-md-order--1 {
      -ms-flex-order: 1;
          order: 1; }
    .container .col-md-order--2 {
      -ms-flex-order: 2;
          order: 2; }
    .container .col-md-order--3 {
      -ms-flex-order: 3;
          order: 3; }
    .container .col-md-order--4 {
      -ms-flex-order: 4;
          order: 4; }
    .container .col-md-order--5 {
      -ms-flex-order: 5;
          order: 5; }
    .container .col-md-order--6 {
      -ms-flex-order: 6;
          order: 6; }
    .container .col-md-order--7 {
      -ms-flex-order: 7;
          order: 7; }
    .container .col-md-order--8 {
      -ms-flex-order: 8;
          order: 8; }
    .container .col-md-order--9 {
      -ms-flex-order: 9;
          order: 9; }
    .container .col-md-order--10 {
      -ms-flex-order: 10;
          order: 10; }
    .container .col-md-order--11 {
      -ms-flex-order: 11;
          order: 11; }
    .container .col-md-order--12 {
      -ms-flex-order: 12;
          order: 12; }
    .container .col-md-align-self--auto {
      -ms-flex-item-align: auto;
          align-self: auto; }
    .container .col-md-align-self--flex-start {
      -ms-flex-item-align: start;
          align-self: flex-start; }
    .container .col-md-align-self--flex-end {
      -ms-flex-item-align: end;
          align-self: flex-end; }
    .container .col-md-align-self--center {
      -ms-flex-item-align: center;
          align-self: center; }
    .container .col-md-align-self--baseline {
      -ms-flex-item-align: baseline;
          align-self: baseline; }
    .container .col-md-align-self--stretch {
      -ms-flex-item-align: stretch;
          align-self: stretch; } }

@media screen and (min-width: 1960px) {
  .container {
    width: 90%;
    max-width: 1336px;
    padding-left: 12px;
    padding-right: 12px;
    margin-left: auto;
    margin-right: auto; }
    .container .row {
      -ms-flex-direction: row;
          flex-direction: row; }
      .container .row .col-lg-1 {
        width: calc(1/12 * 100%);
        margin: 12px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
      .container .row .col-lg-2 {
        width: calc(2/12 * 100%);
        margin: 12px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
      .container .row .col-lg-3 {
        width: calc(3/12 * 100%);
        margin: 12px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
      .container .row .col-lg-4 {
        width: calc(4/12 * 100%);
        margin: 12px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
      .container .row .col-lg-5 {
        width: calc(5/12 * 100%);
        margin: 12px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
      .container .row .col-lg-6 {
        width: calc(6/12 * 100%);
        margin: 12px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
      .container .row .col-lg-7 {
        width: calc(7/12 * 100%);
        margin: 12px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
      .container .row .col-lg-8 {
        width: calc(8/12 * 100%);
        margin: 12px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
      .container .row .col-lg-9 {
        width: calc(9/12 * 100%);
        margin: 12px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
      .container .row .col-lg-10 {
        width: calc(10/12 * 100%);
        margin: 12px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
      .container .row .col-lg-11 {
        width: calc(11/12 * 100%);
        margin: 12px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
      .container .row .col-lg-12 {
        width: calc(12/12 * 100%);
        margin: 12px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
    .container .col-lg-order--1 {
      -ms-flex-order: 1;
          order: 1; }
    .container .col-lg-order--2 {
      -ms-flex-order: 2;
          order: 2; }
    .container .col-lg-order--3 {
      -ms-flex-order: 3;
          order: 3; }
    .container .col-lg-order--4 {
      -ms-flex-order: 4;
          order: 4; }
    .container .col-lg-order--5 {
      -ms-flex-order: 5;
          order: 5; }
    .container .col-lg-order--6 {
      -ms-flex-order: 6;
          order: 6; }
    .container .col-lg-order--7 {
      -ms-flex-order: 7;
          order: 7; }
    .container .col-lg-order--8 {
      -ms-flex-order: 8;
          order: 8; }
    .container .col-lg-order--9 {
      -ms-flex-order: 9;
          order: 9; }
    .container .col-lg-order--10 {
      -ms-flex-order: 10;
          order: 10; }
    .container .col-lg-order--11 {
      -ms-flex-order: 11;
          order: 11; }
    .container .col-lg-order--12 {
      -ms-flex-order: 12;
          order: 12; }
    .container .col-lg-align-self--auto {
      -ms-flex-item-align: auto;
          align-self: auto; }
    .container .col-lg-align-self--flex-start {
      -ms-flex-item-align: start;
          align-self: flex-start; }
    .container .col-lg-align-self--flex-end {
      -ms-flex-item-align: end;
          align-self: flex-end; }
    .container .col-lg-align-self--center {
      -ms-flex-item-align: center;
          align-self: center; }
    .container .col-lg-align-self--baseline {
      -ms-flex-item-align: baseline;
          align-self: baseline; }
    .container .col-lg-align-self--stretch {
      -ms-flex-item-align: stretch;
          align-self: stretch; } }

@media screen and (min-width: 2880px) {
  .container {
    width: 90%;
    max-width: 1336px;
    padding-left: 12px;
    padding-right: 12px;
    margin-left: auto;
    margin-right: auto; }
    .container .row {
      -ms-flex-direction: row;
          flex-direction: row; }
      .container .row .col-xl-1 {
        width: calc(1/12 * 100%);
        margin: 12px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
      .container .row .col-xl-2 {
        width: calc(2/12 * 100%);
        margin: 12px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
      .container .row .col-xl-3 {
        width: calc(3/12 * 100%);
        margin: 12px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
      .container .row .col-xl-4 {
        width: calc(4/12 * 100%);
        margin: 12px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
      .container .row .col-xl-5 {
        width: calc(5/12 * 100%);
        margin: 12px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
      .container .row .col-xl-6 {
        width: calc(6/12 * 100%);
        margin: 12px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
      .container .row .col-xl-7 {
        width: calc(7/12 * 100%);
        margin: 12px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
      .container .row .col-xl-8 {
        width: calc(8/12 * 100%);
        margin: 12px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
      .container .row .col-xl-9 {
        width: calc(9/12 * 100%);
        margin: 12px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
      .container .row .col-xl-10 {
        width: calc(10/12 * 100%);
        margin: 12px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
      .container .row .col-xl-11 {
        width: calc(11/12 * 100%);
        margin: 12px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
      .container .row .col-xl-12 {
        width: calc(12/12 * 100%);
        margin: 12px 0;
        min-height: 1px;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        -ms-flex-order: 12;
            order: 12; }
    .container .col-xl-order--1 {
      -ms-flex-order: 1;
          order: 1; }
    .container .col-xl-order--2 {
      -ms-flex-order: 2;
          order: 2; }
    .container .col-xl-order--3 {
      -ms-flex-order: 3;
          order: 3; }
    .container .col-xl-order--4 {
      -ms-flex-order: 4;
          order: 4; }
    .container .col-xl-order--5 {
      -ms-flex-order: 5;
          order: 5; }
    .container .col-xl-order--6 {
      -ms-flex-order: 6;
          order: 6; }
    .container .col-xl-order--7 {
      -ms-flex-order: 7;
          order: 7; }
    .container .col-xl-order--8 {
      -ms-flex-order: 8;
          order: 8; }
    .container .col-xl-order--9 {
      -ms-flex-order: 9;
          order: 9; }
    .container .col-xl-order--10 {
      -ms-flex-order: 10;
          order: 10; }
    .container .col-xl-order--11 {
      -ms-flex-order: 11;
          order: 11; }
    .container .col-xl-order--12 {
      -ms-flex-order: 12;
          order: 12; }
    .container .col-xl-align-self--auto {
      -ms-flex-item-align: auto;
          align-self: auto; }
    .container .col-xl-align-self--flex-start {
      -ms-flex-item-align: start;
          align-self: flex-start; }
    .container .col-xl-align-self--flex-end {
      -ms-flex-item-align: end;
          align-self: flex-end; }
    .container .col-xl-align-self--center {
      -ms-flex-item-align: center;
          align-self: center; }
    .container .col-xl-align-self--baseline {
      -ms-flex-item-align: baseline;
          align-self: baseline; }
    .container .col-xl-align-self--stretch {
      -ms-flex-item-align: stretch;
          align-self: stretch; } }

.simple-row {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column; }

@media (min-width: 768px) {
  .simple-row {
    -ms-flex-direction: row;
        flex-direction: row;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap; } }

@media (min-width: 992px) {
  .simple-row {
    -ms-flex-direction: row;
        flex-direction: row;
    -ms-flex-wrap: nowrap;
        flex-wrap: nowrap; } }

.titlebar,
.page-footer,
nav {
  background-color: #f9f9f9; }

.navbar--is-active {
  border-bottom: 4px solid #59A4D0; }

.page-footer {
  background-color: #424242;
  color: white; }
  .page-footer a {
    color: white; }

a {
  text-decoration: none;
  color: #59A4D0; }

.logo {
  font-size: 3em;
  font-weight: 500; }

.logo--bounce-in {
  transform: scale(1.2);
  transition-timing-function: cubic-bezier(0.47, 2.02, 0.31, -0.36); }

.logo {
  font-family: "Orbitron", fantasy;
  font-size: 30px; }
  .logo span:first-child {
    color: #59A4D0; }
  .logo span:last-child {
    color: #7E8183; }

.card {
  max-width: 300px;
  margin-bottom: 15px;
  margin-right: 15px;
  border-radius: 10px; }

.background-text--dark-color-0 {
  background-color: #D24D57; }
  .background-text--dark-color-0 p {
    color: white; }

.background-text--dark-color-1 {
  background-color: #C93756; }
  .background-text--dark-color-1 p {
    color: white; }

.background-text--dark-color-2 {
  background-color: #34495E; }
  .background-text--dark-color-2 p {
    color: white; }

.background-text--dark-color-3 {
  background-color: #5D3F6A; }
  .background-text--dark-color-3 p {
    color: white; }

.background-text--dark-color-4 {
  background-color: #4B77BE; }
  .background-text--dark-color-4 p {
    color: white; }

.background-text--dark-color-5 {
  background-color: #87D37C; }
  .background-text--dark-color-5 p {
    color: white; }

.background-text--dark-color-6 {
  background-color: #D9B611; }
  .background-text--dark-color-6 p {
    color: white; }

.background-text--dark-color-7 {
  background-color: #6C7A89; }
  .background-text--dark-color-7 p {
    color: white; }

.background-text--dark-color-8 {
  background-color: #7A7E8A; }
  .background-text--dark-color-8 p {
    color: white; }

.background-text--dark-color-9 {
  background-color: #00A187; }
  .background-text--dark-color-9 p {
    color: white; }

.background-text--dark-color-10 {
  background-color: #89C4F4; }
  .background-text--dark-color-10 p {
    color: white; }

.thumbnail-300x250 {
  width: 300px;
  height: 250px; }
  .thumbnail-300x250 p {
    margin: 0;
    font-size: 24px;
    font-family: Verdana;
    font-weight: normal;
    text-transform: capitalize;
    padding: 30px; }

.bio-box {
  border: 2px solid #e7e9ee;
  display: -ms-flexbox;
  display: flex; }
  .bio-box .muted a {
    color: #59A4D0; }

[aria-hidden="true"] {
  display: none; }

[aria-hidden="false"] {
  display: block; }

.noscroll {
  overflow: hidden; }

.overlay {
  background-color: rgba(0, 0, 0, 0.8);
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  overflow-y: scroll;
  z-index: 999999; }

#mc_embed_signup input.email {
  width: 250px !important; }

kbd {
  padding: 0.1em 0.6em;
  border: 1px solid #ccc;
  font-size: 11px;
  font-family: Arial, Helvetica, sans-serif;
  background-color: #f7f7f7;
  color: #333;
  box-shadow: 0 1px 0px rgba(0, 0, 0, 0.2), 0 0 0 2px #ffffff inset;
  border-radius: 3px;
  display: inline-block;
  margin: 0 0.1em;
  text-shadow: 0 1px 0 #fff;
  line-height: 1.4;
  white-space: nowrap;
  /* Prevent selection */
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none; }

kbd:hover {
  color: black;
  box-shadow: 1px 1px 1px #333; }

kbd:active {
  color: black;
  box-shadow: 1px 1px 0px #ddd inset; }

dt {
  font-weight: bold; }

dd {
  font-style: italic; }

details {
  margin: 1rem auto;
  padding: 0px 2rem;
  width: 100%;
  position: relative;
  border: 1px solid #78909C;
  border-radius: 6px;
  background-color: #ECEFF1;
  color: #263238;
  transition: background-color .15s; }
  details > :last-child {
    margin-bottom: 1rem; }
  details::before {
    width: 100%;
    height: 100%;
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    border-radius: inherit;
    opacity: .15;
    box-shadow: 0 .25em .5em #263238;
    pointer-events: none;
    transition: opacity .2s;
    z-index: -1; }
  details[open] {
    background-color: #FFF; }
    details[open]::before {
      opacity: .6; }

details .content {
  padding: 15px; }

summary {
  outline: none;
  padding: 1rem 2em 1rem 0;
  display: block;
  position: relative;
  font-size: 1.33em;
  font-weight: bold;
  cursor: pointer; }
  summary::before, summary::after {
    width: .75em;
    height: 2px;
    position: absolute;
    top: 50%;
    right: 0;
    content: '';
    background-color: currentColor;
    text-align: right;
    transform: translateY(-50%);
    transition: transform .2s ease-in-out; }
  summary::after {
    transform: translateY(-50%) rotate(90deg); }
    [open] summary::after {
      transform: translateY(-50%) rotate(180deg); }
  summary::-webkit-details-marker {
    display: none; }

article pre {
  background: #2d3748;
  margin: 0 -8px;
  padding: 15px 20px;
  border-style: solid;
  border-color: #ddd;
  border-width: 1px 0;
  overflow: auto;
  color: #ccc;
  line-height: 22.400000000000002px; }

article .highlight {
  border-radius: 10px;
  background: #2d3748;
  margin: 0 -8px;
  padding: 15px 20px;
  border-style: solid;
  border-color: #ddd;
  border-width: 1px 0;
  overflow: auto;
  color: #ccc;
  line-height: 22.400000000000002px; }
  article .highlight .gutter pre {
    color: #666;
    font-size: 0.85em; }

article .gist .gist-file .gist-data .line-numbers {
  color: #666;
  font-size: 0.85em; }

article pre {
  font-family: "Fira Code", "Ubuntu Mono", "Source Code Pro", Consolas, Monaco, Menlo, Consolas, monospace; }

article code {
  font-family: "Fira Code", "Ubuntu Mono", "Source Code Pro", Consolas, Monaco, Menlo, Consolas, monospace;
  background: rgba(27, 31, 35, 0.05);
  text-shadow: 0 1px #fff;
  padding: .2em .4em;
  font-size: 0.85em;
  border-radius: 3px;
  color: #f2777a; }

article pre code {
  background: none;
  text-shadow: none;
  padding: 0;
  border: 1px solid red; }

article .highlight pre {
  border: none;
  margin: 0;
  padding: 0;
  padding-right: 10px; }

article .highlight table {
  margin: 0;
  width: auto; }

article .highlight td {
  border: none;
  padding: 0; }

article .highlight figcaption {
  font-size: 0.85em;
  color: #999;
  line-height: 1em;
  margin-bottom: 1em; }
  article .highlight figcaption:before {
    content: "";
    display: table; }
  article .highlight figcaption:after {
    content: "";
    display: table;
    clear: both; }
  article .highlight figcaption a {
    float: right; }

article .highlight .gutter pre {
  text-align: right;
  padding-right: 20px; }

article .highlight .line {
  height: 22.400000000000002px; }
  article .highlight .line.marked {
    background: #515151; }

article .gist {
  margin: 0 -20px;
  border-style: solid;
  border-color: #ddd;
  border-width: 1px 0;
  padding: 15px 20px 15px 0; }
  article .gist .gist-file {
    border: none;
    font-family: "Fira Code", "Ubuntu Mono", "Source Code Pro", Consolas, Monaco, Menlo, Consolas, monospace;
    margin: 0; }
    article .gist .gist-file .gist-data {
      background: none;
      border: none; }
      article .gist .gist-file .gist-data .line-numbers {
        background: none;
        border: none;
        padding: 0 20px 0 0; }
      article .gist .gist-file .gist-data .line-data {
        padding: 0 !important; }
    article .gist .gist-file .highlight {
      margin: 0;
      padding: 0;
      border: none; }
    article .gist .gist-file .gist-meta {
      color: #999;
      font: 0.85em "Helvetica Neue", Helvetica, Arial, sans-serif;
      text-shadow: 0 0;
      padding: 0;
      margin-top: 1em;
      margin-left: 20px; }
      article .gist .gist-file .gist-meta a {
        color: #258fb8;
        font-weight: normal; }
        article .gist .gist-file .gist-meta a:hover {
          text-decoration: underline; }

pre {
  font-size: 0.85em; }
  pre .comment, pre .title {
    color: #999; }
  pre .variable, pre .attribute, pre .tag, pre .regexp, pre .ruby .constant {
    color: #f2777a; }
  pre .xml .tag .title, pre .xml .pi, pre .xml .doctype {
    color: #f2777a; }
  pre .html .doctype {
    color: #f2777a; }
  pre .css .id, pre .css .class, pre .css .pseudo {
    color: #f2777a; }
  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, pre .string, pre .value, pre .inheritance, pre .header, pre .ruby .symbol, pre .xml .cdata {
    color: #9c9; }
  pre .css .hexcolor {
    color: #6cc; }
  pre .function {
    color: #69c; }
  pre .python .decorator, pre .python .title {
    color: #69c; }
  pre .ruby .function .title, pre .ruby .title .keyword {
    color: #69c; }
  pre .perl .sub, pre .javascript .title, pre .coffeescript .title {
    color: #69c; }
  pre .keyword, pre .javascript .function {
    color: #c9c; }

.copy-btn {
  position: relative;
  display: inline-block;
  padding: 6px 12px;
  font-size: 13px;
  font-weight: 700;
  line-height: 20px;
  color: #333;
  white-space: nowrap;
  vertical-align: middle;
  cursor: pointer;
  background-color: #eee;
  background-image: linear-gradient(#fcfcfc, #eee);
  border: 1px solid #d5d5d5;
  border-radius: 3px;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none; }

.copy-btn::before {
  font-family: 'FontAwesome';
  font-weight: 400;
  content: "\f0ea"; }

.checkMark {
  background-color: #99cc99;
  background-image: none; }

.checkMark::before {
  font-family: 'FontAwesome';
  font-weight: 400;
  content: "\f00c"; }

.highlight {
  position: relative; }

.highlight .copy-btn {
  transition: opacity .3s ease-in-out;
  opacity: 0;
  padding: 2px 6px;
  position: absolute;
  right: 8px;
  bottom: 8px; }

.highlight:hover .copy-btn,
.highlight .copy-btn:focus {
  opacity: 1; }

pre.runkit, pre.clear {
  border: none;
  background-color: inherit;
  overflow: hidden;
  color: inherit; }

.post-content > table, .post-content > div > table {
  border: 1px solid rgba(0, 0, 0, 0.12);
  border-collapse: collapse;
  background-color: white; }
  .post-content > table caption, .post-content > div > table caption {
    text-align: left;
    font-size: 1.2em;
    margin-top: 1em; }
  .post-content > table thead, .post-content > div > table thead {
    padding-bottom: 1em; }
  .post-content > table tbody tr, .post-content > div > table tbody tr {
    position: relative;
    height: 48px;
    transition-duration: 0.28s;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-property: background-color; }
    .post-content > table tbody tr:hover, .post-content > div > table tbody tr:hover {
      background-color: #eeeeee; }
  .post-content > table td, .post-content > table th, .post-content > div > table td, .post-content > div > table th {
    padding: 0 18px 12px 18px; }
  .post-content > table td:first-of-type, .post-content > table th:first-of-type, .post-content > div > table td:first-of-type, .post-content > div > table th:first-of-type {
    padding-left: 24px; }
  .post-content > table td:last-of-type, .post-content > table th:last-of-type, .post-content > div > table td:last-of-type, .post-content > div > table th:last-of-type {
    padding-right: 24px; }
  .post-content > table td, .post-content > div > table td {
    position: relative;
    vertical-align: middle;
    height: 48px;
    border-top: 1px solid rgba(0, 0, 0, 0.12);
    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
    padding-top: 12px;
    box-sizing: border-box; }
    .post-content > table td.red, .post-content > div > table td.red {
      background-color: #FFEBEE; }
    .post-content > table td.orange, .post-content > div > table td.orange {
      background-color: #FFF3E0; }
    .post-content > table td.green, .post-content > div > table td.green {
      background-color: #E8F5E9; }
    .post-content > table td:hover, .post-content > div > table td:hover {
      filter: brightness(0.95); }
  .post-content > table th, .post-content > div > table th {
    position: relative;
    vertical-align: bottom;
    text-overflow: ellipsis;
    font-size: 1em;
    font-weight: bold;
    line-height: 24px;
    letter-spacing: 0;
    height: 3em;
    color: rgba(0, 0, 0, 0.54);
    padding-bottom: 8px;
    box-sizing: border-box;
    background-color: #eeeeee; }

.table--responsive {
  overflow-x: auto;
  width: 100%; }
  .table--responsive td, .table--responsive th {
    overflow: hidden;
    white-space: nowrap; }

.extend {
  -ms-flex-item-align: center;
      align-self: center; }
  .extend:hover {
    font-size: 2em; }

.next::after {
  content: ' »'; }

.prev::before {
  content: '« '; }

.page-number {
  -ms-flex-item-align: center;
      align-self: center; }
  .page-number:hover {
    font-size: 2em; }

.current {
  font-size: 2em;
  -ms-flex-item-align: center;
      align-self: center; }

.list-count, .category-list .category-list-item .category-list-count, .archive-list .archive-list-item .archive-list-count {
  vertical-align: super;
  font-size: smaller; }

.tag-list {
  list-style-type: none;
  padding: 0;
  margin: 0;
  display: inline; }
  .tag-list::before {
    font-family: FontAwesome;
    content: '\f02c';
    margin-right: 10px; }
  .tag-list .tag-list-item {
    display: inline;
    margin-right: 3px;
    text-transform: lowercase; }
  .tag-list .tag-list-link {
    color: inherit; }
    .tag-list .tag-list-link::before {
      font-family: FontAwesome;
      font-size: 0.8em;
      content: '\f292'; }
  .tag-list .tag-list-count {
    display: none; }

.toc-title {
  border-bottom: 1px solid #e3e3e3; }

.toc {
  padding: 0; }
  .toc .toc-item {
    list-style-type: none; }
    .toc .toc-item.active .toc-item {
      display: list-item; }
    .toc .toc-item a {
      color: inherit;
      padding: 5px 10px; }
      .toc .toc-item a:hover, .toc .toc-item a.active {
        font-weight: bold;
        border-left: 2px solid #59A4D0; }
  .toc .toc-level-3, .toc .toc-level-4, .toc .toc-level-5, .toc .toc-level-6 {
    display: none; }

.sticky-element--fixed {
  position: fixed;
  top: 0; }

.article-nav {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
      justify-content: space-between; }
  .article-nav .article-nav-caption {
    color: gray;
    text-transform: uppercase; }

.video-container {
  position: relative;
  padding-bottom: 56.25%;
  /* 16:9 */
  padding-top: 25px;
  height: 0; }

.video-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%; }

h1:hover .headerlink::after, h2:hover .headerlink::after, h3:hover .headerlink::after, h4:hover .headerlink::after {
  font-family: FontAwesome;
  content: '\f0c1';
  font-size: .7em;
  color: #444;
  margin-left: 10px; }

#email {
  width: 250px;
  vertical-align: top;
  font-size: 15px;
  background: #fff;
  border-radius: 50px/45px 0 0 40px;
  border-radius: 50px 0 0 50px / 45px 0 0 40px;
  outline: none;
  border: none;
  border: 1px solid #e6e6e6;
  border: 1px solid #D1D1D1;
  border-right: 1px solid #e6e6e6;
  padding: 16px 25px 12px;
  margin-right: -3px; }

#submit {
  padding: 15px 10px 13px 27px;
  border-left: none;
  text-align: left;
  width: 130px;
  color: #725852;
  text-shadow: -1px 1px 0px #fff;
  border-radius: 0 50px 50px 0;
  background-image: linear-gradient(to bottom, #f8f8f7, #e9e6e2);
  transition: all 0.2s ease-in-out;
  background-repeat: no-repeat;
  background-position: -16px 17px, 0 0;
  background-size: 16px, 100%;
  font-weight: normal;
  font-size: 15px;
  outline: none; }

.css3-guys {
  width: 370px;
  height: 110px;
  position: absolute;
  bottom: 0;
  right: 60px;
  margin: 0; }

.css3-guy {
  margin: 0;
  width: 180px;
  height: 110px;
  position: absolute;
  bottom: 0;
  overflow: hidden; }

.css3-head {
  position: absolute;
  background: #B09880;
  box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.1); }

.css3-body {
  position: absolute;
  background: #755854;
  box-shadow: inset 0 0 25px rgba(0, 0, 0, 0.3); }

.css3-eye {
  position: absolute;
  top: 16px;
  background: #fff;
  border-radius: 15px;
  display: block;
  width: 22px;
  height: 22px;
  box-shadow: inset 0 0 8px rgba(0, 0, 0, 0.1); }

.css3-eye.left {
  left: 18px; }

.css3-eye.right {
  left: 40px; }

.css3-eye .inner {
  background: #755854;
  left: 5px;
  top: 5px;
  position: absolute;
  width: 10px;
  height: 10px;
  border-radius: 20px;
  transition: all 0.2s ease-in-out; }

.css3-eye .sparkle {
  width: 2px;
  height: 2px;
  background: #fff;
  position: absolute;
  top: 2px;
  left: 2px;
  border-radius: 2px; }

.css3-mouth {
  position: absolute;
  border-radius: 0 0 55px 55px / 0 0 15px 15px;
  background: #755854;
  transition: all 0.1s ease-in-out; }

.css3-arm {
  background: #755854;
  display: block;
  position: absolute;
  z-index: 10;
  transform-origin: right bottom; }

.css3-hand {
  display: block;
  position: absolute;
  background: #B09880; }

.css3-finger {
  display: block;
  position: absolute;
  background: #B09880; }

.hurray .p1 .css3-arm.left, .hurray .p2 .css3-arm.left, .hurray .p3 .css3-arm.left, .hurray .p4 .css3-arm.left {
  transform: rotate(65deg) translateX(0); }

.hurray .p1 .css3-arm.right, .hurray .p2 .css3-arm.right, .hurray .p3 .css3-arm.right, .hurray .p4 .css3-arm.right {
  transform: rotate(115deg) translateX(0); }

.p1 {
  left: -65px; }

.p1 .css3-head {
  width: 70px;
  height: 70px;
  border-radius: 35px;
  z-index: 59;
  left: 50%;
  bottom: -70px;
  margin: 0 0 0 -35px;
  transition: all 0.3s ease-in-out; }

.p1 .css3-body {
  width: 140px;
  height: 140px;
  border-radius: 80px;
  z-index: 50;
  bottom: -148px;
  left: 50%;
  margin: 0 0 0 -70px;
  transition: all 0.2s ease-in-out; }

.p1 .css3-eye {
  top: 16px;
  width: 20px;
  height: 20px; }

.p1 .css3-eye.left {
  left: 12px; }

.p1 .css3-eye.right {
  left: 37px; }

.p1 .css3-eye .inner {
  top: 4px;
  left: 5px; }

.p1 .css3-eye .sparkle {
  left: 5px; }

.p1 .css3-mouth {
  width: 24px;
  left: 22px;
  bottom: 14px;
  height: 3px; }

.p1 .css3-mouth.smile1 {
  height: 7px;
  border-radius: 0 0 35px 35px / 0 0 15px 15px; }

.p1 .css3-mouth.smile2 {
  height: 10px;
  border-radius: 0 0 35px 35px / 0 0 25px 25px; }

.p1 .css3-mouth.smile3 {
  height: 12px; }

.p1 .css3-arm {
  width: 70px;
  height: 23px;
  transition: all 0.2s ease-in-out; }

.p1 .css3-arm.left {
  bottom: 10px;
  left: -31px;
  transform: rotate(65deg) translateX(110px); }

.p1 .css3-arm.right {
  bottom: 20px;
  left: 47px;
  transform: rotate(115deg) translateX(110px); }

.p1 .css3-hand {
  width: 15px;
  height: 27px;
  bottom: -3px;
  left: 0;
  border-radius: 5px 9px 9px 9px; }

.p1 .css3-finger {
  width: 18px;
  height: 7px;
  border-radius: 5px 0 0 5px; }

.p1 .left .finger1, .p1 .right .finger4 {
  bottom: -4px;
  left: -13px;
  transform: rotate(-9deg); }

.p1 .left .finger2, .p1 .right .finger2 {
  bottom: 3px;
  width: 7px;
  left: -5px;
  transform: rotate(-3deg); }

.p1 .left .finger3, .p1 .right .finger3 {
  bottom: 10px;
  width: 7px;
  left: -5px;
  transform: rotate(-3deg); }

.p1 .left .finger4, .p1 .right .finger1 {
  bottom: 17px;
  left: -17px;
  border-radius: 5px 0 0 5px;
  transform: rotate(2deg); }

.p1 .left .finger5 {
  bottom: 24px;
  left: -5px;
  width: 18px;
  border-radius: 5px 0 0 5px;
  transform: rotate(46deg); }

.p1 .right .finger5 {
  bottom: -10px;
  left: -2px;
  width: 18px;
  border-radius: 5px 0 0 5px;
  transform: rotate(-57deg); }

.active .p1 .css3-head {
  transform: translateY(-95px); }

.active .p1 .css3-body {
  transform: translateY(-40px); }

.p2 {
  left: 35px; }

.p2 .css3-head {
  margin: 0 0 0 -30px;
  width: 60px;
  height: 60px;
  border-radius: 30px;
  z-index: 39;
  left: 50%;
  bottom: -75px;
  transition: all 0.5s ease-in-out; }

.p2 .css3-body {
  margin: 0 0 0 -60px;
  width: 120px;
  height: 120px;
  border-radius: 60px;
  z-index: 30;
  left: 50%;
  bottom: -125px;
  transition: all 0.2s ease-in-out; }

.p2 .css3-eye {
  top: 14px;
  width: 18px;
  height: 18px; }

.p2 .css3-eye.left {
  left: 11px; }

.p2 .css3-eye.right {
  left: 31px; }

.p2 .css3-eye .inner {
  top: 3px;
  left: 4px;
  width: 9px;
  height: 9px; }

.p2 .css3-eye .sparkle {
  left: 4px; }

.p2 .css3-mouth {
  width: 19px;
  left: 20px;
  bottom: 12px;
  height: 3px; }

.p2 .css3-mouth.smile1 {
  height: 6px;
  border-radius: 0 0 35px 35px / 0 0 25px 25px; }

.p2 .css3-mouth.smile2 {
  height: 9px;
  border-radius: 0 0 35px 35px / 0 0 25px 25px; }

.p2 .css3-mouth.smile3 {
  height: 12px; }

.p2 .css3-arm {
  width: 60px;
  height: 19px;
  transition: all 0.1s ease-in-out; }

.p2 .css3-arm.left {
  bottom: 5px;
  left: -11px;
  transform: rotate(65deg) translateX(90px); }

.p2 .css3-arm.right {
  bottom: 15px;
  left: 55px;
  transform: rotate(115deg) translateX(90px); }

.p2 .css3-hand {
  width: 15px;
  height: 23px;
  bottom: -3px;
  left: 0;
  border-radius: 3px 7px 7px 7px; }

.p2 .css3-finger {
  width: 17px;
  height: 6px;
  border-radius: 5px 0 0 5px; }

.p2 .left .finger1, .p2 .right .finger4 {
  bottom: -4px;
  left: -13px;
  transform: rotate(-9deg); }

.p2 .left .finger2, .p2 .right .finger2 {
  bottom: 2px;
  width: 7px;
  left: -4px;
  transform: rotate(-3deg); }

.p2 .left .finger3, .p2 .right .finger3 {
  bottom: 7px;
  width: 7px;
  left: -4px;
  transform: rotate(-3deg); }

.p2 .left .finger4, .p2 .right .finger1 {
  bottom: 13px;
  left: -16px;
  border-radius: 5px 0 0 5px;
  transform: rotate(2deg); }

.p2 .left .finger5 {
  bottom: 21px;
  left: -5px;
  width: 18px;
  border-radius: 5px 0 0 5px;
  transform: rotate(46deg); }

.p2 .right .finger5 {
  bottom: -9px;
  left: -2px;
  width: 18px;
  border-radius: 5px 0 0 5px;
  transform: rotate(-57deg); }

.active .p2 .css3-head {
  transform: translateY(-95px); }

.active .p2 .css3-body {
  transform: translateY(-30px); }

.p3 {
  left: 135px;
  z-index: 20; }

.p3 .css3-head {
  width: 50px;
  height: 50px;
  border-radius: 25px;
  z-index: 69;
  left: 50%;
  bottom: -50px;
  margin: 0 0 0 -25px;
  transition: all 0.4s ease-in-out; }

.p3 .css3-body {
  width: 80px;
  height: 80px;
  border-radius: 40px;
  z-index: 60;
  bottom: -87px;
  left: 50%;
  margin: 0 0 0 -40px;
  transition: all 0.25s ease-in-out; }

.p3 .css3-eye {
  top: 13px;
  width: 15px;
  height: 15px; }

.p3 .css3-eye.left {
  left: 9px; }

.p3 .css3-eye.right {
  left: 27px; }

.p3 .css3-eye .inner {
  top: 2px;
  left: 4px;
  width: 8px;
  height: 8px; }

.p3 .css3-eye .sparkle {
  left: 2px; }

.p3 .css3-mouth {
  width: 15px;
  left: 17px;
  bottom: 10px;
  height: 2px; }

.p3 .css3-mouth.smile1 {
  height: 4px;
  border-radius: 0 0 35px 35px / 0 0 25px 25px; }

.p3 .css3-mouth.smile2 {
  height: 7px;
  border-radius: 0 0 35px 35px / 0 0 25px 25px; }

.p3 .css3-mouth.smile3 {
  height: 12px; }

.p3 .css3-arm {
  width: 50px;
  height: 15px;
  transition: all 0.3s ease-in-out; }

.p3 .css3-arm.left {
  bottom: 5px;
  left: 6px;
  transform: rotate(65deg) translateX(80px); }

.p3 .css3-arm.right {
  bottom: 10px;
  left: 60px;
  transform: rotate(115deg) translateX(80px); }

.p3 .css3-hand {
  width: 10px;
  height: 20px;
  bottom: -3px;
  left: 0;
  border-radius: 3px 7px 7px 7px; }

.p3 .css3-finger {
  width: 14px;
  height: 5px;
  border-radius: 5px 0 0 5px; }

.p3 .left .finger1, .p3 .right .finger4 {
  bottom: -4px;
  left: -11px;
  transform: rotate(-9deg); }

.p3 .left .finger2, .p3 .right .finger2 {
  bottom: 1px;
  width: 7px;
  left: -4px;
  transform: rotate(-3deg); }

.p3 .left .finger3, .p3 .right .finger3 {
  bottom: 6px;
  width: 7px;
  height: 6px;
  left: -4px;
  transform: rotate(-3deg); }

.p3 .left .finger4, .p3 .right .finger1 {
  bottom: 12px;
  left: -13px;
  border-radius: 5px 0 0 5px;
  transform: rotate(2deg); }

.p3 .left .finger5 {
  bottom: 17px;
  left: -5px;
  width: 15px;
  border-radius: 5px 0 0 5px;
  transform: rotate(46deg); }

.p3 .right .finger5 {
  bottom: -8px;
  left: -4px;
  width: 14px;
  border-radius: 5px 0 0 5px;
  transform: rotate(-57deg); }

.active .p3 .css3-head {
  transform: translateY(-70px); }

.active .p3 .css3-body {
  transform: translateY(-32px); }

.p4 {
  left: 255px; }

.p4 .css3-head {
  width: 70px;
  height: 70px;
  border-radius: 35px;
  z-index: 49;
  left: 50%;
  bottom: -70px;
  margin: 0 0 0 -35px;
  transition: all 0.7s ease-in-out; }

.p4 .css3-eye {
  top: 16px;
  background: #fff;
  width: 20px;
  height: 20px; }

.p4 .css3-eye.left {
  left: 13px; }

.p4 .css3-eye.right {
  left: 37px; }

.p4 .css3-eye .inner {
  top: 3px;
  left: 5px;
  width: 10px;
  height: 10px; }

.p4 .css3-body {
  width: 140px;
  height: 140px;
  border-radius: 70px;
  z-index: 40;
  left: 50%;
  bottom: -187px;
  margin: 0 0 0 -70px;
  transition: all 0.6s ease-in-out; }

.p4 .css3-mouth {
  width: 24px;
  left: 22px;
  bottom: 14px;
  height: 4px; }

.p4 .css3-mouth.smile1 {
  height: 7px;
  border-radius: 0 0 35px 35px / 0 0 15px 15px; }

.p4 .css3-mouth.smile2 {
  height: 10px;
  border-radius: 0 0 35px 35px / 0 0 25px 25px; }

.p4 .css3-mouth.smile3 {
  height: 12px; }

.p4 .css3-arm {
  width: 70px;
  height: 23px;
  transition: all 0.2s ease-in-out; }

.p4 .css3-arm.left {
  bottom: 10px;
  left: -31px;
  transform: rotate(65deg) translateX(110px); }

.p4 .css3-arm.right {
  bottom: 20px;
  left: 47px;
  transform: rotate(115deg) translateX(110px); }

.p4 .css3-hand {
  width: 15px;
  height: 27px;
  bottom: -3px;
  left: 0;
  border-radius: 5px 9px 9px 9px; }

.p4 .css3-finger {
  width: 18px;
  height: 7px;
  border-radius: 5px 0 0 5px; }

.p4 .left .finger1, .p4 .right .finger4 {
  bottom: -4px;
  left: -13px;
  transform: rotate(-9deg); }

.p4 .left .finger2, .p4 .right .finger2 {
  bottom: 3px;
  width: 7px;
  left: -5px;
  transform: rotate(-3deg); }

.p4 .left .finger3, .p4 .right .finger3 {
  bottom: 10px;
  width: 7px;
  left: -5px;
  transform: rotate(-3deg); }

.p4 .left .finger4, .p4 .right .finger1 {
  bottom: 17px;
  left: -17px;
  border-radius: 5px 0 0 5px;
  transform: rotate(2deg); }

.p4 .left .finger5 {
  bottom: 24px;
  left: -5px;
  width: 18px;
  border-radius: 5px 0 0 5px;
  transform: rotate(46deg); }

.p4 .right .finger5 {
  bottom: -10px;
  left: -2px;
  width: 18px;
  border-radius: 5px 0 0 5px;
  transform: rotate(-57deg); }

.active .p4 .css3-head {
  transform: translateY(-95px); }

.active .p4 .css3-body {
  transform: translateY(-80px); }

.light-background {
  background-color: #f9f9f9; }

.art-container {
  width: 100%;
  color: white;
  text-align: center; }
  .art-container img {
    max-width: 100%;
    max-height: 400px; }

.hero {
  margin: 3em 0; }
  .hero h1 {
    margin: 0.5em 0; }

.muted {
  color: #777; }
  .muted a {
    color: #777; }

.post-content {
  padding-bottom: 2rem;
  border-bottom: 2px solid #e7e9ee; }
  .post-content img {
    display: block;
    max-width: 90%; }