Advertisement
Guest User

naacp

a guest
Jan 19th, 2017
91
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 47.98 KB | None | 0 0
  1. @-moz-document domain(youtube.com) {
  2.  
  3. /* GENERAL */
  4. html {
  5. overflow-x: hidden;
  6. height: 100% !important;
  7. }
  8. * {
  9. font-family: "Roboto" !important;
  10. }
  11. a,
  12. a:hover,
  13. .title,
  14. .title:hover {
  15. text-decoration: none !important;
  16. }
  17. .title:hover,
  18. .yt-uix-sessionlink.yt-uix-tile-link.yt-ui-ellipsis.yt-ui-ellipsis-2.spf-link:hover {
  19. color: #D9BFC2 !important;
  20. }
  21. .yt-uix-sessionlink.yt-ui-ellipsis.yt-ui-ellipsis-2.spf-link:hover,
  22. .feed-item-container .yt-uix-sessionlink.yt-uix-tile-link.spf-link.yt-ui-ellipsis.yt-ui-ellipsis-2:hover {
  23. color: #3f3f3f !important;
  24. }
  25. #page-container {
  26. margin-top: 2px !important;
  27. }
  28. #page {
  29. margin-left: 45px !important;
  30. }
  31.  
  32.  
  33. body, #page-container, .compact-shelf .yt-uix-button-shelf-slider-pager, .comment-simplebox-text, .comment-simplebox-prompt, .yt-gb-shelf-paddle {
  34. background-color: #fff !important;
  35. }
  36.  
  37.  
  38. /** HEADER **/
  39. #masthead-positioner {
  40. height: 100% !important;
  41. width: 10px !important;
  42. margin-left: -2px !important;
  43. }
  44. #yt-masthead-container {
  45. background: #3f3f3f !important;
  46. border-bottom: 0px solid #fff;
  47. height: 100% !important;
  48. width: 17px !important;
  49. margin-left: -18px !important;
  50. }
  51. /*** LOGO ***/
  52. #yt-masthead #logo-container .logo {
  53. background-image: url("http://i.imgur.com/n02Oi7Z.png") !important;
  54. background-repeat: no-repeat !important;
  55. background-position: 66% 50% !important;
  56. background-size: 15px auto !important;
  57. width: 76px !important;
  58. height: 56px;
  59. position: absolute !important;
  60. background-color: #D9BFC2 !important;
  61. top: -22px !important;
  62. left: -29px !important;
  63. }
  64. #yt-masthead #logo-container.doodle img {
  65. padding: 0px 0px 0px 76px !important;
  66. }
  67. #yt-masthead #logo-container span.content-region {
  68. display: none !important;
  69. }
  70. #yt-masthead #logo-container.doodle img {
  71. background: none;
  72. width: 0px !important;
  73. padding: 0px 0px 0px 260px;
  74. }
  75. /*** SEARCH ***/
  76. #masthead-search {
  77. padding-bottom: 30px !important;
  78. }
  79. #yt-masthead-content {
  80. position: absolute !important;
  81. left: 40px !important;
  82. top: 227px !important;
  83. width: 20px !important;
  84. height: 50px !important;
  85. transition: all .5s ease-in-out !important;
  86. }
  87. #yt-masthead-content:hover {
  88. width: 450px !important;
  89. transition: all .5s ease-in-out !important;
  90. }
  91. #masthead-search .search-btn-component {
  92. height: 41px !important;
  93. float: left !important;
  94. background: transparent !important;
  95. border: none !important;
  96. height: 0px !important;
  97. width: 0px !important;
  98. padding: 11px !important;
  99. margin-left: -2.5px !important;
  100. margin-top: 8px !important;
  101. box-shadow: none !important;
  102. margin-right: 10px !important;
  103. opacity: 0;
  104. }
  105. #yt-masthead-content {
  106. background-color: #3f3f3f !important;
  107. background-image: url("http://www.clipartkid.com/images/775/search-icon-clip-art-at-clker-com-vector-clip-art-online-royalty-643l5L-clipart.png") !important;
  108.  
  109. background-position: center left !important;
  110. background-repeat: no-repeat !important;
  111. background-size: 17px auto !important;
  112. margin-top: -3px !important;
  113. }
  114. #masthead-search-terms {
  115. background: #3f3f3f !important;
  116. border: none !important;
  117. box-shadow: none !important;
  118. height: 41px !important;
  119. }
  120. #masthead-search-terms input {
  121. color: #FFF !important;
  122. font-family: "Roboto"!important;
  123. font-size: 13pt !important;
  124. font-weight: bold !important;
  125. margin-bottom: 20px !important;
  126. }
  127. /*** MENU ***/
  128. #appbar-guide-button {
  129. position: absolute !important;
  130. margin-top: 58px !important;
  131. margin-left: -1px !important;
  132.  
  133. }
  134. #appbar-guide-menu {
  135. position: fixed !important;
  136. left: 59px !important;
  137. margin-top: 0px !important;
  138. max-height: 100% !important;
  139. box-shadow: none !important;
  140. border: 1px solid #fff !important;
  141. border-width: 0px 1px 1px 0px !important;
  142. overflow-y: hidden !important;
  143.  
  144. }
  145. #what_to_watch-guide-item {
  146. background: no-repeat url("https://i.imgur.com/rY5RHWP.jpg") center 60% !important;
  147. background-size: auto 200px !important;
  148. margin-left: -22px !important;
  149. margin-top: -14px !important;
  150. margin-bottom: 20px !important;
  151. padding: 14px !important;
  152. width: 109% !important;
  153. }
  154. .guide-item.yt-uix-sessionlink.yt-valign.spf-link.guide-item-selected[title="Home"] {
  155. opacity: 0;
  156. }
  157. .guide-item.yt-uix-sessionlink.yt-valign.spf-link.guide-item-selected {
  158. background: transparent !important;
  159. color: #3f3f3f !important;
  160. font-weight: bold !important;
  161. text-shadow: none !important;
  162. }
  163. #what_to_watch-guide-item a,
  164. guide-item.yt-uix-sessionlink.yt-valign.spf-link.guide-item-selected span {
  165. color: transparent !important;
  166. }
  167. .guide-user-links.yt-uix-tdl.yt-box .thumb {
  168. display: none !important;
  169. }
  170. #appbar-guide-menu .guide-section-separator {
  171. visibility: hidden;
  172. }
  173. .guide-item .guide-count {
  174. color: #A98D9B !important;
  175. font-size: 9pt !important;
  176. font-weight: bold !important;
  177. }
  178. .guide-item.yt-uix-sessionlink.yt-valign.spf-link:hover {
  179. background: transparent !important;
  180. color: #3f3f3f !important;
  181. font-weight: bold !important;
  182. }
  183. li.guide-section h3 a {
  184. border-bottom: 2px solid #cccaca !important;
  185. color: #3f3f3f !important;
  186. font-family: "Bebas Neue" !important;
  187. font-size: 16pt !important;
  188. font-weight: bold !important;
  189. padding: 10px 0px !important;
  190. }
  191. li.guide-section h3 a:hover {
  192. text-decoration: none !important;
  193. }
  194. .yt-uix-button-icon-hover-action-menu {
  195. background: no-repeat url("https://cdn3.iconfinder.com/data/icons/faticons/32/arrow-down-01-128.png") center !important;
  196. background-size: cover !important;
  197. margin-top: 10px !important;
  198. }
  199. /*** USER ***/
  200. #yt-masthead-user {
  201. position: absolute !important;
  202. margin-top: 100px !important;
  203. margin-left: 10px !important;
  204. }
  205. #upload-btn {
  206. background-color: transparent !important;
  207. background: url('http://i.imgur.com/naGokm2.png') !important;
  208. background-size: 35px auto !important;
  209. background-repeat: no-repeat !important;
  210. background-position: center !important;
  211. border: none !important;
  212. box-shadow: none !important;
  213. color: transparent !important;
  214. opacity: .5 !important;
  215. margin-right: 15px;
  216. margin-left: -4px !important;
  217. filter: brightness(0) invert(1) !important;
  218. filter: grayscale(100%) contrast(25%) !important;
  219. }
  220. .yt-uix-button-icon-material-upload.yt-sprite {
  221. display: none;
  222. }
  223. #yt-masthead-notifications-button::before {
  224. display: none !important;
  225. }
  226. #yt-masthead-notifications-button {
  227. background: no-repeat url("http://i.imgur.com/omK5Bl1.png") center !important;
  228. background-size: 28px auto !important;
  229. opacity: .7 !important;
  230. margin-left: -8.8px !important;
  231. margin-top: 10px !important;
  232. filter: grayscale(100%) contrast(25%) !important;
  233. }
  234. .yt-uix-button-icon.yt-uix-button-icon-bell.yt-sprite {
  235. display: none !important;
  236. }
  237. #yt-masthead-user .yt-masthead-user-icon {
  238. border-radius: 0% !important;
  239. margin-top: 15px !important;
  240. margin-left: -7px !important;
  241. border-radius: 0% !important;
  242. margin-top: 16px !important;
  243. margin-left: -8px !important;
  244. padding-top: 40px !important;
  245. background: no-repeat url("http://www.myiconfinder.com/uploads/iconsets/37ca743a29e155658596b7f6310b8d53-heart.png") center top !important;
  246. background-size: 25px auto !important;
  247. }
  248. .yt-thumb-clip img {
  249. border-radius: 1px !important;
  250. }
  251. .yt-masthead-picker-footer .yt-masthead-picker-button span,
  252. .yt-masthead-picker-info a.yt-uix-button span {
  253. font-size: 13px !important;
  254. text-transform: lowercase !important;
  255. }
  256. .yt-masthead-picker-footer .yt-masthead-picker-button,
  257. .yt-masthead-picker-info a.yt-uix-button {
  258. border: 1px solid #fff !important;
  259. padding-top: 2px !important;
  260. }
  261. .signin-container {
  262. position: absolute !important;
  263. right: 3px !important;
  264. top: 110px !important;
  265. }
  266. .yt-uix-button.yt-uix-button-size-default.yt-uix-button-primary {
  267. background: no-repeat url("http://www.myiconfinder.com/uploads/iconsets/37ca743a29e155658596b7f6310b8d53-heart.png") center top !important;
  268. background-size: 25px auto !important;
  269. background-color: transparent !important;
  270. border: none !important;
  271. color: transparent !important;
  272. }
  273. .yt-uix-clickcard-card {
  274. position: fixed !important;
  275. left: 70px !important;
  276. margin-top: -150px !important;
  277. }
  278. .yt-masthead-picker-header.yt-masthead-picker-active-account,
  279. .yt-uix-clickcard-card.yt-masthead-multilogin .yt-masthead-multilogin-users-header {
  280. background: #3f3f3f !important;
  281. color: #FFF !important;
  282. font-weight: 700 !important;
  283. font-size: 10pt !important;
  284. text-transform: lowercase !important;
  285. padding: 10px !important;
  286. }
  287. .yt-uix-clickcard-card-border, .yt-uix-hovercard-card-border {
  288. float: left;
  289. background: #fff;
  290. border: none !important;
  291. box-shadow: none !important;
  292. }
  293. .sb-card-border {
  294. background: none repeat scroll 0 0 #fff;
  295. border: none !important;
  296. box-shadow: none !important;
  297. position: fixed !important;
  298. left: 80px !important;
  299. }
  300. .sb-card-arrow,
  301. .sb-card-body-arrow,
  302. .yt-uix-clickcard-card-reverse .yt-uix-card-border-arrow-vertical,
  303. .yt-uix-clickcard-card.yt-masthead-multilogin .yt-uix-card-body-arrow,
  304. .yt-uix-card-body-arrow.yt-uix-card-body-arrow-vertical {
  305. display: none !important;
  306. }
  307. /** FOOTER **/
  308. body #footer-container {
  309. display: none !important;
  310. }
  311.  
  312. /* HOME SECTION */
  313. /** CARDS **/
  314. .branded-page-v2-container.branded-page-base-bold-titles.branded-page-v2-container-flex-width.branded-page-v2-secondary-column-hidden .yt-card {
  315. background: transparent !important;
  316. box-shadow: none !important;
  317. }
  318. .feed-item-container.browse-list-item-container.yt-section-hover-container.compact-shelf.shelf-item.branded-page-box.clearfix {
  319. background: #FFF !important;
  320. box-shadow: none !important;
  321. border: none !important;
  322. margin-top: 10px !important;
  323. }
  324. .multirow-shelf .yt-uix-expander-head {
  325. background: #fff !important;
  326. color: #FFF !important;
  327. font-size: 14px !important;
  328. font-weight: bold !important;
  329. padding: 10px 10px 10px 16px !important;
  330. text-align: center !important;
  331. text-transform: lowercase !important;
  332. width: 100% !important;
  333. margin-left: -18px !important;
  334. margin-right: 10px;
  335. margin-top: 20px !important;
  336. margin-bottom: -15px !important;
  337. }
  338. /** TITLE **/
  339. .shelf-item .shelf-title-table {
  340. background: #Fff !important;
  341. padding: 20px 16px 13px 20px !important;
  342. margin-left: -18px !important;
  343. margin-top: -15px !important;
  344. margin-bottom: 17px !important;
  345. }
  346. .section-list > li:nth-child(2) .shelf-title-table {
  347. background: no-repeat url("https://i.imgur.com/6v5pU6e.png") center !important;
  348. background-size: cover !important;
  349. }
  350. .section-list > li:nth-child(2) .shelf-title-table a,
  351. .section-list > li:nth-child(2) .shelf-title-table span {
  352. color: #FFF !important;
  353. }
  354. .exp-responsive .shelf-item .branded-page-module-title .branded-page-module-title-link,
  355. .exp-responsive .shelf-item .branded-page-module-title .branded-page-module-title-text {
  356. font-size: 20px !important;
  357. }
  358.  
  359. /** VIDEOS **/
  360. .section-list .video-time {
  361. background-color: #3f3f3f !important;
  362. font-family: "Roboto" !important;
  363. font-weight: bold !important;
  364. padding: 7px 10px 7px 10px !important;
  365. opacity: 1 !important;
  366. text-align: left !important;
  367. width: 100% !important;
  368. margin-bottom: -2px !important;
  369. margin-right: -20px !important;
  370. position: absolute !important;
  371. left: -1px !important;
  372. }
  373. .yt-uix-button-empty .yt-uix-button-arrow {
  374. display: none;
  375. }
  376.  
  377. /* SEARCH SECTION */
  378. /** CARDS **/
  379. #results {
  380. background: #FFF !important;
  381. box-shadow: none !important;
  382. padding-bottom: 6px !important;
  383. }
  384. #results .yt-lockup-tile {
  385. padding: 10px 15px;
  386. background: #FFF !important;
  387. }
  388. /** BANNER **/
  389. #results .branded-page-v2-subnav-container {
  390. background: no-repeat url("https://i.imgur.com/VunmQNf.jpg") center !important;
  391. background-size: cover !important;
  392. padding: 16px 16px 18px 20px !important;
  393. margin-bottom: 5px !important;
  394. }
  395. .search-header {
  396. border-bottom: none !important;
  397. }
  398. .num-results.first-focus {
  399. font-size: 20px !important;
  400. color: #FFF !important;
  401. font-weight: 500 !important;
  402. text-transform: lowercase !important;
  403. }
  404. .yt-uix-button.yt-uix-button-size-small.yt-uix-button-default.filter-button {
  405. border: none !important;
  406. box-shadow: none !important;
  407. background: transparent !important;
  408. margin-top: -12px !important;
  409. margin-left: -18px !important;
  410. }
  411. .yt-uix-button-arrow {
  412. filter: brightness(0) invert(1) !important;
  413. }
  414. .search-header .num-results, .search-header .num-results strong, .search-header .yt-uix-button-content {
  415. color: #FFF !important;
  416. font-size: 20px !important;
  417. font-weight: 500 !important;
  418. }
  419. #filter-dropdown {
  420. padding: 7px !important;
  421. }
  422. .filter-col-title,
  423. .filter {
  424. color: #FFF;
  425. font-size: 16px;
  426. font-weight: bold !important;
  427. }
  428. #filter-dropdown span {
  429. color: #FFF !important;
  430. }
  431.  
  432. /* HISTORY SECTION */
  433. /** CARDS **/
  434. .branded-page-v2-subnav-container,
  435. .yt-lockup.yt-lockup-tile.yt-lockup-video.clearfix {
  436. background: #FFF !important;
  437. border-color: #fff !important;
  438. }
  439. .feed-item-container.browse-list-item-container.yt-section-hover-container.search-history-item.branded-page-box{
  440. background: #FFF !important;
  441. border-color: #fff !important;
  442. }
  443. /** TITLE **/
  444. .feed-header {
  445. background: no-repeat url("https://i.imgur.com/NRSDwnb.jpg") center !important;
  446. background-size: cover !important;
  447. padding: 18px 16px 13px 20px !important;
  448. margin-top: -15px !important;
  449. }
  450. .epic-nav-item-heading.first-focus,
  451. .feed-header .yt-uix-button-content {
  452. border: none !important;
  453. color: #FFF !important;
  454. font-size: 20px !important;
  455. font-weight: 500 !important;
  456. }
  457. .feed-header .yt-uix-button-content {
  458. margin-left: -12px !important;
  459. }
  460. .feed-header #channel-navigation-menu > li:first-child .epic-nav-item-heading:after,
  461. .feed-header #channel-navigation-menu > li:first-child span:after {
  462. content: " | " !important;
  463. font-weight: bold !important;
  464. margin-left: 10px !important;
  465. }
  466. .feed-header #channel-navigation-menu > li:first-child span {
  467. padding-left: 12px !important;
  468. margin-right: -16px !important;
  469. }
  470. .yt-uix-button.spf-link.yt-uix-sessionlink.yt-uix-button-epic-nav-item.yt-uix-button-size-default:hover {
  471. border-bottom: 3px solid transparent !important;
  472. opacity: .7 !important;
  473. }
  474. /** OPTIONS **/
  475. .branded-page-v2-subnav-container.branded-page-gutter-padding.history-controls-container {
  476. text-align: right !important;
  477. border: none !important;
  478. margin-top: -38px !important;
  479. background: transparent !important;
  480. }
  481. #watch-history-clear-button,
  482. #search-history-clear-button {
  483. border: none !important;
  484. box-shadow: none !important;
  485. color: transparent !important;
  486. width: 0px !important;
  487. height: 0px !important;
  488. background: no-repeat url("http://i.imgur.com/2n3rpjO.png") center !important;
  489. padding: 20px 0px 0px 20px !important;
  490. margin-top: -30px;
  491. background-size: 35px auto !important;
  492. position: absolute !important;
  493. right: 23px !important;
  494. visibility: visible !important;
  495. }
  496. #watch-history-pause-button,
  497. #search-history-pause-button {
  498. display: none !important;
  499. }
  500. /** VIDEOS **/
  501. #results .yt-lockup .yt-uix-button-action-menu {
  502. opacity: 1 !important;
  503. }
  504. /** PAGINATION **/
  505. .branded-page-box.search-pager.spf-link {
  506. background: #3f3f3f !important;
  507. box-shadow: none !important;
  508. width: 97.6% !important;
  509. text-align: left !important;
  510.  
  511. }
  512. .branded-page-box.search-pager.spf-link .yt-uix-button.yt-uix-sessionlink.yt-uix-button-default.yt-uix-button-size-default {
  513. margin-left: -4px !important;
  514. border-radius: 1px !important;
  515. padding: 5px 11px !important;
  516. background: transparent !important;
  517. border: none !important;
  518. color: #FFF !important;
  519. font-size: 10pt !important;
  520. }
  521. .yt-uix-button-default[disabled] {
  522. border-radius: 1px !important;
  523. background: #3f3f3f !important;
  524. border: 1px solid #3f3f3f !important;
  525. }
  526. .yt-uix-button-default[disabled] span {
  527. color: #FFF !important;
  528. opacity: 1 !important;
  529. font-size: 10pt !important;
  530. }
  531. .branded-page-box.search-pager.spf-link .yt-uix-button.yt-uix-sessionlink.yt-uix-button-default.yt-uix-button-size-default .yt-uix-button-content {
  532. padding-top: 2px !important;
  533. font-weight: bold !important;
  534. }
  535.  
  536. /* LIKE/WATCH(LATER)/MYCHANNEL SECTION */
  537. /** CARDS **/
  538. #pl-header{
  539. background: #3f3f3f !important;
  540. }
  541. .pl-header-title {
  542. color: #FFF !important;
  543. }
  544. .pl-header-details {
  545. color: #FFF !important;
  546. font-weight: 500 !important;
  547. font-size: 10pt !important;
  548. }
  549. .pl-header-title-icon {
  550. opacity: 1;
  551. filter: brightness(0) invert(1) !important;
  552. }
  553. #pl-header .playlist-actions .yt-uix-button,
  554. #gh-playlist-add-video {
  555. margin-right: 5px;
  556. border-radius: 1px !important;
  557. box-shadow: none !important;
  558. background: #3f3f3f !important;
  559. border: none !important;
  560. color: #FFF !important;
  561. font-weight: bold !important;
  562. font-size: 13px !important;
  563. }
  564. #pl-header .playlist-actions .yt-uix-button-icon-wrapper,
  565. #pl-header .playlist-actions .yt-uix-button-has-icon.no-icon-markup::before {
  566. margin-right: 6px;
  567. filter: invert(1) !important;
  568. opacity: 1 !important;
  569. }
  570. #pl-video-list {
  571. background: #FFF !important;
  572. box-shadow: none !important;
  573. }
  574. .pl-video .pl-video-index {
  575. display: none;
  576. }
  577. .pl-video .pl-video-handle {
  578. width: 16px;
  579. }
  580. .branded-page-v2-primary-col .branded-page-box,
  581. .section-list li .item-section .branded-page-box {
  582. border-bottom: 1px solid #fff;
  583. }
  584. /** BANNER **/
  585. .channel-header .secondary-header-contents {
  586. padding: 0px !important;
  587. background-color: #fff;
  588. border-bottom: none !important;
  589. box-shadow: none !important;
  590. width: 100% !important;
  591. }
  592. .secondary-header-action {
  593. font-size: 10pt !important;
  594. margin-left: 15px !important;
  595. margin-right: 0px !important;
  596. }
  597. .secondary-header-action span {
  598. font-size: 9.5pt !important;
  599. }
  600. .yt-uix-button.yt-uix-button-size-default.yt-uix-button-default.yt-uix-button-empty.yt-uix-button-has-icon.casual-settings-button {
  601. margin-top: -6px !important;
  602. position: fixed !important;
  603. bottom: 16px !important;
  604. right: 10px !important;
  605. }
  606. .channel-header-subscription-button-container.yt-uix-button-subscription-container.yt-subscription-button-disabled-mask-container.with-preferences {
  607. display: none !important;
  608.  
  609. }
  610. .yt-uix-inlineedit-view-container.yt-uix-flipwidget-front {
  611. background: #FFF !important;
  612. padding-left: 6px !important;
  613. font-size: 20px !important;
  614. font-weight: 500 !important;
  615. box-shadow: none !important;
  616. margin-top: -40px !important;
  617. }
  618.  
  619.  
  620. /* CHANNEL SECTION */
  621. /** BANNER **/
  622. .channel-header-profile-image-container {
  623. background: transparent !important;
  624. }
  625. .channel-header-profile-image {
  626. background-color: transparent !important;
  627. box-shadow: none !important;
  628. margin-top: 12px !important;
  629. }
  630. .spf-link.branded-page-header-title-link.yt-uix-sessionlink {
  631. display: none !important;
  632. }
  633. .channel-header .primary-header-actions,
  634. .channel-header-subscription-button-container {
  635. float: right;
  636. margin-top: -11px !important;
  637. margin-right: -3px !important;
  638. }
  639. .branded-page-v2-top-row #channel-subheader {
  640. margin-top: -70px !important;
  641. padding-top: 4px !important;
  642. }
  643. .qualified-channel-title-badge {
  644. display: none !important;
  645. }
  646. /** CARDS **/
  647. .branded-page-v2-primary-col .yt-card {
  648. background: transparent !important;
  649. box-shadow: none !important;
  650. }
  651. .video-player-view-component.branded-page-box,
  652. .feed-item-container.yt-section-hover-container.browse-list-item-container.branded-page-box.vve-check {
  653. margin-bottom: 10px !important;
  654. background: #FFF !important;
  655. border: none !important;
  656. box-shadow: none !important;
  657. }
  658. #c4-primary-header-contents {
  659. margin-top: -3px !important;
  660. }
  661. #channel-subheader {
  662. background: #FFF !important;
  663. box-shadow: none !important;
  664. }
  665. #channel-subheader .yt-uix-button {
  666. box-shadow: none !important;
  667. }
  668. .branded-page-v2-subnav-container.branded-page-gutter-padding.clearfix {
  669. display: none !important;
  670. }
  671. .channels-browse-content-grid {
  672. margin-right: 0px !important;
  673. background: #FFF !important;
  674. }
  675. #channels-browse-content-grid.grid-lockups-container {
  676. padding-top: 15px;
  677. box-shadow: none !important;
  678. }
  679. .about-metadata-container {
  680. background: #FFF !important;
  681. box-shadow: none !important;
  682. padding: 10px !important;
  683. }
  684. .comment-renderer.channel-owner .comment-author-text {
  685. background: no-repeat url("http://www.freeiconspng.com/uploads/queen-crown-icon-6.png") -2% 60% !important;
  686. filter: grayscale(100%) contrast(25%) !important;
  687. background-color: transparent !important;
  688. background-size: 30px auto !important;
  689. padding-left: 25px !important;
  690. }
  691. /** TITLE **/
  692. .flex-width-enabled .feed-item-container .feed-item-main.feed-item-no-author .branded-page-module-title {
  693. background: #fff;
  694. padding: 16px 16px 20px 20px;
  695. margin-left: -18px;
  696. margin-top: -15px;
  697. margin-bottom: 17px;
  698. width: 100% !important;
  699. max-width: 1226px !important;
  700. }
  701. .shelf-wrapper .lohp-newspaper-shelf {
  702. margin-top: 60px !important;
  703. padding-bottom: 4px !important;
  704. }
  705. .shelf-wrapper .lohp-newspaper-shelf .branded-page-module-title {
  706. background: #fff !important;
  707. padding: 16px 0px 17px 0px !important;
  708. position: absolute !important;
  709. top: 15px !important;
  710. max-width: 1056px !important;
  711. }
  712. .shelf-wrapper .lohp-newspaper-shelf .branded-page-module-title span {
  713. margin-left: 20px !important;
  714. }
  715. .yt-uix-button.shelves-play.play-all-icon-btn {
  716. opacity: 1 !important;
  717. background: #fff !important;
  718. border: none !important;
  719. box-shadow: none !important;
  720. font-weight: bold !important;
  721. font-size: 12px !important;
  722. height: 25px !important;
  723. text-transform: lowercase !important;
  724. position: absolute !important;
  725. margin-left: 10px !important;
  726. }
  727. /** VIDEOS **/
  728. .feed-item-container.yt-section-hover-container.browse-list-item-container.branded-page-box.vve-check .video-time,
  729. .channels-browse-content-grid .video-time {
  730. background-color: #3f3f3f !important;
  731. font-family: "Roboto" !important;
  732. font-weight: bold !important;
  733. padding: 7px 10px 7px 10px !important;
  734. opacity: 1 !important;
  735. text-align: left !important;
  736. width: 100% !important;
  737. margin-bottom: -2px !important;
  738. margin-right: -20px !important;
  739. position: absolute !important;
  740. left: -1px !important;
  741. }
  742. .expanded-shelf button.yt-uix-expander-head,
  743. .expanded-shelf .expanded-shelf-view-all {
  744. background: #3f3f3f !important;
  745. border-radius: 1px !important;
  746. color: #FFF !important;
  747. font-size: 14px !important;
  748. font-weight: bold !important;
  749. padding: 0px 20px 0px 16px !important;
  750. text-align: center !important;
  751. text-transform: lowercase !important;
  752. width: 100% !important;
  753. margin-left: -18px !important;
  754. margin-top: 20px !important;
  755. margin-bottom: -3px !important;
  756. }
  757. .yt-card.yt-uix-expander .yt-uix-button-expander,
  758. .yt-card .yt-uix-expander .yt-uix-button-expander {
  759. border-radius: 1px !important;
  760. padding: 0px 20px 0px 16px !important;
  761. margin-bottom: -15px !important;
  762. width: 105% !important;
  763. max-width: 1056px !important;
  764.  
  765. }
  766. .yt-card.yt-uix-expander .yt-uix-button-expander span,
  767. .yt-card .yt-uix-expander .yt-uix-button-expander span,
  768. .expanded-shelf .expanded-shelf-view-all .expanded-shelf-view-all-link-text {
  769. color: #FFF !important;
  770. font-weight: bold !important;
  771. text-transform: lowercase !important;
  772. font-size: 14px !important;
  773. }
  774. .yt-uix-button.yt-uix-button-size-default.yt-uix-button-default.load-more-button.yt-uix-load-more.browse-items-load-more-button {
  775. background: #3f3f3f !important;
  776. border: none !important;
  777. border-radius: 1px !important;
  778. color: #FFF !important;
  779. font-size: 14px !important;
  780. font-weight: bold !important;
  781. height: 40px !important;
  782. padding: 6px 20px 8px 20px !important;
  783. text-align: center !important;
  784. text-transform: lowercase !important;
  785. width: 100% !important;
  786. margin-left: 0px !important;
  787. margin-top: 0px !important;
  788. margin-bottom: -3px !important;
  789. opacity: 1 !important;
  790. }
  791. .branded-page-gutter-padding {
  792. padding-right: 0px !important;
  793. }
  794.  
  795. /* WATCH SECTION */
  796. body .watch-stage-mode #movie_player {
  797. background: transparent !important;
  798. }
  799. #movie_player {
  800. background-color: #3f3f3f !important;
  801. }
  802. .player-api {
  803. background: #3f3f3f !important;
  804. }
  805. body .watch-stage-mode #player {
  806. margin-top: -5px !important;
  807. }
  808. body .watch-stage-mode #player .player-api {
  809. margin-top: -5px !important;
  810. padding: 0px !important;
  811. }
  812. body .watch-stage-mode #player .player-width {
  813. left: auto;
  814. margin-left: 0;
  815. }
  816. .watch-stage-mode #placeholder-player {
  817. background: #3f3f3f !important;
  818. margin-top: -570px !important;
  819. height: 560px !important;
  820. }
  821. .watch-stage-mode .ytp-progress-bar-container {
  822. width: 100% !important;
  823. }
  824. .watch-stage-mode .ytp-chrome-bottom {
  825. width: 950px !important;
  826. margin-top:-10px!important;
  827. margin-left: 10px !important;
  828. }
  829. .watch-stage-mode .ytp-fullscreen .ytp-chrome-bottom {
  830. width: calc(100% - 48px) !important;
  831. }
  832. .watch-stage-mode #player,
  833. .watch-stage-mode #player #player-api {
  834. width: 1000px !important;
  835. height: 560px !important;
  836. margin-top: 0px !important;
  837. margin-bottom: 0px !important;
  838. }
  839. .watch-stage-mode #player {
  840. margin-top: 0px !important;
  841. margin-bottom: 10px !important;
  842. }
  843. .watch-stage-mode #player video {
  844. width: 1000px !important;
  845. height: 560px !important;
  846. left: 0px !important;
  847. top: 0px !important;
  848. object-fit: contain !important;
  849. }
  850. .watch-stage-mode .player-height {
  851. height: 560px !important;
  852. }
  853. .watch-stage-mode #player .ytp-fullscreen video {
  854. width: 100% !important;
  855. height: 100% !important;
  856. }
  857. .watch-stage-mode .ytp-fullscreen .html5-video-container {
  858. width: 100% !important;
  859. height: 100% !important;
  860. }
  861. #watch7-main {
  862. margin-top: 11px !important;
  863. }
  864. /** INFORMATION **/
  865. /*** TITLE ***/
  866. #watch7-headline {
  867. background: #fff !important;
  868. border-bottom: 1px solid #fff !important;
  869. padding: 13px 16px 13px 14px !important;
  870. width: 100% !important;
  871. margin-left: -15px !important;
  872. margin-top: -15px !important;
  873. margin-bottom: 5px !important;
  874. }
  875. .watch-title-container {
  876. width: 100% !important;
  877. }
  878. #eow-title::before {
  879. content: "dd" !important;
  880. background: no-repeat url("http://web.sheffieldlive.org/wp-content/uploads/2014/09/music-icon.png") center 65% !important;
  881. filter: grayscale(100%) contrast(25%) !important;
  882. color: transparent !important;
  883. background-size: 19px auto !important;
  884. margin-right: 4px !important;
  885. margin-left: -2px !important;
  886. }
  887. #eow-title {
  888. font-weight: 400 !important;
  889. }
  890. /*** UPLOADER ***/
  891. .yt-uix-button-subscribe-branded::before,
  892. .yt-uix-button-subscribed-branded::before {
  893. display: none !important;
  894. }
  895. .yt-uix-button-subscribe-branded,
  896. .yt-uix-button-subscribe-branded span {
  897. background-color: #D9BFC2 !important;
  898. text-transform: lowercase !important;
  899. font-weight: bold !important;
  900. padding: 0px 3px 0px 2px !important;
  901. }
  902. .yt-uix-button-subscribed-branded,
  903. .yt-uix-button-subscribed-branded span {
  904. background-color: #A98D9B !important;
  905. border: none !important;
  906. color: #FFF !important;
  907. text-transform: lowercase !important;
  908. font-weight: bold !important;
  909. padding: 0px 4px 0px 3px !important;
  910. }
  911. .yt-subscription-button-subscriber-count-branded-horizontal {
  912. line-height: 21.5px !important;
  913. }
  914. /*** ACTIONS ***/
  915. #watch8-secondary-actions .yt-uix-button-content {
  916. display: none !important;
  917. }
  918. .addto-button::before {
  919. background: no-repeat url("http://i.imgur.com/II9p6Kj.png") center !important;
  920. filter: grayscale(100%) contrast(25%) !important;
  921. background-size: 22px auto !important;
  922. width: 20px;
  923. height: 20px;
  924. opacity: 1 !important;
  925. }
  926. .action-panel-trigger-share::before {
  927. background: no-repeat url("http://i.imgur.com/2dPIub9.png") center;
  928. background-size: 26px auto !important;
  929. width: 20px;
  930. height: 20px;
  931. filter: brightness(0) !important;
  932. margin-left: -16px !important;
  933. opacity: .7 !important;
  934. }
  935. #action-panel-overflow-button::before {
  936. margin-left: -15px !important;
  937. }
  938. /*** VIEWS ***/
  939. .video-extras-sparkbar-likes {
  940. background: #D9BFC2 !important;
  941. }
  942. .like-button-renderer-like-button::before {
  943. background: no-repeat url("http://i.imgur.com/zR1ss8X.png") center !important;
  944. background-size: 16px auto !important;
  945. width: 20px;
  946. height: 20px;
  947. }
  948. .like-button-renderer-dislike-button::before {
  949. background: no-repeat url("http://i.imgur.com/C1WX1Lo.png") center !important;
  950. background-size: 25px auto !important;
  951. width: 20px;
  952. height: 20px;
  953. }
  954. .like-button-renderer-like-button,
  955. .like-button-renderer-dislike-button {
  956. color: #3f3f3f !important;
  957. font-weight: bold !important;
  958. font-size: 9.5pt !important;
  959. }
  960. .like-button-renderer-like-button.yt-uix-button-toggled .yt-uix-button-content {
  961. color: #D9BFC2;
  962. }
  963. .like-button-renderer-dislike-button.yt-uix-button-toggled .yt-uix-button-content {
  964. color: #A98D9B;
  965. }
  966. /** DESCRIPTION **/
  967. #watch-description {
  968. margin-left: -15px !important;
  969. margin-right: -15px !important;
  970. margin-top: -15px !important;
  971. }
  972. #action-panel-details .yt-uix-button.yt-uix-button-size-default.yt-uix-button-expander,
  973. #watch-action-panels .yt-uix-button.yt-uix-button-size-default.yt-uix-button-expander {
  974. background: #3f3f3f !important;
  975. border: none !important;
  976. border-radius: 1px !important;
  977. box-shadow: none !important;
  978. color: #FFF !important;
  979. font-weight: bold !important;
  980. padding: 5px 10px 25px 10px !important;
  981. text-align: center !important;
  982. text-transform: lowercase !important;
  983. min-width: 640px !important;
  984. width: 103.8% !important;
  985. margin-left: -15px !important;
  986. }
  987. #watch-uploader-info {
  988. background: #fff !important;
  989. border-bottom: 1px solid #fff !important;
  990. padding: 14px 16px 16px 16px !important;
  991. width: 100% !important;
  992. }
  993. .watch-time-text::before {
  994. color: transparent !important;
  995. content: "dd" !important;
  996. background: no-repeat url("http://vignette2.wikia.nocookie.net/gravityfalls/images/5/55/More_info_icon.png/revision/20131229000053") center 70% !important;
  997. background-size: 19px auto !important;
  998. margin-right: 8px !important;
  999. margin-left: -4px !important;
  1000. }
  1001. .watch-time-text {
  1002. color: #3f3f3f !important;
  1003. font-size: 20px !important;
  1004. font-weight: 400 !important;
  1005. }
  1006. #eow-description {
  1007. margin-left: 16px !important;
  1008. margin-top: 13px !important;
  1009. margin-right: 16px !important;
  1010. }
  1011. #watch-description-extras {
  1012. display: none !important;
  1013. }
  1014. /** COMMENTS **/
  1015. .comment-section-header-renderer {
  1016. background: #Fff !important;
  1017. color: #3f3f3f;
  1018. font-size: 20px !important;
  1019. font-weight: 400 !important;
  1020. padding: 14px 14px 14px 16px !important;
  1021. text-transform: none!important;
  1022. width: 100% !important;
  1023. margin-left: -15px !important;
  1024. margin-top: -15px !important;
  1025. border-bottom: 1px solid #fff !important;
  1026. margin-bottom: 15px !important;
  1027. }
  1028. .comment-section-header-renderer b::before {
  1029. background: no-repeat url("http://i.imgur.com/pu4S5vj.png") center 75% !important;
  1030. filter: grayscale(100%) contrast(25%) !important;
  1031. background-size: 21px auto !important;
  1032. content: "dd" !important;
  1033. color: transparent !important;
  1034. margin-right: 10px !important;
  1035. }
  1036. .comment-section-header-renderer b {
  1037. font-weight: 400 !important;
  1038. }
  1039. .yt-uix-menu.comment-section-sort-menu .yt-uix-button-content {
  1040. font-size: 13px !important;
  1041. text-transform: lowercase !important;
  1042. }
  1043. .yt-uix-menu.comment-section-sort-menu button {
  1044. border: 1px solid #fff !important;
  1045. }
  1046. .comment-author-text {
  1047. color: #a98d9b;
  1048. font-size: 11pt !important;
  1049. }
  1050. .comment-renderer-author-comment-badge.creator {
  1051. background: no-repeat url("http://www.freeiconspng.com/uploads/queen-crown-icon-6.png") -2% 100% !important;
  1052. filter: grayscale(100%) contrast(25%) !important;
  1053. background-color: transparent !important;
  1054. background-size: 30px auto !important;
  1055. padding-left: 25px !important;
  1056. }
  1057. .comment-renderer-author-comment-badge.creator .comment-author-text {
  1058. color: #3f3f3f !important;
  1059. }
  1060. .yt-uix-button-action-menu::before,
  1061. .yt-uix-button-lockup-action-menu::before {
  1062. opacity: .8 !important;
  1063. background: no-repeat url("https://cdn3.iconfinder.com/data/icons/faticons/32/arrow-down-01-128.png") center !important;
  1064. background-size: 10px auto !important;
  1065. width: 13px;
  1066. height: 13px;
  1067. margin-top: -10px !important;
  1068. }
  1069. .comment-renderer-header .comment-renderer-time a {
  1070. color: #3f3f3f;
  1071. font-weight: bold !important;
  1072. font-size: 10pt !important;
  1073. }
  1074. .comment-replies-renderer .comment-renderer {
  1075. border-left: 2px solid #fff !important;
  1076. padding: 15px !important;
  1077. }
  1078. .comment-renderer-reply {
  1079. color: #3f3f3f !important;
  1080. font-size: 10.5pt !important;
  1081. font-weight: bold !important;
  1082. text-transform: lowercase !important;
  1083. margin-top: -2px !important;
  1084. }
  1085. .comment-renderer-reply::after {
  1086. content: "";
  1087. }
  1088. .comment-renderer-like-count {
  1089. color: #D9BFC2 !important;
  1090. font-size: 10pt;
  1091. font-weight: bold !important;
  1092. }
  1093. .comment-section-renderer-paginator {
  1094. background: #3f3f3f !important;
  1095. border: none !important;
  1096. border-radius: 1px !important;
  1097. color: #FFF !important;
  1098. font-size: 14px !important;
  1099. font-weight: bold !important;
  1100. padding: 10px 10px 10px 10px !important;
  1101. text-align: center !important;
  1102. text-transform: lowercase !important;
  1103. min-width: 641px !important;
  1104. width: 103.8% !important;
  1105. margin-left: -16px !important;
  1106. margin-top: 20px !important;
  1107. margin-bottom: -16px !important
  1108. }
  1109. /** SIDEBAR **/
  1110. /*** VIDEOS ***/
  1111. #watch7-sidebar .watch-sidebar-head {
  1112. color: #FFF !important;
  1113. width: 99% !important;
  1114. background-color:#3f3f3f !important;
  1115. padding: 15px !important;
  1116. margin-left: -11px !important;
  1117. margin-top: -15px !important;
  1118. margin-bottom: 17px !important;
  1119. font-size: 12pt !important;
  1120. }
  1121. .autoplay-bar .checkbox-on-off {
  1122. font-size: 12pt !important;
  1123. color: transparent !important;
  1124. text-transform: lowercase !important;
  1125. margin-top: 13px !important;
  1126. }
  1127. .yt-uix-checkbox-on-off label {
  1128. background: #3f3f3f !important;
  1129. }
  1130. .yt-uix-checkbox-on-off input[type="checkbox"]:checked + label .checked {
  1131. margin-top: -1.7px !important;
  1132. }
  1133. .autoplay-bar .autoplay-info-icon {
  1134. display: none !important;
  1135. }
  1136. #watch7-sidebar .video-time {
  1137. background-color: #3f3f3f !important;
  1138. font-family: "Roboto" !important;
  1139. font-weight: bold !important;
  1140. padding: 6px 10px !important;
  1141. opacity: 1 !important;
  1142. width: 100% !important;
  1143. margin-bottom: -2px !important;
  1144. margin-right: -20px !important;
  1145. position: absolute !important;
  1146. left: -1px !important;
  1147. }
  1148. .yt-pl-thumb .sidebar {
  1149. display: none !important;
  1150. }
  1151. .resume-playback-background,
  1152. .resume-playback-progress-bar {
  1153. top: 0 !important;
  1154. }
  1155. #a11y-announcements-message {
  1156. display: none !important;
  1157. }
  1158. #watch7-sidebar .yt-uix-button.yt-uix-button-size-default.yt-uix-button-expander {
  1159. background: #3f3f3f
  1160. !important;
  1161. border: none !important;
  1162. border-radius: 1px !important;
  1163. box-shadow: 0px 1px 2px rgba(0,0,0,.0) !important;
  1164. color: #FFF !important;
  1165. font-weight: bold !important;
  1166. padding: 5px 10px 25px 10px !important;
  1167. text-align: center !important;
  1168. text-transform: lowercase !important;
  1169. width: 106.4% !important;
  1170. margin-left: -10px !important;
  1171. }
  1172. /*** PLAYLIST ***/
  1173. .watch-stage-mode #player-playlist .watch-playlist {
  1174. margin-top: 138px !important;
  1175. margin-left: -90px !important;
  1176. margin-right: -90px !important;
  1177. height: 100px !important;
  1178. }
  1179. #player-playlist .playlist-info {
  1180. margin-top: 4px !important;
  1181. }
  1182. #player-playlist .playlist-mix-icon {
  1183. float: left;
  1184. margin-right: 10px !important;
  1185. margin-top: 0px !important;
  1186. }
  1187. #player-playlist .author-attribution,
  1188. #player-playlist .playlist-details > li {
  1189. display: none !important;
  1190. }
  1191. #player-playlist .control-bar {
  1192. border-top: 1px solid #3f3f3f;
  1193. }
  1194. }
  1195.  
  1196. @-moz-document regexp("https://www.youtube.com.user/.*?/discussion.*"),
  1197. regexp("https://www.youtube.com/channels.*") {
  1198. #browse-items-primary,
  1199. .branded-page-v2-body.branded-page-v2-primary-column-content {
  1200. background: #FFF !important;
  1201. box-shadow: none !important;
  1202. }
  1203. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement