/*
light yellow: #FFF568; 
yellow: #FFF200;
dark blue: #0459A8;
blue: #009FE3;
warm tan: #f9b27c;
warm brown: #9d4e0a;
purple: #1a1262;
sand: #fdcda4;


surface color: #7EBBD8;
;



NIMBUS SANS REG
font-family: nimbus-sans,sans-serif;
font-weight: 400;
font-style: normal;

NIMBUS SANS BOLD
font-family: nimbus-sans,sans-serif;
font-weight: 700;
font-style: normal;

*/
@import url("font/stylesheet.css");
body {
  font-size: 100%;
  background-color: #B5DFF7; }

img {
  max-width: 100%; }

/*variables*/
/*mix-ins*/
.page {
  width: 100%;
  height: 100%;
  background: #b4dff7;
  background: -webkit-gradient(linear, left top, left bottom, from(#b4dff7), color-stop(20%, #a7d1f0), color-stop(65%, #009fe3), to(#0071bb));
  background: linear-gradient(180deg, #b4dff7 0%, #a7d1f0 20%, #009fe3 65%, #0071bb 100%);
  /*background: rgb(167,209,240);
      background: linear-gradient(180deg, rgba(167,209,240,1) 0%, rgba(0,159,227,1) 59%, rgba(0,113,187,1) 100%);*/
  padding-top: 50px;
  position: relative; }

nav {
  width: 100%;
  height: 100px;
  background-image: url(images/sky-2.png);
  background-repeat: no-repeat;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  z-index: 5000;
  padding: 0 84px 0 67px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  position: fixed;
  top: 0; }

nav a {
  text-decoration: none;
  font-family: "gobold_extra2regular";
  color: white;
  font-size: 1.5625em;
  margin-top: 30px;
  -webkit-transition: all .5s ease-in-out;
  transition: all .5s ease-in-out; }

nav a:hover {
  color: #0459A8; }

.join {
  color: #FFF568; }

.logo {
  width: 238px; }

.logo img {
  width: 238px;
  -webkit-transition: .5s ease-in-out;
  transition: .5s ease-in-out; }

.logo:hover {
  background-image: url(images/logo-footer.png);
  background-repeat: no-repeat; }

.logo img:hover {
  opacity: 0;
  -webkit-transition: .5s ease-in-out;
  transition: .5s ease-in-out; }

.nav {
  width: 680px;
  margin-bottom: 40px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between; }

.nav a {
  display: block; }

.mobilenav {
  display: none; }

.hamburger-menu-button {
  display: none; }

section {
  width: 100%;
  height: 50px;
  background-color: #B5DFF7;
  padding-top: 80px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  display: block;
  position: relative; }

header {
  width: 100%;
  height: 100%;
  margin-top: -80px;
  position: relative; }

.surface {
  width: 100%; }

header img {
  width: 40%;
  position: absolute;
  left: 0;
  right: 0;
  margin: auto;
  margin-top: -10px;
  z-index: 100; }

#fish-moving {
  display: block; }

#still-fish {
  display: none; }

/*--------------ABOUT-----------*/
#about {
  width: 100%;
  height: 100%;
  position: relative; }

.part-1 {
  width: 100%;
  height: 545px;
  background-image: url(images/bubbles-play.png);
  background-repeat: no-repeat;
  background-position: top;
  background-size: 60%; }

#about h1 {
  font-family: "gobold_extra2regular";
  text-align: center;
  font-size: 3em;
  color: #0459A8;
  padding-top: 200px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box; }

.paragraph1 {
  width: 60%;
  height: 50px;
  margin: auto; }

#about p {
  font-family: nimbus-sans, sans-serif;
  color: white;
  font-size: 1.5em;
  line-height: 1.5em;
  font-weight: 400;
  text-align: center; }

#about b {
  font-family: nimbus-sans, sans-serif;
  color: #FFF200;
  font-size: 1em;
  line-height: 1.5em;
  font-weight: 700; }

/*#music-fish{
    width: 375px;
    height: 305px;
    position: absolute;
    right: 150px;
    margin-top: -350px;
    z-index: 100;
    
    .fish-1{
    width: 100%;   
}
}


*/
.fish-1 {
  width: 30%;
  position: absolute;
  right: 100px;
  margin-top: -350px;
  z-index: 100; }

