/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/
html,
div,
span,
applet,
object,
iframe,
h1,
h2,
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,
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; }

/* HTML5 display-role reset for older browsers */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  display: block; }

body {
  line-height: 1; }

ol,
ul {
  list-style: none; }

blockquote,
q {
  quotes: none; }

blockquote:before,
blockquote:after,
q:before,
q:after {
  content: '';
  content: none; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

/* font imports & definitions */
@font-face {
  font-family: 'ProximaNova-Regular';
  src: url("/css/fonts/ProximaNova-Regular.svg#ProximaNova-Regular") format("svg"), url("/css/fonts/ProximaNova-Regular.eot?#iefix") format("embedded-opentype");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: 'ProximaNova-RegularIt';
  src: url("/css/fonts/ProximaNova-RegularIt.eot");
  src: url("/css/fonts/ProximaNova-RegularIt.woff2") format("woff2"), url("/css/fonts/ProximaNova-RegularIt.woff") format("woff"), url("/css/fonts/ProximaNova-RegularIt.ttf") format("truetype"), url("/css/fonts/ProximaNova-RegularIt.svg#ProximaNova-RegularIt") format("svg"), url("/css/fonts/ProximaNova-RegularIt.eot?#iefix") format("embedded-opentype");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: 'ProximaNova-Bold';
  src: url("/css/fonts/ProximaNova-Bold.eot");
  src: url("/css/fonts/ProximaNova-Bold.svg#ProximaNova-Bold") format("svg"), url("/css/fonts/ProximaNova-Bold.eot?#iefix") format("embedded-opentype");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: 'ProximaNova-Light';
  src: url("/css/fonts/ProximaNova-Light.eot");
  src: url("/css/fonts/ProximaNova-Light.svg#ProximaNova-Light") format("svg"), url("/css/fonts/ProximaNova-Light.eot?#iefix") format("embedded-opentype");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: 'Bebas';
  src: url("/css/fonts/BEBAS___.eot");
  src: url("/css/fonts/BEBAS___.woff") format("woff"), url("/css/fonts/BEBAS___.ttf") format("truetype"), url("/css/fonts/BEBAS___.svg#Bebas") format("svg"), url("/css/fonts/BEBAS___.otf?#iefix") format("embedded-opentype");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: 'Kapra';
  src: url("/css/fonts/Kapra-Regular.eot");
  src: url("/css/fonts/Kapra-Regular.svg#Kapra") format("svg"), url("/css/fonts/Kapra-Regular.otf?#iefix") format("embedded-opentype");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: 'Slick';
  src: url("/css/fonts/slick.eot");
  src: url("/css/fonts/slick.woff") format("woff"), url("/css/fonts/slick.ttf") format("truetype"), url("/css/fonts/slick.svg#slick") format("svg");
  font-weight: normal;
  font-style: normal; }

/* RCCL Variables */
.typography {
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }

.heroheader {
  font-family: Kapra, "Open Sans", sans-serif;
  text-transform: uppercase; }
  @media only all and (min-width: 1920px) {
    .heroheader {
      font-size: 7rem; } }
  @media only all and (min-width: 1441px) and (max-width: 1919px) {
    .heroheader {
      font-size: 6rem; } }
  @media only all and (min-width: 1025px) and (max-width: 1440px) {
    .heroheader {
      font-size: 6rem; } }
  @media only all and (min-width: 769px) and (max-width: 1024px) {
    .heroheader {
      font-size: 5rem; } }
  @media only all and (max-width: 768px) {
    .heroheader {
      font-size: 3rem; } }

.heading1 {
  font-family: Kapra, "Open Sans", sans-serif;
  text-transform: uppercase; }
  @media only all and (min-width: 1441px) {
    .heading1 {
      font-size: 4rem; } }
  @media only all and (min-width: 1025px) and (max-width: 1440px) {
    .heading1 {
      font-size: 4rem; } }
  @media only all and (min-width: 769px) and (max-width: 1024px) {
    .heading1 {
      font-size: 4rem; } }
  @media only all and (max-width: 768px) {
    .heading1 {
      font-size: 2.625rem; } }

.heading2 {
  font-family: Kapra, "Open Sans", sans-serif;
  text-transform: uppercase; }
  @media only all and (min-width: 1441px) {
    .heading2 {
      font-size: 3rem; } }
  @media only all and (min-width: 1025px) and (max-width: 1440px) {
    .heading2 {
      font-size: 3rem; } }
  @media only all and (min-width: 769px) and (max-width: 1024px) {
    .heading2 {
      font-size: 3rem; } }
  @media only all and (max-width: 768px) {
    .heading2 {
      font-size: 2.5rem; } }

.heading3 {
  font-family: Kapra, "Open Sans", sans-serif;
  text-transform: uppercase; }
  @media only all and (min-width: 1441px) {
    .heading3 {
      font-size: 2.625rem; } }
  @media only all and (min-width: 1025px) and (max-width: 1440px) {
    .heading3 {
      font-size: 2.625rem; } }
  @media only all and (min-width: 769px) and (max-width: 1024px) {
    .heading3 {
      font-size: 2.625rem; } }
  @media only all and (max-width: 768px) {
    .heading3 {
      font-size: 2.5rem; } }

.heading4 {
  font-family: Kapra, "Open Sans", sans-serif;
  text-transform: uppercase; }
  @media only all and (min-width: 1441px) {
    .heading4 {
      font-size: 1.75rem; } }
  @media only all and (min-width: 1025px) and (max-width: 1440px) {
    .heading4 {
      font-size: 1.75rem; } }
  @media only all and (min-width: 769px) and (max-width: 1024px) {
    .heading4 {
      font-size: 1.5rem; } }
  @media only all and (max-width: 768px) {
    .heading4 {
      font-size: 1.5rem; } }

.articleTitle {
  font-family: "ProximaNova-Bold", Arial, sans-serif;
  text-transform: uppercase;
  letter-spacing: 2px; }
  @media only all and (min-width: 1441px) {
    .articleTitle {
      font-size: 2rem; } }
  @media only all and (min-width: 1025px) and (max-width: 1440px) {
    .articleTitle {
      font-size: 2rem; } }
  @media only all and (min-width: 769px) and (max-width: 1024px) {
    .articleTitle {
      font-size: 2rem; } }
  @media only all and (max-width: 768px) {
    .articleTitle {
      font-size: 1.375rem; } }

.pullQuote {
  font-family: 'Times New Roman';
  font-style: italic; }
  @media only all and (min-width: 1441px) {
    .pullQuote {
      font-size: 2.25rem; } }
  @media only all and (min-width: 1025px) and (max-width: 1440px) {
    .pullQuote {
      font-size: 2.25rem; } }
  @media only all and (min-width: 769px) and (max-width: 1024px) {
    .pullQuote {
      font-size: 2.25rem; } }
  @media only all and (max-width: 768px) {
    .pullQuote {
      font-size: 2.25rem; } }

.subHeroHeader {
  font-family: "ProximaNova-Regular", Arial, sans-serif;
  letter-spacing: 2px;
  text-transform: uppercase; }
  @media only all and (min-width: 1441px) {
    .subHeroHeader {
      font-size: 2rem; } }
  @media only all and (min-width: 1025px) and (max-width: 1440px) {
    .subHeroHeader {
      font-size: 2rem; } }
  @media only all and (min-width: 769px) and (max-width: 1024px) {
    .subHeroHeader {
      font-size: 1.688rem; } }
  @media only all and (max-width: 768px) {
    .subHeroHeader {
      font-size: 1rem; } }

.titleUnderTiles {
  font-family: "ProximaNova-Bold", Arial, sans-serif;
  letter-spacing: 2px;
  text-transform: uppercase; }
  @media only all and (min-width: 1441px) {
    .titleUnderTiles {
      font-size: 1.375rem; } }
  @media only all and (min-width: 1025px) and (max-width: 1440px) {
    .titleUnderTiles {
      font-size: 1.375rem; } }
  @media only all and (min-width: 769px) and (max-width: 1024px) {
    .titleUnderTiles {
      font-size: 1.375rem; } }
  @media only all and (max-width: 768px) {
    .titleUnderTiles {
      font-size: 1.375rem; } }

.subHeading {
  font-family: "ProximaNova-Regular", Arial, sans-serif;
  letter-spacing: 2px;
  text-transform: uppercase; }
  @media only all and (min-width: 1441px) {
    .subHeading {
      font-size: 1.375rem; } }
  @media only all and (min-width: 1025px) and (max-width: 1440px) {
    .subHeading {
      font-size: 1.375rem; } }
  @media only all and (min-width: 769px) and (max-width: 1024px) {
    .subHeading {
      font-size: 1.375rem; } }
  @media only all and (max-width: 768px) {
    .subHeading {
      font-size: 0.875rem; } }

.introCopy {
  font-family: "ProximaNova-Regular", Arial, sans-serif;
  font-size: 1.5rem;
  line-height: 150%; }
  @media only all and (max-width: 768px) {
    .introCopy {
      font-size: 1.125rem; } }

.detailsText {
  font-family: "ProximaNova-Regular", Arial, sans-serif;
  letter-spacing: 2px;
  text-transform: uppercase; }
  @media only all and (min-width: 1441px) {
    .detailsText {
      font-size: 0.875rem; } }
  @media only all and (min-width: 1025px) and (max-width: 1440px) {
    .detailsText {
      font-size: 0.875rem; } }
  @media only all and (min-width: 769px) and (max-width: 1024px) {
    .detailsText {
      font-size: 0.875rem; } }
  @media only all and (max-width: 768px) {
    .detailsText {
      font-size: 0.75rem; } }

.paragraphCopy {
  font-family: "ProximaNova-Regular", Arial, sans-serif;
  font-size: 1.125rem;
  line-height: 150%; }
  @media only all and (max-width: 768px) {
    .paragraphCopy {
      font-size: 1rem; } }

.paragraphCopy--bold {
  font-family: "ProximaNova-Bold", Arial, sans-serif;
  font-size: 1.125rem;
  line-height: 27px; }
  @media only all and (max-width: 768px) {
    .paragraphCopy--bold {
      font-size: 1rem; } }

.article-item .paragraphCopy {
  font-size: 1rem; }

.articleLinks {
  font-family: "ProximaNova-Bold", Arial, sans-serif;
  font-size: 1.125rem;
  line-height: 120%;
  color: #005edc; }
  @media only all and (max-width: 768px) {
    .articleLinks {
      font-size: 1rem; } }

.hyperlink {
  font-family: "ProximaNova-Regular", Arial, sans-serif;
  letter-spacing: 2px;
  text-transform: uppercase;
  font-size: 0.875rem;
  color: #005edc; }
  .hyperlink__white {
    font-family: "ProximaNova-Regular", Arial, sans-serif;
    letter-spacing: 2px;
    text-transform: uppercase;
    font-size: 0.875rem;
    color: white;
    text-decoration: none; }
  @media only all and (max-width: 768px) {
    .hyperlink {
      font-size: 0.75rem; } }

.inlineHyperlink {
  font-family: "ProximaNova-Regular", Arial, sans-serif;
  text-decoration: underline; }
  .inlineHyperlink__white {
    font-family: "ProximaNova-Regular", Arial, sans-serif;
    text-decoration: underline;
    color: white; }

.rightProtected {
  position: absolute;
  margin-top: 3px;
  margin-left: 5px;
  font-size: 2rem; }
  @media only all and (max-width: 1024px) {
    .rightProtected {
      font-size: 0.85rem; } }

.new-flag-bg {
  color: white;
  background-color: #F20EA7;
  text-align: center;
  text-transform: uppercase;
  padding: 8px 12px;
  margin-bottom: 20px;
  display: inline-block;
  -ms-transform: skewX(-20deg);
  transform: skewX(-20deg); }

.new-flag-text {
  -ms-transform: skewX(20deg);
  transform: skewX(20deg);
  display: inline-block;
  font-size: 1rem; }

.navy-text {
  color: #15264c; }

.white-text {
  color: #ffffff; }

.gray-text {
  color: #4a4a4a; }

.knockOutBtn {
  border: 1px solid white;
  padding: 16px;
  font-family: "ProximaNova-Regular", Arial, sans-serif;
  letter-spacing: 2px;
  text-transform: uppercase;
  font-size: 0.875rem;
  text-align: center;
  display: inline-block;
  text-decoration: none;
  color: white; }
  .knockOutBtn__Tile {
    padding: 8px;
    margin: 0;
    border: 1px solid white;
    font-family: "ProximaNova-Regular", Arial, sans-serif;
    letter-spacing: 2px;
    text-transform: uppercase;
    font-size: 0.875rem;
    text-align: center;
    display: inline-block;
    text-decoration: none;
    color: white; }
  @media only all and (max-width: 768px) {
    .knockOutBtn {
      font-size: 0.75rem;
      margin: 32px 0px; } }

@media (max-width: 768px) {
  .knockOutBtn__Tile {
    font-size: 0.75rem; } }

.mosaicSlider__loadMore {
  border: 1px solid #15264c !important;
  font-family: "ProximaNova-Regular", Arial, sans-serif;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #15264c;
  width: 30%; }

.blueBtn {
  background-color: #005edc;
  padding: .8rem 2rem;
  font-family: "ProximaNova-Regular", Arial, sans-serif;
  letter-spacing: 2px;
  text-transform: uppercase;
  font-size: 0.875rem;
  text-align: center;
  display: inline-block;
  text-decoration: none;
  color: white;
  line-height: 100%; }
  @media only all and (max-width: 768px) {
    .blueBtn {
      font-size: 0.75rem;
      margin: 32px 0px; } }

.goldBtn {
  background-color: #f9c700;
  padding: .8rem 2rem;
  font-family: "ProximaNova-Regular", Arial, sans-serif;
  letter-spacing: 2px;
  text-transform: uppercase;
  font-size: 0.875rem;
  text-align: center;
  display: inline-block;
  text-decoration: none;
  color: #15264c; }
  @media only all and (max-width: 768px) {
    .goldBtn {
      font-size: 0.75rem;
      margin: 8px 0px; } }

.page__parAbove {
  margin: 0;
  display: none; }

#rciHeader, .footer__wrapper {
  display: none; }

.footer__wrapper .footer__rcl, .footer__wrapper #ge_cwc-footer {
  max-width: 100vw !important; 
}

.footer__wrapper-collection {
  background-color: #203559;
  max-width: 100vw; }
  .footer__wrapper-collection .footer__rcl__dislcaimer {
    background-color: #203559;
    color: white; }

header {
  display: none; }

.rcl_universal_footer {
  display: none; }

.page__par {
  display: none; }

.loader-wrapper {
  width: 100%;
  height: 100vh;
  position: fixed;
  top: 0;
  left: 0;
  background-color: #000c28;
  z-index: 999;
  display: -ms-flexbox;
  display: flex;
  -ms-grid-column-align: center;
      justify-items: center;
  -ms-flex-align: center;
      align-items: center;
  transition: 0.4s; }
  .loader-wrapper .loader {
    justify-self: center;
    text-align: center;
    position: absolute;
    top: 50%;
    left: 50%;
    -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%); }
    .loader-wrapper .loader img {
      width: 40%; }

@keyframes shadow-pulse {
  0% {
    box-shadow: 0 0 0 0px rgba(255, 255, 255, 0.2); }
  100% {
    box-shadow: 0 0 0 35px rgba(255, 255, 255, 0); } }

@keyframes shadow-pulse-big {
  0% {
    box-shadow: 0 0 0 0px rgba(0, 0, 0, 0.1); }
  100% {
    box-shadow: 0 0 0 70px transparent; } }
    .loader-wrapper .loader .loading {
      width: 130px;
      height: 130px;
      font: 18px/180px 'Barlow Semi Condensed', sans-serif;
      text-transform: uppercase;
      letter-spacing: 1px;
      color: #fff;
      text-align: center;
      background: rgba(199, 199, 199, 0.295);
      border-radius: 50%;
      animation: shadow-pulse 1s infinite; }

.logo-rccl {
  position: fixed;
  top: 0;
  left: 0; }
  .logo-rccl img {
    width: 200px;
    height: auto; }

.casino-logo {
  width: 580px;
  margin: 1.5rem; }

.hud {
  position: fixed;
  z-index: 20;
  transition: 0.4s; }

.scroll {
  position: fixed;
  bottom: 0;
  left: 50%;
  -ms-transform: translateX(-50%);
      transform: translateX(-50%);
  width: 55px;
  transition: 0.3s; }

#social-collections {
  position: fixed;
  top: 0;
  right: 190px;
  width: 392px;
  transition: 0.3s; }

.social-icons {
  max-height: 25px; }

.sign-up {
  position: fixed;
  top: 0;
  right: 0;
  border-radius: 0;
  background: #fdbb17;
  color: #ffffff;
  cursor: pointer;
  border: 0;
  font-size: 1rem;
  height: 2.9411764706rem;
  line-height: 2.9411764706rem;
  padding: 0 3.1764705882rem;
  transition: 0.3s; }
  .sign-up:focus {
    outline: 0; }
  .sign-up:active {
    -ms-transform: scale(1.05);
        transform: scale(1.05);
    outline: 0; }

.footer-pdiCollection {
  position: fixed;
  bottom: 10px;
  left: 20px; }

nav {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden; }

navitem {
  float: right; }

navitem span {
  line-height: 120%;
  display: block;
  text-align: center;
  padding: 14px 16px; }

navitem a {
  display: block;
  color: white;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none; }

navitem a:hover {
  background-color: rgba(255, 255, 255, 0.1); }

.container-lelepa .heading2 {
  font-size: 6rem; }

.paragraphCopy {
  font-size: 1.5rem; }

.heroFullScreen {
  position: relative;
  height: 100vh;
  display: -ms-flexbox;
  display: flex;
  background-color: #000c28;
  -ms-flex-align: center;
      align-items: center;
  z-index: 0;
  overflow: hidden; }

.FullScreenHeroContent h2.heading1.casinoHeader {
  font-size: 6rem;
}

.heroImageFullScreen img {
  position: absolute;
  height: 120vh;
  width: 100%;
  margin: 0 auto;
  object-fit: cover;
  top: 0;
  z-index: 1; }

.FullScreenHeroContent {
  width: 100%;
  text-align: center;
  display: -ms-flexbox;
  position: absolute;
  z-index: 3;
  -ms-flex: 1 1 0%;
  flex: 1 1 0%;
  -ms-flex-flow: row nowrap;
  flex-flow: row nowrap;
  place-content: stretch center;
  -ms-flex-align: center;
  align-items: center; }

.overlayBlue {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  background-color: rgba(1, 8, 23, 0.6);
  height: 100%;
  width: 100%;
  z-index: 1; }

.containerGlass {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  background-image: linear-gradient(-180deg, transparent 79%, #000c28 94%);
  height: 100%;
  width: 100%;
  z-index: 3; }

.ocean {
  width: 100%;
  position: absolute;
  bottom: 0;
  z-index: 4; }

#oceanshape path.cls-2 {
  fill: #000c28;
  height: 100px;
  z-index: 4; }

.introductionSection {
  position: relative;
  height: auto;
  background-color: #15264c;
  background-size: cover;
  width: 100%;
  color: white;
  text-align: center;
  z-index: 2;
  overflow: hidden; }
  @media screen and (min-width: 1440px) {
    .introductionSection {
      height: 65vh; } }

.introductionContent {
  width: 60%;
  margin: 10rem auto 2rem auto;
  margin-bottom: 10rem;
  z-index: 23; }

[data-scroll] {
  transition: all 1s; }

[data-scroll="in"] {
  opacity: 1;
  -ms-transform: translateY(0);
      transform: translateY(0); }

[data-scroll="out"] {
  opacity: 0;
  -ms-transform: translateY(40px);
      transform: translateY(40px); }

.fadein[data-scroll] {
  transition: all 3s; }

.fadein[data-scroll="in"] {
  opacity: 1; }

.fadein[data-scroll="out"] {
  opacity: 0; }

#growContainer {
  display: none;
  width: 100%;
  height: 70%;
  position: relative;
  margin: 2rem auto;
  overflow: hidden; }

.grow {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  -ms-flex-pack: center;
      justify-content: center;
  height: 100%;
  width: 50%;
  transition: width 400ms;
  position: relative; }
  .grow img {
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0; }
  .grow .growContent {
    position: absolute;
    width: 100%;
    margin: auto;
    text-align: center; }
    .grow .growContent .comingSoonPDI {
      border: none;
      background-color: #FD5689;
      padding: 0.8rem 2rem;
      margin: 1rem;
      font-family: "ProximaNova-Regular", Arial, sans-serif;
      letter-spacing: 2px;
      text-transform: uppercase;
      font-size: 0.875rem;
      text-align: center;
      display: inline-block;
      text-decoration: none;
      color: white; }
    .grow .growContent img {
      width: 30%;
      position: relative; }
  .grow .grow--overlay {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.3); }

#growContainer:hover .grow {
  width: 50%; }

