@charset "UTF-8";
/* DEFAULT */
@media only screen {
  video {
    position: absolute;
    top: 0;
    left: 0;
    min-height: 100%;
    min-width: 100%;
    z-index: -100;
  }
  .bg-blue {
    background-color: #7BC2FF;
  }
  .content2 {
    padding: 15vw 0 1px 0;
  }
  #aquatic {
    height: auto;
    max-width: 600px;
    width: 20vw;
  }
  #audio {
    background-color: #49C7F4;
    border-radius: 20px;
    bottom: 10vh;
    display: inline-block;
    padding: 1px 20px;
    position: fixed;
    right: 10px;
    width: 340px;
  }
  #bubbles {
    background: #0058A2 url("../images/h2o.webp") no-repeat 50% 0%;
    background-size: cover;
  }
  #bubbles * {
    color: #FFFFFF;
  }
  #center1 {
    padding-top: 10vw;
    width: 28%;
  }
  #center2 {
    padding: 0 2vw;
    width: 42%;
  }
  #left2 {
    padding: 0 2vw 0 4vw;
    width: 26%;
  }
  #right1 {
    padding: 5vw 0 0 0;
    width: 42%;
  }
  #right2 {
    display: block;
  }
  #right3 {
    display: none;
  }
  #splashpad {
    height: auto;
    max-width: 433px;
    width: 20vw;
  }
  #spin {
    height: 600px;
    width: 600px;
  }
  #umbrella {
    height: auto;
    max-width: 433px;
    width: 20vw;
  }
  #water {
    padding: 5vw 2vw;
  }
}
/* MEGAPIXEL */
@media only screen and (min-width: 2001px) {}
/* DESKTOP */
@media only screen and (max-width: 2000px) {}
/* TABLET */
@media only screen and (max-width: 1050px) {
  #aquatic {
    width: 30vw;
  }
  #overlay {
    flex-direction: column;
  }
}
/* MOBILE */
@media only screen and (max-width: 800px) {
  .expertise {
    font-size: 3rem;
  }
  #center1 {
    padding: 0 7vw;
    width: 86vw;
  }
  #center2 {
    padding: 0 4vw;
    width: 92vw;
  }
  #left2 {
    padding: 0 2vw;
    width: 92vw;
  }
  #right1 {
    padding: 0 7vw;
    width: 86vw;
  }
  #right2 {
    display: none;
  }
  #right3 {
    display: block;
    float: right;
    margin: 0 -2% 10px 2vw;
    max-width: 433px;
    width: 40vw;
  }
  #splashpad {
    width: 50vw;
  }
  #umbrella2 {
    height: auto;
    max-width: 433px;
    width: 40vw;
  }
  #waterpark {
    flex-direction: column-reverse;
  }
}