#previewbar { overflow: visible; padding: 0; margin: 0; position: absolute; width: 100%; pointer-events: none; height: 100%; transform: scaleY(0.6) translateY(-30%) translateY(1.5px); z-index: 40; transition: transform .1s cubic-bezier(0,0,0.2,1); } #previewbar.hovered { transform: scaleY(1) } .previewbar { display: inline-block; height: 100%; } /* Preview Bar page hacks */ .ytp-tooltip:not(.sponsorCategoryTooltipVisible) .sponsorCategoryTooltip { display: none !important; } .ytp-tooltip.sponsorCategoryTooltipVisible { transform: translateY(-1em) !important; } .ytp-big-mode .ytp-tooltip.sponsorCategoryTooltipVisible { transform: translateY(-2em) !important; } #movie_player:not(.ytp-big-mode) .ytp-tooltip.sponsorCategoryTooltipVisible > .ytp-tooltip-text-wrapper { transform: translateY(1em) !important; } .ytp-big-mode .ytp-tooltip.sponsorCategoryTooltipVisible > .ytp-tooltip-text-wrapper { transform: translateY(0.5em) !important; } .ytp-big-mode .ytp-tooltip.sponsorCategoryTooltipVisible > .ytp-tooltip-text-wrapper > .ytp-tooltip-text { display: block !important; transform: translateY(1em) !important; } /* */ .popup { z-index: 10; width: 100%; height: 500px; } .smallLink { font-size: 10px; text-decoration: underline; cursor: pointer; } .playerButtonImage { height: 60%; top: 0; bottom: 0; display: block; margin: auto; } .playerButton { vertical-align: top; } #infoButton.playerButton:not(.hidden) { transform: translateX(0%) scale(1); /* opacity is from YouTube page */ transition: transform 0.2s, opacity .1s cubic-bezier(0.4,0.0,1,1) !important; } #infoButton.playerButton.hidden { transform: translateX(100%) scale(0); /* opacity is from YouTube page */ transition: transform 0.2s, opacity .1s cubic-bezier(0.4,0.0,1,1) !important; } .playerButton.hidden { display: none; } .sponsorSkipObject { font-family: Roboto, Arial, Helvetica, sans-serif; margin-left: 2px; margin-right: 2px; } .sponsorSkipLogo { height: 18px; float: left; } @keyframes fadeIn { from { opacity: 0; } } @keyframes fadeOut { to { opacity: 0; } } .sponsorBlockSpacer { background-color: rgb(100, 100, 100); border-color: rgb(100, 100, 100); margin-left: 5px; } .sponsorSkipNoticeParent { position: absolute; bottom: 100px; right: 10px; padding-left: 5px; padding-right: 5px; } .sponsorSkipNoticeParent, .sponsorSkipNotice { min-width: 350px; border-radius: 5px; border-spacing: 5px 10px; border-collapse: unset; } .sponsorSkipNotice { min-width: 350px; background-color: rgba(28, 28, 28, 0.9); transition: all 0.1s ease-out; } .sponsorSkipNotice .hidden { display: none; } /* For Cloudtube */ .sponsorSkipNotice td, .sponsorSkipNotice table, .sponsorSkipNotice th { border: none; } .sponsorSkipNoticeFadeIn { animation: fadeIn 0.5s ease-out; } .sponsorSkipNoticeFaded { opacity: 0.3; } .sponsorSkipNoticeFadeOut { transition: opacity 3s cubic-bezier(0.55, 0.055, 0.675, 0.19); opacity: 0 !important; animation: none !important; } .sponsorSkipNotice .sponsorSkipNoticeTimeLeft { color: #eeeeee; border-radius: 4px; padding: 2px 5px; font-size: 12px; display: flex; align-items: center; border: 1px solid #eeeeee; } .sponsorSkipNoticeTimeLeft img { vertical-align: middle; height: 13px; padding-top: 7.8%; padding-bottom: 7.8%; } /* if two are very close to eachother */ .secondSkipNotice { bottom: 250px; transition: bottom 0.2s; } .noticeLeftIcon { display: flex; align-items: center; } .sponsorSkipNotice .sponsorSkipNoticeUnskipSection { float: left; border-left: 1px solid rgb(150, 150, 150); } .sponsorSkipNoticeButton { background: none; color: rgb(235, 235, 235); border: none; display: inline-block; font-size: 13.3333px !important; cursor: pointer; margin-right: 10px; padding: 2px 5px; } .sponsorSkipNoticeButton:hover { background-color: rgba(235, 235, 235,0.2); border-radius: 4px; transition: background-color 0.4s; } .sponsorTimesVoteButtonsContainer { float: left; padding: 2px 5px; margin-right: 4px; } .sponsorSkipNoticeRightSection { right: 0; position: absolute; float: right; margin-right: 10px; display: flex; align-items: center; } .sponsorSkipNoticeRightButton { margin-right: 0; } .sponsorSkipNoticeCloseButton { height: 10px; width: 10px; box-sizing: unset; padding: 2px 5px; margin-left: 2px; float: right; } .sponsorSkipMessage { font-size: 14px; font-weight: bold; color: rgb(235, 235, 235); margin-top: auto; display: inline-block; margin-right: 10px; } .sponsorSkipInfo { font-size: 10px; color: #000000; text-align: center; margin-top: 0px; } #sponsorTimesThanksForVotingText { font-size: 20px; font-weight: bold; color: #000000; text-align: center; margin-top: 0px; margin-bottom: 0px; } #sponsorTimesThanksForVotingInfoText { font-size: 12px; font-weight: bold; color: #000000; text-align: center; margin-top: 0px; } .sponsorTimesVoteButtonMessage { float: left; } .sponsorTimesInfoMessage { font-size: 13.3333px; color: rgb(235, 235, 235); text-align: center; } .voteButton { height: 17px; cursor: pointer; } .voteButton:hover { filter: brightness(80%); } .submitButton { background-color:#ec1c1c; -moz-border-radius:28px; -webkit-border-radius:28px; border-radius:28px; border:1px solid #d31919; display:inline-block; cursor:pointer; color:#ffffff; font-size:14px; padding:4px 15px; text-decoration:none; text-shadow:0px 0px 0px #662727; margin-top: 5px; margin-right: 15px; } .submitButton:hover { background-color:#bf2a2a; } .submitButton:focus { outline: none; background-color:#bf2a2a; } .submitButton:active { position:relative; top:1px; } @keyframes rotate { from { transform: rotate(0deg); } to { transform: rotate(360deg); } } .sponsorSkipButton { background-color:#ec1c1c; -moz-border-radius:28px; -webkit-border-radius:28px; border-radius:28px; border:1px solid #d31919; display:inline-block; cursor:pointer; color:#ffffff; font-size:14px; padding:4px 15px; text-decoration:none; text-shadow:0px 0px 0px #662727; margin-top: 5px; margin-right: 15px; } .sponsorSkipButton:hover { background-color:#bf2a2a; } .sponsorSkipButton:focus { outline: none; background-color:#bf2a2a; } .sponsorSkipButton:active { position:relative; top:1px; } .sponsorSkipDontShowButton { -moz-box-shadow:inset 0px 1px 0px 0px #cf866c; -webkit-box-shadow:inset 0px 1px 0px 0px #cf866c; box-shadow:inset 0px 1px 0px 0px #cf866c; background-color:#d0451b; -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px; border:1px solid #942911; display:inline-block; cursor:pointer; color:#ffffff; font-size:13px; padding:6px 24px; text-decoration:none; text-shadow:0px 1px 0px #854629; } .sponsorSkipDontShowButton:hover { background-color:#bc3315; } .sponsorSkipDontShowButton:focus { outline: none; background-color:#bc3315; } .sponsorSkipDontShowButton:active { position:relative; top:1px; } /* Submission Notice */ .sponsorTimeDisplay { font-size: 15px; } .sponsorTimeEditButton { text-decoration: underline; margin-left: 20px; margin-right: 20px; font-size: 13px; cursor: pointer; } .sponsorTimeEdit > input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; } .sponsorTimeMessagesRow { max-height: 300px; display: flex; overflow: auto; } .sponsorTimeEdit { font-size: 14px; -moz-appearance: textfield; } .sponsorTimeEditInput { width: 90px; } .sponsorNowButton { font-size: 11px; cursor: pointer; text-decoration: underline; } .sponsorTimeCategories { margin-top: 5px; margin-bottom: 5px; background-color: rgba(28, 28, 28, 0.9); border-color: rgb(130,0,0,0.9); color: white; border-width: 3px; padding: 3px; } .helpButton { height: 25px; cursor: pointer; padding: 5px; margin: auto; top: 0; bottom: 0; position: absolute; } .helpButton:hover { filter: brightness(80%); }