#growContainer:hover .grow:hover {
  width: 90%; }

.perfectDayPDI {
  width: 100%;
  height: 110vh;
  background-image: url("https://www.royalcaribbean.com/content/dam/royal/ports-and-destinations/destinations/perfect-day/assets/cutout/cococay-sky.jpg");
  background-size: cover;
  box-sizing: border-box;
  color: white;
  position: relative;
  z-index: 7; }

#balloon {
  position: absolute;
  right: 25%;
  top: 0;
  width: 320px;
  z-index: 8; }

#dad {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 500px;
  z-index: 9; }

#child {
  position: absolute;
  bottom: -11%;
  right: 25%;
  width: 330px;
  z-index: 1; }

#pair {
  position: absolute;
  bottom: -7%;
  left: 0;
  width: 380px;
  z-index: 2; }

#logoCocoCay {
  position: absolute;
  top: 40%;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 380px;
  z-index: 3; }
  #logoCocoCay img {
    max-width: 100%; }
  #logoCocoCay a {
    left: 0;
    right: 0;
    position: absolute;
    margin: 0 auto;
    text-align: center; }

#cocoCayBtn {
  position: absolute;
  top: 60%;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 150px;
  text-align: center;
  justify-self: center;
  z-index: 4;
  background-color: #005edc;
  font-family: "ProximaNova-Regular", Arial, sans-serif;
  letter-spacing: 2px;
  text-transform: uppercase;
  font-size: 0.875rem;
  text-align: center;
  text-decoration: none;
  color: white;
  padding: .8rem 2rem;
  display: inline-block; }

