@font-face{font-family:today_sans_now_probold;src:url(/fonts/todaysansnowpro-bold-webfont.woff2) format('woff2'),url(/fonts/todaysansnowpro-bold-webfont.woff) format('woff');font-weight:400;font-style:normal}
@font-face{font-family:today_sans_now_probold_italic;src:url(/fonts/todaysansnowpro-bolditalic-webfont.woff2) format('woff2'),url(/fonts/todaysansnowpro-bolditalic-webfont.woff) format('woff');font-weight:400;font-style:normal}
@font-face{font-family:today_sans_now_probook;src:url(/fonts/todaysansnowpro-book-webfont.woff2) format('woff2'),url(/fonts/todaysansnowpro-book-webfont.woff) format('woff');font-weight:400;font-style:normal}
@font-face{font-family:today_sans_now_probook_italic;src:url(/fonts/todaysansnowpro-bookitalic-webfont.woff2) format('woff2'),url(/fonts/todaysansnowpro-bookitalic-webfont.woff) format('woff');font-weight:400;font-style:normal}
@font-face{font-family:today_sans_now_proitalic;src:url(/fonts/todaysansnowpro-italic-webfont.woff2) format('woff2'),url(/fonts/todaysansnowpro-italic-webfont.woff) format('woff');font-weight:400;font-style:normal}
@font-face{font-family:today_sans_now_proregular;src:url(/fonts/todaysansnowpro-regular-webfont.woff2) format('woff2'),url(/fonts/todaysansnowpro-regular-webfont.woff) format('woff');font-weight:400;font-style:normal}
body{margin:0;-ms-scroll-chaining:none;overscroll-behavior:none}
*{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;outline:0;box-shadow:none;touch-action:none;-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:none}
html{-webkit-text-size-adjust:none}
body{background-size:cover;background-repeat:no-repeat;background-position:center;min-height:100%}
#canvas{min-height:100vh;text-align:center;margin:auto;width:100%;box-sizing:border-box}
#canvas #myProgress{width:100%;background-color:#fff;border:4px solid #1d3544;border-radius:5px;box-sizing:border-box}
#canvas #myBar{width:0%;height:20px;background-color:#ed8b00;transition:width .5s linear}
#canvas #myBar.fastBar{transition:width 75ms linear}
#canvas #myBar.emptyBar{transition:width 10ms linear}
#canvas #myBar.refillBar{transition:width .1s linear}
#canvas #myBar.disabled{transition:none}
#canvas .header{text-align:center;padding:20px;padding-top:9px}
#canvas .header h2{font-family:today_sans_now_probold;text-transform:uppercase;margin:0;font-size:48px;line-height:normal;vertical-align:middle}
#canvas .cardsContainer{display:flex;justify-content:center;flex-flow:column;margin:auto}
#canvas .cardsContainer>div{display:flex;flex-flow:row;justify-content:center}
#canvas .cardsContainer ::-moz-selection{background:0 0}
#canvas .cardsContainer ::selection{background:0 0}
#canvas .cardsContainer .container{width:60px;height:60px;position:relative;-webkit-perspective:800px;perspective:800px;margin:4px;cursor:pointer;-webkit-perspective:1000;-webkit-backface-visibility:hidden}
#canvas .cardsContainer .container .card{width:100%;height:100%;transition:-webkit-transform .5s;transition:transform .5s;transition:transform .5s,-webkit-transform .5s;-webkit-transform-style:preserve-3d;transform-style:preserve-3d}
@-webkit-keyframes match{
50%{-webkit-transform:scale(1.1) rotateY(180deg);transform:scale(1.1) rotateY(180deg)}
100%{-webkit-transform:scale(1) rotateY(180deg);transform:scale(1) rotateY(180deg)}
}
@keyframes match{
50%{-webkit-transform:scale(1.1) rotateY(180deg);transform:scale(1.1) rotateY(180deg)}
100%{-webkit-transform:scale(1) rotateY(180deg);transform:scale(1) rotateY(180deg)}
}
#canvas .cardsContainer .container .card.flipped{-webkit-transform:rotateY(180deg);transform:rotateY(180deg)}
#canvas .cardsContainer .container .card.flipped.match{-webkit-animation:match .25s ease-in-out;animation:match .25s ease-in-out;-webkit-animation-delay:.65s;animation-delay:.65s}
#canvas .cardsContainer .container .card .front{display:block;height:100%;width:100%;position:absolute;-webkit-backface-visibility:hidden;backface-visibility:hidden;border-radius:4px;border-radius:10px;overflow:hidden;box-sizing:border-box;padding:5px;margin:4px;top:-3px;left:-3px;pointer-events:none;-o-object-fit:contain;object-fit:contain}
#canvas .cardsContainer .container .card .back{background:#e0f;-webkit-transform:rotateY(180deg);transform:rotateY(180deg);width:100%;height:100%;display:block;position:absolute;background-size:contain;background-repeat:no-repeat;background-position:center;border:3px solid #000;border-radius:10px;overflow:hidden;box-sizing:border-box;padding:5px;box-shadow:-1px -1px #00000054;margin:4px;background-size:90%;top:-3px;left:-3px;pointer-events:none;-o-object-fit:contain;object-fit:contain}
#canvas .cardsContainer .container .card .back .image{width:100%;display:block;height:100%;background-size:contain;background-repeat:no-repeat;background-position:center;pointer-events:none}
.hidden{display:none!important;visibility:hidden}