a {
  color: #00C;
}

@keyframes float {
  0%   {transform: translateY(-var(--floaty));}
  50%  {transform: translateY(var(--floaty));}
  100% {transform: translateY(-var(--floaty);}
}

@keyframes sway {
  0%   {transform: rotate(5deg);}
  50%  {transform: rotate(-5deg);}
  100% {transform: rotate(5deg);}
}

.mascot-container {
  height: 200px;
}

.mascot-container img {
  height: 200px;
  position: absolute;
}

.wave {
  height: 30px;
  background-color: white;
  width: 200%;
  transform: translateX(-25%);
  mask: 
    radial-gradient(26.88px at 50% 37.6px,#000 99%,#0000 101%) calc(50% - 32px) 0/64px 51% repeat-x,
    radial-gradient(26.88px at 50% -21.6px,#0000 99%,#000 101%) 50% 16px/64px calc(51% - 16px) repeat-x,
    radial-gradient(26.88px at 50% calc(100% - 37.6px),#000 99%,#0000 101%) 50% 100%/64px 51% repeat-x,
    radial-gradient(26.88px at 50% calc(100% + 21.6px),#0000 99%,#000 101%) calc(50% - 32px) calc(100% - 16px)/64px calc(51% - 16px) repeat-x;
  mask: 
    radial-gradient(15.24px at 50% 21.5px,#000 99%,#0000 101%) calc(50% - 20px) 0/40px 51% repeat-x,
    radial-gradient(15.24px at 50% -11.5px,#0000 99%,#000 101%) 50% 10px/40px calc(51% - 10px) repeat-x,
    radial-gradient(15.24px at 50% calc(100% - 21.5px),#000 99%,#0000 101%) 50% 100%/40px 51% repeat-x,
    radial-gradient(15.24px at 50% calc(100% + 11.5px),#0000 99%,#000 101%) calc(50% - 20px) calc(100% - 10px)/40px calc(51% - 10px) repeat-x;
}

.sign_in_button {
  direction: ltr;
  background-color: #aadafd !important;
  min-height: 40px;
  width: 100%;
  box-shadow: 0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.2),0 1px 5px 0 rgba(0,0,0,.12);
  border: none;
  border-radius: 2px;
  color: #000;
  min-width: 64px;
  padding: 0 16px;
  font-family: Roboto,Helvetica,Arial,sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 1;
}

.sign_in_card {
  min-width: 350px;
  text-align: center;
}

@media screen and (min-width: 800px) {
  .sign_in_card {
    min-width: 500px;
    padding: 10px 75px;
  }
  
  h3 {
    font-size: 28px;
  }
  
  h1 {
    font-size: 48px;
  }
}


@media screen and (max-width: 799px) {
  h1 {
    font-size: 32px;
  }
}