.section-pdi > div {
  position: relative;
  display: -ms-grid;
  display: grid;
  height: 100vh;
  width: 100%;
  z-index: 10; }

.section-pdi.section--50-25-25 > div {
  -ms-grid-columns: 50% 25% 25%;
      grid-template-columns: 50% 25% 25%;
  overflow: hidden; }

.section-pdi.section--25-25-50 > div {
  -ms-grid-columns: 25% 25% 50%;
      grid-template-columns: 25% 25% 50%;
  overflow: hidden; }

.section-pdi.section--70-30 > div {
  -ms-grid-columns: 70% 30%;
      grid-template-columns: 70% 30%;
  overflow: hidden; }

.lelepaPDI {
  width: 100%;
  height: 100vh;
  background-image: url("https://www.royalcaribbean.com/content/dam/royal/ports-and-destinations/destinations/lelepa/assets/cutout/underwater-sky.jpg");
  background-size: cover;
  box-sizing: border-box;
  color: white;
  position: relative;
  z-index: 9;
  overflow: hidden; }

#underwaterIsland {
  position: absolute;
  width: 100%;
  height: auto;
  top: 20%; }

#underwaterLine {
  position: absolute;
  top: 48%;
  width: 100%; }

#underwaterBigCoral {
  position: absolute;
  top: 55%;
  width: 100%;
  height: auto; }

