@import url(https://fonts.googleapis.com/css2?family=Barlow+Semi+Condensed:wght@600;700&display=swap);*{box-sizing:border-box;margin:0;padding:0}body{background:var(--backgroundGradient) no-repeat;background-size:cover;color:#fff;font-family:Barlow Semi Condensed,sans-serif;height:100vh;overflow:hidden}:root{--backgroundGradient:radial-gradient(#1f3756,#141539);--darkText:#3b4363;--scoreText:#2a46c0;--HeaderOutline:#606e85;--scissorsGradient:#ed9f0d;--paperGradient:#4764f5;--RockGradient:#dc2e4e;--LizardGradient:radial-gradient(#834fe3,#8c5de5);--CyanGradient:radial-gradient(#40b9ce,#52bed1)}.container{flex:1 1 auto;margin:0 auto;max-width:1140px;padding:0 15px;width:100%}#root{height:100%;padding:40px 0}.game-wrapper{display:flex;flex-direction:column}.game-wrapper .rules-cta{align-self:flex-end;background:none;border:2px solid var(--HeaderOutline);border-radius:4px;color:#fff;cursor:pointer;font-size:16px;letter-spacing:2px;margin-right:20px;padding:8px 32px;text-transform:uppercase}.gameboard-wrapper{align-items:center;display:flex;justify-content:center;margin-top:40px;padding:70px;position:relative}.gameboard-wrapper .cta-wrapper{background:url(/ReactGame/static/media/bg-triangle.77c6ca418d3751d8f717.svg) no-repeat;background-position:50%;height:278px;max-width:313px;width:100%}.gameboard-wrapper .cta-wrapper>.btn{border-radius:100%;border-style:solid;border-width:25px;box-shadow:inset 0 -8px 0 0 rgba(0,0,0,.2);cursor:pointer;-webkit-filter:brightness(.9);filter:brightness(.9);height:175px;position:absolute;width:175px;z-index:99}.gameboard-wrapper .cta-wrapper>.btn:hover{-webkit-filter:brightness(1);filter:brightness(1)}.gameboard-wrapper .cta-wrapper .btn.paper-btn{border-color:var(--paperGradient);left:30%;top:10px}.gameboard-wrapper .cta-wrapper .btn.scissors-btn{border-color:var(--scissorsGradient);right:30%;top:10px}.gameboard-wrapper .cta-wrapper .btn.rock-btn{border-color:#dc2e4e;bottom:50px;left:42%}.play-area{align-items:center;display:flex;justify-content:space-between;margin:60px auto;max-width:90%}.play-area .computer-card,.play-area .user-card{text-align:center}.play-area .computer-card .computer-title,.play-area .user-card .user-title{font-size:30px;margin-bottom:50px;text-transform:uppercase}.play-area .computer-card .computer-choice,.play-area .user-card .user-choice{background:rgba(0,0,0,.3);border-radius:100%;box-shadow:inset 0 -8px 0 0 rgba(0,0,0,.2);height:200px;width:200px}.play-area .user-card .user-choice.selected{align-items:center;background-color:#fff;display:flex;justify-content:center}.play-area .final-msg{transition:all .3s linear}.play-area .final-msg .final-msg-title{font-size:60px;margin-bottom:12px;text-transform:uppercase}.play-area .final-msg .final-msg-title.computer-win{color:red}.play-area .final-msg .try-again{border-radius:8px;cursor:pointer;font-family:inherit;font-size:20px;letter-spacing:2px;padding:12px 24px;text-transform:uppercase;width:100%}.play-area .final-msg .try-again:hover{background-color:initial;border:1px solid #fff;color:#fff}.play-area .computer-card .computer-choice.selected.paper-choice,.play-area .user-card .user-choice.selected.paper-choice{background:url(/ReactGame/static/media/icon-paper.8b57a6b108c1b8ae8293.svg) #fff no-repeat;background-position:50%;border:25px solid var(--paperGradient)}.play-area .computer-card .computer-choice.selected.rock-choice,.play-area .user-card .user-choice.selected.rock-choice{background:url(/ReactGame/static/media/icon-rock.476e90a9646a87bb3645.svg) #fff no-repeat;background-position:50%;border:25px solid var(--RockGradient)}.play-area .computer-card .computer-choice.selected.scissors-choice,.play-area .user-card .user-choice.selected.scissors-choice{background:url(/ReactGame/static/media/icon-scissors.3b1a5d7eb0b2f1fd3e95.svg) #fff no-repeat;background-position:50%;border:25px solid var(--scissorsGradient)}.play-area .computer-card .computer-choice.animate-options{-webkit-animation:shuffleOptions 1s .5s infinite;animation:shuffleOptions 1s .5s infinite}@-webkit-keyframes shuffleOptions{0%{background:#fff;background-position:50%}25%{background:url(/ReactGame/static/media/icon-paper.8b57a6b108c1b8ae8293.svg) #fff no-repeat;background-position:50%}75%{background:url(/ReactGame/static/media/icon-rock.476e90a9646a87bb3645.svg) #fff no-repeat;background-position:50%}to{background:url(/ReactGame/static/media/icon-scissors.3b1a5d7eb0b2f1fd3e95.svg) #fff no-repeat;background-position:50%}}@keyframes shuffleOptions{0%{background:#fff;background-position:50%}25%{background:url(/ReactGame/static/media/icon-paper.8b57a6b108c1b8ae8293.svg) #fff no-repeat;background-position:50%}75%{background:url(/ReactGame/static/media/icon-rock.476e90a9646a87bb3645.svg) #fff no-repeat;background-position:50%}to{background:url(/ReactGame/static/media/icon-scissors.3b1a5d7eb0b2f1fd3e95.svg) #fff no-repeat;background-position:50%}}.winnerShadowRing{box-shadow:inset 0 -14px 0 0 rgba(0,0,0,.2),0 0 0 4rem rgba(44,59,89,.2),0 0 0 8rem rgba(38,53,84,.3),0 0 0 12rem rgba(33,48,79,.3)}.header-wrapper{align-items:center;border:2px solid var(--HeaderOutline);border-radius:20px;display:flex;justify-content:space-between;padding:32px 28px}.header-wrapper .score-card{align-items:center;background:#fff;border-radius:8px;display:flex;flex-direction:column;height:120px;justify-content:center;width:150px}.header-wrapper .score-card .score-title{color:var(--scoreText);font-size:20px;letter-spacing:2px;text-transform:uppercase}.header-wrapper .score-card .score{color:var(--darkText);font-size:44px;font-weight:700}@media screen and (max-width:568px){.header-wrapper{border-radius:10px;padding:24px 20px}.header-wrapper .score-card{height:100px;width:100px}}.rules-box-overlay{background:rgba(0,0,0,.4);inset:0;position:fixed;z-index:999}.rules-box{background-color:#fff;border-radius:10px;left:50%;padding:40px;position:fixed;top:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.rules-box .model-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:40px}.rules-box .model-header .close-model{all:unset;cursor:pointer;padding:12px}.rules-box .model-header .title{color:var(--darkText);font-size:32px;font-weight:700;text-transform:uppercase}
/*# sourceMappingURL=main.3dec4fbf.css.map*/