/* Typography */
/* Break Points */
/* Spacing */
/* Line Heights */
/* Letter spacing */
/**
 * @license
 * MyFonts Webfont Build ID 3362295, 2017-03-21T05:31:29-0400
 * 
 * The fonts listed in this notice are subject to the End User License
 * Agreement(s) entered into by the website owner. All other parties are 
 * explicitly restricted from using the Licensed Webfonts(s).
 * 
 * You may obtain a valid license at the URLs below.
 * 
 * Webfont: AvenirLTStd-Roman by Linotype
 * URL: http://www.myfonts.com/fonts/linotype/avenir/55-roman/
 * 
 * Webfont: AvenirLTStd-Light by Linotype
 * URL: http://www.myfonts.com/fonts/linotype/avenir/35-light/
 * 
 * 
 * License: http://www.myfonts.com/viewlicense?type=web&buildid=3362295
 * Licensed pageviews: 250,000
 * Webfonts copyright: Copyright © 1989, 1995, 2002 Adobe Systems Incorporated.  All Rights Reserved. © 1981, 1995, 2002 Heidelberger Druckmaschinen AG. All rights reserved.
 * 
 * 2017 MyFonts Inc
*/
@import url("//hello.myfonts.net/count/334df7");
@font-face {
  font-family: 'AvenirLTStd-Roman';
  src: url("../fonts/334DF7_0_0.eot");
  src: url("../fonts/334DF7_0_0.eot?#iefix") format("embedded-opentype"), url("../fonts/334DF7_0_0.woff2") format("woff2"), url("../fonts/334DF7_0_0.woff") format("woff"), url("../fonts/334DF7_0_0.ttf") format("truetype");
  font-weight: normal;
  font-style: normal; }
@font-face {
  font-family: 'AvenirLTStd-Light';
  src: url("../fonts/334DF7_1_0.eot");
  src: url("../fonts/334DF7_1_0.eot?#iefix") format("embedded-opentype"), url("../fonts/334DF7_1_0.woff2") format("woff2"), url("../fonts/334DF7_1_0.woff") format("woff"), url("../fonts/334DF7_1_0.ttf") format("truetype");
  font-weight: normal;
  font-style: normal; }
@font-face {
  font-family: 'Resident Serif Web';
  src: url("../fonts/ResidentSerifWeb-Regular.woff2") format("woff2"), url("../fonts/ResidentSerifWeb-Regular.woff") format("woff");
  font-weight: 400;
  font-style: normal; }
/* Font Families */
.typo-sans {
  font-family: "AvenirLTStd-Roman", "Helvetica Neue", Helvetica, Arial, sans-serif; }

.typo-sans-light {
  font-family: "AvenirLTStd-Light", "Helvetica Neue", Helvetica, Arial, sans-serif; }

.typo-serif {
  font-family: "Resident Serif Web", Times, serif; }

/* Font Size */
.typo-tiny {
  font-size: 0.7rem;
  letter-spacing: 0.03rem; }

.typo-small {
  font-size: 0.8rem;
  letter-spacing: 0.03rem; }

.typo-medium {
  font-size: 0.9rem; }

.typo-large {
  font-size: 1rem; }

.typo-extralarge {
  font-size: 1.2rem; }

.typo-huge {
  font-size: 1.25rem; }

@media screen and (min-width: 30rem) {
  .typo-medium {
    font-size: 0.9rem; }

  .typo-tiny {
    font-size: .7rem; } }
@media screen and (min-width: 45rem) {
  .typo-tiny {
    font-size: .9rem; }

  .typo-small {
    font-size: 1rem; }

  .typo-medium {
    font-size: 1.1rem; }

  .typo-large {
    font-size: 1.5rem; }

  .typo-extralarge {
    font-size: 1.8rem; }

  .typo-huge {
    font-size: 2.1rem; } }
@media screen and (min-width: 60rem) {
  .typo-tiny {
    font-size: .7rem; }

  .typo-small {
    font-size: .7rem; }

  .typo-medium {
    font-size: 1rem; }

  .typo-large {
    font-size: 1.15rem; }

  .typo-extralarge {
    font-size: 1.6rem; }

  .typo-huge {
    font-size: 2rem; } }