#underwaterPinkCoral {
  position: absolute;
  bottom: -12%;
  right: 10%;
  width: 880px;
  z-index: 2; }

#underwaterSmallYellowCoral {
  position: absolute;
  bottom: -14%;
  left: 6%;
  width: 500px;
  z-index: 0; }

#underwaterYellowFish {
  position: absolute;
  bottom: 0;
  left: -2%;
  width: 500px;
  z-index: 0; }

#logoLelepa {
  position: absolute;
  top: 41%;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 380px;
  z-index: 3; }
  #logoLelepa img {
    max-width: 100%; }
  #logoLelepa a {
    left: 0;
    right: 0;
    width: 50%;
    position: absolute;
    margin: 0 auto;
    text-align: center; }

#lelepaBtn {
  position: absolute;
  top: 69%;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 150px;
  text-align: center;
  justify-self: center;
  z-index: 4;
  background-color: #005edc;
  font-family: "ProximaNova-Regular", Arial, sans-serif;
  letter-spacing: 2px;
  text-transform: uppercase;
  font-size: 0.875rem;
  text-align: center;
  text-decoration: none;
  color: white;
  padding: .8rem 2rem;
  display: inline-block; }

.imageCoverPDIContainer {
  position: relative;
  width: 100%;
  height: 100%; }

.cover-image {
  height: 40%;
  object-position: center center; }

