* {
  margin: 0;
  box-sizing: border-box; }

html {
  scroll-behavior: smooth; }

body {
  --mw-phone-bp: 640px;
  --mw-parallax-fraction: 0.7;
  -webkit-text-size-adjust: none;
  -moz-text-size-adjust: none;
  text-size-adjust: none;
  background-color: #0c0c0b;
  color: #f9f9f6;
  font-family: myriad-pro, sans-serif;
  font-size: 85%;
  font-style: normal;
  font-weight: 400; }

.size-cap {
  margin-left: auto;
  margin-right: auto;
  min-width: 320px;
  max-width: 1600px; }

h1, h2, h3, h4 {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  cursor: default; }

.caps {
  text-transform: uppercase; }

#loading-screen {
  position: fixed;
  height: 100vh;
  width: 100vw;
  top: 0;
  left: 0;
  z-index: 1000;
  opacity: 0;
  background-color: #1f1f1d;
  -webkit-transition: opacity 0.4s 0.5s;
  -moz-transition: opacity 0.4s 0.5s;
  -o-transition: opacity 0.4s 0.5s;
  transition: opacity 0.4s 0.5s; }
  #loading-screen #bird {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 200px;
    height: 200px; }
  #loading-screen #bird-top {
    -webkit-animation: pick 0.5s cubic-bezier(0.4, 1, 1, 1) infinite alternate;
    animation: pick 0.5s cubic-bezier(0.4, 1, 1, 1) infinite alternate;
    transform-origin: center; }
  #loading-screen #bird-top, #loading-screen #bird-feet {
    fill: #009fe3; }

#loading-screen.loading {
  opacity: 1; }

@-webkit-keyframes pick {
  0% {
    transform: rotate(-30deg); }
  100% {
    transform: rotate(20deg); } }
@keyframes pick {
  0% {
    transform: rotate(-30deg); }
  100% {
    transform: rotate(20deg); } }
main {
  background-color: #1f1f1d; }
  main sup {
    line-height: 1em; }

.tile {
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto; }

.v-center {
  position: relative;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%); }

.square {
  position: relative; }

.square::before {
  content: '';
  display: block;
  width: 100%;
  padding-top: 100%;
  height: 0;
  position: relative; }