@media screen and (min-width: 70rem) {
  .typo-tiny {
    font-size: .8rem; }

  .typo-small {
    font-size: .8rem;
    letter-spacing: 0.04rem; }

  .typo-medium {
    font-size: 1rem; }

  .typo-large {
    font-size: 1.3rem; }

  .typo-extralarge {
    font-size: 2rem; }

  .typo-huge {
    font-size: 2.4rem; } }
@media screen and (min-width: 100rem) {
  .typo-tiny {
    font-size: .8rem; }

  .typo-small {
    font-size: 0.9rem;
    letter-spacing: 0.03rem; }

  .typo-medium {
    font-size: 1.25rem; }

  .typo-large {
    font-size: 1.6rem; }

  .typo-extralarge {
    font-size: 2.4rem; }

  .typo-huge {
    font-size: 3.1rem; } }
@media screen and (min-width: 110rem) {
  .typo-tiny {
    font-size: .8rem; }

  .typo-small {
    font-size: 1rem; }

  .typo-medium {
    font-size: 1.25rem; }

  .typo-large {
    font-size: 1.75rem; }

  .typo-extralarge {
    font-size: 2.4rem; }

  .typo-huge {
    font-size: 3.4rem; } }
/* Grid */
.grid {
  display: flex;
  flex-wrap: wrap; }

.grid > .column {
  flex-grow: 1;
  flex-shrink: 0;
  width: 100%; }

.grid.gutter {
  margin-left: 0; }

.grid.gutter > .column {
  padding-left: 0; }

@media screen and (min-width: 60rem) {
  .grid.gutter {
    margin-left: -3rem; }

  .grid.gutter > .column {
    padding-left: 3rem; } }
/* Text */
.text {
  line-height: 1.4em; }

.text p:not(:last-child) {
  margin-bottom: 1.4em; }

.words-meta a {
  border-bottom: 1px solid #a00000;
  padding-bottom: 1px;
  transition: all 0.2s ease; }

.words-meta a:hover {
  border-bottom: 1px solid red; }

.main {
  background: #000;
  min-height: calc(100vh - 6rem);
  transition: background .3s; }

/* Content Blocks */
.content {
  padding: 1.5rem; }

/* Footer */
.studio {
  background: #000;
  padding: 1.5rem 1.5rem 3rem; }

.studio .typo-large {
  font-size: 1.2rem; }

/* Address */
.studio address {
  display: block;
  font-style: normal; }

/* Studio Details */
.studio .column {
  margin-bottom: 3rem; }

