html,body{width:100%;height:100%;overflow:hidden;box-sizing:border-box}.vid{position:relative;overflow:hidden;z-index:-1}.play{margin-left:40rem}.interfaceContainer{width:98%;height:97vh;display:flex;flex-direction:row;justify-content:space-between}.radioContainer{display:flex;flex-direction:column;width:15vw;align-content:flex-end}.radioStationsContainer{width:99%;height:70%;box-shadow:1px 0 #fff;text-align:center;display:flex;justify-content:end;z-index:1}.radioControl{width:40%;height:99%;border:5px white solid;text-align:center;font-size:3rem;color:#fff}.radioList{min-width:75%;display:flex;flex-direction:column;align-items:start;margin-right:3px}.socialsContainer2{color:#fff;width:99%;height:70%;height:5rem;font-family:Montserrat,sans-serif;font-weight:200;text-transform:uppercase;justify-content:end;font-size:15px;letter-spacing:0px;display:flex}.socials{min-width:75%;display:flex;flex-direction:column;z-index:1}.githubLogo{min-width:17px;height:17px;filter:invert(92%) sepia(0%) saturate(0%) hue-rotate(222deg) brightness(97%) contrast(86%);margin-right:7px}.link{margin-right:100px;color:#c7c7c7;text-decoration:none;cursor:pointer}.link2{color:#c7c7c7;text-decoration:none;cursor:pointer;margin-top:3px}.link2:hover,.link:hover{color:#fff}.logo{width:150%;height:10%;text-align:center;font-size:32px;color:#fff;font-family:Montserrat,sans-serif;font-weight:200;text-transform:uppercase;letter-spacing:7px;transform:scaleY(.9);display:flex;flex-direction:row;justify-content:center;align-items:center;z-index:1}.subHeading{width:99%;height:7%;text-align:center;font-size:20px;color:#fff;margin-bottom:2rem;font-family:Montserrat,sans-serif;font-weight:200;text-transform:uppercase;letter-spacing:7px;transform:scaleY(.9);display:flex;flex-direction:row;justify-content:center;align-items:end;text-decoration-line:underline}.station{font-size:16px;font-family:Montserrat,sans-serif;font-weight:400;color:silver;text-transform:uppercase;margin-top:20px;text-shadow:1px 1px rgb(0 0 0 / 70%);cursor:pointer}.station:hover{color:#fff}.triangle{width:12px;height:14px;padding-right:12px;filter:invert(82%) sepia(0%) saturate(0%) hue-rotate(222deg) brightness(97%) contrast(86%);cursor:pointer}.songName{min-width:100%;height:99%;text-align:center;font-size:3rem;color:#fff;display:flex;flex-direction:column;justify-content:end;margin-bottom:5rem}.time{width:100%;height:20%;text-align:center;font-size:3rem;color:#fff}.infoContainer{display:flex;flex-direction:column;min-width:20vw}.otherSoundsContainer{width:100%;height:10%;text-align:center;font-size:3rem;color:#fff;display:flex;flex-direction:row;justify-content:end;z-index:1}.otherSounds{min-height:40px;min-width:40px;border-radius:50%;border:#c7c7c7 1px solid;margin-top:20px;display:flex;align-items:center;justify-content:center;margin-left:6px;margin-right:6px}.imgSizing{min-width:20px;height:20px;margin-left:-1px;filter:invert(92%) sepia(0%) saturate(0%) hue-rotate(222deg) brightness(97%) contrast(86%)}.soundDial{display:none}input[type=range][orient=vertical]{writing-mode:bt-lr;width:50px;height:1px;-webkit-appearance:none;margin-bottom:10px;margin-left:0;background-color:silver;border-radius:3px;border:#c7c7c7 1px solid;transform:rotate(270deg)}.soundDial::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:15px;height:15px;background:#c7c7c7;cursor:pointer;border:1px solid whitesmoke;border-radius:50%}.allign{display:flex;flex-direction:column;height:100px;justify-content:end}.allign:hover .soundDial{display:block}.radioStationTitle{font-size:32px;width:min-content;color:#fff;font-family:Montserrat,sans-serif;font-weight:200;text-transform:uppercase;letter-spacing:7px;position:relative;border-bottom:1px white solid}.socialIcons{filter:invert(100%) sepia(0%) saturate(7485%) hue-rotate(253deg) brightness(112%) contrast(103%);width:18px;height:18px;margin-bottom:20px;position:absolute;top:112%;left:45%}.loading{background-color:#000;width:2rem;height:2rem;position:absolute;top:0;left:0;z-index:-200;height:100vh;width:100vw}.videoContainer{position:absolute;z-index:-1;height:100%;width:100%;top:-220px;left:-230px}.liveStreamPlayer{position:absolute;top:-1000px;left:-1000px}.pauseScreen{background-color:#000;width:100%;height:100%;position:absolute;top:0px;left:0px;opacity:.9;z-index:0;text-align:center;justify-content:center;align-content:center;font-size:1rem;color:#fff;font-family:Montserrat,sans-serif;font-weight:200;letter-spacing:7px}.unpauseScreen{display:none}.container{position:absolute;top:50%;width:100%;display:flex;justify-content:center;align-items:center}.container .ring{position:relative;width:150px;height:150px;margin:-30px;border:4px solid transparent;border-radius:50%;border-top:4px solid #24ecff}.container .ring:before{content:"";position:absolute;top:12px;right:12px;border-radius:50%;width:15px;height:15px;background:#24ecff;box-shadow:0 0 0 5px #24ecff33,0 0 0 10px #24ecff22,0 0 0 20px #24ecff11,0 0 40px #24ecff,0 0 50px #24ecff}.container .ring:nth-child(1){animation:circle2 2s linear infinite}.container .ring:nth-child(2){animation:circle1 2s linear infinite}.container .ring:nth-child(3){position:absolute;top:-66.66px;animation:circle 2s linear infinite}.container p{overflow:hidden;position:absolute;color:#fff;font-size:32px;font-family:consolas;bottom:-120px;letter-spacing:4px}@keyframes circle{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes circle1{0%{transform:rotate(120deg)}to{transform:rotate(480deg)}}@keyframes circle2{0%{transform:rotate(240deg)}to{transform:rotate(600deg)}}svg{margin-top:20rem;width:170px;height:170px;opacity:1}#smoke-1{stroke-dasharray:0,10;animation:smoke 6s ease infinite}#smoke-2{stroke-dasharray:0,10;animation:smoke 6s .5s ease infinite}@keyframes smoke{0%{stroke-dasharray:0,10}50%{stroke-dasharray:10,0}to{stroke-dasharray:10,0;opacity:0}}#line-1{opacity:0;animation:writing .5s linear forwards}#line-2{opacity:0;animation:writing .5s 1s linear forwards}#line-3{opacity:0;animation:writing .5s 1.5s linear forwards}#line-4{opacity:0;animation:writing .5s 2s linear forwards}@keyframes writing{0%{width:0px;opacity:1}to{width:14px;opacity:1}}@media only screen and (max-width: 1189px){.station{font-size:12px;margin-right:10px}.logo{margin-left:40px}.link{font-size:12px}}.audioControlContainer{height:100%;width:20vw;display:flex;flex-direction:column;justify-content:end;margin-left:11rem;z-index:1}.audioControl{width:99%;height:10vh;text-align:center;font-size:3rem;color:#fff;display:flex;flex-direction:row;justify-content:center;box-sizing:border-box;margin-top:auto;z-index:1}.audioImgSize{min-width:20px;height:20px;margin-left:3px;filter:invert(92%) sepia(0%) saturate(0%) hue-rotate(222deg) brightness(97%) contrast(86%)}.audioImgSize2{min-width:20px;height:20px;margin-left:-4px;filter:invert(92%) sepia(0%) saturate(0%) hue-rotate(222deg) brightness(97%) contrast(86%)}.audioOnImg,.audioOffImg{min-width:20px;height:20px;margin-left:-1px;filter:invert(92%) sepia(0%) saturate(0%) hue-rotate(222deg) brightness(97%) contrast(86%)}.audioOffImg{filter:invert(93%) sepia(19%) saturate(2348%) hue-rotate(296deg) brightness(102%) contrast(103%)}.goFowardBtn{border:#c7c7c7 1px solid;height:40px;min-width:40px;border-radius:50%;margin-top:3.3rem;display:flex;align-items:center;justify-content:center;margin-left:6px;margin-right:6px}.PlayPause,.PlayPause2{border:#c7c7c7 1px solid;height:80px;min-width:80px;border-radius:50%;margin-top:1rem;display:flex;align-items:center;justify-content:center;margin-left:120px;margin-right:6px}.PlayPause:hover,.PlayPause2:hover{border:rgb(255,255,255) 1px solid}.volumeOff,.volumeOn{border:#c7c7c7 1px solid;height:40px;min-width:40px;border-radius:50%;margin-top:3.3rem;display:flex;align-items:center;justify-content:center;margin-left:6px;margin-right:6px}.volumeDial{border:#c7c7c7 1px solid;height:1px;-webkit-appearance:none;width:100px;margin-top:4.7rem;display:flex;align-items:center;justify-content:center;margin-left:3px;border-radius:30px;background-color:silver}.volumeDial:hover{background-color:#fff}.volumeDial::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:15px;height:15px;background:#c7c7c7;cursor:pointer;border-radius:50%}.volumeDial::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:15px;height:15px;background:#c7c7c7;cursor:pointer;border:1px solid whitesmoke}.volumeDial::-webkit-slider-thumb:hover{background-color:#fff}.playBtn{width:30px;height:30px;margin-left:2px;filter:invert(82%) sepia(0%) saturate(0%) hue-rotate(222deg) brightness(97%) contrast(86%)}.playBtn2{width:30px;height:30px;margin-left:0;filter:invert(82%) sepia(0%) saturate(0%) hue-rotate(222deg) brightness(97%) contrast(86%)}html,body{margin:0;padding:0;overflow:hidden}.videoContainer2{height:100%;width:100%;overflow:hidden}.heroContainer{height:150%;width:150%;position:absolute;top:-25%;left:-40%;overflow:hidden;z-index:-100}.tracking-in-expand-fwd{animation:tracking-in-expand-fwd .8s cubic-bezier(.215,.61,.355,1)2s both;z-index:2;position:relative;left:65%;bottom:-200px;width:100%;color:#fff;font-family:Montserrat,sans-serif;font-weight:200;text-transform:uppercase;letter-spacing:7px;font-size:37px;transform:scaleY(.9)}@keyframes tracking-in-expand-fwd{0%{letter-spacing:-.5em;transform:translateZ(-700px);opacity:0}40%{opacity:.6}to{transform:translateZ(0);opacity:1}}.titleContainer{position:absolute;right:30%;height:100%;display:flex;flex-direction:column}.heroLogo{width:34px;height:34px;z-index:10;position:absolute;left:167%;top:228px;filter:invert(93%) sepia(81%) saturate(0%) hue-rotate(187deg) brightness(109%) contrast(101%)}.heroLogo{-webkit-animation:flip-in-ver-right .5s cubic-bezier(.25,.46,.45,.94)3s both;animation:flip-in-ver-right .5s cubic-bezier(.25,.46,.45,.94)3s both}@-webkit-keyframes flip-in-ver-right{0%{-webkit-transform:rotateY(-80deg);transform:rotateY(-80deg);opacity:0}to{-webkit-transform:rotateY(0);transform:rotateY(0);opacity:1}}@keyframes flip-in-ver-right{0%{-webkit-transform:rotateY(-80deg);transform:rotateY(-80deg);opacity:0}to{-webkit-transform:rotateY(0);transform:rotateY(0);opacity:1}}.subTitle{z-index:2;position:absolute;top:285px;left:270px;width:100%;color:#fff;font-family:Montserrat,sans-serif;font-weight:200;text-transform:uppercase;letter-spacing:1px;font-size:15px;transform:scaleY(.9);margin:0}.subTitle{-webkit-animation:text-focus-in 1s cubic-bezier(.55,.085,.68,.53) 3.2s both;animation:text-focus-in 1s cubic-bezier(.55,.085,.68,.53) 3.2s both}@-webkit-keyframes text-focus-in{0%{-webkit-filter:blur(12px);filter:blur(12px);opacity:0}to{-webkit-filter:blur(0px);filter:blur(0px);opacity:1}}@keyframes text-focus-in{0%{-webkit-filter:blur(12px);filter:blur(12px);opacity:0}to{-webkit-filter:blur(0px);filter:blur(0px);opacity:1}}.note-position-1{top:250px;left:530px;color:#fff}.note-position-2{top:220px;left:500px;color:#fff}.note-position-4{top:320px;left:500px;color:#fff}.note-amination{position:absolute;font-size:35px;animation-delay:4s;animation-name:notes;animation-duration:2s;animation-iteration-count:infinite;animation-timing-function:linear;opacity:0}@keyframes notes{0%{font-size:15px;opacity:0}50%{opacity:1}to{font-size:40px;margin-top:-150px;opacity:0}}html,body{height:100%}.wrap{height:100%;display:flex;align-items:center;justify-content:center;z-index:20}.button{min-width:300px;min-height:50px;font-size:22px;letter-spacing:1.3px;font-weight:700;color:#fff;background:none;border:1px solid white;border-radius:1000px;box-shadow:12px 12px 24px #e0e0e0a3;transition:all .3s ease-in-out 0s;cursor:pointer;outline:none;position:relative;padding:10px;left:75%;top:4%;font-family:Montserrat,sans-serif;font-weight:200;text-transform:uppercase;letter-spacing:1px;font-size:15px}button:before{content:"";border-radius:1000px;min-width:312px;min-height:72px;border:6px solid #ffffff;box-shadow:0 0 60px #ffffffa3;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);opacity:0;transition:all .3s ease-in-out 0s;z-index:-2}.button:hover,.button:focus{color:#fff;transform:translateY(-6px)}button:hover:before,button:focus:before{opacity:1}button:after{content:"";width:30px;height:30px;border-radius:100%;border:6px solid #dfdfdf;position:absolute;z-index:2;top:50%;left:50%;transform:translate(-50%,-50%);animation:ring 1.5s infinite}button:hover:after,button:focus:after{cursor:none;pointer-events:none}@keyframes ring{0%{width:30px;height:30px;opacity:1}to{width:300px;height:300px;opacity:0}}.button{-webkit-animation:fade-in-fwd .6s cubic-bezier(.39,.575,.565,1)4.7s both;animation:fade-in-fwd .6s cubic-bezier(.39,.575,.565,1)4.7s both}@-webkit-keyframes fade-in-fwd{0%{-webkit-transform:translateZ(-80px);transform:translateZ(-80px);opacity:0}to{-webkit-transform:translateZ(0);transform:translateZ(0);opacity:1}}@keyframes fade-in-fwd{0%{-webkit-transform:translateZ(-80px);transform:translateZ(-80px);opacity:0}to{-webkit-transform:translateZ(0);transform:translateZ(0);opacity:1}}.bubble1,.bubble2,.bubble3{width:25px;height:25px;margin-top:10%;background-color:none;border-radius:50%;border:2px solid white;opacity:0}.bubbleContainer{width:10rem;height:20rem;display:flex;flex-direction:column;position:absolute;top:310px;left:350px;z-index:3}.bubble1{animation:myAnim 1s ease 4s 1 normal forwards}.bubble2{animation:myAnim 1s ease 4.2s 1 normal forwards}.bubble3{animation:myAnim 1s ease 4.4s 1 normal forwards}@keyframes myAnim{0%{opacity:1;transform:scale(0)}to{transform:scale(1)}}