.picture, .panorama {
  position: relative;
  overflow: hidden; }
  .picture .canvas, .panorama .canvas {
    position: absolute;
    top: 0;
    left: 50%;
    height: 100%;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%); }
  .picture img, .panorama img {
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover; }
  .picture h1, .picture h2, .picture h3, .picture h4, .panorama h1, .panorama h2, .panorama h3, .panorama h4 {
    position: absolute;
    bottom: 12%;
    color: #f9f9f6;
    font-family: haboro-contrast-normal, sans-serif;
    font-size: 2.8em;
    font-style: normal;
    font-weight: 400;
    width: 100%;
    text-align: center;
    text-shadow: 1px 1px 2px #1f1f1d; }

.picture .canvas {
  width: 100%; }

.picture::before {
  position: relative;
  display: block;
  content: '';
  width: 100%; }

.picture.ratio16to4::before {
  padding-top: 25%; }

.picture.ratio16to5::before {
  padding-top: 31.25%; }

.picture.ratio16to6::before {
  padding-top: 37.5%; }

.picture.ratio16to7::before {
  padding-top: 43.75%; }

.picture.ratio16to8::before {
  padding-top: 50%; }

.picture.ratio16to9::before {
  padding-top: 56.25%; }

.picture.ratio16to10::before {
  padding-top: 62.5%; }

.picture.ratio16to11::before {
  padding-top: 68.75%; }

.picture.ratio16to12::before {
  padding-top: 75%; }

.picture.ratio16to13::before {
  padding-top: 81.25%; }

.picture.ratio16to14::before {
  padding-top: 87.5%; }

.picture.ratio16to15::before {
  padding-top: 93.75%; }

.picture.ratio16to16::before {
  padding-top: 100%; }

.picture.ratio16to17::before {
  padding-top: 106.25%; }

.picture.ratio16to18::before {
  padding-top: 112.5%; }

.picture.ratio16to19::before {
  padding-top: 118.75%; }

.picture.ratio16to20::before {
  padding-top: 125%; }

.picture.ratio16to21::before {
  padding-top: 131.25%; }

.picture.ratio16to22::before {
  padding-top: 137.5%; }

.picture.ratio16to23::before {
  padding-top: 143.75%; }

.picture.ratio16to24::before {
  padding-top: 150%; }

.picture.ratio16to25::before {
  padding-top: 156.25%; }

.picture.ratio16to26::before {
  padding-top: 162.5%; }

.picture.ratio16to27::before {
  padding-top: 168.75%; }

.picture.ratio16to28::before {
  padding-top: 175%; }

.picture.ratio16to29::before {
  padding-top: 181.25%; }

.picture.ratio16to30::before {
  padding-top: 187.5%; }

.picture.ratio16to31::before {
  padding-top: 193.75%; }

.picture.ratio16to32::before {
  padding-top: 200%; }

.picture.ratio16to33::before {
  padding-top: 206.25%; }

.picture.ratio16to34::before {
  padding-top: 212.5%; }

.picture.ratio16to35::before {
  padding-top: 218.75%; }

.picture.ratio16to36::before {
  padding-top: 225%; }

.picture.ratio16to37::before {
  padding-top: 231.25%; }

.picture.ratio16to38::before {
  padding-top: 237.5%; }

.picture.ratio16to39::before {
  padding-top: 243.75%; }

.picture.ratio16to40::before {
  padding-top: 250%; }

.picture.ratio-og img {
  position: relative;
  height: auto; }

.panorama {
  width: 100%;
  height: 600px; }
  .panorama .canvas {
    -webkit-transition: top 0.1s;
    -moz-transition: top 0.1s;
    -o-transition: top 0.1s;
    transition: top 0.1s;
    width: 1600px; }

.panorama.tiny {
  height: 400px; }

.panorama.small {
  height: 500px; }

.panorama.medium {
  height: 600px; }

.panorama.large {
  height: 700px; }

.panorama.huge {
  height: 800px; }

.parallax.picture {
  min-height: 300px;
  max-height: 100vh; }
  .parallax.picture .canvas {
    height: 142.8571428571%; }

.parallax.panorama .canvas {
  height: 142.8571428571%; }

.player svg.playhead {
  z-index: 2;
  position: absolute;
  display: block;
  top: 50%;
  left: 50%;
  width: 80px;
  height: 80px;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%); }
  .player svg.playhead .circle {
    fill: rgba(1, 1, 1, 0.7); }
  .player svg.playhead .triangle {
    fill: white; }
.player img.thumbnail {
  z-index: 1;
  -webkit-transition: opacity 0.8s;
  -moz-transition: opacity 0.8s;
  -o-transition: opacity 0.8s;
  transition: opacity 0.8s; }
.player img.animation {
  opacity: 0;
  -webkit-transition: opacity 0.8s;
  -moz-transition: opacity 0.8s;
  -o-transition: opacity 0.8s;
  transition: opacity 0.8s; }

.player.running svg.playhead {
  display: none; }
.player.running img.thumbnail {
  opacity: 0; }
.player.running img.animation {
  opacity: 1; }

