@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;800&family=VT323&display=swap);:root{--bckg-light:#f1f1f1;--main-light:#fff;--title-light:#333;--p-light:#555;--input-border-light:#ddd;--bckg-dark:#1a2236;--main-dark:#101523;--songs-dark:#121726;--title-dark:#b5b5b5;--p-dark:#b5b5b5;--text-dark:#fff;--input-border-light:#252525;--input-bckg-dark:#3b3b3b;--primary:#179b34;--secondary:#fd7045;--danger:#9050e9;--error:#8a0f36;--disabled:#737373;--gradient-dark:linear-gradient(180deg,#1a2134,#182335);--gradient-primary:linear-gradient(90deg,#19a938,#179b34);--gradient-secondary:linear-gradient(90deg,#fd7b53,#fd6f44);--error-bckg:#ffefef;--radius:25px;--btn-border:1.5px solid var(--primary);--shadow:2px 2px 5px rgba(0,0,0,.05)}body{font-family:Poppins;margin:0;padding:0}h1{font-size:2rem;padding-top:25px}h1,h2{color:#b5b5b5;color:var(--title-dark)}h2{font-size:1.7rem}h3{font-size:1.4rem}h3,h4{color:#b5b5b5;color:var(--title-dark)}a{text-decoration:none}li,p,ul{color:#b5b5b5;color:var(--p-dark)}span{color:#b5b5b5;color:var(--title-dark)}.error,.error-password li{color:#8a0f36;color:var(--error);font-weight:600}.btn{border:none;border-radius:25px;border-radius:var(--radius);box-shadow:2px 2px 5px rgba(0,0,0,.05);box-shadow:var(--shadow);color:#fff;color:var(--text-dark);cursor:pointer;font:inherit;font-size:.9rem;padding:.4rem}.App{background:linear-gradient(180deg,#1a2134,#182335);background:var(--gradient-dark);display:grid;grid-template-columns:minmax(300px,25%) 1fr}.pages{padding:2rem;transition:all .4s linear}.auth-container{background:#101523;background:var(--main-dark);border-radius:25px;border-radius:var(--radius);display:grid;justify-content:space-around;margin:10rem auto;padding-bottom:3rem;padding-top:1rem;place-content:center;width:40%}.auth-container h2,.auth-container h3{color:#fd7045;color:var(--secondary)}.btn.btn-logout,.btn.btn-nav{background:none;border:1.5px solid #179b34;border:var(--btn-border)}.btn.btn-logout{text-align:center}.btn.btn-logout,.btn.btn-nav{color:#179b34;color:var(--primary)}.btn.btn-nav{transition:all .3s linear}.btn.btn-nav:hover{background:linear-gradient(90deg,#19a938,#179b34);background:var(--gradient-primary);color:#1a2236;color:var(--bckg-dark)}.btn.btn-nav:active,.btn[data-active=true]{background:#fd7045;background:var(--secondary);border:none;color:#1a2236;color:var(--bckg-dark)}.btn,form button{background:#179b34;background:var(--primary);border:0;border-radius:25px;border-radius:var(--radius);color:#101523;color:var(--main-dark);cursor:pointer;font-family:Poppins;padding:10px 25px}.btn-login,.btn-signup{margin-bottom:1rem}button.btn.btn-login:disabled{background:#737373;background:var(--disabled);cursor:not-allowed}.menu-btn{background:none;border:1.5px solid #179b34;border:var(--btn-border);border-radius:25px;border-radius:var(--radius);cursor:pointer;display:none;position:absolute;right:-60px;top:50px;z-index:1000000}.menu-btn span,.top-btn.scroll-to-top{color:#179b34;color:var(--primary)}.top-btn.scroll-to-top{background:none;box-shadow:none}header{background:#101523;background:var(--main-dark);box-shadow:2px 2px 5px rgba(0,0,0,.05);box-shadow:var(--shadow);min-height:100vh;padding-left:3rem;padding-right:3rem;position:-webkit-sticky;position:sticky;position:relative;transition:all .3s linear;z-index:1000}.sidebar{height:95vh}.nav__container{display:flex;flex-direction:column;height:80%;justify-content:space-between}.nav__container div{display:flex;flex-direction:column;height:60%;justify-content:space-evenly}.nav__container--login{gap:5rem;height:80%;justify-content:center}.nav__button-container,.nav__container--login{display:flex;flex-direction:column}.nav__user-name{color:#179b34;color:var(--primary);font-weight:700}.home h2{text-align:center}.home h2,.home h3{color:#fd7045;color:var(--secondary)}.songs{display:flex;flex-wrap:wrap;gap:2rem;justify-content:center}.song-details{background:#121726;background:var(--songs-dark);border-radius:25px;border-radius:var(--radius);box-shadow:2px 2px 5px rgba(0,0,0,.05);box-shadow:var(--shadow);flex:0 1 250px;margin:20px 0;padding:20px;position:relative}.song-details h4{color:#179b34;color:var(--primary);font-size:1.2em;margin:0 0 10px}.song-details p{color:#b5b5b5;color:var(--p-dark);font-size:.9em;margin:0;overflow:hidden;text-overflow:ellipsis}.song-details span{background:#1a2236;background:var(--bckg-dark);border-radius:50%;color:#8a0f36;color:var(--error);cursor:pointer;padding:6px;position:absolute;right:20px;top:20px}.song-details span.btn-edit{color:#fd7045;color:var(--secondary);right:70px}.about-section{background:#101523;background:var(--main-dark);border-radius:25px;border-radius:var(--radius);font-size:1.1rem;padding:2rem 3rem}p.about-p{line-height:2.5;margin-bottom:2rem}input,label{display:block}input,label,option,select,textarea{color:#fff;color:var(--text-dark)}input,option,select,textarea{background:#3b3b3b;background:var(--input-bckg-dark);border:1px solid #252525;border:1px solid var(--input-border-light);border-radius:25px;border-radius:var(--radius);box-shadow:2px 2px 5px rgba(0,0,0,.05);box-shadow:var(--shadow);box-sizing:border-box;font:inherit;font-size:inherit;margin-bottom:20px;margin-top:10px;padding:10px 10px 10px 20px;width:100%}.chords,.songs-container,.words{background:#101523;background:var(--main-dark);border-radius:25px;border-radius:var(--radius);margin-bottom:5rem;padding:2rem 1.5rem}.songs-container .title{color:#179b34;color:var(--primary);font-weight:700}.tools{display:flex;flex-wrap:wrap;gap:5rem;justify-content:space-evenly}.chords,.words{flex:0 1 400px;flex:1 1;margin:5px}@media (min-width:1440px){header{max-width:350px}.songs{gap:5rem}}@media (max-width:768px){.menu-btn{display:flex}header#hidden{-webkit-transform:translateX(-100%);transform:translateX(-100%)}header#show{-webkit-transform:translateX(0);transform:translateX(0)}.pages{-webkit-transform:translateX(-20%);transform:translateX(-20%)}header#show~.pages{-webkit-transform:translateX(0);transform:translateX(0)}}@media (max-width:425px){.App{overflow-x:hidden}.pages{-webkit-transform:translateX(-65%);transform:translateX(-65%);width:100vw}.tools{padding-left:2rem;width:80%}}@media (max-width:375px){.pages{-webkit-transform:translateX(-75%);transform:translateX(-75%)}}
/*# sourceMappingURL=main.8ba53cc6.css.map*/