/* line 1, assets/sass/beach.scss */
.beach-container {
  position: relative;
  width: 100%;
  max-height: 33vw;
  min-height: 633px;
  background: none;
  overflow: hidden; }

/* line 10, assets/sass/beach.scss */
.sun {
  width: 70px;
  height: 70px;
  position: absolute;
  top: 20px;
  right: 40px;
  background-color: #f9cb5d;
  border-radius: 50%;
  display: none; }

/* line 21, assets/sass/beach.scss */
.sand-below {
  width: 75%;
  height: 150%;
  position: absolute;
  bottom: -125%;
  right: -35%;
  background-color: #f3bf4e;
  border-radius: 45%;
  transform: rotate(15deg); }

/* line 32, assets/sass/beach.scss */
.chair {
  position: absolute;
  bottom: 10%;
  right: 5%;
  width: 100%;
  height: auto;
  max-width: 250px;
  transform: rotateY(180deg) rotate(-7deg);
  z-index: 5; }

/* line 43, assets/sass/beach.scss */
.palm-tree {
  position: absolute;
  bottom: 10%;
  left: 5%;
  width: 100%;
  height: auto;
  max-width: 325px;
  max-height: 538px;
  transform: rotateY(180deg); }

/* line 54, assets/sass/beach.scss */
.sand-above {
  width: 150%;
  height: 150%;
  position: absolute;
  bottom: -120%;
  right: -15%;
  background-color: #fbe18d;
  border-radius: 40%; }

/* line 64, assets/sass/beach.scss */
.wave {
  position: absolute;
  width: 66%;
  height: 66vw; }

/* line 70, assets/sass/beach.scss */
.ocean-line {
  width: 100%;
  height: 200px;
  background-color: #38afdc;
  bottom: 14%; }

/* line 77, assets/sass/beach.scss */
.tide-line {
  width: 100%;
  height: 200px;
  background-color: #61c7ed;
  bottom: 8%; }

/* line 84, assets/sass/beach.scss */
.wave-line {
  width: 100%;
  height: 200px;
  background-color: #98ddf7;
  bottom: -2%; }

/* line 91, assets/sass/beach.scss */
.ocean-tide {
  border-radius: 40%;
  top: 59%;
  animation: rotate 11.5s linear infinite;
  background-color: #38afdc;
  transform: translateX(-30%); }

/* line 99, assets/sass/beach.scss */
.tide-tide {
  border-radius: 40%;
  top: 64%;
  animation: rotate 8s linear infinite;
  background-color: #61c7ed;
  transform: translateX(30%); }

/* line 107, assets/sass/beach.scss */
.wave-tide {
  top: 72%;
  border-radius: 40%;
  animation: rotate 6s linear infinite;
  background-color: #98ddf7;
  transform: translateX(0%); }

/* line 115, assets/sass/beach.scss */
.full-left-tide {
  left: -33%;
  animation-delay: -3.75s; }

/* line 120, assets/sass/beach.scss */
.center-left-tide {
  left: 33%;
  animation-delay: -5s; }

/* line 125, assets/sass/beach.scss */
.center-right-tide {
  right: 33%;
  animation-delay: -6.25s; }

/* line 130, assets/sass/beach.scss */
.full-right-tide {
  right: -33%;
  animation-delay: -8.75s; }

/* line 135, assets/sass/beach.scss */
.coqueiro-3,
.coqueiro-4,
.coqueiro-5,
.coqueiro-6 {
  animation: wind 10s linear infinite; }

/* line 142, assets/sass/beach.scss */
.coqueiro-2 {
  animation: turn 10s linear infinite; }

@keyframes turn {
  0% {
    transform: translateY(0px); }
  30% {
    transform: translateY(-10px); }
  60% {
    transform: translateY(10px); }
  85% {
    transform: translateY(0px); }
  100% {
    transform: translateY(0px); } }

@keyframes wind {
  0% {
    transform: rotate(0deg); }
  30% {
    transform: rotate(-1deg) translate(5px, 15px); }
  60% {
    transform: rotate(0deg) translate(0px, 15px); }
  90% {
    transform: rotate(0deg); }
  100% {
    transform: rotate(0deg); } }

@keyframes rotate {
  0% {
    transform: rotate(0deg); }
  100% {
    transform: rotate(90deg); } }

/*# sourceMappingURL=../../sass */