html, body { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; text-align: center; font-family: "IBM Plex Serif", serif; font-size: 16px; }

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

* { cursor: none; }

a { text-decoration: none; display: inline-block; color: #000; }

.copy--zindex { z-index: 150; }

.p-none { pointer-events: none; }

header { position: absolute; top: 0; left: 0; right: 0; z-index: 200; text-transform: uppercase; }
header nav { font-family: Arial; letter-spacing: 1px; padding-top: 20px; padding-left: 30px; padding-right: 30px; max-width: 1200px; margin-left: auto; margin-right: auto; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; font-size: 110%; color: #fff; }
@media only screen and (min-width: 1000px) { header nav { display: -webkit-box; display: -ms-flexbox; display: flex; } }
@media only screen and (min-width: 1600px) { header nav { max-width: 1700px; } }
header > a { margin-bottom: 30px; }
header ul { margin: 0; padding: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; padding-top: 40px; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }
@media only screen and (min-width: 400px) { header ul { -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } }
@media only screen and (min-width: 1000px) { header ul { padding-top: 0; } }
header ul li { margin: 0; padding: 0; display: block; font-size: 100%; margin-left: 0; margin-bottom: 10px; margin-left: 10px; margin-right: 10px; }
@media only screen and (min-width: 400px) { header ul li { margin-left: 0; margin-right: 20px; } }
@media only screen and (min-width: 1000px) { header ul li { margin-right: 0; margin-left: 40px; } }

#main { cursor: none; height: 100%; width: 100%; overflow: hidden; background-color: white; color: #1D3557; }

.cursor { position: absolute; width: 30px; height: 30px; top: -50%; left: -50%; margin: -15px 0 0 -15px; border-radius: 50%; border: 2px solid #1D3557; -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-transition: -webkit-transform 0.2s ease-out; transition: -webkit-transform 0.2s ease-out; transition: transform 0.2s ease-out; transition: transform 0.2s ease-out, -webkit-transform 0.2s ease-out; z-index: 1000; pointer-events: none; -webkit-transition: background-color .3s ease, width .3s ease, height .3s ease, margin-left .3s ease, margin-top .3s ease, -webkit-transform .6s ease; transition: background-color .3s ease, width .3s ease, height .3s ease, margin-left .3s ease, margin-top .3s ease, -webkit-transform .6s ease; transition: background-color .3s ease, transform .6s ease, width .3s ease, height .3s ease, margin-left .3s ease, margin-top .3s ease; transition: background-color .3s ease, transform .6s ease, width .3s ease, height .3s ease, margin-left .3s ease, margin-top .3s ease, -webkit-transform .6s ease; }
.cursor.is-moving { -webkit-transform: scale(0.8); transform: scale(0.8); }
.cursor.is-moving.is-active { -webkit-transform: scale(1); transform: scale(1); }
.cursor.is-active { background-color: white; mix-blend-mode: difference; border-color: transparent; width: 100px; height: 100px; margin-left: -50px; margin-top: -50px; -webkit-transform: scale(1); transform: scale(1); }
.cursor:after { content: ""; display: block; border: 2px solid #1D3557; width: 30px; height: 30px; margin-left: -2px; margin-top: -2px; border-radius: 50%; opacity: 0; }
.cursor.is-clicked:after { opacity: 1; -webkit-animation: scale 0.5s 1; animation: scale 0.5s 1; }

@-webkit-keyframes scale { 0% { opacity: 1; }
  100% { opacity: 0; -webkit-transform: scale(3); transform: scale(3); } }
@keyframes scale { 0% { opacity: 1; }
  100% { opacity: 0; -webkit-transform: scale(3); transform: scale(3); } }
.mod-myavailability { text-align: left; max-width: 1200px; margin-left: auto; margin-right: auto; font-size: 30px; width: 100%; }
.mod-myavailability > div { padding: 150px 30px 50px 30px; }
@media only screen and (min-width: 1260px) { .mod-myavailability > div { } }
@media only screen and (min-width: 400px) { .mod-myavailability { font-size: 40px; } }
@media only screen and (min-width: 720px) { .mod-myavailability { font-size: 3vw; } }
@media only screen and (min-width: 1600px) { .mod-myavailability { max-width: 1700px; font-size: 60px; } }
.mod-myavailability p { display: block; max-width: 90%; }
@media only screen and (min-width: 720px) { .mod-myavailability p { max-width: 40%; float: left; } }
.mod-myavailability p:last-child { opacity: 0.3; font-size: 60%; display: block; clear: left; }
.mod-myavailability h3 { padding-top: 1em; font-weight: 700; margin: 0; }
.mod-myavailability strong { display: block; font-weight: 700; }

figure { position: relative; padding: 0; margin: 0; bottom: 0; width: 80%; z-index: 150; float: right; }
@media only screen and (min-width: 720px) { figure { width: 45%; margin-top: -170px; } }
figure a { display: block; color: #000; }
figure p.credits { padding-bottom: 50px; }
figure img { width: 100%; display: block; max-width: 100%; height: auto; -webkit-transition: -webkit-transform 20s ease; transition: -webkit-transform 20s ease; transition: transform 20s ease; transition: transform 20s ease, -webkit-transform 20s ease; }
figure .zoom { overflow: hidden; position: relative; }
figure .zoom:after { content: ""; display: block; background-color: #000; opacity: 0; position: absolute; top: 0; left: 0; width: 100%; height: 100%; -webkit-transition: all .8s ease; transition: all .8s ease; }
figure figcaption { text-align: left; position: absolute; left: 10%; bottom: calc(15% + 70px); z-index: 150; line-height: 1.4; -webkit-transition: all .8s ease; transition: all .8s ease; opacity: 0; z-index: 200; -webkit-transform: translateY(5vh); transform: translateY(5vh); mix-blend-mode: difference; color: #fff; font-weight: 700; font-size: 5vw; }
@media only screen and (min-width: 720px) { figure figcaption { font-size: 3vw; } }
figure:hover .zoom img { -webkit-transform: scale(1.3); transform: scale(1.3); }
figure:hover .zoom:after { opacity: 0.3; }
figure:hover figcaption { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); }

header { -webkit-transform: translateY(-100%); transform: translateY(-100%); -webkit-transition: all 0.5s ease; transition: all 0.5s ease; -webkit-transition-delay: 1.3s; transition-delay: 1.3s; }

.mod-myavailability { opacity: 0; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; }

figure { opacity: 0; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; -webkit-transition-delay: 0.5s; transition-delay: 0.5s; }

.loaded header { -webkit-transform: translateY(0%); transform: translateY(0%); }
.loaded figure { opacity: 1; }
.loaded .mod-myavailability { opacity: 1; }

.mod-bg { position: fixed; left: 0; right: 0; bottom: 0; top: 0; z-index: 1; height: 100%; overflow: hidden; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }
.mod-bg > div { width: 50px; height: 50px; -webkit-box-flex: 0; -ms-flex: 0 0 1; flex: 0 0 1; position: relative; }
.mod-bg > div span { position: absolute; top: 50%; left: 50%; display: block; width: 2px; height: 2px; border-radius: 50%; background-color: #1D3557; -webkit-transition: background-color 3s ease, -webkit-transform 3s ease; transition: background-color 3s ease, -webkit-transform 3s ease; transition: transform 3s ease, background-color 3s ease; transition: transform 3s ease, background-color 3s ease, -webkit-transform 3s ease; transition-delays: 0.5s; }
.mod-bg > div:hover span { -webkit-transition: background-color 3s ease, -webkit-transform 0.4s ease; transition: background-color 3s ease, -webkit-transform 0.4s ease; transition: transform 0.4s ease, background-color 3s ease; transition: transform 0.4s ease, background-color 3s ease, -webkit-transform 0.4s ease; transition-delays: 0s; -webkit-transform: scale(20); transform: scale(20); background-color: #A8DADC; }

.spinner { margin-top: 10px; display: inline-block; margin-left: 20%; width: 40px; height: 40px; border-width: 2px; border-style: solid; border-color: #fff #1D3557 #1D3557; border-radius: 50%; -webkit-animation: spin 1s linear infinite; animation: spin 1s linear infinite; -webkit-box-sizing: border-box; box-sizing: border-box; }

@-webkit-keyframes spin { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } }

@keyframes spin { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } }