#modal{display:flex;justify-content:center;align-items:center}#modal,#modal-background{position:fixed;top:0;right:0;left:0;bottom:0}#modal-background{background-color:rgba(0,0,0,.7)}#modal-content{position:absolute;background-color:#fff;height:650px;width:450px;padding:20px}#modal-content,.loading-spinner{display:flex;align-items:center;justify-content:center}.loading-spinner{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:#333;z-index:9000}.loading-spinner:after{content:"";width:25px;height:25px;border:15px solid #ddd;border-top-color:#009578;border-radius:50%;animation:loading-spinner .75s ease infinite}@keyframes loading-spinner{0%{transform:rotate(0turn)}to{transform:rotate(1turn)}}.delete-album-modal-overlay{position:fixed;top:0;left:0;z-index:9000;width:100%;height:100%;display:flex;justify-content:center;align-items:center;flex-direction:column;border-radius:20px;font-family:"Montserrat",sans-serif}.delete-album-modal-backdrop{position:fixed;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,.5);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:5500}.delete-album-modal-content{background-color:#fff;display:flex;flex-direction:column;font-family:"Montserrat",sans-serif;color:#000;border-radius:15px;width:500px;align-items:center;justify-content:center;height:200px}.delete-album-modal-buttons{height:40px;margin-top:5px;font-size:14px}.delete-button-album{background-color:#1db954;border-radius:20px}.cancel-button-album,.delete-button-album{padding:10px 20px;color:#000;font-weight:700;border:none;cursor:pointer}.cancel-button-album{background-color:#fff}.side-bar-container{display:grid;grid-template-columns:1fr;grid-template-rows:8rem 1.8fr;grid-gap:0 0;gap:0 0;overflow:auto;scrollbar-width:none;padding-left:12px}.home-button-container{background-color:#121212;margin-top:8px;width:465ßpx;border-radius:5px;height:125px}.home-text-container p{color:#fff;margin-left:5px}.home-button-top{width:100%}.home-icon-container{margin-left:5px;margin-right:20px}.home-button-top,.home-icon-container{display:flex;justify-content:flex-start;align-items:center}.home-button-top{flex-direction:row;margin-right:25px}.home-icon{height:75px;width:75px}.home-button-bottom{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;width:100%}.home-button-bottom button{background-color:initial;border:none;color:#fff;transition:color .2s ease-in;cursor:pointer;font-size:14px}.search-icon-container{display:flex;justify-content:flex-start;align-items:center;margin-left:20px;margin-right:20px}.search-icon{height:55px;width:55px}.playlist-albums-container{margin-top:16px;background-color:#121212}.library-create-upper{border-top-left-radius:5px;border-top-right-radius:5px;display:flex;flex-direction:row;justify-content:space-between;align-items:center;margin-bottom:10px;background-color:#121212;padding:10px}.albums-container h2,.create-playlist h2,.library-create-upper h2{color:#a7a7a7}.library-create-lower{display:flex;flex-direction:row;justify-content:flex-start;align-items:center;background-color:#121212;padding:10px}.library-create-lower button{padding:10px;border-radius:20px;color:grey;background-color:#232323;border:none;margin-right:15px;transition:color .2s ease-in;cursor:pointer}.library-create-lower button:hover{color:#fff}.create-playlist-button{background-color:#000;border:none;margin-right:10px;background-color:#121212;padding:15px;cursor:pointer}.create-playlist-button img{transition:color .2s ease-in;color:#eaeaea}.create-playlist-button:hover img{filter:brightness(22.5)}.albums-container,.create-playlist{background-color:#121212;padding:10px}.playlist-list-container{background-color:#121212}.create-albums-button-container{background-color:#121212;padding:10px}.dropdown-menu{background-color:#282828;padding:10px;position:fixed;margin-left:300px;margin-top:80px}.dropdown-menu button{color:#eaeaea;background-color:#282828;border:none;display:flex;flex-direction:column;justify-content:center;align-items:center;transition:color .2s ease-in;cursor:pointer}.dropdown-menu button:hover{color:#fff}.individual-playlist-container{display:flex;flex-direction:row;align-items:center;margin-right:20px;margin-bottom:20px}.playlist-icon-container{display:flex;margin-right:20px;width:75px;height:75px;object-fit:cover}.individual-playlist-container:hover{background-color:#232323}.playlist-info-top{justify-content:center}.playlist-info-bottom,.playlist-info-top{font-size:15px;display:flex;align-items:center}.playlist-info-bottom{flex-direction:row;justify-content:space-between}.album-container{width:100%}.individual-album-container{display:flex;flex-direction:row;align-items:center;margin-right:20px;margin-bottom:20px}.individual-album-container:hover{background-color:#232323}.album-icon-container{margin-right:20px}.album-icon-container,.album-info-container{display:flex;justify-content:center;align-items:center}.album-info-container{flex-direction:column;width:150px}.album-info-bottom,.album-info-top{font-size:15px;display:flex}.album-info-bottom{flex-direction:row}.link-no-underline{text-decoration:none;color:#fff}.album-photo{height:auto;width:75px}.log-in-container{display:flex;justify-content:space-around;align-items:center;flex-direction:column;height:50%;width:100%}.login-form-container{display:flex;flex-direction:column;justify-content:center;align-items:center;width:300px}.login-submit-button{margin-top:10px;background-color:#1db954;border-radius:20px;padding:10px;width:150px}.log-in-label{display:flex;justify-content:center;align-items:center;margin-bottom:5px}.errors-list{color:red}.sign-up-form-container{background-color:#fff;flex-direction:column;height:600px}.sign-up-form-container,.title-container{display:flex;justify-content:center;align-items:center}.title-container h1{color:#000;text-align:center}.form-container{display:flex;flex-direction:column;justify-content:center;align-items:center}.sign-up-sign-up-button{border-radius:40px;background-color:#1db954;padding:10px;color:#fff;font-weight:700}.sign-up-labels{color:#000;margin-bottom:5px}.sign-up-input,.sign-up-labels{display:flex;flex-direction:column;justify-content:center;align-items:center}.sign-up-input{margin-bottom:10px;width:200px}.nav-component-nav-container{max-width:100%;display:flex;justify-content:space-between;padding:15px;background-color:#121212;height:60px;z-index:1000000000;position:relative;margin-top:9px;border-radius:5px 5px 0 0}.logout-container,.profile-icon-container{background-color:#121212}.profile-icon-container{position:relative;border-radius:20px;padding:10px;border:none}.hover-info{display:none;position:absolute;top:60px;right:10px;background-color:#282828;padding:10px}.profile-info-container:hover .hover-info{display:block}.profile-icon{width:25px}.profile-icon:hover{cursor:pointer}.drop-down-profile-menu{color:#eaeaea;background-color:#282828;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;position:absolute;right:10px;max-height:350px;min-width:160px;overflow-y:auto;padding:4px;z-index:1}.drop-down-profile-menu button{color:#eaeaea;background-color:#282828;border:none;margin-top:10px}.drop-down-profile-menu button:hover{color:#fff;cursor:pointer}.about-me-links{display:flex;flex-direction:row;align-items:center;justify-content:center;z-index:10001}.about-me-links a{color:#fff}.about-me-github-splash-page{background-image:url(https://res.cloudinary.com/dgxpqnbwn/image/upload/v1695684166/icons8-github-64_c5vnyf.png);width:60px;height:60px;margin-right:10px}.about-me-github-splash-page,.about-me-linkedin-splash-page{background-size:contain;display:flex;justify-content:center;align-items:center;background-color:initial}.about-me-linkedin-splash-page{background-image:url(https://res.cloudinary.com/dgxpqnbwn/image/upload/v1695683842/icons8-linkedin-a-business-and-employment-oriented-service-mobile-app-96_qyf7qt.png);width:30px;height:30px}.page-container{grid-template-columns:25% auto;grid-gap:10px;gap:10px;overflow-y:auto}.album-image-and-title-container{background:linear-gradient(180deg,#4a348f);flex-direction:row;height:200px;padding:20px}.album-image-and-title-container,.album-user-details{display:flex;justify-content:flex-start;align-items:center}.album-user-details{height:20px;font-size:15px}.album-image-container{display:flex;justify-content:center;align-items:center;max-width:100%;max-height:400px;overflow:hidden;margin-right:15px;height:300px;width:250px}.album-information-container{color:#fff;width:500px;font-size:18px}.album-image{max-width:100%;max-height:100%;height:auto;width:auto;margin-left:30px}.album-songs-container{background-color:#121212;color:#fff;display:grid;grid-template-rows:repeat(6,1fr);grid-gap:10px;align-items:center}.album-headers{display:flex;flex-direction:row;background-color:#121212;color:#9e9e9e}.album-headers .hashtag-header{margin-left:55px}.album-headers .title-header{margin-left:180px}.album-headers .date-header,.album-headers .time-header{margin-left:260px}.individual-album-songs{display:flex;flex-direction:row;justify-content:space-around;align-items:center}.individual-album-songs:hover{background-color:#232323}.grid-row{display:flex;justify-content:center;align-items:center;margin-top:5px}.album-user-picture{margin-right:10px}.play-button-albums{background-color:#121212;border:none;height:auto;width:100px}.play-albums-button{background-color:initial;border:none;border-radius:50%;padding:0;cursor:pointer;width:200px;margin-left:-30px;margin-bottom:10px}.album-dropdown-button{font-size:30px;background:none;border:none;cursor:pointer;color:#a7a7a7}.album-dropdown-button:focus{outline:none}.album-delete,.album-update-button,button{cursor:pointer}.grid-row-width{width:200px}.create-album-container{display:flex;flex-direction:column;justify-content:center;align-items:center;margin-top:165px}.create-album-container h1{color:#fff;margin-bottom:20px}.create-album-form-container{border:2px solid #000;display:flex;flex-direction:column;justify-content:center;align-items:center;width:23rem;height:36rem;background-color:#272727}.album-create-submit-button{color:#fff;border-radius:20px;background-color:#1db954;padding:10px;margin-bottom:30px}.error-message{margin-bottom:10px;display:flex;justify-content:center;align-items:center}body,html{margin:0;padding:0;height:100%;width:100%}.create-playlist-container{display:flex;justify-content:center;align-items:center;margin-top:165px}.create-playlist-container h1{color:#fff;margin-bottom:20px}.create-playlist-form-container{border:2px solid #000;flex-direction:column;width:22rem;height:34rem;background-color:#272727}.create-playlist-form-container,.form-label{display:flex;justify-content:center;align-items:center}.form-label{color:#fff;margin-bottom:10px}.form-input-box{margin-bottom:20px;flex-direction:column}#audio,.form-input-box{display:flex;justify-content:center;align-items:center}#audio{margin-bottom:5px}.playlist-create-submit-button{color:#fff;border-radius:20px;background-color:#1db954;padding:10px;margin-bottom:20px}.container{background-color:#000;color:#fff;padding-left:10px;padding-right:10px;min-width:100%;height:100vh;flex:1 1;position:sticky;top:0;border:2px solid #fff;display:grid;grid-template-columns:1fr 1fr 1fr 1fr;grid-template-rows:1fr 1fr 1fr;grid-gap:0 0;gap:0 0;grid-auto-flow:row;grid-template-areas:"Playlist1 Playlist2 Playlist3 Playlist4" "Playlist5 Playlist6 Playlist7 Playlist8" "Playlist9 Playlist10 Playlist11 Playlist12"}.Playlist1{grid-area:Playlist1}.Playlist2{grid-area:Playlist2}.Playlist3{grid-area:Playlist3}.Playlist4{grid-area:Playlist4}.Playlist5{grid-area:Playlist5}.Playlist6{grid-area:Playlist6}.Playlist7{grid-area:Playlist7}.Playlist8{grid-area:Playlist8}.Playlist9{grid-area:Playlist9}.Playlist10{grid-area:Playlist10}.Playlist11{grid-area:Playlist11}.Playlist12{grid-area:Playlist12}a{text-decoration:none}.playlist-tile-wrapper{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));justify-content:center;align-items:center;grid-gap:15px;padding:20px;margin-left:37px}.playlist-info-wrapper{padding:10px}.playlist-info{display:flex;align-items:center;font-size:16px;color:#fff;width:140px;overflow-wrap:break-word}.playlist-image-tile{max-width:100%;max-height:100%;height:150px;width:-moz-fit-content;width:fit-content;object-fit:cover;margin-left:0;border-radius:15px 15px 0 0}.playlist-name{font-weight:700}.playlist-tile-container{width:150px;border:1px solid #ccc;border-radius:15px;box-shadow:0 2px 4px rgba(0,0,0,.1);margin-bottom:10px;height:225px}.playlist-tile-container,.playlist-tile-list{display:flex;flex-direction:column;cursor:pointer}.playlist-tile-list{position:relative;flex-wrap:wrap}@media (max-width:499px){.playlist-tiles-wrapper{width:100%}}@media (min-width:900px) and (max-width:1023px){.playlist-tile-list{width:calc(33.33% - 20px)}}@media (min-width:1024px){.playlist-tile-list{width:calc(25% - 20px)}}.album-tile-wrapper{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));justify-content:center;align-items:center;grid-gap:15px;padding:20px}.album-info-wrapper{padding:10px}.album-info{display:flex;justify-content:center;align-items:center;color:#fff}.album-image{width:150px;height:150px;object-fit:cover;border-radius:15px 15px 0 0;margin:0}.album-name{font-weight:700}.album-tile-container{width:150px;border:1px solid #ccc;border-radius:15px;box-shadow:0 2px 4px rgba(0,0,0,.1);margin-bottom:20px}.album-tile-container,.album-tile-list{display:flex;flex-direction:column;cursor:pointer}.album-tile-list{position:relative;flex-wrap:wrap}@media (max-width:499px){.album-tiles-wrapper{width:100%}}@media (min-width:900px) and (max-width:1023px){.album-tile-list{width:calc(33.33% - 20px)}}@media (min-width:1024px){.album-tile-list{width:calc(25% - 20px)}}body{font-family:"Nunito Sans",sans-serif}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background-color:#888;border-radius:4px;border:1px solid #a7a7a7}::-webkit-scrollbar-thumb:hover{background-color:#555}.playlist-sidebar{width:25%;padding:10px}.main-content-container{max-width:100%}.main-content{padding:10px;background-color:#121212}.footer{position:sticky}.audio-bar-container{position:fixed;bottom:0;left:0;width:100%;z-index:1000;display:flex;flex-direction:row}.audio-bar-song-info{color:#fff;width:500px;display:flex;flex-direction:row;justify-content:space-around;align-items:center;flex:1 1;z-index:1000;background-color:#000}.album-cover-image{width:50px;height:50px}.rhap_container{background-color:#000;box-sizing:border-box;flex:3 1}.rhap_time{color:#b3b2b2}.rhap_progress-bar{background-color:#4d4c4c}.rhap_progress-indicator{background-color:none}.rhap_repeat-button{color:#b3b2b2}.rhap_main-controls-button{color:#fff}.rhap_forward-button,.rhap_rewind-button,.rhap_volume-button{color:#b3b2b2}.rhap_volume-bar,.rhap_volume-indicator{background-color:#fff}.delete-modal-overlay{z-index:9000;display:flex;justify-content:center;align-items:center;flex-direction:column;border-radius:20px;font-family:"Montserrat",sans-serif}.delete-modal-backdrop,.delete-modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%}.delete-modal-backdrop{background-color:rgba(0,0,0,.5);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:5500}.delete-modal-content{background-color:#fff;display:flex;flex-direction:column;font-family:"Montserrat",sans-serif;color:#000;border-radius:15px;width:500px;align-items:center;justify-content:center;height:200px}.delete-modal-buttons{height:40px;margin-top:5px;font-size:14px}.delete-button{padding:10px 20px;background-color:#1db954;border-radius:20px;color:#000;font-weight:700;border:none;cursor:pointer}.update-modal-overlay{display:flex;justify-content:center;align-items:center;flex-direction:column;border-radius:20px;font-family:"Montserrat",sans-serif}.update-modal-backdrop,.update-modal-overlay{position:fixed;top:0;left:0;z-index:9000;width:100%;height:100%}.update-modal-backdrop{background-color:rgba(0,0,0,.5);z-index:5500}.input-field{background-color:#3e3d3d;color:#fff}.update-modal-h2{display:flex}.update-modal-content{background-color:#272727;padding:20px;height:auto;width:500px;font-family:"Montserrat",sans-serif;color:#fff;border-radius:15px;z-index:9000}.update-playlist-container{display:flex;flex-direction:column;width:500px}.update-form-left-side,.update-form-right-side{display:flex;flex-direction:column;justify-content:center;align-items:center;flex:1 1;padding:10px;box-sizing:border-box}.update-modal-buttons{display:flex;flex-direction:row;justify-content:flex-end;align-items:center;height:40px;margin-top:5px;font-size:14px}.update-button{border-radius:20px}.cancel-button,.update-button{padding:10px 20px;background-color:#fff;color:#000;font-weight:700;border:none;cursor:pointer}.disclaimer-text{font-size:12px;margin-top:10px;line-height:20px}.error-message{color:red}.page-container{grid-template-areas:"playlist-sidebar main-content" "testfooter testfooter";padding-bottom:90px}.playlist-image-and-title-container{background:linear-gradient(180deg,#4a348f);display:flex;flex-direction:row;justify-content:flex-start;align-items:center;height:200px;padding:20px;margin-bottom:15px}.playlist-user-details{display:flex;justify-content:flex-start;align-items:center;height:20px;font-size:15px;margin-top:50px}.playlist-image-container{display:flex;justify-content:center;align-items:center;max-width:100%;max-height:400px;overflow:hidden;margin-right:15px;height:250px;width:250px}.playlist-information-container{color:#fff;width:500px;font-size:18px}.playlist-image{max-width:100%;max-height:100%;height:auto;width:auto;margin-left:30px}.playlist-songs-container{background-color:#121212;color:#fff;display:grid;grid-template-rows:repeat(6,1fr);grid-gap:10px;align-items:center}.playlist-headers{display:flex;flex-direction:row;background-color:#121212;color:#9e9e9e;align-items:center;padding:0 20px}.playlist-headers .hashtag-header{margin-left:13px}.playlist-headers .title-header{margin-left:220px}.playlist-headers .album-header{margin-left:180px}.playlist-headers .date-header{margin-left:155px}.playlist-headers .time-header{margin-left:168px}.individual-playlist-songs{display:flex;flex-direction:row;justify-content:space-around;align-items:center}.individual-playlist-songs .grid-row{width:200px}.individual-playlist-songs:hover{background-color:#232323}.individual-playlist-songs .grid-row:first-child{width:50px}.individual-playlist-songs .grid-row:nth-child(2){width:300px;display:flex;align-items:center}.playlist-user-picture{margin-right:10px}.clock-icon{width:20px}#time-info{margin-bottom:15px}.play-button-playlist-container{margin-left:10px;margin-right:10px}.play-playlist-button{background-color:#121212;border:#121212}.play-button{height:40px;width:40px;margin-left:5px;margin-top:7px}.pause-button{height:45px;width:45px;margin-top:5px;margin-left:2px}.playlist-dropdown-button{font-size:30px;background:none;border:none;cursor:pointer;color:#a7a7a7}.playlist-dropdown-button:focus{outline:none}.playlist-delete,.playlist-update-button,button{cursor:pointer}.song-item{width:250px;display:flex;flex-direction:row;margin-left:60px}.song-item p{max-width:150px;display:flex;margin:0 0 0 35px;justify-content:center;align-items:center;cursor:pointer}.song-item img{max-width:100%;max-height:100%;width:auto;height:auto;margin-right:10px}.song-audio-gif{width:40px;height:40px;background-color:#121212}.song-play-icon-playlist{width:20px;height:20px}.songItemContainer{display:flex;justify-content:space-between;width:100%}.songItemContainer button,.songItemContainer span{margin-bottom:10px}.songItemContainer button{color:#fff;background-color:#000;border:1px solid #727272;border-radius:18px;width:60px;height:30px;display:flex;align-items:center;justify-content:center;font-size:15px;cursor:pointer;transition:all .3s;box-shadow:none}.songItemContainer button:hover{border:2px solid #fff;color:#fff}.songItemContainer button:focus{outline:none}.song-list{list-style-type:none;padding-left:0}.page-container{background-color:#000;min-width:100%;height:100vh;display:grid;grid-template-columns:25% 1fr;grid-template-rows:1fr max-content;grid-gap:0 10px;gap:0 10px;overflow-y:scroll}.main-content-container{color:#fff}.main-content-nav-container{position:sticky;top:0}.song-image-and-title-container{border:10px solid #228b22;background:linear-gradient(180deg,#4a348f);flex-direction:row;height:200px;padding:20px}.song-image-and-title-container,.song-user-details{display:flex;justify-content:flex-start;align-items:center}.song-user-details{border:2px solid green;height:20px;font-size:15px}.song-image-container{display:flex;justify-content:center;align-items:center;max-width:100%;max-height:400px;overflow:hidden;margin-right:15px;height:200px;width:300px}.song-information-container{color:#fff;width:500px;font-size:25px}.song-image{max-width:100%;max-height:100%;height:auto;width:auto;margin-left:30px}.song-songs-container{background-color:#121212;color:#fff;display:grid;grid-template-rows:repeat(6,1fr);grid-gap:10px;align-items:center}.play-button-song{background-color:#121212;border:none;height:auto;width:100px}.play-song-button{background-color:initial;border:none;border-radius:50%;padding:0;cursor:pointer;width:200px}.search-bar-container{display:flex;align-items:center;justify-content:flex-start}.song-dropdown-button{font-size:24px;background:none;border:none;cursor:pointer;color:#a7a7a7}.song-dropdown-button:focus{outline:none}.song-delete,.song-update-button,button{cursor:pointer}.song-image-container{width:50px;height:50px}.album-title{cursor:pointer}.album-title p{color:#fff}.song-lyrics{border:2px solid #00f;color:#bababa;display:flex;justify-content:center;max-width:250px;text-align:left;line-height:1.6;word-spacing:2px}body{margin:0;padding:0;background-image:radial-gradient(circle,#1db954,#000);background-size:cover;background-attachment:fixed}.splash-page-logo-container{display:flex;justify-content:flex-start;width:100px;height:100px}.splash-page-soundify-logo{height:125px;width:auto;margin-right:20px}.splash-page-header{display:flex;align-items:center;justify-content:space-between;padding:10px 20px;border-bottom:2px solid #000}.splash-page-container{display:flex;flex-direction:column;justify-content:center;align-items:center;height:100vh}.splash-page-container h1{color:#fff;font-size:50px}.soundify-button{border-radius:40px;padding:20px;color:#000;font-size:bold;background-color:#1db954;border:2px solid transparent;font-size:20px;box-shadow:0 0 10px rgba(0,0,0,.3)}.sign-up-button{background:none;border:none;border-radius:40px;color:#9e9e9e;padding:10px;font-weight:700;transition:color .3s ease,transform .3s ease;cursor:pointer}.sign-up-button:hover{color:#fff}.log-in-button{background-color:#fff;color:#000;border-radius:40px;font-weight:700;padding:10px;width:100px;height:50px;margin-left:20px;cursor:pointer}.sign-up-button:hover{box-shadow:0 0 10px hsla(0,0%,100%,.7)}.upcoming-features{background-color:initial;color:red;border-radius:40px;font-weight:700;height:50px;margin-right:20px;border:none}.nav-component-nav-container-splash{max-width:100%;display:flex;justify-content:space-between;padding:15px;height:60px;z-index:1000000000;position:relative;margin-top:9px;border-radius:5px 5px 0 0}