svg.texteffect(xmlns='http://www.w3.org/2000/svg',version='1.1',viewBox='0 0 1600 600',preserveAspectRatio='xMidYMid meet',style='height:80%;width:80%;')
  defs
    radialGradient#shadowGrad(color-interpolation='sRGB')
      stop(offset='0%',stop-color='#000',stop-opacity=0.4)
      stop(offset='50%',stop-color='#000',stop-opacity=0.25)
      stop(offset='95%',stop-color='#000',stop-opacity=0)
    linearGradient#textGrad(x1=0,y1=0,x2=0,y2=1,color-interpolation='sRGB')
      stop(offset='0%',stop-color='#cef5db',stop-opacity=1)
      stop(offset='100%',stop-color='#15a960',stop-opacity=1)
    radialGradient#topRadial(color-interpolation='sRGB')
      stop(offset='0%',stop-color='#88ff00',stop-opacity=1)
      stop(offset='95%',stop-color='#888000',stop-opacity=1)
    radialGradient#botRadial(color-interpolation='sRGB')
      stop(offset='0%',stop-color='#880000',stop-opacity=1)
      stop(offset='95%',stop-color='#888000',stop-opacity=1)
    g#dispMap
      rect(x=0,y=0,width=1600,height=600,fill='#888000')
      ellipse#topDisp(cx=800,cy=0,rx=800,ry=300,fill='url(#topRadial)')
      ellipse#botDisp(cx=800,cy=600,rx=800,ry=300,fill='url(#botRadial)')
    filter#lungs(x=0,y=0,width=1600,height=600,filterUnits='userSpaceOnUse',primitiveUnits='userSpaceOnUse',color-interpolation-filters='sRGB')
      feImage(result='map',xlink:href='#dispMap')
      feDisplacementMap(result='bulge',in='SourceGraphic',in2='map',scale='300',xChannelSelector='R',yChannelSelector='G')
      feGaussianBlur(in='bulge',stdDeviation=25)
      feColorMatrix(result='border',type='matrix',values='0 0 0 0 .105  0 0 0 0 .512  0 0 0 0 .297  0 0 0 60 -3')
      feMerge
        feMergeNode(in='border')
        feMergeNode(in='bulge')
  ellipse(cx=780,cy=520,rx=750,ry=80,fill='url(#shadowGrad)')
  text(x=800,y=400,text-anchor='middle',fill='url(#textGrad)',font-family='Baloo Bhaina',font-size=300,filter='url(#lungs)') BREATHE

html, body {
  width: 100%;
  height: 100%;
}
body {
  overflow: hidden;
  background: linear-gradient(#faffb1,#a1ffce);
}
.texteffect {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

@keyframes respirationRhythm { // breathe in 3, hold 2, release 6
  0%   { opacity: 0; }
  9%   { opacity: 0; }
  27%  { opacity: 1; }
  45%  { opacity: 0.92; }
  54%  { opacity: 1; animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); }
  81%  { opacity: 0; }
  100% { opacity: 0; }
}
#topDisp, #botDisp {
  animation: respirationRhythm 11s infinite;
  animation-timing-function: cubic-bezier(0.165, 0.840, 0.440, 1.000);
}

// no JS
// built for Chrome -- probably won't work right on other browsers