@import url(https://fonts.googleapis.com/css2?family=Krona+One&family=Roboto&display=swap);a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:"";content:none}table{border-collapse:collapse;border-spacing:0}body{background-color:#eee;display:flex;justify-content:center;border-left:50px solid #222831;border-right:50px solid #222831}h1,h2,h3,h4{font-family:"Krona One",sans-serif;color:#222831}p{font-family:"Roboto",sans-serif;color:#222831}.mainContainer{display:flex;flex-direction:column;align-items:center;justify-content:center;margin:0 15%}.mainContainer .title{margin:2%}.mainContainer .title p{margin-top:2%;padding-bottom:2%;text-align:center;border-bottom:1px solid #00adb5}canvas{background-color:#000}.controls{background-color:#00adb5;border:3px solid #222831;border-radius:5px;padding:2% 5%;margin:2%;display:flex;justify-content:space-between;width:70%}.controls button,.controls input,.controls label,.controls option,.controls select{font-family:sans-serif;color:#222831}.controls button:focus,.controls input:focus,.controls label:focus,.controls option:focus,.controls select:focus{outline:none}.controls .speedContainer{display:flex;flex-direction:column;justify-content:space-evenly;padding:0 2%;border-radius:3px;width:145px;background-color:#eee;box-shadow:0 3px 0 0 rgba(0,0,0,.48)}.controls .speedContainer label{display:flex;justify-content:space-between;border-bottom:1px solid #00adb5}.controls .speedContainer label:hover{border-bottom:1px solid #222831}.controls .presetContainer{display:flex;flex-direction:column;align-items:center;justify-content:space-evenly;width:145px;padding:0 2%;border-radius:3px;background-color:#eee;box-shadow:0 3px 0 0 rgba(0,0,0,.48)}.controls .presetContainer select{border-radius:3px;font-size:.7rem;font-weight:500}.controls .buttonContainer{display:flex;flex-direction:column;width:145px;padding:1% 2%;border-radius:3px;background-color:#eee;box-shadow:0 3px 0 0 rgba(0,0,0,.48)}.controls button{border:none;border-radius:3px;padding:.5rem 1rem;margin:2%;text-decoration:none;background:#222831;font-size:.8rem;color:#fff;cursor:pointer;text-align:center;transition:background .25s ease-in-out,transform .15s ease;-webkit-appearance:none;-moz-appearance:none}.controls button:hover{background:#393e46}.controls button:focus{outline:1px solid #fff;outline-offset:-4px}.controls button:active{transform:scale(.99)}.rulesContainer{border-top:25px solid #222831;padding:3%}.rulesContainer h2{display:inline;border-bottom:2px solid #222831}.rulesContainer p{margin:2% 0;line-height:1.4}.rulesContainer li{margin:1%}
/*# sourceMappingURL=main.94b4fa53.chunk.css.map */