*{box-sizing:border-box;margin:0;padding:0}.loading-main{background:#f5f5f5;border-radius:100px;box-shadow:0 3px 10px rgba(0,0,0,.2);padding:30px 50px;position:absolute;top:50%;z-index:100}.loading{font-size:2rem}.loading,.logo{font-family:Grandstander,cursive}.logo{color:#353535;font-size:3rem;left:2%;position:absolute;top:3.5%}.top-line{height:2px;top:2%;width:100vw}.left-line,.top-line{background-color:grey;position:absolute;z-index:100}.left-line{height:100vh;left:1%;width:2px}.right-line{height:100vh;right:1%;width:2px}.btm-line,.right-line{background-color:grey;position:absolute;z-index:100}.btm-line{bottom:2%;height:2px;width:100vw}button{border:none;cursor:pointer}button,button:visited{text-decoration:none}.canvas-container{background-color:#f5f5f5;display:flex;height:100vh;justify-content:center;margin:0 auto;position:fixed;width:100vw}canvas{height:100vh;top:0;width:100vw}#canvas{height:50vh;width:50vw}#canvas,.button{position:absolute}.button{top:0}.generate-btn{border:4px solid #454545;border-radius:40px;color:#454545;font-family:Grandstander,cursive;font-size:1.5rem;height:60px;position:absolute;top:4rem;transition:all .3s;width:200px;z-index:100}.generate-btn:hover{font-size:2rem;height:70px;width:210px}.submit-btn{border:4px solid #454545;border-radius:40px;bottom:5rem;color:#454545;font-family:Grandstander,cursive;font-size:1.5rem;height:60px;position:absolute;transition:all .3s;width:340px;z-index:100}.submit-btn:hover{font-size:1.7rem;height:70px;width:350px}.colors-container{height:100%;position:absolute;right:150px}.colors,.colors-container{display:flex;flex-direction:column;justify-content:center}.colors{gap:40px}.pallete{background-color:#73ff00;border:2px solid #fff;border-radius:100%;box-shadow:0 3px 10px rgba(0,0,0,.2);height:30px;width:30px}.pallete0,.pallete1,.pallete2,.pallete3,.pallete4,.pallete5{opacity:0;-webkit-transform:translateX(50px);transform:translateX(50px)}.bar-container{height:100%;justify-content:center;position:absolute;right:40px}.bar,.bar-container{display:flex;flex-direction:column}.bar{background-color:#fff;border-radius:100px;box-shadow:0 3px 10px rgba(0,0,0,.2);gap:20px;padding:.5rem}.asset-btn{background-color:#f5f5f5;border-radius:100%;color:grey;font-size:2rem;font-weight:100;height:70px;padding-top:5px;text-align:center;transition:all .3s;width:70px}.asset-btn:hover{font-size:2.4rem}.active{background-color:#f5f5f5;border:3px solid grey;border-radius:100%;height:70px;text-align:center;width:70px}@media screen and (max-width:480px){.generate-btn{top:6rem}.logo{font-size:1.2rem;left:4%;top:4%}.btm-line,.top-line{height:0}.left-line,.right-line{width:0}.bar-container{height:50px;justify-content:center;position:absolute;right:auto;top:78%;width:100vw}.bar,.bar-container{border:none;display:flex;flex-direction:row}.bar{align-items:center;border-radius:100px;gap:20px}.asset-btn{background-color:#f5f5f5;border-radius:100%;font-size:.5rem;height:30px;text-align:center;width:30px;z-index:100}.asset-btn,.asset-btn:hover,.submit-btn{font-size:1rem}.submit-btn{border:4px solid #454545;border-radius:40px;bottom:2rem;color:#454545;font-family:Grandstander,cursive;height:50px;position:absolute;width:200px;z-index:100}.submit-btn:hover{font-size:1.2rem;height:60px;width:230px}.colors-container{height:100%;position:absolute;right:auto;top:73%}.colors,.colors-container{display:flex;flex-direction:row;justify-content:center}.colors{gap:30px}.pallete{background-color:#73ff00;border:2px solid #fff;border-radius:100%;box-shadow:0 3px 10px rgba(0,0,0,.2);height:20px;width:20px}}.gallery-btn{-webkit-animation:button-anim 1s infinite;animation:button-anim 1s infinite;background-color:#fff;border-radius:100%;box-shadow:0 3px 10px rgba(0,0,0,.2);color:#d5d5d5;font-size:2rem;font-weight:100;height:80px;position:absolute;right:2%;top:3%;width:80px;z-index:50}@-webkit-keyframes button-anim{0%{font-size:2rem;height:80px;width:80px}50%{font-size:2.5rem;height:90px;width:85px}to{font-size:2rem;height:80px;width:80px}}@keyframes button-anim{0%{font-size:2rem;height:80px;width:80px}50%{font-size:2.5rem;height:90px;width:85px}to{font-size:2rem;height:80px;width:80px}}.title{color:#36454f;font-family:Grandstander,cursive;font-size:4rem;margin-top:9rem;text-align:center}.specimen-name{justify-items:flex-end}.created-by,.specimen-name{color:#36454f;display:block;font-family:Grandstander,cursive;width:50%}.created-by{font-size:1rem}.monster-info{display:flex;flex-direction:row;flex-wrap:wrap;margin-top:15px;width:100%}.name{justify-self:flex-end;text-align:right}.monster-gallery-container{display:grid;height:100vh;justify-content:center;width:100vw}.monster-gallery{grid-gap:60px;display:grid;gap:60px;grid-template-columns:1fr 1fr 1fr 1fr;grid-template-rows:auto;height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;justify-content:center;margin-top:10rem;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.monster-container{grid-gap:0;background-color:#f5f5f5;border-radius:5px;box-shadow:0 3px 10px rgba(0,0,0,.5);display:grid;gap:0;grid-template-rows:1fr 1fr;height:580px;justify-content:center;padding:20px;width:400px}.monster-image{border-radius:5px;height:450px;object-fit:cover;width:350px}@media screen and (max-width:480px){.gallery-btn{-webkit-animation:none;animation:none;font-size:1.1rem;height:50px;right:5%;width:50px}.title{font-size:2rem;height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;margin-top:8rem}.monster-gallery{align-content:center;gap:0;grid-template-columns:1fr;grid-template-rows:auto;justify-content:center;margin-top:2rem}.monster-container,.monster-gallery{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.monster-container{margin:20px}.monster-image{border-radius:5px;height:450px;object-fit:cover;width:100%}}.modal-alert{color:grey;font-family:Grandstander,cursive;font-size:1rem;margin:10px;text-align:center}.modal-bg{background:rgba(0,0,0,.5);display:flex;height:100vh;justify-content:center;opacity:.5;position:absolute;width:100vw;z-index:299}.modal{background-color:#f5f5f5;border-radius:10px;box-shadow:0 3px 10px rgba(0,0,0,.2);justify-content:center;padding:20px 30px;position:absolute;top:50%;-webkit-transform:translateY(-250px);transform:translateY(-250px);width:380px;z-index:300}.close-btn,.modal{height:-webkit-fit-content;height:-moz-fit-content;height:fit-content}.close-btn{color:#36454f;display:flex;justify-content:flex-end}.close-btn,.modal-image{margin-bottom:10px;width:100%}.modal-image{height:400px;object-fit:cover}.form-row{display:grid;grid-template-columns:40% 60%;grid-template-rows:auto;margin-top:10px}.form-control{margin-top:20px;width:100%}.specimen-name{align-self:center;font-size:1rem}#form-input{border:2px solid grey;border-radius:20px;color:#434343;font-family:Grandstander,cursive;height:30px;padding:10px;width:100%}.submit-container{display:flex;justify-content:center;margin-top:10px;padding:10px;width:100%}.modal-submit{background-color:green;border:none;border-radius:100px;color:#fff;font-family:Grandstander,cursive;height:33px;transition:all .3s;width:150px}.modal-submit:hover{font-size:1.1rem;height:38px;width:155px}
/*# sourceMappingURL=main.ed246366.css.map*/