::selection{background-color:rgb(44, 91, 202);color:#fff;}
*,::after,::before{box-sizing:border-box;}
a{text-decoration:none;color:inherit;}
body{height: 100vh;background-image:url('src/media/c9433c679934ab3edc0a288d62981a34.gif');background-repeat:no-repeat;background-size:cover;font-family:"LiberationMonoRegular";background-position: center;background-color:#000;color:#fff;}
body,html{margin:0;padding:0;}
.b1{transition:color 0.2s;color:rgba(255, 255, 255, 0.1);cursor:pointer;}
.b1:hover{color:rgba(255, 255, 255, 0.8);}
.b1,#root > #sidebar .playback-rates > div,#root > #sidebar #audio-player .controls,.station-container > .selections > div.sub-container > .header,.station-container > .selections > div.sub-container > .item,.video-navigation > div{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}
#root{overflow:hidden;position:fixed;height:100%;width:100%;}
#root #video-background{position:absolute;top:0;left:0;min-width:100%;min-height:100%;width:auto;height:auto;overflow:hidden;z-index:-100;display:none;}
@media (min-width: 1000px){
#root #video-foreground iframe,#root #video-foreground{pointer-events:none;}
}
#root #video-foreground iframe,#root #video-foreground{position:absolute;top:0;left:0;width:100%;height:100%;}
#root #video-foreground{height:300%;top:-100%;}
#root > #sidebar > div.sidebar-fill-vertical{height:100%;display:flex;flex-direction:column;}
#root > #sidebar #visualization{position:fixed;bottom:0;right:0;z-index:-1000;pointer-events:none;}
#root > #sidebar #toggle-settings{position:absolute;top:10px;left:15px;}
#root > #toggle-view{position:fixed;top:10px;right:15px;z-index:10;display:none;}
#root > #sidebar{text-align:center;position:fixed;max-width:375px;min-width:250px;right:0;top:0;bottom:0;background-color:rgb(24 24 24 / 80%);border-left:1px solid rgba(0, 0, 0, 0.15);display:none;padding:12px 12px 0px 12px;}
#root > #sidebar .playback-rates{table-layout:fixed;display:table;border-spacing:6px;width:100%;}
#root > #sidebar .playback-rates > div{transition:border-color 0.1s;cursor:pointer;display:table-cell;border-radius:10px;padding:3px 4px 3px 4px;border:2px solid;border-color:#292929;background-color:rgba(255, 255, 255, 0.045);font-size:13px;}
#root > #sidebar .playback-rates > div:hover{border:2px solid;border-color:#424242;}
#root > #sidebar .playback-rates > div[selected]{background-color:rgb(0, 0, 0, 0.33);}
#root > #sidebar #audio-player .header{margin-bottom:8px;overflow:hidden;}
#root > #sidebar #audio-player .header > span#currently-playing-radio{line-height:22px;color:white;font-size:14px;white-space:nowrap;}
#root > #sidebar #audio-player audio{display:none;}
#root > #sidebar #audio-player .controls{margin-bottom:6px;table-layout:fixed;display:table;border-spacing:6px;width:100%;}
#root > #sidebar #audio-player .controls > .button{transition:color 0.15s;color:#bfbfbf29;background-color:rgba(0, 0, 0, 0.4);width:36px;height:28px;padding:4px 0px 0px 0px;background-size:24px 24px;border-radius:2px;cursor:pointer;display:table-cell;}
#root > #sidebar #audio-player .controls > .button:hover{color:#bdbdbd;}
#root > #sidebar #audio-player .controls > .audio-controls-toggle.button > svg.pause{display:none;}
#root > #sidebar .sidebarFooter{border-top:2px solid rgba(255, 255, 255, 0.05);padding-top:14px;margin:10px 0px 10px 0px;border-spacing:2px;width:100%;}
#root > #sidebar .sidebarFooter > div{transition:color 0.15s;display:inline-block;color:#b3b3b3;}
#root > #sidebar .sidebarFooter > div:hover{color:#fff;}
#root > #sidebar .sidebarFooter > div:not(:first-child):not(:last-child){margin:0px 5px;}
#root > #sidebar .sidebarFooter > div > a{display:flex;font-size:12px;}
#root > #sidebar .sidebarFooter > div > a > span{top:2px;position:relative;}
#root > #sidebar .sidebarFooter > div > a > svg{margin-right:8px;}
#root > #overlayContainer{transition:opacity .1s;position:fixed;inset:0 0 0 0;background-color:rgba(0, 0, 0, .95);}
#root > #overlayContainer::after{content:'';position:absolute;inset:0 0 0 0;border:10px solid black;filter:blur(20px);pointer-events:none;z-index:-1;}
#root > #overlayContainer:not([visible]){z-index:0;opacity:0;}
#root > #sidebar .sidebarHeader{border-bottom:2px solid rgba(255, 255, 255, 0.05);padding:5px 0px 20px 10px;margin:2px 0px 10px 0px;font-size:1.75em;font-family:'joystix';color:#fff;letter-spacing:14px;text-shadow:0 0 4px #000;}
.station-container{height:100%;font-size:14px;margin:14px 0px 6px 0px;background-color:rgba(0, 0, 0, 0.35);overflow:hidden;border-radius:6px;border:2px solid #242424;}
.station-container::before{background-color:rgb(36 36 36 / 9%);padding:4px 0px 4px 8px;display:block;border-bottom:2px solid #2f2f2f;text-align:left;}
.station-container > .selections{max-height:calc(100% - 26px);overflow-y:auto;scrollbar-color:#282828 #131315;}
.station-container > .selections > div.sub-container > .header,.station-container > .selections > div.sub-container > .item{text-align:left;font-size:13px;}
.station-container > .selections > div.sub-container > .header{padding:6px 0px 5px 10px;text-transform:capitalize;background-color:rgba(255, 255, 255, 0.045);border-bottom:2px solid rgba(255, 255, 255, 0.025);text-align:center;}
.station-container > .selections > div.sub-container > .item{transition:background-color 0.1s;background-color:rgb(0, 0, 0, 0.15);padding:5px 0px 5px 10px;cursor:pointer;position:relative;}
.station-container > .selections > div.sub-container > .item:not([selected]):hover{background-color:rgb(255, 255, 255, 0.085);}
.station-container > .selections > div.sub-container > .item:not(:first-child){border-bottom:2px solid rgba(255, 255, 255, 0.025);}
.selections > div.sub-container > .item[selected]{background-color:rgb(46 54 96 / 45%);}
.selections > div.sub-container > .item[selected]:hover{background-color:rgb(46 54 96 / 65%);}
.selections > div.sub-container > .item[selected]::after{content:'\21A9';position:absolute;right:8px;margin-top:1px;}
.sliderContainer > input[type="range"]{appearance:none;width:100%;height:8px;border-radius:5px;background:#0d0d0d;outline:none;opacity:0.7;cursor:pointer;-webkit-transition:.2s;transition:opacity .2s;z-index:1;}
::-webkit-scrollbar{width:10px;}
::-webkit-scrollbar-track{background:#151515;}
::-webkit-scrollbar-thumb{background:#555;}
::-webkit-scrollbar-thumb:hover{background:#555;}
@media only screen and (max-width: 640px){
    #root #video-foreground{height:100vh;width:calc(100vh * (1.8));left:-100%;top:0px;bottom:0px;pointer-events:none;}
    .b1{color:rgba(255, 255, 255, 0.75);}
    .b1:hover{color:rgba(255, 255, 255, 1.0);}
    #root > #overlayContainer{background-color:rgba(0, 0, 0, .975);}
}

/*scrolling txt*/

#currently-playing-radio {
    white-space: nowrap;
    -moz-transform: translateX(100%);
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
    
    -moz-animation: my-animation 15s linear infinite;
    -webkit-animation: my-animation 15s linear infinite;
    animation: my-animation 15s linear infinite;
  }
  @-moz-keyframes my-animation {
    from { -moz-transform: translateX(100%); }
    to { -moz-transform: translateX(-100%); }
  }
  @-webkit-keyframes my-animation {
    from { -webkit-transform: translateX(100%); }
    to { -webkit-transform: translateX(-100%); }
  }
  @keyframes my-animation {
    from {
      -moz-transform: translateX(100%);
      -webkit-transform: translateX(100%);
      transform: translateX(100%);
    }
    to {
      -moz-transform: translateX(-100%);
      -webkit-transform: translateX(-100%);
      transform: translateX(-160%);
    }
}
.noselect {user-select: none;}
@font-face {font-family:'LiberationMonoRegular';src:url(src/font/LiberationMonoRegular.woff2) format('woff2');}
@font-face {font-family:'joystix';src:url(src/font/joystix-monospace.ttf) format('truetype');}