@import url(https://fonts.googleapis.com/css2?family=Major+Mono+Display&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Space+Mono:ital,wght@0,400;0,700;1,400;1,700&display=swap);@import url(https://fonts.googleapis.com/css2?family=Major+Mono+Display&display=swap);body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.alert-container{background:none!important;display:flex;flex-direction:column;height:100%;justify-content:flex-end;pointer-events:none;position:absolute;right:0;top:0}.alert{cursor:pointer;justify-content:space-between;margin-bottom:1rem;overflow:hidden;padding:.75rem 1.5rem;pointer-events:stroke;position:-webkit-sticky;position:sticky;right:2rem;-webkit-transform:translateX(-5%);transform:translateX(-5%);width:300px;z-index:3}.alert,.alert a{align-items:center;display:flex}.alert a{color:#232323;font-size:1.5rem}.alert a:hover{color:#ffe927}.fade-in{-webkit-animation:blendIn 2s ease-in-out;animation:blendIn 2s ease-in-out}.fade-out{-webkit-animation:blendOut 2s ease-in-out;animation:blendOut 2s ease-in-out}@-webkit-keyframes blendIn{0%{opacity:0;-webkit-transform:translateX(0);transform:translateX(0)}to{opacity:1;-webkit-transform:translateX(-5%);transform:translateX(-5%)}}@keyframes blendIn{0%{opacity:0;-webkit-transform:translateX(0);transform:translateX(0)}to{opacity:1;-webkit-transform:translateX(-5%);transform:translateX(-5%)}}@-webkit-keyframes blendOut{0%{opacity:1;-webkit-transform:translateX(-5%);transform:translateX(-5%)}to{opacity:0;-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes blendOut{0%{opacity:1;-webkit-transform:translateX(-5%);transform:translateX(-5%)}to{opacity:0;-webkit-transform:translateX(0);transform:translateX(0)}}.error{background-color:#ffb1e4}.success{background-color:#00b0bd}.info{background-color:#70acfe}.warning{background-color:#ffe927}.warning a:hover{color:#70acfe}nav{background-color:#fff;border-left:2px dashed #232323;display:flex;flex-direction:column;height:100vh;justify-content:space-between;min-height:600px;position:fixed;right:0;width:4.5rem}nav #logo{font-family:Major Mono Display,monospace;font-size:2.8rem;font-weight:100;margin-top:2rem;-webkit-transform:rotate(90deg);transform:rotate(90deg)}nav ul{align-items:center;display:flex;flex-direction:column;height:90vh;justify-content:space-evenly;margin-top:2rem}nav .start-nav{justify-content:flex-end}nav ul>li{background-image:linear-gradient(90deg,#ffe927 60%,rgba(255,233,39,.311) 96%);background-position:0 1em;background-repeat:no-repeat;background-size:0 50%;letter-spacing:.7px;text-transform:uppercase;-webkit-transform:rotate(90deg);transform:rotate(90deg);transition:background-size .5s}nav ul>li:hover{background-size:100% 50%}nav ul>li:visited{color:#232323}nav ul>li .active{background-image:linear-gradient(90deg,#ffe927 60%,rgba(255,233,39,.311) 96%);background-position:0 1em;background-repeat:no-repeat;background-size:100% 50%}nav ul>li .mode .active,nav ul>li:last-child .active{background-image:none}nav .nav-chat-notification{background-color:#ffe927;background-image:none;border-radius:50%;display:inline-block;font-size:.7rem;font-weight:700;height:15px;position:absolute;right:-1rem;text-align:center;top:0;width:15px}nav .search-btn{font-size:1.2rem;margin-bottom:2rem;text-align:center}nav .search-btn:hover{background-image:none}nav .mode{font-size:1.4rem;margin-bottom:2rem;position:static;text-align:center}.dark nav{background-color:#232323;border-left:2px dashed #f9f8f8}.dark nav ul>li{background-image:linear-gradient(90deg,#a479d8 15%,rgba(164,121,216,.297) 96%)}.dark nav .active{background-image:linear-gradient(90deg,#a479d8 60%,rgba(164,121,216,.297) 96%)}.dark nav .nav-chat-notification{background-color:#a479d8;color:#f9f8f8}.dark nav .mode{background-image:none;color:#f9f8f8}.dark nav a{border:none;color:#f9f8f8}@media screen and (max-width:960px){nav{align-items:center;border-bottom:2px dashed #232323;border-left:none;display:flex;flex-direction:row;height:4.5rem;justify-content:space-between;min-height:4rem;position:relative;width:100vw}nav #logo{font-size:2rem;margin:0 0 0 1rem;-webkit-transform:rotate(0deg);transform:rotate(0deg)}nav .nav-toggle{font-size:2rem;position:absolute;right:1.05rem;top:1.05rem}nav ul{background-color:#e7dcf5;border-bottom:2px dashed #232323;display:flex;height:40vh;margin:0;min-height:40vh;position:absolute;top:4.5rem;width:100vw;z-index:3}nav .start-nav{justify-content:flex-end}nav ul>li{background:none;background-image:linear-gradient(90deg,#a479d8 15%,rgba(164,121,216,.297) 96%);background-position:0 1em;background-repeat:no-repeat;background-size:0 50%;text-transform:uppercase;-webkit-transform:rotate(0deg);transform:rotate(0deg);transition:background-size .5s}nav ul>li:hover{background-size:100% 50%}nav ul>li .active{background-image:linear-gradient(90deg,#a479d8 15%,rgba(164,121,216,.297) 96%)}nav ul>li a:visited{color:#232323}nav .nav-chat-notification{background-color:#a479d8;color:#f9f8f8;right:-1rem;top:0}nav .mode{font-size:1.4rem;position:absolute;right:6rem;top:1.4rem;z-index:5}nav .search-btn{font-size:1.2rem;position:absolute;right:9rem;top:1.55rem}.dark nav{border-left:none}.dark nav,.dark nav ul{border-bottom:2px dashed #f9f8f8}.dark nav ul{background-color:#2f233f}.dark nav ul li a{color:#f9f8f8}}.home{align-items:center;background-image:url(/static/media/bg-home-pink.67616e07bcc5678b4651.png);background-size:cover;width:100vw}.home,.home .home-container{display:flex;justify-content:center}.home .home-container{flex-direction:column;height:80%;width:85%}.home .headline{margin-top:6rem}.home h1{display:inline;font-size:5rem;font-weight:500;line-height:6rem}.home h2{font-size:3.5rem;font-weight:200;line-height:4.5rem;padding:2rem 0}.home h4{font-size:1.5rem;font-weight:200}.dark .card{background-color:#232323;border:2px solid #f9f8f8;color:#f9f8f8}.dark .card *{stroke:#f9f8f8;fill:#232323}@media screen and (max-width:960px){.home .home-container{min-height:calc(100vh - 4.5rem);padding:1rem;width:100%}.home .home-container .headline{margin-top:1rem}.home .home-container .headline h1{font-size:3rem;line-height:4rem}.home .home-container .headline h2{font-size:2rem;line-height:2.5rem;padding:1.5rem}.home .home-container h4{font-size:1.2rem}.home .home-container .login-btn-container{margin:0 1.5rem}.home-container{justify-content:space-evenly}}.track-upload-form{display:flex;flex-direction:column;height:85%;justify-content:space-between}.track-upload-form input{margin-bottom:1rem}.track-upload-form .animation-container{align-items:center;display:flex;flex-direction:column;height:3rem;justify-content:center;padding:3.5rem 1rem}.track-upload-form .animation-container span{font-size:.9rem;margin:.5rem auto;text-align:center}.modal .drag-and-drop{align-items:center;background-color:#f9f8f8;border:none;display:flex;flex-flow:column nowrap;font-size:24px;height:200px;justify-content:center;padding:50px;text-align:center}.modal .drag-and-drop .drop-icon{font-size:4rem}.modal .drag-and-drop p{font-size:1rem}.file-input{display:none}.dark .drag-and-drop{background-color:#232323;border:1px solid #f9f8f8}form,form input{outline:none}form input{border:2px solid #232323;font-family:Poppins,sans-serif;font-size:1rem;font-weight:600;padding:.5em;width:100%}form input[type=email]:focus,form input[type=fieldset],form input[type=password]:focus,form input[type=text]:focus{border:2px solid #ffb1e4}form input[type=submit]{text-transform:uppercase}form input[type=submit]:hover{background-color:#ffb1e4}form input::-webkit-input-placeholder{color:#232323;font-weight:200;letter-spacing:2px}form input::placeholder{color:#232323;font-weight:200;letter-spacing:2px}form textarea{border:2px solid #232323}form textarea:focus-visible{border:2px solid #ffb1e4;outline:none}form input:-internal-autofill-previewed,form input:-internal-autofill-selected,form input:-webkit-autofill,form input:-webkit-autofill:active,form input:-webkit-autofill:focus,form input:-webkit-autofill:hover{-webkit-text-fill-color:#232323;-webkit-box-shadow:inset 0 0 0 40px #fff!important}form .drag-and-drop{cursor:pointer}form button{height:100%}form .btn-small{background-color:#232323;color:#fff;margin:0}form .btn-small:hover{color:#a479d8}form .btn-small:hover:active{color:#ffb1e4}.dark form input{background-color:#232323;border:2px solid #f9f8f8;color:#f9f8f8!important}.dark form input::-webkit-input-placeholder{color:#f9f8f8}.dark form input::placeholder{color:#f9f8f8}.dark form input:-webkit-autofill{background-color:#232323;-webkit-box-shadow:inset 0 0 0 50px #fff}.dark form input:focus,.dark form input[type=fieldset]{border:2px solid #aa336a;color:#f9f8f8}.dark form textarea:focus-visible{border:2px solid #aa336a;outline:none}.dark form input:-internal-autofill-previewed,.dark form input:-internal-autofill-selected,.dark form input:-webkit-autofill,.dark form input:-webkit-autofill:active,.dark form input:-webkit-autofill:focus,.dark form input:-webkit-autofill:hover{-webkit-text-fill-color:#f9f8f8;-webkit-box-shadow:inset 0 0 0 40px #232323!important}.dark form .btn-small{background-color:#f9f8f8;border-color:#f9f8f8;color:#232323;margin:0}.dark form .btn-small:hover{color:#ffb1e4}.dark form .btn-small:hover:active{color:#a479d8}.authentication{display:flex;flex-direction:column;height:400px;justify-content:space-between}.authentication p{font-size:1.2rem;padding:.5rem 0}.authentication form{height:150px}.authentication form input{margin-bottom:.5rem}.authentication #signInDiv{height:100px;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.authentication .toggle{display:flex;height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;justify-content:center}.authentication .toggle .btn-container{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.dark .authentication .toggle button{border:2px solid #f9f8f8}.loginForm,.signupForm{height:200px;width:100%}@media screen and (max-width:960px){.loginForm,.signupForm{width:100%}}.btn-container{height:100%}button{background-color:#fff;border:none;box-shadow:inset 0 0 0 2px #232323;color:#232323;cursor:pointer;font-family:Poppins,sans-serif;font-size:1rem;font-weight:600;margin:1rem 0;padding:.5em;text-transform:uppercase}.send{background:linear-gradient(141deg,#232323 31%,#a479d8 72%),0 0;background-size:350% 300%;box-shadow:none;color:#fff;height:100%;margin:0;transition:all 1s ease}.send:hover{background-position:100% 100%}.submit{box-shadow:inset 0 0 0 4px #232323;display:block;height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;height:40px;position:relative;transition:color .2s .0666666667s}.submit:after,.submit:before{border:0 solid transparent;bottom:0;box-sizing:border-box;content:"";height:0;pointer-events:none;position:absolute;right:0;width:0}.submit:before{border-bottom-width:4px;border-left-width:4px}.submit:after{border-right-width:4px;border-top-width:4px}.submit:hover{color:#a479d8}.submit:hover:after,.submit:hover:before{border-color:#a479d8;height:100%;transition:border-color 0s,width .2s,height .2s;width:100%}.submit:hover:before{transition-delay:0s,0s,.2s}.submit:hover:after{transition-delay:0s,.2s,0s}.icon{cursor:pointer}.btn-small{font-size:.8rem}.dark button{background-color:#232323;color:#f9f8f8}.dark .submit{box-shadow:inset 0 0 0 4px #f9f8f8;display:block}.card-list{display:flex;flex-wrap:wrap;justify-content:center;width:100%}@media screen and (max-width:960px){.card-list{margin:1rem;padding:1rem}}@media screen and (max-width:600px){.card-list{align-items:center;flex-direction:column;margin:0;padding:0}}.card{background-color:#fff;border:2px solid #232323;display:flex;height:256px;margin:1rem;width:256px}.card-left-column{display:flex;height:100%;width:20%}.card-artist-name{word-wrap:break-word;font-family:Poppins,sans-serif;font-size:1.2rem;font-weight:600;letter-spacing:2px;padding:1.35rem .6rem;-webkit-transform:rotate(180deg);transform:rotate(180deg);-webkit-writing-mode:vertical-rl;writing-mode:vertical-rl}.card-right-column{align-items:center;display:flex;flex-direction:column;height:100%;margin:0 auto;width:80%}.card-track-pic{background-color:#f9f8f8;height:150px;margin-bottom:3%;margin-top:15%;width:150px}.card-track-pic img{height:100%;max-width:100%}.card-bottom-column{align-items:center;display:flex;height:28%;justify-content:space-around;width:100%}.play-btn{font-size:2rem}.play-btn svg:hover *{stroke:#ffb1e4}.dark .play-btn svg:hover *{stroke:#aa336a}@media screen and (max-width:960px){.card{height:240px;margin-bottom:1rem;width:240px}}.profile-container{display:flex;margin:5rem auto;width:80%}.profile-left-column{border-right:2px dotted #232323;display:flex;flex-direction:column;justify-content:center;width:40%}.profile-left-column .profile-header-username{display:flex;flex-direction:column;max-width:500px;width:100%}.profile-left-column .profile-header-username h3{word-wrap:break-word;height:3rem;letter-spacing:2px;padding:0 2rem}.profile-left-column .profile-header-username form{display:flex;max-width:500px;padding:0 2rem}.profile-left-column form input{color:#232323;font-family:Space Mono,monospace;font-weight:200;letter-spacing:normal}.profile-picture-container{display:flex;padding:2rem}.profile-img{border-radius:50%;height:150px;object-fit:cover;position:relative;width:150px}.profile-picture-update-btn{color:#232323;font-size:1.5rem;left:-5px;position:relative;top:120px}.profile-picture-update-btn svg:hover *{color:#ffb1e4}.profile-info-container{display:flex;flex-direction:column;padding:2rem}.profile-info{margin-top:1rem;width:100%}.profile-info .info-text-form{width:100%}.profile-info textarea{border:2px solid #232323;font-size:.9rem;height:6rem;line-height:1.2rem;padding:.5rem;width:100%}.profile-info textarea:focus-visible{border:2px solid #ffb1e4;outline:2px solid #ffb1e4}.profile-info-edit-btn{margin-top:1.5rem}.profile-right-column{display:flex;flex-direction:column;justify-content:center;padding:2rem;width:60%}.profile-connect-btn-container{display:flex;margin-bottom:2rem;padding:0 2rem}.profile-connect-btn{background-color:#232323;color:#ffb1e4}.profile-connect-btn:active{background-color:#ffb1e4;box-shadow:none;color:#232323}.profile-track-list{display:flex;flex-direction:column;padding:1rem 0}.profile-no-tracks-yet-text{padding-left:2rem}.profile-track-line{align-items:center;display:flex;justify-content:space-between;margin-bottom:1rem}.profile-track-line-flex-container{display:flex;justify-content:space-between;width:80%}.profile-play-btn{font-size:2rem;margin-top:.35rem;padding:0 2rem}.profile-play-btn svg:hover *{stroke:#ffb1e4}.profile-align-container{align-items:center;display:flex;justify-content:space-between;margin-right:1rem;width:300px}.profile-track-title{padding-right:1rem}.profile-track-duration,.profile-track-title{font-family:Poppins,sans-serif;font-size:1.1rem}.profile-track-edit-btn{font-size:1.5rem}.profile-track-delete-btn{font-size:1.5rem;margin-top:.35rem}.profile-track-delete-btn:hover{color:#ffb1e4}.profile-track-add-btn{font-size:1.5rem;margin-top:2rem;padding:0 2rem}.profile-track-add-btn svg:hover{color:#00b0bd}.dark .profile-left-column{border-right:2px dotted #f9f8f8}.dark .profile-picture-update-btn{color:#f9f8f8}.dark .profile-picture-update-btn svg:hover *{color:#aa336a}.dark .profile-info textarea{background-color:#232323;border:2px solid #f9f8f8;color:#f9f8f8}.dark .profile-info textarea:focus-visible{border:2px solid #aa336a;outline:2px solid #aa336a}.dark .profile-info-edit-btn button{border:2px solid #f9f8f8}.dark .profile-connect-btn{background-color:#aa336a;box-shadow:none;color:#f9f8f8}.dark .profile-connect-btn:active{background-color:#ffb1e4;color:#aa336a}.dark .profile-play-btn *{stroke:#f9f8f8;fill:#232323}.dark .profile-play-btn:hover *{stroke:#aa336a}.dark .profile-track-delete-btn:hover{color:#aa336a}.dark .profile-track-add-btn svg:hover{color:#ffe927}.dark .nameForm button{background-color:#f9f8f8;border:2px solid #fff;box-shadow:none;color:#232323}@media screen and (max-width:960px){.profile-container{flex-direction:column;margin:0;padding:1rem;width:100%}.profile-left-column-header{display:flex;flex-direction:column}.profile-left-column-header .profile-header-username form,.profile-left-column-header .profile-header-username h3{margin:0;padding:0}.profile-picture-container{margin-bottom:1rem;padding:.5rem}.profile-info-container{margin-bottom:1rem;max-width:500px;padding:0}.profile-left-column,.profile-right-column{border:none;margin:0;padding:0;width:100%}.profile-right-column{max-width:500px}.profile-left-column h3{font-size:1.8rem;padding:0;text-align:left}.profile-info,.profile-info-text-container{width:100%}.intro-text-form{text-align:right;width:100%}.intro-text-form input[type=text]{height:3rem;width:100%}.intro-text-form button{display:inline-block}.profile-play-btn{padding:0 1rem 0 0}.profile-track-add-btn{padding:0;text-align:left}.profile-connect-btn-container{margin-top:2rem;padding:0}.pic-upload-form-bg{align-items:center;display:flex;justify-content:center}.pic-upload-form-bg .pic-upload-form{position:static}.dark .profile-left-column{border:none}.profile-no-tracks-yet-text{padding-left:0}}.modal-background{align-items:center;background-color:rgba(35,35,35,.25);display:flex;height:100vh;justify-content:center;left:0;position:fixed;top:0;width:100%;z-index:5}.modal{background-color:#e7dcf5;height:550px;padding:4rem;position:relative;width:450px}.modal div{align-items:center;display:flex;justify-content:flex-start;width:100%}.dark .modal{background-color:#6c5191}.close{display:none}@media screen and (max-width:600px){.modal-background{align-items:flex-end}.modal-background .modal{height:calc(100% - 4.5rem);width:100%}.close{display:block;font-size:2rem;padding:1rem;position:absolute;right:0;top:0}}::-webkit-scrollbar{background-color:#f9f8f8;width:6px}::-webkit-scrollbar-track{width:2px}::-webkit-scrollbar-thumb{background:#232323;border-radius:10px}.dropdown-menu{align-items:flex-start;background-color:#f9f8f8;border:2px solid #232323;display:flex;flex-direction:column;height:400px!important;justify-content:flex-start;overflow:auto;padding:.5rem;position:absolute;top:5rem;width:200px!important;z-index:4}.dropdown-menu input{display:none}.dropdown-menu label{line-height:2rem}.dropdown-menu .checked{border-color:#a479d8;border-style:solid;border-width:0 .3em .25em 0;content:"";height:1em;left:0;margin-top:-1em;position:relative;top:.2em;-webkit-transform:rotate(45deg);transform:rotate(45deg);width:.5em}.dropdown-menu .styled-checkbox{height:1em;width:.5em}.dropdown-menu .dropdown-list-item{display:flex;justify-content:space-between;width:90%}.dropdown-background{align-items:center;display:flex;flex-direction:column;height:100vh;justify-content:center;left:0;position:fixed;top:0;width:100%;z-index:3}.dark .updateForm input[type=text]{background-color:#232323;border-color:#f9f8f8}.dark .updateForm input[type=text]::-webkit-input-placeholder{color:#f9f8f8}.dark .updateForm input[type=text]::placeholder{color:#f9f8f8}.dark .updateForm ::-webkit-scrollbar{background:#232323}.dark .updateForm ::-webkit-scrollbar-thumb{background:#f9f8f8}.dark .dropdown-menu{background-color:#232323;border-color:#f9f8f8}.dark .profile-info-edit-btn button.submit{border:none}.dark .modal{background-color:#2f233f}.dark .modal input::-webkit-input-placeholder{color:#f9f8f8}.dark .modal input::placeholder{color:#f9f8f8}.pic-upload-form-container{position:relative}.pic-upload-form-container .profile-picture-update-btn{position:static}.pic-upload-form-container .pic-upload-form-bg{height:100vh;left:0;position:fixed;top:0;width:100vw;z-index:3}.pic-upload-form-container .pic-upload-form{align-items:center;background:#fff;border:1px solid #232323;display:flex;flex-direction:column;height:250px;left:10%;padding-top:1rem;position:absolute;top:15%;width:250px}.pic-upload-form-container .pic-upload-form .drag-and-drop{align-items:center;border:2px solid #e7dcf5;display:flex;height:130px;justify-content:center;width:130px}.pic-upload-form-container .pic-upload-form .drag-and-drop img{border-radius:50%;height:100px;object-fit:cover;width:100px}.pic-upload-form-container .pic-upload-form .drag-and-drop svg{font-size:4rem}.dark .pic-upload-form{background-color:#232323;border:1px solid #f9f8f8}.search-background{align-items:flex-end;display:flex;height:100vh;left:0;position:fixed;top:0;width:100%}.search-bar-container{bottom:0;position:fixed;width:100%}.search-bar{-webkit-animation:slide-up 1s ease-in-out;animation:slide-up 1s ease-in-out;background-color:rgba(255,177,228,.6);height:200px;padding:2rem 8rem;width:100%}.search-bar label{display:block;font-size:1.2rem;margin-bottom:1rem;text-shadow:2px 2px 3px #fff}.search-bar input{width:50%}.dark{color:#f9f8f8}.dark .search-bar{background-color:rgba(170,51,106,.9)}.dark .search-bar label{text-shadow:none}.dark .search-bar input[type=text]{background-color:#232323;border-color:#f9f8f8;color:#f9f8f8}.dark .search-bar input[type=text]::-webkit-input-placeholder{color:#f9f8f8}.dark .search-bar input[type=text]::placeholder{color:#f9f8f8}@-webkit-keyframes slide-up{0%{-webkit-transform:translateY(200px);transform:translateY(200px)}to{-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes slide-up{0%{-webkit-transform:translateY(200px);transform:translateY(200px)}to{-webkit-transform:translateY(0);transform:translateY(0)}}@media screen and (max-width:960px){.search-bar{padding:2rem 1rem 0}.search-bar input{min-width:90%}}.favorite-main{align-items:center;display:flex;flex-direction:column;height:100vh;padding-top:5rem;width:100%}.favorite-page-headline{font-size:2rem;font-weight:600;letter-spacing:3px;padding-bottom:3.5rem}.favorite-container{align-items:center;display:flex;flex-direction:column;height:500px;width:800px}.favorite-track-line{align-items:center;background-color:#fff;border:3px solid #232323;display:flex;height:100px;justify-content:space-between;margin-bottom:1.5rem;width:680px}.favorite-track-line:hover{box-shadow:10px 10px 55px #ffb1e4}.favorite-track-line-flex-container{align-items:center;display:flex;padding-left:1.5rem}.favorite-play-btn{display:flex;font-size:2rem;padding:0 1.5rem 0 2rem}.favorite-play-btn svg:hover *{stroke:#ffb1e4}.favorite-profile-pic{height:60px;width:60px}.favorite-profile-pic img{height:100%;max-width:100%;object-fit:cover}.favorite-track-title{padding-right:1rem;text-align:center}.favorite-track-dash{align-items:center;display:flex;padding-right:1rem}.favorite-track-artist-name{padding-right:1rem;text-align:center}.favorite-track-artist-name:hover{text-decoration:underline}.favorite-track-duration{padding-right:1rem}.favorite-track-like-btn{font-size:1.2rem;margin-top:.3em;padding-right:2.5rem}.dark .favorite-track-line{background-color:#2f233f;border:3px solid #f9f8f8}.dark .favorite-track-line:hover{box-shadow:10px 10px 55px #a479d8}.dark .favorite-track-artist-name{color:#f9f8f8}.dark .favorite-play-btn *{stroke:#f9f8f8;fill:#2f233f}.dark .favorite-play-btn :hover *{stroke:#aa336a}@media screen and (max-width:960px){.favorite-container{margin:0 auto;padding:0 .5rem;width:100vw}.favorite-track-line{max-width:calc(100vw - 1rem);min-width:calc(320px - 1rem)}.favorite-track-line-flex-container{display:flex;flex-direction:column}.favorite-track-dash{margin:-.4rem;visibility:hidden}.favorite-track-like-btn{padding-right:2rem}}@media screen and (max-width:380px){.favorite-profile-pic{display:none}}.chat-main{align-items:center;display:flex;flex-direction:column;height:100%;overflow:hidden;padding-top:12rem;width:100%}.chat-header{font-size:2rem;font-weight:600;letter-spacing:3px;padding-bottom:3.5rem}.chat-container{box-shadow:10px 10px 55px #ffb1e4;display:flex;height:600px;width:800px}.chat-list-left{border-right:2px dashed #232323;height:auto;max-height:calc(100vh - 4.5rem);overflow-y:auto;padding:0 .5em;width:300px}.chat-partner-row{align-items:center;border-bottom:2px dotted #232323;display:flex;height:80px;justify-content:flex-start;padding-left:.7rem;width:100%}.chat-partner-row .chat-profile-img img{background-color:#70acfe;border-radius:50%;height:60px;width:60px}.chat-partner-row .chat-text-box{font-size:.8rem;margin-left:.7rem}.chat-partner-row .chat-partner-name{font-weight:600;margin:.3rem 0}.chat-partner-row .chat-partner-name .dot{background-color:#ffb1e4;border-radius:50%;display:inline-block;height:10px;margin-left:1rem;width:10px}.chat-partner-row .chat-text-teaser{height:15px;margin:.3rem 0;overflow:hidden;width:190px}.chat-window-right{background-color:#fff;display:flex;flex-direction:column;height:100%;width:500px}.chat-window-right ::-webkit-scrollbar{background:#fff;width:8px}.chat-window-right ::-webkit-scrollbar-thumb{background-color:#232323;border-radius:10px}.chat-window-right .chat-scroll{flex-grow:2;overflow-y:scroll}.chat-window-right .current-chat-message-own,.chat-window-right .current-chat-message-partner{word-wrap:break-word;border:3px solid #232323;font-size:.9rem;height:auto;line-height:1.2rem;margin:1rem;overflow-y:auto;padding:.8em}.chat-window-right .current-chat-message-own{background-color:#ebebeb;border-radius:13px 15px 0 15px;margin-left:2rem}.chat-window-right .current-chat-message-partner{border-radius:13px 15px 15px 0;margin-right:2rem}.chat-window-right .current-chat-input{align-items:center;display:flex;font-size:.9rem;height:100px;height:200px;line-height:.9rem;padding:.75rem;text-align:start;width:100%}.chat-window-right .current-chat-input textarea{border-radius:0;line-height:1.2rem;min-height:100%;overflow-y:scroll;padding:.5rem;resize:none;white-space:pre-wrap;width:95%}.chat-window-right .current-chat-input textarea::-webkit-scrollbar{display:none}.chat-window-right .current-chat-input button{padding:1em}.back-to-chat-partners-btn{background-color:#fff;border:3px solid #232323;display:none;margin:1rem;padding:.2em}.back-to-chat-partners-btn:hover{border:3px solid #a479d8;color:#a479d8}.dark .chat-container{background-color:#232323;box-shadow:10px 10px 55px #a479d8}.dark .chat-list-left{background-color:#2f233f;border-right:2px dashed #f9f8f8}.dark .chat-partner-row{border-bottom:2px dotted #f9f8f8}.dark .chat-window-right{background-color:#2f233f}.dark .chat-window-right ::-webkit-scrollbar{width:8px}.dark .chat-window-right ::-webkit-scrollbar-track{background-color:#2f233f}.dark .chat-window-right ::-webkit-scrollbar-thumb{background-color:#a479d8;border-radius:10px}.dark .chat-window-right .current-chat-message-own,.dark .chat-window-right .current-chat-message-partner{border:3px solid #232323}.dark .chat-window-right .current-chat-message-own{background-color:#2f233f;border-color:#a479d8}.dark .chat-window-right .current-chat-message-partner{background-color:#232323;border-color:#a479d8}.dark .chat-window-right .current-chat-input textarea{background-color:#232323;border:2px solid #a479d8;color:#f9f8f8}.dark .chat-window-right .current-chat-input textarea::-webkit-input-placeholder{color:#f9f8f8}.dark .chat-window-right .current-chat-input textarea::placeholder{color:#f9f8f8}.dark .chat-window-right .current-chat-input textarea:focus-visible{border:2px solid #aa336a;outline:none}.dark .chat-window-right .current-chat-input .send{background:linear-gradient(141deg,#a479d8 31%,#aa336a 72%),0 0;background-size:300% 350%}.dark .chat-window-right .current-chat-input .send:hover{background-position:100% 100%}.dark .back-to-chat-partners-btn{background-color:#2f233f;border:3px solid #f9f8f8}.dark .back-to-chat-partners-btn:hover{border:3px solid #a479d8;color:#a479d8}@media screen and (max-width:960px){.chat-main{height:calc(100vh - 4.5rem)!important;padding-top:0}.overlay{align-items:center;background-color:#fff;display:flex;flex-direction:column;position:absolute;top:4.5rem;width:100vw;z-index:2}.overlay .btn-container{margin:0;text-align:center}.overlay .btn-container .back-to-chat-partners-btn{box-shadow:none}.overlay-hidden{display:none}.chat-container{align-items:center;background-color:#fff;box-shadow:none;flex-direction:column;height:100%;justify-content:center;overflow:hidden;width:100%}.chat-container .chat-list-left,.chat-container .chat-window-right{border:none;height:calc(100vh - 9rem);max-width:500px;width:100%}.chat-container .chat-window-right{display:flex;flex-direction:column;padding:.5rem}.chat-container .chat-list-left{align-items:flex-start;display:flex;flex-direction:column}.chat-container .current-chat-input{height:100px;padding:.5rem 0 0}.chat-container .current-chat-message-own,.chat-container .current-chat-message-partner{max-width:calc(100vw - 3rem);min-width:calc(320px - 3rem)}.chat-container .current-chat-message-own{margin-left:.1rem}.chat-container .current-chat-message-partner{margin-right:.1rem}.chat-container .back-to-chat-partners-btn{display:inline-flex}.dark .chat-container{box-shadow:none}.dark .chat-container,.dark .chat-list-left,.dark .chat-window-right,.dark .overlay{background-color:#232323}}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:#232323;margin:0}body a,body h1,body h2,body h3,body h4,body p,body span{font-family:Poppins,sans-serif}body a{color:#232323}body .details{font-family:Space Mono,monospace}body .App,body .main{display:flex}body .main{justify-content:center;min-height:100vh;width:calc(100vw - 4.5rem)}body .font-size-s{font-size:1rem}body .font-size-xs{font-size:.8rem}body .icon-btn{cursor:pointer}*,:after,:before{box-sizing:border-box;list-style:none;margin:0;padding:0;text-decoration:none}.dark .main{background-color:#232323}@media screen and (max-width:960px){.App{flex-direction:column;justify-content:center;width:100vw}.main{min-height:calc(100vh - 4.5rem)!important;width:100vw!important}}#waiting-animation{-webkit-animation:spinning 2.5s linear infinite;animation:spinning 2.5s linear infinite;font-size:1.5rem;height:1.5rem;width:1.5rem}@-webkit-keyframes spinning{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}50%{-webkit-transform:rotate(180deg);transform:rotate(180deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes spinning{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}50%{-webkit-transform:rotate(180deg);transform:rotate(180deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}
/*# sourceMappingURL=main.6b238677.css.map*/