breath.html

<style>
  .universe{
    background-color: hsl(10, 50%, 80%);
    position: fixed;
    height: 100%;
    width: 100%;
  }

  .lungs{
    background-color: hsl(0, 60%, 40%);
    position: absolute;
    margin: auto;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    height: 50vw;
    width: 50vw;
    border-radius: 50%;
    animation-name: lungsAnimation;
    animation-duration: 14s;
    animation-iteration-count: infinite;
    animation-timing-function: cubic-bezier(0.4, 0.2, 0.6, .99);
  }
  @keyframes lungsAnimation {
    0% {transform: scale(1);}
    50% {transform: scale(1.5);
      background-color: hsl(0, 60%, 60%);
    }
}
  body{
    overflow-x: hidden;
    overflow-y: hidden;
  }
</style>

<div class="universe"></div>
<div class="lungs"></div>
<div class="backLungs"></div>