@import"https://fonts.googleapis.com/css2?family=Archivo+Black&family=Poppins:wght@100;200;300;400;500;600;700;800;900&display=swap";@import"https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.1/font/bootstrap-icons.css";:root{--color-black: #0f0f0f;--color-grey: #1e1e23;--color-lightgrey: #c4c4c4;--color-white: white;--color-background: var(--color-black);--color-green: #98c379;--color-yellow: #e5c07b;--font-title: "Archivo Black", sans-serif;--font-content: "Poppins", sans-serif;--radius: "10px"}*{margin:0;padding:0;color:var(--color-white)}* ul{list-style:none}* a{text-decoration:none;color:#fff}* button:hover{cursor:pointer}body{background-color:var(--color-background);font-family:var(--font-content);color:var(--white)}body #app{width:100%;max-width:900px;margin:auto}@media (max-width: 600px){body #app{width:95%}}@media (max-width: 600px){.dnone{display:none!important}}header{margin:30px 7px 25px;display:flex;justify-content:space-between;align-items:center;padding:0 15px 10px;border-bottom:2px solid #333}header h1{display:flex;align-items:center}header h1 i{margin-right:15px}header a.btn{font-size:14px;color:var(--color-black);background-color:var(--color-white);border-radius:50px;padding:6px 16px;font-weight:700;margin-right:8px;display:flex;align-items:center}header a.btn i{margin-left:10px;color:#000;font-size:20px}section.profile{display:flex;align-items:center;justify-content:space-between}section.profile .user{display:flex}section.profile .user img#profilePicture{width:80px;object-fit:cover;height:50px;border-radius:10px;margin:0 20px}section.profile .user .infos{display:flex;align-items:center}section.profile .user .infos h3#displayName{border-bottom:3px solid white;margin-right:15px}section.profile .user .infos p#email{font-size:17px;color:#999;display:none}section.profile .links{display:flex}section.profile .links a.btn:nth-child(2){margin-right:20px}section.profile .links a.btn{font-size:14px;color:var(--color-black);background-color:var(--color-white);border-radius:50px;padding:6px 16px;font-weight:700;margin-right:8px;display:flex;align-items:center}section.profile .links a.btn i{margin-left:10px;color:#000;font-size:20px}section.nav{margin-top:50px;margin-bottom:25px}section.nav p{color:#d3d3d3}section.nav div{display:flex;align-items:center;margin:10px 0}section.nav div .btn{font-size:14px;color:var(--color-white);background-color:var(--color-grey);border:none;border-radius:50px;padding:6px 16px;font-weight:700;margin:5px;display:flex;align-items:center}section.nav div .active{color:var(--color-black);background-color:var(--color-white)}section.listing{border-top:3px solid #333;padding-top:10px;margin-top:20px}section.listing #longArtists,section.listing #mediumArtists,section.listing #shortArtists{margin:20px 0;display:flex}section.listing #longArtists a,section.listing #mediumArtists a,section.listing #shortArtists a{width:100%;display:flex;align-items:center;border:1px solid #333;border-top-right-radius:10px;border-bottom-right-radius:10px;margin:0 5px;padding-right:10px}section.listing #longArtists a:hover,section.listing #mediumArtists a:hover,section.listing #shortArtists a:hover{background-color:#181818}section.listing #longArtists a img,section.listing #mediumArtists a img,section.listing #shortArtists a img{height:50px;margin-right:10px}section.listing #longArtists a div,section.listing #mediumArtists a div,section.listing #shortArtists a div{display:flex;align-items:center}section.listing #longArtists a div img,section.listing #mediumArtists a div img,section.listing #shortArtists a div img{height:20px}section.listing #longArtists a div span.artist-number,section.listing #mediumArtists a div span.artist-number,section.listing #shortArtists a div span.artist-number{margin-right:7px;font-size:17px;font-weight:700}section.listing #longSongs div.element,section.listing #mediumSongs div.element,section.listing #shortSongs div.element{align-items:center;display:grid;border-bottom:1px solid #333;padding:10px 0;grid-template-columns:40px 50px 250px 200px auto 35px;transition:.2s}@media (max-width: 600px){section.listing #longSongs div.element,section.listing #mediumSongs div.element,section.listing #shortSongs div.element{grid-template-columns:40px 50px auto 130px}}section.listing #longSongs div.element .track-number,section.listing #mediumSongs div.element .track-number,section.listing #shortSongs div.element .track-number{margin-left:8px}section.listing #longSongs div.element img,section.listing #mediumSongs div.element img,section.listing #shortSongs div.element img{height:40px}section.listing #longSongs div.element a.artist-name,section.listing #mediumSongs div.element a.artist-name,section.listing #shortSongs div.element a.artist-name{margin-left:10px}section.listing #longSongs div.element img.spotify-logo,section.listing #mediumSongs div.element img.spotify-logo,section.listing #shortSongs div.element img.spotify-logo{height:25px}section.listing #longSongs div.element:hover,section.listing #mediumSongs div.element:hover,section.listing #shortSongs div.element:hover{background-color:#181818}section.home h1{margin-top:50px;text-align:center;font-size:35px}section.home h1 span{border-bottom:3px solid white}section.home h3{font-weight:200;text-align:center;width:70%;font-size:18px;margin:30px auto auto;color:var(--color-lightgrey)}section.home .login-button{margin:30px 0;text-align:center}section.home .login-button a.btn-home{display:inline-flex;align-items:center;font-size:22px;color:var(--color-black);background-color:var(--color-white);border:none;border-radius:50px;padding:6px 16px;font-weight:700;margin:5px}section.home .login-button a.btn-home i{font-size:25px;color:var(--color-black);margin-right:10px}small{display:block;text-align:center}@media (max-width: 600px){small{width:80%;margin:45px auto 15px}}header[data-v-a64cdae0]{line-height:1.5;max-height:100vh}.logo[data-v-a64cdae0]{display:block;margin:0 auto 2rem}nav[data-v-a64cdae0]{width:100%;font-size:12px;text-align:center;margin-top:2rem}nav a.router-link-exact-active[data-v-a64cdae0]{color:var(--color-text)}nav a.router-link-exact-active[data-v-a64cdae0]:hover{background-color:transparent}nav a[data-v-a64cdae0]{display:inline-block;padding:0 1rem;border-left:1px solid var(--color-border)}nav a[data-v-a64cdae0]:first-of-type{border:0}@media (min-width: 1024px){header[data-v-a64cdae0]{display:flex;place-items:center;padding-right:calc(var(--section-gap) / 2)}.logo[data-v-a64cdae0]{margin:0 2rem 0 0}header .wrapper[data-v-a64cdae0]{display:flex;place-items:flex-start;flex-wrap:wrap}nav[data-v-a64cdae0]{text-align:left;margin-left:-1rem;font-size:1rem;padding:1rem 0;margin-top:1rem}}