.part-2 {
  width: 100%;
  height: 745px;
  background-image: url(images/bubbles-paradise.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 80%;
  margin-top: 0px; }

.paragraph2 {
  width: 60%;
  height: 100%;
  margin: auto;
  padding-top: 100px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box; }

.fish-2 {
  width: 30%;
  position: absolute;
  left: 200px;
  margin-top: -130px;
  z-index: 100; }

/*----------MISSION--------*/
#mission {
  width: 100%;
  height: 745px;
  position: relative;
  background-image: url(images/bubbles-mission.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 80%; }
  #mission h1 {
    font-family: "gobold_extra2regular";
    text-align: center;
    font-size: 3em;
    color: #0459A8;
    padding-top: 200px;
    -webkit-box-sizing: border-box;
            box-sizing: border-box; }
  #mission p {
    font-family: nimbus-sans, sans-serif;
    color: white;
    font-size: 1.5em;
    line-height: 1.5em;
    font-weight: 400;
    text-align: center;
    width: 60%;
    margin: auto; }
  #mission b {
    font-family: nimbus-sans, sans-serif;
    color: #FFF200;
    font-size: 1em;
    line-height: 1.5em;
    font-weight: 700; }
  #mission img {
    width: 30%;
    position: absolute;
    right: 200px;
    margin-top: 50px;
    z-index: 100; }

/*------JOIN------*/
#join {
  width: 100%;
  height: 745px;
  position: relative;
  background-image: url(images/bubbles-join.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 80%; }
  #join h1 {
    font-family: "gobold_extra2regular";
    text-align: center;
    font-size: 3em;
    color: white;
    padding-top: 150px;
    -webkit-box-sizing: border-box;
            box-sizing: border-box; }
  #join p {
    font-family: nimbus-sans, sans-serif;
    color: white;
    font-size: 1.5em;
    line-height: 1.5em;
    font-weight: 400;
    text-align: center;
    width: 60%;
    margin: auto; }
  #join b {
    font-family: nimbus-sans, sans-serif;
    color: #FFF200;
    font-size: 1em;
    line-height: 1.5em;
    font-weight: 700; }
  #join button {
    width: 200px;
    height: 70px;
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    background-color: #0459A8;
    border: none;
    border-radius: 50px;
    margin-top: 50px;
    -webkit-transition: .5s ease-in-out;
    transition: .5s ease-in-out; }
  #join button h3 {
    font-family: "gobold_extra2regular";
    text-align: center;
    font-size: 2em;
    color: white;
    margin: 0;
    -webkit-transition: .5s ease-in-out;
    transition: .5s ease-in-out; }
  #join a {
    text-decoration: none; }
    #join a a {
      margin: 0;
      padding: 0; }
  #join h3:hover {
    color: #0459A8; }
  #join button:hover {
    background-color: white; }
  #join img {
    width: 30%;
    position: absolute;
    left: 200px;
    margin-top: 130px;
    z-index: 100; }

/*------SPONSORS------*/
#sponsors {
  width: 100%;
  height: 745px;
  position: relative;
  background-image: url(images/bubbles-sponsors.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 80%; }
  #sponsors h1 {
    font-family: "gobold_extra2regular";
    text-align: center;
    font-size: 3em;
    color: white;
    padding-top: 150px;
    -webkit-box-sizing: border-box;
            box-sizing: border-box; }
  #sponsors p {
    font-family: nimbus-sans, sans-serif;
    color: white;
    font-size: 1.5em;
    line-height: 1.5em;
    font-weight: 400;
    text-align: center;
    width: 60%;
    margin: auto; }
  #sponsors b {
    font-family: nimbus-sans, sans-serif;
    color: #FFF200;
    font-size: 1em;
    line-height: 1.5em;
    font-weight: 700; }

.sponsor-logos {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -ms-flex-line-pack: center;
      align-content: center;
  position: absolute;
  left: 0;
  right: 0;
  margin: auto;
  text-align: center; }
  .sponsor-logos img {
    width: 80%;
    margin: 50px;
    -webkit-transition: .5s ease-in-out;
    transition: .5s ease-in-out;
    -ms-flex-line-pack: center;
        align-content: center; }
  .sponsor-logos img:hover {
    opacity: 60%; }
  .sponsor-logos a {
    padding: 0;
    width: 270px;
    height: 270px;
    margin: 20px; }

/*-----FOOTER-----*/
.coral {
  width: 100%; }

footer {
  width: 100%;
  height: 250px;
  background: #fdcda4;
  background: -webkit-gradient(linear, left top, left bottom, from(#fdcda4), color-stop(92%, #f9b27c));
  background: linear-gradient(180deg, #fdcda4 0%, #f9b27c 92%);
  margin-top: -10px; }

.footer-content {
  width: 90%;
  height: 131px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -ms-flex-line-pack: center;
      align-content: center;
  position: absolute;
  left: 0;
  right: 0;
  margin: auto;
  margin-top: 50px; }

.contact {
  width: 290px;
  height: 127.3428px;
  margin-top: -80px; }
  .contact h3 {
    font-family: "gobold_extra2regular";
    text-align: left;
    font-size: 2.1875em;
    color: #9d4e0a;
    margin-bottom: -10px;
    padding-top: 50px;
    padding-left: 40px;
    -webkit-box-sizing: border-box;
            box-sizing: border-box; }
  .contact li {
    font-family: nimbus-sans, sans-serif;
    font-size: 1em;
    color: #1a1262;
    list-style: none;
    text-align: left; }
    .contact li a {
      text-decoration: none;
      color: #1a1262; }
    .contact li a:hover {
      color: #9d4e0a;
      -webkit-transition: .5s ease-in-out;
      transition: .5s ease-in-out; }

.event {
  width: 350px;
  height: 131.166px;
  left: 0;
  right: 0;
  margin: auto; }
  .event .event-name {
    width: 100%;
    left: 0;
    right: 0;
    margin: auto; }
  .event p {
    font-family: nimbus-sans, sans-serif;
    font-size: .85em;
    color: #9d4e0a;
    margin-top: 15px;
    text-align: center; }

.social {
  width: 290px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -ms-flex-line-pack: center;
      align-content: center;
  padding-right: 40px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box; }
  .social img {
    width: 90%;
    padding: 10px;
    -webkit-box-sizing: border-box;
            box-sizing: border-box; }
  .social img:hover {
    opacity: 60%;
    -webkit-transition: .5s ease-in-out;
    transition: .5s ease-in-out; }

/*IN-BETWEEN 1*/
@media screen and (min-width: 800px) and (max-width: 1253px) {
  /*#music-fish{height: 800px; margin-top: -150px;}*/
  .fish-2 {
    margin-top: -100px; }

  .sponsor-logos img {
    margin: 30px; }

  .footer-content {
    width: 90%;
    margin-top: 70px; }

  .contact {
    width: 270px; }
    .contact h3 {
      font-size: 2em; }
    .contact li {
      font-size: .9em; }

  .social {
    width: 270px; } }
/*IN-BETWEEN 2*/
@media screen and (min-width: 769px) and (max-width: 1069px) {
  .nav {
    width: 350px; }

  .nav a {
    font-size: 1.2em; }

  .surface {
    margin-top: 20px; }

  /*#music-fish{margin-top: -140px;}*/
  .fish-2 {
    margin-top: 15px; }

  #sponsors {
    height: 900px;
    background-size: 80%; }
    #sponsors h1 {
      font-family: "gobold_extra2regular";
      text-align: center;
      font-size: 2.5em; }

  .sponsor-logos {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    text-align: center; }
    .sponsor-logos img {
      width: 70%;
      margin: 0px;
      margin-top: 20px; }
    .sponsor-logos a {
      margin: -20px; }

  /*-----FOOTER-----*/
  footer {
    height: 290px; }

  .footer-content {
    width: 100%;
    height: 200px;
    margin-top: 30px; }

  .contact {
    width: 250px; }
    .contact li {
      font-size: .8em; }

  .event {
    width: 270px; }

  .social {
    width: 240px;
    padding-right: 0px; }
    .social img {
      width: 70%;
      padding: 0; } }
/* Tablet */
@media screen and (min-width: 501px) and (max-width: 768px) {
  nav {
    width: 100%;
    height: 80px;
    background-size: cover; }

  .nav a {
    display: none; }

  .nav {
    display: none; }

  .logo {
    width: 180px; }

  .logo img {
    width: 180px; }

  .logo:hover {
    background-size: 180px; }

  /*hamburger*/
  .mobilenav {
    position: fixed;
    z-index: 1000;
    right: 0;
    display: block; }

  .hamburger-menu-button {
    width: 40px;
    height: 40px;
    padding: 6px;
    display: block;
    position: relative;
    /*margin-top: 15px;*/
    z-index: 100;
    background: transparent;
    -webkit-box-sizing: content-box;
            box-sizing: content-box;
    border: 0;
    color: transparent;
    white-space: nowrap;
    cursor: pointer;
    overflow: hidden; }

  .hamburger-menu-button-open {
    top: 50%;
    right: 50%;
    /*margin-right: -12px;*/ }

  .hamburger-menu-button-open,
  .hamburger-menu-button-open::before,
  .hamburger-menu-button-open::after {
    position: absolute;
    width: 26px;
    height: 3px;
    background: white;
    border-radius: 8px;
    -webkit-transition: all 0.3s;
    transition: all 0.3s; }

  .hamburger-menu-button-open::before,
  .hamburger-menu-button-open::after {
    right: 0;
    content: ""; }

  .hamburger-menu-button-open::before {
    top: 6px; }

  .hamburger-menu-button-open::after {
    bottom: 6px; }

  .hamburger-menu-button-close {
    background: transparent;
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg); }

  .hamburger-menu-button-close::before {
    background: white;
    -webkit-transform: translateY(-6px) rotate(45deg);
    transform: translateY(-6px) rotate(45deg); }

  .hamburger-menu-button-close::after {
    background: white;
    -webkit-transform: translateY(6px) rotate(-45deg);
    transform: translateY(6px) rotate(-45deg); }

  .ham-menu {
    position: absolute;
    top: 0;
    text-align: center;
    margin: auto;
    width: 100%;
    min-width: 375px; }

  .ham-menu ul {
    -webkit-transform: translateX(110%);
    transform: translateX(110%);
    background-color: #009FE3;
    -webkit-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
    width: 100%;
    font-size: 15px; }

  .ham-menu.on ul {
    -webkit-transform: translateX(-300px);
    transform: translateX(-300px); }

  .ham-menu ul li {
    display: block; }

  .ham-menu ul li a {
    padding: 15px;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    display: block;
    width: 100%;
    background-color: transparent;
    color: #fff;
    text-transform: uppercase;
    -webkit-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    margin: 0 !important; }

  .ham-menu ul li.active a, .ham-menu ul li a:hover {
    background-color: white;
    color: #0459A8 !important; }

  .join-ham {
    color: #FFF200 !important; }

  ul.menu {
    padding: 0;
    margin: 0 !important; }

  /*---HEADER--*/
  section {
    display: none; }

  header {
    margin-top: 10px; }

  header img {
    width: 50%;
    margin-top: 50px; }

  #fish-moving {
    margin-top: 130px; }

  /*--------------ABOUT-----------*/
  #about h1 {
    font-family: "gobold_extra2regular";
    text-align: center;
    font-size: 2.5em; }

  #about p {
    font-family: nimbus-sans, sans-serif;
    color: white;
    font-size: 1.3em;
    line-height: 1.3em;
    font-weight: 400;
    text-align: center; }

  .part-1 {
    height: 550px; }

  /*#music-fish{
      height: 900px;
      margin-top: -350px;
      
      img{width: 40%;}
  }*/
  .fish-1 {
    width: 40%;
    left: 0;
    right: 0;
    margin: auto;
    margin-top: 0px;
    z-index: 100; }

  .part-2 {
    height: 600px;
    margin-top: 300px; }

  .paragraph2 {
    padding-top: 0px; }

  .fish-2 {
    width: 40%;
    left: 100px;
    margin-top: -80px; }

  /*------MISSION-----*/
  #mission {
    height: 700px;
    margin-top: 50px; }
    #mission h1 {
      font-family: "gobold_extra2regular";
      text-align: center;
      font-size: 2.5em;
      padding-top: 150px; }
    #mission p {
      font-family: nimbus-sans, sans-serif;
      color: white;
      font-size: 1.3em;
      line-height: 1.3em;
      font-weight: 400;
      text-align: center; }
    #mission img {
      width: 40%;
      right: 100px;
      margin-top: 80px; }

  /*------JOIN------*/
  #join {
    height: 900px; }
    #join h1 {
      font-family: "gobold_extra2regular";
      text-align: center;
      font-size: 2.5em;
      padding-top: 120px; }
    #join p {
      font-family: nimbus-sans, sans-serif;
      color: white;
      font-size: 1.3em;
      line-height: 1.3em;
      font-weight: 400;
      text-align: center; }
    #join button {
      width: 250px;
      height: 90px; }
    #join img {
      width: 40%;
      left: 100px;
      margin-top: 250px; }

  /*------SPONSORS------*/
  #sponsors {
    height: 900px;
    background-size: 80%; }
    #sponsors h1 {
      font-family: "gobold_extra2regular";
      text-align: center;
      font-size: 2.5em; }

  .sponsor-logos {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    text-align: center; }
    .sponsor-logos img {
      width: 70%;
      margin: 0px;
      margin-top: 20px; }
    .sponsor-logos a {
      margin: -20px; }

  /*-----FOOTER-----*/
  footer {
    height: 380px; }

  .footer-content {
    width: 100%;
    height: 320px;
    margin-top: 30px;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center; }

  .contact {
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
    width: 270px; }
    .contact li {
      font-size: .9em; }

  .event {
    -webkit-box-ordinal-group: 4;
        -ms-flex-order: 3;
            order: 3;
    width: 280px;
    margin-top: 50px; }

  .social {
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
    width: 220px;
    padding-right: 0;
    margin-top: 30px; }
    .social img {
      width: 70%;
      padding: 0; } }
/* Mobile */
@media screen and (max-width: 500px) {
  nav {
    height: 80px;
    background-size: cover;
    padding: 0 50px 0 50px; }

  .nav {
    display: none; }

  .logo {
    width: 130px; }

  .logo img {
    width: 130px; }

  .logo:hover {
    background-size: 130px; }

  /*hamburger*/
  .mobilenav {
    position: fixed;
    z-index: 1000;
    right: 0;
    display: block; }

  .hamburger-menu-button {
    width: 40px;
    height: 40px;
    padding: 6px;
    display: block;
    position: relative;
    /*margin-top: 15px;*/
    z-index: 100;
    background: transparent;
    -webkit-box-sizing: content-box;
            box-sizing: content-box;
    border: 0;
    color: transparent;
    white-space: nowrap;
    cursor: pointer;
    overflow: hidden; }

  .hamburger-menu-button-open {
    top: 50%;
    right: 50%;
    /*margin-right: -12px;*/ }

  .hamburger-menu-button-open,
  .hamburger-menu-button-open::before,
  .hamburger-menu-button-open::after {
    position: absolute;
    width: 26px;
    height: 3px;
    background: white;
    border-radius: 8px;
    -webkit-transition: all 0.3s;
    transition: all 0.3s; }

  .hamburger-menu-button-open::before,
  .hamburger-menu-button-open::after {
    right: 0;
    content: ""; }

  .hamburger-menu-button-open::before {
    top: 6px; }

  .hamburger-menu-button-open::after {
    bottom: 6px; }

  .hamburger-menu-button-close {
    background: transparent;
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg); }

  .hamburger-menu-button-close::before {
    background: white;
    -webkit-transform: translateY(-6px) rotate(45deg);
    transform: translateY(-6px) rotate(45deg); }

  .hamburger-menu-button-close::after {
    background: white;
    -webkit-transform: translateY(6px) rotate(-45deg);
    transform: translateY(6px) rotate(-45deg); }

  .ham-menu {
    position: absolute;
    top: 0;
    text-align: center;
    margin: auto;
    width: 100%;
    min-width: 375px; }

  .ham-menu ul {
    -webkit-transform: translateX(110%);
    transform: translateX(110%);
    background-color: #009FE3;
    -webkit-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
    width: 100%;
    font-size: 15px; }

  .ham-menu.on ul {
    -webkit-transform: translateX(-300px);
    transform: translateX(-300px); }

  .ham-menu ul li {
    display: block; }

  .ham-menu ul li a {
    padding: 15px;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    display: block;
    width: 100%;
    background-color: transparent;
    color: #fff;
    text-transform: uppercase;
    -webkit-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    margin: 0 !important; }

  .ham-menu ul li.active a, .ham-menu ul li a:hover {
    background-color: white;
    color: #0459A8 !important; }

  .join-ham {
    color: #FFF200 !important; }

  ul.menu {
    padding: 0;
    margin: 0 !important; }

  /*---HEADER--*/
  section {
    display: none; }

  .surface {
    margin-top: 30px; }

  header {
    margin-top: 10px; }

  header img {
    width: 60%;
    margin-top: 50px; }

  #fish-moving {
    display: none; }

  #still-fish {
    width: 70%;
    height: 100%;
    display: block;
    margin-top: 180px; }
    #still-fish img {
      width: 80%; }

  /*--------------ABOUT-----------*/
  #about {
    margin-top: 400px; }
    #about h1 {
      font-family: "gobold_extra2regular";
      text-align: center;
      font-size: 2em; }
    #about p {
      font-family: nimbus-sans, sans-serif;
      color: white;
      font-size: 1em;
      line-height: 1.2em;
      font-weight: 400;
      text-align: center; }
    #about b {
      font-family: nimbus-sans, sans-serif;
      color: #FFF200;
      font-size: 1em;
      line-height: 1em;
      font-weight: 700; }

  .part-1 {
    height: 700px;
    background-image: none; }

  .paragraph1 {
    width: 70%; }

  /*#music-fish{
      height: 775px;
      margin-top: -430px;
      
      img{width: 50%;}
  }*/
  .fish-1 {
    width: 55%;
    left: 0;
    right: 0;
    margin: auto;
    margin-top: -200px;
    z-index: 100; }

  .part-2 {
    background-image: none;
    margin-top: 0px; }

  .paragraph2 {
    padding-top: 90px;
    width: 70%; }

  .fish-2 {
    width: 55%;
    left: 0;
    right: 0;
    margin: auto;
    margin-top: -160px; }

  /*------MISSION-----*/
  #mission {
    height: 750px;
    background-image: none;
    margin-top: -20px; }
    #mission h1 {
      font-family: "gobold_extra2regular";
      text-align: center;
      font-size: 2em;
      padding-top: 130px; }
    #mission p {
      font-family: nimbus-sans, sans-serif;
      color: white;
      font-size: 1em;
      line-height: 1.2em;
      font-weight: 400;
      text-align: center;
      width: 70%; }
    #mission b {
      font-family: nimbus-sans, sans-serif;
      color: #FFF200;
      font-size: 1em;
      line-height: 1em;
      font-weight: 700; }
    #mission img {
      width: 55%;
      left: 0;
      right: 0;
      margin: auto;
      margin-top: 140px; }

  /*------JOIN------*/
  #join {
    height: 750px;
    background-image: none;
    padding-top: 50px; }
    #join h1 {
      font-family: "gobold_extra2regular";
      text-align: center;
      font-size: 2em;
      padding-top: 50px; }
    #join p {
      font-family: nimbus-sans, sans-serif;
      color: white;
      font-size: 1em;
      line-height: 1.2em;
      font-weight: 400;
      text-align: center;
      width: 70%; }
    #join b {
      font-family: nimbus-sans, sans-serif;
      color: #FFF200;
      font-size: 1em;
      line-height: 1em;
      font-weight: 700; }
    #join button {
      width: 250px;
      height: 70px; }
      #join button h3 {
        font-size: 1.75em; }
    #join img {
      width: 55%;
      left: 0;
      right: 0;
      margin: auto;
      margin-top: 250px; }

  /*------SPONSORS------*/
  #sponsors {
    height: 900px;
    background-image: none;
    background-size: 80%; }
    #sponsors h1 {
      font-family: "gobold_extra2regular";
      text-align: center;
      font-size: 2em; }

  .sponsor-logos {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    text-align: center; }
    .sponsor-logos img {
      width: 70%;
      margin: 0px;
      margin-top: 20px; }
    .sponsor-logos a {
      margin: -20px; }

  /*-----FOOTER-----*/
  footer {
    height: 560px; }

  .footer-content {
    height: 450px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    margin-top: 100px; }

  .contact {
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
    width: 340px;
    text-align: center; }
    .contact h3 {
      text-align: center;
      padding: 0; }
    .contact li {
      font-size: 1em;
      text-align: center;
      padding-right: 40px; }

  .event {
    -webkit-box-ordinal-group: 4;
        -ms-flex-order: 3;
            order: 3;
    width: 260px;
    left: 0;
    right: 0;
    margin: auto;
    margin-top: 0px; }
    .event p {
      margin-top: 20px; }

  .social {
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
    width: 250px;
    padding-right: 0;
    left: 0;
    right: 0;
    margin: auto;
    -ms-flex-pack: distribute;
        justify-content: space-around; }
    .social img {
      width: 100%;
      padding: 0; } }