SniiKz

Delta

Oct 24th, 2020
128
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 25.46 KB | None | 0 0
  1. @import url(https://fonts.googleapis.com/css?family=Ubuntu:400,700&subset=cyrillic,cyrillic-ext,greek,greek-ext,latin-ext);
  2. @import url(https://fonts.googleapis.com/css?family=Roboto:400,700&subset=cyrillic,cyrillic-ext,greek,greek-ext,latin-ext,vietnamese);
  3. @import url(https://fonts.googleapis.com/css?family=Oswald:400,700&subset=latin-ext);
  4. @import url(https://fonts.googleapis.com/css?family=Press+Start+2P&display=swap&subset=cyrillic,cyrillic-ext,greek,latin-ext);
  5. @import url(https://fonts.googleapis.com/css?family=Pacifico&display=swap&subset=cyrillic,cyrillic-ext,latin-ext,vietnamese);
  6. @font-face {font-family: "VCR OSD Mono";
  7. src: url("https://db.onlinewebfonts.com/t/2545d122b16126676225a5b52283ae23.eot"); /* IE9*/
  8. src: url("https://db.onlinewebfonts.com/t/2545d122b16126676225a5b52283ae23.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
  9. url("https://db.onlinewebfonts.com/t/2545d122b16126676225a5b52283ae23.woff2") format("woff2"), /* chrome firefox */
  10. url("https://db.onlinewebfonts.com/t/2545d122b16126676225a5b52283ae23.woff") format("woff"), /* chrome firefox */
  11. url("https://db.onlinewebfonts.com/t/2545d122b16126676225a5b52283ae23.ttf") format("truetype"), /* chrome firefox opera Safari, Android, iOS 4.2+*/
  12. url("https://db.onlinewebfonts.com/t/2545d122b16126676225a5b52283ae23.svg#VCR OSD Mono") format("svg"); /* iOS 4.1- */
  13. }
  14.  
  15. body,
  16. html {
  17. width: 100%;
  18. height: 100%;
  19. margin: 0;
  20. padding: 0;
  21. -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  22. font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  23. font-size: 14px;
  24. line-height: 1.42857143;
  25. color: #333;
  26. overflow: hidden;
  27. background-color: black;
  28. background-size: cover;
  29. }
  30.  
  31.  
  32.  
  33.  
  34. #canvas, #webgl
  35. #debug-overlay {
  36. position: absolute;
  37. left: 0;
  38. right: 0;
  39. top: 0;
  40. bottom: 0;
  41. width: 100%;
  42. height: 100%
  43. }
  44.  
  45.  
  46. ::-moz-selection {
  47. background-color: #01d9cc !important
  48. }
  49.  
  50. ::selection {
  51. background-color: #01d9cc !important
  52. }
  53.  
  54. ::-webkit-input-placeholder {
  55. color: #8096a7 !important
  56. }
  57.  
  58. ::-moz-placeholder {
  59. color: #8096a7 !important
  60. }
  61.  
  62.  
  63.  
  64.  
  65. #overlays {
  66. font-family: 'Noto Sans', sans-serif;
  67. position: absolute;
  68. left: 0;
  69. right: 0;
  70. top: 0;
  71. bottom: 0;
  72. z-index: 200;
  73. }
  74.  
  75. #helloContainer{
  76. z-index: 120;
  77. box-sizing: border-box !important;
  78. position:absolute;
  79. left:50%;
  80. top:50%;
  81. transform:translateX(-50%) translateY(-50%);
  82. display: flex;
  83. justify-content: space-around;
  84. }
  85.  
  86. .popover{
  87. z-index:500;
  88. }
  89. :root {
  90. --color-bg-menu:#00243e;
  91. --color-menu: #ffffff;
  92. --color-active: rgba(255, 255, 255, 0.078);
  93. --color-active-text: #f5f5f5;
  94. --color-active-hover: rgba(255, 255, 255, 0.138);
  95. --color-active-hover-text: #01d9cc;
  96. --color-unactive: #002f52;
  97. --color-button:#0099c0;
  98.  
  99. --color-button-text:#ffffff;
  100.  
  101. --c-button-a: #00b9e8;
  102. --c-button-b: #814ee3;
  103. --c-button-c: #df00c6;
  104. }
  105.  
  106. .fa, .fab, .fad, .fal, .far, .fas {
  107. line-height: inherit !important;
  108. }
  109.  
  110. *{
  111. cursor: context-menu;
  112. -webkit-user-select: none !important;
  113. -moz-user-select: none !important;
  114. user-select: none !important
  115. }
  116. *, *:before, *:after {
  117. box-sizing: inherit;
  118. }
  119. a{
  120. color: var(--color-active-hover-text)
  121.  
  122. }
  123.  
  124. .BG{
  125. background-repeat: repeat;
  126. background-position: top center;
  127. background: var(--color-bg-menu);
  128. }
  129.  
  130. .container {
  131. --box-shadow: inset 0px 0px 5px 1px rgba(0,0,0,0.75);
  132. font-size: 13px;
  133. display:block;
  134. margin: 2px;
  135. color: var(--color-menu);
  136. opacity: 1;
  137. position: relative;
  138. }
  139.  
  140. .container.left{
  141. width: 190px;
  142. height: 200px;
  143. }
  144. .container.main{
  145. width: 350px;
  146. height: 550px;
  147. }
  148. .container.right{
  149. width: 190px;
  150. height: 200px;
  151. }
  152.  
  153. .float-button {
  154. position: absolute;
  155. margin: 9px;
  156. width: 40px;
  157. height: 40px;
  158. text-align: center;
  159. line-height: 40px;
  160. background: var(--color-active);
  161. border-radius: 50%;
  162. }
  163. .float-button:hover{
  164. background: var(--color-active-hover);
  165. color: var(--color-active-hover-text);
  166. }
  167.  
  168. ul.tabs {
  169. padding: 0;
  170. margin: 0;
  171. display: flex;
  172. background: var(--color-active);
  173. color: var(--color-active-text);
  174. }
  175.  
  176. li.tab-button{
  177. -box-shadow: inset 0px 0px 5px 1px rgba(0,0,0,0.75);
  178. width: 100%;
  179. list-style: none;
  180. line-height: 36px;
  181. height:36px;
  182. text-align: center;
  183. transition: background,color .2s;
  184. }
  185.  
  186. li.tab-button.active, li.tab-button:hover {
  187. -box-shadow: inset 0px 0px 10px 1px rgb(231, 54, 0);
  188. background: var(--color-active);
  189. color: var(--color-active-hover-text);
  190. }
  191.  
  192. .tab-container{
  193. flex:1;
  194. position:relative;
  195. overflow-y:auto;
  196. height: 100%;
  197. --box-shadow: inset 0px 0px 5px 1px rgba(0,0,0,0.75);
  198. display: none;
  199. }
  200. .tab-container.active{
  201. --box-shadow: inset 0px 0px 5px 1px rgba(53, 245, 0, 0.75);
  202. display: block;
  203. }
  204.  
  205.  
  206. .content {
  207. height:100%;
  208. display:flex;
  209. flex-direction: column;
  210. align-content: stretch;
  211. }
  212. .content-bottom {
  213. padding: 8px;
  214. display:flex;
  215. flex-direction: row;
  216. align-content: stretch;
  217. }
  218. .restore-settings{
  219. font-size: 12px;
  220. color: var(--color-active-hover-text);
  221. text-align: center;
  222. }
  223. .button-a{
  224. display: inline-block;
  225. font-size: 18px;
  226. padding: 6px 12px;
  227. line-height: 1.42857143;
  228. text-align: center;
  229. white-space: nowrap;
  230. vertical-align: middle;
  231. background: var(--c-button-a);
  232. text-transform: uppercase;
  233. font-weight: 700;
  234. width: 100%;
  235.  
  236. }
  237.  
  238. /* MAINMENU */
  239.  
  240. .input-group-row {
  241. width: 100%;
  242. position: relative;
  243. display: table;
  244. border-collapse: separate;
  245. }
  246.  
  247. .input-group-row .input-box-cell{
  248. display: table-cell;
  249. vertical-align: top;
  250. border:0px;
  251. padding: 2px;
  252. height: 20px;
  253. color:var(--color-active-text)
  254. }
  255. .input-group-row .input-box-cell div,
  256. .input-group-row .input-box-cell .input,
  257. .input-group-row .input-box-cell select{
  258. height: 34px;
  259. padding: 6px;
  260. font-size: 14px;
  261. width:100%;
  262. border: 0px;
  263. color:var(--color-active-text);
  264. }
  265.  
  266. .input-group-row .input-box-cell input,
  267. .input-group-row .input-box-cell select{
  268. background-color: var(--color-active);
  269. }
  270.  
  271. .input-group-row .input-box-cell .input:focus,
  272. .input-group-row .input-box-cell select:focus,
  273. .input-group .input:focus,
  274. .input-group select:focus
  275. {
  276. outline: 0;
  277. box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(255, 255, 255, 0.741);
  278. background: var(--color-active-hover);
  279. }
  280. .input-group-row select{border-radius: 1px;}
  281. .input-group-row input::placeholder {
  282. color: rgba(255, 255, 255, 0.3);
  283.  
  284. }
  285.  
  286. .input-group-row .input-box-cell input:hover,
  287. .input-group-row .input-box-cell select:hover,
  288. .input-group input:hover,
  289. .input-group select:hover{
  290. background: var(--color-active-hover);
  291. }
  292.  
  293. .button{
  294. width: 100%;
  295. height:34px;
  296. display: inline-block;
  297. font-size: 14px;
  298. padding: 6px 12px;
  299. line-height: 1.42857143;
  300. text-align: center;
  301. white-space: nowrap;
  302. vertical-align: middle;
  303. text-transform: uppercase;
  304. font-weight: 700;
  305. }
  306.  
  307. .button.b{
  308. background: var(--c-button-b);
  309. color:var(--color-button-text);
  310. }
  311.  
  312. .button.b:active {
  313. background: var(--c-button-a);
  314. color:var(--color-button-text);
  315. }
  316.  
  317. .button .fas,
  318. .button .fab {
  319. width: 22px;
  320. }
  321. /* SETTINGS */
  322. .cursor-box{
  323. padding: 5px;
  324. width:40px;
  325. height:40px;
  326. display: inline-block;
  327. } .cursor-box .active{
  328. background: var(--color-active);
  329. }
  330.  
  331. .setting-box{
  332. padding: 5px;
  333. display: inline-block;
  334. width: 50%;
  335. }
  336.  
  337. .option-title {
  338. font-size: 14px;
  339. padding: 6px 12px;
  340. vertical-align: middle;
  341. text-transform: uppercase;
  342. font-weight: 700;
  343. margin: 0;
  344. }
  345. .options-box {
  346. --outline: 1px solid rgb(16, 225, 218);
  347. margin: 0px 6px;
  348. }
  349.  
  350. .option-box,
  351. .slider-box,
  352. .preset-box,
  353. .font-box,
  354. .input-box{
  355. padding: 10px;
  356. display: block;
  357. }
  358.  
  359. .title{
  360. -font-size: 13px;
  361. }
  362. .option-box .title{
  363. display: block;
  364. width: 100%;
  365. }
  366.  
  367. label.option-box:hover{
  368. background-color: var(--color-active)
  369. }
  370.  
  371. .input-group {
  372. width: 100%;
  373. position: relative;
  374. display: table;
  375. border-collapse: separate;
  376. }
  377.  
  378. .input-group input,.input-group select{
  379. display: table-cell;
  380. vertical-align: top;
  381. border:0px;
  382. width: 100%;
  383. height: 20px;
  384. color:var(--color-active-text)
  385. }
  386. .input-group select{border-radius: 1px;}
  387. .input-group input::placeholder {
  388. color: rgba(255, 255, 255, 0.3);
  389. }
  390. .slider-box .input-group{
  391. margin-top: 4px;
  392. }
  393.  
  394. .setting-box .input,
  395. .preset-box select,
  396. .font-box select,
  397. .input-box input,
  398. .cursor-box .active{
  399. background-color: var(--color-active)
  400. }
  401.  
  402. .hotkey-box{
  403. display: table;
  404. width:100%;
  405. font-size: 13px;
  406. padding: 2px;
  407. }
  408. .hotkey-title,
  409. .default-key,
  410. .custom-key{
  411. display: table-cell;
  412. padding: 2px;
  413. vertical-align: bottom;
  414. vertical-align: baseline;
  415. }
  416. .hotkey-title{
  417. -width: 100%;
  418. }
  419. .hotkey-title div{
  420. width: 100%;
  421. }
  422. .default-key{
  423. width:50px;
  424. }
  425. .default-key div{
  426. text-align: center;
  427. background: rgba(28, 140, 42, 0.22);
  428. border-radius: 8px;
  429. white-space: nowrap;
  430. }
  431. .custom-key{
  432. width:50px;
  433. }
  434. .custom-key-in, .command-in{
  435. width:100%;
  436. vertical-align: middle;
  437. border:0px;
  438. width: 100%;
  439. height: 20px;
  440. color:var(--color-active-text);
  441. background-color: var(--color-active)
  442. }
  443. .custom-key-in::placeholder {
  444. color: rgba(255, 255, 255, 0.3);
  445. }
  446.  
  447.  
  448.  
  449.  
  450. .colorpicker-input-addon, .colorpicker-input-addon i {
  451. display: table-cell;
  452. position: relative;
  453. vertical-align: top;
  454. padding: 0;
  455. width: 20px;
  456. height: 20px
  457. }
  458. .colorpicker-input-addon:before {
  459. width: 20px;
  460. height: 20px;
  461. }
  462.  
  463.  
  464.  
  465.  
  466. #profiles{
  467. -height:200px;
  468. position:relative;
  469. margin: auto;
  470. -left:50%;
  471. -transform:translateX(-50%);
  472. -width:500px;
  473. }
  474.  
  475.  
  476. #mainButtons{
  477. position:relative;
  478. left:50%;
  479. transform:translateX(-50%);
  480. width:500px;
  481. }
  482. #connector{
  483.  
  484. border-radius:5px;
  485. background:gray;
  486. padding:6px;
  487. }
  488. #connector .w3-col,#connector .w3-rest{
  489. padding:4px;
  490. }
  491.  
  492. .b {
  493. -border: 1px solid blue;
  494. }
  495.  
  496.  
  497. #skins2{
  498. -border:1px solid;
  499. height: 180px;
  500. width: 180px;
  501. position:relative;
  502. -transform: translateX(-50%);
  503. -left: 50%;
  504. }
  505. #skin-preview2{
  506. z-index:1;
  507. width:100%;
  508. height:100%;
  509. border-radius:50%;
  510. top: 50%;left: 50%;
  511. transform: translate(-50%, -50%);
  512. position:absolute;
  513. overflow:hidden;
  514. background: var(--color-active);
  515. }
  516.  
  517. #skins > #skin-preview2{
  518. z-index:100;
  519. width:200px;
  520. height:200px;
  521. }
  522.  
  523. .thumb{
  524. vertical-align:bottom;
  525. text-align:center;
  526. background:var(--color-active);
  527. width:40px;height:40px;
  528. border-radius:50%;
  529. top: 50%;left: 50%;
  530. transform: translate(-50%, -50%);
  531. position:absolute;
  532. transition:transform 100ms;
  533. overflow:hidden;
  534. }
  535.  
  536. .thumb.selectedA:after{
  537. content:'1P';
  538. position: absolute;
  539. top:0;
  540. right:0;
  541. line-height: 40px;
  542. width:inherit;
  543. color: var(--color-active-text);
  544. text-shadow:0 0 1px red;
  545. }
  546. .thumb.selectedB:after{
  547. content:'2P';
  548. position: absolute;
  549. top:0;
  550. right:0;
  551. line-height: 40px;
  552. width:inherit;
  553. color: var(--color-active-text);
  554. text-shadow: 0 0 1px orange;
  555. }
  556.  
  557. .thumb.selectedA.selectedB:after{
  558. content:'1/2';
  559. }
  560.  
  561.  
  562. .thumb.selectedX:after, .thumb.selectedA.selectedB.selectedX:after {
  563. content: 'X';
  564. background: rgba(148, 26, 26, 0.55);
  565. position: absolute;
  566. top: 0;
  567. right: 0;
  568. line-height: 40px;
  569. width: inherit;
  570. color: var(--color-active-text);
  571. text-shadow: 0 0 1px orange;
  572. }
  573.  
  574. .selectedA{
  575. z-index:300 !important;
  576. box-shadow: 0 0 0 1px rgb(0, 199, 202);
  577. }
  578. .selectedB{
  579. z-index:300 !important;
  580. box-shadow: 0 0 0 1px orange;
  581. }
  582. .selectedX{
  583. z-index:300 !important;
  584. box-shadow: 0 0 0 1px red;
  585. }
  586.  
  587. .thumb:hover{
  588. z-index:300 !important;
  589. box-shadow: 0 0 0 1px red;
  590. }
  591.  
  592. #skins2 img{height:100%;width:100%}
  593.  
  594.  
  595. .skin-button {
  596. background: var(--color-active);
  597. width: 30px;
  598. height: 15px;
  599. line-height: normal;
  600. border-radius: 10px;
  601. bottom: -12%;
  602. left: 40%;
  603. z-index: 198;
  604. position: absolute;
  605. text-align: center;
  606. transform: translate(-50%, -50%);
  607. }
  608.  
  609. .skin-button#add{
  610. left: 40%;
  611. }
  612.  
  613. .skin-button#rem{
  614. left: 60%;
  615. }
  616.  
  617. /*SCROLLBAR*/
  618. .os-host-transition>.os-scrollbar, .os-host-transition>.os-scrollbar-corner {
  619. -webkit-transition: none !important;
  620. transition: none !important;
  621. }
  622. .os-scrollbar.os-scrollbar-horizontal{
  623. display: none;
  624. }
  625. .os-host-transition>.os-scrollbar, .os-host-transition>.os-scrollbar-corner {
  626. -webkit-transition: opacity 0s, visibility .3s,top .3s,right .3s,bottom .3s,left .3s;
  627. transition: opacity 0s, visibility .3s,top .3s,right .3s,bottom .3s,left .3s;
  628. }
  629. /* RANGE SETTINGS*/
  630.  
  631. .slidecontainer {
  632. width: 100%;
  633. }
  634.  
  635. input[type="range"]:focus{
  636. box-shadow: inset 0 1px 3px rgba(0, 0, 0, .4);
  637. }
  638.  
  639. input[type="range"] {
  640. -webkit-appearance: none;
  641. width: 100%;
  642. height: 10px;
  643. border-radius: 5px;
  644. background: #d3d3d3;
  645. background-color: var(--color-active);
  646. box-shadow: inset 0 1px 3px rgba(0, 0, 0, .4);
  647. outline: none;
  648. -opacity: 0.7;
  649. --webkit-transition: .2s;
  650. -transition: opacity .2s;
  651. }
  652.  
  653. input[type="range"]:hover {
  654. -opacity: 1;
  655. }
  656.  
  657. input[type="range"]::-webkit-slider-thumb {
  658. -webkit-appearance: none;
  659. appearance: none;
  660. width: 20px;
  661. height: 20px;
  662. border-radius: 50%;
  663. background-color: white;
  664. cursor: pointer;
  665. box-shadow: 0 1px 3px rgba(0,0,0,0.4), inset 0px 0px 2px rgba(0, 0, 0, .4);
  666. }
  667.  
  668. input[type="range"]::-moz-range-thumb {
  669. width: 20px;
  670. height: 20px;
  671. border-radius: 50%;
  672. background-color: white;
  673. cursor: pointer;
  674. }
  675.  
  676.  
  677. /* SWITCH SETTINGS*/
  678.  
  679. .switch {
  680. vertical-align: middle;
  681. position: relative;
  682. display: inline-block;
  683. width: 38px;
  684. height: 20px;
  685. }
  686.  
  687. .switch input {display:none;}
  688.  
  689. .slider {
  690. position: absolute;
  691. cursor: pointer;
  692. top: 0;
  693. left: 0;
  694. right: 0;
  695. bottom: 0;
  696. background-color: var(--color-active);
  697. -webkit-transition: .4s;
  698. transition: .4s;
  699. box-shadow: inset 0 1px 3px rgba(0, 0, 0, .4);
  700. }
  701.  
  702. .slider:before {
  703. position: absolute;
  704. content: "";
  705. height: 20px;
  706. width: 20px;
  707. left: 0px;
  708. bottom: 0px;
  709. background-color: white;
  710. -webkit-transition: .4s;
  711. transition: .4s;
  712. box-shadow: 0 1px 3px rgba(0,0,0,0.4), inset 0px 0px 2px rgba(0, 0, 0, .4);
  713. }
  714.  
  715. input:checked + .slider {
  716. background-color: #2196F3;
  717. }
  718.  
  719. input:focus + .slider {
  720. box-shadow: 0 0 1px #2196F3;
  721. }
  722.  
  723. input:checked + .slider:before {
  724. left: 18px !important;
  725. }
  726.  
  727. .slider.round {
  728. border-radius: 34px;
  729. }
  730.  
  731. .slider.round:before {
  732. border-radius: 50%;
  733. }
  734.  
  735. /* ORIGINAL SETTINGS*/
  736.  
  737.  
  738. #chat-box,
  739. #leaderboard-info,
  740. #leaderboard-positions,
  741. #message-menu,
  742. #top5-hud {
  743. overflow: hidden;
  744. transform-origin: top left;
  745. }
  746.  
  747.  
  748.  
  749. #menu-footer {
  750. background-color: rgba(0, 0, 0, .5);
  751. font-size: 12px;
  752. text-align: right;
  753. padding: 5px;
  754. overflow: hidden
  755. }
  756.  
  757. #block-warn,
  758. .restore-settings,
  759. .title-box {
  760. text-align: center;
  761. font-size: 12px
  762. }
  763.  
  764. #menu-footer a {
  765. color: #fff
  766. }
  767.  
  768. #menu-footer a.release {
  769. color: inherit;
  770. text-decoration: none
  771. }
  772.  
  773. #menu-footer a.release:hover {
  774. color: #fff
  775. }
  776.  
  777.  
  778. #active-parties {
  779. font-size: 13px;
  780. padding: 10px 0 10px 32px;
  781. margin: 0
  782. }
  783.  
  784. #active-parties.no-parties {
  785. padding: 0
  786. }
  787.  
  788. #leaderboard-info {
  789. white-space: nowrap;
  790. padding: 0 15px
  791. }
  792.  
  793.  
  794. #overlays-hud,
  795. #statsContinue2 {
  796. position: absolute
  797. }
  798.  
  799.  
  800.  
  801. #leaderboard-hud h4,
  802. #top5-hud h5,
  803. .hud-text-center,
  804. .team-top-menu {
  805. text-align: center
  806. }
  807.  
  808. .cursor-box a img {
  809. transition: all .2s linear;
  810. opacity: .6
  811. }
  812.  
  813. .cursor-box a.active img,
  814. .cursor-box a:hover img {
  815. opacity: 1
  816. }
  817.  
  818. .btn-twitter {
  819. height: 32px
  820. }
  821.  
  822. #stats {
  823. width: 350px;
  824. top: 0 !important;
  825. opacity: 1 !important;
  826. margin: 0;
  827. padding: 0
  828. }
  829.  
  830. #stats center {
  831. color: #01d9cc
  832. }
  833.  
  834. #s300x250,
  835. #stats hr,
  836. #statsContinue,
  837. #statsContinue2,
  838. #statsGraph {
  839. width: 350px !important
  840. }
  841.  
  842. #s300x250,
  843. #socialStats,
  844. #stats hr,
  845. #statsContinue,
  846. #statsContinue2,
  847. #statsGraph {
  848. left: 0 !important;
  849. right: 0 !important
  850. }
  851.  
  852. #statsContinue,
  853. #statsContinue2 {
  854. bottom: 0
  855. }
  856.  
  857. #statsText {
  858. color: #fff
  859. }
  860.  
  861. #stats hr {
  862. border-top: 1px solid #002f52
  863. }
  864.  
  865. #statsPelletsContainer,
  866. #statsPlayerCellsEatenContainer,
  867. #statsTimeAliveContainer {
  868. left: 30px
  869. }
  870.  
  871. #statsHighestMassContainer,
  872. #statsTimeLeaderboardContainer,
  873. #statsTopPositionContainer {
  874. right: 30px
  875. }
  876.  
  877. #overlays {
  878. margin-top: 0 !important
  879. }
  880.  
  881. #overlays-hud {
  882. font-family: Ubuntu;
  883. font-size: 20px;
  884. z-index: 100;
  885.  
  886. }
  887.  
  888. .hud,
  889. .hud-b,
  890. .hud-c {
  891. display: none;
  892. background-color: rgba(0, 0, 0, .4);
  893. border-radius: 0;
  894. color: #fff;
  895. font-size: 100%;
  896. padding: 2px 10px;
  897. position: fixed;
  898. pointer-events: none;
  899. border-radius:8px;
  900. }
  901.  
  902. .hud-c {
  903. position: static
  904. }
  905.  
  906. #leaderboard-data,
  907. #minimap,
  908. #minimap-sectors,
  909. .toast .mute-user {
  910. position: absolute
  911. }
  912.  
  913.  
  914.  
  915.  
  916.  
  917.  
  918.  
  919. .hud-main-color,
  920. .time-hud-color {
  921. color: #01d9cc
  922. }
  923.  
  924. .stats-hud-color {
  925. color: #fff
  926. }
  927.  
  928. .top5-mass-color {
  929. color: #bf00aa;
  930. width: 2.3em;
  931. text-align:right;
  932. display: inline-block;
  933. }
  934.  
  935. .team-top-menu {
  936. font-size: 70%;
  937. font-weight: 400;
  938. margin-bottom: 6px;
  939. -opacity: .75
  940. }
  941.  
  942. .team-top-menu a.active,
  943. .team-top-menu a:hover {
  944. font-weight: 700
  945. }
  946.  
  947. #pause-hud {
  948. color: red;
  949. top: 85px;
  950. left: 50%;
  951. transform: translate(-50%, 0);
  952. display: none
  953. }
  954.  
  955. #stats-hud {
  956. left: 10px;
  957. display: block;
  958. transform-origin: bottom left;
  959. transform: scale(1);
  960. }
  961. #stats-hud.hud-top {
  962. top: 10px
  963. }
  964. #stats-hud.hud-bottom {
  965. bottom: 10px
  966. }
  967.  
  968.  
  969.  
  970. .team-top {
  971. width: 200px;
  972. font-size: 100%;
  973. top: 55px;
  974. left: 10px;
  975. white-space: nowrap;
  976. padding: 0px 0px 0px 0px;
  977. }
  978.  
  979.  
  980. .team-top.hud-top {
  981. top: 10px
  982. }
  983. .team-top.hud-bottom {
  984. top: 55px
  985. }
  986.  
  987. .team-top ul {
  988. width:100%;
  989. list-style: none;
  990. padding: 0px;
  991. margin:0;
  992. display: table;
  993. vertical-align:middle;
  994. }
  995. .team-top .title {
  996. padding: 0 10px;
  997. font-size: 95%;
  998. pointer-events: auto;
  999. }
  1000.  
  1001. .team-top .skin {
  1002. background-size:100%;
  1003. border-radius:50%;
  1004. background-repeat: no-repeat;
  1005. width:20px;
  1006. height:20px;
  1007. -position:relative;
  1008. -left:-20px;
  1009. display: table-cell;
  1010. display:none;
  1011. }
  1012.  
  1013. .team-top .info{
  1014. display: table-cell;
  1015. vertical-align:middle;
  1016. }
  1017. .team-top .mass {
  1018. --color: #bf00aa;
  1019. margin-left:.3em;
  1020. min-width: 2.3em;
  1021. text-align:right;
  1022. display: inline-block;
  1023. -background:rgba(0,0,0,0.2)
  1024. }
  1025. .team-top .name{
  1026. margin-left:.3em;
  1027. display: inline-block;
  1028. -background:rgba(0,0,0,0.2)
  1029. }
  1030.  
  1031. #leaderboard-hud,
  1032. #minimap-hud,
  1033. #time-hud {
  1034. right: 10px
  1035. }
  1036.  
  1037. #target-skin,
  1038. #target-skin img {
  1039. width: 1.5em;
  1040. height: 1.5em;
  1041. border-radius: 50%
  1042. }
  1043.  
  1044. #btl-leaderboard-hud .hud-c,
  1045. #leaderboard-data .lb-data,
  1046. #leaderboard-hud,
  1047. #leaderboard-positions span,
  1048. #message-menu a,
  1049. #messages li,
  1050. #overlays-hud[data-gamemode=":battleroyale"] #btl-leaderboard-hud,
  1051. #time-hud {
  1052. display: block
  1053. }
  1054.  
  1055. #chat-emoticons,
  1056. #message,
  1057. .toast-success {
  1058. background-color: rgba(0, 0, 0, .4)
  1059. }
  1060.  
  1061.  
  1062.  
  1063. #minimap-hud {
  1064. height: 200px;
  1065. width: 200px;
  1066. padding: 0;
  1067. bottom: 10;
  1068. border-radius: 8px;
  1069. transform: scale(1);
  1070. transform-origin: bottom right;
  1071. }
  1072.  
  1073. #minimap-sectors {
  1074. margin: 0 0 0 0;
  1075. opacity: .1;
  1076. width: 100%;
  1077. height: 100%;
  1078. }
  1079. #minimap {
  1080. width: 100%;
  1081. height: 100%;
  1082. }
  1083.  
  1084. #leaderboard-hud {
  1085. width: 200px;
  1086. font-size: 100%;
  1087. white-space: nowrap;
  1088. padding: 0;
  1089. top: 10px;
  1090.  
  1091. transform: scale(1);
  1092. transform-origin: top right;
  1093. }
  1094.  
  1095. #leaderboard-hud h4 {
  1096. font-size: 95%;
  1097. font-weight: inherit;
  1098. text-transform: uppercase;
  1099. margin: 0px
  1100. }
  1101.  
  1102. #leaderboard-positions {
  1103. font-size: 70%;
  1104. padding: 0 0 6px 6px;
  1105. }
  1106.  
  1107. #leaderboard-positions .me {
  1108. color: #bf00aa
  1109. }
  1110.  
  1111. #leaderboard-positions .clan-color {
  1112. color: #018cf6
  1113. }
  1114.  
  1115. #leaderboard-data {
  1116. font-size: 70%;
  1117. text-align: right;
  1118. left: -5px;
  1119. transform: translate(-100%, 0)
  1120. }
  1121.  
  1122. #hotkeys-cfg .custom-key-in,
  1123. #hotkeys-inst,
  1124. #target-player,
  1125. #target-summary,
  1126. #time-hud {
  1127. text-align: center
  1128. }
  1129.  
  1130. #time-hud {
  1131. font-size: 75%;
  1132. padding: 6px 0;
  1133. top: 280px
  1134. }
  1135.  
  1136.  
  1137.  
  1138.  
  1139.  
  1140. #btl-hud,
  1141. #quest-hud {
  1142. font-size: 80%;
  1143. bottom: 10px;
  1144. left: 50%;
  1145. transform: translate(-50%, 0);
  1146. display: none
  1147. }
  1148.  
  1149. #btl-leaderboard-hud {
  1150. display: none;
  1151. font-size: 90%;
  1152. padding: 0;
  1153. position: fixed;
  1154. top: 58px;
  1155. right: 10px
  1156. }
  1157.  
  1158. #message-box {
  1159. width: 350px;
  1160. height: auto;
  1161. display: none;
  1162. font-size: 14px;
  1163. padding: 10px;
  1164. overflow: visible;
  1165. position: fixed;
  1166. left: 50%;
  1167. bottom: 82px;
  1168. transform: translate(-50%, 0);
  1169. z-index: 220
  1170. }
  1171.  
  1172. #message-menu {
  1173. width: 100%;
  1174. padding: 5px
  1175. }
  1176.  
  1177. #message-menu a {
  1178. color: #01d9cc;
  1179. text-decoration: none;
  1180. margin-right: 1em;
  1181. opacity: .5;
  1182. pointer-events: auto;
  1183. float: left
  1184. }
  1185.  
  1186. #message-menu a.active,
  1187. #message-menu a:hover {
  1188. text-decoration: none;
  1189. opacity: 1
  1190. }
  1191.  
  1192. #message-menu a.show-chat-emoticons {
  1193. float: right;
  1194. margin: 0
  1195. }
  1196.  
  1197. #message {
  1198. width: 100%;
  1199. height: auto;
  1200. border: none;
  1201. border-radius: 0;
  1202. color: #fff;
  1203. font-size: 100%;
  1204. padding: 10px
  1205. }
  1206. #message:focus{
  1207. outline: 0;
  1208. box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(255, 255, 255, 0.741);
  1209. }
  1210. #chat-emoticons {
  1211. text-align: center;
  1212. width: 100%;
  1213. height: auto;
  1214. display: none;
  1215. padding: 5px 0 5px 5px
  1216. }
  1217.  
  1218. #chat-emoticons .emoticon {
  1219. width: 5%;
  1220. padding: .5%
  1221. }
  1222.  
  1223. #chat-emoticons .emoticon:hover {
  1224. padding: 0;
  1225. width:6%;
  1226. }
  1227.  
  1228. #toast-container {
  1229. width: 280px;
  1230. font-size: 14px
  1231. }
  1232.  
  1233. #toast-container>div {
  1234. width: 100%;
  1235. border-radius: 0;
  1236. box-shadow: none;
  1237. font-size: 100%;
  1238. padding: 10px 10px 10px 50px;
  1239. opacity: 1;
  1240. z-index: 210
  1241. }
  1242.  
  1243. #chat-box,
  1244. #messages {
  1245. width: 280px;
  1246. position: fixed;
  1247. left: 10px
  1248. }
  1249.  
  1250. #toast-container>:hover {
  1251. box-shadow: 0 0 12px #999;
  1252. cursor: pointer
  1253. }
  1254.  
  1255. #toast-container>.toast-success,
  1256. #toast-container>.toast-warning {
  1257. background-image: none !important;
  1258. padding-left: 10px
  1259. }
  1260.  
  1261. .toast-bottom-left {
  1262. bottom: 86px;
  1263. left: 10px
  1264. }
  1265.  
  1266. .toast-warning {
  1267. background-color: rgba(191, 0, 170, .9);
  1268. font-weight: 700
  1269. }
  1270.  
  1271. .toast-info {
  1272. background-color: #018cf6
  1273. }
  1274.  
  1275. #chat-box,
  1276. #messages li {
  1277. background-color: rgba(0, 0, 0, .4);
  1278. word-wrap: break-word
  1279. }
  1280.  
  1281. #messages {
  1282. list-style-type: none;
  1283. font-size: 14px;
  1284. padding: 0;
  1285. margin: 0;
  1286. bottom: 86px;
  1287. z-index: 209
  1288. }
  1289.  
  1290. #messages li {
  1291. width: 100%;
  1292. color: #fff;
  1293. border-radius: 0;
  1294. font-size: 100%;
  1295. padding: 10px;
  1296. margin: 0 0 6px
  1297. }
  1298.  
  1299. #chat-box {
  1300. height: 300px;
  1301. display: none;
  1302. font-size: 14px;
  1303. padding: 3px 0;
  1304. bottom: 92px;
  1305. resize: both;
  1306. z-index: 210
  1307. }
  1308.  
  1309. #chat-box>div {
  1310. font-size: 100%
  1311. }
  1312.  
  1313. .emoticon {
  1314. width: 1.25em;
  1315. height: auto;
  1316. vertical-align: middle;
  1317. }
  1318.  
  1319. .message {
  1320. padding: 3px 12px
  1321. }
  1322.  
  1323. .message-time {
  1324. color: #018cf6
  1325. }
  1326.  
  1327. .message-nick {
  1328. color: #01d9cc;
  1329. font-weight: 700
  1330. }
  1331.  
  1332. .message-text {
  1333. color: #fff
  1334. }
  1335.  
  1336. .command-time {
  1337. color: #bf00aa
  1338. }
  1339.  
  1340. .command-nick,
  1341. .command-text {
  1342. color: #fff;
  1343. font-weight: 700
  1344. }
  1345.  
  1346. .user-list {
  1347. padding-left: 14px
  1348. }
  1349.  
  1350. .mute-user,
  1351. .mute-user:hover {
  1352. color: #01d9cc;
  1353. text-decoration: none;
  1354. vertical-align: middle;
  1355. opacity: .5
  1356. }
  1357.  
  1358. .mute-user:hover {
  1359. opacity: 1
  1360. }
  1361.  
  1362. .toast .mute-user {
  1363. color: #01d9cc;
  1364. display: none;
  1365. top: .1em;
  1366. right: .3em
  1367. }
  1368.  
  1369. .toast .mute-user:hover {
  1370. color: #01d9cc
  1371. }
  1372.  
  1373. .toast:hover .mute-user {
  1374. display: block
  1375. }
  1376.  
  1377. .toast-warning .mute-user,
  1378. .toast-warning .mute-user:hover {
  1379. color: #fff
  1380. }
  1381.  
  1382. #chat-box .message span,
  1383. #messages span,
  1384. .toast span {
  1385. -webkit-user-select: text !important;
  1386. -moz-user-select: text !important;
  1387. user-select: text !important
  1388. }
  1389.  
  1390.  
  1391.  
  1392.  
  1393.  
  1394. .ps-scrollbar-y-rail {
  1395. width: 6px
  1396. }
  1397.  
  1398. .ps-scrollbar-y {
  1399. width: 6px !important;
  1400. background-color: #01d9cc !important;
  1401. right: 0 !important
  1402. }
  1403.  
  1404. .ps-scrollbar-y-rail {
  1405. background: 0 0 !important
  1406. }
  1407.  
  1408. #chat-box .ps-scrollbar-y-rail {
  1409. right: 6px !important
  1410. }
  1411.  
  1412. .rangeslider__handle:after {
  1413. display: none
  1414. }
  1415.  
  1416. .rangeslider__handle {
  1417. width: 22px;
  1418. height: 22px;
  1419. background-image: none;
  1420. border: none;
  1421. box-shadow: 0 1px 3px rgba(0, 0, 0, .4)
  1422. }
  1423.  
  1424. .rangeslider--horizontal {
  1425. height: 4px
  1426. }
  1427.  
  1428. .rangeslider__fill {
  1429. background-color: #01d9cc
  1430. }
  1431.  
  1432.  
  1433. @media screen and (max-height:820px) {
  1434. .submenu-panel {
  1435. max-height: 550px
  1436. }
  1437.  
  1438. #og-settings .submenu-panel {
  1439. max-height: 590px
  1440. }
  1441. }
  1442.  
  1443. @media screen and (max-height:650px) {
  1444. .submenu-panel {
  1445. max-height: 450px
  1446. }
  1447.  
  1448. #og-settings .submenu-panel {
  1449. max-height: 490px
  1450. }
  1451. }
  1452.  
  1453.  
  1454. #verifyUser div div:before,
  1455. #verifyUser div div:after {
  1456. content: '';
  1457. position: absolute;
  1458. left: 0px;
  1459. top: 0px;
  1460. border-radius:5px;
  1461. background: linear-gradient(45deg, #fb0094, #0000ff, #00ff00,#ffff00, #ff0000, #fb0094,
  1462. #0000ff, #00ff00,#ffff00, #ff0000);
  1463. background-size: 400%;
  1464. width: calc(100% - 4px);
  1465. height: calc(100% - 4px);
  1466. z-index: -1;
  1467. animation: steam 20s cubic-bezier(0.15, -0.07, 0.82, 1.04) infinite;
  1468. animation-direction: alternate;
  1469. }
  1470.  
  1471. @keyframes steam {
  1472. 0% {
  1473. background-position: 0 0;
  1474. }
  1475. 50% {
  1476. background-position: 400% 0;
  1477. }
  1478. 100% {
  1479. background-position: 0 0;
  1480. }
  1481. }
  1482.  
  1483. #captchaWindow{
  1484. display:none;
  1485. position:absolute;
  1486. top:0px; left:0px;
  1487. width: 100%;
  1488. height: 100%;
  1489. background-color: rgba(0,0,0,0.8);
  1490. z-index:500
  1491. }
  1492. #captchaWindow #verifyUser{
  1493. position:absolute;
  1494. top:50%;
  1495. left:50%;
  1496. margin-left:-152px;
  1497. margin-top:-40px;
  1498. }
  1499.  
  1500. #captchaWindow #verifyUser div div:after {
  1501. filter: blur(50px);
  1502. }
  1503. a {
  1504. display: none;
  1505. }
Add Comment
Please, Sign In to add comment