*{-webkit-tap-highlight-color:transparent;box-sizing:border-box;margin:0;padding:0;-webkit-user-select:none;-ms-user-select:none;user-select:none}#root,.App,body,html{height:100vh;max-height:-webkit-fill-available}h2{color:#363636}body{font-family:Lato,sans-serif;overflow:hidden}h3,h4{color:#646464;font-weight:400}.App{display:flex;flex-direction:column;transition:all .5s ease}.dark{background-color:#1c1c27}.dark h2,.dark h3,.dark h4{color:#fff}.library-active{margin-left:0}@media screen and (min-width:768px){.library-active{margin-left:20rem}}@media screen and (min-width:1024px){.library-active{margin-left:25rem}}.song-container{align-items:center;display:flex;flex-direction:column;justify-content:center;margin-bottom:16px;margin-top:16px;min-height:300px}.song-container img{border-radius:50%;width:11rem}.song-container h2{padding:10% 2% 3%}.song-container h3{font-size:1rem}@media screen and (min-height:640px) and (max-width:768px){.song-container{min-height:400px}.song-container img{width:12.5rem}}@media screen and (min-width:768px){.song-container{min-height:60vh}.song-container img{width:15rem}}@media screen and (min-width:768px) and (min-width:1024px){.song-container img{width:18rem}}@media screen and (min-width:768px){.song-container h2{padding:4rem 1rem 1rem}}@media screen and (min-width:1024px){.song-container{min-height:60vh}.song-container h2{font-size:28px}.song-container h3{font-size:20px}}@media screen and (max-height:420px){.song-container{min-height:30vh}.song-container img{display:none}}.dark .play,.dark .shuffle,.dark .skip-back,.dark .skip-forward,.dark p{color:#fff}.player{flex-direction:column;justify-content:space-between;margin-bottom:16%}.player,.time-control{align-items:center;display:flex}.time-control{width:90%}.time-control input{-webkit-appearance:none;background:transparent;cursor:pointer;width:100%}.time-control p{padding:1rem}svg{cursor:pointer}.play-and-shuffle-controls{margin-left:30px}.play-and-shuffle-controls,.play-control{align-items:center;display:flex;justify-content:space-between}.play-control{padding:1rem;width:12rem}.shuffle{margin-left:5px}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;height:16px;opacity:0;width:16px}input[type=range]::-moz-range-thumb{-webkit-appearance:none;background:transparent;border:none}.track{border-radius:1rem;height:1rem;overflow:hidden;position:relative;width:100%}.animate-track{background-color:#ebeaea;height:100%;left:0;pointer-events:none;position:absolute;top:0;-webkit-transform:translateX(0);transform:translateX(0);width:100%}@media screen and (min-width:768px){.time-control{width:27rem}.play-and-shuffle-controls{align-items:center;display:flex;justify-content:space-between;margin-left:55px}.shuffle{margin-left:30px}.play-control{width:15rem}}@media screen and (min-width:1024px){.time-control{width:35rem}.play-control{width:18rem}}@media screen and (min-width:768px) and (max-height:700px){.player{margin-bottom:4%}}.dark .library{background-color:#1c1c27;box-shadow:2px 2px 50px #000}.dark .library-song:hover{background-color:rgba(219,102,116,.288)}.dark .selected,.dark .selected:hover{background-color:#c84453}.dark .close-library{color:#fff}.dark *{scrollbar-color:hsla(0,0%,61%,.628) transparent}.dark ::-webkit-scrollbar-thumb{background-color:hsla(0,0%,61%,.628) transparent}.library{background-color:#fff;box-shadow:2px 2px 50px #ccc;height:100%;left:0;opacity:0;position:fixed;top:0;-webkit-transform:translateX(-100%);transform:translateX(-100%);transition:all .5s ease;width:100%}.library h2{padding:2rem}.library-songs{height:100%;overflow:scroll;overflow-x:hidden;overflow-y:overlay;padding-bottom:116px}.library-song{align-items:center;cursor:pointer;display:flex;padding:1rem 2rem;transition:background .5s ease}.library-song img{width:30%}.library-song:hover{background-color:rgba(167,32,32,.181)}.song-description{padding-left:1rem}.song-description h3{font-size:1rem}.song-description h4{font-size:.7rem}*{scrollbar-color:hsla(0,0%,61%,.8) transparent;scrollbar-width:thin}::-webkit-scrollbar{width:5px}::-webkit-scrollbar-thumb{background-color:hsla(0,0%,61%,.8);border-radius:20px}.selected,.selected:hover{background-color:rgba(167,32,32,.363)}.library-header{align-items:center;display:flex;justify-content:space-between}.close-library{cursor:pointer;margin-right:24px}@media screen and (min-width:1024px){.close-library{font-size:23px}.close-library:hover{-webkit-transform:scale(1.3);transform:scale(1.3)}}.active-library{opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}@media screen and (min-width:768px){.library{width:20rem}}@media screen and (min-width:1024px){.library{width:25rem}}.dark nav h1{color:#df4d5f}.dark nav button{border:2px solid #fff;color:#fff}.dark nav button:hover{background-color:#000;border:2px solid #df4d5f;color:#df4d5f}nav{align-items:center;display:flex;justify-content:space-between;margin:12px 24px 0;min-height:64px}nav h1{color:brown;letter-spacing:2px}@media screen and (min-width:1024px){nav h1{font-size:30px}}nav img{cursor:pointer;height:28px}nav img:hover{-webkit-transform:scale(1.15);transform:scale(1.15)}nav .buttons-container{align-items:center;display:flex}nav button{background-color:transparent;border:2px solid #414141;color:#000;cursor:pointer;margin-right:30px;padding:.5rem;transition:all .3s ease}nav button:hover{background-color:#414141;color:#fff}@media screen and (min-width:1024px){nav button{font-size:18px;padding:10px}}.library-icon{padding-left:4px}@media screen and (min-height:640px) and (max-width:768px){nav{min-height:76px}}@media screen and (min-width:768px){nav{justify-content:space-around;margin:0;min-height:10vh}}
/*# sourceMappingURL=main.7229b238.css.map*/