.html5-video-player {
position: relative;
width: 100%;
height: 100%;
background-color: #000;
overflow: hidden;
outline: 0;
font-family: Roboto, Arial, Helvetica, sans-serif;
color: #eee;
text-align: left;
direction: ltr;
font-size: 11px;
line-height: 1.3;
-webkit-font-smoothing: antialiased;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
touch-action: manipulation;
contain: strict
}
.ytp-native-controls {
contain: size layout style
}
.ytp-big-mode {
font-size: 17px
}
.ytp-autohide {
cursor: none
}
.html5-video-player a {
color: inherit;
text-decoration: none;
-moz-transition: color 0.1s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition: color 0.1s cubic-bezier(0, 0, 0.2, 1);
transition: color 0.1s cubic-bezier(0, 0, 0.2, 1);
outline: 0
}
.html5-video-player a:hover {
color: #fff;
-moz-transition: color 0.1s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: color 0.1s cubic-bezier(0.4, 0, 1, 1);
transition: color 0.1s cubic-bezier(0.4, 0, 1, 1)
}
.ytp-probably-keyboard-focus a:focus {
box-shadow: inset 0 0 0 2px rgba(27, 127, 204, 0.8)
}
.html5-video-player svg {
pointer-events: none
}
.html5-video-player:not(.ytp-touch-mode) ::-webkit-scrollbar {
width: 10px;
background-color: #424242
}
.ytp-big-mode:not(.ytp-touch-mode) ::-webkit-scrollbar {
width: 15px
}
.html5-video-player:not(.ytp-touch-mode) ::-webkit-scrollbar-track {
background-color: #424242
}
.html5-video-player:not(.ytp-touch-mode) ::-webkit-scrollbar-thumb {
background-color: #8e8e8e;
border: 1px solid #424242;
border-radius: 5px
}
.ytp-big-mode:not(.ytp-touch-mode) ::-webkit-scrollbar-thumb {
border-radius: 8px
}
.html5-video-container {
z-index: 10;
position: relative
}
.html5-main-video {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
outline: 0
}
.html5-main-video[data-no-fullscreen=true]::-webkit-media-controls-fullscreen-button {
display: none
}
.html5-main-video:not([controls])::-webkit-media-controls {
display: none
}
.html5-main-video:not([controls])::-webkit-media-controls-start-playback-button {
display: none
}
.html5-main-video::-webkit-media-controls-timeline {
display: inline
}
@media screen and (max-width: 325px) {
.html5-main-video::-webkit-media-controls-wireless-playback-picker-button {
display: none
}
}
.html5-main-video::-webkit-media-controls-current-time-display {
display: -webkit-flex
}
.html5-main-video::-webkit-media-controls-time-remaining-display {
display: -webkit-flex
}
.ytp-player-content {
position: absolute;
left: 0;
right: 0;
top: 48px;
bottom: 49px;
-moz-transition: bottom 0.25s cubic-bezier(0, 0, 0.2, 1), top 0.25s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition: bottom 0.25s cubic-bezier(0, 0, 0.2, 1), top 0.25s cubic-bezier(0, 0, 0.2, 1);
transition: bottom 0.25s cubic-bezier(0, 0, 0.2, 1), top 0.25s cubic-bezier(0, 0, 0.2, 1)
}
.ytp-big-mode .ytp-player-content {
top: 69px;
bottom: 70px
}
.ytp-player-content.ytp-iv-player-content {
left: 12px;
right: 12px
}
.ytp-big-mode .ytp-player-content.ytp-iv-player-content {
left: 24px;
right: 24px
}
.ytp-autohide .ytp-player-content:not(.html5-endscreen), .ytp-hide-info-bar .ytp-player-content {
top: 0;
-moz-transition: bottom 0.1s cubic-bezier(0.4, 0, 1, 1), top 0.1s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: bottom 0.1s cubic-bezier(0.4, 0, 1, 1), top 0.1s cubic-bezier(0.4, 0, 1, 1);
transition: bottom 0.1s cubic-bezier(0.4, 0, 1, 1), top 0.1s cubic-bezier(0.4, 0, 1, 1)
}
.ytp-hide-controls .ytp-player-content {
bottom: 0
}
.ytp-autohide:not(.ytp-ad-overlay-open) .ytp-iv-player-content, .ytp-hide-controls .ytp-iv-player-content {
bottom: 12px
}
.ytp-ad-overlay-open .ytp-player-content {
bottom: 139px
}
.ytp-big-mode.ytp-autohide:not(.ytp-ad-overlay-open) .ytp-iv-player-content, .ytp-big-mode.ytp-hide-controls .ytp-iv-player-content {
bottom: 24px
}
.ytp-big-mode.ytp-ad-overlay-open .ytp-player-content {
bottom: 160px
}
.ytp-button {
border: none;
background-color: transparent;
padding: 0;
color: inherit;
text-align: inherit;
font-size: 100%;
font-family: inherit;
cursor: default;
line-height: inherit
}
.ytp-button:focus, .ytp-button {
outline: 0
}
.ytp-button::-moz-focus-inner {
padding: 0;
border: 0
}
.html5-video-player .ytp-button[aria-disabled=true], .html5-video-player .ytp-button[disabled] {
opacity: 0.5
}
.ytp-button:not([aria-disabled=true]):not([disabled]):not([aria-hidden=true]) {
cursor: pointer
}
.ytp-probably-keyboard-focus .ytp-button:focus {
box-shadow: inset 0 0 0 2px rgba(27, 127, 204, 0.8)
}
.ytp-chrome-top, .ytp-chrome-bottom {
position: absolute;
text-shadow: 0 0 2px rgba(0, 0, 0, 0.5)
}
.ytp-dni .ytp-chrome-bottom {
text-shadow: none
}
.ytp-chrome-top {
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
-ms-flex-pack: end;
justify-content: flex-end;
left: 12px;
right: 12px;
top: 0;
z-index: 60
}
.ytp-chrome-top.ytp-cards-available {
right: 48px
}
.ytp-big-mode .ytp-chrome-top.ytp-cards-available {
right: 78px
}
.ytp-chrome-bottom {
bottom: 0;
height: 36px;
width: 100%;
z-index: 61;
padding-top: 3px;
text-align: left;
direction: ltr
}
.ytp-big-mode .ytp-chrome-bottom {
height: 54px;
padding-top: 4px
}
.ytp-chrome-top .ytp-button, .ytp-chrome-controls .ytp-button, .ytp-replay-button {
opacity: 0.9;
display: inline-block;
width: 36px;
-moz-transition: opacity 0.1s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: opacity 0.1s cubic-bezier(0.4, 0, 1, 1);
transition: opacity 0.1s cubic-bezier(0.4, 0, 1, 1);
overflow: hidden
}
.ytp-exp-std-controls .ytp-button {
opacity: 1
}
.ytp-chrome-top .ytp-button {
padding-top: 6px;
height: 42px;
vertical-align: top
}
.ytp-big-mode .ytp-chrome-top .ytp-button {
padding-top: 9px;
height: 63px
}
.ytp-chrome-controls .ytp-button {
height: 100%
}
.ytp-big-mode .ytp-chrome-top .ytp-button, .ytp-big-mode .ytp-chrome-controls .ytp-button {
width: 54px
}
.ytp-prev-button::before {
content: "";
display: block;
height: 100%;
width: 12px;
position: absolute;
top: 0;
left: -12px
}
.ytp-play-button:not(.ytp-play-button-playlist)::before {
content: "";
display: block;
height: 100%;
width: 12px;
position: absolute;
top: 0;
left: -12px
}
.ytp-big-mode .ytp-prev-button::before, .ytp-big-mode .ytp-play-button:not(.ytp-play-button-playlist)::before {
width: 24px;
left: -24px
}
.ytp-chrome-top .ytp-button:hover, .ytp-chrome-controls .ytp-button:not([aria-disabled=true]):not([disabled]):hover, .ytp-chrome-controls .ytp-button[aria-expanded=true], .ytp-chrome-controls .ytp-button[aria-pressed=true], .ytp-replay-button:hover {
opacity: 1;
-moz-transition: opacity 0.1s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition: opacity 0.1s cubic-bezier(0, 0, 0.2, 1);
transition: opacity 0.1s cubic-bezier(0, 0, 0.2, 1)
}
.ytp-svg-fill {
fill: #fff
}
.ytp-svg-shadow {
stroke: #000;
stroke-opacity: 0.15;
stroke-width: 2px;
fill: none
}
.ytp-dni .ytp-svg-shadow {
display: none
}
.ytp-svg-shadow-fill {
fill: #000;
fill-opacity: 0.15;
stroke: none
}
.ytp-chrome-controls .ytp-button[aria-pressed] {
position: relative
}
.ytp-chrome-controls .ytp-button[aria-pressed]:after {
content: "";
display: block;
position: absolute;
height: 2px;
border-radius: 2px;
width: 0;
left: 18px;
bottom: 6px;
background-color: #f12b24;
-moz-transition: left 0.1s cubic-bezier(0.4, 0, 1, 1), width 0.1s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: left 0.1s cubic-bezier(0.4, 0, 1, 1), width 0.1s cubic-bezier(0.4, 0, 1, 1);
transition: left 0.1s cubic-bezier(0.4, 0, 1, 1), width 0.1s cubic-bezier(0.4, 0, 1, 1)
}
.ytp-big-mode .ytp-chrome-controls .ytp-button[aria-pressed]:after {
height: 3px;
border-radius: 3px;
left: 27px;
bottom: 10px
}
.ytp-dni .ytp-chrome-controls .ytp-button[aria-pressed]:after {
background-color: #fff
}
.ytp-chrome-controls .ytp-button[aria-pressed=true]:after {
width: 18px;
left: 9px;
-moz-transition: left 0.25s cubic-bezier(0, 0, 0.2, 1), width 0.25s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition: left 0.25s cubic-bezier(0, 0, 0.2, 1), width 0.25s cubic-bezier(0, 0, 0.2, 1);
transition: left 0.25s cubic-bezier(0, 0, 0.2, 1), width 0.25s cubic-bezier(0, 0, 0.2, 1)
}
.ytp-big-mode .ytp-chrome-controls .ytp-button[aria-pressed=true]:after {
width: 27px;
left: 14px
}
.ytp-color-white .ytp-chrome-controls .ytp-button[aria-pressed]:after {
background-color: #ddd
}
.ytp-color-party .ytp-chrome-controls .ytp-button[aria-pressed]:after {
-moz-animation: ytp-party-background-color 0.1s linear infinite;
-webkit-animation: ytp-party-background-color 0.1s linear infinite;
animation: ytp-party-background-color 0.1s linear infinite
}
.ytp-chrome-top-buttons {
white-space: nowrap
}
.ytp-chrome-top:not(.ytp-share-button-visible) .ytp-share-button {
display: none
}
.ytp-chrome-controls {
height: 36px;
line-height: 36px;
font-size: 109%;
text-align: left;
direction: ltr
}
.ytp-big-mode .ytp-chrome-controls {
height: 54px;
line-height: 54px
}
.ytp-left-controls {
float: left;
height: 100%
}
.ytp-right-controls {
float: right;
height: 100%
}
.ytp-chrome-top, .ytp-chrome-bottom {
-moz-transition: opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition: opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
transition: opacity 0.25s cubic-bezier(0, 0, 0.2, 1)
}
.ytp-autohide .ytp-chrome-top, .ytp-autohide .ytp-chrome-bottom, .ytp-chrome-top[aria-hidden=true], .ytp-chrome-bottom[aria-hidden=true] {
opacity: 0;
-moz-transition: opacity 0.1s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: opacity 0.1s cubic-bezier(0.4, 0, 1, 1);
transition: opacity 0.1s cubic-bezier(0.4, 0, 1, 1)
}
.ytp-exp-std-controls .ytp-chrome-top, .ytp-exp-std-controls .ytp-chrome-bottom {
-moz-transition: none;
-webkit-transition: none;
transition: none
}
.ytp-gradient-top, .ytp-gradient-bottom {
height: 98px;
width: 100%;
position: absolute;
background-repeat: repeat-x;
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAADGCAYAAAAT+OqFAAAAdklEQVQoz42QQQ7AIAgEF/T/D+kbq/RWAlnQyyazA4aoAB4FsBSA/bFjuF1EOL7VbrIrBuusmrt4ZZORfb6ehbWdnRHEIiITaEUKa5EJqUakRSaEYBJSCY2dEstQY7AuxahwXFrvZmWl2rh4JZ07z9dLtesfNj5q0FU3A5ObbwAAAABJRU5ErkJggg==");
-moz-transition: opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition: opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
transition: opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
pointer-events: none
}
.ytp-big-mode .ytp-gradient-top, .ytp-big-mode .ytp-gradient-bottom {
height: 146px;
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAEmCAYAAACjy/qzAAAAhklEQVQ4y52RUQ6AMAxCKd7/JJ7R6aeJAdr507TjQZqOAE4CWARwx7JE944rch/k6qOWS7bq5bh72zGF8+LTa6goJeRPgXDYNxWFfkS0QXCInLIN1GxTXA0dtS0otWJnuXJR1Y9WYP9GF1UCYRQYHRSlXMARbVO4th3sd7Y3OP5dY3Bn+SkPsGJ1+HGGVtcAAAAASUVORK5CYII=")
}
.ytp-gradient-top[aria-hidden=true], .ytp-gradient-bottom[aria-hidden=true], .ytp-autohide .ytp-gradient-top, .ytp-autohide .ytp-gradient-bottom {
opacity: 0;
-moz-transition: opacity 0.1s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: opacity 0.1s cubic-bezier(0.4, 0, 1, 1);
transition: opacity 0.1s cubic-bezier(0.4, 0, 1, 1)
}
.ytp-exp-std-controls .ytp-gradient-top, .ytp-exp-std-controls .ytp-gradient-bottom {
-moz-transition: none;
-webkit-transition: none;
transition: none;
background: rgba(0, 0, 0, 0.55)
}
.ytp-exp-std-controls .ytp-gradient-top {
height: 48px
}
.ytp-big-mode.ytp-exp-std-controls .ytp-gradient-top {
height: 69px
}
.ytp-exp-std-controls .ytp-gradient-bottom {
height: 49px
}
.ytp-big-mode.ytp-exp-std-controls .ytp-gradient-bottom {
height: 70px
}
.ytp-gradient-top {
top: 0;
z-index: 23;
background-position: top
}
.ytp-gradient-bottom {
bottom: 0;
z-index: 22;
background-position: bottom
}
.ytp-hide-info-bar .ytp-gradient-top, .ytp-hide-info-bar .ytp-chrome-top .ytp-title, .ytp-hide-info-bar .ytp-chrome-top .ytp-playlist-menu-button, .ytp-hide-info-bar .ytp-chrome-top .ytp-chrome-top-buttons:not(.ytp-chrome-top-show-buttons), .ytp-hide-controls .ytp-gradient-bottom, .ytp-hide-controls .ytp-chrome-bottom {
display: none
}
@keyframes ytp-party-background-color {
0% {
background-color: #f00
} 20% {
background-color: #0f0
} 40% {
background-color: #00f
} 60% {
background-color: #f0f
} 80% {
background-color: #ff0
} to {
background-color: #0ff
}
}
@keyframes ytp-party-color {
0% {
color: #f00
} 20% {
color: #0f0
} 40% {
color: #00f
} 60% {
color: #f0f
} 80% {
color: #ff0
} to {
color: #0ff
}
}
@keyframes ytp-party-fill {
0% {
fill: #f00
} 20% {
fill: #0f0
} 40% {
fill: #00f
} 60% {
fill: #f0f
} 80% {
fill: #ff0
} to {
fill: #0ff
}
}
.ytp-menu-shown .video-ads {
display: none
}
.ytp-ad-display-override .video-ads {
display: inherit
}
.ytp-swatch-background-color, .ytp-swatch-background-color-secondary {
background-color: #f12b24
}
.ytp-dni .ytp-swatch-background-color, .ytp-dni .ytp-swatch-background-color-secondary {
background-color: #fff
}
.ytp-color-white .ytp-swatch-background-color {
background-color: #ddd
}
.ytp-color-white .ytp-swatch-background-color-secondary {
background-color: #aaa
}
.ytp-color-party .ytp-swatch-background-color, .ytp-color-party .ytp-swatch-background-color-secondary {
-moz-animation: ytp-party-background-color 0.1s linear infinite;
-webkit-animation: ytp-party-background-color 0.1s linear infinite;
animation: ytp-party-background-color 0.1s linear infinite
}
@media screen and (-ms-high-contrast: black-on-white) {
.ytp-swatch-background-color {
background-color: #000 !important
}
}
@media screen and (-ms-high-contrast: white-on-black) {
.ytp-swatch-background-color {
background-color: #fff !important
}
}
.ytp-swatch-color {
color: #f12b24
}
.ytp-dni .ytp-swatch-color {
color: #fff
}
.ytp-color-white .ytp-swatch-color {
color: #ddd
}
.ytp-color-party .ytp-swatch-color {
-moz-animation: ytp-party-color 0.15s linear infinite;
-webkit-animation: ytp-party-color 0.15s linear infinite;
animation: ytp-party-color 0.15s linear infinite
}
@media print {
.html5-video-player * {
visibility: hidden
}
.html5-video-player {
border: 1px #000 solid;
-moz-box-sizing: border-box;
box-sizing: border-box
}
.ytp-chrome-top, .ytp-thumbnail-overlay, .ytp-large-play-button {
opacity: 1 !important;
display: block !important;
visibility: visible !important
}
.ytp-title, .ytp-title *, .ytp-large-play-button * {
color: #000 !important;
visibility: visible !important
}
}
.video-ad-status-bar {
position: absolute;
bottom: 49px;
z-index: 33;
width: 100%;
background-color: #000;
opacity: 0.7;
display: none
}
.ytp-big-mode .video-ad-status-bar {
bottom: 70px
}
.ytp-hide-controls .video-ad-status-bar {
bottom: 0
}
.ad-interrupting .video-ad-status-bar {
display: block
}
.ad-interrupting.ytp-autohide .video-ad-status-bar, .ad-interrupting.ytp-hide-controls .video-ad-status-bar {
bottom: 0
}
.video-ad-label {
display: block;
margin-bottom: 5px
}
.ad-showing .ad-video {
position: absolute;
top: 0
}
.html5-video-player .video-click-tracking, .html5-video-player .video-stream {
display: block;
width: 100%;
height: 100%;
position: absolute
}
.html5-video-player .ad-container-single-media-element-annotations {
position: absolute;
z-index: 33
}
.html5-video-player.ytp-video-ad-learn-more-ui .ad-container-single-media-element-annotations {
z-index: auto
}
.html5-video-player.ytp-video-ad-learn-more-ui .ad-container-single-media-element-annotations iframe {
z-index: 33
}
.html5-video-player .ad-overlay {
position: absolute;
bottom: 49px;
width: 100%;
-moz-transition: bottom 0.25s cubic-bezier(0, 0, 0.2, 1), opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition: bottom 0.25s cubic-bezier(0, 0, 0.2, 1), opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
transition: bottom 0.25s cubic-bezier(0, 0, 0.2, 1), opacity 0.25s cubic-bezier(0, 0, 0.2, 1)
}
.ytp-ad-overlay-closed .ad-overlay {
display: none
}
.ytp-big-mode .ad-overlay {
bottom: 70px
}
.ytp-autohide.ytp-ad-overlay-closed .ad-overlay {
opacity: 0;
-moz-transition: bottom 0.1s cubic-bezier(0.4, 0, 1, 1), opacity 0.1s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: bottom 0.1s cubic-bezier(0.4, 0, 1, 1), opacity 0.1s cubic-bezier(0.4, 0, 1, 1);
transition: bottom 0.1s cubic-bezier(0.4, 0, 1, 1), opacity 0.1s cubic-bezier(0.4, 0, 1, 1)
}
.html5-video-player .ad-overlay .video-click-tracking {
display: none
}
.html5-video-player .ad-overlay > *:not(.ima-container) {
z-index: 36
}
.html5-video-player .ad-overlay > .ima-container {
z-index: auto !important
}
.html5-video-player .ad-overlay > .ima-container > * {
z-index: 36 !important;
position: relative
}
.ytp-hide-controls.videoAdUiRedesign .videoAdUiSkipContainer, .ytp-hide-controls.videoAdUiRedesign .videoAdUiPreSkipContainer {
-moz-transition: bottom 0.1s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: bottom 0.1s cubic-bezier(0.4, 0, 1, 1);
transition: bottom 0.1s cubic-bezier(0.4, 0, 1, 1)
}
.html5-video-player.ytp-settings-shown .videoAdUiSkipContainer, .html5-video-player.ytp-settings-shown .videoAdUiPreSkipContainer {
z-index: 33 !important;
opacity: 0.4 !important;
pointer-events: none
}
.html5-video-player .videoAdUiBottomBar {
-moz-transition: bottom 0.25s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition: bottom 0.25s cubic-bezier(0, 0, 0.2, 1);
transition: bottom 0.25s cubic-bezier(0, 0, 0.2, 1)
}
.ytp-hide-controls .videoAdUiBottomBar, .ytp-autohide .videoAdUiBottomBar, .ytp-hide-controls.videoAdUiRedesign .videoAdUiBottomBar, .ytp-autohide.videoAdUiRedesign .videoAdUiBottomBar, .ytp-iv-drawer-open .videoAdUiBottomBar {
bottom: 6px !important;
-moz-transition: bottom 0.1s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: bottom 0.1s cubic-bezier(0.4, 0, 1, 1);
transition: bottom 0.1s cubic-bezier(0.4, 0, 1, 1)
}
.html5-video-player:not(.ad-interrupting):not(.ad-showing) .ad-container {
display: none
}
.html5-video-player.ytp-ad-end-cap .videoAdUiPreSkipContainer, .html5-video-player.ytp-ad-end-cap .videoAdUiSkipContainer {
-moz-transition: margin 0.33s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: margin 0.33s cubic-bezier(0.4, 0, 1, 1);
transition: margin 0.33s cubic-bezier(0.4, 0, 1, 1)
}
.ytp-iv-drawer-open.ytp-ad-end-cap .videoAdUiPreSkipContainer, .ytp-iv-drawer-open.ytp-ad-end-cap .videoAdUiSkipContainer {
-moz-transition: margin 0.33s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition: margin 0.33s cubic-bezier(0, 0, 0.2, 1);
transition: margin 0.33s cubic-bezier(0, 0, 0.2, 1);
margin-right: 177px
}
.html5-video-player.ytp-ad-end-cap .iv-endcap-slot {
margin-right: 0
}
.ytp-iv-drawer-open.ytp-ad-end-cap .iv-endcap-slot {
margin-right: 177px
}
.html5-video-player .videoAdUiAdInfoPopupText a {
color: #167ac6
}
.html5-video-player .videoAdUiAdInfoPopupText a:hover {
color: #167ac6;
text-decoration: underline
}
.iv-endcap-background {
z-index: 26
}
.html5-video-player .attribution-button {
text-shadow: rgba(0, 0, 0, 1) 0 0 8px, rgba(0, 0, 0, 0.9) 0 0 4px
}
.ytp-ad-attribution-bar {
position: absolute;
bottom: 49px;
left: 18px;
text-shadow: 0 0 4px rgba(0, 0, 0, 0.75);
z-index: 33;
-moz-transition: bottom 0.25s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition: bottom 0.25s cubic-bezier(0, 0, 0.2, 1);
transition: bottom 0.25s cubic-bezier(0, 0, 0.2, 1)
}
.ytp-big-mode .ytp-ad-attribution-bar {
left: 24px;
bottom: 70px
}
.ytp-hide-controls .ytp-ad-attribution-bar, .ytp-autohide .ytp-ad-attribution-bar, .ytp-iv-drawer-open .ytp-ad-attribution-bar {
bottom: 6px;
-moz-transition: bottom 0.1s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: bottom 0.1s cubic-bezier(0.4, 0, 1, 1);
transition: bottom 0.1s cubic-bezier(0.4, 0, 1, 1)
}
.ytp-ad-attribution {
bottom: 0;
color: #fff;
display: inline-block;
left: 0;
line-height: 28px;
opacity: 0.75;
position: static
}
.ytp-ad-attribution.ytp-ad-clickable {
cursor: pointer
}
.ytp-ad-attribution-text {
font-size: 12px;
display: inline-block;
margin-left: 5px
}
.ytp-ad-attribution-icon {
display: none;
filter: drop-shadow(0 0 2px #000);
height: 13px;
opacity: 0.75;
width: 13px;
transform: translate(0, 2px)
}
.ytp-ad-attribution.ytp-ad-clickable .ytp-ad-attribution-icon {
display: inline-block;
margin: 0 5px
}
.ytp-ad-visit-advertiser {
display: inline-block;
margin-left: 8px
}
.ytp-ad-visit-advertiser-text {
color: rgba(255, 255, 255, 0.75);
cursor: pointer;
display: inline-block;
margin: -4px 3px -2px 0;
padding: 5px 0;
text-decoration: none;
vertical-align: baseline
}
.ytp-ad-visit-advertiser:hover .ytp-ad-visit-advertiser-text {
color: rgba(255, 255, 255, 1);
text-decoration: underline
}
.ytp-ad-visit-advertiser-icon {
display: inline-block;
filter: drop-shadow(0 0 2px #000);
height: 10px;
opacity: 0.75;
width: 10px;
transform: translate(0, 1px)
}
.ytp-ad-visit-advertiser:hover .ytp-ad-visit-advertiser-icon {
opacity: 1
}
.ytp-ad-skip-slot {
text-shadow: 0 0 4px rgba(0, 0, 0, 0.75)
}
.ytp-ad-preskip-container {
background: rgba(0, 0, 0, 0.4);
bottom: 74px;
cursor: default;
position: absolute;
right: 0;
z-index: 1000
}
.ytp-ad-preskip-container[aria-hidden=true] {
opacity: 0
}
.ytp-ad-skip-container {
bottom: 74px;
cursor: pointer;
pointer-events: auto;
position: absolute;
right: 0;
z-index: 1000
}
.ytp-ad-skip-container[aria-hidden=true] {
opacity: 0
}
.ytp-big-mode .ytp-ad-preskip-container, .ytp-big-mode .ytp-ad-skip-container {
bottom: 95px
}
.ytp-hide-controls .ytp-ad-preskip-container, .ytp-hide-controls .ytp-ad-skip-container {
bottom: 25px;
-moz-transition: bottom 0.1s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: bottom 0.1s cubic-bezier(0.4, 0, 1, 1);
transition: bottom 0.1s cubic-bezier(0.4, 0, 1, 1)
}
.ytp-settings-shown .ytp-ad-preskip-container, .ytp-settings-shown .ytp-ad-skip-container {
opacity: 0.4;
pointer-events: none;
z-index: 33
}
.ytp-ad-preskip-text {
display: inline-block;
font-size: 12px;
max-width: 105px;
padding-right: 6px;
text-align: center;
vertical-align: middle;
width: auto
}
.ytp-ad-preskip-text.text-only {
width: 100%;
padding-right: 0;
line-height: 21px
}
.ytp-ad-preskip-image {
display: inline-block;
vertical-align: middle
}
.ytp-ad-preskip-image img {
display: block;
width: 92px;
height: 52px
}
.ytp-ad-skip-button {
background: rgba(0, 0, 0, 0.7);
border: 1px solid rgba(255, 255, 255, 0.5);
border-right: 0;
box-sizing: content-box;
color: #fff;
direction: ltr;
font-size: 18px;
line-height: normal;
min-width: 0;
padding: 10px 6px 8px 10px;
width: auto;
text-align: center;
cursor: pointer
}
.ytp-ad-skip-button:hover {
background: rgba(0, 0, 0, 0.9)
}
.ytp-ad-skip-icon {
width: 36px;
display: inline-block;
vertical-align: middle;
margin: -14px -6px -16px -4px
}
.html5-video-player .ytp-ad-overlay-slot {
position: absolute;
bottom: 49px;
width: 100%;
-moz-transition: bottom 0.25s cubic-bezier(0, 0, 0.2, 1), opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition: bottom 0.25s cubic-bezier(0, 0, 0.2, 1), opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
transition: bottom 0.25s cubic-bezier(0, 0, 0.2, 1), opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
z-index: 33
}
.ytp-big-mode .ytp-ad-overlay-slot {
bottom: 70px
}
.ytp-autohide.ytp-ad-overlay-closed .ytp-ad-overlay-slot {
opacity: 0;
-moz-transition: bottom 0.1s cubic-bezier(0.4, 0, 1, 1), opacity 0.1s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: bottom 0.1s cubic-bezier(0.4, 0, 1, 1), opacity 0.1s cubic-bezier(0.4, 0, 1, 1);
transition: bottom 0.1s cubic-bezier(0.4, 0, 1, 1), opacity 0.1s cubic-bezier(0.4, 0, 1, 1)
}
.ytp-ad-overlay-container {
text-align: center
}
.ytp-ad-overlay-container.ytp-overlay-ad-dimmed {
opacity: 0.3
}
.ytp-ad-text-overlay {
height: 63px;
background-color: rgba(0, 0, 0, 0.6);
border: 1px solid rgba(0, 0, 0, 0.6);
min-width: 320px;
margin: auto;
max-width: 440px;
padding-left: 10px;
position: relative;
text-align: left
}
.ytp-ad-text-overlay:hover {
border: 1px solid rgba(58, 58, 58, 1)
}
.ytp-ad-overlay-title {
cursor: pointer;
color: #fff;
display: block;
font: bold 14px arial, sans-serif;
margin: 7px 22px 0 0;
overflow: hidden;
padding-bottom: 4px;
text-overflow: ellipsis;
text-shadow: #000 0 -1px 0;
white-space: nowrap
}
.ytp-ad-text-overlay:hover .ytp-ad-overlay-title {
text-decoration: underline
}
.ytp-ad-overlay-desc {
color: #fff;
font: 12px arial, sans-serif;
margin-bottom: 2px;
margin-top: -3px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap
}
.ytp-ad-image-overlay {
min-width: 320px;
margin: auto;
position: relative
}
.ytp-ad-overlay-image {
cursor: pointer;
display: block
}
.ytp-ad-image-overlay:hover {
text-decoration: underline
}
.ytp-ad-overlay-link {
cursor: pointer;
bottom: 9px;
color: #eade90;
font: 11px arial, sans-serif;
position: static;
text-decoration: none;
text-shadow: #000 0 -1px 0
}
.ytp-ad-close-container {
color: #fff;
cursor: pointer;
margin: 0;
padding-bottom: 10px;
padding-left: 20px;
position: absolute;
right: 0;
top: 0
}
.ytp-ad-close-button {
cursor: pointer;
padding: 0;
border: 0;
background-color: transparent;
cursor: pointer;
float: right;
height: 15px;
margin: 5px 4px 0 0;
width: 15px
}
.ytp-ad-close-button:focus {
outline-width: 0
}
.ytp-ad-close-container:hover .ytp-ad-close-button {
background-color: rgba(0, 0, 0, 0.15);
box-shadow: inset 0 -1px 3px rgba(0, 0, 0, 0.3), 0 1px 0 rgba(255, 255, 255, 0.5)
}
.ytp-ad-overlay-attribution {
bottom: 8px;
color: #888;
cursor: pointer;
font: 11px arial, sans-serif;
position: absolute;
right: 1px;
padding: 4px;
transition: color 0.1s cubic-bezier(0.4, 0, 1, 1)
}
.ytp-ad-overlay-attribution:hover {
color: #fff;
transition: color 0.1s cubic-bezier(0, 0, 0.2, 1)
}
.ytp-ad-overlay-text-image {
float: left
}
.ytp-ad-overlay-text-image img {
box-shadow: rgba(0, 0, 0, 0.498039) 0 3px 5px;
height: 57px;
margin: 2px 10px 0 0;
width: auto;
min-width: 57px
}
.ytp-ad-persistent-progress-bar-container {
position: absolute;
bottom: -3px;
width: 100%;
height: 3px;
background-color: rgba(255, 255, 255, 0.2);
opacity: 0;
-moz-transition: bottom 0.1s cubic-bezier(0.4, 0, 1, 1), opacity 0.1s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: bottom 0.1s cubic-bezier(0.4, 0, 1, 1), opacity 0.1s cubic-bezier(0.4, 0, 1, 1);
transition: bottom 0.1s cubic-bezier(0.4, 0, 1, 1), opacity 0.1s cubic-bezier(0.4, 0, 1, 1);
z-index: 34
}
.ytp-autohide .ytp-ad-persistent-progress-bar-container {
opacity: 1;
bottom: 0;
-moz-transition: bottom 0.25s cubic-bezier(0, 0, 0.2, 1), opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition: bottom 0.25s cubic-bezier(0, 0, 0.2, 1), opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
transition: bottom 0.25s cubic-bezier(0, 0, 0.2, 1), opacity 0.25s cubic-bezier(0, 0, 0.2, 1)
}
.ytp-ad-persistent-progress-bar {
position: absolute;
left: 0;
bottom: 0;
height: 100%;
background-color: #fc0
}
.yt-badge-ypc {
border: 1px solid #73c421;
color: #73c421;
text-transform: none
}
.yt-badge-ypc-free, .yt-badge-ypc-purchased, .yt-badge-ypc-seasonpass {
border: 1px solid #757575;
color: #757575;
text-transform: uppercase
}
.yt-badge.standalone-ypc-badge-renderer-icon {
border: 0;
padding: 0 5px;
color: #fff;
line-height: 16px;
height: 16px;
font-size: 12px;
border-radius: 2px
}
.yt-badge.standalone-ypc-badge-renderer-icon-available {
background: #2793e6
}
.yt-badge.standalone-ypc-badge-renderer-icon-not-available {
background: #b8b8b8
}
.yt-badge.standalone-ypc-badge-renderer-icon-purchased {
background: #767676
}
.standalone-ypc-badge-renderer-label {
color: #767676;
font-size: 12px
}
.standalone-ypc-badge-renderer-secondary-label {
font-weight: 500;
color: #767676;
border-radius: 2px;
padding-left: 4px;
padding-right: 4px;
margin-right: 4px;
text-align: center
}
.rotten-rotomatoes-fresh-icon {
background: no-repeat url(/s.ytimg.com/yts/imgbin/www-hitchhiker-vfl-Nn88d.png) -392px -172px;
background-size: auto;
width: 13px;
height: 13px
}
.rotten-rotomatoes-splat-icon {
background: no-repeat url(/s.ytimg.com/yts/imgbin/www-hitchhiker-vfl-Nn88d.png) -158px -193px;
background-size: auto;
width: 13px;
height: 13px
}
.rotten-rotomatoes-certified-icon {
background: no-repeat url(/s.ytimg.com/yts/imgbin/www-hitchhiker-vfl-Nn88d.png) -675px -107px;
background-size: auto;
width: 13px;
height: 13px
}
.review-aggregate-badge-renderer-icon {
vertical-align: top;
padding-right: 2px
}
.grid-movie-renderer-meta-info {
padding-top: 6px;
padding-bottom: 5px
}
.grid-movie-renderer-metadata, .review-aggregate-badge-renderer-text, .review-aggregate-badge-renderer-text a:link, .review-aggregate-badge-renderer-text a:visited {
color: #767676;
font-size: 12px
}
.yt-badge {
border: 1px solid #ddd;
padding: 0 4px;
height: 13px;
color: #444;
font-size: 11px;
font-weight: normal;
text-transform: uppercase;
text-decoration: none;
line-height: 13px;
display: inline-block
}
.yt-badge-beta-noframe {
border: none
}
.yt-badge-list {
color: #555;
line-height: 100%;
vertical-align: middle;
text-transform: uppercase;
font-size: 0;
display: inline-block
}
.yt-badge-item {
margin-right: 4px;
vertical-align: middle;
display: inline-block
}
.yt-badge-item:last-child {
margin-right: 0
}
.yt-badge-ad {
background: #e6bc27;
border: 0;
border-radius: 2px;
color: #fff;
font-size: 13px;
height: 16px;
line-height: 16px;
padding: 0 5px;
text-transform: none;
vertical-align: middle
}
.yt-badge-live {
border: 1px solid #e62117;
color: #e62117
}
.yt-music-pass-badge-container {
display: inline-block;
vertical-align: middle
}
.yt-badge-music {
text-transform: none;
border: none;
color: #fff;
background-color: #2793e6
}
.music-pass-icon {
margin-top: 3px;
background: no-repeat url(/s.ytimg.com/yts/imgbin/www-hitchhiker-vfl-Nn88d.png) -82px -170px;
background-size: auto;
width: 13px;
height: 13px
}
.yt-badge-mde-recoupment {
margin: 5px;
color: #2793e6;
border: 1px solid #2793e6;
text-transform: uppercase
}
.standalone-collection-badge-renderer-icon {
background-color: #f1f1f1;
border-radius: 2px;
color: #000;
border: none;
margin: 3px 6px 3px 0;
text-transform: none
}
.standalone-collection-badge-renderer-text a {
background-color: #f1f1f1;
border-radius: 2px;
color: #000;
padding: 0 4px;
margin-right: 6px;
text-transform: none
}
.standalone-collection-red-badge-renderer-icon {
background-color: #f1f1f1;
border-radius: 2px;
border: 1px solid #f1f1f1;
color: #e62117;
margin: 3px 0;
text-transform: none
}
.standalone-collection-badge-renderer-text {
font-size: 11px;
color: #555
}
.standalone-collection-badge-renderer-red-text {
font-size: 11px;
color: #e62117
}
.ytp-iv-video-content {
position: absolute
}
.ytp-iv-video-content .video-annotations {
display: block;
position: absolute;
z-index: 20;
width: 100%
}
.annotation {
position: absolute;
color: #000;
padding: 5px;
text-align: left;
word-wrap: break-word;
z-index: 0;
cursor: pointer;
-moz-box-sizing: border-box;
box-sizing: border-box
}
.video-legacy-annotations .annotation {
background: rgba(0, 0, 0, 0);
filter: alpha(opacity=0);
font-family: sans-serif;
white-space: pre-wrap
}
.annotation.annotation-type-text .inner-text {
max-height: 100%;
overflow: hidden
}
.annotation-shape {
position: absolute;
z-index: 0
}
.annotation-close-button {
background-size: contain;
cursor: pointer;
height: 16px;
left: 0;
opacity: 0.85;
position: absolute;
top: 0;
width: 16px
}
.annotation-extend-down .annotation-close-button, .annotation-extend-up .annotation-close-button {
background-size: initial
}
.annotation-close-button:hover {
opacity: 1
}
.annotation-link-icon {
background-size: contain;
position: absolute
}
.annotation-extend-down .inner-text + .annotation-close-button, .annotation-extend-down .annotation-link-icon {
background-position: right 4px bottom 4px;
background-size: 15px 15px
}
.annotation-extend-up .inner-text + .annotation-close-button, .annotation-extend-up .annotation-link-icon {
background-position: right 4px top 4px;
background-size: 15px 15px
}
.label-text {
position: absolute;
left: 1px;
right: 1px;
bottom: 0;
opacity: 0.8;
border-radius: 0 0 4px 4px
}
.annotation-no-mouse {
cursor: default;
pointer-events: none
}
.annotation-type-custom {
padding: 0;
cursor: default
}
.annotation-type-custom > div {
float: left;
padding: 0;
overflow: hidden
}
.iv-click-target {
cursor: pointer
}
.ytp-ad-overlay-open .annotation.iv-branding, .ytp-ad-overlay-open .annotation.iv-promo {
display: none
}
.annotation.iv-branding {
bottom: 0;
right: 0;
z-index: 27;
opacity: 1;
-moz-transition: opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition: opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
transition: opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition-delay: 0.33s;
-moz-transition-delay: 0.33s;
transition-delay: 0.33s
}
.ytp-iv-drawer-open .annotation.iv-branding {
opacity: 0;
-moz-transition: opacity 0.1s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: opacity 0.1s cubic-bezier(0.4, 0, 1, 1);
transition: opacity 0.1s cubic-bezier(0.4, 0, 1, 1)
}
.annotation.iv-branding .branding-context-container-outer {
bottom: 0;
float: left;
padding-right: 10px;
position: absolute
}
.annotation.iv-branding .branding-context-container-inner {
background-color: rgba(28, 28, 28, 0.9);
border-radius: 2px;
bottom: 0;
color: #eee;
max-width: 246px;
opacity: 0;
right: 0;
white-space: nowrap;
-moz-transition: opacity 0.1s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: opacity 0.1s cubic-bezier(0.4, 0, 1, 1);
transition: opacity 0.1s cubic-bezier(0.4, 0, 1, 1)
}
.annotation.iv-branding-active .branding-context-container-inner {
opacity: 1;
-moz-transition: opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition: opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
transition: opacity 0.25s cubic-bezier(0, 0, 0.2, 1)
}
.annotation.iv-branding .branding-img-container img {
display: block;
opacity: 0.7;
position: relative
}
.annotation.iv-branding .branding-img-container {
float: right
}
.annotation.iv-branding img.iv-click-target:hover {
opacity: 1
}
.annotation.iv-branding .iv-branding-context-name {
max-width: 215px;
text-overflow: ellipsis;
overflow: hidden;
padding: 10px 10px 5px
}
.annotation.iv-branding .iv-branding-context-subscribe {
padding: 0 10px 10px;
font-size: 11px;
color: #aaa
}
.annotation.iv-branding .iv-branding-context-subscribe-caret {
display: none
}
.annotation.iv-promo, .annotation.iv-promo .iv-promo-img, .annotation.iv-promo .iv-promo-img img, .annotation.iv-promo .iv-promo-contents, .annotation.iv-promo .iv-promo-contents > div, .annotation.iv-promo .iv-promo-contents > a, .annotation.iv-promo .iv-promo-actions {
height: 40px
}
.annotation.iv-promo {
bottom: 49px;
left: 0;
z-index: 28;
max-width: 100%;
background-color: rgba(0, 0, 0, 0.8);
color: #ccc;
font-size: 11px;
white-space: nowrap;
-moz-transition: -moz-transform 0.1s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: -webkit-transform 0.1s cubic-bezier(0.4, 0, 1, 1);
-ms-transition: -ms-transform 0.1s cubic-bezier(0.4, 0, 1, 1);
transition: transform 0.1s cubic-bezier(0.4, 0, 1, 1)
}
.ytp-big-mode .annotation.iv-promo {
bottom: 70px
}
.html5-video-player.ad-interrupting .annotation.iv-promo {
bottom: 74px
}
.html5-video-player.ytp-big-mode.ad-interrupting .annotation.iv-promo {
bottom: 95px
}
.annotation.iv-promo:hover {
background-color: rgba(0, 0, 0, 0.9)
}
.annotation.iv-promo > div, .annotation.iv-promo .iv-promo-contents > div {
display: inline-block;
float: none !important;
vertical-align: middle;
-moz-box-sizing: border-box;
box-sizing: border-box
}
.annotation.iv-promo .iv-promo-contents > a {
display: inline-block;
float: none !important;
vertical-align: middle;
-moz-box-sizing: border-box;
box-sizing: border-box;
color: #ccc
}
.annotation.iv-promo.iv-promo-inactive {
-moz-transition: -moz-transform 0.25s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition: -webkit-transform 0.25s cubic-bezier(0, 0, 0.2, 1);
-ms-transition: -ms-transform 0.25s cubic-bezier(0, 0, 0.2, 1);
transition: transform 0.25s cubic-bezier(0, 0, 0.2, 1);
-moz-transform: translatex(-100%);
-ms-transform: translatex(-100%);
-webkit-transform: translatex(-100%);
transform: translatex(-100%)
}
.annotation.iv-promo .iv-promo-img {
left: 0;
position: absolute;
z-index: 1;
width: 40px
}
.annotation.iv-promo .iv-promo-img img {
z-index: 1;
width: 40px
}
.annotation.iv-promo .iv-promo-img .iv-promo-playlist-length, .annotation.iv-promo .iv-promo-img .iv-promo-video-duration, .annotation.iv-promo .iv-promo-contents .iv-promo-txt p, .annotation.iv-promo .iv-promo-contents .iv-promo-txt strong {
overflow: hidden;
text-overflow: ellipsis
}
.annotation.iv-promo .iv-promo-contents .iv-promo-badge-live {
margin: 4px 8px 0;
border: 1px solid #fff;
background-color: #e62117;
color: #fff
}
.annotation.iv-promo .iv-promo-img .iv-promo-playlist-length, .annotation.iv-promo .iv-promo-img .iv-promo-video-duration {
position: absolute
}
.annotation.iv-promo .iv-promo-img .iv-promo-playlist-length {
top: 0;
right: 0;
border-left: 1px solid rgba(255, 255, 255, 0.25);
width: 30px;
height: 100%;
background-color: rgba(0, 0, 0, 0.6);
color: #fff;
font-weight: 500;
text-align: center;
line-height: 40px
}
.annotation.iv-promo .iv-promo-img .iv-promo-video-duration {
bottom: 2px;
right: 2px;
padding: 3px 2px;
max-width: 32px;
background-color: #000;
color: #fff;
font-size: 10px
}
.annotation.iv-promo .iv-promo-contents {
padding-right: 31px;
width: 100%;
max-width: 311px;
-moz-transition: max-width 0.2s ease-out, padding-right 0.2s ease-out;
-webkit-transition: max-width 0.2s ease-out, padding-right 0.2s ease-out;
transition: max-width 0.2s ease-out, padding-right 0.2s ease-out
}
.annotation.iv-promo .iv-promo-img + .iv-promo-contents {
padding-left: 40px;
max-width: 351px
}
.annotation.iv-promo .iv-promo-contents .iv-promo-txt, .annotation.iv-promo .iv-promo-contents .iv-promo-button-container {
direction: ltr;
max-width: 100%;
overflow: hidden;
-webkit-font-smoothing: antialiased
}
.annotation.iv-promo .iv-promo-contents .iv-promo-txt p {
margin: 3px 8px -4px;
line-height: 18px
}
.annotation.iv-promo .iv-promo-contents .iv-promo-txt strong {
color: #fff;
font-size: 12px
}
.annotation .iv-promo-txt p span, .annotation .iv-promo-txt p strong {
display: inline-block;
max-width: 264px;
overflow: hidden;
text-overflow: ellipsis
}
.annotation.iv-promo-with-button .iv-promo-txt p span, .annotation.iv-promo-with-button .iv-promo-txt p strong {
max-width: 184px
}
.annotation .iv-promo-txt p:first-child strong, .annotation .iv-promo-txt p:first-child span {
margin-bottom: -6px
}
.annotation.iv-promo .iv-promo-contents .iv-promo-txt .iv-promo-link {
position: relative;
padding-right: 20px;
max-width: 244px;
color: #ffd100
}
.annotation.iv-promo .iv-promo-contents .iv-promo-txt .iv-promo-link:after {
position: absolute;
top: 2px;
right: 0;
opacity: 0.5;
content: ""
}
.annotation.iv-promo .iv-promo-contents .iv-promo-txt:hover .iv-promo-link:after {
opacity: 1
}
.iv-promo-button-container {
position: absolute;
right: 31px
}
.iv-button {
display: inline-block;
height: 28px;
border: solid 1px transparent;
padding: 0 10px;
outline: 0;
font-family: "YouTube Noto", Roboto, arial, sans-serif;
font-weight: 500;
font-size: 11px;
text-decoration: none;
white-space: nowrap;
word-wrap: normal;
line-height: normal;
vertical-align: middle;
cursor: pointer;
border-radius: 2px;
box-shadow: 0 1px 0 rgba(0, 0, 0, 0.05);
-moz-box-sizing: border-box;
box-sizing: border-box
}
.iv-button:hover {
text-decoration: none
}
.iv-button:focus, .iv-button:focus:hover {
box-shadow: 0 0 0 2px rgba(27, 127, 204, 0.4)
}
.no-focus-outline .yt-uix-button:focus, .no-focus-outline .yt-uix-button:focus:hover {
box-shadow: none
}
.iv-button::-moz-focus-inner {
border: 0;
padding: 0
}
.iv-button[disabled], .iv-button[disabled]:hover, .iv-button[disabled]:active, .iv-button[disabled]:focus {
opacity: 0.5;
filter: alpha(opacity=50);
cursor: auto;
box-shadow: none
}
.iv-button, .iv-button[disabled], .iv-button[disabled]:hover, .iv-button[disabled]:active, .iv-button[disabled]:focus {
border-color: #167ac6;
background: #167ac6;
color: #fff
}
.iv-button:hover {
background: #126db3
}
.iv-button:active {
background: #095b99;
box-shadow: inset 0 1px 0 rgba(0, 0, 0, 0.5)
}
.iv-button .iv-button-content {
display: inline;
overflow: hidden;
text-overflow: ellipsis
}
a.iv-button:after {
content: "";
display: inline-block;
vertical-align: middle;
height: 100%
}
.iv-promo-button {
width: 64px;
margin: 6px 8px
}
.annotation.iv-promo .iv-promo-actions, .annotation.iv-promo .iv-promo-actions .iv-promo-close, .annotation.iv-promo .iv-promo-actions .iv-promo-expand {
top: 0;
right: 0;
position: absolute
}
.annotation.iv-promo .iv-promo-actions {
width: 31px
}
.annotation.iv-promo .iv-promo-actions .iv-promo-close, .annotation.iv-promo .iv-promo-actions .iv-promo-expand {
cursor: pointer;
-moz-transition: opacity 0.2s ease-out;
-webkit-transition: opacity 0.2s ease-out;
transition: opacity 0.2s ease-out
}
.annotation.iv-promo .iv-promo-actions .iv-promo-close:after, .annotation.iv-promo .iv-promo-actions .iv-promo-expand:after {
display: block;
content: ""
}
.annotation.iv-promo .iv-promo-actions .iv-promo-close {
opacity: 1
}
.annotation.iv-promo .iv-promo-actions .iv-promo-close:after {
margin: 16px 10px 15px 12px;
opacity: 0.5
}
.annotation.iv-promo .iv-promo-actions .iv-promo-expand:after {
margin: 16px 12px 15px
}
.annotation.iv-promo.iv-promo-video .iv-promo-img, .annotation.iv-promo.iv-promo-video .iv-promo-img img {
width: 71px
}
.annotation.iv-promo.iv-promo-video .iv-promo-img + .iv-promo-contents {
padding-left: 71px;
max-width: 382px
}
.annotation.iv-promo.iv-promo-with-button .iv-promo-contents .iv-promo-txt {
padding-right: 80px
}
.annotation.iv-promo.iv-promo-collapsed .iv-promo-contents, .annotation.iv-promo.iv-promo-collapsed .iv-promo-actions .iv-promo-close, .annotation.iv-promo.iv-promo-collapsed .iv-promo-actions .iv-promo-expand {
-moz-transition-timing-function: ease-in;
-webkit-transition-timing-function: ease-in;
transition-timing-function: ease-in;
-webkit-transition-delay: 0.5s;
-moz-transition-delay: 0.5s;
transition-delay: 0.5s
}
.annotation.iv-promo.iv-promo-collapsed .iv-promo-contents {
padding-right: 28px;
max-width: 0 !important
}
.annotation.iv-promo-website-card-cta, .annotation.iv-promo-website-card-cta .iv-promo-img, .annotation.iv-promo-website-card-cta .iv-promo-img img, .annotation.iv-promo-website-card-cta .iv-promo-contents, .annotation.iv-promo-website-card-cta .iv-promo-contents > div, .annotation.iv-promo-website-card-cta .iv-promo-contents > a, .annotation.iv-promo-website-card-cta .iv-promo-actions, .annotation.iv-promo-website-card-cta .iv-promo-actions .iv-promo-close, .annotation.iv-promo-website-card-cta .iv-promo-actions .iv-promo-expand {
height: 60px
}
.annotation.iv-promo-website-card-cta .iv-promo-img, .annotation.iv-promo-website-card-cta .iv-promo-img img {
width: 60px
}
.annotation.iv-promo-website-card-cta .iv-promo-img .iv-promo-playlist-length {
line-height: 60px
}
.annotation.iv-promo-website-card-cta .iv-promo-img + .iv-promo-contents {
padding-left: 60px;
max-width: 371px
}
.annotation.iv-promo-website-card-cta .iv-promo-contents .iv-promo-txt {
padding: 3px
}
.annotation.iv-promo-website-card-cta .iv-promo-contents .iv-promo-txt p {
font-size: 11px;
line-height: 15px;
color: #bbb
}
.annotation.iv-promo-website-card-cta .iv-promo-contents .iv-promo-txt strong {
line-height: 20px
}
.annotation.iv-promo-website-card-cta .iv-promo-contents .iv-promo-txt .iv-promo-action-text {
position: relative;
padding-right: 20px;
max-width: 244px;
font-size: 12px;
line-height: 13px;
color: #167ac6;
font-weight: 500
}
.annotation.iv-promo-website-card-cta:hover .iv-promo-contents .iv-promo-txt .iv-promo-action-text {
color: #1a92ed
}
.annotation.iv-promo-website-card-cta .iv-promo-actions .iv-promo-close:after {
opacity: 1
}
.annotation.iv-promo-website-card-cta.iv-promo-collapsed-no-delay .iv-promo-contents {
padding-right: 28px;
max-width: 0 !important
}
.iv-drawer, .iv-drawer-header, .iv-drawer-content {
position: absolute
}
.iv-drawer {
top: 0;
bottom: 0;
right: 0;
z-index: 30;
width: 177px;
background-color: rgba(0, 0, 0, 0.2);
color: #fff;
font-size: 11px;
line-height: 12px;
-moz-transition: -moz-transform 0.33s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: -webkit-transform 0.33s cubic-bezier(0.4, 0, 1, 1);
-ms-transition: -ms-transform 0.33s cubic-bezier(0.4, 0, 1, 1);
transition: transform 0.33s cubic-bezier(0.4, 0, 1, 1)
}
.iv-drawer-small.iv-drawer {
width: 133px
}
.iv-drawer-big.iv-drawer {
font-size: 20px;
line-height: 24px;
width: 295px
}
.iv-drawer {
-moz-transform: translatex(177px);
-ms-transform: translatex(177px);
-webkit-transform: translatex(177px);
transform: translatex(177px)
}
.iv-drawer-content * {
text-align: left
}
.ytp-iv-drawer-open .iv-drawer {
-moz-transition: -moz-transform 0.33s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition: -webkit-transform 0.33s cubic-bezier(0, 0, 0.2, 1);
-ms-transition: -ms-transform 0.33s cubic-bezier(0, 0, 0.2, 1);
transition: transform 0.33s cubic-bezier(0, 0, 0.2, 1);
-moz-transform: translatex(0);
-ms-transform: translatex(0);
-webkit-transform: translatex(0);
transform: translatex(0)
}
.iv-drawer-header {
top: 0;
padding: 16px 32px 0 16px;
width: 177px;
height: 41px
}
.iv-drawer-small .iv-drawer-header {
padding: 9px 24px 0 12px;
height: 28px;
width: 133px
}
.iv-drawer-big .iv-drawer-header {
padding: 20px 48px 0 32px;
height: 64px;
width: 295px
}
.iv-drawer-header-text {
font-weight: 500;
display: block;
overflow: hidden;
white-space: nowrap;
word-wrap: normal;
-o-text-overflow: ellipsis;
text-overflow: ellipsis
}
.html5-video-player .iv-drawer-header {
-moz-box-sizing: border-box;
box-sizing: border-box
}
.iv-drawer-content {
top: 41px;
bottom: 0;
border-top: 1px solid transparent;
padding: 0 16px;
width: 145px;
overflow-x: hidden;
overflow-y: auto;
direction: ltr;
text-align: left
}
.iv-drawer-small .iv-drawer-content {
padding: 0 12px;
top: 28px;
width: 109px
}
.iv-drawer-big .iv-drawer-content {
padding: 0 32px;
top: 64px;
width: 231px
}
.iv-drawer-scrolled .iv-drawer-content {
border-color: rgba(0, 0, 0, 0.4)
}
.iv-drawer-content::-webkit-scrollbar {
background-color: transparent;
width: 16px
}
.iv-drawer-content::-webkit-scrollbar-thumb {
border: 4px solid transparent;
border-radius: 8px;
background-clip: content-box;
background-color: rgba(102, 102, 102, 0.5)
}
.iv-drawer-content::-webkit-scrollbar-track {
background-color: transparent
}
.ytp-autohide .iv-drawer-content::-webkit-scrollbar-thumb {
background-color: transparent
}
.iv-drawer-content:hover::-webkit-scrollbar-thumb {
background-color: #666 !important
}
.iv-drawer-close-button {
position: absolute;
top: 0;
right: 0;
padding: 16px;
opacity: 0.75;
cursor: pointer
}
.iv-drawer-small .iv-drawer-close-button {
padding: 8px
}
.iv-drawer-big .iv-drawer-close-button {
padding: 24px
}
.iv-drawer-close-button:after {
display: block;
content: ""
}
.iv-drawer-close-button:hover {
opacity: 1
}
.iv-card, .iv-card a.iv-click-target, .iv-card a.iv-click-target:hover, .iv-card a.iv-click-target:focus {
display: block;
color: #767676;
text-decoration: none
}
.iv-card {
margin-bottom: 16px;
width: 145px;
overflow: hidden;
background-color: #fff;
position: relative;
word-wrap: break-word;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
-moz-box-sizing: border-box;
box-sizing: border-box
}
.iv-drawer-small .iv-card {
width: 109px
}
.iv-drawer-big .iv-card {
width: 231px
}
.iv-card:hover .iv-card-primary-link {
color: #167ac6 !important
}
.iv-card h2, .iv-card-action {
display: -webkit-box;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis
}
.webkit .iv-card h2:after, .webkit .iv-card-action:after {
content: "";
position: static;
visibility: hidden
}
.iv-card h2 {
margin: 0 0 8px;
-webkit-line-clamp: 6;
max-height: 90px;
color: #333;
font-size: 13px;
font-weight: 500;
line-height: 15px
}
.iv-drawer-small .iv-card h2 {
font-size: 11px;
line-height: 12px;
max-height: 72px
}
.iv-drawer-big .iv-card h2 {
font-size: 20px;
line-height: 24px;
max-height: 144px
}
.iv-card p, .iv-card .iv-card-meta-info, .iv-card .iv-card-action {
margin: -6px 0 2px
}
.iv-card-meta-info {
list-style: none;
padding: 0
}
.iv-card-image {
position: relative;
border-bottom: 1px solid #e2e2e2;
width: 145px;
height: 145px;
background: #f1f1f1 no-repeat center;
background-size: cover;
color: #fff
}
.iv-drawer-small .iv-card-image {
width: 109px;
height: 109px
}
.iv-drawer-big .iv-card-image {
width: 231px;
height: 231px
}
.iv-card-image-text {
position: absolute;
bottom: 0;
padding: 20px 10px 8px;
width: 100%;
background-image: -moz-linear-gradient(top, transparent 0, rgba(0, 0, 0, 0.6) 100%);
background-image: -ms-linear-gradient(top, transparent 0, rgba(0, 0, 0, 0.6) 100%);
background-image: -o-linear-gradient(top, transparent 0, rgba(0, 0, 0, 0.6) 100%);
background-image: -webkit-linear-gradient(top, transparent 0, rgba(0, 0, 0, 0.6) 100%);
background-image: linear-gradient(to bottom, transparent 0, rgba(0, 0, 0, 0.6) 100%);
-moz-box-sizing: border-box;
box-sizing: border-box;
overflow: hidden;
white-space: nowrap;
word-wrap: normal;
-o-text-overflow: ellipsis;
text-overflow: ellipsis
}
.iv-drawer-small .iv-card-image-text {
font-size: 11px;
line-height: 12px;
padding: 6px 8px
}
.iv-drawer-big .iv-card-image-text {
font-size: 18px;
line-height: 20px;
padding: 12px 16px
}
.iv-card-image-text .yt-badge {
margin-right: 5px
}
.iv-card-content {
padding: 8px 10px
}
.iv-drawer-small .iv-card-content {
padding: 6px 8px
}
.iv-drawer-big .iv-card-content {
padding: 12px 16px
}
.iv-card-content > :first-child {
margin-top: 0
}
.iv-card-content > :last-child {
margin-bottom: 0
}
.iv-card-message, .iv-card-action {
font-weight: 500
}
.iv-card-message {
margin-bottom: 8px;
border-bottom: 1px solid #e2e2e2;
padding-bottom: 8px
}
.iv-card-action {
-webkit-line-clamp: 4;
max-height: 52px;
white-space: nowrap
}
.iv-drawer-small .iv-card-action {
font-size: 11px;
line-height: 12px;
max-height: 48px
}
.iv-drawer-big .iv-card-action {
font-size: 18px;
line-height: 20px;
max-height: 80px
}
.iv-card-action span {
white-space: normal
}
.iv-card-action-icon {
padding: 0 0 0 30px;
min-height: 14px;
background-position: left center;
background-repeat: no-repeat;
background-size: 24px auto
}
.iv-card-link-icon {
display: inline-block
}
.iv-card-video h2, .iv-card-episode h2, .iv-card-movie h2, .iv-card-playlist h2 {
-webkit-line-clamp: 3;
max-height: 45px
}
.iv-drawer-small .iv-card-video h2, .iv-drawer-small .iv-card-episode h2, .iv-drawer-small .iv-card-movie h2, .iv-drawer-small .iv-card-playlist h2 {
max-height: 36px
}
.iv-drawer-big .iv-card-video h2, .iv-drawer-big .iv-card-episode h2, .iv-drawer-big .iv-card-movie h2, .iv-drawer-big .iv-card-playlist h2 {
max-height: 72px
}
.iv-card-channel h2 {
-webkit-line-clamp: 2;
max-height: 30px
}
.iv-drawer-small .iv-card-channel h2 {
max-height: 24px
}
.iv-drawer-big .iv-card-channel h2 {
max-height: 48px
}
.iv-card-video .iv-card-image, .iv-card-episode .iv-card-image, .iv-card-movie .iv-card-image, .iv-card-playlist .iv-card-image {
background-color: #000
}
.iv-card-video .iv-card-image, .iv-card-episode .iv-card-image, .iv-card-playlist .iv-card-image {
height: 82px
}
.iv-drawer-small .iv-card-video .iv-card-image, .iv-drawer-small .iv-card-episode .iv-card-image, .iv-drawer-small .iv-card-playlist .iv-card-image {
height: 61px
}
.iv-drawer-big .iv-card-video .iv-card-image, .iv-drawer-big .iv-card-episode .iv-card-image, .iv-drawer-big .iv-card-playlist .iv-card-image {
height: 129px
}
.iv-card-movie .iv-card-image {
height: 209px
}
.iv-drawer-small .iv-card-movie .iv-card-image {
height: 157px
}
.iv-drawer-big .iv-card-movie .iv-card-image {
height: 335px
}
.iv-card-video-duration {
position: absolute;
bottom: 5px;
right: 5px;
padding: 2px 4px;
background-color: #000
}
.iv-card-playlist .iv-card-image-overlay {
display: table;
position: absolute;
top: 0;
right: 0;
width: 63px;
height: 100%;
background-color: rgba(0, 0, 0, 0.7);
color: #cfcfcf;
font-size: 20px;
text-align: center;
text-transform: uppercase;
line-height: 21px
}
.iv-card-playlist-video-count {
display: table-cell;
text-align: center;
vertical-align: middle
}
.iv-card-playlist-video-count:after {
display: block;
margin: auto;
opacity: 0.5;
content: ""
}
.iv-card-poll {
position: relative
}
.iv-card-poll ul {
max-width: 125px;
list-style: none;
margin: 0;
padding: 0
}
.iv-drawer-small .iv-card-poll ul {
max-width: 89px
}
.iv-drawer-big .iv-card-poll ul {
max-width: 211px
}
.iv-card-poll fieldset {
margin: 0;
border: 0;
padding: 0
}
.iv-card-poll label {
display: block;
cursor: pointer;
padding-bottom: 5px;
min-height: 14px;
background-position: left 0 top 5px;
background-repeat: no-repeat;
background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMTciIHZlcnNpb249IjEuMSIgd2lkdGg9IjE3Ij48Y2lyY2xlIGN4PSI4LjUiIGN5PSI4LjUiIGZpbGw9Im5vbmUiIHI9IjcuNiIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utb3BhY2l0eT0iMC41NCIgc3Ryb2tlLXdpZHRoPSIxLjgiIC8+PC9zdmc+");
color: rgba(0, 0, 0, 0.87);
-moz-transition: color 0.5s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition: color 0.5s cubic-bezier(0, 0, 0.2, 1);
transition: color 0.5s cubic-bezier(0, 0, 0.2, 1)
}
.ytp-probably-keyboard-focus .iv-card-poll label.iv-card-poll-choice-focused {
box-shadow: 0 0 0 2px rgba(27, 127, 204, 0.4)
}
.iv-card-poll.iv-card-poll-voted label {
color: rgba(0, 0, 0, 0.54)
}
.iv-card-poll.iv-card-poll-voted label.iv-card-poll-choice-checked {
background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMTciIHZlcnNpb249IjEuMSIgd2lkdGg9IjE3Ij48Y2lyY2xlIGN4PSI4LjUiIGN5PSI4LjUiIGZpbGw9Im5vbmUiIHI9IjcuNiIgc3Ryb2tlPSIjMTY3YWM2IiBzdHJva2Utd2lkdGg9IjEuOCIgLz48Y2lyY2xlIGN4PSI4LjUiIGN5PSI4LjUiIGZpbGw9IiMxNjdhYzYiIHI9IjQuMjMiIC8+PC9zdmc+");
color: rgba(0, 0, 0, 0.87)
}
.iv-card-poll input[type=checkbox] {
opacity: 0;
width: 17px;
height: 17px;
margin: 5px 0 0;
float: left
}
.iv-card-poll .iv-card-poll-choice-text {
display: block;
margin-left: 25px;
padding-top: 8px
}
.iv-drawer-big .iv-card-poll .iv-card-poll-choice-text {
padding-top: 2px
}
.iv-card-poll li + li {
margin-top: 8px
}
.iv-card-poll .iv-card-poll-result {
width: 100%;
height: 4px;
background-color: #dfdfdf;
visibility: hidden
}
.iv-card-poll .iv-card-poll-result .iv-card-poll-result-bar {
width: 100%;
height: 100%;
background-color: #167ac6;
-moz-transform-origin: top left;
-ms-transform-origin: top left;
-webkit-transform-origin: top left;
transform-origin: top left;
-moz-transition: transform 0.5s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition: transform 0.5s cubic-bezier(0, 0, 0.2, 1);
transition: transform 0.5s cubic-bezier(0, 0, 0.2, 1)
}
.iv-card-poll.iv-card-poll-expanded .iv-card-poll-result {
visibility: visible
}
.iv-card-poll .iv-card-poll-choice-percent {
display: none;
float: right;
margin-left: 5px
}
.iv-card-poll.iv-card-poll-expanded .iv-card-poll-choice-percent {
display: block
}
.iv-card-sign-in {
visibility: hidden;
position: absolute;
top: 0;
left: 0;
padding: 8px 10px
}
.iv-card-sign-in p {
margin: 0 0 8px
}
.iv-card-sign-in a {
color: #fff
}
.iv-card-unavailable:hover .iv-click-target, .iv-card-unavailable:hover .iv-card-content {
visibility: hidden
}
.iv-card-unavailable:hover .iv-card-sign-in {
visibility: visible
}
.iv-card-sponsored, .iv-ad-info-icon-container {
position: relative
}
.iv-card-sponsored {
margin: 0 0 8px;
color: #999
}
.iv-ad-info-container {
display: inline-block;
margin-left: 6px
}
.iv-ad-info-icon {
display: inline-block;
position: relative;
top: 1px
}
.iv-ad-info {
bottom: 21px;
left: 0;
right: 0;
border: 1px solid #000;
padding: 7px;
background: #fff;
color: #000;
font-size: 12px
}
.iv-ad-info-container .iv-ad-info a {
color: #167ac6
}
.iv-ad-info-container .iv-ad-info a:hover {
color: #167ac6;
text-decoration: underline
}
.iv-ad-info-callout, .iv-ad-info-icon-container:after {
left: 0;
border-left: 5px solid transparent;
border-right: 5px solid transparent;
border-top: 5px solid;
width: 0;
height: 0
}
.iv-ad-info-callout {
bottom: 16px;
border-top-color: #000
}
.iv-ad-info-icon-container:after {
content: "";
bottom: 17px;
border-top-color: #fff
}
.iv-ad-info, .iv-ad-info-callout, .iv-ad-info-icon-container:after {
visibility: hidden;
position: absolute;
-moz-transition: visibility 0s 0.1s;
-webkit-transition: visibility 0s 0.1s;
transition: visibility 0s 0.1s
}
.iv-ad-info-container:hover .iv-ad-info-callout, .iv-ad-info-container:hover .iv-ad-info-icon-container:after, .iv-ad-info-container:hover .iv-ad-info {
visibility: visible;
-webkit-transition-delay: 0s;
-moz-transition-delay: 0s;
transition-delay: 0s
}
.iv-card-product-listing h2 {
-webkit-line-clamp: 3;
max-height: 45px;
color: #666
}
.iv-drawer-small .iv-card-product-listing h2 {
max-height: 36px
}
.iv-drawer-big .iv-card-product-listing h2 {
max-height: 72px
}
.iv-card-offer-price {
margin-bottom: 2px;
font-weight: 500;
font-size: 13px;
line-height: 15px;
color: #333
}
.iv-card-offer-merchant {
color: #097a41
}
.ytp-bezel {
position: absolute;
left: 50%;
top: 50%;
width: 52px;
height: 52px;
z-index: 19;
margin-left: -26px;
margin-top: -26px;
background: rgba(0, 0, 0, 0.5);
border-radius: 26px;
-moz-animation: ytp-bezel-fadeout 0.5s linear 1 normal forwards;
-webkit-animation: ytp-bezel-fadeout 0.5s linear 1 normal forwards;
animation: ytp-bezel-fadeout 0.5s linear 1 normal forwards;
pointer-events: none
}
.ytp-big-mode .ytp-bezel {
width: 78px;
height: 78px;
margin-left: -39px;
margin-top: -39px;
border-radius: 39px
}
.ytp-bezel-icon {
width: 36px;
height: 36px;
margin: 8px
}
.ytp-big-mode .ytp-bezel-icon {
width: 54px;
height: 54px;
margin: 12px
}
@keyframes ytp-bezel-fadeout {
0% {
opacity: 1
} to {
opacity: 0;
transform: scale(2)
}
}
.ytp-cards-button {
opacity: 0.9;
display: inline-block;
width: 36px;
height: 42px;
position: absolute;
padding-top: 6px;
right: 12px;
-moz-transition: opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition: opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
transition: opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
overflow: hidden;
pointer-events: all;
z-index: 63
}
.ytp-big-mode .ytp-cards-button {
right: 24px;
padding-top: 9px;
height: 63px;
width: 54px
}
.ytp-gvn .ytp-cards-button {
margin-top: 20px
}
.ytp-cards-button:hover {
opacity: 1;
-moz-transition: opacity 0.1s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition: opacity 0.1s cubic-bezier(0, 0, 0.2, 1);
transition: opacity 0.1s cubic-bezier(0, 0, 0.2, 1)
}
.ytp-autohide:not(.ytp-cards-teaser-shown) .ytp-cards-button, .ytp-cards-button[aria-hidden=true] {
opacity: 0;
-moz-transition: opacity 0.1s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: opacity 0.1s cubic-bezier(0.4, 0, 1, 1);
transition: opacity 0.1s cubic-bezier(0.4, 0, 1, 1)
}
.ytp-cards-button .ytp-svg-shadow {
-moz-transition: stroke-opacity 0.1s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: stroke-opacity 0.1s cubic-bezier(0.4, 0, 1, 1);
transition: stroke-opacity 0.1s cubic-bezier(0.4, 0, 1, 1)
}
.ytp-cards-teaser-shown .ytp-cards-button .ytp-svg-shadow {
stroke-opacity: 1;
-moz-transition: stroke-opacity 0.1s cubic-bezier(0, 0, 0.2, 1) 0.25s;
-webkit-transition: stroke-opacity 0.1s cubic-bezier(0, 0, 0.2, 1) 0.25s;
transition: stroke-opacity 0.1s cubic-bezier(0, 0, 0.2, 1) 0.25s
}
.ytp-cards-button .ytp-svg-shadow-fill {
-moz-transition: fill-opacity 0.1s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: fill-opacity 0.1s cubic-bezier(0.4, 0, 1, 1);
transition: fill-opacity 0.1s cubic-bezier(0.4, 0, 1, 1)
}
.ytp-cards-teaser-shown .ytp-cards-button .ytp-svg-shadow-fill {
fill-opacity: 1;
-moz-transition: fill-opacity 0.1s cubic-bezier(0, 0, 0.2, 1) 0.25s;
-webkit-transition: fill-opacity 0.1s cubic-bezier(0, 0, 0.2, 1) 0.25s;
transition: fill-opacity 0.1s cubic-bezier(0, 0, 0.2, 1) 0.25s
}
.ytp-cards-shopping-active.ytp-cards-teaser-shown .ytp-cards-button .ytp-svg-fill {
fill: #2793e6
}
.ytp-cards-shopping-active.ytp-cards-teaser-shown .ytp-cards-button .ytp-svg-shadow {
stroke: #fff;
stroke-opacity: 1
}
.ytp-cards-shopping-active.ytp-cards-teaser-shown .ytp-cards-button .ytp-svg-shadow-fill {
fill: #fff;
fill-opacity: 1
}
.ytp-cards-button-icon-shopping {
display: none
}
.ytp-cards-shopping-active .ytp-cards-button-icon-shopping {
display: inline-block
}
.ytp-cards-shopping-active .ytp-cards-button-icon-default {
display: none
}
.ytp-cards-teaser {
position: absolute;
top: 8.5px;
right: 0;
border-right: 12px solid transparent;
max-width: 90%;
opacity: 0.75;
cursor: pointer;
z-index: 62;
-moz-box-sizing: border-box;
box-sizing: border-box;
-moz-transition: opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition: opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
transition: opacity 0.25s cubic-bezier(0, 0, 0.2, 1)
}
.ytp-big-mode .ytp-cards-teaser {
top: 13px
}
.ytp-gvn .ytp-cards-teaser {
top: 28.5px
}
.ytp-gvn.ytp-big-mode .ytp-cards-teaser {
top: 33px
}
.html5-video-player.ad-interrupting:not(.videoAdUiRedesign) .ytp-cards-teaser {
top: 40px
}
.ytp-cards-teaser-shown .ytp-cards-teaser {
opacity: 0.9
}
.ytp-cards-teaser-shown .ytp-cards-teaser:hover {
opacity: 1
}
.ytp-autohide:not(.ytp-cards-teaser-shown) .ytp-cards-teaser {
opacity: 0;
-moz-transition: opacity 0.1s cubic-bezier(0.4, 0, 1, 1) 0.33s;
-webkit-transition: opacity 0.1s cubic-bezier(0.4, 0, 1, 1) 0.33s;
transition: opacity 0.1s cubic-bezier(0.4, 0, 1, 1) 0.33s
}
.ytp-iv-drawer-open .ytp-cards-teaser {
opacity: 0;
-moz-transition: opacity 0.1s cubic-bezier(0.4, 0, 1, 1) 0.33s;
-webkit-transition: opacity 0.1s cubic-bezier(0.4, 0, 1, 1) 0.33s;
transition: opacity 0.1s cubic-bezier(0.4, 0, 1, 1) 0.33s;
-webkit-transition-delay: 0s;
-moz-transition-delay: 0s;
transition-delay: 0s
}
.ytp-cards-teaser .ytp-cards-teaser-box, .ytp-cards-teaser .ytp-cards-teaser-text {
height: 31px
}
.ytp-big-mode .ytp-cards-teaser .ytp-cards-teaser-box, .ytp-big-mode .ytp-cards-teaser .ytp-cards-teaser-text {
height: 46px
}
.ytp-cards-teaser .ytp-cards-teaser-box {
position: absolute;
top: 0;
right: 18px;
border-radius: 2px;
width: 100%;
background: #fff;
border-bottom: 1px solid #f1f1f1;
-moz-transition: -moz-transform 0.33s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: -webkit-transform 0.33s cubic-bezier(0.4, 0, 1, 1);
-ms-transition: -ms-transform 0.33s cubic-bezier(0.4, 0, 1, 1);
transition: transform 0.33s cubic-bezier(0.4, 0, 1, 1);
-moz-transform: scalex(0) translatex(0);
-ms-transform: scalex(0) translatex(0);
-webkit-transform: scalex(0) translatex(0);
transform: scalex(0) translatex(0);
-moz-transform-origin: right 0;
-ms-transform-origin: right 0;
-webkit-transform-origin: right 0;
transform-origin: right 0
}
.ytp-big-mode .ytp-cards-teaser .ytp-cards-teaser-box {
right: 27px
}
.ytp-cards-teaser-shown .ytp-cards-teaser .ytp-cards-teaser-box {
-moz-transition: -moz-transform 0.33s cubic-bezier(0, 0, 0.2, 1) 0.25s;
-webkit-transition: -webkit-transform 0.33s cubic-bezier(0, 0, 0.2, 1) 0.25s;
-ms-transition: -ms-transform 0.33s cubic-bezier(0, 0, 0.2, 1) 0.25s;
transition: transform 0.33s cubic-bezier(0, 0, 0.2, 1) 0.25s;
-moz-transform: scalex(1) translatex(18px);
-ms-transform: scalex(1) translatex(18px);
-webkit-transform: scalex(1) translatex(18px);
transform: scalex(1) translatex(18px)
}
.ytp-big-mode.ytp-cards-teaser-shown .ytp-cards-teaser .ytp-cards-teaser-box {
-moz-transform: scalex(1) translatex(27px);
-ms-transform: scalex(1) translatex(27px);
-webkit-transform: scalex(1) translatex(27px);
transform: scalex(1) translatex(27px)
}
.ytp-cards-teaser .ytp-cards-teaser-text {
position: relative;
padding: 0 36px 0 10px;
max-width: 0;
opacity: 0;
color: #000;
font-weight: 500;
font-size: 109.090909%;
line-height: 31px;
-moz-box-sizing: border-box;
box-sizing: border-box;
overflow: hidden;
white-space: nowrap;
word-wrap: normal;
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
-moz-transition: opacity 0.165s cubic-bezier(0.4, 0, 1, 1), max-width 0s ease 0.165s;
-webkit-transition: opacity 0.165s cubic-bezier(0.4, 0, 1, 1), max-width 0s ease 0.165s;
transition: opacity 0.165s cubic-bezier(0.4, 0, 1, 1), max-width 0s ease 0.165s
}
.ytp-big-mode .ytp-cards-teaser .ytp-cards-teaser-text {
padding: 0 66px 0 12px;
line-height: 46px
}
.ytp-cards-teaser-shown .ytp-cards-teaser .ytp-cards-teaser-text {
max-width: 415px;
opacity: 1;
-moz-transition: opacity 0.165s cubic-bezier(0, 0, 0.2, 1) 0.415s;
-webkit-transition: opacity 0.165s cubic-bezier(0, 0, 0.2, 1) 0.415s;
transition: opacity 0.165s cubic-bezier(0, 0, 0.2, 1) 0.415s
}
.ytp-big-mode.ytp-cards-teaser-shown .ytp-cards-teaser .ytp-cards-teaser-text {
max-width: 635px
}
.ytp-sb {
display: inline-block;
float: none
}
.ytp-sb .ytp-sb-unsubscribe, .ytp-sb.ytp-sb-subscribed .ytp-sb-subscribe {
display: none
}
.ytp-sb.ytp-sb-subscribed .ytp-sb-unsubscribe {
display: flex
}
.ytp-sb-subscribe, .ytp-sb-unsubscribe {
border-radius: 2px;
border: none;
direction: ltr;
display: flex;
font-size: 14px;
font-weight: 500;
letter-spacing: 0.007px;
line-height: 16px;
padding: 10px 16px;
text-transform: uppercase;
white-space: nowrap;
-moz-user-select: none;
-ms-user-select: none;
-webkit-user-select: none
}
.ytp-sb-subscribe, a.ytp-sb-subscribe {
background-color: #e62117;
color: #fff
}
.ytp-sb-subscribe .ytp-sb-count {
color: rgba(255, 255, 255, 0.8)
}
.ytp-sb-unsubscribe {
background-color: #eee;
color: rgba(17, 17, 17, 0.6)
}
.ytp-sb-subscribe[disabled], .ytp-sb-unsubscribe[disabled] {
background-color: #f3908b
}
.ytp-sb-subscribe:focus, .ytp-sb-unsubscribe:focus {
outline: none
}
.ytp-sb.ytp-sb-classic {
background-color: white;
border-radius: 2px;
margin: 4px 0
}
.ytp-sb-classic .ytp-sb-subscribe[disabled], .ytp-sb-classic .ytp-sb-unsubscribe[disabled] {
opacity: 0.5
}
.ytp-sb-text {
display: flex
}
.ytp-sb-count {
margin-left: 4px
}
.ytp-sb-classic .ytp-sb-subscribe, .ytp-sb-classic .ytp-sb-unsubscribe {
border-radius: 2px;
font-size: 12px !important;
font-weight: normal;
padding: 0 !important;
text-transform: none
}
.ytp-sb-classic .ytp-sb-subscribe {
border: 1px solid #e62117
}
.ytp-sb-classic .ytp-sb-unsubscribe {
border: 1px solid #ccc
}
.ytp-sb-classic .ytp-sb-text {
padding: 3px 6px
}
.ytp-sb-classic .ytp-sb-count {
padding: 3px 6px;
margin: -1px;
border: 1px solid #ccc;
border-top-right-radius: 2px;
border-bottom-right-radius: 2px
}
.ytp-sb-classic .ytp-sb-subscribe .ytp-sb-count {
border-left: 0;
background-color: #fafafa
}
.ytp-sb-classic .ytp-sb-unsubscribe {
background-color: #fafafa
}
.ytp-sb-classic .ytp-sb-subscribe .ytp-sb-text {
color: #fefefe;
background-color: #e62117
}
.ytp-sb-classic .ytp-sb-count, .ytp-sb-classic .ytp-sb-unsubscribe .ytp-sb-text {
background-color: #fafafa;
color: #737373
}
.ytp-sb-classic .ytp-sb-icon {
height: 12px;
margin-right: 6px;
position: relative;
top: 2px;
width: 16px
}
.ytp-sb-classic .ytp-sb-subscribe .ytp-sb-icon {
background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAMCAYAAABr5z2BAAAAnUlEQVQ4T2P8//+/JwMDw1wGBgZJBtLAcwYGhmTG////PyNDM8yq5yAD/pNmMapqnAY8k5JgEFmxlIHNzhmv+TgNeMrJycAowMkgNHM6A4dfOE5DcBrwnJOT4f/vHwyMbAwMXGnJDPwT5mA1hEgDkhj4J4AiChMQ9sKMaQwc/hGke4HiQCQ2ailNSC9ABnhBk7IEsbZC1T1lYGBIAwBS1UxBE9/2iAAAAABJRU5ErkJggg==")
}
.ytp-sb-classic .ytp-sb-unsubscribe .ytp-sb-icon {
background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAMCAYAAABr5z2BAAAA/UlEQVQ4T6WSMUoEQRBF608iaLqZ4AnE0DOIYGYuGNjdM4jRiLkYjSIsLF0tgpkgE3gAccDUG5h6ACMNp75MoMyuyo5sp9X1ftX/BVnwYcF++RcgpbRGciIiY+/9Qyc+GBBj3Myy7FpERmY2CSGcDQao6i6A806Q5LH3/u5r9akJqqpaKcvyo+cLVPUEwKGIvJnZfgjhue/bN0BVj0TkwMzyPM+fUkrLJMcAtkm+ANhzzr3Omt4H7AC4FJElEbkguQVgg+Rj27ahKIr33xKbWiHGuA7gBsBq99nMrpqmOa3ruv0r7h8ppJRGJCOAe+fc7bw7GRzj4AnmKc7WPwFWRF0Nc9RQxwAAAABJRU5ErkJggg==")
}
.yt-ui-ellipsis {
background-color: #fff;
display: block;
line-height: 1.3em;
overflow: hidden;
position: relative;
text-overflow: ellipsis;
white-space: normal;
word-wrap: break-word
}
.yt-ui-ellipsis-nowrap-single-line {
background-color: #fff;
display: block;
line-height: 1.3em;
overflow: hidden;
position: relative;
text-overflow: ellipsis;
white-space: nowrap;
word-wrap: break-word;
max-height: 1.3em
}
.yt-ui-ellipsis::before {
background-color: inherit;
position: absolute
}
.yt-ui-ellipsis::after {
background-color: inherit;
position: absolute
}
.yt-ui-ellipsis::before {
content: "…";
right: 0
}
.yt-ui-ellipsis::after {
content: "";
height: 100%;
width: 100%
}
.yt-ui-ellipsis-2::before {
top: 1.3em
}
.yt-ui-ellipsis-3::before {
top: 2.6em
}
.yt-ui-ellipsis-4::before {
top: 3.9em
}
.yt-ui-ellipsis-6::before {
top: 6.5em
}
.yt-ui-ellipsis-10::before {
top: 11.7em
}
.yt-ui-ellipsis-2 {
max-height: 2.6em
}
.yt-ui-ellipsis-3 {
max-height: 3.9em
}
.yt-ui-ellipsis-4 {
max-height: 5.2em
}
.yt-ui-ellipsis-6 {
max-height: 7.8em
}
.yt-ui-ellipsis-10 {
max-height: 13em
}
.webkit .yt-ui-ellipsis {
display: -webkit-box;
-webkit-box-orient: vertical
}
.webkit .yt-ui-ellipsis-2 {
-webkit-line-clamp: 2
}
.webkit .yt-ui-ellipsis-3 {
-webkit-line-clamp: 3
}
.webkit .yt-ui-ellipsis-4 {
-webkit-line-clamp: 4
}
.webkit .yt-ui-ellipsis-6 {
-webkit-line-clamp: 6
}
.webkit .yt-ui-ellipsis-10 {
-webkit-line-clamp: 10
}
.webkit .yt-ui-ellipsis::before {
content: initial
}
.webkit .yt-ui-ellipsis::after {
content: "";
position: static;
visibility: hidden
}
.yt-ui-ellipsis[dir="rtl"]::before {
left: 0;
right: auto
}
.ytp-ce-valign-outer {
display: table;
min-height: 100%;
width: 100%
}
.ytp-ce-valign-inner {
display: table-cell;
text-align: left;
vertical-align: middle
}
a.ytp-ce-link {
display: block;
color: #2793e6
}
a.ytp-ce-link:hover, a.ytp-ce-link:visited {
color: #2793e6
}
a.ytp-ce-link:hover {
text-decoration: underline
}
.ytp-ce-shadow {
opacity: 0;
outline: solid #000;
position: absolute;
transition: opacity 0.2s cubic-bezier(0, 0, 0.2, 1);
z-index: 12
}
.ytp-ce-shadow:not([aria-hidden=true]) {
opacity: 0.25;
transition: opacity 0.2s cubic-bezier(0.4, 0, 1, 1)
}
.ytp-ce-element {
border: 1px solid rgba(255, 255, 255, 0.4);
box-shadow: 0 0 4px rgba(0, 0, 0, 0.5);
cursor: pointer;
display: block;
font-family: Roboto, Arial, sans-serif;
line-height: 1.3em;
margin: -1px;
position: absolute;
-webkit-font-smoothing: auto;
z-index: 12;
opacity: 0;
transition: visibility 0s linear 0.2s, opacity 0.2s cubic-bezier(0, 0, 0.2, 1), border-color 0.2s cubic-bezier(0, 0, 0.2, 1);
visibility: hidden
}
.html5-video-player.ended-mode .ytp-ce-element {
display: none
}
.ytp-ce-element.ytp-ce-placeholder a.ytp-ce-covering-overlay {
cursor: default
}
.ytp-ce-element.ytp-ce-element-show {
opacity: 1;
transition: visibility 0s linear 0s, opacity 0.2s cubic-bezier(0.4, 0, 1, 1), border-color 0.2s cubic-bezier(0.4, 0, 1, 1);
visibility: visible
}
.ytp-ce-element.ytp-ce-force-expand, .ytp-ce-element.ytp-ce-element-hover {
border: 1px solid #fff;
outline: none;
z-index: 13;
opacity: 1;
transition: visibility 0s linear 0s, opacity 0.2s cubic-bezier(0.4, 0, 1, 1), border-color 0.2s cubic-bezier(0.4, 0, 1, 1);
visibility: visible
}
.ytp-ce-element.ytp-ce-element-show:focus, .ytp-ce-element.ytp-ce-element-show:hover {
outline: none
}
.ytp-ce-element-shadow {
background-color: #000;
bottom: -1px;
left: -1px;
opacity: 0;
position: absolute;
right: -1px;
top: -1px;
transition: opacity 0.2s cubic-bezier(0, 0, 0.2, 1);
z-index: 12
}
.ytp-ce-element.ytp-ce-element-show.ytp-ce-element-shadow-show .ytp-ce-element-shadow {
opacity: 0.25;
transition: opacity 0.2s cubic-bezier(0.4, 0, 1, 1)
}
.ytp-ce-covering-image {
background-color: #fff;
background-position: center;
background-size: cover;
bottom: -2px;
left: -1px;
position: absolute;
right: -1px;
top: -1px
}
.ytp-ce-covering-shadow-top {
height: 33%;
opacity: 0.8;
position: absolute;
top: 0;
width: 100%;
background-image: -moz-linear-gradient(top, #000 0, transparent 100%);
background-image: -ms-linear-gradient(top, #000 0, transparent 100%);
background-image: -o-linear-gradient(top, #000 0, transparent 100%);
background-image: -webkit-linear-gradient(top, #000 0, transparent 100%);
background-image: linear-gradient(to bottom, #000 0, transparent 100%)
}
.ytp-ce-covering-shadow-bottom {
bottom: 0;
background-image: -moz-linear-gradient(top, transparent 0, #000 100%);
background-image: -ms-linear-gradient(top, transparent 0, #000 100%);
background-image: -o-linear-gradient(top, transparent 0, #000 100%);
background-image: -webkit-linear-gradient(top, transparent 0, #000 100%);
background-image: linear-gradient(to bottom, transparent 0, #000 100%)
}
.ytp-ce-covering-overlay {
height: 100%;
position: absolute;
width: 100%;
z-index: 12
}
.html5-video-player.ended-mode .ytp-ce-shadow {
display: none
}
.ytp-ce-video, .ytp-ce-playlist {
overflow: hidden
}
.ytp-ce-video-title, .ytp-ce-playlist-title {
background-color: transparent;
color: #fff;
font-size: 12px;
font-weight: 500;
line-height: 14px;
margin: 6px 8px;
max-height: 28px;
text-shadow: 0 1px 0 rgba(0, 0, 0, 0.4)
}
.ytp-ce-video-duration {
background-color: rgba(0, 0, 0, 0.8);
border-radius: 2px;
bottom: 0;
color: rgba(255, 255, 255, 0.8);
margin: 0 4px 4px 0;
padding: 4px 6px;
position: absolute;
right: 0
}
.ytp-ce-playlist-count {
background-color: rgba(0, 0, 0, 0.75);
bottom: 0;
left: 0;
position: absolute;
right: 0
}
.ytp-ce-playlist-icon {
left: 8px;
position: absolute;
top: 2px
}
.ytp-ce-playlist-count-text {
color: rgba(255, 255, 255, 0.8);
height: 24px;
line-height: 24px;
margin-left: 32px
}
.ytp-ce-expanding-overlay {
position: absolute;
opacity: 0;
transition: visibility 0s linear 0.2s, opacity 0.2s cubic-bezier(0, 0, 0.2, 1), border-color 0.2s cubic-bezier(0, 0, 0.2, 1);
visibility: hidden
}
.ytp-ce-expanding-overlay-content {
display: table
}
.ytp-ce-expanding-overlay-body {
display: table-cell;
position: relative;
vertical-align: middle
}
.ytp-ce-element.ytp-ce-force-expand .ytp-ce-expanding-overlay, .ytp-ce-element.ytp-ce-element-hover .ytp-ce-expanding-overlay {
z-index: 13;
opacity: 1;
transition: visibility 0s linear 0s, opacity 0.2s cubic-bezier(0.4, 0, 1, 1), border-color 0.2s cubic-bezier(0.4, 0, 1, 1);
visibility: visible
}
.ytp-ce-element.ytp-ce-force-expand .ytp-ce-expanding-image, .ytp-ce-element.ytp-ce-element-hover .ytp-ce-expanding-image {
z-index: 13
}
.ytp-ce-expanding-overlay-background {
background-color: #fff;
border-radius: 2px;
box-shadow: 0 0 4px #000;
height: 100%;
left: 0;
margin: -8px;
padding: 8px;
position: absolute;
top: 0;
width: 100%
}
.ytp-ce-expanding-image {
background-position: center;
background-size: cover;
height: 100%;
position: absolute;
width: 100%
}
.ytp-ce-expanding-icon {
background-color: #000;
background-position: center;
background-repeat: no-repeat;
background-size: 20px 20px;
border-radius: 2px;
bottom: 2px;
height: 24px;
position: absolute;
right: 2px;
width: 24px;
-moz-transition: opacity 0.2s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition: opacity 0.2s cubic-bezier(0, 0, 0.2, 1);
transition: opacity 0.2s cubic-bezier(0, 0, 0.2, 1)
}
.ytp-ce-element.ytp-ce-force-expand .ytp-ce-expanding-icon, .ytp-ce-element.ytp-ce-element-hover .ytp-ce-expanding-icon {
opacity: 0
}
.ytp-ce-element.ytp-ce-top-left-quad .ytp-ce-expanding-overlay {
left: 0;
padding-left: 100%;
top: 0
}
.ytp-ce-element.ytp-ce-top-right-quad .ytp-ce-expanding-overlay {
padding-right: 100%;
right: 0;
top: 0
}
.ytp-ce-element.ytp-ce-bottom-left-quad .ytp-ce-expanding-overlay {
bottom: 0;
left: 0;
padding-left: 100%
}
.ytp-ce-element.ytp-ce-bottom-right-quad .ytp-ce-expanding-overlay {
bottom: 0;
padding-right: 100%;
right: 0
}
.ytp-ce-element.ytp-ce-website.ytp-ce-element-show, .ytp-ce-element.ytp-ce-channel.ytp-ce-element-show, .ytp-ce-element.ytp-ce-website.ytp-ce-element-show.ytp-ce-element-hover, .ytp-ce-element.ytp-ce-channel.ytp-ce-element-show.ytp-ce-element-hover, .ytp-ce-element.ytp-ce-website.ytp-ce-element-show.ytp-ce-force-expand, .ytp-ce-element.ytp-ce-channel.ytp-ce-element-show.ytp-ce-force-expand {
border: 0;
margin: 0
}
.ytp-ce-channel-title {
font-weight: 500
}
.ytp-ce-channel-subscribe {
color: #767676;
display: inline-block;
margin-top: 4px;
transform: scale(1);
transform-origin: top left
}
.ytp-ce-channel-subscribers-text {
color: #767676;
display: none;
margin-bottom: 24px;
margin-top: 6px
}
.ytp-ce-channel-metadata {
color: #767676
}
.ytp-ce-channel-this .ytp-ce-channel-metadata {
border-top: 1px solid #ebebeb;
display: none
}
.ytp-ce-channel-that .ytp-ce-channel-metadata {
font-size: 12px;
line-height: 14px;
margin-top: 4px;
max-height: 42px
}
.ytp-ce-channel, .ytp-ce-channel .ytp-ce-expanding-image, .ytp-ce-channel .ytp-ce-element-shadow {
border-radius: 50%
}
.ytp-ce-website-title {
color: #333;
font-weight: 500;
margin-bottom: 2px
}
.ytp-ce-website-metadata {
color: #767676;
margin-top: 4px;
white-space: nowrap
}
.ytp-ce-website-goto {
display: inline-block;
font-weight: 500;
margin-top: 4px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
width: 100%
}
.ytp-ce-website .ytp-ce-expanding-image {
background-color: #fff
}
.ytp-ce-size-346 {
font-size: 12px
}
.ytp-ce-size-346 .ytp-ce-covering-icon {
bottom: 4px;
right: 4px
}
.ytp-ce-size-346 .ytp-ce-expanding-overlay-body-padding {
min-width: 115px
}
.ytp-ce-size-346 .ytp-ce-expanding-overlay-body-padding > :not(.ytp-ce-subscribe-container) {
width: 115px
}
.ytp-ce-size-346.ytp-ce-top-left-quad .ytp-ce-expanding-overlay-body-padding, .ytp-ce-size-346.ytp-ce-bottom-left-quad .ytp-ce-expanding-overlay-body-padding {
margin: 0 0 0 8px
}
.ytp-ce-size-346.ytp-ce-top-right-quad .ytp-ce-expanding-overlay-body-padding, .ytp-ce-size-346.ytp-ce-bottom-right-quad .ytp-ce-expanding-overlay-body-padding {
margin: 0 8px 0 0
}
.ytp-ce-size-346 .ytp-ce-expanding-overlay-background {
margin: -8px;
padding: 8px
}
.ytp-ce-size-346 .ytp-ce-expanding-icon {
bottom: 2px;
right: 2px
}
.ytp-ce-size-346.ytp-ce-channel-that .ytp-ce-channel-metadata {
margin-top: 0
}
.ytp-ce-size-426 {
font-size: 12px
}
.ytp-ce-size-426 .ytp-ce-covering-icon {
bottom: 4px;
right: 4px
}
.ytp-ce-size-426 .ytp-ce-expanding-overlay-body-padding {
min-width: 115px
}
.ytp-ce-size-426 .ytp-ce-expanding-overlay-body-padding > :not(.ytp-ce-subscribe-container) {
width: 115px
}
.ytp-ce-size-426.ytp-ce-top-left-quad .ytp-ce-expanding-overlay-body-padding, .ytp-ce-size-426.ytp-ce-bottom-left-quad .ytp-ce-expanding-overlay-body-padding {
margin: 0 4px 0 12px
}
.ytp-ce-size-426.ytp-ce-top-right-quad .ytp-ce-expanding-overlay-body-padding, .ytp-ce-size-426.ytp-ce-bottom-right-quad .ytp-ce-expanding-overlay-body-padding {
margin: 0 12px 0 4px
}
.ytp-ce-size-426 .ytp-ce-expanding-icon {
bottom: 4px;
right: 4px
}
.ytp-ce-size-426.ytp-ce-channel-that .ytp-ce-channel-metadata {
margin-top: 0
}
.ytp-ce-size-346 .ytp-ce-video-title, .ytp-ce-size-346 .ytp-ce-playlist-title, .ytp-ce-size-426 .ytp-ce-video-title, .ytp-ce-size-426 .ytp-ce-playlist-title {
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
max-width: 85%
}
.ytp-ce-size-470 {
font-size: 12px
}
.ytp-ce-size-470 .ytp-ce-website-title, .ytp-ce-size-470 .ytp-ce-channel-title {
font-size: 12px;
line-height: 14px
}
.ytp-ce-size-470 .ytp-ce-website-goto {
font-size: 12px
}
.ytp-ce-size-470 .ytp-ce-expanding-overlay-body-padding {
min-width: 136px
}
.ytp-ce-size-470 .ytp-ce-expanding-overlay-body-padding > :not(.ytp-ce-subscribe-container) {
width: 136px
}
.ytp-ce-size-470.ytp-ce-top-left-quad .ytp-ce-expanding-overlay-body-padding, .ytp-ce-size-470.ytp-ce-bottom-left-quad .ytp-ce-expanding-overlay-body-padding {
margin: 0 4px 0 12px
}
.ytp-ce-size-470.ytp-ce-top-right-quad .ytp-ce-expanding-overlay-body-padding, .ytp-ce-size-470.ytp-ce-bottom-right-quad .ytp-ce-expanding-overlay-body-padding {
margin: 0 12px 0 4px
}
.ytp-ce-size-470 .ytp-ce-expanding-icon {
bottom: 4px;
right: 4px
}
.ytp-ce-size-506 {
font-size: 12px
}
.ytp-ce-size-506 .ytp-ce-website-title, .ytp-ce-size-506 .ytp-ce-channel-title {
font-size: 12px;
line-height: 14px
}
.ytp-ce-size-506 .ytp-ce-website-goto {
font-size: 12px
}
.ytp-ce-size-506 .ytp-ce-expanding-overlay-body-padding {
min-width: 136px
}
.ytp-ce-size-506 .ytp-ce-expanding-overlay-body-padding > :not(.ytp-ce-subscribe-container) {
width: 136px
}
.ytp-ce-size-506.ytp-ce-top-left-quad .ytp-ce-expanding-overlay-body-padding, .ytp-ce-size-506.ytp-ce-bottom-left-quad .ytp-ce-expanding-overlay-body-padding {
margin: 0 4px 0 12px
}
.ytp-ce-size-506.ytp-ce-top-right-quad .ytp-ce-expanding-overlay-body-padding, .ytp-ce-size-506.ytp-ce-bottom-right-quad .ytp-ce-expanding-overlay-body-padding {
margin: 0 12px 0 4px
}
.ytp-ce-size-506 .ytp-ce-expanding-icon {
bottom: 4px;
right: 4px
}
.ytp-ce-size-570 {
font-size: 12px
}
.ytp-ce-size-570 .ytp-ce-website-title, .ytp-ce-size-570 .ytp-ce-channel-title {
font-size: 12px;
line-height: 14px
}
.ytp-ce-size-570 .ytp-ce-website-goto {
font-size: 12px
}
.ytp-ce-size-570 .ytp-ce-expanding-overlay-body-padding {
min-width: 136px
}
.ytp-ce-size-570 .ytp-ce-expanding-overlay-body-padding > :not(.ytp-ce-subscribe-container) {
width: 136px
}
.ytp-ce-size-570.ytp-ce-top-left-quad .ytp-ce-expanding-overlay-body-padding, .ytp-ce-size-570.ytp-ce-bottom-left-quad .ytp-ce-expanding-overlay-body-padding {
margin: 0 4px 0 12px
}
.ytp-ce-size-570.ytp-ce-top-right-quad .ytp-ce-expanding-overlay-body-padding, .ytp-ce-size-570.ytp-ce-bottom-right-quad .ytp-ce-expanding-overlay-body-padding {
margin: 0 12px 0 4px
}
.ytp-ce-size-570 .ytp-ce-expanding-icon {
bottom: 4px;
right: 4px
}
.ytp-ce-size-640 {
font-size: 12px
}
.ytp-ce-size-640 .ytp-ce-video-title, .ytp-ce-size-640 .ytp-ce-playlist-title {
font-size: 13px;
line-height: 15px;
max-height: 30px
}
.ytp-ce-size-640 .ytp-ce-website-title, .ytp-ce-size-640 .ytp-ce-channel-title {
font-size: 13px;
line-height: 15px
}
.ytp-ce-size-640 .ytp-ce-website-goto {
font-size: 12px
}
.ytp-ce-size-640 .ytp-ce-expanding-overlay-body-padding {
min-width: 136px
}
.ytp-ce-size-640 .ytp-ce-expanding-overlay-body-padding > :not(.ytp-ce-subscribe-container) {
width: 136px
}
.ytp-ce-size-640.ytp-ce-top-left-quad .ytp-ce-expanding-overlay-body-padding, .ytp-ce-size-640.ytp-ce-bottom-left-quad .ytp-ce-expanding-overlay-body-padding {
margin: 0 8px 0 16px
}
.ytp-ce-size-640.ytp-ce-top-right-quad .ytp-ce-expanding-overlay-body-padding, .ytp-ce-size-640.ytp-ce-bottom-right-quad .ytp-ce-expanding-overlay-body-padding {
margin: 0 16px 0 8px
}
.ytp-ce-size-640 .ytp-ce-expanding-icon {
bottom: 8px;
right: 8px
}
.ytp-ce-size-853 {
font-size: 14px
}
.ytp-ce-size-853 .ytp-ce-video-title, .ytp-ce-size-853 .ytp-ce-playlist-title {
font-size: 15px;
line-height: 18px;
margin: 10px 12px;
max-height: 36px
}
.ytp-ce-size-853 .ytp-ce-video-duration {
margin: 0 6px 6px 0
}
.ytp-ce-size-853 .ytp-ce-website-title, .ytp-ce-size-853 .ytp-ce-channel-title {
font-size: 15px;
line-height: 18px
}
.ytp-ce-size-853 .ytp-ce-website-goto {
font-size: 12px
}
.ytp-ce-size-853.ytp-ce-channel-this .ytp-ce-channel-metadata {
font-size: 12px;
line-height: 14px;
margin-top: 8px;
padding-top: 8px;
max-height: 42px;
display: block
}
.ytp-ce-size-853.ytp-ce-channel-that .ytp-ce-channel-metadata {
font-size: 15px;
line-height: 18px;
margin-top: 4px;
max-height: 54px
}
.ytp-ce-size-853 .ytp-ce-expanding-overlay-body-padding {
min-width: 176px
}
.ytp-ce-size-853 .ytp-ce-expanding-overlay-body-padding > :not(.ytp-ce-subscribe-container) {
width: 176px
}
.ytp-ce-size-853.ytp-ce-top-left-quad .ytp-ce-expanding-overlay-body-padding, .ytp-ce-size-853.ytp-ce-bottom-left-quad .ytp-ce-expanding-overlay-body-padding {
margin: 0 8px 0 16px
}
.ytp-ce-size-853.ytp-ce-top-right-quad .ytp-ce-expanding-overlay-body-padding, .ytp-ce-size-853.ytp-ce-bottom-right-quad .ytp-ce-expanding-overlay-body-padding {
margin: 0 16px 0 8px
}
.ytp-ce-size-853 .ytp-ce-expanding-icon {
background-size: 24px 24px;
bottom: 8px;
height: 32px;
right: 8px;
width: 32px
}
.ytp-ce-size-853 .ytp-ce-playlist-icon {
left: 8px;
top: 4px
}
.ytp-ce-size-853 .ytp-ce-playlist-count-text {
height: 32px;
line-height: 32px;
margin-left: 40px
}
.ytp-ce-size-1280 {
font-size: 18px
}
.ytp-ce-size-1280 .ytp-ce-video-title, .ytp-ce-size-1280 .ytp-ce-playlist-title {
font-size: 21px;
line-height: 24px;
margin: 18px 20px;
max-height: 48px
}
.ytp-ce-size-1280 .ytp-ce-video-duration {
margin: 0 12px 12px 0
}
.ytp-ce-size-1280 .ytp-ce-website-title, .ytp-ce-size-1280 .ytp-ce-channel-title {
font-size: 21px;
line-height: 24px
}
.ytp-ce-size-1280 .ytp-ce-website-metadata, .ytp-ce-size-1280 .ytp-ce-website-goto {
font-size: 18px;
margin-top: 8px
}
.ytp-ce-size-1280 .ytp-ce-channel-metadata {
font-size: 18px;
line-height: 21px;
max-height: 63px
}
.ytp-ce-size-1280 .ytp-ce-channel-subscribe {
height: 32px;
transform: scale(1.3)
}
.ytp-ce-size-1280.ytp-ce-channel-that .ytp-ce-channel-subscribers-text {
display: block
}
.ytp-ce-size-1280.ytp-ce-channel-this .ytp-ce-channel-metadata {
margin-top: 12px;
padding-top: 12px;
display: block
}
.ytp-ce-size-1280 .ytp-ce-expanding-overlay-body-padding {
min-width: 264px
}
.ytp-ce-size-1280 .ytp-ce-expanding-overlay-body-padding > :not(.ytp-ce-subscribe-container) {
width: 264px
}
.ytp-ce-size-1280.ytp-ce-top-left-quad .ytp-ce-expanding-overlay-body-padding, .ytp-ce-size-1280.ytp-ce-bottom-left-quad .ytp-ce-expanding-overlay-body-padding {
margin: 0 16px 0 32px
}
.ytp-ce-size-1280.ytp-ce-top-right-quad .ytp-ce-expanding-overlay-body-padding, .ytp-ce-size-1280.ytp-ce-bottom-right-quad .ytp-ce-expanding-overlay-body-padding {
margin: 0 32px 0 16px
}
.ytp-ce-size-1280 .ytp-ce-expanding-overlay-background {
margin: -16px;
padding: 16px
}
.ytp-ce-size-1280 .ytp-ce-expanding-icon {
background-size: 32px 32px;
bottom: 10px;
height: 40px;
right: 10px;
width: 40px
}
.ytp-ce-size-1280 .ytp-ce-playlist-icon {
left: 10px;
top: 8px
}
.ytp-ce-size-1280 .ytp-ce-playlist-count-text {
height: 40px;
line-height: 40px;
margin-left: 46px
}
.ytp-ce-size-1920 {
font-size: 28px
}
.ytp-ce-size-1920 .ytp-ce-video-title, .ytp-ce-size-1920 .ytp-ce-playlist-title {
font-size: 32px;
line-height: 38px;
margin: 18px 20px;
max-height: 76px
}
.ytp-ce-size-1920 .ytp-ce-video-duration {
margin: 0 20px 20px 0
}
.ytp-ce-size-1920 .ytp-ce-website-title, .ytp-ce-size-1920 .ytp-ce-channel-title {
font-size: 32px;
line-height: 38px
}
.ytp-ce-size-1920 .ytp-ce-website-metadata, .ytp-ce-size-1920 .ytp-ce-website-goto {
font-size: 28px;
margin-top: 12px
}
.ytp-ce-size-1920 .ytp-ce-channel-metadata {
font-size: 28px;
line-height: 34px;
max-height: 102px
}
.ytp-ce-size-1920 .ytp-ce-channel-subscribe {
height: 80px;
margin-top: -16px;
transform: scale(2.5)
}
.ytp-ce-size-1920.ytp-ce-channel-that .ytp-ce-channel-subscribers-text {
display: block
}
.ytp-ce-size-1920.ytp-ce-channel-this .ytp-ce-channel-metadata {
display: block;
margin-top: 18px;
padding-top: 18px
}
.ytp-ce-size-1920 .ytp-ce-expanding-overlay-body-padding {
min-width: 392px
}
.ytp-ce-size-1920 .ytp-ce-expanding-overlay-body-padding > :not(.ytp-ce-subscribe-container) {
width: 392px
}
.ytp-ce-size-1920.ytp-ce-top-left-quad .ytp-ce-expanding-overlay-body-padding, .ytp-ce-size-1920.ytp-ce-bottom-left-quad .ytp-ce-expanding-overlay-body-padding {
margin: 0 24px 0 48px
}
.ytp-ce-size-1920.ytp-ce-top-right-quad .ytp-ce-expanding-overlay-body-padding, .ytp-ce-size-1920.ytp-ce-bottom-right-quad .ytp-ce-expanding-overlay-body-padding {
margin: 0 48px 0 24px
}
.ytp-ce-size-1920 .ytp-ce-expanding-overlay-background {
margin: -24px;
padding: 24px
}
.ytp-ce-size-1920 .ytp-ce-expanding-icon {
background-size: 56px 56px;
bottom: 20px;
height: 62px;
right: 20px;
width: 62px
}
.ytp-ce-size-1920 .ytp-ce-playlist-icon {
left: 12px;
top: 12px;
height: 32px;
width: 32px
}
.ytp-ce-size-1920 .ytp-ce-playlist-count-text {
height: 56px;
line-height: 56px;
margin-left: 56px
}
.ytp-ce-channel-subscribe.ytp-ce-subscribe-button {
height: auto;
margin-top: 0;
transform: scale(1)
}
.ytp-ce-size-346 .ytp-sb-unsubscribe, .ytp-ce-size-346 .ytp-sb-subscribe, .ytp-ce-size-426 .ytp-sb-unsubscribe, .ytp-ce-size-426 .ytp-sb-subscribe, .ytp-ce-size-470 .ytp-sb-unsubscribe, .ytp-ce-size-470 .ytp-sb-subscribe, .ytp-ce-size-506 .ytp-sb-unsubscribe, .ytp-ce-size-506 .ytp-sb-subscribe {
font-size: 11px;
padding: 8px
}
.ytp-contextmenu {
position: absolute;
top: 0;
left: 0;
z-index: 100;
font-family: Roboto, Arial, Helvetica, sans-serif;
text-align: left;
direction: ltr;
font-size: 11px;
line-height: 1.3;
-webkit-font-smoothing: antialiased;
will-change: width, height
}
.ytp-dni.ytp-contextmenu {
text-shadow: none
}
.ytp-big-mode.ytp-contextmenu {
font-size: 17px
}
.ytp-contextmenu a, .ytp-contextmenu a:focus, .ytp-contextmenu a:hover {
color: inherit;
text-decoration: none
}
.ytp-copytext {
margin: 0 10px;
max-width: 200px;
outline: none;
text-shadow: none;
overflow: hidden;
white-space: nowrap;
word-wrap: normal;
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
-moz-user-select: text;
-ms-user-select: text;
-webkit-user-select: text
}
.ytp-copytext::-moz-selection {
background-color: white;
color: black
}
.ytp-html5-clipboard {
top: 0;
left: 100%;
position: absolute;
-moz-user-select: text;
-ms-user-select: text;
-webkit-user-select: text
}
.ytp-thumbnail-overlay {
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
z-index: 14;
background-position: center;
background-repeat: no-repeat;
-moz-transition: opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition: opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
transition: opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
background-size: cover;
-moz-background-size: cover;
-webkit-background-size: cover
}
.ytp-thumbnail-overlay[aria-hidden=true] {
opacity: 0;
-moz-transition: opacity 0.25s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: opacity 0.25s cubic-bezier(0.4, 0, 1, 1);
transition: opacity 0.25s cubic-bezier(0.4, 0, 1, 1)
}
.ytp-thumbnail-overlay-image {
background-size: cover;
-moz-background-size: cover;
-webkit-background-size: cover;
background-position: center;
background-repeat: no-repeat;
width: 100%;
height: 100%;
position: absolute
}
.ytp-thumbnail-overlay-curtain {
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.6);
position: absolute;
top: 0;
left: 0
}
.unstarted-mode:not(.playing-mode) .ytp-cued-thumbnail-overlay:not([aria-hidden=true]), .ended-mode .ytp-cued-thumbnail-overlay:not([aria-hidden=true]) {
cursor: pointer
}
.ytp-mweb-endscreen-hide-previous .ytp-mweb-endscreen-play-previous {
display: none
}
.ytp-mweb-endscreen-play-previous {
position: absolute;
left: 25%;
top: 33%;
width: 72px;
height: 72px;
margin-left: -36px
}
.ytp-mweb-endscreen-play-next {
position: absolute;
left: 75%;
top: 33%;
width: 72px;
height: 72px;
margin-left: -36px
}
.ytp-mweb-endscreen-replay {
position: absolute;
left: 50%;
top: 33%;
width: 72px;
height: 72px;
margin-left: -36px
}
.ytp-mweb-endscreen-thumbnail-overlay-image {
background-size: cover;
-moz-background-size: cover;
-webkit-background-size: cover;
background-position: center;
background-repeat: no-repeat;
width: 100%;
height: 100%;
position: absolute
}
.ytp-channel-overlay .ytp-thumbnail-overlay-image {
-ms-filter: blur(9px);
-webkit-filter: blur(9px);
filter: blur(9px)
}
.subscribecard-endscreen .ytp-author-image {
float: left
}
.subscribecard-endscreen .ytp-author-name {
color: #fff;
font-size: 18px;
margin-bottom: 10px
}
.subscribecard-endscreen .ytp-subscribe-card {
position: absolute;
left: 22px;
height: 88px;
top: 50%;
margin-top: -44px
}
.subscribecard-endscreen .ytp-subscribe-card-right {
float: left;
margin-left: 15px;
margin-top: 18px
}
.subscribecard-endscreen .ytp-channel-banner-container {
height: 100%;
left: -50%;
width: 100%;
position: absolute
}
.ytp-upnext {
position: absolute;
display: block;
vertical-align: top;
opacity: 1;
overflow: hidden;
width: 100%;
height: 100%;
-moz-transition: all 0.1s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: all 0.1s cubic-bezier(0.4, 0, 1, 1);
transition: all 0.1s cubic-bezier(0.4, 0, 1, 1);
z-index: 35
}
.ytp-upnext-top {
width: 100%;
position: absolute;
margin-left: auto;
margin-right: auto;
bottom: 50%;
margin-bottom: 52px
}
.ytp-small-mode .ytp-upnext-top {
margin-bottom: 26px
}
.ytp-big-mode .ytp-upnext-top {
margin-bottom: 76px
}
.ytp-upnext-bottom {
width: 100%;
position: absolute;
margin-left: auto;
margin-right: auto;
top: 50%;
margin-top: 52px
}
.ytp-small-mode .ytp-upnext-bottom {
margin-top: 26px
}
.ytp-big-mode .ytp-upnext-bottom {
margin-top: 76px
}
.ytp-upnext-title {
display: block;
padding: 10px 10px 2px;
text-align: center;
font-size: 200%;
font-weight: 500;
overflow: hidden;
white-space: nowrap;
word-wrap: normal;
-o-text-overflow: ellipsis;
text-overflow: ellipsis
}
.ytp-small-mode .ytp-upnext-title {
font-size: 150%
}
.ytp-upnext-author {
display: block;
line-height: 1.3em;
overflow: hidden;
padding: 0 10px 10px;
text-align: center;
color: #fff;
font-size: 130%
}
.ytp-upnext-header {
display: block;
font-size: 140%;
text-align: center;
padding-bottom: 7px
}
.ytp-small-mode .ytp-upnext-header {
padding-bottom: 0
}
.ytp-upnext-cancel {
display: block;
float: none;
text-align: center
}
.ytp-upnext-cancel-button {
display: inline-block;
float: none;
padding: 10px;
font-size: 140%
}
.ytp-upnext-cancel-button:hover {
background-color: rgba(255, 255, 255, 0.25);
border-radius: 2px
}
.ytp-upnext-close {
position: absolute;
right: 7px;
top: 7px
}
.ytp-upnext-close-button {
width: 24px;
height: 24px;
background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDI0IDI0IiB3aWR0aD0iMTAwJSI+PHBhdGggZD0iTTE5IDYuNDFMMTcuNTkgNSAxMiAxMC41OSA2LjQxIDUgNSA2LjQxIDEwLjU5IDEyIDUgMTcuNTkgNi40MSAxOSAxMiAxMy40MSAxNy41OSAxOSAxOSAxNy41OSAxMy40MSAxMnoiIGZpbGw9IiNmZmYiIC8+PC9zdmc+")
}
.ytp-upnext-autoplay-icon {
position: absolute;
top: 50%;
left: 50%;
width: 98px;
height: 98px;
margin: -49px 0 0 -49px;
-moz-transition: all 0.1s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: all 0.1s cubic-bezier(0.4, 0, 1, 1);
transition: all 0.1s cubic-bezier(0.4, 0, 1, 1)
}
.ytp-small-mode .ytp-upnext-autoplay-icon {
width: 50px;
height: 50px;
margin: -25px 0 0 -25px
}
.ytp-big-mode .ytp-upnext-autoplay-icon {
width: 146px;
height: 146px;
margin: -73px 0 0 -73px
}
.ytp-upnext-canvas {
position: absolute;
top: 50%;
left: 50%;
width: 96px;
height: 96px;
margin: -48px 0 0 -48px
}
.ytp-upnext-paused {
display: block;
text-align: center;
font-size: 120%;
font-style: italic;
opacity: 0
}
.ytp-upnext-autoplay-paused .ytp-upnext-paused {
opacity: 1;
-moz-transition: all 0.1s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: all 0.1s cubic-bezier(0.4, 0, 1, 1);
transition: all 0.1s cubic-bezier(0.4, 0, 1, 1)
}
.ytp-upnext-moving-thumbnail {
display: none;
left: 50%;
min-width: 100%;
min-height: 100%;
position: absolute;
top: 50%;
-moz-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%)
}
.ytp-upnext.ytp-moving-thumbnail-loaded .ytp-upnext-moving-thumbnail {
display: block
}
.ytp-videowall-still {
position: absolute;
display: block;
cursor: pointer;
vertical-align: top;
opacity: 0;
overflow: hidden;
-moz-transform: scale(0.1);
-ms-transform: scale(0.1);
-webkit-transform: scale(0.1);
transform: scale(0.1)
}
.ytp-show-tiles .ytp-videowall-still {
opacity: 1;
-moz-transform: none;
-ms-transform: none;
-webkit-transform: none;
transform: none;
-moz-transition: -moz-transform 0.3s cubic-bezier(0, 0, 0.2, 1), opacity 0.3s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition: -webkit-transform 0.3s cubic-bezier(0, 0, 0.2, 1), opacity 0.3s cubic-bezier(0, 0, 0.2, 1);
-ms-transition: -ms-transform 0.3s cubic-bezier(0, 0, 0.2, 1), opacity 0.3s cubic-bezier(0, 0, 0.2, 1);
transition: transform 0.3s cubic-bezier(0, 0, 0.2, 1), opacity 0.3s cubic-bezier(0, 0, 0.2, 1)
}
.ytp-videowall-still-mini .ytp-videowall-still-info-author, .ytp-videowall-still-mini .ytp-videowall-still-info-duration, .ytp-videowall-still-list .ytp-videowall-still-info-duration, .ytp-videowall-still-mix .ytp-videowall-still-info-duration, .ytp-videowall-still-mini .ytp-videowall-still-info-live, .ytp-videowall-still-list .ytp-videowall-still-info-live, .ytp-videowall-still-mix .ytp-videowall-still-info-live, .ytp-videowall-still[data-is-live=true] .ytp-videowall-still-info-duration {
display: none
}
.ytp-videowall-still[data-is-live=true] .ytp-videowall-still-info-live {
display: block
}
.ytp-videowall-still-listlabel-regular, .ytp-videowall-still-listlabel-mix {
display: none;
height: 2.15em;
padding-right: 10px;
color: #fff;
font-weight: 500;
text-transform: uppercase;
background-color: rgba(0, 0, 0, 0.7)
}
.ytp-videowall-still-mini .ytp-videowall-still-listlabel-regular, .ytp-videowall-still-mini .ytp-videowall-still-listlabel-mix {
font-size: 100%
}
.ytp-videowall-still-listlabel-icon {
display: inline-block;
vertical-align: middle;
background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiBoZWlnaHQ9IjEwMCUiIHZlcnNpb249IjEuMSIgdmlld0JveD0iMCAwIDM2IDM2IiB3aWR0aD0iMTAwJSI+PHVzZSBzdHJva2U9IiMwMDAiIHN0cm9rZS1vcGFjaXR5PSIuMTUiIHN0cm9rZS13aWR0aD0iMnB4IiB4bGluazpocmVmPSIjeXRwLXN2Zy1wbGF5bGlzdCIgLz48cGF0aCBkPSJtIDIyLjUzLDIxLjQyIDAsNi44NSA1LjY2LC0zLjQyIC01LjY2LC0zLjQyIDAsMCB6IG0gLTExLjMzLDAgOS4wNiwwIDAsMi4yOCAtOS4wNiwwIDAsLTIuMjggMCwwIHogbSAwLC05LjE0IDEzLjYsMCAwLDIuMjggLTEzLjYsMCAwLC0yLjI4IDAsMCB6IG0gMCw0LjU3IDEzLjYsMCAwLDIuMjggLTEzLjYsMCAwLC0yLjI4IDAsMCB6IiBmaWxsPSIjZmZmIiBpZD0ieXRwLXN2Zy1wbGF5bGlzdCIgLz48L3N2Zz4=");
width: 2.15em;
height: 2.15em
}
.ytp-videowall-still-listlabel-mix-icon {
display: inline-block;
vertical-align: middle;
background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiBoZWlnaHQ9IjEwMCUiIHZlcnNpb249IjEuMSIgdmlld0JveD0iMCAwIDM2IDM2IiB3aWR0aD0iMTAwJSI+PHVzZSBzdHJva2U9IiMwMDAiIHN0cm9rZS1vcGFjaXR5PSIuMTUiIHN0cm9rZS13aWR0aD0iMnB4IiB4bGluazpocmVmPSIjeXRwLXN2Zy1taXgiIC8+PHBhdGggZD0iTTI1LjY1LDE4IEMyNS42MywyMC4zMSAyNC43OCwyMi40MSAyMy40LDI0LjA2IEwyNC4zLDI1IEMyNS45OSwyMy4yMCAyNywyMC43MyAyNywxOCBDMjcsMTUuMjcgMjUuOTksMTIuNzkgMjQuMywxMSBMMjMuNCwxMS45MyBDMjQuNzgsMTMuNTggMjUuNjMsMTUuNjggMjUuNjUsMTggWiBNMTAuMzUsMTggQzEwLjM2LDE1LjY4IDExLjIxLDEzLjU4IDEyLjYsMTEuOTMgTDExLjcsMTEgQzEwLjAwLDEyLjc5IDksMTUuMjcgOSwxOCBDOSwyMC43MyAxMC4wMCwyMy4yMCAxMS43LDI1IEwxMi42LDI0LjA2IEMxMS4yMSwyMi40MSAxMC4zNiwyMC4zMSAxMC4zNSwxOCBaIE0xMy4wNSwxOCBDMTMuMDEsMTYuMjcgMTMuNTQsMTQuOTEgMTQuNCwxMy44IEwxMy41LDEyLjg2IEMxMi4zNywxNC4xMiAxMS43LDE1Ljg1IDExLjcsMTggQzExLjcsMTkuNjcgMTIuMzcsMjEuNDAgMTMuNSwyMi42NiBMMTQuNCwyMS43MyBDMTMuNTQsMjAuNjEgMTMuMDEsMTkuMjYgMTMuMDUsMTggWiBNMjIuMDUsMTIuODYgTDIxLjE1LDEzLjggQzIyLjAwLDE0LjkxIDIyLjUzLDE2LjI3IDIyLjUsMTggQzIyLjUzLDE5LjI2IDIyLjAwLDIwLjYxIDIxLjE1LDIxLjczIEwyMi4wNSwyMi42NiBDMjMuMTcsMjEuNDAgMjMuODUsMTkuNjcgMjMuODUsMTggQzIzLjg1LDE1Ljg1IDIzLjE3LDE0LjEyIDIyLjA1LDEyLjg2IFogTTE2LjUsMTUuNjYgTDIwLjEsMTcuNTMgTDE2LjUsMTkuODYgTDE2LjUsMTUuNjYgWiIgZmlsbD0iI2ZmZiIgaWQ9Inl0cC1zdmctbWl4IiAvPjwvc3ZnPg==");
width: 2.15em;
height: 2.15em
}
.ytp-videowall-still-listlabel-length {
font-weight: normal
}
.ytp-videowall-still-mini .ytp-videowall-still-listlabel-length {
display: none
}
.ytp-videowall-still:hover .ytp-videowall-still-listlabel-regular, .ytp-videowall-still:focus .ytp-videowall-still-listlabel-regular, .ytp-videowall-still:hover .ytp-videowall-still-listlabel-mix, .ytp-videowall-still:focus .ytp-videowall-still-listlabel-mix {
background-color: rgba(0, 0, 0, 0)
}
.ytp-videowall-still[data-is-list=true]:not([data-is-mix=true]) .ytp-videowall-still-listlabel-regular, .ytp-videowall-still[data-is-mix=true] .ytp-videowall-still-listlabel-mix {
display: block
}
.ytp-videowall-still-image {
-moz-transition: background 0.1s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: background 0.1s cubic-bezier(0.4, 0, 1, 1);
transition: background 0.1s cubic-bezier(0.4, 0, 1, 1);
background-position: center;
background-repeat: no-repeat;
background-size: cover;
bottom: 0;
left: 0;
position: absolute;
right: 0;
top: 0
}
.ytp-videowall-still-info-author {
float: left;
margin-top: 2px
}
.ytp-videowall-still-info-content {
background-image: -moz-linear-gradient(top, rgba(12, 12, 12, 0.8) 0, transparent 100px);
background-image: -ms-linear-gradient(top, rgba(12, 12, 12, 0.8) 0, transparent 100px);
background-image: -o-linear-gradient(top, rgba(12, 12, 12, 0.8) 0, transparent 100px);
background-image: -webkit-linear-gradient(top, rgba(12, 12, 12, 0.8) 0, transparent 100px);
background-image: linear-gradient(to bottom, rgba(12, 12, 12, 0.8) 0, transparent 100px);
-moz-transition: opacity 0.3s ease;
-webkit-transition: opacity 0.3s ease;
transition: opacity 0.3s ease;
bottom: 0;
color: #fff;
left: 0;
opacity: 0;
padding: 10px;
position: absolute;
right: 0;
top: 0
}
.ytp-videowall-still:focus .ytp-videowall-still-info-content, .ytp-videowall-still:hover .ytp-videowall-still-info-content {
opacity: 1
}
.ytp-videowall-still-info-duration {
background: #000;
border-radius: 2px;
bottom: 2px;
font-weight: 500;
line-height: 1;
opacity: 0.75;
padding: 2px;
position: absolute;
right: 2px
}
.ytp-videowall-still-info-live {
background: #f12b24;
border-radius: 2px;
bottom: 2px;
font-weight: 500;
line-height: 1;
opacity: 0.9;
padding: 2px;
position: absolute;
right: 2px;
display: none;
text-transform: uppercase
}
.ytp-videowall-still-info-title {
display: block;
font-size: 118%;
font-weight: 500;
line-height: 1.2;
max-height: 30px;
overflow: hidden
}
.ytp-big-mode .ytp-videowall-still-info-title {
font-weight: normal;
max-height: 48px
}
.ytp-videowall-still-listlabel {
background: rgba(0, 0, 0, 0.86);
bottom: 0;
left: 0;
position: absolute;
right: 0
}
.ytp-videowall-still:focus .ytp-videowall-still-listlabel, .ytp-videowall-still:hover .ytp-videowall-still-listlabel {
background: rgba(0, 0, 0, 0.86)
}
.ytp-videowall-moving-thumbnail {
left: 50%;
min-width: 100%;
min-height: 100%;
opacity: 0;
position: absolute;
top: 50%;
transform: translate(-50%, -50%);
-moz-transition: opacity 1s cubic-bezier(0.4, 0, 0.2, 1);
-webkit-transition: opacity 1s cubic-bezier(0.4, 0, 0.2, 1);
transition: opacity 1s cubic-bezier(0.4, 0, 0.2, 1)
}
.ytp-videowall-still.ytp-videowall-moving-thumbnail-loaded.ytp-videowall-active .ytp-videowall-moving-thumbnail, .ytp-videowall-still.ytp-videowall-moving-thumbnail-loaded:focus .ytp-videowall-moving-thumbnail, .ytp-videowall-still.ytp-videowall-moving-thumbnail-loaded:hover .ytp-videowall-moving-thumbnail {
opacity: 1
}
.html5-endscreen {
cursor: default;
overflow: hidden;
z-index: 32
}
.ytp-endscreen-takeover.html5-endscreen {
display: none
}
.ytp-title-extra-info .html5-endscreen, .ytp-show-title-view-count .html5-endscreen {
margin-top: 16px
}
.ytp-big-mode.ytp-title-extra-info .html5-endscreen, .ytp-big-mode.ytp-show-title-view-count .html5-endscreen {
margin-top: 32px
}
.ytp-endscreen-content {
position: absolute;
left: 50%;
top: 50%
}
.ytp-endscreen-takeover .ytp-endscreen-content {
display: none
}
.html5-endscreen.ytp-endscreen-redesign {
left: 8px;
right: 8px
}
.ytp-hide-info-bar .html5-endscreen.ytp-endscreen-redesign {
top: 10px
}
.html5-endscreen.ytp-endscreen-paginate {
left: 32px;
overflow: visible;
right: 32px
}
.ytp-big-mode .html5-endscreen.ytp-endscreen-paginate {
left: 48px;
right: 48px
}
.ytp-endscreen-next {
display: none;
height: 100%;
opacity: 0.9;
position: absolute;
right: -32px;
width: 32px;
-moz-transition: opacity 0.1s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition: opacity 0.1s cubic-bezier(0, 0, 0.2, 1);
transition: opacity 0.1s cubic-bezier(0, 0, 0.2, 1)
}
.ytp-big-mode .ytp-endscreen-next {
right: -48px;
width: 48px
}
.ytp-endscreen-paginate .ytp-endscreen-next {
display: block
}
.ytp-endscreen-next:hover {
opacity: 1;
-moz-transition: opacity 0.1s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: opacity 0.1s cubic-bezier(0.4, 0, 1, 1);
transition: opacity 0.1s cubic-bezier(0.4, 0, 1, 1)
}
.ytp-endscreen-previous {
display: none;
height: 100%;
left: -32px;
opacity: 0.9;
position: absolute;
width: 32px;
-moz-transition: opacity 0.1s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition: opacity 0.1s cubic-bezier(0, 0, 0.2, 1);
transition: opacity 0.1s cubic-bezier(0, 0, 0.2, 1)
}
.ytp-big-mode .ytp-endscreen-previous {
left: -48px;
width: 48px
}
.ytp-endscreen-paginate .ytp-endscreen-previous {
display: block
}
.ytp-endscreen-previous:hover {
opacity: 1;
-moz-transition: opacity 0.1s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: opacity 0.1s cubic-bezier(0.4, 0, 1, 1);
transition: opacity 0.1s cubic-bezier(0.4, 0, 1, 1)
}
.ytp-error {
display: table;
position: absolute;
width: 100%;
height: 100%;
z-index: 40;
font-size: 127%;
line-height: 182%;
background: #000;
cursor: default;
-moz-user-select: none;
-ms-user-select: none;
-webkit-user-select: none
}
.ytp-error .ytp-error-content a {
text-decoration: underline
}
.ytp-error .ytp-tv-static {
position: absolute;
top: 0;
left: 0
}
.ytp-error-content {
position: relative;
display: table-cell;
vertical-align: middle
}
.ytp-error-content-wrap {
width: 80%;
max-width: 600px;
margin: auto;
text-align: center
}
.ytp-fresca-module {
position: absolute;
top: 0;
left: 0;
z-index: 21;
width: 100%;
height: 100%;
overflow: hidden;
background-color: transparent;
background-repeat: no-repeat;
background-position: center;
background-size: cover
}
.ytp-fresca-band-slate {
position: absolute;
width: 23%;
height: 100%;
-moz-box-sizing: border-box;
box-sizing: border-box;
text-align: center;
text-transform: uppercase;
left: 0
}
.ytp-fresca-slant {
position: absolute;
width: 50%;
height: 100%;
overflow: hidden;
-moz-transform: skew(-10deg) translatex(-50%);
-ms-transform: skew(-10deg) translatex(-50%);
-webkit-transform: skew(-10deg) translatex(-50%);
transform: skew(-10deg) translatex(-50%);
left: 0
}
.ytp-fresca-slant-inner {
position: absolute;
top: 0;
left: 25%;
width: 100%;
height: 100%;
-moz-transform: skew(10deg);
-ms-transform: skew(10deg);
-webkit-transform: skew(10deg);
transform: skew(10deg)
}
.ytp-fresca-slant-blur-image {
width: 270%;
height: 135%;
background-size: cover;
background-position: center;
-ms-filter: blur(20px);
-webkit-filter: blur(20px);
filter: blur(20px);
-moz-transform: translate(5.5%, -12.5%) skew(10deg) scale(0.75, 0.75);
-ms-transform: translate(5.5%, -12.5%) skew(10deg) scale(0.75, 0.75);
-webkit-transform: translate(5.5%, -12.5%) skew(10deg) scale(0.75, 0.75);
transform: translate(5.5%, -12.5%) skew(10deg) scale(0.75, 0.75)
}
.ytp-fresca-slant-overlay {
position: absolute;
top: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.25)
}
.ytp-fresca-slant-arrows {
position: absolute;
top: 15%;
height: 35%;
width: 100%;
background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMTAwJSIgdmVyc2lvbj0iMS4xIiB2aWV3Qm94PSIwIDAgMTIgMjAiIHdpZHRoPSIxMDAlIj48ZyBmaWxsPSIjZmZmIiBvcGFjaXR5PSIwLjA1Ij48cGF0aCBkPSJNMCwwIEwwLDEwIEwxMCw0LjUiIC8+PHBhdGggZD0iTTEyLDEzIEw2LDEwIEw2LDIwIEwxMiwxNyIgLz48cGF0aCBkPSJNMCwxMyBMMCwxNyBMNCwxNSBMMCwxMyBaIiAvPjwvZz48L3N2Zz4=")
}
.ytp-fresca-message {
cursor: default;
position: relative;
top: 20%;
left: 5%
}
.ytp-fresca-message h1 {
margin-top: 10px
}
.ytp-fresca-message h3 {
margin-top: 10px;
font-size: 250%;
font-weight: 600
}
.ytp-fresca-message h1 {
font-size: 140%;
text-transform: none;
font-weight: normal
}
.ytp-fresca-message h2 {
text-transform: none;
font-weight: normal;
margin-top: 10px;
font-size: 120%
}
.ytp-fresca-final-day-easter-egg .ytp-fresca-band-slate {
padding: 15% 0;
width: 100%;
text-align: center
}
.ytp-fresca-final-day-easter-egg .ytp-fresca-slant {
display: none
}
.ytp-fresca-final-day-easter-egg .ytp-fresca-message {
padding: 0;
top: 0;
left: 0
}
.ytp-fresca-final-day-easter-egg .ytp-fresca-message h1 {
margin-top: 20px;
font-size: 250%;
font-weight: 900;
text-transform: capitalize
}
.ytp-fresca-final-day-easter-egg .ytp-fresca-message h2 {
margin: 0;
font-size: 500%;
font-weight: 900;
text-transform: capitalize
}
.ytp-fresca-final-day-easter-egg .ytp-fresca-message h3 {
font-size: 280%;
text-transform: capitalize
}
.ytp-fresca-suggested-promo-central {
position: absolute;
top: 20%;
left: 31%;
width: 38%;
background-color: #fff;
cursor: pointer;
color: #333;
font-weight: 600
}
.ytp-fresca-suggested-promo-central:hover .ytp-fresca-suggested-title {
color: #167ac6
}
.ytp-fresca-suggested-central-image, .ytp-fresca-suggested-image {
position: relative;
padding-bottom: 56.25%;
background-size: cover;
background-position: center
}
.ytp-fresca-suggested-sidebar {
margin-bottom: 16px;
width: 145px;
overflow: hidden;
background-color: #fff;
color: #000;
cursor: pointer;
-moz-box-sizing: border-box;
box-sizing: border-box;
font-size: 100%;
word-wrap: break-word;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1)
}
.ytp-fresca-suggested-sidebar:hover .ytp-fresca-suggested-title {
color: #167ac6
}
.ytp-fresca-suggested-promo-sidebar {
position: absolute;
right: 0;
width: 177px;
height: 100%;
background-color: rgba(0, 0, 0, 0.4)
}
.ytp-fresca-suggested-content {
padding: 0 10px 10px;
color: #767676;
font-size: 100%;
text-align: initial;
word-wrap: break-word;
line-height: 110%;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1)
}
.ytp-big-mode .ytp-fresca-suggested-content {
padding: 0 15px 15px
}
.ytp-fresca-suggested-byline {
text-align: initial
}
.ytp-fresca-suggested-header, .ytp-fresca-suggested-title {
padding: 10px;
max-height: 90px;
color: #333;
font-size: 110%;
font-weight: 500;
line-height: 115%
}
.ytp-big-mode .ytp-fresca-suggested-header, .ytp-big-mode .ytp-fresca-suggested-title {
padding: 15px;
max-height: 135px
}
.ytp-fresca-suggested-sidebar-title {
padding: 10px 40px 0 16px;
font-size: 100%;
font-weight: 500;
text-overflow: ellipsis
}
.ytp-big-mode .ytp-fresca-suggested-sidebar-title {
padding: 15px 60px 0 15px
}
.ytp-fresca-suggested-sidebar-close-button {
position: absolute;
top: 0;
right: 0;
padding: 8px;
width: 40px;
height: 40px;
cursor: pointer;
opacity: 0.75;
fill: #fff
}
.ytp-big-mode .ytp-fresca-suggested-sidebar-close-button {
padding: 12px;
width: 60px;
height: 60px
}
.ytp-fresca-suggested-sidebar-close-button:hover {
opacity: 1
}
.ytp-fresca-suggested-image-badge {
position: absolute;
bottom: 0;
right: 0;
margin: 2px;
padding: 0 4px;
background-color: #000;
opacity: 0.75;
color: #fff;
font-size: 100%;
text-transform: uppercase
}
.ytp-big-mode .ytp-fresca-suggest-image-badge {
margin: 3px;
padding: 0 6px
}
.ytp-fresca-suggested-image-badge.ytp-fresca-suggested-image-badge-live {
border: 1px solid #e62117;
background-color: #fff;
color: #e62117;
font-weight: 500
}
.ytp-fresca-suggested-sidebar-items {
top: 41px;
bottom: 0;
border-top: 1px solid transparent;
padding: 0 16px;
width: 145px;
position: absolute;
overflow-y: auto
}
.iv-drawer-scrolled .ytp-fresca-suggested-sidebar-items {
border-color: rgba(0, 0, 0, 0.4)
}
.ytp-fullscreen-button::after {
content: "";
display: block;
height: 100%;
width: 12px;
position: absolute;
top: 0;
left: 100%
}
.ytp-big-mode .ytp-fullscreen-button::after {
width: 24px
}
.ytp-fullscreen-button-corner-0, .ytp-fullscreen-button-corner-1, .ytp-fullscreen-button-corner-2, .ytp-fullscreen-button-corner-3 {
-moz-transform: none;
-ms-transform: none;
-webkit-transform: none;
transform: none
}
@keyframes ytp-fullscreen-button-corner-0-animation {
50% {
-moz-transform: translate(-1px, -1px);
-ms-transform: translate(-1px, -1px);
-webkit-transform: translate(-1px, -1px);
transform: translate(-1px, -1px)
}
}
@keyframes ytp-fullscreen-button-corner-1-animation {
50% {
-moz-transform: translate(1px, -1px);
-ms-transform: translate(1px, -1px);
-webkit-transform: translate(1px, -1px);
transform: translate(1px, -1px)
}
}
@keyframes ytp-fullscreen-button-corner-2-animation {
50% {
-moz-transform: translate(1px, 1px);
-ms-transform: translate(1px, 1px);
-webkit-transform: translate(1px, 1px);
transform: translate(1px, 1px)
}
}
@keyframes ytp-fullscreen-button-corner-3-animation {
50% {
-moz-transform: translate(-1px, 1px);
-ms-transform: translate(-1px, 1px);
-webkit-transform: translate(-1px, 1px);
transform: translate(-1px, 1px)
}
}
.ytp-fullscreen-button:not([aria-disabled=true]):hover .ytp-fullscreen-button-corner-0 {
-moz-animation: ytp-fullscreen-button-corner-0-animation 0.4s cubic-bezier(0.4, 0, 0.2, 1);
-webkit-animation: ytp-fullscreen-button-corner-0-animation 0.4s cubic-bezier(0.4, 0, 0.2, 1);
animation: ytp-fullscreen-button-corner-0-animation 0.4s cubic-bezier(0.4, 0, 0.2, 1)
}
.ytp-fullscreen-button:not([aria-disabled=true]):hover .ytp-fullscreen-button-corner-1 {
-moz-animation: ytp-fullscreen-button-corner-1-animation 0.4s cubic-bezier(0.4, 0, 0.2, 1);
-webkit-animation: ytp-fullscreen-button-corner-1-animation 0.4s cubic-bezier(0.4, 0, 0.2, 1);
animation: ytp-fullscreen-button-corner-1-animation 0.4s cubic-bezier(0.4, 0, 0.2, 1)
}
.ytp-fullscreen-button:not([aria-disabled=true]):hover .ytp-fullscreen-button-corner-2 {
-moz-animation: ytp-fullscreen-button-corner-2-animation 0.4s cubic-bezier(0.4, 0, 0.2, 1);
-webkit-animation: ytp-fullscreen-button-corner-2-animation 0.4s cubic-bezier(0.4, 0, 0.2, 1);
animation: ytp-fullscreen-button-corner-2-animation 0.4s cubic-bezier(0.4, 0, 0.2, 1)
}
.ytp-fullscreen-button:not([aria-disabled=true]):hover .ytp-fullscreen-button-corner-3 {
-moz-animation: ytp-fullscreen-button-corner-3-animation 0.4s cubic-bezier(0.4, 0, 0.2, 1);
-webkit-animation: ytp-fullscreen-button-corner-3-animation 0.4s cubic-bezier(0.4, 0, 0.2, 1);
animation: ytp-fullscreen-button-corner-3-animation 0.4s cubic-bezier(0.4, 0, 0.2, 1)
}
.ytp-large-play-button {
position: absolute;
left: 50%;
top: 50%;
width: 68px;
height: 48px;
margin-left: -34px;
margin-top: -24px;
-moz-transition: opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition: opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
transition: opacity 0.25s cubic-bezier(0, 0, 0.2, 1)
}
.ytp-dni .ytp-large-play-button, .ytp-dni.ytp-small-mode .ytp-large-play-button, .ytp-dni.ytp-big-mode .ytp-large-play-button {
width: 75px;
height: 75px;
margin-left: -37.5px;
margin-top: -37.5px
}
.house-brand .ytp-large-play-button {
width: 60px;
height: 60px;
margin-left: -30px;
margin-top: -30px
}
.ytp-large-play-button svg {
height: 100%;
left: 0;
position: absolute;
top: 0;
width: 100%
}
.ytp-large-play-button .ytp-icon-dni-large-play-button {
position: absolute;
left: 50%;
top: 50%;
margin-left: -30px;
margin-top: -30px
}
.ytp-dni .ytp-cued-thumbnail-overlay .ytp-large-play-button-circle {
border-radius: 50%;
opacity: 0.81;
position: absolute;
width: 100%;
height: 100%;
left: 0;
top: 0
}
.ytp-dni .ytp-cued-thumbnail-overlay:hover .ytp-large-play-button-circle {
opacity: 1
}
.ytp-small-mode .ytp-large-play-button {
width: 42px;
height: 30px;
margin-left: -21px;
margin-top: -15px
}
.house-brand.ytp-small-mode .ytp-large-play-button-house-brand {
width: 37px;
height: 37px;
margin-left: -18.5px;
margin-top: -18.5px
}
.ytp-big-mode .ytp-large-play-button {
width: 102px;
height: 72px;
margin-left: -51px;
margin-top: -36px
}
.house-brand.ytp-big-mode .ytp-large-play-button {
width: 90px;
height: 90px;
margin-left: -45px;
margin-top: -45px
}
.ytp-large-play-button[aria-hidden=true] {
opacity: 0;
-moz-transition: opacity 0.25s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: opacity 0.25s cubic-bezier(0.4, 0, 1, 1);
transition: opacity 0.25s cubic-bezier(0.4, 0, 1, 1)
}
.ytp-large-play-button-bg {
-moz-transition: fill 0.1s cubic-bezier(0.4, 0, 1, 1), fill-opacity 0.1s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: fill 0.1s cubic-bezier(0.4, 0, 1, 1), fill-opacity 0.1s cubic-bezier(0.4, 0, 1, 1);
transition: fill 0.1s cubic-bezier(0.4, 0, 1, 1), fill-opacity 0.1s cubic-bezier(0.4, 0, 1, 1);
fill: #1f1f1f;
fill-opacity: 0.81
}
.ytp-large-play-button.ytp-touch-device .ytp-large-play-button-bg, .ytp-cued-thumbnail-overlay:hover .ytp-large-play-button-bg {
-moz-transition: fill 0.1s cubic-bezier(0, 0, 0.2, 1), fill-opacity 0.1s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition: fill 0.1s cubic-bezier(0, 0, 0.2, 1), fill-opacity 0.1s cubic-bezier(0, 0, 0.2, 1);
transition: fill 0.1s cubic-bezier(0, 0, 0.2, 1), fill-opacity 0.1s cubic-bezier(0, 0, 0.2, 1);
fill: #cc181e;
fill-opacity: 1
}
.ytp-color-party .ytp-large-play-button.ytp-touch-device .ytp-large-play-button-bg, .ytp-color-party .ytp-cued-thumbnail-overlay:hover .ytp-large-play-button-bg {
-moz-animation: ytp-party-fill 0.15s linear infinite;
-webkit-animation: ytp-party-fill 0.15s linear infinite;
animation: ytp-party-fill 0.15s linear infinite
}
.house-brand .ytp-cued-thumbnail-overlay:hover .ytp-large-play-button-bg {
fill: #000
}
.ytp-multicam-menu {
position: absolute;
right: 0;
top: 0;
bottom: 0;
max-width: 100%;
z-index: 71;
background: rgba(0, 0, 0, 0.2);
overflow: hidden;
-moz-transition: width 0.25s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition: width 0.25s cubic-bezier(0, 0, 0.2, 1);
transition: width 0.25s cubic-bezier(0, 0, 0.2, 1);
width: 175px
}
.ytp-multicam-menu-items {
width: 175px
}
.ytp-big-mode .ytp-multicam-menu, .ytp-big-mode .ytp-multicam-menu-header, .ytp-big-mode .ytp-multicam-menu-items {
width: 262px
}
.ytp-multicam-menu[aria-hidden=true] {
width: 0;
-moz-transition: width 0.25s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: width 0.25s cubic-bezier(0.4, 0, 1, 1);
transition: width 0.25s cubic-bezier(0.4, 0, 1, 1)
}
.ytp-multicam-menu-header {
position: absolute;
top: 16px;
left: 16px;
width: 143px;
height: 22px;
font-size: 105%;
line-height: 22px;
font-weight: 500
}
.ytp-big-mode .ytp-multicam-menu-header {
top: 24px;
left: 24px;
right: 24px;
height: 33px;
line-height: 33px
}
.ytp-multicam-menu-close {
float: right;
width: 22px;
height: 100%
}
.ytp-big-mode .ytp-multicam-menu-close {
width: 33px
}
.ytp-multicam-menu-items {
position: absolute;
top: 54px;
left: 0;
right: 0;
bottom: 0;
overflow-x: hidden;
overflow-y: auto
}
.ytp-big-mode .ytp-multicam-menu-items {
top: 81px
}
.ytp-multicam-menu-item {
position: relative;
width: 143px;
height: 81px;
margin: 2px 16px 14px;
background-position: 0 -13px;
background-size: 143px 107px
}
.ytp-big-mode .ytp-multicam-menu-item {
width: 214px;
height: 121px;
margin: 3px 24px 21px;
background-position: 0 -19.5px;
background-size: 214px 160px
}
.ytp-multicam-menu-item[aria-checked=true] {
width: 147px;
height: 85px;
border: 2px solid #ea0000;
margin: 0 14px 12px
}
.ytp-big-mode .ytp-multicam-menu-item[aria-checked=true] {
width: 220px;
height: 127px;
border-width: 3px;
margin: 0 21px 18px
}
.ytp-multicam-menu-item-title {
position: absolute;
bottom: 0;
left: 0;
right: 0;
height: 32px;
line-height: 32px;
padding: 0 1em;
font-weight: 500;
box-shadow: inset 0 -32px 32px -21px rgba(8, 8, 8, 0.9);
overflow: hidden;
white-space: nowrap;
word-wrap: normal;
-o-text-overflow: ellipsis;
text-overflow: ellipsis
}
.ytp-big-mode .ytp-multicam-menu-item-title {
height: 48px;
line-height: 48px;
box-shadow: inset 0 -48px 48px -31px rgba(8, 8, 8, 0.9)
}
.ytp-offline-slate {
position: absolute;
top: 0;
left: 0;
z-index: 21;
width: 100%;
height: 100%;
overflow: hidden;
background: no-repeat center/cover
}
.ytp-offline-slate-bar {
position: absolute;
min-width: 400px;
left: 12px;
height: 56px;
bottom: 48px;
-moz-box-sizing: border-box;
box-sizing: border-box;
text-align: left;
text-transform: uppercase;
background: rgba(0, 0, 0, 0.8);
border-radius: 5px;
color: #fff;
-moz-transition: bottom 0.25s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition: bottom 0.25s cubic-bezier(0, 0, 0.2, 1);
transition: bottom 0.25s cubic-bezier(0, 0, 0.2, 1)
}
.ytp-big-mode .ytp-offline-slate-bar {
min-width: 600px;
height: 84px;
bottom: 72px;
left: 18px
}
.ytp-autohide .ytp-offline-slate-bar {
bottom: 12px;
-moz-transition: bottom 0.1s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: bottom 0.1s cubic-bezier(0.4, 0, 1, 1);
transition: bottom 0.1s cubic-bezier(0.4, 0, 1, 1)
}
.ytp-autohide .ytp-big-mode .ytp-offline-slate-bar {
bottom: 18px
}
.ytp-offline-slate-icon {
position: absolute;
top: 16px;
left: 16px;
width: 24px
}
.ytp-big-mode .ytp-offline-slate-icon {
top: 24px;
left: 24px;
width: 36px
}
.ytp-offline-slate-buttons {
float: right;
margin: 12px
}
.ytp-offline-slate-button {
min-width: 80px;
height: 32px;
padding: 0 8px;
background: rgba(255, 255, 255, 0.25);
border-radius: 2px
}
.ytp-offline-slate-button-icon {
display: inline-block;
vertical-align: middle;
height: 24px
}
.ytp-offline-slate-button-text {
display: inline-block;
vertical-align: middle;
margin: 0 8px;
line-height: 32px;
font-size: 110%;
font-weight: 500
}
.ytp-big-mode .ytp-offline-slate-buttons {
margin: 20px
}
.ytp-big-mode .ytp-offline-slate-button {
min-width: 120px;
height: 48px;
padding: 0 12px;
border-radius: 3px
}
.ytp-big-mode .ytp-offline-slate-button-text {
margin: 0 12px;
line-height: 48px;
font-size: 130%;
font-weight: 500
}
.ytp-offline-slate-messages .ytp-offline-slate-main-text, .ytp-offline-slate-messages .ytp-offline-slate-subtitle-text {
margin-left: 56px;
text-transform: none;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis
}
.ytp-offline-slate-messages .ytp-offline-slate-main-text {
height: 20px;
margin-top: 10px;
font-size: 140%;
font-weight: normal
}
.ytp-offline-slate-messages .ytp-offline-slate-subtitle-text {
height: 16px;
margin-top: 0;
font-size: 110%;
font-weight: 500
}
.ytp-offline-slate-single-text-line .ytp-offline-slate-messages .ytp-offline-slate-main-text {
margin-top: 18px
}
.ytp-big-mode .ytp-offline-slate-messages .ytp-offline-slate-main-text, .ytp-big-mode .ytp-offline-slate-messages .ytp-offline-slate-subtitle-text {
margin-left: 84px
}
.ytp-big-mode .ytp-offline-slate-single-text-line .ytp-offline-slate-messages .ytp-offline-slate-main-text {
margin-top: 28px
}
.ytp-big-mode .ytp-offline-slate-messages .ytp-offline-slate-main-text {
margin-top: 12px;
height: 30px
}
.ytp-big-mode .ytp-offline-slate-messages .ytp-offline-slate-subtitle-text {
margin-top: 0;
height: 24px
}
.ytp-offline-slate-final-day, .ytp-offline-slate-show-final-day .ytp-offline-slate-bar {
display: none
}
.ytp-offline-slate-show-final-day .ytp-offline-slate-final-day {
display: block;
padding: 15% 0;
width: 100%;
text-align: center
}
.ytp-offline-slate-show-final-day .ytp-offline-slate-final-day-line-1 {
margin-top: 20px;
font-size: 325%;
font-weight: 900;
transform: scaley(1.2)
}
.ytp-offline-slate-show-final-day .ytp-offline-slate-final-day-line-2 {
margin-bottom: 20px;
font-size: 525%;
font-weight: 900;
transform: scaley(1.4)
}
.ytp-offline-slate-show-final-day .ytp-offline-slate-final-day-line-3 {
font-size: 250%;
font-weight: 500;
transform: scaley(1.3)
}
.ytp-big-mode .ytp-offline-slate-show-final-day .ytp-offline-slate-final-day-line-1 {
margin-top: 30px;
font-size: 375%;
font-weight: 900;
transform: scaley(1.2)
}
.ytp-big-mode .ytp-offline-slate-show-final-day .ytp-offline-slate-final-day-line-2 {
margin-bottom: 40px;
font-size: 650%;
font-weight: 900;
transform: scaley(1.4)
}
.ytp-big-mode .ytp-offline-slate-show-final-day .ytp-offline-slate-final-day-line-3 {
font-size: 300%;
font-weight: 500;
transform: scaley(1.3)
}
.html5-video-player.ended-mode .ytp-paid-content-overlay {
display: none
}
.ytp-paid-content-overlay {
bottom: 41px;
display: inline-block;
font-size: 109.090909%;
height: 30px;
left: 25px;
line-height: 30px;
overflow: hidden;
pointer-events: none;
position: absolute;
text-shadow: 0 0 2px rgba(0, 0, 0, 0.5);
z-index: 24
}
.ytp-paid-content-overlay-text {
opacity: 1;
-moz-transition: opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition: opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
transition: opacity 0.25s cubic-bezier(0, 0, 0.2, 1)
}
.ytp-big-mode .ytp-paid-content-overlay {
bottom: 62px;
height: 42px;
left: 44px;
line-height: 42px
}
.ytp-autohide .ytp-paid-content-overlay, .ytp-iv-drawer-open .ytp-paid-content-overlay {
bottom: 6px;
-moz-transition: bottom 0.1s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: bottom 0.1s cubic-bezier(0.4, 0, 1, 1);
transition: bottom 0.1s cubic-bezier(0.4, 0, 1, 1)
}
.ytp-big-mode.ytp-autohide .ytp-paid-content-overlay, .ytp-big-mode.ytp-iv-drawer-open .ytp-paid-content-overlay {
bottom: 12px
}
.ytp-paid-content-overlay-text[aria-hidden=true] {
opacity: 0;
-moz-transition: opacity 0.1s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: opacity 0.1s cubic-bezier(0.4, 0, 1, 1);
transition: opacity 0.1s cubic-bezier(0.4, 0, 1, 1)
}
.ytp-menuitem {
display: table-row;
cursor: default;
outline: none;
height: 33px
}
.ytp-touch-mode .ytp-menuitem {
height: 40px
}
.ytp-big-mode .ytp-menuitem {
height: 49px
}
.ytp-menuitem:not([aria-disabled=true]) {
cursor: pointer
}
.ytp-menuitem:not([aria-disabled=true]):hover {
background-color: rgba(255, 255, 255, 0.1)
}
.ytp-menuitem-label, .ytp-menuitem-content {
display: table-cell;
vertical-align: middle;
padding: 0 15px
}
.ytp-menuitem-label {
font-size: 118%;
font-weight: 500
}
.ytp-quality-menu .ytp-menuitem {
white-space: nowrap
}
.ytp-quality-menu .ytp-panel-menu {
margin-right: 10px
}
.ytp-quality-menu .ytp-menuitem-label {
text-align: right
}
.ytp-quality-menu .ytp-menuitem-label sup {
display: inline-block;
width: 0
}
.ytp-big-mode .ytp-menuitem-label, .ytp-big-mode .ytp-menuitem-content {
padding: 0 22px
}
.ytp-menuitem[role=menuitemradio] .ytp-menuitem-content {
display: none
}
.ytp-menuitem[role=menuitemradio] .ytp-menuitem-label {
padding-left: 35px;
padding-right: 20px;
border-bottom: none
}
.ytp-big-mode .ytp-menuitem[role=menuitemradio] .ytp-menuitem-label {
padding-left: 52px;
padding-right: 35px
}
.ytp-menuitem[role=menuitemradio][aria-checked=true] .ytp-menuitem-label {
background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMTAwJSIgdmVyc2lvbj0iMS4xIiB2aWV3Qm94PSIwIDAgMjQgMjQiIHdpZHRoPSIxMDAlIj48cGF0aCBkPSJNOSAxNi4yTDQuOCAxMmwtMS40IDEuNEw5IDE5IDIxIDdsLTEuNC0xLjRMOSAxNi4yeiIgZmlsbD0iI2ZmZiIgLz48L3N2Zz4=");
background-repeat: no-repeat;
background-position: left 10px center;
background-size: 18px 18px;
-moz-background-size: 18px 18px;
-webkit-background-size: 18px 18px
}
.ytp-big-mode .ytp-menuitem[role=menuitemradio][aria-checked=true] .ytp-menuitem-label {
background-position: left 15px center;
background-size: 27px 27px;
-moz-background-size: 27px 27px;
-webkit-background-size: 27px 27px
}
.ytp-probably-keyboard-focus .ytp-menuitem:focus .ytp-menuitem-label {
box-shadow: inset 2px 2px 0 rgba(27, 127, 204, 0.8), inset 0 -2px 0 rgba(27, 127, 204, 0.8)
}
.ytp-probably-keyboard-focus .ytp-menuitem[role=menuitemradio]:focus .ytp-menuitem-label {
box-shadow: inset 2px 2px 0 rgba(27, 127, 204, 0.8), inset -2px -2px 0 rgba(27, 127, 204, 0.8)
}
.ytp-probably-keyboard-focus .ytp-menuitem:focus .ytp-menuitem-content {
box-shadow: inset -2px -2px 0 rgba(27, 127, 204, 0.8), inset 0 2px 0 rgba(27, 127, 204, 0.8)
}
.ytp-menuitem-content {
font-size: 109%;
text-align: right
}
.ytp-menu-label-secondary {
font-size: 91%;
color: #ccc
}
.ytp-menuitem[aria-haspopup=true] .ytp-menuitem-content {
background-repeat: no-repeat;
background-position: right 9px center;
background-size: 32px 32px;
-moz-background-size: 32px 32px;
-webkit-background-size: 32px 32px;
padding-right: 38px;
background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMTAwJSIgdmVyc2lvbj0iMS4xIiB2aWV3Qm94PSIwIDAgMzIgMzIiIHdpZHRoPSIxMDAlIj48cGF0aCBkPSJtIDEyLjU5LDIwLjM0IDQuNTgsLTQuNTkgLTQuNTgsLTQuNTkgMS40MSwtMS40MSA2LDYgLTYsNiB6IiBmaWxsPSIjZmZmIiAvPjwvc3ZnPg==")
}
.ytp-big-mode .ytp-menuitem[aria-haspopup=true] .ytp-menuitem-content {
background-position: right 13px center;
background-size: 48px 48px;
-moz-background-size: 48px 48px;
-webkit-background-size: 48px 48px;
padding-right: 57px
}
.ytp-menuitem sup {
line-height: 0;
font-size: 0.8em;
font-weight: 500
}
.ytp-menuitem-label-count {
color: #ccc
}
.ytp-menuitem-badge-container {
display: inline-block;
margin-right: 4px;
vertical-align: middle
}
.ytp-menuitem-badge-container svg {
display: block;
width: 11px
}
.ytp-big-mode .ytp-menuitem-badge-container {
margin-right: 6px;
vertical-align: middle
}
.ytp-big-mode .ytp-menuitem-badge-container svg {
width: 16px
}
.ytp-menuitemtitle {
padding: 0 15px;
max-width: 200px;
text-align: center
}
.ytp-big-mode .ytp-menuitemtitle {
padding: 0 22px;
max-width: 300px
}
.ytp-panel {
position: absolute;
bottom: 0;
right: 0;
overflow-y: auto;
overflow-x: hidden
}
.ytp-panel.ytp-panel-animating {
-moz-transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
-webkit-transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
pointer-events: none
}
.ytp-panel-header {
border-bottom: 1px solid rgba(255, 255, 255, 0.2);
line-height: inherit;
font-size: 109%;
color: #eee;
padding: 6px 0;
height: 33px;
white-space: nowrap
}
.ytp-touch-mode .ytp-panel-header {
height: 40px
}
.ytp-big-mode .ytp-panel-header {
height: 49px
}
.ytp-panel-title, .ytp-panel-options {
line-height: inherit
}
.ytp-panel-title {
font-weight: 500;
padding: 0 10px 0 35px;
height: 100%;
background-repeat: no-repeat;
background-position: left 3px center;
background-size: 32px 32px;
-moz-background-size: 32px 32px;
-webkit-background-size: 32px 32px;
background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMTAwJSIgdmVyc2lvbj0iMS4xIiB2aWV3Qm94PSIwIDAgMzIgMzIiIHdpZHRoPSIxMDAlIj48cGF0aCBkPSJNIDE5LjQxLDIwLjA5IDE0LjgzLDE1LjUgMTkuNDEsMTAuOTEgMTgsOS41IGwgLTYsNiA2LDYgeiIgZmlsbD0iI2ZmZiIgLz48L3N2Zz4=")
}
.ytp-big-mode .ytp-panel-title {
background-position: 5px center;
background-size: 48px 48px;
-moz-background-size: 48px 48px;
-webkit-background-size: 48px 48px;
padding: 0 15px 0 52px
}
.ytp-panel-options {
height: 100%;
padding: 0 10px;
text-decoration: underline
}
.ytp-big-mode .ytp-panel-options {
padding: 0 15px
}
.ytp-generic-popup {
top: 0;
left: 0;
padding: 5px 9px;
max-width: 144px;
z-index: 70
}
.ytp-big-mode .ytp-generic-popup {
max-width: 216px
}
.html5-video-player .ytp-generic-popup a {
text-decoration: underline
}
.ytp-popup {
position: absolute;
overflow: hidden;
border-radius: 2px;
background: rgba(28, 28, 28, 0.9);
text-shadow: 0 0 2px rgba(0, 0, 0, 0.5);
-moz-transition: opacity 0.1s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition: opacity 0.1s cubic-bezier(0, 0, 0.2, 1);
transition: opacity 0.1s cubic-bezier(0, 0, 0.2, 1);
-moz-user-select: none;
-ms-user-select: none;
-webkit-user-select: none
}
.ytp-dni .ytp-popup {
text-shadow: none
}
.ytp-popup[aria-hidden=true] {
opacity: 0;
-moz-transition: opacity 0.1s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: opacity 0.1s cubic-bezier(0.4, 0, 1, 1);
transition: opacity 0.1s cubic-bezier(0.4, 0, 1, 1)
}
.ytp-popup-animating {
-moz-transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
-webkit-transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
pointer-events: none
}
.ytp-popup-animating .ytp-panel {
-moz-transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
-webkit-transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1)
}
.ytp-panel-animate-back, .ytp-panel-animate-forward {
opacity: 0
}
.ytp-panel-animate-back {
-moz-transform: translatex(-100%);
-ms-transform: translatex(-100%);
-webkit-transform: translatex(-100%);
transform: translatex(-100%)
}
.ytp-panel-animate-forward {
-moz-transform: translatex(100%);
-ms-transform: translatex(100%);
-webkit-transform: translatex(100%);
transform: translatex(100%)
}
.ytp-menuitem-toggle-checkbox {
height: 14px;
width: 36px;
float: right;
position: relative;
border-radius: 14px;
background: rgba(255, 255, 255, 0.3);
-moz-transition: all 0.08s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: all 0.08s cubic-bezier(0.4, 0, 1, 1);
transition: all 0.08s cubic-bezier(0.4, 0, 1, 1);
-moz-transform: scale(1);
-ms-transform: scale(1);
-webkit-transform: scale(1);
transform: scale(1)
}
.ytp-big-mode .ytp-menuitem-toggle-checkbox {
height: 21px;
width: 54px;
border-radius: 21px
}
.ytp-menuitem[aria-checked="true"] .ytp-menuitem-toggle-checkbox {
background: #f12b24
}
.ytp-contextmenu .ytp-menuitem-toggle-checkbox {
width: 14px
}
.ytp-big-mode .ytp-contextmenu .ytp-menuitem-toggle-checkbox {
width: 21px
}
.ytp-contextmenu .ytp-menuitem .ytp-menuitem-toggle-checkbox {
background: none
}
.ytp-contextmenu .ytp-menuitem[aria-checked="true"] .ytp-menuitem-toggle-checkbox {
background: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMTAwJSIgdmVyc2lvbj0iMS4xIiB2aWV3Qm94PSIwIDAgMjQgMjQiIHdpZHRoPSIxMDAlIj48cGF0aCBkPSJNOSAxNi4yTDQuOCAxMmwtMS40IDEuNEw5IDE5IDIxIDdsLTEuNC0xLjRMOSAxNi4yeiIgZmlsbD0iI2ZmZiIgLz48L3N2Zz4=")
}
.ytp-contextmenu .ytp-menuitem-toggle-checkbox:after {
content: none
}
.ytp-contextmenu .ytp-menuitem[aria-checked="true"] .ytp-menuitem-toggle-checkbox:before, .ytp-big-mode .ytp-contextmenu .ytp-menuitem[aria-checked="true"] .ytp-menuitem-toggle-checkbox:before {
-moz-transform: none;
-ms-transform: none;
-webkit-transform: none;
transform: none
}
.ytp-menuitem-toggle-checkbox:after {
content: "";
position: absolute;
top: 0;
left: 0;
height: 20px;
width: 20px;
border-radius: 20px;
margin-top: -3px;
background-color: #bdbdbd;
box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.6);
-moz-transition: all 0.08s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: all 0.08s cubic-bezier(0.4, 0, 1, 1);
transition: all 0.08s cubic-bezier(0.4, 0, 1, 1)
}
.ytp-big-mode .ytp-menuitem-toggle-checkbox:after {
left: 0;
height: 30px;
width: 30px;
border-radius: 30px;
margin-top: -4.5px
}
.ytp-menuitem[aria-checked="true"] .ytp-menuitem-toggle-checkbox:after {
background-color: #fff;
-moz-transform: translatex(16px);
-ms-transform: translatex(16px);
-webkit-transform: translatex(16px);
transform: translatex(16px)
}
.ytp-big-mode .ytp-menuitem[aria-checked="true"] .ytp-menuitem-toggle-checkbox:after {
-moz-transform: translatex(24px);
-ms-transform: translatex(24px);
-webkit-transform: translatex(24px);
transform: translatex(24px)
}
.ytp-panel-menu {
padding: 6px 0;
display: table;
width: 100%;
color: #eee;
box-sizing: border-box
}
.ytp-expand-pause-overlay .caption-window, .ytp-expand-pause-overlay .ad-overlay {
display: none
}
.ytp-pause-overlay {
border-radius: 2px;
bottom: 49px;
left: 0;
margin: 10px;
position: absolute;
z-index: 38;
-moz-transition: opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition: opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
transition: opacity 0.25s cubic-bezier(0, 0, 0.2, 1)
}
.ytp-expand-pause-overlay .ytp-pause-overlay {
background: rgba(48, 48, 48, 0.6);
padding: 8px 24px;
right: 0
}
.ytp-ce-shown .ytp-pause-overlay, .ytp-iv-drawer-open .ytp-pause-overlay, .ytp-menu-shown .ytp-pause-overlay, .ytp-settings-shown .ytp-pause-overlay, .ytp-small-mode .ytp-pause-overlay, .html5-video-player:not(.ytp-expand-pause-overlay) .ytp-collapse, .html5-video-player:not(.ytp-expand-pause-overlay) .ytp-next, .html5-video-player:not(.ytp-expand-pause-overlay) .ytp-previous, .html5-video-player:not(.ytp-expand-pause-overlay) .ytp-suggestions, .ytp-pause-overlay.ytp-scroll-max .ytp-next, .ytp-pause-overlay.ytp-scroll-min .ytp-previous, .ytp-probably-keyboard-focus .ytp-pause-overlay .ytp-next, .ytp-probably-keyboard-focus .ytp-pause-overlay .ytp-previous, .ytp-touch-mode .ytp-pause-overlay .ytp-next, .ytp-touch-mode .ytp-pause-overlay .ytp-previous {
display: none
}
.ytp-big-mode .ytp-pause-overlay {
bottom: 70px;
margin: 20px
}
.ytp-expand-pause-overlay.ytp-big-mode .ytp-pause-overlay {
padding: 20px 48px
}
.ytp-pause-overlay[aria-hidden=true] {
opacity: 0;
-moz-transition: opacity 0.1s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: opacity 0.1s cubic-bezier(0.4, 0, 1, 1);
transition: opacity 0.1s cubic-bezier(0.4, 0, 1, 1)
}
.ytp-pause-overlay[aria-hidden=true] a.ytp-suggestion-link {
opacity: 0
}
.ytp-pause-overlay .ytp-suggestions {
overflow: hidden;
text-align: center;
white-space: nowrap
}
.ytp-touch-mode .ytp-pause-overlay .ytp-suggestions {
overflow-x: auto
}
.ytp-big-mode .ytp-pause-overlay .ytp-suggestions {
height: 180px
}
.ytp-pause-overlay .ytp-suggestion-image {
background-color: #000;
background-position: center;
background-size: cover;
height: 108px;
width: 192px
}
.ytp-pause-overlay .ytp-next, .ytp-pause-overlay .ytp-previous {
background: #333;
border-radius: 50%;
box-shadow: 0 1px 5px rgba(0, 0, 0, 0.2);
height: 32px;
position: absolute;
top: 50%;
transform: translate(0, -50%);
width: 32px
}
.ytp-pause-overlay .ytp-next:hover, .ytp-pause-overlay .ytp-previous:hover {
box-shadow: 0 4px 5px rgba(0, 0, 0, 0.2)
}
.ytp-big-mode .ytp-pause-overlay .ytp-next, .ytp-big-mode .ytp-pause-overlay .ytp-previous {
height: 64px;
transform: translate(0, -50%);
width: 64px
}
.ytp-pause-overlay .ytp-next {
right: 8px
}
.ytp-pause-overlay .ytp-previous {
left: 8px
}
.ytp-pause-overlay .ytp-collapse {
height: 16px;
opacity: 0.9;
position: absolute;
right: 4px;
top: 4px;
width: 16px
}
.ytp-big-mode .ytp-pause-overlay .ytp-collapse {
height: 32px;
right: 8px;
top: 8px;
width: 32px
}
.ytp-pause-overlay .ytp-collapse:hover {
opacity: 1
}
.ytp-pause-overlay .ytp-expand {
background: rgba(0, 0, 0, 0.6);
border-radius: 2px;
font-size: 12px;
line-height: 32px;
padding: 0 10px 0 16px;
text-transform: uppercase
}
.ytp-big-mode .ytp-pause-overlay .ytp-expand {
font-size: 24px
}
.ytp-pause-overlay .ytp-expand:hover {
background: rgba(0, 0, 0, 0.8)
}
.ytp-pause-overlay .ytp-expand svg, .ytp-pause-overlay .ytp-expand .ytp-icon {
display: inline-block;
height: 24px;
margin-bottom: 2px;
vertical-align: middle;
width: 24px
}
.ytp-big-mode .ytp-pause-overlay .ytp-expand svg {
width: 32px;
height: 32px
}
.ytp-expand-pause-overlay .ytp-expand {
display: none
}
.ytp-pause-overlay a.ytp-suggestion-link {
display: inline-block;
margin-left: 4px;
margin-right: 4px;
position: relative;
text-align: left;
top: 50%;
-moz-transform: translate(0, -50%);
-ms-transform: translate(0, -50%);
-webkit-transform: translate(0, -50%);
transform: translate(0, -50%);
-moz-transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
-webkit-transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1)
}
.ytp-pause-overlay .ytp-suggestion-overlay {
bottom: 0;
font-size: 12px;
left: 0;
opacity: 0;
padding: 8px;
position: absolute;
right: 0;
top: 0;
background-image: -moz-linear-gradient(top, rgba(12, 12, 12, 0.8) 0, transparent 100px);
background-image: -ms-linear-gradient(top, rgba(12, 12, 12, 0.8) 0, transparent 100px);
background-image: -o-linear-gradient(top, rgba(12, 12, 12, 0.8) 0, transparent 100px);
background-image: -webkit-linear-gradient(top, rgba(12, 12, 12, 0.8) 0, transparent 100px);
background-image: linear-gradient(to bottom, rgba(12, 12, 12, 0.8) 0, transparent 100px);
-moz-transition: opacity 0.5s cubic-bezier(0.4, 0, 0.2, 1);
-webkit-transition: opacity 0.5s cubic-bezier(0.4, 0, 0.2, 1);
transition: opacity 0.5s cubic-bezier(0.4, 0, 0.2, 1)
}
.ytp-big-mode .ytp-pause-overlay .ytp-suggestion-overlay {
font-size: 20px
}
.ytp-pause-overlay a.ytp-suggestion-link:focus .ytp-suggestion-overlay, .ytp-pause-overlay a.ytp-suggestion-link:hover .ytp-suggestion-overlay {
opacity: 1
}
.ytp-pause-overlay .ytp-suggestion-duration {
background: #000;
border-radius: 2px;
bottom: 4px;
font-size: 11px;
font-weight: 500;
line-height: 1;
opacity: 0.75;
padding: 2px 4px;
position: absolute;
right: 4px
}
.ytp-big-mode .ytp-pause-overlay .ytp-suggestion-duration {
font-size: 17px
}
.ytp-pause-overlay .ytp-suggestion-title, .ytp-pause-overlay .ytp-suggestion-author {
overflow: hidden;
text-overflow: ellipsis
}
.ytp-pause-overlay .ytp-suggestion-title {
font-weight: 500;
max-height: 30px
}
.ytp-chrome-controls .ytp-play-button {
width: 46px
}
.ytp-big-mode .ytp-chrome-controls .ytp-play-button {
width: 69px
}
.ytp-chrome-controls .ytp-play-button-playlist {
width: 40px
}
.ytp-big-mode .ytp-chrome-controls .ytp-play-button-playlist {
width: 60px
}
.ytp-playlist-menu {
position: absolute;
left: 0;
top: 0;
bottom: 0;
width: 400px;
max-width: 100%;
z-index: 71;
background: rgba(0, 0, 0, 0.8);
-moz-transition: -moz-transform 0.25s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition: -webkit-transform 0.25s cubic-bezier(0, 0, 0.2, 1);
-ms-transition: -ms-transform 0.25s cubic-bezier(0, 0, 0.2, 1);
transition: transform 0.25s cubic-bezier(0, 0, 0.2, 1)
}
.ytp-big-mode .ytp-playlist-menu {
width: 600px
}
.ytp-playlist-menu[aria-hidden=true] {
-moz-transform: translatex(-100%);
-ms-transform: translatex(-100%);
-webkit-transform: translatex(-100%);
transform: translatex(-100%);
-moz-transition: -moz-transform 0.25s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: -webkit-transform 0.25s cubic-bezier(0.4, 0, 1, 1);
-ms-transition: -ms-transform 0.25s cubic-bezier(0.4, 0, 1, 1);
transition: transform 0.25s cubic-bezier(0.4, 0, 1, 1)
}
.ytp-playlist-menu-header {
padding: 15px;
border-bottom: 1px solid #444
}
.ytp-big-mode .ytp-playlist-menu-header {
padding: 23px
}
.ytp-playlist-menu-title {
height: 20px;
line-height: 20px;
padding-right: 15px;
font-size: 136%;
overflow: hidden;
white-space: nowrap;
word-wrap: normal;
-o-text-overflow: ellipsis;
text-overflow: ellipsis
}
.ytp-big-mode .ytp-playlist-menu-title {
height: 30px;
line-height: 30px;
padding-right: 23px;
overflow: hidden;
white-space: nowrap;
word-wrap: normal;
-o-text-overflow: ellipsis;
text-overflow: ellipsis
}
.ytp-playlist-menu-subtitle {
color: #b8b8b8;
line-height: 17px;
overflow: hidden;
white-space: nowrap;
word-wrap: normal;
-o-text-overflow: ellipsis;
text-overflow: ellipsis
}
.ytp-big-mode .ytp-playlist-menu-subtitle {
line-height: 26px
}
.ytp-playlist-menu-close {
position: absolute;
top: 15px;
right: 15px;
width: 24px;
height: 24px
}
.ytp-big-mode .ytp-playlist-menu-close {
top: 23px;
right: 23px;
width: 36px;
height: 36px
}
.ytp-playlist-menu-close path {
fill: #aaa
}
.ytp-playlist-menu-close:hover path {
fill: #fff
}
.ytp-playlist-menu-items {
position: absolute;
top: 68px;
bottom: 0;
left: 0;
right: 0;
overflow: auto
}
.ytp-big-mode .ytp-playlist-menu-items {
top: 103px
}
.ytp-chrome-top .ytp-playlist-menu-button {
width: auto;
height: auto
}
.ytp-playlist-menu-button-icon {
width: 36px;
height: 36px
}
.ytp-big-mode .ytp-playlist-menu-button-icon {
width: 54px;
height: 54px
}
.ytp-playlist-menu-button-text {
padding-right: 6px;
line-height: 36px;
opacity: 1
}
.ytp-playlist-menu-button-tiny .ytp-playlist-menu-button-text {
display: None
}
.ytp-big-mode .ytp-playlist-menu-button-text {
line-height: 54px
}
.ytp-playlist-menu-button-icon, .ytp-playlist-menu-button-text {
vertical-align: middle;
display: inline-block
}
.ytp-scrubber-container {
position: absolute;
top: -4px;
left: -6.5px;
z-index: 43
}
.ytp-big-mode .ytp-scrubber-container {
top: -6px;
left: -10px
}
.ytp-scrubber-button {
height: 13px;
width: 13px;
border-radius: 6.5px;
-moz-transition: -moz-transform 0.1s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: -webkit-transform 0.1s cubic-bezier(0.4, 0, 1, 1);
-ms-transition: -ms-transform 0.1s cubic-bezier(0.4, 0, 1, 1);
transition: transform 0.1s cubic-bezier(0.4, 0, 1, 1);
-moz-transform: scale(0);
-ms-transform: scale(0);
-webkit-transform: scale(0);
transform: scale(0)
}
.ytp-big-mode .ytp-scrubber-button {
height: 20px;
width: 20px;
border-radius: 10px
}
.ypc-loaded .ytp-scrubber-button.ytp-swatch-background-color {
background-color: #167ac6
}
.ad-interrupting .ytp-scrubber-button.ytp-swatch-background-color {
background-color: #fc0
}
.ytp-probably-keyboard-focus .ytp-progress-bar:focus {
box-shadow: 0 0 0 2px rgba(27, 127, 204, 0.8)
}
.ytp-progress-bar-container:hover:not([aria-disabled=true]) .ytp-scrubber-button, .ytp-touch-mode .ytp-progress-bar-container:not([aria-disabled=true]) .ytp-scrubber-button, .ytp-drag .ytp-scrubber-button {
-moz-transform: none;
-ms-transform: none;
-webkit-transform: none;
transform: none;
-moz-transition: -moz-transform 0.1s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition: -webkit-transform 0.1s cubic-bezier(0, 0, 0.2, 1);
-ms-transition: -ms-transform 0.1s cubic-bezier(0, 0, 0.2, 1);
transition: transform 0.1s cubic-bezier(0, 0, 0.2, 1)
}
.ytp-scrubber-pull-indicator {
position: absolute;
z-index: 42;
bottom: 16.9px;
left: 6.5px;
-moz-transform: rotate(45deg);
-ms-transform: rotate(45deg);
-webkit-transform: rotate(45deg);
transform: rotate(45deg)
}
.ytp-big-mode .ytp-scrubber-button {
bottom: 20px;
left: 10px
}
.ytp-scrubber-pull-indicator::before {
display: block;
position: absolute;
content: "";
top: 0;
left: 0;
opacity: 0;
width: 6.5px;
height: 6.5px;
border-style: solid;
border-width: 2px 0 0 2px;
border-color: #eaeaea
}
.ytp-scrubber-pull-indicator::after {
display: block;
position: absolute;
content: "";
top: 0;
left: 0;
opacity: 0;
width: 6.5px;
height: 6.5px;
border-style: solid;
border-width: 2px 0 0 2px;
border-color: #eaeaea
}
.ytp-big-mode .ytp-scrubber-pull-indicator::before, .ytp-big-mode .ytp-scrubber-pull-indicator::after {
width: 10px;
height: 10px
}
.ytp-scrubber-pull-indicator::after {
-moz-transition: all 0.1s;
-webkit-transition: all 0.1s;
transition: all 0.1s
}
.ytp-scrubber-pull-indicator::before {
-moz-transition: all 0.2s;
-webkit-transition: all 0.2s;
transition: all 0.2s
}
.ytp-pull-ui:not(.ytp-pulling) .ytp-scrubber-pull-indicator::before {
opacity: 1;
top: -4px;
left: -4px
}
.ytp-big-mode .ytp-pull-ui:not(.ytp-pulling) .ytp-scrubber-pull-indicator::before {
top: -9px;
left: -9px
}
.ytp-pull-ui:not(.ytp-pulling) .ytp-scrubber-pull-indicator::after {
opacity: 1;
top: -8px;
left: -8px
}
.ytp-big-mode .ytp-pull-ui:not(.ytp-pulling) .ytp-scrubber-pull-indicator::after {
opacity: 1;
top: -15px;
left: -15px
}
.ytp-progress-list {
z-index: 39;
background: rgba(255, 255, 255, 0.2);
height: 100%;
-moz-transform: scaley(0.6);
-ms-transform: scaley(0.6);
-webkit-transform: scaley(0.6);
transform: scaley(0.6);
-moz-transition: -moz-transform 0.1s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: -webkit-transform 0.1s cubic-bezier(0.4, 0, 1, 1);
-ms-transition: -ms-transform 0.1s cubic-bezier(0.4, 0, 1, 1);
transition: transform 0.1s cubic-bezier(0.4, 0, 1, 1);
position: relative
}
.ytp-big-mode .ytp-progress-list {
-moz-transform: translatey(-0.5px) scaley(0.625);
-ms-transform: translatey(-0.5px) scaley(0.625);
-webkit-transform: translatey(-0.5px) scaley(0.625);
transform: translatey(-0.5px) scaley(0.625)
}
.ytp-progress-bar-container:hover:not([aria-disabled=true]) .ytp-progress-list, .ytp-touch-mode .ytp-progress-bar-container:not([aria-disabled=true]) .ytp-progress-list, .ytp-drag .ytp-progress-list {
-moz-transform: none;
-ms-transform: none;
-webkit-transform: none;
transform: none;
-moz-transition: -moz-transform 0.1s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition: -webkit-transform 0.1s cubic-bezier(0, 0, 0.2, 1);
-ms-transition: -ms-transform 0.1s cubic-bezier(0, 0, 0.2, 1);
transition: transform 0.1s cubic-bezier(0, 0, 0.2, 1)
}
.ytp-bound-time-left, .ytp-bound-time-right {
position: absolute;
display: none;
top: -29px;
z-index: 29;
background-color: rgba(28, 28, 28, 0.9);
text-align: center;
color: #e3e3e3;
padding: 5px 9px;
opacity: 0;
-moz-transition: opacity 0.1s ease-in;
-webkit-transition: opacity 0.1s ease-in;
transition: opacity 0.1s ease-in
}
.ytp-big-mode .ytp-bound-time-left, .ytp-big-mode .ytp-bound-time-right {
top: -36px
}
.ytp-pull-ui .ytp-bound-time-left, .ytp-pull-ui .ytp-bound-time-right {
display: block
}
.ytp-pulling .ytp-bound-time-left, .ytp-pulling .ytp-bound-time-right {
opacity: 1;
-moz-transition: opacity 0.1s ease-out;
-webkit-transition: opacity 0.1s ease-out;
transition: opacity 0.1s ease-out
}
.ytp-bound-time-left {
left: 0
}
.ytp-bound-time-right {
right: 0
}
.ytp-bound-time-left::after {
position: absolute;
content: "";
bottom: -5px;
width: 0;
height: 0;
border-style: solid
}
.ytp-bound-time-right::after {
position: absolute;
content: "";
bottom: -5px;
width: 0;
height: 0;
border-style: solid
}
.ytp-bound-time-left::after {
left: 0;
border-width: 5px 5px 0 0;
border-color: rgba(28, 28, 28, 0.9) transparent transparent
}
.ytp-bound-time-right::after {
right: 0;
border-width: 0 5px 5px 0;
border-color: transparent rgba(28, 28, 28, 0.9) transparent transparent
}
.ytp-ad-progress, .ytp-load-progress, .ytp-play-progress, .ytp-hover-progress {
position: absolute;
left: 0;
bottom: 0;
width: 100%;
height: 100%;
-moz-transform-origin: 0 0;
-ms-transform-origin: 0 0;
-webkit-transform-origin: 0 0;
transform-origin: 0 0
}
.ytp-1m-progress, .ytp-15m-progress, .ytp-30m-progress, .ytp-60m-progress {
position: absolute;
left: 0;
bottom: 0;
-moz-transform-origin: 0 0;
-ms-transform-origin: 0 0;
-webkit-transform-origin: 0 0;
transform-origin: 0 0
}
.ytp-chapter-marker, .ytp-time-marker, .ytp-clip-start-exclude, .ytp-clip-end-exclude {
position: absolute;
left: 0;
bottom: 0;
width: 100%;
height: 100%;
-moz-transform-origin: 0 0;
-ms-transform-origin: 0 0;
-webkit-transform-origin: 0 0;
transform-origin: 0 0
}
.ytp-clip-start-exclude, .ytp-clip-end-exclude {
display: none;
z-index: 37;
background-color: rgba(255, 255, 255, 0);
-moz-transition: background-color 0.1s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: background-color 0.1s cubic-bezier(0.4, 0, 1, 1);
transition: background-color 0.1s cubic-bezier(0.4, 0, 1, 1)
}
.ytp-clip-start-enabled .ytp-clip-start-exclude, .ytp-clip-end-enabled .ytp-clip-end-exclude {
display: block
}
.ytp-clip-hover .ytp-clip-start-exclude, .ytp-clip-hover .ytp-clip-end-exclude {
background-color: rgba(255, 255, 255, 0.5);
-moz-transition: background-color 0.1s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition: background-color 0.1s cubic-bezier(0, 0, 0.2, 1);
transition: background-color 0.1s cubic-bezier(0, 0, 0.2, 1)
}
.ytp-ad-progress {
z-index: 36;
background: #fc0
}
.ytp-load-progress {
z-index: 33;
background: rgba(255, 255, 255, 0.4)
}
.playing-mode .ytp-progress-bar-container:not(.ytp-pull-ui) .ytp-load-progress {
-moz-transition: -moz-transform 0.1s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: -webkit-transform 0.1s cubic-bezier(0.4, 0, 1, 1);
-ms-transition: -ms-transform 0.1s cubic-bezier(0.4, 0, 1, 1);
transition: transform 0.1s cubic-bezier(0.4, 0, 1, 1)
}
.playing-mode .ytp-progress-bar-container:not(.ytp-pull-ui) .ytp-load-progress.ytp-fast-load {
-moz-transition: -moz-transform 1.2s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition: -webkit-transform 1.2s cubic-bezier(0, 0, 0.2, 1);
-ms-transition: -ms-transform 1.2s cubic-bezier(0, 0, 0.2, 1);
transition: transform 1.2s cubic-bezier(0, 0, 0.2, 1)
}
.ytp-load-progress.ytp-fast-load {
background: #00838f
}
.ytp-play-progress {
z-index: 34
}
.ypc-loaded .ytp-play-progress.ytp-swatch-background-color {
background: #167ac6
}
.ad-interrupting .ytp-play-progress.ytp-swatch-background-color {
background: #fc0
}
.ytp-hover-progress {
z-index: 35;
background: rgba(0, 0, 0, 0.125);
opacity: 0;
-moz-transition: opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition: opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
transition: opacity 0.25s cubic-bezier(0, 0, 0.2, 1)
}
.ytp-hover-progress-light {
background: rgba(255, 255, 255, 0.5)
}
.ytp-hover-progress-shown {
opacity: 1
}
.ytp-chapter-marker {
z-index: 41
}
.ytp-time-marker {
z-index: 40
}
.ytp-1m-progress, .ytp-15m-progress, .ytp-30m-progress, .ytp-60m-progress {
width: 1px;
background: #000;
z-index: 36
}
.ytp-1m-progress {
height: 30%
}
.ytp-15m-progress {
height: 50%
}
.ytp-30m-progress {
height: 55%
}
.ytp-60m-progress {
height: 60%
}
.ytp-clip-start, .ytp-clip-end {
display: none;
position: absolute;
width: 14px;
height: 14px;
bottom: -4.5px;
margin-left: -7px;
z-index: 44;
-moz-transform: scaley(0.214286);
-ms-transform: scaley(0.214286);
-webkit-transform: scaley(0.214286);
transform: scaley(0.214286);
-moz-transition: -moz-transform 0.1s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: -webkit-transform 0.1s cubic-bezier(0.4, 0, 1, 1);
-ms-transition: -ms-transform 0.1s cubic-bezier(0.4, 0, 1, 1);
transition: transform 0.1s cubic-bezier(0.4, 0, 1, 1)
}
.ytp-big-mode .ytp-clip-start, .ytp-big-mode .ytp-clip-end {
width: 21px;
height: 21px;
bottom: -6.5px;
margin-left: -10.5px;
-moz-transform: scaley(0.238095);
-ms-transform: scaley(0.238095);
-webkit-transform: scaley(0.238095);
transform: scaley(0.238095)
}
.ytp-progress-bar-container:hover:not([aria-disabled=true]) .ytp-clip-start, .ytp-progress-bar-container:hover:not([aria-disabled=true]) .ytp-clip-end, .ytp-touch-mode .ytp-progress-bar-container:not([aria-disabled=true]) .ytp-clip-start, .ytp-touch-mode .ytp-progress-bar-container:not([aria-disabled=true]) .ytp-clip-end, .ytp-drag .ytp-clip-start, .ytp-drag .ytp-clip-end {
-moz-transform: none;
-ms-transform: none;
-webkit-transform: none;
transform: none;
-moz-transition: -moz-transform 0.1s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition: -webkit-transform 0.1s cubic-bezier(0, 0, 0.2, 1);
-ms-transition: -ms-transform 0.1s cubic-bezier(0, 0, 0.2, 1);
transition: transform 0.1s cubic-bezier(0, 0, 0.2, 1)
}
.ytp-clip-start svg, .ytp-clip-end svg {
display: block
}
.ytp-clip-start-enabled:not(.ytp-drag) .ytp-clip-start, .ytp-clip-end-enabled:not(.ytp-drag) .ytp-clip-end {
display: block
}
.ytp-progress-bar-container {
display: block;
position: absolute;
width: 100%;
bottom: 35px;
height: 5px
}
.ytp-progress-bar-container:not([aria-disabled=true]) {
cursor: pointer
}
.ytp-big-mode .ytp-progress-bar-container {
bottom: 52.5px;
height: 8px
}
.ytp-progress-bar {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 31;
outline: none
}
.ytp-progress-bar-padding {
position: absolute;
width: 100%;
height: 16px;
bottom: 0;
z-index: 28
}
.ytp-big-mode .ytp-progress-bar-padding {
height: 24px
}
.ytp-progress-bar-container:hover:not([aria-disabled=true]) .ytp-progress-bar-padding {
height: 22px;
bottom: -6px
}
.ytp-big-mode:not(.ytp-touch-mode) .ytp-progress-bar-container:hover:not([aria-disabled=true]) .ytp-progress-bar-padding {
height: 33px;
bottom: -9px
}
.ytp-touch-mode .ytp-progress-bar-container:not([aria-disabled=true]) .ytp-progress-bar-padding {
height: 40px;
bottom: -11px
}
.ytp-replay-button {
position: absolute;
left: 50%;
bottom: 6px;
margin-left: -18px;
z-index: 61
}
.ytp-big-mode .ytp-replay-button {
bottom: 7.5px;
margin-left: -27px
}
.ytp-remote {
left: 0;
bottom: 49px;
-moz-transition: bottom 0.25s cubic-bezier(0, 0, 0.2, 1), opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition: bottom 0.25s cubic-bezier(0, 0, 0.2, 1), opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
transition: bottom 0.25s cubic-bezier(0, 0, 0.2, 1), opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
pointer-events: none
}
.ytp-remote[aria-hidden=true] {
opacity: 0;
-moz-transition: bottom 0.25s cubic-bezier(0.4, 0, 1, 1), opacity 0.25s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: bottom 0.25s cubic-bezier(0.4, 0, 1, 1), opacity 0.25s cubic-bezier(0.4, 0, 1, 1);
transition: bottom 0.25s cubic-bezier(0.4, 0, 1, 1), opacity 0.25s cubic-bezier(0.4, 0, 1, 1)
}
.ytp-big-mode .ytp-remote {
bottom: 70px
}
.ytp-hide-controls .ytp-remote {
bottom: 12px;
-moz-transition: bottom 0.25s cubic-bezier(0.4, 0, 1, 1), opacity 0.25s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: bottom 0.25s cubic-bezier(0.4, 0, 1, 1), opacity 0.25s cubic-bezier(0.4, 0, 1, 1);
transition: bottom 0.25s cubic-bezier(0.4, 0, 1, 1), opacity 0.25s cubic-bezier(0.4, 0, 1, 1)
}
.ytp-remote-display-status {
z-index: 15;
position: absolute;
left: 12px;
bottom: 49px;
background-color: rgba(0, 0, 0, 0.6);
padding-right: 5px;
border-radius: 5px;
opacity: 0.85
}
.ytp-big-mode .ytp-remote-display-status {
bottom: 70px
}
.ytp-remote-display-status-icon {
float: left;
width: 40px;
height: 40px
}
.ytp-big-mode .ytp-remote-display-status-icon {
width: 60px;
height: 60px
}
.ytp-remote-display-status-text, .ytp-remote-display-status-receiver {
text-shadow: 0 0 2px rgba(0, 0, 0, 0.5);
padding-top: 10px;
padding-left: 5px;
font-size: 130%;
font-weight: 500;
display: inline-block
}
.ytp-big-mode .ytp-remote-display-status-text, .ytp-big-mode .ytp-remote-display-status-receiver {
padding-top: 15px;
left: 105px
}
.ytp-big-mode .ytp-remote-display-status-text {
top: 30px
}
.ytp-big-mode .ytp-remote-display-status-receiver {
top: 52px
}
.ytp-settings-button {
position: relative
}
.ytp-settings-button svg {
-moz-transition: -moz-transform 0.1s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: -webkit-transform 0.1s cubic-bezier(0.4, 0, 1, 1);
-ms-transition: -ms-transform 0.1s cubic-bezier(0.4, 0, 1, 1);
transition: transform 0.1s cubic-bezier(0.4, 0, 1, 1)
}
.ytp-settings-button[aria-expanded=true] svg {
-moz-transform: rotatez(30deg);
-ms-transform: rotatez(30deg);
-webkit-transform: rotatez(30deg);
transform: rotatez(30deg)
}
.ytp-settings-button.ytp-hd-quality-badge:after, .ytp-settings-button.ytp-4k-quality-badge:after, .ytp-settings-button.ytp-5k-quality-badge:after, .ytp-settings-button.ytp-8k-quality-badge:after {
content: "";
position: absolute;
top: 10px;
right: 5px;
height: 9px;
width: 13px;
background-color: #f12b24;
border-radius: 1px;
line-height: normal
}
.ytp-settings-button.ytp-3d-badge-grey:after {
content: "";
position: absolute;
top: 10px;
right: 5px;
height: 9px;
width: 13px;
border-radius: 1px;
line-height: normal
}
.ytp-settings-button.ytp-3d-badge:after {
content: "";
position: absolute;
top: 10px;
right: 5px;
height: 9px;
width: 13px;
background-color: #f12b24;
border-radius: 1px;
line-height: normal
}
.ytp-settings-button.ytp-3d-badge-grey:after {
background-color: #666
}
.ytp-color-white .ytp-settings-button.ytp-hd-quality-badge:after, .ytp-color-white .ytp-settings-button.ytp-4k-quality-badge:after, .ytp-color-white .ytp-settings-button.ytp-5k-quality-badge:after, .ytp-color-white .ytp-settings-button.ytp-8k-quality-badge:after, .ytp-color-white .ytp-settings-button.ytp-3d-badge-grey:after, .ytp-color-white .ytp-settings-button.ytp-3d-badge:after {
background-color: #ddd
}
.ytp-color-party .ytp-settings-button.ytp-hd-quality-badge:after, .ytp-color-party .ytp-settings-button.ytp-4k-quality-badge:after, .ytp-color-party .ytp-settings-button.ytp-5k-quality-badge:after, .ytp-color-party .ytp-settings-button.ytp-8k-quality-badge:after, .ytp-color-party .ytp-settings-button.ytp-3d-badge-grey:after, .ytp-color-party .ytp-settings-button.ytp-3d-badge:after {
-moz-animation: ytp-party-background-color 0.1s linear infinite;
-webkit-animation: ytp-party-background-color 0.1s linear infinite;
animation: ytp-party-background-color 0.1s linear infinite
}
.ytp-settings-button.ytp-hd-quality-badge:after {
background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMTAwJSIgdmVyc2lvbj0iMS4xIiB2aWV3Qm94PSIwIDAgMTMgOSIgd2lkdGg9IjEwMCUiPjxwYXRoIGQ9Ik01LDcgTDYsNyBMNiw4IEw1LDggTDUsNyBaIE0xMCwzIEwxMCw0IEw4LDQgTDgsMyBMMTAsMyBaIE0zLDYgTDMsNSBMNSw1IEw1LDYgTDMsNiBaIE0yLDcgTDMsNyBMMyw4IEwyLDggTDIsNyBaIE03LDcgTDEwLDcgTDEwLDggTDcsOCBMNyw3IFogTTEwLDYgTDExLDYgTDExLDcgTDEwLDcgTDEwLDYgWiIgZmlsbD0iIzAwMCIgZmlsbC1vcGFjaXR5PSIwLjY0NzEiIGZpbGwtcnVsZT0iZXZlbm9kZCIgLz48cGF0aCBkPSJNNSw3IEw1LDYgTDUsNSBMMyw1IEwzLDYgTDMsNyBMMiw3IEwyLDIgTDMsMiBMMyw0IEw1LDQgTDUsMiBMNiwyIEw2LDcgTDUsNyBaIE0xMSw2IEwxMCw2IEwxMCw3IEw3LDcgTDcsMiBMMTAsMiBMMTAsMyBMMTEsMyBMMTEsNiBaIE0xMCw0IEwxMCwzIEw4LDMgTDgsNCBMOCw2IEwxMCw2IEwxMCw0IFoiIGZpbGw9IiNmZmYiIGZpbGwtcnVsZT0iZXZlbm9kZCIgLz48L3N2Zz4=")
}
.ytp-settings-button.ytp-4k-quality-badge:after {
background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMTAwJSIgdmVyc2lvbj0iMS4xIiB2aWV3Qm94PSIwIDAgMTMgOSIgd2lkdGg9IjEwMCUiPjxwYXRoIGQ9Ik0xMCw0IEwxMSw0IEwxMSw1IEwxMCw1IEwxMCw0IFogTTEwLDcgTDExLDcgTDExLDggTDEwLDggTDEwLDcgWiBNOCw1IEwxMCw1IEwxMCw2IEw4LDYgTDgsNSBaIE03LDcgTDgsNyBMOCw4IEw3LDggTDcsNyBaIE01LDYgTDYsNiBMNiw3IEw1LDcgTDUsNiBaIE00LDcgTDUsNyBMNSw4IEw0LDggTDQsNyBaIE0yLDYgTDQsNiBMNCw3IEwyLDcgTDIsNiBaIE0zLDQgTDQsNCBMNCw1IEwzLDUgTDMsNCBaIiBmaWxsPSIjMDAwIiBmaWxsLW9wYWNpdHk9IjAuNjQ3MSIgZmlsbC1ydWxlPSJldmVub2RkIiAvPjxwYXRoIGQ9Ik0xMSw1IEwxMSw3IEwxMCw3IEwxMCw2IEwxMCw1IEwxMSw1IFogTTEwLDUgTDgsNSBMOCw2IEw4LDcgTDcsNyBMNywyIEw4LDIgTDgsNCBMMTAsNCBMMTAsNSBaIE00LDQgTDMsNCBMMyw1IEw0LDUgTDQsNCBaIE00LDcgTDQsNiBMMiw2IEwyLDQgTDMsNCBMMywzIEw0LDMgTDQsMiBMNSwyIEw1LDUgTDYsNSBMNiw2IEw1LDYgTDUsNyBMNCw3IFogTTEwLDIgTDExLDIgTDExLDQgTDEwLDQgTDEwLDIgWiIgZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIiAvPjwvc3ZnPg==")
}
.ytp-settings-button.ytp-5k-quality-badge:after {
background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMTAwJSIgdmVyc2lvbj0iMS4xIiB2aWV3Qm94PSIwIDAgMTMgOSIgd2lkdGg9IjEwMCUiPjxwYXRoIGQ9Ik0xMCw0IEwxMSw0IEwxMSw1IEwxMCw1IEwxMCw0IFogTTEwLDcgTDExLDcgTDExLDggTDEwLDggTDEwLDcgWiBNOCw1IEwxMCw1IEwxMCw2IEw4LDYgTDgsNSBaIE03LDcgTDgsNyBMOCw4IEw3LDggTDcsNyBaIE01LDYgTDYsNiBMNiw3IEw1LDcgTDUsNiBaIE0yLDcgTDUsNyBMNSw4IEwyLDggTDIsNyBaIE0yLDUgTDUsNSBMNSw2IEwyLDYgTDIsNSBaIiBmaWxsPSIjMDAwIiBmaWxsLW9wYWNpdHk9IjAuNjQ3MSIgZmlsbC1ydWxlPSJldmVub2RkIiAvPjxwYXRoIGQ9Ik0xMSw1IEwxMSw3IEwxMCw3IEwxMCw2IEwxMCw1IEwxMSw1IE0xMCw1IEw4LDUgTDgsNiBMOCw3IEw3LDcgTDcsMiBMOCwyIEw4LDQgTDEwLDQgTDEwLDUgTTEwLDIgTDExLDIgTDExLDQgTDEwLDQgTDEwLDIgTTIsNiBMNSw2IEw1LDcgTDIsNyBNNSw1IEw2LDUgTDYsNiBMNSw2IE01LDQgTDMsNCBMMywzIEw2LDMgTDYsMiBMMiwyIEwyLDUgTDUsNSBMNSw0IFoiIGZpbGw9IiNmZmYiIGZpbGwtcnVsZT0iZXZlbm9kZCIgLz48L3N2Zz4=")
}
.ytp-settings-button.ytp-8k-quality-badge:after {
background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMTAwJSIgdmVyc2lvbj0iMS4xIiB2aWV3Qm94PSIwIDAgMTMgOSIgd2lkdGg9IjEwMCUiPjxwYXRoIGQ9Ik0xMCw0IEwxMSw0IEwxMSw1IEwxMCw1IEwxMCw0IFogTTEwLDcgTDExLDcgTDExLDggTDEwLDggTDEwLDcgWiBNOCw1IEwxMCw1IEwxMCw2IEw4LDYgTDgsNSBaIE03LDcgTDgsNyBMOCw4IEw3LDggTDcsNyBaIE01LDYgTDYsNiBMNiw3IEw1LDcgTDUsNiBaIE0zLDUgTDUsNSBMNSw2IEwzLDYgTDMsNSBaIE0zLDMgTDUsMyBMNSw0IEwzLDQgTDMsMyBaIE01LDQgTDYsNCBMNiw1IEw1LDUgTDUsNCBaIE0yLDQgTDMsNCBMMyw1IEwyLDUgTDIsNCBaIE0yLDYgTDMsNiBMMyw3IEwyLDcgTDIsNiBaIE0zLDcgTDUsNyBMNSw4IEwzLDggTDMsNyBaIiBmaWxsPSIjMDAwIiBmaWxsLW9wYWNpdHk9IjAuNjQ3MSIgZmlsbC1ydWxlPSJldmVub2RkIiAvPjxwYXRoIGQ9Ik0xMSw1IEwxMSw3IEwxMCw3IEwxMCw2IEwxMCw1IEwxMSw1IE0xMCw1IEw4LDUgTDgsNiBMOCw3IEw3LDcgTDcsMiBMOCwyIEw4LDQgTDEwLDQgTDEwLDUgTTEwLDIgTDExLDIgTDExLDQgTDEwLDQgTDEwLDIgTTMsNiBMNSw2IEw1LDcgTDMsNyBNMywyIEw1LDIgTDUsMyBMMywzIEwzLDIgWiBNNSw1IEw2LDUgTDYsNiBMNSw2IEw1LDUgWiBNMyw0IEw1LDQgTDUsNSBMMyw1IEwzLDQgWiBNNSwzIEw2LDMgTDYsNCBMNSw0IEw1LDMgWiBNMiw1IEwzLDUgTDMsNiBMMiw2IEwyLDUgWiBNMiwzIEwzLDMgTDMsNCBMMiw0IEwyLDMgWiIgZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIiAvPjwvc3ZnPg==")
}
.ytp-settings-button.ytp-3d-badge-grey:after, .ytp-settings-button.ytp-3d-badge:after {
background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMTAwJSIgdmVyc2lvbj0iMS4xIiB2aWV3Qm94PSIwIDAgMTMgOSIgd2lkdGg9IjEwMCUiPjxwYXRoIGQ9Ik0yIDJoNHY1aC00di0xaDN2LTFoLTN2LTFoM3YtMWgtM3pNNyAyaDN2MWgtMnYzaDJ2MWgtM3pNMTAgM2gxdjNoLTF6IiBmaWxsPSIjZmZmIiAvPjxwYXRoIGQ9Ik0yIDNoM3YxaC0zek04IDNoMnYxaC0yek0yIDVoM3YxaC0zek0xMCA2aDF2MWgtMXpNMiA3aDR2MWgtNHpNNyA3aDN2MWgtM3oiIGZpbGw9IiMwMDAiIGZpbGwtb3BhY2l0eT0iMC42NDcxIiAvPjwvc3ZnPg==")
}
.ytp-color-white .ytp-settings-button.ytp-hd-quality-badge:after {
background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMTAwJSIgdmVyc2lvbj0iMS4xIiB2aWV3Qm94PSIwIDAgMTMgOSIgd2lkdGg9IjEwMCUiPjxwYXRoIGQ9Ik01LDcgTDUsNiBMNSw1IEwzLDUgTDMsNiBMMyw3IEwyLDcgTDIsMiBMMywyIEwzLDQgTDUsNCBMNSwyIEw2LDIgTDYsNyBMNSw3IFogTTExLDYgTDEwLDYgTDEwLDcgTDcsNyBMNywyIEwxMCwyIEwxMCwzIEwxMSwzIEwxMSw2IFogTTEwLDQgTDEwLDMgTDgsMyBMOCw0IEw4LDYgTDEwLDYgTDEwLDQgWiIgZmlsbC1ydWxlPSJldmVub2RkIiAvPjwvc3ZnPg==")
}
.ytp-color-white .ytp-settings-button.ytp-4k-quality-badge:after {
background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMTAwJSIgdmVyc2lvbj0iMS4xIiB2aWV3Qm94PSIwIDAgMTMgOSIgd2lkdGg9IjEwMCUiPjxwYXRoIGQ9Ik0xMSw1IEwxMSw3IEwxMCw3IEwxMCw2IEwxMCw1IEwxMSw1IFogTTEwLDUgTDgsNSBMOCw2IEw4LDcgTDcsNyBMNywyIEw4LDIgTDgsNCBMMTAsNCBMMTAsNSBaIE00LDQgTDMsNCBMMyw1IEw0LDUgTDQsNCBaIE00LDcgTDQsNiBMMiw2IEwyLDQgTDMsNCBMMywzIEw0LDMgTDQsMiBMNSwyIEw1LDUgTDYsNSBMNiw2IEw1LDYgTDUsNyBMNCw3IFogTTEwLDIgTDExLDIgTDExLDQgTDEwLDQgTDEwLDIgWiIgZmlsbC1ydWxlPSJldmVub2RkIiAvPjwvc3ZnPg==")
}
.ytp-color-white .ytp-settings-button.ytp-5k-quality-badge:after {
background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMTAwJSIgdmVyc2lvbj0iMS4xIiB2aWV3Qm94PSIwIDAgMTMgOSIgd2lkdGg9IjEwMCUiPjxwYXRoIGQ9Ik0xMSw1IEwxMSw3IEwxMCw3IEwxMCw2IEwxMCw1IEwxMSw1IE0xMCw1IEw4LDUgTDgsNiBMOCw3IEw3LDcgTDcsMiBMOCwyIEw4LDQgTDEwLDQgTDEwLDUgTTEwLDIgTDExLDIgTDExLDQgTDEwLDQgTDEwLDIgTTIsNiBMNSw2IEw1LDcgTDIsNyBNNSw1IEw2LDUgTDYsNiBMNSw2IE01LDQgTDMsNCBMMywzIEw2LDMgTDYsMiBMMiwyIEwyLDUgTDUsNSBMNSw0IFoiIGZpbGwtcnVsZT0iZXZlbm9kZCIgLz48L3N2Zz4=")
}
.ytp-color-white .ytp-settings-button.ytp-8k-quality-badge:after {
background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMTAwJSIgdmVyc2lvbj0iMS4xIiB2aWV3Qm94PSIwIDAgMTMgOSIgd2lkdGg9IjEwMCUiPjxwYXRoIGQ9Ik0xMSw1IEwxMSw3IEwxMCw3IEwxMCw2IEwxMCw1IEwxMSw1IE0xMCw1IEw4LDUgTDgsNiBMOCw3IEw3LDcgTDcsMiBMOCwyIEw4LDQgTDEwLDQgTDEwLDUgTTEwLDIgTDExLDIgTDExLDQgTDEwLDQgTDEwLDIgTTMsNiBMNSw2IEw1LDcgTDMsNyBNMywyIEw1LDIgTDUsMyBMMywzIEwzLDIgWiBNNSw1IEw2LDUgTDYsNiBMNSw2IEw1LDUgWiBNMyw0IEw1LDQgTDUsNSBMMyw1IEwzLDQgWiBNNSwzIEw2LDMgTDYsNCBMNSw0IEw1LDMgWiBNMiw1IEwzLDUgTDMsNiBMMiw2IEwyLDUgWiBNMiwzIEwzLDMgTDMsNCBMMiw0IEwyLDMgWiIgZmlsbC1ydWxlPSJldmVub2RkIiAvPjwvc3ZnPg==")
}
.ytp-color-white .ytp-settings-button.ytp-3d-badge-grey:after, .ytp-color-white .ytp-settings-button.ytp-3d-badge:after {
background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMTAwJSIgdmVyc2lvbj0iMS4xIiB2aWV3Qm94PSIwIDAgMTMgOSIgd2lkdGg9IjEwMCUiPjxwYXRoIGQ9Ik0yIDJoNHY1aC00di0xaDN2LTFoLTN2LTFoM3YtMWgtM3pNNyAyaDN2MWgtMnYzaDJ2MWgtM3pNMTAgM2gxdjNoLTF6IiBmaWxsPSIjMDAwIiAvPjwvc3ZnPg==")
}
.ytp-big-mode .ytp-settings-button.ytp-hd-quality-badge:after, .ytp-big-mode .ytp-settings-button.ytp-4k-quality-badge:after, .ytp-big-mode .ytp-settings-button.ytp-5k-quality-badge:after, .ytp-big-mode .ytp-settings-button.ytp-8k-quality-badge:after, .ytp-big-mode .ytp-settings-button.ytp-3d-badge-grey:after, .ytp-big-mode .ytp-settings-button.ytp-3d-badge:after {
top: 15px;
right: 6px;
padding: 2px;
font-family: Verdana, sans-serif;
font-size: 10px;
font-weight: bold;
color: #fff;
text-shadow: 0 2px 0 rgba(0, 0, 0, 0.6);
background-image: none;
border-radius: 1.5px;
height: auto;
width: auto
}
.ytp-color-white.ytp-big-mode .ytp-settings-button.ytp-hd-quality-badge:after, .ytp-color-white.ytp-big-mode .ytp-settings-button.ytp-4k-quality-badge:after, .ytp-color-white.ytp-big-mode .ytp-settings-button.ytp-5k-quality-badge:after, .ytp-color-white.ytp-big-mode .ytp-settings-button.ytp-8k-quality-badge:after, .ytp-color-white.ytp-big-mode .ytp-settings-button.ytp-3d-badge-grey:after, .ytp-color-white.ytp-big-mode .ytp-settings-button.ytp-3d-badge:after {
color: #000;
text-shadow: none
}
.ytp-big-mode .ytp-settings-button.ytp-hd-quality-badge:after {
content: "HD"
}
.ytp-big-mode .ytp-settings-button.ytp-4k-quality-badge:after {
content: "4K"
}
.ytp-big-mode .ytp-settings-button.ytp-5k-quality-badge:after {
content: "5K"
}
.ytp-big-mode .ytp-settings-button.ytp-8k-quality-badge:after {
content: "8K"
}
.ytp-big-mode .ytp-settings-button.ytp-3d-badge-grey:after, .ytp-big-mode .ytp-settings-button.ytp-3d-badge:after {
content: "3D"
}
.ytp-settings-menu {
right: 12px;
bottom: 49px;
z-index: 69;
will-change: width, height
}
.ytp-big-mode .ytp-settings-menu {
right: 24px;
bottom: 70px
}
.ytp-settings-menu #ytp-main-menu-id .ytp-menuitem-content {
overflow: hidden;
white-space: nowrap;
word-wrap: normal;
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
max-width: 150px
}
.ytp-show-share-title .ytp-share-button {
margin-left: 10px;
margin-right: 10px
}
.ytp-big-mode .ytp-chrome-top .ytp-chrome-top-buttons .ytp-share-button, .ytp-chrome-top .ytp-chrome-top-buttons .ytp-share-button {
width: auto;
height: auto
}
.ytp-share-icon {
margin: auto;
width: 36px;
height: 36px
}
.ytp-big-mode .ytp-share-icon {
width: 54px;
height: 54px
}
.ytp-share-title {
font-weight: 500;
text-align: center
}
.ytp-share-panel {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 72;
background: rgba(0, 0, 0, 0.8);
text-align: center;
-moz-transition: opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition: opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
transition: opacity 0.25s cubic-bezier(0, 0, 0.2, 1)
}
.ytp-share-panel[aria-hidden=true] {
opacity: 0;
-moz-transition: opacity 0.25s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: opacity 0.25s cubic-bezier(0.4, 0, 1, 1);
transition: opacity 0.25s cubic-bezier(0.4, 0, 1, 1)
}
.ytp-share-panel-inner-content {
position: absolute;
top: 50%;
margin-top: -65px;
left: 0;
right: 0;
padding: 0 10%
}
.ytp-big-mode .ytp-share-panel-inner-content {
margin-top: -98px
}
.ytp-share-panel.ytp-share-panel-has-playlist .ytp-share-panel-inner-content {
margin-top: -78.5px
}
.ytp-big-mode .ytp-share-panel.ytp-share-panel-has-playlist .ytp-share-panel-inner-content {
margin-top: -118.25px
}
.ytp-share-panel-loading-spinner {
display: none;
margin: 20px auto 0;
width: 32px;
height: 32px;
position: relative
}
.ytp-big-mode .ytp-share-panel-loading-spinner {
margin-top: 30px
}
.ytp-share-panel.ytp-share-panel-loading .ytp-share-panel-loading-spinner {
display: block
}
.ytp-share-panel-close {
position: absolute;
top: 6px;
right: 12px;
padding: 6px;
width: 36px;
height: 36px
}
.ytp-big-mode .ytp-share-panel-close {
top: 9px;
right: 24px;
padding: 9px;
width: 54px;
height: 54px
}
.ytp-share-panel-close path {
fill: #aaa
}
.ytp-share-panel-close:hover path {
fill: #fff
}
.ytp-share-panel-title {
font-size: 155%;
line-height: 20px
}
.ytp-big-mode .ytp-share-panel-title {
line-height: 30px
}
.ytp-share-panel-link {
display: block;
height: 28px;
margin-top: 18px;
text-overflow: ellipsis;
font-size: 218%;
font-weight: 500;
letter-spacing: 1px;
white-space: nowrap;
overflow: hidden;
outline: none
}
.ytp-big-mode .ytp-share-panel-link {
height: 42px;
margin-top: 27px
}
.ytp-share-panel-include-playlist {
display: none;
line-height: 15px;
margin-top: 12px;
font-size: 118%;
color: #999
}
.ytp-big-mode .ytp-share-panel-include-playlist {
line-height: 22.5px;
margin-top: 18px
}
.ytp-share-panel-include-playlist input[type=checkbox] {
margin: 0 8px 0 0
}
.ytp-share-panel.ytp-share-panel-has-playlist .ytp-share-panel-include-playlist {
display: block
}
.ytp-share-panel-service-buttons {
margin-top: 20px;
height: 44px
}
.ytp-big-mode .ytp-share-panel-service-buttons {
margin-top: 30px;
height: 67px
}
.ytp-share-panel.ytp-share-panel-fail .ytp-share-panel-service-buttons, .ytp-share-panel.ytp-share-panel-loading .ytp-share-panel-service-buttons {
display: none
}
.ytp-share-panel-service-button {
padding: 3px;
width: 38px;
height: 38px;
display: inline-block
}
.ytp-big-mode .ytp-share-panel-service-button {
padding: 5px;
width: 57px;
height: 57px
}
.ytp-share-panel-error {
display: none;
margin-top: 20px;
font-size: 109%
}
.ytp-big-mode .ytp-share-panel-error {
margin-top: 30px
}
.ytp-share-panel-fail .ytp-share-panel-error {
display: block
}
.ytp-webgl-spherical-control {
position: absolute;
top: 48px;
left: 12px;
opacity: 0.6;
cursor: pointer;
width: 50px;
height: 50px;
-moz-transition: top 0.25s cubic-bezier(0, 0, 0.2, 1), opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition: top 0.25s cubic-bezier(0, 0, 0.2, 1), opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
transition: top 0.25s cubic-bezier(0, 0, 0.2, 1), opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
z-index: 39;
outline: none
}
.ytp-big-mode .ytp-webgl-spherical-control {
top: 69px;
width: 75px;
height: 75px
}
.ytp-webgl-spherical-control:hover, .ytp-webgl-spherical-control.ytp-dragging {
opacity: 1
}
.ytp-autohide .ytp-webgl-spherical-control, .ytp-hide-info-bar .ytp-webgl-spherical-control {
top: 12px;
-moz-transition: top 0.1s cubic-bezier(0.4, 0, 1, 1), opacity 0.1s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: top 0.1s cubic-bezier(0.4, 0, 1, 1), opacity 0.1s cubic-bezier(0.4, 0, 1, 1);
transition: top 0.1s cubic-bezier(0.4, 0, 1, 1), opacity 0.1s cubic-bezier(0.4, 0, 1, 1)
}
.ytp-webgl-spherical:not(.ytp-menu-shown) .html5-video-container {
cursor: move;
cursor: -webkit-grab;
cursor: grab
}
.ytp-webgl-spherical.ytp-dragging:not(.ytp-menu-shown) .html5-video-container {
cursor: move;
cursor: -webkit-grabbing;
cursor: grabbing
}
.ytp-probably-keyboard-focus .ytp-webgl-spherical-control:focus {
box-shadow: inset 0 0 0 2px rgba(27, 127, 204, 0.8)
}
.ended-mode .ytp-webgl-spherical-control, .ytp-menu-shown .ytp-webgl-spherical-control {
opacity: 0;
-moz-transition: top 0.1s cubic-bezier(0.4, 0, 1, 1), opacity 0.1s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: top 0.1s cubic-bezier(0.4, 0, 1, 1), opacity 0.1s cubic-bezier(0.4, 0, 1, 1);
transition: top 0.1s cubic-bezier(0.4, 0, 1, 1), opacity 0.1s cubic-bezier(0.4, 0, 1, 1)
}
.ytp-spinner {
position: absolute;
left: 50%;
top: 50%;
width: 10%;
margin-left: -5%;
z-index: 18;
pointer-events: none
}
.ytp-spinner-message {
position: absolute;
left: 50%;
margin-top: 50%;
width: 300px;
font-size: 127%;
line-height: 182%;
margin-left: -150px;
display: none;
text-align: center;
background-color: black;
opacity: 0.5
}
@keyframes ytp-spinner-dot-fade {
0% {
background-color: rgba(204, 204, 204, .5)
} 50% {
background-color: rgba(204, 204, 204, .15)
} to {
background-color: rgba(204, 204, 204, .15)
}
}
@-moz-keyframes ytp-spinner-dot-fade {
0% {
background-color: rgba(204, 204, 204, .5)
} 50% {
background-color: rgba(204, 204, 204, .15)
} to {
background-color: rgba(204, 204, 204, .15)
}
}
@-webkit-keyframes ytp-spinner-dot-fade {
0% {
background-color: rgba(204, 204, 204, .5)
} 50% {
background-color: rgba(204, 204, 204, .15)
} to {
background-color: rgba(204, 204, 204, .15)
}
}
.ytp-spinner-dots {
pointer-events: none;
position: absolute;
width: 19%;
padding-bottom: 19%;
top: 50%;
left: 50%;
margin-top: -9.5%;
margin-left: -9.5%
}
.ytp-spinner-dot {
position: absolute;
width: 100%;
padding-bottom: 100%;
border-radius: 100%;
background-color: rgba(204, 204, 204, 0);
-moz-animation: ytp-spinner-dot-fade 0.8s cubic-bezier(0.4, 0, 0.2, 1) infinite;
-webkit-animation: ytp-spinner-dot-fade 0.8s cubic-bezier(0.4, 0, 0.2, 1) infinite;
animation: ytp-spinner-dot-fade 0.8s cubic-bezier(0.4, 0, 0.2, 1) infinite
}
.ytp-spinner-dot-0 {
top: -143.5%;
left: 0
}
.ytp-spinner-dot-1 {
top: -101.5%;
left: 101.5%;
-moz-animation-delay: 0.1s;
-webkit-animation-delay: 0.1s;
animation-delay: 0.1s
}
.ytp-spinner-dot-2 {
top: 0;
left: 143.5%;
-moz-animation-delay: 0.2s;
-webkit-animation-delay: 0.2s;
animation-delay: 0.2s
}
.ytp-spinner-dot-3 {
top: 101.5%;
left: 101.5%;
-moz-animation-delay: 0.3s;
-webkit-animation-delay: 0.3s;
animation-delay: 0.3s
}
.ytp-spinner-dot-4 {
top: 143.5%;
left: 0;
-moz-animation-delay: 0.4s;
-webkit-animation-delay: 0.4s;
animation-delay: 0.4s
}
.ytp-spinner-dot-5 {
top: 101.5%;
left: -101.5%;
-moz-animation-delay: 0.5s;
-webkit-animation-delay: 0.5s;
animation-delay: 0.5s
}
.ytp-spinner-dot-6 {
top: 0;
left: -143.5%;
-moz-animation-delay: 0.6s;
-webkit-animation-delay: 0.6s;
animation-delay: 0.6s
}
.ytp-spinner-dot-7 {
top: -101.5%;
left: -101.5%;
-moz-animation-delay: 0.7s;
-webkit-animation-delay: 0.7s;
animation-delay: 0.7s
}
.ytp-normal-css-loaded {
display: none
}
.ytp-storyboard {
position: absolute;
left: 0;
bottom: 51px;
z-index: 59;
-moz-transition: opacity 0.1s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition: opacity 0.1s cubic-bezier(0, 0, 0.2, 1);
transition: opacity 0.1s cubic-bezier(0, 0, 0.2, 1);
pointer-events: none
}
.ytp-big-mode .ytp-storyboard {
bottom: 72px
}
.ytp-storyboard[aria-hidden=true] {
opacity: 0
}
.ytp-storyboard-lens {
position: absolute;
overflow: hidden;
padding: 2px;
background-color: rgba(22, 22, 22, 0.8);
border-radius: 4px;
bottom: -2px
}
.ytp-storyboard-lens-timestamp-wrapper {
position: absolute;
width: 100%;
line-height: 12px;
text-align: center;
bottom: 2px;
margin-left: -2px
}
.ytp-storyboard-lens-timestamp {
display: inline-block;
height: 12px;
background-color: rgba(28, 28, 28, 0.9);
border-radius: 2px 2px 0 0;
padding: 5px 9px
}
.ytp-storyboard-thumbnail {
display: block;
position: absolute;
bottom: 0;
left: 0;
will-change: transform
}
.ytp-storyboard-framepreview {
position: absolute;
top: 0;
left: 0;
z-index: 16;
background: #000;
-moz-transition: opacity 0.1s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition: opacity 0.1s cubic-bezier(0, 0, 0.2, 1);
transition: opacity 0.1s cubic-bezier(0, 0, 0.2, 1)
}
.ytp-storyboard-framepreview[aria-hidden=true] {
opacity: 0;
-moz-transition: opacity 0.1s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: opacity 0.1s cubic-bezier(0.4, 0, 1, 1);
transition: opacity 0.1s cubic-bezier(0.4, 0, 1, 1)
}
.ytp-storyboard-framepreview-img {
opacity: 0.4
}
.caption-window {
position: absolute;
line-height: normal;
z-index: 37;
cursor: move;
cursor: -webkit-grab;
cursor: grab;
-moz-user-select: none;
-ms-user-select: none;
-webkit-user-select: none
}
.caption-window.ytp-caption-window-top {
margin-top: 48px;
-moz-transition: margin-bottom 0.25s cubic-bezier(0, 0, 0.2, 1), margin-top 0.25s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition: margin-bottom 0.25s cubic-bezier(0, 0, 0.2, 1), margin-top 0.25s cubic-bezier(0, 0, 0.2, 1);
transition: margin-bottom 0.25s cubic-bezier(0, 0, 0.2, 1), margin-top 0.25s cubic-bezier(0, 0, 0.2, 1)
}
.ytp-big-mode .caption-window.ytp-caption-window-top {
margin-top: 69px
}
.ytp-autohide .caption-window.ytp-caption-window-top, .ytp-hide-info-bar .caption-window.ytp-caption-window-top {
margin-top: 0;
-moz-transition: margin-bottom 0.1s cubic-bezier(0.4, 0, 1, 1), margin-top 0.1s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: margin-bottom 0.1s cubic-bezier(0.4, 0, 1, 1), margin-top 0.1s cubic-bezier(0.4, 0, 1, 1);
transition: margin-bottom 0.1s cubic-bezier(0.4, 0, 1, 1), margin-top 0.1s cubic-bezier(0.4, 0, 1, 1)
}
.caption-window.ytp-caption-window-bottom {
margin-bottom: 49px;
-moz-transition: margin-bottom 0.25s cubic-bezier(0, 0, 0.2, 1), margin-top 0.25s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition: margin-bottom 0.25s cubic-bezier(0, 0, 0.2, 1), margin-top 0.25s cubic-bezier(0, 0, 0.2, 1);
transition: margin-bottom 0.25s cubic-bezier(0, 0, 0.2, 1), margin-top 0.25s cubic-bezier(0, 0, 0.2, 1)
}
.ytp-big-mode .caption-window.ytp-caption-window-bottom {
margin-bottom: 70px
}
.ytp-autohide .caption-window.ytp-caption-window-bottom, .ytp-hide-controls .caption-window.ytp-caption-window-bottom {
margin-bottom: 0;
-moz-transition: margin-bottom 0.1s cubic-bezier(0.4, 0, 1, 1), margin-top 0.1s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: margin-bottom 0.1s cubic-bezier(0.4, 0, 1, 1), margin-top 0.1s cubic-bezier(0.4, 0, 1, 1);
transition: margin-bottom 0.1s cubic-bezier(0.4, 0, 1, 1), margin-top 0.1s cubic-bezier(0.4, 0, 1, 1)
}
.ytp-ad-overlay-open .caption-window.ytp-caption-window-bottom {
margin-bottom: 139px
}
.ytp-big-mode.ytp-ad-overlay-open .caption-window.ytp-caption-window-bottom {
margin-bottom: 160px
}
.html5-video-player .caption-window.ytp-dragging, .html5-video-player.ytp-ad-overlay-open .caption-window.ytp-dragging {
margin-top: 0;
margin-bottom: 0;
-moz-transition: none;
-webkit-transition: none;
transition: none;
cursor: move;
cursor: -webkit-grabbing;
cursor: grabbing
}
.ytp-caption-window-rollup.ytp-rollup-mode {
overflow: hidden
}
.caption-window svg, .caption-window .ytp-icon {
width: 36px;
height: 36px;
vertical-align: bottom;
display: inline-block;
max-width: 1em;
max-height: 1em
}
.ytp-big-mode .caption-window svg, .ytp-big-mode .caption-window .ytp-icon {
width: 54px;
height: 54px
}
.ytp-caption-window-rollup .captions-text {
display: block
}
.ytp-caption-window-rollup.ytp-rollup-mode .captions-text {
-moz-transition: -moz-transform 0.433s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition: -webkit-transform 0.433s cubic-bezier(0, 0, 0.2, 1);
-ms-transition: -ms-transform 0.433s cubic-bezier(0, 0, 0.2, 1);
transition: transform 0.433s cubic-bezier(0, 0, 0.2, 1)
}
.html5-video-player .captions-text {
word-wrap: normal
}
.ytp-time-display {
font-size: 109%;
display: inline-block;
vertical-align: top;
padding: 0 5px;
white-space: nowrap;
line-height: 35px
}
.ytp-big-mode .ytp-time-display {
line-height: 53px
}
.ytp-volume-slider-active .ytp-time-display-allow-autohide {
display: none
}
.ytp-time-separator, .ytp-time-duration {
color: #ddd
}
.ytp-live .ytp-time-current, .ytp-live .ytp-time-separator, .ytp-live .ytp-time-duration {
display: none
}
.ytp-chrome-controls .ytp-live-badge, .ytp-big-mode .ytp-chrome-controls .ytp-live-badge {
display: none;
width: auto;
text-transform: uppercase
}
.ytp-chrome-controls .ytp-live .ytp-live-badge, .ytp-big-mode .ytp-chrome-controls .ytp-live .ytp-live-badge {
display: inline-block
}
.ytp-live-badge:before {
display: inline-block;
width: 6px;
height: 6px;
vertical-align: 4%;
margin-right: 5px;
background: #757575;
content: "";
border-radius: 6px
}
.ytp-big-mode .ytp-live-badge:before {
width: 9px;
height: 9px;
border-radius: 9px
}
.html5-video-player .ytp-live-badge[aria-disabled=true], .html5-video-player .ytp-live-badge[disabled] {
opacity: 1
}
.ytp-live-badge[disabled]:before {
background: #f12b24
}
.ytp-title {
overflow: hidden;
flex: 1
}
.ytp-title-extra-info .ytp-title {
min-height: 52px
}
.ytp-big-mode.ytp-title-extra-info .ytp-title {
min-height: 75px
}
.ytp-title-channel-logo {
width: 40px;
height: 40px;
background-size: contain;
background-repeat: no-repeat;
background-origin: content-box;
float: left
}
.ytp-big-mode .ytp-title-channel-logo {
width: 60px;
height: 60px
}
.ytp-title-text {
vertical-align: top;
padding-top: 12px;
font-size: 18px
}
.ytp-big-mode .ytp-title-text {
padding-top: 18px;
font-size: 27px
}
.ytp-title-subtext {
font-size: 13px
}
.ytp-big-mode .ytp-title-subtext {
font-size: 20px
}
.ytp-title-text {
max-width: 100%;
padding-left: 4px;
overflow: hidden;
white-space: nowrap;
word-wrap: normal;
-o-text-overflow: ellipsis;
text-overflow: ellipsis
}
.ytp-big-mode .ytp-title-text {
padding-left: 6px
}
.ytp-title-extra-info .ytp-title-text {
padding-left: 50px
}
.ytp-big-mode.ytp-title-extra-info .ytp-title-text {
padding-left: 75px
}
.ytp-title-channel-name {
display: none;
overflow: hidden;
white-space: nowrap;
word-wrap: normal;
-o-text-overflow: ellipsis;
text-overflow: ellipsis
}
.ytp-title-view-count {
overflow: hidden;
white-space: nowrap;
word-wrap: normal;
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
display: none
}
.ytp-show-title-view-count .ytp-title-view-count {
display: block
}
.ytp-title-extra-info .ytp-title-channel-name, .ytp-show-title-view-count.ytp-title-extra-info .ytp-title-view-count {
display: inline-block
}
@keyframes ytp-title-channel-fade {
0% {
width: 50px
} 75% {
width: 500px
}
}
@keyframes ytp-title-channel-popup-fade {
0% {
opacity: 0
} 25% {
opacity: 0
} to {
opacity: 1
}
}
.ytp-title-channel {
background: transparent;
border-radius: 25px;
height: 50px;
margin-left: -5px;
overflow: hidden;
position: absolute;
top: 7px;
width: 50px;
display: none
}
.ytp-big-mode .ytp-title-channel {
width: 70px;
height: 70px;
margin-top: 10px
}
.ytp-title-extra-info .ytp-title-channel {
display: flex
}
.ytp-title-channel-expanded .ytp-title-channel {
background-color: rgba(0, 0, 0, 0.6);
border-radius: 25px 4px 4px 25px;
width: 500px;
z-index: 1;
-moz-animation: ytp-title-channel-fade 1s cubic-bezier(0.4, 0, 0.2, 1);
-webkit-animation: ytp-title-channel-fade 1s cubic-bezier(0.4, 0, 0.2, 1);
animation: ytp-title-channel-fade 1s cubic-bezier(0.4, 0, 0.2, 1)
}
.ytp-big-mode.ytp-title-channel-expanded .ytp-title-channel {
border-radius: 35px 4px 4px 35px
}
.ytp-new-infobar .ytp-title-channel-logo {
position: absolute
}
.ytp-title-channel-logo {
border-radius: 50%;
flex-shrink: 0;
margin: 5px
}
.ytp-title-channel-popup {
display: none
}
.ytp-title-channel-expanded .ytp-title-channel-popup {
display: flex;
flex-shrink: 0;
opacity: 1;
width: 450px;
-moz-animation: ytp-title-channel-popup-fade 1s cubic-bezier(0.4, 0, 0.2, 1);
-webkit-animation: ytp-title-channel-popup-fade 1s cubic-bezier(0.4, 0, 0.2, 1);
animation: ytp-title-channel-popup-fade 1s cubic-bezier(0.4, 0, 0.2, 1)
}
.ytp-big-mode.ytp-title-channel-expanded .ytp-title-channel-popup {
width: 430px
}
.ytp-title-channel-heading {
margin: 5px;
flex: 1;
white-space: nowrap;
overflow: hidden;
align-self: center
}
.ytp-title-channel-text {
font-size: 16px;
font-weight: normal;
margin: 0
}
.ytp-big-mode .ytp-title-channel-text {
font-size: 22px
}
.ytp-title-channel-subtext {
font-size: 12px;
font-weight: normal;
margin: 0
}
.ytp-big-mode .ytp-title-channel-subtext {
font-size: 16px
}
.ytp-chrome-top .ytp-title-channel .ytp-sb {
align-self: center;
margin: 5px;
height: auto;
width: auto;
padding: 0
}
.ytp-title-channel-expanded .ytp-title-beacon, .ytp-title-channel-expanded .ytp-title-text, .ytp-title-channel-expanded .ytp-title-subtext {
display: none
}
@keyframes ytp-title-beacon-pulse {
0% {
background: black;
width: 40px;
height: 40px;
left: 5px;
top: 5px
} to {
background: transparent;
width: 50px;
height: 50px;
left: 0;
top: 0
}
}
.ytp-title-beacon {
border-radius: 25px;
display: none;
position: absolute;
z-index: -1;
-moz-animation: ytp-title-beacon-pulse 1s 5;
-webkit-animation: ytp-title-beacon-pulse 1s 5;
animation: ytp-title-beacon-pulse 1s 5
}
.unstarted-mode .ytp-title-beacon {
display: block
}
.ytp-big-mode .ytp-title-beacon {
display: none
}
.ytp-tooltip {
position: absolute;
z-index: 1002;
font-size: 118%;
font-weight: 500;
line-height: 15px;
opacity: 0;
-moz-transition: -moz-transform 0.1s cubic-bezier(0, 0, 0.2, 1), opacity 0.1s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition: -webkit-transform 0.1s cubic-bezier(0, 0, 0.2, 1), opacity 0.1s cubic-bezier(0, 0, 0.2, 1);
-ms-transition: -ms-transform 0.1s cubic-bezier(0, 0, 0.2, 1), opacity 0.1s cubic-bezier(0, 0, 0.2, 1);
transition: transform 0.1s cubic-bezier(0, 0, 0.2, 1), opacity 0.1s cubic-bezier(0, 0, 0.2, 1);
pointer-events: none
}
.ytp-big-mode .ytp-tooltip {
line-height: 22px
}
.ytp-tooltip.ytp-top {
-moz-transform: translatey(-2px);
-ms-transform: translatey(-2px);
-webkit-transform: translatey(-2px);
transform: translatey(-2px)
}
.ytp-tooltip.ytp-bottom {
-moz-transform: translatey(2px);
-ms-transform: translatey(2px);
-webkit-transform: translatey(2px);
transform: translatey(2px)
}
.ytp-tooltip:not([aria-hidden=true]) {
opacity: 1;
-moz-transform: none;
-ms-transform: none;
-webkit-transform: none;
transform: none;
-moz-transition: -moz-transform 0.1s cubic-bezier(0.4, 0, 1, 1), opacity 0.1s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: -webkit-transform 0.1s cubic-bezier(0.4, 0, 1, 1), opacity 0.1s cubic-bezier(0.4, 0, 1, 1);
-ms-transition: -ms-transform 0.1s cubic-bezier(0.4, 0, 1, 1), opacity 0.1s cubic-bezier(0.4, 0, 1, 1);
transition: transform 0.1s cubic-bezier(0.4, 0, 1, 1), opacity 0.1s cubic-bezier(0.4, 0, 1, 1)
}
.ytp-tooltip.ytp-preview {
padding: 2px;
background-color: rgba(28, 28, 28, 0.9);
border-radius: 2px
}
.ytp-tooltip.ytp-text-detail.ytp-preview {
width: 312px
}
.ytp-big-mode .ytp-tooltip.ytp-text-detail.ytp-preview {
width: 457px
}
.ytp-tooltip-text-wrapper {
border-radius: 3px
}
.ytp-tooltip.ytp-preview:not(.ytp-text-detail) .ytp-tooltip-text-wrapper {
position: absolute;
bottom: 5px;
left: 0;
width: 100%;
text-align: center
}
.ytp-tooltip.ytp-text-detail.ytp-preview .ytp-tooltip-text-wrapper {
padding: 0 9px;
margin: 4px 0;
overflow: hidden;
max-height: 46px
}
.ytp-big-mode .ytp-tooltip.ytp-text-detail.ytp-preview .ytp-tooltip-text-wrapper {
margin: 6px 0;
max-height: 69px
}
.ytp-tooltip-text {
display: block;
background-color: rgba(28, 28, 28, 0.9);
border-radius: 2px;
padding: 5px 9px
}
.ytp-tooltip.ytp-preview .ytp-tooltip-text {
display: inline;
border-bottom-left-radius: 0;
border-bottom-right-radius: 0
}
.ytp-tooltip-image-enabled .ytp-tooltip-text {
padding-left: 34px
}
.ytp-big-mode .ytp-tooltip-image-enabled .ytp-tooltip-text {
padding-left: 45px
}
.ytp-tooltip.ytp-text-detail.ytp-preview .ytp-tooltip-text {
background-color: transparent;
padding: 0
}
.ytp-tooltip-bg {
background-color: #000;
background-repeat: no-repeat;
position: relative;
display: none
}
.ytp-tooltip.ytp-preview .ytp-tooltip-bg {
display: block
}
.ytp-tooltip.ytp-text-detail.ytp-preview .ytp-tooltip-bg {
float: left
}
.ytp-tooltip-duration {
display: none
}
.ytp-tooltip.ytp-text-detail.ytp-preview.ytp-has-duration .ytp-tooltip-duration {
display: block;
position: absolute;
right: 3px;
bottom: 3px;
background-color: rgba(28, 28, 28, 0.9);
padding: 2px 4px
}
.ytp-tooltip-title {
display: none
}
.ytp-tooltip.ytp-text-detail .ytp-tooltip-title {
display: block;
color: #aaa;
text-transform: uppercase
}
.ytp-tooltip-image {
width: 20px;
height: 20px;
border: 0;
border-radius: 10px;
position: absolute;
display: none;
top: 2px;
left: 7px;
background-size: contain
}
.ytp-big-mode .ytp-tooltip-image {
width: 25px;
height: 25px;
border-radius: 12.5px;
top: 3px;
left: 10px
}
.ytp-tooltip-image-enabled .ytp-tooltip-image {
display: inherit
}
.ytp-unmute.ytp-popup {
position: absolute;
top: 36px;
left: 0;
z-index: 1001;
text-transform: uppercase;
color: #fff;
font-size: 127%;
background: none;
padding: 12px
}
.ytp-big-mode .ytp-unmute.ytp-popup {
top: 30px;
padding: 18px
}
.ytp-autohide .ytp-unmute, .ytp-hide-info-bar .ytp-unmute {
top: 0
}
.ytp-unmute-inner {
padding-left: 3px;
padding-right: 12px;
background-color: rgba(0, 0, 0, 0.6);
border-radius: 2px
}
.ytp-big-mode .ytp-unmute-inner {
padding-left: 5px;
padding-right: 18px
}
.ytp-unmute-icon {
width: 36px;
height: 36px;
display: inline-block;
vertical-align: middle
}
.ytp-unmute-text {
vertical-align: middle;
display: inline-block
}
.ytp-big-mode .ytp-unmute-icon {
width: 54px;
height: 54px
}
.ytp-unmute.ytp-popup.ytp-unmute-slide .ytp-unmute-inner {
position: relative;
color: #000;
font-weight: 500;
text-shadow: none;
background-color: transparent;
padding: 0
}
.ytp-unmute-slide .ytp-unmute-icon {
padding-left: 2px;
position: relative;
z-index: 10;
background-color: rgba(255, 255, 255, 1);
border-radius: 2px
}
.ytp-unmute-slide .ytp-unmute-box {
display: block;
background-color: rgba(255, 255, 255, 1);
position: absolute;
left: 0;
top: 0;
width: 0;
height: 100%;
border-radius: 2px;
border-bottom: 1px solid #f1f1f1;
-moz-animation: ytp-unmute-slide-anim 0.5s cubic-bezier(0, 0, 0.2, 1) 3.5s forwards;
-webkit-animation: ytp-unmute-slide-anim 0.5s cubic-bezier(0, 0, 0.2, 1) 3.5s forwards;
animation: ytp-unmute-slide-anim 0.5s cubic-bezier(0, 0, 0.2, 1) 3.5s forwards
}
.ytp-unmute-slide .ytp-unmute-text {
position: relative;
z-index: 10;
opacity: 0;
padding-top: 1px;
padding-right: 10px;
-moz-animation: ytp-unmute-alpha-anim 0.25s cubic-bezier(0, 0, 0.2, 1) 3.75s forwards;
-webkit-animation: ytp-unmute-alpha-anim 0.25s cubic-bezier(0, 0, 0.2, 1) 3.75s forwards;
animation: ytp-unmute-alpha-anim 0.25s cubic-bezier(0, 0, 0.2, 1) 3.75s forwards
}
@keyframes ytp-unmute-slide-anim {
0% {
width: 0
} to {
width: 100%
}
}
@keyframes ytp-unmute-alpha-anim {
0% {
opacity: 0
} to {
opacity: 1
}
}
.html5-video-info-panel {
background: rgba(28, 28, 28, 0.8);
border-radius: 4px;
color: #fff;
left: 10px;
position: absolute;
top: 10px;
z-index: 64
}
.html5-video-info-panel-close {
cursor: pointer;
position: absolute;
right: 5px;
top: 5px
}
.html5-video-info-panel-content {
padding: 5px
}
.html5-video-info-panel-content > div > div {
display: inline-block;
font-weight: 500;
padding: 0 0.5em;
text-align: right;
width: 10em
}
.ytp-sparkline {
display: inline-block;
width: 200px;
height: 1em;
margin: 2px;
border-bottom: 1px solid #fff;
border-right: 1px solid #fff;
vertical-align: bottom
}
.ytp-sparkline > span {
display: inline-block;
background-color: #aaa
}
.ytp-video-menu-item {
display: block;
height: 44px;
padding: 10px
}
.ytp-big-mode .ytp-video-menu-item {
height: 66px;
padding: 15px
}
.ytp-video-menu-item[aria-checked=true] {
background-color: rgba(255, 255, 255, 0.1)
}
.ytp-video-menu-item:hover, .ytp-video-menu-item[aria-checked=true]:hover {
background-color: rgba(255, 255, 255, 0.15)
}
.ytp-video-menu-item-now-playing, .ytp-video-menu-item-index {
padding-right: 9px;
min-width: 10px;
height: 44px;
line-height: 44px;
float: left
}
.ytp-big-mode .ytp-video-menu-item-now-playing, .ytp-big-mode .ytp-video-menu-item-index {
padding-right: 13px;
height: 66px;
line-height: 66px
}
.ytp-video-menu-item-now-playing {
display: none;
color: #f12b24
}
.ytp-color-white .ytp-video-menu-item-now-playing {
color: #ddd
}
.ytp-color-party .ytp-video-menu-item-now-playing {
-moz-animation: ytp-party-color 0.15s linear infinite;
-webkit-animation: ytp-party-color 0.15s linear infinite;
animation: ytp-party-color 0.15s linear infinite
}
.ytp-video-menu-item[aria-checked=true] .ytp-video-menu-item-now-playing {
display: inline
}
.ytp-video-menu-item[aria-checked=true] .ytp-video-menu-item-index {
display: none
}
.ytp-video-menu-item-title {
padding-left: 9px;
font-size: 120%;
max-height: 2.6em;
overflow: hidden
}
.ytp-video-menu-item-author {
padding-left: 9px;
color: #b8b8b8;
overflow: hidden;
white-space: nowrap;
word-wrap: normal;
-o-text-overflow: ellipsis;
text-overflow: ellipsis
}
.ytp-video-menu-item-thumbnail {
float: left;
width: 64px;
height: 36px;
margin: 4px;
border: 0 solid #f12b24;
background-position: 0 -6px;
background-size: 64px 48px
}
.ytp-color-white .ytp-video-menu-item-thumbnail {
border-color: #ddd
}
.ytp-color-party .ytp-video-menu-item-thumbnail {
-moz-animation: ytp-party-background-color 0.1s linear infinite;
-webkit-animation: ytp-party-background-color 0.1s linear infinite;
animation: ytp-party-background-color 0.1s linear infinite
}
.ytp-big-mode .ytp-video-menu-item-thumbnail {
width: 96px;
height: 54px;
margin: 6px;
background-position: 0 -9px;
background-size: 96px 72px
}
.ytp-video-menu-item[aria-checked=true] .ytp-video-menu-item-thumbnail {
margin: 2px;
border-width: 2px
}
.ytp-big-mode .ytp-video-menu-item[aria-checked=true] .ytp-video-menu-item-thumbnail {
margin: 4px
}
.ytp-volume-panel {
display: inline-block;
width: 0;
height: 100%;
-moz-transition: margin 0.2s cubic-bezier(0.4, 0, 1, 1), width 0.2s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: margin 0.2s cubic-bezier(0.4, 0, 1, 1), width 0.2s cubic-bezier(0.4, 0, 1, 1);
transition: margin 0.2s cubic-bezier(0.4, 0, 1, 1), width 0.2s cubic-bezier(0.4, 0, 1, 1);
cursor: pointer;
outline: 0
}
.ytp-volume-slider-active .ytp-volume-panel {
width: 52px;
margin-right: 3px;
-moz-transition: margin 0.2s cubic-bezier(0, 0, 0.2, 1), width 0.2s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition: margin 0.2s cubic-bezier(0, 0, 0.2, 1), width 0.2s cubic-bezier(0, 0, 0.2, 1);
transition: margin 0.2s cubic-bezier(0, 0, 0.2, 1), width 0.2s cubic-bezier(0, 0, 0.2, 1)
}
.ytp-big-mode .ytp-volume-slider-active .ytp-volume-panel {
width: 78px;
margin-right: 5px
}
.ytp-probably-keyboard-focus .ytp-volume-panel:focus {
box-shadow: inset 0 0 0 2px rgba(27, 127, 204, 0.8)
}
.ytp-volume-slider {
height: 100%;
position: relative;
overflow: hidden
}
.ytp-volume-slider-handle {
position: absolute;
top: 50%;
width: 12px;
height: 12px;
border-radius: 6px;
margin-top: -6px;
background: #fff
}
.ytp-big-mode .ytp-volume-slider-handle {
width: 18px;
height: 18px;
border-radius: 9px;
margin-top: -9px
}
.ytp-volume-slider-handle:before, .ytp-volume-slider-handle:after {
content: "";
position: absolute;
display: block;
top: 50%;
height: 3px;
margin-top: -2px;
width: 64px
}
.ytp-big-mode .ytp-volume-slider-handle:before, .ytp-big-mode .ytp-volume-slider-handle:after {
height: 4px;
margin-top: -2px;
width: 96px
}
.ytp-volume-slider-handle:before {
left: -58px;
background: #fff
}
.ytp-big-mode .ytp-volume-slider-handle:before {
left: -87px
}
.ytp-volume-slider-handle:after {
left: 6px;
background: rgba(255, 255, 255, 0.2)
}
.ytp-big-mode .ytp-volume-slider-handle:after {
left: 9px;
background: rgba(255, 255, 255, 0.2)
}
.ytp-show-watch-later-title .ytp-watch-later-button {
margin-left: 10px;
margin-right: 10px
}
.ytp-big-mode .ytp-chrome-top .ytp-chrome-top-buttons .ytp-watch-later-button, .ytp-chrome-top .ytp-chrome-top-buttons .ytp-watch-later-button {
width: auto;
height: auto
}
.ytp-watch-later-icon {
margin: auto;
width: 36px;
height: 36px;
position: relative
}
.ytp-big-mode .ytp-watch-later-icon {
width: 54px;
height: 54px
}
.ytp-watch-later-title {
font-weight: 500;
text-align: center
}
.ytp-watermark {
position: absolute;
width: 77px;
height: 34px;
bottom: 49px;
right: 12px;
z-index: 25;
opacity: 0.5
}
.html5-video-player .ytp-watermark {
-moz-transition: bottom 0.25s cubic-bezier(0, 0, 0.2, 1), opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition: bottom 0.25s cubic-bezier(0, 0, 0.2, 1), opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
transition: bottom 0.25s cubic-bezier(0, 0, 0.2, 1), opacity 0.25s cubic-bezier(0, 0, 0.2, 1)
}
.ytp-big-mode .ytp-watermark {
bottom: 70px
}
.ytp-hide-controls .ytp-watermark {
bottom: 12px;
-moz-transition: bottom 0.1s cubic-bezier(0.4, 0, 1, 1), opacity 0.1s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: bottom 0.1s cubic-bezier(0.4, 0, 1, 1), opacity 0.1s cubic-bezier(0.4, 0, 1, 1);
transition: bottom 0.1s cubic-bezier(0.4, 0, 1, 1), opacity 0.1s cubic-bezier(0.4, 0, 1, 1)
}
.ytp-native-controls .ytp-watermark {
bottom: 57px;
left: 12px
}
.ytp-watermark:hover {
opacity: 0.75
}
.ytp-autohide .ytp-watermark {
opacity: 0;
-moz-transition: bottom 0.1s cubic-bezier(0.4, 0, 1, 1), opacity 0.1s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: bottom 0.1s cubic-bezier(0.4, 0, 1, 1), opacity 0.1s cubic-bezier(0.4, 0, 1, 1);
transition: bottom 0.1s cubic-bezier(0.4, 0, 1, 1), opacity 0.1s cubic-bezier(0.4, 0, 1, 1)
}
.webgl {
display: block;
position: absolute;
z-index: 11;
width: 100%
}
.ended-mode .webgl {
display: none
}
.ytp-chrome-controls .ytp-button.ytp-youtube-button {
width: 51px
}
.ytp-big-mode .ytp-chrome-controls .ytp-button.ytp-youtube-button {
width: 77px
}
.ytp-chrome-controls .ytp-button.ytp-youtube-button.ytp-youtube-gaming-button {
width: 98px
}
.ytp-big-mode .ytp-chrome-controls .ytp-button.ytp-youtube-button.ytp-youtube-gaming-button {
width: 147px
}
.ytp-svg-fill-logo-tube-lozenge {
-moz-transition: fill 0.1s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: fill 0.1s cubic-bezier(0.4, 0, 1, 1);
transition: fill 0.1s cubic-bezier(0.4, 0, 1, 1)
}
.ytp-svg-fill-logo-tube-text {
opacity: 0;
-moz-transition: opacity 0.1s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: opacity 0.1s cubic-bezier(0.4, 0, 1, 1);
transition: opacity 0.1s cubic-bezier(0.4, 0, 1, 1)
}
.ytp-chrome-controls .ytp-button.ytp-youtube-button:not([aria-disabled=true]):not([disabled]):hover .ytp-svg-fill-logo-tube-lozenge {
fill: #f12b24;
-moz-transition: fill 0.1s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition: fill 0.1s cubic-bezier(0, 0, 0.2, 1);
transition: fill 0.1s cubic-bezier(0, 0, 0.2, 1)
}
.ytp-dni .ytp-chrome-controls .ytp-button.ytp-youtube-button:not([aria-disabled=true]):not([disabled]):hover .ytp-svg-fill-logo-tube-lozenge {
fill: #fff
}
.ytp-color-party .ytp-chrome-controls .ytp-button.ytp-youtube-button:not([aria-disabled=true]):not([disabled]):hover .ytp-svg-fill-logo-tube-lozenge {
-moz-animation: ytp-party-fill 0.15s linear infinite;
-webkit-animation: ytp-party-fill 0.15s linear infinite;
animation: ytp-party-fill 0.15s linear infinite
}
.ytp-chrome-controls .ytp-button.ytp-youtube-button:not([aria-disabled=true]):not([disabled]):hover .ytp-svg-fill-logo-tube-text {
opacity: 1;
-moz-transition: opacity 0.1s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition: opacity 0.1s cubic-bezier(0, 0, 0.2, 1);
transition: opacity 0.1s cubic-bezier(0, 0, 0.2, 1)
}
.ytp-dni .ytp-chrome-controls .ytp-button.ytp-youtube-button:not([aria-disabled=true]):not([disabled]):hover .ytp-svg-fill-logo-tube-text {
opacity: 0
}
.ytp-drawer {
position: absolute;
top: 0;
right: 0;
bottom: 0;
width: 275px;
text-align: center;
overflow: hidden;
z-index: 66;
-moz-transition: width 0.25s cubic-bezier(0, 0, 0.2, 1), bottom 0.25s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition: width 0.25s cubic-bezier(0, 0, 0.2, 1), bottom 0.25s cubic-bezier(0, 0, 0.2, 1);
transition: width 0.25s cubic-bezier(0, 0, 0.2, 1), bottom 0.25s cubic-bezier(0, 0, 0.2, 1)
}
.ytp-autohide .ytp-drawer {
bottom: -6px;
-moz-transition: width 0.25s cubic-bezier(0.4, 0, 1, 1), bottom 0.25s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: width 0.25s cubic-bezier(0.4, 0, 1, 1), bottom 0.25s cubic-bezier(0.4, 0, 1, 1);
transition: width 0.25s cubic-bezier(0.4, 0, 1, 1), bottom 0.25s cubic-bezier(0.4, 0, 1, 1)
}
.ytp-big-mode .ytp-drawer {
width: 415px
}
.ytp-drawer-closed {
width: 25px
}
.ytp-big-mode .ytp-drawer-closed {
width: 38px
}
.ytp-drawer-content {
position: absolute;
left: 0;
top: 0;
width: 275px;
height: 100%;
padding: 40px 10px 10px;
background: rgba(0, 0, 0, 0.8);
-moz-box-sizing: border-box;
box-sizing: border-box;
-moz-transition: opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
-webkit-transition: opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
transition: opacity 0.25s cubic-bezier(0, 0, 0.2, 1)
}
.ytp-big-mode .ytp-drawer-content {
width: 415px;
padding: 70px 15px 15px
}
.ytp-drawer-closed .ytp-drawer-content {
opacity: 0;
-moz-transition: opacity 0.25s cubic-bezier(0.4, 0, 1, 1);
-webkit-transition: opacity 0.25s cubic-bezier(0.4, 0, 1, 1);
transition: opacity 0.25s cubic-bezier(0.4, 0, 1, 1)
}
.ytp-drawer-close-button {
position: absolute;
right: 0;
top: 0;
width: 24px;
height: 24px;
padding: 5px;
fill: white
}
.ytp-big-mode .ytp-drawer-close-button {
width: 36px;
height: 36px;
padding: 7px
}
.ytp-drawer-closed .ytp-drawer-close-button {
display: none
}
.ytp-drawer-open-button {
display: none;
position: absolute;
top: 50%;
left: 0;
width: 15px;
height: 32px;
margin-top: -16px;
padding: 10px 5px;
background: rgba(0, 0, 0, 0.7)
}
.ytp-big-mode .ytp-drawer-open-button {
width: 23px;
height: 48px;
margin-top: -24px;
padding: 15px 8px
}
.ytp-drawer-closed .ytp-drawer-open-button {
display: block
}
.ytp-drawer-open-button:after {
display: inline-block;
border: 5px solid transparent;
border-right-color: #aaa;
border-left: none;
content: ""
}
.ytp-big-mode .ytp-drawer-open-button:after {
border-bottom-width: 8px;
border-right-width: 8px;
border-top-width: 8px
}
.html5-ypc-module {
line-height: 1.2;
text-align: left
}
.html5-ypc-action-heading {
margin-bottom: 5px;
font-size: 135%;
color: #999
}
.ytp-small-mode .html5-ypc-action-heading {
display: none
}
.html5-ypc-title {
font-size: 145%
}
.ytp-small-mode .html5-ypc-thumbnail {
float: left
}
.html5-ypc-thumbnail img {
float: left;
max-width: 50px;
max-height: 100px;
margin: 0 10px 12px 0
}
.ytp-small-mode .html5-ypc-thumbnail img {
max-height: 20px
}
.ytp-big-mode .html5-ypc-thumbnail img {
max-width: 75px;
max-height: 150px;
margin: 0 15px 18px 0
}
.html5-ypc-description {
clear: both;
margin-top: 25px;
line-height: 1.4
}
.ytp-small-mode .html5-ypc-description {
margin-top: 10px
}
.ytp-big-mode .html5-ypc-description {
margin-top: 38px
}
.html5-ypc-purchase {
margin: 12px 0;
padding: 10px 13px;
text-shadow: 0 0 2px rgba(0, 0, 0, 0.5);
border: 1px solid #36649c;
border-radius: 2px;
background: #167ac6
}
.ytp-big-mode .html5-ypc-purchase {
margin: 18px 0;
padding: 15px 20px;
border-radius: 3px
}
.html5-ypc-purchase:hover {
background: #126db3
}
.html5-ypc-overlay {
position: absolute;
bottom: 0;
padding: 5px;
margin-left: 12px;
overflow: hidden;
z-index: 67;
pointer-events: none;
text-shadow: 0 0 2px rgba(0, 0, 0, 0.5)
}
.ytp-big-mode .html5-ypc-overlay {
padding: 8px;
margin-left: 24px
}
.html5-ypc-endscreen {
display: none;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
padding: 51px 21px 21px;
background: #000;
z-index: 32
}
.ytp-small-mode .html5-ypc-endscreen {
padding-top: 0
}
.ytp-ypc-clickwrap-overlay {
padding: 25px 20px 0;
z-index: 68
}
.ytp-ypc-clickwrap-header {
border-bottom: 1px solid #888;
padding: 0 0 15px 5px;
font-size: 182%;
font-weight: normal
}
.ytp-ypc-clickwrap-description {
margin: 15px 0 0 5px;
font-size: 127%
}
.ytp-ypc-clickwrap-confirm {
margin: 20px 0 0 5px;
padding: 7px 10px;
background-color: #37d;
border-radius: 2px
}
.ytp-ypc-clickwrap-confirm:hover {
background-color: #26c
}
.close-padding {
color: #fff;
cursor: pointer;
margin: 0;
padding-bottom: 10px;
padding-left: 10px;
position: absolute;
right: 0;
top: 0;
z-index: 1001
}
.extra-padding .close-padding {
padding-left: 20px
}
.extra-padding.wide-overlay-ad .close-padding {
padding-left: 25px
}
.close-button {
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAPCAQAAACR313BAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAAAmJLR0QA/4ePzL8AAAAJcEhZcwAACxMAAAsTAQCanBgAAAC3SURBVBjTddAxbsJAEADAuZOVKn0kWkeIJh+IXOQJlt+Sp/COyE+gQBFPoHBaZFDkiuqKQMHhBAVvtXuju93b8KI+vboXn9oQlqfSVHwpSizu4lYpXotO9y+juB6twfOfbOToANb6fPNg7iIoNLm84FyTn42QDBqz3G+mMUi/TLKxy7yzyThyZwUewWqcPXMPFt7zDvrbj1WIat9qH35Ut0zlwSBJ3sbOFHtPthM734ttOE7gURvO57AyavXUXEcAAAAASUVORK5CYII=");
float: right;
height: 15px;
margin: 5px 4px 0 0;
width: 15px
}
.close-button:focus {
outline-width: 0
}
.yt-text-overlay .close-button {
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAQAAAAnOwc2AAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JQAAgIMAAPn/AACA6QAAdTAAAOpgAAA6mAAAF2+SX8VGAAAAAmJLR0QA/4ePzL8AAADdSURBVAjXAdIALf8A27rb69t02wQAANsF23jb7Nu1AAAB2/UACvr9wqMgcyRgAIQACfb7L44DbgH7QAYDFCr7QQ5RAQ77/aLixgABAACbpzFSDwYAAAAA8fml44/dAKAAAAAAAMDP2//b/9v/pOsArQBVAAACAADbcRsXAAAAAAAAJQ1/CwCrAAAD23YAgwAR9fnQ8BAFDwYoIDQhsbEB2/QAC/v9nOCj2XUJTT8EAvb7L1sCAM33/KLhlN3robNUya74/Nr0AF0BAAAAkQAjAKcAqQD8AAQAWgBXANbCiVTrFOn0bgAAAABJRU5ErkJggg==");
height: 10px;
margin: 9px 9px 0 0;
width: 10px
}
.close-padding:hover .close-button {
background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAPCAQAAACR313BAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAAAmJLR0QA/4ePzL8AAAAJcEhZcwAACxMAAAsTAQCanBgAAACzSURBVBjTddAtzsJAEADQt1CN/xRBIIFwge8AeAzpabgIHiQCT3qD4hCEQIIkBNtQzLY0gY7YzOzb3wlT8/Lfr9jbhLAqh9riKGQlg594QqcqcvlXRlJN7cCokdUcXMHOxQFcjakO70rj6kPcmep+uPCQ6sf7+lIPxYcpZM6Rz7KINee2oAe29dsjX8DE0qRR1x+bIVi4W3gpzSI3upagiGPVteTmz6ml5zeddXi24NM6vAFhCzSMfomhxwAAAABJRU5ErkJggg==")
}
.yt-text-overlay .close-padding:hover .close-button {
background-color: rgba(0, 0, 0, 0.15);
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAQAAAAnOwc2AAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JQAAgIMAAPn/AACA6QAAdTAAAOpgAAA6mAAAF2+SX8VGAAAAAmJLR0QA/4ePzL8AAAC6SURBVAjXJci9SsNQAIDRT6i4d3Lvw/gEVfEtFBHBVaGDi+CsOBUpgpQWYgd/Fh2ddLEFJwejEdoa7k1SP4ec8eDI1F0b4LL7fjkE/NVQXZ+/NN0x11lBBw/iQn/i+PHvW2PVmdAHBt0sqmoWDt9I2ATg/bnOu5Qr2gC47Uedn+E0qWvPXKfhPp0WGsrkDHCusToarw4vbouFzgra+DAvjycrN6yvNUe9vHzK6C8BJ7TocklFgy02eP0Hcq6CI3X8aBcAAAAASUVORK5CYII=");
background-position: center center;
background-repeat: no-repeat;
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
box-shadow: inset 0 -1px 3px rgba(0, 0, 0, 0.3), 0 1px 0 rgba(255, 255, 255, 0.5);
height: 20px;
margin: 4px 4px 0 0;
width: 20px
}
.recall-button {
background: rgba(200, 200, 200, 0.2) url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAICAMAAAD3JJ6EAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAA5FBMVEWlh1//4V9iABzh6//T1/82GAAzKABGKABGKAD/4bn1///3+v/z9//m7//L3P8AAw1GGABUNgD/+v/5/f/h6/8ACyEACx++1//d7P8tc/87KAD+/f/2+v8ATL0DAAAABhcAA18WAAIwh//Z6P8ADSIACzYDAAcEAALP5P/5+//v9v+avP8cCAAUCgASCgD/4eb19//8/P/y9v8ASacAMWzZ6f/U5v8PACM0AAX/+fv6+//K2f8ABg8AAAUFAAkAAxW20//f7f8AD1DV1/8APKoCAAcLAAhLAAUSAAkAFDsHBAD///8jMQ5iAAAAS3RSTlMAAwQaFhANEBMDBkVwaTYPEBMoc1ExOEZbDRg2cRZAJAgeGGEdBiYxHnNuGBgzOwYQXm4ZJ2NGEQsrdDg5MxUfPWQREBE3GgYVJDh1ZWACAAAAAWJLR0RLaQuFUAAAAGBJREFUCNdjYGRgYGJmYWVj52DgZOTi5uHl4xcQZOAUEhYRFROXkJRikJaRlZNXUFRSVmFQVVPX0NTS1tHVY9A3MDQyNjE1M7dgsLSytrG1s3dwdGJwdnF1Y+B09/D0AgBBxArrcQfhygAAAABJRU5ErkJggg==") no-repeat center;
border: 1px solid rgba(255, 255, 255, 0.498039);
box-shadow: rgba(0, 0, 0, 0.701961) 0 4px 3px;
color: #fff;
cursor: pointer;
height: 11px;
width: 26px;
z-index: 1001
}
.yt-text-overlay .recall-button {
background: rgba(0, 0, 0, 0.15) url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAGCAQAAAC7znxOAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JQAAgIMAAPn/AACA6QAAdTAAAOpgAAA6mAAAF2+SX8VGAAAAAmJLR0QA/4ePzL8AAAAJcEhZcwAACxMAAAsTAQCanBgAAAAsSURBVAjXY/jPAIG/0mAsuMCv/zBBhMB/mCCyAFQQVeD/r/+/0hh//WdAAwBqlUHXRz8MQAAAAABJRU5ErkJggg==") no-repeat center;
border: 1px solid rgba(0, 0, 0, 0);
box-shadow: none;
height: 17px;
width: 29px
}
.autoalign .recall-button {
margin: auto
}
.yt-text-overlay.autoalign .recall-button {
margin: auto auto 6px
}
.recall-button:hover {
background: #fff url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAHCAAAAAAUx4O/AAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAAAmJLR0QA/4ePzL8AAAAJcEhZcwAACxMAAAsTAQCanBgAAABLSURBVAjXFYtZEcBACENxgIRKQAISVgoSkLASKgUJSEACEtI0PznmRQCM+9AESI3Qy9hmBdTjK8Weib1LoIxqAhua3CUh7/nf6DMfPd0v3Khdg6cAAAAASUVORK5CYII=") no-repeat center
}
.yt-text-overlay .recall-button:hover {
background: rgba(0, 0, 0, 0.15) url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAGCAQAAAC7znxOAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JQAAgIMAAPn/AACA6QAAdTAAAOpgAAA6mAAAF2+SX8VGAAAAAmJLR0QA/4ePzL8AAAAJcEhZcwAACxMAAAsTAQCanBgAAAAsSURBVAjXY/jPAIG/0mAsuMCv/zBBhMB/mCCyAFQQVeD/r/+/0hh//WdAAwBqlUHXRz8MQAAAAABJRU5ErkJggg==") no-repeat center;
border: 1px solid rgba(255, 255, 255, 0.5)
}
.auto-hide {
display: none
}
body:hover .auto-hide {
display: block
}
.attribution-button {
bottom: 12px;
color: #fff;
font: 11px arial, sans-serif;
position: absolute;
right: 5px;
text-decoration: none;
text-shadow: rgba(0, 0, 0, 0.7) 0 4px 4px;
z-index: 1001
}
.yt-text-overlay .attribution-button {
color: #888;
text-shadow: none
}
.viewmode-fullscreen .attribution-button {
bottom: auto;
right: 22px;
top: 5px
}
.yt-text-overlay.viewmode-fullscreen .attribution-button {
right: 5px;
top: auto
}
.text-container .attribution-button {
bottom: 7px
}
.ima-container {
position: absolute;
width: 100%;
z-index: 1000
}
.ima-container.autoalign {
bottom: 0;
text-align: center
}
.ima-container.fullslot, .ima-container.endslate {
height: 100%
}
.ima-container-stack {
background-color: #666;
border-radius: 5px;
display: block;
padding: 3px 0
}
.ima-container-stack.fullslot {
border-radius: 0;
padding: 0
}
.ima-container-rotator .attribution-button {
bottom: 7px
}
.ima-container-rotator .text-inner-container {
left: 20px
}
.ima-container-selector {
-webkit-box-shadow: 0 4px 3px rgba(0, 0, 0, 0.7);
-moz-box-shadow: 0 4px 3px rgba(0, 0, 0, 0.7);
box-shadow: 0 4px 3px rgba(0, 0, 0, 0.7);
background: #666;
border-radius: 2px;
cursor: pointer;
height: 10px;
left: 5px;
position: absolute;
width: 10px;
z-index: 1002
}
.ima-container-selector:hover {
background: #fff
}
.ima-container-rotator .ima-container-highlight:hover {
border-color: #fff !important
}
.ima-container-stack .ima-container-highlight:hover {
background-color: #999 !important
}
.ima-container-active {
background: #fc0 !important
}
.ima-container-slider .attribution-button {
bottom: 7px
}
.ima-container-slider .controls {
max-width: 100% !important
}
.ima-container-slider .text-container {
background-color: #000;
border-radius: 5px 5px 0 0;
margin-bottom: 0
}
.ima-container-slider .text-title:hover {
text-decoration: underline !important
}
.ima-container-slider.hidden .controls {
top: 38px
}
.ima-container-slider.animated .controls {
-webkit-transition: top 0.4s;
-moz-transition: top 0.4s;
-o-transition: top 0.4s;
transition: top 0.4s
}
.controls {
display: block;
position: relative
}
.controls.fullslot, .controls.endslate {
background: linear-gradient(#333, #000) repeat scroll 0% 0% transparent;
position: absolute;
height: 100%;
width: 100%
}
.adDisplay {
display: inline-block;
position: relative
}
.adDisplay.endslate {
left: 0;
right: 0;
top: 50%;
width: 100%;
text-align: center;
-webkit-transform: translatey(-50%);
-ms-transform: translatey(-50%);
transform: translatey(-50%)
}
.adDisplay.fullslot {
left: 0;
right: 0;
text-align: center
}
.adDisplay.scalable {
display: block;
min-width: 320px;
max-width: 450px
}
.autoalign .adDisplay.scalable {
margin: auto
}
.flash-container, .image-container {
display: inline-block;
pointer-events: auto;
position: relative
}
.flash-container.click-capture .click-layer {
display: block
}
.click-layer {
background: rgba(0, 0, 0, 0);
bottom: 0;
left: 0;
position: absolute;
right: 0;
top: 0;
z-index: 100
}
.text-container {
margin-bottom: 5px;
pointer-events: auto;
position: relative
}
.yt-text-overlay .text-container {
margin-bottom: 3px
}
.text-inner-container {
background-image: -webkit-linear-gradient(top, rgba(20, 20, 20, 0.6), rgba(209, 209, 209, 0.6));
background-image: -moz-linear-gradient(top, rgba(20, 20, 20, 0.6), rgba(209, 209, 209, 0.6));
background-image: -ms-linear-gradient(top, rgba(20, 20, 20, 0.6), rgba(209, 209, 209, 0.6));
background-image: -o-linear-gradient(top, rgba(20, 20, 20, 0.6), rgba(209, 209, 209, 0.6));
background-image: linear-gradient(top, rgba(20, 20, 20, 0.6), rgba(209, 209, 209, 0.6));
border: 1px solid rgba(102, 102, 102, 0.7);
border-radius: 3px;
box-shadow: rgba(0, 0, 0, 0.7) 0 5px 5px;
padding-left: 10px;
position: absolute;
text-align: left;
top: 0;
bottom: 0;
left: 0;
right: 0
}
.yt-text-overlay .text-container .text-inner-container {
background-color: rgba(0, 0, 0, 0.6);
background-image: none;
border: 1px solid rgba(0, 0, 0, 0.6);
border-radius: 0;
box-shadow: none;
padding-left: 10px
}
.viewmode-fullscreen .text-inner-container {
background-image: none;
border: none;
box-shadow: none
}
.yt-text-overlay .controls:hover .text-inner-container {
border: 1px solid rgba(58, 58, 58, 1)
}
.text-title {
text-decoration: underline
}
.yt-text-overlay .text-title, .viewmode-fullscreen .text-title {
text-decoration: none
}
.yt-text-overlay .controls:hover .text-container .text-title {
text-decoration: underline
}
.text-image-link {
float: left;
position: relative
}
.text-image {
box-shadow: rgba(0, 0, 0, 0.498039) 0 3px 5px;
height: 57px;
margin: 3px 10px 0 0;
width: 79px
}
.yt-text-overlay .text-image {
margin: 2px 10px 0 0;
width: auto
}
.yt-text-overlay .yt-video-image {
width: 79px
}
.text-image-duration {
background: #000;
color: #fff;
font: 10px arial, sans-serif;
padding: 2px;
position: absolute;
right: 10px;
top: 43px
}
.text-title {
color: #fff;
display: block;
font: bold 14px arial, sans-serif;
margin: 7px 16px 0 0;
overflow: hidden;
padding-bottom: 4px;
text-overflow: ellipsis;
text-shadow: rgba(0, 0, 0, 0.7) 0 4px 4px;
white-space: nowrap
}
.yt-text-overlay .text-title {
margin-top: 7px;
text-shadow: #000 0 -1px 0
}
.text-description {
color: #fff;
font: 12px arial, sans-serif;
margin-top: -3px;
overflow: hidden;
text-overflow: ellipsis;
text-shadow: rgba(0, 0, 0, 0.7) 0 4px 4px;
white-space: nowrap
}
.yt-text-overlay .text-description {
margin-bottom: 2px;
text-align: left;
text-shadow: none
}
.text-ad-channel {
bottom: 7px;
color: #f9fcc0;
font: bold 11px arial, sans-serif;
left: 10px;
position: absolute;
text-decoration: none;
text-shadow: rgba(0, 0, 0, 0.7) 0 4px 4px
}
.yt-text-overlay .text-ad-channel {
bottom: 9px;
color: #eade90;
font-weight: normal;
position: static;
left: auto;
text-shadow: #000 0 -1px 0
}
.pyv .text-ad-channel {
left: 99px
}
.yt-text-overlay .pyv .text-ad-channel {
left: auto
}
.viewmode-fullscreen .text-ad-channel {
color: #ccc
}
.yt-text-overlay.viewmode-fullscreen .text-ad-channel {
color: #eade90
}
.fullslot-attribution-button {
font-family: Arial;
font-size: 10pt;
color: #999;
bottom: 15px;
left: 15px;
position: absolute;
text-decoration: none
}
.videoAdUi-mobile .fullslot-attribution-button {
font-size: 8pt;
bottom: 5px;
left: 7px
}
.fullslotAdUi-mobile .fullslot-attribution-button {
bottom: 5px
}
.fullslot-visible-url {
font-family: Arial;
font-size: 9pt;
color: #fff;
text-decoration: none;
display: block;
margin-top: 10px
}
.fullslotAdUi-mobile .fullslot-visible-url {
margin-top: 0;
font-size: 7pt
}
.fullslot-ad-break {
color: #fff;
font-family: Arial;
font-size: 13pt;
text-align: center;
top: 15px;
position: absolute;
left: 0;
right: 0
}
.fullslotAdUi-mobile .fullslot-ad-break {
top: 5px
}
.videoAdUi-mobile .fullslot-ad-break {
font-size: 10pt
}
.fullslot-autoclose {
position: absolute;
bottom: 15px;
right: 20px;
color: #999;
font-family: Arial;
font-size: 10pt
}
.videoAdUi-mobile .fullslot-autoclose {
font-size: 8pt;
bottom: 5px;
right: 7px
}
.fullslotAdUi-mobile .fullslot-autoclose {
bottom: 5px
}
.ima-sdk-frame body {
background: transparent;
height: 100%;
margin: 0;
overflow: hidden
}
.ima-sdk-frame {
height: 100%
}
.ima-sdk-frame-native body {
background: #000
}
.ima-sdk-frame-native video {
bottom: 0;
left: 0;
margin: auto;
right: 0;
top: 0
}
.ytp-iv-drawer-open .videoAdUiTopBar, .ytp-iv-drawer-open .videoAdUiPreSkipContainer, .ytp-iv-drawer-open .videoAdUiSkipContainer, .ytp-iv-drawer-open .ad-overlay .container {
display: none
}
.ytp-ad-end-cap .videoAdUiSkipContainer {
display: inherit
}
.iv-endcap-background {
background-color: rgba(255, 255, 255, 0.9);
bottom: 0;
left: 0;
position: absolute;
right: 0;
top: 0
}
.iv-endcap-slot {
bottom: 0;
left: 0;
position: absolute;
right: 0;
top: 0;
transition: opacity 0.25s cubic-bezier(0, 0, 0.2, 1);
z-index: 30
}
.iv-endcap-card {
-moz-transform: translatey(-50%);
-ms-transform: translatey(-50%);
-webkit-transform: translatey(-50%);
transform: translatey(-50%);
display: block;
left: 50%;
margin-left: -140px;
position: absolute;
text-align: center;
top: 50%;
width: 280px
}
.ytp-small-mode .iv-endcap-card {
-moz-transform: translatey(0);
-ms-transform: translatey(0);
-webkit-transform: translatey(0);
transform: translatey(0);
margin-left: -120px;
top: 18px;
width: 240px
}
.iv-endcap-text a {
display: block;
padding: 10px 0
}
.ytp-small-mode .iv-endcap-text a {
padding: 8px 0
}
.iv-endcap-headline {
color: #333;
display: block;
font-size: 20px;
max-height: 2.6em;
overflow: hidden
}
.ytp-small-mode .iv-endcap-headline {
font-size: 16px;
max-height: 2.6em
}
.iv-endcap-description {
color: #767676;
display: block;
font-size: 13px;
font-weight: 500;
max-height: 1.3em;
overflow: hidden
}
.ytp-small-mode .iv-endcap-description {
font-size: 12px
}
.iv-endcap-action {
background-color: #167ac6;
border-radius: 2px;
box-sizing: border-box;
color: #fff !important;
display: inline-block;
font-family: Roboto, Arial, sans-serif;
font-size: 23px;
height: 46px;
line-height: 46px;
min-width: 164px;
padding: 0 20px
}
.iv-endcap-action-icon {
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAQAAABKfvVzAAAABGdBTUEAALGPC/xhBQAAAAJiS0dEAP+Hj8y/AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAO0lEQVQ4y2NgGAVkgf+N/xtIUa77/8///6RpiSBdSyTpWqJI1xKNXQsTCWaQY/7AKCcj4hpIUj4KsAAAxzJDANLxZS8AAAAASUVORK5CYII=");
float: right;
height: 30px;
margin: 11px 42px 0 0;
width: 30px
}
.ytp-small-mode .iv-endcap-action {
font-size: 15px;
height: 36px;
line-height: 36px;
padding: 0 16px;
min-width: 120px
}
.ytp-small-mode .iv-endcap-action-icon {
margin: 6px 25px 0 0
}
.iv-endcap-image img {
border: 1px solid #eee;
height: 120px;
max-width: 100%;
width: 120px
}
.ytp-small-mode .iv-endcap-image img {
height: 60px;
width: 60px
}
.iv-endcap-image {
display: block;
height: 120px;
margin: auto;
width: 120px
}
.ytp-small-mode .iv-endcap-image {
height: 60px;
width: 60px
}
.iv-endcap-bottom {
bottom: 4px;
display: block;
left: 6px;
position: absolute
}
svg.iv-endcap-countdown {
background: none;
border-radius: 50%;
height: 20px;
opacity: 0.4;
transform: rotate(-90deg);
width: 20px
}
circle.iv-endcap-countdown-inner {
fill: none;
stroke: #000;
stroke-width: 10px
}
circle.iv-endcap-countdown-outer {
fill: none;
stroke: #000;
stroke-width: 1
}
.ytp-ad-end-cap .videoAdUiBottomBarText {
display: none
}
.videoAdInterstitial {
background-color: #000;
min-width: 100%;
min-height: 100%;
z-index: 2000;
position: relative;
display: table
}
.videoAdInterstitial > p {
min-width: 100%;
min-height: 100%;
vertical-align: middle;
text-align: center;
color: #fff;
display: table-cell
}
.videoAdUi {
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
background-color: rgba(0, 0, 0, 0);
bottom: 0;
height: 100%;
left: 0;
min-height: 100%;
pointer-events: none;
position: absolute;
right: 0;
top: 0;
overflow: hidden
}
.videoAdUiRedesign .videoAdUi {
cursor: default;
text-shadow: 0 0 4px rgba(0, 0, 0, 0.75)
}
.videoAdUiBottomBarText, .videoAdUiAuthorName, .videoAdUiLearnMore, .videoAdUiLearnMoreText, .videoAdUiTitle, .videoAdUiAttributionContainer, .videoAdUiShare, .videoAdUiTopButtons, .videoAdUiPreSkipText, .videoAdUiAction {
font-family: arial, sans-serif;
font-weight: normal;
line-height: normal
}
.videoAdUiRedesign .videoAdUiBottomBarText, .videoAdUiRedesign .videoAdUiAuthorName, .videoAdUiRedesign .videoAdUiLearnMore, .videoAdUiRedesign .videoAdUiLearnMoreText, .videoAdUiRedesign .videoAdUiTitle, .videoAdUiRedesign .videoAdUiAttributionContainer, .videoAdUiRedesign .videoAdUiShare, .videoAdUiRedesign .videoAdUiTopButtons, .videoAdUiRedesign .videoAdUiPreSkipText, .videoAdUiRedesign .videoAdUiAction {
font-family: "Roboto", arial, sans-serif
}
.videoAdUiPreview {
background: rgba(0, 0, 0, 1);
bottom: 0;
left: 0;
position: fixed;
right: 0;
top: 0;
z-index: -1
}
.videoAdUiPreviewImagePortrait, .videoAdUiPreviewImageLandscape {
cursor: none;
height: 100%;
width: 100%
}
.videoAdUiPreviewImagePortrait {
object-fit: contain
}
.videoAdUiPreviewImageLandscape {
object-fit: cover
}
.videoAdUiTopBar {
background: #000;
border-bottom: 1px solid #444;
cursor: default;
left: 0;
opacity: 0.8;
padding: 0;
pointer-events: auto;
position: relative;
top: 0;
right: 0;
z-index: 1000
}
.videoAdUiRedesign .videoAdUiTopBar {
display: none
}
.videoAdUiTopBarWithGradients {
background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.7) 40%, rgba(0, 0, 0, 0) 99%);
background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.7) 40%, rgba(0, 0, 0, 0) 99%);
background-image: -ms-linear-gradient(top, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.7) 40%, rgba(0, 0, 0, 0) 99%);
background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.7) 40%, rgba(0, 0, 0, 0) 99%);
background-image: linear-gradient(top, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.7) 40%, rgba(0, 0, 0, 0) 99%);
background-color: rgba(0, 0, 0, 0);
border-bottom: none;
height: 40px
}
.videoAdUiRedesign .videoAdUiTopBarWithGradients {
background-image: none;
box-shadow: inset 0 120px 90px -90px rgba(0, 0, 0, 0.65);
height: 110px
}
.videoAdUiTopBarTransitions {
-webkit-transition: opacity ease-in 0.5s;
-moz-transition: opacity ease-in 0.5s;
-o-transition: opacity ease-in 0.5s;
transition: opacity ease-in 0.5s;
opacity: 0
}
.videoAdUi:hover .videoAdUiTopBarTransitions {
-webkit-transition: opacity ease-out 0.5s;
-moz-transition: opacity ease-out 0.5s;
-o-transition: opacity ease-out 0.5s;
transition: opacity ease-out 0.5s;
opacity: 0.8
}
.videoAdUiRedesign .videoAdUi:hover .videoAdUiTopBarTransitions {
-webkit-transition: opacity ease-out 0.5s;
-moz-transition: opacity ease-out 0.5s;
-o-transition: opacity ease-out 0.5s;
transition: opacity ease-out 0.5s;
opacity: 1
}
.videoAdUiTopBarNoFade {
opacity: 0.8 !important
}
.videoAdUiRedesign .videoAdUiTopBarNoFade {
opacity: 1 !important
}
.videoAdUiBottomBar {
background-image: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.4) 60%, rgba(0, 0, 0, 0) 99%);
background-image: -moz-linear-gradient(bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.4) 60%, rgba(0, 0, 0, 0) 99%);
background-image: -ms-linear-gradient(bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.4) 60%, rgba(0, 0, 0, 0) 99%);
background-image: -o-linear-gradient(bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.4) 60%, rgba(0, 0, 0, 0) 99%);
background-image: linear-gradient(bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.4) 60%, rgba(0, 0, 0, 0) 99%);
bottom: 5px;
left: 0;
padding: 0;
pointer-events: auto;
position: absolute;
width: 100%;
z-index: 1000
}
.videoAdUiRedesign .videoAdUiBottomBar {
background-image: none;
bottom: 49px;
box-shadow: none;
height: 20px;
left: 12px;
opacity: 1;
pointer-events: none
}
.videoAdUiRedesign .videoAdUiBottomBar.bottomBarMarginMedium {
bottom: 40px
}
.videoAdUiRedesign .videoAdUiBottomBarText {
bottom: 0;
direction: ltr;
font-size: 12px;
height: 30px;
left: 7px;
line-height: 28px;
position: absolute
}
.videoAdUiRedesign .videoAdUiBottomBarMessage {
color: rgba(255, 255, 255, 1);
font-size: 12px;
position: absolute;
right: 36px;
bottom: 7px
}
@media all and (max-width: 656px) {
.videoAdUiRedesign .videoAdUiBottomBarMessage {
display: none
}
}
.videoAdUiProgressBar {
background-color: #fff;
bottom: 0;
cursor: default;
left: 0;
pointer-events: auto;
position: absolute;
width: 100%;
z-index: 1000
}
.videoAdUiRedesign .videoAdUiProgressBar {
display: none
}
.videoAdUiProgress {
background-image: -webkit-linear-gradient(top, #ffec7b, #dea405);
background-image: -moz-linear-gradient(top, #ffec7b, #dea405);
background-image: -ms-linear-gradient(top, #ffec7b, #dea405);
background-image: -o-linear-gradient(top, #ffec7b, #dea405);
background-image: linear-gradient(top, #ffec7b, #dea405);
border-right: solid 1px #666;
height: 4px;
opacity: 0.9;
width: 0%
}
.videoAdUiRedesign .videoAdUiProgress {
background: #edcb3c;
border-right: none;
opacity: 1
}
.videoAdUiBuffer {
height: 4px;
width: 0%;
display: none
}
.videoAdUiAuthorIcon {
background: #000;
display: inline-block;
height: 40px;
margin: 0 10px;
position: absolute
}
.videoAdUiRedesign .videoAdUiAuthorIcon {
height: 40px;
left: 12px;
margin: 0;
position: absolute;
top: 10px;
pointer-events: auto
}
.videoAdUiAuthorIconImage {
cursor: pointer;
width: 40px;
height: 40px
}
.videoAdUiAuthorIconImage:hover {
opacity: 0.6
}
.videoAdUiAuthorName {
color: #ccc;
cursor: pointer;
display: inline-block;
font-size: 12px;
margin: 10px 5px 5px;
text-decoration: none
}
.videoAdUiRedesign .videoAdUiAuthorName {
color: rgba(255, 255, 255, 0.75);
display: block;
margin: 0;
padding: 6px 0;
position: absolute;
top: 30px;
left: 22px;
right: 48px;
pointer-events: auto
}
.videoAdUiRedesign.ytp-iv-drawer-enabled .videoAdUiTitle, .videoAdUiRedesign.ytp-iv-drawer-enabled .videoAdUiAuthorName, .videoAdUiRedesign.videoAdUiHasWatchLater .videoAdUiTitle, .videoAdUiRedesign.videoAdUiHasWatchLater .videoAdUiAuthorName {
right: 90px
}
.videoAdUiRedesign.ytp-iv-drawer-enabled.videoAdUiHasWatchLater .videoAdUiTitle, .videoAdUiRedesign.ytp-iv-drawer-enabled.videoAdUiHasWatchLater .videoAdUiAuthorName {
right: 132px
}
.videoAdUiLearnMore {
color: #fff;
cursor: pointer;
display: inline-block;
float: right;
font-size: 16px;
padding: 5px
}
.videoAdUiRtl .videoAdUiLearnMore {
float: left
}
.videoAdUiLearnMoreText {
color: #e5bb00;
cursor: pointer;
font-size: 13px;
margin-bottom: 5px;
opacity: 0.9;
text-align: center
}
.videoAdUiLearnMoreText:hover {
text-decoration: underline
}
.videoAdUiLearnMoreText-gvn {
display: inline-block;
float: right;
padding: 5px;
padding-right: 10px
}
.videoAdUiRedeign .videoAdUiLearnMoreText {
display: none
}
.videoAdUiLearnMoreIcon {
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKBAMAAAB/HNKOAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAAIVBMVEUAAAD/0AD/0AD/0QD/0gD/zwD/0AD/0AD/1QD/zwD///+x1gNuAAAACnRSTlMAcuWrVY9HyCpk8FcvuAAAAAFiS0dECmjQ9FYAAAAJcEhZcwAACxMAAAsTAQCanBgAAAA5SURBVAjXFcm5DQAgEMRA84oWyE5LQE4FiB7ovxUOB5MYCBpAlljiCIP7LftgdfqzoOS2HvnXlccDfz8EBUmGo6EAAAAASUVORK5CYII=");
display: inline-block;
height: 10px;
margin-left: 3px;
width: 10px
}
.videoAdUiTitle {
color: #fff;
cursor: pointer;
display: inline-block;
font-size: 13px;
margin: 10px 5px 5px;
text-decoration: none;
max-width: 50%
}
.videoAdUiRedesign .videoAdUiTitle {
color: rgba(255, 255, 255, 0.75);
font-size: 17px;
max-width: none;
margin: 0;
padding-top: 14px;
position: absolute;
top: 0;
left: 22px;
right: 48px;
pointer-events: auto
}
.videoAdUiTitleWithAuthorIcon {
margin-left: 60px
}
.videoAdUiRtl .videoAdUiTitleWithAuthorIcon {
margin-left: 0;
margin-right: 60px
}
.videoAdUiRedesign .videoAdUiTitleWithAuthorIcon, .videoAdUiRedesign .videoAdUiAuthorNameWithAuthorIcon {
margin-left: 0;
margin-right: 0;
left: 62px
}
.videoAdUiRtl .videoAdUiRedesign .videoAdUiTitleWithAuthorIcon, .videoAdUiRtl .videoAdUiRedesign .videoAdUiAuthorNameWithAuthorIcon {
left: 0;
right: 62px
}
.videoAdUiAuthorName:hover, .videoAdUiTitle:hover {
text-decoration: underline
}
.videoAdUiRedesign .videoAdUiAuthorName:hover, .videoAdUiRedesign .videoAdUiTitle:hover {
color: #fff
}
.ellipsisText {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap
}
.videoAdUiMuteToggleButton {
position: absolute;
left: 0;
opacity: 0.9;
bottom: 0;
padding: 5px 10px;
width: 15px;
height: 15px
}
.videoAdUiMutedIcon, .videoAdUiUnmutedIcon {
position: absolute;
left: 0;
height: inherit;
width: inherit
}
.videoAdUiAttributionContainer {
bottom: 0;
color: #fff;
display: inline-block;
font-size: 11px;
left: 0;
padding: 5px;
padding-right: 10px;
pointer-events: auto;
position: absolute;
text-shadow: 0 0 5px rgba(0, 0, 0, 0.8)
}
.videoAdUiRedesign .videoAdUiAttributionContainer {
font-size: 12px;
line-height: 28px;
padding: 0;
padding-right: 0;
position: static;
text-shadow: 0 0 2px rgba(0, 0, 0, 0.5)
}
.videoAdUiAttributionContainer-gvn {
color: #e5bb00;
font-size: 12px;
position: relative;
text-shadow: none
}
.videoAdUiMuteToggleButton ~ .videoAdUiAttributionContainer {
left: 30px
}
.videoAdUiAttribution {
display: inline-block;
opacity: 0.9;
text-align: initial
}
.rtl .videoAdUiVisitAdvertiserLinkText, .rtl .videoAdUiAttribution, .rtl .videoAdUiAdInfoPopupText {
direction: rtl
}
.videoAdUiRedesign .videoAdUiAttribution {
opacity: 0.75
}
.videoAdUiAttributionBadge {
display: none;
opacity: 1;
text-shadow: none
}
.videoAdUiInstreamBadgeExperiment .videoAdUiAttributionBadge {
display: inline-block
}
.videoAdUiInstreamBadgeExperiment .videoAdUiAttribution, .videoAdUiInstreamBadgeExperiment .videoAdUiAttributionIcon {
vertical-align: middle
}
.videoAdUiRedesign .videoAdUiAttribution {
margin-left: 5px
}
.videoAdUiAttributionContainer-gvn .videoAdUiAttribution {
opacity: 1
}
.videoAdUiAttributionIconContainer {
display: inline-block;
height: 20px;
pointer-events: auto;
position: relative
}
.videoAdUiRedesign .videoAdUiAttributionIconContainer {
height: 30px;
line-height: inherit;
opacity: 0.75;
vertical-align: middle
}
.videoAdUiAttributionContainer.videoAdUiWtaClickable {
cursor: pointer
}
.videoAdUiRedesign .videoAdUiAttributionContainer:hover .videoAdUiAttributionIconContainer {
opacity: 1
}
.videoAdUiAttributionIcon {
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAMAAAAolt3jAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAA51BMVEUAAAH////////////////////////////////19fXJycnAwMDo6Ojz8/Pm5ub+/v6RkZEAAAEAAAEAAAGQkJD6+vrq6upVVVb///+QkJAAAAEAAAHAwMCkpKQAAAHz8/MAAAH29vbg4OAAAAH////IyMgAAAH////8/PwAAAG+vr4AAAH7+/sAAAHn5+f////r6+sAAAGPj4////+lpaX////z8/P////29vYODg/e3t7p6en29vb////////29vYyMjNNTU6np6fi4uL8/Pzt7e0MDA0AAAEAAAEAAAEAAAEAAAH///8wgzAnAAAATHRSTlMAAAVjs9sYu+bGrbXRxBvejnNgRY/hzRNijW8papgExijGzTLhrF+J4lq1RN9w0b7Dbo5PmQbF3cR2HM3FiL3DfBKZz9/Fdl4NAzNcPQMQyAAAAAFiS0dEAf8CLd4AAACiSURBVAjXVY7VFsJADERnKxCcBYq7O5Ti7lL+/3/IwhN5uyc3kwGg6YZpGroGQAAeL/n8gSCFwgo1byQqY/F4wkqmGNOUyeaIgDwVigJGSZZBJIFKtSZQbzQ5QzK22h3Gbg9QMlr9AcvDL/J2NLYFdJr80KEpy7O5lVe3zmK54iisN7Td7fZ0ODb5EXA6X6zr7Xx/PFVJ4OW+bfvtvlRJ8TcfEUIPwEoIHmcAAAAZdEVYdFNvZnR3YXJlAEFkb2JlIEltYWdlUmVhZHlxyWU8AAAAAElFTkSuQmCC");
height: 12px;
margin: 10px 10px 0
}
.videoAdUiAttributionIconGrey {
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAQAAAC1QeVaAAAABGdBTUEAALGPC/xhBQAAAAJiS0dEAP+Hj8y/AAAACXBIWXMAAAsTAAALEwEAmpwYAAABI0lEQVQY032QP0tCcRhGz/u7ZhcjEB2CaJPaRPpDRUNDkLUFokN9h7a8EEFd3exWn8ScK4eiJSrISSHpCzR0oaHslt63QXPsjM+ZniMMKBosBDXdiv5tBqAgB0l2aBHQ0u39ZF76UqAoZjY8x5dDfZAlLUucfK9xqmDASoY1qt789w1TwbU3R02rIwkA05BwkzevCKNpdu00HO/xHmbvBEzdUleOAKJNU4k2AcRV99YC8ymkzCNAkAnLQQbAumemI2Biyku4CECMSWIA3WWebQWz1hNXSwDYTGAD4EpptQdmQc0FcecEOnVyH3VwzhiXq5X+lR9f8ppznuz1yOtYttjQLSl8+YMIUJBUItxQl2nalKzLtl/ToQRwRCMIStcbtv2XX4C7ZjXugRWLAAAAAElFTkSuQmCC");
height: 12px;
margin: 4px 0 0 5px;
position: relative;
width: 12px
}
.videoAdUiAdSettingsLongTooltip {
width: 195px
}
.videoAdUiAdSettingsShortTooltip {
white-space: nowrap
}
.videoAdUiAdInfoPopup {
background: white;
border: 1px solid black;
box-sizing: border-box;
color: black;
display: none;
font-size: 12px;
left: -14px;
line-height: normal;
padding: 7px;
position: absolute;
text-shadow: none;
bottom: 20px
}
.videoAdUiRedesign .videoAdUiAdInfoPopup {
background: #fff;
border: 1px solid #aaa;
border-radius: 4px;
bottom: 30px;
color: #333;
left: -19px;
opacity: 0.9
}
.videoAdUiAttributionContainer:hover .videoAdUiAdInfoPopup {
display: inline-block
}
.videoAdUiAdInfoPopupCallout {
border-left: 5px solid transparent;
border-right: 5px solid transparent;
border-top: 5px solid white;
box-sizing: border-box;
display: inline-block;
height: 0;
left: 24px;
overflow: visible;
position: absolute;
text-align: center;
top: 100%;
width: 0
}
.videoAdUiRedesign .videoAdUiAttributionIcon {
background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAMAAAAolt3jAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAA51BMVEUAAAH////////////////////////////////19fXJycnAwMDo6Ojz8/Pm5ub+/v6RkZEAAAEAAAEAAAGQkJD6+vrq6upVVVb///+QkJAAAAEAAAHAwMCkpKQAAAHz8/MAAAH29vbg4OAAAAH////IyMgAAAH////8/PwAAAG+vr4AAAH7+/sAAAHn5+f////r6+sAAAGPj4////+lpaX////z8/P////29vYODg/e3t7p6en29vb////////29vYyMjNNTU6np6fi4uL8/Pzt7e0MDA0AAAEAAAEAAAEAAAEAAAH///8wgzAnAAAATHRSTlMAAAVjs9sYu+bGrbXRxBvejnNgRY/hzRNijW8papgExijGzTLhrF+J4lq1RN9w0b7Dbo5PmQbF3cR2HM3FiL3DfBKZz9/Fdl4NAzNcPQMQyAAAAAFiS0dEAf8CLd4AAACiSURBVAjXVY7VFsJADERnKxCcBYq7O5Ti7lL+/3/IwhN5uyc3kwGg6YZpGroGQAAeL/n8gSCFwgo1byQqY/F4wkqmGNOUyeaIgDwVigJGSZZBJIFKtSZQbzQ5QzK22h3Gbg9QMlr9AcvDL/J2NLYFdJr80KEpy7O5lVe3zmK54iisN7Td7fZ0ODb5EXA6X6zr7Xx/PFVJ4OW+bfvtvlRJ8TcfEUIPwEoIHmcAAAAZdEVYdFNvZnR3YXJlAEFkb2JlIEltYWdlUmVhZHlxyWU8AAAAAElFTkSuQmCC");
display: inline-block;
height: 12px;
margin: 0 5px -1px;
opacity: 0.75;
width: 12px
}
.videoAdUiRedesign .videoAdUiVisitAdvertiserLink {
color: rgba(255, 255, 255, 0.75);
display: inline-block;
pointer-events: auto;
line-height: 28px;
margin: 0 5px;
cursor: pointer;
text-decoration: none
}
.videoAdUiRedesign .videoAdUiVisitAdvertiserLinkText {
display: inline-block;
height: 30px;
margin: -4px 5px -2px 0;
padding: 5px 0;
text-decoration: inherit;
vertical-align: baseline
}
.videoAdUiRedesign .videoAdUiVisitAdvertiserIcon {
background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAQAAAAnOwc2AAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAAAmJLR0QA/4ePzL8AAABXSURBVAjXVY6xDYAwEMT8iBaJDWAWhFDYfwCo6MgKpiEh+JuXdYVDKvXtPkcQJDJg4XQ2ebspKu8ls6u0cje7OrVy9HIRD5FvOUiZhBK0WfFPqvRtdOEBg3RMtKey4oQAAAAZdEVYdFNvZnR3YXJlAEFkb2JlIEltYWdlUmVhZHlxyWU8AAAAAElFTkSuQmCC");
display: inline-block;
height: 10px;
opacity: 0.75;
width: 10px
}
.videoAdUiRedesign .videoAdUiVisitAdvertiserLink:hover {
color: rgba(255, 255, 255, 1);
text-decoration: underline
}
.videoAdUiRedesign .videoAdUiVisitAdvertiserLink:hover .videoAdUiVisitAdvertiserIcon {
opacity: 1
}
.videoAdUiShare {
color: #fff;
display: inline-block;
float: right;
font-size: 13px;
margin: 10px 10px 5px
}
.videoAdUiShare:hover {
text-decoration: underline;
cursor: pointer
}
.videoAdUiRedesign .videoAdUiTopButtons {
color: #fff;
display: inline-block;
float: right;
font-size: 13px
}
.videoAdUiRedesign.ytp-iv-drawer-enabled .videoAdUiTopButtons {
position: relative;
right: 34px
}
.videoAdUiRedesign .videoAdUiTopButton {
background-position: center;
background-repeat: no-repeat;
border-left: 5px solid transparent;
border-right: 5px solid transparent;
border-top: 14px solid transparent;
display: inline-block;
pointer-events: auto;
margin: -14px 0 0;
height: 24px;
opacity: 0.75;
text-align: center;
width: 24px
}
.videoAdUiRedesign .videoAdUiTopButton:hover {
cursor: pointer;
opacity: 1
}
.videoAdUiRedesign .videoAdUiTopButtonShare {
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAeCAQAAACY0sZTAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAAAmJLR0QA/4ePzL8AAACqSURBVDjL7ZJBEcIwEEU3GEgdREIlBAeVgITUQSSAk0oAB5VQHJQqeBwomcAMZHNghkPfKZvJn5+/80U2/g0cHlcnGQCYsHqJ50nI73dfJFb6NDRalyn5zIVUOFosRwBGOgKxkGgN/iDWBh9pP797XcQ+nW5y1a7YMWfhO63MEgl4zgAM2KpGcMhc9Y3Arn41jTCLXNLQKJ2yxbw1wpS+KL2InMyidtr4BXdaZZpobfXi6QAAAABJRU5ErkJggg==")
}
.videoAdUiRedesign .videoAdUiTopButton:hover .videoAdUiTopButtonCallout {
display: inline-block
}
.videoAdUiRedesign .videoAdUiTopButtonCallout {
border-left: 5px solid transparent;
border-right: 5px solid transparent;
border-bottom: 5px solid #444;
box-sizing: border-box;
display: none;
height: 0;
overflow: visible;
position: relative;
text-align: center;
top: 100%;
width: 0
}
.videoAdUiRedesign .videoAdUiTopButtonTooltip {
background: #444;
border-radius: 3px;
box-sizing: border-box;
color: white;
display: inline-block;
font-size: 11px;
padding: 8px;
position: relative;
top: 5px;
width: 50px;
left: -25px
}
.videoAdUiPreSkipContainer {
bottom: 22px;
cursor: default;
padding: 15px 0 15px 15px;
pointer-events: auto;
position: absolute;
right: 0;
z-index: 1000
}
.videoAdUi-mobile .videoAdUiPreSkipContainer {
bottom: 11px;
padding: 8px 0 8px 8px
}
.videoAdUiRedesign .videoAdUiPreSkipContainer {
background: rgba(0, 0, 0, 0.4);
height: 52px;
padding: 0;
vertical-align: middle
}
.videoAdUi-mobile.videoAdUiRedesign .videoAdUiPreSkipContainer {
background: rgba(0, 0, 0, 0.4);
bottom: 30px;
height: 52px;
padding: 0;
vertical-align: middle
}
.videoAdUiRedesign .videoAdUiPreSkipContainer {
bottom: 74px
}
.videoAdUiRedesign .videoAdUiPreSkipContainer.skipBottomMarginMedium {
bottom: 68px
}
.videoAdUiPreSkipContainer.videoAdUiHighPreSkipContainer {
bottom: auto;
top: 15%
}
.ytp-small-mode.ytp-ad-end-cap .videoAdUiPreSkipContainer, .ytp-small-mode.ytp-ad-end-cap .videoAdUiSkipContainer {
bottom: 6px
}
.ytp-big-mode .videoAdUiBottomBar, .ytp-big-mode.videoAdUiRedesign .videoAdUiBottomBar {
left: 24px;
bottom: 70px
}
.ytp-big-mode .videoAdUiSkipContainer, .ytp-big-mode .videoAdUiPreSkipContainer {
bottom: 70px
}
.ytp-big-mode.videoAdUiRedesign .videoAdUiSkipContainer, .ytp-big-mode.videoAdUiRedesign .videoAdUiPreSkipContainer {
bottom: 95px
}
.ytp-big-mode.videoAdUiRedesign .videoAdUiBrandInteractionUnit {
bottom: 147px
}
.ytp-big-mode.videoAdUiRedesign .videoAdUiBrandInteractionHorizontalRect.videoAdUiBrandInteractionUnit {
bottom: 166px
}
.ytp-big-mode.videoAdUiRedesign .videoAdUiReasonToWatchBox {
bottom: 163px
}
.ytp-hide-controls.videoAdUiRedesign .videoAdUiSkipContainer, .ytp-hide-controls.videoAdUiRedesign .videoAdUiPreSkipContainer {
bottom: 25px
}
.videoAdUiBrandPrecapContainer {
background-color: rgba(0, 0, 0, 1);
display: table;
height: 100%;
pointer-events: auto;
position: absolute;
width: 100%;
z-index: 1000
}
.videoAdUiBrandPrecapContent {
display: table-cell;
text-align: center;
vertical-align: middle
}
.videoAdUiBrandPrecapImageContainer {
height: 120px
}
.videoAdUiBrandPrecapBrandImage {
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
max-height: 120px;
max-width: 120px
}
.videoAdUiBrandPrecapTextContainer {
color: white;
display: block;
font-family: "Roboto", arial, sans-serif;
max-width: 40%;
margin: 0 auto
}
.videoAdUiBrandPrecapBrandName {
color: rgba(255, 255, 255, 1);
font-size: 20px;
font-weight: 500;
padding-top: 30px
}
.videoAdUiBrandPrecapBrandMessage {
color: rgba(255, 255, 255, 0.8);
font-size: 16px;
padding-top: 20px
}
.videoAdUiBrandPrecapAutoGenImage {
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
height: 100%;
width: 100%
}
.videoAdUiBrandInteractionUnit {
bottom: 126px;
font-family: "Roboto", arial, sans-serif;
position: absolute;
right: 0;
z-index: 1000
}
.videoAdUiBrandInteractionPreMessageText {
display: none
}
.videoAdUiBrandInteractionButton {
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
background: rgba(17, 17, 17, 0.5);
border-radius: 50%;
cursor: pointer;
display: inline-flex;
height: 50px;
justify-content: center;
margin: 0 20px 12px 0;
pointer-events: auto;
width: 50px
}
.videoAdUiBrandInteractionButton:hover {
background: rgba(17, 17, 17, 1);
border: 2px solid #fff;
box-shadow: 0 3px 6px
}
.videoAdUiBrandInteractionButton:active {
background: rgba(161, 194, 250, 1);
border: none;
box-shadow: none
}
.videoAdUiBrandInteractionButton.selected {
background: #4182ef;
box-shadow: 0 3px 6px;
opacity: 1
}
.videoAdUiBrandInteractionIcon {
background-repeat: no-repeat;
display: inline-block;
height: 22px;
width: 22px
}
.videoAdUiBrandInteractionLikeIcon {
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAAAAWCAQAAACFih+zAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAAAmJLR0QA/4ePzL8AAADmSURBVCjPrdA9L4NRGMbx/9FSg5GlI4OkQ+MT2JBgNVolPoG9X0DCzmBikCDEXmG0GyiJ1EsknUzib6j28fKcxxlc27nv3znJueB/4oLXDqfAMe/Vxd55IApHOaYKVP96cdobu5krYiNu+v4J2w7F4Ywts6zFWMX1/nuqB5aybRlcAR7CoRPsU/96kzuWvAi32US1CV6an5Zbzn+nV8bzUtDrjzTT6UkqlaNUehbaqXQX0ugbe6n0NDwDlIFZoFNAt39/c8dOTvmPDuZ1Epx02Q3Pfe3TRm8bIkWWqDFFnXFWw1N39gH8U8v3js/hPQAAAABJRU5ErkJggg==")
}
.videoAdUiBrandInteractionDislikeIcon {
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAAAAWCAQAAACFih+zAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAAAmJLR0QA/4ePzL8AAADoSURBVCjPjdE/S0JRHIfx52rkGpnQqERBQTQ0OLQ3OBQ0OOheEDT2ShoKapGGlt5FuYWBi+HgGM0tNfk0eEWl473nu5zDOZ/z73cgOsm04wGvjOjzTo9e8p2xxo6zjP3w0Svrlv7DdX8NZTAzK2nbphQ8rAheUoPkerrrm+EMwRdVKAC4y2F+BQoAtGKKNaHNSOo+O7G7nsbACT2Op3vxdIsW9wyD84PgqGXPHS98wI2r4KZVq4u04miOfdlYehcf5uCTG8thxZ+UfXqS+T7PUvjsWk4pvFD11oS8eKR2LUaV2Du3s+b/ACQjuMvu5TwSAAAAAElFTkSuQmCC")
}
.videoAdUiBrandInteractionLikeButton:hover ~ .videoAdUiLikeMsg, .videoAdUiBrandInteractionDislikeButton:hover ~ .videoAdUiDislikeMsg {
display: inline
}
.videoAdUiLikeMsg, .videoAdUiDislikeMsg {
display: none
}
.videoAdUiBrandInteractionMessageBox {
background: rgba(31, 31, 31, 0.5);
border-radius: 2px;
color: #fff;
font-family: "Roboto", arial, sans-serif;
font-size: 14px;
font-weight: 500;
height: 18px;
letter-spacing: 0;
margin: 9px 0;
padding: 8px 16px;
position: absolute;
right: 86px;
text-align: center;
white-space: nowrap
}
.videoAdUiBrandInteractionHorizontalRect.videoAdUiBrandInteractionUnit {
align-items: center;
background: rgba(0, 0, 0, 0.7);
bottom: 146px;
color: #fff;
display: flex;
padding: 12px 20px;
pointer-events: auto
}
.videoAdUiBrandInteractionHorizontalRect .videoAdUiBrandInteractionPreMessageText {
font-size: 14px;
display: inline-block;
padding-right: 20px
}
.videoAdUiBrandInteractionHorizontalRect .videoAdUiBrandInteractionPreMessageText:empty {
padding-right: 0
}
.videoAdUiBrandInteractionHorizontalRect .videoAdUiBrandInteractionButton {
background: none;
height: 100%;
margin: 0;
width: 100%
}
.videoAdUiBrandInteractionHorizontalRect .videoAdUiBrandInteractionLikeButton {
padding-right: 10px
}
.videoAdUiBrandInteractionHorizontalRect .videoAdUiBrandInteractionDislikeButton {
padding-left: 10px
}
.videoAdUiBrandInteractionHorizontalRect .videoAdUiBrandInteractionButtonContainer {
display: inline-block;
height: 22px;
vertical-align: middle
}
.videoAdUiBrandInteractionHorizontalRect .videoAdUiBrandInteractionButton:hover {
border: none;
box-shadow: none
}
.videoAdUiBrandInteractionHorizontalRect .videoAdUiBrandInteractionButton.selected {
box-shadow: none
}
.videoAdUiBrandInteractionHorizontalRect.videoAdUiBrandInteractionUnit.optionSelected {
background: #4182ef;
opacity: 1
}
.videoAdUiBrandInteractionHorizontalRect .videoAdUiBrandInteractionLikeIcon, .videoAdUiBrandInteractionHorizontalRect .videoAdUiBrandInteractionDislikeIcon {
opacity: 0.7
}
.videoAdUiBrandInteractionHorizontalRect .videoAdUiBrandInteractionLikeButton.selected .videoAdUiBrandInteractionLikeIcon, .videoAdUiBrandInteractionHorizontalRect .videoAdUiBrandInteractionDislikeButton.selected .videoAdUiBrandInteractionDislikeIcon, .videoAdUiBrandInteractionHorizontalRect .videoAdUiBrandInteractionLikeButton:hover > .videoAdUiBrandInteractionLikeIcon, .videoAdUiBrandInteractionHorizontalRect .videoAdUiBrandInteractionDislikeButton:hover > .videoAdUiBrandInteractionDislikeIcon {
opacity: 1
}
.videoAdUiBrandInteractionHorizontalRect .videoAdUiBrandInteractionLikeButton:hover ~ .videoAdUiLikeMsg, .videoAdUiBrandInteractionHorizontalRect .videoAdUiBrandInteractionDislikeButton:hover ~ .videoAdUiDislikeMsg {
bottom: 46px;
display: inline;
right: 20px
}
@media all and (max-width: 656px) {
.videoAdUiBrandInteractionButtonContainer {
display: inline-block
}
.videoAdUiBrandInteractionButton {
height: 40px;
width: 40px
}
.videoAdUiBrandInteractionLikeButton:hover ~ .videoAdUiLikeMsg, .videoAdUiBrandInteractionDislikeButton:hover ~ .videoAdUiDislikeMsg, .videoAdUiBrandInteractionHorizontalRect .videoAdUiBrandInteractionLikeButton:hover ~ .videoAdUiLikeMsg, .videoAdUiBrandInteractionHorizontalRect .videoAdUiBrandInteractionDislikeButton:hover ~ .videoAdUiDislikeMsg, .videoAdUiBrandInteractionHorizontalRect .videoAdUiBrandInteractionPreMessageText {
display: none
}
}
.videoAdUiReasonToWatchBox {
background: rgba(0, 0, 0, 0.7);
bottom: 142px;
height: auto;
max-width: 245px;
opacity: 1;
padding: 16px 10px 15px;
pointer-events: auto;
position: absolute;
right: 0;
text-shadow: none;
z-index: 1000
}
.videoAdUiReasonToWatchBox.videoAdUiReasonToWatchBoxWhiteTheme {
background: rgba(255, 255, 255, 0.7)
}
.videoAdUiReasonToWatchText {
color: rgba(255, 255, 255, 1);
font-size: 12px;
font-weight: bold;
line-height: 14px;
opacity: 0;
text-shadow: none
}
.videoAdUiReasonToWatchDynamicBox {
max-width: 265px;
padding: 7px 10px
}
.videoAdUiReasonToWatchDynamicPrefixText {
color: rgba(255, 255, 255, 0.5);
font-size: 12px;
line-height: 14px
}
.videoAdUiReasonToWatchDynamicTopic {
color: rgba(255, 255, 255, 1);
font-size: 14px;
font-weight: bold;
line-height: 18px
}
.videoAdUiReasonToWatchBoxWhiteTheme .videoAdUiReasonToWatchText, .videoAdUiReasonToWatchBoxWhiteTheme .videoAdUiReasonToWatchDynamicTopic {
color: rgba(0, 0, 0, 1)
}
.videoAdUiReasonToWatchBoxWhiteTheme .videoAdUiReasonToWatchDynamicPrefixText {
color: rgba(0, 0, 0, 0.5)
}
@media all and (max-width: 656px) {
.videoAdUiReasonToWatchBox {
display: none
}
}
.videoAdUiSkipContainer {
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
bottom: 22px;
cursor: pointer;
padding: 15px 0 15px 15px;
pointer-events: auto;
position: absolute;
right: 0;
z-index: 1000
}
.videoAdUiRedesign .videoAdUiSkipContainer {
bottom: 74px;
padding: 0
}
.videoAdUiRedesign .videoAdUiSkipContainer.skipBottomMarginMedium {
bottom: 68px
}
.videoAdUi-mobile .videoAdUiSkipContainer {
bottom: 11px;
padding: 8px 0 8px 8px
}
.videoAdUi-mobile.videoAdUiRedesign .videoAdUiSkipContainer {
bottom: 30px;
padding: 0
}
.videoAdUiSkipContainer.videoAdUiHighSkipContainer {
bottom: auto;
top: 15%
}
.videoAdUiPreSkipButton {
background: rgba(0, 0, 0, 0.8);
min-width: 155px;
padding: 6px
}
.videoAdUi-mobile .videoAdUiPreSkipButton {
min-width: 105px
}
.videoAdUiRedesign .videoAdUiPreSkipButton, .videoAdUi-mobile.videoAdUiRedesign .videoAdUiPreSkipButton {
background: transparent;
display: inline-block;
font-size: 12px;
height: 52px;
min-width: 0;
padding: 0;
text-align: center
}
.videoAdUiPreviewText {
letter-spacing: 0.1px
}
.videoAdUiPreSkipText {
color: #e6e6e6;
font-size: 11px;
padding-right: 8px;
text-align: center;
display: inline-block;
width: 70px;
vertical-align: middle
}
.videoAdUiRedesign .videoAdUiPreSkipText {
color: inherit;
font-size: 12px;
width: auto;
max-width: 105px
}
.videoAdUiPreSkipButton.videoAdUiPreSkipButtonNoThumbnail {
box-sizing: border-box;
display: table
}
.videoAdUiPreSkipText.videoAdUiPreSkipTextOnly {
width: 100%;
padding-right: 0;
line-height: 21px
}
.videoAdUiPreSkipText.videoAdUiPreSkipTextOnlyCentered {
display: table-cell;
line-height: 1.4em;
padding-right: 0;
vertical-align: middle;
width: 100%
}
.videoAdUiPreSkipText.videoAdUiPreSkipTextForcedLineBreak {
max-width: none;
min-width: 82px;
padding: 0 10px;
white-space: pre-line
}
.videoAdUiPreSkipThumbnailContainer, .videoAdUiPreSkipThumbnail {
cursor: pointer;
display: inline-block;
vertical-align: middle
}
.videoAdUiPreSkipThumbnailImage {
display: block;
max-width: 78px;
max-height: 42px;
width: auto;
height: auto
}
.videoAdUiPreSkipContainerPlainThumbnailCountdown .videoAdUiPreSkipThumbnail {
position: relative;
display: inline-block
}
.videoAdUiPreSkipContainerPlainThumbnailCountdown .videoAdUiPreSkipText {
font-size: 14px
}
.videoAdUiPreSkipContainerPlainThumbnailCountdown .videoAdUiPreSkipThumbnailCountdown {
position: absolute;
height: 100%;
text-align: center;
width: 100%;
background: rgba(0, 0, 0, 0.4)
}
.videoAdUiPreSkipContainerPlainThumbnailCountdown .videoAdUiPreSkipThumbnailCountdown:before {
content: "";
display: inline-block;
height: 100%;
vertical-align: middle
}
.videoAdUiPreSkipContainerPlainThumbnailCountdown span.videoAdUiPreSkipTextTimeLeft {
font-size: 20px;
font-family: "Roboto", arial, sans-serif;
font-weight: bold;
display: inline-block;
vertical-align: middle
}
.videoAdUiRedesign .videoAdUiPreSkipThumbnailImage {
max-width: 92px;
max-height: 52px
}
.videoAdUiAction {
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
background: rgba(0, 0, 0, 0.8);
border: 1px solid rgba(255, 255, 255, 0.5);
border-right: 0;
box-sizing: content-box;
color: #fff;
cursor: pointer;
direction: ltr;
font-size: 18px;
min-width: 150px;
padding: 10px 7px;
text-align: center
}
.videoAdUiAction.autofocused:focus {
outline-width: 0
}
.videoAdUi-mobile .videoAdUiAction {
font-size: 16px;
min-width: 100px;
padding: 6px 7px
}
.videoAdUiRedesign .videoAdUiAction, .videoAdUi-mobile.videoAdUiRedesign .videoAdUiAction {
background: rgba(0, 0, 0, 0.7);
line-height: 45px;
min-width: 164px;
padding: 0
}
.videoAdUiRedesign .videoAdUiFixedPaddingSkipButton, .videoAdUi-mobile.videoAdUiRedesign .videoAdUiFixedPaddingSkipButton, .videoAdUiRedesignedSkipButton {
line-height: normal;
min-width: 0;
padding: 7px 6px 7px 10px;
width: auto
}
.videoAdUiAction:hover {
border-color: rgba(255, 255, 255, 1)
}
.videoAdUiRedesign .videoAdUiAction:hover {
background: rgba(0, 0, 0, 0.9)
}
.videoAdUiRedesign .videoAdUiSkipButtonWithThumbnail {
position: relative;
display: inline-block;
padding: 0;
vertical-align: middle
}
.videoAdUiSkipContainerWithThumbnail {
background: rgba(0, 0, 0, 0.4)
}
.videoAdUiSkipContainer.videoAdUiSkipContainerWithThumbnail {
cursor: default
}
.videoAdUiSkipContainer .videoAdUiAction.videoAdUiSkipButtonWithThumbnail {
border: none;
min-width: 0
}
.videoAdUiSkipContainer .videoAdUiSkipText {
display: inline-block;
vertical-align: middle;
text-align: center;
font-size: 14px;
padding-left: 12px;
padding-right: 12px
}
.videoAdUiSkipButtonWithThumbnail .videoAdUiSkipIconContainer {
position: absolute;
text-align: center;
height: 100%;
width: 100%;
background-color: rgba(0, 0, 0, 0.4)
}
.videoAdUiSkipButtonWithThumbnail .videoAdUiSkipIconContainer:hover {
background-color: rgba(0, 0, 0, 0.6)
}
.videoAdUiSkipButtonWithThumbnail .videoAdUiSkipIconContainer:before {
content: "";
display: inline-block;
height: 100%;
vertical-align: middle
}
.videoAdUiSkipButtonWithThumbnail .videoAdUiSkipIcon {
display: inline-block;
vertical-align: middle
}
.videoAdUiSkipIcon {
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAVCAAAAABjvpF0AAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAAAnRSTlMAAHaTzTgAAAACYktHRAD/h4/MvwAAAAlwSFlzAAALEwAACxMBAJqcGAAAAEFJREFUGNNjYKARmC+PYP//D2cghJEEEcIogjBhNEGIMIYgSBiL4P14DMH78RjaQUJoghAhFEGYEJIgQghJkB4AAG9cX5X8X+CRAAAAAElFTkSuQmCC");
background-repeat: no-repeat;
display: inline-block;
height: 25px;
margin-left: 2px;
vertical-align: middle;
width: 20px
}
.videoAdUiExperimentalSkipIcon {
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAQAAABKfvVzAAAABGdBTUEAALGPC/xhBQAAAAJiS0dEAP+Hj8y/AAAAZElEQVQ4y+3SwQmDQBBGYRFy9mYLSRXWEyvRRtKBbdhDUoTH8HkVllX+u++48GD2zTTNTYiPrnhDXeBnyAT+Zo9EgNUrE9iMmQCLvhTas2jXWY8jvbNPP5OsU5L1my0uPY2bCjtXdo6mqRVtTgAAAABJRU5ErkJggg==");
background-repeat: no-repeat;
display: inline-block;
height: 28px;
margin-left: 2px;
vertical-align: middle;
width: 24px
}
.videoAdUiFixedPaddingSkipButtonIcon {
height: 24px
}
.videoAdUiSkipButtonExperimentalText {
display: inline-block;
vertical-align: middle;
width: initial
}
.videoAdUiFixedPaddingSkipButtonText {
font-size: 18px
}
.videoAdUiHideIfEmpty:empty {
display: none
}
.videoAdUiPopupBackground {
background: rgba(0, 0, 0, 0.8);
display: table;
height: 100%;
left: 0;
margin: auto;
position: absolute;
top: 0;
width: 100%;
z-index: 9999
}
.videoAdUiPopupPositioner {
display: table-cell;
text-align: center;
vertical-align: middle
}
.videoAdUiPopupFrame {
background: white;
border: 1px solid black;
color: #767676;
display: inline-block;
text-shadow: none;
font-size: 14px;
min-width: 180px;
max-width: 50%;
padding: 14px;
text-align: left
}
.videoAdUiPopupFrame a, .videoAdUiPopupFrame a:hover {
color: #167ac6
}
.videoAdUiPopupFrame label {
display: block;
padding: 8px 0 0 8px
}
.videoAdUiPopupHeading {
color: #333;
font-family: "Roboto", arial, sans-serif;
font-weight: 500;
padding-bottom: 8px
}
.videoAdUiPopupBack {
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAZCAQAAABEULxHAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAAAmJLR0QA/4ePzL8AAAE3SURBVCjPbdK9TlsxGMbxn5N07RgCbfecCAkh4BYyViq9jEIFV4AQXxK9ii6VOnAHlajajl1ocpqlDGEs2doRyQw+5+AELFl67f/zvH5sOXxAEAWxqjBwZtm5i47Ho3DiNQ48aw8Rqkmg79Qb0PW/teAcNJCr8Gm+ed9xA0f2Xbbm4Gl8gHsu6eSwcY699xVaDTxpYBl2E6xx4Thup+Rh7F0NU/PCkbdpGUd2fHuI07HqMDndKe36nl+l48B2Vd/Y8WP+GfKLxRCrot7QHk70FOC5LWM3ubs9/GukZ4CWnk1lLmgPmTUClmwpTXPMzC8rCgLdXJBwEryoMnRt+J0ENWbmqhEs2TAxzfGiYN3ENMcp5Eol6FlzPY+5zTosi4u4DtlH6eNjnI545Z8zn5/6yPzxxUs/xXs6+1xY9HU/RAAAABl0RVh0U29mdHdhcmUAQWRvYmUgSW1hZ2VSZWFkeXHJZTwAAAAASUVORK5CYII=");
background-position: left bottom;
background-repeat: no-repeat;
background-size: auto 12px;
cursor: pointer;
display: inline-block;
height: 12px;
margin-right: 4px;
position: relative;
top: 1px;
width: 7px
}
.videoAdUiPopupHeading a {
text-decoration: underline
}
.videoAdUiWhyThisAdGenericMessage {
margin-top: 8px
}
.videoAdUiPopupText li {
list-style: disc;
margin-left: 29px
}
.videoAdUiWhyThisAdMute, .videoAdUiWhyThisAdControl {
background-position: left center;
background-repeat: no-repeat;
background-size: 13px auto;
display: block;
margin-top: 8px;
margin-left: 0;
padding-left: 20px
}
.videoAdUiWhyThisAdReasons {
margin-left: -9px
}
.videoAdUiWhyThisAdMute {
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAaCAQAAAADQ4RFAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAAAmJLR0QA/4ePzL8AAAHRSURBVDjLjZS/S1xBEMc/sz71FGPAE0QhlZyGcDk7m4sKiqdpbcRaENS0EvsUgqaMiJp/IH9AUPEUBA87RU2lbQotTvEHh9qsxd6+t+7dS5ximZ2333nf+e7OyHcANIIGeEuGPrKkSAJFziiwzzG3OCYOqJ5RJhkmgU1hrESen2zxZAM1OYvu4BsLfCDAt1q6GaOVI+5fgjplXSbEA0jkBfSSlgOuAZRGo9tZ1jntUiqTfuGN6h+0ASggwTwjwivsM/PUG1COaTdrHFwAZhgGRTNT1JqgeKSqkK1jijeKDIP887BnQ3xU9NNgf649ao56kd/IgCJrghrvSj31dDmJQDYgFX3WfziuqoOmh7Q5pSEVSNLJ/oulmErmSId+UlWWL2E1ceIHFGkJd+O8j6UXWTHgnFQoQdphHn8J54qCL2u0upI7dAuKPUq2Cd38mooHa9YSe4pTdn0qEuMDkOdUcctq1JNuXtcPoQ+scaeAbVb4j4VpVsib1nhkgY3Ku6pCb4NFHg0ILvnCpntMe56ByCwXEM2Ia9khIZkqY8XWssyc/DWbaBrds8MhTbwzLekQK/Gbr6xyYyNiX2j5TTST4RNZumgBrjhjnwInZlja1nkG3xODDIQnEl8AAAAZdEVYdFNvZnR3YXJlAEFkb2JlIEltYWdlUmVhZHlxyWU8AAAAAElFTkSuQmCC")
}
.videoAdUiWhyThisAdControl {
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAaCAQAAAADQ4RFAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAAAmJLR0QA/4ePzL8AAAIgSURBVDjLddRLbExhFAfw3zcz7Xg0TRs2LGgjISIkTdBVLSTqVU2x8Ahi27AithYWImnCRixEJGwIi6poozZ2Eo+ykZDSSgWN2JSkSqu5FnPnzr3M/Df3fOf1nfP/zrmhD0Ekhc0G1YsQ/Lbb87Kh7FfwP9ZamkqzthJURq5KUKs4JMSnWkHLNSSa9WVjBBsSnwbLS0K+E2GTIdvU+2ylC/Zlim7VYlTOQefCGU98IfRRdMMB8EqzlioFfzClDcLt6LjfBezUHRvb0hxlu4wL7rbDQE6zUxaWnEOlk1pY5LSmgqM6Km3Ht/xy33O067Ig+0Y6HCmYNacuw9dHJzwyi6JOl62IyS9hzmy+84X32jUmyhnHDJkH80a9s7eS1Ee9buZwK/QYTx7zgUeZLoYNlsUwpsed+HGjEe+S4p7Ft5Txx7Ok+FGvao1RbUTloYFNYXVi2CyfcSxoT+Q1NpaDDuuPWhOGumzPBO2wK5FX6XeIfGevq5oqPqFOhzET5lHU5YolKcobdftaUFAIySpEIla464GnaLdHfSqhiDr50NdkwJZ/O06n+QeP7c2ZctHPGjQl36S8aZd8z+GhgVg1Yqwq1WPRy1i6Z7i0hPMmbPXUeWf1q7cupJdwxnUnXfNGUeS0T6UlhGV+mI4ruWt/qrM7DsZVLtZoMj0Rk3EIkdeZzl4njU2XQqqP0fj/p5BRVfvvvfFNMd7JX96mWSzhL4j6lNZ9vzvEAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAABJRU5ErkJggg==")
}
.videoAdUiWhyThisAdControl::after {
content: "";
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAMAAAC6V+0/AAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAAPFBMVEUGeMn///8GeMkGeMkGeMkGeMkGeMkGeMkGeMkGeMkGeMkGeMkGeMkGeMkGeMkGeMkGeMkGeMkGeMn///8VCOQLAAAAE3RSTlMAAMwasq9ms64WG7S1FRytthSsZTwoggAAAAFiS0dEAf8CLd4AAABgSURBVBjTtc/LDoAgDETRUhAReVj//2OtTUAaYlx5lyeZxQD0sAcfKFk3I9vC+Iw824phG7GZEezbuN+mUQw0xoQhg8aSsLL5EcuBldjQcA2tO0lejQiZYMb2/0fUveIFbX4C1DkdHTwAAAAZdEVYdFNvZnR3YXJlAEFkb2JlIEltYWdlUmVhZHlxyWU8AAAAAElFTkSuQmCC");
background-position: right center;
background-repeat: no-repeat;
background-size: 10px auto;
padding-left: 12px
}
.videoAdUiPopupButtons {
margin-top: 8px;
text-align: right
}
.videoAdUiPopupButtons button {
font-family: "Roboto", arial, sans-serif;
font-weight: 500;
margin: 4px 0 0 12px;
padding: 10px
}
.videoAdUiPopupButton, .videoAdUiPopupDefaultButton, .videoAdUiPopupButton:hover, .videoAdUiPopupDefaultButton:hover {
color: #167ac6;
cursor: pointer;
text-transform: uppercase
}
.videoAdUiPopupCloseIcon {
height: 24px;
opacity: 0.75;
cursor: pointer;
position: absolute;
right: 14px;
top: 14px;
width: 24px
}
.videoAdUiPopupCloseIcon:hover {
opacity: 1
}
@media all and (min-width: 800px) and (min-height: 400px) {
.videoAdUiTitle {
font-size: 15px
}
.videoAdUiRedesign .videoAdUiTitle {
font-size: 17px
}
.videoAdUiAttribution {
font-size: 13px
}
.videoAdUiRedesign .videoAdUiAttribution {
font-size: 12px
}
.videoAdUiAttribution-gvn {
font-size: 16px !important
}
.videoAdUiPreSkipButton {
min-width: 200px
}
.videoAdUiPreSkipText {
font-size: 13px;
width: 105px;
padding-right: 6px
}
.videoAdUiPreSkipText.videoAdUiPreSkipTextOnly {
font-size: 13px
}
.videoAdUiPreSkipText.videoAdUiPreSkipTextOnlyCentered {
font-size: 13px;
line-height: 1.3em
}
.videoAdUiPreSkipThumbnailImage {
max-width: 98px;
max-height: 52px
}
.videoAdUiShare {
font-size: 15px
}
.videoAdUiAction {
font-size: 23px;
min-width: 200px
}
}
.videoAdUi.blazer .videoadUiTitle, .videoAdUi.blazer .videoAdUiLearnMore, .videoAdUi.blazer .videoAdUiAttribution, .videoAdUi.blazer .videoAdUiPreSkipButton {
font-family: "Helvetica Neue Light", "Arial", sans-serif
}
.videoAdUi.blazer .videoAdUiProgressBar {
background-color: #222;
height: 4px
}
.videoAdUi.blazer .videoAdUiProgress {
background-image: none;
background-color: #e6bc27;
opacity: 1;
position: absolute
}
.videoAdUi.blazer .videoAdUiBuffer {
background-color: #666;
display: block;
position: absolute
}
.videoAdUi.blazer .videoAdUiAuthorName {
display: none
}
.videoAdUi.blazer .videoadUiTitle {
font-size: 14px;
text-shadow: 0 0 2px rgba(0, 0, 0, 0.75)
}
.videoAdUi.blazer .videoAdUiLearnMore {
font-size: 14px
}
.videoAdUi.blazer .videoAdUiAttribution {
font-size: 16px;
text-shadow: 0 0 2px rgba(0, 0, 0, 0.5)
}
.videoAdUi.blazer .videoAdUiAction, .videoAdUi.blazer .videoAdUiPreSkipButton {
font-size: 13px;
min-height: 24px;
min-width: 95px;
width: 95px
}
.videoAdUi.blazer .videoAdUiFixedPaddingSkipButton {
line-height: normal;
min-width: 0;
padding: 7px 6px 7px 10px;
width: auto
}
.videoAdUi.blazer .videoAdUiFixedPaddingSkipButtonText {
font-size: 13px
}
.videoAdUi.blazer .videoAdUiAction {
border: 1px solid rgba(255, 255, 255, 0.25);
border-right-width: 0;
height: 23px;
background-color: rgba(0, 0, 0, 0.5)
}
.videoAdUi.blazer .videoAdUiPreSkipButton {
background-color: rgba(0, 0, 0, 0.25);
text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.75)
}
.videoAdUi.blazer .videoAdUiPreSkipText {
padding: 5px 0
}
.videoAdUi.blazer .videoAdUiPreSkipButton.videoAdUiPreSkipButtonNoThumbnail {
display: inline-block
}
.videoAdUi.blazer .videoAdUiPreSkipText.videoAdUiPreSkipTextOnly {
line-height: inherit
}
.videoAdUi.blazer .videoAdUiPreSkipText.videoAdUiPreSkipTextOnlyCentered {
display: inherit;
line-height: inherit
}
.videoAdUi.blazer .videoAdUiLearnMore {
text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.75);
margin: 5px;
margin-right: 10px
}
.videoAdUi.blazer.phone .videoAdUiAuthorIcon, .videoAdUi.blazer.phone .videoadUiTitle {
display: none
}
.videoAdUi.blazer.phone .videoAdUiAttribution {
font-size: 14px
}
.videoAdUi.blazer.phone .videoAdUiAction {
padding: 6px 0
}
.videoAdUi.blazer.phone .videoAdUiSkipIcon {
margin-left: 6px
}
.videoAdUi.blazer.phone .videoAdUiFixedPaddingSkipButton {
line-height: normal;
min-width: 0;
padding: 7px 6px 7px 10px;
width: auto
}
.videoAdUi.blazer.tablet .videoAdUiAuthorIcon {
left: 0;
position: absolute
}
.videoAdUi.blazer.tablet .videoadUiTitle {
left: 0;
position: absolute;
margin-top: 17px
}
.videoAdUi.blazer.tablet .videoAdUiAuthorIcon {
margin: 5px 10px
}
.videoAdUi.blazer.tablet .videoAdUiAction, .videoAdUi.blazer.tablet .videoAdUiPreSkipButton {
min-width: 95px;
width: 95px;
min-height: 24px;
font-size: 13px;
text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.75)
}
.videoAdUi.blazer.tablet .videoAdUiFixedPaddingSkipButton {
line-height: normal;
min-width: 0;
padding: 7px 6px 7px 10px;
width: auto
}
.videoAdUi.blazer.tablet .videoAdUiPreSkipContainer, .videoAdUi.blazer.tablet .videoAdUiSkipContainer {
bottom: 55px
}
.videoAdUi.blazer.tablet .videoAdUiAttribution {
left: 0;
bottom: 0
}