.title-text{color:#707070;cursor:default;-webkit-user-select:none;user-select:none;-webkit-text-fill-color:transparent;background:linear-gradient(#707070,#707070 50%,#df6969 80%,#e21d1d 100%) 0 0/auto 30rem;-webkit-background-clip:text;background-clip:text;font-family:Poiret One,cursive;font-size:4rem;font-weight:300;transition-property:background-position;transition-duration:10s;position:fixed;top:20%;left:10%}.title-text:after{content:"";transform-origin:0 0;background:#707070;width:100%;height:2px;transition:transform .5s;position:absolute;top:5rem;left:0;transform:scaleX(0)}@media (orientation:portrait){.App :is(){top:6.2rem}}.title-text:hover{background-position:0 -25rem}.title-text:hover .fire-container{transition-property:transform;transition-delay:calc(var(--i) * .1s);transition-duration:1s;transform:scale(1)}.title-text:hover:after{transform:scale(1)}@media (orientation:portrait){.App .title-text{transform-origin:0 100%;background-size:auto 35rem;font-size:5rem;top:0;left:5%;transform:rotate(90deg)}}.fires{margin-top:1rem;display:flex}.fires .fire{background:#df6969;border-radius:0% 100% 50% 50%/0% 50% 50% 100%;width:1rem;height:1rem;animation-name:fireFlick;animation-duration:.1s;animation-timing-function:ease;animation-iteration-count:infinite;animation-direction:alternate;animation-delay:0s;animation-fill-mode:none}.fires>div{width:1rem;height:1rem;margin:0 .4rem}@media (orientation:portrait){.App :is(.fires>div){margin:0 .6rem}}.fire-container{transition-delay:calc(1s - var(--i) * .1s);transition-property:transform;transition-duration:.2s;transform:scale(0)}@keyframes fireFlick{0%{transform:rotate(45deg)skew(6deg)}to{transform:rotate(45deg)skewY(6deg)}}
