Advertisement
Guest User

Untitled

a guest
Dec 4th, 2016
58
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 42.61 KB | None | 0 0
  1. /*
  2. _ _ _
  3. __ _ _ __ _ __ | |__ __ _ ___| | ____ _ _ __ ___ _ _ _ __ __| |
  4. / _` | '_ \| '_ \ | '_ \ / _` |/ __| |/ / _` | '__/ _ \| | | | '_ \ / _` |
  5. | (_| | |_) | |_) | | |_) | (_| | (__| < (_| | | | (_) | |_| | | | | (_| |
  6. \__,_| .__/| .__/ |_.__/ \__,_|\___|_|\_\__, |_| \___/ \__,_|_| |_|\__,_|
  7. |_| |_| |___/
  8. */
  9.  
  10. /* Main background and settings background */
  11. .app,
  12. .callout-backdrop {
  13. background:url(https://i.imgur.com/7SbtKvw.png) !important;
  14. background-size:cover !important;
  15. }
  16.  
  17. /*
  18. _ _
  19. ___ ___ _ __ ___ ___| | ___ _ __ ___ ___ _ __ | |_ ___
  20. / __/ _ \| '__/ _ \ / _ \ |/ _ \ '_ ` _ \ / _ \ '_ \| __/ __|
  21. | (_| (_) | | | __/ | __/ | __/ | | | | | __/ | | | |_\__ \
  22. \___\___/|_| \___| \___|_|\___|_| |_| |_|\___|_| |_|\__|___/
  23.  
  24. */
  25.  
  26. /* latin-ext */
  27. @font-face {
  28. font-family: 'Karla';
  29. font-style: normal;
  30. font-weight: 400;
  31. src: local('Karla'), local('Karla-Regular'), url(https://fonts.gstatic.com/s/karla/v5/31P4mP32i98D9CEnGyeX9Q.woff2) format('woff2');
  32. unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
  33. }
  34. /* latin */
  35. @font-face {
  36. font-family: 'Karla';
  37. font-style: normal;
  38. font-weight: 400;
  39. src: local('Karla'), local('Karla-Regular'), url(https://fonts.gstatic.com/s/karla/v5/Zi_e6rBgGqv33BWF8WTq8g.woff2) format('woff2');
  40. unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
  41. }
  42.  
  43. div>*:not(code) {
  44. font-family: 'Karla',Whitney,Helvetica Neue,Helvetica,Arial,Lucida Grande,sans-serif !important;
  45. }
  46.  
  47. textarea {
  48. background:transparent !important;
  49. }
  50.  
  51. .scroller-wrap .scroller::-webkit-scrollbar-thumb {
  52. border:3px solid rgba(255,255,255,0) !important;
  53. background-color:#1D6586 !important;
  54. }
  55.  
  56. .scroller-wrap .scroller::-webkit-scrollbar-track-piece {
  57. border:3px solid rgba(255,255,255,0) !important;
  58. background-color:rgba(0,0,0,0.3) !important;
  59. }
  60.  
  61. /*
  62. _ _ _
  63. | |__ (_) __| | ___
  64. | '_ \| |/ _` |/ _ \
  65. | | | | | (_| | __/
  66. |_| |_|_|\__,_|\___|
  67.  
  68. */
  69.  
  70. .links,
  71. .help-container {
  72. display: none;
  73. }
  74.  
  75. /*
  76. _ _ _ _
  77. _ __ ___ __ _(_)_ __ | |__ __ _ ___| | ____ _ _ __ ___ _ _ _ __ __| |___
  78. | '_ ` _ \ / _` | | '_ \ | '_ \ / _` |/ __| |/ / _` | '__/ _ \| | | | '_ \ / _` / __|
  79. | | | | | | (_| | | | | | | |_) | (_| | (__| < (_| | | | (_) | |_| | | | | (_| \__ \
  80. |_| |_| |_|\__,_|_|_| |_| |_.__/ \__,_|\___|_|\_\__, |_| \___/ \__,_|_| |_|\__,_|___/
  81. |___/
  82. */
  83.  
  84. .links,
  85. .chat,
  86. .typing,
  87. .content,
  88. .guild-channels,
  89. .private-channels,
  90. .guild-header header,
  91. .divider-red span,
  92. .messages-wrapper,
  93. #voice-connection {
  94. background: transparent !important;
  95. }
  96.  
  97. /* Server list area */
  98. .guilds-wrapper { background:rgba(0,0,0,0.6) !important }
  99.  
  100. /* Channels list area */
  101. .channels-wrap { background:rgba(0,0,0,0.7) }
  102.  
  103. /* Chat area */
  104. .content .flex-spacer { background:rgba(0,0,0,0.8) }
  105.  
  106. /* User list area */
  107. .channel-members { background:rgba(0,0,0,0.9) !important }
  108.  
  109. /*
  110. _ _ _ _ _
  111. ___ ___ _ ____ _____ _ __ | (_)___| |_ ___ ___ ___| |_(_) ___ _ __
  112. / __|/ _ \ '__\ \ / / _ \ '__| | | / __| __| / __|/ _ \/ __| __| |/ _ \| '_ \
  113. \__ \ __/ | \ V / __/ | | | \__ \ |_ \__ \ __/ (__| |_| | (_) | | | |
  114. |___/\___|_| \_/ \___|_| |_|_|___/\__| |___/\___|\___|\__|_|\___/|_| |_|
  115.  
  116. */
  117.  
  118. .create-guild-container {
  119. background:none !important;
  120. }
  121.  
  122. .create-guild-container .action {
  123. background:rgba(0,0,0,0.7);
  124. }
  125.  
  126. .create-guild-container .create-or-join .actions .or {
  127. -webkit-filter:opacity(0.9) invert();
  128. color:#000;
  129. }
  130.  
  131. .create-guild-container .action.create .action-icon,
  132. .create-guild-container .action.join .action-icon {
  133. -webkit-filter:invert() hue-rotate(150deg);
  134. }
  135.  
  136. .create-guild-container h5,
  137. .create-guild-container .action.create .action-header {
  138. color:#25ACE8;
  139. }
  140.  
  141. .create-guild-container .action.create .btn-primary {
  142. background-color:#25ACE8 !important;
  143. }
  144.  
  145. .create-guild-container .action.create:hover .btn-primary {
  146. background-color:#1D6586 !important;
  147. }
  148.  
  149. .create-guild-container .form-actions .btn-default {
  150. background: rgba(255,255,255,0.1);
  151. border: 0;
  152. }
  153.  
  154. .create-guild-container .create-guild .guild-form .region-select {
  155. background: rgba(255,255,255,0.1);
  156. }
  157.  
  158. .create-guild-container .create-guild .guild-form .region-select button {
  159. color:#000;
  160. }
  161.  
  162. .create-guild-container .create-guild .guild-form .region-select:hover button {
  163. background-color:#25ACE8;
  164. border-color:#25ACE8;
  165. color:#fff;
  166. }
  167.  
  168. .create-guild-container .create-guild .guild-form .region-select:hover .region-select-inner {
  169. border-color:#25ACE8;
  170. }
  171.  
  172. .create-guild-container .create-guild .guild-form .region-select-name {
  173. color:#fff;
  174. }
  175.  
  176. .avatar-uploader .avatar-uploader-inner {
  177. background-color: #25ACE8;
  178. }
  179.  
  180. .region-select-modal {
  181. background:rgba(0,0,0,0.8);
  182. }
  183.  
  184. .region-select-modal .region-select-modal-header {
  185. color:#25ACE8;
  186. }
  187.  
  188. .region-select-modal .region-select-modal-option {
  189. background:rgba(255,255,255,0.1);
  190. border:2px solid rgba(255,255,255,0.1);
  191. }
  192.  
  193. .region-select-modal .region-select-modal-option:hover {
  194. border-color: #25ACE8;
  195. }
  196.  
  197. .region-select-modal .region-select-modal-option .region-select-name {
  198. color:#fff;
  199. }
  200.  
  201. .guild-header ul {
  202. background:#000 !important;
  203. opacity:0 !important;
  204. transition: transform .5s cubic-bezier(0.18, 0.89, 0.32, 1.28) !important;
  205. padding-top:100px;
  206. top:-56px;
  207. }
  208.  
  209. .guild-header-open ul {
  210. opacity:1 !important;
  211. }
  212.  
  213. .guilds-add {
  214. opacity:0.5;
  215. font-size:22px !important;
  216. }
  217.  
  218. .platform-osx .guilds-wrapper {
  219. padding-top:30px;
  220. }
  221.  
  222. .guilds-wrapper {
  223. border-right:1px solid rgba(0,0,0,0.4);
  224. box-shadow:inset -10px 0px 20px -10px rgba(0,0,0,0.2);
  225. }
  226.  
  227. .guilds-wrapper .guild-separator {
  228. margin-top:5px;
  229. margin-bottom:5px;
  230. margin-left:-5px;
  231. display:none;
  232. }
  233.  
  234. .guilds-wrapper .guild-separator:after {
  235. background:transparent;
  236. }
  237.  
  238. .guild-header header span {
  239. margin-left:-7px;
  240. }
  241.  
  242. .guild-header header {
  243. box-shadow:none !important;
  244. color:#ddd;
  245. }
  246.  
  247. .guild-channels header h2 {
  248. padding:0 18px;
  249. }
  250.  
  251. .guild-channels .channel-text .channel-name,
  252. .guild-channels .channel-voice .channel-name {
  253. font-size:0.9em;
  254. }
  255.  
  256. .guild-channels .channel-text a {
  257. padding:8px 6px 10px 18px;
  258. }
  259.  
  260. .guild-channels header h2,
  261. .guild-channels .channel a {
  262. color:#fff;
  263. }
  264.  
  265. .guilds-wrapper .guilds {
  266. padding:18px 20px 85px 20px;
  267. }
  268.  
  269. .guilds-add {
  270. font-size:30px;
  271. background:#000;
  272. }
  273.  
  274. .guilds-wrapper .guilds .friends-online {
  275.  
  276. }
  277.  
  278. .guilds-wrapper .guilds .guild .guild-inner {
  279. background:#151515 !important;
  280. }
  281.  
  282. .guilds-wrapper .guilds .guild.active:first-of-type .guild-inner {
  283. background:#25ACE8 !important;
  284. }
  285.  
  286. .guilds-wrapper .guilds .guild .guild-inner:hover {
  287. background:#1D6586 !important;
  288. }
  289.  
  290. .guilds-wrapper .guilds .guild .guild-inner a,
  291. .guilds-wrapper .guilds .guild,
  292. .guilds-wrapper .guilds .guild .avatar-small {
  293. width:40px;
  294. height:40px;
  295. }
  296.  
  297. .guilds-wrapper .guilds .guild .avatar-small {
  298. width:40px;
  299. height:40px;
  300. background-size: 40px 40px;
  301. }
  302.  
  303. .guilds-wrapper .guilds .guild .guild-inner {
  304. line-height:40px;
  305. }
  306.  
  307. .guilds-wrapper .guilds .friends-icon {
  308. width:40px;
  309. height:40px;
  310. background-size:25px 19px;
  311. }
  312.  
  313. .guilds-wrapper .guilds .friends-icon {
  314. background-color: rgba(0,0,0,0.3) !important;
  315. background-image: none !important;
  316. padding-top:0px;
  317. }
  318.  
  319. .guilds-wrapper .guilds .friends-icon:after {
  320. display:block;
  321. width:40px;
  322. height:40px;
  323. content:'';
  324. background-image: url(https://i.imgur.com/cm6mEXd.gif) !important;
  325. background-size:110%;
  326. background-repeat:no-repeat;
  327. background-position:top center;
  328. }
  329.  
  330. .guilds-wrapper .guilds .guild.audio .guild-inner:after {
  331. background-size:12px;
  332. background-color:rgba(0,0,0,0.8);
  333. }
  334.  
  335. .guilds-wrapper .guilds .guild:before,
  336. .guilds-wrapper .guilds .guild.unread:before,
  337. .guilds-wrapper .guilds .guild.selected:before {
  338. left:-26px;
  339. transition:0.2s ease-in-out all;
  340. }
  341.  
  342. .guilds-wrapper .guilds .guild.unread:not(.selected):before,
  343. .guild-channels .channel-text.unread:not(.selected):not(.channel-muted):before {
  344. background:#25ACE8;
  345. }
  346.  
  347. .guilds-wrapper .guilds .guild.active .guild-inner:before {
  348. background:#fff !important;
  349. }
  350.  
  351. .guilds-wrapper .guilds .friends-online {
  352. color: #ccc;
  353. font-size: 9px;
  354. margin: 15px 0 15px -7px;
  355. line-height: 20px;
  356. width: 55px;
  357. height: 20px;
  358. border-radius: 25px;
  359. overflow: hidden;
  360. background: rgba(0,0,0,0.3);
  361. }
  362.  
  363. .guilds-wrapper .guilds-error {
  364. width:40px;
  365. height:40px;
  366. line-height:36px;
  367. }
  368.  
  369. .guild-channels header h2,
  370. .private-channels header {
  371. opacity:.6;
  372. }
  373.  
  374. .guild-channels .channel:hover {
  375. background:rgba(0,0,0,0.3) !important;
  376. }
  377.  
  378. .private-channels .search-bar {
  379. background:rgba(10,13,16,0) !important;
  380. }
  381.  
  382. .private-channels .search-bar input {
  383. background:rgba(0,0,0,0.8) !important;
  384. }
  385.  
  386. .guild-channels .channel.selected,
  387. .private-channels .channel.selected,
  388. .private-channels .search-result.selected,
  389. .private-channels .search-result:hover {
  390. background:rgba(0,0,0,0.6) !important;
  391. }
  392.  
  393. .guild-channels ul .channel:not(.selected):hover,
  394. .private-channels .channel:not(.selected):hover {
  395. background:rgba(0,0,0,0.3) !important;
  396. }
  397.  
  398. .guild-channels .channel:not(.selected):before,
  399. .guild-channels .channel.selected:before,
  400. .guild-channels .channel.selected:hover:before,
  401. .private-channels .channel:not(.selected):before,
  402. .private-channels .channel.selected:before,
  403. .private-channels .channel.selected:hover:before,
  404. .private-channels .search-result.selected:before,
  405. .private-channels .search-result:hover:before {
  406. border-left:2px solid #1D6586 !important;
  407. }
  408.  
  409. .private-channels .channel .icon-friends {
  410. background-color:#151515 !important;
  411. }
  412.  
  413. .guild-channels .channel-text.unread:not(.selected):not(.channel-muted):before {
  414. left:-8px;
  415. }
  416.  
  417. /*
  418. _ _ _ _
  419. ___| |__ __ _ _ __ _ __ ___| |___ ___ ___ ___| |_(_) ___ _ __
  420. / __| '_ \ / _` | '_ \| '_ \ / _ \ / __| / __|/ _ \/ __| __| |/ _ \| '_ \
  421. | (__| | | | (_| | | | | | | | __/ \__ \ \__ \ __/ (__| |_| | (_) | | | |
  422. \___|_| |_|\__,_|_| |_|_| |_|\___|_|___/ |___/\___|\___|\__|_|\___/|_| |_|
  423.  
  424. */
  425.  
  426. .btn-hamburger {
  427. margin-right:-30px;
  428. }
  429.  
  430. .btn-hamburger span {
  431. background:#fff;
  432. }
  433.  
  434. .account {
  435. z-index:9;
  436. border-top:none !important;
  437. width:320px;
  438. margin-left:-80px;
  439. padding:0 15px !important;
  440. background:rgba(0,0,0,0.95);
  441. height:77px;
  442. box-sizing:border-box;
  443. }
  444.  
  445. .account .status {
  446. border:2px solid rgba(0,0,0,1);
  447. }
  448.  
  449. .account .btn {
  450. background:transparent;/*#000;*/
  451. box-shadow:none !important;
  452. }
  453.  
  454. .account .btn:active {
  455. background:#000;
  456. }
  457.  
  458. .account .btn-settings:after {
  459. opacity:0.3;
  460. }
  461.  
  462. .account .btn-deafen,
  463. .account .btn-mute {
  464. border-right:none;/*1px solid #101010;*/
  465. }
  466.  
  467. #voice-connection {
  468. z-index:9;
  469. border-top:none !important;
  470. /*width:285px;
  471. margin-left:-83px;*/
  472. padding:15px 20px 15px 18px !important;
  473. }
  474.  
  475. #voice-connection .btn {
  476. background:#000;
  477. box-shadow:none !important;
  478. }
  479.  
  480. .account .btn-deafen, .account .btn-settings {
  481. box-shadow:none !important;
  482. }
  483.  
  484. .account .btn-group, #voice-connection .btn-group {
  485. border:none;
  486. }
  487.  
  488. .account .avatar-small {
  489. margin:0 0 0 10px;
  490. }
  491.  
  492. .message-group .comment {
  493. background:transparent !important;
  494. border:none !important;
  495. }
  496.  
  497. /*
  498. _ _ _ _
  499. ___| |__ __ _| |_ ___ ___ ___| |_(_) ___ _ __
  500. / __| '_ \ / _` | __| / __|/ _ \/ __| __| |/ _ \| '_ \
  501. | (__| | | | (_| | |_ \__ \ __/ (__| |_| | (_) | | | |
  502. \___|_| |_|\__,_|\__| |___/\___|\___|\__|_|\___/|_| |_|
  503.  
  504. */
  505.  
  506. .header-toolbar button.popout-open {
  507. background:#25ACE8;
  508. }
  509.  
  510. .channel-pins-wrap {
  511. background: rgba(0,0,0,0.9) !important;
  512. }
  513.  
  514. .channel-pins-wrap .header,
  515. .channel-pins-wrap .footer {
  516. background-color: rgba(0,0,0,0.95) !important;
  517. box-shadow: none !important;
  518. }
  519.  
  520. .channel-pins .message-group {
  521. background-color: rgba(0,0,0,0.7) !important;
  522. }
  523.  
  524. .channel-pins .message-group:hover {
  525. box-shadow: 0 0 4px 5px rgba(37, 172, 232, 0.1);
  526. border-color: rgba(37, 172, 232, 0.47) !important;
  527. }
  528.  
  529. .channel-pins .message-group .action-buttons {
  530. box-shadow: none !important;
  531. background: none !important;
  532. }
  533.  
  534. .channel-pins .message-group .action-buttons .jump-button {
  535. background-color: rgba(255,255,255,0.15) !important;
  536. }
  537.  
  538. .spinner-wandering-cubes .spinner-item {
  539. background-color:#25ACE8;
  540. width:15px;
  541. height:15px;
  542. border-radius:4px;
  543. }
  544.  
  545. .chat .has-more button {
  546. color:#25ACE8 !important;
  547. background:rgba(255,255,255,0.1) !important;
  548. border:none !important;
  549. box-shadow:none !important;
  550. }
  551.  
  552. .highlight {
  553. color:#25ACE8;
  554. }
  555.  
  556. .emoji-picker {
  557. background:rgba(0,0,0,0.85) !important;
  558. }
  559.  
  560. .emoji-picker .search-bar input {
  561. color:rgba(255,255,255,0.7);
  562. background:rgba(255,255,255,0.1);
  563. }
  564.  
  565. .emoji-picker .search-bar-clear {
  566. background:rgba(0,0,0,0.7);
  567. }
  568.  
  569. .emoji-picker .sticky-header,
  570. .emoji-picker .search-bar {
  571. background:rgba(0,0,0,0.95) !important;
  572. }
  573.  
  574. .emoji-picker .categories .item.selected {
  575. border-bottom-color:#25ACE8;
  576. }
  577.  
  578. .title-wrap {
  579. border-bottom:1px solid rgba(0,0,0,0.3) !important;
  580. background:rgba(0,0,0,0.95) !important;
  581. }
  582.  
  583. .header-toolbar button.active {
  584. background-color:rgba(255,255,255,0.1);
  585. }
  586.  
  587. .bot-tag,
  588. .need-help-modal .header {
  589. background:#25ACE8;
  590. }
  591.  
  592. .form header {
  593. color:#25ACE8;
  594. }
  595.  
  596. .markdown-modal,
  597. .form .form-inner,
  598. .form .form-header,
  599. .form .form-actions,
  600. .need-help-modal .footer,
  601. .markdown-modal .markdown-modal-footer {
  602. background:rgba(0,0,0,0.85) !important;
  603. }
  604.  
  605. .channel-notification-settings .content label,
  606. .notification-settings-modal .mute-server .checkbox .label span {
  607. color:#fff;
  608. }
  609.  
  610. .notification-settings-modal .notification-settings-modal-channel-settings-list {
  611. box-shadow:none !important;
  612. }
  613.  
  614. .markdown-modal .markdown-modal-header {
  615. color:#fff;
  616. }
  617.  
  618. .form .form-header,
  619. .form .form-actions,
  620. .need-help-modal .footer,
  621. .channel-notification-settings,
  622. .markdown-modal .markdown-modal-header,
  623. .markdown-modal .markdown-modal-footer {
  624. border-color:rgba(255,255,255,0.2);
  625. }
  626.  
  627. .modal-content .user-name {
  628. color:#fff;
  629. }
  630.  
  631. .modal-content .form-inner p {
  632. color:rgba(255,255,255,0.7);
  633. }
  634.  
  635. .chat .new-messages-bar {
  636. background-color:rgba(29,101,134,.9);
  637. }
  638.  
  639. .chat .new-messages-bar:hover {
  640. background-color:rgba(29,101,134,1);
  641. }
  642.  
  643. .chat .new-messages-bar button:last-child {
  644. color:rgba(255,255,255,0.5);
  645. }
  646.  
  647. .chat-empty {
  648. background:rgba(20,23,27,0.95);
  649. }
  650.  
  651. .chat>.title-wrap>.title .channel-name {
  652. color:rgba(255,255,255,0.8);
  653. }
  654.  
  655. .chat>.title-wrap>.topic {
  656. font-size:12px;
  657. margin-top:5px;
  658. color:#656565 !important;
  659. }
  660.  
  661. .markdown-modal .highlight,
  662. .chat .title-wrap .topic .highlight {
  663. background-color:rgba(255,255,255,.1) !important;
  664. }
  665.  
  666. .markdown-modal .highlight:hover,
  667. .chat .title-wrap .topic .highlight:hover {
  668. background-color:rgba(255,255,255,.2) !important;
  669. color:#25ACE8 !important;
  670. }
  671.  
  672. .chat .divider {
  673. height:25px;
  674. background:none;
  675. }
  676.  
  677. .chat .divider>div {
  678. display:none !important;
  679. }
  680. .chat .divider:not(.divider-red)>div {
  681. background:rgba(255,255,255,0.2) !important;
  682. }
  683.  
  684. .chat .divider:before {
  685. background:rgba(255,255,255,0.1) !important;
  686. height:25px;
  687. }
  688.  
  689. .chat .divider.divider-red:before {
  690. background: rgba(240,71,71,.8) !important;
  691. }
  692.  
  693. .chat .divider>span {
  694. background-color:transparent !important;
  695. font-size:12px;
  696. text-transform:uppercase;
  697. margin:10px 0px;
  698. border-radius: 0px;
  699. opacity: 1;
  700. padding: 8px 15px;
  701. line-height: 1px;
  702. width: 100%;
  703. text-align: center;
  704. }
  705.  
  706. .chat .divider.divider-red>span {
  707. color: rgba(255,255,255,0.9) !important;
  708. }
  709.  
  710. .chat .divider:not(.divider-red)>span {
  711. color:rgba(255,255,255,1) !important;
  712. }
  713.  
  714. .chat .divider>div {
  715. display:none;
  716. }
  717.  
  718. .chat form {
  719. border-top: none !important;
  720. }
  721.  
  722. .messages .message-group:not(.has-divider) {
  723. border-bottom-color:hsla(0,0%,100%,.04) !important;
  724. }
  725.  
  726. .messages .message-group {
  727. border-bottom: none !important;
  728. }
  729.  
  730. .friends-table .messages .message-group .message-send-failed .markup,
  731. .friends-table .messages .message-group .message-send-failed .markup a,
  732. .messages .message-group .message-send-failed .markup,
  733. .messages .message-group .message-send-failed .markup a {
  734. color:rgba(240,71,71,0.5) !important;
  735. font-style:italic;
  736. }
  737.  
  738. .mentioned .message-text {
  739. border-radius: 0 !important;
  740. background: rgba(37,172,232,0.2) !important;
  741. }
  742.  
  743. .mentioned .message-text:after {
  744. border-radius: 0 !important;
  745. border-color:#25ACE8 !important;
  746. background:rgba(37,172,232,0.2) !important;
  747. }
  748.  
  749. .messages a {
  750. color:#25ACE8 !important;
  751. }
  752.  
  753. .messages h2 .user-name {
  754. font-size:0.85em;
  755. color:rgba(255,255,255,0.8);
  756. }
  757.  
  758. .messages h2 span {
  759. color:rgba(255,255,255,0.2) !important;
  760. }
  761.  
  762. .messages h2 .bot-tag {
  763. color:rgba(255,255,255,0.8) !important;
  764. }
  765.  
  766. .messages .markup {
  767. font-size:0.85em !important;
  768. line-height:1.4em !important;
  769. }
  770.  
  771. .messages .markup:not([data-colour="true"]) {
  772. color:rgba(255,255,255,0.5) !important;
  773. }
  774.  
  775. .markup pre {
  776. border-radius:0 !important;
  777. background:transparent !important;
  778. border-color:rgba(255,255,255,0.1) !important;
  779. }
  780.  
  781. .markup pre code.hljs {
  782. background:rgba(255,255,255,0.1) !important;
  783. color:rgba(255,255,255,0.7) !important;
  784. padding:1em !important;
  785. }
  786.  
  787. .modal-content .markup code.inline,
  788. .markup code.inline {
  789. background:rgba(255,255,255,0.1) !important;
  790. color:rgba(255,255,255,0.7) !important;
  791. padding:0.3em 0.6em !important;
  792. border-radius:0 !important;
  793. }
  794.  
  795. .messages .markup .highlight {
  796. background-color:rgba(29,101,134,.5) !important;
  797. color:#ddd !important;
  798. padding: 1px 4px;
  799. border-radius: 0;
  800. }
  801.  
  802. .messages .markup .highlight:hover {
  803. background-color:rgba(29,101,134,1) !important;
  804. color:#fff !important;
  805. }
  806.  
  807. .messages .invite-button {
  808. background: rgba(255,255,255,0.07) !important;
  809. border-color: rgba(255,255,255,0.1) !important;
  810. }
  811.  
  812. .emotewrapper img {
  813. position: relative;
  814. top: 7px;
  815. }
  816.  
  817. .channel-textarea-upload {
  818. border-right-color: hsla(0,0%,100%,.1) !important;
  819. }
  820.  
  821. .channel-textarea-inner {
  822. border: 2px solid rgba(255,255,255,0.1) !important;
  823. background:rgba(0,0,0,0.6) !important;
  824. }
  825.  
  826. .channel-textarea-autocomplete-inner {
  827. border:none !important;
  828. background:rgba(0,0,0,0.95) !important;
  829. }
  830.  
  831. .channel-textarea-autocomplete-inner header {
  832. border:none !important;
  833. background: rgba(37,172,232,0.5) !important;
  834. color: rgba(255,255,255,0.9) !important;
  835. }
  836.  
  837. .channel-textarea-autocomplete-inner ul li.active {
  838. background:rgba(255,255,255,0.1) !important;
  839. }
  840.  
  841. .channel-textarea-guard button {
  842. background:#1D6586 !important;
  843. }
  844.  
  845. .channel-textarea-guard button:hover {
  846. background:#25ACE8 !important;
  847. }
  848.  
  849. .typing {
  850. font-size:11px;
  851. }
  852.  
  853. .spoiler span {display:none;}
  854. .spoiler:before {
  855. min-height:18px;
  856. padding-top:2px;
  857. border-radius:5px;
  858. background:rgba(25,25,25,0.7);
  859. }
  860.  
  861. #twitchcord-button {
  862. background-size: 24px;
  863. background-position: 20px;
  864. background-color: transparent;
  865. opacity:0.4;
  866. }
  867.  
  868. #twitchcord-button:hover,
  869. #twitchcord-button.twitchcord-button-open {
  870. opacity:1;
  871. }
  872.  
  873. #twitchcord-button-container {
  874. right:30px !important;
  875. }
  876.  
  877. /*** COMPACT MODE ***/
  878.  
  879. .message-group.compact {
  880. margin-left:0;
  881. }
  882.  
  883. .message-group.compact .timestamp {
  884. color:rgba(255,255,255,0.3) !important;
  885. position:relative;
  886. top:-1px;
  887. }
  888.  
  889. .message-group.compact .message .markup .user-name {
  890. margin-right:8px;
  891. font-size:14px;
  892. }
  893.  
  894. /*
  895. __ _ _ _ _ _
  896. / _|_ __(_) ___ _ __ __| |___ | (_)___| |_
  897. | |_| '__| |/ _ \ '_ \ / _` / __| | | / __| __|
  898. | _| | | | __/ | | | (_| \__ \ | | \__ \ |_
  899. |_| |_| |_|\___|_| |_|\__,_|___/ |_|_|___/\__|
  900.  
  901. */
  902.  
  903. #friends .btn,
  904. .add-friend-popout .btn,
  905. .private-channels .channel.selected .icon-friends {
  906. background-color:#25ACE8 !important;
  907. }
  908.  
  909. .add-friend-popout .btn:disabled {
  910. background-color:#1D6586 !important;
  911. opacity:0.4;
  912. }
  913.  
  914. .private-channels .channel:hover:not(.selected) .icon-friends {
  915. background-color:#1D6586 !important;
  916. }
  917.  
  918. .private-channels .channel.btn-friends .badge {
  919. margin-right:10px;
  920. }
  921.  
  922. .private-channels .channel .close {
  923. margin-right:5px;
  924. }
  925.  
  926. #friends {
  927. background:transparent !important;
  928. }
  929.  
  930. .friends-header {
  931. background:rgba(0,0,0,0.95) !important;
  932. }
  933.  
  934. .friends-table {
  935. background:rgba(0,0,0,0.85) !important;
  936. margin-top:0 !important;
  937. }
  938.  
  939. .friends-header,
  940. .friends-table .friends-table-header {
  941. border-bottom: 1px solid hsla(0,0%,100%,.1) !important;
  942. }
  943.  
  944. .friends-header .tab-bar .tab-bar-separator,
  945. .friends-table .friends-table-header .friends-column-separator {
  946. background-color:hsla(0,0%,100%,.1) !important;
  947. }
  948.  
  949. .friends-table .friends-table-body {
  950. padding-top:20px !important;
  951. }
  952.  
  953. .friends-table .friends-row:hover {
  954. background: rgba(0,0,0,0.7) !important;
  955. }
  956.  
  957. /*
  958. _ _ _ _ _
  959. _ _ ___ ___ _ __ | (_)___| |_ ___ ___ ___| |_(_) ___ _ __
  960. | | | / __|/ _ \ '__| | | / __| __| / __|/ _ \/ __| __| |/ _ \| '_ \
  961. | |_| \__ \ __/ | | | \__ \ |_ \__ \ __/ (__| |_| | (_) | | | |
  962. \__,_|___/\___|_| |_|_|___/\__| |___/\___|\___|\__|_|\___/|_| |_|
  963.  
  964. */
  965.  
  966. .channel-members .invite-btn {
  967. background:#1D6586;
  968. }
  969.  
  970. .channel-members .invite-btn:hover {
  971. background:#25ACE8;
  972. }
  973.  
  974. .channel-members .member:hover {
  975. background:rgba(255,255,255,0.07) !important;
  976. }
  977.  
  978. .channel-members .member .member-username {
  979. font-size:12px;
  980. }
  981.  
  982. .channel-members .member .member-game {
  983. font-size:10px;
  984. }
  985.  
  986. .channel-members .avatar-small .status {
  987. border-color:rgba(0,0,0,0.7) !important;
  988. }
  989.  
  990. .channel-members h2 {
  991. background: rgba(0,0,0,0);
  992. padding-top: 10px;
  993. padding-bottom: 10px;
  994. }
  995.  
  996. .channel-members .member+h2 {
  997. margin-top:12px;
  998. }
  999.  
  1000. .channel-members h2:first-of-type {
  1001. margin-top:0px !important;
  1002. }
  1003.  
  1004. /*
  1005. _ __ _
  1006. _ _ ___ ___ _ __ (_)_ __ / _| ___ _ __ ___ _ __ ___ _ _| |_
  1007. | | | / __|/ _ \ '__| | | '_ \| |_ / _ \ | '_ \ / _ \| '_ \ / _ \| | | | __|
  1008. | |_| \__ \ __/ | | | | | | _| (_) | | |_) | (_) | |_) | (_) | |_| | |_
  1009. \__,_|___/\___|_| |_|_| |_|_| \___/ | .__/ \___/| .__/ \___/ \__,_|\__|
  1010. |_| |_|
  1011. */
  1012.  
  1013. .user-popout .header {
  1014. background:#25ACE8 !important;
  1015. }
  1016.  
  1017. .user-popout .avatar-wrapper .avatar-popout {
  1018. border:4px solid rgba(0,0,0,0.9);
  1019. background-color:rgba(0,0,0,0.9);
  1020. }
  1021.  
  1022. .user-popout .body {
  1023. background:rgba(0,0,0,0.8);
  1024. border-left:1px solid rgba(255,255,255,0.2);
  1025. border-right:1px solid rgba(255,255,255,0.2);
  1026. }
  1027.  
  1028. .user-popout .footer {
  1029. background:rgba(0,0,0,0.8);
  1030. border-top:1px solid rgba(255,255,255,0.2);
  1031. border-left:1px solid rgba(255,255,255,0.2);
  1032. border-right:1px solid rgba(255,255,255,0.2);
  1033. border-bottom:1px solid rgba(255,255,255,0.2);
  1034. }
  1035.  
  1036. .user-popout .footer .quick-message-wrapper .input {
  1037. background:rgba(255,255,255,0.1);
  1038. border-color:rgba(255,255,255,0.2);
  1039. color:rgba(255,255,255,0.9);
  1040. }
  1041.  
  1042. .user-popout .username-wrapper .game,
  1043. .user-popout .username-wrapper.hasNickname .discriminator,
  1044. .user-popout .username-wrapper.hasNickname .username {
  1045. color:rgba(0,0,0,0.7);
  1046. }
  1047.  
  1048. .popout header,
  1049. .slider-bar-fill {
  1050. background-color:#25ACE8;
  1051. border:1px solid #25ACE8;
  1052. }
  1053.  
  1054. .user-popout .user-popout-options .btn {
  1055. background-color:#1D6586;
  1056. border:1px solid #1D6586;
  1057. }
  1058.  
  1059. .user-popout .user-popout-options .btn:hover {
  1060. background-color:#25ACE8;
  1061. border:1px solid #25ACE8;
  1062. }
  1063.  
  1064. /* Admin buttons */
  1065. .user-popout .user-popout-options .btn.btn-server {
  1066. color: rgba(255,255,255,0.7);
  1067. background: rgba(240,71,71,0.4);
  1068. border: none !important;
  1069. }
  1070.  
  1071. .user-popout .user-popout-options .btn.btn-server:hover {
  1072. color: rgba(255,255,255,1);
  1073. background: rgba(240,71,71,1);
  1074. border: none !important;
  1075. }
  1076.  
  1077. /*
  1078. _ _ _ _
  1079. | |_ ___ ___ | | |_(_)_ __ ___
  1080. | __/ _ \ / _ \| | __| | '_ \/ __|
  1081. | || (_) | (_) | | |_| | |_) \__ \
  1082. \__\___/ \___/|_|\__|_| .__/|___/
  1083. |_|
  1084. */
  1085.  
  1086. .tooltip {
  1087. background:#1D6586;
  1088. color:#e0e0e0;
  1089. }
  1090.  
  1091. .tooltip.tooltip-right:after {
  1092. border-right-color:#1D6586;
  1093. }
  1094.  
  1095. .tooltip.tooltip-top:after {
  1096. border-top-color:#1D6586;
  1097. }
  1098.  
  1099. .tooltip.tooltip-bottom:after {
  1100. border-bottom-color:#1D6586;
  1101. }
  1102.  
  1103. /*
  1104. _ _ _ _
  1105. _ __ ___ (_)_ __ (_)_ __ ___ __ _| | _ __ ___ ___ __| | ___
  1106. | '_ ` _ \| | '_ \| | '_ ` _ \ / _` | | | '_ ` _ \ / _ \ / _` |/ _ \
  1107. | | | | | | | | | | | | | | | | (_| | | | | | | | | (_) | (_| | __/
  1108. |_| |_| |_|_|_| |_|_|_| |_| |_|\__,_|_| |_| |_| |_|\___/ \__,_|\___|
  1109.  
  1110. */
  1111.  
  1112. /* SERVER LIST */
  1113. .bd-minimal .channel-text a,
  1114. .bd-minimal .guild-channels ul .channel-voice {
  1115. padding:5px 5px 5px 10px !important;
  1116. }
  1117.  
  1118. .bd-minimal .guilds-wrapper .guilds {
  1119. padding-left:10px !important;
  1120. }
  1121.  
  1122. .bd-minimal .guilds-wrapper .guilds .friends-icon {
  1123. background-size:60% !important;
  1124. }
  1125.  
  1126. .bd-minimal .guilds-wrapper .guilds .guild:before {
  1127. width:10px;
  1128. height:25px;
  1129. border-radius:5px;
  1130. margin-top:-13px;
  1131. left:-16px;
  1132. }
  1133.  
  1134. .bd-minimal .guilds-wrapper .guilds .guild.unread:before {
  1135. height:10px;
  1136. margin-top:-5px;
  1137. }
  1138.  
  1139. .bd-minimal .guilds-wrapper .guilds .guild.selected:before {
  1140. border-radius:5px;
  1141. height:25px;
  1142. margin-top:-13px;
  1143. }
  1144.  
  1145. .bd-minimal .guilds-wrapper .guilds .guild,
  1146. .bd-minimal .guilds-wrapper .guilds .guild .guild-inner,
  1147. .bd-minimal .guilds-wrapper .guilds .guild .guild-inner .avatar-small,
  1148. .bd-minimal .guilds-wrapper .guilds .guild .guild-inner .friends-icon {
  1149. width:25px;
  1150. height:25px;
  1151. line-height:25px;
  1152. background-size:25px 25px;
  1153. font-size:10px !important;
  1154. }
  1155.  
  1156. .bd-minimal .guilds-wrapper .guilds .friends-online {
  1157. font-size: 10px;
  1158. word-spacing: 50px;
  1159. line-height: 20px;
  1160. margin-left: 0px;
  1161. width: 25px;
  1162. height: 20px;
  1163. border-radius: 20px;
  1164. overflow: hidden;
  1165. background: rgba(0,0,0,0.5);
  1166. }
  1167.  
  1168. .bd-minimal .guilds-wrapper .guild-separator {
  1169. width:25px;
  1170. margin-left:0;
  1171. }
  1172.  
  1173. /* CHAT */
  1174. .bd-minimal .chat>.title-wrap>.title {
  1175. font-size: 16px;
  1176. }
  1177.  
  1178. .bd-minimal .theme-dark .comment {
  1179. border-left:none !important;
  1180. padding-left:10px;
  1181. }
  1182.  
  1183. .bd-minimal .message-group {
  1184. padding:10px 5px;
  1185. }
  1186.  
  1187. .bd-minimal .avatar-large {
  1188. border-radius:100%;
  1189. }
  1190.  
  1191. .bd-minimal .message-group .edit-message .edit-container-outer {
  1192. margin-left:50px;
  1193. }
  1194.  
  1195. .bd-minimal .message-group .edit-message .edit-container-inner {
  1196. margin-left:10px;
  1197. }
  1198.  
  1199. /* MEMBERS */
  1200. .bd-minimal .channel-members h2 {
  1201. margin-top:10px;
  1202. margin-bottom:3px;
  1203. padding-left:20px;
  1204. }
  1205.  
  1206. .bd-minimal .channel-members h2:first-of-type {
  1207. margin-top:0px;
  1208. margin-bottom:3px;
  1209. }
  1210.  
  1211. .bd-minimal .channel-members .member {
  1212. padding:5px 15px 8px 20px;
  1213. }
  1214.  
  1215. /* CHANNELS */
  1216. .bd-minimal .guild-header header span {
  1217. margin-left:-7px;
  1218. font-size:14px;
  1219. }
  1220.  
  1221. .bd-minimal .guild-channels .channel-text .channel-name {
  1222. padding-left:5px;
  1223. }
  1224.  
  1225. .bd-minimal .guild-channels header:first-of-type {
  1226. margin-top:5px;
  1227. }
  1228.  
  1229. .bd-minimal .guild-channels .channel-text.unread:not(.selected):not(.channel-muted):before {
  1230. top:9px;
  1231. width:10px;
  1232. height:10px;
  1233. }
  1234.  
  1235. .bd-minimal .guild-channels h2 {
  1236. margin-left:15px;
  1237. }
  1238.  
  1239. /* ACCOUNT BAR */
  1240. .bd-minimal #voice-connection {
  1241. width:176px;
  1242. margin-left:-46px;
  1243. }
  1244.  
  1245. .bd-minimal .account {
  1246. width:206px;
  1247. margin-left:-46px;
  1248. }
  1249.  
  1250. .bd-minimal .account .avatar-small {
  1251. display:block !important;
  1252. margin-left:2px;
  1253. }
  1254.  
  1255. .bd-minimal .account .username {
  1256. display:none;
  1257. }
  1258.  
  1259. .bd-minimal .account .btn-group {
  1260. margin-left:10px;
  1261. }
  1262.  
  1263. .bd-minimal .account .btn-group .btn {
  1264. width:30px;
  1265. }
  1266.  
  1267. /*
  1268. _ _ _
  1269. ___ ___| |_| |_(_)_ __ __ _ ___
  1270. / __|/ _ \ __| __| | '_ \ / _` / __|
  1271. \__ \ __/ |_| |_| | | | | (_| \__ \
  1272. |___/\___|\__|\__|_|_| |_|\__, |___/
  1273. |___/
  1274. */
  1275.  
  1276. .context-menu {
  1277. background: rgba(0,0,0,0.95) !important;
  1278. }
  1279.  
  1280. .context-menu .item:hover,
  1281. .context-menu .item-subMenu {
  1282. background-color:rgba(255,255,255,0.05) !important;
  1283. }
  1284.  
  1285. .avatar-uploader a {
  1286. color:#25ACE8;
  1287. }
  1288.  
  1289. .avatar-uploader a:hover {
  1290. color:#1D6586;
  1291. }
  1292.  
  1293. .settings .settings-header {
  1294. background:#1a1d20 !important;
  1295. }
  1296.  
  1297. .form .btn-primary {
  1298. background-color:#1D6586;
  1299. }
  1300.  
  1301. .form .btn-primary:hover {
  1302. background-color:#25ACE8;
  1303. }
  1304.  
  1305. .user-settings-modal a {
  1306. color:#1D6586;
  1307. }
  1308.  
  1309. .user-settings-modal a:hover {
  1310. color:#25ACE8;
  1311. }
  1312.  
  1313. .channel-notification-settings .content .content-inner {
  1314. background:transparent !important;
  1315. }
  1316.  
  1317. .callout-backdrop {
  1318. opacity:0.55;
  1319. }
  1320.  
  1321. .tab-bar.SIDE {
  1322. margin-right: -17px;
  1323. }
  1324.  
  1325. .tab-bar.SIDE .tab-bar-item.selected {
  1326. background: rgba(0,0,0,0.7) !important;
  1327. }
  1328.  
  1329. .tab-bar.SIDE .tab-bar-item.selected:before {
  1330. border-color:#25ACE8;
  1331. }
  1332.  
  1333. .tab-bar.SIDE .tab-bar-item:before {
  1334. border-color:#1D6586;
  1335. }
  1336.  
  1337. .popout header,
  1338. .slider-bar-fill {
  1339. border:none !important;
  1340. }
  1341.  
  1342. .slider-handle,
  1343. .Select-control {
  1344. border:none !important;
  1345. }
  1346.  
  1347. .slider-bar {
  1348. background: rgba(255,255,255,0.5);
  1349. }
  1350.  
  1351. .settings .settings-header {
  1352. background:rgba(0,0,0,0.88) !important;
  1353. }
  1354.  
  1355. .settings .settings-inner,
  1356. .settings .settings-actions {
  1357. background:rgba(0,0,0,0.75);
  1358. }
  1359.  
  1360. .settings .settings-actions {
  1361. border-top:none !important;
  1362. }
  1363.  
  1364. .form .radio-group .radio,
  1365. .form .checkbox-group .checkbox,
  1366. .checkbox .checkbox-inner+span {
  1367. color:rgba(255,255,255,0.7) !important;
  1368. font-size: 0.95em;
  1369. }
  1370.  
  1371. .form .control-group input[type=email],
  1372. .form .control-group input[type=password],
  1373. .form .control-group input[type=text],
  1374. .form .control-group textarea {
  1375. padding:5px 10px 5px 10px;
  1376. border-radius:5px;
  1377. box-sizing:border-box;
  1378. border:1px solid rgba(255,255,255,0.1);
  1379. background:rgba(0,0,0,0.5);
  1380. color:rgba(255,255,255,0.5);
  1381. font-size:14px;
  1382. }
  1383.  
  1384. .form .control-group input[type=email]:focus,
  1385. .form .control-group input[type=password]:focus,
  1386. .form .control-group input[type=text]:focus,
  1387. .form .control-group textarea:focus {
  1388. border-color:rgba(255,255,255,0.3);
  1389. background:rgba(0,0,0,0.7);
  1390. color:rgba(255,255,255,1);
  1391. font-size:14px;
  1392. }
  1393.  
  1394. .form .Select-control,
  1395. .form .Select-option {
  1396. border:1px solid rgba(255,255,255,0.1) !important;
  1397. background:rgba(0,0,0,0.5);
  1398. color:rgba(255,255,255,0.5);
  1399. font-size:14px;
  1400. }
  1401.  
  1402. .form .Select-option {
  1403. border-top:none !important;
  1404. background:rgba(0,0,0,0.7);
  1405. color:rgba(255,255,255,0.4);
  1406. }
  1407.  
  1408. .form .Select-option.is-focused {
  1409. border-top:none !important;
  1410. background:rgba(0,0,0,1);
  1411. color:rgba(255,255,255,1);
  1412. }
  1413.  
  1414. .Select-menu-outer {
  1415. background:rgba(0,0,0,0.5);
  1416. border:none !important;
  1417. }
  1418.  
  1419. .has-value>.Select-control>.Select-placeholder {
  1420. color:rgba(255,255,255,0.8);
  1421. }
  1422.  
  1423. .form .btn-default {
  1424. padding:10px 0 !important;
  1425. width: 75px;
  1426. height: 35.5px;
  1427. border-radius: 3px;
  1428. }
  1429.  
  1430. .form hr,
  1431. .form .control-groups.control-separator,
  1432. .instant-invites .instant-invites-header,
  1433. .guild-settings-modal-integrations .guild-settings-modal-integrations-header,
  1434. .guild-settings-modal-members .guild-settings-modal-members-header,
  1435. .guild-settings-modal-members .guild-settings-modal-list .member+.member,
  1436. .guild-settings-modal-members .guild-settings-modal-members-footer,
  1437. #settings-roles .roles header,
  1438. #user-profile-modal .tab-bar {
  1439. border-color:rgba(255,255,255,0.2);
  1440. box-shadow:none;
  1441. }
  1442.  
  1443. .form .control-group input[type=email]:disabled,
  1444. .form .control-group input[type=password]:disabled,
  1445. .form .control-group input[type=text]:disabled,
  1446. .form .control-group textarea:disabled {
  1447. background:rgba(255,255,255,0.2) !important;
  1448. }
  1449.  
  1450. .guild-settings-modal-members {
  1451. background:none !important;
  1452. }
  1453.  
  1454. #settings-roles .roles {
  1455. border-right:1px solid rgba(255,255,255,0.2);
  1456. }
  1457.  
  1458. #settings-roles .roles li:hover:before {
  1459. background:#1D6586;
  1460. }
  1461.  
  1462. #settings-roles .roles li:hover:not(.selected) {
  1463. background:rgba(0,0,0,0.9) !important;
  1464. }
  1465.  
  1466. #settings-roles .roles li.selected {
  1467. background:rgba(0,0,0,0.5) !important;
  1468. }
  1469.  
  1470. #settings-roles .roles li.selected:before {
  1471. background:#25ACE8;
  1472. }
  1473.  
  1474. .btn-help {
  1475. font-size: 11px;
  1476. background: rgba(255,255,255,0.3);
  1477. }
  1478.  
  1479. .btn-help:hover,
  1480. .radio:hover span:after {
  1481. background:#1D6586;
  1482. }
  1483.  
  1484. .radio .radio-inner span:after {
  1485. background:#25ACE8;
  1486. }
  1487.  
  1488. .user-settings-modal-keybinds .user-settings-modal-keybinds-header {
  1489. border-bottom:1px solid rgba(255,255,255,0.2);
  1490. }
  1491.  
  1492. .user-settings-modal .voice-settings .reset-voice-settings {
  1493. color:#1D6586;
  1494. }
  1495.  
  1496. .user-settings-modal .voice-settings .reset-voice-settings:hover {
  1497. color:#1D6586;
  1498. opacity:0.6;
  1499. }
  1500.  
  1501. .checkbox .checkbox-inner input[type=checkbox]:checked+span {
  1502. background:#25ACE8;
  1503. border-color:#25ACE8;
  1504. }
  1505.  
  1506. .user-settings-modal-connections .user-settings-modal-accounts-list .connect-container .name {
  1507. color:rgba(255,255,255,0.8);
  1508. }
  1509.  
  1510. .user-settings-modal-connections .user-settings-modal-connections-list .connection .connection-integrations.no-integrations {
  1511. color:rgba(255,255,255,0.8);
  1512. }
  1513.  
  1514. .user-settings-modal-connections .user-settings-modal-connections-list .connection .connection-integrations {
  1515. border-color:#643DA7 !important;
  1516. }
  1517.  
  1518. .user-settings-modal-connections .user-settings-modal-connections-list {
  1519. box-shadow: 0 -1px rgba(255,255,255,0.2);
  1520. }
  1521.  
  1522. .tab-bar.TOP {
  1523. border-color:rgba(255,255,255,0.2);
  1524. }
  1525.  
  1526. .tab-bar.TOP .tab-bar-item.selected {
  1527. border-color:#25ACE8;
  1528. color:#25ACE8;
  1529. }
  1530.  
  1531. .user-settings-streamer-mode {
  1532. background:none;
  1533. }
  1534.  
  1535. .user-settings-modal-games {
  1536. background:rgba(255,255,255,0.05) !important;
  1537. border:none !important;
  1538. }
  1539.  
  1540. .user-settings-modal-games .games-table .games-row .item-game,
  1541. .user-settings-modal-games .games-table .games-row .item-overlay {
  1542. border-color:rgba(255,255,255,0.2) !important;
  1543. }
  1544.  
  1545. .user-settings-modal-games .games-table .games-row .item-game .game-input,
  1546. .user-settings-modal-games .games-table .games-row .item-game .game-name {
  1547. color:#fff;
  1548. }
  1549.  
  1550. .user-settings-modal-games .games-table .games-row .item-game .last-played {
  1551. color:rgba(255,255,255,0.5);
  1552. }
  1553.  
  1554. .now-playing {
  1555. background:#25ACE8 !important;
  1556. }
  1557.  
  1558. .now-playing.no-detection {
  1559. background: rgba(0,0,0,0.8);
  1560. }
  1561.  
  1562. .bd-g-table tbody tr,
  1563. .bd-g-table thead th,
  1564. .bd-g-table tbody tr:nth-child(odd) {
  1565. background:transparent !important;
  1566. }
  1567.  
  1568. .bd-g-table textarea {
  1569. color: rgba(255,255,255,0.4) !important;
  1570. background: rgba(255,255,255,0.2) !important;
  1571. padding: 8px 10px !important;
  1572. box-sizing:border-box;
  1573. }
  1574.  
  1575. #bd-pane .scroller-wrap div[style*="background:#2E3136; color:#ADADAD; height:30px; position:absolute; bottom:0; left:0; right:0;"] {
  1576. background:rgba(0,0,0,0.95) !important;
  1577. }
  1578.  
  1579. .CodeMirror {
  1580. background: rgba(255,255,255,0.15) !important;
  1581. border-radius: 0px;
  1582. color: rgba(255,255,255,0.8) !important;
  1583. }
  1584.  
  1585. .CodeMirror-gutters {
  1586. background: rgba(255,255,255,0.25) !important;
  1587. border:none !important;
  1588. }
  1589.  
  1590. .CodeMirror-linenumber {
  1591. color: #fff !important;
  1592. }
  1593.  
  1594. .cm-s-neat span.cm-builtin {
  1595. color:#25ACE8;
  1596. }
  1597.  
  1598. .cm-s-neat span.cm-atom,
  1599. .cm-s-neat span.cm-number {
  1600. color:#25ACE8;
  1601. }
  1602.  
  1603. .member-roles .member-role {
  1604. background-color: rgba(255,255,255,0.1);
  1605. border:none;
  1606. padding: 6px 8px;
  1607. color: #fff;
  1608. }
  1609.  
  1610. .popout section {
  1611. background:rgba(0,0,0,0.95) !important;
  1612. }
  1613.  
  1614. .popout.popout-bottom header:before {
  1615. border-bottom-color:#1D6586;
  1616. }
  1617.  
  1618. #autocomplete-popout .row.selected,
  1619. #autocomplete-popout .row:hover {
  1620. background:rgba(255,255,255,0.2) !important;
  1621. }
  1622.  
  1623. #permissions .permission-actions {
  1624. color:rgba(255,255,255,0.7) !important;
  1625. }
  1626.  
  1627. #autocomplete-popout .empty h4,
  1628. #permissions .permissions-helpdesk,
  1629. .guild-settings-modal-members .guild-settings-modal-members-footer a {
  1630. color:#25ACE8;
  1631. }
  1632.  
  1633. #permissions .permissions-helpdesk:hover,
  1634. .guild-settings-modal-members .guild-settings-modal-members-footer a:hover {
  1635. color:#1D6586;
  1636. }
  1637.  
  1638. #user-profile-modal .header,
  1639. #user-profile-modal .btn {
  1640. background:#25ACE8;
  1641. }
  1642.  
  1643. #user-profile-modal .btn:hover {
  1644. background:#1D6586;
  1645. }
  1646.  
  1647. #user-profile-modal .sub-header,
  1648. #user-profile-modal .tab-bar-container,
  1649. #user-profile-modal .scroller,
  1650. #user-profile-modal .empty,
  1651. #user-profile-modal footer {
  1652. background:rgba(0,0,0,0.85) !important;
  1653. }
  1654.  
  1655. #user-profile-modal .tab-bar-container {
  1656. border-bottom: 1px solid rgba(240, 240, 240, 0.15) !important;
  1657. }
  1658.  
  1659. #user-profile-modal .guilds .section+.section {
  1660. border-top: 1px solid rgba(240, 240, 240, 0.15) !important;
  1661. }
  1662.  
  1663. #user-profile-modal .guilds .guild:hover {
  1664. background:rgba(255,255,255,0.2) !important;
  1665. color:rgba(255,255,255,0.7);
  1666. }
  1667.  
  1668. #user-profile-modal .avatar-profile {
  1669. border-color:rgba(0,0,0,0.7);
  1670. background-color:rgba(0,0,0,0.85);
  1671. }
  1672.  
  1673. #bd-customcss-attach-controls {
  1674. background:rgba(0,0,0,0.85);
  1675. border:none;
  1676. box-shadow:none;
  1677. padding:5px 10px 10px 10px;
  1678. }
  1679.  
  1680. #bd-customcss-attach-controls .checkbox > span {
  1681. font-size:14px;
  1682. margin-right:8px;
  1683. margin-left:5px;
  1684. }
  1685.  
  1686. .bda-slist li {
  1687. background:rgba(0,0,0,0.65) !important;
  1688. border-top:1px solid rgba(255,255,255,0.2) !important;
  1689. border-bottom:none;
  1690. }
  1691.  
  1692. .bda-slist li:nth-child(odd),
  1693. .bda-slist .bda-description {
  1694. border:none;
  1695. }
  1696.  
  1697. .bda-slist li:first-of-type {
  1698. border-top:none !important;
  1699. }
  1700.  
  1701. .bda-slist .bda-name {
  1702. color:rgba(255,255,255,0.8);
  1703. letter-spacing: .3px;
  1704. }
  1705.  
  1706. .bda-slist .bda-left {
  1707. width:380px;
  1708. padding:10px;
  1709. box-sizing:border-box;
  1710. }
  1711.  
  1712. .bda-slist .bda-right .bda-plugin-reload {
  1713. margin-top:25px;
  1714. }
  1715.  
  1716. .bda-slist .bda-right .btn {
  1717. margin-left:-5px;
  1718. }
  1719.  
  1720. .bda-slist .bda-right .btn:disabled {
  1721. opacity:0.3;
  1722. }
  1723.  
  1724. .bda-slist .checkbox {
  1725. margin-left:10px;
  1726. position:relative;
  1727. top:8px;
  1728. }
  1729.  
  1730. .bda-slist {
  1731. margin-bottom:25px;
  1732. }
  1733.  
  1734. .bda-slist-top {
  1735. height: 35px;
  1736. }
  1737.  
  1738. #bd-themes-pane .bda-plugin-reload {
  1739. margin-top:60px;
  1740. }
  1741.  
  1742. #bda-qem-favourite-container,
  1743. #bda-qem-twitch-container,
  1744. .emoji-picker {
  1745. background-color: rgba(0,0,0,0.95) !important;
  1746. border: 0px solid rgba(255,255,255,0.1) !important;
  1747. border-top: none !important;
  1748. }
  1749.  
  1750. .emoji-picker .category {
  1751. background-color: rgba(0,0,0,0.7) !important;
  1752. border: 0px solid rgba(255,255,255,0.2) !important;
  1753. border-top: none !important;
  1754. }
  1755.  
  1756. #bda-qem {
  1757. padding-right: 0px !important;
  1758. border-bottom: 0px solid rgba(0,0,0,0.5) !important;
  1759. background: rgba(0,0,0,0.95) !important;
  1760. }
  1761.  
  1762. #bda-qem button {
  1763. background: rgba(255,255,255,0.1) !important;
  1764. box-shadow: rgba(0,0,0,0.5) 1px 0 0 0 !important;
  1765. }
  1766.  
  1767. #bda-qem button:hover {
  1768. background: rgba(0,0,0,0.6) !important;
  1769. }
  1770.  
  1771. #bda-qem button.active {
  1772. background: rgba(0,0,0,1) !important;
  1773. }
  1774.  
  1775. /* Scrollbar drag bar */
  1776. .emoji-picker .scroller::-webkit-scrollbar-thumb,
  1777. #bda-qem-twitch-container .scroller::-webkit-scrollbar-thumb,
  1778. #bda-qem-favourite-container .scroller::-webkit-scrollbar-thumb {
  1779. background:rgba(255,255,255,0.4) !important;
  1780. border-color:rgba(255,255,255,0) !important;
  1781. }
  1782.  
  1783. /* Scrollbar background */
  1784. .emoji-picker .scroller::-webkit-scrollbar,
  1785. .emoji-picker .scroller::-webkit-scrollbar-track,
  1786. .emoji-picker .scroller::-webkit-scrollbar-track-piece,
  1787. #bda-qem-favourite-container .scroller::-webkit-scrollbar,
  1788. #bda-qem-favourite-container .scroller::-webkit-scrollbar-track,
  1789. #bda-qem-favourite-container .scroller::-webkit-scrollbar-track-piece,
  1790. #bda-qem-twitch-container .scroller::-webkit-scrollbar,
  1791. #bda-qem-twitch-container .scroller::-webkit-scrollbar-track,
  1792. #bda-qem-twitch-container .scroller::-webkit-scrollbar-track-piece {
  1793. background:rgba(255,255,255,0.1) !important;
  1794. border-color:rgba(255,255,255,0) !important;
  1795. }
  1796.  
  1797. .instant-invite-modal {
  1798. background: none;
  1799. }
  1800.  
  1801. #instant-invite-modal .copy {
  1802. background-color: #25ACE8;
  1803. }
  1804.  
  1805. #instant-invite-modal .clipboard-input-inner input {
  1806. color: #25ACE8;
  1807. }
  1808.  
  1809. .popout-menu {
  1810. background: transparent !important;
  1811. }
  1812.  
  1813. .popout-menu.status-picker {
  1814. background: transparent;
  1815. width: 322px !important;
  1816. margin-left: 0px !important;
  1817. margin-bottom: 0 !important;
  1818. }
  1819.  
  1820. .popout-menu .popout-menu-separator {
  1821. border-bottom: 1px solid rgba(255,255,255,0.2) !important;
  1822. }
  1823.  
  1824. .popout-menu .popout-menu-item {
  1825. background: rgba(0,0,0,0.95) !important;
  1826. }
  1827.  
  1828. .popout-top .popout-menu .popout-menu-item {
  1829. color: rgba(255,255,255,0.8) !important;
  1830. }
  1831.  
  1832. .popout-menu .popout-menu-item:hover {
  1833. background-color: #1D6586 !important;
  1834. color: rgba(255,255,255,0.8) !important;
  1835. }
  1836.  
  1837. .popout-top {
  1838. top: auto !important;
  1839. bottom: -126px !important;
  1840. }
  1841.  
  1842. .themed-popout {
  1843. background-color: rgba(0, 0, 0, 0.95) !important;
  1844. border: 1px solid rgba(255,255,255,.1) !important;
  1845. }
  1846.  
  1847. .themed-popout .header, .themed-popout .footer {
  1848. background-color: #000 !important;
  1849. }
  1850.  
  1851. .themed-popout .messages-popout .message-group {
  1852. border-color: rgba(28,36,43,0) !important;
  1853. background-color: rgba(255, 255, 255, 0.07) !important;
  1854. }
  1855.  
  1856. .themed-popout .messages-popout .message-group:hover .action-buttons {
  1857. box-shadow: 0 0 6px 4px rgba(255, 255, 255, 0.03) !important;
  1858. background-color: rgba(255, 255, 255, 0.03) !important;
  1859. }
  1860.  
  1861. /*
  1862. _ _ _ _ _ _
  1863. _ __ _ _| |__ | (_) ___ | | (_)___| |_
  1864. | '_ \| | | | '_ \| | |/ __| | | | / __| __|
  1865. | |_) | |_| | |_) | | | (__ | |___| \__ \ |_
  1866. | .__/ \__,_|_.__/|_|_|\___| |_____|_|___/\__|
  1867. |_|
  1868.  
  1869. */
  1870.  
  1871. #slist,
  1872. #pubs-container {
  1873. background-color:rgba(0,0,0,0.7) !important;
  1874. border-radius:5px 5px 0 0;
  1875. }
  1876.  
  1877. #pubs-header {
  1878. padding:10px;
  1879. background-color:#25ACE8 !important;
  1880. border-radius:5px 5px 0 0;
  1881. }
  1882.  
  1883. #pubs-header input {
  1884. padding-left:10px;
  1885. }
  1886.  
  1887. #pubs-footer {
  1888. padding:10px;
  1889. font-size:12px;
  1890. background:rgba(0,0,0,0.8) !important;
  1891. border-radius:0 0 5px 5px;
  1892. }
  1893.  
  1894. .server-icon {
  1895. width:50px;
  1896. height:50px;
  1897. border-radius:100%;
  1898. }
  1899.  
  1900. .server-row {
  1901. padding:10px 10px 8px 10px;
  1902. }
  1903.  
  1904. .server-info {
  1905. line-height:50px;
  1906. }
  1907.  
  1908. .server-info button {
  1909. background-color:#1D6586 !important;
  1910. width:70px;
  1911. height:40px;
  1912. margin-top:4px;
  1913. margin-right:4px;
  1914. }
  1915.  
  1916. .server-info button:hover {
  1917. background-color:#25ACE8 !important;
  1918. }
  1919.  
  1920. #slist span {
  1921. color:white !important;
  1922. }
  1923.  
  1924. .server-row:nth-child(2n+1) {
  1925. background-color:rgba(255,255,255,0.06) !important;
  1926. }
  1927.  
  1928. .server-row:nth-child(2n+2) {
  1929. background-color:rgba(0,0,0,0) !important;
  1930. }
  1931. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement