*{box-sizing:border-box}body{margin:0}.App{align-items:flex-start;background-color:#141539;display:flex;flex-direction:column;font-family:Mouser,sans-serif;height:700px;justify-content:center;min-height:100vh;padding:2rem;position:relative;width:100vw;z-index:0}.App .btn-rules{background-color:inherit;border:2px solid #fff;border-radius:5px;bottom:30px;color:#fff;cursor:pointer;font-size:1.2rem;padding:10px 30px;position:absolute;right:30px}.App .btn-rules:hover{text-decoration:underline;text-underline-offset:8px}.modal{background-color:#fff;border:none;border-radius:10px;height:370px;left:50%;padding:20px;position:absolute;top:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);width:370px;z-index:100}@media only screen and (max-width:800px){.App{align-items:center;display:flex;flex-direction:column;height:700px;justify-content:flex-start;min-height:100vh;min-width:350px}.App .btn-rules{background-color:inherit;border:2px solid #fff;border-radius:5px;bottom:auto;color:#fff;cursor:pointer;font-size:1.2rem;padding:10px 30px;position:relative;right:auto}.App .btn-rules:hover{text-decoration:underline;text-underline-offset:8px}}.score-main{align-items:center;background-color:#141539;display:flex;height:10rem;justify-content:center;min-width:500px;width:100%}.score-main .score-container{border:4px solid #fff;height:90%;justify-content:space-between;min-width:400px;padding:2rem;width:50%}.score-main .point,.score-main .score-container{align-items:center;border-radius:20px;display:flex}.score-main .point{background-color:#fff;flex-direction:column;font-size:1.5rem;height:6.5rem;justify-content:space-around;padding:1rem;width:8rem}@media only screen and (max-width:800px){.score-main{align-items:center;background-color:#141539;display:flex;height:9rem;justify-content:center;min-width:300px;width:100%}.score-main .logo{margin-left:-1rem;scale:.8}.score-main .score-container{border:4px solid #fff;height:90%;justify-content:space-between;min-width:300px;padding:.6rem;width:50%}.score-main .point,.score-main .score-container{align-items:center;border-radius:20px;display:flex}.score-main .point{background-color:#fff;flex-direction:column;font-size:1.3rem;height:6.5rem;justify-content:space-around;padding:1rem;width:6rem}}.easy-main{background-color:#141539;height:500px;min-height:70vh;padding:5rem;position:relative;width:100%}.easy-main,.easy-main .back{align-items:center;display:flex;justify-content:center}.easy-main .back{position:absolute}.easy-main .triangle{z-index:0}.easy-main .paper-container{background-color:#6495ed;box-shadow:0 7px 0 0 #324e80;height:160px;left:-80px;position:absolute;top:-80px;width:160px}.easy-main .paper-container,.easy-main .paper-container .key-paper{align-items:center;border-radius:50%;display:flex;justify-content:center}.easy-main .paper-container .key-paper{background-color:#fff;border:none;box-shadow:inset 0 7px 0 0 silver;height:130px;width:130px}.easy-main .scissors-container{align-items:center;background-color:#e1af34;border-radius:50%;box-shadow:0 7px 0 0 #b98c1b;display:flex;height:160px;justify-content:center;position:absolute;right:-80px;top:-80px;width:160px}.easy-main .scissors-container .key-scissors{align-items:center;background-color:#fff;border:none;border-radius:50%;box-shadow:inset 0 7px 0 0 silver;display:flex;height:130px;justify-content:center;width:130px}.easy-main .rock-container{background-color:#ff2b06;bottom:-80px;box-shadow:0 7px 0 0 #a31800;height:160px;left:80;position:absolute;width:160px}.easy-main .rock-container,.easy-main .rock-container .key-rock{align-items:center;border-radius:50%;display:flex;justify-content:center}.easy-main .rock-container .key-rock{background-color:#fff;border:none;box-shadow:inset 0 7px 0 0 silver;height:130px;width:130px}@media only screen and (max-width:800px){.easy-main{background-color:#141539;height:400px;padding:1rem;position:relative;width:100%}.easy-main,.easy-main .back{align-items:center;display:flex;justify-content:center}.easy-main .back{position:absolute}.easy-main .triangle{-webkit-transform:scale(.6);transform:scale(.6);z-index:0}.easy-main .paper-container{background-color:#6495ed;box-shadow:0 7px 0 0 #324e80;height:120px;left:-10px;position:absolute;top:-10px;width:120px}.easy-main .paper-container,.easy-main .paper-container .key-paper{align-items:center;border-radius:50%;display:flex;justify-content:center}.easy-main .paper-container .key-paper{background-color:#fff;border:none;box-shadow:inset 0 7px 0 0 silver;height:100px;width:100px}.easy-main .scissors-container{align-items:center;background-color:#e1af34;border-radius:50%;box-shadow:0 7px 0 0 #b98c1b;display:flex;height:120px;justify-content:center;position:absolute;right:-10px;top:-10px;width:120px}.easy-main .scissors-container .key-scissors{align-items:center;background-color:#fff;border:none;border-radius:50%;box-shadow:inset 0 7px 0 0 silver;display:flex;height:100px;justify-content:center;width:100px}.easy-main .rock-container{background-color:#ff2b06;bottom:-10px;box-shadow:0 7px 0 0 #a31800;height:120px;left:10;position:absolute;width:120px}.easy-main .rock-container,.easy-main .rock-container .key-rock{align-items:center;border-radius:50%;display:flex;justify-content:center}.easy-main .rock-container .key-rock{background-color:#fff;border:none;box-shadow:inset 0 7px 0 0 silver;height:100px;width:100px}}.result-main{display:grid;grid-template-columns:50% 50%}.test{display:grid;grid-template-columns:30% 40% 30%}.result-main{background-color:#141539;height:500px;padding:5rem;width:100%;z-index:0}.result-main .computer-choose,.result-main .user-choose{align-items:center;display:flex;flex-direction:column;justify-content:center;position:relative}.result-main .div-u-3{align-items:center;background-color:#22235e;border-radius:50%;display:flex;display:none;flex-direction:column;height:480px;justify-content:center;position:absolute;width:480px}.result-main .div-u-3-show{display:flex}.result-main .div-u-2{background-color:#292a70;height:360px;width:360px}.result-main .div-u-1,.result-main .div-u-2{align-items:center;border-radius:50%;display:flex;flex-direction:column;justify-content:center}.result-main .div-u-1{background-color:#303282;height:240px;width:240px}.result-main .text{color:#fff;font-size:1.1rem;margin-bottom:2rem;z-index:2}.result-main .com-picked,.result-main .you-picked{position:absolute;top:-40px}.result-main .result-text{font-size:1.9rem;font-weight:600;white-space:nowrap;z-index:2}.result-main .result-part{flex-direction:column;z-index:3}.result-main .container,.result-main .result-part{align-items:center;display:flex;justify-content:center}.result-main .container{border-radius:50%;height:160px;width:160px;z-index:2}.result-main .paper-container{background-color:#6495ed;box-shadow:0 7px 0 0 #324e80;z-index:2}.result-main .scissors-container{background-color:#e1af34;box-shadow:0 7px 0 0 #b98c1b;z-index:2}.result-main .rock-container{background-color:#ff2b06;box-shadow:0 7px 0 0 #a31800;z-index:2}.result-main .com-container{background-color:#b8b8b8;box-shadow:0 7px 0 0 grey;z-index:2}.result-main .key{align-items:center;background-color:#fff;border:none;border-radius:50%;box-shadow:inset 0 7px 0 0 silver;display:flex;height:130px;justify-content:center;width:130px;z-index:2}.result-main .btn-play{border:none;border-radius:10px;color:navy;cursor:pointer;font-size:1.1rem;padding:.9rem 1.8rem;white-space:nowrap}.result-main .btn-play:hover{color:red}@media only screen and (max-width:750px){.result-main{background-color:#141539;display:grid;grid-template-columns:50% 50%;grid-template-rows:50% 100%;height:400px;padding:5rem 0;width:100%;z-index:0}.result-main .computer-choose,.result-main .user-choose{align-items:center;display:flex;flex-direction:column;justify-content:center;margin:0;position:relative}.result-main .div-u-3{align-items:center;background-color:#22235e;border-radius:50%;display:flex;display:none;flex-direction:column;height:275px;justify-content:center;position:absolute;width:275px}.result-main .div-u-3-show{display:flex}.result-main .div-u-2{background-color:#292a70;height:220px;width:220px}.result-main .div-u-1,.result-main .div-u-2{align-items:center;border-radius:50%;display:flex;flex-direction:column;justify-content:center}.result-main .div-u-1{background-color:#303282;height:165px;width:165px}.result-main .text{color:#fff;font-size:1rem;margin-bottom:2rem;z-index:2}.result-main .com-picked,.result-main .you-picked{position:absolute;top:-40px}.result-main .result-text{font-size:2rem;font-weight:600;white-space:nowrap;z-index:2}.result-main .result-part{flex-direction:column;grid-column:span 2;order:3;z-index:3}.result-main .container,.result-main .result-part{align-items:center;display:flex;justify-content:center}.result-main .container{border-radius:50%;height:120px;width:120px;z-index:2}.result-main .paper-container{background-color:#6495ed;box-shadow:0 7px 0 0 #324e80;z-index:2}.result-main .scissors-container{background-color:#e1af34;box-shadow:0 7px 0 0 #b98c1b;z-index:2}.result-main .rock-container{background-color:#ff2b06;box-shadow:0 7px 0 0 #a31800;z-index:2}.result-main .com-container{background-color:#b8b8b8;box-shadow:0 7px 0 0 grey;z-index:2}.result-main .key{align-items:center;background-color:#fff;border:none;border-radius:50%;box-shadow:inset 0 7px 0 0 silver;display:flex;height:100px;justify-content:center;width:100px;z-index:2}.result-main .btn-play{border:none;border-radius:10px;color:navy;cursor:pointer;font-size:1rem;padding:1rem 4rem;white-space:nowrap}.result-main .btn-play:hover{color:red}}.rules-easy-page{position:relative}.rules-easy-page .title{font-size:1.3rem;left:0;position:absolute;top:0}.rules-easy-page .btn-close{background:inherit;border:none;cursor:pointer;font-size:1.3rem;position:absolute;right:0;top:0}.rules-easy-page .container{align-items:center;display:flex;justify-content:center;padding-top:50px;width:100%}
/*# sourceMappingURL=main.e4fb6e8c.css.map*/