.imgPDI-bg {
  object-fit: cover;
  width: 100%;
  height: 100%; }

.bg-image {
  background-position: top;
  background-size: auto 100%;
  background-repeat: no-repeat; }

.imgCoverSection {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  -ms-flex-pack: center;
      justify-content: center;
  height: 100%;
  width: 100%;
  position: relative; }
  .imgCoverSection img {
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0; }
  .imgCoverSection video {
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0; }
  .imgCoverSection .content {
    position: absolute;
    width: 90%;
    margin: auto;
    text-align: center; }
    .imgCoverSection .content .heading2 {
      font-size: 6rem; }
  .imgCoverSection .content--overlay {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.4); }

.content-wrapper {
  height: 100vh;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: center;
  justify-content: center;
  text-align: center; }

.video-content-wrapper {
  height: 100%;
  position: absolute;
  top: 40%;
  width: 100%;
  left: 0;
  right: 0;
  margin: auto;
  text-align: center; }

.container-3-sections {
  width: 50%; }

.bg-video {
  position: relative;
  width: 100%;
  height: 100%;
  object-fit: cover; }

.contactForm-container {
  width: 60%;
  margin: 1rem auto; }

.contactForm {
  position: relative;
  height: 100vh;
  background-color: #000c28; }
  .contactForm img.sectionBg {
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0; }

.formSignup__base {
  max-width: 80rem; }

@media (min-width: 64rem) {
  .formSignup__base__submitContainer .md-button {
    margin: 0 auto; } }

@media screen and (max-width: 1440px) {
  .pdicollection-logo {
    max-width: 33%; }
  #balloon {
    top: -5%;
    width: 25%; }
  #child {
    width: 25%;
    bottom: -12%; }
  #pair {
    width: 25%;
    bottom: -15%; }
  #dad {
    width: 28%; }
  #logoCocoCay {
    width: 25%; }
  .perfectDayPDI {
    height: 95vh; }
  #underwaterIsland {
    top: 30%; }
  .underwaterline {
    top: 48%; }
  #underwaterBigCoral {
    top: 59%; }
  #logoLelepa {
    width: 25%; }
  .lelepaPDI {
    height: 95vh; } }

@media (max-width: 1366px) and (max-height: 700px) {
  .introductionPDI {
    height: 140vh; }
  .pdicollection-logo {
    max-width: 33%; }
  #balloon {
    top: 5%;
    right: 18%;
    width: 20%; }
  #child {
    width: 22%;
    bottom: -21%;
    z-index: 4; }
  #pair {
    width: 22%;
    bottom: -15%; }
  #dad {
    width: 25%; }
  #logoCocoCay {
    width: 25%; }
  .perfectDayPDI {
    height: 120vh; }
  #underwaterIsland {
    top: 25%; }
  #underwaterLine {
    top: 50%; }
  #underwaterBigCoral {
    top: 59%; }
  #underwaterPinkCoral {
    bottom: -15%; }
  #logoLelepa {
    width: 25%; }
  .lelepaPDI {
    height: 135vh; } }

@media screen and (max-width: 1280px) {
  .grow .growContent h2.heading1 {
    font-size: 3rem; } }

@media screen and (max-width: 1080px) {
  .pdicollection-logo {
    max-width: 38%; }
  #child {
    bottom: -11%; }
  #logoCocoCay {
    width: 30%;
    right: 0;
    left: 0;
    margin: 0 auto; }
  #cocoCayBtn {
    width: 18%;
    top: 63%;
    left: 0;
    right: 0;
    margin: 0 auto;
    padding-left: 0.125rem;
    padding-right: 0.125rem; }
  .lelepaPDI {
    height: 100vh; }
  #underwaterLine {
    top: 53%; }
  #underwaterIsland {
    width: 100%;
    top: 38%; }
  #underwaterBigCoral {
    top: 57%;
    height: 45vh; }
  #underwaterPinkCoral {
    width: 95%;
    right: -15%;
    bottom: -16%; }
  #underwaterSmallYellowCoral {
    width: 50%;
    left: 0;
    bottom: -9%; }
  #underwaterYellowFish {
    width: 40%;
    bottom: -12%; }
  #logoLelepa {
    width: 35%;
    top: 42%;
    left: 0;
    right: 0;
    margin: 0 auto;
    z-index: 3; }
  #lelepaBtn {
    width: 20%;
    top: 69%;
    left: 0;
    right: 0;
    margin: 0 auto;
    z-index: 4;
    padding-left: 0.250rem;
    padding-right: 0.250rem; } }

@media screen and (max-width: 960px) {
  .pdicollection-logo {
    max-width: 39%; }
  #balloon {
    top: 0%;
    right: 20%;
    width: 30%; }
  #child {
    width: 30%;
    bottom: -10%;
    right: 20%; }
  #dad {
    width: 35%;
    right: 0; }
  #pair {
    bottom: -9%;
    width: 35%;
    left: -15%; }
  #logoCocoCay {
    width: 35%;
    right: 0;
    left: 0;
    margin: 0 auto; }
  #cocoCayBtn {
    width: 20%;
    top: 63%;
    left: 0;
    right: 0;
    margin: 0 auto;
    padding-left: 0.125rem;
    padding-right: 0.125rem; }
  .lelepaPDI {
    height: 90vh; }
  #underwaterLine {
    top: 46%; }
  #underwaterIsland {
    width: 100%;
    top: 28%; }
  #underwaterBigCoral {
    top: 50%;
    height: 49vh; }
  #underwaterPinkCoral {
    width: 95%;
    right: -15%;
    bottom: -16%; }
  #underwaterSmallYellowCoral {
    width: 50%;
    left: 0;
    bottom: -9%; }
  #underwaterYellowFish {
    width: 40%;
    bottom: -12%; }
  #logoLelepa {
    width: 35%;
    top: 39%;
    left: 0;
    right: 0;
    margin: 0 auto;
    z-index: 3; }
  #lelepaBtn {
    width: 20%;
    top: 64%;
    left: 0;
    right: 0;
    margin: 0 auto;
    z-index: 4;
    padding-left: 0.250rem;
    padding-right: 0.250rem; }
  .contactForm-container {
    width: 80%; } }

