.bubble-container{overflow:hidden;position:relative}.bubble{border-radius:50%;content:"";filter:blur(80px);pointer-events:none;position:absolute;z-index:0}.bubble--small{filter:blur(60px);height:600px;width:600px}.bubble--medium{filter:blur(80px);height:1000px;width:1000px}.bubble--large{filter:blur(100px);height:1200px;width:1200px}.bubble--gray{background:radial-gradient(circle,hsla(240,8%,47%,.25) 0,hsla(240,9%,55%,.12) 50%,transparent 70%);opacity:.55}.bubble--blue{background:radial-gradient(circle,rgba(0,85,255,.2) 0,rgba(0,85,255,.1) 50%,transparent 70%);opacity:.5}.bubble--green{background:radial-gradient(circle,rgba(0,221,170,.2) 0,rgba(0,221,170,.1) 50%,transparent 70%);opacity:.5}.bubble--white{background:radial-gradient(circle,hsla(0,0%,100%,.1) 0,hsla(0,0%,100%,.05) 50%,transparent 70%);opacity:.4}.bubble--top-left{left:-20%;top:-20%}.bubble--top-right{right:-20%;top:-20%}.bubble--bottom-left{bottom:-15%;left:-15%}.bubble--bottom-right{bottom:-15%;right:-15%}.bubble--center{left:50%;top:50%;transform:translate(-50%,-50%)}.bubble--float-1{animation:floatBubble1 25s ease-in-out infinite}.bubble--float-2{animation:floatBubble2 30s ease-in-out infinite}.bubble--float-3{animation:floatBubble3 35s ease-in-out infinite}@keyframes floatBubble3{0%,to{transform:translate(0) scale(1)}20%{transform:translate(25px,30px) scale(1.05)}40%{transform:translate(-30px,-20px) scale(.95)}60%{transform:translate(35px,-25px) scale(1.1)}80%{transform:translate(-20px,35px) scale(.98)}}body.blue-mode .bubble--blue,body.blue-mode .bubble--gray,body.blue-mode .bubble--green{background:radial-gradient(circle,hsla(0,0%,100%,.1) 0,hsla(0,0%,100%,.05) 50%,transparent 70%)}