API tools faq
paste
Velvetine

Discord Reborn 6

Velvetine
Jan 30th, 2017
311
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 131.57 KB | None | 0 0
raw download clone embed print report
  1. :root {--version-content: "6.0";}
  2.  
  3. body:after {
  4.     content: "Current Version: v" var(--version-content);
  5.     z-index: 10000000000000000000000000;
  6.     color: #fff;
  7.     background: var(--main-color);
  8.     top: 0;
  9.     left: 50%;
  10.     position: absolute;
  11.     border-radius: 5px;
  12.     padding: 5px 15px;
  13.     -webkit-transform: translate(-50%, -100%);
  14.     transform: translate(-50%, -100%);
  15.     -webkit-animation: version 3s ease;
  16.     animation: version 3s ease;
  17.     -webkit-animation-delay: 1s;
  18.     animation-delay: 1s;
  19. }
  20.  
  21. body:before {
  22.     content: "Thanks for using Discord Reborn!";
  23.     z-index: 1000000000000000000000000;
  24.     color: #fff;
  25.     background: var(--main-color);
  26.     top: 0px;
  27.     left: 50%;
  28.     position: absolute;
  29.     border-radius: 5px;
  30.     padding: 5px 15px;
  31.     -webkit-transform: translate(-50%, -100%);
  32.     transform: translate(-50%, -100%);
  33.     -webkit-animation: version 3s ease;
  34.     animation: version 3s ease;
  35.     -webkit-animation-delay: 4s;
  36.     animation-delay: 4s;
  37. }
  38.  
  39. @-webkit-keyframes version {
  40.     from {
  41.         -webkit-transform: translate(-50%, -100%);
  42.         transform: translate(-50%, -100%);
  43.     }
  44.     20% {
  45.         -webkit-transform: translate(-50%, 20%);
  46.         transform: translate(-50%, 20%)
  47.     }
  48.     80% {
  49.         -webkit-transform: translate(-50%, 20%);
  50.         transform: translate(-50%, 20%)
  51.     }
  52.     to {
  53.         -webkit-transform: translate(-50%, -100%);
  54.         transform: translate(-50%, -100%);
  55.     }
  56. }
  57.  
  58. @keyframes version {
  59.     from {
  60.         -webkit-transform: translate(-50%, -100%);
  61.         transform: translate(-50%, -100%);
  62.     }
  63.     20% {
  64.         -webkit-transform: translate(-50%, 20%);
  65.         transform: translate(-50%, 20%)
  66.     }
  67.     80% {
  68.         -webkit-transform: translate(-50%, 20%);
  69.         transform: translate(-50%, 20%)
  70.     }
  71.     to {
  72.         -webkit-transform: translate(-50%, -100%);
  73.         transform: translate(-50%, -100%);
  74.     }
  75. }
  76.  
  77. .account:after {content: var(--version-content); color: rgba(255,255,255,0.2); font-size: 11px; font-weight: bold; position: absolute; bottom: 0; left: 149px; right: 0; opacity: 1;}
  78.  
  79. .rversion {display: inline-block;margin: 0px 0px 0px 0px;}
  80.    
  81. .rversion:after {content: var(--version-content);display: block;font-size: 14px;font-weight: 700;color: #43B581;}
  82.  
  83. .rthemedescription {display: block;width: 100%;margin-right: 5px;}
  84.  
  85. .rthemedescription:before {display: block;font-size: 14px;height: 15px;color: #3ddcb1;font-weight: 700;content: "Updates are automatic. Just restart Discord to get the latest version.";}
  86.  
  87. .user-popout .header {background: rgba(0, 0, 0, .3);}
  88.  
  89. .user-popout {background: transparent !important;opacity: 1;}
  90.  
  91. #user-profile-modal .header {background: transparent !important;overflow: hidden;height: 182px;}
  92.  
  93. .user-popout .body {background: rgba(0, 0, 0, .8);}
  94.  
  95. .user-popout .footer {background: rgba(0, 0, 0, .8);}
  96.  
  97. .user-popout .avatar-wrapper .avatar-popout {border: none;background-color: transparent;}
  98.  
  99. .user-popout .avatar-wrapper {box-shadow: 0 0 5px 1px rgba(0, 0, 0, 0.5);border-radius: 50%;}
  100.  
  101. #user-profile-modal .avatar-profile {box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);border: none !important;margin-top: 4px;margin-left: 4px;background-color: transparent;}
  102.  
  103. #user-profile-modal .guilds .avatar-large {background-color: transparent;}
  104.  
  105. .user-popout .header.streaming{background-color: rgba(89, 54, 149, 0.69);}
  106.  
  107. .Select-control { background: rgba(0, 0, 0, 0.62); border: var(--main-color); border-color: var(--main-color) var(--main-color) var(--main-color); }
  108.  
  109. .form .control-group .Select-control { border: 1px solid var(--main-color); }
  110.  
  111. .form .control-group .Select-control:hover { border: 1px solid var(--main-color); }
  112.  
  113. .form .control-group .is-focused:not(.is-open) > .Select-control { border: 1px solid var(--main-color); }
  114.  
  115. .slider-bar { background: rgba(0, 0, 0, 0.44); }
  116.  
  117. .slider-handle, .slider-handle span { background-color: #151515; }
  118.  
  119. .form .control-group .Select-control .Select-placeholder { color: #787A7B; }
  120.  
  121. .tab-bar.SIDE { overflow-y: scroll; background-color: rgba(0, 0, 0, 0.8); }
  122.  
  123. .tab-bar.SIDE::-webkit-scrollbar { width: 0px; }
  124.  
  125. .create-guild-container .join-server .link-container input { border: 1px solid var(--main-color); }
  126.  
  127. .create-guild-container .join-server .sample-link { color: var(--main-color); }
  128.  
  129. .theme-dark .chat > .content .messages .message-group a { color: var(--main-color); }
  130.  
  131. .need-help-modal .footer { background-color: rgba(0, 0, 0, 0.88); border-top: 1px solid #000; }
  132.  
  133. .need-help-modal .header { background-color: var(--main-color); }
  134.  
  135. .need-help-button:hover { border-color: var(--main-color); color: var(--main-color); }
  136.  
  137. .need-help-button:hover .btn-help { color: var(--main-color); }
  138.  
  139. .settings .settings-inner { background-color: rgba(0, 0, 0, 0.7) !important; }
  140.  
  141. .notification-settings-modal .mute-server .checkbox .label { color: #fff; }
  142.  
  143. .notification-settings-modal .settings-section { color: #fff; }
  144.  
  145. .channel-notification-settings .content label { color: #ABAAAA; }
  146.  
  147. .scroller-wrap .scroller { overflow-y: scroll; }
  148.  
  149. .channel-notification-settings { border-bottom: 1px solid var(--main-color); }
  150.  
  151. .notification-settings-modal .notification-settings-modal-channel-settings-list { box-shadow: 0 -1px var(--main-color); }
  152.  
  153. .chat .new-messages-bar button { border-radius: 5px; }
  154.  
  155. .chat .new-messages-bar button:last-child { color: #fff; }
  156.  
  157. .download-apps .platforms .platform.active .download-button, .change-log .changelog-fixed, .modal-new-user .steps-wrap .steps li.on, .modal-new-user .steps-wrap .steps li.on + .divider, .modal-new-user .steps-wrap .steps li.on:before, .chat .new-messages-bar:hover { background-color: var(--main-color); }
  158.  
  159. .radio-image .radio-inner span:after { opacity: 0; filter: alpha(opacity=0); content: ''; position: absolute; width: 100%; height: 100%; border: 2px solid var(--main-color); border-radius: 3px; -webkit-transition: .3s ease; transition: .3s ease; left: -2px; top: -2px; }
  160.  
  161. .radio-image:hover span:after { opacity: .5; filter: alpha(opacity=50); border-color: var(--main-color); }
  162.  
  163. .guilds li.active .guild-inner, .guilds li:hover .guild-inner { border-radius: 15px; background: var(--main-color); animation: FColorPulse 2s infinite alternate; }
  164.  
  165. @-webkit-keyframes FColorPulse { 0% { background: var(--hover-color); }
  166.   100% { background: var(--main-color); } }
  167.  
  168. ld-channels ul .channel-voice-states li.speaking .avatar-small { background-color: var(--main-color); cursor: pointer; border: 2px solid var(--main-color); box-shadow: inset 0 0 0 2px #2e3136; }
  169.  
  170. #unsupported-browser li:hover { -webkit-transform: scale(1.04); transform: scale(1.04); border-color: var(--main-color); }
  171.  
  172. #unsupported-browser li:hover .browser { background-position-y: 100px; }
  173.  
  174. #unsupported-browser li:hover .btn { background-color: var(--main-color); color: #fff; border-color: var(--main-color); }
  175.  
  176. .mentioned .highlight:hover { color: var(--main-color); text-decoration: underline; }
  177.  
  178. .highlight:hover { cursor: pointer; color: #fff; background-color: var(--main-color); }
  179.  
  180. .tooltip.tooltip-left:after { position: absolute; left: 100%; top: 50%; border-left-color: var(--main-color); margin-top: -5px; }
  181.  
  182. .tooltip.tooltip-right:after { position: absolute; right: 100%; top: 50%; border-right-color: var(--main-color); margin-top: -5px; }
  183.  
  184. .tooltip { position: absolute; background-color: var(--main-color); box-shadow: 0 2px 4px 1px rgba(0, 0, 0, 0.1); border-radius: 3px; font-weight: 600; font-size: 12px; color: #fff; z-index: 1002; max-width: 160px; box-sizing: border-box; word-wrap: break-word; padding: 5px 10px; }
  185.  
  186. .tooltip.tooltip-bottom:after { position: absolute; bottom: 100%; left: 50%; border-bottom-color: var(--main-color); margin-left: -5px; }
  187.  
  188. .tooltip.tooltip-top:after { position: absolute; top: 100%; left: 50%; margin-left: -5px; border-top-color: var(--main-color); }
  189.  
  190. .region-select-modal { background: rgba(0, 0, 0, 0.75); }
  191.  
  192. .region-select-modal .region-select-modal-header { color: var(--main-color); }
  193.  
  194. .region-select-modal .region-select-modal-option { background-color: rgba(0, 0, 0, 0.48); border: 2px solid rgba(0, 0, 0, 0.35); }
  195.  
  196. .region-select-modal .region-select-modal-option:hover { border-color: var(--main-color); }
  197.  
  198. .form .radio-group .radio { color: #fff; }
  199.  
  200. .need-help-modal .header input[type=text] { box-shadow: 0 2px 1px var(--main-color); }
  201.  
  202. .change-log { background: rgba(0, 0, 0, 0.75); }
  203.  
  204. .change-log .header { color: var(--hover-color); border-bottom: 1px solid #4C4C4C; }
  205.  
  206. .change-log ul li { color: var(--main-color); }
  207.  
  208. .change-log .footer { border-top: 2px solid var(--main-color); color: var(--hover-color); background-color: transparent; }
  209.  
  210. .download-apps .platforms .platform { border: 2px solid var(--hover-color); }
  211.  
  212. .download-apps .footer { color: var(--hover-color); }
  213.  
  214. .download-apps .footer a { color: var(--main-color); }
  215.  
  216. .download-apps .header { color: var(--main-color); }
  217.  
  218. .download-apps .platforms .platform.active { border-color: var(--main-color); }
  219.  
  220. .user-settings-modal a:hover { color: var(--hover-color); }
  221.  
  222. .private-channels .channel.selected:before { border-left: 4px solid var(--main-color); }
  223.  
  224. .private-channels .channel:hover:before { border-left: 4px solid var(--main-color); }
  225.  
  226. .user-settings-modal .voice-settings .reset-voice-settings { color: var(--main-color); }
  227.  
  228. .user-settings-modal .voice-settings .reset-voice-settings:hover { color: var(--hover-color); }
  229.  
  230. .modal-content .form-inner p { color: #E6E6E6; }
  231.  
  232. .form .form-header { background: rgba(0, 0, 0, 0.85); border-bottom: 1px solid rgba(0, 0, 0, 0.53); }
  233.  
  234. .popout header { background-color: var(--main-color); }
  235.  
  236. .popout section { background-color: rgba(0, 0, 0, 0.7); }
  237.  
  238. #voice-connection-popout hr { border: 1px solid var(--main-color); }
  239.  
  240. .small-popout-box { background: rgba(0, 0, 0, 0.5); border: 1px solid rgba(0, 0, 0, 0.28); }
  241.  
  242. .option-popout .btn-item:hover { color: #BBBBBB; }
  243.  
  244. .member-roles .member-role { background-color: var(--main-color); color: #ffffff; border: 1px solid var(--main-color); }
  245.  
  246. .user-popout .user-popout-options .btn { background-color: var(--main-color); border: 1px solid var(--main-color); }
  247.  
  248. .user-popout .user-popout-options .btn:hover { background-color: var(--hover-color); }
  249.  
  250. .chat .welcome-message h1 { color: var(--main-color); }
  251.  
  252. .channel-members .invite-btn { background-color: var(--main-color); }
  253.  
  254. .channel-members .invite-btn:hover { background-color: var(--hover-color); }
  255.  
  256. .instant-invite-popout hr { border: 1px solid var(--main-color); }
  257.  
  258. .instant-invite-popout a { color: var(--main-color); }
  259.  
  260. .instant-invite-popout a:hover { color: var(--hover-color); }
  261.  
  262. .clipboard-input-inner input::selection { background: var(--main-color); }
  263.  
  264. .clipboard-input-inner button { border-left: 1px solid rgba(0, 0, 0, 0.69); background-color: rgba(0, 0, 0, 0.83); }
  265.  
  266. .clipboard-input-inner input { color: var(--hover-color); background: rgba(0, 0, 0, 0.6); }
  267.  
  268. .clipboard-input-inner { background: transparent; border: 1px solid transparent; }
  269.  
  270. .clipboard-input-inner button:first-of-type:before { background: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(0, 0, 0, 0.79)); }
  271.  
  272. ::selection { color: #fff; background: var(--main-color); }
  273.  
  274. .theme-dark .chat .welcome-message a { color: var(--main-color); }
  275.  
  276. #settings-roles .roles li.selected { background: none; }
  277.  
  278. #permissions ul li { color: #F4F4F4; }
  279.  
  280. #permissions .permission-actions > div { background-color: #2E3136; border: 2px solid #2A2C31; }
  281.  
  282. #permissions .permission-actions > div.PASSTHROUGH:hover { border: #51555F; }
  283.  
  284. #settings-roles .roles header { border-bottom: 1px solid rgba(0, 0, 0, 0.47); }
  285.  
  286. #settings-roles .roles { border-right: 1px solid var(--main-color); }
  287.  
  288. .btn-help:hover { background: var(--main-color); }
  289.  
  290. #permissions .permissions-helpdesk { color: var(--main-color); }
  291.  
  292. #permissions .permissions-helpdesk:hover { color: var(--hover-color); }
  293.  
  294. #settings-roles .roles li.selected:before { background-color: var(--main-color); }
  295.  
  296. #settings-roles .roles li:hover:before { background-color: var(--hover-color); }
  297.  
  298. .instant-invites .instant-invites-header { border-bottom: 2px solid var(--main-color); color: #E9E9E9; }
  299.  
  300. .instant-invites .instant-invite-buttons .btn { background: var(--main-color); }
  301.  
  302. .instant-invites .instant-invite-buttons .btn.btn-danger { border: 1px solid var(--main-color); color: #fff; }
  303.  
  304. .instant-invites .instant-invite-buttons .btn.btn-danger:hover { background: #D22B3A; border-color: #D22B3A; }
  305.  
  306. .instant-invites .instant-invites-list .instant-invite .member { color: #C3C3C3; }
  307.  
  308. #permissions .permission-actions.disabled > div { border: #565963; background: #565963; position: relative; }
  309.  
  310. .checkbox .checkbox-inner span { background: rgba(0, 0, 0, 0.30); transition: .2s linear all !important; }
  311.  
  312. .form .control-group .help-text { color: #B6BBC1; }
  313.  
  314. .avatar-uploader a { color: var(--main-color); }
  315.  
  316. .avatar-uploader a:hover { color: var(--hover-color); }
  317.  
  318. .instant-invites .instant-invites-list .instant-invite .show-channel .channel { color: #D6D6D6; }
  319.  
  320. .instant-invites .instant-invites-list .instant-invite + .instant-invite { border-top: 1px solid var(--main-color); }
  321.  
  322. .form .control-groups.control-separator { border-top: 1px solid var(--main-color); }
  323.  
  324. .guild-settings-modal-integrations .guild-settings-modal-integrations-header { color: #CCCCCC; border-bottom: 1px solid rgba(0, 0, 0, 0.47); box-shadow: none; }
  325.  
  326. .guild-settings-modal-integrations .guild-settings-modal-integrations-body.no-integrations p { color: gainsboro; }
  327.  
  328. .guild-settings-modal-integrations .guild-settings-modal-integrations-body.no-integrations p a { color: #F40000; }
  329.  
  330. .guild-settings-modal-members .guild-settings-modal-list .member .member-username { color: #CECECE; }
  331.  
  332. .guild-settings-modal-members .guild-settings-modal-members-header { border-bottom: 1px solid rgba(0, 0, 0, 0.36); }
  333.  
  334. #autocomplete-popout .empty:hover { background-color: #2E3136; }
  335.  
  336. #autocomplete-popout .empty h4 { color: var(--main-color); }
  337.  
  338. #autocomplete-popout h3 { color: #ECECEC; }
  339.  
  340. .popout.popout-bottom header:before { border-bottom-color: var(--main-color); }
  341.  
  342. .guild-settings-modal .guild-settings-modal-search { border: 1px solid rgba(0, 0, 0, 0.4); }
  343.  
  344. .guild-settings-modal .guild-settings-modal-search:focus { border: 1px solid #24272b; }
  345.  
  346. .guild-settings-modal-members .guild-settings-modal-members-footer a { color: var(--main-color); }
  347.  
  348. .guild-settings-modal-members .guild-settings-modal-members-footer a:hover { color: var(--hover-color); }
  349.  
  350. .guild-settings-modal-members .guild-settings-modal-members-footer { border-top: 1px solid rgba(0, 0, 0, 0.36); }
  351.  
  352. #settings-roles .roles li:hover { background: none; }
  353.  
  354. .form hr { border-bottom: 1px solid var(--main-color); }
  355.  
  356. .user-popout .user-popout-options .btn.btn-server { color: #fff; background-color: var(--main-color); border-color: var(--main-color); }
  357.  
  358. .user-popout .user-popout-options .btn.btn-server:hover { border-color: var(--main-color); background-color: var(--hover-color); }
  359.  
  360. .member-roles .manipulate:hover { border-color: var(--main-color); background-color: var(--hover-color); }
  361.  
  362. #user-profile-modal header { background-image: none; background-color: var(--main-color); }
  363.  
  364. #user-profile-modal .scroller { background: transparent !important; }
  365.  
  366. #user-profile-modal .friends .friend:hover { background: #26292D; color: #ADADAD; }
  367.  
  368. .need-help-modal a:hover { color: var(--hover-color); }
  369.  
  370. #user-profile-modal footer { background: rgba(0, 0, 0, 0.83); border-top: 1px solid transparent; z-index: 10;}
  371.  
  372. #user-profile-modal footer button { color: var(--main-color); }
  373.  
  374. .avatar-large { width: 40px; height: 40px; background-size: 40px 40px !important; left: 8px; }
  375.  
  376. .channel-textarea { margin: 10px 0 30px; }
  377.  
  378. .theme-dark .chat form { border-top: none; }
  379.  
  380. .guilds li.active .guild-inner:before { background: var(--main-color); }
  381.  
  382. .guilds li.unread .guild-inner:before { background: var(--main-color); }
  383.  
  384. .guild-channels ul .channel-text.unread:not(.selected):not(.channel-muted):before { background: var(--hover-color); }
  385.  
  386. .theme-dark .hljs { border: 1px solid transparent; border-radius: 4px; }
  387.  
  388. .theme-dark .chat > .content .messages .divider:not(.red) div { background: transparent; }
  389.  
  390. .theme-dark .chat > .content .messages .divider span { background: transparent; }
  391.  
  392. .chat .divider > span { color: #F1F1F1; }
  393.  
  394. .message-group .comment .markup pre { background: rgba(0, 0, 0, 0.45); border: 2px solid #29363E; }
  395.  
  396. .message-group .comment .markup pre code { background: transparent; color: #D4D4D4; }
  397.  
  398. .theme-dark .chat .title-wrap .topic a { color: var(--main-color); }
  399.  
  400. .guilds .friends-icon:hover { color: transparent; background-color: var(--main-color); }
  401.  
  402. #autocomplete-popout .row.selected a, #autocomplete-popout .row:hover a { color: #D4D4D5; }
  403.  
  404. #autocomplete-popout .row.selected, #autocomplete-popout .row:hover { background: rgba(0, 0, 0, 0.85); }
  405.  
  406. .download-apps .platforms .platform.active p { color: var(--main-color); }
  407.  
  408. .download-apps .platforms .platform .icon.apple.active { background-image: url(https://discordapp.com/assets/57568e1cfc37c81cf56db9498b4f128a.svg); }
  409.  
  410. .download-apps .platforms .platform .icon.windows.active { background-image: url(https://discordapp.com/assets/d6221c5e88f5cb89f125868c077e9859.svg); }
  411.  
  412. .download-apps .platforms .platform .icon.ios.active { background-image: url(https://discordapp.com/assets/0c460e9b848f5c4cc964ae9c62c0f9b9.svg); }
  413.  
  414. .download-apps .platforms .platform .icon.android.active { background-image: url(https://discordapp.com/assets/d73fd4014c02b360d9529a720ecb7c44.svg); }
  415.  
  416. .create-guild-container { background-color: transparent; }
  417.  
  418. .form .form-inner { background-image: Justincase("https://i.imgur.com/KCLIPt4.gif"); background-size: 40px 40px; background-repeat: no-repeat; background-position: 50% 74%; }
  419.  
  420. .need-help-button { visibility: hidden; }
  421.  
  422. .guilds-add { color: transparent !important; background-image: url("https://i.imgur.com/1MfzLoF.png") !important; background-size: 20px 20px !important; background-repeat: no-repeat !important; background-position: 9px 9px !important; background-color: rgba(21, 21, 21, 0.41) !important; opacity: 0.7 !important; }
  423.  
  424. .slider-handle span { border: 1px solid var(--main-color); }
  425.  
  426. .slider-handle span:after, .slider-handle span:before { content: none; }
  427.  
  428. .popout section:after, .popout section:before { content: none; }
  429.  
  430. .chat .welcome-message .item-container .icon.exclamation { background-image: url("https://i.imgur.com/DYPXksE.png"); background-repeat: no-repeat; background-size: 20px 20px; background-position: 29px 13px; }
  431.  
  432. .chat .welcome-message .item-container .icon.share { background-image: url("https://i.imgur.com/DYPXksE.png"); background-repeat: no-repeat; background-size: 20px 20px; background-position: 29px 13px; }
  433.  
  434. .chat .welcome-message .item-container .icon.apps { background-image: url("https://i.imgur.com/DYPXksE.png"); background-repeat: no-repeat; background-size: 20px 20px; background-position: 29px 13px; }
  435.  
  436. .chat .welcome-message .item-container .icon.mobile { background-image: url("https://i.imgur.com/DYPXksE.png"); background-repeat: no-repeat; background-size: 20px 20px; background-position: 29px 13px; }
  437.  
  438. .chat .welcome-message .item-container .icon.twitter { background-image: url("https://i.imgur.com/DYPXksE.png"); background-repeat: no-repeat; background-size: 20px 20px; background-position: 29px 13px; }
  439.  
  440. .user-settings-modal button.preview-sound:before { background-image: url("https://i.imgur.com/E8gsoBs.png"); }
  441.  
  442. .chat .new-messages-bar { background-color: var(--main-color); opacity: 0.8; }
  443.  
  444. .account { background-repeat: no-repeat; background-position: 12px 11px; }
  445.  
  446. .user-settings-modal-games { background: transparent; border-top: 1px solid rgba(0, 0, 0, 0.4); color: #E2E2E3; }
  447.  
  448. .user-settings-modal-games .games-table .games-row .item-game .last-played { color: #E2E2E3; }
  449.  
  450. .user-settings-modal-games .games-table .games-row .item-game .game-input { color: #E2E2E3; }
  451.  
  452. .user-settings-modal-games .games-table .games-row .item-game { border-bottom: 1px solid rgba(0, 0, 0, 0.4); }
  453.  
  454. .user-settings-modal-games .games-table .games-row .item-overlay { border-bottom: 1px solid rgba(0, 0, 0, 0.4); }
  455.  
  456. .now-playing { background: var(--main-color); padding: 22px; }
  457.  
  458. .checkbox .checkbox-inner.alt input[type=checkbox] + span { background: var(--main-color) !important; }
  459.  
  460. .checkbox .checkbox-inner.alt input[type=checkbox]:checked + span:after { border-color: #43B581; }
  461.  
  462. .sensitivity .slider .slider-bar-auto { background-color: rgba(0, 0, 0, 0.44); }
  463.  
  464. .user-settings-modal-keybinds .user-settings-modal-keybinds-header { border-bottom: 1px solid rgba(0, 0, 0, 0.44); }
  465.  
  466. .user-settings-modal-connections .user-settings-modal-accounts-list .connect-container .btn { background: rgba(0, 0, 0, 0.57); border: 2px solid rgba(0, 0, 0, 0.23); background-repeat: no-repeat; background-position: 50%; }
  467.  
  468. .alert.form .form-inner .btn { border: 1px solid var(--hover-color); }
  469.  
  470. .alert.form .form-inner .cancel { border-color: #99aab5 !important; }
  471.  
  472. .user-settings-modal .account-warning { border: 1px solid #B54343; background: #B54343; color: #F5FBF9; }
  473.  
  474. .user-settings-modal-games .games-table .games-row .item-game .icon { background-image: url(https://i.imgur.com/DYCx6qB.png); background-repeat: no-repeat; background-position: -13px -14px; background-size: 42px; }
  475.  
  476. .theme-dark .chat > .content .messages .divider:not(.red) span { opacity: .9; }
  477.  
  478. .links:after { content: "Omniscient"; color: #8C8F94; margin-left: 6px; font-weight: bold; }
  479.  
  480. .links li + li:after { content: '\2022'; color: #535559; margin-left: 6px; }
  481.  
  482. .message-group h2 strong { color: #aaaba7; }
  483.  
  484. #emote-menu, #tc-settings-panel, .tc-switch { border: 1px solid #2B2B2B; }
  485.  
  486. .emote-container:hover { background: var(--main-color); }
  487.  
  488. .spinner-wandering-cubes .spinner-item { background-color: var(--main-color); border-radius: 10px; }
  489.  
  490. #bd-ps-container { border: 1px solid transparent; border-radius: 4px; opacity: 0.9; }
  491.  
  492. #bd-ps-header { background: #1E2124; border-bottom: 1px solid #24272B; }
  493.  
  494. #bd-ps-body table tr { border-bottom: 1px solid #2E3136 !important; background-color: none; }
  495.  
  496. #bd-ps-body table th { background-color: #25272B; }
  497.  
  498. textarea { background: transparent !important; }
  499.  
  500. .help-container { display: none; }
  501.  
  502. .links { border-top: 0px solid transparent; }
  503.  
  504. .links li a { color: #8C8F94; }
  505.  
  506. .links, .chat, .typing, .content, .guild-channels, .private-channels, .guild-header header, .divider-red span, .messages-wrapper, #voice-connection { background: transparent !important; }
  507.  
  508. .channels-wrap { background: rgba(0, 0, 0, 0.75); width: 220px; }
  509.  
  510. .content .flex-spacer { background: rgba(0, 0, 0, 0.85); }
  511.  
  512. .channel-members { background: rgba(0, 0, 0, 0.9) !important; }
  513.  
  514. .guilds-wrapper { box-shadow: inset -10px 0px 20px -10px rgba(0, 0, 0, 0.2); }
  515.  
  516. .guild-header ul { background: rgba(0, 0, 0, 0.52) !important; transition: transform 0.5s cubic-bezier(0.18, 0.89, 0.32, 1.28) !important; padding-top: 100px; top: -56px; }
  517.  
  518. .guilds-add { opacity: 0.5; }
  519.  
  520. .guilds-wrapper { border-right: none; background-color: transparent; }
  521.  
  522. .guild-header header { box-shadow: none !important; color: #ddd; }
  523.  
  524. .guild-channels header h2, .guild-channels ul .channel a { color: #fff; }
  525.  
  526. .guilds { padding: 18px 20px 85px 20px; background: rgba(0, 0, 0, 0.6) !important; }
  527.  
  528. .guilds-add { font-size: 30px; background: #000; }
  529.  
  530. .guilds .friends-online { margin-left: -5px; }
  531.  
  532. .guilds li .guild-inner { background: rgba(21, 21, 21, 0.41) !important; }
  533.  
  534. .guilds li .guild-inner a, .guilds li, .guilds li .avatar-small { width: 40px; height: 40px; }
  535.  
  536. .guilds li .avatar-small { width: 40px; height: 40px; background-size: 40px 40px; }
  537.  
  538. .guilds li .guild-inner { line-height: 40px; }
  539.  
  540. .guilds .friends-icon { width: 40px; height: 40px; background-size: 25px 19px; }
  541.  
  542. .guilds li.audio .guild-inner:after { background-size: 12px; background-color: rgba(0, 0, 0, 0.8); }
  543.  
  544. .guilds-separator:after { background: rgba(28, 28, 28, 0.52) !important; }
  545.  
  546. .guilds li .guild-inner:before { left: -26px; }
  547.  
  548. .guild-channels header h2, .private-channels header { opacity: .6; }
  549.  
  550. .private-channels .search-bar { background: rgba(10, 13, 16, 0) !important; }
  551.  
  552. .private-channels .search-bar input { background: rgba(0, 0, 0, 0.4) !important; }
  553.  
  554. .search-bar-clear:before { background: #000; }
  555.  
  556. .search-bar-clear { background: #057f95; }
  557.  
  558. .guild-channels ul .channel.selected, .private-channels .channel.selected, .private-channels .search-result.selected, .private-channels .search-result:hover { background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.6) 85%, rgba(46, 49, 54, 0)) !important; }
  559.  
  560. .guild-channels ul .channel:not(.selected):hover, .private-channels .channel:not(.selected):hover { background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.3) 85%, rgba(46, 49, 54, 0)) !important; }
  561.  
  562. .btn-hamburger { margin-right: -25px; }
  563.  
  564. .btn-hamburger span { background: #fff; }
  565.  
  566. .account { padding: 0 4px !important; background: transparent; height: 77px; border: 0px solid transparent; }
  567.  
  568. .account .status { border: 2px solid black; }
  569.  
  570. .account .btn { background: transparent; box-shadow: none !important; }
  571.  
  572. .account .btn:active { background: rgba(0, 0, 0, 0.26); }
  573.  
  574. .account .btn-deafen, .account .btn-mute { border-right: none; }
  575.  
  576. #voice-connection { border-top: none !important; padding: 15px 20px 15px 18px !important; }
  577.  
  578. #voice-connection .btn { background: rgba(0, 0, 0, 0.45); box-shadow: none !important; }
  579.  
  580. #voice-connection .btn:active { background: rgba(0, 0, 0, 0.6); }
  581.  
  582. .account .btn-deafen, .account .btn-settings { box-shadow: none !important; }
  583.  
  584. .account .btn-group, #voice-connection .btn-group { border: none; }
  585.  
  586. .title-wrap { border-bottom: 1px solid rgba(0, 0, 0, 0.3) !important; background: rgba(0, 0, 0, 0.88) !important; }
  587.  
  588. .chat .divider:not(.divider-red) > div { background: rgba(255, 255, 255, 0.2) !important; }
  589.  
  590. .chat .divider > span { background: rgba(255, 255, 255, 0.2) !important; font-size: 12px; text-transform: uppercase; margin: 10px 0px; border-radius: 3px; opacity: 1; padding: 5px 15px; width: 100%; text-align: center; }
  591.  
  592. .chat .divider.divider-red > span { background: rgba(240, 71, 71, 0.6) !important; color: rgba(255, 255, 255, 0.8) !important; }
  593.  
  594. .chat .divider:not(.divider-red) > span { color: white !important; }
  595.  
  596. .chat .divider > div { display: none; }
  597.  
  598. .chat .new-messages-bar:hover { background-color: var(--hover-color); }
  599.  
  600. .chat-empty { background: rgba(20, 23, 27, 0.95); }
  601.  
  602. .chat > .title-wrap > .topic { font-size: 12px; margin-top: 5px; color: #AFAFAF !important; }
  603.  
  604. .chat > .content .messages .message-group:not(.has-divider) { border-bottom-color: rgba(255, 255, 255, 0.04) !important; }
  605.  
  606. .chat > .content .messages .message-group .markup .highlight { color: #ddd !important; padding: 1px 4px; border-radius: 6px; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; -ms-transition: all 0.3s ease; line-height: 27px; }
  607.  
  608. .chat > .content .messages .message-group .markup .highlight:hover { color: #fff !important; }
  609.  
  610. .chat > .content .messages .message-group .markup { line-height: 16px; }
  611.  
  612. .chat > .content .messages .message-group h2 .user-name { color: rgba(255, 255, 255, 0.8); }
  613.  
  614. .chat > .content .messages .message-group h2 span { color: rgba(255, 255, 255, 0.2); }
  615.  
  616. .chat > .content .messages .message-group .markup pre { background: transparent !important; border-color: rgba(255, 255, 255, 0.1) !important; }
  617.  
  618. .chat > .content .messages .message-group .markup pre code.hljs { background: rgba(0, 0, 0, 0.42) !important; color: rgba(255, 255, 255, 0.7) !important; padding: 5px !important; }
  619.  
  620. .chat > .content .messages .message-group .markup code.inline { background: rgba(255, 255, 255, 0.1) !important; color: rgba(255, 255, 255, 0.7) !important; padding: 0.3em 0.6em; }
  621.  
  622. .channel-textarea-upload { border-right-color: rgba(255, 255, 255, 0.1) !important; }
  623.  
  624. .channel-textarea-inner { border: 2px solid rgba(255, 255, 255, 0.1) !important; background: rgba(0, 0, 0, 0.6) !important; }
  625.  
  626. .typing { font-size: 11px; }
  627.  
  628. .spoiler span { display: none; }
  629.  
  630. .spoiler:before { padding-top: 7px; padding-bottom: 3px; min-height: 18px; background: none; }
  631.  
  632. #twitchcord-button { background-size: 24px; background-position: 20px; background-color: transparent; }
  633.  
  634. .message-group.compact .timestamp { position: relative; top: -4px; }
  635.  
  636. .message-group.compact .message .markup .user-name { margin-right: 10px; }
  637.  
  638. .add-friend-popout .btn:disabled { opacity: 0.4; }
  639.  
  640. .private-channels .channel.btn-friends .badge { margin-right: 10px; }
  641.  
  642. #friends { background: transparent !important; }
  643.  
  644. .friends-header { background: rgba(0, 0, 0, 0.88) !important; }
  645.  
  646. .friends-table { background: rgba(0, 0, 0, 0.85) !important; margin-top: 0 !important; }
  647.  
  648. .friends-table .friends-table-body { padding-top: 20px !important; }
  649.  
  650. .friends-table .friends-row:hover { background: rgba(0, 0, 0, 0.35) !important; }
  651.  
  652. .channel-members .member:hover { background: rgba(255, 255, 255, 0.07) !important; }
  653.  
  654. .channel-members .member .member-username { font-size: 14px; }
  655.  
  656. .channel-members .avatar-small .status { border-color: rgba(0, 0, 0, 0.7) !important; }
  657.  
  658. .user-popout .user-popout-options .btn:hover { border: 1px solid var(--main-color); }
  659.  
  660. .tooltip { color: #fff; }
  661.  
  662. .bd-minimal .guilds { padding-left: 10px !important; }
  663.  
  664. .bd-minimal .guilds .friends-icon { background-size: 60%; }
  665.  
  666. .bd-minimal .guilds li .guild-inner:before { height: 25px; border-radius: 5px; margin-top: -13px; }
  667.  
  668. .bd-minimal .guilds li.unread .guild-inner:before { width: 10px; height: 10px; margin-top: -5px; left: -16px; }
  669.  
  670. .bd-minimal .guilds li.active .guild-inner:before { left: -18px; border-radius: 5px; height: 25px; margin-top: -13px; }
  671.  
  672. .bd-minimal .guilds li, .bd-minimal .guilds li .avatar-small, .bd-minimal .guilds li .guild-inner, .bd-minimal .guilds li .guild-inner a, .bd-minimal .guilds .friends-icon { width: 25px; height: 25px; line-height: 25px; }
  673.  
  674. .bd-minimal .guilds li .avatar-small, #bd-pub-button { font-size: 9px !important; text-transform: uppercase; }
  675.  
  676. .bd-minimal .chat > .title-wrap > .title { font-size: 16px; }
  677.  
  678. .bd-minimal .theme-dark .comment { border-left: none !important; padding-left: 10px; }
  679.  
  680. .bd-minimal .message-group { padding: 10px 5px; }
  681.  
  682. .bd-minimal .guild-channels ul .channel-text .channel-name { padding-left: 5px; }
  683.  
  684. .bd-minimal .avatar-large { border-radius: 100%; }
  685.  
  686. .bd-minimal .message-group .edit-message .edit-container-outer { margin-left: 50px; }
  687.  
  688. .bd-minimal .message-group .edit-message .edit-container-inner { margin-left: 10px; }
  689.  
  690. .bd-minimal .channel-members h2 { margin-top: 20px; margin-bottom: 3px; padding-left: 20px; }
  691.  
  692. .bd-minimal .channel-members h2:first-of-type { margin-top: 0px; margin-bottom: 3px; }
  693.  
  694. .bd-minimal .channel-members .member { padding: 5px 15px 8px 20px; }
  695.  
  696. .bd-minimal .guild-header header span { margin-left: -13px; font-size: 14px; }
  697.  
  698. .bd-minimal .guild-channels ul .channel-text.unread:not(.selected):not(.channel-muted):before { top: 9px; width: 10px; height: 10px; }
  699.  
  700. .bd-minimal .guild-channels h2 { margin-left: 10px; }
  701.  
  702. .bd-minimal #voice-connection { width: 176px; margin-left: -46px; }
  703.  
  704. .bd-minimal .account { width: 176px; margin-left: -46px; }
  705.  
  706. .bd-minimal .account .avatar-small { display: block !important; }
  707.  
  708. .bd-minimal .account .username { display: none; }
  709.  
  710. .bd-minimal .account .btn-group { margin-left: 10px; }
  711.  
  712. .bd-minimal .account .btn-group .btn { width: 30px; }
  713.  
  714. .settings .settings-header { background: none !important; }
  715.  
  716. .channel-notification-settings .content .content-inner { background: transparent !important; }
  717.  
  718. .guild-channels ul .channel-text:hover:not(.unread):before { border-left: 4px solid var(--main-color); }
  719.  
  720. .guild-channels ul .channel-text.selected:before { border-left: 4px solid var(--main-color); }
  721.  
  722. .guilds li.active .guild-inner, .guilds li:hover .guild-inner { background: var(--main-color) !important; }
  723.  
  724. .theme-dark .chat > .content:first-child .scroller-wrap::-webkit-scrollbar-thumb { background-color: var(--main-color); }
  725.  
  726. .create-guild-container .create-or-join .form-inner { background-color: rgba(0, 0, 0, 0.8); }
  727.  
  728. .create-guild-container .action { background: rgba(0, 0, 0, 0.58); }
  729.  
  730. .create-guild-container .create-or-join .actions .or { color: #000; -webkit-filter: invert(100%); }
  731.  
  732. .form .form-inner { background-color: rgba(0, 0, 0, 0.8); }
  733.  
  734. .form header { color: var(--main-color); }
  735.  
  736. .form .control-group input[type=email], .form .control-group input[type=password], .form .control-group input[type=text], .form .control-group textarea { background: rgba(0, 0, 0, 0.69); color: #D6D6D6; border-bottom: 0px solid #000000; border-radius: 3px; padding: 0px 0px 0px 5px; }
  737.  
  738. .form .control-group input[type=email]:focus, .form .control-group input[type=password]:focus, .form .control-group input[type=text]:focus, .form .control-group textarea:focus { border-bottom: 2px solid var(--main-color); }
  739.  
  740. .region-select { background: transparent; }
  741.  
  742. .region-select .region-select-inner { background: rgba(0, 0, 0, 0.45); border: 1px solid rgba(0, 0, 0, 0.24); }
  743.  
  744. .region-select button { background-color: rgba(0, 0, 0, 0.5); border: 1px solid rgba(0, 0, 0, 0.28); color: var(--main-color); }
  745.  
  746. .region-select:hover .region-select-inner, .region-select:hover button { border-color: var(--main-color); }
  747.  
  748. .region-select:hover button { background-color: var(--main-color); }
  749.  
  750. .create-guild-container h5 { color: var(--main-color); }
  751.  
  752. .avatar-uploader .avatar-uploader-inner { background-color: var(--main-color); border: 5px solid var(--hover-color); }
  753.  
  754. .form .form-actions { background-color: rgba(0, 0, 0, 0.85); border-top: 1px solid rgba(0, 0, 0, 0.53); }
  755.  
  756. .form .btn-default { background-color: rgba(0, 0, 0, 0.77); padding: 10px 0; width: 75px; height: 35.5px; border-radius: 3px; border-bottom: none; }
  757.  
  758. .form .btn-primary { background-color: var(--main-color); }
  759.  
  760. .create-guild-container .action.create .action-header { color: var(--main-color); }
  761.  
  762. .create-guild-container .action:hover.create .btn { background-color: var(--hover-color); }
  763.  
  764. .form .btn-primary:hover { background-color: var(--hover-color); }
  765.  
  766. .scroller-wrap .scroller::-webkit-scrollbar-thumb { background-color: var(--main-color) !important; border: 3px solid rgba(211, 5, 5, 0) !important; }
  767.  
  768. .scroller-wrap .scroller::-webkit-scrollbar-track-piece { background-color: var(--main-color) !important; border: 3px solid rgba(211, 5, 5, 0) !important; }
  769.  
  770. .tab-bar.SIDE .tab-bar-item:before { border-left: none; }
  771.  
  772. a:link { color: var(--main-color); }
  773.  
  774. .user-settings-modal a { color: var(--main-color); }
  775.  
  776. .user-settings-modal .settings-wrapper, .user-settings-modal .voice-settings { background: none; }
  777.  
  778. .settings .settings-actions { background-color: rgba(0, 0, 0, 0.76); border-top: 2px solid var(--main-color); }
  779.  
  780. .checkbox .checkbox-inner + span { color: #fff; }
  781.  
  782. .highlight { color: var(--main-color); background: rgba(0, 0, 0, 0.51); border-radius: 3px; transition: .3s all ease-in-out; }
  783.  
  784. .user-settings-modal-connections .user-settings-modal-accounts-list .connect-container .name { color: #fff; }
  785.  
  786. .user-settings-modal-connections .user-settings-modal-connections-list .connection .connection-integrations.no-integrations { color: rgba(222, 222, 222, 0.59); background-color: rgba(0, 0, 0, 0.38); }
  787.  
  788. .user-settings-modal-connections .user-settings-modal-connections-list .connection .connection-integrations { border: 2px solid rgba(0, 0, 0, 0.45); border-top: transparent; }
  789.  
  790. .user-settings-modal-connections .user-settings-modal-connections-list { box-shadow: 0 -1px rgba(0, 0, 0, 0.37); }
  791.  
  792. .tab-bar.TOP .tab-bar-item.selected { border-bottom: 2px solid var(--hover-color); color: #fff;}
  793.  
  794. .checkbox .checkbox-inner input[type=checkbox]:checked + span { background-color: var(--main-color) !important; border-color: var(--main-color) !important; transition: .2s ease-in-out all !important; }
  795.  
  796. .radio .radio-inner span:after { background: var(--main-color); }
  797.  
  798. .slider-bar-fill { background: var(--main-color); }
  799.  
  800. .slider-handle { border: 1px solid var(--main-color); }
  801.  
  802. .radio .radio-inner { background: rgba(0, 0, 0, 0.64); border: 2px solid var(--main-color); }
  803.  
  804. #user-profile-modal .tab-bar.TOP { position: absolute; margin-top: -28px; }
  805.  
  806. #user-profile-modal .header .discord-tag {color: #fff;font-size: 18px;margin-top: -20px;margin-left: -49px !important;}
  807.  
  808. .tab-bar.TOP { border-bottom: 1px solid var(--main-color); }
  809.  
  810. #bd-ps-body table tr:nth-child(odd):hover { background-color: var(--main-color); }
  811.  
  812. .guild-settings-modal-members .member-buttons .btn { background: var(--main-color); border: 1px solid var(--main-color); color: #EFEFEF; }
  813.  
  814. .guild-settings-modal-members .member-buttons .btn.btn-danger:hover { background: var(--hover-color); }
  815.  
  816. .guild-settings-modal-members .member-buttons .btn.btn-danger { border: 1px solid var(--hover-color); color: #FFFFFF; }
  817.  
  818. .guild-settings-modal-members .guild-settings-modal-list .member + .member { border-top: 1px solid rgba(0, 0, 0, 0.45); }
  819.  
  820. .member-roles .member-role .member-role-remove { background: url(https://i.imgur.com/O2TX2bn.png) 50% no-repeat; width: 8px; height: 12px; background-size: 8px; }
  821.  
  822. .member-roles .member-role.member-role-add button { background: url(https://i.imgur.com/1MfzLoF.png) 50% no-repeat; width: 8px; height: 12px; background-size: 10px; }
  823.  
  824. .member-roles .member-role:hover { background-color: var(--hover-color); }
  825.  
  826. .guilds-add:hover { border-color: #2ed172; color: transparent; opacity: 1.0; -webkit-animation: color_change 1s infinite alternate; -moz-animation: color_change 1s infinite alternate; -ms-animation: color_change 1s infinite alternate; -o-animation: color_change 1s infinite alternate; animation: color_change 1s infinite alternate; }
  827.  
  828. @-webkit-keyframes color_change { from { border-color: #535559; }
  829.   to { border-color: green; } }
  830.  
  831. @-moz-keyframes color_change { from { border-color: #535559; }
  832.   to { border-color: green; } }
  833.  
  834. @-o-keyframes color_change { from { border-color: #535559; }
  835.   to { border-color: green; } }
  836.  
  837. @keyframes color_change { from { border-color: #535559; }
  838.   to { border-color: green; } }
  839.  
  840. .channel-members h2 { color: var(--main-color) !important; font-size: 11px; text-transform: uppercase; letter-spacing: .08em; font-weight: bold; padding: 4px 58px; background-color: rgba(0, 0, 0, 0.48); border: 1px solid; border-color: transparent; border-radius: 3px; width: 90px; margin-left: 15px; text-align: center; }
  841.  
  842. .private-channels .search-result.selected:before, .private-channels .search-result:hover:before { border-left: 4px solid var(--hover-color); }
  843.  
  844. .message-group .edit-message .channel-textarea-inner { border-color: var(--main-color); }
  845.  
  846. .channel-members .member .member-game strong { color: var(--main-color); }
  847.  
  848. .spoiler { Background-color: rgba(125, 58, 114, 0.28); border: 1px solid; border-color: transparent; border-radius: 6px; cursor: pointer; }
  849.  
  850. #bd-ps-body table tr:hover { background-color: var(--main-color); }
  851.  
  852. @keyframes swing { 0% { transform: rotate(0deg);
  853.     -webkit-transform: rotate(0deg);
  854.     -moz-transform: rotate(0deg);
  855.     -o-transform: rotate(0deg);
  856.     -ms-transform: rotate(0deg); }
  857.   25% { transform: rotate(-30deg);
  858.     -webkit-transform: rotate(-30deg);
  859.     -moz-transform: rotate(-30deg);
  860.     -o-transform: rotate(-30deg);
  861.     -ms-transform: rotate(-30deg); }
  862.   50% { transform: rotate(0deg);
  863.     -webkit-transform: rotate(0deg);
  864.     -moz-transform: rotate(0deg);
  865.     -o-transform: rotate(0deg);
  866.     -ms-transform: rotate(0deg); }
  867.   75% { transform: rotate(30deg);
  868.     -webkit-transform: rotate(30deg);
  869.     -moz-transform: rotate(30deg);
  870.     -o-transform: rotate(30deg);
  871.     -ms-transform: rotate(30deg); }
  872.   100% { transform: rotate(0deg);
  873.     -webkit-transform: rotate(0deg);
  874.     -moz-transform: rotate(0deg);
  875.     -o-transform: rotate(0deg);
  876.     -ms-transform: rotate(0deg); } }
  877.  
  878. @-webkit-keyframes swing { 0% { transform: rotate(0deg);
  879.     -webkit-transform: rotate(0deg);
  880.     -moz-transform: rotate(0deg);
  881.     -o-transform: rotate(0deg);
  882.     -ms-transform: rotate(0deg); }
  883.   25% { transform: rotate(-30deg);
  884.     -webkit-transform: rotate(-30deg);
  885.     -moz-transform: rotate(-30deg);
  886.     -o-transform: rotate(-30deg);
  887.     -ms-transform: rotate(-30deg); }
  888.   50% { transform: rotate(0deg);
  889.     -webkit-transform: rotate(0deg);
  890.     -moz-transform: rotate(0deg);
  891.     -o-transform: rotate(0deg);
  892.     -ms-transform: rotate(0deg); }
  893.   75% { transform: rotate(30deg);
  894.     -webkit-transform: rotate(30deg);
  895.     -moz-transform: rotate(30deg);
  896.     -o-transform: rotate(30deg);
  897.     -ms-transform: rotate(30deg); }
  898.   100% { transform: rotate(0deg);
  899.     -webkit-transform: rotate(0deg);
  900.     -moz-transform: rotate(0deg);
  901.     -o-transform: rotate(0deg);
  902.     -ms-transform: rotate(0deg); } }
  903.  
  904. @keyframes swing1 { 0% { left: -15px;
  905.     right: 0; }
  906.   25% { left: -100px;
  907.     right: 0; }
  908.   50% { left: -15px;
  909.     right: 0; }
  910.   75% { left: 0;
  911.     right: -100px; }
  912.   100% { left: -15px;
  913.     right: 0; } }
  914.  
  915. @-webkit-keyframes swing1 { 0% { left: -15px;
  916.     right: 0; }
  917.   25% { left: -100px;
  918.     right: 0; }
  919.   50% { left: -15px;
  920.     right: 0; }
  921.   75% { left: 0;
  922.     right: -100px; }
  923.   100% { left: -15px;
  924.     right: 0; } }
  925.  
  926. .header-toolbar button[data-reactid=".0.1.1.0.2.0.4.0:0"]:hover { animation: swing 4s infinite linear; -webkit-animation: swing 4s infinite linear; }
  927.  
  928. @-webkit-keyframes load8 { 0% { -webkit-transform: rotate(0deg);
  929.     transform: rotate(0deg); }
  930.   100% { -webkit-transform: rotate(360deg);
  931.     transform: rotate(360deg); } }
  932.  
  933. @keyframes load8 { 0% { -webkit-transform: rotate(0deg);
  934.     transform: rotate(0deg); }
  935.   100% { -webkit-transform: rotate(360deg);
  936.     transform: rotate(360deg); } }
  937.  
  938. .account .btn-settings:hover:after { -webkit-transform: translateZ(0); -ms-transform: translateZ(0); transform: translateZ(0); -webkit-animation: load8 2.8s infinite linear; animation: load8 2.8s infinite linear; }
  939.  
  940. .badge { animation: zoom 2s infinite; }
  941.  
  942. @keyframes zoom { 0% { -webkit-transform: scale(1, 1); }
  943.   50% { -webkit-transform: scale(1.2, 1.2); }
  944.   100% { -webkit-transform: scale(1, 1); } }
  945.  
  946. .guild-channels ul .channel-voice.locked:hover .icon-lock { animation: shake 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both; }
  947.  
  948. @keyframes shake { 10%, 90% { transform: translate3d(-1px, 0, 0); }
  949.   20%, 80% { transform: translate3d(2px, 0, 0); }
  950.   30%, 50%, 70% { transform: translate3d(-4px, 0, 0); }
  951.   40%, 60% { transform: translate3d(4px, 0, 0); } }
  952.  
  953. .guild-channels ul .channel-voice.locked { cursor: pointer; }
  954.  
  955. .theme-dark #friends .friends-header .tab-bar .tab-bar-item.selected { background-color: #43B581; color: #fff; }
  956.  
  957. #friends .btn { background-color: var(--main-color); }
  958.  
  959. #friends .btn:hover { background-color: var(--hover-color); }
  960.  
  961. .private-channels .channel.selected .icon-friends { background-color: var(--hover-color); }
  962.  
  963. .add-friend-popout { background: transparent; }
  964.  
  965. .add-friend-popout header input:focus { border-color: rgba(255, 255, 255, 0.3); }
  966.  
  967. .add-friend-popout .btn:disabled { background-color: var(--hover-color); }
  968.  
  969. #user-profile-modal .sub-header { background: rgba(0, 0, 0, 0.83); }
  970.  
  971. #user-profile-modal .tab-bar {     background: rgba(0, 0, 0, 0.62);border-bottom: 1px solid transparent;border-radius: 3px;}
  972.  
  973. #user-profile-modal .btn { background-color: var(--main-color); }
  974.  
  975. #user-profile-modal .btn:hover { background-color: var(--hover-color); }
  976.  
  977. #user-profile-modal .guilds .guild:hover { background: linear-gradient(90deg, rgba(0, 0, 0, 0.61) 90%, transparent); color: #D8D8D8; }
  978.  
  979. #user-profile-modal .empty { background: rgba(0, 0, 0, 0.83); }
  980.  
  981. .message-group-blocked { background: #fcfcfc; -webkit-box-pack: center; -o-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; border: 1px solid #e3e5e7; border-radius: 3px; margin: 6px 6px 6px 19px; display: none; }
  982.  
  983. .user-settings-modal-account .discord-tag { color: var(--main-color); }
  984.  
  985. .guilds .friends-online:hover { background: #43B581 !important; }
  986.  
  987. .add-friend-popout-info .add-friend-popout-info-confirmation:before { background: url(https://i.imgur.com/DYCx6qB.png) 50% no-repeat; content: ' '; width: 17px; height: 16px; background-size: 40px 39px; display: inline-block; vertical-align: middle; margin-top: -8px; margin-right: 4px; }
  988.  
  989. .message-group .btn-option:hover { -webkit-transform: translateZ(0); -ms-transform: translateZ(0); transform: translateZ(0); -webkit-animation: load8 2.8s infinite linear; animation: load8 2.8s infinite linear; }
  990.  
  991. .chat .has-more button { color: var(--main-color); }
  992.  
  993. .theme-dark #friends .friends-table .friends-table-header .friends-column[data-reactid*=".0.1.1.0.2.1.0.6"]:after { content: "Actions"; color: rgba(255, 255, 255, 0.5); font-size: 12px; text-transform: uppercase; letter-spacing: .025em; font-weight: 600; -webkit-flex-shrink: 0; flex-shrink: 0; margin-left: 60px; }
  994.  
  995. .theme-dark .friends-table .messages .message-group .comment .markup pre, .theme-dark .messages-wrapper .messages .message-group .comment .markup pre { background: rgba(46, 49, 54, 0.32); border-color: #282b30; }
  996.  
  997. .theme-dark .channel-members .member.popout-open, .theme-dark .channel-members .member:hover { background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.3) 85%, rgba(46, 49, 54, 0)) !important; }
  998.  
  999. .scroller-wrap .scroller::-webkit-scrollbar-track-piece { border: 3px solid rgba(255, 255, 255, 0) !important; background-color: rgba(0, 0, 0, 0.3) !important; }
  1000.  
  1001. .theme-dark #friends .friends-header .tab-bar .tab-bar-item:hover:not(.selected) { background: var(--hover-color);color: #fff; }
  1002.  
  1003. .theme-dark .friends-table .messages .message-group .comment .markup .highlight:hover, .theme-dark .messages-wrapper .messages .message-group .comment .markup .highlight:hover { background-color: var(--main-color); }
  1004.  
  1005. .user-popout { opacity: 1; }
  1006.  
  1007. .user-settings-modal.settings { opacity: 1; /*[[NSFWON]]*/ /*[[NSFWOFF]]*/ }
  1008.  
  1009. .message-group .image { -webkit-filter: none; }
  1010.  
  1011. .message-group .image:hover { -webkit-filter: none; }
  1012.  
  1013. .channel-textarea-autocomplete-inner { background: rgba(0, 0, 0, 0.84) !important; border: none !important; }
  1014.  
  1015. .channel-textarea-autocomplete-inner:after { display: none; }
  1016.  
  1017. .channel-textarea-autocomplete-inner header { background: rgba(0, 0, 0, 0.84) !important; border-radius: 5px 5px 0 0; border: none !important; }
  1018.  
  1019. .channel-textarea-autocomplete ul li.active { background: var(--main-color) !important; opacity: 0.95; color: #fff; }
  1020.  
  1021. #user-profile-modal .avatar-profile { border: 6px solid var(--main-color) !important; }
  1022.  
  1023. #user-profile-modal footer .btn.disabled { background: #8E8E8E !important; }
  1024.  
  1025. #user-profile-modal footer .btn.disabled:hover { background: #777777 !important; }
  1026.  
  1027. span.discriminator { font-size: 11px !important; color: rgba(255, 255, 255, 0.7) !important; margin-left: 8px !important; border-radius: 5px !important; background: rgba(0, 0, 0, 0.19) !important; font-weight: bold !important; border: 3px solid transparent !important; -webkit-transition: all 0.3s ease !important; -moz-transition: all 0.3s ease !important; -o-transition: all 0.3s ease !important; -ms-transition: all 0.3s ease !important; }
  1028.  
  1029. .guilds-error { width: 40px !important; height: 40px !important; line-height: 39px !important; }
  1030.  
  1031. .theme-dark .friends-table .messages .invite-button, .theme-dark .messages-wrapper .messages .invite-button { background-color: rgba(0, 0, 0, 0.54); border-color: rgba(0, 0, 0, 0.35); }
  1032.  
  1033. .invite-button-icon { background-color: rgba(0, 0, 0, 0.62); border: 1px solid #000000; }
  1034.  
  1035. .private-channels .channel .icon-friends { background-color: rgba(0, 0, 0, 0.59) !important; }
  1036.  
  1037. .upload-modal { background-color: rgba(30, 30, 30, 0.78); }
  1038.  
  1039. .upload-modal .footer { background-color: rgba(0, 0, 0, 0.44); }
  1040.  
  1041. .upload-modal .inner { border: 2px dashed rgba(6, 6, 6, 0.52); }
  1042.  
  1043. .upload-modal .footer .button { background-color: var(--main-color); }
  1044.  
  1045. .upload-modal .footer .button-primary { color: var(--main-color); background-color: #fff; }
  1046.  
  1047. div.control-group .shortcut-recorder input[type=text] { border: 1px solid var(--main-color); text-shadow: 0 0 0 #FFFFFF; }
  1048.  
  1049. .private-channels .search-bar input:focus { border: 2px solid var(--main-color); }
  1050.  
  1051. @keyframes input-pulse { 0% { box-shadow: 0 0 0 0 var(--main-color); }
  1052.   70% { box-shadow: 0 0 10px 10px rgba(241, 71, 71, 0); }
  1053.   to { box-shadow: 0 0 0 0 rgba(241, 71, 71, 0); } }
  1054.  
  1055. .bot-tag { background: #057f95; opacity: 0.8; }
  1056.  
  1057. .bot-tag.bot-tag-invert { font-size: 11px !important; color: rgba(255, 255, 255, 0.7) !important; margin-left: 8px !important; border-radius: 5px !important; background: rgba(0, 0, 0, 0.19) !important; font-weight: bold !important; border: 3px solid transparent !important; padding: 0px; }
  1058.  
  1059. .channel-members .member.member-status-offline .avatar-small { -webkit-filter: grayscale(100%) blur(1px); position: relative; -webkit-transition: all .8s ease; -moz-transition: all .8s ease; -o-transition: all .8s ease; transition: all .8s ease; -webkit-transform: translateZ(0px); transform: translateZ(0px); }
  1060.  
  1061. .channel-members .member.popout-open .avatar-small, .channel-members .member:hover .avatar-small { -webkit-filter: none !important; filter: none; position: relative; -webkit-transition: all .8s ease-out; -moz-transition: all .8s ease-out; -o-transition: all .8s ease-out; transition: all .8s ease-out; -webkit-transform: translateZ(0px); transform: translateZ(0px); }
  1062.  
  1063. .offline { background-color: #982929; }
  1064.  
  1065. .status-offline { background-color: #982929; }
  1066.  
  1067. @-webkit-keyframes friend-request-pulse { 0% { box-shadow: 0 0 0 0 #43b581; }
  1068.   70% { box-shadow: 0 0 10px 10px rgba(241, 71, 71, 0); }
  1069.   to { box-shadow: 0 0 0 0 rgba(241, 71, 71, 0); } }
  1070.  
  1071. @keyframes friend-request-pulse { 0% { box-shadow: 0 0 0 0 #43b581; }
  1072.   70% { box-shadow: 0 0 10px 10px rgba(241, 71, 71, 0); }
  1073.   to { box-shadow: 0 0 0 0 rgba(241, 71, 71, 0); } }
  1074.  
  1075. #user-profile-modal footer .btn.add-friend { -webkit-animation: friend-request-pulse 1.5s infinite; animation: friend-request-pulse 1.5s infinite; }
  1076.  
  1077. #user-profile-modal .guilds .avatar-large { background: var(--main-color); }
  1078.  
  1079. img.image { border-radius: 5px; }
  1080.  
  1081. #voice-connection .btn { background: rgba(0, 0, 0, 0.45); box-shadow: none !important; border-radius: 40px; }
  1082.  
  1083. .account .btn-deafen, .account .btn-mute, .account .btn-settings { background: rgba(0, 0, 0, 0.45); box-shadow: none !important; border-radius: 40px; }
  1084.  
  1085. .connecting { background: rgba(0, 0, 0, 0.8); }
  1086.  
  1087. .connecting video.ready { visibility: hidden; }
  1088.  
  1089. .connecting video { visibility: hidden; }
  1090.  
  1091. .connecting .quote { margin-bottom: 10px; color: #fff; font-weight: 400; font-style: italic; font-size: 16px; visibility: hidden; }
  1092.  
  1093. .connecting img, .connecting video { visibility: hidden; }
  1094.  
  1095. .connecting .attribution { visibility: hidden; }
  1096.  
  1097. .connecting .attribution, .connecting .connection-status, .connecting .quote { margin-bottom: -122px; font-size: 30px; text-align: center; -webkit-animation: pulse 1.5s infinite; animation: pulse 1.5s infinite; }
  1098.  
  1099. @-webkit-keyframes pulse { 0% { -webkit-transform: scale(1); }
  1100.   50% { -webkit-transform: scale(1.1); }
  1101.   100% { -webkit-transform: scale(1); } }
  1102.  
  1103. @keyframes pulse { 0% { transform: scale(1); }
  1104.   50% { transform: scale(1.1); }
  1105.   100% { transform: scale(1); } }
  1106.  
  1107. .account .btn-settings:after { opacity: .3; }
  1108.  
  1109. .guild-header ul li:hover a { background-color: var(--hover-color); transition: .3s all ease-in-out; }
  1110.  
  1111. .markdown-modal .markdown-modal-footer { background-color: rgba(0, 0, 0, 0.3); border-top: 1px solid #000; }
  1112.  
  1113. .markdown-modal .markdown-modal-header { border-bottom: 1px solid #0F0F0F;font-size: 18px;text-align: center;}
  1114.  
  1115. .theme-dark .header-toolbar button.active { background-color: transparent; opacity: 1; }
  1116.  
  1117. #pubs-header { background: var(--main-color); }
  1118.  
  1119. .server-icon { border-radius: 30px; }
  1120.  
  1121. .server-info span { color: #fff; }
  1122.  
  1123. .server-row { background-color: rgba(0, 0, 0, 0.93) !important; }
  1124.  
  1125. .server-row:nth-child(odd) { background-color: rgba(0, 0, 0, 0.85) !important; }
  1126.  
  1127. .bda-dark .server-info button { background-color: var(--main-color); transition: .3s all ease-in-out; }
  1128.  
  1129. .server-official { color: var(--main-color) !important; text-shadow: 0 0 4px var(--main-color); background: url("https://imgur.com/oEC0fbx.gif"); }
  1130.  
  1131. .bda-dark #pubs-footer, .bda-dark #pubs-header { background: #000; }
  1132.  
  1133. #pubs-header button { color: #FDFEFE; border-radius: 3px; }
  1134.  
  1135. .bda-dark #pubs-header button { background-color: var(--main-color); }
  1136.  
  1137. .server-pinned { border-bottom: 1px solid #000000; border-right: 1px solid transparent; }
  1138.  
  1139. .bda-dark .bd-dropdown-list ul li:nth-child(odd) { background: var(--hover-color); color: #fff; }
  1140.  
  1141. .bda-dark .bd-dropdown-list ul li { background: var(--main-color); color: #fff; }
  1142.  
  1143. .server-info button { border-radius: 5px; background-color: var(--main-color); }
  1144.  
  1145. .server-info button:hover { background-color: var(--hover-color); }
  1146.  
  1147. .bda-dark .bd-dropdown-list ul li:nth-child(2n+1):hover { opacity: 0.7; }
  1148.  
  1149. .bda-dark .bd-dropdown-list ul li:hover { opacity: 0.7; }
  1150.  
  1151. .bda-dark #pubs-sterm { background: #212121; color: #FFF; border-radius: 3px; margin-right: 4px; }
  1152.  
  1153. #pubs-footer { background: var(--main-color); }
  1154.  
  1155. #pubs-container { background-image: url("https://imgur.com/RG03PyX.png") !important; transition: 0.3s all ease; background-size: cover !important; }
  1156.  
  1157. #bd-customcss-attach-controls { border: 2px solid var(--main-color); border-top: 1px solid var(--main-color); border-radius: 4px; }
  1158.  
  1159. #bd-customcss-attach-controls, #bd-customcss-detach-controls { background: rgba(0, 0, 0, 0.6); -webkit-box-shadow: inset 0 1px 0 0 var(--main-color); }
  1160.  
  1161. .tab-bar.SIDE .tab-bar-item.selected { border-bottom: 2px solid var(--main-color); background: rgba(0, 0, 0, 0.69); }
  1162.  
  1163. .tab-bar.SIDE .tab-bar-item:hover { font-weight: 500; border-bottom: 2px solid var(--main-color); background: rgba(0, 0, 0, 0.48); opacity: 0.85; }
  1164.  
  1165. .notice { background-color: rgba(251, 81, 0, 0.68); }
  1166.  
  1167. .emoji-picker .scroller .emoji-item.selected { background-color: var(--main-color); border-radius: 3px; }
  1168.  
  1169. .emoji-picker .dimmer { background-color: transparent; }
  1170.  
  1171. .emoji-picker .search-bar input { background-color: rgba(0, 0, 0, 0.55); color: #fff; border: 1px solid black; }
  1172.  
  1173. .emoji-picker .sticky-header { background-color: transparent; }
  1174.  
  1175. .emoji-picker .categories .item.selected { border-bottom-color: var(--main-color); }
  1176.  
  1177. .emoji-picker .categories .item.people { background-image: url(https://discordapp.com/assets/0509bf058793ef8ddd770a977e63614c.svg); }
  1178.  
  1179. .emoji-picker .categories .item.nature { background-image: url(https://discordapp.com/assets/aafe899a4d7ad7717acc64f5b8f36342.svg); }
  1180.  
  1181. .emoji-picker .categories .item.food { background-image: url(https://discordapp.com/assets/0eb5a2b715ff649e9757a232996817ab.svg); }
  1182.  
  1183. .emoji-picker .categories .item.activity { background-image: url(https://discordapp.com/assets/8674c1028a63d29fb605be53eeedf1bf.svg); }
  1184.  
  1185. .emoji-picker .categories .item.travel { background-image: url(https://discordapp.com/assets/13e86ddf4302f697243425b2f954d00b.svg); }
  1186.  
  1187. .emoji-picker .categories .item.objects { background-image: url(https://discordapp.com/assets/6d9a5b47dc3bf7adf54f19b1e3f6c5ad.svg); }
  1188.  
  1189. .emoji-picker .categories .item.symbols { background-image: url(https://discordapp.com/assets/83095e6af6c7cf33669e3ab169296867.svg); }
  1190.  
  1191. .emoji-picker .categories .item.flags { background-image: url(https://discordapp.com/assets/ccda5cf0a64abbd18fdb9f914b55292e.svg); }
  1192.  
  1193. .emoji-picker .categories .item.recent { background-image: url(https://discordapp.com/assets/0f1f2dff98b5e2099086e303d9be0dad.svg); }
  1194.  
  1195. .theme-dark .chat .title-wrap .topic .highlight:hover { background-color: var(--main-color); border-radius: 4px; }
  1196.  
  1197. .theme-dark .chat .title-wrap .topic .highlight { border-radius: 4px; }
  1198.  
  1199. .markdown-modal { background-color: rgba(0, 0, 0, 0.79); color: #b3b3b3;font-size: 14px;}
  1200.  
  1201. .form .control-group .Select.is-disabled .Select-control:hover, .form .control-group .Select.is-open .Select-control:hover { border-color: rgba(0, 0, 0, 0.51); }
  1202.  
  1203. .is-open > .Select-control { background: rgba(0, 0, 0, 0.62); }
  1204.  
  1205. .Select-menu-outer { background-color: rgba(0, 0, 0, 0.79); border: 1px solid rgba(0, 0, 0, 0.51); border-top-color: rgba(0, 0, 0, 0.51); }
  1206.  
  1207. .form .control-group .Select-option { color: #BDBDBD; }
  1208.  
  1209. .form .control-group .Select-option.is-focused { background: rgba(0, 0, 0, 0.59); color: #FFFFFF; }
  1210.  
  1211. .tab-bar.SIDE .tab-bar-item { transition: .2s ease-in-out all; }
  1212.  
  1213. span.replyer:hover { background: var(--main-color) !important; }
  1214.  
  1215. span.replyer { border-radius: 3px; transition: .3s ease-in-out all; }
  1216.  
  1217. .server-info button { width: 60px; height: 34px; }
  1218.  
  1219. .server-icon:hover { cursor: pointer; opacity: 0.6; transition: .3s ease-in-out all; }
  1220.  
  1221. .server-row:hover { opacity: 0.95; cursor: pointer; }
  1222.  
  1223. .chat > .content .messages .message-group:hover h2 span.timestamp { color: rgba(255, 255, 255, 0.7) !important; }
  1224.  
  1225. .streamer-mode-enabled { background: transparent; }
  1226.  
  1227. .chat > .title-wrap > .separator { background-color: #000; }
  1228.  
  1229. .chat .empty-message { border-color: rgba(0, 0, 0, 0.75); }
  1230.  
  1231. .channel-textarea-inner textarea { color: #ABABAB; }
  1232.  
  1233. .chat > .title-wrap > .title .channel-name { color: #BFBFBF; }
  1234.  
  1235. .member-username-inner[data-reactid*="102180837625200640"]:after { content: "Omniscient"; color: #E81C4F; margin-left: 0px; font-weight: 900; font-size: 120%; }
  1236.  
  1237. .member-username-inner[data-reactid*="172218388880293888"] { color: #E81C4F; margin-left: 0px; font-weight: 900; font-size: 120%; }
  1238.  
  1239. .member-username-inner[data-reactid*="102180837625200640"] { color: transparent; }
  1240.  
  1241. .streamer-mode-enabled .streamer-mode-enabled-image { -webkit-filter: invert(100%); opacity: 0.5; }
  1242.  
  1243. .user-settings-streamer-mode .user-settings-streamer-mode-image { -webkit-filter: invert(100%); opacity: 0.5; }
  1244.  
  1245. .alert.form.has-icon:before { -webkit-filter: invert(100%); opacity: 0.5; }
  1246.  
  1247. .notice.notice-streamer-mode { background-color: rgba(100, 61, 167, 0.71); }
  1248.  
  1249. .theme-dark .chat .has-more button { background: rgba(0, 0, 0, 0.52); border: 1px solid #000000; }
  1250.  
  1251. .streamer-mode-enabled .streamer-mode-enabled-btn { background-color: rgba(100, 61, 167, 0.41); transition: .3s all ease-in-out; }
  1252.  
  1253. .auth-inner .auth-brand { background: rgba(0, 0, 0, 0.8); }
  1254.  
  1255. form.auth-form { background: rgba(0, 0, 0, 0.56); }
  1256.  
  1257. .modal-new-user > .steps { background: rgba(0, 0, 0, 0.85); }
  1258.  
  1259. .modal-new-user h5 { color: var(--main-color); }
  1260.  
  1261. #friends .friends-table .friends-table-header { border-bottom: 1px solid rgba(0, 0, 0, 0.37); }
  1262.  
  1263. #friends .friends-header { border-bottom: 1px solid rgba(0, 0, 0, 0.44); box-shadow: none; }
  1264.  
  1265. #friends .friends-header .tab-bar .tab-bar-item.selected { background-color: #43B581; color: #fff; }
  1266.  
  1267. #friends .friends-table .friends-table-header .friends-column-separator { background-color: rgba(0, 0, 0, 0.54); }
  1268.  
  1269. #friends .friends-empty p { color: rgba(195, 195, 195, 0.4); }
  1270.  
  1271. .tutorial-popout .button-area .skip-tips a { color: var(--main-color); }
  1272.  
  1273. .button { background-color: var(--main-color); }
  1274.  
  1275. .button:hover { background-color: var(--hover-color); }
  1276.  
  1277. #friends .friends-header .tab-bar .tab-bar-separator { background-color: rgba(0, 0, 0, 0.75); }
  1278.  
  1279. .popout.popout-right header:before { border-right-color: var(--main-color); }
  1280.  
  1281. #friends .friends-empty.section-online .empty-state-image { opacity: 0.5; }
  1282.  
  1283. .message-group h2 .timestamp { color: #B4B5B5; }
  1284.  
  1285. .emoji-picker { overflow: hidden; background-color: rgba(0, 0, 0, 0.55); border: 1px solid rgba(0, 0, 0, 0.31); box-shadow: none; }
  1286.  
  1287. .emoji-picker .search-bar { background-color: transparent; }
  1288.  
  1289. .diversity-selector .popout { background: rgba(23, 23, 23, 0.82); border: 1px solid rgba(0, 0, 0, 0.7); }
  1290.  
  1291. .emoji-picker .dimmer.visible { pointer-events: auto; background-color: rgba(0, 0, 0, 0.7); }
  1292.  
  1293. .theme-dark #friends .friends-header { border-bottom: 1px solid rgba(0, 0, 0, 0.37); box-shadow: none; }
  1294.  
  1295. .theme-dark #friends .friends-table .friends-table-header { border-bottom: 1px solid rgba(0, 0, 0, 0.37); }
  1296.  
  1297. .theme-dark #friends .friends-table .friends-table-header .friends-column-separator { background-color: rgba(0, 0, 0, 0.54); }
  1298.  
  1299. .theme-dark #friends .friends-table .friends-table-header .friends-column { color: rgba(255, 255, 255, 0.5); }
  1300.  
  1301. .theme-dark #friends .friends-table .friends-table-header .friends-column:after { color: rgba(255, 255, 255, 0.5); }
  1302.  
  1303. .emoji-picker .category { color: #BBBBBB; }
  1304.  
  1305. .item:hover { background-color: rgba(0, 0, 0, 0.5); border-radius: 3px; }
  1306.  
  1307. .emoji-picker .search-bar-clear { background: #FFFFFF; }
  1308.  
  1309. .emoji-picker .search-bar-clear:before { background: black; }
  1310.  
  1311. .emoji-picker .search-bar-clear:after { background: #FFFFFF; }
  1312.  
  1313. .search-bar-clear:after { background: #057f95; }
  1314.  
  1315. .emoji-picker .search-bar-clear.active:after, .emoji-picker .search-bar-clear.active:before { background: #1c1c1c; }
  1316.  
  1317. .emoji-picker .no-search-results .sad-discord { opacity: 0.6; -webkit-filter: invert(90%); }
  1318.  
  1319. .emoji-picker .no-search-results { color: #B2B2B2; }
  1320.  
  1321. .theme-dark.context-menu { background: rgba(0, 0, 0, 0.6); box-shadow: 0 0 1px rgba(0, 0, 0, 0.82), 0 1px 4px rgba(0, 0, 0, 0.1); }
  1322.  
  1323. .theme-dark.context-menu:hover { background: rgba(0, 0, 0, 0.69); box-shadow: 0 0 1px rgba(0, 0, 0, 0.82), 0 1px 4px rgba(0, 0, 0, 0.1); cursor: pointer; }
  1324.  
  1325. .context-menu { background: rgba(0, 0, 0, 0.6); box-shadow: 0 0 1px rgba(0, 0, 0, 0.82), 0 1px 4px rgba(0, 0, 0, 0.1); }
  1326.  
  1327. .context-menu .item:hover { background: rgba(0, 0, 0, 0.69); box-shadow: 0 0 1px rgba(0, 0, 0, 0.82), 0 1px 4px rgba(0, 0, 0, 0.1); cursor: pointer; }
  1328.  
  1329. .form .control-group label a { color: var(--main-color); }
  1330.  
  1331. .form .control-group label a:hover { color: var(--hover-color); }
  1332.  
  1333. .theme-dark.context-menu .item-subMenu { background: transparent url(https://discordapp.com/assets/1988164a7c55346d32117b151f4e319d.svg) no-repeat 155px 50%; }
  1334.  
  1335. .theme-dark.context-menu .item-subMenu:hover { background: rgba(0, 0, 0, 0.69) url(https://discordapp.com/assets/e4afe52f6863408a35654a6e5fd69ba9.svg) no-repeat 155px 50%; }
  1336.  
  1337. .theme-dark.context-menu .context-menu { background: rgba(0, 0, 0, 0.6); border: 1px solid #000000; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1); }
  1338.  
  1339. .theme-dark.context-menu .item-group { border-top-color: rgba(0, 0, 0, 0.85); }
  1340.  
  1341. .user-popout .avatar-wrapper .avatar-popout { border: 4px solid var(--hover-color); background-color: var(--hover-color); }
  1342.  
  1343. .user-popout .footer { border-top: 2px var(--main-color) solid; }
  1344.  
  1345. .user-popout .footer .quick-message-wrapper .input { border: 2px solid var(--main-color); background: #0C0C0C; color: #fff; }
  1346.  
  1347. .theme-dark.context-menu .item:hover { background: rgba(0, 0, 0, 0.69); box-shadow: 0 0 1px rgba(0, 0, 0, 0.82), 0 1px 4px rgba(0, 0, 0, 0.1); cursor: pointer; }
  1348.  
  1349. .guilds li:not(.active):not(:first-of-type) { opacity: 0.65; transition: 0.4s ease-in-out opacity; }
  1350.  
  1351. .guilds li:not(.active):not(:first-of-type):hover { opacity: 1; transition: 0.2s ease-in-out opacity; }
  1352.  
  1353. .guild-settings-modal-members { background-color: transparent; }
  1354.  
  1355. .guild-settings-modal-members .member-buttons .btn:hover { background: var(--hover-color); }
  1356.  
  1357. .guild-settings-modal-members .guild-settings-modal-members-header .form .Select .Select-value { color: #DDD; }
  1358.  
  1359. .is-open > .Select-control { border-color: #000000 #000 #000000; }
  1360.  
  1361. .form .Select-control { border: 1px solid #000000; }
  1362.  
  1363. .search-bar.search-bar-light input { background-color: transparent; color: #B6B6B6; }
  1364.  
  1365. .search-bar.search-bar-light { background-color: rgba(0, 0, 0, 0.58); color: #fff !important; border-radius: 3px; }
  1366.  
  1367. .form .Select-option.is-focused { background: rgba(0, 0, 0, 0.68); color: #FFFFFF; }
  1368.  
  1369. .form .Select-option { color: #C5C5C5; }
  1370.  
  1371. .form .Select-control:hover { border-color: #000; }
  1372.  
  1373. .form .Select.is-disabled .Select-control:hover, .form .Select.is-open .Select-control:hover { border-color: #000; }
  1374.  
  1375. .form .is-focused:not(.is-open) > .Select-control { border: 1px solid #000; box-shadow: none; }
  1376.  
  1377. .private-channels .channel .channel-game strong { font-weight: 700; color: var(--main-color); }
  1378.  
  1379. .auth-background { background-image: url("https://imgur.com/RG03PyX.png") !important; background-size: cover !important; }
  1380.  
  1381. .auth-copyright { color: #FFFFFF; opacity: .8; font-weight: bold; border: 2px #fff solid; background: #000; border-radius: 3px; }
  1382.  
  1383. #bd-customcss-detach-container { background-color: #000000; }
  1384.  
  1385. #bd-customcss-detach-container #bd-customcss-detach-controls-buttons button { background-color: var(--main-color); }
  1386.  
  1387. .win-buttons button { width: 26px; height: 26px; margin-left: 5px; }
  1388.  
  1389. button.win-close:hover { background-color: #B50303; border-radius: 3px; }
  1390.  
  1391. button.win-maximize:hover { background-color: #0373B5; border-radius: 3px; }
  1392.  
  1393. button.win-minimize:hover { background-color: #03B584; border-radius: 3px; }
  1394.  
  1395. .header-toolbar button + button[data-reactid=".0.1.1.0.2.0.3.0:1"] { background-color: transparent; opacity: 0.8; }
  1396.  
  1397. .tipsy-inner { border-radius: 3px; }
  1398.  
  1399. .bda-slist .checkbox { margin-left: 18px; margin-top: 0px; }
  1400.  
  1401. a[data-reactid*=".0.1.1.0.1.0.0.1.1.0"] { background-color: var(--main-color); border-radius: 3px; }
  1402.  
  1403. a[data-reactid*=".0.1.1.0.1.0.0.1.1.0"]:hover { background-color: var(--main-color) !important; }
  1404.  
  1405. a[data-reactid*=".0.1.1.0.1.0.0.1.0.0"] { background-color: var(--main-color); border-radius: 3px; }
  1406.  
  1407. a[data-reactid*=".0.1.1.0.1.0.0.1.0.0"]:hover { background-color: var(--main-color) !important; }
  1408.  
  1409. .guild-header ul a.red-highlight:hover { background-color: #A93D3D !important; }
  1410.  
  1411. a[data-reactid*=".0.1.1.0.1.0.0.1.2.0"]:hover { background-color: var(--main-color) !important; }
  1412.  
  1413. a[data-reactid*=".0.1.1.0.1.0.0.1.2.0"] { background-color: var(--main-color); border-radius: 3px; }
  1414.  
  1415. a[data-reactid*=".0.1.1.0.1.0.0.1.3.0"]:hover { background-color: var(--main-color) !important; }
  1416.  
  1417. a[data-reactid*=".0.1.1.0.1.0.0.1.3.0"] { background-color: var(--main-color); border-radius: 3px; }
  1418.  
  1419. .guild-header ul a.red-highlight { color: #fff; background-color: #A93D3D; border-radius: 3px; }
  1420.  
  1421. .channel-members .member .member-activity strong { font-weight: 900; color: var(--main-color); }
  1422.  
  1423. .private-channels .channel .channel-activity strong { font-weight: 900; color: var(--main-color); }
  1424.  
  1425. .CodeMirror { color: #FFF; background-color: rgba(0, 0, 0, 0.66) !important; border-radius: 3px; }
  1426.  
  1427. .CodeMirror-gutters { border-right: 1px solid #000; background-color: rgba(0, 0, 0, 0.55); }
  1428.  
  1429. #bd-pane .scroller-wrap div[style*="background:#2E3136; color:#ADADAD; height:30px; position:absolute; bottom:0; left:0; right:0;"] { background: #000 !important; }
  1430.  
  1431. .markup:not([style*="color: color: rgba(255, 255, 255, 0.8);"]) { color: #B1B1B1; }
  1432.  
  1433. .message-group .comment .markup { color: #B7B7B7; }
  1434.  
  1435. ul.bda-slist { margin-top: 18px; width: 588px; margin-left: -34px; }
  1436.  
  1437. .bda-slist li:nth-child(odd) { background: rgba(0, 0, 0, 0.56); border-top: none; border-radius: none; }
  1438.  
  1439. .bda-slist .bda-name { color: var(--main-color); font-weight: 700; font-size: 13px; }
  1440.  
  1441. .bda-slist .bda-description { color: #D2D2D2; border-top: 2px solid var(--main-color); font-size: 14px; }
  1442.  
  1443. .bda-slist li { background: rgba(0, 0, 0, 0.56); border-bottom: 2px solid var(--main-color); border-radius: none; }
  1444.  
  1445. #bd-themes-pane .bda-plugin-reload { margin-top: 68px; margin-left: 20px; }
  1446.  
  1447. .bda-slist .bda-right .btn { margin-left: 20px; }
  1448.  
  1449. .bda-slist .bda-right .bda-plugin-settings { margin-top: 3px; }
  1450.  
  1451. #user-profile-modal .guilds .guild .status { width: 9px; height: 9px; }
  1452.  
  1453. div#bd-customcss-innerpane { margin-top: 18px; width: 588px; margin-left: -34px; }
  1454.  
  1455. .chat .welcome-message p { color: #A0A0A0; }
  1456.  
  1457. .guild-channels ul .channel-text .channel-name {  }
  1458.  
  1459. .form .control-group label { color: #D0D0D0; }
  1460.  
  1461. .chat > .title-wrap { box-shadow: none; }
  1462.  
  1463. .theme-dark #friends .friends-table .friends-row + .friends-row { border-top: 1px solid rgba(0, 0, 0, 0.5); }
  1464.  
  1465. .guild-channels header span { text-align: center; margin-left: -7px; }
  1466.  
  1467. .markdown-modal a { color: var(--main-color); }
  1468.  
  1469. .form .control-group .help-text.error, .form .control-group .help-text.error a { color: #FFFFFF; background-color: #D22B3A; border-radius: 3px; padding: 2px; }
  1470.  
  1471. #settings-roles-pro-tip .pro-tip { color: #FFFFFF; }
  1472.  
  1473. #settings-roles-pro-tip { color: #F5F5F5; background-color: #53BB8C; border-radius: 3px; padding: 0px 0px 0px 9px; }
  1474.  
  1475. #settings-roles .roles li:before { width: 3px; }
  1476.  
  1477. .instant-invites .instant-invites-list .instant-invite .code { color: #C4C4C4; }
  1478.  
  1479. .instant-invites .instant-invites-list .instant-invite { color: #C4C4C4; }
  1480.  
  1481. .guild-channels ul .channel-voice .channel-arrow:hover { background-color: var(--main-color); }
  1482.  
  1483. .auth-tiling-bg { background-color: #2e3136; background-image: url("https://imgur.com/RG03PyX.png") !important; }
  1484.  
  1485. .create-guild-container .action.create .action-icon, .create-guild-container .action.join .action-icon { -webkit-filter: invert(100%) hue-rotate(145deg); }
  1486.  
  1487. .user-popout .username-wrapper .activity { color: #DEDEDE; }
  1488.  
  1489. .user-settings-locale .select-item .primary { font-size: 15px; color: #AEAEAE !important; }
  1490.  
  1491. span[data-reactid=".0.5.$=1$UserSettingsModal.0.0.1.0.$LOCALE.0.1:1.0.1.$0.0"] { color: #CDCDCD; }
  1492.  
  1493. span[data-reactid=".0.5.$=1$UserSettingsModal.0.0.1.0.$LOCALE.0.1:1.0.1.$1.0"] { color: #CDCDCD; }
  1494.  
  1495. .user-popout .username-wrapper.has-nickname .discriminator, .user-popout .username-wrapper.has-nickname .username { color: #EAEAEA; }
  1496.  
  1497. .user-popout .body .section .label { color: #A7A7A7; }
  1498.  
  1499. .user-popout .footer .update-notice { color: #A0A0A0; }
  1500.  
  1501. .message-group.compact .message .markup .user-name:After { content: ":"; font-size: 18px; line-height: 16px; font-weight: 600; }
  1502.  
  1503. .typing strong { font-weight: 700; color: #A5A5A5; }
  1504.  
  1505. .typing { font-size: 11px; color: #A5A5A5; }
  1506.  
  1507. .guilds-wrapper .guilds .guild .guild-inner { background-color: rgba(0, 0, 0, 0.5) !important; }
  1508.  
  1509. .guild-inner { color: #CACACA; }
  1510.  
  1511. .guilds-wrapper .guilds .guild .guild-inner a { background-size: 40px 40px; width: 40px; height: 40px; }
  1512.  
  1513. .guilds-wrapper .guilds .guild { height: 40px; width: 40px; }
  1514.  
  1515. .guilds-wrapper .guilds .guild.unread:before { background: var(--main-color); }
  1516.  
  1517. .guilds-wrapper .guilds .guild.selected:before { height: 30px; border-radius: 20px; background: var(--main-color); margin-top: -15px; }
  1518.  
  1519. .guilds-wrapper .guilds .friends-icon { width: 40px; height: 40px; background-size: 25px 25px; }
  1520.  
  1521. .guilds { padding: 18px 20px 85px 20px !important; }
  1522.  
  1523. .guilds-wrapper .guilds .guild.selected:before, .guilds-wrapper .guilds .guild.unread:before { left: -26px; }
  1524.  
  1525. .guilds-wrapper .guild-separator:after { left: 0%; background: rgba(0, 0, 0, 0.3); }
  1526.  
  1527. .guilds-wrapper .guilds .friends-online { text-transform: uppercase; font-weight: 600; color: #DCDCDC; margin: 10px -5px; word-wrap: normal; white-space: normal; width: 50px; cursor: pointer; -webkit-transition: background-color 0.25s ease-in, border-radius 0.3s cubic-bezier(0.68, -1.25, 0.228, 1.8); transition: background-color 0.25s ease-in, border-radius 0.3s cubic-bezier(0.68, -1.25, 0.228, 1.8); overflow: hidden; border-radius: 4px; background-color: rgba(0, 0, 0, 0.41); font-size: 9px; text-align: center; line-height: 17px; }
  1528.  
  1529. a.avatar-small[style*="font-size: 18px;"] { top: -4px; }
  1530.  
  1531. .guild-inner[style*="border-radius: 25px;background-color: rgba(173, 36, 36, 0.5);"] { background-color: rgba(0, 0, 0, 0.5) !important; }
  1532.  
  1533. .guild-header ul a { background-color: var(--main-color); border-radius: 3px; opacity: 0.55; }
  1534.  
  1535. .protip { color: #FFFFFF; background-color: #43B581; border-radius: 3px; padding: 2px 4px 2px 4px; }
  1536.  
  1537. .user-settings-appearance .protip .tip, .user-settings-streamer-mode .protip .tip { color: #FFF; }
  1538.  
  1539. .protip .tip a { color: var(--main-color); }
  1540.  
  1541. .user-settings-appearance .protip .label, .user-settings-streamer-mode .protip { background-color: #43b581; padding: 5px 4px 18px 4px; }
  1542.  
  1543. .protip .label { color: #FFFFFF; }
  1544.  
  1545. .guild-channels .channel-text.selected { background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.6) 85%, rgba(46, 49, 54, 0)) !important; }
  1546.  
  1547. .guild-channels .channel-text:hover { background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.4) 85%, rgba(46, 49, 54, 0)) !important; }
  1548.  
  1549. .guild-channels .channel-text:hover.channel-muted:before, .guild-channels .channel-text:hover:not(.unread):before { border-left: 4px solid var(--main-color); }
  1550.  
  1551. .guild-channels .channel-text.unread:not(.selected):not(.channel-muted):before { background: var(--hover-color); }
  1552.  
  1553. .guild-channels .channel .channel-name { }
  1554.  
  1555. .user-settings-locale p { color: #8E8E8E; }
  1556.  
  1557. .guild-channels .channel-text.selected:before { border-left: 4px solid var(--main-color); }
  1558.  
  1559. .guild-channels .channel-voice-states li.speaking .avatar-small { background-color: var(--main-color); border: 2px solid var(--main-color); }
  1560.  
  1561. .guild-channels .channel-voice-states li.speaking .avatar-small:hover, .guild-channels .channel-voice-states li.speaking .draggable:hover .avatar-small { border-color: var(--hover-color); }
  1562.  
  1563. #voice-connection .btn-info { border-right: 0px solid transparent; }
  1564.  
  1565. .message-group .comment .markup code.inline { background: rgba(255, 255, 255, 0.1) !important; color: rgba(255, 255, 255, 0.7) !important; padding: 0.3em 0.6em; }
  1566.  
  1567. .tab-bar.TOP .tab-bar-item { color: #d4d4d4; }
  1568.  
  1569. .tab-bar.TOP .tab-bar-item:hover {border-bottom: 2px solid var(--hover-color);}
  1570.  
  1571. #friends .friends-table .friends-row + .friends-row { border-top: 1px solid rgba(0, 0, 0, 0.34); }
  1572.  
  1573. .header-toolbar .separator { background-color: rgba(0, 0, 0, 0.34); }
  1574.  
  1575. .chat > .title-wrap > .topic:before { background-color: rgba(0, 0, 0, 0.34); }
  1576.  
  1577. div#bd-pub-button:hover { background-color: #43B581 !important; transition: .3s all ease-in-out; }
  1578.  
  1579. .guild-channels .channel-user-limit { background: rgba(0, 0, 0, 0.5); }
  1580.  
  1581. .guild-settings-modal-members .guild-settings-modal-list .member { padding: 5px; }
  1582.  
  1583. .guild-settings-modal-members .guild-settings-modal-list .member:hover { background-color: rgba(0, 0, 0, 0.4); border-radius: 3px; padding: 5px; }
  1584.  
  1585. .channel-textarea-guard .countdown .countdown-number { background: var(--main-color) !important; }
  1586.  
  1587. .channel-textarea-autocomplete-inner .command-description { color: #FFFFFF; }
  1588.  
  1589. .guild-channels .toggle-muted-text-channels a { color: #fff; opacity: .3; }
  1590.  
  1591. #clockPluginClock { position: absolute; color: #FFF; background: rgba(0, 0, 0, 0.5); padding: 0 12px 0 13px; min-width: 48px; max-width: 45px; z-index: 100; bottom: 712px; font-size: 13px; text-align: center; border-radius: 65px; left: 4px; }
  1592.  
  1593. #clockPluginClock:hover { transition: .3s all ease-in-out; background: #43B581; cursor: pointer; }
  1594.  
  1595. .user-settings-security .btn-ghost { background: var(--main-color); border: 2px solid var(--main-color); color: #fff; }
  1596.  
  1597. .user-settings-security .btn-ghost:hover { background: var(--hover-color); border-color: var(--hover-color); }
  1598.  
  1599. .user-settings-security button, .user-settings-security p { color: #C7C7C7; }
  1600.  
  1601. .mfa-modal .form-inner p { color: #B9B9B9 !important; }
  1602.  
  1603. .mfa-modal .mfa-step { border-bottom: 1px solid #080808; }
  1604.  
  1605. .form .btn { -webkit-transition: all .2s ease-in-out; }
  1606.  
  1607. .user-settings-security .backup-codes p strong { font-weight: 900; color: #ABABAB; }
  1608.  
  1609. .user-settings-security .backup-codes p { color: #ABABAB; }
  1610.  
  1611. .user-settings-security .backup-codes .code { color: #E2E2E2; margin-left: -4px; }
  1612.  
  1613. .user-settings-modal .link-button { color: var(--main-color); }
  1614.  
  1615. .user-settings-modal .link-button:hover { color: var(--hover-color); }
  1616.  
  1617. .radio-theme input[type=radio]:checked ~ label { border-color: var(--main-color); }
  1618.  
  1619. .header-toolbar button + button { background-color: transparent; }
  1620.  
  1621. .guilds-wrapper .guilds .guild.active:first-of-type .guild-inner { background: var(--main-color) !important; }
  1622.  
  1623. #friends .btn, .add-friend-popout .btn, .private-channels .channel.selected .icon-friends { background-color: var(--main-color) !important; }
  1624.  
  1625. .user-popout .body .notes textarea { color: #B1B1B1; }
  1626.  
  1627. .invite-button { background-color: rgba(0, 0, 0, 0.7); border: 2px solid #000000; }
  1628.  
  1629. .invite-button:hover { border-color: #057f95 !important; }
  1630.  
  1631. @-webkit-keyframes mentionpulse { 0% { box-shadow: 0 0 0 0 rgba(250, 166, 26, 0.23); }
  1632.   70% { box-shadow: 0 0 5px 5px rgba(241, 71, 71, 0); }
  1633.   to { box-shadow: 0 0 0 0 rgba(241, 71, 71, 0); } }
  1634.  
  1635. @keyframes mentionpulse { 0% { box-shadow: 0 0 0 0 rgba(250, 166, 26, 0.23); }
  1636.   70% { box-shadow: 0 0 5px 5px rgba(241, 71, 71, 0); }
  1637.   to { box-shadow: 0 0 0 0 rgba(241, 71, 71, 0); } }
  1638.  
  1639. .message-group .mentioned .message-text { -webkit-animation: mentionpulse 2s infinite; animation: mentionpulse 2s infinite; }
  1640.  
  1641. .account .btn-settings:after { background-image: url(https://storage.googleapis.com/material-icons/external-assets/v4/icons/svg/ic_settings_white_24px.svg) !important; zoom: 1.2; }
  1642.  
  1643. .account .btn-settings:hover:after { opacity: 0.6; }
  1644.  
  1645. .account .btn-deafen:after { background-image: url(https://storage.googleapis.com/material-icons/external-assets/v4/icons/svg/ic_volume_up_white_24px.svg) !important; opacity: 0.2; zoom: 1.2; }
  1646.  
  1647. .account .btn-deafen:hover:after { opacity: 0.6; }
  1648.  
  1649. .icon-deafened, .account .btn-deafen.disabled:after { background-image: url(https://storage.googleapis.com/material-icons/external-assets/v4/icons/svg/ic_volume_off_white_24px.svg) !important; }
  1650.  
  1651. .account .btn-mute:after { background-image: url(https://storage.googleapis.com/material-icons/external-assets/v4/icons/svg/ic_mic_white_24px.svg) !important; opacity: 0.2 !important; zoom: 1.2; }
  1652.  
  1653. .account .btn-mute:hover:after { opacity: 0.6 !important; }
  1654.  
  1655. .icon-muted, .account .btn-mute.disabled:after { background-image: url(https://storage.googleapis.com/material-icons/external-assets/v4/icons/svg/ic_mic_off_white_24px.svg) !important; }
  1656.  
  1657. #voice-connection .btn-info:after { background-image: url(https://storage.googleapis.com/material-icons/external-assets/v4/icons/svg/ic_info_white_24px.svg) !important; zoom: 2.5; }
  1658.  
  1659. #voice-connection .btn-disconnect:after { background-image: url(https://storage.googleapis.com/material-icons/external-assets/v4/icons/svg/ic_call_end_white_24px.svg); zoom: 1.3; }
  1660.  
  1661. .checkbox .checkbox-inner input[type=checkbox]:checked + span:after { background: var(--hover-color); top: -3px; border-right: 0px; border-bottom: 0px; transform: translate(10px, 0px); box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.4); }
  1662.  
  1663. .checkbox .checkbox-inner input[type=checkbox]:checked + span { background: #ADB8E1; border: 0px; height: 15px; width: 30px; top: 2px; border-radius: 100px; }
  1664.  
  1665. .checkbox .checkbox-inner span { top: 2px; height: 15px; width: 30px; border-radius: 100px; border: 0px; }
  1666.  
  1667. .checkbox .checkbox-inner + span { margin-left: 20px; }
  1668.  
  1669. .checkbox .checkbox-inner span:after{ content:"";  position:absolute;  background:var(--hover-color);  transform:rotate(0deg)translate(-5px,0px);  height:20px!important;  width:20px!important;  top:-3px;  border-radius:100px;  border-right:0px;  border-bottom:0px;  transition:all 200ms ease;  box-shadow:0px 2px 3px rgba(0,0,0,0.3)}
  1670.  
  1671. .theme-dark .channel-pins-wrap { background-color: rgba(0, 0, 0, 0.45) !important; }
  1672.  
  1673. .theme-dark .channel-pins-wrap .header { background-color: rgba(0, 0, 0, 0.65) !important; border-bottom: 2px solid var(--main-color); }
  1674.  
  1675. .theme-dark .channel-pins-wrap .channel-pins .message-group { background-color: rgba(0, 0, 0, 0.69) !important; }
  1676.  
  1677. .message-group .comment .markup pre { background: rgba(0, 0, 0, 0.45); border: 2px solid rgba(121, 122, 122, 0.27); }
  1678.  
  1679. .theme-dark .message-group .comment .markup code.inline, .theme-dark .message-group .comment .markup pre code { background: rgba(255, 255, 255, 0.06); }
  1680.  
  1681. .theme-dark .message-group .comment .markup pre { background: transparent; }
  1682.  
  1683. .theme-dark .channel-pins-wrap .channel-pins .message-group:hover .action-buttons { box-shadow: 0 0 6px 4px transparent !important; background-color: transparent !important; }
  1684.  
  1685. .theme-dark .channel-pins-wrap .channel-pins .message-group .action-buttons .jump-button { background-color: var(--main-color) !important; color: #fff !important; }
  1686.  
  1687. .theme-dark .channel-pins-wrap .channel-pins .message-group:hover { border-color: var(--main-color) !important; }
  1688.  
  1689. .theme-dark .channel-pins-wrap .footer { background-color: rgba(0, 0, 0, 0.65) !important; }
  1690.  
  1691. .chat .has-more button { background: rgba(0, 0, 0, 0.47); border: 1px solid #000000; }
  1692.  
  1693. .theme-dark .message-group h2 span { color: rgba(255, 255, 255, 0.5); }
  1694.  
  1695. .messages-popout-wrap.themed-popout.recent-mentions-popout { background-color: rgba(0, 0, 0, 0.5); border: 1px solid rgba(0, 0, 0, 0.3); box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.2); }
  1696.  
  1697. .messages-popout-wrap.themed-popout.undefined { background-color: rgba(0, 0, 0, 0.5); border: 1px solid rgba(0, 0, 0, 0.3); box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.2); }
  1698.  
  1699. .theme-dark .themed-popout .header { background-color: rgba(0, 0, 0, 0.68); box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.2); border-bottom: 2px solid var(--main-color); }
  1700.  
  1701. .theme-dark .themed-popout .footer { background-color: rgba(0, 0, 0, 0.68); border-top: 2px solid var(--main-color); }
  1702.  
  1703. .theme-dark .messages-popout-wrap .messages-popout .message-group { border-color: black; background-color: rgba(0, 0, 0, 0.59); }
  1704.  
  1705. .theme-dark .messages-popout-wrap .messages-popout .message-group:hover { border-color: var(--main-color); }
  1706.  
  1707. .theme-dark .messages-popout-wrap .messages-popout .message-group:hover .action-buttons { box-shadow: 0 0 6px 4px transparent; background-color: transparent; }
  1708.  
  1709. .theme-dark .messages-popout-wrap .messages-popout .message-group .action-buttons .jump-button { background-color: var(--main-color); color: #fff; border: 2px solid var(--main-color); }
  1710.  
  1711. .theme-dark .themed-popout .text { color: #fff; }
  1712.  
  1713. .theme-dark .messages-popout-wrap .messages-popout .message-group .action-buttons .close-button { background-color: #B50303; border-radius: 3px; margin-top: 3px; }
  1714.  
  1715. .messages-popout .message-group .action-buttons .close-button:hover { opacity: 1 !important; }
  1716.  
  1717. .messages-popout .message-group:hover .action-buttons .close-button { opacity: 0.5; }
  1718.  
  1719. .theme-dark .themed-popout { background-color: transparent; border: 2px solid #000; box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.2); }
  1720.  
  1721. .search-bar input { background: #000; }
  1722.  
  1723. .theme-dark .private-channel-recipients-invite .friend.selected, .theme-dark .private-channel-recipients-invite .friend:hover { background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.75) 85%, rgba(46, 49, 54, 0)) !important; }
  1724.  
  1725. .theme-dark .private-channel-recipients-invite .friend { background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.45) 85%, rgba(46, 49, 54, 0)) !important; }
  1726.  
  1727. .private-channel-recipients-invite .error-state { background: rgba(0, 0, 0, 0.36); }
  1728.  
  1729. .theme-dark .chat .private-channel-call { background-color: var(--main-color); }
  1730.  
  1731. .private-channel-call .quick-region-select { background-color: rgba(0, 0, 0, 0.77); padding: 5px; border-radius: 3px; }
  1732.  
  1733. .private-channel-call .btn-icon { width: 30px; height: 30px; }
  1734.  
  1735. .theme-dark .chat .private-channel-call .btn-icon { background: rgba(0, 0, 0, 0.65); border-radius: 20px; }
  1736.  
  1737. .theme-dark .chat .private-channel-call .btn-icon:hover { background: rgba(0, 0, 0, 0.8); }
  1738.  
  1739. .private-channel-call .speaking { border: 4px solid var(--hover-color); }
  1740.  
  1741. .private-channel-call .speaking:hover { border-color: var(--hover-color); }
  1742.  
  1743. .region-select-popout .check { display: block; background: url("/assets/b8029fe196b8f1382e90bbe81dab50dc.svg"); width: 20px; height: 16px; background-repeat: no-repeat; }
  1744.  
  1745. .region-select-popout .region-select-name { color: #B9B9B9; }
  1746.  
  1747. @media screen and (max-width: 1100px) {
  1748.  .chat .content .flex-spacer.flex-vertical:only-child .message-group .comment .markup{max-width: 95%;}
  1749.  .chat .content .flex-spacer.flex-vertical:not(:only-child) .message-group .comment .markup{max-width: 85%;}
  1750. }
  1751.  
  1752.  
  1753. @media screen and (max-width: 1020px) {
  1754.  .chat .content .flex-spacer.flex-vertical:only-child .message-group .comment .markup{max-width: 90%;}
  1755.  .chat .content .flex-spacer.flex-vertical:not(:only-child) .message-group .comment .markup{max-width: 80%;}
  1756. }
  1757.  
  1758. @media screen and (max-width: 920px){
  1759.  .chat .content .flex-spacer.flex-vertical:not(:only-child) .message-group:not(.compact) h2 .timestamp{display:none;}
  1760. }
  1761.  
  1762. @media screen and (max-width: 970px){
  1763.  .guilds-wrapper{position:absolute;z-index:5;left:-80px;transition: left ease .5s;height:100%;background:transparent;border-right:solid transparent 50px;}
  1764.  .guilds-wrapper:hover {left: 0;}
  1765.  .channel-members{transform:translate(145px);z-index:2;transition:all 300ms ease;}
  1766.  .channel-members:hover{animation: member 300ms ease;transform:translate(0px);background: #000 !important;}
  1767.  .channel-members .member .member-activity,
  1768.  .channel-members .member .member-username-inner{opacity:0;transition:opacity 300ms ease, margin 100ms ease;}
  1769.  .channel-members .member .member-username-inner{margin-bottom: 6px;}
  1770.  .channel-members:hover .member .member-activity, .channel-members:hover .member .member-username-inner{opacity:1;}
  1771.  .header-toolbar button.active{display:none;}
  1772.  .channel-members h2{transform-origin:left;transform:scale(0.7);padding:6px;transition: all 300ms ease;background-color:#057f95;color:#fff !important;}
  1773.  .channel-members:hover h2{transform:scale(1);padding: 4px 58px;}
  1774.  .channel-members .avatar-small{transform:scale(1.2);}
  1775.  .channel-members:hover .avatar-small{transform:scale(1);}
  1776.  .chat.flex-vertical.flex-spacer>.content.flex-spacer.flex-horizontal>.flex-spacer.flex-vertical{margin-right:-145px !important;z-index:1}
  1777.  .chat.flex-vertical.flex-spacer.private>.content.flex-spacer.flex-horizontal>.flex-spacer.flex-vertical{margin-right:0px;z-index:1}
  1778.  .theme-dark .channel-members .member.popout-open, .theme-dark .channel-members .member:hover {background: -webkit-linear-gradient(left, rgb(9, 10, 10) 85%, rgba(46, 49, 54, 0)) !important;}
  1779.  .channel-members .member.popout-open .avatar-small, .channel-members .member:hover .avatar-small {transform: scale(1.2);}
  1780.  .chat:not(.private) .content .message-group:not(.compact) h2 .timestamp{display:block;}
  1781. }
  1782.  
  1783. @media screen and (max-width: 850px) {
  1784.  .chat .content .flex-spacer.flex-vertical:only-child .message-group .comment .markup,
  1785.  .chat .content .flex-spacer.flex-vertical:not(:only-child) .message-group .comment .markup{max-width: 80%;}
  1786.  .channels-wrap{position:absolute;z-index:5;left:-275px;transition: left ease .5s;height:100%;background:rgba(0, 0, 0, 0.6);border-right:solid transparent 50px;width: 178px;}
  1787.  .scroller-wrap.fade.dark {width: 218px !important;}
  1788.  .guild-header {width: 228px;}
  1789.  .guilds-wrapper:hover ~ .channels-wrap {left: 80px;width: 178px;}
  1790.  .channels-wrap:hover {left: 6px;width: 178px;}
  1791.  .guild-channels .channel a {opacity: 0.7}
  1792.  #voice-connection .btn-group {margin-right: -56px;}
  1793. }
  1794.  
  1795. @media screen and (max-width: 725px) {
  1796.  .chat.private .content .message-group:not(.compact) h2 .timestamp{display:none;}
  1797. }
  1798.  
  1799. @media screen and (max-width: 430px) {
  1800.  .chat .content .flex-spacer.flex-vertical:not(:only-child) ~ .channel-members-wrap { cursor: not-allowed; position: fixed; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.75); background-size: cover; background-position: center center; background-repeat: no-repeat; border-radius: 5px; top: 0; right: 0; bottom: 0; left: inherit; z-index: 1000; }
  1801.  .chat .content .flex-spacer.flex-vertical:not(:only-child) ~ .channel-members-wrap:before { content: "Media screen size too small"; color: #fff; margin: auto; font-size: 2rem; text-align: center; }
  1802.  .chat .content .flex-spacer.flex-vertical:not(:only-child) ~ .channel-members-wrap .scroller-wrap { display: none; }
  1803.  .chat:not(.private) .content .message-group:not(.compact) h2 .timestamp { display: block; }
  1804. }
  1805.  
  1806. @media screen and (max-width: 400px) {
  1807.  .message-group .btn-option{display:none;}
  1808. }
  1809.  
  1810. @media screen and (max-width: 340px) {
  1811.  .message-group h2{max-width: 60%;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
  1812.  .emoji-picker{width:90%;}
  1813. }
  1814.  
  1815. .popout.popout-top-right.no-arrow,
  1816. .popout.popout-top.no-arrow{margin-left:30px;}}
  1817. .change-log-button-container:hover {font-weight: 500;border-bottom: 2px solid var(--main-color);background: rgba(0, 0, 0, 0.48);opacity: 0.85;}
  1818. .change-log-button-container {position: inherit;padding-top: 1px;margin-top: 0px;transition: .2s ease-in-out all;font-weight: 500;}
  1819. .change-log-button-container .change-log-button:hover {color: #fff;}
  1820. .change-log-button-container .change-log-button {color: hsla(0,0%,100%,.3);font-size: 14px;opacity: 1;}
  1821. .theme-dark .channel-members-loading .heading {background: transparent !important;}
  1822. .theme-dark .channel-members-loading .member {background: transparent !important;}
  1823. .theme-dark .channel-members-loading .member:nth-child(3n+2), .theme-dark .channel-members-loading .member:nth-child(7n+4) {background: transparent !important;}
  1824. .theme-dark .channel-members-loading .member:nth-child(2n-4), .theme-dark .channel-members-loading .member:nth-child(7n-1) {background: transparent !important;}
  1825. .theme-dark .channel-members-loading {background-color: transparent !important;}
  1826. .theme-dark .channel-members-loading .background {background-image: -webkit-linear-gradient(0deg,transparent,rgba(0, 0, 0, 0.4),transparent);background-image: linear-gradient(90deg,transparent,rgba(0, 0, 0, 0.4),transparent);}
  1827.  
  1828. .settings-connections-wrapper .authed-app { background: rgba(0,0,0,0.5); border: 2px solid rgba(0,0,0,0.5);}
  1829.  
  1830. .settings-connections-wrapper .authed-app:hover { border: 2px solid var(--main-color);}
  1831.  
  1832. .settings-connections-wrapper .authed-app .header .app-name {color: #d2d2d2;}
  1833.  
  1834. .settings-connections-wrapper .authed-app .details .header {color: #b7b7b7;}
  1835.  
  1836. .settings-connections-wrapper .authed-app .details .body {color: #afafaf;}
  1837.  
  1838. .settings-connections-wrapper .authed-app .details .permissions .body {color: #afafaf;}
  1839.  
  1840. .settings-connections-wrapper .authed-app .details .permission-checkmark {-webkit-filter: invert(100%) hue-rotate(110deg);}
  1841.  
  1842. .settings-connections-wrapper .user-settings-modal-connections .user-settings-modal-connections-list {box-shadow: 0 -1px transparent;}
  1843.  
  1844. .settings-connections-wrapper .user-settings-modal-connections .user-settings-modal-connections-list .connection .connection-integrations {border: 2px solid var(--main-color);}
  1845.  
  1846. .settings-connections-wrapper .user-settings-modal-connections .user-settings-modal-connections-list .connection .connection-integrations.no-integrations {color: var(--main-color);opacity: 0.7;}
  1847.  
  1848. .alert.form .form-inner h4 {color: #dcdcdc;}
  1849.  
  1850. .alert.form .form-inner p {color: #bbbbbb;}
  1851.  
  1852. .invite-modal .scroller { background: var(--main-color) url(/assets/29d5ff462afb11bce1979cf694aee3d1.png) repeat; }
  1853.  
  1854. .invite-modal .invite-body { color: #fff; background: var(--hover-color); border-radius: 3px }
  1855.  
  1856. .invite-modal .invite-title { color: #fff; background: var(--hover-color); border-radius: 3px; }
  1857.  
  1858. .invite-modal .invite-cancel { color: #fff; background: #A93D3D; border-radius: 3px; padding: 3px; }
  1859.  
  1860. .theme-dark .invite-button { background-color: rgba(0, 0, 0, 0.68); border-color: #000000; }
  1861.  
  1862. body,.channel-members .member .member-username { -webkit-font-smoothing: antialiased !important; -webkit-backface-visibility: hidden !important; }
  1863.  
  1864. /* Friend list by Uri*/
  1865.  
  1866. #friends .friends-header{position: relative;}
  1867.  
  1868. #friends .friends-header .tab-bar{
  1869.     width: 100%;
  1870.     position: absolute;
  1871.     top: 70px;
  1872.     display: flex;
  1873.     justify-content: center;
  1874.     z-index: 2;
  1875. }
  1876.  
  1877. #friends .friends-header .header-toolbar{
  1878.     position: absolute;
  1879.     right: 20px;
  1880. }
  1881.  
  1882. #friends .friends-table .friends-table-body{
  1883.     padding: 0;
  1884.     margin: 40px 0 0;
  1885. }
  1886.  
  1887. #friends .friends-header .tab-bar .tab-bar-separator,
  1888. #friends .friends-table .friends-table-header .friends-column-separator{display: none;}
  1889.  
  1890. #friends .friends-header .tab-bar .tab-bar-item,
  1891. #friends .friends-table .friends-table-header .friends-column,
  1892. #friends .friends-table .friends-row .friends-column-name,
  1893. #friends .friends-table .friends-row .friends-column-status{color: rgba(255, 255, 255, 0.6)!important;}
  1894.  
  1895. #friends .friends-header .btn,
  1896. #friends .friends-header .tab-bar .tab-bar-item.selected{background-color: var(--main-color) !important;color: #fff !important;}
  1897.  
  1898. #friends .friends-header .tab-bar .tab-bar-item:hover:not(.selected){background-color: var(--hover-color) !important;}
  1899.  
  1900. #friends .friends-header .tab-bar .tab-bar-item{
  1901.     padding: 5px 8px;
  1902.     margin: 0 5px;
  1903.     transition: color 500ms, background 500ms;
  1904. }
  1905.  
  1906. #friends .friends-header .tab-bar .tab-bar-item .badge{
  1907.     background: rgba(0, 0, 0, 0.2)!important;
  1908.     color: #fff!important;
  1909.     opacity: 0.7;
  1910.     transition: opacity 500ms; 
  1911. }
  1912.  
  1913. #friends .friends-header .tab-bar .tab-bar-item:hover .badge{opacity: 1;}
  1914.  
  1915. #friends .friends-header .tab-bar .tab-bar-item.tab-bar-item-primary{background-color: var(--main-color) !important;color: #fff !important;}
  1916. #friends .friends-header .tab-bar .tab-bar-item.tab-bar-item-primary:not(.selected):hover{background-color: var(--hover-color);}
  1917.  
  1918. #friends .friends-table{padding-top: 11px;}
  1919.  
  1920. #friends .friends-table .friend-table-add-wrapper {margin-top: 20px;}
  1921. #friends .friends-table .friend-table-add-wrapper .friend-table-add-header{
  1922.     background: rgba(0, 0, 0, 0.2);
  1923.     box-shadow: 1px 1px 2px 1px rgba(0, 0, 0, 0.3);
  1924.     margin: 20px 30px;
  1925.     border-radius: 5px;
  1926. }
  1927.  
  1928. #friends .friends-table .friend-table-add-wrapper h2{color: rgba(225, 225, 225, 0.9);}
  1929.  
  1930. #friends .friends-table .friend-table-add-wrapper .friend-table-suggestions-header{
  1931.     margin: 30px 30px 16px;
  1932.     padding: 0;
  1933.     border-bottom: 1px solid rgba(206, 196, 196, 0.6);
  1934. }
  1935.  
  1936. #friends .friends-table .friend-table-add-wrapper .friend-table-suggestions-header h2{color: rgba(225, 225, 225, 0.9);}
  1937.  
  1938. #friends .friends-table .friends-table-header{display: none;}
  1939. #friends .friends-table .friends-table-body > span{
  1940.     display: flex;
  1941.     flex-flow: row wrap;
  1942.     justify-content: center;
  1943. }
  1944.  
  1945. #friends .friends-table .friends-row{
  1946.     background: rgba(0, 0, 0, 0.2)!important;
  1947.     box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
  1948.     border-radius: 5px;
  1949.     margin: 15px;
  1950.     padding: 0;
  1951.     height: 120px!important;
  1952.     flex-direction: column;
  1953.     flex-basis: 300px;
  1954.     position: relative;
  1955.     transition: opacity 300ms;
  1956. }
  1957.  
  1958. #friends .friends-table .friends-row:hover{
  1959.     box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
  1960.     border-radius: 5px;
  1961.     margin: 15px;
  1962.     padding: 0;
  1963.     opacity: 1!important;
  1964. }
  1965.  
  1966. #friends .friends-table .friends-row .avatar-small{
  1967.     border-radius: 5px;
  1968.     box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);
  1969. }
  1970.  
  1971. #friends .friends-table .friends-row + .friends-row{border-top: none!important;}
  1972.  
  1973. #friends .friends-table .friends-row .friends-column{
  1974.     position: absolute;
  1975.     backface-visibility: hidden;
  1976. }
  1977.  
  1978. #friends .friends-table .friends-row .friends-column + .friends-column{margin: 0;}
  1979.  
  1980. #friends .friends-table .friends-row .friends-column-name .avatar-small{
  1981.     top: 25px;
  1982.     left: 15px;
  1983.     width: 85px;
  1984.     height: 85px;
  1985.     background-size: 85px 85px;
  1986.     opacity: 0.6;
  1987.     transition: opacity 500ms;
  1988. }
  1989.  
  1990. #friends .friends-table .friends-row:hover .friends-column-name .avatar-small{opacity: 0.9;}
  1991.  
  1992. #friends .friends-table .friends-row .friends-column-name .discord-tag{
  1993.     display:block;
  1994.     position: absolute;
  1995.     top: 25px;
  1996.     left: 115px;
  1997.     text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);
  1998. }
  1999.  
  2000. #friends .friends-table .friends-row .friends-column-name .discord-tag .username{
  2001.     clear: left;
  2002.     float: left;
  2003.     width: 100px;
  2004.     text-overflow: ellipsis;
  2005.     white-space: nowrap;
  2006.     overflow: hidden;
  2007. }
  2008.  
  2009. #friends .friends-table .friends-row .friends-column-name .discord-tag .discriminator{visibility: visible;}
  2010.  
  2011. #friends .friends-table .friends-row .friends-column-name .username{transition: color 300ms;}
  2012. #friends .friends-table .friends-row:hover .username{color: rgba(225, 225, 225, 1);}
  2013.  
  2014. #friends .friends-table .friends-row .friends-column-status{
  2015.     top: 0;
  2016.     width: 100%;
  2017.     justify-content: center;
  2018.     height: 18px;
  2019. }
  2020.  
  2021. #friends .friends-table .friends-row .friends-column-status .status{
  2022.     width: 100%;
  2023.     height: 20px;
  2024.     border-radius: 5px 5px 0 0;
  2025.     position: absolute;
  2026.     top: 0;
  2027.     opacity: 0.5;
  2028.     z-index: 1;
  2029. }
  2030.  
  2031. #friends .friends-table .friends-row .friends-column-status .status-text{
  2032.     max-width: 90%;
  2033.     font-size: 12px;
  2034.     line-height: normal;
  2035.     transition: color 300ms;
  2036.     z-index: 2;
  2037. }
  2038.  
  2039. #friends .friends-table .friends-row:hover .friends-column-status .status-text{color: rgba(225, 225, 225, 1);}
  2040.  
  2041. #friends .friends-table .friends-table-body .friends-row .friends-column-guilds{ /* .friends-table-body is important here */
  2042.     top: 80px;
  2043.     left: 115px;
  2044.     width: 150px;
  2045.     display: flex!important;
  2046. }
  2047.  
  2048. #friends .friends-table .friends-table-body .friends-row .friends-column-guilds .avatar-small{
  2049.     opacity: 0.7;
  2050.     transition: opacity 500ms;
  2051. }
  2052.  
  2053. #friends .friends-table .friends-table-body .friends-row:hover .friends-column-guilds .avatar-small{opacity: 1;}
  2054.  
  2055. #friends .friends-table .friends-row .friends-column-guilds a:nth-child(4),
  2056. #friends .friends-table .friends-row .friends-column-guilds a:nth-child(4) .avatar-small,
  2057. #friends .friends-table .friends-row .friends-column-guilds a:nth-child(5),
  2058. #friends .friends-table .friends-row .friends-column-guilds a:nth-child(5) .avatar-small,
  2059. #friends .friends-table .friends-row .friends-column-guilds a:nth-child(n + 6){display: none;}
  2060.  
  2061. #friends .friends-table .friends-row .friends-column-guilds .avatar-small{background-color: rgba(0, 0, 0, 0.4);}
  2062.  
  2063. #friends .friends-table .friends-row .friends-column-guilds .more-mutual-guilds-btn:before{
  2064.     content: "";
  2065.     background-color: rgba(0, 0, 0, 0.4);
  2066.     background-image: url(data:image/svg+xml;utf8;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pgo8IS0tIEdlbmVyYXRvcjogQWRvYmUgSWxsdXN0cmF0b3IgMTYuMC4wLCBTVkcgRXhwb3J0IFBsdWctSW4gLiBTVkcgVmVyc2lvbjogNi4wMCBCdWlsZCAwKSAgLS0+CjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+CjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4PSIwcHgiIHk9IjBweCIgd2lkdGg9IjY0cHgiIGhlaWdodD0iNjRweCIgdmlld0JveD0iMCAwIDYxMiA2MTIiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDYxMiA2MTI7IiB4bWw6c3BhY2U9InByZXNlcnZlIj4KPGc+Cgk8Zz4KCQk8Y2lyY2xlIGN4PSI2OS41NDUiIGN5PSIzMDYiIHI9IjY5LjU0NSIgZmlsbD0iI0ZGRkZGRiIvPgoJCTxjaXJjbGUgY3g9IjMwNiIgY3k9IjMwNiIgcj0iNjkuNTQ1IiBmaWxsPSIjRkZGRkZGIi8+CgkJPGNpcmNsZSBjeD0iNTQyLjQ1NSIgY3k9IjMwNiIgcj0iNjkuNTQ1IiBmaWxsPSIjRkZGRkZGIi8+Cgk8L2c+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPC9zdmc+Cg==);
  2067.     background-size: 18px 18px;
  2068.     background-position: center center;
  2069.     background-repeat: no-repeat;
  2070.     border-radius: 5px;
  2071.     width: 30px;
  2072.     height: 30px;
  2073.     box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
  2074.     position: absolute;
  2075.     top: 0;
  2076. }
  2077.  
  2078.  
  2079. #friends .friends-table .friends-row .friends-column-guilds .more-mutual-guilds-btn,
  2080. #friends .friends-table .friends-row .friends-column-guilds .more-mutual-guilds-btn:hover{
  2081.     border: 0;
  2082.     color: transparent !important;
  2083. }
  2084.  
  2085. #friends .friends-table .friends-row .friends-column-actions{
  2086.     top: 25px;
  2087.     right: -5px;
  2088.     opacity: 0;
  2089.     transition: opacity 500ms;
  2090.     visibility: visible;
  2091. }
  2092.  
  2093. #friends .friends-table .friends-row:hover .friends-column-actions{opacity: 1;}
  2094.  
  2095. #friends .friends-table .friends-row .friends-column-actions .friends-action{
  2096.     width: 28px;
  2097.     height: 28px;
  2098.     transform: translateX(120px);
  2099.     transition: transform 500ms, background 500ms;
  2100. }
  2101.  
  2102. #friends .friends-table .friends-row:hover .friends-column-actions .friends-action{transform: translateX(0px);}
  2103.  
  2104. #friends .friends-table .friends-row .friends-column-actions .friends-action:first-child{background-color: rgba(73, 152, 76, 0.7);}
  2105. #friends .friends-table .friends-row .friends-column-actions .friends-action:nth-child(2){
  2106.     background-color: rgba(199, 0, 67, 0.7);
  2107.     transition-delay: 200ms;
  2108. }
  2109.  
  2110. #friends .friends-table .friends-row .friends-suggestion-inner{padding: 20px;}
  2111.  
  2112. #friends .friends-table .friends-row .friends-suggestion-inner .avatar-large{
  2113.     border-radius: 5px;
  2114.     opacity: 0.6;
  2115.     transition: opacity 500ms;
  2116. }
  2117.  
  2118. #friends .friends-table .friends-row:hover .friends-suggestion-inner .avatar-large{opacity: 0.8;}
  2119.  
  2120. #friends .friends-table .friends-row .friends-suggestion-inner .friends-suggestion-info .discord-tag .username{
  2121.     color: rgba(225, 225, 225, 0.6);
  2122.     width: 100px;
  2123.     white-space: nowrap;
  2124.     overflow: hidden;
  2125.     text-overflow: ellipsis;
  2126.     transition: color 500ms;
  2127. }
  2128.  
  2129. #friends .friends-table .friends-row:hover .friends-suggestion-inner .friends-suggestion-info .discord-tag .username{color: rgba(225, 225, 225, 0.9);}
  2130.  
  2131. #friends .friends-table .friends-row .friends-suggestion-inner .friends-suggestion-info .discord-tag .discriminator{
  2132.     color: rgba(225, 225, 225, 0.7);
  2133.     visibility: visible;
  2134. }
  2135.  
  2136. #friends .friends-table .friends-row .friends-suggestion-inner ~ .friends-column-actions{
  2137.     display: flex;
  2138.     flex-direction: column;
  2139.     padding: 5px 25px 0 0;
  2140. }
  2141.  
  2142. #friends .friends-table .friends-row .friends-suggestion-inner ~ .friends-column-actions .friends-action:nth-child(2){margin: 5px 0 0 0;}
  2143.  
  2144.  
  2145. @media (max-width: 1300px) {
  2146.     #friends .friends-table .friends-table-header .friends-column-guilds,
  2147.     #friends .friends-table .friends-table-header .friends-column-guilds + .friends-column-separator,
  2148.     #friends .friends-table .friends-row .friends-column-guilds{display: block!important;}
  2149. }
  2150.  
  2151. #friends .friends-empty p{color: rgba(225, 225, 225, 0.8);}
  2152.  
  2153. .theme-dark #friends .friends-table .friends-row .friends-column-actions .friends-action:hover {
  2154.     background-color: rgb(73, 152, 76);
  2155. }
  2156.  
  2157. #friends .friends-table .friends-row .friends-column-status .status.status-unknown{border: none;}
  2158.  
  2159. #friends .friends-table .friends-row .friends-column-actions .friends-action.friends-action-remove:hover {
  2160.     background-color: rgb(199, 0, 67) !important;
  2161. }
  2162.  
  2163. .option-popout .btn-item { color: #909090; }
  2164.  
  2165. .popout.popout-invert.popout-top header:before, .popout.popout-invert.popout-top-right header:before { border-top-color: #057f95; }
  2166.  
  2167. #ebr-themes-pane .ebr-top .themes-header,
  2168. #ebr-plugins-pane .ebr-top .plugins-header { font-weight: 700;text-transform: uppercase;color: #fff;cursor: default;overflow: hidden; }
  2169.  
  2170. #theme-search,
  2171. #plugin-search { background-color: rgba(0, 0, 0, .3);border-color: transparent !important;border-radius: 3px; }
  2172.  
  2173. #theme-search:focus,
  2174. #plugin-search:focus { outline-color: #057F95; }
  2175.  
  2176. .ebr-plugin-item,
  2177. .ebr-theme-item { background-color: rgba(0, 0, 0, .3) !important; border-color: transparent !important; }
  2178.  
  2179. .install-button,
  2180. .view-source-button,
  2181. .update-button { background-color: #057F95 !important; }
  2182.  
  2183. .install-button:hover,
  2184. .view-source-button:hover,
  2185. .update-button:hover { background-color: #045B6B !important; }
  2186.  
  2187. .ebr-themes p,
  2188. .ebr-plugins p { font-size: 13.5px; }
  2189.  
  2190. .ebr-themes .name,
  2191. .ebr-plugins .name { color: #057F95;font-weight: 700; }
  2192.  
  2193. .ebr-themes .author,
  2194. .ebr-plugins .author { font-weight: 700; }
  2195.  
  2196. #ebr-themes-pane .ebr-top .themes-header, #ebr-plugins-pane .ebr-top .plugins-header, .ebr-themes p.author, .ebr-plugins p.author, .ebr-themes p.description, .ebr-plugins p.description { color:#fff; }
  2197.  
  2198. .search-bar.search-bar-light .search-bar-inner { background-color: transparent;border: 1px solid transparent; }
  2199.  
  2200. .search-bar-light .search-bar-clear { background: #057f95; }
  2201.  
  2202. .search-bar-clear:before { background: #000; }
  2203.  
  2204. .search-bar-light .search-bar-clear:after { background: #057f95; }
  2205.  
  2206. .search-bar-light .search-bar-clear:before { background: #000; }
  2207.  
  2208. .guild-settings-modal-members h6 { color: #c1c1c1; }
  2209.  
  2210. .emoji-picker .search-bar .search-bar-inner { background-color: transparent; }
  2211.  
  2212. .detected-platform-accounts-modal { background-color: rgba(0, 0, 0, 0.61);padding: 10px;border-radius: 3px; }
  2213.  
  2214. .detected-platform-accounts-modal .btn-group .btn-primary { background-color: var(--main-color); }
  2215.  
  2216. .detected-platform-accounts-modal .btn-group .btn-primary:hover:not(:disabled) { background-color: var(--hover-color); }
  2217.  
  2218. .detected-platform-accounts-modal .btn-group .btn-default:hover { border-bottom: 2px solid var(--main-color); }
  2219.  
  2220. .detected-platform-accounts-modal .privacy { color:#fff; }
  2221.  
  2222. .theme-dark .friends-table .messages .divider span, .theme-dark .friends-table .messages .divider:before, .theme-dark .messages-wrapper .messages .divider span, .theme-dark .messages-wrapper .messages .divider:before { background-color: transparent; }
  2223.  
  2224. .chat .divider { height: 28px; background-color: transparent; }
  2225.  
  2226. .theme-dark #friends .friends-header .tab-bar .tab-bar-item.tab-bar-item-primary { background-color: var(--main-color); color: #fff; }
  2227.  
  2228. .theme-dark #friends .friends-header .tab-bar .tab-bar-item.tab-bar-item-primary:hover:not(.selected) { background-color: var(--hover-color); }
  2229.  
  2230. .theme-dark #friends .friends-header .tab-bar .tab-bar-item.tab-bar-item-primary.selected { background-color: var(--main-color); color: #fff; }
  2231.  
  2232. .theme-dark #friends .friends-table .friend-table-add-wrapper .friend-table-add-header { border-bottom: 1px solid rgba(0,0,0,.2); background: rgba(0, 0, 0, 0.44) !important; margin-top: -10px; }
  2233.  
  2234. .connect-account-btn .connect-account-btn-inner {background-color: rgba(0, 0, 0, 0.39);}
  2235.  
  2236. .settings-connections-wrapper .user-settings-modal-connections .user-settings-modal-accounts-list h3 {color: #d8d8d8;}
  2237.  
  2238. .settings-connections-wrapper .user-settings-modal-connections .user-settings-modal-accounts-list .user-settings-modal-accounts-list-description .user-settings-modal-accounts-list-description-inner {color: #cccccc;}
  2239.  
  2240. #user-profile-modal .tab-bar-container {background-color: #057f95;border-bottom: 1px solid rgba(0,0,0,0.9);}
  2241.  
  2242. #user-profile-modal .guilds .section+.section {border-top: 1px solid transparent;}
  2243.  
  2244. #user-profile-modal .guilds .section .section-header {color: #c7c7c7;}
  2245.  
  2246. #user-profile-modal .guilds .guild .status {border: 2px solid var(--main-color);}
  2247.  
  2248. #user-profile-modal .guilds .guild:hover .status {border: 2px solid var(--hover-color);}
  2249.  
  2250. #user-profile-modal .avatar-profile .status {border: 4px solid var(--hover-color);}
  2251.  
  2252. .quick-message {border: 2px solid var(--main-color);background: rgba(0, 0, 0, 0.6); color: #fff !important;}
  2253.  
  2254. /*Modal Menu re arrangement by Uri modified by me*/
  2255.  
  2256. #user-profile-modal{opacity: 0.8;position: relative;}
  2257.  
  2258. #user-profile-modal .avatar-wrapper .avatar-profile,
  2259. #user-profile-modal .sub-header,
  2260. #user-profile-modal .scroller-wrap,
  2261. #user-profile-modal .empty{background-color: rgba(0,0,0,0.83) !important;}
  2262.  
  2263. #user-profile-modal .header{background: 0;}
  2264. #user-profile-modal .header:before{content: "";width: 100%;height: 100px;background-size: cover;background-position: center center;background-repeat: no-repeat;position: absolute;top: 0;right: 0;left: 0;z-index: -1;}
  2265.  
  2266. #user-profile-modal .header{height: 130px;}
  2267.  
  2268. #user-profile-modal .header .discord-tag{margin-left: -15px;}
  2269. #user-profile-modal .header .activity{
  2270.         margin-left: -50px;
  2271.     margin-top: -4px;
  2272.     padding-top: 13px !important;}
  2273.  
  2274. #user-profile-modal .header .discord-tag .username,
  2275. #user-profile-modal .header .activity{text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);}
  2276.  
  2277. #user-profile-modal .header .discord-tag .discriminator{display: inline;background: rgba(93, 93, 93, 0.3);font-weight: 600;color: #fff;margin-left: 8px;padding: 3px 5px;border-radius: 3px;-webkit-user-select: none;opacity: 0;transition: opacity 300ms;}
  2278.  
  2279. #user-profile-modal .header:hover .discord-tag .discriminator{opacity: 1;}
  2280.  
  2281.  
  2282. #user-profile-modal .avatar-wrapper .avatar-profile{border: 0;box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);left: 20px;}
  2283.  
  2284. #user-profile-modal .avatar-wrapper .avatar-profile .status{box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);right: 0;bottom: 0;left:-3px;}
  2285.  
  2286. #user-profile-modal .tab-bar-container{background-color: rgba(0,0,0,0.83) !important;border: 0!important;position: absolute;top: 130px;right: 0;padding: 0;width: 80px;height: 100%;justify-content: center;transition: width 500ms;transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);z-index: 1;}
  2287.  
  2288. #user-profile-modal .tab-bar-container:before{content: "...";position: absolute;top: 0;left: 0;width: 10px;height: 100%;padding-top: 180px;background: transparent;writing-mode: vertical-lr;color: transparent;font-size: 18px;font-weight: 700;letter-spacing: 15px;line-height: 20px;cursor: pointer;transition: letter-spacing 300ms, padding 300ms;;}
  2289.  
  2290. #user-profile-modal .tab-bar-container:hover{width: 180px;}
  2291.  
  2292. #user-profile-modal .tab-bar-container .tab-bar{background: transparent;border: 0!important;flex-flow: column;position: absolute;top: 40px;left: 35px;}
  2293.  
  2294. #user-profile-modal .tab-bar-container .tab-bar-item{padding: 10px 25px;position: relative;font-size: 16px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
  2295.  
  2296. #user-profile-modal .tab-bar-container .tab-bar-item,
  2297. #user-profile-modal .tab-bar-container .tab-bar-item:hover,
  2298. #user-profile-modal .tab-bar-container .tab-bar-item.selected{color: transparent!important;}
  2299.  
  2300. #user-profile-modal .tab-bar-container:hover .tab-bar-item{color: #adadad!important;opacity: 1;transition: color 500ms;}
  2301.  
  2302. #user-profile-modal .tab-bar-container:hover .tab-bar-item:hover,
  2303. #user-profile-modal .tab-bar-container:hover .tab-bar-item.selected{color: #fff!important;
  2304. }
  2305.  
  2306. #user-profile-modal .tab-bar-container .tab-bar-item:before{content: "";position: absolute;top: 7px;left: 0;width: 18px;height: 18px;background-position: center center;background-repeat: no-repeat;background-size: 18px 18px;opacity: 0.5;transition: opacity 500ms;}
  2307.  
  2308. #user-profile-modal .tab-bar-container .tab-bar-item:hover:before,
  2309. #user-profile-modal .tab-bar-container .tab-bar-item.selected:before{opacity: 1;}
  2310.  
  2311. #user-profile-modal .tab-bar-container .tab-bar-item:nth-child(1):before{
  2312.     background-image: url(data:image/svg+xml;utf8;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pgo8IS0tIEdlbmVyYXRvcjogQWRvYmUgSWxsdXN0cmF0b3IgMTYuMC4wLCBTVkcgRXhwb3J0IFBsdWctSW4gLiBTVkcgVmVyc2lvbjogNi4wMCBCdWlsZCAwKSAgLS0+CjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+CjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4PSIwcHgiIHk9IjBweCIgd2lkdGg9IjY0cHgiIGhlaWdodD0iNjRweCIgdmlld0JveD0iMCAwIDQwOS4xNjUgNDA5LjE2NCIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgNDA5LjE2NSA0MDkuMTY0OyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+CjxnPgoJPGc+CgkJPHBhdGggZD0iTTIwNC41ODMsMjE2LjY3MWM1MC42NjQsMCw5MS43NC00OC4wNzUsOTEuNzQtMTA3LjM3OGMwLTgyLjIzNy00MS4wNzQtMTA3LjM3Ny05MS43NC0xMDcuMzc3ICAgIGMtNTAuNjY4LDAtOTEuNzQsMjUuMTQtOTEuNzQsMTA3LjM3N0MxMTIuODQ0LDE2OC41OTYsMTUzLjkxNiwyMTYuNjcxLDIwNC41ODMsMjE2LjY3MXoiIGZpbGw9IiNGRkZGRkYiLz4KCQk8cGF0aCBkPSJNNDA3LjE2NCwzNzQuNzE3TDM2MC44OCwyNzAuNDU0Yy0yLjExNy00Ljc3MS01LjgzNi04LjcyOC0xMC40NjUtMTEuMTM4bC03MS44My0zNy4zOTIgICAgYy0xLjU4NC0wLjgyMy0zLjUwMi0wLjY2My00LjkyNiwwLjQxNWMtMjAuMzE2LDE1LjM2Ni00NC4yMDMsMjMuNDg4LTY5LjA3NiwyMy40ODhjLTI0Ljg3NywwLTQ4Ljc2Mi04LjEyMi02OS4wNzgtMjMuNDg4ICAgIGMtMS40MjgtMS4wNzgtMy4zNDYtMS4yMzgtNC45My0wLjQxNUw1OC43NSwyNTkuMzE2Yy00LjYzMSwyLjQxLTguMzQ2LDYuMzY1LTEwLjQ2NSwxMS4xMzhMMi4wMDEsMzc0LjcxNyAgICBjLTMuMTkxLDcuMTg4LTIuNTM3LDE1LjQxMiwxLjc1LDIyLjAwNWM0LjI4NSw2LjU5MiwxMS41MzcsMTAuNTI2LDE5LjQsMTAuNTI2aDM2Mi44NjFjNy44NjMsMCwxNS4xMTctMy45MzYsMTkuNDAyLTEwLjUyNyAgICBDNDA5LjY5OSwzOTAuMTI5LDQxMC4zNTUsMzgxLjkwMiw0MDcuMTY0LDM3NC43MTd6IiBmaWxsPSIjRkZGRkZGIi8+Cgk8L2c+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPC9zdmc+Cg==);
  2313. }
  2314.  
  2315. #user-profile-modal .tab-bar-container .tab-bar-item:nth-child(2):before{
  2316.     background-image: url(data:image/svg+xml;utf8;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pgo8IS0tIEdlbmVyYXRvcjogQWRvYmUgSWxsdXN0cmF0b3IgMTYuMC4wLCBTVkcgRXhwb3J0IFBsdWctSW4gLiBTVkcgVmVyc2lvbjogNi4wMCBCdWlsZCAwKSAgLS0+CjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+CjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4PSIwcHgiIHk9IjBweCIgd2lkdGg9IjY0cHgiIGhlaWdodD0iNjRweCIgdmlld0JveD0iMCAwIDk3Ljk2OCA5Ny45NjgiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDk3Ljk2OCA5Ny45Njg7IiB4bWw6c3BhY2U9InByZXNlcnZlIj4KPGc+Cgk8Zz4KCQk8cGF0aCBkPSJNNDkuNTQxLDM4LjY1NWMxLjYxNywwLDMuMTU4LDAuMzM4LDQuNTU5LDAuOTQ2YzAuMTA1LTIuMjg2LDAuODkzLTQuNCwyLjE1Ny02LjE1Yy0wLjg5LTAuMTg2LTEuODA4LTAuMjg1LTIuNzQ4LTAuMjg1ICAgIGgtOC45MDZjLTAuOTM4LDAtMS44NTYsMC4wOTgtMi43MzksMC4yODJjMS4zNDcsMS44NjksMi4xNTIsNC4xNSwyLjE2NSw2LjYyQzQ1LjY2NiwzOS4xNjgsNDcuNTQ0LDM4LjY1NSw0OS41NDEsMzguNjU1eiIgZmlsbD0iI0ZGRkZGRiIvPgoJCTxjaXJjbGUgY3g9IjQ5LjA1NCIgY3k9IjIxLjk1NCIgcj0iMTAuNDk2IiBmaWxsPSIjRkZGRkZGIi8+CgkJPHBhdGggZD0iTTY1LjUzOSw1MC4zNmM1LjM0MiwwLDkuNjctNC4zMyw5LjY3LTkuNjdjMC01LjM0Mi00LjMyOC05LjY3LTkuNjctOS42N2MtNS4yOTIsMC05LjU4Myw0LjI1MS05LjY2Myw5LjUyNCAgICBjMy4wNDksMS45MTIsNS4xODcsNS4xNDYsNS41NzcsOC45QzYyLjY5NSw1MC4wMjYsNjQuMDc2LDUwLjM2LDY1LjUzOSw1MC4zNnoiIGZpbGw9IiNGRkZGRkYiLz4KCQk8cGF0aCBkPSJNMzIuNTcxLDMxLjAxOWMtNS4zNDMsMC05LjY3MSw0LjMyOS05LjY3MSw5LjY3czQuMzI4LDkuNjY5LDkuNjcxLDkuNjY5YzEuODkyLDAsMy42NTEtMC41NTMsNS4xNDMtMS40OTIgICAgYzAuNDc1LTMuMDkxLDIuMTMyLTUuNzk0LDQuNDk5LTcuNjM0YzAuMDEtMC4xODEsMC4wMjctMC4zNiwwLjAyNy0wLjU0M0M0Mi4yNCwzNS4zNDgsMzcuOTEsMzEuMDE5LDMyLjU3MSwzMS4wMTl6IiBmaWxsPSIjRkZGRkZGIi8+CgkJPHBhdGggZD0iTTcxLjgyLDMwLjgxM2MzLjA0OSwxLjkxMiw1LjE4Nyw1LjE0Niw1LjU3Niw4LjkwMWMxLjI0MSwwLjU4MSwyLjYyMywwLjkxNiw0LjA4NiwwLjkxNmM1LjM0MiwwLDkuNjctNC4zMjksOS42Ny05LjY3ICAgIGMwLTUuMzQxLTQuMzI4LTkuNjctOS42Ny05LjY3Qzc2LjE5MSwyMS4yODksNzEuOSwyNS41NDEsNzEuODIsMzAuODEzeiIgZmlsbD0iI0ZGRkZGRiIvPgoJCTxjaXJjbGUgY3g9IjQ5LjU0MSIgY3k9IjUwLjY3MyIgcj0iOS42NzEiIGZpbGw9IiNGRkZGRkYiLz4KCQk8cGF0aCBkPSJNNjkuNjQzLDUxLjAxOWgtOC4xNDRjLTAuMDg5LDMuMjU4LTEuNDc5LDYuMTkyLTMuNjc5LDguMzAxYzYuMDY4LDEuODA2LDEwLjUwOSw3LjQzNCwxMC41MDksMTQuMDgydjMuMDkyICAgIGM4LjA0LTAuMjk3LDEyLjY3NC0yLjU3MywxMi45NzktMi43MjlsMC42NDYtMC4zMjhoMC4wNjdWNjMuNDAxQzgyLjAyMyw1Ni41NzMsNzYuNDY5LDUxLjAxOSw2OS42NDMsNTEuMDE5eiIgZmlsbD0iI0ZGRkZGRiIvPgoJCTxwYXRoIGQ9Ik04NS41ODUsNDEuMjg5aC04LjE0MmMtMC4wODgsMy4yNTgtMS40NzksNi4xOTItMy42NzgsOC4zMDFjNi4wNjgsMS44MDYsMTAuNTA4LDcuNDMzLDEwLjUwOCwxNC4wODF2My4wOTIgICAgYzguMDM5LTAuMjk2LDEyLjY3NC0yLjU3MiwxMi45NzktMi43MjlsMC42NDYtMC4zMjdoMC4wNjlWNTMuNjcxQzk3Ljk2Nyw0Ni44NDQsOTIuNDEzLDQxLjI4OSw4NS41ODUsNDEuMjg5eiIgZmlsbD0iI0ZGRkZGRiIvPgoJCTxwYXRoIGQ9Ik00MS4yNTYsNTkuMzE5Yy0yLjE4OS0yLjA5OS0zLjU3NS01LjAxNy0zLjY3Ny04LjI1NGMtMC4zMDEtMC4wMjItMC42LTAuMDQ3LTAuOTA4LTAuMDQ3aC04LjIwMyAgICBjLTYuODI4LDAtMTIuMzgzLDUuNTU1LTEyLjM4MywxMi4zODN2MTAuMDM3bDAuMDI1LDAuMTU1bDAuNjkxLDAuMjE4YzUuMjI3LDEuNjMzLDkuODkzLDIuMzgzLDEzLjk0NCwyLjYyMXYtMy4wMzEgICAgQzMwLjc0Nyw2Ni43NTQsMzUuMTg2LDYxLjEyNiw0MS4yNTYsNTkuMzE5eiIgZmlsbD0iI0ZGRkZGRiIvPgoJCTxwYXRoIGQ9Ik01My42NDMsNjEuMDAzaC04LjIwNmMtNi44MjgsMC0xMi4zODMsNS41NTctMTIuMzgzLDEyLjM4MnYxMC4wMzdsMC4wMjYsMC4xNTdsMC42OSwwLjIxNiAgICBjNi41MTYsMi4wMzUsMTIuMTc3LDIuNzE1LDE2LjgzNSwyLjcxNWM5LjEwMSwwLDE0LjM3NS0yLjU5NSwxNC43MDEtMi43NmwwLjY0Ni0wLjMyOGgwLjA2OFY3My4zODUgICAgQzY2LjAyMyw2Ni41NTgsNjAuNDY5LDYxLjAwMyw1My42NDMsNjEuMDAzeiIgZmlsbD0iI0ZGRkZGRiIvPgoJCTxwYXRoIGQ9Ik0xNi40ODYsNDAuOTM4YzEuNDYzLDAsMi44NDQtMC4zMzUsNC4wODYtMC45MTZjMC4zOS0zLjc1NSwyLjUyNy02Ljk5LDUuNTc2LTguOTAyYy0wLjA4LTUuMjcxLTQuMzcxLTkuNTIzLTkuNjYyLTkuNTIzICAgIGMtNS4zNDMsMC05LjY3MSw0LjMyOS05LjY3MSw5LjY3MUM2LjgxNSwzNi42MDksMTEuMTQzLDQwLjkzOCwxNi40ODYsNDAuOTM4eiIgZmlsbD0iI0ZGRkZGRiIvPgoJCTxwYXRoIGQ9Ik0yNC4yMDIsNDkuODk5Yy0yLjE5OC0yLjEwOS0zLjU4OS01LjA0NC0zLjY3Ny04LjMwM2gtOC4xNDNDNS41NTQsNDEuNTk3LDAsNDcuMTUyLDAsNTMuOTc5djEwLjAzN2gwLjA2OWwwLjY0NiwwLjMyNyAgICBjMC4zMDYsMC4xNTQsNC45MzksMi40MzMsMTIuOTc5LDIuNzI4di0zLjA5MkMxMy42OTQsNTcuMzMyLDE4LjEzMyw1MS43MDQsMjQuMjAyLDQ5Ljg5OXoiIGZpbGw9IiNGRkZGRkYiLz4KCQk8cGF0aCBkPSJNMjcuNzk2LDMwLjA2M2MxLjE2LTAuNDcsMi45My0xLjA0Nyw0LjYyLTEuMDQ3YzEuOTY3LDAsMy44OTEsMC41MDYsNS42MDcsMS40NjljMC4zODItMC4zNzUsMC43MzItMC43ODMsMS4wNS0xLjIyICAgIGMtMS42My0yLjE0MS0yLjUyLTQuNzY1LTIuNTItNy40NjRjMC0xLjgxOCwwLjQwNi0zLjYyMiwxLjE4LTUuMjYxYy0xLjc2Mi0xLjU5Mi00LjAxLTIuNDYxLTYuMzk5LTIuNDYxICAgIGMtNC4zNDgsMC04LjEzMywyLjk0My05LjI0MSw3LjA4OEMyNS4zNDEsMjMuMDU3LDI3LjQ1NywyNi4zNjEsMjcuNzk2LDMwLjA2M3oiIGZpbGw9IiNGRkZGRkYiLz4KCQk8cGF0aCBkPSJNNTkuMTE3LDI4LjcxOGMwLjMzNiwwLjUzNCwwLjcyOSwxLjAzNywxLjE3NSwxLjUwNWMxLjU4OC0wLjc5MiwzLjMzNC0xLjIwOCw1LjA5Mi0xLjIwOCAgICBjMS43MjksMCwzLjM4NiwwLjQ0Miw0LjQ3MiwwLjgxMmMwLjM0LTQuMDEzLDIuNzY3LTcuNTU1LDYuNC05LjM1Yy0xLjMzMi0zLjgwNS00LjkzOC02LjQwMi05LjAyMS02LjQwMiAgICBjLTIuNjQsMC01LjE0LDEuMDg0LTYuOTQ1LDIuOTkyYzAuNjM0LDEuNTEyLDAuOTU1LDMuMTAxLDAuOTU1LDQuNzNDNjEuMjQ0LDI0LjI5Miw2MC41MSwyNi42Nyw1OS4xMTcsMjguNzE4eiIgZmlsbD0iI0ZGRkZGRiIvPgoJPC9nPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+Cjwvc3ZnPgo=);
  2317. }
  2318.  
  2319. #user-profile-modal .tab-bar-container .tab-bar-item:nth-child(3):before{
  2320.     background-image: url(data:image/svg+xml;utf8;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pgo8IS0tIEdlbmVyYXRvcjogQWRvYmUgSWxsdXN0cmF0b3IgMTYuMC4wLCBTVkcgRXhwb3J0IFBsdWctSW4gLiBTVkcgVmVyc2lvbjogNi4wMCBCdWlsZCAwKSAgLS0+CjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+CjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4PSIwcHgiIHk9IjBweCIgd2lkdGg9IjY0cHgiIGhlaWdodD0iNjRweCIgdmlld0JveD0iMCAwIDQ2Ni40OCA0NjYuNDgiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDQ2Ni40OCA0NjYuNDg7IiB4bWw6c3BhY2U9InByZXNlcnZlIj4KPGc+Cgk8ZyBpZD0iaWNvbnNfMjRfIj4KCQk8Zz4KCQkJPGc+CgkJCQk8cGF0aCBkPSJNMTEzLjc3NCwxMTcuNWwwLjAwMSwwLjAwNmMwLjAyLTAuMDA0LDAuMDM5LTAuMDEsMC4wNi0wLjAxNGMwLjAxOS0wLjAwMiwwLjA0LTAuMDAzLDAuMDU5LTAuMDA2bC0wLjAwMS0wLjAwNSAgICAgIGMyMC44MjUtMy44LDM0Ljg0NS0yMy41OTEsMzEuNDA0LTQ0LjU2M2MtMy40NDItMjAuOTctMjMuMDQ5LTM1LjI0My00My45OTYtMzIuMTg4di0wLjAwNWMtMC4wMiwwLjAwMy0wLjAzOSwwLjAwOC0wLjA1OSwwLjAxMiAgICAgIGMtMC4wMTksMC4wMDMtMC4wMzksMC4wMDQtMC4wNiwwLjAwOGwwLjAwMSwwLjAwNGMtMjAuODIyLDMuOC0zNC44NDMsMjMuNTg5LTMxLjQwMyw0NC41NTkgICAgICBDNzMuMjIxLDEwNi4yNzksOTIuODMxLDEyMC41NTMsMTEzLjc3NCwxMTcuNXoiIGZpbGw9IiNGRkZGRkYiLz4KCQkJCTxwYXRoIGQ9Ik0yNTYuNjUsMzQ3LjEwOGwtNzUuMTcxLTc2LjE4Yy01LjE2MS02LjE3OS0xOS4wODItOTMuNzc5LTE5LjY3OS05Ny40MTZjLTEuNTMtOS4zMjMsMS4xMTYtMTUuMjQsMS4xMTYtMTUuMjQgICAgICBzMzcuNzc5LTk3LjA2Myw0MS42MDYtMTA3Ljc0OWMzLjgyOS0xMC42ODcsMy42MS0xNy42NzYtMy43NzEtMjIuOTgxYy03LjM4OS01LjMwNy0xOS45OTQtNS40NjUtMjIuOTg0LDMuNzcxbC00MC40NzUsOTcuMTE5ICAgICAgYzAsMC0xMC4zMTctMy43Ni0yMS43MTItMi4wODhjLTAuMDk2LDAuMDE4LTAuMTg4LDAuMDM2LTAuMjg0LDAuMDU1Yy0wLjA5NSwwLjAxNC0wLjE4OCwwLjAyMy0wLjI4NiwwLjAzOSAgICAgIGMtMTEuMzI5LDIuMDU3LTE5LjkwNiw4LjkxNy0xOS45MDYsOC45MTdMMjUuNzE5LDU2LjI2MWMtOC4xODktOC0xNy42NzgtMy42MTktMjIuOTg1LDMuNzcxICAgICAgYy01LjI5OCw3LjM4NS0yLjI3NCwxNS43MTQsMy43NywyMi45ODFjNi4wNDQsNy4yNjgsNzMuODU2LDg4LjgwNyw3My44NTYsODguODA3czQuMzk1LDQuNzYyLDUuOTI0LDE0LjA4NCAgICAgIGMwLjEyMSwwLjc0LDAuMTU2LDAuOTUzLDE0LjY5NCw4OS41MzhsOS43NTMsMTQ5Ljg3NmMwLjYzNiw5Ljc3MSw4Ljc2LDE3LjI3MiwxOC40MTUsMTcuMjcyYzAuNDAzLDAsMC44MS0wLjAxMywxLjIxOC0wLjAzOSAgICAgIGMxMC4xOC0wLjY2MywxNy44OTYtOS40NTMsMTcuMjMzLTE5LjYzM2MwLDAtOC43OTItMTMwLjMyMy04Ljc5Mi0xMzUuMTE1YzAtMi45NDIsMi44NjUtNC42Miw2LjI0My0xLjE5NSAgICAgIGMzLjM3OCwzLjQyMyw4NS4zMDYsODYuNDQ5LDg1LjMwNiw4Ni40NDljNy4xNjUsNy4yNjEsMTguODYxLDcuMzQsMjYuMTIzLDAuMTc0ICAgICAgQzI2My43MzcsMzY2LjA2NCwyNjMuODE1LDM1NC4zNjksMjU2LjY1LDM0Ny4xMDh6IiBmaWxsPSIjRkZGRkZGIi8+CgkJCTwvZz4KCQkJPGc+CgkJCQk8cGF0aCBkPSJNMzQxLjQxNSwxNTMuNTY2bC0wLjAwMiwwLjAwNGMwLjAxNiwwLjAwNiwwLjAyOSwwLjAwOCwwLjA0NSwwLjAxM2MwLjAxNywwLjAwNSwwLjAyOCwwLjAxMiwwLjA0NCwwLjAxN2wwLjAwMi0wLjAwMyAgICAgIGMwLjEzMywwLjA0MywwLjI2NiwwLjA3NywwLjM5NiwwLjExN2MwLjEzLDAuMDQ5LDAuMjU2LDAuMTA0LDAuMzg3LDAuMTUxbC0wLjAwMiwwLjAwNGMwLjAxNywwLjAwNCwwLjAyOSwwLjAwOCwwLjA0NiwwLjAxMyAgICAgIGMwLjAxNCwwLjAwNCwwLjAyNywwLjAxMiwwLjA0MywwLjAxN2wwLjAwMS0wLjAwM2MxNS42NzQsNS4wNjEsMzIuNTcyLTMuMzQ0LDM3LjkzNi0xOC45ODkgICAgICBjNS4zNjItMTUuNjQzLTIuODI2LTMyLjY0Ni0xOC4zMDktMzguMjYzbDAuMDAxLTAuMDAzYy0wLjAxNy0wLjAwNi0wLjAzLTAuMDEtMC4wNDctMC4wMTQgICAgICBjLTAuMDE0LTAuMDA1LTAuMDI3LTAuMDExLTAuMDQzLTAuMDE3bC0wLjAwMSwwLjAwM2MtMC4xMzMtMC4wNDItMC4yNjUtMC4wNzctMC4zOTYtMC4xMTdjLTAuMTMtMC4wNDktMC4yNTUtMC4xMDMtMC4zODgtMC4xNTEgICAgICBsMC4wMDQtMC4wMDNjLTAuMDE2LTAuMDA2LTAuMDMxLTAuMDA4LTAuMDQ2LTAuMDE0Yy0wLjAxNi0wLjAwNC0wLjAyOC0wLjAxMS0wLjA0NS0wLjAxNmwtMC4wMDEsMC4wMDMgICAgICBjLTE1LjY3My01LjA2Mi0zMi41NjksMy4zNDMtMzcuOTMyLDE4Ljk4NVMzMjUuOTMxLDE0Ny45NDksMzQxLjQxNSwxNTMuNTY2eiIgZmlsbD0iI0ZGRkZGRiIvPgoJCQkJPHBhdGggZD0iTTQ2Ni4wMTYsMTY2LjA5NmMtMS41OTEtNi44OTgtOC4yODUtOS45MDgtMjAuMzc1LTcuMzkzbC05MC43Myw5Ljc2NmMwLDAtNC4yMzUtNS4wNTMtMTUuMDg4LTguNzcyICAgICAgYy0xMC44NTMtMy43Mi0xNy4yNS0yLjMxMy0xNy4yNS0yLjMxM2wtNjUuNjU4LTYzLjM3M2MtOC4wMDQtOS40MDQtMTUuMTM4LTExLjEzNC0yMC42MjUtNi42NjMgICAgICBjLTYuNjA0LDUuMzgtNy44MjIsMTMuODg5LTMuOTU1LDE4LjY5MWM1LjgzLDcuMjQxLDY0LjU3Niw2Ny40NjIsNjYuNzA0LDcwLjkxMmMyLjEyOCwzLjQ1MSwxLjI2Miw0Ljg4My0xLjEyNSwxMS44MzcgICAgICBjLTEuMDEzLDIuOTU1LTE2LjYyOSw0Ni40NjktMjIuNTUyLDYyLjYwMWwtNzcuNTY5LDUyLjI3MWMtNi43NjgsNC41NjEtOC41NTcsMTMuNzQ1LTMuOTk3LDIwLjUxMyAgICAgIGM0LjU2LDYuNzY5LDEzLjc0NCw4LjU1OSwyMC41MTMsMy45OTdjMCwwLDgxLjgwMi01NC45NzEsODMuNzgyLTU2LjQ1NmMxLjk4LTEuNDg1LDQuNjM0LTAuNTU0LDMuNzM5LDIuMjY4ICAgICAgYy0wLjg5NCwyLjgyLTM1LjEwNCwxMTAuODctMzUuMTA0LDExMC44N2MtMi40NjQsNy43ODEsMS44NDcsMTYuMDg1LDkuNjI4LDE4LjU0OWMxLjQ4MywwLjQ3MSwyLjk4NiwwLjY5Myw0LjQ2NCwwLjY5MyAgICAgIGM2LjI3MSwwLDEyLjA5MS00LjAyMiwxNC4wODUtMTAuMzJsMzguNjExLTEyMS45NDZjMC4xNjMtMC41MTUsMC4yODYtMS4wMzQsMC4zOTEtMS41NTQgICAgICBjMjEuOTQ3LTY0LjAxNCwyMS43ODctNjMuNTQ5LDIxLjIxMy02MS44NzVjMi4zODQtNi45NTQsMi41NzgtOC42MTgsNi4zNzQtMTAuMDM3czg3LjEzNC0xMi45MzUsOTYuMTgzLTE1LjA3NyAgICAgIEM0NjMuNjcyLDE4MS44NjIsNDY3LjkzLDE3NC4zOTYsNDY2LjAxNiwxNjYuMDk2eiIgZmlsbD0iI0ZGRkZGRiIvPgoJCQk8L2c+CgkJPC9nPgoJPC9nPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+Cjwvc3ZnPgo=);
  2321. }
  2322.  
  2323. #user-profile-modal .tab-bar-container .tab-bar-item:first-child{margin-top: 90px;}
  2324.  
  2325. #user-profile-modal .tab-bar-container .tab-bar-item:hover,
  2326. #user-profile-modal .tab-bar-container .tab-bar-item.selected{border: 0!important;}
  2327.  
  2328. #user-profile-modal .tab-bar-container .tab-bar-item + .tab-bar-item{margin: 0;}
  2329.  
  2330. #user-profile-modal .scroller-wrap{height: 380px;}
  2331.  
  2332. #user-profile-modal .scroller-wrap .scroller{margin-top: 15px;animation: sw-fade 300ms ease-in-out;}
  2333.  
  2334. @keyframes sw-fade {
  2335.     0% {opacity: 0;}
  2336.     100% {opacity: 1;}
  2337. }
  2338.  
  2339.  
  2340. #user-profile-modal .guilds .section .section-header{color: #fff;}
  2341.  
  2342. #user-profile-modal .guilds .section + .section{border: 0!important;}
  2343.  
  2344. #user-profile-modal .guilds .section .note textarea:focus{background-color: rgba(0, 0, 0, 0.15);border: 1px solid rgba(0, 0, 0, 0.1);color: #e4e4e4;}
  2345.  
  2346. #user-profile-modal .guilds .section .connected-account .connected-account-name a{color: rgba(0, 176, 244, 0.6);font-weight: 700;transition: color 500ms;}
  2347.  
  2348. #user-profile-modal .guilds .section .connected-account:hover .connected-account-name a{color: rgba(0, 176, 244, 1);}
  2349.  
  2350. #user-profile-modal .guilds .guild{color: #a4aeb9;margin: 0 10px;transition: background 300ms;}
  2351.  
  2352. #user-profile-modal .guilds .guild .avatar-large{box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);}
  2353.  
  2354. #user-profile-modal .guilds .guild .avatar-large:empty{border-radius: 15px!important;}
  2355.  
  2356. #user-profile-modal .guilds .guild:hover{border-radius: 5px;color: #fff;}
  2357.  
  2358. #user-profile-modal .guilds .guild .status{border: 2px solid rgba(64, 68, 74, 1);}
  2359. #user-profile-modal .guilds .guild:hover .status{border: 2px solid rgba(133, 141, 150, 0.7);}
  2360.  
  2361. #user-profile-modal .guilds .guild .guild-name .discriminator{display: none;}
  2362. #user-profile-modal .guilds .guild:hover .guild-name .discriminator{display: block;}
  2363.  
  2364.  
  2365. #user-profile-modal footer .btn.add-friend{transition: background 500ms;}
  2366.  
  2367. #user-profile-modal .scroller-wrap .scroller::-webkit-scrollbar{width:0px;}
  2368.  
  2369. .theme-dark #friends .friends-header .tab-bar .tab-bar-item.tab-bar-item-primary .badge {background-color: #f04747;color: #fff;}
  2370.  
  2371. .theme-dark #friends .friends-header .tab-bar .tab-bar-item.tab-bar-item-primary:hover:not(.selected) .badge {color: #ffffff;}
  2372.  
  2373. .theme-dark #friends .friends-header .tab-bar .tab-bar-item.tab-bar-item-primary.selected .badge {background-color: #f04747;color: #fff;}
  2374.  
  2375. #friends .friends-table .friends-row .friends-column-guilds .avatar-small {background-color: var(--main-color);}
  2376.  
  2377. .spinner-pulsing-ellipsis .spinner-item {background-color: var(--main-color);}
  2378. .gitbutton {
  2379.     font-size: 14px;
  2380.     font-weight: 600;
  2381.     color: #fff !important;
  2382.     background-color: var(--main-color);
  2383.     padding: 8px 8px;
  2384.     border-radius: 3px;
  2385.     position: absolute;
  2386.     bottom: 0px;
  2387.     right: 0px;
  2388.     text-align: center;
  2389. }
  2390. .docsbutton {
  2391.     font-size: 14px;
  2392.     font-weight: 600;
  2393.     color: #fff !important;
  2394.     background: var(--main-color);
  2395.     padding: 8px 8px;
  2396.     border-radius: 3px;
  2397.     position: absolute;
  2398.     bottom: 0px;
  2399.     right: 69px;
  2400.     text-align: center;
  2401. }
  2402. .serverbutton {
  2403.     font-size: 14px;
  2404.     font-weight: 600;
  2405.     color: #fff !important;
  2406.     background: var(--main-color);
  2407.     padding: 8px 11px;
  2408.     border-radius: 3px;
  2409.     position: absolute;
  2410.     bottom: 0px;
  2411.     right: 182px;
  2412.     text-align: center;
  2413. }
  2414. .donatebutton {
  2415.     font-size: 14px;
  2416.     font-weight: 600;
  2417.     color: #fff !important;
  2418.     background: var(--main-color);
  2419.     padding: 8px 8px;
  2420.     border-radius: 3px;
  2421.     position: absolute;
  2422.     bottom: 0px;
  2423.     right: 255px;
  2424.     text-align: center;
  2425. }
  2426. .gitbutton:hover, .docsbutton:hover, .serverbutton:hover, .donatebutton:hover {
  2427.     background-color: var(--hover-color);
  2428. }
  2429. .jump-to-present-bar button:first-of-type {
  2430.     display: none;
  2431. }
  2432. .jump-to-present-bar {
  2433.     width: 130px!important;
  2434.     right: 10px!important;
  2435.     left: auto!important;
  2436. }
  2437. .popout-menu {
  2438.     background: rgba(0, 0, 0, 0.83);
  2439. }
  2440. .popout-menu .popout-menu-icon, .popout-menu .popout-menu-item:hover .popout-menu-icon {
  2441.     -webkit-filter: grayscale(100%);
  2442. }
  2443. .popout-menu .popout-menu-separator {
  2444.     border-bottom: transparent;
  2445. }
  2446. .popout-menu .popout-menu-item, .popout-menu .popout-menu-item.invite {
  2447.     color: #bdbdbd;
  2448. }
  2449. .popout-menu .popout-menu-item:hover {
  2450.     background-color: var(--main-color);
  2451.     color: #f7f7f7;
  2452. }
  2453. .popout-menu .popout-menu-item:hover.invite {
  2454.     color: #f7f7f7;
  2455. }
  2456. .popout {
  2457.     box-shadow: 0 3px 6px rgba(0,0,0,.2);
  2458. }
  2459. .user-settings-modal-keybinds .user-settings-modal-keybinds-header {
  2460.     border-bottom: 1px solid #151515;
  2461. }
  2462. .channel-notices .channel-notice.invite {
  2463.     background: url(https://discordapp.com/assets/bf625d222187f542b9d7179109422e2c.svg) center 20px no-repeat rgba(0, 0, 0, 0.83);
  2464. }
  2465. #instant-invite-modal .form-actions, #instant-invite-modal-advanced .form-actions {
  2466.     background-color: rgba(0, 0, 0, 0.83);
  2467.     border-top: 2px solid #151515;
  2468. }
  2469. .instant-invite-modal {
  2470.     background: transparent;
  2471. }
  2472. #instant-invite-modal .form-header header {
  2473.     color: #d2d2d2;
  2474. }
  2475. #instant-invite-modal .blurb {
  2476.     color: #ffffff;
  2477. }
  2478. #instant-invite-modal .expire-text {
  2479.     color: #c7c7c7;
  2480. }
  2481. #instant-invite-modal .copy {
  2482.     background-color:  var(--main-color);
  2483. }
  2484. #instant-invite-modal-advanced .form-actions .btn {
  2485.     padding: 9px;
  2486.     top: 9px;
  2487. }
  2488. .guild-settings-modal-emoji .guild-settings-modal-emoji-header h6 {
  2489.     color: #fff;
  2490. }
  2491. .guild-settings-modal-emoji .guild-settings-modal-emoji-header p {
  2492.     color: #c5c5c5;
  2493. }
  2494. .guild-settings-modal-emoji .guild-settings-modal-emoji-header {
  2495.     border-bottom: 1px solid transparent;
  2496. }
  2497. .guild-settings-modal-emoji .no-emoji p {
  2498.     color: #dadada;
  2499. }
  2500. .guild-settings-modal-emoji .table-header {
  2501.     color: #ececec;
  2502. }
  2503. .guild-settings-modal-emoji .emoji-uploader .emoji-uploader-username {
  2504.     color: #fff;
  2505. }
  2506. .guild-settings-modal-emoji .emoji-row .emoji-name {
  2507.     background: rgba(0, 0, 0, 0.52);
  2508.     color: #fff;
  2509. }
  2510. .guild-settings-modal-emoji .emoji-row:hover .emoji-name {
  2511.     background-color: rgba(0, 0, 0, 0.39);
  2512.     border-color: transparent;
  2513. }
  2514. .guild-settings-modal .emoji-row .btn.btn-danger, .guild-settings-modal .member-buttons .btn.btn-danger {
  2515.     border: 1px solid #9c2121;
  2516.     color: #ffffff;
  2517. }
  2518. .guild-settings-modal .emoji-row .btn, .guild-settings-modal .member-buttons .btn, .guild-settings-modal .emoji-row .btn.btn-danger:hover {
  2519.     background: #9c2121;
  2520. }
  2521. .guild-settings-modal-emoji .emoji-row {
  2522.     border-bottom: 2px solid rgba(0, 0, 0, 0.22);
  2523. }
  2524. .emoji-picker .scroller .emoji-item.selected {
  2525.     background-position: center center !important;
  2526.     background-repeat: no-repeat !important;
  2527.     -webkit-background-size: contain !important;
  2528.     -moz-background-size: contain !important;
  2529.     background-size: contain !important;
  2530. }
  2531. .status-picker .popout-menu-item:nth-child(1) {
  2532.     background: #43b581 !important;
  2533.     color: #fff;
  2534. }
  2535. .status-picker>.popout-menu-separator {
  2536.     border-bottom: 0px solid #000 !important;
  2537. }
  2538. .status-picker .popout-menu-item:nth-child(3) {
  2539.     background: #faa61a !important;
  2540.     color: #fff;
  2541. }
  2542. .status-picker .popout-menu-item:nth-child(4) {
  2543.     background: #f04747 !important;
  2544.     color: #fff;
  2545.     transition: .2s all linear;
  2546.     height: 38px;
  2547. }
  2548. .status-picker .popout-menu-item:nth-child(4) >  .status-icon-text > .status-text{
  2549.     margin-top: 19px;
  2550.     transition: .2s all linear;
  2551. }
  2552. .status-picker .popout-menu-item:nth-child(4) >  .helper{
  2553.     margin-top: -3px;
  2554.     opacity: 0;
  2555.     color: #fff;
  2556.     text-align: center;
  2557.     padding-right: 26px;
  2558. }
  2559. .status-picker .popout-menu-item:nth-child(4):hover >  .helper{
  2560.     opacity: 1;
  2561.     transition: .2s all linear;
  2562. }
  2563. .status-picker .popout-menu-item:nth-child(4):hover >  .status-icon-text > .status-text{
  2564.     opacity: 0;
  2565.     transition: .2s all linear;
  2566. }
  2567. .status-picker .popout-menu-item:nth-child(5) {
  2568.     background: #747f8d !important;
  2569.     color: #fff;
  2570.     transition: .2s all linear;
  2571.     height: 38px;
  2572. }
  2573. .status-picker .popout-menu-item:nth-child(5) >  .status-icon-text > .status-text{
  2574.     margin-top: 16px;
  2575.     transition: .2s all linear;
  2576. }
  2577. .status-picker .popout-menu-item:nth-child(5) >  .helper{
  2578.     margin-top: -5px;
  2579.     opacity: 0;
  2580.     color: #fff;
  2581.     margin: -3px 0 0 19px; 
  2582. }
  2583. .status-picker .popout-menu-item:nth-child(5):hover >  .helper{
  2584.     opacity: 1 !important;
  2585.     transition: .2s all linear;
  2586. }
  2587. .status-picker .popout-menu-item:nth-child(5):hover >  .status-icon-text > .status-text{
  2588.     opacity: 0 !important;
  2589.     transition: .2s all linear;
  2590. }
  2591. .status-icon-text > .status-text {
  2592.     margin-left: -13px;
  2593. }
  2594. .status-icon-text > .status {
  2595.     margin-right: 0px !important;
  2596. }
  2597. .status-picker .popout-menu-item {
  2598.     -webkit-align-items: center;z
  2599.     align-items: center;
  2600. }
  2601. .status-picker.popout-menu {
  2602.     background: transparent !important;
  2603. }
  2604. .quick-message.isBlocked {
  2605.     background: rgba(0, 0, 0, 0.53);
  2606. }
  2607. .user-popout .body .roles .member-roles::-webkit-scrollbar {
  2608.     width: 0px;
  2609.     padding-bottom: 7px;
  2610. }
  2611. .user-popout .body .roles .member-roles {
  2612.     overflow-y: scroll;
  2613.     max-height: 179px;
  2614. }
  2615. .user-popout .body .roles .member-roles {
  2616.     padding-bottom: 7px;
  2617. }
  2618. .user-popout .body {
  2619.     display: flex;
  2620.     padding-bottom: 2px;
  2621.     padding-top: 10px;
  2622. }
  2623. .user-popout .header {
  2624.     height: 100px;
  2625. }
  2626. .user-popout .avatar-wrapper {
  2627.     position: fixed;
  2628.     margin: 4px 0px 14px -150px;
  2629. }
  2630. .user-popout {
  2631.     width: 450px;
  2632. }
  2633. .section.roles {
  2634.     max-width: 250px;
  2635.     width: 250px;
  2636. }
  2637. .section.notes, .section.roles {
  2638.     background: rgba(0, 0, 0, 0.53);
  2639.     margin-left: 15px;
  2640.     border-radius: 3px;
  2641. }
  2642. .user-popout .username-wrapper .activity, .user-popout .username-wrapper .discord-tag, .user-popout .username-wrapper .nickname {
  2643.     text-align: left;
  2644.     margin-left: 138px;
  2645.     white-space: nowrap;
  2646.     text-overflow: ellipsis;
  2647.     overflow: hidden;
  2648. }
  2649. .user-popout .username-wrapper .nickname::before {
  2650.     content: "Nickname:";
  2651.     color: #cecece;
  2652.     padding-right: 3px;
  2653. }
  2654. .user-popout .username-wrapper .nickname {
  2655.     margin-bottom: 2px;
  2656. }
  2657. .creation-date-wrapper {
  2658.     margin-left: -33px;
  2659. }
  2660. #user-profile-modal .header:after {
  2661.     content: ' ';
  2662.     background-color: transparent;
  2663.     background-image: linear-gradient(-180deg,transparent,transparent);
  2664. }
  2665. #user-profile-modal .avatar-wrapper {
  2666.     background-color: transparent;
  2667.     top: 8px;
  2668.     left: 0px;
  2669. }
  2670. #user-profile-modal .header .header-info .header-info-inner .discord-tag {
  2671.     color: #e4e4e4;
  2672. }
  2673. #user-profile-modal .header .header-info .header-info-inner .discord-tag .discriminator {
  2674.     color: #969696;
  2675. }
  2676. .avatar-profile {
  2677.     width: 100px;
  2678.     height: 100px;
  2679.     background-size: cover;
  2680. }
  2681. #user-profile-modal .actions {
  2682.     padding-top: 14px;
  2683.     margin-left: -50px;
  2684. }
  2685. .connected-account {
  2686.     width: 500px !important;
  2687. }
  2688. .connected-accounts {
  2689.     max-width: 85%;
  2690.     min-width: 85%;
  2691. }
  2692. #user-profile-modal .guilds .section .connected-accounts .connected-account .connected-account-name-inner .connected-account-name {
  2693.     color: #bbbbbb;
  2694. }
  2695. #user-profile-modal .guilds .section .connected-accounts .connected-account {
  2696.     border: 2px solid #000;
  2697.     background: #000;
  2698. }
  2699. #user-profile-modal .header .header-info .header-info-inner .activity {
  2700.     color: #929292;
  2701. }
  2702. .bot-tag { background: var(--main-color);}
  2703. .search-bar-clear { background: var(--main-color);}
  2704. .mention {
  2705.     color: var(--main-color);
  2706. }
  2707. .mentioned .mention:hover {
  2708.     color: #fff !important;
  2709.     opacity: 0.9;
  2710. }
  2711. .theme-dark .message-group .comment .markup .mention {
  2712.     background-color: ;
  2713.     color: var(--main-color);
  2714.     background: rgba(0,0,0,0.7);
  2715.     border-radius: 3px;
  2716.     padding: 1px 4px 2px 3px;
  2717. }
  2718. .theme-dark .message-group .comment .markup .mention:hover {
  2719.     background-color: var(--main-color);
  2720.     color: #fff;
  2721.     opacity: 0.9;
  2722. }
  2723. .context-menu .item-toggle .checkbox {
  2724.     margin-right: 18px;
  2725. }
  2726. .embed-color-pill[style*='background-color: rgb(114, 137, 218);'] {
  2727.     background-color: var(--main-color) !important;
  2728. }
  2729. .premium-settings .subscription.active, .premium-settings .subscription {
  2730.     background: var(--main-color) !important;
  2731. }
  2732. .premium-settings .subscription .btn-filled, .premium-settings .subscription.active .btn-filled {
  2733.     color: var(--main-color);
  2734. }
  2735. .premium-settings .payment-subhead {
  2736.     color: #fff;
  2737. }
  2738. .premium-settings .payment-method .payment-info .card-info .card-description {
  2739.     color: #dbdbdb;
  2740. }
  2741. .premium-settings .payment-method .payment-info .card-info .card-description strong {
  2742.     color: var(--main-color);
  2743. }
  2744. .premium-settings .payment-method .payment-info .card-info .card-details {
  2745.     color: #a2a2a2;
  2746. }
  2747. .premium-settings .billing-history-list li.header-row {
  2748.     color: var(--hover-color);
  2749. }
  2750. .premium-settings .billing-history-list li {
  2751.     color: #a1a1a1;
  2752. }
  2753. .premium-settings .premium-header {
  2754.     border-bottom: 0px solid transparent;
  2755. }
  2756. .btn-stroked {
  2757.     border: 2px solid var(--main-color);
  2758.     color: var(--main-color);
  2759.     transition: .2s all linear;
  2760. }
  2761. .btn-stroked:hover {
  2762.     background-color: var(--main-color);
  2763.     color: #fff;
  2764. }
  2765. .theme-dark .recent-mentions-popout .mention-filter .label {
  2766.     color: var(--main-color);
  2767.     font-weight: bold;
  2768. }
  2769. #user-profile-modal .header .header-info .badge-premium {
  2770.     margin-right: -46px;
  2771.     background-size: 38px;
  2772.     background-repeat: no-repeat;
  2773.     left: 99px;
  2774. }
  2775. .badge-premium {
  2776.     top: 89px !important;
  2777.     right: 540px;
  2778.     position: absolute;
  2779. }
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!