body {
  position: relative;
  overflow: hidden;
  background: #333333; }
  body .nav {
    position: absolute;
    top: -40px;
    left: 0;
    width: 100vw;
    text-align: center;
    transition: all ease 0.3s; }
    body .nav button.menu {
      position: absolute;
      top: 50px;
      z-index: 100;
      background: none;
      border: 0;
      outline: 0;
      font-size: 20px;
      color: #333333;
      margin: 0;
      padding: 0;
      transition: all ease 0.3s; }
      @media screen and (max-height: 550px) {
        body .nav button.menu {
          right: 20px; } }
      body .nav button.menu i {
        margin: 0;
        padding: 0; }
    body .nav.nav--open {
      top: 22px; }
      body .nav.nav--open button.menu i {
        transform: rotate(180deg); }
      @media screen and (max-height: 550px) {
        body .nav.nav--open button.menu {
          transform: translateX(-15px); } }
    body .nav .nav__list-main {
      padding: 0;
      margin: 0; }
      body .nav .nav__list-main .nav__list-main__bullet {
        padding: 0 10px; }
      body .nav .nav__list-main li {
        display: inline-block;
        list-style-type: none;
        color: #ffffff; }
        body .nav .nav__list-main li.nav__list-main__list-item-active a {
          color: #15c75c; }
        body .nav .nav__list-main li a {
          font-size: 24px;
          line-height: 18px; }
          body .nav .nav__list-main li a :hover {
            color: #15c75c; }
        body .nav .nav__list-main li i {
          font-size: 18px;
          padding: 0 8px 0; }
        body .nav .nav__list-main li span {
          color: #ffffff;
          text-decoration: none;
          font-size: 18px;
          font-family: 'Bree Serif', serif;
          display: block; }
        body .nav .nav__list-main li a {
          color: #ffffff;
          text-decoration: none;
          font-size: 18px;
          font-family: 'Bree Serif', serif; }
          body .nav .nav__list-main li a:hover {
            color: #00a341; }
        body .nav .nav__list-main li ul.nav__list-sub {
          margin: 30px 0 0 20px;
          padding: 0 0 0 0; }
          body .nav .nav__list-main li ul.nav__list-sub.nav__list-sub--closed {
            display: none; }
          body .nav .nav__list-main li ul.nav__list-sub.nav__list-sub--open {
            display: block; }
          body .nav .nav__list-main li ul.nav__list-sub li:last-child {
            padding: 0; }
  body .layout {
    position: relative;
    overflow-x: hidden;
    width: 100vw;
    height: 100vh;
    margin: 0 auto;
    transition: all 0.3s;
    background: -moz-linear-gradient(top, #999999 0%, #dcdcdc 48%);
    background: -webkit-linear-gradient(top, #999999 0%, #dcdcdc 48%);
    background: linear-gradient(to bottom, #999999 0%, #dcdcdc 48%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr= '#999999', endColorstr='#dcdcdc',GradientType=0 );
    background-attachment: fixed; }
    body .layout.layout--nav-open {
      animation: layout--nav-open--transition-in 0.3s;
      animation-fill-mode: forwards; }

@keyframes layout--nav-open--transition-in {
  from {
    transform: translateY(0) scale(1);
    border-radius: 0px; }
  to {
    transform: translateY(40px) scale(0.95);
    border-radius: 10px; } }
    body .layout.layout--nav-closed {
      animation: layout--nav-closed--transition-out 0.3s;
      animation-fill-mode: forwards; }

@keyframes layout--nav-closed--transition-out {
  from {
    transform: translateY(50px) scale(0.95);
    border-radius: 10px; }
  to {
    transform: translateY(0) scale(1);
    border-radius: 0px; } }
    body .layout #content-container.content-container--nav-open {
      transform: translate(-300px, 0); }
    body .layout #content-container.content-container {
      position: absolute;
      top: 0;
      left: 0;
      height: 100vh;
      width: 100vw;
      transition: all 0.3s; }
      body .layout #content-container.content-container .content-container__home {
        position: absolute;
        top: 0;
        left: 0;
        width: 100vw;
        height: 100vh; }
        body .layout #content-container.content-container .content-container__home .content-container__home__title {
          position: absolute;
          top: 50%;
          left: 50%;
          transform: translate(-50%, -50%); }
          body .layout #content-container.content-container .content-container__home .content-container__home__title .content-container__home__title__name {
            font-family: 'Bree Serif', serif;
            font-size: 72px;
            font-weight: normal;
            text-align: center;
            line-height: 65px;
            margin: 0 0 15px;
            padding: 0; }
          body .layout #content-container.content-container .content-container__home .content-container__home__title .content-container__home__title__description {
            font-family: 'Roboto', sans-serif;
            font-weight: 900;
            font-size: 18px;
            text-align: center;
            margin: 0 0 29px;
            padding: 0; }
          body .layout #content-container.content-container .content-container__home .content-container__home__title .content-container__home__title--text-shadow--size-8 {
            text-shadow: 0 8px 0 rgba(150, 150, 150, 0.35); }
          body .layout #content-container.content-container .content-container__home .content-container__home__title .content-container__home__title--text-shadow--size-3 {
            text-shadow: 0 3px 0 rgba(150, 150, 150, 0.35); }
    body .layout #content-container.home .btn {
      -webkit-border-radius: 10px;
      -moz-border-radius: 10px;
      border-radius: 10px;
      display: block;
      position: relative;
      top: 0;
      width: 285px;
      height: 57px;
      margin: 0 auto;
      text-decoration: none;
      transition: all 0.3s; }
      body .layout #content-container.home .btn .btn__copy {
        display: block;
        font-family: 'Roboto Slab', serif;
        font-weight: 300;
        font-size: 42px;
        text-align: center;
        color: #ffffff; }
      body .layout #content-container.home .btn--box-shadow {
        -webkit-box-shadow: 0 8px 0 0 rgba(0, 0, 0, 0.15);
        -moz-box-shadow: 0 8px 0 0 rgba(0, 0, 0, 0.15);
        box-shadow: 0 8px 0 0 rgba(0, 0, 0, 0.15); }
        body .layout #content-container.home .btn--box-shadow:hover {
          -webkit-box-shadow: 0 5px 0 0 rgba(0, 0, 0, 0.15);
          -moz-box-shadow: 0 5px 0 0 rgba(0, 0, 0, 0.15);
          box-shadow: 0 5px 0 0 rgba(0, 0, 0, 0.15); }
      body .layout #content-container.home .btn--green {
        background-color: #00a341; }
      body .layout #content-container.home .btn:hover {
        top: 3px; }
    body .layout #content-container.client-container .client-container__toggle {
      position: fixed;
      right: 0;
      top: 50%;
      transform: translate(0, -50%);
      background-color: #ffffff;
      width: 60px;
      height: 60px;
      text-align: center;
      display: none;
      z-index: 10; }
      @media screen and (max-width: 768px) {
        body .layout #content-container.client-container .client-container__toggle {
          width: 30px; } }

