@charset "UTF-8";
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline; }

html, body {
  height: 100%; }

article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section {
  display: block; }

ol, ul {
  list-style: none; }

a {
  text-decoration: none; }

html {
  box-sizing: border-box; }

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

@font-face {
  font-family: "Trio Grotesk";
  src: url("/assets/fonts/triogrotesk-medium-v101.eot");
  src: url("/assets/fonts/triogrotesk-medium-v101.eot?#iefix") format("embedded-opentype"), url("/assets/fonts/triogrotesk-medium-v101.woff") format("woff");
  font-style: normal;
  font-weight: normal; }

@font-face {
  font-family: "Trio Grotesk";
  src: url("/assets/fonts/triogrotesk-bold-v101.eot");
  src: url("/assets/fonts/triogrotesk-bold-v101.eot?#iefix") format("embedded-opentype"), url("/assets/fonts/triogrotesk-bold-v101.woff") format("woff");
  font-style: normal;
  font-weight: bold; }

* {
  ‑webkit‑text‑size‑adjust: 100%; }

html, body {
  height: 100%; }

html {
  font-family: 'Trio Grotesk', Helvetica, Arial, sans-serif;
  font-weight: normal;
  font-style: normal;
  font-size: 15px;
  background: #ffe2ce;
  -webkit-transition: background-color 0.2s ease-out;
  -moz-transition: background-color 0.2s ease-out;
  transition: background-color 0.2s ease-out; }
  html[color="pink"] {
    background-color: #ff79c8; }
  html[color="red"] {
    background-color: #ff7682; }
  html[color="orange"] {
    background-color: #ffb67d; }
  html[color="yellow"] {
    background-color: #ffff96; }
  html[color="green"] {
    background-color: #66cca5; }
  html[color="blue"] {
    background-color: #7db7fa; }
  html[color="purple"] {
    background-color: #bb9be0; }
  html[color="grey"] {
    background-color: #aeaeae; }

/* Navigation */
.bttn-big {
  display: inline-block;
  padding: 0 0.6em;
  border: 3px solid black;
  text-transform: uppercase;
  line-height: 1.95;
  background: #ffe2ce;
  font-family: 'Trio Grotesk', Helvetica, Arial, sans-serif;
  font-weight: bold;
  font-style: normal; }

.main-nav {
  position: fixed;
  top: 2.33em;
  left: 2.33em;
  right: 2.33em;
  text-align: right;
  z-index: 1000;
  color: black;
  /*.logout {
		position: absolute;
		top: 0;
		right: 0;
	}*/ }
  @media (max-width: 750px) {
    .main-nav {
      top: 1.5em;
      left: 10%;
      right: 10%; }
      .main-nav > * {
        display: none !important; }
        .main-nav > *:first-child {
          display: block !important; }
      .main-nav.is-mobile-open > * {
        display: block !important; } }
  .main-nav:after {
    display: none;
    content: '＋';
    position: absolute;
    top: 2px;
    right: 0.6em;
    font-size: 1em;
    line-height: 1.95;
    font-family: 'Trio Grotesk', Helvetica, Arial, sans-serif;
    font-weight: bold;
    font-style: normal;
    -webkit-transition-property: -webkit-transform;
    -moz-transition-property: -moz-transform;
    transition-property: transform;
    -webkit-transition-duration: 0.15s;
    -moz-transition-duration: 0.15s;
    transition-duration: 0.15s;
    -webkit-transition-timing-function: ease-out;
    -moz-transition-timing-function: ease-out;
    transition-timing-function: ease-out; }
    @media (max-width: 750px) {
      .main-nav:after {
        display: block; } }
  .main-nav.is-mobile-open:after {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg); }
  .main-nav .main-logo {
    position: absolute;
    top: 0;
    left: 0;
    background: #ffe2ce;
    -webkit-animation: none;
    -moz-animation: none;
    animation: none; }
    @media (max-width: 750px) {
      .main-nav .main-logo {
        position: relative; } }
    .main-nav .main-logo:hover {
      background: #ffe2ce;
      background: linear-gradient(135deg, #ff20a3 0%, #ff20a3 6%, #ff1b2e 10%, #ffff50 20%, #2787f6 30%, #8e59cb 40%, #ff20a3 52.5%, #ff1b2e 60%, #ffff50 70%, #2787f6 80%, #8e59cb 90%, #ff20a3 94%);
      /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
      background-size: 200% 100%;
      -webkit-animation: slideBackgroundHorizontal 3s infinite linear;
      -moz-animation: slideBackgroundHorizontal 3s infinite linear;
      animation: slideBackgroundHorizontal 3s infinite linear; }
    .is-color-transition .main-nav .main-logo {
      background: transparent !important; }
    [color="pink"] .main-nav .main-logo {
      background-color: #ff79c8; }
    [color="red"] .main-nav .main-logo {
      background-color: #ff7682; }
    [color="orange"] .main-nav .main-logo {
      background-color: #ffb67d; }
    [color="yellow"] .main-nav .main-logo {
      background-color: #ffff96; }
    [color="green"] .main-nav .main-logo {
      background-color: #66cca5; }
    [color="blue"] .main-nav .main-logo {
      background-color: #7db7fa; }
    [color="purple"] .main-nav .main-logo {
      background-color: #bb9be0; }
    [color="grey"] .main-nav .main-logo {
      background-color: #aeaeae; }
  .main-nav a {
    color: black; }
  .main-nav .link-category {
    display: block; }
  .main-nav .link {
    display: inline-block;
    text-transform: uppercase;
    line-height: 1.95;
    border: 3px solid black;
    border-right-width: 0;
    padding: 0 0.6em;
    background: #ffe2ce;
    font-family: 'Trio Grotesk', Helvetica, Arial, sans-serif;
    font-weight: bold;
    font-style: normal;
    -webkit-transition: background-color 0.2s ease-out;
    -moz-transition: background-color 0.2s ease-out;
    transition: background-color 0.2s ease-out; }
    @media (max-width: 750px) {
      .main-nav .link {
        display: block;
        width: 100%;
        text-align: left;
        border-top-width: 0;
        border-right-width: 3px; } }
    .is-color-transition .main-nav .link {
      background: transparent !important; }
    [color="pink"] .main-nav .link {
      background-color: #ff79c8; }
    [color="red"] .main-nav .link {
      background-color: #ff7682; }
    [color="orange"] .main-nav .link {
      background-color: #ffb67d; }
    [color="yellow"] .main-nav .link {
      background-color: #ffff96; }
    [color="green"] .main-nav .link {
      background-color: #66cca5; }
    [color="blue"] .main-nav .link {
      background-color: #7db7fa; }
    [color="purple"] .main-nav .link {
      background-color: #bb9be0; }
    [color="grey"] .main-nav .link {
      background-color: #aeaeae; }
    .no-touch .main-nav .link:hover, .main-nav .link.selected {
      color: black;
      background-color: #8e59cb; }
    .main-nav .link:last-child {
      border-right-width: 3px; }
    .main-nav .link span {
      display: inline-block;
      min-width: 1.5em; }
  .no-touch .main-nav .link-info:hover,
  .main-nav .link-info.selected {
    background-color: #ff20a3; }

.main-logo {
  line-height: 1.95; }
  @media (max-width: 750px) {
    .main-logo {
      display: block; } }
  .main-logo span {
    display: inline-block;
    padding: 0 0.6em;
    border: 3px solid black;
    border-left: none;
    text-transform: uppercase;
    font-family: 'Trio Grotesk', Helvetica, Arial, sans-serif;
    font-weight: bold;
    font-style: normal; }
    @media (max-width: 750px) {
      .main-logo span {
        display: block;
        width: 100%;
        text-align: left; } }
    .main-logo span:first-child {
      border-left: 3px solid black; }

.dropdown {
  position: relative;
  display: inline-block;
  width: 225px;
  text-align: left; }
  @media (max-width: 750px) {
    .dropdown {
      width: 100%; } }
  .dropdown a {
    text-transform: uppercase;
    line-height: 1.95;
    border: 3px solid black;
    border-right-width: 0;
    padding: 0 0.6em;
    background: #ffe2ce;
    font-family: 'Trio Grotesk', Helvetica, Arial, sans-serif;
    font-weight: bold;
    font-style: normal;
    -webkit-transition: background-color 0.2s ease-out;
    -moz-transition: background-color 0.2s ease-out;
    transition: background-color 0.2s ease-out; }
    @media (max-width: 750px) {
      .dropdown a {
        border-top-width: 0;
        border-right-width: 3px; } }
    .is-color-transition .dropdown a {
      background: transparent !important; }
    [color="pink"] .dropdown a {
      background-color: #ff79c8; }
    [color="red"] .dropdown a {
      background-color: #ff7682; }
    [color="orange"] .dropdown a {
      background-color: #ffb67d; }
    [color="yellow"] .dropdown a {
      background-color: #ffff96; }
    [color="green"] .dropdown a {
      background-color: #66cca5; }
    [color="blue"] .dropdown a {
      background-color: #7db7fa; }
    [color="purple"] .dropdown a {
      background-color: #bb9be0; }
    [color="grey"] .dropdown a {
      background-color: #aeaeae; }
  .no-touch .dropdown a:hover.color-pink,
  .dropdown a.selected.color-pink {
    background-color: #ff20a3; }
  .no-touch .dropdown a:hover.color-red,
  .dropdown a.selected.color-red {
    background-color: #ff1b2e; }
  .no-touch .dropdown a:hover.color-orange,
  .dropdown a.selected.color-orange {
    background-color: #ff8627; }
  .no-touch .dropdown a:hover.color-yellow,
  .dropdown a.selected.color-yellow {
    background-color: #ffff50; }
  .no-touch .dropdown a:hover.color-green,
  .dropdown a.selected.color-green {
    background-color: #00aa69; }
  .no-touch .dropdown a:hover.color-blue,
  .dropdown a.selected.color-blue {
    background-color: #2787f6; }
  .no-touch .dropdown a:hover.color-purple,
  .dropdown a.selected.color-purple {
    background-color: #8e59cb; }
  .no-touch .dropdown a:hover.color-grey,
  .dropdown a.selected.color-grey {
    background-color: #787878; }

.dropdown-selected > a {
  position: relative; }

.dropdown-selected > a:after {
  content: 'V';
  position: absolute;
  right: 0.6em;
  top: 0; }
  @media (max-width: 750px) {
    .dropdown-selected > a:after {
      display: none; } }

.dropdown-options > a {
  border-top-width: 0;
  border-right-width: 3px; }

.dropdown-options {
  position: absolute;
  top: 100%;
  left: 0;
  width: calc(100% + 3px);
  opacity: 1;
  -webkit-transition: opacity 0.2s ease-out;
  -moz-transition: opacity 0.2s ease-out;
  transition: opacity 0.2s ease-out; }
  @media (max-width: 750px) {
    .dropdown-options {
      position: relative;
      top: 0;
      width: 100%; } }
  .dropdown--closed .dropdown-options {
    opacity: 0;
    visibility: hidden; }
    @media (max-width: 750px) {
      .dropdown--closed .dropdown-options {
        opacity: 1;
        visibility: visible; } }

body {
  font-size: 1rem; }

.colors-list {
  position: fixed;
  top: 50%;
  right: 2.33em;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%); }
  @media (max-width: 900px) {
    .colors-list {
      display: none; } }

.svg-smiley__outline {
  fill: none;
  stroke: #010101;
  stroke-width: 3; }

.svg-smiley__eye {
  fill: #010101; }

.color-link {
  position: relative;
  display: block;
  padding: 5px;
  margin: 0 -5px 0 0;
  font-size: 0; }
  .color-link .svg-smiley {
    display: block; }
  .color-link .svg-smiley__face {
    opacity: 0; }
  .color-link.color-pink .svg-smiley__background {
    fill: #ff20a3; }
  .color-link.color-red .svg-smiley__background {
    fill: #ff1b2e; }
  .color-link.color-orange .svg-smiley__background {
    fill: #ff8627; }
  .color-link.color-yellow .svg-smiley__background {
    fill: #ffff50; }
  .color-link.color-green .svg-smiley__background {
    fill: #00aa69; }
  .color-link.color-blue .svg-smiley__background {
    fill: #2787f6; }
  .color-link.color-purple .svg-smiley__background {
    fill: #8e59cb; }
  .color-link.color-grey .svg-smiley__background {
    fill: #787878; }
  .color-link:hover .svg-smiley__face, .color-link.selected .svg-smiley__face {
    opacity: 1; }

.work-list {
  max-width: 1920px;
  min-height: 100vh;
  margin: 0 auto;
  padding: 6em 4em 3em;
  text-align: center; }
  @media (max-width: 900px) {
    .work-list {
      padding-left: 0;
      padding-right: 0; } }
  @media (max-width: 750px) {
    .work-list {
      padding-top: 4.7em; } }
  .work-list.color-pink .work-list-cover,
  .no-touch .work-list.color-pink .work-list-item:hover {
    background-color: #ff20a3; }
  .work-list.color-red .work-list-cover,
  .no-touch .work-list.color-red .work-list-item:hover {
    background-color: #ff1b2e; }
  .work-list.color-orange .work-list-cover,
  .no-touch .work-list.color-orange .work-list-item:hover {
    background-color: #ff8627; }
  .work-list.color-yellow .work-list-cover,
  .no-touch .work-list.color-yellow .work-list-item:hover {
    background-color: #ffff50; }
  .work-list.color-green .work-list-cover,
  .no-touch .work-list.color-green .work-list-item:hover {
    background-color: #00aa69; }
  .work-list.color-blue .work-list-cover,
  .no-touch .work-list.color-blue .work-list-item:hover {
    background-color: #2787f6; }
  .work-list.color-purple .work-list-cover,
  .no-touch .work-list.color-purple .work-list-item:hover {
    background-color: #8e59cb; }
  .work-list.color-grey .work-list-cover,
  .no-touch .work-list.color-grey .work-list-item:hover {
    background-color: #787878; }

.work-list-item {
  display: inline-block;
  width: 38.9%;
  margin: 4.15%;
  border: 3px solid black;
  vertical-align: middle;
  color: black; }
  @media (max-width: 750px) {
    .work-list-item {
      width: 80%; } }
  .work-list-item.size-m {
    width: 33.33%; }
    @media (max-width: 750px) {
      .work-list-item.size-m {
        width: 67%; } }
  .work-list-item.size-s {
    width: 22.22%; }
    @media (max-width: 750px) {
      .work-list-item.size-s {
        width: 46%; } }
  .work-by-color .work-list-item {
    width: auto;
    -webkit-animation: none;
    -moz-animation: none;
    animation: none; }
  .no-touch .work-by-color .work-list-item.anim-up:hover {
    -webkit-animation: bounce-up-tiny 0.35s infinite linear;
    -moz-animation: bounce-up-tiny 0.35s infinite linear;
    animation: bounce-up-tiny 0.35s infinite linear; }
  .no-touch .work-by-color .work-list-item.anim-sides:hover {
    -webkit-animation: bounce-sides-tiny 0.35s infinite linear;
    -moz-animation: bounce-sides-tiny 0.35s infinite linear;
    animation: bounce-sides-tiny 0.35s infinite linear; }
  .no-touch .work-by-color .work-list-item.anim-rotate:hover {
    -webkit-animation: bounce-rotate-tiny 0.35s infinite linear;
    -moz-animation: bounce-rotate-tiny 0.35s infinite linear;
    animation: bounce-rotate-tiny 0.35s infinite linear; }

.work-list-cover {
  display: block;
  position: relative;
  width: 100%;
  height: 0;
  overflow: hidden; }
  .work-by-color .work-list-cover img {
    width: auto;
    height: 100.2%; }
  .work-list-cover img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100.2%;
    opacity: 0;
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    -webkit-transition: opacity 0.2s ease-out;
    -moz-transition: opacity 0.2s ease-out;
    transition: opacity 0.2s ease-out; }

.work-list-title {
  padding: 0.3em 0.6em 0.5em;
  font-size: 0.8rem;
  border-top: 3px solid black;
  text-align: left;
  font-family: 'Trio Grotesk', Helvetica, Arial, sans-serif;
  font-weight: bold;
  font-style: normal; }

.color-curtain {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1; }
  .color-curtain.color-pink {
    background-color: #ff79c8; }
  .color-curtain.color-red {
    background-color: #ff7682; }
  .color-curtain.color-orange {
    background-color: #ffb67d; }
  .color-curtain.color-yellow {
    background-color: #ffff96; }
  .color-curtain.color-green {
    background-color: #66cca5; }
  .color-curtain.color-blue {
    background-color: #7db7fa; }
  .color-curtain.color-purple {
    background-color: #bb9be0; }
  .color-curtain.color-grey {
    background-color: #aeaeae; }

.work-view {
  padding: 9.3em 7em 0;
  min-height: 100vh; }
  @media (max-width: 900px) {
    .work-view {
      padding-left: 10%;
      padding-right: 10%; } }
  @media (max-width: 750px) {
    .work-view {
      padding-top: 4.7em; } }

.work-view-gallery {
  position: relative;
  padding-bottom: 50px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none; }
  @media (max-width: 750px) {
    .work-view-gallery {
      height: auto !important;
      margin-top: 4.15%;
      padding-bottom: 0; } }

.work-view-gallery-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden; }
  @media (max-width: 750px) {
    .work-view-gallery-wrapper {
      overflow: visible; } }

.work-view-gallery-rail {
  margin: 0 auto;
  height: 100%; }
  @media (max-width: 750px) {
    .work-view-gallery-rail {
      width: 100% !important;
      height: auto; } }

.work-view-image-wrapper {
  float: left;
  margin: 0 0 0 24px; }
  .work-view.color-pink .work-view-image-wrapper {
    background-color: #ff20a3; }
  .work-view.color-red .work-view-image-wrapper {
    background-color: #ff1b2e; }
  .work-view.color-orange .work-view-image-wrapper {
    background-color: #ff8627; }
  .work-view.color-yellow .work-view-image-wrapper {
    background-color: #ffff50; }
  .work-view.color-green .work-view-image-wrapper {
    background-color: #00aa69; }
  .work-view.color-blue .work-view-image-wrapper {
    background-color: #2787f6; }
  .work-view.color-purple .work-view-image-wrapper {
    background-color: #8e59cb; }
  .work-view.color-grey .work-view-image-wrapper {
    background-color: #787878; }
  @media (max-width: 750px) {
    .work-view-image-wrapper {
      width: 100% !important;
      height: auto !important;
      margin: 0 0 24px; } }
  .work-view-image-wrapper:first-child {
    margin-left: 0; }
  .work-view-image-wrapper iframe,
  .work-view-image-wrapper img {
    display: block;
    width: 100%;
    height: 100%;
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    -webkit-transition: opacity 0.25s ease-in-out;
    -moz-transition: opacity 0.25s ease-in-out;
    transition: opacity 0.25s ease-in-out; }
    @media (max-width: 750px) {
      .work-view-image-wrapper iframe,
      .work-view-image-wrapper img {
        height: auto; } }

.work-view-info {
  text-align: center;
  max-width: 50%;
  margin: 0 auto;
  font-size: 0.7em;
  line-height: 1.6;
  padding: 0.167rem 0 3rem; }
  @media (max-width: 900px) {
    .work-view-info {
      max-width: 100%; } }
  .work-view-info h2 {
    font-family: 'Trio Grotesk', Helvetica, Arial, sans-serif;
    font-weight: bold;
    font-style: normal;
    text-transform: uppercase; }

.work-view-gallery-scrollbar {
  position: relative;
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 50px; }
  @media (max-width: 750px) {
    .work-view-gallery-scrollbar {
      display: none; } }
  .work-view-noscroll .work-view-gallery-scrollbar {
    display: none; }
  .work-view-gallery-scrollbar:before {
    position: absolute;
    left: 0;
    top: 50%;
    height: 0;
    width: 0;
    border-bottom: 7px solid transparent;
    border-right: 7px solid black;
    border-top: 7px solid transparent;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%); }
  .work-view-gallery-scrollbar:after {
    position: absolute;
    right: 0;
    top: 50%;
    height: 0;
    width: 0;
    border-bottom: 7px solid transparent;
    border-left: 7px solid black;
    border-top: 7px solid transparent;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%); }
  .work-view-gallery-scrollbar .track {
    position: absolute;
    height: 3px;
    background-color: black;
    top: 50%;
    left: 0;
    right: 0;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%); }
  .work-view-gallery-scrollbar .handle {
    position: absolute;
    left: 0;
    width: 0;
    height: 100%;
    padding: 20px 0;
    cursor: pointer; }
    .work-view-gallery-scrollbar .handle:before {
      content: '';
      display: block;
      width: 100%;
      height: 100%;
      background: black; }

.info-page {
  padding: 10em 7em 6em;
  font-size: 0.934rem;
  line-height: 1.4; }
  @media (max-width: 750px) {
    .info-page {
      padding-top: 5.7em;
      padding-left: 10%;
      padding-right: 10%; } }

.info-grid {
  position: relative;
  width: 83.33333%;
  margin: 0 auto; }
  @media (max-width: 1350px) {
    .info-grid {
      width: 100%; } }

.info-grid-sizer {
  width: 3.33333%;
  height: 0;
  padding-top: 3.33333%; }
  @media (max-width: 1100px) {
    .info-grid-sizer {
      width: 5.55556%;
      padding-top: 5.55556%; } }

.info-box-w-1 {
  width: 3.33333%; }
  @media (max-width: 1100px) {
    .info-box-w-1 {
      width: 27.77778%; } }
  @media (max-width: 750px) {
    .info-box-w-1 {
      width: 100%; } }

.info-box-w-2 {
  width: 6.66667%; }
  @media (max-width: 1100px) {
    .info-box-w-2 {
      width: 27.77778%; } }
  @media (max-width: 750px) {
    .info-box-w-2 {
      width: 100%; } }

.info-box-w-3 {
  width: 10%; }
  @media (max-width: 1100px) {
    .info-box-w-3 {
      width: 27.77778%; } }
  @media (max-width: 750px) {
    .info-box-w-3 {
      width: 100%; } }

.info-box-w-4 {
  width: 13.33333%; }
  @media (max-width: 1100px) {
    .info-box-w-4 {
      width: 27.77778%; } }
  @media (max-width: 750px) {
    .info-box-w-4 {
      width: 100%; } }

.info-box-w-5 {
  width: 16.66667%; }
  @media (max-width: 1100px) {
    .info-box-w-5 {
      width: 27.77778%; } }
  @media (max-width: 750px) {
    .info-box-w-5 {
      width: 100%; } }

.info-box-w-6 {
  width: 20%; }
  @media (max-width: 1100px) {
    .info-box-w-6 {
      width: 27.77778%; } }
  @media (max-width: 750px) {
    .info-box-w-6 {
      width: 100%; } }

.info-box-w-7 {
  width: 23.33333%; }
  @media (max-width: 1100px) {
    .info-box-w-7 {
      width: 47.22222%; } }
  @media (max-width: 750px) {
    .info-box-w-7 {
      width: 100%; } }

.info-box-w-8 {
  width: 26.66667%; }
  @media (max-width: 1100px) {
    .info-box-w-8 {
      width: 47.22222%; } }
  @media (max-width: 750px) {
    .info-box-w-8 {
      width: 100%; } }

.info-box-w-9 {
  width: 30%; }
  @media (max-width: 1100px) {
    .info-box-w-9 {
      width: 47.22222%; } }
  @media (max-width: 750px) {
    .info-box-w-9 {
      width: 100%; } }

.info-box-w-10 {
  width: 33.33333%; }
  @media (max-width: 1100px) {
    .info-box-w-10 {
      width: 47.22222%; } }
  @media (max-width: 750px) {
    .info-box-w-10 {
      width: 100%; } }

.info-box-w-11 {
  width: 36.66667%; }
  @media (max-width: 1100px) {
    .info-box-w-11 {
      width: 47.22222%; } }
  @media (max-width: 750px) {
    .info-box-w-11 {
      width: 100%; } }

.info-box-w-12 {
  width: 40%; }
  @media (max-width: 1100px) {
    .info-box-w-12 {
      width: 47.22222%; } }
  @media (max-width: 750px) {
    .info-box-w-12 {
      width: 100%; } }

.info-box-w-13 {
  width: 43.33333%; }
  @media (max-width: 1100px) {
    .info-box-w-13 {
      width: 47.22222%; } }
  @media (max-width: 750px) {
    .info-box-w-13 {
      width: 100%; } }

.info-box-w-14 {
  width: 46.66667%; }
  @media (max-width: 1100px) {
    .info-box-w-14 {
      width: 47.22222%; } }
  @media (max-width: 750px) {
    .info-box-w-14 {
      width: 100%; } }

.info-box-w-15 {
  width: 50%; }
  @media (max-width: 1100px) {
    .info-box-w-15 {
      width: 47.22222%; } }
  @media (max-width: 750px) {
    .info-box-w-15 {
      width: 100%; } }

.info-box-w-16 {
  width: 53.33333%; }
  @media (max-width: 1100px) {
    .info-box-w-16 {
      width: 47.22222%; } }
  @media (max-width: 750px) {
    .info-box-w-16 {
      width: 100%; } }

.info-box-w-17 {
  width: 56.66667%; }
  @media (max-width: 1100px) {
    .info-box-w-17 {
      width: 47.22222%; } }
  @media (max-width: 750px) {
    .info-box-w-17 {
      width: 100%; } }

.info-box-w-18 {
  width: 60%; }
  @media (max-width: 1100px) {
    .info-box-w-18 {
      width: 47.22222%; } }
  @media (max-width: 750px) {
    .info-box-w-18 {
      width: 100%; } }

.info-box-w-19 {
  width: 63.33333%; }
  @media (max-width: 1100px) {
    .info-box-w-19 {
      width: 47.22222%; } }
  @media (max-width: 750px) {
    .info-box-w-19 {
      width: 100%; } }

.info-box-w-20 {
  width: 66.66667%; }
  @media (max-width: 1100px) {
    .info-box-w-20 {
      width: 47.22222%; } }
  @media (max-width: 750px) {
    .info-box-w-20 {
      width: 100%; } }

.info-box-w-21 {
  width: 70%; }
  @media (max-width: 1100px) {
    .info-box-w-21 {
      width: 47.22222%; } }
  @media (max-width: 750px) {
    .info-box-w-21 {
      width: 100%; } }

.info-box-w-22 {
  width: 73.33333%; }
  @media (max-width: 1100px) {
    .info-box-w-22 {
      width: 47.22222%; } }
  @media (max-width: 750px) {
    .info-box-w-22 {
      width: 100%; } }

.info-box-w-23 {
  width: 76.66667%; }
  @media (max-width: 1100px) {
    .info-box-w-23 {
      width: 47.22222%; } }
  @media (max-width: 750px) {
    .info-box-w-23 {
      width: 100%; } }

.info-box-w-24 {
  width: 80%; }
  @media (max-width: 1100px) {
    .info-box-w-24 {
      width: 47.22222%; } }
  @media (max-width: 750px) {
    .info-box-w-24 {
      width: 100%; } }

.info-box-w-25 {
  width: 83.33333%; }
  @media (max-width: 1100px) {
    .info-box-w-25 {
      width: 47.22222%; } }
  @media (max-width: 750px) {
    .info-box-w-25 {
      width: 100%; } }

.info-box-w-26 {
  width: 86.66667%; }
  @media (max-width: 1100px) {
    .info-box-w-26 {
      width: 47.22222%; } }
  @media (max-width: 750px) {
    .info-box-w-26 {
      width: 100%; } }

.info-box-w-27 {
  width: 90%; }
  @media (max-width: 1100px) {
    .info-box-w-27 {
      width: 47.22222%; } }
  @media (max-width: 750px) {
    .info-box-w-27 {
      width: 100%; } }

.info-box-w-28 {
  width: 93.33333%; }
  @media (max-width: 1100px) {
    .info-box-w-28 {
      width: 47.22222%; } }
  @media (max-width: 750px) {
    .info-box-w-28 {
      width: 100%; } }

.info-box-w-29 {
  width: 96.66667%; }
  @media (max-width: 1100px) {
    .info-box-w-29 {
      width: 47.22222%; } }
  @media (max-width: 750px) {
    .info-box-w-29 {
      width: 100%; } }

.info-box-w-30 {
  width: 100%; }
  @media (max-width: 1100px) {
    .info-box-w-30 {
      width: 47.22222%; } }
  @media (max-width: 750px) {
    .info-box-w-30 {
      width: 100%; } }

.info-box {
  display: block;
  padding: 1.2em 1em 2.22em;
  border: 3px solid black;
  background-color: #ffff50; }
  @media (max-width: 750px) {
    .info-box {
      margin: 4.15% auto; } }
  .info-box.color-pink {
    background-color: #ff20a3; }
  .info-box.color-red {
    background-color: #ff1b2e; }
  .info-box.color-orange {
    background-color: #ff8627; }
  .info-box.color-yellow {
    background-color: #ffff50; }
  .info-box.color-green {
    background-color: #00aa69; }
  .info-box.color-blue {
    background-color: #2787f6; }
  .info-box.color-purple {
    background-color: #8e59cb; }
  .info-box.color-grey {
    background-color: #787878; }
  .info-box h1, .info-box h2 {
    text-transform: uppercase;
    font-family: 'Trio Grotesk', Helvetica, Arial, sans-serif;
    font-weight: bold;
    font-style: normal;
    margin-bottom: 1em; }
  .info-box a {
    color: black; }
  .info-box p {
    margin-bottom: 1em; }
  .info-box p:last-child {
    margin-bottom: 0; }
  .info-box .columns {
    display: block;
    column-count: 2; }
    @media (max-width: 600px) {
      .info-box .columns {
        column-count: 1; } }

.info-box--image {
  border-radius: 50%;
  padding: 0;
  overflow: hidden; }
  @media (max-width: 750px) {
    .info-box--image {
      width: 80%; } }
  .info-box--image > div {
    position: relative;
    width: 100%;
    height: 0;
    padding: 100% 0 0 0;
    background-position: center;
    background-size: cover;
    -webkit-transform: translateZ(0);
    -moz-transform: translateZ(0);
    -ms-transform: translateZ(0);
    -o-transform: translateZ(0);
    transform: translateZ(0); }

.info-stamp {
  position: absolute;
  top: 0;
  right: 0;
  margin-bottom: 40px; }
  @media (max-width: 750px) {
    .info-stamp {
      position: relative;
      margin-bottom: 4.15%; } }

.main-footer {
  padding: 0 1.33rem 2.33rem;
  font-size: 0.8rem;
  text-align: left;
  font-family: 'Trio Grotesk', Helvetica, Arial, sans-serif;
  font-weight: bold;
  font-style: normal; }
  @media (max-width: 650px) {
    .main-footer {
      text-align: center;
      line-height: 2.1; } }
  .main-footer a {
    color: inherit;
    margin: 0 1rem; }

.fun-link {
  display: inline-block;
  white-space: nowrap; }
  .fun-link span {
    display: inline-block;
    -webkit-animation: none;
    -moz-animation: none;
    animation: none; }
  .no-touch .fun-link:hover span:nth-child(4n+1) {
    -webkit-animation: bounce-up 0.75s infinite linear;
    -moz-animation: bounce-up 0.75s infinite linear;
    animation: bounce-up 0.75s infinite linear; }
  .no-touch .fun-link:hover span:nth-child(4n+2) {
    -webkit-animation: bounce-up 0.75s infinite linear 0.1s;
    -moz-animation: bounce-up 0.75s infinite linear 0.1s;
    animation: bounce-up 0.75s infinite linear 0.1s; }
  .no-touch .fun-link:hover span:nth-child(4n+3) {
    -webkit-animation: bounce-up 0.75s infinite linear 0.2s;
    -moz-animation: bounce-up 0.75s infinite linear 0.2s;
    animation: bounce-up 0.75s infinite linear 0.2s; }
  .no-touch .fun-link:hover span:nth-child(4n) {
    -webkit-animation: bounce-up 0.75s infinite linear 0.3s;
    -moz-animation: bounce-up 0.75s infinite linear 0.3s;
    animation: bounce-up 0.75s infinite linear 0.3s; }

@-webkit-keyframes bounce-up {
  0%, 100% {
    -webkit-transform: translateY(0); }
  25% {
    -webkit-transform: translateY(-15%); }
  75% {
    -webkit-transform: translateY(15%); } }

@-moz-keyframes bounce-up {
  0%, 100% {
    -moz-transform: translateY(0); }
  25% {
    -moz-transform: translateY(-15%); }
  75% {
    -moz-transform: translateY(15%); } }

@keyframes bounce-up {
  0%, 100% {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0); }
  25% {
    -webkit-transform: translateY(-15%);
    -moz-transform: translateY(-15%);
    -ms-transform: translateY(-15%);
    -o-transform: translateY(-15%);
    transform: translateY(-15%); }
  75% {
    -webkit-transform: translateY(15%);
    -moz-transform: translateY(15%);
    -ms-transform: translateY(15%);
    -o-transform: translateY(15%);
    transform: translateY(15%); } }

@-webkit-keyframes bounce-up-tiny {
  0%, 100% {
    -webkit-transform: translateY(0); }
  25% {
    -webkit-transform: translateY(-3%); }
  75% {
    -webkit-transform: translateY(3%); } }

@-moz-keyframes bounce-up-tiny {
  0%, 100% {
    -moz-transform: translateY(0); }
  25% {
    -moz-transform: translateY(-3%); }
  75% {
    -moz-transform: translateY(3%); } }

@keyframes bounce-up-tiny {
  0%, 100% {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0); }
  25% {
    -webkit-transform: translateY(-3%);
    -moz-transform: translateY(-3%);
    -ms-transform: translateY(-3%);
    -o-transform: translateY(-3%);
    transform: translateY(-3%); }
  75% {
    -webkit-transform: translateY(3%);
    -moz-transform: translateY(3%);
    -ms-transform: translateY(3%);
    -o-transform: translateY(3%);
    transform: translateY(3%); } }

@-webkit-keyframes bounce-sides-tiny {
  0%, 100% {
    -webkit-transform: translateX(0); }
  25% {
    -webkit-transform: translateX(-3%); }
  75% {
    -webkit-transform: translateX(3%); } }

@-moz-keyframes bounce-sides-tiny {
  0%, 100% {
    -moz-transform: translateX(0); }
  25% {
    -moz-transform: translateX(-3%); }
  75% {
    -moz-transform: translateX(3%); } }

@keyframes bounce-sides-tiny {
  0%, 100% {
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0); }
  25% {
    -webkit-transform: translateX(-3%);
    -moz-transform: translateX(-3%);
    -ms-transform: translateX(-3%);
    -o-transform: translateX(-3%);
    transform: translateX(-3%); }
  75% {
    -webkit-transform: translateX(3%);
    -moz-transform: translateX(3%);
    -ms-transform: translateX(3%);
    -o-transform: translateX(3%);
    transform: translateX(3%); } }

@-webkit-keyframes bounce-rotate-tiny {
  0%, 100% {
    -webkit-transform: rotate(0); }
  25% {
    -webkit-transform: rotate(-5deg); }
  75% {
    -webkit-transform: rotate(5deg); } }

@-moz-keyframes bounce-rotate-tiny {
  0%, 100% {
    -moz-transform: rotate(0); }
  25% {
    -moz-transform: rotate(-5deg); }
  75% {
    -moz-transform: rotate(5deg); } }

@keyframes bounce-rotate-tiny {
  0%, 100% {
    -webkit-transform: rotate(0);
    -moz-transform: rotate(0);
    -ms-transform: rotate(0);
    -o-transform: rotate(0);
    transform: rotate(0); }
  25% {
    -webkit-transform: rotate(-5deg);
    -moz-transform: rotate(-5deg);
    -ms-transform: rotate(-5deg);
    -o-transform: rotate(-5deg);
    transform: rotate(-5deg); }
  75% {
    -webkit-transform: rotate(5deg);
    -moz-transform: rotate(5deg);
    -ms-transform: rotate(5deg);
    -o-transform: rotate(5deg);
    transform: rotate(5deg); } }

@-webkit-keyframes slideBackgroundHorizontal {
  from {
    background-position: 0 0; }
  to {
    background-position: 200% 0; } }

@-moz-keyframes slideBackgroundHorizontal {
  from {
    background-position: 0 0; }
  to {
    background-position: 200% 0; } }

@keyframes slideBackgroundHorizontal {
  from {
    background-position: 0 0; }
  to {
    background-position: 200% 0; } }