body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Roboto","Oxygen","Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue",sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:source-code-pro,Menlo,Monaco,Consolas,"Courier New",monospace}header{padding:0 17%;display:flex;justify-content:space-around;align-items:center;background-color:#010c3f;flex-direction:column}.App{text-align:center}#root,body,html{height:100%}html{font-size:18px}a{width:40%;text-decoration:none}a:link,a:visited{color:#fff}h1:hover{color:#6f2c8b}h1,h1:hover{transition:all .3s ease-in-out}h1{padding:.77rem 0;background-color:#010c3f;text-align:center;font-family:"Poppins",sans-serif;font-size:2rem;color:#fff}h1 .highlight{color:#6c41ec}h2{font-family:"Poppins",sans-serif;font-size:1.55rem}.App{height:100%;padding:0 17% 10%;background-image:url(/static/media/background_photo_desktop.a0687f3f.jpg);background-size:cover;background-position:50%;background-repeat:no-repeat;font-family:"Work Sans",sans-serif;font-weight:500;color:#fff}.UserTitle{flex-direction:row-reverse}.App-playlist,.UserTitle{display:flex;width:100%;justify-content:space-between}@media only screen and (max-width:1020px){header{justify-content:center;flex-direction:column}a{width:auto}.UserTitle{justify-content:center;align-items:center}.App-playlist,.UserTitle{flex-direction:column}}.TrackList{margin-top:5px;width:100%}.no-results{color:red}.Track{text-align:left;display:flex;align-items:center;border:2px solid transparent;box-shadow:0 0 10px rgba(108,65,233,.7);margin-bottom:5px;border-radius:5px}.Track,.Track:hover{transition:all .3s ease-in-out}.Track:hover{border:2px solid rgba(108,65,233,.7);border-radius:5px;outline:none;box-shadow:1 1 10px rgba(108,65,233,.7)}.Track-action{cursor:pointer;padding:.5rem;font-size:1.05rem;transition:color .25s;border:0;background-color:transparent;color:#fff}.Track-action:hover{color:hsla(0,0%,100%,.5)}.Track-information{display:flex;flex-grow:1;flex-direction:column;justify-content:center;height:auto}.Track-information h3{margin-bottom:.22rem}.Track-information p{font-size:.83rem;font-weight:300;color:hsla(0,0%,100%,.8)}.preview{opacity:.7}.preview:hover{opacity:.9}html{--scroll-bar-BG:#010c3f;--scroll-bar-FG:#6c41ec}.SearchResults{margin-top:10px;width:50%;height:950px;overflow-y:auto;overflow-x:hidden;scrollbar-color:#6c41ec #010c3f;scrollbar-color:var(--scroll-bar-FG) var(--scroll-bar-BG);padding:.88rem;background-color:rgba(1,12,63,.7);box-shadow:0 4px 2px 2px #000;border-radius:5px}@media only screen and (max-width:1020px){.SearchResults{width:95%;margin-bottom:2rem}}.Playlist{display:flex;flex-direction:column;align-items:center;margin-top:10px;overflow-y:auto;overflow-x:hidden;width:37%;max-height:950px;padding:.88rem;background-color:rgba(1,12,63,.7);box-shadow:0 4px 2px 2px #000;border-radius:5px}.Playlist input{width:100%;transition:all .3s ease-in-out;outline:0;background:#fff;border:1px solid #6f6f6f;font-family:"Poppins",sans-serif;font-size:1.55rem;color:#010c3f;text-align:center;border-radius:5px}.Playlist input:hover{transition:all .3s ease-in-out;color:rgba(108,65,233,.7);border-radius:10px;outline:none;border:1px solid rgba(108,65,233,.7);box-shadow:0 0 10px rgba(108,65,233,.7)}.Playlist input:focus::-webkit-input-placeholder{color:transparent}.Playlist input:focus:-ms-input-placeholder{color:transparent}.Playlist input:focus::placeholder{color:transparent}.Playlist-save{cursor:pointer;width:10rem;padding:.77rem 0;border-radius:54px;border:1px solid transparent;margin:1rem 0;background-color:#6c41ec;text-align:center;font-size:.83rem;transition:background-color .25s;color:#fff;font-weight:500}.Playlist-save:hover{box-shadow:0 0 5px rgba(108,65,233,.7);border:1px solid rgba(108,65,233,.7);background-color:rgba(108,65,233,.7)}::-webkit-scrollbar{width:0;background:transparent}@media only screen and (max-width:1020px){.Playlist{width:95%}}.SearchBar{display:flex;align-items:center;justify-content:center;width:53%}.SearchBar input{transition:all .3s ease-in-out;width:287px;padding:.5rem 0;border:1px solid #fff;border-radius:5px;color:#010c3f;text-align:center;font-size:1rem}.SearchBar input:hover{transition:all .3s ease-in-out;color:rgba(108,65,233,.7);border-radius:10px;outline:none;border:1px solid rgba(108,65,233,.7);box-shadow:0 0 10px rgba(108,65,233,.7)}.SearchBar input:focus{outline:none}.SearchBar input:focus::-webkit-input-placeholder{color:transparent}.SearchBar input:focus:-ms-input-placeholder{color:transparent}.SearchBar input:focus::placeholder{color:transparent}.SearchButton{width:10rem;background-color:#6c41ec}.ResetButton,.SearchButton{cursor:pointer;padding:.77rem 0;border-radius:54px;border:1px solid transparent;text-align:center;font-size:.833rem;transition:all .25s;color:#fff;font-weight:500;margin-left:5px}.ResetButton{width:5rem;background-color:#292727}.SearchButton:hover{--button-color:rgba(108,65,233,0.7)}.ResetButton:hover,.SearchButton:hover{box-shadow:0 0 5px var(--button-color);border:1px solid var(--button-color);background-color:var(--button-color)}.ResetButton:hover{--button-color:rgba(111,109,114,0.7)}@media only screen and (max-width:1020px){.SearchBar{flex-direction:column;padding-right:0}.SearchBar input{width:180px}.SearchButton{width:180px;margin:5px 0}}
/*# sourceMappingURL=main.95c7803b.chunk.css.map */