@keyframes client-container__toggle--transition-in {
  from {
    opacity: 0; }
  to {
    opacity: 1; } }
      body .layout #content-container.client-container .client-container__toggle.client-container__toggle--transition-in {
        display: block;
        animation: client-container__toggle--transition-in 0.3s; }
      body .layout #content-container.client-container .client-container__toggle.client-container__toggle--transition-out {
        display: none; }
      body .layout #content-container.client-container .client-container__toggle.client-container__toggle-shadow--size-8 {
        -webkit-box-shadow: 0 8px 0 0 rgba(0, 0, 0, 0.1);
        -moz-box-shadow: 0 8px 0 0 rgba(0, 0, 0, 0.1);
        box-shadow: 0 8px 0 0 rgba(0, 0, 0, 0.1); }
      body .layout #content-container.client-container .client-container__toggle.client-container__next {
        right: 0; }
      body .layout #content-container.client-container .client-container__toggle.client-container__prev {
        left: 0; }
      body .layout #content-container.client-container .client-container__toggle .client-container__toggle__arrow {
        position: relative;
        top: 50%;
        transform: translateY(-50%);
        line-height: 8px; }
    body .layout #content-container.client-container .client-container__clients {
      position: absolute;
      width: 100vw;
      height: 100vh;
      display: none; }
      body .layout #content-container.client-container .client-container__clients .client-container__clients__content {
        margin: 60px auto 20px;
        max-width: 80vw;
        width: 1024px;
        text-align: center; }
        body .layout #content-container.client-container .client-container__clients .client-container__clients__content .client-container__clients__content__hero {
          display: block;
          margin: 0 auto;
          max-height: 60vh;
          max-width: 100%; }
          @media screen and (max-width: 600px) {
            body .layout #content-container.client-container .client-container__clients .client-container__clients__content .client-container__clients__content__hero {
              margin: 0 auto 15px; } }
        body .layout #content-container.client-container .client-container__clients .client-container__clients__content .client-container__clients__content__title {
          font-family: 'Bree Serif', serif;
          font-size: 58px;
          font-weight: normal;
          text-transform: uppercase;
          line-height: 60px;
          margin: 0 0 20px; }
          @media screen and (max-width: 667px) {
            body .layout #content-container.client-container .client-container__clients .client-container__clients__content .client-container__clients__content__title {
              font-size: 50px;
              margin: 0 0 20px;
              line-height: 33px;
              text-shadow: 0 3px 0 rgba(150, 150, 150, 0.35); } }
          @media screen and (max-width: 600px) {
            body .layout #content-container.client-container .client-container__clients .client-container__clients__content .client-container__clients__content__title {
              font-size: 31px;
              margin: 0 0 10px;
              line-height: 33px; } }
          body .layout #content-container.client-container .client-container__clients .client-container__clients__content .client-container__clients__content__title.client-container__clients__content__title--shadow-size-8 {
            text-shadow: 0 8px 0 rgba(150, 150, 150, 0.35); }
            @media screen and (max-width: 667px) {
              body .layout #content-container.client-container .client-container__clients .client-container__clients__content .client-container__clients__content__title.client-container__clients__content__title--shadow-size-8 {
                text-shadow: 0 5px 0 rgba(150, 150, 150, 0.35); } }
            @media screen and (max-width: 600px) {
              body .layout #content-container.client-container .client-container__clients .client-container__clients__content .client-container__clients__content__title.client-container__clients__content__title--shadow-size-8 {
                text-shadow: 0 3px 0 rgba(150, 150, 150, 0.35); } }
        body .layout #content-container.client-container .client-container__clients .client-container__clients__content .client-container__clients__content__role {
          font-size: 25px;
          font-family: 'Roboto', serif;
          font-weight: 700;
          text-transform: uppercase;
          color: #00a341;
          line-height: 10px;
          margin: 0 0 25px; }
          @media screen and (max-width: 600px) {
            body .layout #content-container.client-container .client-container__clients .client-container__clients__content .client-container__clients__content__role {
              font-size: 19px;
              margin: 0 0 15px; } }
        body .layout #content-container.client-container .client-container__clients .client-container__clients__content .client-container__clients__content__description {
          white-space: pre-wrap;
          font-size: 15px;
          font-family: 'Roboto', serif;
          line-height: 26px;
          margin: 0 0 25px; }
          @media screen and (max-width: 600px) {
            body .layout #content-container.client-container .client-container__clients .client-container__clients__content .client-container__clients__content__description {
              font-size: 15px; } }
        body .layout #content-container.client-container .client-container__clients .client-container__clients__content .client-container__clients__content__technologies {
          white-space: pre-wrap;
          font-size: 15px;
          font-family: 'Roboto', serif;
          font-weight: 500;
          font-style: italic; }
          @media screen and (max-width: 600px) {
            body .layout #content-container.client-container .client-container__clients .client-container__clients__content .client-container__clients__content__technologies {
              font-size: 15px; } }
        body .layout #content-container.client-container .client-container__clients .client-container__clients__content .client-container__clients__content__attributes {
          display: flex;
          justify-content: space-around;
          flex-wrap: wrap; }
          body .layout #content-container.client-container .client-container__clients .client-container__clients__content .client-container__clients__content__attributes .client-container__clients__content__attributes__container {
            border-radius: 10px;
            padding: 10px 20px;
            margin: 10px;
            -webkit-box-shadow: 0 5px 0 0 rgba(0, 0, 0, 0.15);
            -moz-box-shadow: 0 5px 0 0 rgba(0, 0, 0, 0.15);
            box-shadow: 0 5px 0 0 rgba(0, 0, 0, 0.15);
            flex: 1 1 auto; }
            body .layout #content-container.client-container .client-container__clients .client-container__clients__content .client-container__clients__content__attributes .client-container__clients__content__attributes__container p {
              margin: 0;
              padding: 0;
              color: #ffffff; }
              body .layout #content-container.client-container .client-container__clients .client-container__clients__content .client-container__clients__content__attributes .client-container__clients__content__attributes__container p.client-container__clients__content__attributes__container__desc {
                font-family: 'Roboto Slab', serif;
                font-weight: 700;
                font-size: 15px;
                text-align: left; }
              body .layout #content-container.client-container .client-container__clients .client-container__clients__content .client-container__clients__content__attributes .client-container__clients__content__attributes__container p.client-container__clients__content__attributes__container__copy {
                font-family: 'Roboto', serif;
                font-weight: 300;
                font-size: 15px;
                text-align: left; }
    body .layout #content-container.client-container .client-container__overlay-swipe {
      display: none; }
    body .layout #content-container.contact-container .contact-container__holder {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      width: 80vw;
      max-width: 800px;
      margin: 0 auto; }
      @media screen and (max-width: 649px) {
        body .layout #content-container.contact-container .contact-container__holder {
          transform: translate(-50%, -40%); } }
      @media screen and (max-height: 635px) {
        body .layout #content-container.contact-container .contact-container__holder {
          transform: translate(-50%, -50%); } }
      body .layout #content-container.contact-container .contact-container__holder .contact-container__information {
        display: flex;
        flex-direction: row;
        justify-content: center;
        flex-flow: wrap; }
        body .layout #content-container.contact-container .contact-container__holder .contact-container__information .contact-container__title__name {
          position: absolute;
          top: -100px;
          font-family: 'Bree Serif', serif;
          font-size: 72px;
          font-weight: normal;
          line-height: 65px;
          text-align: center;
          padding: 0;
          margin: 0; }
          @media screen and (max-width: 649px) {
            body .layout #content-container.contact-container .contact-container__holder .contact-container__information .contact-container__title__name {
              top: -85px;
              font-size: 55px; } }
          @media screen and (max-height: 635px) {
            body .layout #content-container.contact-container .contact-container__holder .contact-container__information .contact-container__title__name {
              display: none; } }
          @media screen and (min-width: 1000px) and (max-height: 700px) {
            body .layout #content-container.contact-container .contact-container__holder .contact-container__information .contact-container__title__name {
              display: none; } }
          body .layout #content-container.contact-container .contact-container__holder .contact-container__information .contact-container__title__name.contact-container__title--text-shadow--size-8 {
            text-shadow: 0 8px 0 rgba(150, 150, 150, 0.35); }
        body .layout #content-container.contact-container .contact-container__holder .contact-container__information .contact-container__information__content-container {
          position: relative;
          order: 0;
          flex: 0 1 50%;
          align-self: flex-start;
          min-width: 260px; }
          body .layout #content-container.contact-container .contact-container__holder .contact-container__information .contact-container__information__content-container:before {
            content: '';
            float: left;
            padding-bottom: 100%; }
          @media screen and (max-width: 649px) {
            body .layout #content-container.contact-container .contact-container__holder .contact-container__information .contact-container__information__content-container {
              min-width: 250px; } }
          body .layout #content-container.contact-container .contact-container__holder .contact-container__information .contact-container__information__content-container.contact-container__information__content-container--photo img.contact-container__information__photo {
            width: 100%;
            display: block; }
          body .layout #content-container.contact-container .contact-container__holder .contact-container__information .contact-container__information__content-container.contact-container__information__content-container--text {
            background-color: #111111;
            color: #ffffff; }
          body .layout #content-container.contact-container .contact-container__holder .contact-container__information .contact-container__information__content-container .contact-container__information__content-container__content-items {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            width: 60%; }
            body .layout #content-container.contact-container .contact-container__holder .contact-container__information .contact-container__information__content-container .contact-container__information__content-container__content-items .contact-container__information__content-container__content-item {
              margin: 0 0 20px; }
              @media screen and (max-width: 725px) {
                body .layout #content-container.contact-container .contact-container__holder .contact-container__information .contact-container__information__content-container .contact-container__information__content-container__content-items .contact-container__information__content-container__content-item {
                  margin: 0 0 12px; } }
              body .layout #content-container.contact-container .contact-container__holder .contact-container__information .contact-container__information__content-container .contact-container__information__content-container__content-items .contact-container__information__content-container__content-item .contact-container__information__content-container__content-item--title {
                font-family: 'Bree Serif', serif;
                font-size: 30px;
                line-height: 50px; }
                body .layout #content-container.contact-container .contact-container__holder .contact-container__information .contact-container__information__content-container .contact-container__information__content-container__content-items .contact-container__information__content-container__content-item .contact-container__information__content-container__content-item--title a {
                  color: #FFFFFF;
                  text-decoration: none; }
                  body .layout #content-container.contact-container .contact-container__holder .contact-container__information .contact-container__information__content-container .contact-container__information__content-container__content-items .contact-container__information__content-container__content-item .contact-container__information__content-container__content-item--title a:hover {
                    color: #00a341; }
                  body .layout #content-container.contact-container .contact-container__holder .contact-container__information .contact-container__information__content-container .contact-container__information__content-container__content-items .contact-container__information__content-container__content-item .contact-container__information__content-container__content-item--title a .fa {
                    margin: 0 5px 0 0; }
                @media screen and (max-width: 725px) {
                  body .layout #content-container.contact-container .contact-container__holder .contact-container__information .contact-container__information__content-container .contact-container__information__content-container__content-items .contact-container__information__content-container__content-item .contact-container__information__content-container__content-item--title {
                    font-size: 25px; } }
              body .layout #content-container.contact-container .contact-container__holder .contact-container__information .contact-container__information__content-container .contact-container__information__content-container__content-items .contact-container__information__content-container__content-item .contact-container__information__content-container__content-item--link a {
                font-family: 'Roboto', sans-serif;
                font-weight: 400;
                font-size: 15px;
                color: #00a341; }
                @media screen and (max-width: 725px) {
                  body .layout #content-container.contact-container .contact-container__holder .contact-container__information .contact-container__information__content-container .contact-container__information__content-container__content-items .contact-container__information__content-container__content-item .contact-container__information__content-container__content-item--link a {
                    font-size: 12px; } }
    body .layout .content-container--transition-in--next {
      animation: content-container--transition-in--next 0.3s;
      animation-fill-mode: forwards; }
    body .layout .content-container--transition-out--next {
      animation: content-container--transition-out--next 0.3s;
      animation-fill-mode: forwards; }
    body .layout .content-container--transition-in--prev {
      animation: content-container--transition-in--prev 0.3s;
      animation-fill-mode: forwards; }
    body .layout .content-container--transition-out--prev {
      animation: content-container--transition-out--prev 0.3s;
      animation-fill-mode: forwards; }
    body .layout .content-container--transition-before {
      transform: translate(100vw, 0); }

