@import"https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200..1000;1,200..1000&display=swap";.bg_container{position:absolute;width:100%;height:90vh;background-color:transparent;overflow:hidden}.bg_card_img{position:absolute;height:80px;width:50px;border-radius:5px;box-shadow:1px 1px 10px #222;transform-style:preserve-3d;transform:translate(-400px)}.img-1{background:url(/imgs/anime/card1.jpg) no-repeat center center/cover;animation:moveCard1 60s infinite 40s}.img-2{background:url(/imgs/cities/card2.jpg) no-repeat center center/cover;animation:moveCard2 49s infinite}.img-3{background:url(/imgs/anime/card11.jpg) no-repeat center center/cover;animation:moveCard3 42s infinite}.img-4{background:url(/imgs/anime/card6.jpg) no-repeat center center/cover;animation:moveCard4 59s infinite 10s}.img-5{background:url(/imgs/cities/card14.jpg) no-repeat center center/cover;animation:moveCard5 52s infinite 30s}.img-6{background:url(/imgs/anime/card8.jpg) no-repeat center center/cover;animation:moveCard6 49s infinite 20s}.img-7{background:url(/imgs/anime/card5.jpg) no-repeat center center/cover;animation:moveCard7 58s infinite 15}.img-8{background:url(/imgs/cities/card4.jpg) no-repeat center center/cover;animation:moveCard8 53s infinite 20s}.img-9{background:url(/imgs/anime/card14.jpg) no-repeat center center/cover;animation:moveCard9 50s infinite 10s}@keyframes moveCard1{0%{transform:rotateX(50deg) rotateY(20deg) rotate(-35deg) translateY(10px) translate(-400px);opacity:1}to{transform:rotateX(50deg) rotateY(20deg) rotate(-35deg) translateY(100px) translate(800px);opacity:0}}@keyframes moveCard2{0%{transform:rotateX(50deg) rotateY(20deg) rotate(-35deg) translateY(50px) translate(-400px);opacity:1}to{transform:rotateX(50deg) rotateY(20deg) rotate(-35deg) translateY(150px) translate(800px);opacity:0}}@keyframes moveCard3{0%{transform:rotateX(50deg) rotateY(20deg) rotate(-35deg) translateY(100px) translate(-600px);opacity:1}to{transform:rotateX(50deg) rotateY(20deg) rotate(-35deg) translateY(300px) translate(800px);opacity:0}}@keyframes moveCard4{0%{transform:rotateX(50deg) rotateY(20deg) rotate(-35deg) translateY(150px) translate(-600px);opacity:1}to{transform:rotateX(50deg) rotateY(20deg) rotate(-35deg) translateY(300px) translate(800px);opacity:0}}@keyframes moveCard5{0%{transform:rotateX(50deg) rotateY(20deg) rotate(-35deg) translateY(200px) translate(-600px);opacity:1}to{transform:rotateX(50deg) rotateY(20deg) rotate(-35deg) translateY(400px) translate(800px);opacity:0}}@keyframes moveCard6{0%{transform:rotateX(50deg) rotateY(20deg) rotate(-35deg) translateY(250px) translate(-600px);opacity:1}to{transform:rotateX(50deg) rotateY(20deg) rotate(-35deg) translateY(500px) translate(800px);opacity:0}}@keyframes moveCard7{0%{transform:rotateX(50deg) rotateY(20deg) rotate(-35deg) translateY(300px) translate(-600px);opacity:1}to{transform:rotateX(50deg) rotateY(20deg) rotate(-35deg) translateY(500px) translate(400px);opacity:0}}@keyframes moveCard8{0%{transform:rotateX(50deg) rotateY(20deg) rotate(-35deg) translateY(350px) translate(-600px);opacity:1}to{transform:rotateX(50deg) rotateY(20deg) rotate(-35deg) translateY(550px) translate(400px);opacity:0}}@keyframes moveCard9{0%{transform:rotateX(50deg) rotateY(20deg) rotate(-35deg) translateY(400px) translate(-600px);opacity:1}to{transform:rotateX(50deg) rotateY(20deg) rotate(-35deg) translateY(600px) translate(400px);opacity:0}}.navbar{display:flex;align-items:center;height:10vh;width:100%;background-color:var(--nav-bg);color:var(--text-color)}.navbar_title{margin-left:1rem}:root{--text-color: rgba(244, 244, 245, 1);--nav-bg: rgba(27, 27, 35, .9);--main-bg: rgba(27, 27, 75, .9)}*{margin:0;padding:0;box-sizing:border-box;font-family:Nunito,sans-serif;font-style:normal;color:var(--text-color)}body{background:linear-gradient(to right,#000a23,#02152b)}.wrapper{position:relative;height:90vh;width:100%}.loading{position:fixed;top:0;left:0;height:100vh;width:100vw;display:flex;align-items:center;justify-content:center;background:linear-gradient(to right,#000a23,#02152b);z-index:999}.memory-icon{cursor:pointer;border:2px solid #ccc;border-radius:.5rem;width:2rem;height:2rem;padding:.1rem}@media screen and (max-width: 480px){.memory-icon{width:1.5rem;height:1.5rem}}.memory_container{display:flex;justify-content:center;align-items:center;height:100%}.memory{display:grid;gap:10px;height:95%;width:100%}.easy_memory{grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(4,minmax(5rem,auto));max-width:450px}.medium_memory{grid-template-columns:repeat(6,1fr);grid-template-rows:repeat(4,minmax(5rem,auto));max-width:700px}.hard_memory{grid-template-columns:repeat(8,1fr);grid-template-rows:repeat(4,minmax(5rem,auto));max-width:900px}.card{position:relative;width:100%;height:100%;overflow:hidden;-webkit-user-select:none;user-select:none;cursor:pointer}.card_img{position:absolute;object-fit:cover;width:100%;height:100%;transform-style:preserve-3d;backface-visibility:hidden;transform:rotateY(0);transition:all .3s ease}.card_cover{position:absolute;object-fit:cover;background-color:#333;width:100%;height:100%;transform-style:preserve-3d;transition:all .3s ease}.card_cover_hidden{display:none}.card_hide{animation:.5s hide_card!important;outline:1px solid #ab0d2f}.card_appear{animation:.5s appear_card;cursor:not-allowed}.correct_cards{opacity:.5;box-shadow:1px 1px 20px #258d1999;animation:.5s correct_cards;cursor:not-allowed}.correct_cards>.card_cover{display:none}@keyframes appear_card{0%{transform:rotateY(180deg)}to{transform:rotateY(0)}}@keyframes hide_card{0%{outline:1px solid #ab0d2f}to{outline:10px solid #ab0d2f00}}@keyframes correct_cards{0%{outline:1px solid #258d19;opacity:1}to{outline:10px solid #258d1900;opacity:.5}}.memory_controls{display:flex;flex-direction:column;justify-content:space-between;height:100%;padding:2rem;width:100%;max-width:12rem}.nav{display:flex;justify-content:space-evenly;z-index:50;gap:1rem}.modal_end_game{position:fixed;height:90vh;width:100vw;display:flex;justify-content:center;align-items:center;background:linear-gradient(to right,#000a2399,#02152b99);z-index:800}.end_game_details{background:linear-gradient(to right,#000a23,#02152b);padding:2rem 6rem;display:flex;flex-direction:column;gap:1rem}.title{text-align:center;font-weight:800;font-size:2rem}.winner_title{color:#258d19}.loser_title{color:#ab0d2f}.nav_end_game{display:flex;justify-content:space-evenly;z-index:50;gap:1rem}@media screen and (max-width: 850px){.memory_container{display:flex;flex-direction:column}.memory_controls{flex-direction:row;justify-content:space-between;height:auto;padding:.5rem 5rem;min-width:100%}.details{display:flex;gap:1rem}.end_game_details{padding:2rem 3rem}.end_game_details .details{display:block;width:100%}}@media screen and (max-width: 480px){.memory{padding:.5rem}.easy_memory{grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(4,minmax(5rem,auto));max-width:450px}.medium_memory{grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(6,minmax(5rem,auto));max-width:700px}.hard_memory{grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(8,1fr)}.memory_controls{padding:.5rem;font-size:.7rem}}.form_container{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;max-width:400px;padding:30px;border-radius:10px}.form{width:100%;display:flex;flex-direction:column;gap:1rem}.form h3{color:var(--text-color);font-size:25px}.form_selecters_container{display:flex;flex-direction:column;align-items:center;gap:.8rem;width:100%;height:100%}.form_selecter{border-radius:5px;background-color:transparent;color:var(--text-color);outline:none;border:1px solid var(--text-color);padding:.5rem;cursor:pointer;width:100%;transition:all .5s;font-size:20px}.form_selecter:focus{outline:none}.form_selecter option{padding:.5rem;color:#111;border-radius:5px}.form_selecter option:hover{cursor:pointer}.form_btn{outline:none;border:none;border-radius:.5rem;padding:5px 20px;background-color:#fff;font-size:20px;color:#222;transition:all .2s;cursor:pointer}.form_btn:hover{background-color:#222;color:#fff}.memory_title{font-size:90px;font-weight:800;text-shadow:1px 1px 10px #444;color:#fff}.div1{transform:translateY(10px);animation:mover 4s infinite;display:inline-block}.div2{transform:translateY(10px);animation:mover 4s infinite .5s;display:inline-block}.div3{transform:translateY(10px);animation:mover 4s infinite 1s;display:inline-block}.div4{transform:translateY(10px);display:inline-block;animation:mover 4s infinite 1.5s}.div5{transform:translateY(10px);display:inline-block;animation:mover 4s infinite 2s}.div6{transform:translateY(10px);display:inline-block;animation:mover 4s infinite 2.5s}@keyframes mover{0%{transform:translateY(10px)}50%{transform:translateY(-10px)}to{transform:translateY(10px)}}@media screen and (max-width: 600px){.memory_title{font-size:60px}}.root_container{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%}
