:root{--color-bg:#7a45ff;--color-bg-variant:#5c2dd4;--color-yellow:#ffce67;--color-red:#fd6687;--color-white:#fff;--color-dark:#000;--color-gray:gray}*{border:0;box-sizing:border-box;list-style:none;margin:0;outline:0;padding:0;text-decoration:none}html{background-color:#7a45ff;background-color:var(--color-bg);font-family:Arial,Helvetica,sans-serif;font-size:62.5%;scroll-behavior:smooth}.container{margin:0 auto}p{font-size:5.5rem}h1{font-size:6rem}h2{font-size:2rem}h3{font-size:1.6rem}.main__container{background-color:var(--color-bg-variant);height:100vh;width:100vw}.main__container,.main__content{align-items:center;display:flex;justify-content:center}.main__content{background-color:var(--color-bg);border-bottom:3px solid var(--color-dark);border:solid var(--color-dark);border-radius:40px;border-width:3px 3px 15px;flex-direction:column;height:80vh;margin:0 auto;max-height:600px;max-width:450px;width:60vw}.main__logo{height:50px;margin:40px auto 80px;width:50px}.main__button{align-items:center;border-bottom:3px solid var(--color-dark);border:solid var(--color-dark);border-radius:20px;border-width:3px 3px 12px;color:var(--color-dark);display:flex;font-size:2rem;font-weight:600;height:80px;justify-content:space-between;margin:10px;min-width:300px;padding:15px;width:80%}.main__button:hover{border-color:var(--color-bg-variant)}.button-pink{background-color:var(--color-red);color:var(--color-white)}.button-yellow{background-color:var(--color-yellow)}.button-withe{background-color:var(--color-white)}.button__icon{width:60px}@media (max-width:640px){.main__container{background-color:var(--color-bg)}.main__content{border:none}}.game-container{display:flex;flex-direction:column;justify-content:center;min-height:100vh;position:relative}.menu__container{align-items:center;display:grid;grid-template-columns:1fr 1fr 1fr;justify-items:center;margin:0 auto;max-width:750px;min-width:310px;width:90vw}.game__button{border-radius:40px;color:var(--color-white);font-size:1.5rem;font-weight:600;padding:10px 20px;text-align:center;width:110px}.menu__button{background-color:var(--color-bg-variant)}.menu__button:hover{background-color:var(--color-red)}.restart__button{background-color:var(--color-bg-variant);cursor:pointer}.restart__button:hover{background-color:var(--color-red)}.menu__container .main__logo{height:60px;margin:0 auto;padding:2px;width:60px}.game__container{align-items:center;flex-direction:row;margin:76px 0 136px}.game__container,.player__card{display:flex;justify-content:center;position:relative}.player__card{background-color:var(--color-white);border:solid;border-radius:20px;border-width:3px 3px 15px;flex-direction:column;height:165px;margin:45px;width:140px}.player__card img{left:calc(50% - 25px);position:absolute;top:-25px;width:50px}.player__card h2{font-size:2rem;margin-top:32px;text-align:center}.player__card p{font-size:5.5rem;font-weight:600;text-align:center}.game__board{position:relative}.white-board{height:584px}.black-board,.white-board{background-position:50%;background-repeat:no-repeat;background-size:100%;width:632px}.black-board{height:594px;left:0;position:absolute;top:1.4px;z-index:-1}.winner-color{background-color:var(--color-bg-variant);border-radius:60px 60px 0 0;bottom:0;height:calc(50% - 245px);position:absolute;width:100%;z-index:-2}.winner-red{background-color:var(--color-red)}.winner-yellow{background-color:var(--color-yellow)}@media (max-width:1060px){.menu__container{margin-top:10px}.game__container{flex-wrap:wrap;margin-top:15px}.player__card{border-bottom:12px solid;flex-direction:row;height:100px;justify-content:space-evenly;margin:20px;order:1;width:280px}.player__card p{align-self:center}.player-1-card img{left:-25px;top:calc(50% - 30px)}.player-2-card img{left:auto;right:-25px;top:calc(50% - 30px)}.player-2-card h2{order:2}.player-2-card p{order:1}.game__board{order:2}.winner-color{height:calc(50% - 290px)}}@media (max-width:640px){.game__container{margin-bottom:180px}.player__card{flex-direction:column;height:12vw;margin:10px;min-height:100px;width:38%}.player__card h2{font-size:1.5rem;margin-top:10px;order:1}.player__card p{font-size:4.5rem;order:2}.white-board{height:88.3vw;min-height:282.56px}.black-board,.white-board{min-width:304px;width:95vw}.black-board{height:89.6vw;min-height:286.72px}.winner-color{height:calc(50% - 40vw)}}.game__board .column{height:100%;position:absolute;top:0;width:13.45%}.game__board .column-1{left:1.58%}.game__board .column-2{left:15.5%}.game__board .column-3{left:29.43%}.game__board .column-4{left:43.35%}.game__board .column-5{left:57.28%}.game__board .column-6{left:71.2%}.game__board .column-7{left:85.12%}.disk{height:11.98%;width:11.08%;z-index:-1}.disk,.marker{position:absolute}.marker{height:40px;top:-40px;width:40px}.winner-circle{height:6.33%;position:absolute;width:6.85%}.timer__container{bottom:calc(50% - 410px);color:var(--color-white);height:165px;left:calc(50% - 100px);position:absolute;width:200px}.timer-2{color:var(--color-dark)}.timer{background-position:50%;background-repeat:no-repeat;background-size:100%;height:100%;position:relative;width:100%}.timer h3{top:30%}.timer h3,.timer p{left:0;position:absolute;text-align:center;width:100%}.timer p{font-size:5.5rem;font-weight:600;top:45%}@media (max-width:1060px){.timer__container{bottom:calc(50% - 480px)}}@media (max-width:640px){.timer__container{bottom:-140px}}.winner__container{bottom:calc(50% - 430px);color:var(--color-dark);height:180px;left:calc(50% - 145px);position:absolute;width:290px}.winner{background-position:50%;background-repeat:no-repeat;background-size:100%;height:100%;position:relative;width:100%}.winner h3{top:15%}.winner h3,.winner p{left:0;position:absolute;text-align:center;width:100%}.winner p{font-size:5.5rem;font-weight:600;top:25%}.winner button{background-color:var(--color-bg-variant);left:calc(50% - 67px);position:absolute;top:60%;width:135px}.winner button:hover{background-color:var(--color-red);cursor:pointer}@media (max-width:1060px){.winner__container{bottom:calc(50% - 498px)}}@media (max-width:640px){.winner__container{bottom:-155px}}.modal__container{background-color:rgba(0,0,0,.5);height:100%;left:0;position:fixed;top:0}.modal__container,.modal__content{align-items:center;display:flex;justify-content:center;width:100%}.modal__content{background-color:var(--color-bg);border-bottom:3px solid var(--color-dark);border:solid var(--color-dark);border-radius:10%;border-width:3px 3px 15px;flex-direction:column;height:90vh;margin:0 auto;max-height:500px;max-width:480px}.modal__content p{color:var(--color-white);font-weight:600;margin-bottom:20px;margin-top:50px}.modal__button{border-bottom:3px solid var(--color-dark);border:solid var(--color-dark);border-radius:20px;border-width:3px 3px 15px;font-size:2.2rem;font-weight:600;height:80px;margin-top:20px;text-align:center;width:80%}.white-button{background-color:var(--color-white);color:var(--color-dark)}.modal__button:hover{border-color:var(--color-bg-variant)}.red-button{background-color:var(--color-red);color:var(--color-white);padding:20px}@media (max-width:640px){.modal__content{width:90%}}.rules__container{align-items:center;display:flex;justify-content:center;min-height:100vh;width:100vw}.rules__content{background-color:var(--color-white);border:3px solid var(--color-dark);border-bottom:15px solid;border-radius:40px;height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;max-width:500px;min-height:600px;padding-bottom:20px;position:relative;width:85%}.rules__content h1{margin:40px 0;text-align:center}.rules__content h2{color:var(--color-bg);font-size:2.2rem;margin-left:30px}.rules__content p{color:var(--color-gray)}.rules__content ol,.rules__content p{font-size:1.6rem;margin:30px}.rules__content ol li{align-items:center;color:var(--color-gray);display:flex;margin:20px 0}.rules__content ol li span{align-self:flex-start;font-size:1.8rem;font-weight:600;padding:0 20px 0 0}.ok-button{bottom:-50px;height:84px;left:calc(50% - 40px);position:absolute;width:80px}.ok-button circle:hover{stroke:var(--color-bg)}
/*# sourceMappingURL=main.2e0d0cd0.css.map*/