@media screen and (max-width: 800px) {
  .pdicollection-logo {
    max-width: 50%;
    margin: 1.5rem; }
  .follow-us {
    display: none; }
  .container-lelepa .heading2 {
    font-size: 3.5rem; }
  .introductionPDI {
    height: 140vh; }
  .introductionContent {
    width: 88%; }
  #growContainer {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    width: 100%;
    height: 70%;
    position: relative;
    margin: 0 auto;
    overflow: hidden; }
  .grow {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-pack: center;
        justify-content: center;
    height: 100%;
    width: 100%;
    transition: height 400ms; }
  #growContainer:hover .grow {
    width: 100%; }
  #growContainer:hover .grow:hover {
    width: 100%;
    height: 150%; }
  #balloon {
    top: 10%;
    right: 15%;
    width: 30%; }
  #child {
    width: 30%;
    bottom: -10%;
    right: 18%; }
  #dad {
    width: 35%;
    right: 0; }
  #pair {
    bottom: -9%;
    width: 35%;
    left: -15%; }
  #logoCocoCay {
    width: 43%;
    right: 0;
    left: 0;
    margin: 0 auto; }
  #cocoCayBtn {
    width: 25%;
    top: 60%;
    left: 0;
    right: 0;
    margin: 0 auto;
    padding-left: 0.125rem;
    padding-right: 0.125rem; }
  .imgCoverSection .content .heading2 {
    font-size: 3.5rem; }
  .lelepaPDI {
    height: 80vh; }
  #underwaterLine {
    top: 44%; }
  #underwaterIsland {
    width: 100%;
    top: 28%; }
  #underwaterBigCoral {
    top: 44%;
    height: 45vh; }
  #underwaterPinkCoral {
    width: 95%;
    right: -15%;
    bottom: -16%; }
  #underwaterSmallYellowCoral {
    width: 50%;
    left: 0;
    bottom: -9%; }
  #underwaterYellowFish {
    width: 40%; }
  #logoLelepa {
    top: 43%;
    left: 0;
    right: 0;
    margin: 0 auto;
    width: 40%;
    z-index: 3; }
  #lelepaBtn {
    width: 25%;
    top: 68%;
    left: 0;
    right: 0;
    margin: 0 auto;
    z-index: 4;
    padding-left: 0.250rem;
    padding-right: 0.250rem; } }

@media screen and (max-width: 700px) {
  
  .casino-logo {
    width: 250px;
    margin: 1.5rem; }

    .FullScreenHeroContent h2.heading1.casinoHeader {
      font-size: 3.5rem;
    }
  
  #social-collections {
    position: fixed;
    top: 0;
    right: 160px;
    width: 50%; }
  .social-icons {
    max-height: 20px; }
  .logo-rccl img {
    width: 150px; }
  .sign-up {
    position: fixed;
    top: 0;
    right: 0;
    border-radius: 0;
    background: #fdbb17;
    color: #ffffff;
    cursor: pointer;
    border: 0;
    font-size: 1rem;
    height: 2.9411764706rem;
    line-height: 2.9411764706rem;
    padding: 0 2rem; }
    .sign-up:focus {
      outline: 0; }
    .sign-up:active {
      -ms-transform: scale(1.05);
          transform: scale(1.05);
      outline: 0; }
  .footer-pdiCollection {
    position: fixed;
    bottom: 10px;
    left: 20px; }
  .pdicollection-logo {
    max-width: 45%; }
  .introductionPDI {
    height: 135vh; }
  #growContainer {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    width: 100%;
    height: 90vh;
    position: relative;
    margin: 0 auto;
    overflow: hidden; }
  .grow {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-pack: center;
        justify-content: center;
    height: 100%;
    width: 100%;
    transition: height 400ms; }
  #growContainer:hover .grow {
    width: 100%; }
  #growContainer:hover .grow:hover {
    width: 100%;
    height: 150%; }
  #balloon {
    top: 12%;
    right: 15%; }
  #child {
    width: 40%;
    bottom: -10%;
    right: 10%; }
  #dad {
    width: 45%;
    right: 0; }
  #pair {
    bottom: -9%;
    width: 40%;
    left: -15%; }
  #logoCocoCay {
    width: 40%;
    right: 0;
    left: 0;
    margin: 0 auto; }
  #cocoCayBtn {
    width: 35%;
    top: 57%;
    left: 0;
    right: 0;
    margin: 0 auto;
    padding-left: 0.125rem;
    padding-right: 0.125rem; }
  .section-pdi > div {
    height: 100vh; }
  .section-pdi.section--50-25-25 > div {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
    -ms-grid-rows: 40% 1fr 1fr;
    grid-template-rows: 40% 1fr 1fr;
    overflow: hidden; }
  .section-pdi.section--25-25-50 > div {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
    -ms-grid-rows: 1fr 1fr 60%;
    grid-template-rows: 1fr 1fr 60%;
    overflow: hidden; }
  .section-pdi.section--70-30 > div {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
    -ms-grid-rows: 70% 1fr;
    grid-template-rows: 70% 1fr; }
  .lelepaPDI {
    height: 75vh; }
  #underwaterLine {
    top: 44%; }
  #underwaterIsland {
    position: absolute;
    width: 110%;
    top: 30%; }
  #underwaterBigCoral {
    top: 44%;
    width: 200%;
    height: 45vh; }
  #underwaterPinkCoral {
    width: 105%;
    right: -15%;
    bottom: -16%; }
  #underwaterSmallYellowCoral {
    width: 60%;
    left: 0;
    bottom: -9%; }
  #underwaterYellowFish {
    width: 50%; }
  #logoLelepa {
    top: 43%;
    left: 0;
    right: 0;
    margin: 0 auto;
    width: 40%;
    z-index: 3; }
  #lelepaBtn {
    width: 35%;
    top: 68%;
    left: 0;
    right: 0;
    margin: 0 auto;
    z-index: 4;
    padding-left: 0.250rem;
    padding-right: 0.250rem; }
  .imgCoverSection .content {
    width: 90%; }
  .contactForm .paragraphCopy {
    font-size: 1.125rem; } }

