body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;margin:0}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.App{grid-row-gap:1rem;display:grid;grid-template-columns:repeat(3,1fr);padding:2rem;row-gap:1rem;text-align:center}@media screen and (max-width:1180px){.App{grid-template-columns:repeat(2,1fr);padding:0}}@media screen and (max-width:480px){.App{grid-template-columns:repeat(1,1fr);padding:5px}}.details{display:flex;flex-direction:row;justify-content:space-between;padding:10px 0;width:400px}.details p{font-size:14px;margin-left:10px}.details .action{color:#083e73;font-weight:600}.details .CodePenIcon{color:#000;height:20px;margin-right:10px;width:20px}.details .CodePenIcon:hover{color:#083e73;-webkit-transform:scale(1.1);transform:scale(1.1)}.frame{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;align-items:center;border-radius:10px;box-shadow:4px 8px 16px 0 rgba(0,0,0,.2);font-family:Open Sans,Helvetica,sans-serif;height:400px;justify-content:center;overflow:hidden;width:400px}.day-1-frame{background:linear-gradient(45deg,#433aa0 35%,#4dc0c8)}.day-1-center{align-items:center;color:#fff;flex-direction:column;font-family:Courier New,Courier,sans-serif;position:relative;top:25%}.day-1-center,.numbers{display:flex;justify-content:center}.numbers{flex-direction:row;gap:-10}.one-pip{height:35px;margin-right:-5px;margin-top:2px;-webkit-transform:rotate(45deg);transform:rotate(45deg);width:19px;z-index:2}.one,.one-pip{background-color:#fff;border-radius:3px;box-shadow:2px 2px 11px 2px rgba(1,0,0,.3)}.one{height:100px;width:25px;z-index:3}.zero-first{margin-left:-10px;z-index:2}.zero-first,.zero-second{border:25px solid #fff;border-radius:50px;box-shadow:2px 2px 11px 2px rgba(1,0,0,.3);height:50px;width:50px}.zero-second{margin-left:-15px;z-index:1}.letters{display:flex;flex-direction:column;justify-content:center;margin:0;text-align:center;text-transform:full-width}h2{font-size:85px}h2,p{margin:0}p{font-size:25px}.day-2-frame{background:#630079}.day-2-center{align-items:center;color:#fff;justify-content:center;left:50%;position:relative;top:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}#menu,.day-2-center{display:flex;flex-direction:column}#menu{align-items:stretch;height:60px;justify-content:space-between;width:80px}#menu.active .line-1{-webkit-animation:animate-line-1 .7s cubic-bezier(.3,1,.7,1) forwards;animation:animate-line-1 .7s cubic-bezier(.3,1,.7,1) forwards}#menu.active .line-2{-webkit-animation:animate-line-2 .7s cubic-bezier(.3,1,.7,1) forwards;animation:animate-line-2 .7s cubic-bezier(.3,1,.7,1) forwards}#menu.active .line-3{-webkit-animation:animate-line-3 .7s cubic-bezier(.3,1,.7,1) forwards;animation:animate-line-3 .7s cubic-bezier(.3,1,.7,1) forwards}#menu.not-active .line-1{-webkit-animation:animate-line-1-back .7s cubic-bezier(.3,1,.7,1) forwards;animation:animate-line-1-back .7s cubic-bezier(.3,1,.7,1) forwards}#menu.not-active .line-2{-webkit-animation:animate-line-2-back .7s cubic-bezier(.3,1,.7,1) forwards;animation:animate-line-2-back .7s cubic-bezier(.3,1,.7,1) forwards}#menu.not-active .line-3{-webkit-animation:animate-line-3-back .7s cubic-bezier(.3,1,.7,1) forwards;animation:animate-line-3-back .7s cubic-bezier(.3,1,.7,1) forwards}.line-1,.line-2,.line-3{background-color:#fff;border-radius:3px;box-shadow:0 2px 10px 0 rgba(0,0,0,.3);height:8px;width:100%}@-webkit-keyframes animate-line-1{0%{-webkit-transform:translateZ(0) rotate(0deg);transform:translateZ(0) rotate(0deg)}50%{-webkit-transform:translate3d(0,25px,0) rotate(0deg);transform:translate3d(0,25px,0) rotate(0deg)}to{-webkit-transform:translate3d(0,25px,0) rotate(45deg);transform:translate3d(0,25px,0) rotate(45deg)}}@keyframes animate-line-1{0%{-webkit-transform:translateZ(0) rotate(0deg);transform:translateZ(0) rotate(0deg)}50%{-webkit-transform:translate3d(0,25px,0) rotate(0deg);transform:translate3d(0,25px,0) rotate(0deg)}to{-webkit-transform:translate3d(0,25px,0) rotate(45deg);transform:translate3d(0,25px,0) rotate(45deg)}}@-webkit-keyframes animate-line-1-back{0%{-webkit-transform:translate3d(0,25px,0) rotate(45deg);transform:translate3d(0,25px,0) rotate(45deg)}50%{-webkit-transform:translate3d(0,25px,0) rotate(0deg);transform:translate3d(0,25px,0) rotate(0deg)}to{-webkit-transform:translateZ(0) rotate(0deg);transform:translateZ(0) rotate(0deg)}}@keyframes animate-line-1-back{0%{-webkit-transform:translate3d(0,25px,0) rotate(45deg);transform:translate3d(0,25px,0) rotate(45deg)}50%{-webkit-transform:translate3d(0,25px,0) rotate(0deg);transform:translate3d(0,25px,0) rotate(0deg)}to{-webkit-transform:translateZ(0) rotate(0deg);transform:translateZ(0) rotate(0deg)}}@-webkit-keyframes animate-line-2{0%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}to{opacity:0;-webkit-transform:scale(0);transform:scale(0)}}@keyframes animate-line-2{0%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}to{opacity:0;-webkit-transform:scale(0);transform:scale(0)}}@-webkit-keyframes animate-line-2-back{0%{opacity:0;-webkit-transform:scale(0);transform:scale(0)}to{opacity:1;-webkit-transform:scale(1);transform:scale(1)}}@keyframes animate-line-2-back{0%{opacity:0;-webkit-transform:scale(0);transform:scale(0)}to{opacity:1;-webkit-transform:scale(1);transform:scale(1)}}@-webkit-keyframes animate-line-3{0%{-webkit-transform:translateZ(0) rotate(0deg);transform:translateZ(0) rotate(0deg)}50%{-webkit-transform:translate3d(0,-25px,0) rotate(0deg);transform:translate3d(0,-25px,0) rotate(0deg)}to{-webkit-transform:translate3d(0,-25px,0) rotate(135deg);transform:translate3d(0,-25px,0) rotate(135deg)}}@keyframes animate-line-3{0%{-webkit-transform:translateZ(0) rotate(0deg);transform:translateZ(0) rotate(0deg)}50%{-webkit-transform:translate3d(0,-25px,0) rotate(0deg);transform:translate3d(0,-25px,0) rotate(0deg)}to{-webkit-transform:translate3d(0,-25px,0) rotate(135deg);transform:translate3d(0,-25px,0) rotate(135deg)}}@-webkit-keyframes animate-line-3-back{0%{-webkit-transform:translate3d(0,-25px,0) rotate(135deg);transform:translate3d(0,-25px,0) rotate(135deg)}50%{-webkit-transform:translate3d(0,-25px,0) rotate(0deg);transform:translate3d(0,-25px,0) rotate(0deg)}to{-webkit-transform:translateZ(0) rotate(0deg);transform:translateZ(0) rotate(0deg)}}@keyframes animate-line-3-back{0%{-webkit-transform:translate3d(0,-25px,0) rotate(135deg);transform:translate3d(0,-25px,0) rotate(135deg)}50%{-webkit-transform:translate3d(0,-25px,0) rotate(0deg);transform:translate3d(0,-25px,0) rotate(0deg)}to{-webkit-transform:translateZ(0) rotate(0deg);transform:translateZ(0) rotate(0deg)}}.day-4-frame{background:#d9760c;color:#333}.day-4-center{height:90px;left:50%;position:relative;top:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);width:90px}.circle{background:#fff;border-radius:50%;position:absolute}.big{-webkit-animation:pulseBig 5s ease-in-out infinite;animation:pulseBig 5s ease-in-out infinite;height:90px;width:90px}.medium{-webkit-animation:pulseMedium 5s ease-in-out infinite;animation:pulseMedium 5s ease-in-out infinite;background:#b2dfdb;height:60px;left:15px;top:15px;-webkit-transform:translate(-30px,-30px);transform:translate(-30px,-30px);width:60px}.small{-webkit-animation:pulseSmall 5s ease-in-out infinite;animation:pulseSmall 5s ease-in-out infinite;background:#80cbc4;height:30px;left:30px;top:30px;-webkit-transform:translate(-15px,-15px);transform:translate(-15px,-15px);width:30px}@-webkit-keyframes pulseBig{0%{box-shadow:2px 2px 3px 2px rgba(0,0,0,.2);-webkit-transform:scale(0);transform:scale(0)}30%,70%{box-shadow:10px 10px 15px 0 rgba(0,0,0,.3);-webkit-transform:scale(1);transform:scale(1)}to{box-shadow:2px 2px 3px 2px rgba(0,0,0,.2);-webkit-transform:scale(0);transform:scale(0)}}@keyframes pulseBig{0%{box-shadow:2px 2px 3px 2px rgba(0,0,0,.2);-webkit-transform:scale(0);transform:scale(0)}30%,70%{box-shadow:10px 10px 15px 0 rgba(0,0,0,.3);-webkit-transform:scale(1);transform:scale(1)}to{box-shadow:2px 2px 3px 2px rgba(0,0,0,.2);-webkit-transform:scale(0);transform:scale(0)}}@-webkit-keyframes pulseMedium{0%,20%{box-shadow:2px 2px 3px 2px rgba(0,0,0,.2);-webkit-transform:scale(0);transform:scale(0)}40%,60%{box-shadow:10px 10px 15px 0 rgba(0,0,0,.3);-webkit-transform:scale(1);transform:scale(1)}80%,to{box-shadow:2px 2px 3px 2px rgba(0,0,0,.2);-webkit-transform:scale(0);transform:scale(0)}}@keyframes pulseMedium{0%,20%{box-shadow:2px 2px 3px 2px rgba(0,0,0,.2);-webkit-transform:scale(0);transform:scale(0)}40%,60%{box-shadow:10px 10px 15px 0 rgba(0,0,0,.3);-webkit-transform:scale(1);transform:scale(1)}80%,to{box-shadow:2px 2px 3px 2px rgba(0,0,0,.2);-webkit-transform:scale(0);transform:scale(0)}}@-webkit-keyframes pulseSmall{0%,25%{box-shadow:2px 2px 3px 2px rgba(0,0,0,.2);-webkit-transform:scale(0);transform:scale(0)}50%{box-shadow:10px 10px 15px 0 rgba(0,0,0,.3);-webkit-transform:scale(1);transform:scale(1)}75%,to{box-shadow:2px 2px 3px 2px rgba(0,0,0,.2);-webkit-transform:scale(0);transform:scale(0)}}@keyframes pulseSmall{0%,25%{box-shadow:2px 2px 3px 2px rgba(0,0,0,.2);-webkit-transform:scale(0);transform:scale(0)}50%{box-shadow:10px 10px 15px 0 rgba(0,0,0,.3);-webkit-transform:scale(1);transform:scale(1)}75%,to{box-shadow:2px 2px 3px 2px rgba(0,0,0,.2);-webkit-transform:scale(0);transform:scale(0)}}.day-3-frame{background:#000;color:#fff;position:relative}.day-3-center{left:50%;position:absolute;top:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.window{border-radius:50%;height:180px;overflow:hidden;position:relative;width:180px}.window .sky{-webkit-animation:sky-goes-dark 4s linear infinite;animation:sky-goes-dark 4s linear infinite;background:#84ffff;height:120px;top:0;z-index:0}.window .sand,.window .sky{left:0;position:absolute;right:0;width:100%}.window .sand{-webkit-animation:sand-goes-dark 4s linear infinite;animation:sand-goes-dark 4s linear infinite;background:#ffe57f;bottom:0;height:60px;z-index:1}.window .sun{-webkit-animation:sun-circle 4s linear infinite;animation:sun-circle 4s linear infinite;background:#ffea00;border-radius:50%;height:30px;left:73px;position:absolute;top:7px;-webkit-transform-origin:50% 400%;transform-origin:50% 400%;width:30px;z-index:2}.window .pyramid-left{-webkit-animation:pyramid-left-goes-dark 4s linear infinite;animation:pyramid-left-goes-dark 4s linear infinite;background:#f4f4f4;-webkit-clip-path:polygon(0 100%,100% 100%,50% 0);clip-path:polygon(0 100%,100% 100%,50% 0);left:40px;width:110px}.window .pyramid-left,.window .pyramid-right{bottom:60px;height:60px;position:absolute;z-index:2}.window .pyramid-right{-webkit-animation:pyramid-right-goes-dark 4s linear infinite;animation:pyramid-right-goes-dark 4s linear infinite;background:#c2c2c2;-webkit-clip-path:polygon(33% 100%,100% 100%,0 0);clip-path:polygon(33% 100%,100% 100%,0 0);right:31px;width:55px}.window .shadow{-webkit-animation:shadow-circle 4s linear infinite;animation:shadow-circle 4s linear infinite;background:#7d786a;-webkit-clip-path:polygon(50% 50%,0 0,100% 0);clip-path:polygon(50% 50%,0 0,100% 0);height:30px;left:40px;position:absolute;top:120px;width:110px;z-index:2}@-webkit-keyframes sun-circle{0%{background:#ff9100;-webkit-transform:rotate(-70deg);transform:rotate(-70deg)}30%{background:#ffef00;-webkit-transform:rotate(-28deg);transform:rotate(-28deg)}70%{background:#ffef00}to{background:#ff9100;-webkit-transform:rotate(70deg);transform:rotate(70deg)}}@keyframes sun-circle{0%{background:#ff9100;-webkit-transform:rotate(-70deg);transform:rotate(-70deg)}30%{background:#ffef00;-webkit-transform:rotate(-28deg);transform:rotate(-28deg)}70%{background:#ffef00}to{background:#ff9100;-webkit-transform:rotate(70deg);transform:rotate(70deg)}}@-webkit-keyframes sky-goes-dark{0%{background:#111}30%{background:#84ffff}70%{background:#9fa8da}to{background:#111}}@keyframes sky-goes-dark{0%{background:#111}30%{background:#84ffff}70%{background:#9fa8da}to{background:#111}}@-webkit-keyframes sand-goes-dark{0%{background:#111}30%{background:#ffe57f}70%{background:#a1887f}to{background:#111}}@keyframes sand-goes-dark{0%{background:#111}30%{background:#ffe57f}70%{background:#a1887f}to{background:#111}}@-webkit-keyframes shadow-circle{0%{background:#111;-webkit-clip-path:polygon(100% 0,0 0,100% 0);clip-path:polygon(100% 0,0 0,100% 0)}30%{background:#7d786a;-webkit-clip-path:polygon(100% 60%,0 0,100% 0);clip-path:polygon(100% 60%,0 0,100% 0)}70%{background:#7d786a;-webkit-clip-path:polygon(0 60%,0 0,100% 0);clip-path:polygon(0 60%,0 0,100% 0)}to{background:#111;-webkit-clip-path:polygon(0 0,0 0,100% 0);clip-path:polygon(0 0,0 0,100% 0)}}@keyframes shadow-circle{0%{background:#111;-webkit-clip-path:polygon(100% 0,0 0,100% 0);clip-path:polygon(100% 0,0 0,100% 0)}30%{background:#7d786a;-webkit-clip-path:polygon(100% 60%,0 0,100% 0);clip-path:polygon(100% 60%,0 0,100% 0)}70%{background:#7d786a;-webkit-clip-path:polygon(0 60%,0 0,100% 0);clip-path:polygon(0 60%,0 0,100% 0)}to{background:#111;-webkit-clip-path:polygon(0 0,0 0,100% 0);clip-path:polygon(0 0,0 0,100% 0)}}@-webkit-keyframes pyramid-left-goes-dark{0%{background:#111}30%{background:#f4f4f4}70%{background:#c2c2c2}to{background:#111}}@keyframes pyramid-left-goes-dark{0%{background:#111}30%{background:#f4f4f4}70%{background:#c2c2c2}to{background:#111}}@-webkit-keyframes pyramid-right-goes-dark{0%{background:#111}30%{background:#c2c2c2}70%{background:#f4f4f4}to{background:#111}}@keyframes pyramid-right-goes-dark{0%{background:#111}30%{background:#c2c2c2}70%{background:#f4f4f4}to{background:#111}}.day-5-frame{background:#4db6ac;color:#333}.day-5-frame .day-5-report-card{background:#fff;border-radius:10px;color:#333;height:220px;left:50%;overflow:hidden;position:relative;top:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);width:280px}.day-5-frame .day-5-report-card .report-header{background:#ffb74d;color:#fff;height:60px;width:280px}.day-5-frame .day-5-report-card .report-header .title{font-size:14px;font-weight:600;left:15px;position:absolute;text-transform:uppercase;top:12px}.day-5-frame .day-5-report-card .report-header .date{font-size:12px;font-weight:200;left:15px;position:absolute;top:30px}.day-5-frame .day-5-report-card .report-header .type{font-size:12px;font-weight:200;position:absolute;right:15px;top:12px}.day-5-frame .day-5-report-card .report-header .value{font-size:14px;font-weight:600;position:absolute;right:15px;top:30px}.day-5-frame .day-5-report-card .report-params{padding:10px 0 14px;text-align:right}.day-5-frame .day-5-report-card .report-params span{color:#606060;font-size:9px;line-height:13px;padding:0 10px 0 25px}.day-5-frame .day-5-report-card .report-params span:before{border-radius:3px;content:"";display:inline-block;height:3px;margin-bottom:2px;margin-right:6px;width:11px}.day-5-frame .day-5-report-card .report-params .red:before{background:#fa7373}.day-5-frame .day-5-report-card .report-params .blue:before{background:#1976d2}.day-5-frame .day-5-report-card .report-graph{height:82px;padding-left:10px;padding-right:10px;position:relative;width:280px}.day-5-frame .day-5-report-card .report-graph .line-1,.day-5-frame .day-5-report-card .report-graph .line-2,.day-5-frame .day-5-report-card .report-graph .line-3{background:#cfd8dc;display:block;height:1px;position:absolute;width:260px}.day-5-frame .day-5-report-card .report-graph .line-1{top:0}.day-5-frame .day-5-report-card .report-graph .line-2{top:40px}.day-5-frame .day-5-report-card .report-graph .line-3{top:80px}.day-5-frame .day-5-report-card .report-graph .graph svg{bottom:0;left:10px;position:absolute;right:0;top:0}.day-5-frame .day-5-report-card .report-graph .graph svg polyline{fill:none;stroke-width:2;stroke-linecap:round}.day-5-frame .day-5-report-card .report-graph .graph.blue svg polyline{stroke:#1976d2}.day-5-frame .day-5-report-card .report-graph .graph.red svg polyline{stroke:#fa7373}.day-5-frame .day-5-report-card .report-graph .point{border-radius:50%;cursor:pointer;height:6px;position:absolute;width:6px;z-index:10}.day-5-frame .day-5-report-card .report-graph .point:hover .tooltip{-webkit-transform:translate3d(-50%,0,0);transform:translate3d(-50%,0,0);visibility:visible}.day-5-frame .day-5-report-card .report-graph .point.mon{left:15px}.day-5-frame .day-5-report-card .report-graph .point.tue{left:57px}.day-5-frame .day-5-report-card .report-graph .point.wed{left:98px}.day-5-frame .day-5-report-card .report-graph .point.thur{left:138px}.day-5-frame .day-5-report-card .report-graph .point.fri{left:177px}.day-5-frame .day-5-report-card .report-graph .point.sat{left:218px}.day-5-frame .day-5-report-card .report-graph .point.sun{left:257px}.day-5-frame .day-5-report-card .report-graph .red .point{background:#fa7373}.day-5-frame .day-5-report-card .report-graph .red .point.mon{bottom:32px}.day-5-frame .day-5-report-card .report-graph .red .point.tue{bottom:66px}.day-5-frame .day-5-report-card .report-graph .red .point.wed{bottom:56px}.day-5-frame .day-5-report-card .report-graph .red .point.thur{bottom:68px}.day-5-frame .day-5-report-card .report-graph .red .point.fri{bottom:42px}.day-5-frame .day-5-report-card .report-graph .red .point.sat{bottom:32px}.day-5-frame .day-5-report-card .report-graph .red .point.sun{bottom:59px}.day-5-frame .day-5-report-card .report-graph .blue .point{background:#1976d2}.day-5-frame .day-5-report-card .report-graph .blue .point.mon{bottom:18px}.day-5-frame .day-5-report-card .report-graph .blue .point.tue{bottom:28px}.day-5-frame .day-5-report-card .report-graph .blue .point.wed{bottom:14px}.day-5-frame .day-5-report-card .report-graph .blue .point.thur{bottom:24px}.day-5-frame .day-5-report-card .report-graph .blue .point.fri{bottom:18px}.day-5-frame .day-5-report-card .report-graph .blue .point.sat{bottom:5px}.day-5-frame .day-5-report-card .report-graph .blue .point.sun{bottom:15px}.day-5-frame .day-5-report-card .report-graph .tooltip{bottom:15px;-webkit-clip-path:polygon(0 0,100% 0,100% 75%,70% 76%,50% 100%,30% 76%,0 75%);clip-path:polygon(0 0,100% 0,100% 75%,70% 76%,50% 100%,30% 76%,0 75%);color:#fff;font-size:11px;font-weight:600;height:18px;left:50%;padding:6px;position:absolute;-webkit-transform:translate3d(-50%,10px,0);transform:translate3d(-50%,10px,0);transition:-webkit-transform .4s ease-out;transition:transform .4s ease-out;transition:transform .4s ease-out,-webkit-transform .4s ease-out;visibility:hidden}.day-5-frame .day-5-report-card .report-graph .red .tooltip{background:#fa7373}.day-5-frame .day-5-report-card .report-graph .blue .tooltip{background:#1976d2}.day-5-frame .day-5-report-card .report-days{margin:0 auto;width:280px}.day-5-frame .day-5-report-card .report-days .day{color:#949494;display:block;float:left;font-size:9px;line-height:30px;text-align:center;text-transform:uppercase;width:14.2857142857%}.frame-day-6{background:linear-gradient(to top right,#f6ea71,#01892e);color:#786450}.center-day-6{background:#fff;border-radius:3px;box-shadow:10px 10px 15px 0 rgba(0,0,0,.4);display:flex;flex-direction:row;height:300px;left:50px;overflow:hidden;position:relative;top:50px;width:300px}.center-day-6 .profile{align-items:center;display:flex;flex-direction:column;height:300px;justify-content:center;width:200px}.center-day-6 .profile .profile-picture{cursor:pointer;height:100px;margin:38px auto 0;position:relative}.center-day-6 .profile .profile-picture:hover .frame-circle-1{-webkit-transform:rotate(1turn);transform:rotate(1turn)}.center-day-6 .profile .profile-picture:hover .frame-circle-2{-webkit-transform:rotate(-1turn);transform:rotate(-1turn)}.center-day-6 .profile .profile-picture .frame-circle-1{border:1px solid #786450;border-left-color:transparent;border-radius:50%;height:82px;left:-7px;position:absolute;top:-7px;transition:all 1.5s ease-in-out;width:82px}.center-day-6 .profile .profile-picture .frame-circle-2{border:1px solid #786450;border-radius:50%;border-right-color:transparent;height:76px;left:-4px;position:absolute;top:-4px;transition:all 1.5s ease-in-out;width:76px}.center-day-6 .profile .profile-picture .profile-img{border-radius:50%;height:70ps;width:70px}.center-day-6 .profile .profile-name{font-size:15px;font-weight:600}.center-day-6 .profile .profile-job{font-size:12px}.center-day-6 .profile .profile-buttons{align-items:center;display:flex;flex-direction:column;margin-bottom:30px;margin-top:30px;position:relative;row-gap:10px}.center-day-6 .profile .profile-buttons .profile-btn{background:none;border:1px solid #786450;border-radius:15px;box-sizing:border-box;cursor:pointer;display:block;font-size:12px;font-weight:600;height:30px;padding:5px;text-align:center;width:120px}.center-day-6 .profile .profile-buttons .profile-btn:hover{background:#786450;color:#fff}.center-day-6 .stats{display:flex;flex-direction:column;height:300px;row-gap:2px;width:100px}.center-day-6 .stats .stats-box{align-items:center;background:#f5e8df;cursor:pointer;display:flex;flex-direction:column;height:99px;justify-content:center;transition:.5s ease-in-out;width:100px}.center-day-6 .stats .stats-box:hover{background:#d7ccc8}.center-day-6 .stats .stats-box .stats-value{font-size:20px;font-weight:600}.center-day-6 .stats .stats-box .stats-name{font-size:12px;justify-content:center}.day-7-frame{background:#264057;color:#666}.day-7-frame .day-7-center{background:#fff;border-radius:5px;box-shadow:10px 10px 15px 0 rgba(0,0,0,.4);display:block;height:300px;left:50px;overflow:hidden;position:relative;top:50px;transition:all .4s ease-in-out;width:300px;z-index:2}.day-7-frame .day-7-center.active{-webkit-transform:translate(50%);transform:translate(50%)}.day-7-frame .day-7-center .day-7-header{align-items:center;background:#6596d1;color:#fff;display:flex;flex-direction:row;height:60px;justify-content:space-between;width:300px}.day-7-frame .day-7-center .day-7-header .day-7-menu-icon{cursor:pointer;height:30px;margin-left:20px;width:30px}.day-7-frame .day-7-center .day-7-header .day-7-menu-icon:hover .bottom-dash,.day-7-frame .day-7-center .day-7-header .day-7-menu-icon:hover .menu-dot,.day-7-frame .day-7-center .day-7-header .day-7-menu-icon:hover .top-dash{background:#fff;box-shadow:0 0 5px 3px hsla(0,0%,100%,.3)}.day-7-frame .day-7-center .day-7-header .day-7-menu-icon .bottom-dash,.day-7-frame .day-7-center .day-7-header .day-7-menu-icon .menu-dot,.day-7-frame .day-7-center .day-7-header .day-7-menu-icon .top-dash{background:#abcbf3;position:relative;transition:all .3s ease-in-out}.day-7-frame .day-7-center .day-7-header .day-7-menu-icon .top-dash{border-radius:3px;height:3px;left:0;top:10px;width:20px}.day-7-frame .day-7-center .day-7-header .day-7-menu-icon .bottom-dash{border-radius:3px;height:3px;left:0;top:17px;width:30px}.day-7-frame .day-7-center .day-7-header .day-7-menu-icon .menu-dot{border-radius:6px;height:6px;left:25px;margin-left:-2px;top:3px;width:6px}.day-7-frame .day-7-center .day-7-header .day-7-search-btn{cursor:pointer;height:30px;margin-right:10px;width:30px}.day-7-frame .day-7-center .day-7-header .day-7-search-btn:hover .search-pip{background:#fff;box-shadow:0 0 3px 3px hsla(0,0%,100%,.3)}.day-7-frame .day-7-center .day-7-header .day-7-search-btn:hover .search-circle{border-color:#fff;box-shadow:0 0 3px 3px hsla(0,0%,100%,.3)}.day-7-frame .day-7-center .day-7-header .day-7-search-btn .search-circle,.day-7-frame .day-7-center .day-7-header .day-7-search-btn .search-pip{color:#abcbf3;position:relative;transition:all .3s ease-in-out}.day-7-frame .day-7-center .day-7-header .day-7-search-btn .search-circle{background:#6596d1;border:3px solid;border-radius:12px;height:12px;top:5px;width:12px}.day-7-frame .day-7-center .day-7-header .day-7-search-btn .search-pip{background:#abcbf3;border-radius:3px;height:3px;left:11px;top:4px;-webkit-transform:rotate(60deg);transform:rotate(60deg);width:8px}.day-7-frame .day-7-center .day-7-header .day-7-title{font-size:15px;font-weight:600}.day-7-frame .day-7-center .day-7-header .day-7-input-search{border-color:transparent;border-radius:30px;height:30px;opacity:0;padding-left:20px;position:absolute;right:55px;-webkit-transform:translate(20%);transform:translate(20%);transition:all .4s ease-in-out;visibility:hidden;width:200px}.day-7-frame .day-7-center .day-7-header .day-7-input-search.active{opacity:1;-webkit-transform:translate(0);transform:translate(0);visibility:visible}.day-7-frame .day-7-center .day-7-header .day-7-input-search:focus{color:#666;outline:none}.day-7-frame .day-7-center .day-7-content{-webkit-animation:content-animation .5s ease-in;animation:content-animation .5s ease-in;height:240px;overflow:hidden;position:relative;transition:.5s ease-in;width:100%}.day-7-frame .day-7-center .day-7-content .line{background:#ebebeb;height:100%;left:27px;position:absolute;width:3px}.day-7-frame .day-7-center .day-7-content .notification{margin:25px 20px 25px 43px;position:relative;z-index:2}.day-7-frame .day-7-center .day-7-content .notification:hover{color:#5f98cd}.day-7-frame .day-7-center .day-7-content .notification .circle{background:#fff;border:2px solid #5f98cd;border-radius:50%;box-shadow:0 0 0 3px #fff;height:10px;left:-21px;position:absolute;width:10px}.day-7-frame .day-7-center .day-7-content .notification .time{display:block;font-size:11px;position:relative;text-align:left}.day-7-frame .day-7-center .day-7-content .notification p{display:block;font-size:15px;line-height:20px;margin:0;position:relative;text-align:left}.day-7-frame .day-7-popup{background:#43627d;border-radius:5px;height:270px;left:40px;position:relative;top:-235px;-webkit-transform:translate(50%);transform:translate(50%);transition:all .4s ease-in-out;width:170px}.day-7-frame .day-7-popup.active{-webkit-transform:translate(0);transform:translate(0)}.day-7-frame .day-7-popup .menu-item{color:#93b2cd;cursor:pointer;display:flex;flex-direction:row;font-size:14px;padding:15px 17px;transition:.4s ease-in-out}.day-7-frame .day-7-popup .menu-item:hover{background:#264057;color:#fff}.day-7-frame .day-7-popup .menu-item span{display:block;margin-left:5px}.day-7-frame .day-7-popup .menu-item span.menu-item-title{margin-top:5px}@-webkit-keyframes content-animation{0%{opacity:0;-webkit-transform:translate3d(0,50px,0);transform:translate3d(0,50px,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes content-animation{0%{opacity:0;-webkit-transform:translate3d(0,50px,0);transform:translate3d(0,50px,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}.day-8-frame{background:#000;color:#fff}.day-8-frame .day-8-center{left:50%;position:relative;top:50%;-webkit-transform:translate(-12%,-50%);transform:translate(-12%,-50%)}.day-8-frame .day-8-center:hover .ball{background:rgba(222,235,97,.992)}.day-8-frame .day-8-center:hover .blubb-1{background:#397899}.day-8-frame .day-8-center:hover .sparkle-1:after{background:#28ee6e}.day-8-frame .day-8-center:hover .blubb-2{background:#055345}.day-8-frame .day-8-center:hover .sparkle-2:after{background:#47ddb4}.day-8-frame .day-8-center:hover .blubb-3{background:#62d84f}.day-8-frame .day-8-center:hover .sparkle-3:after{background:#3828cc}.day-8-frame .day-8-center:hover .blubb-4{background:#965cd1}.day-8-frame .day-8-center:hover .sparkle-4:after{background:#213597}.day-8-frame .day-8-center:hover .blubb-5{background:#93b00c}.day-8-frame .day-8-center:hover .sparkle-5:after{background:#286b23}.day-8-frame .day-8-center:hover .blubb-6{background:#166b15}.day-8-frame .day-8-center:hover .sparkle-6:after{background:#a13140}.day-8-frame .day-8-center:hover .blubb-7{background:#a9891e}.day-8-frame .day-8-center:hover .sparkle-7:after{background:#511314}.day-8-frame .day-8-center:hover .blubb-8{background:#863a03}.day-8-frame .day-8-center:hover .sparkle-8:after{background:#af603b}.day-8-frame .day-8-center:hover .blubb-9{background:#88af34}.day-8-frame .day-8-center:hover .sparkle-9:after{background:#c3bb0c}.day-8-frame .day-8-center:hover .blubb-10{background:#0c6683}.day-8-frame .day-8-center:hover .sparkle-10:after{background:#2822e8}.day-8-frame .day-8-center .ball{background:#fff;border-radius:50%;-webkit-filter:blur(1px) brightness(1.5);filter:blur(1px) brightness(1.5);height:90px;position:relative;width:90px;z-index:1}.day-8-frame .day-8-center .blubb-1{-webkit-animation:rotate 2.7s ease-in-out .2s infinite;animation:rotate 2.7s ease-in-out .2s infinite;-webkit-transform:rotate(113deg);transform:rotate(113deg);-webkit-transform-origin:37px 37px;transform-origin:37px 37px}.day-8-frame .day-8-center .blubb-1,.day-8-frame .day-8-center .blubb-2{background:#fff;border-radius:50%;display:block;-webkit-filter:blur(1px);filter:blur(1px);height:50px;left:20px;position:absolute;top:20px;width:50px}.day-8-frame .day-8-center .blubb-2{-webkit-animation:rotate 2.9s ease-in-out .4s infinite;animation:rotate 2.9s ease-in-out .4s infinite;-webkit-transform:rotate(279deg);transform:rotate(279deg);-webkit-transform-origin:34px 34px;transform-origin:34px 34px}.day-8-frame .day-8-center .blubb-3{-webkit-animation:rotate 3.1s ease-in-out .6s infinite;animation:rotate 3.1s ease-in-out .6s infinite;-webkit-transform:rotate(229deg);transform:rotate(229deg);-webkit-transform-origin:31px 31px;transform-origin:31px 31px}.day-8-frame .day-8-center .blubb-3,.day-8-frame .day-8-center .blubb-4{background:#fff;border-radius:50%;display:block;-webkit-filter:blur(1px);filter:blur(1px);height:50px;left:20px;position:absolute;top:20px;width:50px}.day-8-frame .day-8-center .blubb-4{-webkit-animation:rotate 3.3s ease-in-out .8s infinite;animation:rotate 3.3s ease-in-out .8s infinite;-webkit-transform:rotate(266deg);transform:rotate(266deg);-webkit-transform-origin:28px 28px;transform-origin:28px 28px}.day-8-frame .day-8-center .blubb-5{-webkit-animation:rotate 3.5s ease-in-out 1s infinite;animation:rotate 3.5s ease-in-out 1s infinite;-webkit-transform:rotate(20deg);transform:rotate(20deg);-webkit-transform-origin:25px 25px;transform-origin:25px 25px}.day-8-frame .day-8-center .blubb-5,.day-8-frame .day-8-center .blubb-6{background:#fff;border-radius:50%;display:block;-webkit-filter:blur(1px);filter:blur(1px);height:50px;left:20px;position:absolute;top:20px;width:50px}.day-8-frame .day-8-center .blubb-6{-webkit-animation:rotate 3.7s ease-in-out 1.2s infinite;animation:rotate 3.7s ease-in-out 1.2s infinite;-webkit-transform:rotate(62deg);transform:rotate(62deg);-webkit-transform-origin:22px 22px;transform-origin:22px 22px}.day-8-frame .day-8-center .blubb-7{-webkit-animation:rotate 3.9s ease-in-out 1.4s infinite;animation:rotate 3.9s ease-in-out 1.4s infinite;-webkit-transform:rotate(143deg);transform:rotate(143deg);-webkit-transform-origin:19px 19px;transform-origin:19px 19px}.day-8-frame .day-8-center .blubb-7,.day-8-frame .day-8-center .blubb-8{background:#fff;border-radius:50%;display:block;-webkit-filter:blur(1px);filter:blur(1px);height:50px;left:20px;position:absolute;top:20px;width:50px}.day-8-frame .day-8-center .blubb-8{-webkit-animation:rotate 4.1s ease-in-out 1.6s infinite;animation:rotate 4.1s ease-in-out 1.6s infinite;-webkit-transform:rotate(36deg);transform:rotate(36deg);-webkit-transform-origin:16px 16px;transform-origin:16px 16px}.day-8-frame .day-8-center .blubb-9{-webkit-animation:rotate 4.3s ease-in-out 1.8s infinite;animation:rotate 4.3s ease-in-out 1.8s infinite;background:#fff;border-radius:50%;display:block;-webkit-filter:blur(1px);filter:blur(1px);height:50px;left:20px;position:absolute;top:20px;-webkit-transform:rotate(49deg);transform:rotate(49deg);-webkit-transform-origin:13px 13px;transform-origin:13px 13px;width:50px}.day-8-frame .day-8-center .sparkle-1{height:8px;left:38px;position:absolute;top:38px;-webkit-transform:rotate(69deg);transform:rotate(69deg);width:8px}.day-8-frame .day-8-center .sparkle-1:after{-webkit-animation:rotate 3.7s ease-in-out .2s infinite;animation:rotate 3.7s ease-in-out .2s infinite;background:#fff;border-radius:50%;content:"";display:block;-webkit-filter:blur(1px);filter:blur(1px);height:8px;position:absolute;-webkit-transform-origin:58px 58px;transform-origin:58px 58px;width:8px}.day-8-frame .day-8-center .sparkle-2{height:9px;left:38px;position:absolute;top:38px;-webkit-transform:rotate(167deg);transform:rotate(167deg);width:9px}.day-8-frame .day-8-center .sparkle-2:after{-webkit-animation:rotate 3.9s ease-in-out .4s infinite;animation:rotate 3.9s ease-in-out .4s infinite;background:#fff;border-radius:50%;content:"";display:block;-webkit-filter:blur(1px);filter:blur(1px);height:9px;position:absolute;-webkit-transform-origin:56px 56px;transform-origin:56px 56px;width:9px}.day-8-frame .day-8-center .sparkle-3{height:10px;left:38px;position:absolute;top:38px;-webkit-transform:rotate(180deg);transform:rotate(180deg);width:10px}.day-8-frame .day-8-center .sparkle-3:after{-webkit-animation:rotate 4.1s ease-in-out .6s infinite;animation:rotate 4.1s ease-in-out .6s infinite;background:#fff;border-radius:50%;content:"";display:block;-webkit-filter:blur(1px);filter:blur(1px);height:10px;position:absolute;-webkit-transform-origin:54px 54px;transform-origin:54px 54px;width:10px}.day-8-frame .day-8-center .sparkle-4{height:11px;left:38px;position:absolute;top:38px;-webkit-transform:rotate(233deg);transform:rotate(233deg);width:11px}.day-8-frame .day-8-center .sparkle-4:after{-webkit-animation:rotate 4.3s ease-in-out .8s infinite;animation:rotate 4.3s ease-in-out .8s infinite;background:#fff;border-radius:50%;content:"";display:block;-webkit-filter:blur(1px);filter:blur(1px);height:11px;position:absolute;-webkit-transform-origin:52px 52px;transform-origin:52px 52px;width:11px}.day-8-frame .day-8-center .sparkle-5{height:12px;left:38px;position:absolute;top:38px;-webkit-transform:rotate(154deg);transform:rotate(154deg);width:12px}.day-8-frame .day-8-center .sparkle-5:after{-webkit-animation:rotate 4.5s ease-in-out 1s infinite;animation:rotate 4.5s ease-in-out 1s infinite;background:#fff;border-radius:50%;content:"";display:block;-webkit-filter:blur(1px);filter:blur(1px);height:12px;position:absolute;-webkit-transform-origin:50px 50px;transform-origin:50px 50px;width:12px}.day-8-frame .day-8-center .sparkle-6{height:13px;left:38px;position:absolute;top:38px;-webkit-transform:rotate(6deg);transform:rotate(6deg);width:13px}.day-8-frame .day-8-center .sparkle-6:after{-webkit-animation:rotate 4.7s ease-in-out 1.2s infinite;animation:rotate 4.7s ease-in-out 1.2s infinite;background:#fff;border-radius:50%;content:"";display:block;-webkit-filter:blur(1px);filter:blur(1px);height:13px;position:absolute;-webkit-transform-origin:48px 48px;transform-origin:48px 48px;width:13px}.day-8-frame .day-8-center .sparkle-7{height:14px;left:38px;position:absolute;top:38px;-webkit-transform:rotate(258deg);transform:rotate(258deg);width:14px}.day-8-frame .day-8-center .sparkle-7:after{-webkit-animation:rotate 4.9s ease-in-out 1.4s infinite;animation:rotate 4.9s ease-in-out 1.4s infinite;background:#fff;border-radius:50%;content:"";display:block;-webkit-filter:blur(1px);filter:blur(1px);height:14px;position:absolute;-webkit-transform-origin:46px 46px;transform-origin:46px 46px;width:14px}.day-8-frame .day-8-center .sparkle-8{height:15px;left:38px;position:absolute;top:38px;-webkit-transform:rotate(262deg);transform:rotate(262deg);width:15px}.day-8-frame .day-8-center .sparkle-8:after{-webkit-animation:rotate 5.1s ease-in-out 1.6s infinite;animation:rotate 5.1s ease-in-out 1.6s infinite;background:#fff;border-radius:50%;content:"";display:block;-webkit-filter:blur(1px);filter:blur(1px);height:15px;position:absolute;-webkit-transform-origin:44px 44px;transform-origin:44px 44px;width:15px}.day-8-frame .day-8-center .sparkle-9{height:16px;left:38px;position:absolute;top:38px;-webkit-transform:rotate(45deg);transform:rotate(45deg);width:16px}.day-8-frame .day-8-center .sparkle-9:after{-webkit-animation:rotate 5.3s ease-in-out 1.8s infinite;animation:rotate 5.3s ease-in-out 1.8s infinite;background:#fff;border-radius:50%;content:"";display:block;-webkit-filter:blur(1px);filter:blur(1px);height:16px;position:absolute;-webkit-transform-origin:42px 42px;transform-origin:42px 42px;width:16px}.day-8-frame .day-8-center .sparkle-10{height:17px;left:38px;position:absolute;top:38px;-webkit-transform:rotate(191deg);transform:rotate(191deg);width:17px}.day-8-frame .day-8-center .sparkle-10:after{-webkit-animation:rotate 5.5s ease-in-out 2s infinite;animation:rotate 5.5s ease-in-out 2s infinite;background:#fff;border-radius:50%;content:"";display:block;-webkit-filter:blur(1px);filter:blur(1px);height:17px;position:absolute;-webkit-transform-origin:40px 40px;transform-origin:40px 40px;width:17px}@-webkit-keyframes rotate{0%{-webkit-transform:rotate(0deg) translateZ(0);transform:rotate(0deg) translateZ(0)}to{-webkit-transform:rotate(1turn) translateZ(0);transform:rotate(1turn) translateZ(0)}}@keyframes rotate{0%{-webkit-transform:rotate(0deg) translateZ(0);transform:rotate(0deg) translateZ(0)}to{-webkit-transform:rotate(1turn) translateZ(0);transform:rotate(1turn) translateZ(0)}}.day-9-frame{background:#1a2238;color:#394568;overflow:hidden}.day-9-frame .day-9-window{height:310px;position:relative;width:400px}.day-9-frame .day-9-window .moon{-webkit-animation:moon-up 2s ease-in-out forwards;animation:moon-up 2s ease-in-out forwards;background:#f6edbd;border-radius:50px;box-shadow:0 0 10px 0 #f6edbd;height:67px;left:55px;overflow:hidden;position:relative;top:45px;width:67px}.day-9-frame .day-9-window .moon .crater-1{background:hsla(39,61%,69%,.49);border-radius:50%;height:8px;position:absolute;width:8px}.day-9-frame .day-9-window .moon .crater-2{background:hsla(39,61%,69%,.49);border-radius:50%;height:9px;position:absolute;width:9px}.day-9-frame .day-9-window .moon .crater-3{background:hsla(39,61%,69%,.49);border-radius:50%;height:10px;position:absolute;width:10px}.day-9-frame .day-9-window .moon .crater-4{background:hsla(39,61%,69%,.49);border-radius:50%;height:11px;position:absolute;width:11px}.day-9-frame .day-9-window .moon .crater-5{background:hsla(39,61%,69%,.49);border-radius:50%;height:12px;position:absolute;width:12px}.day-9-frame .day-9-window .moon .crater-6{background:hsla(39,61%,69%,.49);border-radius:50%;height:13px;position:absolute;width:13px}.day-9-frame .day-9-window .moon .crater-7{background:hsla(39,61%,69%,.49);border-radius:50%;height:14px;position:absolute;width:14px}.day-9-frame .day-9-window .moon .crater-8{background:hsla(39,61%,69%,.49);border-radius:50%;height:15px;position:absolute;width:15px}.day-9-frame .day-9-window .moon .crater-1{left:40px;top:50px}.day-9-frame .day-9-window .moon .crater-2{left:20px;top:10px}.day-9-frame .day-9-window .moon .crater-3{left:35px;top:30px}.day-9-frame .day-9-window .moon .crater-4{left:15px;top:45px}.day-9-frame .day-9-window .moon .crater-5{left:20px;top:60px}.day-9-frame .day-9-window .moon .crater-6{left:50px;top:40px}.day-9-frame .day-9-window .moon .crater-7{left:43px;top:2px}.day-9-frame .day-9-window .moon .crater-8{left:5px;top:25px}.day-9-frame .day-9-window .hill-1,.day-9-frame .day-9-window .hill-2,.day-9-frame .day-9-window .hill-3,.day-9-frame .day-9-window .hill-4,.day-9-frame .day-9-window .hill-5{background:#26314f;border-radius:50%;height:281px;position:absolute;width:337px;z-index:5}.day-9-frame .day-9-window .hill-1{left:-50px;top:195px}.day-9-frame .day-9-window .hill-2{left:170px;top:183px}.day-9-frame .day-9-window .hill-3,.day-9-frame .day-9-window .hill-4,.day-9-frame .day-9-window .hill-5{background:#303c5d;width:300px}.day-9-frame .day-9-window .hill-3{left:-100px;top:250px}.day-9-frame .day-9-window .hill-4{left:50px;top:226px}.day-9-frame .day-9-window .hill-5{left:200px;top:260px}.day-9-frame .day-9-window .drop{-webkit-animation:rain 1s linear infinite;animation:rain 1s linear infinite;background:#7fc1f9;border-radius:50%;position:absolute;top:5px;-webkit-transform-origin:50% 100%;transform-origin:50% 100%;z-index:20}.day-9-frame .day-9-window .drop-big-1{-webkit-animation-delay:.7s;animation-delay:.7s;height:6px;left:18px;width:6px}.day-9-frame .day-9-window .drop-big-1:before{background:#7fc1f9;border-radius:3px;content:"";display:block;height:6px;left:1px;position:absolute;top:-2px;width:6px}.day-9-frame .day-9-window .drop-big-1:after{background:#7fc1f9;border-radius:50%;content:"";display:block;height:10px;left:2px;position:absolute;top:-5px;width:4px}.day-9-frame .day-9-window .drop-medium-1{-webkit-animation-delay:.4s;animation-delay:.4s;height:6px;left:20px;opacity:.6;width:6px}.day-9-frame .day-9-window .drop-medium-1:before{background:#7fc1f9;border-radius:3px;content:"";display:block;height:4px;left:1px;opacity:.6;position:absolute;top:-2px;width:4px}.day-9-frame .day-9-window .drop-medium-1:after{background:#7fc1f9;border-radius:50%;content:"";display:block;height:8px;left:2px;position:absolute;top:-5px;width:2px}.day-9-frame .day-9-window .drop-small-1{-webkit-animation-delay:.5s;animation-delay:.5s;height:4px;left:15px;opacity:.3;width:4px}.day-9-frame .day-9-window .drop-small-1:before{background:#7fc1f9;border-radius:3px;content:"";display:block;height:4px;left:1px;opacity:.6;position:absolute;top:-2px;width:4px}.day-9-frame .day-9-window .drop-small-1:after{background:#7fc1f9;border-radius:50%;content:"";display:block;height:8px;left:2px;position:absolute;top:-5px;width:2px}.day-9-frame .day-9-window .drop-big-2{-webkit-animation-delay:.6s;animation-delay:.6s;height:6px;left:56px;width:6px}.day-9-frame .day-9-window .drop-big-2:before{background:#7fc1f9;border-radius:3px;content:"";display:block;height:6px;left:1px;position:absolute;top:-2px;width:6px}.day-9-frame .day-9-window .drop-big-2:after{background:#7fc1f9;border-radius:50%;content:"";display:block;height:10px;left:2px;position:absolute;top:-5px;width:4px}.day-9-frame .day-9-window .drop-medium-2{-webkit-animation-delay:.2s;animation-delay:.2s;height:6px;left:58px;opacity:.6;width:6px}.day-9-frame .day-9-window .drop-medium-2:before{background:#7fc1f9;border-radius:3px;content:"";display:block;height:4px;left:1px;opacity:.6;position:absolute;top:-2px;width:4px}.day-9-frame .day-9-window .drop-medium-2:after{background:#7fc1f9;border-radius:50%;content:"";display:block;height:8px;left:2px;position:absolute;top:-5px;width:2px}.day-9-frame .day-9-window .drop-small-2{-webkit-animation-delay:.3s;animation-delay:.3s;height:4px;left:50px;opacity:.3;width:4px}.day-9-frame .day-9-window .drop-small-2:before{background:#7fc1f9;border-radius:3px;content:"";display:block;height:4px;left:1px;opacity:.6;position:absolute;top:-2px;width:4px}.day-9-frame .day-9-window .drop-small-2:after{background:#7fc1f9;border-radius:50%;content:"";display:block;height:8px;left:2px;position:absolute;top:-5px;width:2px}.day-9-frame .day-9-window .drop-big-3{-webkit-animation-delay:.1s;animation-delay:.1s;height:6px;left:94px;width:6px}.day-9-frame .day-9-window .drop-big-3:before{background:#7fc1f9;border-radius:3px;content:"";display:block;height:6px;left:1px;position:absolute;top:-2px;width:6px}.day-9-frame .day-9-window .drop-big-3:after{background:#7fc1f9;border-radius:50%;content:"";display:block;height:10px;left:2px;position:absolute;top:-5px;width:4px}.day-9-frame .day-9-window .drop-medium-3{-webkit-animation-delay:.6s;animation-delay:.6s;height:6px;left:96px;opacity:.6;width:6px}.day-9-frame .day-9-window .drop-medium-3:before{background:#7fc1f9;border-radius:3px;content:"";display:block;height:4px;left:1px;opacity:.6;position:absolute;top:-2px;width:4px}.day-9-frame .day-9-window .drop-medium-3:after{background:#7fc1f9;border-radius:50%;content:"";display:block;height:8px;left:2px;position:absolute;top:-5px;width:2px}.day-9-frame .day-9-window .drop-small-3{-webkit-animation-delay:.4s;animation-delay:.4s;height:4px;left:85px;opacity:.3;width:4px}.day-9-frame .day-9-window .drop-small-3:before{background:#7fc1f9;border-radius:3px;content:"";display:block;height:4px;left:1px;opacity:.6;position:absolute;top:-2px;width:4px}.day-9-frame .day-9-window .drop-small-3:after{background:#7fc1f9;border-radius:50%;content:"";display:block;height:8px;left:2px;position:absolute;top:-5px;width:2px}.day-9-frame .day-9-window .drop-big-4{-webkit-animation-delay:.8s;animation-delay:.8s;height:6px;left:132px;width:6px}.day-9-frame .day-9-window .drop-big-4:before{background:#7fc1f9;border-radius:3px;content:"";display:block;height:6px;left:1px;position:absolute;top:-2px;width:6px}.day-9-frame .day-9-window .drop-big-4:after{background:#7fc1f9;border-radius:50%;content:"";display:block;height:10px;left:2px;position:absolute;top:-5px;width:4px}.day-9-frame .day-9-window .drop-medium-4{-webkit-animation-delay:.6s;animation-delay:.6s;height:6px;left:134px;opacity:.6;width:6px}.day-9-frame .day-9-window .drop-medium-4:before{background:#7fc1f9;border-radius:3px;content:"";display:block;height:4px;left:1px;opacity:.6;position:absolute;top:-2px;width:4px}.day-9-frame .day-9-window .drop-medium-4:after{background:#7fc1f9;border-radius:50%;content:"";display:block;height:8px;left:2px;position:absolute;top:-5px;width:2px}.day-9-frame .day-9-window .drop-small-4{-webkit-animation-delay:.3s;animation-delay:.3s;height:4px;left:120px;opacity:.3;width:4px}.day-9-frame .day-9-window .drop-small-4:before{background:#7fc1f9;border-radius:3px;content:"";display:block;height:4px;left:1px;opacity:.6;position:absolute;top:-2px;width:4px}.day-9-frame .day-9-window .drop-small-4:after{background:#7fc1f9;border-radius:50%;content:"";display:block;height:8px;left:2px;position:absolute;top:-5px;width:2px}.day-9-frame .day-9-window .drop-big-5{-webkit-animation-delay:.4s;animation-delay:.4s;height:6px;left:170px;width:6px}.day-9-frame .day-9-window .drop-big-5:before{background:#7fc1f9;border-radius:3px;content:"";display:block;height:6px;left:1px;position:absolute;top:-2px;width:6px}.day-9-frame .day-9-window .drop-big-5:after{background:#7fc1f9;border-radius:50%;content:"";display:block;height:10px;left:2px;position:absolute;top:-5px;width:4px}.day-9-frame .day-9-window .drop-medium-5{-webkit-animation-delay:.4s;animation-delay:.4s;height:6px;left:172px;opacity:.6;width:6px}.day-9-frame .day-9-window .drop-medium-5:before{background:#7fc1f9;border-radius:3px;content:"";display:block;height:4px;left:1px;opacity:.6;position:absolute;top:-2px;width:4px}.day-9-frame .day-9-window .drop-medium-5:after{background:#7fc1f9;border-radius:50%;content:"";display:block;height:8px;left:2px;position:absolute;top:-5px;width:2px}.day-9-frame .day-9-window .drop-small-5{-webkit-animation-delay:.8s;animation-delay:.8s;height:4px;left:155px;opacity:.3;width:4px}.day-9-frame .day-9-window .drop-small-5:before{background:#7fc1f9;border-radius:3px;content:"";display:block;height:4px;left:1px;opacity:.6;position:absolute;top:-2px;width:4px}.day-9-frame .day-9-window .drop-small-5:after{background:#7fc1f9;border-radius:50%;content:"";display:block;height:8px;left:2px;position:absolute;top:-5px;width:2px}.day-9-frame .day-9-window .drop-big-6{-webkit-animation-delay:.8s;animation-delay:.8s;height:6px;left:208px;width:6px}.day-9-frame .day-9-window .drop-big-6:before{background:#7fc1f9;border-radius:3px;content:"";display:block;height:6px;left:1px;position:absolute;top:-2px;width:6px}.day-9-frame .day-9-window .drop-big-6:after{background:#7fc1f9;border-radius:50%;content:"";display:block;height:10px;left:2px;position:absolute;top:-5px;width:4px}.day-9-frame .day-9-window .drop-medium-6{-webkit-animation-delay:.5s;animation-delay:.5s;height:6px;left:210px;opacity:.6;width:6px}.day-9-frame .day-9-window .drop-medium-6:before{background:#7fc1f9;border-radius:3px;content:"";display:block;height:4px;left:1px;opacity:.6;position:absolute;top:-2px;width:4px}.day-9-frame .day-9-window .drop-medium-6:after{background:#7fc1f9;border-radius:50%;content:"";display:block;height:8px;left:2px;position:absolute;top:-5px;width:2px}.day-9-frame .day-9-window .drop-small-6{-webkit-animation-delay:.3s;animation-delay:.3s;height:4px;left:190px;opacity:.3;width:4px}.day-9-frame .day-9-window .drop-small-6:before{background:#7fc1f9;border-radius:3px;content:"";display:block;height:4px;left:1px;opacity:.6;position:absolute;top:-2px;width:4px}.day-9-frame .day-9-window .drop-small-6:after{background:#7fc1f9;border-radius:50%;content:"";display:block;height:8px;left:2px;position:absolute;top:-5px;width:2px}.day-9-frame .day-9-window .drop-big-7{-webkit-animation-delay:.8s;animation-delay:.8s;height:6px;left:246px;width:6px}.day-9-frame .day-9-window .drop-big-7:before{background:#7fc1f9;border-radius:3px;content:"";display:block;height:6px;left:1px;position:absolute;top:-2px;width:6px}.day-9-frame .day-9-window .drop-big-7:after{background:#7fc1f9;border-radius:50%;content:"";display:block;height:10px;left:2px;position:absolute;top:-5px;width:4px}.day-9-frame .day-9-window .drop-medium-7{-webkit-animation-delay:.2s;animation-delay:.2s;height:6px;left:248px;opacity:.6;width:6px}.day-9-frame .day-9-window .drop-medium-7:before{background:#7fc1f9;border-radius:3px;content:"";display:block;height:4px;left:1px;opacity:.6;position:absolute;top:-2px;width:4px}.day-9-frame .day-9-window .drop-medium-7:after{background:#7fc1f9;border-radius:50%;content:"";display:block;height:8px;left:2px;position:absolute;top:-5px;width:2px}.day-9-frame .day-9-window .drop-small-7{-webkit-animation-delay:.3s;animation-delay:.3s;height:4px;left:225px;opacity:.3;width:4px}.day-9-frame .day-9-window .drop-small-7:before{background:#7fc1f9;border-radius:3px;content:"";display:block;height:4px;left:1px;opacity:.6;position:absolute;top:-2px;width:4px}.day-9-frame .day-9-window .drop-small-7:after{background:#7fc1f9;border-radius:50%;content:"";display:block;height:8px;left:2px;position:absolute;top:-5px;width:2px}.day-9-frame .day-9-window .drop-big-8{-webkit-animation-delay:.1s;animation-delay:.1s;height:6px;left:284px;width:6px}.day-9-frame .day-9-window .drop-big-8:before{background:#7fc1f9;border-radius:3px;content:"";display:block;height:6px;left:1px;position:absolute;top:-2px;width:6px}.day-9-frame .day-9-window .drop-big-8:after{background:#7fc1f9;border-radius:50%;content:"";display:block;height:10px;left:2px;position:absolute;top:-5px;width:4px}.day-9-frame .day-9-window .drop-medium-8{-webkit-animation-delay:.6s;animation-delay:.6s;height:6px;left:286px;opacity:.6;width:6px}.day-9-frame .day-9-window .drop-medium-8:before{background:#7fc1f9;border-radius:3px;content:"";display:block;height:4px;left:1px;opacity:.6;position:absolute;top:-2px;width:4px}.day-9-frame .day-9-window .drop-medium-8:after{background:#7fc1f9;border-radius:50%;content:"";display:block;height:8px;left:2px;position:absolute;top:-5px;width:2px}.day-9-frame .day-9-window .drop-small-8{-webkit-animation-delay:1s;animation-delay:1s;height:4px;left:260px;opacity:.3;width:4px}.day-9-frame .day-9-window .drop-small-8:before{background:#7fc1f9;border-radius:3px;content:"";display:block;height:4px;left:1px;opacity:.6;position:absolute;top:-2px;width:4px}.day-9-frame .day-9-window .drop-small-8:after{background:#7fc1f9;border-radius:50%;content:"";display:block;height:8px;left:2px;position:absolute;top:-5px;width:2px}.day-9-frame .day-9-window .drop-big-9{-webkit-animation-delay:.9s;animation-delay:.9s;height:6px;left:322px;width:6px}.day-9-frame .day-9-window .drop-big-9:before{background:#7fc1f9;border-radius:3px;content:"";display:block;height:6px;left:1px;position:absolute;top:-2px;width:6px}.day-9-frame .day-9-window .drop-big-9:after{background:#7fc1f9;border-radius:50%;content:"";display:block;height:10px;left:2px;position:absolute;top:-5px;width:4px}.day-9-frame .day-9-window .drop-medium-9{-webkit-animation-delay:.3s;animation-delay:.3s;height:6px;left:324px;opacity:.6;width:6px}.day-9-frame .day-9-window .drop-medium-9:before{background:#7fc1f9;border-radius:3px;content:"";display:block;height:4px;left:1px;opacity:.6;position:absolute;top:-2px;width:4px}.day-9-frame .day-9-window .drop-medium-9:after{background:#7fc1f9;border-radius:50%;content:"";display:block;height:8px;left:2px;position:absolute;top:-5px;width:2px}.day-9-frame .day-9-window .drop-small-9{-webkit-animation-delay:.7s;animation-delay:.7s;height:4px;left:295px;opacity:.3;width:4px}.day-9-frame .day-9-window .drop-small-9:before{background:#7fc1f9;border-radius:3px;content:"";display:block;height:4px;left:1px;opacity:.6;position:absolute;top:-2px;width:4px}.day-9-frame .day-9-window .drop-small-9:after{background:#7fc1f9;border-radius:50%;content:"";display:block;height:8px;left:2px;position:absolute;top:-5px;width:2px}.day-9-frame .day-9-window .drop-big-10{-webkit-animation-delay:.2s;animation-delay:.2s;height:6px;left:360px;width:6px}.day-9-frame .day-9-window .drop-big-10:before{background:#7fc1f9;border-radius:3px;content:"";display:block;height:6px;left:1px;position:absolute;top:-2px;width:6px}.day-9-frame .day-9-window .drop-big-10:after{background:#7fc1f9;border-radius:50%;content:"";display:block;height:10px;left:2px;position:absolute;top:-5px;width:4px}.day-9-frame .day-9-window .drop-medium-10{-webkit-animation-delay:.1s;animation-delay:.1s;height:6px;left:362px;opacity:.6;width:6px}.day-9-frame .day-9-window .drop-medium-10:before{background:#7fc1f9;border-radius:3px;content:"";display:block;height:4px;left:1px;opacity:.6;position:absolute;top:-2px;width:4px}.day-9-frame .day-9-window .drop-medium-10:after{background:#7fc1f9;border-radius:50%;content:"";display:block;height:8px;left:2px;position:absolute;top:-5px;width:2px}.day-9-frame .day-9-window .drop-small-10{-webkit-animation-delay:.2s;animation-delay:.2s;height:4px;left:330px;opacity:.3;width:4px}.day-9-frame .day-9-window .drop-small-10:before{background:#7fc1f9;border-radius:3px;content:"";display:block;height:4px;left:1px;opacity:.6;position:absolute;top:-2px;width:4px}.day-9-frame .day-9-window .drop-small-10:after{background:#7fc1f9;border-radius:50%;content:"";display:block;height:8px;left:2px;position:absolute;top:-5px;width:2px}.day-9-frame .day-9-report-card{background:#fff;display:flex;flex-direction:row;height:90px;justify-content:space-between;padding:10px 0 0;position:relative;width:400px;z-index:10}.day-9-frame .day-9-report-card .temperature{font-size:45px;font-weight:400;margin-left:20px;margin-top:5px}.day-9-frame .day-9-report-card .details{align-items:flex-start;display:flex;flex-direction:column;gap:3px;justify-content:flex-start;margin-top:3px;width:200px}.day-9-frame .day-9-report-card .details .p{font-size:15px;font-weight:400}.day-9-frame .day-9-report-card .next-day-forecast{display:flex;flex-direction:row;justify-content:space-between;margin-right:20px;margin-top:10px;width:130px}.day-9-frame .day-9-report-card .next-day-forecast .days,.day-9-frame .day-9-report-card .next-day-forecast .temperatures{font-size:15px;line-height:20px;margin-right:10px}.day-9-frame .day-9-report-card .next-day-forecast .days{font-weight:600}.day-9-frame .day-9-report-card .next-day-forecast .days:hover{cursor:pointer;text-decoration:underline}@-webkit-keyframes moon-up{0%{top:300px}50%{top:0}to{top:45px}}@keyframes moon-up{0%{top:300px}50%{top:0}to{top:45px}}@-webkit-keyframes rain{0%{-webkit-transform:translateZ(0) scaleX(1) scaleY(1) rotate(17deg);transform:translateZ(0) scaleX(1) scaleY(1) rotate(17deg)}85%{-webkit-transform:translate3d(-40px,295px,0) scaleX(1) scaleY(1) rotate(17deg);transform:translate3d(-40px,295px,0) scaleX(1) scaleY(1) rotate(17deg)}to{-webkit-transform:translate3d(-40px,295px,0) scaleX(3) scaleY(0) rotate(0deg);transform:translate3d(-40px,295px,0) scaleX(3) scaleY(0) rotate(0deg)}}@keyframes rain{0%{-webkit-transform:translateZ(0) scaleX(1) scaleY(1) rotate(17deg);transform:translateZ(0) scaleX(1) scaleY(1) rotate(17deg)}85%{-webkit-transform:translate3d(-40px,295px,0) scaleX(1) scaleY(1) rotate(17deg);transform:translate3d(-40px,295px,0) scaleX(1) scaleY(1) rotate(17deg)}to{-webkit-transform:translate3d(-40px,295px,0) scaleX(3) scaleY(0) rotate(0deg);transform:translate3d(-40px,295px,0) scaleX(3) scaleY(0) rotate(0deg)}}.day-10-frame{background:#424242;color:#fff}.day-10-frame .day-10-watch{background:#212121;border:10px solid #3a3a3a;border-radius:50%;height:200px;left:50%;position:relative;top:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);width:200px}.day-10-frame .day-10-watch .spinner{-webkit-animation:spinner-animation 5s infinite;animation:spinner-animation 5s infinite;background:radial-gradient(#212121 68%,transparent 0),conic-gradient(#e53935 30%,#212121 70%);border-radius:50%;height:190px;left:6px;position:absolute;top:6px;width:190px}.day-10-frame .day-10-watch .dots{border:3px dotted;border-radius:50%;height:170px;left:13px;position:absolute;top:13px;width:170px}.day-10-frame .day-10-watch .watch-display{left:45px;position:absolute;top:65px}.day-10-frame .day-10-watch .watch-display .calendar{font-size:12px;width:100%}.day-10-frame .day-10-watch .watch-display .time{font-size:40px;font-weight:bolder}.day-10-frame .day-10-watch .watch-display .biometrics{display:flex;flex-direction:row;justify-content:space-between;width:100%}.day-10-frame .day-10-watch .watch-display .biometrics .pulse{font-size:12px;margin-left:-5px}.day-10-frame .day-10-watch .watch-display .biometrics .heart{-webkit-animation:pulse 1s ease-in-out infinite;animation:pulse 1s ease-in-out infinite;color:#e53935;font-size:14px;font-weight:800}.day-10-frame .day-10-watch .watch-display .biometrics .calories{font-size:12px}@-webkit-keyframes pulse{0%{-webkit-transform:scale(1);transform:scale(1)}50%{-webkit-transform:scale(1.2);transform:scale(1.2)}to{-webkit-transform:scale(1);transform:scale(1)}}@keyframes pulse{0%{-webkit-transform:scale(1);transform:scale(1)}50%{-webkit-transform:scale(1.2);transform:scale(1.2)}to{-webkit-transform:scale(1);transform:scale(1)}}@property --stroke{syntax:"<percentage>";inherits:false;initial-value:0}@-webkit-keyframes spinner-animation{0%{--stroke:0%;-webkit-animation-timing-function:linear;animation-timing-function:linear;background:radial-gradient(#212121 68%,transparent 68%),conic-gradient(#e53935 var(--stroke),#212121 var(--stroke))}50%{--stroke:100%;-webkit-animation-timing-function:linear;animation-timing-function:linear;background:radial-gradient(#212121 68%,transparent 68%),conic-gradient(#e53935 var(--stroke),#212121 var(--stroke))}51%{--stroke:0%;-webkit-animation-timing-function:linear;animation-timing-function:linear;background:radial-gradient(#212121 68%,transparent 68%),conic-gradient(#212121 var(--stroke),#e53935 var(--stroke))}to{--stroke:100%;-webkit-animation-timing-function:linear;animation-timing-function:linear;background:radial-gradient(#212121 68%,transparent 68%),conic-gradient(#212121 var(--stroke),#e53935 var(--stroke))}}@keyframes spinner-animation{0%{--stroke:0%;-webkit-animation-timing-function:linear;animation-timing-function:linear;background:radial-gradient(#212121 68%,transparent 68%),conic-gradient(#e53935 var(--stroke),#212121 var(--stroke))}50%{--stroke:100%;-webkit-animation-timing-function:linear;animation-timing-function:linear;background:radial-gradient(#212121 68%,transparent 68%),conic-gradient(#e53935 var(--stroke),#212121 var(--stroke))}51%{--stroke:0%;-webkit-animation-timing-function:linear;animation-timing-function:linear;background:radial-gradient(#212121 68%,transparent 68%),conic-gradient(#212121 var(--stroke),#e53935 var(--stroke))}to{--stroke:100%;-webkit-animation-timing-function:linear;animation-timing-function:linear;background:radial-gradient(#212121 68%,transparent 68%),conic-gradient(#212121 var(--stroke),#e53935 var(--stroke))}}.day-11-frame{background:#fff3e0}.day-11-frame .floor{background:#212121;height:150px;position:relative;top:250px;z-index:1}.day-11-frame .floor .stripe-1,.day-11-frame .floor .stripe-2,.day-11-frame .floor .stripe-3,.day-11-frame .floor .stripe-4{-webkit-animation:floor-move 4s linear infinite;animation:floor-move 4s linear infinite;background:#443d3d;height:5px;left:400px;position:absolute;width:200px}.day-11-frame .floor .stripe-1{top:10px}.day-11-frame .floor .stripe-2{-webkit-animation-delay:2s;animation-delay:2s;top:37px}.day-11-frame .floor .stripe-3{-webkit-animation-delay:3s;animation-delay:3s;top:67px}.day-11-frame .floor .stripe-4{-webkit-animation-delay:4s;animation-delay:4s;top:110px}.day-11-frame .person{-webkit-animation:shoes-appear 2s ease-in;animation:shoes-appear 2s ease-in;left:50%;position:relative;top:65%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);z-index:5}.day-11-frame .person .leg{left:120px;position:absolute;-webkit-transform-origin:50% 0;transform-origin:50% 0}.day-11-frame .person .left{-webkit-animation:leg-swing 2s ease-in-out 1s infinite;animation:leg-swing 2s ease-in-out 1s infinite}.day-11-frame .person .left .shoe{-webkit-animation:shoe-swing 2s ease-in-out 1s infinite;animation:shoe-swing 2s ease-in-out 1s infinite}.day-11-frame .person .right{-webkit-animation:leg-swing 2s ease-in-out infinite;animation:leg-swing 2s ease-in-out infinite}.day-11-frame .person .right .shoe{-webkit-animation:shoe-swing 2s ease-in-out infinite;animation:shoe-swing 2s ease-in-out infinite}.day-11-frame .person .shoe{background:url(https://100dayscss.com/codepen/doc-martens.svg) 50% no-repeat;bottom:0;height:128px;left:0;position:absolute;-webkit-transform-origin:0 95%;transform-origin:0 95%;width:151px;z-index:10}@-webkit-keyframes leg-swing{0%,to{-webkit-transform:translate(120px,10px) rotate(-10deg);transform:translate(120px,10px) rotate(-10deg)}50%{-webkit-transform:translate(-100px,-10px) rotate(10deg);transform:translate(-100px,-10px) rotate(10deg)}}@keyframes leg-swing{0%,to{-webkit-transform:translate(120px,10px) rotate(-10deg);transform:translate(120px,10px) rotate(-10deg)}50%{-webkit-transform:translate(-100px,-10px) rotate(10deg);transform:translate(-100px,-10px) rotate(10deg)}}@-webkit-keyframes shoe-swing{0%,to{-webkit-transform:translate(10px,-5px) rotate(-10deg);transform:translate(10px,-5px) rotate(-10deg)}25%{-webkit-transform:translate(0) rotate(0deg);transform:translate(0) rotate(0deg)}50%{-webkit-transform:translate(10px,-10px) rotate(10deg);transform:translate(10px,-10px) rotate(10deg)}75%{-webkit-transform:translateY(-40px) rotate(0deg);transform:translateY(-40px) rotate(0deg)}}@keyframes shoe-swing{0%,to{-webkit-transform:translate(10px,-5px) rotate(-10deg);transform:translate(10px,-5px) rotate(-10deg)}25%{-webkit-transform:translate(0) rotate(0deg);transform:translate(0) rotate(0deg)}50%{-webkit-transform:translate(10px,-10px) rotate(10deg);transform:translate(10px,-10px) rotate(10deg)}75%{-webkit-transform:translateY(-40px) rotate(0deg);transform:translateY(-40px) rotate(0deg)}}@-webkit-keyframes shoes-appear{0%{opacity:0}to{opacity:1}}@keyframes shoes-appear{0%{opacity:0}to{opacity:1}}@-webkit-keyframes floor-move{0%{-webkit-transform:translate(-100);transform:translate(-100)}to{-webkit-transform:translate(-600px);transform:translate(-600px)}}@keyframes floor-move{0%{-webkit-transform:translate(-100);transform:translate(-100)}to{-webkit-transform:translate(-600px);transform:translate(-600px)}}.day-12-frame{background:#29b6f6;color:#fff}.day-12-frame .quotes{font-family:Arial;font-size:250px;font-weight:700;left:-80px;line-height:5px;opacity:.2;position:relative;top:-10;z-index:0}.day-12-frame .text p{font-size:24px;height:250px;left:30px;line-height:35px;position:relative;text-align:left;top:80px;width:330px;z-index:1}.day-12-frame .hoverable{background:#0277bd;cursor:pointer;padding:0 8px 5px}.day-12-frame .hoverable:hover{background:#01579b}.day-12-frame .hoverable:hover .tooltip{-webkit-animation:tooltip-animation .5s ease-in-out;animation:tooltip-animation .5s ease-in-out;visibility:visible}.day-12-frame .hoverable .tooltip{background:#01579b;box-sizing:border-box;display:flex;flex-direction:column;font-size:16px;left:20px;line-height:20px;position:absolute;top:-70px;visibility:hidden;width:300px;z-index:10}.day-12-frame .hoverable .tooltip .transcript{background:#fff;color:#01579b;font-weight:600;padding:0 17px 5px}.day-12-frame .hoverable .tooltip .transcript .material-symbols-outlined{margin-left:10px;position:relative;top:7px}.day-12-frame .hoverable .tooltip .description{line-height:25px;padding:10px 17px}.day-12-frame .hoverable .tooltip:after{background:#01579b;bottom:-5px;content:"";display:block;height:10px;left:50%;position:absolute;-webkit-transform:rotate(45deg);transform:rotate(45deg);width:10px;z-index:10}.day-12-frame .author{font-size:20px;font-style:Italic;left:30px;position:relative;text-align:left;top:80px;width:350px;z-index:1}@-webkit-keyframes tooltip-animation{0%{opacity:0;-webkit-transform:translateY(-20px);transform:translateY(-20px)}to{opacity:1;-webkit-transform:translate(0);transform:translate(0)}}@keyframes tooltip-animation{0%{opacity:0;-webkit-transform:translateY(-20px);transform:translateY(-20px)}to{opacity:1;-webkit-transform:translate(0);transform:translate(0)}}.day-13-frame{background:#fff;color:#fff;display:grid}.day-13-frame .profiles-container{grid-gap:5px;display:grid;grid-template-columns:1fr 1fr;padding:5px;position:relative}.day-13-frame .profiles-container .profile{cursor:pointer;overflow:hidden;position:relative}.day-13-frame .profiles-container .profile img{object-fit:cover;z-index:2}.day-13-frame .profiles-container .profile:hover .overlay{opacity:.5}.day-13-frame .profiles-container .profile:hover .plus{opacity:1;-webkit-transform:scale(1);transform:scale(1);transition:.5s ease-in-out}.day-13-frame .profiles-container .profile .overlay{background:#000;height:100%;left:0;opacity:0;position:absolute;top:0;width:100%;z-index:2}.day-13-frame .profiles-container .profile .plus{color:#ff5222;font-size:50px;left:35%;opacity:0;position:absolute;top:40%;-webkit-transform:scale(2);transform:scale(2);transition:.5s ease-in-out;z-index:3}.day-13-frame .profile-details{position:relative}.day-13-frame .profile-details.open .header{-webkit-animation:profile-header-animation .5s ease-in-out;animation:profile-header-animation .5s ease-in-out}.day-13-frame .profile-details.open .details{-webkit-animation:profile-details-animation .5s ease-in-out;animation:profile-details-animation .5s ease-in-out}.day-13-frame .profile-details.open .close-button{-webkit-animation:close-button-animation 1.2s ease-in-out;animation:close-button-animation 1.2s ease-in-out}.day-13-frame .profile-details.open .profile-picture{-webkit-animation:profile-picture-animation 1s ease-in-out;animation:profile-picture-animation 1s ease-in-out}.day-13-frame .profile-details.closing .header{-webkit-animation:profile-header-animation-reverse 1.2s ease-in-out;animation:profile-header-animation-reverse 1.2s ease-in-out;-webkit-transform:translateY(-100%);transform:translateY(-100%)}.day-13-frame .profile-details.closing .details{-webkit-animation:profile-details-animation-reverse 1.2s ease-in-out;animation:profile-details-animation-reverse 1.2s ease-in-out;-webkit-transform:translateY(100%);transform:translateY(100%)}.day-13-frame .profile-details.closing .close-button{-webkit-animation:close-button-animation-reverse .5s ease-in-out;animation:close-button-animation-reverse .5s ease-in-out;-webkit-transform:translateY(-150%);transform:translateY(-150%)}.day-13-frame .profile-details.closing .profile-picture{-webkit-animation:profile-picture-animation-reverse .5s ease-in-out;animation:profile-picture-animation-reverse .5s ease-in-out;-webkit-transform:translateY(-300%);transform:translateY(-300%)}.day-13-frame .profile-details .close-button{border:1px solid #ff5222;border-radius:50%;color:#ff5222;cursor:pointer;font-size:50px;height:50px;position:absolute;right:30px;top:20px;transition:all .5s ease-in-out;width:50px;z-index:7}.day-13-frame .profile-details .close-button:hover{background-color:#ff5222;color:#fff}.day-13-frame .profile-details .header{left:0;position:absolute;top:0;z-index:5}.day-13-frame .profile-details .details{align-items:center;background:#ff5222;display:flex;flex-direction:column;height:220px;justify-content:center;left:0;position:absolute;top:180px;z-index:5}.day-13-frame .profile-details .details .name{font-size:20px;font-weight:600;margin-top:40px}.day-13-frame .profile-details .details .buttons{display:flex;flex-direction:row;z-index:10}.day-13-frame .profile-details .details .buttons .button{border:1px solid #fff;border-radius:50%;cursor:pointer;display:block;font-size:20px;height:40px;line-height:45px;margin:30px;text-align:center;transition:all .5s ease-in-out;width:40px}.day-13-frame .profile-details .details .buttons .button:hover{background:#fff;color:#ff5222}.day-13-frame .profile-details .profile-picture{align-items:center;background:#fff;border:2px solid #fff;border-radius:50%;display:flex;height:100px;justify-content:center;left:150px;overflow:hidden;position:absolute;top:130px;width:100px;z-index:7}.day-13-frame .profile-details .profile-picture img{height:100%;object-fit:cover;width:100%}@-webkit-keyframes profile-header-animation{0%{-webkit-transform:translateY(-100%);transform:translateY(-100%)}to{-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes profile-header-animation{0%{-webkit-transform:translateY(-100%);transform:translateY(-100%)}to{-webkit-transform:translateY(0);transform:translateY(0)}}@-webkit-keyframes profile-header-animation-reverse{0%{-webkit-transform:translateY(0);transform:translateY(0)}to{-webkit-transform:translateY(-100%);transform:translateY(-100%)}}@keyframes profile-header-animation-reverse{0%{-webkit-transform:translateY(0);transform:translateY(0)}to{-webkit-transform:translateY(-100%);transform:translateY(-100%)}}@-webkit-keyframes profile-details-animation{0%{-webkit-transform:translateY(100%);transform:translateY(100%)}to{-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes profile-details-animation{0%{-webkit-transform:translateY(100%);transform:translateY(100%)}to{-webkit-transform:translateY(0);transform:translateY(0)}}@-webkit-keyframes profile-details-animation-reverse{0%{-webkit-transform:translateY(0);transform:translateY(0)}to{-webkit-transform:translateY(100%);transform:translateY(100%)}}@keyframes profile-details-animation-reverse{0%{-webkit-transform:translateY(0);transform:translateY(0)}to{-webkit-transform:translateY(100%);transform:translateY(100%)}}@-webkit-keyframes close-button-animation{0%{-webkit-transform:translateY(-150%);transform:translateY(-150%)}to{-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes close-button-animation{0%{-webkit-transform:translateY(-150%);transform:translateY(-150%)}to{-webkit-transform:translateY(0);transform:translateY(0)}}@-webkit-keyframes close-button-animation-reverse{0%{-webkit-transform:translateY(0);transform:translateY(0)}to{-webkit-transform:translateY(-150%);transform:translateY(-150%)}}@keyframes close-button-animation-reverse{0%{-webkit-transform:translateY(0);transform:translateY(0)}to{-webkit-transform:translateY(-150%);transform:translateY(-150%)}}@-webkit-keyframes profile-picture-animation{0%{opacity:0;-webkit-transform:translateY(-300%);transform:translateY(-300%)}to{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes profile-picture-animation{0%{opacity:0;-webkit-transform:translateY(-300%);transform:translateY(-300%)}to{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}@-webkit-keyframes profile-picture-animation-reverse{0%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}to{opacity:0;-webkit-transform:translateY(-300%);transform:translateY(-300%)}}@keyframes profile-picture-animation-reverse{0%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}to{opacity:0;-webkit-transform:translateY(-300%);transform:translateY(-300%)}}.day-14-frame{background-color:#4b4841}.day-14-frame .day-14-card{height:180px;left:40px;-webkit-perspective:800px;perspective:800px;position:relative;top:110px;width:320px}.day-14-frame .day-14-card:hover .flip{box-shadow:8px -10px 15px 0 rgba(0,0,0,.5);-webkit-transform:rotateX(180deg) translateZ(0);transform:rotateX(180deg) translateZ(0)}.day-14-frame .day-14-card .flip{box-shadow:8px 10px 15px 0 rgba(0,0,0,.5);height:100%;-webkit-perspective:1000px;perspective:1000px;-webkit-transform-style:preserve-3d;transform-style:preserve-3d;transition:all 1s ease-in-out;width:100%}.day-14-frame .day-14-card .back,.day-14-frame .day-14-card .front{-webkit-backface-visibility:hidden;backface-visibility:hidden;background:#ffce4e;border-radius:3px;bottom:0;left:0;overflow:hidden;position:absolute;right:0;text-align:center;top:0}.day-14-frame .day-14-card .front{-webkit-transform:rotateX(0);transform:rotateX(0);z-index:2}.day-14-frame .day-14-card .front img{-webkit-animation:bike-ride .6s ease-in-out infinite;animation:bike-ride .6s ease-in-out infinite;position:relative;top:52px}.day-14-frame .day-14-card .front .road{height:3px;left:80px;overflow:hidden;position:absolute;top:127px;width:160px}.day-14-frame .day-14-card .front .road .stripe-1{-webkit-animation:road-animation 1.1s linear .8s infinite;animation:road-animation 1.1s linear .8s infinite;width:4px}.day-14-frame .day-14-card .front .road .stripe-1,.day-14-frame .day-14-card .front .road .stripe-2{background-color:#4b4841;border-radius:3px;height:5px;position:absolute;right:-25px;top:0;-webkit-transform-origin:translate(-100%,0);transform-origin:translate(-100%,0)}.day-14-frame .day-14-card .front .road .stripe-2{-webkit-animation:road-animation .9s linear .6s infinite;animation:road-animation .9s linear .6s infinite;width:6px}.day-14-frame .day-14-card .front .road .stripe-3{-webkit-animation:road-animation .9s linear 1s infinite;animation:road-animation .9s linear 1s infinite;background-color:#4b4841;border-radius:3px;height:5px;position:absolute;right:-25px;top:0;-webkit-transform-origin:translate(-100%,0);transform-origin:translate(-100%,0);width:8px}.day-14-frame .day-14-card .front .road .stripe-4{width:10px}.day-14-frame .day-14-card .front .road .stripe-4,.day-14-frame .day-14-card .front .road .stripe-5{-webkit-animation:road-animation .9s linear .1s infinite;animation:road-animation .9s linear .1s infinite;background-color:#4b4841;border-radius:3px;height:5px;position:absolute;right:-25px;top:0;-webkit-transform-origin:translate(-100%,0);transform-origin:translate(-100%,0)}.day-14-frame .day-14-card .front .road .stripe-5{width:12px}.day-14-frame .day-14-card .front .road .stripe-6{-webkit-animation:road-animation .9s linear .6s infinite;animation:road-animation .9s linear .6s infinite;width:14px}.day-14-frame .day-14-card .front .road .stripe-6,.day-14-frame .day-14-card .front .road .stripe-7{background-color:#4b4841;border-radius:3px;height:5px;position:absolute;right:-25px;top:0;-webkit-transform-origin:translate(-100%,0);transform-origin:translate(-100%,0)}.day-14-frame .day-14-card .front .road .stripe-7{-webkit-animation:road-animation 1s linear .9s infinite;animation:road-animation 1s linear .9s infinite;width:16px}.day-14-frame .day-14-card .front .road .stripe-8{-webkit-animation:road-animation 1.1s linear .1s infinite;animation:road-animation 1.1s linear .1s infinite;background-color:#4b4841;border-radius:3px;height:5px;position:absolute;right:-25px;top:0;-webkit-transform-origin:translate(-100%,0);transform-origin:translate(-100%,0);width:18px}.day-14-frame .day-14-card .back{-webkit-transform:rotateX(180deg);transform:rotateX(180deg)}.day-14-frame .day-14-card .back img{-webkit-animation:helicopter-animation 1.5s ease-in-out infinite;animation:helicopter-animation 1.5s ease-in-out infinite;-webkit-animation-fill-mode:both;animation-fill-mode:both;position:relative;top:57px;z-index:1}.day-14-frame .day-14-card .back .sky{bottom:0;left:80px;overflow:hidden;position:absolute;top:0;width:160px}.day-14-frame .day-14-card .back .sky .cloud-1{top:32px;width:20.4px}.day-14-frame .day-14-card .back .sky .cloud-1,.day-14-frame .day-14-card .back .sky .cloud-2{-webkit-animation:sky-animation .8s linear .4s infinite;animation:sky-animation .8s linear .4s infinite;background:#4b4841;border-radius:3px;height:3px;position:absolute;right:-25px}.day-14-frame .day-14-card .back .sky .cloud-2{top:44px;width:20.1px}.day-14-frame .day-14-card .back .sky .cloud-3{-webkit-animation:sky-animation .7s linear .1s infinite;animation:sky-animation .7s linear .1s infinite;background:#4b4841;border-radius:3px;height:3px;position:absolute;right:-25px;top:56px;width:14.9px}.day-14-frame .day-14-card .back .sky .cloud-4{-webkit-animation:sky-animation .8s linear .7s infinite;animation:sky-animation .8s linear .7s infinite;background:#4b4841;border-radius:3px;height:3px;position:absolute;right:-25px;top:68px;width:14.4px}.day-14-frame .day-14-card .back .sky .cloud-5{-webkit-animation:sky-animation .8s linear .4s infinite;animation:sky-animation .8s linear .4s infinite;background:#4b4841;border-radius:3px;height:3px;position:absolute;right:-25px;top:80px;width:21.2px}.day-14-frame .day-14-card .back .sky .cloud-6{-webkit-animation:sky-animation .8s linear .9s infinite;animation:sky-animation .8s linear .9s infinite;background:#4b4841;border-radius:3px;height:3px;position:absolute;right:-25px;top:92px;width:14.6px}.day-14-frame .day-14-card .back .sky .cloud-7{-webkit-animation:sky-animation .7s linear .3s infinite;animation:sky-animation .7s linear .3s infinite;background:#4b4841;border-radius:3px;height:3px;position:absolute;right:-25px;top:104px;width:24.7px}.day-14-frame .day-14-card .back .sky .cloud-8{-webkit-animation:sky-animation .8s linear 1s infinite;animation:sky-animation .8s linear 1s infinite;background:#4b4841;border-radius:3px;height:3px;position:absolute;right:-25px;top:116px;width:14.8px}.day-14-frame .day-14-card .back .sky .cloud-9{-webkit-animation:sky-animation .7s linear .1s infinite;animation:sky-animation .7s linear .1s infinite;background:#4b4841;border-radius:3px;height:3px;position:absolute;right:-25px;top:128px;width:24.9px}.day-14-frame .day-14-card .back .sky .cloud-10{-webkit-animation:sky-animation .7s linear 1s infinite;animation:sky-animation .7s linear 1s infinite;background:#4b4841;border-radius:3px;height:3px;position:absolute;right:-25px;top:140px;width:18.4px}@-webkit-keyframes bike-ride{0%,to{-webkit-transform:scaleY(1.02);transform:scaleY(1.02)}50%{-webkit-transform:scale(1) translateY(1%);transform:scale(1) translateY(1%)}}@keyframes bike-ride{0%,to{-webkit-transform:scaleY(1.02);transform:scaleY(1.02)}50%{-webkit-transform:scale(1) translateY(1%);transform:scale(1) translateY(1%)}}@-webkit-keyframes helicopter-animation{0%,to{-webkit-transform:translateY(5%);transform:translateY(5%)}50%{-webkit-transform:translateY(-5%);transform:translateY(-5%)}}@keyframes helicopter-animation{0%,to{-webkit-transform:translateY(5%);transform:translateY(5%)}50%{-webkit-transform:translateY(-5%);transform:translateY(-5%)}}@-webkit-keyframes road-animation{0%{-webkit-transform:translateZ(0) scaleX(1);transform:translateZ(0) scaleX(1)}to{-webkit-transform:translate3d(-210px,0,0) scaleX(.8);transform:translate3d(-210px,0,0) scaleX(.8)}}@keyframes road-animation{0%{-webkit-transform:translateZ(0) scaleX(1);transform:translateZ(0) scaleX(1)}to{-webkit-transform:translate3d(-210px,0,0) scaleX(.8);transform:translate3d(-210px,0,0) scaleX(.8)}}@-webkit-keyframes sky-animation{0%{-webkit-transform:translateZ(0) scaleX(1);transform:translateZ(0) scaleX(1)}to{-webkit-transform:translate3d(-210px,0,0) scaleX(.8);transform:translate3d(-210px,0,0) scaleX(.8)}}@keyframes sky-animation{0%{-webkit-transform:translateZ(0) scaleX(1);transform:translateZ(0) scaleX(1)}to{-webkit-transform:translate3d(-210px,0,0) scaleX(.8);transform:translate3d(-210px,0,0) scaleX(.8)}}.day-15-frame{background:linear-gradient(45deg,#009dfc,#00ffa6)}.day-15-frame .day-15-center{background:#fff;border-radius:5px;box-shadow:4px 8px 16px 0 rgba(0,0,0,.2);height:250px;left:50%;overflow:hidden;position:relative;top:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);width:300px}.day-15-frame .day-15-center .header{align-items:center;border-bottom:1px solid #b0bec5;color:#37474f;display:flex;font-size:18px;height:50px;justify-content:center;position:absolute;top:0;width:300px}.day-15-frame .day-15-center .header-line{background:#64dd17;height:4px;position:absolute;top:50px;-webkit-transform:translateX(-300px);transform:translateX(-300px);width:300px}.day-15-frame .day-15-center .header-line.uploading{-webkit-animation:header-line-animation 3s linear;animation:header-line-animation 3s linear}.day-15-frame .day-15-center .header-line.done{-webkit-transform:translateX(0);transform:translateX(0)}.day-15-frame .day-15-center .upload-field{border:1px dashed #b0bec5;cursor:pointer;height:80px;left:100px;position:absolute;top:80px;width:100px}.day-15-frame .day-15-center .upload-field.uploading{border:transparent}.day-15-frame .day-15-center .upload-field .input{bottom:0;left:0;opacity:0;position:absolute;right:0;top:0}.day-15-frame .day-15-center .upload-field .cloud{color:#b0bec5;font-size:60px;margin-top:10px}.day-15-frame .day-15-center .upload-field .cloud:hover{color:#64dd17}.day-15-frame .day-15-center .upload-field .file-name{background:#fff;color:#b0bec5;font-size:14px;height:70px;margin-top:10px;position:absolute;z-index:1}.day-15-frame .day-15-center .upload-field .loading{-webkit-animation:uploading 2s linear infinite;animation:uploading 2s linear infinite;color:#b0bec5;font-size:60px;margin-top:10px}.day-15-frame .day-15-center .upload-field .check{color:#b0bec5;font-size:60px;margin-top:10px}.day-15-frame .day-15-center .button{background:#64dd17;border-bottom:3px solid #689f38;border-radius:5px;color:#fff;cursor:pointer;font-size:18px;height:30px;left:80px;padding-top:10px;position:absolute;text-align:center;top:190px;width:140px}.day-15-frame .day-15-center .button:hover{box-shadow:0 0 11px 3px rgba(100,221,23,.5)}@-webkit-keyframes uploading{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes uploading{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@-webkit-keyframes header-line-animation{0%{-webkit-transform:translateX(-300px);transform:translateX(-300px)}to{-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes header-line-animation{0%{-webkit-transform:translateX(-300px);transform:translateX(-300px)}to{-webkit-transform:translateX(0);transform:translateX(0)}}
/*# sourceMappingURL=main.76da6fb1.css.map*/