@keyframes content-container--transition-in--next {
  from {
    transform: translateX(100vw); }
  to {
    transform: translateX(0); } }

@keyframes content-container--transition-out--next {
  from {
    transform: translate(0, 0); }
  to {
    transform: translate(-100vw, 0); } }

@keyframes content-container--transition-in--prev {
  from {
    transform: translateX(-100vw); }
  to {
    transform: translateX(0); } }

@keyframes content-container--transition-out--prev {
  from {
    transform: translate(0, 0); }
  to {
    transform: translate(100vw, 0); } }

html.touch body .layout #content-container.client-container .client-container__toggle {
  display: none; }

html.touch body .layout #content-container.client-container .client-container__overlay-swipe {
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
  background-color: #222222;
  opacity: 1;
  color: #DDDDDD;
  font-size: 25px;
  font-family: 'Roboto', serif;
  font-weight: 500;
  text-transform: uppercase;
  text-align: center;
  padding: 15px 10px;
  max-width: 70vw;
  width: 1024px;
  margin: 0 auto;
  border: solid #DDDDDD  2px;
  -webkit-box-shadow: 0px 2px 10px 2px #323232;
  -moz-box-shadow: 0px 2px 10px 2px #323232;
  box-shadow: 0px 2px 10px 2px #323232;
  z-index: 10;
  animation: client-container__overlay-swipe--transition-in ease 5s;
  animation-fill-mode: both; }
  html.touch body .layout #content-container.client-container .client-container__overlay-swipe span {
    text-shadow: 0px 2px 2px black; }

@keyframes client-container__overlay-swipe--transition-in {
  0% {
    opacity: 0;
    top: 45%; }
  10% {
    opacity: 0;
    top: 45%; }
  20% {
    opacity: 1;
    top: 50%; }
  30% {
    opacity: 1;
    top: 50%; }
  40% {
    opacity: 0;
    top: 55%; }
  100% {
    opacity: 0;
    top: 55%; } }

html.touch body .layout #content-container .projects__list-container .projects__list-container__grid .projects__list-container__grid__cell a .projects__list-container__grid__cell__overlay {
  position: absolute;
  bottom: -1px;
  left: 0;
  background-color: #008CBA;
  overflow: hidden;
  width: 100%;
  height: calc(2.5rem * 1.1);
  opacity: 0.97; }
  html.touch body .layout #content-container .projects__list-container .projects__list-container__grid .projects__list-container__grid__cell a .projects__list-container__grid__cell__overlay .projects__list-container__grid__cell__overlay__copy {
    font-size: 1.15rem; }