body {
  font-family: "HelveticaNeue", Arial;
  font-size: 18px;
  line-height: 1.4;
  margin: 0;
  padding: 0;
  letter-spacing: -0.1px;
  transition: all 0.1s ease-out;
  color: #e4e4e4;
  -webkit-font-smoothing:antialiased;
}
.wrapper {
  height: 100vh;
}
.big {
  font-size: 30px;
}
a,
a:hover,
a:active {
  color: inherit;
  text-decoration: none;
}

header {
  position: sticky;
  top: 0;
  padding: 30px 40px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background-color: inherit;
}
header .nav {
  flex: 1;
  max-width: 600px;
}
header .nav a {
  margin-right: 40px;
}
header .caption {
  flex: 1;
}

div[data-path] {
  display: none;
}

.page-inner {
  display: flex;
  padding: 0 40px;
}
.page .left {
  max-width: calc(min(560px, 50%));
  padding-right: 40px;
}
.page .left a.active {
  text-decoration: underline;
}
.page .right {
  max-width: 600px;
}
.page .left,
.page .right {
  padding-top: 50px;
  padding-bottom: 30px;
}
.page .right p {
  margin-top: 0;
  margin-bottom: 1.5em;
}

/* Tablet */
@media screen and (max-width: 1100px) {
  header .caption {
    display: none;
  }

  .page-inner {
    flex-direction: column;
  }
  .page .left {
    padding-right: 0;
  }
  .page .left,
  .page .right {
    max-width: none;
  }
}

/* Mobile */
@media screen and (max-width: 767px) {
  body {
  	font-family: "HelveticaNeue", Arial;
    font-size: 14px;
  }

  .big {
    font-size: 22px;
  }

  header {
    padding-left: 30px;
    padding-right: 30px;
  }
  header .nav a {
    margin-right: 25px;
  }

  .page-inner {
    padding: 0 30px;
  }
  .page .left {
    padding-right: 30px;
  }
}

/* Color schema */
.schema-red {
  background-color: #a51b00;
  color: #e4e4e4;
}
.schema-red-invert {
  background-color: #e4e4e4;
  color: #a51b00;
}
.schema-navy {
  background-color: #0B1E36;
  color: #E4E8A4;
}
.schema-navy-invert {
  background-color: #E4E8A4;
  color: #0B1E36;
}
.schema-grey {
  background-color: #e4e4e4;
  color: #9f9f9f;
}
.schema-grey-invert {
  background-color: #b5b5b5;
  color: #e4e4e4;
}
.schema-dark {
  background-color: #707070;
  color: #E4E4E4;
}
.schema-dark-invert {
  background-color: #E4E4E4;
  color: #707070;
}
