UNPKG

@openveo/player

Version:

OpenVeo player to play a video with associated images and chapters

2 lines 96.9 kB
/* openveo-player v8.0.0 */
@font-face{font-family:"Roboto";src:url("./fonts/roboto/Roboto-Regular.woff2") format("woff2"),url("./fonts/roboto/Roboto-Regular.woff") format("woff");font-weight:400;font-style:normal}@font-face{font-family:"Roboto-Regular";src:url("./fonts/roboto/Roboto-Regular.woff2") format("woff2"),url("./fonts/roboto/Roboto-Regular.woff") format("woff")}@font-face{font-family:"Roboto";src:url("./fonts/roboto/Roboto-Medium.woff2") format("woff2"),url("./fonts/roboto/Roboto-Medium.woff") format("woff");font-weight:500;font-style:normal}@font-face{font-family:"Roboto-Medium";src:url("./fonts/roboto/Roboto-Medium.woff2") format("woff2"),url("./fonts/roboto/Roboto-Medium.woff") format("woff")}@font-face{font-family:"OpenVeo-Player-Icons";src:url("./fonts/openveo-player-icons/openveo-player-icons.woff?ux1r699it") format("woff"),url("./fonts/openveo-player-icons/openveo-player-icons.ttf?ux1r699it") format("truetype"),url("./fonts/openveo-player-icons/openveo-player-icons.svg?ux1r699it") format("svg");font-weight:normal;font-style:normal}.opl-icon{display:inline-block;font-family:'OpenVeo-Player-Icons';font-weight:normal;font-style:normal;font-size:24px;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;text-rendering:optimizeLegibility;font-feature-settings:'liga';-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}@-moz-keyframes opl-player-y-slide-out{from{-moz-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-moz-transform:translateY(0);transform:translateY(0)}to{-moz-transform:translateY(-100%);transform:translateY(-100%)}}@-webkit-keyframes opl-player-y-slide-out{from{-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-transform:translateY(0);transform:translateY(0)}to{-webkit-transform:translateY(-100%);transform:translateY(-100%)}}@keyframes opl-player-y-slide-out{from{-moz-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-moz-transform:translateY(0);-ms-transform:translateY(0);-webkit-transform:translateY(0);transform:translateY(0)}to{-moz-transform:translateY(-100%);-ms-transform:translateY(-100%);-webkit-transform:translateY(-100%);transform:translateY(-100%)}}@-moz-keyframes opl-player-y-slide-in{from{-moz-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-moz-transform:translateY(-100%);transform:translateY(-100%)}to{-moz-transform:translateY(0);transform:translateY(0)}}@-webkit-keyframes opl-player-y-slide-in{from{-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-transform:translateY(-100%);transform:translateY(-100%)}to{-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes opl-player-y-slide-in{from{-moz-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-moz-transform:translateY(-100%);-ms-transform:translateY(-100%);-webkit-transform:translateY(-100%);transform:translateY(-100%)}to{-moz-transform:translateY(0);-ms-transform:translateY(0);-webkit-transform:translateY(0);transform:translateY(0)}}@-moz-keyframes opl-player-light-controls-y-slide-out{from{-moz-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-moz-transform:translateY(0);transform:translateY(0)}to{-moz-transform:translateY(-44px);transform:translateY(-44px)}}@-webkit-keyframes opl-player-light-controls-y-slide-out{from{-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-transform:translateY(0);transform:translateY(0)}to{-webkit-transform:translateY(-44px);transform:translateY(-44px)}}@keyframes opl-player-light-controls-y-slide-out{from{-moz-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-moz-transform:translateY(0);-ms-transform:translateY(0);-webkit-transform:translateY(0);transform:translateY(0)}to{-moz-transform:translateY(-44px);-ms-transform:translateY(-44px);-webkit-transform:translateY(-44px);transform:translateY(-44px)}}@-moz-keyframes opl-player-light-controls-y-slide-in{from{-moz-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-moz-transform:translateY(-44px);transform:translateY(-44px)}to{-moz-transform:translateY(0);transform:translateY(0)}}@-webkit-keyframes opl-player-light-controls-y-slide-in{from{-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-transform:translateY(-44px);transform:translateY(-44px)}to{-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes opl-player-light-controls-y-slide-in{from{-moz-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-moz-transform:translateY(-44px);-ms-transform:translateY(-44px);-webkit-transform:translateY(-44px);transform:translateY(-44px)}to{-moz-transform:translateY(0);-ms-transform:translateY(0);-webkit-transform:translateY(0);transform:translateY(0)}}.opl-player{--opl-player-primary-color:#000;--opl-player-primary-color-0:transparent;--opl-player-primary-color-1:rgba(0,0,0,0.05);--opl-player-primary-color-2:rgba(0,0,0,0.098);--opl-player-primary-color-3:rgba(0,0,0,0.12);--opl-player-primary-color-4:rgba(0,0,0,0.541);--opl-player-accent-color:#e6007e;--opl-player-background-color:#fff;--opl-player-background-color-0:rgba(255,255,255,0.12);--opl-player-background-color-1:rgba(255,255,255,0.2);--opl-player-controls-primary-color:#fff;position:relative;height:500px;overflow:hidden;font-family:Roboto, sans-serif;font-size:12px;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}.opl-player ::-moz-focus-inner{border:0}.opl-player ul{margin:0;padding:0;list-style:none}.opl-player p{margin:0;padding:0}.opl-player img{border:0}.opl-player nav{display:block}.opl-player .vjs-loading-spinner{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}.opl-player.opl-no-poi .opl-media-wrapper{bottom:0;border:none}.opl-player.opl-no-poi opl-tabs{display:none}.opl-player .opl-light-controls{z-index:3;position:absolute;top:0;width:100%;display:flex;justify-content:center;will-change:transform;-moz-transform:translateY(-44px);-ms-transform:translateY(-44px);-webkit-transform:translateY(-44px);transform:translateY(-44px)}.opl-player .opl-light-controls>div{display:flex;width:100%;max-width:100%;background-color:var(--opl-player-background-color, #fff);-moz-box-shadow:0px 4px 6px var(--opl-player-primary-color-3, rgba(0,0,0,0.12));-webkit-box-shadow:0px 4px 6px var(--opl-player-primary-color-3, rgba(0,0,0,0.12));box-shadow:0px 4px 6px var(--opl-player-primary-color-3, rgba(0,0,0,0.12))}.opl-player .opl-light-controls>div opl-toggle-icon-button{flex-basis:32px;flex-grow:0;flex-shrink:0}.opl-player .opl-light-controls>div .opl-current-time{flex-basis:56px;flex-shrink:0;flex-grow:0;display:inline-block;color:var(--opl-player-primary-color-4, rgba(0,0,0,0.541));vertical-align:top}.opl-player .opl-light-controls>div .opl-current-time span{line-height:32px;letter-spacing:0.4px}.opl-player .opl-light-controls>div opl-volume{flex-shrink:0;flex-grow:0}.opl-player .opl-light-controls>div .opl-volume .opl-slider{--opl-slider-primary-color:#000;--opl-slider-primary-color-0:rgba(0,0,0,0.098);--opl-slider-accent-color:#6e6e6e}.opl-player .opl-light-controls>div .opl-toggle-icon-button{--opl-toggle-icon-button-primary-color:#000;color:var(--opl-player-primary-color-4, rgba(0,0,0,0.541))}.opl-player .opl-light-controls>div .opl-time-bar{flex-grow:1;margin-right:16px}.opl-player .opl-light-controls>div .opl-time-bar .opl-slider{--opl-slider-primary-color:#000;--opl-slider-primary-color-0:rgba(0,0,0,0.098);--opl-slider-accent-color:#e6007e}.opl-player .opl-light-controls.opl-light-controls-masking{-moz-transform:translateY(0);-ms-transform:translateY(0);-webkit-transform:translateY(0);transform:translateY(0);-moz-animation-name:opl-player-light-controls-y-slide-out;-webkit-animation-name:opl-player-light-controls-y-slide-out;animation-name:opl-player-light-controls-y-slide-out;-moz-animation-duration:150ms;-webkit-animation-duration:150ms;animation-duration:150ms;-moz-animation-fill-mode:forwards;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards}.opl-player .opl-light-controls.opl-light-controls-posting{-moz-transform:translateY(-44px);-ms-transform:translateY(-44px);-webkit-transform:translateY(-44px);transform:translateY(-44px);-moz-animation-name:opl-player-light-controls-y-slide-in;-webkit-animation-name:opl-player-light-controls-y-slide-in;animation-name:opl-player-light-controls-y-slide-in;-moz-animation-duration:150ms;-webkit-animation-duration:150ms;animation-duration:150ms;-moz-animation-fill-mode:forwards;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards}.opl-player .opl-light-controls.opl-light-controls-posted{-moz-transform:translateY(0);-ms-transform:translateY(0);-webkit-transform:translateY(0);transform:translateY(0)}@media (min-width: 320px){.opl-player .opl-light-controls>div{max-width:616px}}.opl-player .opl-media-wrapper{z-index:2;position:absolute;width:100%;top:0;bottom:96px;background-color:var(--opl-player-primary-color, #000);border-bottom:1px solid var(--opl-player-primary-color-1, rgba(0,0,0,0.05));will-change:transform;-moz-transform:translateY(0);-ms-transform:translateY(0);-webkit-transform:translateY(0);transform:translateY(0)}.opl-player .opl-media-wrapper.opl-masking{-moz-transform:translateY(0);-ms-transform:translateY(0);-webkit-transform:translateY(0);transform:translateY(0);-moz-animation-name:opl-player-y-slide-out;-webkit-animation-name:opl-player-y-slide-out;animation-name:opl-player-y-slide-out;-moz-animation-duration:225ms;-webkit-animation-duration:225ms;animation-duration:225ms;-moz-animation-fill-mode:forwards;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards}.opl-player .opl-media-wrapper.opl-posting{-moz-transform:translateY(-100%);-ms-transform:translateY(-100%);-webkit-transform:translateY(-100%);transform:translateY(-100%);-moz-animation-name:opl-player-y-slide-in;-webkit-animation-name:opl-player-y-slide-in;animation-name:opl-player-y-slide-in;-moz-animation-duration:225ms;-webkit-animation-duration:225ms;animation-duration:225ms;-moz-animation-delay:300ms;-webkit-animation-delay:300ms;animation-delay:300ms;-moz-animation-fill-mode:forwards;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards}.opl-player .opl-media-wrapper.opl-masked{-moz-transform:translateY(-100%);-ms-transform:translateY(-100%);-webkit-transform:translateY(-100%);transform:translateY(-100%)}.opl-player .opl-media-wrapper .opl-media{position:relative;width:100%;height:100%}.opl-player .opl-media-wrapper .opl-media .opl-media-player{width:100% !important;height:100% !important;outline:none}.opl-player .opl-media-wrapper .opl-media .opl-loader{display:none;z-index:2;position:absolute;bottom:10px;left:10px;color:var(--opl-player-controls-primary-color, #fff)}.opl-player .opl-media-wrapper .opl-media .opl-error{z-index:1;display:table;position:absolute;top:0;left:0;width:100%;height:100%}.opl-player .opl-media-wrapper .opl-media .opl-error>div{display:table-cell;vertical-align:middle;text-align:center}.opl-player .opl-media-wrapper .opl-media .opl-error>div>div{color:var(--opl-player-controls-primary-color, #fff)}.opl-player .opl-media-wrapper .opl-overlay-play-button{z-index:1;position:absolute;top:0;left:0;width:100%;height:100%;outline:none}.opl-player .opl-media-wrapper .opl-overlay-play-button opl-toggle-icon-button,.opl-player .opl-media-wrapper .opl-overlay-play-button .opl-toggle-icon-button{width:100%;height:100%}.opl-player .opl-media-wrapper .opl-overlay-play-button .opl-toggle-icon-button:hover::before{opacity:0}.opl-player .opl-media-wrapper .opl-overlay-play-button .opl-toggle-icon-button.opl-focus::before{opacity:0}.opl-player .opl-media-wrapper.opl-template-split_50_50 .opl-area-2{display:none}.opl-player .opl-media-wrapper.opl-template-split_50_50 .opl-overlay-play-button.opl-overlay-supported{display:none}.opl-player .opl-media-wrapper.opl-template-split_25_75 .opl-area-2{display:none}.opl-player .opl-media-wrapper.opl-template-split_25_75 .opl-overlay-play-button.opl-overlay-supported{display:none}.opl-player .opl-media-wrapper.opl-template-split_1 .opl-area-2{display:none}.opl-player .opl-media-wrapper.opl-template-split_1 .opl-overlay-play-button.opl-overlay-supported{display:none}.opl-player .opl-media-wrapper.opl-template-split_2 .opl-area-2{display:none}.opl-player .opl-media-wrapper.opl-template-split_2 .opl-overlay-play-button.opl-overlay-supported{display:none}@media (min-width: 768px){.opl-player .opl-media-wrapper .opl-controls opl-template-selector,.opl-player .opl-media-wrapper .opl-controls .opl-volume{display:inline-block}.opl-player .opl-media-wrapper .opl-light-controls>div{max-width:616px}.opl-player .opl-media-wrapper.opl-template-split_50_50 .opl-media,.opl-player .opl-media-wrapper.opl-template-split_50_50 .opl-area-2{display:block;float:left;width:50%}.opl-player .opl-media-wrapper.opl-template-split_50_50 .opl-overlay-play-button.opl-overlay-supported{display:block;left:50%;width:50%}.opl-player .opl-media-wrapper.opl-template-split_25_75 .opl-media,.opl-player .opl-media-wrapper.opl-template-split_25_75 .opl-area-2{display:block;float:left}.opl-player .opl-media-wrapper.opl-template-split_25_75 .opl-media{width:25%}.opl-player .opl-media-wrapper.opl-template-split_25_75 .opl-area-2{width:75%}.opl-player .opl-media-wrapper.opl-template-split_25_75 .opl-overlay-play-button.opl-overlay-supported{display:block;left:25%;width:75%}.opl-player .opl-media-wrapper.opl-template-split_1 .opl-media{display:block;width:100%}.opl-player .opl-media-wrapper.opl-template-split_1 .opl-area-2{display:none}.opl-player .opl-media-wrapper.opl-template-split_1 .opl-overlay-play-button.opl-overlay-supported{display:none}.opl-player .opl-media-wrapper.opl-template-split_2 .opl-media{display:none}.opl-player .opl-media-wrapper.opl-template-split_2 .opl-area-2{display:block;width:100%}.opl-player .opl-media-wrapper.opl-template-split_2 .opl-overlay-play-button.opl-overlay-supported{display:block;left:0;width:100%}}.opl-player .opl-area-2{height:100%}.opl-player .opl-area-2>div{width:100%;height:100%;background-position:center;background-repeat:no-repeat;background-size:contain}.opl-player .opl-controls{z-index:2;position:absolute;bottom:0;left:0;height:64px;width:100%;background:linear-gradient(to top, var(--opl-player-primary-color-4, rgba(0,0,0,0.541)), var(--opl-player-primary-color-0, transparent));will-change:opacity;-moz-user-select:-moz-none;-ms-user-select:none;-webkit-user-select:none;user-select:none;-moz-transition-property:opacity;-o-transition-property:opacity;-webkit-transition-property:opacity;transition-property:opacity;-moz-transition-timing-function:cubic-bezier(0, 0, 0.2, 1);-o-transition-timing-function:cubic-bezier(0, 0, 0.2, 1);-webkit-transition-timing-function:cubic-bezier(0, 0, 0.2, 1);transition-timing-function:cubic-bezier(0, 0, 0.2, 1);-moz-transition-duration:250ms;-o-transition-duration:250ms;-webkit-transition-duration:250ms;transition-duration:250ms}.opl-player .opl-controls.opl-hidden{opacity:0;-moz-transition-property:opacity;-o-transition-property:opacity;-webkit-transition-property:opacity;transition-property:opacity;-moz-transition-timing-function:cubic-bezier(0.4, 0, 1, 1);-o-transition-timing-function:cubic-bezier(0.4, 0, 1, 1);-webkit-transition-timing-function:cubic-bezier(0.4, 0, 1, 1);transition-timing-function:cubic-bezier(0.4, 0, 1, 1);-moz-transition-duration:100ms;-o-transition-duration:100ms;-webkit-transition-duration:100ms;transition-duration:100ms}.opl-player .opl-controls .opl-left-controls{position:absolute;bottom:0;left:0}.opl-player .opl-controls .opl-right-controls{position:absolute;bottom:0;right:4px}.opl-player .opl-controls .opl-toggle-icon-button{--opl-toggle-icon-button-primary-color:#fff}.opl-player .opl-controls .opl-settings .opl-button{--opl-button-primary-color:#fff}.opl-player .opl-controls .opl-template-selector{--opl-template-selector-primary-color:#fff}.opl-player .opl-controls opl-template-selector{display:none}.opl-player .opl-controls>div{position:absolute;left:8px;bottom:4px;height:64px;width:calc(100% - 16px)}.opl-player .opl-controls .opl-current-time{display:inline-block;vertical-align:top;color:var(--opl-player-controls-primary-color, #fff)}.opl-player .opl-controls .opl-current-time span{line-height:32px;letter-spacing:0.4px}.opl-player .opl-controls .opl-volume{display:none}.opl-player .opl-controls .opl-volume .opl-slider{--opl-slider-primary-color:#fff;--opl-slider-primary-color-0:rgba(255,255,255,0.7);--opl-slider-accent-color:#fff}.opl-player .opl-controls .opl-time-bar{position:absolute;bottom:32px;left:11px;width:calc(100% - 22px);height:32px}.opl-player .opl-controls .opl-time-bar .opl-index-preview{position:absolute;bottom:32px;left:0;width:142px;height:80px;-moz-box-shadow:0px 0px 8px var(--opl-player-background-color-0, rgba(255,255,255,0.12)),0px 1px 2px var(--opl-player-background-color-1, rgba(255,255,255,0.2));-webkit-box-shadow:0px 0px 8px var(--opl-player-background-color-0, rgba(255,255,255,0.12)),0px 1px 2px var(--opl-player-background-color-1, rgba(255,255,255,0.2));box-shadow:0px 0px 8px var(--opl-player-background-color-0, rgba(255,255,255,0.12)),0px 1px 2px var(--opl-player-background-color-1, rgba(255,255,255,0.2))}.opl-player .opl-controls .opl-time-bar .opl-slider{--opl-slider-primary-color:#fff;--opl-slider-primary-color-0:rgba(255,255,255,0.7);--opl-slider-accent-color:#e6007e}.opl-fullscreen>.opl-player{position:absolute;top:0;left:0;width:100%;height:100%}opl-player>div:full-screen,:full-screen .opl-player{position:absolute;top:0;width:100%;height:100%;background-color:var(--opl-player-background-color, #fff)}opl-player>div:-webkit-full-screen,:-webkit-full-screen .opl-player{position:absolute;top:0;width:100%;height:100%;background-color:var(--opl-player-background-color, #fff)}opl-player>div:-ms-fullscreen,:-ms-fullscreen .opl-player{position:absolute;top:0;width:100%;height:100%;background-color:var(--opl-player-background-color, #fff)}opl-player>div:-o-full-screen,:-o-full-screen .opl-player{position:absolute;top:0;width:100%;height:100%;background-color:var(--opl-player-background-color, #fff)}opl-player>div:-moz-full-screen,:-moz-full-screen .opl-player{position:absolute;top:0;width:100%;height:100%;background-color:var(--opl-player-background-color, #fff)}@-moz-keyframes opl-template-selector-template-ripple-resolve{from{-moz-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);opacity:0}to{opacity:0.60}}@-webkit-keyframes opl-template-selector-template-ripple-resolve{from{-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);opacity:0}to{opacity:0.60}}@keyframes opl-template-selector-template-ripple-resolve{from{-moz-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);opacity:0}to{opacity:0.60}}@-moz-keyframes opl-template-selector-template-ripple-dissolve{from{-moz-animation-timing-function:linear;animation-timing-function:linear}to{opacity:0}}@-webkit-keyframes opl-template-selector-template-ripple-dissolve{from{-webkit-animation-timing-function:linear;animation-timing-function:linear}to{opacity:0}}@keyframes opl-template-selector-template-ripple-dissolve{from{-moz-animation-timing-function:linear;-webkit-animation-timing-function:linear;animation-timing-function:linear}to{opacity:0}}@-moz-keyframes opl-template-selector-template-ripple-radius-in{from{-moz-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-moz-transform:scale(0, 0);transform:scale(0, 0)}to{-moz-transform:scale(1, 1);transform:scale(1, 1)}}@-webkit-keyframes opl-template-selector-template-ripple-radius-in{from{-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-transform:scale(0, 0);transform:scale(0, 0)}to{-webkit-transform:scale(1, 1);transform:scale(1, 1)}}@keyframes opl-template-selector-template-ripple-radius-in{from{-moz-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-moz-transform:scale(0, 0);-ms-transform:scale(0, 0);-webkit-transform:scale(0, 0);transform:scale(0, 0)}to{-moz-transform:scale(1, 1);-ms-transform:scale(1, 1);-webkit-transform:scale(1, 1);transform:scale(1, 1)}}opl-template-selector{display:inline-block;width:32px;height:32px;margin-left:100px;vertical-align:top}.opl-template-selector{--opl-template-selector-primary-color:#000;position:relative;display:inline-block;width:32px;height:32px;outline:none;vertical-align:top}.opl-template-selector button{z-index:1;position:absolute;top:0;width:32px;height:32px;padding:4px;outline:none;-webkit-tap-highlight-color:transparent;will-change:transform, opacity;border:none;background-color:transparent;cursor:pointer;color:var(--opl-template-selector-primary-color, #000);-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;-moz-user-select:-moz-none;-ms-user-select:none;-webkit-user-select:none;user-select:none}.opl-template-selector button.opl-selected{z-index:2}.opl-template-selector button::before,.opl-template-selector button::after{position:absolute;top:0;left:0;width:100%;height:100%;content:'';opacity:0;border-radius:50%;pointer-events:none}.opl-template-selector button::before{-moz-transition-property:opacity;-o-transition-property:opacity;-webkit-transition-property:opacity;transition-property:opacity;-moz-transition-timing-function:linear;-o-transition-timing-function:linear;-webkit-transition-timing-function:linear;transition-timing-function:linear;-moz-transition-duration:15ms;-o-transition-duration:15ms;-webkit-transition-duration:15ms;transition-duration:15ms;background-color:var(--opl-template-selector-primary-color, #000)}.opl-template-selector button::after{-moz-transform:scale(0, 0);-ms-transform:scale(0, 0);-webkit-transform:scale(0, 0);transform:scale(0, 0);-moz-transform-origin:center center;-ms-transform-origin:center center;-webkit-transform-origin:center center;transform-origin:center center;background-color:var(--opl-template-selector-primary-color, #000)}.opl-template-selector button:hover::before{opacity:0.04}.opl-template-selector button.opl-template-focus::before{-moz-transition-duration:75ms;-o-transition-duration:75ms;-webkit-transition-duration:75ms;transition-duration:75ms;opacity:0.12}.opl-template-selector button.opl-template-activation::after{-moz-animation-name:opl-template-selector-template-ripple-radius-in,opl-template-selector-template-ripple-resolve;-webkit-animation-name:opl-template-selector-template-ripple-radius-in,opl-template-selector-template-ripple-resolve;animation-name:opl-template-selector-template-ripple-radius-in,opl-template-selector-template-ripple-resolve;-moz-animation-duration:225ms,75ms;-webkit-animation-duration:225ms,75ms;animation-duration:225ms,75ms;-moz-animation-fill-mode:forwards,forwards;-webkit-animation-fill-mode:forwards,forwards;animation-fill-mode:forwards,forwards}.opl-template-selector button.opl-template-deactivation::after{-moz-animation-name:opl-template-selector-template-ripple-dissolve;-webkit-animation-name:opl-template-selector-template-ripple-dissolve;animation-name:opl-template-selector-template-ripple-dissolve;-moz-animation-duration:150ms;-webkit-animation-duration:150ms;animation-duration:150ms;-moz-transform:scale(1, 1);-ms-transform:scale(1, 1);-webkit-transform:scale(1, 1);transform:scale(1, 1)}@-moz-keyframes opl-tile-ripple-radius-in{from{-moz-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-moz-transform:scale(0, 0);transform:scale(0, 0)}to{-moz-transform:scale(2, 2);transform:scale(2, 2)}}@-webkit-keyframes opl-tile-ripple-radius-in{from{-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-transform:scale(0, 0);transform:scale(0, 0)}to{-webkit-transform:scale(2, 2);transform:scale(2, 2)}}@keyframes opl-tile-ripple-radius-in{from{-moz-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-moz-transform:scale(0, 0);-ms-transform:scale(0, 0);-webkit-transform:scale(0, 0);transform:scale(0, 0)}to{-moz-transform:scale(2, 2);-ms-transform:scale(2, 2);-webkit-transform:scale(2, 2);transform:scale(2, 2)}}@-moz-keyframes opl-tile-ripple-opacity-in{from{-moz-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);opacity:0}to{opacity:0.16}}@-webkit-keyframes opl-tile-ripple-opacity-in{from{-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);opacity:0}to{opacity:0.16}}@keyframes opl-tile-ripple-opacity-in{from{-moz-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);opacity:0}to{opacity:0.16}}@-moz-keyframes opl-tile-ripple-opacity-out{from{-moz-animation-timing-function:linear;animation-timing-function:linear;opacity:0.16}to{opacity:0}}@-webkit-keyframes opl-tile-ripple-opacity-out{from{-webkit-animation-timing-function:linear;animation-timing-function:linear;opacity:0.16}to{opacity:0}}@keyframes opl-tile-ripple-opacity-out{from{-moz-animation-timing-function:linear;-webkit-animation-timing-function:linear;animation-timing-function:linear;opacity:0.16}to{opacity:0}}@-moz-keyframes opl-tile-loader-elastic{0%{-moz-animation-timing-function:cubic-bezier(0.35, 0.35, 0.43, 0.9);animation-timing-function:cubic-bezier(0.35, 0.35, 0.43, 0.9);-moz-transform:translateX(0%);transform:translateX(0%)}50%{-moz-animation-timing-function:cubic-bezier(0.35, 0.35, 0.43, 0.9);animation-timing-function:cubic-bezier(0.35, 0.35, 0.43, 0.9);-moz-transform:translateX(100%);transform:translateX(100%)}100%{-moz-transform:translateX(0%);transform:translateX(0%)}}@-webkit-keyframes opl-tile-loader-elastic{0%{-webkit-animation-timing-function:cubic-bezier(0.35, 0.35, 0.43, 0.9);animation-timing-function:cubic-bezier(0.35, 0.35, 0.43, 0.9);-webkit-transform:translateX(0%);transform:translateX(0%)}50%{-webkit-animation-timing-function:cubic-bezier(0.35, 0.35, 0.43, 0.9);animation-timing-function:cubic-bezier(0.35, 0.35, 0.43, 0.9);-webkit-transform:translateX(100%);transform:translateX(100%)}100%{-webkit-transform:translateX(0%);transform:translateX(0%)}}@keyframes opl-tile-loader-elastic{0%{-moz-animation-timing-function:cubic-bezier(0.35, 0.35, 0.43, 0.9);-webkit-animation-timing-function:cubic-bezier(0.35, 0.35, 0.43, 0.9);animation-timing-function:cubic-bezier(0.35, 0.35, 0.43, 0.9);-moz-transform:translateX(0%);-ms-transform:translateX(0%);-webkit-transform:translateX(0%);transform:translateX(0%)}50%{-moz-animation-timing-function:cubic-bezier(0.35, 0.35, 0.43, 0.9);-webkit-animation-timing-function:cubic-bezier(0.35, 0.35, 0.43, 0.9);animation-timing-function:cubic-bezier(0.35, 0.35, 0.43, 0.9);-moz-transform:translateX(100%);-ms-transform:translateX(100%);-webkit-transform:translateX(100%);transform:translateX(100%)}100%{-moz-transform:translateX(0%);-ms-transform:translateX(0%);-webkit-transform:translateX(0%);transform:translateX(0%)}}@-moz-keyframes opl-tile-attachment-ripple-radius-in{from{-moz-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-moz-transform:scale(0, 0);transform:scale(0, 0)}to{-moz-transform:scale(11, 11);transform:scale(11, 11)}}@-webkit-keyframes opl-tile-attachment-ripple-radius-in{from{-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-transform:scale(0, 0);transform:scale(0, 0)}to{-webkit-transform:scale(11, 11);transform:scale(11, 11)}}@keyframes opl-tile-attachment-ripple-radius-in{from{-moz-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-moz-transform:scale(0, 0);-ms-transform:scale(0, 0);-webkit-transform:scale(0, 0);transform:scale(0, 0)}to{-moz-transform:scale(11, 11);-ms-transform:scale(11, 11);-webkit-transform:scale(11, 11);transform:scale(11, 11)}}@-moz-keyframes opl-tile-attachment-ripple-resolve{from{-moz-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);opacity:0}to{opacity:0.16}}@-webkit-keyframes opl-tile-attachment-ripple-resolve{from{-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);opacity:0}to{opacity:0.16}}@keyframes opl-tile-attachment-ripple-resolve{from{-moz-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);opacity:0}to{opacity:0.16}}@-moz-keyframes opl-tile-attachment-ripple-dissolve{from{-moz-animation-timing-function:linear;animation-timing-function:linear}to{opacity:0}}@-webkit-keyframes opl-tile-attachment-ripple-dissolve{from{-webkit-animation-timing-function:linear;animation-timing-function:linear}to{opacity:0}}@keyframes opl-tile-attachment-ripple-dissolve{from{-moz-animation-timing-function:linear;-webkit-animation-timing-function:linear;animation-timing-function:linear}to{opacity:0}}opl-tile{width:100%;height:100%}.opl-tile{--opl-tile-primary-color:#000;--opl-tile-primary-color-0:rgba(0,0,0,0.01);--opl-tile-primary-color-1:rgba(0,0,0,0.078);--opl-tile-primary-color-2:rgba(0,0,0,0.118);--opl-tile-primary-color-3:rgba(0,0,0,0.498);--opl-tile-primary-color-4:rgba(0,0,0,0.541);--opl-tile-accent-color:#e2287b;--opl-tile-accent-color-0:rgba(226,40,123,0.1);--opl-tile-background-color:#fff;--opl-tile-background-color-0:rgba(255,255,255,0.8);--opl-tile-link-color:#1a91d1;--opl-tile-link-color-0:rgba(26,145,209,0.039);--opl-tile-link-color-1:rgba(26,145,209,0.118);position:relative;overflow:hidden;width:100%;height:100%;background-color:var(--opl-tile-background-color, #fff);outline:none;will-change:transform, opacity;-webkit-tap-highlight-color:transparent;-moz-user-select:-moz-none;-ms-user-select:none;-webkit-user-select:none;user-select:none}.opl-tile::before{z-index:2;position:absolute;top:0;left:0;width:100%;height:100%;content:'';opacity:0;pointer-events:none;background-color:var(--opl-tile-primary-color, #000)}.opl-tile::after{position:absolute;top:0;left:0;width:100%;height:100%;content:'';opacity:0;border-radius:50%;pointer-events:none;-moz-transform:scale(0, 0);-ms-transform:scale(0, 0);-webkit-transform:scale(0, 0);transform:scale(0, 0);-moz-transform-origin:center center;-ms-transform-origin:center center;-webkit-transform-origin:center center;transform-origin:center center;background-color:var(--opl-tile-primary-color, #000)}.opl-tile.opl-over::before{opacity:0}.opl-tile:focus::before{opacity:1;background-color:var(--opl-tile-primary-color-0, rgba(0,0,0,0.01))}.opl-tile.opl-activation::after{-moz-animation-name:opl-tile-ripple-radius-in,opl-tile-ripple-opacity-in;-webkit-animation-name:opl-tile-ripple-radius-in,opl-tile-ripple-opacity-in;animation-name:opl-tile-ripple-radius-in,opl-tile-ripple-opacity-in;-moz-animation-duration:225ms,75ms;-webkit-animation-duration:225ms,75ms;animation-duration:225ms,75ms;-moz-animation-fill-mode:forwards,forwards;-webkit-animation-fill-mode:forwards,forwards;animation-fill-mode:forwards,forwards}.opl-tile.opl-deactivation::after{-moz-animation-name:opl-tile-ripple-opacity-out;-webkit-animation-name:opl-tile-ripple-opacity-out;animation-name:opl-tile-ripple-opacity-out;-moz-animation-duration:150ms;-webkit-animation-duration:150ms;animation-duration:150ms;-moz-transform:scale(2, 2);-ms-transform:scale(2, 2);-webkit-transform:scale(2, 2);transform:scale(2, 2)}.opl-tile .opl-content{height:100%}.opl-tile .opl-abstract{display:flex;flex-direction:column;justify-content:flex-end;width:100%;height:100%;font-size:12px;line-height:18px;letter-spacing:0.4px;color:var(--opl-tile-primary-color-3, rgba(0,0,0,0.498))}.opl-tile .opl-abstract .opl-error-message{flex-grow:1;padding-top:8px;text-align:center;letter-spacing:5px;font-size:12px}.opl-tile .opl-abstract .opl-title{flex-grow:1;overflow:hidden}.opl-tile .opl-abstract .opl-title p{padding:8px}.opl-tile .opl-abstract .opl-info{display:flex;flex-basis:32px;flex-shrink:0;background-color:var(--opl-tile-background-color-0, rgba(255,255,255,0.8))}.opl-tile .opl-abstract .opl-info .opl-access-time-icon{flex-basis:32px;flex-shrink:0;font-size:18px;text-align:center;line-height:32px}.opl-tile .opl-abstract .opl-info .opl-access-time{flex-grow:1;overflow:hidden;line-height:32px}.opl-tile .opl-abstract .opl-info .opl-more-button{flex-basis:32px;flex-shrink:0;flex-grow:0}.opl-tile .opl-abstract .opl-info .opl-more-button button{color:var(--opl-tile-primary-color-3, rgba(0,0,0,0.498))}.opl-tile.opl-tile-abstract{height:100%;cursor:pointer}.opl-tile.opl-tile-abstract.opl-over::before{opacity:1;background-color:var(--opl-tile-primary-color-1, rgba(0,0,0,0.078))}.opl-tile.opl-tile-abstract:focus::before{background-color:var(--opl-tile-primary-color-2, rgba(0,0,0,0.118))}.opl-tile .opl-full{height:100%;padding:8px 16px}.opl-tile .opl-full .opl-close-button{position:absolute;top:8px;right:8px;border-radius:50%;background-color:var(--opl-tile-background-color, #fff)}.opl-tile .opl-full .opl-close-button .opl-button{color:var(--opl-tile-primary-color, #000)}.opl-tile .opl-full .opl-title-wrapper{display:flex}.opl-tile .opl-full .opl-title-wrapper .opl-close-button{flex-basis:32px;flex-shrink:0;flex-grow:0}.opl-tile .opl-full .opl-title-wrapper .opl-close-button .opl-button{color:var(--opl-tile-primary-color-4, rgba(0,0,0,0.541))}.opl-tile .opl-full .opl-title-wrapper .opl-title{flex-grow:1;padding-bottom:16px;font-family:'Roboto-Medium', sans-serif;font-size:20px;line-height:28px;letter-spacing:0.1px;color:var(--opl-tile-primary-color-3, rgba(0,0,0,0.498));-moz-user-select:text;-ms-user-select:text;-webkit-user-select:text;user-select:text}.opl-tile .opl-full .opl-tile-description{font-size:16px;letter-spacing:0.5px;color:var(--opl-tile-primary-color-3, rgba(0,0,0,0.498));-moz-user-select:text;-ms-user-select:text;-webkit-user-select:text;user-select:text}.opl-tile .opl-full .opl-tile-description h1,.opl-tile .opl-full .opl-tile-description h2,.opl-tile .opl-full .opl-tile-description h3,.opl-tile .opl-full .opl-tile-description h4{letter-spacing:0.1px}.opl-tile .opl-full .opl-tile-description p{line-height:21px;font-size:1em;margin:1em 0}.opl-tile .opl-full .opl-tile-description ul{list-style-type:square;padding-left:40px}.opl-tile .opl-full .opl-attachment a{overflow:hidden;position:relative;display:inline-block;outline:none;margin-top:8px;padding:12px;text-decoration:none;color:var(--opl-tile-link-color, #1a91d1)}.opl-tile .opl-full .opl-attachment a span{margin-left:12px;vertical-align:top;line-height:28px;letter-spacing:0.4px}.opl-tile .opl-full .opl-attachment a::after{position:absolute;top:0;height:100%;content:'';opacity:0;pointer-events:none;-moz-transform:scale(0, 0);-ms-transform:scale(0, 0);-webkit-transform:scale(0, 0);transform:scale(0, 0);-moz-transform-origin:center center;-ms-transform-origin:center center;-webkit-transform-origin:center center;transform-origin:center center;left:-10%;width:20%;border-radius:50%;background-color:var(--opl-tile-link-color, #1a91d1)}.opl-tile .opl-full .opl-attachment a:hover{background-color:var(--opl-tile-link-color-0, rgba(26,145,209,0.039))}.opl-tile .opl-full .opl-attachment a.opl-focus{background-color:var(--opl-tile-link-color-1, rgba(26,145,209,0.118))}.opl-tile .opl-full .opl-attachment a.opl-attachment-activation::after{-moz-animation-name:opl-tile-attachment-ripple-radius-in,opl-tile-attachment-ripple-resolve;-webkit-animation-name:opl-tile-attachment-ripple-radius-in,opl-tile-attachment-ripple-resolve;animation-name:opl-tile-attachment-ripple-radius-in,opl-tile-attachment-ripple-resolve;-moz-animation-duration:225ms,75ms;-webkit-animation-duration:225ms,75ms;animation-duration:225ms,75ms;-moz-animation-fill-mode:forwards,forwards;-webkit-animation-fill-mode:forwards,forwards;animation-fill-mode:forwards,forwards}.opl-tile .opl-full .opl-attachment a.opl-attachment-deactivation::after{-moz-animation-name:opl-tile-attachment-ripple-dissolve;-webkit-animation-name:opl-tile-attachment-ripple-dissolve;animation-name:opl-tile-attachment-ripple-dissolve;-moz-animation-duration:150ms;-webkit-animation-duration:150ms;animation-duration:150ms;-moz-transform:scale(1, 1);-ms-transform:scale(1, 1);-webkit-transform:scale(1, 1);transform:scale(1, 1)}.opl-tile .opl-full .opl-error-message{display:flex;flex-direction:column;height:100%;justify-content:center;text-align:center;letter-spacing:5px;font-size:14px}.opl-tile.opl-type-image .opl-abstract .opl-title,.opl-tile.opl-type-image .opl-abstract .opl-info,.opl-tile.opl-type-image .opl-abstract .opl-more-button button{color:var(--opl-tile-primary-color, #000)}.opl-tile.opl-type-image .opl-full{padding:0}.opl-tile.opl-type-image .opl-full img{width:100%;height:100%}.opl-tile .opl-loader{position:absolute;top:0;left:0;width:100%;height:4px;background-color:var(--opl-tile-accent-color-0, rgba(226,40,123,0.1));will-change:transform}.opl-tile .opl-loader::before{position:absolute;top:0;left:0;width:50%;height:100%;content:'';pointer-events:none;background-color:var(--opl-tile-accent-color, #e2287b);-moz-animation-name:opl-tile-loader-elastic;-webkit-animation-name:opl-tile-loader-elastic;animation-name:opl-tile-loader-elastic;-moz-animation-iteration-count:infinite;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-moz-animation-duration:2000ms;-webkit-animation-duration:2000ms;animation-duration:2000ms}@-moz-keyframes opl-tiles-opacity-in{from{-moz-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);opacity:0}to{opacity:1;visibility:visible}}@-webkit-keyframes opl-tiles-opacity-in{from{-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);opacity:0}to{opacity:1;visibility:visible}}@keyframes opl-tiles-opacity-in{from{-moz-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);opacity:0}to{opacity:1;visibility:visible}}@-moz-keyframes opl-tiles-opacity-out{from{-moz-animation-timing-function:linear;animation-timing-function:linear;opacity:1}to{opacity:0;visibility:hidden}}@-webkit-keyframes opl-tiles-opacity-out{from{-webkit-animation-timing-function:linear;animation-timing-function:linear;opacity:1}to{opacity:0;visibility:hidden}}@keyframes opl-tiles-opacity-out{from{-moz-animation-timing-function:linear;-webkit-animation-timing-function:linear;animation-timing-function:linear;opacity:1}to{opacity:0;visibility:hidden}}@-moz-keyframes opl-tile-enlarge{0%{-moz-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-moz-transform:translateX(var(--opl-tiles-reduced-xpos)) translateY(var(--opl-tiles-reduced-ypos));transform:translateX(var(--opl-tiles-reduced-xpos)) translateY(var(--opl-tiles-reduced-ypos));width:var(--opl-tiles-reduced-width);height:var(--opl-tiles-reduced-height)}70%{-moz-transform:translateX(var(--opl-tiles-reduced-xpos)) translateY(var(--opl-tiles-enlarged-ypos));transform:translateX(var(--opl-tiles-reduced-xpos)) translateY(var(--opl-tiles-enlarged-ypos));width:var(--opl-tiles-reduced-width);height:var(--opl-tiles-enlarged-height)}100%{-moz-transform:translateX(var(--opl-tiles-enlarged-xpos)) translateY(var(--opl-tiles-enlarged-ypos));transform:translateX(var(--opl-tiles-enlarged-xpos)) translateY(var(--opl-tiles-enlarged-ypos));width:var(--opl-tiles-enlarged-width);height:var(--opl-tiles-enlarged-height)}}@-webkit-keyframes opl-tile-enlarge{0%{-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-transform:translateX(var(--opl-tiles-reduced-xpos)) translateY(var(--opl-tiles-reduced-ypos));transform:translateX(var(--opl-tiles-reduced-xpos)) translateY(var(--opl-tiles-reduced-ypos));width:var(--opl-tiles-reduced-width);height:var(--opl-tiles-reduced-height)}70%{-webkit-transform:translateX(var(--opl-tiles-reduced-xpos)) translateY(var(--opl-tiles-enlarged-ypos));transform:translateX(var(--opl-tiles-reduced-xpos)) translateY(var(--opl-tiles-enlarged-ypos));width:var(--opl-tiles-reduced-width);height:var(--opl-tiles-enlarged-height)}100%{-webkit-transform:translateX(var(--opl-tiles-enlarged-xpos)) translateY(var(--opl-tiles-enlarged-ypos));transform:translateX(var(--opl-tiles-enlarged-xpos)) translateY(var(--opl-tiles-enlarged-ypos));width:var(--opl-tiles-enlarged-width);height:var(--opl-tiles-enlarged-height)}}@keyframes opl-tile-enlarge{0%{-moz-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-moz-transform:translateX(var(--opl-tiles-reduced-xpos)) translateY(var(--opl-tiles-reduced-ypos));-ms-transform:translateX(var(--opl-tiles-reduced-xpos)) translateY(var(--opl-tiles-reduced-ypos));-webkit-transform:translateX(var(--opl-tiles-reduced-xpos)) translateY(var(--opl-tiles-reduced-ypos));transform:translateX(var(--opl-tiles-reduced-xpos)) translateY(var(--opl-tiles-reduced-ypos));width:var(--opl-tiles-reduced-width);height:var(--opl-tiles-reduced-height)}70%{-moz-transform:translateX(var(--opl-tiles-reduced-xpos)) translateY(var(--opl-tiles-enlarged-ypos));-ms-transform:translateX(var(--opl-tiles-reduced-xpos)) translateY(var(--opl-tiles-enlarged-ypos));-webkit-transform:translateX(var(--opl-tiles-reduced-xpos)) translateY(var(--opl-tiles-enlarged-ypos));transform:translateX(var(--opl-tiles-reduced-xpos)) translateY(var(--opl-tiles-enlarged-ypos));width:var(--opl-tiles-reduced-width);height:var(--opl-tiles-enlarged-height)}100%{-moz-transform:translateX(var(--opl-tiles-enlarged-xpos)) translateY(var(--opl-tiles-enlarged-ypos));-ms-transform:translateX(var(--opl-tiles-enlarged-xpos)) translateY(var(--opl-tiles-enlarged-ypos));-webkit-transform:translateX(var(--opl-tiles-enlarged-xpos)) translateY(var(--opl-tiles-enlarged-ypos));transform:translateX(var(--opl-tiles-enlarged-xpos)) translateY(var(--opl-tiles-enlarged-ypos));width:var(--opl-tiles-enlarged-width);height:var(--opl-tiles-enlarged-height)}}@-moz-keyframes opl-tile-reduce{0%{-moz-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-moz-transform:translateX(var(--opl-tiles-enlarged-xpos)) translateY(var(--opl-tiles-enlarged-ypos));transform:translateX(var(--opl-tiles-enlarged-xpos)) translateY(var(--opl-tiles-enlarged-ypos));width:var(--opl-tiles-enlarged-width);height:var(--opl-tiles-enlarged-height)}20%{-moz-transform:translateX(var(--opl-tiles-reduced-xpos)) translateY(var(--opl-tiles-enlarged-ypos));transform:translateX(var(--opl-tiles-reduced-xpos)) translateY(var(--opl-tiles-enlarged-ypos));width:var(--opl-tiles-reduced-width);height:var(--opl-tiles-enlarged-height)}100%{-moz-transform:translateX(var(--opl-tiles-reduced-xpos)) translateY(var(--opl-tiles-reduced-ypos));transform:translateX(var(--opl-tiles-reduced-xpos)) translateY(var(--opl-tiles-reduced-ypos));width:var(--opl-tiles-reduced-width);height:var(--opl-tiles-reduced-height)}}@-webkit-keyframes opl-tile-reduce{0%{-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-transform:translateX(var(--opl-tiles-enlarged-xpos)) translateY(var(--opl-tiles-enlarged-ypos));transform:translateX(var(--opl-tiles-enlarged-xpos)) translateY(var(--opl-tiles-enlarged-ypos));width:var(--opl-tiles-enlarged-width);height:var(--opl-tiles-enlarged-height)}20%{-webkit-transform:translateX(var(--opl-tiles-reduced-xpos)) translateY(var(--opl-tiles-enlarged-ypos));transform:translateX(var(--opl-tiles-reduced-xpos)) translateY(var(--opl-tiles-enlarged-ypos));width:var(--opl-tiles-reduced-width);height:var(--opl-tiles-enlarged-height)}100%{-webkit-transform:translateX(var(--opl-tiles-reduced-xpos)) translateY(var(--opl-tiles-reduced-ypos));transform:translateX(var(--opl-tiles-reduced-xpos)) translateY(var(--opl-tiles-reduced-ypos));width:var(--opl-tiles-reduced-width);height:var(--opl-tiles-reduced-height)}}@keyframes opl-tile-reduce{0%{-moz-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-moz-transform:translateX(var(--opl-tiles-enlarged-xpos)) translateY(var(--opl-tiles-enlarged-ypos));-ms-transform:translateX(var(--opl-tiles-enlarged-xpos)) translateY(var(--opl-tiles-enlarged-ypos));-webkit-transform:translateX(var(--opl-tiles-enlarged-xpos)) translateY(var(--opl-tiles-enlarged-ypos));transform:translateX(var(--opl-tiles-enlarged-xpos)) translateY(var(--opl-tiles-enlarged-ypos));width:var(--opl-tiles-enlarged-width);height:var(--opl-tiles-enlarged-height)}20%{-moz-transform:translateX(var(--opl-tiles-reduced-xpos)) translateY(var(--opl-tiles-enlarged-ypos));-ms-transform:translateX(var(--opl-tiles-reduced-xpos)) translateY(var(--opl-tiles-enlarged-ypos));-webkit-transform:translateX(var(--opl-tiles-reduced-xpos)) translateY(var(--opl-tiles-enlarged-ypos));transform:translateX(var(--opl-tiles-reduced-xpos)) translateY(var(--opl-tiles-enlarged-ypos));width:var(--opl-tiles-reduced-width);height:var(--opl-tiles-enlarged-height)}100%{-moz-transform:translateX(var(--opl-tiles-reduced-xpos)) translateY(var(--opl-tiles-reduced-ypos));-ms-transform:translateX(var(--opl-tiles-reduced-xpos)) translateY(var(--opl-tiles-reduced-ypos));-webkit-transform:translateX(var(--opl-tiles-reduced-xpos)) translateY(var(--opl-tiles-reduced-ypos));transform:translateX(var(--opl-tiles-reduced-xpos)) translateY(var(--opl-tiles-reduced-ypos));width:var(--opl-tiles-reduced-width);height:var(--opl-tiles-reduced-height)}}@-moz-keyframes opl-tile-resize{0%{-moz-animation-timing-function:cubic-bezier(1, -0.04, 1, 0.55);animation-timing-function:cubic-bezier(1, -0.04, 1, 0.55);-moz-transform:translateX(var(--opl-tiles-enlarged-xpos)) translateY(var(--opl-tiles-enlarged-ypos));transform:translateX(var(--opl-tiles-enlarged-xpos)) translateY(var(--opl-tiles-enlarged-ypos));width:var(--opl-tiles-enlarged-width);height:var(--opl-tiles-enlarged-height)}50%{-moz-transform:translateX(var(--opl-tiles-resized-xpos)) translateY(var(--opl-tiles-enlarged-ypos));transform:translateX(var(--opl-tiles-resized-xpos)) translateY(var(--opl-tiles-enlarged-ypos));width:var(--opl-tiles-resized-width);height:var(--opl-tiles-enlarged-height)}100%{-moz-transform:translateX(var(--opl-tiles-resized-xpos)) translateY(var(--opl-tiles-resized-ypos));transform:translateX(var(--opl-tiles-resized-xpos)) translateY(var(--opl-tiles-resized-ypos));width:var(--opl-tiles-resized-width);height:var(--opl-tiles-resized-height)}}@-webkit-keyframes opl-tile-resize{0%{-webkit-animation-timing-function:cubic-bezier(1, -0.04, 1, 0.55);animation-timing-function:cubic-bezier(1, -0.04, 1, 0.55);-webkit-transform:translateX(var(--opl-tiles-enlarged-xpos)) translateY(var(--opl-tiles-enlarged-ypos));transform:translateX(var(--opl-tiles-enlarged-xpos)) translateY(var(--opl-tiles-enlarged-ypos));width:var(--opl-tiles-enlarged-width);height:var(--opl-tiles-enlarged-height)}50%{-webkit-transform:translateX(var(--opl-tiles-resized-xpos)) translateY(var(--opl-tiles-enlarged-ypos));transform:translateX(var(--opl-tiles-resized-xpos)) translateY(var(--opl-tiles-enlarged-ypos));width:var(--opl-tiles-resized-width);height:var(--opl-tiles-enlarged-height)}100%{-webkit-transform:translateX(var(--opl-tiles-resized-xpos)) translateY(var(--opl-tiles-resized-ypos));transform:translateX(var(--opl-tiles-resized-xpos)) translateY(var(--opl-tiles-resized-ypos));width:var(--opl-tiles-resized-width);height:var(--opl-tiles-resized-height)}}@keyframes opl-tile-resize{0%{-moz-animation-timing-function:cubic-bezier(1, -0.04, 1, 0.55);-webkit-animation-timing-function:cubic-bezier(1, -0.04, 1, 0.55);animation-timing-function:cubic-bezier(1, -0.04, 1, 0.55);-moz-transform:translateX(var(--opl-tiles-enlarged-xpos)) translateY(var(--opl-tiles-enlarged-ypos));-ms-transform:translateX(var(--opl-tiles-enlarged-xpos)) translateY(var(--opl-tiles-enlarged-ypos));-webkit-transform:translateX(var(--opl-tiles-enlarged-xpos)) translateY(var(--opl-tiles-enlarged-ypos));transform:translateX(var(--opl-tiles-enlarged-xpos)) translateY(var(--opl-tiles-enlarged-ypos));width:var(--opl-tiles-enlarged-width);height:var(--opl-tiles-enlarged-height)}50%{-moz-transform:translateX(var(--opl-tiles-resized-xpos)) translateY(var(--opl-tiles-enlarged-ypos));-ms-transform:translateX(var(--opl-tiles-resized-xpos)) translateY(var(--opl-tiles-enlarged-ypos));-webkit-transform:translateX(var(--opl-tiles-resized-xpos)) translateY(var(--opl-tiles-enlarged-ypos));transform:translateX(var(--opl-tiles-resized-xpos)) translateY(var(--opl-tiles-enlarged-ypos));width:var(--opl-tiles-resized-width);height:var(--opl-tiles-enlarged-height)}100%{-moz-transform:translateX(var(--opl-tiles-resized-xpos)) translateY(var(--opl-tiles-resized-ypos));-ms-transform:translateX(var(--opl-tiles-resized-xpos)) translateY(var(--opl-tiles-resized-ypos));-webkit-transform:translateX(var(--opl-tiles-resized-xpos)) translateY(var(--opl-tiles-resized-ypos));transform:translateX(var(--opl-tiles-resized-xpos)) translateY(var(--opl-tiles-resized-ypos));width:var(--opl-tiles-resized-width);height:var(--opl-tiles-resized-height)}}@-moz-keyframes opl-tile-dissolve{0%{-moz-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);opacity:1}100%{opacity:0}}@-webkit-keyframes opl-tile-dissolve{0%{-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);opacity:1}100%{opacity:0}}@keyframes opl-tile-dissolve{0%{-moz-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);opacity:1}100%{opacity:0}}@-moz-keyframes opl-tile-resolve{0%{-moz-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);opacity:0}70%{opacity:1}}@-webkit-keyframes opl-tile-resolve{0%{-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);opacity:0}70%{opacity:1}}@keyframes opl-tile-resolve{0%{-moz-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);opacity:0}70%{opacity:1}}@-moz-keyframes opl-tile-reduce-resolve-dissolve{0%{-moz-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);opacity:1}10%{opacity:0}90%{opacity:0}100%{opacity:1}}@-webkit-keyframes opl-tile-reduce-resolve-dissolve{0%{-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);opacity:1}10%{opacity:0}90%{opacity:0}100%{opacity:1}}@keyframes opl-tile-reduce-resolve-dissolve{0%{-moz-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);opacity:1}10%{opacity:0}90%{opacity:0}100%{opacity:1}}opl-tiles{width:100%;width:100%}.opl-tiles{--opl-tiles-accent-color:#e2287b;--opl-tiles-background-color:#000;--opl-tiles-background-color-0:rgba(0,0,0,0.05);--opl-tiles-background-color-1:rgba(0,0,0,0.12);--opl-tiles-background-color-2:rgba(0,0,0,0.2);position:absolute;width:100%;height:100%;outline:none}.opl-tiles .opl-tile-wrapper{--opl-tiles-reduced-width:142px;--opl-tiles-reduced-height:80px;position:absolute;width:var(--opl-tiles-reduced-width);height:var(--opl-tiles-reduced-height);bottom:8px;-moz-transform:translateX(0px);-ms-transform:translateX(0px);-webkit-transform:translateX(0px);transform:translateX(0px);will-change:transform}.opl-tiles #opl-tiles>div,.opl-tiles #opl-tiles ul{height:100%}.opl-tiles.opl-focus{background-color:var(--opl-tiles-background-color-, rgba(0,0,0,0.05))}.opl-tiles .opl-past{opacity:0.5}.opl-tiles .opl-tiles-content>ul>li{will-change:opacity, transform;-moz-box-shadow:0px 0px 8px var(--opl-tiles-background-color-1, rgba(0,0,0,0.12)),0px 1px 2px var(--opl-tiles-background-color-2, rgba(0,0,0,0.2));-webkit-box-shadow:0px 0px 8px var(--opl-tiles-background-color-1, rgba(0,0,0,0.12)),0px 1px 2px var(--opl-tiles-background-color-2, rgba(0,0,0,0.2));box-shadow:0px 0px 8px var(--opl-tiles-background-color-1, rgba(0,0,0,0.12)),0px 1px 2px var(--opl-tiles-background-color-2, rgba(0,0,0,0.2))}.opl-tiles .opl-tiles-content>ul>li.opl-selected .opl-access-time,.opl-tiles .opl-tiles-content>ul>li.opl-selected .opl-access-time-icon{color:var(--opl-tiles-accent-color, #e2287b)}.opl-tiles .opl-tiles-content>ul>li.opl-posting{-moz-animation-name:opl-tiles-opacity-in;-webkit-animation-name:opl-tiles-opacity-in;animation-name:opl-tiles-opacity-in;-moz-animation-duration:50ms;-webkit-animation-duration:50ms;animation-duration:50ms;-moz-animation-fill-mode:forwards;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards}.opl-tiles .opl-tiles-content>ul>li.opl-masking{-moz-animation-name:opl-tiles-opacity-out;-webkit-animation-name:opl-tiles-opacity-out;animation-name:opl-tiles-opacity-out;-moz-animation-duration:50ms;-webkit-animation-duration:50ms;animation-duration:50ms;-moz-animation-fill-mode:forwards;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards}.opl-tiles .opl-tiles-content>ul>li.opl-masked{opacity:0;visibility:hidden}.opl-tiles .opl-tiles-content>ul>li.opl-enlarging{-moz-transform:translateX(var(--opl-tiles-reduced-xpos)) translateY(var(--opl-tiles-reduced-ypos));-ms-transform:translateX(var(--opl-tiles-reduced-xpos)) translateY(var(--opl-tiles-reduced-ypos));-webkit-transform:translateX(var(--opl-tiles-reduced-xpos)) translateY(var(--opl-tiles-reduced-ypos));transform:translateX(var(--opl-tiles-reduced-xpos)) translateY(var(--opl-tiles-reduced-ypos));width:var(--opl-tiles-reduced-width);height:var(--opl-tiles-reduced-height);-moz-animation-name:opl-tile-enlarge;-webkit-animation-name:opl-tile-enlarge;animation-name:opl-tile-enlarge;-moz-animation-duration:500ms;-webkit-animation-duration:500ms;animation-duration:500ms;-moz-animation-delay:100ms;-webkit-animation-delay:100ms;animation-delay:100ms;-moz-animation-fill-mode:forwards;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards}.opl-tiles .opl-tiles-content>ul>li.opl-enlarging.opl-past{opacity:1}.opl-tiles .opl-tiles-content>ul>li.opl-enlarging .opl-content{-moz-animation-name:opl-tile-dissolve;-webkit-animation-name:opl-tile-dissolve;animation-name:opl-tile-dissolve;-moz-animation-duration:50ms;-webkit-animation-duration:50ms;animation-duration:50ms;-moz-animation-delay:100ms;-webkit-animation-delay:100ms;animation-delay:100ms;-moz-animation-fill-mode:forwards;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards}.opl-tiles .opl-tiles-content>ul>li.opl-enlarged{-moz-transform:translateX(var(--opl-tiles-enlarged-xpos)) translateY(var(--opl-tiles-enlarged-ypos));-ms-transform:translateX(var(--opl-tiles-enlarged-xpos)) translateY(var(--opl-tiles-enlarged-ypos));-webkit-transform:translateX(var(--opl-tiles-enlarged-xpos)) translateY(var(--opl-tiles-enlarged-ypos));transform:translateX(var(--opl-tiles-enlarged-xpos)) translateY(var(--opl-tiles-enlarged-ypos));width:var(--opl-tiles-enlarged-width);height:var(--opl-tiles-enlarged-height)}.opl-tiles .opl-tiles-content>ul>li.opl-enlarged.opl-past{opacity:1}.opl-tiles .opl-tiles-content>ul>li.opl-enlarged .opl-content{-moz-animation-name:opl-tile-resolve;-webkit-animation-name:opl-tile-resolve;animation-name:opl-tile-resolve;-moz-animation-duration:50ms;-webkit-animation-duration:50ms;animation-duration:50ms;-moz-animation-delay:50ms;-webkit-animation-delay:50ms;animation-delay:50ms;-moz-animation-fill-mode:forwards;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards}.opl-tiles .opl-tiles-content>ul>li.opl-reducing{-moz-transform:translateX(var(--opl-tiles-enlarged-xpos)) translateY(var(--opl-tiles-enlarged-ypos));-ms-transform:translateX(var(--opl-tiles-enlarged-xpos)) translateY(var(--opl-tiles-enlarged-ypos));-webkit-transform:translateX(var(--opl-tiles-enlarged-xpos)) translateY(var(--opl-tiles-enlarged-ypos));transform:translateX(var(--opl-tiles-enlarged-xpos)) translateY(var(--opl-tiles-enlarged-ypos));width:var(--opl-tiles-enlarged-width);height:var(--opl-tiles-enlarged-height);-moz-animation-name:opl-tile-reduce;-webkit-animation-name:opl-tile-reduce;animation-name:opl-tile-reduce;-moz-animation-duration:500ms;-webkit-animation-duration:500ms;animation-duration:500ms;-moz-animation-fill-mode:forwards;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards}.opl-tiles .opl-tiles-content>ul>li.opl-reducing .opl-content{-moz-animation-name:opl-tile-reduce-resolve-dissolve;-webkit-animation-name:opl-tile-reduce-resolve-dissolve;animation-name:opl-tile-reduce-resolve-dissolve;-moz-animation-duration:700ms;-webkit-animation-duration:700ms;animation-duration:700ms;-moz-animation-fill-mode:forwards;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards}.opl-tiles .opl-tiles-content>ul>li.opl-resizing{-moz-transform:translateX(var(--opl-tiles-enlarged-xpos)) translateY(var(--opl-tiles-enlarged-ypos));-ms-transform:translateX(var(--opl-tiles-enlarged-xpos)) translateY(var(--opl-tiles-enlarged-ypos));-webkit-transform:translateX(var(--opl-tiles-enlarged-xpos)) translateY(var(--opl-tiles-enlarged-ypos));transform:translateX(var(--opl-tiles-enlarged-xpos)) translateY(var(--opl-tiles-enlarged-ypos));width:var(--opl-tiles-enlarged-width);height:var(--opl-tiles-enlarged-height);-moz-animation-name:opl-tile-resize;-webkit-animation-name:opl-tile-resize;animation-name:opl-tile-resize;-moz-animation-duration:50ms;-webkit-animation-duration:50ms;animation-duration:50ms;-moz-animation-fill-mode:forwards;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards}.opl-tiles .opl-tiles-content>ul>li.opl-resizing.opl-past{opacity:1}.opl-tiles .opl-tiles-content>ul>li.opl-resizing .opl-content{opacity:0}.opl-tiles .opl-tiles-content>ul>li.opl-resized{-moz-transform:translateX(var(--opl-tiles-resized-xpos)) translateY(var(--opl-tiles-resized-ypos));-ms-transform:translateX(var(--opl-tiles-resized-xpos)) translateY(var(--opl-tiles-resized-ypos));-webkit-transform:translateX(var(--opl-tiles-resized-xpos)) translateY(var(--opl-tiles-resized-ypos));transform:translateX(var(--opl-tiles-resized-xpos)) translateY(var(--opl-tiles-resized-ypos));width:var(--opl-tiles-resized-width);height:var(--opl-tiles-resized-height)}.opl-tiles .opl-tiles-content>ul>li.opl-resized.opl-past{opacity:1}.opl-tiles .opl-tiles-content>ul>li.opl-resized .opl-content{-moz-animation-name:opl-tile-resolve;-webkit-animation-name:opl-tile-resolve;animation-name:opl-tile-resolve;-moz-animation-duration:1000ms;-webkit-animation-duration:1000ms;animation-duration:1000ms;-moz-animation-fill-mode:forwards;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards}@-moz-keyframes opl-settings-item-ripple-radius-in{from{-moz-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-moz-transform:scale(0, 0);transform:scale(0, 0)}to{-moz-transform:scale(11, 11);transform:scale(11, 11)}}@-webkit-keyframes opl-settings-item-ripple-radius-in{from{-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-transform:scale(0, 0);transform:scale(0, 0)}to{-webkit-transform:scale(11, 11);transform:scale(11, 11)}}@keyframes opl-settings-item-ripple-radius-in{from{-moz-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-moz-transform:scale(0, 0);-ms-transform:scale(0, 0);-webkit-transform:scale(0, 0);transform:scale(0, 0)}to{-moz-transform:scale(11, 11);-ms-transform:scale(11, 11);-webkit-transform:scale(11, 11);transform:scale(11, 11)}}@-moz-keyframes opl-settings-item-ripple-resolve{from{-moz-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);opacity:0}to{opacity:0.32}}@-webkit-keyframes opl-settings-item-ripple-resolve{from{-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);opacity:0}to{opacity:0.32}}@keyframes opl-settings-item-ripple-resolve{from{-moz-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);opacity:0}to{opacity:0.32}}@-moz-keyframes opl-settings-item-ripple-dissolve{from{-moz-animation-timing-function:linear;animation-timing-function:linear}to{opacity:0}}@-webkit-keyframes opl-settings-item-ripple-dissolve{from{-webkit-animation-timing-function:linear;animation-timing-function:linear}to{opacity:0}}@keyframes opl-settings-item-ripple-dissolve{from{-moz-animation-timing-function:linear;-webkit-animation-timing-function:linear;animation-timing-function:linear}to{opacity:0}}@-moz-keyframes opl-settings-grow{0%{-moz-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);width:0;height:0}100%{-moz-transform:translateX(-194px);transform:translateX(-194px);width:226px;height:var(--opl-settings-dialog-height)}}@-webkit-keyframes opl-settings-grow{0%{-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);width:0;height:0}100%{-webkit-transform:translateX(-194px);transform:translateX(-194px);width:226px;height:var(--opl-settings-dialog-height)}}@keyframes opl-settings-grow{0%{-moz-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);width:0;height:0}100%{-moz-transform:translateX(-194px);-ms-transform:translateX(-194px);-webkit-transform:translateX(-194px);transform:translateX(-194px);width:226px;height:var(--opl-settings-dialog-height)}}@-moz-keyframes opl-settings-reduce{from{-moz-animation-timing-function:linear;animation-timing-function:linear;-moz-transform:translateX(-194px);transform:translateX(-194px);width:226px;height:var(--opl-settings-dialog-height)}to{width:0;height:0}}@-webkit-keyframes opl-settings-reduce{from{-webkit-animation-timing-function:linear;animation-timing-function:linear;-webkit-transform:translateX(-194px);transform:translateX(-194px);width:226px;height:var(--opl-settings-dialog-height)}to{width:0;height:0}}@keyframes opl-settings-reduce{from{-moz-animation-timing-function:linear;-webkit-animation-timing-function:linear;animation-timing-function:linear;-moz-transform:translateX(-194px);-ms-transform:translateX(-194px);-webkit-transform:translateX(-194px);transform:translateX(-194px);width:226px;height:var(--opl-settings-dialog-height)}to{width:0;height:0}}@-moz-keyframes opl-settings-resolve{from{-moz-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);opacity:0}to{opacity:1}}@-webkit-keyframes opl-settings-resolve{from{-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);opacity:0}to{opacity:1}}@keyframes opl-settings-resolve{from{-moz-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);opacity:0}to{opacity:1}}@-moz-keyframes opl-settings-dissolve{from{-moz-animation-timing-function:linear;animation-timing-function:linear;opacity:1}to{opacity:0}}@-webkit-keyframes opl-settings-dissolve{from{-webkit-animation-timing-function:linear;animation-timing-function:linear;opacity:1}to{opacity:0}}@keyframes opl-settings-dissolve{from{-moz-animation-timing-function:linear;-webkit-animation-timing-function:linear;animation-timing-function:linear;opacity:1}to{opacity:0}}opl-settings{display:inline-block;width:32px;height:32px;vertical-align:top}.opl-settings{--opl-settings-primary-color:#fff;--opl-settings-primary-color-0:rgba(255,255,255,0.2);--opl-settings-primary-color-1:rgba(255,255,255,0.9);--opl-settings-background-color:#000;--opl-settings-background-color-0:rgba(0,0,0,0.8);--opl-settings-accent-color:#f63d98;position:relative;display:inline-block;width:32px;height:32px;vertical-align:top}.opl-settings .opl-dialog{position:absolute;bottom:64px;left:0;width:226px;background-color:var(--opl-settings-background-color-0, rgba(0,0,0,0.8));will-change:transform, opacity;opacity:0;-moz-box-shadow:0px 4px 24px var(--opl-settings-background-color, #000);-webkit-box-shadow:0px 4px 24px var(--opl-settings-background-color, #000);box-shadow:0px 4px 24px var(--opl-settings-background-color, #000);-moz-transform-origin:bottom left;-ms-transform-origin:bottom left;-webkit-transform-origin:bottom left;transform-origin:bottom left}.opl-settings.opl-posting .opl-dialog{-moz-animation-name:opl-settings-grow,opl-settings-resolve;-webkit-animation-name:opl-settings-grow,opl-settings-resolve;animation-name:opl-settings-grow,opl-settings-resolve;-moz-animation-duration:250ms,250ms;-webkit-animation-duration:250ms,250ms;animation-duration:250ms,250ms;-moz-animation-fill-mode:forwards,forwards;-webkit-animation-fill-mode:forwards,forwards;animation-fill-mode:forwards,forwards}.opl-settings.opl-posting .opl-dialog>div{-moz-animation-name:opl-settings-resolve;-webkit-animation-name:opl-settings-resolve;animation-name:opl-settings-resolve;-moz-animation-duration:500ms;-webkit-animation-duration:500ms;animation-duration:500ms;-moz-animation-fill-mode:forwards;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards}.opl-settings.opl-masking .opl-dialog{-moz-animation-name:opl-settings-reduce,opl-settings-dissolve;-webkit-animation-name:opl-settings-reduce,opl-settings-dissolve;animation-name:opl-settings-reduce,opl-settings-dissolve;-moz-animation-duration:150ms,150ms;-webkit-animation-duration:150ms,150ms;animation-duration:150ms,150ms;-moz-animation-fill-mode:forwards,forwards;-webkit-animation-fill-mode:forwards,forwards;animation-fill-mode:forwards,forwards}.opl-settings.opl-masking .opl-dialog>div{-moz-animation-name:opl-settings-dissolve;-webkit-animation-name:opl-settings-dissolve;animation-name:opl-settings-dissolve;-moz-animation-duration:75ms;-webkit-animation-duration:75ms;animation-duration:75ms;-moz-animation-fill-mode:forwards;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards}.opl-settings.opl-posted .opl-dialog{opacity:1;width:226px;height:var(--opl-settings-dialog-height);-moz-transform:translateX(-194px);-ms-transform:translateX(-194px);-webkit-transform:translateX(-194px);transform:translateX(-194px)}.opl-settings.opl-posted .opl-dialog>div{opacity:1}.opl-settings h1{font-family:'Roboto-Medium', sans-serif;background-color:var(--opl-settings-primary-color-0, rgba(255,255,255,0.2));height:32px;margin:0;padding-left:8px;line-height:32px;letter-spacing:0.1px;font-size:14px;color:var(--opl-settings-primary-color-1, rgba(255,255,255,0.9))}.opl-settings ul{margin:0;padding:0;list-style:none}.opl-settings li{font-family:'Roboto', sans-serif;overflow:hidden;position:relative;height:32px;line-height:32px;padding:0 8px;outline:none;-webkit-tap-highlight-color:transparent;will-change:transform, opacity;cursor:pointer;text-overflow:ellipsis;white-space:nowrap;color:var(--opl-settings-primary-color-1, rgba(255,255,255,0.9));-moz-user-select:-moz-none;-ms-user-select:none;-webkit-user-select:none;user-select:none}.opl-settings li span{font-size:12px;vertical-align:middle}.opl-settings li .opl-item-label{padding-left:26px;letter-spacing:0.4px}.opl-settings li .opl-check{padding-top:5px;vertical-align:top;font-size:22px}.opl-settings li .opl-hd{font-size:22px}.opl-settings li::after,.opl-settings li::before{position:absolute;top:0;height:100%;content:'';opacity:0;pointer-events:none}.opl-settings li::before{-moz-transition-property:opacity;-o-transition-property:opacity;-webkit-transition-property:opacity;transition-property:opacity;-moz-transition-timing-function:linear;-o-transition-timing-function:linear;-webkit-transition-timing-function:linear;transition-timing-function:linear;-moz-transition-duration:15ms;-o-transition-duration:15ms;-webkit-transition-duration:15ms;transition-duration:15ms;left:0;width:100%;background-color:var(--opl-settings-primary-color, #fff)}.opl-settings li::after{-moz-transform:scale(0, 0);-ms-transform:scale(0, 0);-webkit-transform:scale(0, 0);transform:scale(0, 0);-moz-transform-origin:center center;-ms-transform-origin:center center;-webkit-transform-origin:center center;transform-origin:center center;left:-10%;width:20%;border-radius:50%;background-color:var(--opl-settings-primary-color, #fff)}.opl-settings li.opl-focus::before{opacity:0.24}.opl-settings li.opl-selected span{color:var(--opl-settings-accent-color, #f63d98)}.opl-settings li.opl-selected .opl-item-label{padding-left:0}.opl-settings li.opl-selected::before{background-color:var(--opl-settings-accent-color, #f63d98)}.opl-settings li.opl-selected::after{background-color:var(--opl-settings-accent-color, #f63d98)}.opl-settings li:hover::before{opacity:0.078}.opl-settings li.opl-item-activation::after{-moz-animation-name:opl-settings-item-ripple-radius-in,opl-settings-item-ripple-resolve;-webkit-animation-name:opl-settings-item-ripple-radius-in,opl-settings-item-ripple-resolve;animation-name:opl-settings-item-ripple-radius-in,opl-settings-item-ripple-resolve;-moz-animation-duration:225ms,75ms;-webkit-animation-duration:225ms,75ms;animation-duration:225ms,75ms;-moz-animation-fill-mode:forwards,forwards;-webkit-animation-fill-mode:forwards,forwards;animation-fill-mode:forwards,forwards}.opl-settings li.opl-item-deactivation::after{-moz-animation-name:opl-settings-item-ripple-dissolve;-webkit-animation-name:opl-settings-item-ripple-dissolve;animation-name:opl-settings-item-ripple-dissolve;-moz-animation-duration:150ms;-webkit-animation-duration:150ms;animation-duration:150ms;-moz-transform:scale(1, 1);-ms-transform:scale(1, 1);-webkit-transform:scale(1, 1);transform:scale(1, 1)}@-moz-keyframes opl-slider-emphasize{0%{-moz-animation-timing-function:ease-out;animation-timing-function:ease-out}50%{-moz-animation-timing-function:ease-in;animation-timing-function:ease-in;-moz-transform:scale(.85, .85);transform:scale(.85, .85)}100%{-moz-transform:scale(.5, .5);transform:scale(.5, .5)}}@-webkit-keyframes opl-slider-emphasize{0%{-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}50%{-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;-webkit-transform:scale(.85, .85);transform:scale(.85, .85)}100%{-webkit-transform:scale(.5, .5);transform:scale(.5, .5)}}@keyframes opl-slider-emphasize{0%{-moz-animation-timing-function:ease-out;-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}50%{-moz-animation-timing-function:ease-in;-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;-moz-transform:scale(.85, .85);-ms-transform:scale(.85, .85);-webkit-transform:scale(.85, .85);transform:scale(.85, .85)}100%{-moz-transform:scale(.5, .5);-ms-transform:scale(.5, .5);-webkit-transform:scale(.5, .5);transform:scale(.5, .5)}}opl-slider{display:inline-block;width:100%;height:32px}.opl-slider{--opl-slider-primary-color:#000;--opl-slider-primary-color-0:rgba(0,0,0,0.098);--opl-slider-accent-color:#000;position:relative;width:100%;height:32px;cursor:pointer;touch-action:pan-x;-webkit-tap-highlight-color:transparent}.opl-slider .opl-slider-track-container{position:absolute;top:14px;width:100%;height:4px;background-color:var(--opl-slider-primary-color-0, rgba(0,0,0,0.098));overflow:hidden}.opl-slider .opl-slider-track{position:absolute;width:100%;height:100%;background-color:var(--opl-slider-accent-color, #000);-moz-transform-origin:left top;-ms-transform-origin:left top;-webkit-transform-origin:left top;transform-origin:left top;will-change:transform}.opl-slider .opl-slider-thumb-container{position:absolute;width:32px;height:32px;-moz-transform:translateX(-50%);-ms-transform:translateX(-50%);-webkit-transform:translateX(-50%);transform:translateX(-50%)}.opl-slider .opl-slider-thumb{position:absolute;top:4px;left:4px;fill:var(--opl-slider-accent-color, #000);stroke:var(--opl-slider-accent-color, #000);-moz-transform:scale(.5, .5);-ms-transform:scale(.5, .5);-webkit-transform:scale(.5, .5);transform:scale(.5, .5);-moz-transition-property:-moz-transform,fill,stroke,-webkit-transform;-o-transition-property:-o-transform,fill,stroke,-webkit-transform;-webkit-transition-property:-webkit-transform,fill,stroke,-webkit-transform;transition-property:transform,fill,stroke,-webkit-transform;-moz-transition-timing-function:ease-out,ease-out,ease-out,ease-out;-o-transition-timing-function:ease-out,ease-out,ease-out,ease-out;-webkit-transition-timing-function:ease-out,ease-out,ease-out,ease-out;transition-timing-function:ease-out,ease-out,ease-out,ease-out;-moz-transition-duration:0.1s,0.1s,0.1s,0.1s;-o-transition-duration:0.1s,0.1s,0.1s,0.1s;-webkit-transition-duration:0.1s,0.1s,0.1s,0.1s;transition-duration:0.1s,0.1s,0.1s,0.1s}.opl-slider .opl-slider-focus-ring{position:absolute;top:4px;left:4px;width:24px;height:24px;background-color:var(--opl-slider-accent-color, #000);border-radius:50%;opacity:0;-moz-transition-property:-moz-transform,opacity,-webkit-transform;-o-transition-property:-o-transform,opacity,-webkit-transform;-webkit-transition-property:-webkit-transform,opacity,-webkit-transform;transition-property:transform,opacity,-webkit-transform;-moz-transition-timing-function:ease-out,ease-out,ease-out;-o-transition-timing-function:ease-out,ease-out,ease-out;-webkit-transition-timing-function:ease-out,ease-out,ease-out;transition-timing-function:ease-out,ease-out,ease-out;-moz-transition-duration:0.26667s,0.26667s,0.26667s;-o-transition-duration:0.26667s,0.26667s,0.26667s;-webkit-transition-duration:0.26667s,0.26667s,0.26667s;transition-duration:0.26667s,0.26667s,0.26667s}.opl-slider:focus{outline:none}.opl-slider:focus:not(.opl-slider-active) .opl-slider-thumb-container,.opl-slider:focus:not(.opl-slider-active) .opl-slider-track{-moz-transition-property:-moz-transform,-webkit-transform;-o-transition-property:-o-transform,-webkit-transform;-webkit-transition-property:-webkit-transform,-webkit-transform;transition-property:transform,-webkit-transform;-moz-transition-timing-function:ease,ease;-o-transition-timing-function:ease,ease;-webkit-transition-timing-function:ease,ease;transition-timing-function:ease,ease;-moz-transition-duration:80ms,80ms,80ms;-o-transition-duration:80ms,80ms,80ms;-webkit-transition-duration:80ms,80ms,80ms;transition-duration:80ms,80ms,80ms}.opl-slider.opl-slider-in-transition .opl-slider-thumb-container,.opl-slider.opl-slider-in-transition .opl-slider-track{-moz-transition-property:-moz-transform,-webkit-transform;-o-transition-property:-o-transform,-webkit-transform;-webkit-transition-property:-webkit-transform,-webkit-transform;transition-property:transform,-webkit-transform;-moz-transition-timing-function:ease,ease;-o-transition-timing-function:ease,ease;-webkit-transition-timing-function:ease,ease;transition-timing-function:ease,ease;-moz-transition-duration:80ms,80ms,80ms;-o-transition-duration:80ms,80ms,80ms;-webkit-transition-duration:80ms,80ms,80ms;transition-duration:80ms,80ms,80ms}.opl-slider.opl-slider-in-transition .opl-slider-thumb{-moz-transition-delay:100ms;-o-transition-delay:100ms;-webkit-transition-delay:100ms;transition-delay:100ms}.opl-slider.opl-slider-focus .opl-slider-focus-ring{opacity:0.36;-moz-transform:scale3d(1.3333, 1.3333, 1.3333);-webkit-transform:scale3d(1.3333, 1.3333, 1.3333);transform:scale3d(1.3333, 1.3333, 1.3333)}.opl-slider.opl-slider-focus .opl-slider-thumb{-moz-animation:opl-slider-emphasize 0.26667s linear;-webkit-animation:opl-slider-emphasize 0.26667s linear;animation:opl-slider-emphasize 0.26667s linear}.opl-slider.opl-slider-active .opl-slider-thumb{-moz-transform:scale(1, 1);-ms-transform:scale(1, 1);-webkit-transform:scale(1, 1);transform:scale(1, 1)}opl-scroller{width:100%;height:100%}.opl-scroller{--opl-scroller-primary-color:#000;--opl-scroller-primary-color-0:rgba(0,0,0,0.2);--opl-scroller-primary-color-1:rgba(0,0,0,0.4);--opl-scroller-primary-color-2:rgba(0,0,0,0.6);position:relative;width:100%;height:100%;outline:0;-moz-user-select:-moz-none;-ms-user-select:none;-webkit-user-select:none;user-select:none}.opl-scroller .opl-scrollbar{position:absolute;z-index:2;opacity:0;background-color:var(--opl-scroller-primary-color-0, rgba(0,0,0,0.2));cursor:pointer;will-change:opacity}.opl-scroller.opl-vertical>.opl-scrollbar{right:0;width:8px;height:100%}.opl-scroller.opl-horizontal>.opl-scrollbar{bottom:0;width:100%;height:8px}.opl-scroller .opl-thumb{position:absolute;z-index:2;opacity:0;border-radius:8px;background-color:var(--opl-scroller-primary-color-0, rgba(0,0,0,0.2));cursor:pointer;will-change:opacity, transform;-moz-transition-property:-moz-transform,-webkit-transform,opacity;-o-transition-property:-o-transform,-webkit-transform,opacity;-webkit-transition-property:-webkit-transform,-webkit-transform,opacity;transition-property:transform,-webkit-transform,opacity;-moz-transition-timing-function:ease,ease,cubic-bezier(0.4, 0, 1, 1);-o-transition-timing-function:ease,ease,cubic-bezier(0.4, 0, 1, 1);-webkit-transition-timing-function:ease,ease,cubic-bezier(0.4, 0, 1, 1);transition-timing-function:ease,ease,cubic-bezier(0.4, 0, 1, 1);-moz-transition-duration:80ms,80ms,100ms;-o-transition-duration:80ms,80ms,100ms;-webkit-transition-duration:80ms,80ms,100ms;transition-duration:80ms,80ms,100ms}.opl-scroller .opl-thumb.opl-thumb-over{background-color:var(--opl-scroller-primary-color-1, rgba(0,0,0,0.4))}.opl-scroller .opl-thumb.opl-thumb-active{opacity:1;background-color:var(--opl-scroller-primary-color-2, rgba(0,0,0,0.6))}.opl-scroller.opl-vertical>.opl-thumb{top:0;right:2px;width:4px;-moz-transform-origin:top left;-ms-transform-origin:top left;-webkit-transform-origin:top left;transform-origin:top left;-moz-transform:translateY(0);-ms-transform:translateY(0);-webkit-transform:translateY(0);transform:translateY(0);-moz-transform:scaleX(1);-ms-transform:scaleX(1);-webkit-transform:scaleX(1);transform:scaleX(1)}.opl-scroller.opl-horizontal>.opl-thumb{bottom:2px;left:0;height:4px;-moz-transform-origin:bottom left;-ms-transform-origin:bottom left;-webkit-transform-origin:bottom left;transform-origin:bottom left;-moz-transform:translateX(0);-ms-transform:translateX(0);-webkit-transform:translateX(0);transform:translateX(0);-moz-transform:scaleY(1);-ms-transform:scaleY(1);-webkit-transform:scaleY(1);transform:scaleY(1)}.opl-scroller.opl-scroller-over>.opl-thumb,.opl-scroller.opl-scroller-focus>.opl-thumb{opacity:1}.opl-scroller .opl-scroller-content{position:relative;overflow:hidden;width:100%;height:100%}@-moz-keyframes opl-button-ripple-radius-in{from{-moz-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-moz-transform:scale(0, 0);transform:scale(0, 0)}to{-moz-transform:scale(1, 1);transform:scale(1, 1)}}@-webkit-keyframes opl-button-ripple-radius-in{from{-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-transform:scale(0, 0);transform:scale(0, 0)}to{-webkit-transform:scale(1, 1);transform:scale(1, 1)}}@keyframes opl-button-ripple-radius-in{from{-moz-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-moz-transform:scale(0, 0);-ms-transform:scale(0, 0);-webkit-transform:scale(0, 0);transform:scale(0, 0)}to{-moz-transform:scale(1, 1);-ms-transform:scale(1, 1);-webkit-transform:scale(1, 1);transform:scale(1, 1)}}@-moz-keyframes opl-button-ripple-resolve{from{-moz-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);opacity:0}to{opacity:0.16}}@-webkit-keyframes opl-button-ripple-resolve{from{-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);opacity:0}to{opacity:0.16}}@keyframes opl-button-ripple-resolve{from{-moz-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);opacity:0}to{opacity:0.16}}@-moz-keyframes opl-button-ripple-opacity-dissolve{from{-moz-animation-timing-function:linear;animation-timing-function:linear;opacity:0.16}to{opacity:0}}@-webkit-keyframes opl-button-ripple-opacity-dissolve{from{-webkit-animation-timing-function:linear;animation-timing-function:linear;opacity:0.16}to{opacity:0}}@keyframes opl-button-ripple-opacity-dissolve{from{-moz-animation-timing-function:linear;-webkit-animation-timing-function:linear;animation-timing-function:linear;opacity:0.16}to{opacity:0}}opl-button{display:inline-block;width:32px;height:32px}.opl-button{--opl-button-primary-color:#000;position:relative;display:inline-block;width:32px;height:32px;-webkit-tap-highlight-color:transparent;will-change:transform, opacity;padding:4px;outline:none;border:none;background-color:transparent;cursor:pointer;color:var(--opl-button-primary-color, #000);-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;-moz-user-select:-moz-none;-ms-user-select:none;-webkit-user-select:none;user-select:none}.opl-button::before,.opl-button::after{position:absolute;top:0;left:0;width:100%;height:100%;content:'';opacity:0;border-radius:50%;pointer-events:none}.opl-button::before{-moz-transition-property:opacity;-o-transition-property:opacity;-webkit-transition-property:opacity;transition-property:opacity;-moz-transition-timing-function:linear;-o-transition-timing-function:linear;-webkit-transition-timing-function:linear;transition-timing-function:linear;-moz-transition-duration:15ms;-o-transition-duration:15ms;-webkit-transition-duration:15ms;transition-duration:15ms;background-color:var(--opl-button-primary-color, #000)}.opl-button::after{-moz-transform:scale(0, 0);-ms-transform:scale(0, 0);-webkit-transform:scale(0, 0);transform:scale(0, 0);-moz-transform-origin:center center;-ms-transform-origin:center center;-webkit-transform-origin:center center;transform-origin:center center;background-color:var(--opl-button-primary-color, #000)}.opl-button:hover::before{opacity:0.04}.opl-button.opl-focus::before{-moz-transition-duration:75ms;-o-transition-duration:75ms;-webkit-transition-duration:75ms;transition-duration:75ms;opacity:0.12}.opl-button.opl-activation::after{-moz-animation-name:opl-button-ripple-radius-in,opl-button-ripple-resolve;-webkit-animation-name:opl-button-ripple-radius-in,opl-button-ripple-resolve;animation-name:opl-button-ripple-radius-in,opl-button-ripple-resolve;-moz-animation-duration:225ms,75ms;-webkit-animation-duration:225ms,75ms;animation-duration:225ms,75ms;-moz-animation-fill-mode:forwards,forwards;-webkit-animation-fill-mode:forwards,forwards;animation-fill-mode:forwards,forwards}.opl-button.opl-deactivation::after{-moz-animation-name:opl-button-ripple-opacity-dissolve;-webkit-animation-name:opl-button-ripple-opacity-dissolve;animation-name:opl-button-ripple-opacity-dissolve;-moz-animation-duration:150ms;-webkit-animation-duration:150ms;animation-duration:150ms;-moz-transform:scale(1, 1);-ms-transform:scale(1, 1);-webkit-transform:scale(1, 1);transform:scale(1, 1)}@-moz-keyframes opl-toggle-icon-button-ripple-radius-in{from{-moz-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-moz-transform:scale(0, 0);transform:scale(0, 0)}to{-moz-transform:scale(1, 1);transform:scale(1, 1)}}@-webkit-keyframes opl-toggle-icon-button-ripple-radius-in{from{-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-transform:scale(0, 0);transform:scale(0, 0)}to{-webkit-transform:scale(1, 1);transform:scale(1, 1)}}@keyframes opl-toggle-icon-button-ripple-radius-in{from{-moz-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-moz-transform:scale(0, 0);-ms-transform:scale(0, 0);-webkit-transform:scale(0, 0);transform:scale(0, 0)}to{-moz-transform:scale(1, 1);-ms-transform:scale(1, 1);-webkit-transform:scale(1, 1);transform:scale(1, 1)}}@-moz-keyframes opl-toggle-icon-button-ripple-opacity-in{from{-moz-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);opacity:0}to{opacity:0.16}}@-webkit-keyframes opl-toggle-icon-button-ripple-opacity-in{from{-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);opacity:0}to{opacity:0.16}}@keyframes opl-toggle-icon-button-ripple-opacity-in{from{-moz-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);opacity:0}to{opacity:0.16}}@-moz-keyframes opl-toggle-icon-button-ripple-opacity-out{from{-moz-animation-timing-function:linear;animation-timing-function:linear;opacity:0.16}to{opacity:0}}@-webkit-keyframes opl-toggle-icon-button-ripple-opacity-out{from{-webkit-animation-timing-function:linear;animation-timing-function:linear;opacity:0.16}to{opacity:0}}@keyframes opl-toggle-icon-button-ripple-opacity-out{from{-moz-animation-timing-function:linear;-webkit-animation-timing-function:linear;animation-timing-function:linear;opacity:0.16}to{opacity:0}}opl-toggle-icon-button{display:inline-block;width:32px;height:32px;vertical-align:top}.opl-toggle-icon-button{--opl-toggle-icon-button-primary-color:#000;position:relative;display:inline-block;width:32px;height:32px;-webkit-tap-highlight-color:transparent;will-change:transform, opacity;padding:4px;vertical-align:top;outline:none;border:none;background-color:transparent;cursor:pointer;color:var(--opl-toggle-icon-button-primary-color, #000);-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;-moz-user-select:-moz-none;-ms-user-select:none;-webkit-user-select:none;user-select:none}.opl-toggle-icon-button::before,.opl-toggle-icon-button::after{position:absolute;top:0;left:0;width:100%;height:100%;content:'';opacity:0;border-radius:50%;pointer-events:none}.opl-toggle-icon-button::before{-moz-transition-property:opacity;-o-transition-property:opacity;-webkit-transition-property:opacity;transition-property:opacity;-moz-transition-timing-function:linear;-o-transition-timing-function:linear;-webkit-transition-timing-function:linear;transition-timing-function:linear;-moz-transition-duration:15ms;-o-transition-duration:15ms;-webkit-transition-duration:15ms;transition-duration:15ms;background-color:var(--opl-toggle-icon-button-primary-color, #000)}.opl-toggle-icon-button::after{-moz-transform:scale(0, 0);-ms-transform:scale(0, 0);-webkit-transform:scale(0, 0);transform:scale(0, 0);-moz-transform-origin:center center;-ms-transform-origin:center center;-webkit-transform-origin:center center;transform-origin:center center;background-color:var(--opl-toggle-icon-button-primary-color, #000)}.opl-toggle-icon-button:hover::before{opacity:0.04}.opl-toggle-icon-button.opl-focus::before{-moz-transition-duration:75ms;-o-transition-duration:75ms;-webkit-transition-duration:75ms;transition-duration:75ms;opacity:0.12}.opl-toggle-icon-button.opl-activation::after{-moz-animation-name:opl-toggle-icon-button-ripple-radius-in,opl-toggle-icon-button-ripple-opacity-in;-webkit-animation-name:opl-toggle-icon-button-ripple-radius-in,opl-toggle-icon-button-ripple-opacity-in;animation-name:opl-toggle-icon-button-ripple-radius-in,opl-toggle-icon-button-ripple-opacity-in;-moz-animation-duration:225ms,75ms;-webkit-animation-duration:225ms,75ms;animation-duration:225ms,75ms;-moz-animation-fill-mode:forwards,forwards;-webkit-animation-fill-mode:forwards,forwards;animation-fill-mode:forwards,forwards}.opl-toggle-icon-button.opl-deactivation::after{-moz-animation-name:opl-toggle-icon-button-ripple-opacity-out;-webkit-animation-name:opl-toggle-icon-button-ripple-opacity-out;animation-name:opl-toggle-icon-button-ripple-opacity-out;-moz-animation-duration:150ms;-webkit-animation-duration:150ms;animation-duration:150ms;-moz-transform:scale(1, 1);-ms-transform:scale(1, 1);-webkit-transform:scale(1, 1);transform:scale(1, 1)}opl-volume{display:inline-block;height:32px}.opl-volume{display:inline-block;overflow:hidden;height:32px;vertical-align:top}.opl-volume opl-slider,.opl-volume .opl-slider{width:62px}.opl-volume>div{display:inline-block;width:0;opacity:0;margin-left:8px;vertical-align:top;will-change:opacity;-moz-transition-property:width,opacity;-o-transition-property:width,opacity;-webkit-transition-property:width,opacity;transition-property:width,opacity;-moz-transition-timing-function:cubic-bezier(0.4, 0, 1, 1),cubic-bezier(0.4, 0, 1, 1);-o-transition-timing-function:cubic-bezier(0.4, 0, 1, 1),cubic-bezier(0.4, 0, 1, 1);-webkit-transition-timing-function:cubic-bezier(0.4, 0, 1, 1),cubic-bezier(0.4, 0, 1, 1);transition-timing-function:cubic-bezier(0.4, 0, 1, 1),cubic-bezier(0.4, 0, 1, 1);-moz-transition-duration:100ms,100ms;-o-transition-duration:100ms,100ms;-webkit-transition-duration:100ms,100ms;transition-duration:100ms,100ms}.opl-volume.opl-over,.opl-volume.opl-volume-focus{overflow:visible}.opl-volume.opl-over>div,.opl-volume.opl-volume-focus>div{width:62px;opacity:1;margin:0 12px}@-moz-keyframes opl-preview-loader-elastic{0%{-moz-animation-timing-function:cubic-bezier(0.35, 0.35, 0.43, 0.9);animation-timing-function:cubic-bezier(0.35, 0.35, 0.43, 0.9);-moz-transform:translateX(0%);transform:translateX(0%)}50%{-moz-animation-timing-function:cubic-bezier(0.35, 0.35, 0.43, 0.9);animation-timing-function:cubic-bezier(0.35, 0.35, 0.43, 0.9);-moz-transform:translateX(100%);transform:translateX(100%)}100%{-moz-transform:translateX(0%);transform:translateX(0%)}}@-webkit-keyframes opl-preview-loader-elastic{0%{-webkit-animation-timing-function:cubic-bezier(0.35, 0.35, 0.43, 0.9);animation-timing-function:cubic-bezier(0.35, 0.35, 0.43, 0.9);-webkit-transform:translateX(0%);transform:translateX(0%)}50%{-webkit-animation-timing-function:cubic-bezier(0.35, 0.35, 0.43, 0.9);animation-timing-function:cubic-bezier(0.35, 0.35, 0.43, 0.9);-webkit-transform:translateX(100%);transform:translateX(100%)}100%{-webkit-transform:translateX(0%);transform:translateX(0%)}}@keyframes opl-preview-loader-elastic{0%{-moz-animation-timing-function:cubic-bezier(0.35, 0.35, 0.43, 0.9);-webkit-animation-timing-function:cubic-bezier(0.35, 0.35, 0.43, 0.9);animation-timing-function:cubic-bezier(0.35, 0.35, 0.43, 0.9);-moz-transform:translateX(0%);-ms-transform:translateX(0%);-webkit-transform:translateX(0%);transform:translateX(0%)}50%{-moz-animation-timing-function:cubic-bezier(0.35, 0.35, 0.43, 0.9);-webkit-animation-timing-function:cubic-bezier(0.35, 0.35, 0.43, 0.9);animation-timing-function:cubic-bezier(0.35, 0.35, 0.43, 0.9);-moz-transform:translateX(100%);-ms-transform:translateX(100%);-webkit-transform:translateX(100%);transform:translateX(100%)}100%{-moz-transform:translateX(0%);-ms-transform:translateX(0%);-webkit-transform:translateX(0%);transform:translateX(0%)}}opl-preview{width:100%;height:100%}.opl-preview{position:relative;--opl-preview-primary-color:#fff;--opl-preview-accent-color:#e2287b;--opl-preview-accent-color-0:rgba(226,40,123,0.1);--opl-preview-background-color:#000;--opl-preview-background-color-0:rgba(0,0,0,0.8);width:100%;height:100%;background-color:var(--opl-preview-background-color, #000);-moz-user-select:-moz-none;-ms-user-select:none;-webkit-user-select:none;user-select:none}.opl-preview .opl-time{position:absolute;display:flex;width:100%;justify-content:center;bottom:0;font-size:12px;letter-spacing:0.4px;color:var(--opl-preview-primary-color, #fff)}.opl-preview .opl-time>div{flex-shrink:1;background-color:var(--opl-preview-background-color-0, rgba(0,0,0,0.8));padding:8px}.opl-preview .opl-loader{position:absolute;top:0;left:0;width:100%;height:4px;background-color:var(--opl-preview-accent-color-0, rgba(226,40,123,0.1));will-change:transform}.opl-preview .opl-loader::before{position:absolute;top:0;left:0;width:50%;height:100%;content:'';pointer-events:none;background-color:var(--opl-preview-accent-color, #e2287b);-moz-animation-name:opl-preview-loader-elastic;-webkit-animation-name:opl-preview-loader-elastic;animation-name:opl-preview-loader-elastic;-moz-animation-iteration-count:infinite;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-moz-animation-duration:2000ms;-webkit-animation-duration:2000ms;animation-duration:2000ms}.opl-preview .opl-error-message{padding-top:16px;text-align:center;letter-spacing:5px;font-size:12px;color:var(--opl-preview-primary-color, #fff)}opl-tabs{position:absolute;top:0;left:0;height:100%;width:100%}.opl-tabs{--opl-tabs-background-color:#fff;--opl-tabs-primary-color:#000;--opl-tabs-primary-color-0:rgba(0,0,0,0.05);--opl-tabs-primary-color-1:rgba(0,0,0,0.12);--opl-tabs-primary-color-2:rgba(0,0,0,0.541);--opl-tabs-accent-color:#e6007e;height:100%;width:100%}.opl-tabs>div{overflow:hidden;position:absolute;left:32px;top:0;right:0;height:100%;border-bottom:1px solid var(--opl-tabs-primary-color-0, rgba(0,0,0,0.05));-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}.opl-tabs opl-view,.opl-tabs opl-view>div{height:100%;width:100%}.opl-tabs .opl-tabs-wrapper{z-index:1;position:absolute;left:0;height:100%;width:32px;-moz-box-shadow:0px 4px 4px var(--opl-tabs-primary-color-1, rgba(0,0,0,0.12));-webkit-box-shadow:0px 4px 4px var(--opl-tabs-primary-color-1, rgba(0,0,0,0.12));box-shadow:0px 4px 4px var(--opl-tabs-primary-color-1, rgba(0,0,0,0.12));background-color:var(--opl-tabs-background-color, #fff)}.opl-tabs .opl-tabs-wrapper ul{position:absolute;bottom:0;outline:none}.opl-tabs .opl-tabs-wrapper.opl-focus{background-color:var(--opl-tabs-primary-color-0, rgba(0,0,0,0.05))}.opl-tabs .opl-tabs-wrapper button{color:var(--opl-tabs-primary-color-2, rgba(0,0,0,0.541))}.opl-tabs .opl-tabs-wrapper button::before,.opl-tabs .opl-tabs-wrapper button::after{background-color:var(--opl-tabs-primary-color, #000)}.opl-tabs .opl-tabs-wrapper .opl-selected button{color:var(--opl-tabs-accent-color, #e6007e)}.opl-tabs .opl-tabs-wrapper .opl-selected button::before,.opl-tabs .opl-tabs-wrapper .opl-selected button::after{background-color:var(--opl-tabs-accent-color, #e6007e)}.opl-tabs.opl-no-tabs>div{left:0}.opl-tabs.opl-no-tabs .opl-tabs-wrapper{display:none}