:root{--musa-violetti:#9001ff;--musa-tumma-sininen:#2e2d41;--musa-vaalea-sininen:#96deff;--musa-keski-sininen:#52b2de;--musa-vaalea-pinkki:#ff96d2;--musa-tumma-pinkki:#c45895;--musa-tumma-oranssi:#ff7a7a;--musa-vaalea-oranssi:#ffbe96;--reactour-accent:#c85757;--rt-close-btn:#c85757;--info-nuoli:#c85757}body{margin:0}@font-face{font-family:Quicksand;src:url(Quicksand-VariableFont_wght.67fb546e.ttf)}[data-yle-vis-id="2023-04-superihmiset"] .appContainer{background:linear-gradient(to bottom,var(--musa-violetti),var(--musa-tumma-sininen));text-align:center;color:#fff;-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-box-align:center;-webkit-align-items:center;align-items:center;min-height:100vh;font-family:Quicksand;display:-webkit-box;display:-webkit-flex;display:flex;position:relative}[data-yle-vis-id="2023-04-superihmiset"] .App button{cursor:pointer}[data-yle-vis-id="2023-04-superihmiset"] h1{margin:0}[data-yle-vis-id="2023-04-superihmiset"] .disclaimer{text-align:center;background:#faebd7}[data-yle-vis-id="2023-04-superihmiset"] .flex-row{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-webkit-flex-direction:row;flex-direction:row;gap:5px;display:-webkit-box;display:-webkit-flex;display:flex}[data-yle-vis-id="2023-04-superihmiset"] .flex-column{-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-box-align:center;-webkit-align-items:center;align-items:center;gap:10px;max-width:600px;height:100%;display:-webkit-box;display:-webkit-flex;display:flex}[data-yle-vis-id="2023-04-superihmiset"] .empty-box{background-color:#ffebcd;border-radius:50%;-webkit-box-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-box-align:center;-webkit-align-items:center;align-items:center;width:5em;height:5em;display:-webkit-box;display:-webkit-flex;display:flex}[data-yle-vis-id="2023-04-superihmiset"] .game-stats{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-webkit-flex-direction:row;flex-direction:row;-webkit-box-pack:justify;-webkit-justify-content:space-between;justify-content:space-between;-webkit-box-align:center;-webkit-align-items:center;align-items:center;width:100%;margin-top:-10px;margin-bottom:-17px;font-size:small;display:-webkit-box;display:-webkit-flex;display:flex}[data-yle-vis-id="2023-04-superihmiset"] .grid-container{grid-template-rows:repeat(4,1fr);grid-template-columns:repeat(6,1fr);gap:1rem;padding:1rem;display:grid}[data-yle-vis-id="2023-04-superihmiset"] .button-circle{color:#fff;cursor:pointer;border:none;border-radius:50%;width:4.5em;height:4.5em;margin:0 20px -9px;font-family:Quicksand;-webkit-transition:all 1.5s;transition:all 1.5s;-webkit-transform:rotate(0);transform:rotate(0);box-shadow:0 13px 27px -5px rgba(50,50,93,.25),0 8px 16px -8px rgba(0,0,0,.706)}[data-yle-vis-id="2023-04-superihmiset"] .button-circle.red{background:linear-gradient(to right,var(--musa-tumma-oranssi)50%,#c85757 50%);-webkit-transition:all 1.5s;transition:all 1.5s}[data-yle-vis-id="2023-04-superihmiset"] .button-circle.blue{background:linear-gradient(to right,var(--musa-vaalea-sininen)50%,#82b7dc 50%)}[data-yle-vis-id="2023-04-superihmiset"] .info-button{cursor:pointer;background:0 0;border:none;margin-top:10px;margin-right:5px;position:absolute;top:0;right:0}@media (hover:hover){[data-yle-vis-id="2023-04-superihmiset"] .button-circle.red:hover{-webkit-transform:rotate(90deg);transform:rotate(90deg)}[data-yle-vis-id="2023-04-superihmiset"] .button-circle.blue:hover{-webkit-transform:rotate(-90deg);transform:rotate(-90deg)}}[data-yle-vis-id="2023-04-superihmiset"] *{margin:revert;padding:revert;box-sizing:revert;-webkit-animation:.4s transform;animation:.4s transform}[data-yle-vis-id="2023-04-superihmiset"] .cell{--user-selected-cellbg:purple;--user-selected-textcolor:white;--locked-answer-cellbg:green;--locked-answer-textcolor:white;--answer-was-wrong-cellbg:black;--answer-was-wrong-textcolor:white;--answer-was-right-cellbg:green;--answer-was-right-textcolor:white;text-align:center;background:var(--musa-vaalea-sininen);cursor:pointer;border:.5px solid #000;border-radius:5px;-webkit-box-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-box-align:center;-webkit-align-items:center;align-items:center;width:36px;height:36px;margin:2px;display:-webkit-box;display:-webkit-flex;display:flex}[data-yle-vis-id="2023-04-superihmiset"] .cell.correctAnswer{background-color:#aaffbd}[data-yle-vis-id="2023-04-superihmiset"] .cell.userSelected{background:linear-gradient(to right,var(--musa-vaalea-oranssi),var(--musa-tumma-oranssi));color:var(--user-selected-textcolor)}[data-yle-vis-id="2023-04-superihmiset"] .cell.lockedAnswer{background:linear-gradient(to right,var(--musa-vaalea-pinkki),var(--musa-tumma-pinkki));color:var(--locked-answer-textcolor)}[data-yle-vis-id="2023-04-superihmiset"] .resultMessageVisible .cell.userSelected{color:var(--answer-was-wrong-textcolor);background:-webkit-gradient(linear,0 0,100% 0,from(#373737),to(#161616));background:-webkit-linear-gradient(90deg,#373737,#161616);background:linear-gradient(90deg,#373737,#161616)}[data-yle-vis-id="2023-04-superihmiset"] .resultMessageVisible .cell.lockedAnswer{color:var(--answer-was-right-textcolor);background:-webkit-gradient(linear,0 0,100% 0,from(#aaffbd),to(#489d5a));background:-webkit-linear-gradient(90deg,#aaffbd,#489d5a);background:linear-gradient(90deg,#aaffbd,#489d5a)}[data-yle-vis-id="2023-04-superihmiset"] .grid.resultMessageVisible .cell{opacity:.2}[data-yle-vis-id="2023-04-superihmiset"] .grid.resultMessageVisible .userSelected,[data-yle-vis-id="2023-04-superihmiset"] .grid.resultMessageVisible .correctAnswer{opacity:1}[data-yle-vis-id="2023-04-superihmiset"] .grid{color:#000;background-color:rgba(0,0,0,.3);-webkit-box-lines:single;-webkit-flex-wrap:nowrap;flex-wrap:nowrap;max-width:100%;padding:4px;font-family:Quicksand,sans-serif;display:-webkit-box;display:-webkit-flex;display:flex;overflow:hidden}[data-yle-vis-id="2023-04-superihmiset"] .column.light{opacity:.5;background-color:#000}[data-yle-vis-id="2023-04-superihmiset"] .note-image{cursor:pointer;background:gray;border-radius:50%;width:40px;height:40px;margin-left:5px;overflow:hidden}[data-yle-vis-id="2023-04-superihmiset"] .note-image img{width:65%;height:90%;position:relative;left:25%;-webkit-transform:translate(-50%);transform:translate(-50%)}[data-yle-vis-id="2023-04-superihmiset"] .note-image.enabled{background:#7de26e}[data-yle-vis-id="2023-04-superihmiset"] .play-melody-how-many-left{text-align:center;color:#fff;cursor:pointer;background-color:rgba(31,29,62,.26);border:none;border-radius:5px;-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;flex-direction:column;-webkit-box-align:center;-webkit-align-items:center;align-items:center;width:100%;padding:7px;font-family:Quicksand;font-size:smaller;-webkit-transition:all .5s;transition:all .5s;display:-webkit-box;display:-webkit-flex;display:flex;box-shadow:0 13px 27px -5px rgba(50,50,93,.25),0 8px 4px -8px rgba(0,0,0,.706)}[data-yle-vis-id="2023-04-superihmiset"] .progress-bar{background-color:rgba(42,42,42,.345);border-radius:5px;width:205px;height:20px;overflow:hidden}[data-yle-vis-id="2023-04-superihmiset"] .progress{background-image:linear-gradient(to right,var(--musa-vaalea-pinkki),var(--musa-tumma-pinkki));border-radius:5px;height:100%;-webkit-transition:width .5s;transition:width .5s}@media (hover:hover){[data-yle-vis-id="2023-04-superihmiset"] .play-melody-how-many-left:hover{letter-spacing:.52px}}[data-yle-vis-id="2023-04-superihmiset"] .try-again-button{background:linear-gradient(to top,var(--musa-tumma-sininen),rgba(20,20,20,.12));color:#fff;letter-spacing:1px;text-transform:uppercase;cursor:pointer;border:2px solid rgba(0,0,0,.184);border-radius:5px;padding:10px 30px;font-size:small;-webkit-transition:all 1s;transition:all 1s;display:inline-block}@media (hover:hover){[data-yle-vis-id="2023-04-superihmiset"] .try-again-button:hover{letter-spacing:1.3px;box-shadow:0 13px 27px -5px rgba(50,50,93,.25),0 8px 16px -8px rgba(0,0,0,.706)}}[data-yle-vis-id="2023-04-superihmiset"] .over-ui.fade{opacity:.95;z-index:2;opacity:0;background:-webkit-gradient(linear,0 100%,0 0,from(#2f044a),to(#440d88));background:-webkit-linear-gradient(#440d88,#2f044a);background:linear-gradient(#440d88,#2f044a);width:65%;max-width:600px;padding:30px;-webkit-animation-name:fadeInOpacity;animation-name:fadeInOpacity;-webkit-animation-duration:2s;animation-duration:2s;-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;-webkit-animation-iteration-count:1;animation-iteration-count:1;-webkit-animation-delay:1.25s;animation-delay:1.25s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);box-shadow:0 13px 27px -5px rgba(50,50,93,.25),0 8px 16px -8px rgba(0,0,0,.706)}@-webkit-keyframes fadeInOpacity{0%{opacity:0}to{opacity:1}}@keyframes fadeInOpacity{0%{opacity:0}to{opacity:1}}[data-yle-vis-id="2023-04-superihmiset"] #starting-page{width:90%;max-width:500px;margin:auto;display:block}[data-yle-vis-id="2023-04-superihmiset"] .basic-button{background:linear-gradient(to top,var(--musa-tumma-sininen),rgba(20,20,20,.2));color:#fff;letter-spacing:1.8px;text-transform:uppercase;cursor:pointer;border:none;border-radius:5px;padding:15px 32px;-webkit-transition:all 1s;transition:all 1s;display:inline-block}@media (hover:hover){[data-yle-vis-id="2023-04-superihmiset"] .basic-button:hover{letter-spacing:2.6px;box-shadow:0 13px 27px -5px rgba(50,50,93,.25),0 8px 16px -8px rgba(0,0,0,.706)}}
/*# sourceMappingURL=index.a43452c7.css.map */