*{box-sizing:border-box}body,html{padding:0;margin:0;font-family:sans-serif}html{font-size:100%;line-height:100%;color:#333}@media screen and (min-width:600px){html{font-size:150%;line-height:150%}}@media screen and (min-width:800px){html{font-size:200%;line-height:200%}}@media screen and (min-width:1200px){html{font-size:250%;line-height:250%}}.input-container{padding:1rem}.input-container label{display:block;font-size:1.5rem;line-height:1.5rem;text-transform:uppercase}.input-container input{width:3rem;font-size:1rem;line-height:1rem;text-align:center;border:none;outline:none!important;-moz-appearance:textfield}.input-container input::-webkit-inner-spin-button,.input-container input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.input-container .icon{color:#cc7333;opacity:.7;-webkit-transition:opacity .4s ease-in-out;transition:opacity .4s ease-in-out}.input-container .icon:hover{opacity:1;cursor:pointer}.progress-container{height:.3rem;margin-bottom:5px;background-color:#f4f4f4}.progress-container .progress{height:100%;background-color:#36c;-webkit-transition:width .4s ease-in-out;transition:width .4s ease-in-out}.stats-container .stat{padding:1rem}.menu-container{grid-area:menu;display:-webkit-flex;display:flex;-webkit-flex-direction:column;flex-direction:column;-webkit-justify-content:space-around;justify-content:space-around;-webkit-align-items:center;align-items:center;border-radius:10px;text-align:center}@media screen and (orientation:portrait){.menu-container{-webkit-flex-direction:row;flex-direction:row}}.menu-container .action-icon{font-size:3rem;color:#cc7333;opacity:.7;-webkit-transition:opacity .4s ease-in-out;transition:opacity .4s ease-in-out}.menu-container .action-icon:hover{opacity:1;cursor:pointer}.card-container{display:inline-block;padding:.2rem;-webkit-perspective:1000px;perspective:1000px;vertical-align:top}.card{position:relative;width:100%;height:100%;border:1px solid #ccc;-webkit-transition:box-shadow,-webkit-transform;transition:box-shadow,-webkit-transform;transition:transform,box-shadow;transition:transform,box-shadow,-webkit-transform;-webkit-transition-duration:.5s;transition-duration:.5s;-webkit-transform-style:preserve-3d;transform-style:preserve-3d}.card .back,.card .front{position:absolute;top:0;left:0;width:100%;height:100%;-webkit-backface-visibility:hidden;backface-visibility:hidden}.card .front{display:inline-table;font-size:2.5rem;background:#fff;-webkit-transform:rotateY(180deg);transform:rotateY(180deg);-webkit-transition:color .5s ease-in-out;transition:color .5s ease-in-out}.card .back{z-index:2;-webkit-transform:rotateY(0deg);transform:rotateY(0deg);background:#36c;background:-webkit-linear-gradient(335deg,transparent 75%,hsla(0,0%,100%,.8) 0) 0 0,-webkit-linear-gradient(205deg,transparent 75%,hsla(0,0%,100%,.8) 0) 0 0,-webkit-linear-gradient(335deg,transparent 75%,hsla(0,0%,100%,.8) 0) 7px -15px,-webkit-linear-gradient(205deg,transparent 75%,hsla(0,0%,100%,.8) 0) 7px -15px,#36c;background:linear-gradient(115deg,transparent 75%,hsla(0,0%,100%,.8) 0) 0 0,linear-gradient(245deg,transparent 75%,hsla(0,0%,100%,.8) 0) 0 0,linear-gradient(115deg,transparent 75%,hsla(0,0%,100%,.8) 0) 7px -15px,linear-gradient(245deg,transparent 75%,hsla(0,0%,100%,.8) 0) 7px -15px,#36c;background-size:15px 30px;cursor:pointer}.card.locked .back{cursor:not-allowed}.card.done,.card.open{-webkit-transform:rotateY(180deg);transform:rotateY(180deg)}.card.open,.card:hover{box-shadow:0 0 10px rgba(0,0,0,.2)}.card.done{box-shadow:inset 0 0 5px rgba(0,0,0,.2)}.card.done .front{//background:#cfc;//color:#3dd28d;color:#ccc}.card .front .icon{display:table-cell;vertical-align:middle;text-align:center}.done-item{font-size:1.8rem}.done-item>.done-item-text{margin-left:.5rem;vertical-align:middle}.done-box-container{position:absolute;left:50%;top:50%;right:50%;bottom:50%;z-index:10;-webkit-transition:all 1s ease-out;transition:all 1s ease-out}.done-box-container.in{left:0;top:0;right:0;bottom:0;padding:2rem}.done-box-container .done-box{width:100%;height:100%;background:rgba(0,0,0,.75);font-size:.5rem;line-height:.5rem;overflow:hidden;white-space:nowrap;text-overflow:clip;opacity:0;-webkit-transition:all 1s ease-out;transition:all 1s ease-out}.done-box-container.in .done-box{position:relative;padding:1rem;border:1px solid rgba(0,0,0,.2);box-shadow:0 0 15px rgba(0,0,0,.2);opacity:1}.done-box-container .done-box .done-box-inner{width:100%;height:100%;display:grid;grid-template-columns:50% 50%;grid-template-rows:33.3% 33.4% 33.3%;-webkit-align-items:center;align-items:center;grid-template-areas:"cards matches" "success fail" "time time";text-align:center;color:#fff}.done-box-container .done-box .close-icon{position:absolute;top:5px;right:5px;font-size:1rem;color:#fff;opacity:.5;-webkit-transition:opacity .5s;transition:opacity .5s}.done-box-container .done-box .close-icon:hover{opacity:1;cursor:pointer}.cards-container{grid-area:cards;position:relative}.container{display:grid;grid-template-columns:30% 70%;grid-template-rows:auto;grid-template-areas:"menu cards";width:100vw;height:100vh;padding:2rem}@media screen and (orientation:portrait){.container{grid-template-columns:auto;grid-template-rows:30% 70%;grid-template-areas:"menu" "cards"}}
/*# sourceMappingURL=main.f4175657.chunk.css.map */