#bubbleOne_p1 {
  text-align: center;
  color: white;
  background: #566270;
  padding: 0.6rem;
  width: 17rem;
  display: none;
  border-radius: 5px;
  z-index: 3;
  position: absolute;
  top: 180px;
  right: 350px;
  -webkit-animation: grow 0.5s 1;
          animation: grow 0.5s 1;
}

@media (max-width: 450px) {
  #bubbleOne_p1 {
    right: 30px;
    top: 35rem;
    opacity: 0.7;
  }
}

@media (min-width: 451px) {
  #bubbleOne_p1 {
    right: 30px;
    top: 35rem;
    opacity: 0.7;
  }
}

@media (min-width: 800px) {
  #bubbleOne_p1 {
    right: 30px;
    top: 10rem;
    opacity: 0.7;
  }
}

@media (min-width: 1100px) {
  #bubbleOne_p1 {
    top: 180px;
    right: 350px;
    opacity: 1;
  }
}

@media (min-width: 1700px) {
  #bubbleOne_p1 {
    top: 20rem;
    right: 44rem;
  }
}

@media (min-width: 2900px) {
  #bubbleOne_p1 {
    top: 30rem;
    width: 35rem;
    right: 62rem;
    padding: 2rem;
    font-size: 2.1rem;
  }
}

#bubbleTwo_p1 {
  text-align: center;
  color: white;
  background: #566270;
  padding: 0.6rem;
  width: 18rem;
  display: none;
  border-radius: 5px;
  z-index: 3;
  position: absolute;
  top: 600px;
  right: 90px;
  -webkit-animation: grow 0.5s 1;
          animation: grow 0.5s 1;
}

@media (max-width: 450px) {
  #bubbleTwo_p1 {
    right: 30px;
    top: 60rem;
    opacity: 0.7;
  }
}

@media (min-width: 451px) {
  #bubbleTwo_p1 {
    right: 30px;
    top: 60rem;
    opacity: 0.7;
  }
}

@media (min-width: 800px) {
  #bubbleTwo_p1 {
    right: 30px;
    top: 35rem;
    opacity: 0.7;
  }
}

@media (min-width: 1100px) {
  #bubbleTwo_p1 {
    top: 600px;
    right: 90px;
    opacity: 1;
  }
}

@media (min-width: 1700px) {
  #bubbleTwo_p1 {
    top: 60rem;
    right: 8rem;
  }
}

@media (min-width: 2900px) {
  #bubbleTwo_p1 {
    top: 100rem;
    width: 35rem;
    right: 20rem;
    padding: 2rem;
    font-size: 2.1rem;
  }
}

#bubbleThree_p1 {
  text-align: center;
  color: white;
  background: #566270;
  padding: 0.6rem;
  width: 18rem;
  display: none;
  border-radius: 5px;
  z-index: 3;
  position: absolute;
  top: 1190px;
  right: 400px;
  -webkit-animation: grow 0.5s 1;
          animation: grow 0.5s 1;
}

@media (max-width: 450px) {
  #bubbleThree_p1 {
    right: 30px;
    top: 90rem;
    opacity: 0.7;
  }
}

@media (min-width: 451px) {
  #bubbleThree_p1 {
    right: 30px;
    top: 90rem;
    opacity: 0.7;
  }
}

@media (min-width: 800px) {
  #bubbleThree_p1 {
    right: 30px;
    top: 65rem;
    opacity: 0.7;
  }
}

@media (min-width: 1100px) {
  #bubbleThree_p1 {
    top: 1190px;
    right: 400px;
    opacity: 1;
  }
}

@media (min-width: 1700px) {
  #bubbleThree_p1 {
    top: 118rem;
    right: 40rem;
  }
}

@media (min-width: 2900px) {
  #bubbleThree_p1 {
    top: 200rem;
    width: 35rem;
    right: 60rem;
    padding: 2rem;
    font-size: 2.1rem;
  }
}

@-webkit-keyframes grow {
  0% {
    -webkit-transform: scale(0);
            transform: scale(0);
  }
  50% {
    -webkit-transform: scale(1.2);
            transform: scale(1.2);
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}

@keyframes grow {
  0% {
    -webkit-transform: scale(0);
            transform: scale(0);
  }
  50% {
    -webkit-transform: scale(1.2);
            transform: scale(1.2);
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}
/*# sourceMappingURL=speechbubbles.css.map */