body {
  display: grid;
  place-items: center;
  height: 100vh;
  background-color: black;
}

img {
  position: relative;
}

h1 {
  font-family: sans-serif;
  font-weight: 400;
  color: black;
  background-color: yellow;
  padding: 2rem;
  border-radius: 4rem;
  position: absolute;
  top: -10rem;
  left: -10rem;
  text-align: center;
}

.bubble {
  background-color: yellow;
  border-radius: 4rem;
  position: absolute;
  width: 80px;
  height: 60px;
  top: 1rem;
  left: -2rem;
  border: 2px solid black;
}

.small-bubble {
  background-color: yellow;
  border-radius: 2rem;
  position: absolute;
  width: 40px;
  height: 30px;
  top: 5.5rem;
  left: 2rem;
  border: 2px solid black;
}

.container {
  position: relative;
  border: 5px solid red;
  background-color: white;
  outline-inset: 5px;
}

.bubble-group {
  display: none;
}

@media (max-width: 625px) {
  .small-bubble {
    top: 1.8rem;
    left: 3.5rem;
  }

  .medium-button {
    visibility: hidden;
  }

  h1 {
    left: -35px;
    top: -9rem;
    border: 2px solid black;
  }
}
