::backdrop *,:after,:before{box-sizing:border-box}*{font:inherit;margin:0;padding:0}li,ol[role=list],ul[role=list]{list-style-type:none}html:focus-within{scroll-behavior:smooth}body{line-height:1.5;text-rendering:optimizeSpeed}img,picture,svg{display:block;max-width:100%}@media(prefers-reduced-motion:reduce){html:focus-within{scroll-behavior:auto}*,:after,:before{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}a{text-decoration:none}body,header,main,section[title=player]{overflow-x:hidden;width:100vw}body{background:#000;color:#fff;display:flex;flex-direction:column;font-family:Ubuntu,sans-serif;height:100vh}section[title=player]{background:linear-gradient(0deg,#000 50%,transparent);bottom:0;height:20vh;left:0;position:fixed}main{align-items:center;display:flex;flex:1;justify-content:center}canvas{height:100%;width:100%}header{align-items:center;background:linear-gradient(180deg,#000,transparent);display:flex;flex-direction:row;height:10vh;justify-content:space-between;left:0;position:fixed;top:0}.logo{display:flex;padding:0 0 0 1.5vw;width:12.15vw}.logo a:focus,.logo a:hover{opacity:.75}.socials{align-items:center;display:flex;flex-direction:row;justify-content:space-evenly;width:10%}.socials a{color:#fff;font-size:2rem;opacity:.75}.socials a:focus,.socials a:hover{opacity:1}@media screen and (max-width:1024px){header{background:linear-gradient(180deg,#000 50%,transparent)}.logo{width:17.5vw}.socials{width:12.5%}}@media screen and (max-width:768px){.logo{width:25vw}.socials{width:15%}}@media screen and (max-width:480px){.logo{width:45vw}.socials{padding:0 3.5vw 0 0;width:25%}}@media screen and (max-width:320px){.logo{width:45vw}.socials{padding:0 3.5vw 0 0;width:30%}.socials a{font-size:1.75rem}}button,input,select{background-color:transparent;border:2px solid gray;color:#fff;cursor:pointer}button,select{border-radius:50%;height:45px;margin:5px;width:45px}button:focus,button:hover,input:focus,input:hover,select:focus,select:hover{border:2.5px solid #fff}#play_pause{height:60px;width:60px}#style_switch,input{border-radius:5%}#style_switch{margin:10px;padding:0 15px;width:-moz-fit-content;width:fit-content}.audio_player{height:100%;justify-content:space-evenly}.audio_player,.info_container,.song_name{align-items:center;display:flex;flex-direction:column;width:100%}.info_container,.song_name{justify-content:center}.timer{width:25%}.controls_container,.timer{align-items:center;display:flex;flex-direction:row;justify-content:space-between}.controls_container{width:50%}.playback_controls button{margin:2px}.settings_controls{bottom:1.5%;flex-direction:row;justify-content:center;left:5%}.playlist_controls,.settings_controls{align-items:center;display:none;position:fixed}.playlist_controls{background-color:#000;border:1px solid gray;bottom:20vh;flex-direction:column;height:70vh;justify-content:flex-start;right:0;width:50%}.playlist_controls label,.playlist_controls li{align-items:center;border-bottom:1px solid gray;display:flex;flex-direction:row;height:60px;justify-content:center;width:100%}.playlist_controls #file_upload_label{background-color:#000}.playlist_controls #file_upload_label:focus,.playlist_controls #file_upload_label:hover{border:2px solid #fff}.playlist_controls #file_upload{position:absolute;visibility:hidden;width:100%;z-index:-1}.playlist_controls .songs_list{overflow-y:auto;width:100%}.playlist_controls .songs_list_item{justify-content:space-between}.playlist_controls .songs_list_item p{margin-left:25px;margin-right:25px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@media screen and (max-width:1100px){*{border-color:#fff}.controls_container,.timer{width:100%}.controls_container #open_settings{margin-left:2.5vw}.controls_container #open_playlist{margin-right:2.5vw}.settings_controls{background-color:#000;border:1px solid #fff;bottom:20vh;flex-direction:column;height:20vh;justify-content:flex-start;left:0;padding:25px 0;width:100%}.playlist_controls{width:100%}.playlist_controls .songs_list_item p{margin-left:10px;margin-right:10px}}@media screen and (max-width:420px){button{height:36px;margin:2px;width:36px}#play_pause{height:48px;width:48px}}@media screen and (max-width:300px){button{height:25px;margin:2px;width:25px}button,button:focus,button:hover{border:none}#play_pause{height:34px;width:34px}}#shortcuts_panel{align-items:center;background:rgba(0,0,0,.5);display:none;flex-direction:column;height:70vh;justify-content:flex-start;left:0;overflow-y:auto;position:fixed;top:10vh;width:100vw}table{background:#000;width:50%}table caption{visibility:hidden}table thead{font-weight:700}table th{padding:0 0 10px}table tbody{text-align:center}table td{height:45px;width:50%}kbd{border:.5px solid #fff;font-family:monospace;font-size:1rem;font-weight:700;margin:0 5px;padding:10px 15px}@media screen and (max-width:640px){#shortcuts_tip{display:none}table{width:100%}}