html,body{background-color:#ace7ff;font-size:62.5%;line-height:3rem;margin:0;display:flex;cursor:default;justify-content:center;align-items:center;height:100vh;width:100vw;padding:0}.main{vertical-align:middle;text-align:center;width:100%;height:100%;display:flex;flex-direction:column;justify-content:center}h1,h2{font-family:Montserrat,sans-serif;font-weight:600;text-align:center;text-transform:uppercase;letter-spacing:.25em;width:100%;z-index:10}h1{font-size:18px;font-size:2.8em;font-size:3.5vw;color:#00000080;top:14%}h2{bottom:1vh;font-size:10px;font-size:1.5rem;color:#00000059}h1 span{font-size:10.6vw;line-height:1em;z-index:100;text-shadow:.04em .04em 0 #fcfade;display:block}h1 span,h1 span:after{font-weight:600;color:#e17171;white-space:nowrap;display:inline-block;position:relative;letter-spacing:.16em}h1 span:after{color:#00000040;text-shadow:none;position:absolute;left:.08em;top:.08em;z-index:-1}span.one:after{content:"Will you"}span.two:after{content:"bee my"}span.three:after{content:"valentine?"}@media screen and (min-width: 880px){h1{font-size:2.5vw}h1 span{font-size:6vw}}.bee{-webkit-animation:hover 2s ease-in-out infinite;animation:hover 2s ease-in-out infinite}.bee-body{position:relative;margin:136px 130px 38px;min-width:130px;background:#ffca31;height:130px;width:130px;border-radius:50%;background-size:130px 65px,cover,cover,cover;background-image:linear-gradient(to bottom,transparent 50%,#292929 50%),radial-gradient(circle at 51% 36%,#ffd764 47%,transparent 47%),radial-gradient(circle at 51% 53%,#ffd764 55%,transparent 55%),radial-gradient(circle at 60% 53%,#ffebb1 60%,transparent 60%);box-shadow:35px -105px 0 -44px #ffd764,-35px -105px 0 -44px #ffd764,38px -107px 0 -41px #ffebb1,-32px -107px 0 -41px #ffebb1,35px -105px 0 -38px #ffca31,-35px -105px 0 -38px #ffca31,3px -95px 0 -18px #ffd764,5px -100px 0 -15px #ffebb1,0 -95px 0 -10px #ffca31,-35px -183px 0 -57px #363636,35px -183px 0 -57px #363636,-33px -185px 0 -56px #505050,37px -185px 0 -56px #505050,-35px -184px 0 -54px #292929,35px -184px 0 -54px #292929}.bee-body:after{position:absolute;content:"";background:linear-gradient(to bottom,transparent 50%,#363636 50%);height:130px;width:130px;right:0;bottom:0;background-size:130px 65px;border-radius:50%;-webkit-clip-path:ellipse(41% at 51% 48%);clip-path:ellipse(41% at 51% 48%)}.bee-body:before{position:absolute;content:"";background:linear-gradient(to bottom,transparent 50%,#434343 50%);height:130px;width:130px;right:0;bottom:0;background-size:130px 65px;border-radius:50%;-webkit-clip-path:ellipse(41% at 61% 48%);clip-path:ellipse(41% at 61% 48%)}.mouth{content:"";position:absolute;width:20px;height:20px;left:55px;bottom:128px;border-radius:0% 0% 50% 50%;box-sizing:border-box;border-bottom:5px solid #363636}.antenae{position:relative;z-index:-2;width:60px;height:60px;border-radius:50% 0% 0% 50%;right:-75px;bottom:130px;border:8px solid #363636;box-sizing:border-box;border-style:hidden hidden hidden solid;transform:skewY(-20deg)}.antenae:before{content:"";position:absolute;width:60px;height:60px;border-radius:0% 50% 50% 0%;left:-87px;bottom:30px;border:8px solid #363636;box-sizing:border-box;border-style:hidden solid hidden hidden;transform:skewY(40deg)}.antenae:after{transform:skewY(20deg);position:absolute;content:"";bottom:-213px;left:-33px;width:30px;height:30px;background:linear-gradient(to right,#292929 50%,#363636 50%);-webkit-clip-path:polygon(0 0,50% 100%,100% 0);clip-path:polygon(0 0,50% 100%,100% 0)}.bee-left{-webkit-animation:flight-left .5s ease-out infinite;animation:flight-left .5s ease-out infinite;content:"";position:absolute;background-color:#f8f8ff;height:100px;width:150px;bottom:110px;right:100px;border-radius:30px 130px 0;transform:skewY(20deg);z-index:-1;box-shadow:inset -10px 30px 0 10px #fff}.bee-left:after{-webkit-animation:flight-little .5s ease-in-out infinite;animation:flight-little .5s ease-in-out infinite;content:"";position:absolute;width:100px;height:110px;top:70px;left:48px;background-color:#f0f0f0;border-radius:50%/50% 0 100% 50%;box-shadow:inset 10px 1px #fff,inset 30px 7px #f6f6f6}.bee-right{-webkit-animation:flight-right .5s ease-in-out infinite;animation:flight-right .5s ease-in-out infinite;content:"";position:absolute;background-color:#f8f8ff;height:100px;width:150px;bottom:110px;left:100px;border-radius:130px 30px 130px 0;transform:skewY(-20deg);z-index:-1;box-shadow:inset 10px 30px 0 10px #fff}.bee-right:after{-webkit-animation:flight-little .5s ease-in-out infinite;animation:flight-little .5s ease-in-out infinite;content:"";position:absolute;width:100px;height:110px;top:70px;right:48px;background-color:#f0f0f0;border-radius:50%/0% 50% 50% 100%;box-shadow:inset -10px 1px #fff,inset -30px 7px #f6f6f6}.blink{position:relative}.blink:before{background-image:radial-gradient(circle at 71% 38%,#fff 8%,transparent 8%),radial-gradient(circle at 65% 50%,#363636 16%,transparent 16%),radial-gradient(circle at 69% 47%,#434343 19%,transparent 19%),radial-gradient(circle at 65% 50%,#292929 25%,transparent 25%),radial-gradient(ellipse at 50% 55%,#f8f8ff 50%,transparent 50%),radial-gradient(circle at 70% 50%,#fff 65%,transparent 65%);left:2px}.blink:before,.blink:after{-webkit-clip-path:ellipse(50% 20% at 50% 50%);clip-path:ellipse(50% 20% at 50% 50%);content:"";position:absolute;height:55px;width:55px;border-radius:50%;background-color:#f0f0f0;top:-67px;-webkit-animation:blink 10s linear infinite;animation:blink 10s linear infinite}.blink:after{background-image:radial-gradient(circle at 41% 38%,#fff 8%,transparent 8%),radial-gradient(circle at 35% 50%,#363636 16%,transparent 16%),radial-gradient(circle at 39% 47%,#434343 19%,transparent 19%),radial-gradient(circle at 35% 50%,#292929 25%,transparent 25%),radial-gradient(ellipse at 50% 55%,#f8f8ff 50%,transparent 50%),radial-gradient(circle at 70% 50%,#fff 65%,transparent 65%);left:73px}.wrapper{display:flex;flex-direction:column;align-items:center;justify-content:center}.shadow{height:45px;width:170px;border-radius:50%;background-color:#88badd;-webkit-animation:shadow 2s ease-in-out infinite;animation:shadow 2s ease-in-out infinite;margin:auto}@-webkit-keyframes blink{0%,9%,11%,30%,32%,33%,35%,54%,56%,79%,81%,to{-webkit-clip-path:ellipse(50% 50% at 50% 50%);clip-path:ellipse(50% 50% at 50% 50%)}10%,31%,34%,55%,80%{-webkit-clip-path:ellipse(50% 5% at 50% 50%);clip-path:ellipse(50% 5% at 50% 50%)}}@keyframes blink{0%,9%,11%,30%,32%,33%,35%,54%,56%,79%,81%,to{-webkit-clip-path:ellipse(50% 50% at 50% 50%);clip-path:ellipse(50% 50% at 50% 50%)}10%,31%,34%,55%,80%{-webkit-clip-path:ellipse(50% 5% at 50% 50%);clip-path:ellipse(50% 5% at 50% 50%)}}@-webkit-keyframes hover{0%,to{transform:translateY(0)}50%{transform:translateY(-15px)}}@keyframes hover{0%,to{transform:translateY(0)}50%{transform:translateY(-15px)}}@-webkit-keyframes shadow{0%,to{width:170px}50%{width:180px}}@keyframes shadow{0%,to{width:170px}50%{width:180px}}@-webkit-keyframes flight-left{0%,to{width:150px;transform:skewY(20deg)}50%{width:125px;transform:skewY(25deg)}}@keyframes flight-left{0%,to{width:150px;transform:skewY(20deg)}50%{width:125px;transform:skewY(25deg)}}@-webkit-keyframes flight-right{0%,to{width:150px;transform:skewY(-20deg)}50%{width:125px;transform:skewY(-25deg)}}@keyframes flight-right{0%,to{width:150px;transform:skewY(-20deg)}50%{width:125px;transform:skewY(-25deg)}}@-webkit-keyframes flight-little{0%,to{height:110px}50%{height:100px}}@keyframes flight-little{0%,to{height:110px}50%{height:100px}}@-webkit-keyframes wobble{0%,50%,to{transform:rotate(0)}25%{transform:rotate(10deg)}75%{transform:rotate(-10deg)}}@keyframes wobble{0%,50%,to{transform:rotate(0)}25%{transform:rotate(10deg)}75%{transform:rotate(-10deg)}}#falling-hearts{animation:wobble 60s ease-in infinite;position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none}.heart{pointer-events:none;opacity:0;z-index:1000;position:fixed}.text-show{opacity:1;transition:all 2s ease}.text-fade{opacity:0;transition:all 2s ease}