@font-face{font-family:MetricHPE-Black;src:url(/fonts/MetricHPE-Desktop-Black.otf) format("opentype")}@font-face{font-family:MetricHPE-Bold;src:url(/fonts/MetricHPE-Desktop-Bold.otf) format("opentype")}@font-face{font-family:MetricHPE-Light;src:url(/fonts/MetricHPE-Desktop-Light.otf) format("opentype")}@font-face{font-family:MetricHPE-Medium;src:url(/fonts/MetricHPE-Desktop-Medium.otf) format("opentype")}@font-face{font-family:MetricHPE-Regular;src:url(/fonts/MetricHPE-Desktop-Regular.otf) format("opentype")}@font-face{font-family:MetricHPE-Semibold;src:url(/fonts/MetricHPE-Desktop-Semibold.otf) format("opentype")}@font-face{font-family:MetricHPE-Thin;src:url(/fonts/MetricHPE-Desktop-Thin.otf) format("opentype")}:root{--bg: #f6f6f6;--nav: #fff;--text: #000;--green: #01a982}.slider{position:absolute;left:0;bottom:0;z-index:2;width:100vw;height:calc(100vh - 66px);background-color:var(--bg);overflow:scroll}.slider::-webkit-scrollbar{display:none}.slider-enter-active,.slider-leave-active{transition:all .7s ease-out}.slider-enter-from,.slider-leave-to{transform:translateY(100%)}.left-slider{position:absolute;right:0;bottom:0;z-index:2;width:95vw;height:calc(100vh - 66px);background-color:var(--bg);overflow:scroll}.left-slider::-webkit-scrollbar{display:none}.left-slider-enter-active,.left-slider-leave-active{transition:all .7s ease-out}.left-slider-enter-from,.left-slider-leave-to{transform:translate(-120%)}.top-slider{position:absolute;left:0;top:0;z-index:2;width:100vw;height:100vh;background-color:var(--bg);overflow:scroll;background-size:cover}.top-slider::-webkit-scrollbar{display:none}.top-slider-enter-active,.top-slider-leave-active{transition:all .7s ease-out}.top-slider-enter-from,.top-slider-leave-to{transform:translateY(-100%)}.cg-8{margin-right:8px}.cg-24{margin-right:24px}.mb-8{margin-bottom:8px}.mb-16{margin-bottom:16px}.mb-32{margin-bottom:32px}.ml-auto{margin-left:auto}.mt-8{margin-top:8px}.mt-16{margin-top:16px}.rg-8{margin-bottom:8px}.rg-16{margin-bottom:16px}.rg-24{margin-bottom:24px}#logo{max-width:72px}svg{width:100px;height:100px;display:inline-block}body{margin:0;font-family:MetricHPE-Regular;font-size:20px;height:100vh;overflow:hidden}strong{font-family:MetricHPE-Bold}.box{border:3px solid var(--green);width:64px;height:16px;margin:0 0 8px;display:inline-block}.flex-center{display:flex;align-items:center}.flex-wrap{display:flex;flex-wrap:wrap}.text-center{text-align:center}h1{font-family:MetricHPE-Regular}h2{font-family:MetricHPE-Medium}h1,h2{margin:0;display:inline}div nav{display:flex;width:inherit;height:66px;font-size:24px;position:relative;z-index:3}div:not(#playlist,#settings,#locations)>nav{background-color:var(--nav);color:var(--text)}#playlist>nav,#settings>nav,#locations>nav{margin-top:3vh;width:89vw}nav>div{height:inherit;display:flex;align-items:center;flex:1 0 43vw;justify-content:right}nav>div:first-child{flex:1 0 43vw;justify-content:left}nav img{margin:0 6px 9px 12px}nav.main,#content,.slider{padding-left:5vw;padding-right:5vw}.left-slider,.top-slider{padding-top:5vw;padding-left:5vw}#content{width:100vw;height:calc(100vh - 48px);padding-bottom:24vh;overflow:scroll}.card{border-radius:16px;border:1px solid #aaa;background:var(--nav)}div:not(#locations) .card img{border-radius:16px;width:100%}div#locations .card{font-size:24px;color:var(--text)}div#locations .card img{border-radius:0;width:24px;margin:-6px 6px 0 0}#active>div,.media>div,#background>div,#locations .card{margin-right:2.5vw;margin-bottom:2.5vw}#active,.media{margin-bottom:24px;color:#fff}#active>.card,.media .card,#background .card,#locations .card{width:28.3vw}#active>.card span>span{font-family:MetricHPE-Regular}#active>.card>div:not(.img),#locations .card>div,.media .card>div:not(.img),.media .card>div.img>div:not(.overlay),#active>.card>div.img>div:not(.overlay){width:90%;margin:24px}.overlay .nav{position:absolute;width:90%;bottom:40px;left:24px}#active>.card>div.img,.media .card>div.img,#background .card>div.img,#locations .card{border-radius:16px;overflow:hidden;background-size:cover}div.img,div.overlay{aspect-ratio:16 / 9;border-radius:16px}div.img>div.overlay{background-color:rgba(0,0,0,.7);width:inherit;height:inherit;border-radius:16px;padding:24px;position:relative}div.img>div.overlay.transparent{background-color:transparent}div.img{background:#555;color:#fff;font:24px MetricHPE-Regular}.media h2{font-size:24px}.card .title{font-family:MetricHPE-Medium;text-shadow:2px 2px #000}.card .title span{font-family:MetricHPE-Thin;font-size:24px}.card .return{float:right;font-family:MetricHPE-Semibold;font-size:20px;margin-right:12px;padding-top:8px;margin-left:auto}button{font-size:16px;border-radius:16px;padding:5px 14px;color:#000;background:#17a079;border:1px solid #aaa}button.outline{background:#fff;border:3px solid #17a079}button.green{color:#fff;background:#17a079;border:1px solid #aaa}button.gray{background:#ccc;border:1px solid #999}.card button{font-family:MetricHPE-Semibold;font-size:22px;padding:5px 14px 3px}.overflow-ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}h1>div{font-size:20px;font-weight:400;margin-bottom:20px}.spacer-v-l{display:block;width:100%;height:50px}.bg-cover{background-size:cover}.reset{margin:0 0 10px;font-family:MetricHPE-Regular;padding:7px 14px 3px}@media screen and (max-width: 1024px){#active,.media{margin-right:2vw;margin-bottom:2vw}#active>.card,.media .card,#background .card,#locations .card{width:44vw}.card button,.card .return{font-size:18px}}