@media screen and (max-width: 440px) {
  .logo-rccl img {
    width: 150px;
    margin-top: 0; }
  .pdicollection-logo {
    max-width: 55%; }
  .introductionPDI {
    height: 160vh; }
    .introductionPDI .introductionContent p.paragraphCopy {
      font-size: 1.125rem; }
  #growContainer {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    width: 100%;
    height: 70%;
    position: relative;
    bottom: 0;
    margin: 0 auto;
    overflow: hidden; }
  .grow {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-pack: center;
        justify-content: center;
    height: 100%;
    width: 100%;
    transition: height 400ms; }
  #growContainer:hover .grow {
    width: 100%; }
  #growContainer:hover .grow:hover {
    width: 100%;
    height: 150%; }
  .perfectDayPDI {
    height: 85vh; }
  #balloon {
    top: 15%; }
  #child {
    width: 35%;
    bottom: -12%; }
  #dad {
    width: 40%; }
  #pair {
    bottom: -11%;
    width: 40%;
    left: -15%; }
  #logoCocoCay {
    width: 50%;
    right: 0;
    left: 0;
    margin: 0 auto; }
  #cocoCayBtn {
    top: 62%;
    left: 0;
    right: 0;
    margin: 0 auto;
    padding-left: 0.10rem;
    padding-right: 0.10rem; }
  .lelepaPDI {
    height: 60vh; }
  #underwaterLine {
    top: 51%; }
  #underwaterIsland {
    position: absolute;
    width: 100%;
    top: 35%; }
  #underwaterBigCoral {
    top: 50%;
    width: 200%;
    height: 50vh; }
  #underwaterPinkCoral {
    width: 105%;
    right: -15%;
    bottom: -35%; }
  #underwaterSmallYellowCoral {
    width: 60%;
    left: 0;
    bottom: -22%; }
  #underwaterYellowFish {
    width: 50%; }
  #logoLelepa {
    top: 43%;
    left: 0;
    right: 0;
    margin: 0 auto;
    width: 65%;
    z-index: 3; }
  #lelepaBtn {
    width: 45%;
    top: 72%;
    left: 0;
    right: 0;
    margin: 0 auto;
    z-index: 4;
    padding-left: 0.250rem;
    padding-right: 0.250rem; }
  .section-pdi > div {
    height: 130vh; }
  .section-pdi.section--50-25-25 > div {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
    -ms-grid-rows: 60% 1fr 1fr;
    grid-template-rows: 60% 1fr 1fr;
    overflow: hidden; }
  .section-pdi.section--70-30 > div {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
    -ms-grid-rows: 70% 1fr;
    grid-template-rows: 70% 1fr; }
  .contactForm {
    height: 135vh; }
  .contactForm .paragraphCopy {
    font-size: 1.125rem; }
  .content-wrapper {
    height: 100%; }
  .sign-up {
    padding: 0.2rem 1.1rem;
    height: 2.5rem;
    line-height: 100%; }
  #social-collections {
    width: 50%;
    right: 8rem; }
    #social-collections .social-icons {
      padding: 0 0.075rem; }
  navitem a {
    padding: 0.5rem 0.2rem; } }

@media screen and (max-width: 330px) {
  #underwaterIsland {
    width: 150%;
    top: 30%; }
  #underwaterLine {
    top: 47%;
    width: 150%; }
  #underwaterBigCoral {
    top: 48%;
    width: 190%;
    height: 125%; }
  #underwaterPinkCoral {
    bottom: -15%;
    left: -30%;
    width: 150%;
    z-index: 2; }
  #underwaterSmallYellowCoral {
    bottom: -14%;
    left: 6%;
    width: 200%;
    z-index: 0; }
  #underwaterYellowFish {
    bottom: 0;
    left: -6%;
    width: 80%;
    z-index: 0; }
  #logoLelepa {
    top: 43%;
    left: 0;
    right: 0;
    margin: 0 auto;
    width: 70%;
    z-index: 3; }
  #lelepaBtn {
    width: 45%;
    top: 69%;
    left: 0;
    right: 0;
    margin: 0 auto;
    z-index: 4;
    padding: 0.825rem 0.425rem; } }

@media screen and (max-height: 414px) {
  .introductionPDI {
    height: 300vh; }
    .introductionPDI .introductionContent p.paragraphCopy {
      font-size: 1.125rem; }
  #growContainer {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    width: 100%;
    height: 70%;
    position: relative;
    bottom: 0;
    margin: 0 auto;
    overflow: hidden; }
  .grow {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-pack: center;
        justify-content: center;
    height: 100%;
    width: 100%;
    transition: height 400ms; }
  #growContainer:hover .grow {
    width: 100%; }
  #growContainer:hover .grow:hover {
    width: 100%;
    height: 150%; }
  .perfectDayPDI {
    height: 145vh; }
  #balloon {
    top: 10%;
    width: 20%; }
  #child {
    width: 25%;
    bottom: -9%;
    right: 25%; }
  #dad {
    width: 23%;
    right: 0%;
    bottom: -8%; }
  #pair {
    bottom: -5%;
    width: 20%;
    left: 0; }
  #logoCocoCay {
    width: 33%;
    right: 0;
    left: 0;
    margin: 0 auto;
    top: 20%; }
  #cocoCayBtn {
    width: 45%;
    top: 62%;
    left: 0;
    right: 0;
    margin: 0 auto;
    padding-left: 0.250rem;
    padding-right: 0.250rem; }
  .lelepaPDI {
    height: 120vh; }
  #underwaterLine {
    top: 42%; }
  #underwaterIsland {
    position: absolute;
    width: 100%;
    top: 20%; }
  #underwaterBigCoral {
    top: 50%;
    width: 100%;
    height: 90vh; }
  #underwaterPinkCoral {
    width: 105%;
    right: -15%;
    bottom: -15%; }
  #underwaterSmallYellowCoral {
    width: 60%;
    left: 0;
    bottom: -12%; }
  #underwaterYellowFish {
    width: 50%; }
  #logoLelepa {
    top: 40%;
    left: 0;
    right: 0;
    margin: 0 auto;
    width: 35%;
    z-index: 3; }
  .section-pdi > div {
    height: 180vh; }
  .section-pdi.section--50-25-25 > div {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
    -ms-grid-rows: 60% 1fr 1fr;
    grid-template-rows: 60% 1fr 1fr;
    overflow: hidden; }
  .section-pdi.section--70-30 > div {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
    -ms-grid-rows: 70% 1fr;
    grid-template-rows: 70% 1fr; }
  .contactForm {
    height: 225vh; }
  .contactForm .paragraphCopy {
    font-size: 1.125rem; }
  .content-wrapper {
    height: 100%; } }

