.app-player{position:relative;overflow:hidden;background-size:cover;background-repeat:no-repeat;background-position:50%;background-image:url(../img/petals.c5e315e3.jpg)}.app-player-container{position:absolute;top:0;left:0;right:0;bottom:0}.app-player-container.play{background-color:#000}.app-player-container.play embed{opacity:1}.app-player-container embed{position:relative;opacity:1;width:100%;height:100%;margin:auto;display:block}.app-player-container .ctrl-bottom,.app-player-container .ctrl-center{opacity:0;-webkit-transition:opacity .32s cubic-bezier(.77,0,.175,1);transition:opacity .32s cubic-bezier(.77,0,.175,1);-webkit-transition-delay:.5s;transition-delay:.5s}.app-player-container:hover .ctrl-bottom,.app-player-container:hover .ctrl-center,.app-player-container:not(.ready) .ctrl-bottom,.app-player-container:not(.ready) .ctrl-center{opacity:1;-webkit-transition-delay:0s;transition-delay:0s}.app-player-controller{position:absolute;top:0;left:0;right:0;bottom:0;z-index:1;display:grid;grid-auto-flow:row;grid-template-rows:3ch 1fr 6ch;color:#fff}.app-player-controller .ctrl-top{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end;margin:0 10px}.app-player-controller .ctrl-top .live{-ms-flex-item-align:center;align-self:center;font-size:9pt;color:#ff4d4d}.app-player-controller .ctrl-top .live i{margin-right:4px}.app-player-controller .ctrl-center{position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;height:100%}.app-player-controller .ctrl-center .play{cursor:pointer;padding:0 2rem;margin-top:1rem;font-size:64pt;color:#fff}.app-player-controller .ctrl-bottom{position:relative;padding:0 20px;height:100%;display:grid;grid-column-gap:20px;grid-template-columns:40px auto 40px;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-image:-webkit-gradient(linear,left bottom,left top,from(rgba(0,0,0,.6)),to(transparent));background-image:linear-gradient(0deg,rgba(0,0,0,.6) 0,transparent)}.app-player-controller .ctrl-bottom .time{position:relative;height:4px}.app-player-controller .ctrl-bottom .time .line{position:absolute;left:0;width:100%;height:100%;-webkit-transform:scaleX(0);transform:scaleX(0);-webkit-transform-origin:0 0;transform-origin:0 0;background-color:#fff}.app-player-controller .ctrl-bottom .time .back{position:absolute;top:0;left:0;right:0;bottom:0;content:"";background-color:rgba(227,242,253,.2)}.app-player-controller .ctrl-bottom .screen,.app-player-controller .ctrl-bottom .volume{text-align:center;min-height:30px;font-size:18pt}.app-player-controller .ctrl-bottom .screen i,.app-player-controller .ctrl-bottom .volume i{line-height:1}.app-player-controller .ctrl-bottom .ctrl{cursor:pointer}.app-player-controller .aperture{position:absolute;top:50%;left:0;right:0;text-align:center;-webkit-transform:translateY(-50%);transform:translateY(-50%)}.app-player-controller .aperture>i{font-size:60pt;font-weight:100;color:hsla(0,0%,100%,.98);text-shadow:0 0 8rem #e3f2fd;-webkit-animation:spin 3s linear infinite;animation:spin 3s linear infinite}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}#app-stream{padding:0;margin-left:55px;min-height:100vh;background-color:#111418;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}#app-stream .cc-nav{color:#fff;padding:0 40px;line-height:60px;display:grid;grid-column-gap:40px;grid-auto-flow:column;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}#app-stream .cc-nav h1{font-size:26px;font-weight:800}#app-stream .cc-nav .block{grid-column-gap:20px;grid-auto-flow:column}#app-stream .cc-nav .block,#app-stream .cc-screen{display:grid;-webkit-box-align:center;-ms-flex-align:center;align-items:center}#app-stream .cc-screen{min-height:calc(100vh - 60px);overflow:hidden;background-color:#000}#app-stream .cc-screen .screen-alert{text-align:center}#app-stream .cc-screen .screen-alert h1{line-height:2}#app-stream .cc-screen .screen-alert a{font-weight:800;color:#1854cc}#app-stream .cc-screen .screen-alert a:hover{text-decoration:underline}#app-stream .cc-screen .screen-alert span{font-weight:100;color:#e3f2fd}#app-stream .grid-item>*{height:100%}#app-stream .grid-aspect{position:relative;display:grid;margin:auto;background-color:#000}#app-stream .grid-aspect .area-1{grid-area:area-1}#app-stream .grid-aspect .area-2{grid-area:area-2}#app-stream .grid-aspect .area-3{grid-area:area-3}#app-stream .grid-aspect .area-4{grid-area:area-4}#app-stream .grid-aspect .area-5{grid-area:area-5}#app-stream .grid-aspect .area-6{grid-area:area-6}#app-stream .grid-aspect .area-7{grid-area:area-7}#app-stream .grid-aspect .area-8{grid-area:area-8}#app-stream .grid-aspect .area-9{grid-area:area-9}#app-stream .grid-aspect .area-10{grid-area:area-10}#app-stream .grid-aspect .area-11{grid-area:area-11}#app-stream .grid-aspect .area-12{grid-area:area-12}#app-stream .grid-area-x1{grid-template-columns:repeat(1,100%);grid-template-rows:repeat(1,100%);grid-template-areas:"area-1"}#app-stream .grid-area-x4{grid-template-columns:repeat(2,50%);grid-template-rows:repeat(2,50%);grid-template-areas:"area-1 area-2" "area-3 area-4"}#app-stream .grid-area-x6{grid-template-columns:repeat(3,33.33333333%);grid-template-rows:repeat(3,33.33333333%);grid-template-areas:"area-1 area-1 area-2" "area-1 area-1 area-3" "area-4 area-5 area-6"}#app-stream .grid-area-x7{grid-template-columns:repeat(4,25%);grid-template-rows:repeat(4,25%);grid-template-areas:"area-1 area-1 area-2 area-2" "area-1 area-1 area-2 area-2" "area-3 area-3 area-4 area-5" "area-3 area-3 area-6 area-7"}#app-stream .grid-area-x9{grid-template-columns:repeat(3,33.33333333%);grid-template-rows:repeat(3,33.33333333%);grid-template-areas:"area-1 area-2 area-3" "area-4 area-5 area-6" "area-7 area-8 area-9"}#app-stream .grid-area-x10{grid-template-columns:repeat(4,25%);grid-template-rows:repeat(4,25%);grid-template-areas:"area-1 area-1 area-3 area-4" "area-1 area-1 area-5 area-6" "area-2 area-2 area-7 area-8" "area-2 area-2 area-9 area-10"}#app-stream .grid-area-x12{grid-template-columns:repeat(6,16.66666667%);grid-template-rows:repeat(6,16.66666667%);grid-template-areas:"area-1 area-1 area-1 area-2 area-2 area-2" "area-1 area-1 area-1 area-2 area-2 area-2" "area-1 area-1 area-1 area-2 area-2 area-2" "area-3 area-3 area-3 area-4 area-5 area-6" "area-3 area-3 area-3 area-7 area-8 area-9" "area-3 area-3 area-3 area-10 area-11 area-12"}#comp-layout{position:relative}#comp-layout button{padding:0 15px;height:40px;line-height:normal;color:#fcfcfd;border-radius:4px;border:1px solid #3d4161;background-color:transparent;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}#comp-layout button.focus,#comp-layout button:hover{color:#3d4161;border-color:#3d4161;background-color:#fcfcfd}#comp-layout button [class*=ios-grid]{font-size:24px;margin-right:15px}#comp-layout button [class*=arrow-dropdown]{margin-left:25px}#comp-layout .ul{position:absolute;top:110%;right:0;z-index:2;display:grid;grid-gap:30px;grid-template-columns:repeat(3,110px);border-radius:4px;line-height:normal;padding:30px;color:#111418;background-color:#fcfcfd}#comp-layout .li{cursor:pointer}#comp-layout .li:hover .img-info{opacity:.4}#comp-layout .li .img-info{opacity:.2}#comp-layout .txt-info{font-size:12px;font-weight:800;text-align:center;margin-top:5px}#comp-layout .img-info{margin:0 auto;width:114px;height:64px;background-size:798px;background-image:url(../img/layout.bac6a306.jpg);background-color:#d6dbdf}#comp-layout .img-info.h1{background-position:0 0}#comp-layout .img-info.h4{background-position:-114px top}#comp-layout .img-info.h6{background-position:-228px top}#comp-layout .img-info.h7{background-position:-342px top}#comp-layout .img-info.h9{background-position:-456px top}#comp-layout .img-info.h10{background-position:-570px top}#comp-layout .img-info.h12{background-position:100% 0}