/* Misc */
.misc {
  background: red;
  padding: 1.4rem 1.4rem;
  color: #000; }

.scrolltop {
  height: 70px;
  width: 70px;
  background: url(../images/scroll_to_top.svg) no-repeat center center;
  background-size: 40px 40px;
  position: fixed;
  bottom: 0.4rem;
  right: 0.2rem;
  z-index: 100000; }

/* Social Stuff */
.social {
  display: none;
  text-align: center; }

.social a {
  margin: 0 0.6rem; }

/* Copyright notice */
.copyright {
  padding: 0 0 0 0; }

.copyright a {
  display: block;
  margin-top: 0.5rem; }

@media screen and (max-width: 60rem) {
  body.has-overlay .misc {
    position: fixed;
    z-index: 1000;
    bottom: 0;
    left: 0;
    right: 0;
    background: transparent;
    padding: 2rem 1.4rem; } }
@media screen and (min-width: 30rem) {
  body.has-overlay .misc {
    padding: 1.2rem 1.4rem; }

  .copyright {
    padding: 0.75rem 3.2rem 0.75rem 0; }

  .copyright a {
    display: inline-block;
    margin-left: 1.5rem;
    margin-top: 0rem; }

  .misc {
    background: red;
    padding: 2rem 3rem;
    color: #000; } }
@media screen and (min-width: 45rem) {
  body.has-overlay .misc {
    padding: 2rem 1.4rem; }

  .scrolltop {
    height: 90px;
    width: 90px; } }
@media screen and (min-width: 60rem) {
  .studio {
    padding: 4rem 0rem 3rem 3rem; }

  .studio .typo-large {
    font-size: 1.15rem; }

  .column.studio-address {
    width: 18%; }

  .column.studio-contact {
    width: 26%; }

  .column.studio-internship {
    width: 28%; }

  .column.studio-alert {
    width: 20%;
    color: #fff; }

  .misc {
    display: flex;
    justify-content: space-between;
    align-content: center;
    padding: 2.5rem 5rem 1.8rem 3rem; }

  .social {
    display: block;
    text-align: left; }

  .social a {
    margin: 0 1.5rem 0 0; }

  .copyright {
    padding: 0 0 0.75rem 0; }

  .scrolltop {
    height: 80px;
    width: 80px; } }
@media screen and (min-width: 70rem) {
  .scrolltop {
    display: none; }

  .studio {
    padding: 4rem 5rem 3rem 3rem; }

  .studio .typo-large {
    font-size: 1.5rem; }

  .social {
    text-align: center; }

  .social a {
    margin: 0 0.6rem; }

  .copyright a {
    margin-left: 1.5rem; }

  .studio a {
    border-bottom: 1px solid black;
    padding-bottom: 8px;
    transition: all 0.2s ease; }

  .studio a.tel {
    border-bottom: none; }

  .studio a:hover {
    border-bottom: 1px solid #eeeeee; }

  .studio a.tel:hover {
    border-bottom: none; }

  .misc a {
    border-bottom: 1px solid #ff0000;
    padding-bottom: 2px;
    transition: all 0.2s ease; }

  .misc a:hover {
    border-bottom: 1px solid #920000; } }
@media screen and (min-width: 100rem) {
  .studio {
    padding: 4rem 14rem 3rem 3rem; }

  .studio .typo-large {
    font-size: 1.75rem; }

  .misc {
    padding: 3rem 3rem 2.3rem; } }
/* Header */
.header {
  position: relative;
  background: #000;
  height: 5rem; }

.header-title {
  position: relative;
  text-align: center;
  text-transform: uppercase;
  font-size: 1rem;
  letter-spacing: .1em;
  font-family: "Resident Serif Web", Times, serif;
  z-index: 1000; }

.header-title a {
  display: block;
  padding: 1.8rem 1.5rem 1.8rem; }

@media screen and (min-width: 45rem) {
  .header {
    height: 7rem; }

  .header-title {
    margin: 0 10rem;
    font-size: 1.1rem; }

  .header-title a {
    padding: 2.7rem 1.5rem 2.7rem; } }
@media screen and (min-width: 60rem) {
  .header {
    height: 6rem; }

  .header-title {
    margin: 0 20rem;
    font-size: 1.1rem; }

  .header-title a {
    padding: 2.3rem 1.5rem; }

  body.has-open-submenu .header {
    background: red;
    color: #000; }

  body.has-open-submenu .menu {
    color: #000; }

  body.has-open-submenu .menu a:before {
    background-image: url(../images/menu_dot_black.svg); } }
@media screen and (min-width: 70rem) {
  .header-title a {
    display: inline-block;
    padding: 2.2rem 0; } }
@media screen and (min-width: 100rem) {
  .header {
    height: 7rem; }

  .header-title {
    font-size: 1.2rem; }

  .header-title a {
    padding: 2.7rem 0; } }
@media screen and (max-width: 60rem) {
  /* Mobile Header with open menu */
  body.has-overlay {
    overflow: auto;
    height: 100%; }

  body.has-overlay .header {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    font-family: sans-serif;
    background: red;
    height: auto;
    color: #000;
    z-index: 1000; }

  body.has-overlay .scrolltop {
    display: none; } }
.menu-toggle {
  position: absolute;
  content: "";
  top: 0;
  width: 4rem;
  height: 5.15rem;
  bottom: 0;
  margin-top: -2px;
  background: url(../images/menu_dot_white.svg) no-repeat center center;
  background-size: 16px 16px;
  text-indent: -6000px;
  z-index: 1000; }

.menu address {
  font-style: normal; }

body.has-overlay .menu-toggle {
  background-image: url(../images/menu_x_black.svg); }

body.has-overlay .menu address .typo-medium,
body.has-overlay .menu address a {
  font-size: .9rem;
  letter-spacing: 0.03rem;
  font-family: "AvenirLTStd-Roman", "Helvetica Neue", Helvetica, Arial, sans-serif; }

body.has-overlay .menu address {
  margin-bottom: 2rem; }

body.has-overlay .menu a {
  font-size: 3.5rem; }

body.has-overlay .menu {
  position: absolute;
  top: 0rem;
  left: 0;
  right: 0;
  bottom: 0rem;
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: center; }

body.has-overlay .menu ul {
  display: flex;
  height: 40%;
  max-height: 22rem;
  margin-bottom: 2rem;
  flex-direction: column;
  justify-content: center;
  flex-wrap: nowrap; }

body.has-overlay .menu li {
  list-style-type: none;
  margin-bottom: 0rem; }

body.has-overlay .menu li a:before {
  display: none; }

body.has-overlay .menu a {
  font-family: "Resident Serif Web", Times, serif;
  padding: 0; }

body.has-overlay .copyright {
  display: none; }

body.has-overlay .social {
  display: block; }

.bullet {
  display: inline-block;
  height: 9px;
  width: 8px;
  background: url(../images/menu_dot_black.svg) no-repeat center center;
  background-size: 4px 4px; }

body.has-overlay .header-title {
  display: none; }

@media screen and (min-width: 30rem) {
  .menu-toggle {
    width: 7rem; }

  body.has-overlay .menu ul {
    display: flex;
    height: 40%;
    max-height: 22rem;
    width: 20rem;
    padding: 0rem;
    margin: 0rem auto;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap; }

  body.has-overlay .menu li {
    margin-bottom: 1.8rem; }

  body.has-overlay .menu a {
    font-size: 2.8rem; }

  body.has-overlay .menu address .typo-medium,
  body.has-overlay .menu address a {
    font-size: 0.8rem; } }
@media screen and (min-width: 45rem) {
  .menu-toggle {
    width: 7rem;
    height: 7rem;
    background-size: 18px 18px; }

  body.has-overlay .header-title {
    display: block; }

  body.has-overlay .menu {
    top: 5rem; }

  body.has-overlay .menu ul {
    height: 80%;
    max-height: 25rem;
    margin-bottom: 0rem;
    justify-content: start; }

  body.has-overlay .menu a {
    font-size: 5rem; }

  body.has-overlay .menu address .typo-medium,
  body.has-overlay .menu address a {
    font-size: 1.1rem; }

  .bullet {
    display: inline-block;
    height: 13px;
    width: 13px;
    background: url(../images/menu_dot_black.svg) no-repeat center center;
    background-size: 5px 5px; } }
@media screen and (max-width: 60rem) {
  .menu {
    display: none; } }
@media screen and (min-width: 60rem) {
  .menu-toggle {
    display: none; }

  .menu, body.has-overlay .menu {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    color: #fff;
    transition: color .3s;
    padding-left: 1.5rem;
    font-family: "AvenirLTStd-Light", "Helvetica Neue", Helvetica, Arial, sans-serif;
    letter-spacing: 0.03rem;
    z-index: 100; }

  body.has-overlay .menu ul {
    height: auto;
    width: auto;
    max-height: 25rem;
    margin: 0rem;
    justify-content: start;
    display: block; }

  body.has-overlay .menu li {
    margin: 0rem;
    padding: 2.5rem 1.5rem 2.5rem 1.2rem; }

  body.has-overlay .menu a {
    float: left;
    list-style: none;
    font-size: 1rem;
    line-height: 1;
    font-family: "AvenirLTStd-Light", "Helvetica Neue", Helvetica, Arial, sans-serif;
    letter-spacing: 0.03rem;
    padding: 0rem; }

  .menu > ul > li {
    float: left;
    list-style: none;
    font-size: 1rem;
    padding: 2.5rem 1.5rem 2.5rem 1.2rem;
    line-height: 1; }

  .menu a {
    position: relative; }

  .menu .active:before {
    position: absolute;
    content: "";
    left: -1rem;
    top: 50%;
    margin-top: -4px;
    width: 6px;
    height: 6px;
    background: url(../images/menu_dot_white.svg) no-repeat center center; }

  body.over .menu .active:before {
    background: url(../images/menu_dot_black.svg) no-repeat center center; }

  body.over .menu a:hover:before {
    display: none; }

  .menu .on-mobile {
    display: none; } }
@media screen and (min-width: 70rem) {
  .menu a:hover:before {
    position: absolute;
    content: "";
    left: -1rem;
    top: 50%;
    margin-top: -4px;
    width: 6px;
    height: 6px;
    background: url(../images/menu_dot_white.svg) no-repeat center center; } }
@media screen and (min-width: 100rem) {
  .menu > ul > li {
    font-size: 1.25rem;
    padding: 2.9rem 1.5rem; } }
body.over .menu a.active:hover:before,
body.over .menu.active:before {
  display: inline-block;
  position: absolute;
  content: "";
  left: -1rem;
  top: 50%;
  margin-top: -4px;
  width: 6px;
  height: 6px;
  background: url(../images/menu_dot_black.svg) no-repeat center center; }

.categories {
  line-height: 1.7em;
  padding-top: 1.5rem;
  text-align: center;
  margin: 0 auto 3rem;
  max-width: 35rem; }

.categories li {
  line-height: 1;
  margin-bottom: 0;
  list-style: none;
  display: inline-block;
  padding: 0 0.8rem 0.5rem; }

.categories a {
  position: relative;
  display: inline-block; }

.categories .typo-large {
  font-size: 1.2rem; }

.categories a:hover:before {
  display: none; }

.categories .active:before {
  display: inline-block;
  position: absolute;
  content: "\2022";
  left: -1rem; }

@media screen and (min-width: 70rem) {
  .categories {
    max-width: 42rem;
    transition: all .3s; }

  .categories li {
    padding: 0 1rem 1rem; }

  .categories a:hover:before,
  .categories .active:before {
    display: inline-block;
    position: absolute;
    content: "\2022";
    left: -1.2rem; }

  .categories .typo-large {
    font-size: 1.5rem; } }
.projects-wrapper {
  overflow: hidden;
  padding-bottom: 4.5rem; }

.project {
  position: relative;
  vertical-align: top;
  width: 100%; }

.project a {
  display: block;
  overflow: hidden; }

.project-image {
  position: relative;
  padding-bottom: 100%;
  width: 100%; }

.project-image img {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover; }

.project-info {
  padding: 0.9rem 1.5rem 2.1rem;
  line-height: 1.4em;
  font-family: "AvenirLTStd-Roman", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 0.7rem;
  letter-spacing: 0.03rem; }

@media screen and (min-width: 30rem) {
  .project {
    position: relative;
    vertical-align: top;
    width: 49%;
    display: inline-block; }

  .projects-wrapper {
    padding-left: 0.5rem; } }
@media screen and (min-width: 45rem) {
  .projects-wrapper {
    padding-left: 0rem; }

  .project {
    position: relative;
    vertical-align: top;
    width: auto;
    display: inline-block;
    width: 19%; }

  .project-info {
    padding: 0.9rem 1.5rem 2.1rem;
    line-height: 1.4em;
    font-size: 0.8rem;
    letter-spacing: 0.03rem; } }
@media screen and (min-width: 70rem) {
  .project-info {
    font-size: 0.9rem; } }
@supports (display: grid) {
  @media screen and (min-width: 45rem) {
    /* Projects */
    .projects:not(.projects-list) {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      grid-template-rows: auto;
      grid-column-gap: 10px;
      grid-row-gap: 10px; }
      .projects:not(.projects-list) .project {
        overflow: hidden;
        width: auto; }
      .projects:not(.projects-list) .projects-wrapper {
        padding-bottom: 6rem; }
      .projects:not(.projects-list) .project a {
        padding-bottom: 66.66%; }
      .projects:not(.projects-list) .project-image {
        position: static;
        padding-bottom: 0; }
      .projects:not(.projects-list) .project-info {
        position: absolute;
        top: 0;
        right: 0;
        height: 100%;
        left: 0;
        background: #000;
        z-index: 1;
        padding: 3rem;
        opacity: 0;
        transition: opacity .3s;
        font-family: "AvenirLTStd-Light", "Helvetica Neue", Helvetica, Arial, sans-serif;
        font-size: 1.75rem;
        line-height: 1.2em; }
      .projects:not(.projects-list) .project:hover .project-info {
        opacity: 0;
        display: none; }
      .projects:not(.projects-list) .project[data-size="1x2"] {
        position: relative;
        grid-column: span 1;
        grid-row: span 2; }
      .projects:not(.projects-list) .project[data-size="1x2"] a {
        padding-bottom: 133.33334%; }
      .projects:not(.projects-list) .project[data-size="2x2"] {
        grid-column: span 2;
        grid-row: span 2; }
      .projects:not(.projects-list) .project[data-size="2x4"] {
        grid-column: span 2;
        grid-row: span 4; }
      .projects:not(.projects-list) .project[data-size="3x3"] {
        grid-column: span 3;
        grid-row: span 3; }
      .projects:not(.projects-list) .project[data-size="2x2"] a,
      .projects:not(.projects-list) .project[data-size="2x4"] a,
      .projects:not(.projects-list) .project[data-size="3x3"] a {
        height: 100%; } }
  @media screen and (min-width: 60rem) {
    /* Projects */
    .projects:not(.projects-list) .project-info {
      font-size: 1.2rem;
      padding: 2.7rem; } }
  @media screen and (min-width: 70rem) {
    /* Projects */
    .projects:not(.projects-list) .project:hover .project-info {
      opacity: 1;
      display: block; } }
  @media screen and (min-width: 100rem) {
    /* Projects */
    .projects:not(.projects-list) .project-info {
      font-size: 1.5rem;
      padding: 3rem; } }
  @media screen and (min-width: 60rem) {
    .projects:not(.projects-list) {
      grid-template-columns: repeat(6, 1fr); } } }
/* Packery support */
[data-packery] {
  margin: -10px; }

[data-packery] .grid-sizer,
[data-packery] .project {
  width: 16.66%; }

[data-packery] .project-info {
  display: none; }

[data-packery] .project-image {
  position: static;
  padding-bottom: 0; }

[data-packery] .project img {
  border: 10px solid #000; }

[data-packery] .project[data-size="1x2"] {
  width: 16.66%; }

[data-packery] .project[data-size="1x2"] a {
  padding-bottom: 133.32%; }

[data-packery] .project[data-size="2x2"] {
  width: 33.32%; }

[data-packery] .project[data-size="2x2"] a {
  padding-bottom: 66.66%; }

[data-packery] .project[data-size="2x4"] a {
  padding-bottom: 133.32%; }

[data-packery] .project[data-size="2x4"] {
  width: 33.32%; }

[data-packery] .project[data-size="2x4"] a {
  padding-bottom: 133.32%; }

[data-packery] .project[data-size="3x3"] {
  width: 49.98%; }

[data-packery] .project[data-size="3x3"] a {
  padding-bottom: 66.66%; }

.projects-list {
  display: flex;
  flex-wrap: wrap;
  margin-left: -10px; }
  .projects-list .project {
    padding-left: 10px; }
    @media screen and (min-width: 30rem) {
      .projects-list .project {
        width: 50%; } }
    @media screen and (min-width: 45rem) {
      .projects-list .project {
        width: 33.33%; } }
    @media screen and (min-width: 60rem) {
      .projects-list .project {
        width: 25%; } }
    @media screen and (min-width: 70rem) {
      .projects-list .project {
        width: 20%; } }
    @media screen and (min-width: 110rem) {
      .projects-list .project {
        width: 16.666667%; } }
  .projects-list .project-image {
    padding-bottom: 66.66%; }

.headline {
  font-weight: inherit;
  margin-bottom: 0.75rem; }

.bg-red {
  background-color: red;
  color: black; }

.bg-black {
  background-color: black;
  color: white; }

.bg-white {
  background-color: white;
  color: black; }

@media screen and (max-width: 60rem) {
  .bg-mobile-red {
    background-color: red;
    color: black; }

  .bg-mobile-black {
    background-color: black;
    color: white; }

  .bg-mobile-white {
    background-color: white;
    color: black; } }
.align-left {
  text-align: left; }

.align-center {
  text-align: center; }

.align-right {
  text-align: right; }

@media screen and (min-width: 70rem) {
  .header {
    transition: all .3s; }

  body.over .header {
    background: red;
    color: #000; }

  body.over .menu {
    color: #000; }

  body.over .main {
    color: #000; }

  body.over .menu a:before {
    background-image: url(../images/menu_dot_black.svg); }

  body.over .main {
    background: red !important; }

  body.over .nav {
    color: #000; }

  body.over .back {
    background: url(../images/menu_x_black.svg) no-repeat center center;
    background-size: 15px 15px; }

  body.over .nav .dots li {
    background: url(../images/menu_dot_black.svg) no-repeat center; }

  body.over .nav .dots li[hidden] {
    opacity: 0;
    width: 0;
    height: 0;
    margin: 0; } }
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box; }

html {
  width: 100%;
  overflow-x: hidden;
  -webkit-text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }

body {
  background: red;
  color: #fff;
  font-family: "AvenirLTStd-Light", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 1.25rem; }

body.has-overlay {
  overflow: auto;
  height: 100%; }

a {
  color: inherit;
  text-decoration: none; }

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