.text {
  align-self: center;
  text-align: left; }
  .text h1, .text h2, .text h3, .text h4 {
    font-family: myriad-pro, sans-serif;
    font-size: 1em;
    font-style: normal;
    font-weight: 700;
    -webkit-hyphens: manual;
    -ms-hyphens: manual;
    hyphens: manual;
    line-height: 1.6;
    color: #009fe3;
    margin-top: 6px;
    margin-bottom: 6px; }
  .text ul {
    list-style: none;
    padding: 0; }
  .text li {
    position: relative;
    padding-left: 2em; }
  .text li::before {
    content: "-";
    position: absolute;
    left: 1em;
    color: #f9f9f6; }
  .text p {
    font-family: myriad-pro, sans-serif;
    font-size: 1em;
    font-style: normal;
    font-weight: 300;
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
    line-height: 1.6;
    color: #c8c8c5; }
  .text .keyword {
    font-family: myriad-pro, sans-serif;
    font-size: 1em;
    font-style: normal;
    font-weight: 700;
    -webkit-hyphens: none;
    -ms-hyphens: none;
    hyphens: none;
    color: #009fe3; }
  .text ul, .text p {
    margin-bottom: 12px; }
  .text :last-child {
    margin-bottom: 0; }
  @media (max-width: 640px), (max-height: 640px) {
    .text h1, .text h2, .text h3, .text h4 {
      margin-bottom: 4px; }
    .text ul, .text p {
      margin-bottom: 10px; }
    .text h1, .text h2, .text h3, .text h4, .text p {
      line-height: 1.5; } }

.text.justified p {
  text-align: justify; }

a.e-mail {
  text-decoration: none;
  color: #c8c8c5; }
  a.e-mail img {
    height: 0.75em;
    width: auto; }
  a.e-mail span::before {
    content: " "; }

@media (hover) {
  a.e-mail:hover {
    color: #009fe3; } }
footer {
  width: 100%;
  background-color: #1f1f1d; }
  footer a#info {
    left: 50%;
    display: inline-block;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
    position: relative;
    font-family: myriad-pro, sans-serif;
    font-size: 1em;
    font-style: normal;
    font-weight: 300;
    color: #009fe3;
    text-decoration: none; }
  footer nav {
    padding-top: 56px;
    padding-right: 14px;
    padding-bottom: 56px;
    padding-left: 14px;
    background-color: #0c0c0b; }
    @media (max-height: 800px), (max-width: 800px) {
      footer nav {
        padding-top: 40px;
        padding-right: 10px;
        padding-bottom: 40px;
        padding-left: 10px; } }
    @media (max-height: 480px), (max-width: 480px) {
      footer nav {
        padding-top: 28px;
        padding-right: 7px;
        padding-bottom: 28px;
        padding-left: 7px; } }

@media (max-width: 640px), (max-height: 640px) {
  main > :not(.full-width, .panorama) {
    margin-left: 56px;
    margin-right: 56px; } }
  @media (max-width: 640px) and (max-height: 800px), (max-height: 640px) and (max-height: 800px), (max-width: 640px) and (max-width: 800px), (max-height: 640px) and (max-width: 800px) {
    main > :not(.full-width, .panorama) {
      margin-left: 40px;
      margin-right: 40px; } }
  @media (max-width: 640px) and (max-height: 480px), (max-height: 640px) and (max-height: 480px), (max-width: 640px) and (max-width: 480px), (max-height: 640px) and (max-width: 480px) {
    main > :not(.full-width, .panorama) {
      margin-left: 28px;
      margin-right: 28px; } }

@media (max-width: 640px), (max-height: 640px) {
  .picture, .panorama {
    font-size: 0.75em; }

  .panorama {
    height: 300px; }
    .panorama .canvas {
      width: 800px; }

  .panorama.tiny {
    height: 200px; }

  .panorama.small {
    height: 250px; }

  .panorama.medium {
    height: 300px; }

  .panorama.large {
    height: 350px; }

  .panorama.huge {
    height: 400px; }

  /*.panorama {
      height: 300px;
      .canvas {
          width: $mw-page-max-width / 2;
      }
  }*/
  /*.parallax {
      font-size: 0.66em;
      height: 300px;
  }
  .parallax.small {
      height: 250px;
  }
  .parallax.big {
      height: 400px;
  }*/ }