@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@400;900&family=Roboto:wght@300&display=swap);@import url(https://fonts.googleapis.com/css2?family=Comfortaa:wght@700&display=swap);*{margin:0;padding:0;box-sizing:border-box;background:#ebecf0;font-family:"Poppins",sans-serif}body{overflow-x:hidden}input:focus,textarea:focus{box-shadow:0 0 0 0;outline:0}.contanner-login{position:absolute;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);top:50%;left:50%;height:400px;width:300px;display:flex;flex-direction:column;align-items:center;justify-content:center;border:2px solid transparent;background:linear-gradient(160deg,#f0f1f4,#e4e6eb);box-shadow:-3px -3px 6px 2px #fdfdfd,5px 5px 8px 0 rgba(0,0,0,.17),1px 2px 2px 0 rgba(0,0,0,.1);border-radius:16px}.contanner-login button{background:linear-gradient(160deg,#f0f1f4,#e4e6eb);-webkit-background-clip:text;background-image:linear-gradient(90deg,#22ff82,#21bdff,#5433ff)}.contanner-login button,.contanner-login button:hover{border:2px solid transparent;box-shadow:-3px -3px 6px 2px #fdfdfd,5px 5px 8px 0 rgba(0,0,0,.17),1px 2px 2px 0 rgba(0,0,0,.1);border-radius:16px;margin-top:24px;color:transparent;padding:12px}.contanner-login button:hover{background:linear-gradient(160deg,#f0f1f4,#e4e6eb);-webkit-background-clip:text;background-image:linear-gradient(90deg,#daff33,#ff217d,#6f22ff)}.contanner-login button:disabled{color:#ccc;padding:12px}.contanner-login button:disabled,.contanner-login input{border:2px solid transparent;background:linear-gradient(160deg,#f0f1f4,#e4e6eb);box-shadow:-3px -3px 6px 2px #fdfdfd,5px 5px 8px 0 rgba(0,0,0,.17),1px 2px 2px 0 rgba(0,0,0,.1);border-radius:16px;margin-top:24px;transition:2s}.contanner-login input,.contanner-login input:hover{text-align:center;width:200px;padding:16px}.contanner-login input:hover{border:2px solid transparent;background:linear-gradient(160deg,#f0f1f4,#e4e6eb);box-shadow:inset -3px -3px 6px 2px #fdfdfd,inset 5px 5px 8px 0 rgba(0,0,0,.17),inset 1px 2px 2px 0 rgba(0,0,0,.1);border-radius:16px;margin-top:24px}.vs{font-size:32px;font-family:"Comfortaa",cursive;font-weight:700;-webkit-background-clip:text;color:transparent;background-image:linear-gradient(90deg,#22ff82,#21bdff,#5433ff)}.loading{position:absolute;bottom:calc(50% - 50px);left:calc(50% - 50px);width:100px;height:100px;border-radius:50%;background:linear-gradient(90deg,#22ff82,#21bdff,#5433ff);-webkit-animation:animate .5s linear infinite;animation:animate .5s linear infinite}@-webkit-keyframes animate{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes animate{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}.loading span{width:100%;height:100%;background:linear-gradient(90deg,#22ff82,#21bdff,#5433ff)}.loading:after,.loading span{position:absolute;border-radius:50%}.loading:after{content:"";top:10px;left:10px;right:10px;background:#ebecf0;bottom:10px}.header-component{display:flex;align-items:center;justify-content:center}.header-component p{background:linear-gradient(160deg,#f0f1f4,#e4e6eb);-webkit-background-clip:text;background-image:linear-gradient(90deg,#22ff82,#21bdff,#5433ff)}.header-component p,.header-component p:hover{box-shadow:-3px -3px 6px 2px #fdfdfd,5px 5px 8px 0 rgba(0,0,0,.17),1px 2px 2px 0 rgba(0,0,0,.1);font-size:32px;font-family:"Comfortaa",cursive;font-weight:700;text-transform:uppercase;border-radius:16px;padding:18px;margin-right:15px;color:transparent}.header-component p:hover{background:linear-gradient(160deg,#f0f1f4,#e4e6eb);-webkit-background-clip:text;background-image:linear-gradient(90deg,#daff33,#ff217d,#6f22ff)}.header-component a:link{background:linear-gradient(160deg,#f0f1f4,#e4e6eb);box-shadow:-3px -3px 6px 2px #fdfdfd,5px 5px 8px 0 rgba(0,0,0,.17),1px 2px 2px 0 rgba(0,0,0,.1);-webkit-background-clip:text;background-image:linear-gradient(90deg,#22ff82,#21bdff,#5433ff)}.header-component a:hover,.header-component a:link{text-decoration:none;border:2px solid transparent;border-radius:16px;color:transparent;padding:12px;margin:15px}.header-component a:hover{background:linear-gradient(160deg,#f0f1f4,#e4e6eb);box-shadow:inset -3px -3px 6px 2px #fdfdfd,inset 5px 5px 8px 0 rgba(0,0,0,.17),inset 1px 2px 2px 0 rgba(0,0,0,.1);-webkit-background-clip:text;background-image:linear-gradient(90deg,#daff33,#ff217d,#6f22ff)}.header{margin:15px;display:flex;cursor:pointer;align-items:center;justify-content:center}.barraBusca{margin-left:15px}.barraBusca label input{box-shadow:-3px -3px 6px 2px #fdfdfd,5px 5px 8px 0 rgba(0,0,0,.17),1px 2px 2px 0 rgba(0,0,0,.1)}.barraBusca label input,.barraBusca label input:hover{margin-right:15px;border:2px solid transparent;background:linear-gradient(160deg,#f0f1f4,#e4e6eb);border-radius:16px;text-align:center;width:400px;padding:12px;transition:2s}.barraBusca label input:hover{box-shadow:inset -3px -3px 6px 2px #fdfdfd,inset 5px 5px 8px 0 rgba(0,0,0,.17),inset 1px 2px 2px 0 rgba(0,0,0,.1)}.barraBusca button{background:linear-gradient(160deg,#f0f1f4,#e4e6eb);box-shadow:-3px -3px 6px 2px #fdfdfd,5px 5px 8px 0 rgba(0,0,0,.17),1px 2px 2px 0 rgba(0,0,0,.1);-webkit-background-clip:text;background-image:linear-gradient(90deg,#22ff82,#21bdff,#5433ff);transition:2s}.barraBusca button,.barraBusca button:hover{text-decoration:none;border:2px solid transparent;border-radius:16px;color:transparent;padding:12px;margin:15px}.barraBusca button:hover{background:linear-gradient(160deg,#f0f1f4,#e4e6eb);box-shadow:inset -3px -3px 6px 2px #fdfdfd,inset 5px 5px 8px 0 rgba(0,0,0,.17),inset 1px 2px 2px 0 rgba(0,0,0,.1);-webkit-background-clip:text;background-image:linear-gradient(90deg,#daff33,#ff217d,#6f22ff)}.musicas-contaneir{display:flex;padding:15px;flex-direction:column;justify-content:center;align-items:center}.musicas-contaneir>p{background-image:linear-gradient(90deg,#22ff82,#21bdff,#5433ff);transition:2s ease}.musicas-contaneir>p,.musicas-contaneir>p:hover{font-size:32px;margin-bottom:32px;font-family:"Comfortaa",cursive;font-weight:700;-webkit-background-clip:text;color:transparent}.musicas-contaneir>p:hover{background-image:linear-gradient(90deg,#daff33,#ff217d,#6f22ff)}.group-class{display:grid;grid-template-columns:repeat(3,1fr);grid-column-gap:3rem}.group-class a{box-shadow:-3px -3px 6px 2px #fdfdfd,5px 5px 8px 0 rgba(0,0,0,.17),1px 2px 2px 0 rgba(0,0,0,.1)}.group-class a,.group-class a:hover{display:flex;align-items:center;justify-content:center;height:200px;width:150px;margin:15px;padding:12px;color:#1b1b1b;font-size:.5em;text-decoration:none;text-align:center;background:linear-gradient(160deg,#f0f1f4,#e4e6eb);border-radius:16px}.group-class a:hover{box-shadow:-3px -3px 6px 2px #fdfdfd,5px 5px 8px 0 rgba(0,0,0,.34),1px 2px 2px 0 rgba(0,0,0,.2)}.group-class a img{width:75px;border-radius:25px}.group-class a p{margin:12px auto 0;background:linear-gradient(160deg,#f0f1f4,#e4e6eb);box-shadow:-3px -3px 6px 2px #fdfdfd,5px 5px 8px 0 rgba(0,0,0,.17),1px 2px 2px 0 rgba(0,0,0,.1);border-radius:8px}.music-grid{display:grid;grid-template-columns:repeat(3,1fr);grid-column-gap:2rem}.music-card{box-shadow:-3px -3px 6px 2px #fdfdfd,5px 5px 8px 0 rgba(0,0,0,.17),1px 2px 2px 0 rgba(0,0,0,.1)}.music-card,.music-card:hover{margin:20px;padding:15px;display:flex;background:linear-gradient(160deg,#f0f1f4,#e4e6eb);border-radius:8px;flex-direction:column;justify-content:center;align-items:center;width:250px;height:200px}.music-card:hover{box-shadow:-3px -3px 6px 2px #fdfdfd,5px 5px 8px 0 rgba(0,0,0,.34),1px 2px 2px 0 rgba(0,0,0,.2)}.music-card p{margin-bottom:12px;text-align:center;width:100%;height:75px;overflow:hidden}.music-card label,.music-card p{background:linear-gradient(160deg,#f0f1f4,#e4e6eb);box-shadow:-3px -3px 6px 2px #fdfdfd,5px 5px 8px 0 rgba(0,0,0,.17),1px 2px 2px 0 rgba(0,0,0,.1);border-radius:8px}.music-card label{display:flex;align-items:center;flex-direction:column;justify-content:center;margin-top:12px}.music-card label input{color:transparent}.music-button,.music-card label input{background:linear-gradient(160deg,#f0f1f4,#e4e6eb);box-shadow:-3px -3px 6px 2px #fdfdfd,5px 5px 8px 0 rgba(0,0,0,.17),1px 2px 2px 0 rgba(0,0,0,.1);border-radius:8px}.music-button{width:50px;height:50px}audio{width:100%;background:linear-gradient(160deg,#f0f1f4,#e4e6eb);box-shadow:-3px -3px 6px 2px #fdfdfd,5px 5px 8px 0 rgba(0,0,0,.17),1px 2px 2px 0 rgba(0,0,0,.1);border-radius:8px}.title-grid{text-align:center;margin:32px}.title-grid p{margin-bottom:32px;background-image:linear-gradient(90deg,#daff33,#ff217d,#6f22ff)}.title-grid h1,.title-grid p{-webkit-background-clip:text;color:transparent}.title-grid h1{font-size:32px;margin-bottom:16px;font-family:"Comfortaa",cursive;font-weight:700;background-image:linear-gradient(90deg,#22ff82,#21bdff,#5433ff);transition:2s ease}.title-grid h1:hover{-webkit-background-clip:text;color:transparent;background-image:linear-gradient(90deg,#daff33,#ff217d,#6f22ff)}.album-id,.notfound{display:flex;flex-direction:column;justify-content:center;align-items:center}.notfound{position:absolute;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);top:50%;left:50%}.notfound h1{background:linear-gradient(160deg,#f0f1f4,#e4e6eb);-webkit-background-clip:text;background-image:linear-gradient(90deg,#22ff82,#21bdff,#5433ff)}.notfound h1,.notfound h1:hover{font-size:32px;margin-bottom:16px;font-family:"Comfortaa",cursive;font-weight:700;box-shadow:-3px -3px 6px 2px #fdfdfd,5px 5px 8px 0 rgba(0,0,0,.17),1px 2px 2px 0 rgba(0,0,0,.1);border-radius:8px;color:transparent;transition:2s ease}.notfound h1:hover{background:linear-gradient(160deg,#f0f1f4,#e4e6eb);-webkit-background-clip:text;padding:50px;background-image:linear-gradient(90deg,#daff33,#ff217d,#6f22ff)}.notfound a{width:100%;height:100%;color:#21bdff;text-align:center;background:linear-gradient(160deg,#f0f1f4,#e4e6eb);box-shadow:-3px -3px 6px 2px #fdfdfd,5px 5px 8px 0 rgba(0,0,0,.17),1px 2px 2px 0 rgba(0,0,0,.1);border-radius:8px}.notfound a:link{text-decoration:none;text-align:center}@media screen and (max-width:900px){.musicas-contaneir>p{background-image:linear-gradient(90deg,#22ff82,#21bdff,#5433ff);transition:2s ease}.musicas-contaneir>p,.musicas-contaneir>p:hover{font-size:20px;margin-bottom:32px;font-family:"Comfortaa",cursive;font-weight:700;-webkit-background-clip:text;color:transparent}.musicas-contaneir>p:hover{background-image:linear-gradient(90deg,#daff33,#ff217d,#6f22ff)}.music-grid{grid-column-gap:2rem}.group-class,.music-grid{display:grid;grid-template-columns:repeat(1,1fr)}.group-class{grid-column-gap:3rem}.barraBusca{display:flex;flex-direction:column;justify-content:center;align-items:center}.barraBusca label input{box-shadow:-3px -3px 6px 2px #fdfdfd,5px 5px 8px 0 rgba(0,0,0,.17),1px 2px 2px 0 rgba(0,0,0,.1)}.barraBusca label input,.barraBusca label input:hover{border:2px solid transparent;background:linear-gradient(160deg,#f0f1f4,#e4e6eb);border-radius:16px;text-align:center;width:200px;padding:12px;transition:2s}.barraBusca label input:hover{box-shadow:inset -3px -3px 6px 2px #fdfdfd,inset 5px 5px 8px 0 rgba(0,0,0,.17),inset 1px 2px 2px 0 rgba(0,0,0,.1)}.header{display:flex;flex-direction:column;justify-content:center;align-items:center}.header-component p{margin-bottom:15px}.header-component{display:flex;align-items:center;justify-content:center}}
/*# sourceMappingURL=main.f05f38b5.chunk.css.map */