/* Essential CSS - Makes the effect work */
.bubbles {
   display: inline-block;
   font-family: arial;
   position: relative;                                                                                       0
}
.bubbles h1 {
  color: #FFFFFF;
  font-size: 41px;
  padding: 0px 0px 0px 20px;
  font-family: "Trebuchet MS",verdana,arial,helvetica,sans-serif;
  font-style: italic;
  text-shadow: 1px 1px #FF8000, 2px 2px #FF8000, 3px 3px #FF8000;
  -webkit-transition: all 0.12s ease-out;
  -moz-transition: all 0.12s ease-out;
  -o-transition: all 0.12s ease-out;
   position: relative;
   margin: 1em 0 0;
   z-index: 2;
}
.individual-bubble {
   position: absolute;
   border-radius: 100%;
   bottom: 10px;
   background-color: #fff;
   z-index: 1;
}

/*****************Besonderheiten für Bildschirmgroesse max. 480px***********************/

@media (max-width: 480px) {
   .bubbles h1 {
      font-size: 30px;
   }
}