☰

Youtube Vibra for New YouTube [Updated DRM Free]

YT Vibra - Backup

  1. /* ==UserStyle==
  2. @name           Youtube Vibra for New YouTube [Updated DRM Free]
  3. @namespace      typpi.online
  4. @version        1.3.1
  5. @description    YT Vibra - Backup
  6. @author         Nick2bad4u
  7. @license        UnLicense
  8. @homepageURL    https://github.com/Nick2bad4u/UserStyles
  9. @supportURL     https://github.com/Nick2bad4u/UserStyles/issues
  10. @preprocessor uso
  11.  
  12. @advanced dropdown gradient "Gradient" {
  13.     11 "Peach Sunset(New)*" <<<EOT #ffca94, #ff8fb8 EOT;
  14.     1 "Old Peach Sunset" <<<EOT #ff6a3e, #fe3d90 EOT;
  15.     2 "Cool Summer" <<<EOT #134e5e, #71b280 EOT;
  16.     3 "Vibrantions" <<<EOT #7f00ff, #e100ff EOT;
  17.     4 "Galaxy" <<<EOT #753a88, #cc2b5e EOT;
  18.     5 "Environmental Blue" <<<EOT #00c9ff, #92fe9d EOT;
  19.     6 "Royal Purple" <<<EOT #42275a, #734b6d EOT;
  20.     7 "Rose" <<<EOT #FFAFBD, #ffc3a0 EOT;
  21.     8 "Blue Planet" <<<EOT #24c6dc, #514a9d EOT;
  22.     9 "Summer Sun" <<<EOT #ffee00, #ff8e1c EOT;
  23.     10 "Blur" <<<EOT #5c258d, #4389a2 EOT;
  24.     12 "Ocean Green" <<<EOT #007fff, #83e27a EOT;
  25.     13 "Lavender Town" <<<EOT #e6c1f6, #d3beea EOT;
  26. }
  27. ==/UserStyle== */
  28. @-moz-document domain("www.youtube.com") {
  29. 	#container.ytd-masthead {
  30. 			height: 56px;
  31. 			padding: 0 16px;
  32. 			display: flex;
  33. 			-ms-flex-direction: row;
  34. 			-webkit-flex-direction: row;
  35. 			background: linear-gradient(90deg, /*[[gradient]]*/);
  36. 			flex-direction: row;
  37. 			-ms-flex-align: center;
  38. 			-webkit-align-items: center;
  39. 			align-items: center;
  40. 			-ms-flex-pack: justify;
  41. 			-webkit-justify-content: space-between;
  42. 			justify-content: space-between;
  43. 	}
  44. 	ytd-searchbox[mode=legacy] #container.ytd-searchbox, ytd-searchbox[mode=legacy-centered] #container.ytd-searchbox {
  45. 			background-color: WHITE!IMPORTANT;
  46. 			border: 0;
  47. 			border-right: none;
  48. 			box-shadow: inset 0 1px 2px var(--ytd-searchbox-legacy-border-shadow-color);
  49. 			padding: 3px 6px;
  50. 			TEXT-ALIGN: CENTER;
  51. 			border-radius: 100px 0 0 100px;
  52. 	}
  53. 	ytd-masthead[mode="legacy"] #container.ytd-masthead {
  54. 			-ms-flex-pack: start;
  55. 			-webkit-justify-content: flex-start;
  56. 			justify-content: flex-start;
  57. 			background: linear-gradient(90deg, /*[[gradient]]*/);
  58. 	}
  59. 	#search-button.ytd-masthead {
  60. 			display: block;
  61. 			margin-right: 0;
  62. 			color: white;
  63. 	}
  64. 	#search-icon-legacy.ytd-searchbox {
  65. 			cursor: pointer;
  66. 			width: 65px;
  67. 			border: white;
  68. 			background-color: white;
  69. 			border-radius: 0 100px 100px 0;
  70. 			margin: 0;
  71. 	}
  72. 	ytd-searchbox[mode=legacy] #container.ytd-searchbox {
  73. 			background-color: white;
  74. 			border: white;
  75. 			border-right: none;
  76. 			box-shadow: 0px 0px 0px 0px;
  77. 			text-align: center;
  78. 			padding: 2px 6px;
  79. 			border-radius: 100px 0 0 100px;
  80. 	}
  81. 	ytd-searchbox[mode=legacy][has-focus] #container.ytd-searchbox {
  82. 			border: 0px solid #1c62b9;
  83. 			box-shadow: inset 0 0px 2px rgba(0, 0, 0, 0);
  84. 	}
  85. 	li.sbsb_c.gsfs {
  86. 			text-align: center!important;
  87. 	}
  88. 	#like-bar.ytd-sentiment-bar-renderer {
  89. 			background: linear-gradient(/*[[gradient]]*/);
  90. 			height: 2px;
  91. 			transition: width 0.3s;
  92. 	}
  93. 	a.yt-simple-endpoint.yt-formatted-string {
  94. 			color: #ff5666;
  95. 	}
  96. 	#owner-name.ytd-video-owner-renderer {
  97. 			font-size: 1.4rem;
  98. 			font-weight: 500;
  99. 			line-height: 1.6rem;
  100. 	}
  101. 	div#sb-heading {
  102. 			background-color: rgba(255, 0, 0, 0)!important;
  103. 			background: linear-gradient(90deg, /*[[gradient]]*/);
  104. 	}
  105. 	#buttons.ytd-masthead[is-icon-button].ytd-masthead {
  106. 			color: white;
  107. 	}
  108. 	div#ChanOver span {
  109. 			color: white!important;
  110. 	}
  111. 	div#ChanOver {
  112. 			background-color: rgba(255, 0, 0, 0)!important;
  113. 			background: linear-gradient(50deg, /*[[gradient]]*/);
  114. 			color: white!important;
  115. 	}
  116. 	div#ChanOver h2 {
  117. 			color: white!important;
  118. 	}
  119. 	div#ChanOver h3 {
  120. 			color: white!important;
  121. 	}
  122. 	div#ChanOver a {
  123. 			color: white!important;
  124. 	}
  125. 	div#sb-heading {
  126. 			background-color: rgba(255, 0, 0, 0)!important;
  127. 			background: URL(https://i.imgur.com/dc7CRrl.png);
  128. 			BACKGROUND-POSITION: center;
  129. 	}
  130. 	div#sb-heading A {
  131. 			opacity: 0;
  132. 	}
  133. 	div#ChanOver div {
  134. 			border-bottom: 0px solid !important;
  135. 			border-right: 0px !important;
  136. 	}
  137. 	div#socialblade-stats {
  138. 			background: linear-gradient(90deg, /*[[gradient]]*/)!important;
  139. 	}
  140. 	div#vid-tags-outdated div {
  141. 			color: white!important;
  142. 	}
  143. 	ytd-searchbox[mode=legacy][has-focus] #container.ytd-searchbox, ytd-searchbox[mode=legacy-centered][has-focus] #container.ytd-searchbox {
  144. 			border: 0px!important;
  145. 			box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.3);
  146. 	}
  147. 	div#SBMenu div h3 {
  148. 			background-color: white!important;
  149. 			border-right: 0px!important;
  150. 			color: #fa3d69!important;
  151. 	}
  152. 	div#SBMenu div {
  153. 			background-color: white!important;
  154. 			border-right: 0px!important;
  155. 			color: #fa3d69!important;
  156. 	}
  157. 	p#vid-tags span {
  158. 			background-color: white!important;
  159. 			color: var(--yt-primary-color)!important;
  160. 			border-radius: 100px!important;
  161. 	}
  162. 	ytd-searchbox[mode=legacy] #container.ytd-searchbox input.ytd-searchbox, ytd-searchbox[mode=legacy-centered] #container.ytd-searchbox input.ytd-searchbox {
  163. 			color: black!important;
  164. 	}
  165. 	a#SBL div {
  166. 			background: white!important;
  167. 			color: black!important;
  168. 	}
  169. 	a#SBL div h3 {
  170. 			background: white!important;
  171. 			color: black!important;
  172. 	}
  173. 	div#socialblade {
  174. 			box-shadow: 1px 0px 16px 1px #0000003b;
  175. 	}
  176. 	a#SBLC div h3 {
  177. 			color: black!important;
  178. 	}
  179. 	a#SBLC div {
  180. 			background-color: white!important;
  181. 	}
  182. 	a#SBLC div:hover {
  183. 			background-color: grey!important;
  184. 	}
  185. 	a#SBLC div {
  186. 			background-color: white!important;
  187. 	}
  188. 	paper-toggle-button[checked]:not([disabled]) .toggle-bar.paper-toggle-button {
  189. 			opacity: 1;
  190. 			background-color: #ff000000;
  191. 			background: linear-gradient(90deg, /*[[gradient]]*/);
  192. 	}
  193. 	paper-toggle-button[checked]:not([disabled]) .toggle-button.paper-toggle-button {
  194. 			background-color: #fe3e8f05;
  195. 			background: linear-gradient(90deg, /*[[gradient]]*/);
  196. 	}
  197. 	span.count {
  198. 			color: black!important;
  199. 			font-weight: lighter!important;
  200. 	}
  201. 	ytd-button-renderer.style-primary[is-paper-button] {
  202. 			background-color: hsla(206, 79%, 53%, 0);
  203. 			color: hsl(0, 0%, 100%);
  204. 			background: linear-gradient(90deg, /*[[gradient]]*/);
  205. 			border-radius: 100px;
  206. 	}
  207. 	a#iridium_settings_button svg {
  208. 			color: white;
  209. 	}
  210. 	g#youtube-paths path {
  211. 			fill: white!important;
  212. 	}
  213. 	body[invert] yt-icon#logo-icon.ytd-topbar-logo-renderer svg {
  214. 			opacity: 0;
  215. 	}
  216. 	body[invert] yt-icon#logo-icon.ytd-topbar-logo-renderer {
  217. 			width: 80px;
  218. 			background: url(https://i.imgur.com/oHv7EEw.png);
  219. 			background-size: contain;
  220. 			background-position: center;
  221. 			background-repeat: no-repeat;
  222. 	}
  223. 	app-drawer.ytd-app:not([persistent]) #header.ytd-app {
  224. 			background: linear-gradient(90deg, /*[[gradient]]*/);
  225. 	}
  226. 	.ytp-play-progress.ytp-swatch-background-color {
  227. 			background: linear-gradient(90deg, /*[[gradient]]*/);
  228. 	}
  229. 	#guide-icon.ytd-masthead {
  230. 			fill: white;
  231. 	}
  232. 	#guide-icon.ytd-app {
  233. 			fill: white;
  234. 	}
  235. 	section.vc-stat-section.third-layout div span {
  236. 			color: var(--yt-primary-color)!important;
  237. 	}
  238. 	.vc-stat-section .stat-box.alt {
  239. 			background: rgb(255, 255, 255);
  240. 			border-color: white;
  241. 	}
  242. 	paper-button.ytd-subscribe-button-renderer {
  243. 			background-color: #ff000005;
  244. 			border-radius: 2px;
  245. 			padding: 10px 16px;
  246. 			margin: auto 4px;
  247. 			white-space: nowrap;
  248. 			background: linear-gradient(90deg, /*[[gradient]]*/);
  249. 			font-size: 1.4rem;
  250. 			font-weight: 300;
  251. 			letter-spacing: .007px;
  252. 			text-transform: uppercase;
  253. 			display: flex;
  254. 			-ms-flex-direction: row;
  255. 			-webkit-flex-direction: row;
  256. 			flex-direction: row;
  257. 	}
  258. 	.video-companion-container ul.keywords .search-rank {
  259. 			margin-left: 0.5em;
  260. 			color: white;
  261. 			font-weight: bold;
  262. 			display: inline-block;
  263. 			height: 15px;
  264. 			vertical-align: middle;
  265. 			line-height: 15px;
  266. 			background: linear-gradient(90deg, /*[[gradient]]*/);
  267. 			padding: 0px 3px;
  268. 	}
  269. 	.vidiq-logo-container {
  270. 			filter: brightness(0)!important;
  271. 	}
  272. 	img#sb-return {
  273. 			filter: brightness(100000%);
  274. 			padding-right: 10px;
  275. 	}
  276. 	#socialblade-tab paper-button {
  277. 			background-color: #ff6c7b !important;
  278. 			border-radius: 2px;
  279. 			color: #ffffff !important;
  280. 			padding: 10px 16px;
  281. 			margin: auto 4px;
  282. 			white-space: nowrap;
  283. 			font-size: 1.4rem;
  284. 			font-weight: 500;
  285. 			letter-spacing: .007px;
  286. 			text-transform: uppercase;
  287. 			display: flex;
  288. 			-ms-flex-direction: row;
  289. 			-webkit-flex-direction: row;
  290. 			flex-direction: row;
  291. 	}
  292. 	.vidiq-rating-bar-container .vidiq-rating-bar .vidiq-rating-likes {
  293. 			height: 5px;
  294. 			background: linear-gradient(90deg, /*[[gradient]]*/)​;
  295. 	}
  296. 	ytd-guide-entry-renderer[active] .guide-icon.ytd-guide-entry-renderer {
  297. 			color: var(--yt-primary-color)!important;
  298. 	}
  299. 	.badge-style-type-featured.ytd-badge-supported-renderer {
  300. 			background: linear-gradient(90deg, /*[[gradient]]*/);
  301. 			color: hsl(0, 0%, 100%);
  302. 			padding: 6px 10px 5px 10px;
  303. 			border-radius: 10px;
  304. 			text-transform: uppercase;
  305. 			font-weight: 100;
  306. 			letter-spacing: 2px;
  307. 	}
  308. 	.vidiq-rating-bar-container .vidiq-rating-bar .vidiq-rating-likes {
  309. 			height: 5px;
  310. 			background: #f98a5f;
  311. 	}
  312. 	yt-icon.ytd-badge-supported-renderer {
  313. 			background: url(https://i.imgur.com/FhRzUqU.png);
  314. 			color: #b3b1b100;
  315. 			background-size: 116%;
  316. 			background-repeat: no-repeat;
  317. 			background-position: center;
  318. 	}
  319. 	.vidiq-rating-bar {
  320. 			background-color: #faae90!important;
  321. 	}
  322. 	#search-icon-legacy.ytd-searchbox {
  323. 			cursor: pointer;
  324. 			width: 65px;
  325. 			border: white;
  326. 			border-radius: 0 100px 100px 0;
  327. 			box-shadow: 1px 0px 19px 0px #1010102b;
  328. 			margin: 0;
  329. 	}
  330. 	ytd-searchbox[mode=legacy] #container.ytd-searchbox input.ytd-searchbox {
  331. 			color: black;
  332. 	}
  333. 	button.vidiq-button {
  334. 			border-radius: 100px;
  335. 			background: linear-gradient(90deg, /*[[gradient]]*/);
  336. 			font-family: Roboto;
  337. 			text-transform: uppercase;
  338. 			border: 0px solid!important;
  339. 	}
  340. 	.ytp-chrome-controls .ytp-button[aria-pressed]::after {
  341. 			background: linear-gradient(90deg, /*[[gradient]]*/);
  342. 	}
  343. 	#country-code.ytd-topbar-logo-renderer {
  344. 			color: white!important;
  345. 			margin: 0 0 0 2px;
  346. 	}
  347. 	paper-button[subscribed].ytd-subscribe-button-renderer {
  348. 			background-color: hsl(0, 0%, 93.3%);
  349. 			color: hsla(0, 28%, 96%, 0.96);
  350. 	}
  351. 	img.vidiq-button-logo.vidiq-button-logo-small {
  352. 			background-color: #fe3d91;
  353. 	}
  354. 	#search-icon-legacy.ytd-searchbox {
  355. 			cursor: pointer;
  356. 			width: 65px;
  357. 			border: white;
  358. 			background-color: white!important;
  359. 			border-radius: 0 100px 100px 0;
  360. 			box-shadow: 1px 0px 19px 0px #1010102b;
  361. 			margin: 0;
  362. 	}
  363. 	#logo-icon-container.ytd-topbar-logo-renderer {
  364. 			width: 80px;
  365. 			height: 24px;
  366. 			background: url(https://i.imgur.com/oHv7EEw.png);
  367. 			-ms-flex: none;
  368. 			-webkit-flex: none;
  369. 			background-repeat: no-repeat;
  370. 			background-size: contain;
  371. 			flex: none;
  372. 			background-position: center;
  373. 	}
  374. 	svg.style-scope.ytd-topbar-logo-renderer {
  375. 			fill-opacity: 0;
  376. 	}
  377. 	header.video-companion-header {
  378. 			background: linear-gradient(90deg, /*[[gradient]]*/);
  379. 			margin-bottom: -2px;
  380. 			padding: 15px;
  381. 	}
  382. 	button.toggle-collapse {
  383. 			margin-top: 18px;
  384. 			margin-right: 11px;
  385. 	}
  386. 	.vidiq-logo-container {
  387. 			margin-bottom: 16px;
  388. 			margin-right: 18px;
  389. 	}
  390. 	yt-icon.style-scope.ytd-searchbox {
  391. 			color: black!important;
  392. 	}
  393. 	div#SBMenu div h3 {
  394. 			background-color: white!important;
  395. 			border-right: 0px!important;
  396. 			color: black!important;
  397. 	}
  398. 	div#ChanOver a div h3 {
  399. 			color: black!important;
  400. 	}
  401. 	div#ChanOver div {
  402. 			border-left: 0px!important;
  403. 	}
  404. 	span.value-inner {
  405. 			-webkit-text-fill-color: black!important;
  406. 	}
  407. 	div#sb-heading {
  408. 			background-color: rgba(255, 0, 0, 0)!important;
  409. 			background: linear-gradient(90deg, /*[[gradient]]*/)!IMPORTANT;
  410. 			BACKGROUND-POSITION: center;
  411. 	}
  412. 	div#sb-heading A {
  413. 			opacity: 1!important;
  414. 			background: url(https://i.imgur.com/TvIeZZx.png);
  415. 			margin-top: -100px;
  416. 			padding: 100px 0px 49px 100px;
  417. 			background-repeat: no-repeat;
  418. 			background-size: 62%;
  419. 			margin-left: 12px;
  420. 			background-position: center;
  421. 	}
  422. 	div#sb-heading A img {
  423. 			opacity: 0!important;
  424. 	}
  425. 	img#sb-return {
  426. 			margin: 16px 8px 0 0!important;
  427. 	}
  428. 	.ytp-scrubber-button.ytp-swatch-background-color {
  429. 			background: linear-gradient(270deg, /*[[gradient]]*/)!important;
  430. 	}
  431. 	.ytp-menuitem[aria-checked="true"] .ytp-menuitem-toggle-checkbox {
  432. 			background: linear-gradient(270deg, /*[[gradient]]*/)!important;
  433. 	}
  434. 	a.yt-simple-endpoint.yt-formatted-string {
  435. 			color: var(--yt-primary-color)!important;
  436. 			font-weight:500;
  437. 	}
  438. 	.deemphasize.yt-formatted-string {
  439. 			color: var(--yt-formatted-string-deemphasize-color);
  440. 			color: white;
  441. 			margin-left: var(--yt-formatted-string-deemphasize_-_margin-left);
  442. 	}
  443. 	.vidiq-subscriber-count.new-layout span {
  444. 			color: black!important;
  445. 	}
  446. 	.vc-section-social .stat-pair-like-ratio label, .vc-section-social[class^="stat-pair-yt"] label, .vc-section-social .stat-pair-like-ratio .value-inner, .vc-section-social[class^="stat-pair-yt"] .value-inner, .vc-section-social .stat-pair-like-ratio .unit, .vc-section-social[class^="stat-pair-yt"] .unit {
  447. 			color: black!important;
  448. 	}
  449. 	header.video-companion-header button i {
  450. 			color: white;
  451. 	}
  452. 	button.tab-tweets span svg {
  453. 			color: white!important;
  454. 			fill: white!important;
  455. 			filter: brightness(100000%)!important;
  456. 	}
  457. 	.vidiq-logo-container {
  458. 	}
  459. 	#container.ytd-searchbox {
  460. 			position: relative;
  461. 			align-items: center;
  462. 			background-color: hsl(0, 0%, 100%);
  463. 			border: 1px solid hsl(0, 0%, 100%);
  464. 			border-right: none;
  465. 			border-radius: 100px 0 0 100px;
  466. 			box-shadow: inset 0 1px 2px var(--ytd-searchbox-legacy-border-shadow-color);
  467. 			color: hsla(0, 0%, 0%, 0.88);
  468. 			padding: 2px 15px;
  469. 			-ms-flex: 1 1 0.000000001px;
  470. 			-webkit-flex: 1;
  471. 			flex: 1;
  472. 			text-align: center;
  473. 			-webkit-flex-basis: 0.000000001px;
  474. 			flex-basis: 0.000000001px;
  475. 			display: var(--layout-horizontal_-_display);
  476. 			-ms-flex-direction: var(--layout-horizontal_-_-ms-flex-direction);
  477. 			-webkit-flex-direction: var(--layout-horizontal_-_-webkit-flex-direction);
  478. 			flex-direction: var(--layout-horizontal_-_flex-direction);
  479. 	}
  480. 	#container.ytd-searchbox input.ytd-searchbox {
  481. 			color: hsla(0, 0%, 0%, 0.88);
  482. 	}
  483. 	ytd-subscribe-button-renderer[new-subscribe-color] paper-button.ytd-subscribe-button-renderer[subscribed] {
  484. 			background-color: var(--yt-spec-10-percent-layer);
  485. 			color: #ffffff;
  486. 	}
  487. 	ytd-author-comment-badge-renderer {
  488. 			--ytd-author-comment-badge-name-color: var(--yt-spec-text-primary);
  489. 			height: 20px;
  490. 			background-color: linear-gradient(270deg, /*[[gradient]]*/)!important;
  491. 			border-radius: 12px;
  492. 			margin-bottom: 2px;
  493. 			display: var(--layout-horizontal_-_display);
  494. 			-ms-flex-direction: var(--layout-horizontal_-_-ms-flex-direction);
  495. 			-webkit-flex-direction: var(--layout-horizontal_-_-webkit-flex-direction);
  496. 			flex-direction: var(--layout-horizontal_-_flex-direction);
  497. 			-ms-flex-align: center;
  498. 			-webkit-align-items: center;
  499. 			align-items: center;
  500. 			display: inline-flex;
  501. 	}
  502. 	}
  503.  
  504. 	@-moz-document domain("www.youtube.com") {
  505. 	ytd-masthead[mode="legacy"] #container.ytd-masthead {
  506. 			-ms-flex-pack: start;
  507. 			-webkit-justify-content: flex-start;
  508. 			justify-content: flex-start;
  509. 			background: -moz-linear-gradient(90deg, /*[[gradient]]*/);
  510. 	}
  511. 	#search-icon-legacy.ytd-searchbox {
  512. 			cursor: pointer;
  513. 			width: 65px;
  514. 			border: white;
  515. 			background-color: white;
  516. 			border-radius: 0 100px 100px 0;
  517. 			margin: 0;
  518. 	}
  519. 	ytd-searchbox[mode=legacy] #container.ytd-searchbox {
  520. 			background-color: white;
  521. 			border: white;
  522. 			border-right: none;
  523. 			box-shadow: 0px 0px 0px 0px;
  524. 			text-align: center;
  525. 			padding: 2px 6px;
  526. 			border-radius: 100px 0 0 100px;
  527. 	}
  528. 	ytd-searchbox[mode=legacy][has-focus] #container.ytd-searchbox {
  529. 			border: 0px solid #1c62b9;
  530. 			box-shadow: inset 0 0px 2px rgba(0, 0, 0, 0);
  531. 	}
  532. 	li.sbsb_c.gsfs {
  533. 			text-align: center!important;
  534. 	}
  535. 	#like-bar.ytd-sentiment-bar-renderer {
  536. 			background: -moz-linear-gradient(/*[[gradient]]*/);
  537. 			height: 2px;
  538. 			transition: width 0.3s;
  539. 	}
  540. 	a.yt-simple-endpoint.yt-formatted-string {
  541. 			color: var(--yt-primary-color)!important;
  542. 	}
  543. 	#owner-name.ytd-video-owner-renderer {
  544. 			font-size: 1.4rem;
  545. 			font-weight: 500;
  546. 			line-height: 1.6rem;
  547. 	}
  548. 	div#sb-heading {
  549. 			background-color: rgba(255, 0, 0, 0)!important;
  550. 			background: -moz-linear-gradient(90deg, /*[[gradient]]*/);
  551. 	}
  552. 	#buttons.ytd-masthead[is-icon-button].ytd-masthead {
  553. 			color: white;
  554. 	}
  555. 	div#ChanOver span {
  556. 			color: white!important;
  557. 	}
  558. 	div#ChanOver {
  559. 			background-color: rgba(255, 0, 0, 0)!important;
  560. 			background: -moz-linear-gradient(50deg, /*[[gradient]]*/);
  561. 			color: white!important;
  562. 	}
  563. 	div#ChanOver h2 {
  564. 			color: white!important;
  565. 	}
  566. 	div#ChanOver h3 {
  567. 			color: white!important;
  568. 	}
  569. 	div#ChanOver a {
  570. 			color: white!important;
  571. 	}
  572. 	div#sb-heading {
  573. 			background-color: rgba(255, 0, 0, 0)!important;
  574. 			background: URL(https://i.imgur.com/dc7CRrl.png);
  575. 			BACKGROUND-POSITION: center;
  576. 	}
  577. 	div#sb-heading A {
  578. 			opacity: 0;
  579. 	}
  580. 	div#ChanOver div {
  581. 			border-bottom: 0px solid !important;
  582. 			border-right: 0px !important;
  583. 	}
  584. 	div#socialblade-stats {
  585. 			background: -moz-linear-gradient(90deg, /*[[gradient]]*/)!important;
  586. 	}
  587. 	div#vid-tags-outdated div {
  588. 			color: white!important;
  589. 	}
  590. 	div#SBMenu div h3 {
  591. 			background-color: white!important;
  592. 			border-right: 0px!important;
  593. 			color: var(--yt-primary-color)!important;
  594. 	}
  595. 	div#SBMenu div {
  596. 			background-color: white!important;
  597. 			border-right: 0px!important;
  598. 			color: var(--yt-primary-color)!important;
  599. 	}
  600. 	p#vid-tags span {
  601. 			background-color: white!important;
  602. 			color: var(--yt-primary-color)!important;
  603. 			border-radius: 100px!important;
  604. 	}
  605. 	a#SBL div {
  606. 			background: white!important;
  607. 			color: black!important;
  608. 	}
  609. 	a#SBL div h3 {
  610. 			background: white!important;
  611. 			color: var(--yt-primary-color)!important;
  612. 	}
  613. 	div#socialblade {
  614. 			box-shadow: 1px 0px 16px 1px #0000003b;
  615. 	}
  616. 	a#SBLC div h3 {
  617. 			color: var(--yt-primary-color)!important;
  618. 	}
  619. 	a#SBLC div {
  620. 			background-color: white!important;
  621. 	}
  622. 	a#SBLC div:hover {
  623. 			background-color: grey!important;
  624. 	}
  625. 	a#SBLC div {
  626. 			background-color: white!important;
  627. 	}
  628. 	paper-toggle-button[checked]:not([disabled]) .toggle-bar.paper-toggle-button {
  629. 			opacity: 1;
  630. 			background-color: #ff000000;
  631. 			background: -moz-linear-gradient(90deg, /*[[gradient]]*/);
  632. 	}
  633. 	paper-toggle-button[checked]:not([disabled]) .toggle-button.paper-toggle-button {
  634. 			background-color: var(--yt-primary-color)!important;
  635. 			background: -moz-linear-gradient(90deg, /*[[gradient]]*/);
  636. 	}
  637. 	yt-icon.style-scope.ytd-topbar-menu-button-renderer {
  638. 			fill: white!important;
  639. 			color: white!important;
  640. 	}
  641. 	span.count {
  642. 			color: var(--yt-primary-color)!important;
  643. 			font-weight: lighter!important;
  644. 	}
  645. 	ytd-button-renderer.style-primary[is-paper-button] {
  646. 			background-color: hsla(206, 79%, 53%, 0);
  647. 			color: hsl(0, 0%, 100%);
  648. 			background: -moz-linear-gradient(90deg, /*[[gradient]]*/);
  649. 			border-radius: 100px;
  650. 	}
  651. 	a#iridium_settings_button svg {
  652. 			color: white;
  653. 	}
  654. 	g#youtube-paths path {
  655. 			fill: white!important;
  656. 	}
  657. 	polygon.style-scope.yt-icon {
  658. 			fill: var(--yt-primary-color)!important;
  659. 	}
  660. 	body[invert] yt-icon#logo-icon.ytd-topbar-logo-renderer svg {
  661. 			opacity: 0;
  662. 	}
  663. 	body[invert] yt-icon#logo-icon.ytd-topbar-logo-renderer {
  664. 			width: 80px;
  665. 			background: url(https://i.imgur.com/oHv7EEw.png);
  666. 			background-size: contain;
  667. 			background-position: center;
  668. 			background-repeat: no-repeat;
  669. 	}
  670. 	app-drawer.ytd-app:not([persistent]) #header.ytd-app {
  671. 			background: -moz-linear-gradient(90deg, /*[[gradient]]*/);
  672. 	}
  673. 	.ytp-play-progress.ytp-swatch-background-color {
  674. 			background: -moz-linear-gradient(90deg, /*[[gradient]]*/);
  675. 	}
  676. 	#guide-icon.ytd-masthead {
  677. 			fill: white;
  678. 	}
  679. 	#guide-icon.ytd-app {
  680. 			fill: white;
  681. 	}
  682. 	section.vc-stat-section.third-layout div span {
  683. 			color: var(--yt-primary-color)!important;
  684. 	}
  685. 	.vc-stat-section .stat-box.alt {
  686. 			background: rgb(255, 255, 255);
  687. 			border-color: white;
  688. 	}
  689. 	paper-button.ytd-subscribe-button-renderer {
  690. 			background-color: #ff000005;
  691. 			border-radius: 2px;
  692. 			padding: 10px 16px;
  693. 			margin: auto 4px;
  694. 			white-space: nowrap;
  695. 			background: -moz-linear-gradient(90deg, /*[[gradient]]*/);
  696. 			font-size: 1.4rem;
  697. 			font-weight: 300;
  698. 			letter-spacing: .007px;
  699. 			text-transform: uppercase;
  700. 			display: flex;
  701. 			-ms-flex-direction: row;
  702. 			-webkit-flex-direction: row;
  703. 			flex-direction: row;
  704. 	}
  705. 	.video-companion-container ul.keywords .search-rank {
  706. 			margin-left: 0.5em;
  707. 			color: white;
  708. 			font-weight: bold;
  709. 			display: inline-block;
  710. 			height: 15px;
  711. 			vertical-align: middle;
  712. 			line-height: 15px;
  713. 			background: -moz-linear-gradient(90deg, /*[[gradient]]*/);
  714. 			padding: 0px 3px;
  715. 	}
  716. 	.vidiq-logo-container {
  717. 			filter: brightness(0)!important;
  718. 	}
  719. 	img#sb-return {
  720. 			filter: brightness(100000%);
  721. 			padding-right: 10px;
  722. 	}
  723. 	#socialblade-tab paper-button {
  724. 			background-color: #ff6c7b !important;
  725. 			border-radius: 2px;
  726. 			color: #ffffff !important;
  727. 			padding: 10px 16px;
  728. 			margin: auto 4px;
  729. 			white-space: nowrap;
  730. 			font-size: 1.4rem;
  731. 			font-weight: 500;
  732. 			letter-spacing: .007px;
  733. 			text-transform: uppercase;
  734. 			display: flex;
  735. 			-ms-flex-direction: row;
  736. 			-webkit-flex-direction: row;
  737. 			flex-direction: row;
  738. 	}
  739. 	.vidiq-rating-bar-container .vidiq-rating-bar .vidiq-rating-likes {
  740. 			height: 5px;
  741. 			background: -moz-linear-gradient(90deg, /*[[gradient]]*/)​;
  742. 	}
  743. 	ytd-guide-entry-renderer[active] .guide-icon.ytd-guide-entry-renderer {
  744. 			color: var(--yt-primary-color)!important;
  745. 	}
  746. 	.badge-style-type-featured.ytd-badge-supported-renderer {
  747. 			background: -moz-linear-gradient(90deg, /*[[gradient]]*/);
  748. 			color: hsl(0, 0%, 100%);
  749. 			padding: 6px 10px 5px 10px;
  750. 			border-radius: 10px;
  751. 			text-transform: uppercase;
  752. 			font-weight: 100;
  753. 			letter-spacing: 2px;
  754. 	}
  755. 	.vidiq-rating-bar-container .vidiq-rating-bar .vidiq-rating-likes {
  756. 			height: 5px;
  757. 			background: #f98a5f;
  758. 	}
  759. 	yt-icon.ytd-badge-supported-renderer {
  760. 			background: url(https://i.imgur.com/FhRzUqU.png);
  761. 			color: #b3b1b100;
  762. 			background-size: 116%;
  763. 			background-repeat: no-repeat;
  764. 			background-position: center;
  765. 	}
  766. 	.vidiq-rating-bar {
  767. 			background-color: #faae90!important;
  768. 	}
  769. 	#search-icon-legacy.ytd-searchbox {
  770. 			cursor: pointer;
  771. 			width: 65px;
  772. 			border: white;
  773. 			background-color: #ff516e;
  774. 			border-radius: 0 100px 100px 0;
  775. 			box-shadow: 1px 0px 19px 0px #1010102b;
  776. 			margin: 0;
  777. 	}
  778. 	ytd-searchbox[mode=legacy] #container.ytd-searchbox input.ytd-searchbox {
  779. 			color: black;
  780. 	}
  781. 	button.vidiq-button {
  782. 			border-radius: 100px;
  783. 			background: -moz-linear-gradient(90deg, /*[[gradient]]*/);
  784. 			font-family: Roboto;
  785. 			text-transform: uppercase;
  786. 			border: 0px solid!important;
  787. 	}
  788. 	#search-icon-legacy.ytd-searchbox {
  789. 			cursor: pointer;
  790. 			width: 65px;
  791. 			border: white;
  792. 			background-color: white!important;
  793. 			border-radius: 0 100px 100px 0;
  794. 			box-shadow: 1px 0px 19px 0px #1010102b;
  795. 			margin: 0;
  796. 	}
  797. 	div#SBMenu div h3 {
  798. 			background-color: white!important;
  799. 			border-right: 0px!important;
  800. 			color: black!important;
  801. 	}
  802. 	span.value-inner {
  803. 			-moz-text-fill-color: black!important;
  804. 	}
  805. 	div#sb-heading {
  806. 			background-color: rgba(255, 0, 0, 0)!important;
  807. 			background: moz-linear-gradient(90deg, /*[[gradient]]*/)!IMPORTANT;
  808. 			BACKGROUND-POSITION: center;
  809. 	}
  810. 	div#sb-heading A {
  811. 			opacity: 1!important;
  812. 			background: url(https://i.imgur.com/TvIeZZx.png);
  813. 			margin-top: -100px;
  814. 			padding: 100px 0px 49px 100px;
  815. 			background-repeat: no-repeat;
  816. 			background-size: 62%;
  817. 			margin-left: 12px;
  818. 			background-position: center;
  819. 	}
  820. 	.ytp-scrubber-button.ytp-swatch-background-color {
  821. 			background: moz-linear-gradient(270deg, /*[[gradient]]*/)!important;
  822. 	}
  823. 	.ytp-cards-teaser-text {
  824. 			border-radius: 100px;
  825. 	}
  826. 	video.video-stream.html5-main-video {
  827. 			border-radius: 8px;
  828. 	}
  829. 	ytd-watch:not([transparent-player-background_]) #player-container.ytd-watch, ytd-watch[flexy-fit-to-video_]:not([is-currently-flexible_]) #player-container.ytd-watch, ytd-watch[theater] #player-container.ytd-watch {
  830. 			background-color: #0000!important;
  831. 	}
  832. 	ytd-watch:not([transparent-player-background_]) #player-container.ytd-watch, ytd-watch[flexy-fit-to-video_]:not([is-currently-flexible_]) #player-container.ytd-watch, ytd-watch[theater] #player-container.ytd-watch {
  833. 			background-color: #0000!important;
  834. 	}
  835. 	#player-container.ytd-watch {
  836. 			width: 100%;
  837. 			height: 100%;
  838. 			margin: 0 auto;
  839. 			border-radius: 8px;
  840. 			position: relative;
  841. 	}
  842. 	#top>#player #movie_player:not(.ytp-fullscreen) video, #top>#player #movie_player:not(.ytp-fullscreen) .html5-video-container {
  843. 			height: 100%!important;
  844. 			border-radius: 8px!important;
  845. 	}
  846. 	div#player {
  847. 			border-radius: 8px!important;
  848. 	}
  849. 	#player.ytd-watch {
  850. 			position: relative;
  851. 			-ms-flex: none;
  852. 			-webkit-flex: none;
  853. 			flex: none;
  854. 			border-radius: 8px!important;
  855. 	}
  856. 	video.video-stream.html5-main-video {
  857. 			border-radius: 8px!important;
  858. 	}
  859. 	.html5-video-player:not(.ytp-transparent), .html5-video-player.ad-interrupting, .html5-video-player.ended-mode, .html5-video-player.ytp-fullscreen {
  860. 			background-color: #ff373700;
  861. 	}
  862. 	p#vid-tags span {
  863. 			background-color: white!important;
  864. 			color: #000000fa!important;
  865. 			border-radius: 100px!important;
  866. 	}
  867. 	.vidiq-subscriber-count.new-layout span {
  868. 			color: black!important;
  869. 	}
  870. 	.vidiq-logo-container {
  871. 			filter: invert(100%)!important;
  872. 			filter: brightness(10000000000%)!important;
  873. 	}
  874. 	header.video-companion-header {
  875. 			padding-bottom: 19px;
  876. 	}
  877. 	#thumbnail.ytd-thumbnail {
  878. 			position: absolute;
  879. 			top: 0;
  880. 			right: 0;
  881. 			bottom: 0;
  882. 			border-radius: 5px;
  883. 			left: 0;
  884. 	}
  885. 	img.yt-img-shadow {
  886. 			display: block;
  887. 			border-radius: 5px;
  888. 			margin-left: auto;
  889. 			margin-right: auto;
  890. 			max-height: var(--yt-img-max-height, none);
  891. 			max-width: var(--yt-img-max-width, 100%);
  892. 	}
  893. 	img.yt-img-shadow {
  894. 			display: block;
  895. 			margin-left: auto;
  896. 			border-radius: 6px;
  897. 			margin-right: auto;
  898. 			max-height: var(--yt-img-max-height, none);
  899. 			max-width: var(--yt-img-max-width, 100%);
  900. 	}
  901. 	.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 {
  902. 			content:'';
  903. 			position: absolute;
  904. 			top: 10px;
  905. 			right: 5px;
  906. 			height: 9px;
  907. 			color: hsla(0, 0%, 0%, 0.88)!important;
  908. 			width: 13px;
  909. 			background-color: #000;
  910. 			border-radius: 1px;
  911. 			line-height: normal;
  912. 			border-radius: 100px;
  913. 	}
  914. 	div#sb-heading {
  915. 			background-color: rgba(255, 0, 0, 0)!important;
  916. 			border-radius: 8px 8px 0 0px;
  917. 			background: moz-linear-gradient(90deg, /*[[gradient]]*/)!IMPORTANT;
  918. 			BACKGROUND-POSITION: center;
  919. 	}
  920. 	div#sb-data-pages {
  921. 			border-radius: 0px 0 8px 8px;
  922. 	}
  923. 	.ytp-settings-button.ytp-hd-quality-badge:after {
  924. 			background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zd…wxMCw2IEwxMCw0IFoiIGZpbGw9IiNmZmYiIGZpbGwtcnVsZT0iZXZlbm9kZCIgLz48L3N2Zz4=)!IMPORTANT;
  925. 	}
  926. 	.ytp-settings-button.ytp-hd-quality-badge:after {
  927. 			background: linear-gradient(90deg, /*[[gradient]]*/)!IMPORTANT;
  928. 	}
  929. 	yt-icon.style-scope.ytd-notification-topbar-button-renderer {
  930. 			fill: white!important;
  931. 	}
  932. 	}