:root{--blink-opacity:0.5;--animation-duration:500ms;--p1-color:rgba(100,255,0,.5);--p2-color:rgba(255,157,0,.5);--winner-color:#c9ff64}.square{background:#fff;border:1px solid #999;float:left;font-size:24px;font-weight:700;height:3em;line-height:34px;margin-right:-1px;margin-top:-1px;padding:0;text-align:center;transition:background-color .5s;width:3em}.square.clicked{background-color:rgba(255,0,0,.5)}.square-container{display:inline-block;position:relative}.square-text{color:#000;opacity:1;transition:opacity .5s}.overlay{align-items:center;background-color:hsla(0,0%,100%,0);display:flex;height:100%;justify-content:center;left:0;position:absolute;top:0;width:100%}.board-row{clear:both;display:flex;flex-wrap:wrap}.status{margin-bottom:10px}.game-info{align-items:center;display:flex;flex-direction:column;margin-left:20px}.game-started-message{color:red;font-weight:700}.absolute-wrapper{position:relative}.content-wrapper{margin-bottom:5em;position:relative;width:100%}.content-wrapper,.game-started-div,.interface,.sliders{align-items:center;display:flex;flex-direction:column;justify-content:center}.game-started-div,.sliders{margin:20px;transition:opacity .5s ease-in-out}.fade-in{opacity:1;transition:opacity .5s linear;visibility:visible}.fade-out{opacity:0;transition:visibility 0s .5s,opacity .5s linear;visibility:hidden}@-webkit-keyframes blink-red{0%{background-color:#fff}50%{background-color:rgba(255,0,0,.5);background-color:rgb(255,0,0,var(--blink-opacity))}to{background-color:#fff}}@keyframes blink-red{0%{background-color:#fff}50%{background-color:rgba(255,0,0,.5);background-color:rgb(255,0,0,var(--blink-opacity))}to{background-color:#fff}}.square.blink-red{-webkit-animation-duration:.5s;animation-duration:.5s;-webkit-animation-duration:var(--animation-duration);animation-duration:var(--animation-duration);-webkit-animation-name:blink-red;animation-name:blink-red}@-webkit-keyframes blink-black{0%{background-color:#fff}50%{background-color:rgba(0,0,0,.5);background-color:rgba(0,0,0,var(--blink-opacity))}to{background-color:#fff}}@keyframes blink-black{0%{background-color:#fff}50%{background-color:rgba(0,0,0,.5);background-color:rgba(0,0,0,var(--blink-opacity))}to{background-color:#fff}}.square.blink-black{-webkit-animation-duration:.5s;animation-duration:.5s;-webkit-animation-duration:var(--animation-duration);animation-duration:var(--animation-duration);-webkit-animation-name:blink-black;animation-name:blink-black}.square.p1-square{background-color:rgba(100,255,0,.5);background-color:var(--p1-color)}.square.p2-square{background-color:rgba(255,157,0,.5);background-color:var(--p2-color)}.square.winning-square{background-color:#c9ff64;background-color:var(--winner-color)}.slider-container{align-items:center;display:flex;flex-direction:column;height:80px;width:100%}.slider{-webkit-appearance:none;background:#d3d3d3;border-radius:5px;height:15px;opacity:.7;outline:none;transition:opacity .2s;width:30em}.slider:hover{opacity:1}.slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;background:#4caf50;border-radius:50%;cursor:pointer;height:25px;width:25px}.slider::-moz-range-thumb{background:#4caf50;border-radius:50%;cursor:pointer;height:25px;width:25px}
/*# sourceMappingURL=main.3c8ece20.css.map*/