body{min-height:100vh;overflow-x:hidden;scroll-behavior:smooth;width:100%}h1{color:gold}.highlight{color:#ede4e0};.App{align-items:center;display:flex;flex-direction:column;margin:0;min-height:200vh;padding:0;width:100%}.AppPlaylist{align-items:flex-start;display:flex;flex-direction:row;gap:2rem;height:850px;justify-content:center;margin-top:20px;max-width:1800px;padding:0 2rem;width:calc(100% - 4rem)}.playlist-section{opacity:0;transform:translateY(20px);transition:opacity .5s ease,transform .5s ease;width:100%}.playlist-section.visible{opacity:1;transform:translateY(0)}.Playlists,.SearchResults{height:850px;max-width:800px;min-width:400px;padding:2rem;width:45%}.PlaylistNameForm,.Playlists,.SearchResults{align-items:center;display:flex;flex-direction:column}.PlaylistNameForm{margin-top:20px;width:100%}.PlaylistNameForm input:hover{border:1px solid gold;box-shadow:0 0 15px #ffc30080}.PlaylistNameForm input{background-color:#ffccd2;border:1px solid #ddd5d7;border-radius:4px;color:#4d0013;font-size:1.5rem;margin-bottom:20px;max-width:300px;padding:10px;text-align:center;width:100%}.PlaylistNameForm input::placeholder{color:#4d0013}.loading-overlay{background:#800020b3;bottom:0;color:gold;font-size:24px;left:0;position:fixed;right:0;top:0;z-index:1000}.loading-overlay,.title-section{align-items:center;display:flex;justify-content:center}.title-section{height:100vh;overflow:hidden;position:relative;width:100%}.title-container{animation:slideTitle 15s linear infinite;display:flex;white-space:nowrap;width:100%}h1{flex-shrink:0;font-size:80px;margin:0;padding:0 20px;text-align:center;width:500px}@keyframes slideTitle{0%{transform:translateX(0)}to{transform:translateX(-50%)}}.content-section{min-height:100vh;opacity:0;position:relative;transform:translateY(20px);transition:opacity 1s ease,transform 1s ease;width:100%}.content-section .background-text,.content-section:after,.content-section:before{color:rgba(255,111,0,.042);content:"JAMMING";font-size:300px;font-weight:700;left:50%;letter-spacing:20px;pointer-events:none;position:fixed;transform:translate(-50%,-50%);white-space:nowrap;z-index:-1}.content-section:before{content:"JAMMING";top:20%}.content-section:after{color:rgba(93,0,255,.063);content:"JAMMING";top:75%}.content-section.visible{opacity:1;transform:translateY(0)}@media screen and (max-width:1024px){.content-section .background-text,.content-section:after,.content-section:before{font-size:150px;letter-spacing:15px}}@media screen and (max-width:768px){.content-section .background-text,.content-section:after,.content-section:before{font-size:100px;letter-spacing:10px}}@media screen and (max-width:1024px){.App{min-height:100vh;padding:0 1rem}.AppPlaylist{align-items:center;flex-direction:column;gap:2rem;height:auto;padding:1rem;width:100%}.Playlists,.SearchResults{height:auto;max-width:100%;min-height:500px;min-width:0;min-width:auto;padding:1rem;width:100%}.title-section{height:100vh;width:100%}h1{font-size:60px;width:auto}.title-container{justify-content:flex-start;width:100%}}@media screen and (max-width:768px){.App{padding:0}h1{font-size:40px}.PlaylistNameForm{padding:0 1rem;width:100%}.PlaylistNameForm input{font-size:1.2rem;max-width:none;width:100%}.content-section{padding:0;width:100%}}.Track{align-items:center;border-bottom:1px solid;display:flex;justify-content:space-evenly;overflow:visible;padding-bottom:5px}.Track-information:hover{transform:scale(1.01);transform-origin:center center;z-index:999}.Track:last-child{margin-bottom:0}.Track-information{align-items:flex-start;display:flex;flex-direction:column;margin-top:15px;padding-left:10px;width:90%}h3,h4,p{margin-top:5px}.Track-information h3{font-size:1.5em;margin-top:5px;text-align:start}.Track-information h4{font-size:1.3em;margin-top:5px}.Track-information p{font-size:1em;margin-top:5px}.Track-action{background-color:#ffccd2;border:none;border-radius:50%;box-sizing:border-box;cursor:pointer;display:flex;font-family:Comic Neue;font-size:30px;font-style:normal;height:40px;justify-content:center;margin-left:18px;margin-right:18px;margin-top:15px;transform-origin:center center;transition:transform .2s ease;width:40px}.Track-action:hover{border:1px solid gold;box-shadow:0 0 15px #ffc30080;transform:scale(1.1);transform-origin:left 50% left 20%;z-index:1000}.Track-action:active{background-color:#ffee90;border:1px solid gold;box-shadow:0 0 30px rgba(255,196,0,.209)}@media screen and (max-width:1024px){.Track{gap:10px;padding:10px}.Track-information{width:85%}.Track-information h3{font-size:1.2em}.Track-information h4{font-size:1em}.Track-information p{font-size:.9em}.Track-action{align-self:center;margin:0}}@media screen and (max-width:768px){.Track{padding:8px 5px}.Track-information{padding-left:5px;width:80%}.Track-action{font-size:20px;height:30px;min-width:30px;width:30px}}.TrackList{display:flex;flex-direction:column;gap:.5rem;overflow-y:scroll;padding:.5rem;width:100%}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:#0000001a;border-radius:4px}::-webkit-scrollbar-thumb{background:#ffd7004d;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#ffd70080}.Playlist{align-items:center;display:flex;flex-direction:column;height:850px;margin-top:15px;padding:1rem;width:100%}.Playlist input{border:1px solid #ddd5d7;color:gold;font-size:35px;outline:none;padding:0;text-align:center;transition:color .3s ease,border-color .3s ease}.Playlist h2{color:gold;font-size:2em;margin-bottom:1rem;text-align:center;width:100%}.Playlist-save:hover{border:1px solid gold;box-shadow:0 0 15px #ffc30080}.Playlist-save{background-color:#ffccd2;border:2px solid #fff8f0;border-radius:4px;color:#4d0013;cursor:pointer;font-size:1.3em;height:50px;margin-top:2rem;outline:none;text-align:center;width:300px}.Playlist .TrackList{height:calc(100% - 150px);overflow-y:scroll;padding:0 1rem;width:100%}@media screen and (max-width:1024px){.Playlist{height:auto;min-height:500px}.Playlist-save{margin-bottom:1rem;width:80%}}@media screen and (max-width:768px){.Playlist h2{font-size:1.5em}.Playlist-save{font-size:1em;width:90%}}.SearchBar{align-content:center;align-items:center;display:flex;flex-direction:column;flex-wrap:wrap;font-family:Orbitron,sans-serif;margin-top:50px}.SearchBar input{background-color:#ffccd2;border:1px solid #ddd5d7;border-radius:3px;color:#4d0013;font-size:1.5rem;outline:none;padding:1rem;text-align:center;transition:color .3s ease,border-color .3s ease;width:20%}.SearchBar input:hover{border:1px solid gold;box-shadow:0 0 15px #ffc30080}.SearchBar input::placeholder{color:#4d0013}.SearchButton:hover{border:1px solid gold;box-shadow:0 0 15px #ffc30080}input:focus{border-color:#ffc300;box-shadow:5px 5px 10px #ffc30080;outline:none}input:focus::placeholder{color:#ffccd2}.SearchButton{background-color:#ffccd2;border:2px solid #fff8f0;border-radius:4px;color:#4d0013;cursor:pointer;font-size:1.1em;height:50px;margin-top:2rem;outline:none;text-align:center;width:20%}@media screen and (max-width:1024px){.SearchBar{padding:0 1rem;width:100%}.SearchBar input,.SearchButton{max-width:500px;width:80%}}@media screen and (max-width:768px){.SearchBar{margin-top:30px}.SearchBar input{font-size:1.2rem;padding:.8rem;width:90%}.SearchButton{font-size:1rem;height:40px;width:90%}}.SearchResults{align-items:center;display:flex;flex-direction:column;height:850px;min-width:400px;overflow:hidden;padding:2rem;width:45%}.SearchResults h2{color:gold!important;font-size:35px;font-weight:700;padding:.5em;text-align:center;width:100%}.SearchResults .TrackList{height:calc(100% - 100px);overflow-y:scroll;padding:0 1rem;width:100%}.PlaylistSelector{align-items:center;display:flex;flex-direction:column;justify-content:center;margin-bottom:20px;padding:10px}.PlaylistSelector h2{color:gold;font-size:30px;height:30px;margin-bottom:30px;margin-top:40px;text-align:center;width:100%}.PlaylistSelectorItem{border-bottom:1px solid;border-radius:3px;cursor:pointer;font-size:20px;margin-bottom:10px;text-align:center}.PlaylistSelector h4{font-size:25px;margin-bottom:10px}.PlaylistSelector button{background-color:#800020;border:1.5px solid #4d0013;border-radius:3px;color:#000;cursor:pointer;font-family:Orbitron,sans-serif;font-size:1.1em;height:30px;outline:none;text-align:center;width:17%}.PlaylistSelector button:focus{border:1px solid gold;color:gold;font-weight:700}.PlaylistSelector button:hover{border:.5px ridge gold;box-shadow:inset 0 0 15px #ffc30080}.PlaylistSelector ul{list-style:none;margin:0;padding:0}.PlaylistSelector li{padding:5px;transition:border-color .3s ease,box-shadow .3s ease}.PlaylistSelector li:hover{border:.5px ridge gold;box-shadow:inset 0 0 15px #ffc30080}.PlaylistSelector button:active{border:1px solid #4d0013}@media screen and (max-width:1024px){.PlaylistSelector{padding:1rem;width:100%}.PlaylistSelector h2{font-size:24px;height:auto;margin:20px 0}.PlaylistSelector button{margin:10px 0;width:200px}.PlaylistSelector ul{max-width:500px;width:100%}}@media screen and (max-width:768px){.PlaylistSelector{padding:.5rem}.PlaylistSelector h2{font-size:20px}.PlaylistSelector button{max-width:300px;width:80%}.PlaylistSelectorItem{font-size:16px;padding:8px 0}.PlaylistSelector h4{font-size:18px}}.login-container{align-items:center;display:flex;flex-direction:column;justify-content:center;min-height:100vh;text-align:center}.login-content{background:#0000004d;border-radius:8px;letter-spacing:.3ch;margin-top:2rem;padding:2rem}.login-content h2{color:gold;margin-bottom:1rem}.login-content p{color:#ede4e0;font-size:1.2rem;margin-bottom:2rem}.login-button{background-color:#ffccd2;border:none;border-radius:4px;color:#4d0013;cursor:pointer;font-size:1.2rem;padding:1rem 2rem;transition:all .3s ease}.login-button:hover{border:1px solid gold;box-shadow:0 0 15px #ffc30080}@media screen and (max-width:1024px){.login-content{margin:1rem;width:80%}}@media screen and (max-width:768px){.login-content h2{font-size:1.5rem}.login-button,.login-content p{font-size:1rem}.login-button{padding:.8rem 1.5rem;width:90%}}body{background-color:#7d0120;font-family:Orbitron,sans-serif;margin:0;padding:0}
/*# sourceMappingURL=main.612ce9ac.css.map*/