@import"https://fonts.googleapis.com/css2?family=Rubik+Bubbles&display=swap";@import"https://fonts.googleapis.com/css2?family=Silkscreen:wght@400;700&display=swap";:root{--green: #C3E2C2;--yellow: #5F8670;--orange: #3559E0;--red: #CD8D7A;--font-1: "Rubik Bubbles", cursive;--font-2: "Silkscreen", cursive}*{margin:0;padding:0;box-sizing:border-box}body{width:100%;min-height:300px;height:100vh;font-size:16px;background-color:var(--green)}#root{width:100%;height:100%;font-size:inherit}.wrapper{width:100%;height:100%;display:flex;justify-content:center;align-items:center;flex-direction:column;font-size:inherit;gap:4em}.title{text-align:center}h1{font-size:4em;color:var(--red);font-family:var(--font-1)}.title p{font-size:.8em;font-family:var(--font-2);font-style:italic;color:var(--yellow)}.votes{display:flex;flex-direction:row;gap:3em;font-size:1.5em}.votes h3{color:var(--orange);font-family:var(--font-1);opacity:.5;font-size:1.2em}.votes span{font-size:2em;color:var(--yellow)}.votes button{padding-inline:1em;font-size:1em;font-weight:800;background-color:var(--yellow);cursor:pointer}.votes button:hover{opacity:.5}.timer{display:flex;align-items:center;flex-direction:column}.timer div{font-size:5em;font-weight:800;font-family:var(--font-2)}.timer h2{font-size:3em;font-family:var(--font-1);color:var(--yellow)}.controls{display:flex;gap:1em}.controls button{padding:.5em 1.5em;font-size:1.5em;font-weight:800;font-family:var(--font-1);color:var(--green);background-color:var(--yellow);cursor:pointer}.timesup{animation-name:habis;animation-duration:.5s;animation-iteration-count:infinite}.pause{opacity:.5}@keyframes habis{0%{opacity:1}to{opacity:0}}@media screen and (max-width: 544px){.votes{gap:1em}}@media screen and (max-width: 482px){body{font-size:14px}}@media screen and (max-width: 418px){body{font-size:12px}}@media screen and (max-width: 364px){body{font-size:10px}}