@media screen and (max-height: 360px) {
  .introductionPDI {
    height: 300vh; }
    .introductionPDI .introductionContent p.paragraphCopy {
      font-size: 1.125rem; }
  #growContainer {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    width: 100%;
    height: 70%;
    position: relative;
    bottom: 0;
    margin: 0 auto;
    overflow: hidden; }
  .grow {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-pack: center;
        justify-content: center;
    height: 100%;
    width: 100%;
    transition: height 400ms; }
  #growContainer:hover .grow {
    width: 100%; }
  #growContainer:hover .grow:hover {
    width: 100%;
    height: 150%; }
  .perfectDayPDI {
    height: 145vh; }
  #balloon {
    top: 10%;
    width: 20%; }
  #child {
    width: 25%;
    bottom: -9%;
    right: 25%; }
  #dad {
    width: 23%;
    right: 0%;
    bottom: -8%; }
  #pair {
    bottom: -5%;
    width: 20%;
    left: 0; }
  #logoCocoCay {
    width: 35%;
    right: 0;
    left: 0;
    margin: 0 auto;
    top: 20%; }
  #cocoCayBtn {
    width: 45%;
    top: 62%;
    left: 0;
    right: 0;
    margin: 0 auto;
    padding-left: 0.250rem;
    padding-right: 0.250rem; }
  .lelepaPDI {
    height: 120vh; }
  #underwaterLine {
    top: 42%; }
  #underwaterIsland {
    position: absolute;
    width: 100%;
    top: 20%; }
  #underwaterBigCoral {
    top: 50%;
    width: 100%;
    height: 90vh; }
  #underwaterPinkCoral {
    width: 105%;
    right: -15%;
    bottom: -15%; }
  #underwaterSmallYellowCoral {
    width: 60%;
    left: 0;
    bottom: -12%; }
  #underwaterYellowFish {
    width: 50%; }
  #logoLelepa {
    top: 40%;
    left: 0;
    right: 0;
    margin: 0 auto;
    width: 35%;
    z-index: 3; }
  .section-pdi > div {
    height: 180vh; }
  .section-pdi.section--50-25-25 > div {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
    -ms-grid-rows: 60% 1fr 1fr;
    grid-template-rows: 60% 1fr 1fr;
    overflow: hidden; }
  .section-pdi.section--70-30 > div {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
    -ms-grid-rows: 70% 1fr;
    grid-template-rows: 70% 1fr; }
  .contactForm {
    height: 225vh; }
  .contactForm .paragraphCopy {
    font-size: 1.125rem; }
  .content-wrapper {
    height: 100%; } }

.space-for-carousel {
  height: 300px; }

.slant-content {
  padding: 0 !important; }

.twoWaysCopy {
  text-align: center; }
  .twoWaysCopy .introCopy {
    width: 80%;
    margin: 0 auto; }

.twoWaysImages img {
  object-fit: cover;
  width: 100%;
  height: 300px; }
  @media only all and (min-width: 375px) and (max-width: 767px) {
    .twoWaysImages img {
      object-fit: cover;
      width: 100%;
      height: 190px; } }

.alt-text-copy {
  text-align: left; }

.cuba-info {
  background: url("https://www.royalcaribbean.com/content/dam/royal/content/destinations/cuba/FAQ-BG%401x.png") no-repeat center center transparent;
  background-size: cover;
  width: 100%;
  height: 650px;
  color: white;
  text-align: center; }

.info-copy {
  width: 70% !important;
  margin: 0 auto !important;
  padding-bottom: 80px; }

.icon {
  width: 22%;
  padding-bottom: 16px; }

.logo {
  width: 36%; }

.dynamicPrice {
  margin-bottom: 16px; }

.page__par img {
  max-width: none; }

.cruiseTourMerch {
  margin-top: -340px;
  position: relative;
  z-index: 20; }

.cuba-info {
  background: url("https://www.royalcaribbean.com/content/dam/royal/content/destinations/cuba/FAQ-BG%401x.png") no-repeat center center transparent;
  background-size: cover;
  width: 100%;
  height: 650px;
  color: white;
  text-align: center; }

.alaska-info {
  background: url("https://www.royalcaribbean.com/content/dam/royal/ports-and-destinations/destinations/Alaska/assets/alaska-juneau-pink-flowers-nature-mountains.jpg") no-repeat center center transparent;
  background-size: cover;
  width: 100%;
  height: 650px;
  color: white;
  text-align: center; }

.info-copy {
  width: 70% !important;
  margin: 0 auto !important;
  padding-bottom: 80px; }

.icon {
  width: 22%;
  padding-bottom: 16px; }

/* MEDIA QUERIES */
@media screen and (min-width: 1440px) and (max-width: 1919px) {
  .mdc-layout-grid__inner {
    padding-top: 35px; } }

@media screen and (min-width: 768px) and (max-width: 1024px) {
  .twoWaysCopy {
    text-align: center; }
    .twoWaysCopy .introCopy {
      width: 100%;
      margin: 0 auto; }
  .space-for-carousel {
    height: 276px; }
  .cuba-info {
    height: 550px; }
  .info-copy {
    padding-bottom: 32px; } }

@media screen and (min-width: 767px) and (max-width: 840px) {
  .cuba-info {
    height: 750px; } }

@media screen and (min-width: 375px) and (max-width: 767px) {
  .twoWaysCopy .introCopy {
    width: 100%; }
  .twoWaysImages {
    height: 190px; }
  .space-for-carousel {
    height: 276px; }
  .cuba-tips-btn {
    margin: 0 !important; }
  .info-copy {
    width: 95% !important;
    padding-bottom: 32px; } }

@media screen and (max-width: 479px) {
  .twoWaysCopy {
    text-align: left; }
    .twoWaysCopy .introCopy {
      font-size: 1rem; }
  .max-width {
    padding: 0 !important; }
  .mobileOnly {
    display: block; }
  .desktopOnly {
    display: none; }
  .cuba-info {
    height: 1055px; }
  .info-copy {
    width: 90% !important;
    padding-top: 32px; }
  .cuba-info .paragraphCopy {
    width: 80%;
    margin: 0 auto; }
  .icon {
    width: 16%; }
  .cuba-logo {
    width: 50%;
    margin: 0 auto; }
  .logo {
    width: 60%; }
  .alaska-info {
    background: url("https://www.royalcaribbean.com/content/dam/royal/ports-and-destinations/destinations/Alaska/assets/alaska-juneau-pink-flowers-nature-mountains.jpg") no-repeat center center transparent;
    background-size: cover;
    width: 100%;
    height: 650px;
    color: white;
    text-align: center; } }