@import url(https://fonts.googleapis.com/css2?family=Raleway:wght@100;200;300;400;500;600;700;800&display=swap);body{font-family:Raleway,sans-serif;margin:0;font-size:1.5em;text-align:center;background:#1b1523;color:#fff}button{background:none;border:2px solid #fff;padding:6px 12px;border-radius:4px;color:#fff;font-weight:700;cursor:pointer;font-size:1em}button:hover{background:#c23866;color:#fff}.card-grid{margin-top:40px;display:grid;grid-template-columns:1fr 1fr 1fr 1fr;grid-gap:5px}@media (min-width:768px){.card-grid{grid-gap:25px}}.card-wrapper{position:relative;box-sizing:initial}.card{border:none;font-size:18px;font-weight:700;display:block;width:58px;height:58px;border-radius:29px;background-color:initial}@media (min-width:768px){.card{width:120px;height:120px;border-radius:60px;font-size:30px}}.card-wrapper .front{position:absolute;-webkit-transform:rotateY(90deg);transition:all .2s ease-in;background-color:#198754;transform:rotateY(90deg)}.flipped .front{-webkit-transform:rotateY(0deg);transform:rotateY(0deg);transition-delay:.2s}.card-wrapper .back{transition:all .2s ease-in;transition-delay:.2s;background-color:#dc3545}.flipped .back{-webkit-transform:rotateY(90deg);transform:rotateY(90deg);transition-delay:0s}
/*# sourceMappingURL=main.0d90a419.chunk.css.map */