Guest User

Untitled

a guest
Apr 30th, 2019
53
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 230.42 KB | None | 0 0
  1. /* AUTO=body_background */ body { background: url(/assets/background/square_bg.png) repeat; }
  2. /* AUTO=sticky_menu */ .l-top_menu-v2 { position: sticky; top: 0; }
  3. /**
  4. * Тема для shikimori.org – shiki-theme v1.4.0-fix.3
  5. * MIT License
  6. * Copyright (c) 2016 grin3671
  7. *
  8. * Подробности:
  9. * https://github.com/grin3671/shiki-theme
  10. */
  11.  
  12.  
  13.  
  14. /* SPECIAL CODE */
  15. /* Убираем лишние элементы настроек */
  16. .page_background_color {
  17. display: none;
  18. }
  19.  
  20. /* SPECIAL CODE | END */
  21.  
  22.  
  23.  
  24.  
  25.  
  26.  
  27.  
  28.  
  29.  
  30.  
  31. /* Шрифт: Arial */
  32. body, input, select, button, textarea {
  33. font-family: 'Arial', sans-serif;
  34. }
  35.  
  36. /* BUGFIX */
  37. /* В превью комментария не отображается заголовок на страницах клубов */
  38. .p-club_pages .new_comment .preview .b-comment .inner header,
  39. .p-club_pages .edit_comment .preview .b-comment .inner header {
  40. display: block;
  41. }
  42.  
  43. .edit-page .preview .b-comment > .inner > header {
  44. display: none;
  45. }
  46.  
  47. .edit-page .preview .b-comment > .inner > .body {
  48. padding-left: 0;
  49. }
  50.  
  51. /* Размер постеров в блоке «Лучшие работы» внутри тултипа */
  52. .b-catalog_entry-tooltip .best-works .c-column {
  53. width: 22%;
  54. }
  55.  
  56. /* Максимальная ширина элементов */
  57. img {
  58. max-width: 100%;
  59. }
  60.  
  61. /* Убираем лишнее пространство под textarea */
  62. textarea {
  63. vertical-align: top;
  64. }
  65.  
  66.  
  67.  
  68.  
  69. /* ОСНОВНОЙ ФАЙЛ */
  70. .b-header_filters .filter-line .title,
  71. .b-header_filters .filter-line a.current,
  72. .p-statistics-index .forum-nav .sections a,
  73. .p-userlist_comparer .comparer table .name a {
  74. color: inherit;
  75. }
  76.  
  77. /* MAIN BLOCKS */
  78. html {
  79. height: 100%;
  80. overflow-x: hidden;
  81. }
  82.  
  83. body {
  84. position: relative;
  85. min-height: 100%;
  86. background-color: #181720;
  87. color: #FFFFFF;
  88. font-size: 16px;
  89. font-weight: 400;
  90. line-height: 1.5;
  91. }
  92.  
  93. @media (max-width: 1024px) {
  94. body {
  95. background-color: #181720 !important;
  96. }
  97. }
  98.  
  99. .l-page {
  100. min-height: 100%;
  101. padding: 72px 16px 0;
  102. background: #181720;
  103. }
  104.  
  105. @media (min-width: 960px) {
  106. .l-page {
  107. padding-right: 24px;
  108. padding-left: 24px;
  109. }
  110. }
  111.  
  112. .l-footer {
  113. padding: 0;
  114. margin: 1em 0 0;
  115. text-align: center;
  116. line-height: 2em;
  117. /* НЕ УДАЛЯТЬ! Информация для устранения неполадок */
  118. }
  119.  
  120. .l-footer::before {
  121. content: "shiki-theme v1.4.0-fix.3";
  122. display: block;
  123. float: left;
  124. position: static;
  125. bottom: auto;
  126. left: auto;
  127. width: auto;
  128. height: auto;
  129. background: none;
  130. color: #BDBDBD;
  131. font-weight: 700;
  132. }
  133.  
  134. body[data-user*=':2727,'] .l-footer::before {
  135. content: "shiki-theme v1.4.0-fix.3";
  136. }
  137.  
  138. .l-footer::after {
  139. display: none;
  140. }
  141.  
  142. .l-footer::before,
  143. .l-footer .copyright,
  144. .l-footer .links {
  145. padding: 0;
  146. font: inherit;
  147. font-size: .75em;
  148. }
  149.  
  150. .l-footer .copyright {
  151. color: #EEEEEE;
  152. }
  153.  
  154. .l-footer .links {
  155. clear: both;
  156. display: inline-block;
  157. vertical-align: top;
  158. text-align: center;
  159. }
  160.  
  161. .l-footer .links a {
  162. color: #BDBDBD;
  163. }
  164.  
  165. .l-footer .links a:last-child {
  166. margin: 0;
  167. }
  168.  
  169. /* RESET LAYOUT */
  170. @media (max-width: 1024px) {
  171. .l-page .menu-slide-outer {
  172. width: auto;
  173. padding: 0 16px;
  174. margin: 0 -16px;
  175. }
  176. .l-page .menu-slide-outer .menu-slide-inner {
  177. width: 100% !important;
  178. }
  179. .l-page .menu-slide-outer .l-content {
  180. float: none !important;
  181. width: 100% !important;
  182. margin: 0 !important;
  183. }
  184. }
  185.  
  186. /* ОБЩИЕ КЛАССЫ */
  187. .p0,
  188. .m0,
  189. .m1,
  190. .m2,
  191. .m3,
  192. .m4,
  193. .m5,
  194. .m6,
  195. .m7,
  196. .m8,
  197. .m10,
  198. .m12,
  199. .m15,
  200. .m20,
  201. .m25,
  202. .m30,
  203. .m40,
  204. .m50 {
  205. margin-bottom: .5rem !important;
  206. }
  207.  
  208. .m10,
  209. .m13 {
  210. margin-bottom: 0 !important;
  211. }
  212.  
  213. div.body {
  214. line-height: inherit;
  215. }
  216.  
  217. h3 {
  218. border-color: #4f4f4f;
  219. color: #EEEEEE;
  220. font-size: 1rem;
  221. line-height: 1.5;
  222. margin-bottom: .5rem;
  223. text-overflow: ellipsis;
  224. white-space: nowrap;
  225. overflow: hidden;
  226. }
  227.  
  228. hr {
  229. margin: .5rem 0;
  230. background-color: #4f4f4f;
  231. background-image: none;
  232. }
  233.  
  234. input {
  235. background: transparent;
  236. border: 0;
  237. color: inherit;
  238. }
  239.  
  240. .block, .c-column {
  241. line-height: inherit !important;
  242. }
  243.  
  244. .block {
  245. margin-bottom: .5rem;
  246. }
  247.  
  248. .b-errors {
  249. margin-bottom: .5rem;
  250. line-height: inherit;
  251. }
  252.  
  253. .b-errors .subheadline {
  254. margin-bottom: 0;
  255. border: 0;
  256. }
  257.  
  258. .red {
  259. border: 0;
  260. }
  261.  
  262. .b-mention {
  263. color: #57576a;
  264. }
  265.  
  266. .b-mention:hover {
  267. color: #8a8eac;
  268. }
  269.  
  270. .b-mention:active {
  271. color: #b7b8cc;
  272. }
  273.  
  274. .b-mention s {
  275. color: inherit;
  276. }
  277.  
  278. .b-menu-line {
  279. line-height: 1.5;
  280. }
  281.  
  282. .b-nothing_here {
  283. margin-left: 0;
  284. color: #9E9E9E;
  285. font-size: .875rem;
  286. line-height: 2.5rem;
  287. }
  288.  
  289. .b-nothing_here a {
  290. color: #57576a;
  291. }
  292.  
  293. .b-nothing_here a:hover {
  294. color: #8a8eac;
  295. }
  296.  
  297. .b-nothing_here a:active {
  298. color: #b7b8cc;
  299. }
  300.  
  301. .tooltip-details .b-nothing_here.centered {
  302. color: inherit;
  303. }
  304.  
  305. .b-replies {
  306. padding: 8px 0 0;
  307. color: #BDBDBD;
  308. font-size: .75rem;
  309. }
  310.  
  311. .b-separator {
  312. color: #9E9E9E;
  313. }
  314.  
  315. .b-prgrph,
  316. .b-spoiler_prgrph {
  317. margin-bottom: .5rem !important;
  318. }
  319.  
  320. .b-show_more,
  321. .b-show_more-more .hide-more {
  322. display: inline-block;
  323. padding: 0 .5rem;
  324. margin: .25rem 0;
  325. border-radius: .625rem;
  326. color: #EEEEEE;
  327. font-size: .875rem;
  328. font-weight: bold;
  329. line-height: 1.25rem;
  330. }
  331.  
  332. .b-show_more:hover,
  333. .b-show_more-more .hide-more:hover {
  334. background-color: #5f6170;
  335. color: #EEEEEE;
  336. }
  337.  
  338. .text {
  339. margin-left: 0 !important;
  340. }
  341.  
  342. .yellow-fade {
  343. background: #2f3341;
  344. outline-color: #2f3341;
  345. }
  346.  
  347. .b-comment-info {
  348. color: #BDBDBD;
  349. font-size: .875rem;
  350. text-align: left;
  351. line-height: 1.5rem;
  352. }
  353.  
  354. .b-comment-info > span {
  355. margin-right: .5rem;
  356. }
  357.  
  358. /* inset dividers */
  359. .b-dialog::before,
  360. .b-message::before,
  361. .b-comment::before,
  362. .b-comments .comments-loaded::before {
  363. content: '';
  364. position: absolute;
  365. bottom: 0;
  366. right: 0;
  367. left: 3.5rem;
  368. height: 1px;
  369. }
  370.  
  371. .b-generated_news::before {
  372. left: 0;
  373. }
  374.  
  375. .b-comments .comments-loaded .b-comment:last-child {
  376. margin: 0;
  377. }
  378.  
  379. .b-dialog:last-child::before,
  380. .b-message:last-child::before,
  381. .b-comment:last-child::before {
  382. display: none;
  383. }
  384.  
  385. /* Левый отступ комментариев от края экрана */
  386. .b-comment > .inner > .body,
  387. .b-dialog > .inner > .body,
  388. .b-message > .inner > .body,
  389. .b-topic > .inner > .body,
  390. .b-topic > .inner > footer,
  391. .b-topic-preview > .b-comments,
  392. .b-topic-preview > .inner > .body,
  393. .b-topic-preview > .inner > footer {
  394. padding-left: 3.5rem;
  395. }
  396.  
  397. .b-dialog .b-message > .inner > .body,
  398. .b-topic-preview.mini > .inner > header,
  399. .b-topic-minified > .inner > header,
  400. .b-generated_news-topic > .inner > header,
  401. .b-generated_news > .inner > header,
  402. .b-generated_news > .inner > .body,
  403. .p-clubs-show .b-topic-preview.mini > .inner > .body {
  404. padding-left: 0;
  405. }
  406.  
  407. .edit_club .b-shiki_editor .b-comment .inner .body,
  408. .new_club_page .b-shiki_editor .b-comment .inner .body {
  409. padding-left: 0;
  410. }
  411.  
  412. .p-polls-new .b-comment > .inner > .body {
  413. padding-left: 0;
  414. }
  415.  
  416. @media (max-width: 767px) {
  417. .b-topic-preview > .b-comments {
  418. padding-left: 0;
  419. }
  420. .b-topic-preview > .inner > .body,
  421. .b-topic-preview > .inner > footer {
  422. padding-left: 3.5rem;
  423. }
  424. }
  425.  
  426. @media (min-width: 767px) {
  427. .b-news-topic > .b-comments {
  428. padding-left: 3.5rem;
  429. }
  430. }
  431.  
  432. /* END of Левый отступ комментариев от края экрана */
  433. /* Просмотр комментариев во всплывающей подсказке */
  434. .tooltip .b-comment,
  435. .tooltip .b-message {
  436. padding-top: 0 !important;
  437. padding-bottom: 0;
  438. }
  439.  
  440. .tooltip .b-comment::before,
  441. .tooltip .b-message::before {
  442. display: none;
  443. }
  444.  
  445. /* Стили Material Icons */
  446. .l-top_menu .menu-items > .entry > a[href*='/forum']::before,
  447. .l-top_menu .menu-items > .entry.calendar > a::before,
  448. .l-top_menu .menu-items > .entry.info > a::before,
  449. .l-top_menu .menu-items > .entry > .contest::before,
  450. .l-top_menu .menu-items > .entry > a::before,
  451. .l-top_menu .menu-items > a::before,
  452. .l-page .menu-toggler .toggler::before {
  453. font-family: 'Material Icons' !important;
  454. font-weight: normal !important;
  455. line-height: 1;
  456. letter-spacing: normal;
  457. text-transform: none;
  458. word-wrap: normal;
  459. white-space: nowrap;
  460. direction: ltr;
  461. /* Support for all WebKit browsers. */
  462. -webkit-font-smoothing: antialiased;
  463. /* Support for Safari and Chrome. */
  464. text-rendering: optimizeLegibility;
  465. /* Support for Firefox. */
  466. -moz-osx-font-smoothing: grayscale;
  467. /* Support for IE. */
  468. font-feature-settings: 'liga';
  469. }
  470.  
  471. /* TODO: replace */
  472. .b-catalog-entry-embedded .b-catalog_entry {
  473. margin-bottom: 0 !important;
  474. }
  475.  
  476. /* TODO: replace */
  477. .b-user_rate-extended > .midheadline {
  478. overflow: hidden;
  479. }
  480.  
  481. /* TODO: check it */
  482. /* TODO: check it */
  483. .b-comment .body,
  484. .b-dialog .body,
  485. .b-message .body,
  486. .b-topic .body {
  487. word-break: break-word;
  488. }
  489.  
  490. /* НАСТРОЙКА ЦВЕТОВ */
  491. /* Цвет текста ссылки по умолчанию */
  492. a {
  493. color: #57576a;
  494. }
  495.  
  496. /* Цвет ссылки при наведении */
  497. a:hover {
  498. color: #8a8eac;
  499. }
  500.  
  501. /* Цвет ссылки при нажатии */
  502. @media only screen and (min-width: 1025px) {
  503. a:active {
  504. color: #b7b8cc;
  505. }
  506. }
  507.  
  508. .b-abuse_request .ban-form .cancel,
  509. .b-bb_codes-examples .example a,
  510. .b-bb_codes-examples .result a,
  511. .b-bracket-actions > div,
  512. .b-bracket-actions > span,
  513. .b-catalog_entry .cover .title,
  514. .b-cosplay-topic > .inner .cosplay-info .line .value a,
  515. .b-cosplay_gallery h3 a,
  516. .b-db_entry > .c-about .additional-links .line-container > .link,
  517. .b-db_entry > .c-about .additional-links .line-container > a,
  518. .b-feedback-inner .about a,
  519. .b-form .variants .variant a,
  520. .b-forums .forum .link-with-input .link,
  521. .b-forums .reload,
  522. .b-header_filters .filter-line a,
  523. .b-js-action,
  524. .b-js-link,
  525. .b-link,
  526. .b-log_entry .moderation a,
  527. .b-person .name,
  528. .b-topic .footer-vote .vote-group .vote,
  529. .b-user.named_avatar .name,
  530. .subheadline .misc-link,
  531. .b-video_variant a,
  532. .b-animes-menu .menu-topics-block .history-entry-tooltip a,
  533. .p-animes-files .l-content a,
  534. .p-mangas-files .l-content a,
  535. .p-contests-edit .grid,
  536. .p-contests .match-day .match-link a,
  537. .p-contests .rating .member a,
  538. .p-contests .results a,
  539. .p-contests .suggestion > a,
  540. .p-contests .variant > a,
  541. .b-contests-menu .results,
  542. .b-contests-menu .grid a,
  543. .p-contests-grid .round .match a,
  544. .p-contests-index .contest a,
  545. .p-dashboards .c-my_list .list-type > .title .link,
  546. .p-dashboards .c-my_list .history > .title .link,
  547. .p-dashboards .c-my_list .list-type > .title .switch,
  548. .p-dashboards .c-my_list .history > .title .switch,
  549. .p-dashboards .user_list .list-type > .title .link,
  550. .p-dashboards .user_list .history > .title .link,
  551. .p-dashboards .user_list .list-type > .title .switch,
  552. .p-dashboards .user_list .history > .title .switch,
  553. .p-dashboards-show .midheadline .b-link,
  554. .p-dashboards-show .c-content .options .option,
  555. .p-db_entries-edit_field .cc-genres > .c-all_genres .genre:not(.included) .name,
  556. .p-profiles .profile-head .c-brief header .notice a,
  557. .p-profiles .profile-head .c-mobile-actions a,
  558. .p-profiles .profile-head .c-mobile-actions span,
  559. .p-profiles .profile-head .c-info .c-additionals div a,
  560. .p-profiles-edit .list .profile-action a:not(.b-button),
  561. .p-profiles-show .about a,
  562. .p-studios .studio .name,
  563. .p-translations .animes a,
  564. .b-log_entry .comment-block ins,
  565. .p-statistics-index .forum-nav .sections a.selected,
  566. .b-animes-menu .menu-topics-block a.entry .name,
  567. .b-animes-menu .menu-topics-block .history-entry-tooltip .tooltip-details a {
  568. color: #57576a;
  569. border-bottom-color: rgba(87, 87, 106, 0.3);
  570. }
  571.  
  572. .b-abuse_request .ban-form .cancel:hover,
  573. .b-bb_codes-examples .example a:hover,
  574. .b-bb_codes-examples .result a:hover,
  575. .b-bracket-actions > div:hover,
  576. .b-bracket-actions > span:hover,
  577. .b-catalog_entry .cover .title:hover,
  578. .b-cosplay-topic > .inner .cosplay-info .line .value a:hover,
  579. .b-cosplay_gallery h3 a:hover,
  580. .b-db_entry > .c-about .additional-links .line-container > .link:hover,
  581. .b-db_entry > .c-about .additional-links .line-container > a:hover,
  582. .b-feedback-inner .about a:hover,
  583. .b-form .variants .variant a:hover,
  584. .b-forums .forum .link-with-input .link:hover,
  585. .b-forums .reload:hover,
  586. .b-header_filters .filter-line a:hover,
  587. .b-js-action:hover,
  588. .b-js-link:hover,
  589. .b-link:hover,
  590. .b-log_entry .moderation a:hover,
  591. .b-person .name:hover,
  592. .b-topic .footer-vote .vote-group .vote:hover,
  593. .b-user.named_avatar .name:hover,
  594. .subheadline .misc-link:hover,
  595. .b-video_variant a:hover,
  596. .b-animes-menu .menu-topics-block .history-entry-tooltip a:hover,
  597. .p-animes-files .l-content a:hover,
  598. .p-mangas-files .l-content a:hover,
  599. .p-contests-edit .grid:hover,
  600. .p-contests .match-day .match-link a:hover,
  601. .p-contests .rating .member a:hover,
  602. .p-contests .results a:hover,
  603. .p-contests .suggestion > a:hover,
  604. .p-contests .variant > a:hover,
  605. .b-contests-menu .results:hover,
  606. .b-contests-menu .grid a:hover,
  607. .p-contests-grid .round .match a:hover,
  608. .p-contests-index .contest a:hover,
  609. .p-dashboards .c-my_list .list-type > .title .link:hover,
  610. .p-dashboards .c-my_list .history > .title .link:hover,
  611. .p-dashboards .c-my_list .list-type > .title .switch:hover,
  612. .p-dashboards .c-my_list .history > .title .switch:hover,
  613. .p-dashboards .user_list .list-type > .title .link:hover,
  614. .p-dashboards .user_list .history > .title .link:hover,
  615. .p-dashboards .user_list .list-type > .title .switch:hover,
  616. .p-dashboards .user_list .history > .title .switch:hover,
  617. .p-dashboards-show .midheadline .b-link:hover,
  618. .p-dashboards-show .c-content .options .option:hover,
  619. .p-dashboards-show .c-content .options .option.selected,
  620. .p-db_entries-edit_field .cc-genres > .c-all_genres .genre:not(.included) .name:hover,
  621. .p-profiles .profile-head .c-brief header .notice a:hover,
  622. .p-profiles .profile-head .c-mobile-actions a:hover,
  623. .p-profiles .profile-head .c-mobile-actions span:hover,
  624. .p-profiles .profile-head .c-info .c-additionals div a:hover,
  625. .p-profiles-edit .list .profile-action a:not(.b-button):hover,
  626. .p-profiles-show .about a:hover,
  627. .p-studios .studio .name:hover,
  628. .p-translations .animes a:hover,
  629. .p-statistics-index .forum-nav .sections a:hover,
  630. .b-catalog_entry .cover:hover,
  631. .b-catalog_entry .cover:hover .title,
  632. .b-comment > .inner .was_updated:hover,
  633. .b-comment header .hash:hover,
  634. .b-dialog > .inner .was_updated:hover,
  635. .b-message > .inner .was_updated:hover,
  636. .b-topic > .inner .was_updated:hover,
  637. .headline > a:hover:before,
  638. .midheadline > a:hover:before,
  639. .subheadline > a:hover:before,
  640. .headline.linkheadline > a:hover,
  641. .linkheadline.midheadline > a:hover,
  642. .linkheadline.subheadline > a:hover,
  643. .headline.linkheadline > a:hover:before,
  644. .linkheadline.midheadline > a:hover:before,
  645. .linkheadline.subheadline > a:hover:before,
  646. .p-animes-franchise .sticky-tooltip .close:hover,
  647. .p-mangas-franchise .sticky-tooltip .close:hover,
  648. .p-contests .match-day .match-link.voted-none > .c-column a:hover,
  649. .p-contests .match-day .match-link.voted-left > .c-column:last-child a:hover,
  650. .p-contests .match-day .match-link.voted-right > .c-column:first-child a:hover,
  651. .p-contests .match-day .match-link .c-column.loser a:hover,
  652. .p-contests .match-day .match-link .c-column.created a:hover,
  653. .p-contests-grid .round .match .date a:hover,
  654. .p-topics header h1 a.reload:hover,
  655. .b-video_variant.active a,
  656. .b-animes-menu .menu-topics-block a.entry:hover .name,
  657. .b-animes-menu .menu-topics-block a.entry .name:hover,
  658. .b-animes-menu .menu-topics-block .history-entry-tooltip .tooltip-details a:hover {
  659. color: #8a8eac;
  660. border-bottom-color: rgba(138, 142, 172, 0.3);
  661. }
  662.  
  663. .b-header_filters .filter-line a:active,
  664. .b-person .name:active,
  665. .b-animes-menu .menu-topics-block .history-entry-tooltip a:active,
  666. .p-animes-files .l-content a:active,
  667. .p-mangas-files .l-content a:active,
  668. .p-dashboards-show .midheadline .b-link:active,
  669. .p-dashboards-show .c-content .options .option:active,
  670. .p-profiles .profile-head .c-brief header .notice a:active,
  671. .p-profiles .profile-head .c-mobile-actions a:active,
  672. .p-profiles .profile-head .c-mobile-actions span:active,
  673. .p-profiles .profile-head .c-info .c-additionals div a:active,
  674. .headline > a:active:before,
  675. .midheadline > a:active:before,
  676. .subheadline > a:active:before,
  677. .p-anime_videos-index .c-videos .video-variant-switcher.active:hover {
  678. color: #b7b8cc;
  679. }
  680.  
  681. @media only screen and (min-width: 1025px) {
  682. .b-abuse_request .ban-form .cancel:active,
  683. .b-bb_codes-examples .example a:active,
  684. .b-bb_codes-examples .result a:active,
  685. .b-bracket-actions > div:active,
  686. .b-bracket-actions > span:active,
  687. .b-catalog_entry .cover .title:active,
  688. .b-cosplay-topic > .inner .cosplay-info .line .value a:active,
  689. .b-cosplay_gallery h3 a:active,
  690. .b-db_entry > .c-about .additional-links .line-container > .link:active,
  691. .b-db_entry > .c-about .additional-links .line-container > a:active,
  692. .b-feedback-inner .about a:active,
  693. .b-form .variants .variant a:active,
  694. .b-forums .forum .link-with-input .link:active,
  695. .b-forums .reload:active,
  696. .b-header_filters .filter-line a:active,
  697. .b-js-action:active,
  698. .b-js-link:active,
  699. .b-link:active,
  700. .b-log_entry .moderation a:active,
  701. .b-topic .footer-vote .vote-group .vote:active,
  702. .b-user.named_avatar .name:active,
  703. .subheadline .misc-link:active,
  704. .b-video_variant a:active,
  705. .p-contests-edit .grid:active,
  706. .p-contests .match-day .match-link a:active,
  707. .p-contests .rating .member a:active,
  708. .p-contests .results a:active,
  709. .p-contests .suggestion > a:active,
  710. .p-contests .variant > a:active,
  711. .b-contests-menu .results:active,
  712. .b-contests-menu .grid a:active,
  713. .p-contests-grid .round .match a:active,
  714. .p-contests-index .contest a:active,
  715. .p-dashboards .c-my_list .list-type > .title .link:active,
  716. .p-dashboards .c-my_list .history > .title .link:active,
  717. .p-dashboards .c-my_list .list-type > .title .switch:active,
  718. .p-dashboards .c-my_list .history > .title .switch:active,
  719. .p-dashboards .user_list .list-type > .title .link:active,
  720. .p-dashboards .user_list .history > .title .link:active,
  721. .p-dashboards .user_list .list-type > .title .switch:active,
  722. .p-dashboards .user_list .history > .title .switch:active,
  723. .p-dashboards-show .midheadline .b-link:active,
  724. .p-dashboards-show .c-content .options .option:active,
  725. .p-db_entries-edit_field .cc-genres > .c-all_genres .genre:not(.included) .name:active,
  726. .p-profiles .profile-head .c-brief header .notice a:active,
  727. .p-profiles .profile-head .c-mobile-actions a:active,
  728. .p-profiles .profile-head .c-mobile-actions span:active,
  729. .p-profiles .profile-head .c-info .c-additionals div a:active,
  730. .p-profiles-edit .list .profile-action a:not(.b-button):active,
  731. .p-profiles-show .about a:active,
  732. .p-studios .studio .name:active,
  733. .p-translations .animes a:active,
  734. .p-statistics-index .forum-nav .sections a:active,
  735. .b-catalog_entry .cover:active,
  736. .b-comment > .inner .was_updated:active,
  737. .b-comment header .hash:active,
  738. .b-dialog > .inner .was_updated:active,
  739. .b-message > .inner .was_updated:active,
  740. .b-topic > .inner .was_updated:active,
  741. .headline.linkheadline > a:active,
  742. .linkheadline.midheadline > a:active,
  743. .linkheadline.subheadline > a:active,
  744. .headline.linkheadline > a:active:before,
  745. .linkheadline.midheadline > a:active:before,
  746. .linkheadline.subheadline > a:active:before,
  747. .p-animes-franchise .sticky-tooltip .close:active,
  748. .p-mangas-franchise .sticky-tooltip .close:active,
  749. .p-contests .match-day .match-link.voted-none > .c-column a:active,
  750. .p-contests .match-day .match-link.voted-left > .c-column:last-child a:active,
  751. .p-contests .match-day .match-link.voted-right > .c-column:first-child a:active,
  752. .p-contests .match-day .match-link .c-column.loser a:active,
  753. .p-contests .match-day .match-link .c-column.created a:active,
  754. .p-contests-grid .round .match .date a:active,
  755. .p-topics header h1 a.reload:active,
  756. .b-bracket-details:active,
  757. .b-form a.remove:active,
  758. .b-animes-menu .menu-topics-block a.entry .name:active,
  759. .b-animes-menu .menu-topics-block .history-entry-tooltip .tooltip-details a:active {
  760. color: #b7b8cc;
  761. border-bottom-color: rgba(183, 184, 204, 0.3);
  762. }
  763. }
  764.  
  765. .p-contests .b-contest_match .vs .label,
  766. .p-contests .match-day > .date,
  767. .p-animes_collection-index .l-content.ajax_request::before,
  768. .p-mangas_collection-index .l-content.ajax_request::before,
  769. .p-recommendations-index .l-content.ajax_request::before,
  770. .p-userlist_comparer-show .l-content.ajax_request::before,
  771. .b-ajax:before {
  772. background: #181720;
  773. }
  774.  
  775. .l-page:before {
  776. outline-color: #181720;
  777. }
  778.  
  779. @media screen and (max-width: 960px) {
  780. .p-profiles .profile-head .c-brief header {
  781. background-color: #181720;
  782. }
  783. }
  784.  
  785. /* BLACK GREY WHITE */
  786. header.head h1,
  787. header.head h2,
  788. .b-input input,
  789. .b-input textarea,
  790. .b-shiki_editor .body .editor textarea,
  791. .subheadline-input,
  792. .b-catalog_entry .cover .title,
  793. .b-forums .forum .link-with-input .link,
  794. .b-modal .subheadline,
  795. .b-pages .b-link,
  796. .b-video_variant .episode-num,
  797. .b-video_variant .video-author,
  798. .b-video_variant .video-id,
  799. .headline,
  800. .p-contests .match-day .match-link.voted-none > .c-column a,
  801. .p-contests .match-day .match-link.voted-left > .c-column:last-child a,
  802. .p-contests .match-day .match-link.voted-right > .c-column:first-child a,
  803. .p-contests .match-day .match-link .c-column.loser a,
  804. .p-contests .match-day .match-link .c-column.created a,
  805. .p-moderations-missing_videos .missing-video > .info span,
  806. .p-profiles .profile-head .c-history .entry .title {
  807. color: #FFFFFF !important;
  808. }
  809.  
  810. /* Цвет основного текста в области при наведении */
  811. .b-clubs-menu .b-link:hover,
  812. .b-clubs-menu .actions li:hover,
  813. .b-clubs-menu .actions .upload label:hover,
  814. .b-clubs-menu .actions .invite span:hover,
  815. .b-clubs-menu .actions .join a:hover,
  816. .b-clubs-menu .actions .leave a:hover,
  817. .b-forums .forum:hover .link-with-input .link,
  818. .b-video .marker,
  819. .b-video .name,
  820. .p-profiles .profile-head .c-history .entry:hover .title {
  821. color: #FFFFFF !important;
  822. }
  823.  
  824. @media (max-width: 1024px) {
  825. .l-top_menu .menu-items > .entry > a,
  826. .l-top_menu .menu-items > .entry > .submenu > a,
  827. .l-top_menu .inner .sign_out {
  828. color: #FFFFFF !important;
  829. }
  830. }
  831.  
  832. header.head .notice,
  833. .bar.horizontal .line .x_label,
  834. .bar.vertical .line .x_label,
  835. .b-contest_match .vs .hint,
  836. .b-contest_match .vs .invitation,
  837. .b-contest_match .vs .label,
  838. .b-contest_match .vs .thanks,
  839. .b-contest_match .vs .vote-abstained,
  840. .b-contest_match .vs .vote-voted,
  841. .b-stats_bar .stat_names:hover:before,
  842. .p-contests .match-day > .date .from,
  843. .p-contests .match-day > .date .to {
  844. color: #EEEEEE;
  845. }
  846.  
  847. .midheadline,
  848. .subheadline,
  849. .b-animes-menu .menu-topics-block .date,
  850. .b-catalog_entry .cover .misc span,
  851. .b-forums .forum .link-with-input input + .link,
  852. .b-forums .forum .topics,
  853. .b-log_entry .state.auto_accepted,
  854. .b-pages .title,
  855. .b-stats_bar .stat_names:before,
  856. .b-topic-preview > .inner .status-line .about,
  857. .b-topic-preview > .inner .status-line .from,
  858. .l-top_menu .menu-items .submenu-toggler,
  859. .p-contests .b-contest_match .vs,
  860. .p-contests .match-day .matches-num,
  861. .p-contests .rating .member .position,
  862. .p-db_entries-edit .b-list .field,
  863. .p-profiles .profile-head .c-info .c-additionals b,
  864. .b-video_variant .episode-hostings,
  865. .b-video_variant .video-hosting,
  866. .b-video_variant .video-language {
  867. color: #BDBDBD;
  868. }
  869.  
  870. .b-db_entry > .c-about .additional-links .key,
  871. .p-profiles .profile-head .c-history .entry .misc,
  872. .p-profiles-show .lifetime .title > .label:before,
  873. .p-profiles-show .profile-content .activity .title {
  874. color: #BDBDBD !important;
  875. }
  876.  
  877. header.head a.edit,
  878. header.head .misc,
  879. .b-db_entry > .c-about .additional-links .line-container > a:after,
  880. .b-db_entry > .c-about .additional-links .line-container > .link:after,
  881. .b-video_variant .episode-hostings:after,
  882. .b-video_variant .episode-hostings:before,
  883. .b-video_variant .video-hosting:after,
  884. .b-video_variant .video-hosting:before,
  885. .b-video_variant .video-kind.english:before,
  886. .b-video_variant .video-language:after,
  887. .b-video_variant .video-language:before,
  888. .p-contests-index .contest .date,
  889. .p-moderations-missing_videos .missing-video > .info,
  890. .p-moderations-show .b-list .size:after,
  891. .p-moderations-show .b-list .size:before,
  892. .p-profiles .profile-head .c-brief header .notice span:after,
  893. .p-profiles .profile-head .c-info .c-additionals div:after,
  894. .p-statistics-index .forum-nav .sections a:after {
  895. color: #9E9E9E;
  896. }
  897.  
  898. .p-profiles .profile-head .c-history .entry .misc.date {
  899. color: #9E9E9E !important;
  900. }
  901.  
  902. /* PRIMARY COLOR */
  903. .p-contests .b-contest_match .votes-percents .right-part,
  904. .p-contests .b-contest_match .votes-percents .left-part:hover .right-part,
  905. .line:nth-child(odd) > .bar-container > .bar,
  906. .line:nth-child(odd) > .bar-container > .bar:hover {
  907. background-color: #3a3d50;
  908. }
  909.  
  910. .p-contests .b-contest_match .votes-percents .right-part,
  911. .p-contests .b-contest_match .votes-percents .left-part:hover .right-part,
  912. .b-main_search .input:after {
  913. border-color: #3a3d50;
  914. }
  915.  
  916. .b-forums .forum input:checked + .link:before,
  917. .tooltip-details .ajax-loading {
  918. color: #3a3d50;
  919. }
  920.  
  921. /* END of PRIMARY COLOR */
  922. /* ACCENT COLOR */
  923. .menu .unread-count,
  924. .menu .entry:hover .unread-count,
  925. .menu .contest,
  926. .menu .entry:hover .contest {
  927. background-color: #454d5f;
  928. }
  929.  
  930. .menu .unread-count:hover,
  931. .menu .contest:hover {
  932. background-color: #454d5f !important;
  933. }
  934.  
  935. html.turbolinks-progress-bar:before,
  936. .turbolinks.turbolinks-progress-bar::before {
  937. background: #454d5f !important;
  938. box-shadow: 0 0 10px rgba(69, 77, 95, 0.7) !important;
  939. }
  940.  
  941. .menu .unread-count,
  942. .menu:hover .unread-count,
  943. .menu .contest,
  944. .menu:hover .contest {
  945. color: #FAFAFA !important;
  946. }
  947.  
  948. /* END of ACCENT COLOR */
  949. /* BACKGROUND COLOR */
  950. .b-video .marker,
  951. .b-video .name {
  952. background: #5e5f6c;
  953. }
  954.  
  955. .p-topics-new .topic_video,
  956. .p-topics-edit .topic_video,
  957. .p-topics-create .topic_video,
  958. .p-topics-update .topic_video {
  959. background: #4a4a4a;
  960. }
  961.  
  962. .b-editable_grid tbody tr:nth-child(odd) td,
  963. .b-pages,
  964. .l-page .menu-toggler .toggler,
  965. .subheadline-input {
  966. background: #363643;
  967. }
  968.  
  969. .editor textarea.b-comment,
  970. .editor textarea.b-message {
  971. background: #363643 !important;
  972. }
  973.  
  974. /* Области наведения */
  975. .b-forums .forum:hover,
  976. .b-stats_bar .stat_names:hover:before,
  977. .p-profiles .profile-head .c-history .entry:hover a {
  978. background-color: #4a4a4a;
  979. }
  980.  
  981. /* ЦВЕТ ГРАНИЦ ЭЛЕМЕНТОВ */
  982. .b-dialog:before,
  983. .b-message:before,
  984. .b-comment:before,
  985. .b-comments .comments-loaded:before,
  986. .p-contests .match-day:before,
  987. .p-profiles .profile-head .c-history .entry:before {
  988. background-color: #4f4f4f;
  989. }
  990.  
  991. .b-pages,
  992. .b-shiki_editor .body .editor textarea,
  993. .b-tooltipped:not(a),
  994. .b-topic,
  995. .l-page .menu-toggler .toggler,
  996. .p-dashboards-show .cc-news .c-generated_news .b-topic,
  997. .p-topics header h1 a.reload,
  998. .p-topics-new .topic_video,
  999. .p-topics-edit .topic_video,
  1000. .p-topics-create .topic_video,
  1001. .p-topics-update .topic_video,
  1002. .subheadline-input {
  1003. border-color: #4f4f4f;
  1004. }
  1005.  
  1006. /* END of НАСТРОЙКА ЦВЕТОВ */
  1007.  
  1008.  
  1009.  
  1010.  
  1011.  
  1012.  
  1013.  
  1014.  
  1015.  
  1016.  
  1017. /**
  1018. * MATERIAL ICON
  1019. * Иконки должны располагаться в псевдоэлементе ::before
  1020. * Стандартный размер иконок 24px, уменьшенный – 20px
  1021. *
  1022. * NOTE: Версия шрифта устарела, поддерживаются не все иконки из каталога
  1023. * BUG: IE doesn't support Materail Icon's font format [.woff2]
  1024. */
  1025. @font-face {
  1026. font-family: 'Material Icons';
  1027. font-style: normal;
  1028. font-weight: 400;
  1029. src: local("Material Icons"), local("MaterialIcons-Regular"), url(https://cdnjs.cloudflare.com/ajax/libs/material-design-icons/3.0.1/iconfont/MaterialIcons-Regular.woff2) format("woff2"), url(https://cdnjs.cloudflare.com/ajax/libs/material-design-icons/3.0.1/iconfont/MaterialIcons-Regular.woff) format("woff"), url(https://cdnjs.cloudflare.com/ajax/libs/material-design-icons/3.0.1/iconfont/MaterialIcons-Regular.eot) format("eot"), url(https://cdnjs.cloudflare.com/ajax/libs/material-design-icons/3.0.1/iconfont/MaterialIcons-Regular.ttf) format("truetype");
  1030. }
  1031.  
  1032. .buttons .item-save::before, .buttons .item-moderation::before, .buttons .item-preview::before, .buttons .item-unpreview::before, .buttons .item-quote::before, .buttons .item-reply::before, .buttons .item-edit::before, .buttons .item-delete::before,
  1033. .buttons .item-delete-confirm::before, .buttons .item-apply::before,
  1034. .buttons .item-request-confirm::before, .buttons .item-cancel::before,
  1035. .buttons .item-request-reject::before,
  1036. .buttons .item-delete-cancel::before,
  1037. .buttons .item-moderation-cancel::before, .buttons .item-subscribe::before, .buttons .item-offtopic::before, .buttons .item-summary::before, .buttons .item-spoiler::before, .buttons .item-abuse::before, .buttons .item-ban::before, .buttons .item-ignore::before, .buttons .item-ignore.selected::before, .headline > a::before, .midheadline > a::before, .subheadline > a::before, .b-db_entry-note .name-container .b-user_rate .b-add_to_list .plus::before, .b-db_entry-note .name-container .b-user_rate .b-add_to_list .edit::before, .b-db_entry-note .name-container .b-user_rate .b-add_to_list .trigger-arrow::before, .b-forums .forum input + .link::before, .p-contests .match-day .match-link .voted::before, .p-contests .match-day .match-link .winner::before, .p-contests .match-day .match-link .loser::before, .p-contests .match-day .match-link .created::before, .p-contests .match-day .match-link .started::before, .p-contests .match-day .match-link .finished::before, .item-mobile::before, .buttons .editor-controls .b-tooltipped::before, header.head h1 a.back::before, header.head h2 a.back::before, .subheadline-buttons .item-edit::before, .profile-actions > a::before, .b-collection-filters .mylist-block .item-sign::before, .b-db_entry .c-actions .b-tooltipped::before, .b-image .delete::before, .b-image .confirm::before, .b-image .cancel::before, .b-image .mobile-edit::before, .b-list_switchers .switcher::before, .b-user_rate .rate-show .rate-number .item-add::before, .b-video_player .cc-player_controls .c-control .icon::before, .p-animes_collection-index .pagination .link::before,
  1038. .p-recommendations-index .pagination .link::before, .b-clubs-menu .club-actions .b-tooltipped::before, .p-dialogs .misc-links > a::before, .p-messages .mass-actions .action a::before, .p-profiles-show .about .item-edit::before, .b-stats_bar .compatibility a[href$='=similar']::before, .b-stats_bar .compatibility .text:first-child::before, .p-user_rates-index .list-lines tr.edit-form .remove::before, .p-user_rates-index .list-posters .user_rate .edit-user_rate::before, .l-top_menu .to-mobile-forum::before, .l-top_menu .menu-mobile .menu::before, .l-top_menu .menu-mobile .search::before, .l-top_menu .menu-userbox #sign_in::before, .l-top_menu .menu-items .submenu-toggler::before, #toast-container > .toast-error::before, .tooltip-inner .close::before, .b-ban .spoiler.collapse::before,
  1039. .b-log_entry .spoiler.collapse::before,
  1040. .b-user_rate_log .spoiler.collapse::before, .b-add_to_list .plus::before,
  1041. .b-add_to_list .edit::before,
  1042. .b-add_to_list.planned .edit::before,
  1043. .b-add_to_list.on_hold .edit::before,
  1044. .b-add_to_list.watching .edit::before,
  1045. .b-add_to_list.rewatching .edit::before,
  1046. .b-add_to_list.completed .edit::before,
  1047. .b-add_to_list.dropped .edit::before,
  1048. .b-add_to_list .trigger-arrow::before,
  1049. .b-add_to_list.expanded .trigger-arrow::before, .b-catalog_entry.planned .image-decor::before, .b-catalog_entry.watching .image-decor::before, .b-catalog_entry.completed .image-decor::before, .b-catalog_entry.rewatching .image-decor::before, .b-catalog_entry.on_hold .image-decor::before, .b-catalog_entry.dropped .image-decor::before, .b-collection-filters .b-block_list li::before, .b-collection-filters .b-block_list li .b-question::before, .b-collection_search .field .clear::before, .b-comments .comments-collapser::before, .b-height_shortener .expand::before, .b-rate .stars::before, .b-review_votes::before, .b-shiki_editor footer .about-bb_codes::before, .b-status-line .section.created_at time::before,
  1050. .b-status-line .section.changed_at time::before,
  1051. .b-status-line .section.additional .collection-size::before,
  1052. .b-status-line .section.additional .comments::before,
  1053. .b-status-line .section.additional .b-review_votes::before, .b-topic .footer-vote .star::before, .b-topic .footer-vote .vote-group .vote::before, .p-profiles .profile-head .c-brief header h1.aliases::before {
  1054. display: block;
  1055. width: 1em !important;
  1056. font-family: 'Material Icons' !important;
  1057. font-size: 24px !important;
  1058. font-weight: 400 !important;
  1059. line-height: 1 !important;
  1060. letter-spacing: normal;
  1061. text-transform: none;
  1062. word-wrap: normal;
  1063. white-space: nowrap;
  1064. direction: ltr;
  1065. /* Support for all WebKit browsers. */
  1066. -webkit-font-smoothing: antialiased;
  1067. /* Support for Safari and Chrome. */
  1068. text-rendering: optimizeLegibility;
  1069. /* Support for Firefox. */
  1070. -moz-osx-font-smoothing: grayscale;
  1071. /* Support for IE. */
  1072. font-feature-settings: 'liga';
  1073. }
  1074.  
  1075. .buttons .item-save::before, .buttons .item-moderation::before, .buttons .item-preview::before, .buttons .item-unpreview::before, .buttons .item-quote::before, .buttons .item-reply::before, .buttons .item-edit::before, .buttons .item-delete::before,
  1076. .buttons .item-delete-confirm::before, .buttons .item-apply::before,
  1077. .buttons .item-request-confirm::before, .buttons .item-cancel::before,
  1078. .buttons .item-request-reject::before,
  1079. .buttons .item-delete-cancel::before,
  1080. .buttons .item-moderation-cancel::before, .buttons .item-subscribe::before, .buttons .item-offtopic::before, .buttons .item-summary::before, .buttons .item-spoiler::before, .buttons .item-abuse::before, .buttons .item-ban::before, .buttons .item-ignore::before, .buttons .item-ignore.selected::before, .headline > a::before, .midheadline > a::before, .subheadline > a::before, .b-db_entry-note .name-container .b-user_rate .b-add_to_list .plus::before, .b-db_entry-note .name-container .b-user_rate .b-add_to_list .edit::before, .b-db_entry-note .name-container .b-user_rate .b-add_to_list .trigger-arrow::before, .b-forums .forum input + .link::before, .p-contests .match-day .match-link .voted::before, .p-contests .match-day .match-link .winner::before, .p-contests .match-day .match-link .loser::before, .p-contests .match-day .match-link .created::before, .p-contests .match-day .match-link .started::before, .p-contests .match-day .match-link .finished::before {
  1081. font-size: 18px !important;
  1082. }
  1083.  
  1084. .headline > a, .midheadline > a, .subheadline > a, .b-poll .poll-actions .abstain, .p-profiles-show .b-stats_bar.anime a.title, .p-profiles-show .b-stats_bar.manga a.title, .b-button, .b-form .cancel, .b-button + .b-js-link, .b-shiki_editor footer .unpreview:not(.link), .b-topic-preview > .editor-container .hide, .b-shiki_editor footer .cancel, .b-link_button.dark, .b-poll .poll-actions .vote, .b-shiki_editor .hidden-block .b-button.ok, .p-profiles-edit .account .change-password a, .b-form input[type=submit], .b-contests-menu .results, .b-link_button, .p-dashboards-show .b-forums > .b-link_button.maxi::after {
  1085. display: inline-block;
  1086. vertical-align: top;
  1087. min-width: 92px;
  1088. padding: .375rem 1rem;
  1089. margin: .375rem .5rem .375rem 0;
  1090. background: transparent;
  1091. border: 0;
  1092. border-radius: 3px;
  1093. font-size: .875rem;
  1094. font-weight: bold;
  1095. line-height: 1.5rem;
  1096. text-align: center;
  1097. text-decoration: none;
  1098. text-transform: uppercase;
  1099. transition: .3s;
  1100. transition: 0.16s cubic-bezier(0.4, 0, 0.6, 1);
  1101. user-select: none;
  1102. }
  1103.  
  1104. .headline > a:last-child, .midheadline > a:last-child, .subheadline > a:last-child, .b-poll .poll-actions .abstain:last-child, .p-profiles-show .b-stats_bar.anime a.title:last-child, .p-profiles-show .b-stats_bar.manga a.title:last-child, .b-button:last-child, .b-form .cancel:last-child, .b-button + .b-js-link:last-child, .b-shiki_editor footer .unpreview:last-child:not(.link), .b-topic-preview > .editor-container .hide:last-child, .b-shiki_editor footer .cancel:last-child, .b-poll .poll-actions .vote:last-child, .b-shiki_editor .hidden-block .b-button.ok:last-child, .p-profiles-edit .account .change-password a:last-child, .b-form input[type=submit]:last-child, .b-contests-menu .results:last-child, .b-link_button:last-child, .p-dashboards-show .b-forums > .b-link_button.maxi:last-child::after {
  1105. margin-right: 0;
  1106. }
  1107.  
  1108. .headline > a, .midheadline > a, .subheadline > a, .b-poll .poll-actions .abstain, .p-profiles-show .b-stats_bar.anime a.title, .p-profiles-show .b-stats_bar.manga a.title, .b-button, .b-form .cancel, .b-button + .b-js-link, .b-shiki_editor footer .unpreview:not(.link), .b-topic-preview > .editor-container .hide, .b-shiki_editor footer .cancel {
  1109. color: #3a3d50;
  1110. }
  1111.  
  1112. .headline > a:hover, .midheadline > a:hover, .subheadline > a:hover, .b-poll .poll-actions .abstain:hover, .p-profiles-show .b-stats_bar.anime a.title:hover, .p-profiles-show .b-stats_bar.manga a.title:hover, .b-button:hover, .b-form .cancel:hover, .b-button + .b-js-link:hover, .b-shiki_editor footer .unpreview:hover:not(.link), .b-topic-preview > .editor-container .hide:hover, .b-shiki_editor footer .cancel:hover, .headline > a:focus, .midheadline > a:focus, .subheadline > a:focus, .b-poll .poll-actions .abstain:focus, .p-profiles-show .b-stats_bar.anime a.title:focus, .p-profiles-show .b-stats_bar.manga a.title:focus, .b-button:focus, .b-form .cancel:focus, .b-button + .b-js-link:focus, .b-shiki_editor footer .unpreview:focus:not(.link), .b-topic-preview > .editor-container .hide:focus, .b-shiki_editor footer .cancel:focus {
  1113. background: rgba(58, 61, 80, 0.12);
  1114. color: #3a3d50;
  1115. }
  1116.  
  1117. .headline > a:active, .midheadline > a:active, .subheadline > a:active, .b-poll .poll-actions .abstain:active, .p-profiles-show .b-stats_bar.anime a.title:active, .p-profiles-show .b-stats_bar.manga a.title:active, .b-button:active, .b-form .cancel:active, .b-button + .b-js-link:active, .b-shiki_editor footer .unpreview:active:not(.link), .b-topic-preview > .editor-container .hide:active, .b-shiki_editor footer .cancel:active {
  1118. background: rgba(58, 61, 80, 0.24);
  1119. color: #3a3d50;
  1120. }
  1121.  
  1122. .b-link_button.dark, .b-poll .poll-actions .vote, .b-shiki_editor .hidden-block .b-button.ok, .p-profiles-edit .account .change-password a, .b-form input[type=submit], .b-contests-menu .results {
  1123. background: #3a3d50;
  1124. color: #FAFAFA;
  1125. }
  1126.  
  1127. .b-link_button.dark:hover, .b-poll .poll-actions .vote:hover, .b-shiki_editor .hidden-block .b-button.ok:hover, .p-profiles-edit .account .change-password a:hover, .b-form input[type=submit]:hover, .b-contests-menu .results:hover, .b-link_button.dark:focus, .b-poll .poll-actions .vote:focus, .b-shiki_editor .hidden-block .b-button.ok:focus, .p-profiles-edit .account .change-password a:focus, .b-form input[type=submit]:focus, .b-contests-menu .results:focus {
  1128. background: #4b4f68;
  1129. color: #FAFAFA;
  1130. }
  1131.  
  1132. .b-link_button.dark:active, .b-poll .poll-actions .vote:active, .b-shiki_editor .hidden-block .b-button.ok:active, .p-profiles-edit .account .change-password a:active, .b-form input[type=submit]:active, .b-contests-menu .results:active {
  1133. background: #36384a;
  1134. color: #FAFAFA;
  1135. }
  1136.  
  1137. .item-mobile, .buttons .editor-controls .b-tooltipped, header.head h1 a.back, header.head h2 a.back, .subheadline-buttons .item-edit, .profile-actions > a, .b-collection-filters .mylist-block .item-sign, .b-db_entry .c-actions .b-tooltipped, .b-image .delete, .b-image .confirm, .b-image .cancel, .b-image .mobile-edit, .b-list_switchers .switcher, .b-user_rate .rate-show .rate-number .item-add, .b-video_player .cc-player_controls .c-control .icon, .p-animes_collection-index .pagination .link,
  1138. .p-recommendations-index .pagination .link, .b-clubs-menu .club-actions .b-tooltipped, .p-dialogs .misc-links > a, .p-messages .mass-actions .action a, .p-profiles-show .about .item-edit, .b-stats_bar .compatibility a[href$='=similar'], .b-stats_bar .compatibility .text:first-child, .p-user_rates-index .list-lines tr.edit-form .remove, .p-user_rates-index .list-posters .user_rate .edit-user_rate {
  1139. display: inline-block;
  1140. vertical-align: top;
  1141. width: 40px;
  1142. height: 40px;
  1143. padding: 8px;
  1144. margin: 4px 8px 4px 0 !important;
  1145. border-radius: 2px;
  1146. transition: 0.16s cubic-bezier(0.4, 0, 0.6, 1);
  1147. }
  1148.  
  1149. .item-mobile:last-child, .buttons .editor-controls .b-tooltipped:last-child, header.head h1 a.back:last-child, header.head h2 a.back:last-child, .subheadline-buttons .item-edit:last-child, .profile-actions > a:last-child, .b-collection-filters .mylist-block .item-sign:last-child, .b-db_entry .c-actions .b-tooltipped:last-child, .b-image .delete:last-child, .b-image .confirm:last-child, .b-image .cancel:last-child, .b-image .mobile-edit:last-child, .b-list_switchers .switcher:last-child, .b-user_rate .rate-show .rate-number .item-add:last-child, .b-video_player .cc-player_controls .c-control .icon:last-child, .p-animes_collection-index .pagination .link:last-child,
  1150. .p-recommendations-index .pagination .link:last-child, .b-clubs-menu .club-actions .b-tooltipped:last-child, .p-dialogs .misc-links > a:last-child, .p-messages .mass-actions .action a:last-child, .p-profiles-show .about .item-edit:last-child, .b-stats_bar .compatibility a[href$='=similar']:last-child, .b-stats_bar .compatibility .text:last-child:first-child, .p-user_rates-index .list-lines tr.edit-form .remove:last-child, .p-user_rates-index .list-posters .user_rate .edit-user_rate:last-child {
  1151. margin-right: 0 !important;
  1152. }
  1153.  
  1154. .item-mobile, .buttons .editor-controls .b-tooltipped, header.head h1 a.back, header.head h2 a.back, .subheadline-buttons .item-edit, .profile-actions > a, .b-collection-filters .mylist-block .item-sign, .b-db_entry .c-actions .b-tooltipped, .b-image .delete, .b-image .confirm, .b-image .cancel, .b-image .mobile-edit, .b-list_switchers .switcher, .b-user_rate .rate-show .rate-number .item-add, .b-video_player .cc-player_controls .c-control .icon, .p-animes_collection-index .pagination .link,
  1155. .p-recommendations-index .pagination .link, .b-clubs-menu .club-actions .b-tooltipped, .p-dialogs .misc-links > a, .p-messages .mass-actions .action a, .p-profiles-show .about .item-edit, .b-stats_bar .compatibility a[href$='=similar'], .b-stats_bar .compatibility .text:first-child, .p-user_rates-index .list-lines tr.edit-form .remove, .p-user_rates-index .list-posters .user_rate .edit-user_rate {
  1156. color: #BDBDBD !important;
  1157. }
  1158.  
  1159. .item-mobile:hover, .buttons .editor-controls .b-tooltipped:hover, header.head h1 a.back:hover, header.head h2 a.back:hover, .subheadline-buttons .item-edit:hover, .profile-actions > a:hover, .b-collection-filters .mylist-block .item-sign:hover, .b-db_entry .c-actions .b-tooltipped:hover, .b-image .delete:hover, .b-image .confirm:hover, .b-image .cancel:hover, .b-image .mobile-edit:hover, .b-list_switchers .switcher:hover, .b-user_rate .rate-show .rate-number .item-add:hover, .b-video_player .cc-player_controls .c-control .icon:hover, .p-animes_collection-index .pagination .link:hover,
  1160. .p-recommendations-index .pagination .link:hover, .b-clubs-menu .club-actions .b-tooltipped:hover, .p-dialogs .misc-links > a:hover, .p-messages .mass-actions .action a:hover, .p-profiles-show .about .item-edit:hover, .b-stats_bar .compatibility a[href$='=similar']:hover, .b-stats_bar .compatibility .text:hover:first-child, .p-user_rates-index .list-lines tr.edit-form .remove:hover, .p-user_rates-index .list-posters .user_rate .edit-user_rate:hover {
  1161. background-color: #424242;
  1162. color: #EEEEEE !important;
  1163. text-decoration: none;
  1164. }
  1165.  
  1166. .b-ban .spoiler.collapse::after,
  1167. .b-log_entry .spoiler.collapse::after,
  1168. .b-user_rate_log .spoiler.collapse::after, .p-dialogs .misc-links > a::after, .p-messages .mass-actions .action a::after, .b-stats_bar .compatibility a[href$='=similar']::after, .b-stats_bar .compatibility .text:first-child::after, .p-achievements-index .b-list_switchers .switcher::after {
  1169. display: block !important;
  1170. position: absolute;
  1171. padding: .375rem .75rem;
  1172. margin: .25rem .75rem;
  1173. background-color: #616161;
  1174. border-radius: .125rem;
  1175. color: #eee;
  1176. font-size: .875rem;
  1177. line-height: 1.25rem;
  1178. white-space: nowrap;
  1179. z-index: 100;
  1180. pointer-events: none;
  1181. opacity: 0;
  1182. transition: .3s;
  1183. }
  1184.  
  1185. .b-ban .spoiler.collapse:hover::after,
  1186. .b-log_entry .spoiler.collapse:hover::after,
  1187. .b-user_rate_log .spoiler.collapse:hover::after, .p-dialogs .misc-links > a:hover::after, .p-messages .mass-actions .action a:hover::after, .b-stats_bar .compatibility a[href$='=similar']:hover::after, .b-stats_bar .compatibility .text:first-child:hover::after, .p-achievements-index .b-list_switchers .switcher:hover::after {
  1188. opacity: .9;
  1189. }
  1190.  
  1191. .b-ban .spoiler.collapse::after,
  1192. .b-log_entry .spoiler.collapse::after,
  1193. .b-user_rate_log .spoiler.collapse::after, .p-dialogs .misc-links > a::after, .p-messages .mass-actions .action a::after, .b-stats_bar .compatibility a[href$='=similar']::after, .b-stats_bar .compatibility .text:first-child::after {
  1194. right: 100%;
  1195. bottom: 0;
  1196. transform: translateX(0.75rem);
  1197. }
  1198.  
  1199. .b-ban .spoiler.collapse:hover::after,
  1200. .b-log_entry .spoiler.collapse:hover::after,
  1201. .b-user_rate_log .spoiler.collapse:hover::after, .p-dialogs .misc-links > a:hover::after, .p-messages .mass-actions .action a:hover::after, .b-stats_bar .compatibility a[href$='=similar']:hover::after, .b-stats_bar .compatibility .text:first-child:hover::after {
  1202. transform: translateX(0);
  1203. }
  1204.  
  1205. .p-achievements-index .b-list_switchers .switcher::after {
  1206. bottom: 100%;
  1207. transform: translateX(-50%) translateY(0.75em);
  1208. }
  1209.  
  1210. .p-achievements-index .b-list_switchers .switcher:hover::after {
  1211. transform: translateX(-50%) translateY(0);
  1212. }
  1213.  
  1214. .b-comment, .b-dialog, .b-message, .b-topic {
  1215. position: relative;
  1216. padding-top: .75rem !important;
  1217. padding-bottom: .75rem;
  1218. }
  1219.  
  1220. .b-comment > .inner header, .b-dialog > .inner header, .b-message > .inner header, .b-topic > .inner header {
  1221. padding-top: .25rem;
  1222. padding-bottom: .25rem;
  1223. margin-bottom: 0;
  1224. }
  1225.  
  1226. .b-comment > .inner header > a > img, .b-dialog > .inner header > a > img, .b-message > .inner header > a > img, .b-topic > .inner header > a > img {
  1227. width: 40px;
  1228. margin: 0 16px 0 0;
  1229. border-radius: 2px;
  1230. }
  1231.  
  1232. @media (min-width: 1025px) {
  1233. .b-comment > .inner header > a > img, .b-dialog > .inner header > a > img, .b-message > .inner header > a > img, .b-topic > .inner header > a > img {
  1234. margin-top: 4px;
  1235. }
  1236. }
  1237.  
  1238. .b-comment > .inner header .name-date, .b-dialog > .inner header .name-date, .b-message > .inner header .name-date, .b-topic > .inner header .name-date {
  1239. font-size: inherit;
  1240. line-height: inherit;
  1241. }
  1242.  
  1243. @media (max-width: 1024px) {
  1244. .b-comment > .inner header .name-date, .b-dialog > .inner header .name-date, .b-message > .inner header .name-date, .b-topic > .inner header .name-date {
  1245. line-height: 1.25rem;
  1246. }
  1247. }
  1248.  
  1249. .b-comment > .inner header .name-date a.name, .b-dialog > .inner header .name-date a.name, .b-message > .inner header .name-date a.name, .b-topic > .inner header .name-date a.name {
  1250. margin-right: .5rem;
  1251. color: inherit;
  1252. line-height: inherit;
  1253. }
  1254.  
  1255. .b-comment > .inner header .name-date a.name:hover, .b-dialog > .inner header .name-date a.name:hover, .b-message > .inner header .name-date a.name:hover, .b-topic > .inner header .name-date a.name:hover {
  1256. color: #8a8eac;
  1257. }
  1258.  
  1259. .b-comment > .inner header .name-date a.name:active, .b-dialog > .inner header .name-date a.name:active, .b-message > .inner header .name-date a.name:active, .b-topic > .inner header .name-date a.name:active {
  1260. color: #b7b8cc;
  1261. }
  1262.  
  1263. .b-comment > .inner header .name-date .time, .b-dialog > .inner header .name-date .time, .b-message > .inner header .name-date .time, .b-topic > .inner header .name-date .time {
  1264. position: relative;
  1265. padding-top: 0;
  1266. padding-left: 0;
  1267. color: #BDBDBD;
  1268. font-size: .875rem;
  1269. line-height: 1.25rem;
  1270. }
  1271.  
  1272. .b-comment > .inner header .name-date .time time, .b-dialog > .inner header .name-date .time time, .b-message > .inner header .name-date .time time, .b-topic > .inner header .name-date .time time {
  1273. font-size: .875rem;
  1274. line-height: inherit;
  1275. }
  1276.  
  1277. .b-comment > .inner .was_updated, .b-dialog > .inner .was_updated, .b-message > .inner .was_updated, .b-topic > .inner .was_updated {
  1278. padding-left: 3.5rem;
  1279. margin-bottom: 0;
  1280. color: #9E9E9E;
  1281. }
  1282.  
  1283. .b-comment > .inner .was_updated div, .b-dialog > .inner .was_updated div, .b-message > .inner .was_updated div, .b-topic > .inner .was_updated div {
  1284. vertical-align: top;
  1285. font-size: .75rem;
  1286. line-height: inherit;
  1287. }
  1288.  
  1289. .b-comment > .inner .was_updated .b-user16, .b-dialog > .inner .was_updated .b-user16, .b-message > .inner .was_updated .b-user16, .b-topic > .inner .was_updated .b-user16 {
  1290. padding-left: 14px;
  1291. margin-left: 4px;
  1292. }
  1293.  
  1294. .b-comment > .inner .was_updated .b-user16 img, .b-dialog > .inner .was_updated .b-user16 img, .b-message > .inner .was_updated .b-user16 img, .b-topic > .inner .was_updated .b-user16 img {
  1295. margin-top: 2px;
  1296. }
  1297.  
  1298. .aside-expanded.b-comment > .inner, .aside-expanded.b-dialog > .inner, .aside-expanded.b-message > .inner, .aside-expanded.b-topic > .inner {
  1299. margin-left: 0;
  1300. }
  1301.  
  1302. .aside-expanded.b-comment > .inner aside.buttons, .aside-expanded.b-dialog > .inner aside.buttons, .aside-expanded.b-message > .inner aside.buttons, .aside-expanded.b-topic > .inner aside.buttons {
  1303. position: absolute;
  1304. top: 0;
  1305. right: 0;
  1306. left: 0;
  1307. width: auto;
  1308. height: 100%;
  1309. padding: 8px 16px;
  1310. margin: 0 -16px;
  1311. background-color: rgba(24, 23, 32, 0.9);
  1312. border: 0;
  1313. overflow-y: auto;
  1314. z-index: 3;
  1315. }
  1316.  
  1317. .b-comment, .b-dialog, .b-message {
  1318. border-top: 0;
  1319. margin-bottom: 0;
  1320. }
  1321.  
  1322. .b-comment .inner .name-date a.name .normal, .b-dialog .inner .name-date a.name .normal, .b-message .inner .name-date a.name .normal {
  1323. vertical-align: top;
  1324. color: #FFFFFF;
  1325. font-size: inherit;
  1326. }
  1327.  
  1328. .b-comment .inner .body .ban .b-user16, .b-dialog .inner .body .ban .b-user16, .b-message .inner .body .ban .b-user16 {
  1329. margin-right: 0;
  1330. }
  1331.  
  1332. .b-comment .inner .body .ban .resolution, .b-dialog .inner .body .ban .resolution, .b-message .inner .body .ban .resolution {
  1333. color: #ef8d50;
  1334. }
  1335.  
  1336. .b-comment .inner .body .ban .resolution a, .b-dialog .inner .body .ban .resolution a, .b-message .inner .body .ban .resolution a {
  1337. color: #ef8d50;
  1338. }
  1339.  
  1340. .aside-expanded.b-comment aside.buttons, .aside-expanded.b-dialog aside.buttons, .aside-expanded.b-message aside.buttons {
  1341. border-top: 0;
  1342. }
  1343.  
  1344. .aside-expanded.b-comment aside.markers, .aside-expanded.b-dialog aside.markers, .aside-expanded.b-message aside.markers {
  1345. position: static;
  1346. }
  1347.  
  1348. .b-anime_status_tag, body[data-locale] .b-abuse_marker, body[data-locale] .b-broadcast_marker, body[data-locale] .b-offtopic_marker, body[data-locale] .b-summary_marker, body[data-locale] .b-spoiler_marker, body[data-locale] .b-new_marker {
  1349. width: auto;
  1350. padding: 2px .5em;
  1351. margin: .25rem 0 .25rem .5rem;
  1352. border: 1px solid;
  1353. border-radius: 2px;
  1354. font-size: .75rem;
  1355. font-weight: bold;
  1356. line-height: 1.5;
  1357. white-space: nowrap;
  1358. transition: 0.16s cubic-bezier(0.4, 0, 0.6, 1);
  1359. }
  1360.  
  1361. .b-anime_status_tag::before, body[data-locale] .b-abuse_marker::before, body[data-locale] .b-broadcast_marker::before, body[data-locale] .b-offtopic_marker::before, body[data-locale] .b-summary_marker::before, body[data-locale] .b-spoiler_marker::before, body[data-locale] .b-new_marker::before {
  1362. display: none !important;
  1363. }
  1364.  
  1365. .b-anime_status_tag::after, body[data-locale] .b-abuse_marker::after, body[data-locale] .b-broadcast_marker::after, body[data-locale] .b-offtopic_marker::after, body[data-locale] .b-summary_marker::after, body[data-locale] .b-spoiler_marker::after, body[data-locale] .b-new_marker::after {
  1366. content: attr(data-text);
  1367. text-transform: capitalize;
  1368. }
  1369.  
  1370. .off.b-anime_status_tag, body[data-locale] .off.b-abuse_marker, body[data-locale] .off.b-broadcast_marker, body[data-locale] .off.b-offtopic_marker, body[data-locale] .off.b-summary_marker, body[data-locale] .off.b-spoiler_marker, body[data-locale] .off.b-new_marker {
  1371. color: #9E9E9E;
  1372. }
  1373.  
  1374. .collapsed, .collapsed + .spoiler .hide-expanded, .b-comments .comments-loader, .b-comments .comments-hider, .b-comments .comments-expander, .b-comments .faye-loader, .b-comments .messages-postloader, .b-forum .faye-loader {
  1375. padding: .75rem 1.5rem;
  1376. margin: 0 0 .5rem;
  1377. background-color: #4a4a4a;
  1378. border: 0;
  1379. border-color: #5f6170;
  1380. border-radius: 3px;
  1381. color: inherit;
  1382. text-align: center;
  1383. line-height: 1;
  1384. cursor: pointer;
  1385. transition: 0.16s cubic-bezier(0.4, 0, 0.6, 1);
  1386. }
  1387.  
  1388. .collapsed:hover, .collapsed + .spoiler .hide-expanded:hover, .b-comments .comments-loader:hover, .b-comments .comments-hider:hover, .b-comments .comments-expander:hover, .b-comments .faye-loader:hover, .b-comments .messages-postloader:hover, .b-forum .faye-loader:hover {
  1389. background-color: #5f6170;
  1390. border: 0;
  1391. border-color: #212121;
  1392. color: inherit;
  1393. }
  1394.  
  1395. .collapsed:active, .collapsed + .spoiler .hide-expanded:active, .b-comments .comments-loader:active, .b-comments .comments-hider:active, .b-comments .comments-expander:active, .b-comments .faye-loader:active, .b-comments .messages-postloader:active, .b-forum .faye-loader:active {
  1396. background-color: #212121;
  1397. border: 0;
  1398. border-color: #4f4f4f;
  1399. }
  1400.  
  1401. .b-catalog_entry-tooltip .inner .line .value .tag, .b-entry-info .line .b-tag, .b-tag {
  1402. padding: 0 8px;
  1403. margin: 0 4px 0 0;
  1404. background-color: #4a4a4a;
  1405. border: 0;
  1406. border-radius: 3px;
  1407. color: #EEEEEE;
  1408. font-size: .875rem;
  1409. line-height: 24px;
  1410. }
  1411.  
  1412. .b-catalog_entry-tooltip .inner .line .value .tag:hover, .b-entry-info .line .b-tag:hover, .b-tag:hover {
  1413. padding: 0 8px;
  1414. margin: 0 4px 0 0;
  1415. background-color: #424242;
  1416. color: #FFFFFF;
  1417. }
  1418.  
  1419. .b-catalog_entry-tooltip .inner .line .value .tag:active, .b-entry-info .line .b-tag:active, .b-tag:active {
  1420. background-color: #4f4f4f;
  1421. }
  1422.  
  1423. .l-top_menu {
  1424. position: fixed;
  1425. top: 0;
  1426. right: 0;
  1427. left: 0;
  1428. width: 100%;
  1429. max-width: 100%;
  1430. height: auto;
  1431. margin: auto;
  1432. padding: 4px 0;
  1433. background-color: #1c1c24;
  1434. background-image: none;
  1435. border: none;
  1436. box-shadow: 0 2px 8px 2px rgba(0, 0, 0, 0.24);
  1437. color: #FAFAFA;
  1438. overflow: visible;
  1439. }
  1440.  
  1441. .l-top_menu .to-top-fix {
  1442. display: none;
  1443. }
  1444.  
  1445. .l-top_menu .inner {
  1446. margin: 0 .375em;
  1447. }
  1448.  
  1449. @media (min-width: 960px) {
  1450. .l-top_menu .inner {
  1451. margin: 0 .875em;
  1452. }
  1453. }
  1454.  
  1455. @media (min-width: 1025px) {
  1456. .l-top_menu .inner {
  1457. margin: 0 auto;
  1458. padding: 0 .875em;
  1459. }
  1460. }
  1461.  
  1462. .l-top_menu .inner > a:first-child {
  1463. float: left;
  1464. padding: calc((48px - 1em) / 2) 0.625rem;
  1465. margin: 0 0 0 32px;
  1466. color: inherit !important;
  1467. font-weight: bold;
  1468. line-height: 1;
  1469. -webkit-backface-visibility: hidden;
  1470. -moz-backface-visibility: hidden;
  1471. backface-visibility: hidden;
  1472. }
  1473.  
  1474. [data-locale='en'] .l-top_menu .inner > a:first-child {
  1475. text-transform: uppercase;
  1476. }
  1477.  
  1478. @media (min-width: 320px) {
  1479. .l-top_menu .inner > a:first-child {
  1480. margin-left: 40px;
  1481. font-size: 1.25em;
  1482. }
  1483. }
  1484.  
  1485. @media (min-width: 360px) {
  1486. .l-top_menu .inner > a:first-child {
  1487. margin-left: 56px;
  1488. }
  1489. }
  1490.  
  1491. @media (min-width: 1025px) {
  1492. .l-top_menu .inner > a:first-child {
  1493. margin-left: 0;
  1494. font-size: 1.125em;
  1495. }
  1496. }
  1497.  
  1498. .l-top_menu .inner > a:first-child::after {
  1499. content: attr(title);
  1500. }
  1501.  
  1502. .l-top_menu .inner .logo {
  1503. display: none;
  1504. }
  1505.  
  1506. /* Цвет текста пунктов меню при наведении */
  1507. /* Цвет текста активных пунктов меню */
  1508. /* По умолчанию: цвет текста наследуется от меню */
  1509. .l-top_menu .menu-items > .entry.selected,
  1510. .l-top_menu .menu-items > .entry > a:active {
  1511. color: inherit !important;
  1512. }
  1513.  
  1514. /* Цвет текста пунктов меню при наведении */
  1515. /* По умолчанию: цвет текста наследуется от меню */
  1516. .l-top_menu .menu-items > .entry:hover {
  1517. color: inherit;
  1518. }
  1519.  
  1520. /* ВЫПАДАЮЩЕЕ МЕНЮ */
  1521. @media only screen and (min-width: 1025px) {
  1522. /* Цвет фона выпадающего меню при наведении */
  1523. .l-top_menu .submenu,
  1524. .b-main_search ul.popup {
  1525. background: #191920;
  1526. }
  1527. /* Цвет пунктов выпадающего меню при щелчке */
  1528. /* Цвет активных пунктов выпадающего меню */
  1529. /* По умолчанию: затемненный цвет фона выпадающего меню */
  1530. .l-top_menu .submenu > .entry:active,
  1531. .l-top_menu .submenu > .entry.active {
  1532. background-color: rgba(0, 0, 0, 0.24);
  1533. }
  1534. /* Цвет пунктов выпадающего меню при наведении */
  1535. /* По умолчанию: осветленный цвет фона выпадающего меню */
  1536. .l-top_menu .submenu > .entry:hover {
  1537. background-color: rgba(255, 255, 255, 0.24);
  1538. }
  1539. /* Цвет текста выпадающих меню */
  1540. /* По умолчанию: цвет текста наследуется от меню */
  1541. .l-top_menu .menu-search > .entry,
  1542. .l-top_menu .menu-userbox > .entry,
  1543. .l-top_menu .submenu {
  1544. color: inherit;
  1545. }
  1546. /* Цвет текста выпадающих меню при щелчке */
  1547. /* Цвет текста активных пунктов выпадающего меню */
  1548. /* По умолчанию: цвет текста наследуется от выпадающего меню */
  1549. .l-top_menu .submenu > .entry:active,
  1550. .l-top_menu .submenu > .entry.active,
  1551. .b-main_search .popup li:active,
  1552. .b-main_search .popup li.active {
  1553. color: inherit;
  1554. }
  1555. /* Цвет текста выпадающих меню при наведении */
  1556. /* По умолчанию: цвет текста наследуется от выпадающего меню */
  1557. .l-top_menu .submenu > .entry:hover,
  1558. .b-main_search .popup li:hover {
  1559. color: inherit;
  1560. }
  1561. /* ЦВЕТА ПОИСКА */
  1562. /* Фон строки поиска */
  1563. .b-main_search .input {
  1564. background: rgba(250, 250, 250, 0.06);
  1565. color: inherit;
  1566. }
  1567. /* Набираемый текст в строке поиска */
  1568. .b-main_search .input input {
  1569. color: inherit;
  1570. }
  1571. /* Вспомогательный текст в строке поиска */
  1572. .b-main_search input::-webkit-input-placeholder {
  1573. color: rgba(250, 250, 250, 0.56);
  1574. }
  1575. .b-main_search input:-moz-placeholder {
  1576. color: rgba(250, 250, 250, 0.56);
  1577. }
  1578. .b-main_search input::-moz-placeholder {
  1579. color: rgba(250, 250, 250, 0.56);
  1580. }
  1581. .b-main_search input:-ms-input-placeholder {
  1582. color: rgba(250, 250, 250, 0.56);
  1583. }
  1584. }
  1585.  
  1586. /* ОБЩИЕ ЦВЕТА ПОИСКА */
  1587. .b-main_search .popup li:hover {
  1588. background-color: rgba(255, 255, 255, 0.24);
  1589. }
  1590.  
  1591. .b-main_search .popup li.active,
  1592. .b-main_search .popup li:active {
  1593. background-color: rgba(0, 0, 0, 0.24);
  1594. }
  1595.  
  1596. .l-top_menu .entry,
  1597. .b-main_search .popup li,
  1598. .b-main_search .popup li:hover,
  1599. .b-main_search .popup li:active {
  1600. color: inherit;
  1601. }
  1602.  
  1603. /* ЦВЕТ ИКОНОК в меню (для мобильной версии) */
  1604. /* По умолчанию: цвет текста наследуется от меню */
  1605. .l-top_menu .to-mobile-forum,
  1606. .l-top_menu .menu-mobile .search,
  1607. .l-top_menu .menu-mobile .menu,
  1608. .l-top_menu .menu-mobile #sign_in,
  1609. .l-top_menu .menu-userbox .search,
  1610. .l-top_menu .menu-userbox .menu,
  1611. .l-top_menu .menu-userbox #sign_in {
  1612. color: inherit;
  1613. }
  1614.  
  1615. /* END of Настройка цветов в меню */
  1616. /* NOTE: Максимальное разрешение SONY Xperia Z Ultra: 960x540px */
  1617. @media screen and (min-width: 480px) and (max-height: 540px) and (orientation: landscape) {
  1618. .l-top_menu {
  1619. padding: 0;
  1620. }
  1621. .l-page {
  1622. padding-top: 64px;
  1623. }
  1624. }
  1625.  
  1626. /* На планшетах и далее, высота меню равна 56px */
  1627. @media screen and (min-width: 961px) and (orientation: landscape) {
  1628. .l-top_menu {
  1629. padding: 4px 0;
  1630. }
  1631. }
  1632.  
  1633. .l-top_menu .to-mobile-forum {
  1634. display: inline-block;
  1635. vertical-align: top;
  1636. position: static;
  1637. left: 138px;
  1638. width: 40px;
  1639. height: 40px;
  1640. padding: 8px;
  1641. margin: 4px !important;
  1642. }
  1643.  
  1644. .l-top_menu .to-mobile-forum:before {
  1645. width: 1.5rem;
  1646. line-height: 1.5rem;
  1647. text-align: center;
  1648. font-size: 24px;
  1649. }
  1650.  
  1651. .l-top_menu .mobile-menu-toggler,
  1652. .l-top_menu .mobile-search-toggler {
  1653. position: absolute;
  1654. top: 0;
  1655. }
  1656.  
  1657. .l-top_menu .mobile-menu-toggler {
  1658. left: -.125em;
  1659. }
  1660.  
  1661. .l-top_menu .mobile-search-toggler {
  1662. right: 56px;
  1663. }
  1664.  
  1665. .l-top_menu .mobile-search-toggler.active {
  1666. background-color: transparent;
  1667. }
  1668.  
  1669. .l-top_menu .mobile-menu-toggler::after {
  1670. content: '';
  1671. position: fixed;
  1672. top: 0;
  1673. right: 0;
  1674. bottom: 0;
  1675. left: 0;
  1676. background-color: rgba(0, 0, 0, 0.48);
  1677. opacity: 0;
  1678. visibility: hidden;
  1679. transition: 0.24s cubic-bezier(0.4, 0, 0.6, 1);
  1680. z-index: 12;
  1681. }
  1682.  
  1683. .l-top_menu .mobile-menu-toggler.active::after {
  1684. opacity: 1;
  1685. visibility: visible;
  1686. }
  1687.  
  1688. @media (max-width: 1024px) {
  1689. .l-top_menu .menu-items {
  1690. display: block;
  1691. position: fixed;
  1692. top: 0;
  1693. right: 0;
  1694. bottom: 0;
  1695. left: 0;
  1696. width: calc(100% - 56px);
  1697. max-width: 320px;
  1698. padding: 8px 0;
  1699. margin: 0;
  1700. background: #5e5f6c;
  1701. box-shadow: 0 8px 10px -5px rgba(0, 0, 0, 0.2), 0 16px 24px 2px rgba(0, 0, 0, 0.14), 0 6px 30px 5px rgba(0, 0, 0, 0.12);
  1702. overflow-y: auto;
  1703. -webkit-transform: translateX(-110%);
  1704. transform: translateX(-110%);
  1705. transition: 0.24s cubic-bezier(0.4, 0, 0.6, 1);
  1706. z-index: 13;
  1707. }
  1708. .l-top_menu .menu-items.active {
  1709. -webkit-transform: translateX(0);
  1710. transform: translateX(0);
  1711. }
  1712. }
  1713.  
  1714. @media only screen and (min-width: 1025px) {
  1715. .l-top_menu .to-mobile-forum {
  1716. display: none;
  1717. }
  1718. .l-top_menu .menu-items {
  1719. margin-left: 0;
  1720. background-color: transparent;
  1721. }
  1722. .l-top_menu .menu-items > .entry:active {
  1723. background-color: inherit;
  1724. }
  1725. .l-top_menu .menu-items > .entry:active,
  1726. .l-top_menu .submenu > .entry:active,
  1727. .l-top_menu .menu-items > .entry > a {
  1728. color: inherit !important;
  1729. }
  1730. .l-top_menu .menu-items > .entry > .submenu {
  1731. margin-top: 4px;
  1732. margin-left: 0;
  1733. }
  1734. .l-top_menu .submenu.right {
  1735. right: 0px;
  1736. margin-top: 4px;
  1737. }
  1738. .b-main_search ul.popup,
  1739. .b-main_search.hovered .popup {
  1740. margin: 0;
  1741. margin-top: 12px;
  1742. }
  1743. .l-top_menu .submenu > .entry,
  1744. .b-main_search .popup li {
  1745. color: inherit;
  1746. }
  1747. .b-main_search.hovered .popup {
  1748. height: 304px;
  1749. }
  1750. .l-top_menu .menu-items > .entry.calendar > a,
  1751. .l-top_menu .menu-items > .entry.info > a {
  1752. padding: 0.9375rem;
  1753. }
  1754. .l-top_menu .menu-items > .entry.calendar > a:before,
  1755. .l-top_menu .menu-items > .entry.info > a:before {
  1756. display: block !important;
  1757. }
  1758. .l-top_menu .menu-items > .entry.calendar > a:after,
  1759. .l-top_menu .menu-items > .entry.info > a:after {
  1760. display: none;
  1761. }
  1762. }
  1763.  
  1764. .l-top_menu .menu-items > .entry {
  1765. float: none;
  1766. display: block;
  1767. padding: 0;
  1768. border: 0;
  1769. line-height: inherit;
  1770. }
  1771.  
  1772. @media (min-width: 1025px) {
  1773. .l-top_menu .menu-items > .entry {
  1774. display: inline-block;
  1775. vertical-align: top;
  1776. }
  1777. }
  1778.  
  1779. .l-top_menu .inner > a:first-child,
  1780. .l-top_menu .menu-items > .entry > a {
  1781. opacity: .87;
  1782. transition: 0.24s cubic-bezier(0.4, 0, 0.2, 1);
  1783. }
  1784.  
  1785. .l-top_menu .inner > a:first-child:hover,
  1786. .l-top_menu .menu-items > .entry > a:hover {
  1787. background-color: transparent !important;
  1788. opacity: 1;
  1789. }
  1790.  
  1791. .l-top_menu .menu-items > .entry.selected,
  1792. .l-top_menu .menu-items > .entry:hover {
  1793. background-color: transparent;
  1794. }
  1795.  
  1796. .l-top_menu .menu-items > .entry > a,
  1797. .l-top_menu .menu-items > .entry.sign_out {
  1798. padding: 1rem;
  1799. margin: 0;
  1800. font-size: inherit;
  1801. line-height: 1rem;
  1802. }
  1803.  
  1804. .l-top_menu .menu-items > .entry > .contest {
  1805. width: auto;
  1806. height: auto;
  1807. margin: auto;
  1808. background: inherit;
  1809. }
  1810.  
  1811. .l-top_menu .menu-items > .entry > .contest::before {
  1812. position: static;
  1813. margin: 0;
  1814. color: inherit;
  1815. }
  1816.  
  1817. @media screen and (min-width: 1025px) {
  1818. .l-top_menu .inner .logo,
  1819. .l-top_menu .menu-items > .entry > a,
  1820. .l-top_menu .menu-items > .entry.sign_out {
  1821. padding: calc((48px - 1rem) / 2) 0.625rem;
  1822. }
  1823. }
  1824.  
  1825. /* Текст вместо иконок в верхнем меню */
  1826. .l-top_menu .menu-items > .entry.calendar > a,
  1827. .l-top_menu .menu-items > .entry.info > a {
  1828. padding: 1em;
  1829. margin: 0;
  1830. line-height: 1;
  1831. }
  1832.  
  1833. .l-top_menu .menu-items > .entry.calendar > a::before,
  1834. .l-top_menu .menu-items > .entry.info > a::before {
  1835. display: none !important;
  1836. }
  1837.  
  1838. @media only screen and (min-width: 1025px) {
  1839. .l-top_menu .menu-items > .entry.calendar > a::before,
  1840. .l-top_menu .menu-items > .entry.info > a::before {
  1841. display: block !important;
  1842. }
  1843. }
  1844.  
  1845. @media only screen and (min-width: 1025px) {
  1846. .l-top_menu .menu-items > .entry.calendar > a::after,
  1847. .l-top_menu .menu-items > .entry.info > a::after {
  1848. display: none;
  1849. }
  1850. }
  1851.  
  1852. [data-locale='ru'] .l-top_menu .menu-items > .entry.calendar > a::after {
  1853. content: 'Календарь онгоингов';
  1854. }
  1855.  
  1856. [data-locale='en'] .l-top_menu .menu-items > .entry.calendar > a::after {
  1857. content: 'Calendar';
  1858. }
  1859.  
  1860. [data-locale='ru'] .l-top_menu .menu-items > .entry.info > a::after {
  1861. content: 'Информация';
  1862. }
  1863.  
  1864. [data-locale='en'] .l-top_menu .menu-items > .entry.info > a::after {
  1865. content: 'Info';
  1866. }
  1867.  
  1868. /* END of Текст вместо иконок в верхнем меню */
  1869. /* FIX: BACKFACE VISIBILITY */
  1870. .l-top_menu .menu-items > .entry > a {
  1871. -webkit-backface-visibility: hidden;
  1872. -moz-backface-visibility: hidden;
  1873. backface-visibility: hidden;
  1874. }
  1875.  
  1876. /* Уведомления о голосованиях */
  1877. .l-top_menu .menu-items > .entry > a.contest {
  1878. position: relative;
  1879. }
  1880.  
  1881. .l-top_menu .menu-items > .entry > a.contest:hover {
  1882. background-color: transparent !important;
  1883. }
  1884.  
  1885. .l-top_menu .menu-items > .entry > a.contest:after {
  1886. content: attr(data-count);
  1887. position: absolute;
  1888. top: .125rem;
  1889. right: .125rem;
  1890. width: 1.25rem;
  1891. background-color: #454d5f;
  1892. border-radius: 50%;
  1893. color: #FAFAFA;
  1894. font-size: .75rem;
  1895. line-height: 1.25rem;
  1896. text-align: center;
  1897. }
  1898.  
  1899. @media screen and (min-width: 1025px) {
  1900. .l-top_menu .menu-items > .entry > a.contest {
  1901. margin-left: -0.625rem;
  1902. }
  1903. .l-top_menu .menu-items > .entry > a.contest:after {
  1904. top: 0;
  1905. right: 0;
  1906. }
  1907. }
  1908.  
  1909. /* END of Уведомления о голосованиях */
  1910. .l-top_menu .submenu,
  1911. .b-main_search ul.popup {
  1912. min-width: 112px;
  1913. border: 0;
  1914. }
  1915.  
  1916. .b-main_search .popup li {
  1917. transition: 0s;
  1918. }
  1919.  
  1920. .l-top_menu .submenu > .entry {
  1921. height: auto;
  1922. padding: 0.5rem 0.625rem;
  1923. background-color: transparent;
  1924. border: 0;
  1925. font-family: inherit;
  1926. font-size: .875rem;
  1927. line-height: 1rem;
  1928. }
  1929.  
  1930. .l-top_menu .submenu > .entry:first-child,
  1931. .b-main_search ul.popup li:first-child {
  1932. margin-top: .5rem;
  1933. }
  1934.  
  1935. .l-top_menu .submenu > .entry:last-child,
  1936. .b-main_search ul.popup li:last-child {
  1937. margin-bottom: .5rem;
  1938. }
  1939.  
  1940. .l-top_menu .menu-items .submenu-toggler {
  1941. right: 0;
  1942. width: 48px;
  1943. height: 48px;
  1944. padding: .75rem;
  1945. margin: 0;
  1946. z-index: 10;
  1947. }
  1948.  
  1949. .l-top_menu .menu-items .submenu-toggler:before {
  1950. width: 24px;
  1951. line-height: 24px;
  1952. }
  1953.  
  1954. @media screen and (min-width: 1025px) {
  1955. .l-top_menu .menu-items .submenu-toggler,
  1956. .l-top_menu .inner .sign_out {
  1957. display: none;
  1958. }
  1959. .l-top_menu .menu-items > .entry {
  1960. color: inherit;
  1961. }
  1962. }
  1963.  
  1964. @media screen and (max-width: 1024px) {
  1965. .l-top_menu .submenu {
  1966. padding-left: 32px;
  1967. }
  1968. }
  1969.  
  1970. /* TOPMENU | SEARCH */
  1971. .l-top_menu .menu-search {
  1972. padding: 8px 0;
  1973. }
  1974.  
  1975. @media (max-width: 1024px) {
  1976. .l-top_menu .menu-search {
  1977. clear: left;
  1978. }
  1979. }
  1980.  
  1981. @media screen and (min-width: 1025px) {
  1982. .l-top_menu .menu-search {
  1983. padding: 0;
  1984. }
  1985. .l-top_menu .menu-search > .entry {
  1986. width: 224px;
  1987. padding: 8px 0 !important;
  1988. }
  1989. .b-main_search {
  1990. padding-right: 8px !important;
  1991. padding-left: 8px !important;
  1992. }
  1993. }
  1994.  
  1995. .b-main_search .input {
  1996. position: relative;
  1997. width: auto;
  1998. height: 2rem;
  1999. padding: 0;
  2000. margin: 0;
  2001. border-radius: 2px;
  2002. transition: background .3s;
  2003. }
  2004.  
  2005. .b-main_search.hovered .popup {
  2006. border: 0;
  2007. font-size: .875rem;
  2008. }
  2009.  
  2010. .b-main_search ul.popup li {
  2011. width: auto;
  2012. height: 2rem;
  2013. padding: 0.5rem 0.625rem;
  2014. border: 0;
  2015. font-family: inherit;
  2016. font-size: .875rem;
  2017. line-height: 1rem;
  2018. }
  2019.  
  2020. .b-main_search .input input {
  2021. width: 100%;
  2022. padding: 0 0.625rem;
  2023. font-family: inherit;
  2024. font-size: 1rem;
  2025. line-height: 2rem;
  2026. }
  2027.  
  2028. .b-main_search .input input.ac_loading {
  2029. width: 100%;
  2030. padding: 0 0.625rem;
  2031. }
  2032.  
  2033. .b-main_search ul.popup {
  2034. width: inherit;
  2035. }
  2036.  
  2037. /* END of SEARCH */
  2038. /* TOPMENU | SEARCHRESULT */
  2039. .ac_results,
  2040. .completable-block {
  2041. background: #5e5f6c;
  2042. color: #FFFFFF !important;
  2043. font-size: .75rem;
  2044. }
  2045.  
  2046. .ac_results.menu-suggest,
  2047. .completable-block.menu-suggest {
  2048. margin-top: -17px;
  2049. margin-left: 6px;
  2050. border: 0;
  2051. box-shadow: 0 2px 8px 2px rgba(0, 0, 0, 0.24);
  2052. }
  2053.  
  2054. .ac_results .name,
  2055. .completable-block .name {
  2056. color: inherit;
  2057. font-size: 14px;
  2058. }
  2059.  
  2060. .ac_odd {
  2061. background-color: #181720;
  2062. }
  2063.  
  2064. .ac_even {
  2065. background-color: #363643;
  2066. }
  2067.  
  2068. .ac_over {
  2069. background-color: rgba(255, 255, 255, 0.24);
  2070. }
  2071.  
  2072. .ac_results li {
  2073. padding: 0 .5rem;
  2074. border: none;
  2075. line-height: 2rem;
  2076. }
  2077.  
  2078. .b-main_search ul.popup,
  2079. .b-main_search.hovered .popup {
  2080. margin: 0;
  2081. }
  2082.  
  2083. .ac_results .name > strong {
  2084. background-color: #ff0;
  2085. color: #111;
  2086. }
  2087.  
  2088. .ac_results .character-suggest .animes {
  2089. line-height: 1.25rem;
  2090. }
  2091.  
  2092. .ac_results .character-suggest .animes > div {
  2093. margin: 2px 0 0;
  2094. }
  2095.  
  2096. .ac_results .character-suggest .avatar {
  2097. width: 40px;
  2098. height: auto;
  2099. max-height: 64px;
  2100. margin: 8px 0 0 8px;
  2101. clip-path: circle(20px at 20px 20px);
  2102. }
  2103.  
  2104. /* END of SEARCHRESULT */
  2105. /* TOPMENU | USERBOX */
  2106. .l-top_menu .menu-userbox {
  2107. position: absolute;
  2108. top: 0;
  2109. right: 0;
  2110. }
  2111.  
  2112. .l-top_menu .menu-userbox > .entry {
  2113. position: relative;
  2114. height: 48px;
  2115. padding: 0 !important;
  2116. margin: 0 .625rem 0 1.25rem !important;
  2117. cursor: default;
  2118. }
  2119.  
  2120. .entry.userbox > .avatar {
  2121. display: inline-block;
  2122. vertical-align: top;
  2123. position: relative;
  2124. width: 40px;
  2125. height: 40px;
  2126. margin: 4px 0;
  2127. border-radius: 100%;
  2128. }
  2129.  
  2130. .entry.userbox > .avatar:after {
  2131. content: '';
  2132. display: block;
  2133. position: absolute;
  2134. top: 0;
  2135. left: 0;
  2136. width: inherit;
  2137. height: inherit;
  2138. border-radius: 100%;
  2139. }
  2140.  
  2141. .entry.userbox > .avatar > img {
  2142. height: inherit;
  2143. }
  2144.  
  2145. .userbox > a .graphics-arrow-down,
  2146. .l-top_menu .menu-userbox .arrow-container,
  2147. .l-top_menu .menu-userbox .arrow-container .arrow-down {
  2148. display: none;
  2149. }
  2150.  
  2151. @media screen and (max-width: 1024px) {
  2152. .userbox img.avatar,
  2153. .menu .unread-count {
  2154. margin-top: 0;
  2155. }
  2156. }
  2157.  
  2158. .menu .unread-count {
  2159. position: absolute;
  2160. top: 0;
  2161. right: 0;
  2162. width: 1.25rem;
  2163. height: auto;
  2164. margin: 0;
  2165. border-radius: 100%;
  2166. line-height: 1.25rem;
  2167. z-index: 1;
  2168. }
  2169.  
  2170. @media screen and (min-width: 1025px) {
  2171. .l-top_menu .menu-userbox {
  2172. position: relative;
  2173. }
  2174. }
  2175.  
  2176. /* END of USERBOX */
  2177. /* TOPMENU | ICON */
  2178. .l-top_menu .menu-mobile .search,
  2179. .l-top_menu .menu-mobile .menu {
  2180. width: 40px;
  2181. height: 40px;
  2182. padding: 8px;
  2183. margin: 4px;
  2184. margin-left: 4px !important;
  2185. }
  2186.  
  2187. .l-top_menu .menu-mobile #sign_in,
  2188. .l-top_menu .menu-userbox #sign_in {
  2189. width: 40px;
  2190. height: 40px;
  2191. padding: 8px;
  2192. margin: 4px;
  2193. margin-left: 4px !important;
  2194. }
  2195.  
  2196. @media (min-width: 1025px) {
  2197. .l-top_menu .menu-mobile #sign_in,
  2198. .l-top_menu .menu-userbox #sign_in {
  2199. width: 48px;
  2200. height: 48px;
  2201. padding: 12px;
  2202. margin: 0;
  2203. }
  2204. }
  2205.  
  2206. @media (max-width: 1024px) {
  2207. .l-top_menu .menu-items > .entry > a.contest {
  2208. padding: .75em !important;
  2209. }
  2210. }
  2211.  
  2212. @media (min-width: 1025px) {
  2213. .l-top_menu .menu-items > .entry.calendar > a,
  2214. .l-top_menu .menu-items > .entry.info > a,
  2215. .l-top_menu .menu-items > .entry > a.contest {
  2216. padding: .875em;
  2217. }
  2218. }
  2219.  
  2220. .l-top_menu .menu-items > .entry.calendar > a::before,
  2221. .l-top_menu .menu-items > .entry.info > a::before,
  2222. .l-top_menu .menu-items > .entry > a.contest::before {
  2223. display: block;
  2224. width: 1em !important;
  2225. font-size: 24px !important;
  2226. line-height: 1 !important;
  2227. }
  2228.  
  2229. @media (min-width: 1025px) {
  2230. .l-top_menu .menu-items > .entry.calendar > a::before,
  2231. .l-top_menu .menu-items > .entry.info > a::before,
  2232. .l-top_menu .menu-items > .entry > a.contest::before {
  2233. font-size: 20px !important;
  2234. }
  2235. }
  2236.  
  2237.  
  2238.  
  2239.  
  2240. /**
  2241. * Иконки в меню
  2242. */
  2243. .l-top_menu .to-mobile-forum::before {
  2244. content: 'forum';
  2245. }
  2246.  
  2247. .l-top_menu .menu-mobile .menu::before {
  2248. content: 'menu';
  2249. }
  2250.  
  2251. .l-top_menu .menu-mobile .search::before {
  2252. content: 'search';
  2253. }
  2254.  
  2255. .l-top_menu .menu-userbox #sign_in::before {
  2256. content: 'exit_to_app';
  2257. }
  2258.  
  2259. .l-top_menu .menu-items > .entry > a::before,
  2260. .l-top_menu .menu-items > a::before {
  2261. display: inline-block;
  2262. vertical-align: top;
  2263. font-size: 20px;
  2264. line-height: 1;
  2265. }
  2266.  
  2267. .l-top_menu .menu-items > .entry.calendar > a::before,
  2268. .l-top_menu .menu-items > .entry.info > a::before {
  2269. display: inline-block !important;
  2270. }
  2271.  
  2272. .l-top_menu .menu-items > .entry > a[href$='/animes']::before {
  2273. content: 'ondemand_video';
  2274. }
  2275.  
  2276. .l-top_menu .menu-items > .entry.calendar > a::before {
  2277. content: 'today';
  2278. }
  2279.  
  2280. .l-top_menu .menu-items > .entry > a[href$='/mangas']::before {
  2281. content: 'photo_album';
  2282. }
  2283.  
  2284. .l-top_menu .menu-items > .entry > a[href$='/ranobe']::before {
  2285. content: 'book';
  2286. }
  2287.  
  2288. .l-top_menu .menu-items > .entry > a[href$='/contests']::before {
  2289. content: 'equalizer';
  2290. transform: scale(-1, 1);
  2291. }
  2292.  
  2293. .l-top_menu .menu-items > .entry > .contest::before {
  2294. content: 'poll';
  2295. }
  2296.  
  2297. .l-top_menu .menu-items > .entry > a[href$='/forum']::before {
  2298. content: 'forum';
  2299. }
  2300.  
  2301. .l-top_menu .menu-items > .entry.info > a::before {
  2302. content: 'info';
  2303. }
  2304.  
  2305. .l-top_menu .menu-items > .entry > a[href$='/for_right_holders']::before {
  2306. content: 'copyright';
  2307. }
  2308.  
  2309. .l-top_menu .menu-items > .entry > a[href='https://shikimori.org/']::before {
  2310. content: 'home';
  2311. }
  2312.  
  2313. .l-top_menu .menu-items > .entry.sign_out::before {
  2314. content: 'open_in_new';
  2315. }
  2316.  
  2317. .l-top_menu .menu-items .submenu-toggler::before {
  2318. content: 'arrow_drop_down';
  2319. }
  2320.  
  2321. .l-top_menu .menu-items .submenu-toggler.active::before {
  2322. content: 'arrow_drop_down';
  2323. transform: rotate(180deg);
  2324. }
  2325.  
  2326. @media (max-width: 1024px) {
  2327. .l-top_menu .menu-items .submenu {
  2328. padding-left: 3.5em;
  2329. }
  2330. .l-top_menu .menu-items .submenu > .entry {
  2331. display: block;
  2332. padding: .5em 1em;
  2333. margin: 0;
  2334. font-size: 1em;
  2335. }
  2336. .l-top_menu .menu-items > .entry.selected > a,
  2337. .l-top_menu .menu-items .submenu > .entry.active {
  2338. background-color: rgba(0, 0, 0, 0.12);
  2339. }
  2340. .l-top_menu .menu-items > .entry > a,
  2341. .l-top_menu .menu-items > .entry.calendar > a,
  2342. .l-top_menu .menu-items > .entry.info > a,
  2343. .l-top_menu .menu-items > .entry.sign_out {
  2344. padding: .75em 1rem;
  2345. line-height: 1.5;
  2346. }
  2347. .l-top_menu .menu-items > .entry > a::before,
  2348. .l-top_menu .menu-items > a::before {
  2349. margin-right: 32px;
  2350. color: #BDBDBD;
  2351. font-size: 24px;
  2352. }
  2353. }
  2354.  
  2355. @media screen and (min-width: 1025px) {
  2356. .l-top_menu .menu-items > .entry > a::before,
  2357. .l-top_menu .menu-items > a::before {
  2358. display: none;
  2359. }
  2360. }
  2361.  
  2362.  
  2363.  
  2364.  
  2365. .item-mobile {
  2366. position: relative;
  2367. margin: 4px 0 4px 8px !important;
  2368. border-radius: 100%;
  2369. z-index: 4;
  2370. }
  2371.  
  2372. .item-mobile::before {
  2373. content: 'more_vert';
  2374. }
  2375.  
  2376. .item-mobile.selected {
  2377. color: #EEEEEE;
  2378. }
  2379.  
  2380. .item-mobile.selected::before {
  2381. content: 'clear';
  2382. }
  2383.  
  2384. @media (min-width: 1025px) {
  2385. .item-mobile {
  2386. display: none;
  2387. }
  2388. }
  2389.  
  2390. .buttons {
  2391. margin-right: 0;
  2392. color: inherit;
  2393. font-family: inherit;
  2394. font-size: inherit;
  2395. font-weight: 700;
  2396. }
  2397.  
  2398. .buttons .editor-controls {
  2399. overflow-x: auto;
  2400. }
  2401.  
  2402. .buttons .editor-controls .b-tooltipped.selected {
  2403. color: #454d5f !important;
  2404. }
  2405.  
  2406. .buttons .item-save::before {
  2407. content: 'save';
  2408. }
  2409.  
  2410. .buttons .item-moderation::before {
  2411. content: 'flag';
  2412. }
  2413.  
  2414. .buttons .item-preview::before {
  2415. content: 'visibility';
  2416. }
  2417.  
  2418. .buttons .item-unpreview::before {
  2419. content: 'visibility_off';
  2420. }
  2421.  
  2422. .buttons .item-quote::before {
  2423. content: 'format_quote';
  2424. }
  2425.  
  2426. .buttons .item-reply::before {
  2427. content: 'reply';
  2428. }
  2429.  
  2430. .buttons .item-edit::before {
  2431. content: 'mode_edit';
  2432. }
  2433.  
  2434. .buttons .item-delete::before,
  2435. .buttons .item-delete-confirm::before {
  2436. content: 'delete';
  2437. }
  2438.  
  2439. .buttons .item-apply::before,
  2440. .buttons .item-request-confirm::before {
  2441. content: 'done';
  2442. }
  2443.  
  2444. .buttons .item-cancel::before,
  2445. .buttons .item-request-reject::before,
  2446. .buttons .item-delete-cancel::before,
  2447. .buttons .item-moderation-cancel::before {
  2448. content: 'clear';
  2449. }
  2450.  
  2451. .buttons .item-subscribe::before {
  2452. content: 'star';
  2453. }
  2454.  
  2455. .buttons .item-offtopic::before {
  2456. content: 'speaker_notes_off';
  2457. }
  2458.  
  2459. .buttons .item-offtopic.selected {
  2460. color: #ef5350;
  2461. }
  2462.  
  2463. .buttons .item-summary::before {
  2464. content: 'check_circle';
  2465. }
  2466.  
  2467. .buttons .item-summary.selected {
  2468. color: #66bb6a;
  2469. }
  2470.  
  2471. .buttons .item-spoiler::before {
  2472. content: 'sms_failed';
  2473. }
  2474.  
  2475. .buttons .item-abuse::before {
  2476. content: 'pan_tool';
  2477. }
  2478.  
  2479. .buttons .item-ban::before {
  2480. content: 'gavel';
  2481. }
  2482.  
  2483. .buttons .item-ignore::before {
  2484. content: 'do_not_disturb_on';
  2485. }
  2486.  
  2487. .buttons .item-ignore.selected::before {
  2488. content: 'do_not_disturb_off';
  2489. }
  2490.  
  2491. .buttons .editor-bold::before {
  2492. content: 'format_bold';
  2493. }
  2494.  
  2495. .buttons .editor-italic::before {
  2496. content: 'format_italic';
  2497. }
  2498.  
  2499. .buttons .editor-underline::before {
  2500. content: 'format_underlined';
  2501. }
  2502.  
  2503. .buttons .editor-strike::before {
  2504. content: 'strikethrough_s';
  2505. }
  2506.  
  2507. .buttons .editor-link::before {
  2508. content: 'insert_link';
  2509. }
  2510.  
  2511. .buttons .editor-image::before {
  2512. content: 'insert_photo';
  2513. }
  2514.  
  2515. .buttons .editor-quote::before {
  2516. content: 'format_quote';
  2517. }
  2518.  
  2519. .buttons .editor-spoiler::before {
  2520. content: 'error_outline';
  2521. }
  2522.  
  2523. .buttons .editor-file::before {
  2524. content: 'attach_file';
  2525. }
  2526.  
  2527. .buttons .editor-smiley::before {
  2528. content: 'insert_emoticon';
  2529. }
  2530.  
  2531. .buttons .editor-file {
  2532. position: relative;
  2533. }
  2534.  
  2535. .buttons .editor-file span,
  2536. .buttons .editor-file a {
  2537. top: 0;
  2538. left: 0;
  2539. width: 40px;
  2540. height: 40px;
  2541. margin: 0 !important;
  2542. }
  2543.  
  2544. .buttons .editor-file input {
  2545. left: 0;
  2546. width: 40px;
  2547. height: 40px;
  2548. border: 0;
  2549. font-size: 40px;
  2550. }
  2551.  
  2552. .buttons [class*='item-'] {
  2553. vertical-align: top;
  2554. width: 220px;
  2555. padding: 11px 16px;
  2556. margin-right: auto !important;
  2557. margin-left: auto !important;
  2558. color: #BDBDBD !important;
  2559. line-height: 18px !important;
  2560. transition: 0.16s cubic-bezier(0.4, 0, 0.6, 1);
  2561. }
  2562.  
  2563. @media (min-width: 1025px) {
  2564. .buttons [class*='item-'] {
  2565. width: 32px;
  2566. height: 32px;
  2567. padding: 7px;
  2568. margin-left: 8px !important;
  2569. border-radius: 2px;
  2570. line-height: 18px !important;
  2571. }
  2572. }
  2573.  
  2574. .buttons [class*='item-']:hover {
  2575. background-color: #424242;
  2576. color: #EEEEEE !important;
  2577. }
  2578.  
  2579. .buttons [class*='item-']::before {
  2580. display: inline-block;
  2581. vertical-align: top;
  2582. }
  2583.  
  2584. .buttons [class*='item-']::after {
  2585. vertical-align: top;
  2586. padding-left: 12px;
  2587. font-size: 16px;
  2588. line-height: 18px;
  2589. }
  2590.  
  2591. /**
  2592. * Headline
  2593. * Изменение подзаголовков разделов и ссылок в них.
  2594. */
  2595. header.head {
  2596. margin-bottom: 1.5rem;
  2597. }
  2598.  
  2599. header.head h1, header.head h2 {
  2600. padding: .5rem 0;
  2601. font-family: inherit;
  2602. font-size: 1.5rem;
  2603. line-height: 2rem;
  2604. color: inherit;
  2605. }
  2606.  
  2607. header.head h1 a.back:nth-child(n), header.head h2 a.back:nth-child(n) {
  2608. margin: -4px 24px -4px -8px !important;
  2609. }
  2610.  
  2611. @media (min-width: 1025px) {
  2612. header.head h1 a.back:nth-child(n), header.head h2 a.back:nth-child(n) {
  2613. margin: -4px 16px -4px 0 !important;
  2614. }
  2615. }
  2616.  
  2617. header.head h1 a.back::before, header.head h2 a.back::before {
  2618. content: 'arrow_back';
  2619. position: static;
  2620. color: inherit;
  2621. }
  2622.  
  2623. header.head h1 a.back::after, header.head h2 a.back::after {
  2624. display: none;
  2625. }
  2626.  
  2627. header.head .misc, header.head a.edit {
  2628. color: #9E9E9E;
  2629. }
  2630.  
  2631. header.head a.misc, header.head a.edit {
  2632. color: #57576a;
  2633. }
  2634.  
  2635. header.head a.misc:hover, header.head a.edit:hover {
  2636. color: #8a8eac;
  2637. }
  2638.  
  2639. header.head a.misc:active, header.head a.edit:active {
  2640. color: #b7b8cc;
  2641. }
  2642.  
  2643. header.head .notice {
  2644. margin: .5rem 0;
  2645. margin-top: -.25rem;
  2646. font-size: .875rem;
  2647. line-height: 1.25rem;
  2648. }
  2649.  
  2650. .headline {
  2651. padding: 8px 0;
  2652. margin: 8px 0;
  2653. background: none;
  2654. border: 0;
  2655. font-size: 24px;
  2656. font-weight: normal;
  2657. line-height: 32px;
  2658. text-transform: none;
  2659. }
  2660.  
  2661. .midheadline,
  2662. .subheadline,
  2663. .mischeadline, .b-stats_bar .title, .p-dashboards-show .c-my_list .title, .p-profiles .lifetime .title, .p-profiles .activity .title {
  2664. padding: 16px;
  2665. margin: 0 -16px;
  2666. background-color: transparent;
  2667. border: 0;
  2668. font-size: .875rem;
  2669. font-weight: 700;
  2670. line-height: 1rem;
  2671. text-transform: uppercase;
  2672. }
  2673.  
  2674. .headline > a, .midheadline > a, .subheadline > a {
  2675. min-width: 0;
  2676. margin: -.625rem -1rem;
  2677. }
  2678.  
  2679. .headline > a::before, .midheadline > a::before, .subheadline > a::before {
  2680. content: 'chevron_right';
  2681. right: 0;
  2682. left: 0;
  2683. width: auto !important;
  2684. margin-top: -6px;
  2685. text-align: right;
  2686. line-height: 32px !important;
  2687. opacity: 0;
  2688. pointer-events: auto;
  2689. }
  2690.  
  2691. .headline > a:hover, .midheadline > a:hover, .subheadline > a:hover {
  2692. text-decoration: none;
  2693. }
  2694.  
  2695. .headline.linkheadline > a, .midheadline.linkheadline > a, .subheadline.linkheadline > a {
  2696. color: #3a3d50 !important;
  2697. text-decoration: none;
  2698. }
  2699.  
  2700. .subheadline .misc-link {
  2701. float: right;
  2702. }
  2703.  
  2704. .subheadline .misc-links {
  2705. padding-left: .5em;
  2706. }
  2707.  
  2708. .subheadline .misc-links > a {
  2709. color: #57576a;
  2710. font-size: .875rem;
  2711. }
  2712.  
  2713. .subheadline .misc-links > a:hover {
  2714. color: #8a8eac;
  2715. }
  2716.  
  2717. .subheadline .misc-links > a:active {
  2718. color: #b7b8cc;
  2719. }
  2720.  
  2721. .subheadline .misc-links > a.selected {
  2722. color: #8a8eac;
  2723. }
  2724.  
  2725. .subheadline .misc-links > a.selected:hover {
  2726. color: #b7b8cc;
  2727. }
  2728.  
  2729. .subheadline-input {
  2730. padding: 5px 8px;
  2731. margin-top: 8px !important;
  2732. border-radius: 2px !important;
  2733. font-size: 14px;
  2734. line-height: inherit !important;
  2735. }
  2736.  
  2737. @media (max-width: 767px) {
  2738. .subheadline-input {
  2739. padding-bottom: 5px !important;
  2740. padding-top: 5px !important;
  2741. }
  2742. }
  2743.  
  2744. .subheadline-buttons {
  2745. right: 0;
  2746. margin: 0;
  2747. }
  2748.  
  2749. .subheadline-buttons .item-edit::before {
  2750. content: 'edit';
  2751. }
  2752.  
  2753. .subheadline-buttons + .subheadline {
  2754. padding-right: 3rem;
  2755. }
  2756.  
  2757. /* SVG-графики на страницах о сайте и индустрии аниме */
  2758. .highcharts-root .highcharts-background {
  2759. fill: #181720;
  2760. }
  2761.  
  2762. .highcharts-root .highcharts-yaxis-grid .highcharts-grid-line,
  2763. .highcharts-root .highcharts-xaxis .highcharts-tick,
  2764. .highcharts-root .highcharts-xaxis .highcharts-axis-line {
  2765. stroke: #4f4f4f;
  2766. }
  2767.  
  2768. .highcharts-root .highcharts-legend-item text {
  2769. color: #FFFFFF !important;
  2770. fill: #FFFFFF !important;
  2771. }
  2772.  
  2773. .highcharts-root .highcharts-legend-item.highcharts-legend-item-hidden text {
  2774. color: #EEEEEE !important;
  2775. fill: #EEEEEE !important;
  2776. }
  2777.  
  2778. .highcharts-root .highcharts-axis-labels text {
  2779. color: #BDBDBD !important;
  2780. fill: #BDBDBD !important;
  2781. }
  2782.  
  2783. .highcharts-root .highcharts-text-outline {
  2784. display: none;
  2785. }
  2786.  
  2787. .highcharts-root .highcharts-text-outline ~ tspan {
  2788. color: #FFFFFF !important;
  2789. fill: #FFFFFF !important;
  2790. }
  2791.  
  2792. .p-statistics-index #total,
  2793. .p-statistics-index #by_kind,
  2794. .p-statistics-index #by_rating,
  2795. .p-statistics-index #by_genre,
  2796. .p-statistics-index #by_studio {
  2797. min-width: 0 !important;
  2798. overflow-x: auto;
  2799. }
  2800.  
  2801. .highcharts-container {
  2802. max-width: 100%;
  2803. }
  2804.  
  2805. text,
  2806. .highcharts-tooltip text tspan:last-child {
  2807. font-weight: bold;
  2808. }
  2809.  
  2810. .profile-actions .mail::before {
  2811. content: 'mail';
  2812. }
  2813.  
  2814. .profile-actions .talk::before {
  2815. content: 'message';
  2816. }
  2817.  
  2818. .profile-actions .fav-add::before {
  2819. content: 'person_add';
  2820. }
  2821.  
  2822. .profile-actions .fav-remove::before {
  2823. content: 'person';
  2824. color: #454d5f;
  2825. }
  2826.  
  2827. .profile-actions .fav-remove:hover::before {
  2828. content: 'person_outline';
  2829. color: inherit;
  2830. }
  2831.  
  2832. .profile-actions .ignore-add::before {
  2833. content: 'do_not_disturb_on';
  2834. }
  2835.  
  2836. .profile-actions .ignore-remove::before {
  2837. content: 'do_not_disturb_off';
  2838. }
  2839.  
  2840. .profile-actions .settings::before {
  2841. content: 'settings';
  2842. }
  2843.  
  2844. .profile-actions .ban::before {
  2845. content: 'gavel';
  2846. }
  2847.  
  2848. .c-actions .edit::before {
  2849. content: 'build';
  2850. }
  2851.  
  2852. .c-actions .fav-remove:hover::before,
  2853. .c-actions .fav-add::before {
  2854. content: 'favorite_border';
  2855. }
  2856.  
  2857. .c-actions .fav-add:hover::before,
  2858. .c-actions .fav-remove::before {
  2859. content: 'favorite';
  2860. }
  2861.  
  2862. .c-actions .new_review::before {
  2863. content: 'rate_review';
  2864. }
  2865.  
  2866. .c-actions .new_comment::before {
  2867. content: 'chat_bubble';
  2868. }
  2869.  
  2870. /* Всплывающая подсказка */
  2871. .tipsy {
  2872. padding: .875rem;
  2873. font-size: .875rem;
  2874. opacity: .9 !important;
  2875. pointer-events: none;
  2876. }
  2877.  
  2878. .tipsy-arrow {
  2879. display: none;
  2880. }
  2881.  
  2882. .tipsy-inner {
  2883. padding: .375rem 1rem;
  2884. background-color: #616161;
  2885. border-radius: 3px;
  2886. box-shadow: none;
  2887. color: #eee;
  2888. text-align: left;
  2889. }
  2890.  
  2891. /* TOAST */
  2892. .toast-message {
  2893. display: inline-block;
  2894. vertical-align: top;
  2895. line-height: 1.5rem;
  2896. }
  2897.  
  2898. .toast-top-right {
  2899. top: auto;
  2900. bottom: 0;
  2901. right: 0;
  2902. left: 0;
  2903. }
  2904.  
  2905. #toast-container {
  2906. line-height: 1.5rem;
  2907. }
  2908.  
  2909. #toast-container > div {
  2910. width: 100%;
  2911. max-width: 25rem;
  2912. padding: .75rem 1.5rem;
  2913. margin: auto;
  2914. background-size: 0;
  2915. border-radius: 0;
  2916. }
  2917.  
  2918. #toast-container > .toast-error::before {
  2919. content: 'error_outline';
  2920. float: left;
  2921. margin: 0 1rem 0 -.5rem;
  2922. font-size: 1.5rem !important;
  2923. }
  2924.  
  2925. .toast,
  2926. .toast-success,
  2927. .toast-error {
  2928. background-color: #323232;
  2929. }
  2930.  
  2931. .tooltip-inner {
  2932. min-height: 3.5rem;
  2933. padding: 1rem;
  2934. background: #5e5f6c;
  2935. border: 0;
  2936. border-radius: 2px;
  2937. box-shadow: 0 4px 10px 2px rgba(0, 0, 0, 0.24);
  2938. color: #FFFFFF !important;
  2939. overflow: hidden;
  2940. }
  2941.  
  2942. .tooltip-arrow {
  2943. display: none;
  2944. }
  2945.  
  2946. .tooltip-inner .close {
  2947. top: .25em;
  2948. right: .25em;
  2949. width: auto;
  2950. padding: .375em;
  2951. background: transparent;
  2952. border-radius: 50%;
  2953. color: inherit;
  2954. font-size: 1rem;
  2955. }
  2956.  
  2957. .tooltip-inner .close:hover {
  2958. color: #8a8eac;
  2959. }
  2960.  
  2961. .tooltip-inner .close:active {
  2962. color: #b7b8cc;
  2963. }
  2964.  
  2965. .tooltip-inner .close::before {
  2966. content: 'close';
  2967. font-size: 20px !important;
  2968. }
  2969.  
  2970. .tooltip-inner .close::after {
  2971. display: none;
  2972. }
  2973.  
  2974. /**
  2975. * Simple <paper-spinner>
  2976. * MIT License
  2977. * Copyright (c) 2015 Chris Nager
  2978. * https://github.com/chrisnager/simple-paper-spinner
  2979. */
  2980. .tooltip-details .ajax-loading {
  2981. display: block;
  2982. top: 50%;
  2983. left: 50%;
  2984. width: 1.75em;
  2985. height: 1.75em;
  2986. min-height: 0;
  2987. margin: 3em auto;
  2988. background: #5e5f6c;
  2989. background-image: none;
  2990. border-radius: 50%;
  2991. box-shadow: inset 0 0 0 0.1875em;
  2992. overflow: hidden;
  2993. will-change: transform;
  2994. -webkit-animation: spin 2666ms linear infinite;
  2995. animation: spin 2666ms linear infinite;
  2996. -webkit-clip-path: circle(0.875em at center);
  2997. clip-path: circle(0.875em at center);
  2998. }
  2999.  
  3000. .tooltip-details .ajax-loading::after, .tooltip-details .ajax-loading::before {
  3001. content: '';
  3002. position: absolute;
  3003. width: 7em;
  3004. height: 1.75em;
  3005. background-color: inherit;
  3006. }
  3007.  
  3008. .tooltip-details .ajax-loading::after {
  3009. -webkit-transform: skewX(-80deg) translate(0.875em, 0.875em);
  3010. transform: skewX(-80deg) translate(0.875em, 0.875em);
  3011. -webkit-animation: shape-shift-after 1066.4ms cubic-bezier(0.4, 0, 0.2, 1) infinite alternate;
  3012. animation: shape-shift-after 1066.4ms cubic-bezier(0.4, 0, 0.2, 1) infinite alternate;
  3013. }
  3014.  
  3015. .tooltip-details .ajax-loading::before {
  3016. -webkit-transform: skewX(80deg) translate(0.875em, -0.875em);
  3017. transform: skewX(80deg) translate(0.875em, -0.875em);
  3018. -webkit-animation: shape-shift-before 1066.4ms cubic-bezier(0.4, 0, 0.2, 1) infinite alternate;
  3019. animation: shape-shift-before 1066.4ms cubic-bezier(0.4, 0, 0.2, 1) infinite alternate;
  3020. }
  3021.  
  3022. @-webkit-keyframes spin {
  3023. to {
  3024. -webkit-transform: rotate(1080deg);
  3025. transform: rotate(1080deg);
  3026. }
  3027. }
  3028.  
  3029. @keyframes spin {
  3030. to {
  3031. -webkit-transform: rotate(1080deg);
  3032. transform: rotate(1080deg);
  3033. }
  3034. }
  3035.  
  3036. @-webkit-keyframes shape-shift-before {
  3037. to {
  3038. -webkit-transform: skewX(-45deg) translate(0.875em, -0.875em);
  3039. transform: skewX(-45deg) translate(0.875em, -0.875em);
  3040. }
  3041. }
  3042.  
  3043. @keyframes shape-shift-before {
  3044. to {
  3045. -webkit-transform: skewX(-45deg) translate(0.875em, -0.875em);
  3046. transform: skewX(-45deg) translate(0.875em, -0.875em);
  3047. }
  3048. }
  3049.  
  3050. @-webkit-keyframes shape-shift-after {
  3051. to {
  3052. -webkit-transform: skewX(45deg) translate(0.875em, 0.875em);
  3053. transform: skewX(45deg) translate(0.875em, 0.875em);
  3054. }
  3055. }
  3056.  
  3057. @keyframes shape-shift-after {
  3058. to {
  3059. -webkit-transform: skewX(45deg) translate(0.875em, 0.875em);
  3060. transform: skewX(45deg) translate(0.875em, 0.875em);
  3061. }
  3062. }
  3063.  
  3064. .b-ban,
  3065. .b-log_entry,
  3066. .b-user_rate_log {
  3067. position: relative;
  3068. padding: .5rem 0;
  3069. padding-right: 2.5rem !important;
  3070. font-size: .875rem;
  3071. line-height: 1.5rem;
  3072. }
  3073.  
  3074. @media (min-width: 1025px) {
  3075. .b-ban,
  3076. .b-log_entry,
  3077. .b-user_rate_log {
  3078. padding: .25rem 0;
  3079. }
  3080. }
  3081.  
  3082. .b-ban > span,
  3083. .b-log_entry > span,
  3084. .b-user_rate_log > span {
  3085. padding-right: 0.375em;
  3086. }
  3087.  
  3088. .b-ban .date,
  3089. .b-log_entry .date,
  3090. .b-user_rate_log .date {
  3091. color: #BDBDBD;
  3092. font-size: inherit;
  3093. }
  3094.  
  3095. .b-ban a, .b-ban .link,
  3096. .b-log_entry a,
  3097. .b-log_entry .link,
  3098. .b-user_rate_log a,
  3099. .b-user_rate_log .link {
  3100. color: #57576a;
  3101. }
  3102.  
  3103. .b-ban a:hover, .b-ban .link:hover,
  3104. .b-log_entry a:hover,
  3105. .b-log_entry .link:hover,
  3106. .b-user_rate_log a:hover,
  3107. .b-user_rate_log .link:hover {
  3108. color: #8a8eac;
  3109. }
  3110.  
  3111. .b-ban a:active, .b-ban .link:active,
  3112. .b-log_entry a:active,
  3113. .b-log_entry .link:active,
  3114. .b-user_rate_log a:active,
  3115. .b-user_rate_log .link:active {
  3116. color: #b7b8cc;
  3117. }
  3118.  
  3119. .b-ban a:hover .id-label, .b-ban .link:hover .id-label,
  3120. .b-log_entry a:hover .id-label,
  3121. .b-log_entry .link:hover .id-label,
  3122. .b-user_rate_log a:hover .id-label,
  3123. .b-user_rate_log .link:hover .id-label {
  3124. color: inherit;
  3125. }
  3126.  
  3127. .b-ban .id-label,
  3128. .b-log_entry .id-label,
  3129. .b-user_rate_log .id-label {
  3130. color: #9E9E9E;
  3131. }
  3132.  
  3133. .b-ban .b-user16 span,
  3134. .b-log_entry .b-user16 span,
  3135. .b-user_rate_log .b-user16 span {
  3136. padding-right: .5rem;
  3137. }
  3138.  
  3139. .b-ban .spoiler.collapse,
  3140. .b-log_entry .spoiler.collapse,
  3141. .b-user_rate_log .spoiler.collapse {
  3142. position: absolute;
  3143. top: 0;
  3144. right: 0;
  3145. padding: .375rem;
  3146. border-radius: 3px;
  3147. color: #BDBDBD;
  3148. transition: 0.16s cubic-bezier(0.4, 0, 0.6, 1);
  3149. }
  3150.  
  3151. .b-ban .spoiler.collapse:hover,
  3152. .b-log_entry .spoiler.collapse:hover,
  3153. .b-user_rate_log .spoiler.collapse:hover {
  3154. background: #5f6170 !important;
  3155. color: #EEEEEE;
  3156. }
  3157.  
  3158. .b-ban .spoiler.collapse::before,
  3159. .b-log_entry .spoiler.collapse::before,
  3160. .b-user_rate_log .spoiler.collapse::before {
  3161. content: 'expand_more';
  3162. font-size: 1.25rem !important;
  3163. transition: inherit;
  3164. }
  3165.  
  3166. .b-ban .spoiler.collapse.triggered::before,
  3167. .b-log_entry .spoiler.collapse.triggered::before,
  3168. .b-user_rate_log .spoiler.collapse.triggered::before {
  3169. transform: rotate(180deg);
  3170. }
  3171.  
  3172. .b-ban .spoiler.collapse::after,
  3173. .b-log_entry .spoiler.collapse::after,
  3174. .b-user_rate_log .spoiler.collapse::after {
  3175. content: 'Показать правку';
  3176. margin: 0 .75rem;
  3177. }
  3178.  
  3179. [data-locale=en] .b-ban .spoiler.collapse::after, [data-locale=en]
  3180. .b-log_entry .spoiler.collapse::after, [data-locale=en]
  3181. .b-user_rate_log .spoiler.collapse::after {
  3182. content: 'Show details';
  3183. }
  3184.  
  3185. .b-ban .spoiler.collapse.triggered::after,
  3186. .b-log_entry .spoiler.collapse.triggered::after,
  3187. .b-user_rate_log .spoiler.collapse.triggered::after {
  3188. content: 'Свернуть';
  3189. }
  3190.  
  3191. [data-locale=en] .b-ban .spoiler.collapse.triggered::after, [data-locale=en]
  3192. .b-log_entry .spoiler.collapse.triggered::after, [data-locale=en]
  3193. .b-user_rate_log .spoiler.collapse.triggered::after {
  3194. content: 'Hide';
  3195. }
  3196.  
  3197. .b-ban .spoiler.collapsed,
  3198. .b-ban .spoiler.collapse .action,
  3199. .b-log_entry .spoiler.collapsed,
  3200. .b-log_entry .spoiler.collapse .action,
  3201. .b-user_rate_log .spoiler.collapsed,
  3202. .b-user_rate_log .spoiler.collapse .action {
  3203. display: none !important;
  3204. }
  3205.  
  3206. /* Модерация */
  3207. .b-ban .abuser {
  3208. vertical-align: top;
  3209. color: #57576a;
  3210. font-size: inherit;
  3211. }
  3212.  
  3213. .b-ban .abuser::before, .b-ban .abuser::after {
  3214. color: #9E9E9E;
  3215. }
  3216.  
  3217. .b-ban .abuser:hover {
  3218. color: #8a8eac;
  3219. }
  3220.  
  3221. .b-ban .abuser:active {
  3222. color: #b7b8cc;
  3223. }
  3224.  
  3225. .b-ban .comment-hash {
  3226. color: #9E9E9E;
  3227. }
  3228.  
  3229. .b-ban .comment-hash:hover {
  3230. color: #8a8eac;
  3231. }
  3232.  
  3233. .b-ban .comment-hash:active {
  3234. color: #b7b8cc;
  3235. }
  3236.  
  3237. .b-ban .duration {
  3238. color: #BDBDBD;
  3239. font-size: inherit;
  3240. }
  3241.  
  3242. .b-ban .moderator {
  3243. padding-left: 0.375em;
  3244. }
  3245.  
  3246. .b-ban .moderator > span {
  3247. padding-left: 0.375em;
  3248. }
  3249.  
  3250. /* Список правок */
  3251. .b-log_entry .state + span {
  3252. padding-right: 0;
  3253. }
  3254.  
  3255. .b-log_entry .change-details {
  3256. margin: .5em 0 0;
  3257. }
  3258.  
  3259. .b-log_entry .change-details .reason {
  3260. margin-bottom: .5rem;
  3261. }
  3262.  
  3263. .b-log_entry .change-details .reason span {
  3264. padding-right: 0.375em;
  3265. color: #BDBDBD;
  3266. }
  3267.  
  3268. .b-log_entry .change-details .field-changes .changes .change {
  3269. margin-bottom: .5rem;
  3270. }
  3271.  
  3272. .b-log_entry .change-details .field-changes .label {
  3273. padding-right: 0.375em;
  3274. color: #BDBDBD;
  3275. }
  3276.  
  3277. /* Жалобы */
  3278. .b-abuse_request {
  3279. /* FIX */
  3280. }
  3281.  
  3282. .b-abuse_request .outdated {
  3283. font-size: inherit;
  3284. }
  3285.  
  3286. .b-abuse_request .outdated::before, .b-abuse_request .outdated::after {
  3287. color: #BDBDBD;
  3288. }
  3289.  
  3290. .b-abuse_request .remove {
  3291. padding-right: 0.375em;
  3292. }
  3293.  
  3294. .b-abuse_request .marker {
  3295. vertical-align: baseline !important;
  3296. padding: 0 .375em !important;
  3297. margin: 0 0.5rem 0 0 !important;
  3298. }
  3299.  
  3300. .b-add_to_list {
  3301. min-width: 0;
  3302. margin-bottom: .5rem;
  3303. }
  3304.  
  3305. .b-add_to_list .trigger, .b-add_to_list .option {
  3306. padding: .5rem 1rem .5rem 3rem;
  3307. border: 0;
  3308. font-size: .875rem;
  3309. line-height: 1.5rem;
  3310. }
  3311.  
  3312. .b-add_to_list .trigger {
  3313. border-radius: 3px;
  3314. }
  3315.  
  3316. .b-add_to_list .option:last-child {
  3317. border-radius: 0 0 3px 3px;
  3318. }
  3319.  
  3320. .b-add_to_list .plus, .b-add_to_list .edit, .b-add_to_list .trigger-arrow {
  3321. width: 2.5rem;
  3322. height: 2.5rem;
  3323. padding: .5rem;
  3324. margin: -.5rem -1rem -.5rem 0;
  3325. color: inherit !important;
  3326. }
  3327.  
  3328. .b-add_to_list .plus, .b-add_to_list .edit {
  3329. position: absolute;
  3330. left: 0;
  3331. margin-left: 0 !important;
  3332. margin-right: .5rem !important;
  3333. }
  3334.  
  3335. .b-add_to_list .plus::before {
  3336. content: 'add';
  3337. }
  3338.  
  3339. .b-add_to_list.planned .edit::before {
  3340. content: 'event';
  3341. }
  3342.  
  3343. .b-add_to_list.on_hold .edit::before {
  3344. content: 'query_builder';
  3345. }
  3346.  
  3347. .b-add_to_list.watching .edit::before {
  3348. content: 'play_arrow';
  3349. }
  3350.  
  3351. .b-add_to_list.rewatching .edit::before {
  3352. content: 'replay';
  3353. }
  3354.  
  3355. .b-add_to_list.completed .edit::before {
  3356. content: 'done';
  3357. }
  3358.  
  3359. .b-add_to_list.dropped .edit::before {
  3360. content: 'delete';
  3361. }
  3362.  
  3363. .b-add_to_list .trigger-arrow {
  3364. position: relative;
  3365. }
  3366.  
  3367. .b-add_to_list .trigger-arrow::before {
  3368. content: 'arrow_drop_down';
  3369. transition: .24s;
  3370. }
  3371.  
  3372. .b-add_to_list.expanded .trigger-arrow::before {
  3373. content: 'arrow_drop_down';
  3374. transform: rotate(180deg);
  3375. }
  3376.  
  3377. .b-add_to_list .expanded-options {
  3378. margin-top: -3px;
  3379. }
  3380.  
  3381. .b-add_to_list .expanded-options .option {
  3382. font-size: .875rem;
  3383. }
  3384.  
  3385. .b-add_to_list .expanded-options .option:first-child {
  3386. padding-top: 11px;
  3387. }
  3388.  
  3389. .b-add_to_list .expanded-options .option .text {
  3390. padding-left: 0;
  3391. }
  3392.  
  3393. .b-db_entry-note .name-container .b-user_rate .b-add_to_list .trigger, .b-db_entry-note .name-container .b-user_rate .b-add_to_list .option {
  3394. padding: 0 1rem 0 2rem;
  3395. line-height: 2rem;
  3396. }
  3397.  
  3398. .b-db_entry-note .name-container .b-user_rate .b-add_to_list .trigger:hover .plus::before, .b-db_entry-note .name-container .b-user_rate .b-add_to_list .trigger:hover .edit::before, .b-db_entry-note .name-container .b-user_rate .b-add_to_list .trigger:hover .trigger-arrow::before, .b-db_entry-note .name-container .b-user_rate .b-add_to_list .trigger:active .plus::before, .b-db_entry-note .name-container .b-user_rate .b-add_to_list .trigger:active .edit::before, .b-db_entry-note .name-container .b-user_rate .b-add_to_list .trigger:active .trigger-arrow::before, .b-db_entry-note .name-container .b-user_rate .b-add_to_list .option:hover .plus::before, .b-db_entry-note .name-container .b-user_rate .b-add_to_list .option:hover .edit::before, .b-db_entry-note .name-container .b-user_rate .b-add_to_list .option:hover .trigger-arrow::before, .b-db_entry-note .name-container .b-user_rate .b-add_to_list .option:active .plus::before, .b-db_entry-note .name-container .b-user_rate .b-add_to_list .option:active .edit::before, .b-db_entry-note .name-container .b-user_rate .b-add_to_list .option:active .trigger-arrow::before {
  3399. color: inherit;
  3400. }
  3401.  
  3402. .b-db_entry-note .name-container .b-user_rate .b-add_to_list .plus, .b-db_entry-note .name-container .b-user_rate .b-add_to_list .edit, .b-db_entry-note .name-container .b-user_rate .b-add_to_list .trigger-arrow {
  3403. width: 2rem;
  3404. height: 2rem;
  3405. padding: .4375rem;
  3406. margin: 0 -1rem 0 .25rem;
  3407. }
  3408.  
  3409. .b-db_entry-note .name-container .b-user_rate .b-add_to_list .plus, .b-db_entry-note .name-container .b-user_rate .b-add_to_list .edit {
  3410. margin-right: .25rem !important;
  3411. }
  3412.  
  3413. .b-db_entry-note .name-container .b-user_rate .b-add_to_list .expanded-options {
  3414. padding-top: 0;
  3415. margin-top: 0;
  3416. }
  3417.  
  3418. .b-catalog_entry-tooltip .b-add_to_list {
  3419. width: auto;
  3420. max-width: 224px;
  3421. }
  3422.  
  3423. .b-catalog_entry-tooltip .b-add_to_list .trigger, .b-catalog_entry-tooltip .b-add_to_list .option {
  3424. font-size: .875rem;
  3425. }
  3426.  
  3427. .b-catalog_entry-tooltip .b-add_to_list .trigger {
  3428. line-height: 1.5rem;
  3429. }
  3430.  
  3431. .b-catalog_entry-tooltip .b-add_to_list .trigger, .b-catalog_entry-tooltip .b-add_to_list .add-trigger, .b-catalog_entry-tooltip .b-add_to_list .remove-trigger {
  3432. max-width: 224px;
  3433. }
  3434.  
  3435. .b-ajax::before {
  3436. opacity: .75;
  3437. }
  3438.  
  3439. .b-ajax::after {
  3440. width: 1.5rem;
  3441. height: 1.5rem;
  3442. margin-top: -.75rem;
  3443. margin-left: -.75rem;
  3444. background: transparent;
  3445. border: .1875rem solid;
  3446. border-right-color: transparent;
  3447. border-radius: 50%;
  3448. color: #3a3d50;
  3449. -webkit-animation: spin 2s linear infinite;
  3450. animation: spin 2s linear infinite;
  3451. box-sizing: border-box;
  3452. pointer-events: all;
  3453. }
  3454.  
  3455. .ajax-loading.vk-like {
  3456. min-height: 1.5rem;
  3457. }
  3458.  
  3459. .b-anime_status_tag {
  3460. margin: 0;
  3461. }
  3462.  
  3463. .b-anime_status_tag.released {
  3464. color: #66bb6a;
  3465. }
  3466.  
  3467. .b-anime_status_tag.anons {
  3468. color: #ef8d50;
  3469. }
  3470.  
  3471. .b-anime_status_tag.ongoing {
  3472. color: #4f91e8;
  3473. }
  3474.  
  3475. .b-anime_status_tag.episode {
  3476. color: #4f91e8;
  3477. }
  3478.  
  3479. .b-anime_status_tag.summary {
  3480. color: #a64fe8;
  3481. }
  3482.  
  3483. .b-anime_status_tag.news {
  3484. color: #ef8d50;
  3485. }
  3486.  
  3487. .b-anime_status_tag.review {
  3488. color: #e84fde;
  3489. }
  3490.  
  3491. .b-anime_status_tag.collection {
  3492. color: #aea593;
  3493. }
  3494.  
  3495. .b-anime_status_tag.cosplay {
  3496. color: #e8dc4f;
  3497. }
  3498.  
  3499. .b-anime_status_tag.offtopic {
  3500. color: #f58ebb;
  3501. }
  3502.  
  3503. .b-anime_status_tag.ignored {
  3504. vertical-align: top;
  3505. color: #ef5350;
  3506. }
  3507.  
  3508. .b-anime_status_tag.broadcast {
  3509. color: #e84fde;
  3510. }
  3511.  
  3512. .b-block_list li {
  3513. padding: 0 .5rem;
  3514. margin: 0 -.5rem;
  3515. color: #EEEEEE;
  3516. font-family: inherit;
  3517. line-height: 1.5rem;
  3518. }
  3519.  
  3520. .b-block_list li:hover, .b-block_list li.selected {
  3521. background-color: #4a4a4a;
  3522. color: #FFFFFF;
  3523. }
  3524.  
  3525. .b-block_list li:active {
  3526. background-color: #4a4a4a;
  3527. }
  3528.  
  3529. .b-block_list li a {
  3530. color: #EEEEEE;
  3531. }
  3532.  
  3533. /* Хлебные крошки */
  3534. .b-breadcrumbs {
  3535. margin: 0;
  3536. color: #BDBDBD;
  3537. line-height: 1rem;
  3538. }
  3539.  
  3540. .b-breadcrumbs > span::after {
  3541. content: '»';
  3542. color: #9E9E9E;
  3543. }
  3544.  
  3545. .b-breadcrumbs a.b-link {
  3546. color: #BDBDBD;
  3547. }
  3548.  
  3549. .b-catalog_entry .image-cutter {
  3550. border-radius: 2px;
  3551. }
  3552.  
  3553. .b-catalog_entry.planned .image-decor::before, .b-catalog_entry.watching .image-decor::before, .b-catalog_entry.completed .image-decor::before, .b-catalog_entry.rewatching .image-decor::before, .b-catalog_entry.on_hold .image-decor::before, .b-catalog_entry.dropped .image-decor::before {
  3554. top: auto !important;
  3555. right: 8px !important;
  3556. bottom: 8px !important;
  3557. width: 1.5em !important;
  3558. height: auto !important;
  3559. border: none;
  3560. border-radius: 100% !important;
  3561. box-shadow: 0 2px 4px 1px rgba(0, 0, 0, 0.24);
  3562. color: #FFF;
  3563. font-size: 24px !important;
  3564. line-height: 1.5 !important;
  3565. text-align: center;
  3566. }
  3567.  
  3568. .b-catalog_entry.planned .image-decor::after, .b-catalog_entry.watching .image-decor::after, .b-catalog_entry.completed .image-decor::after, .b-catalog_entry.rewatching .image-decor::after, .b-catalog_entry.on_hold .image-decor::after, .b-catalog_entry.dropped .image-decor::after {
  3569. display: none;
  3570. }
  3571.  
  3572. .b-catalog_entry.planned .image-decor::before {
  3573. content: 'event';
  3574. background: #FAFAFA;
  3575. color: #2b7ae3;
  3576. }
  3577.  
  3578. .b-catalog_entry.watching .image-decor::before {
  3579. content: 'play_arrow';
  3580. background: #4f91e8;
  3581. }
  3582.  
  3583. .b-catalog_entry.rewatching .image-decor::before {
  3584. content: 'replay';
  3585. background: #4f91e8;
  3586. }
  3587.  
  3588. .b-catalog_entry.completed .image-decor::before {
  3589. content: 'done';
  3590. background: #66bb6a;
  3591. }
  3592.  
  3593. .b-catalog_entry.on_hold .image-decor::before {
  3594. content: 'schedule';
  3595. background: #757575;
  3596. }
  3597.  
  3598. .b-catalog_entry.dropped .image-decor::before {
  3599. content: 'delete';
  3600. background: #ef5350;
  3601. }
  3602.  
  3603. .b-catalog_entry-tooltip .inner a.name {
  3604. color: #FFFFFF !important;
  3605. font-size: .875rem;
  3606. }
  3607.  
  3608. .b-catalog_entry-tooltip .inner .text {
  3609. margin-bottom: .5rem;
  3610. font-size: .8125rem;
  3611. line-height: 1.25rem;
  3612. }
  3613.  
  3614. .b-catalog_entry-tooltip .inner .line {
  3615. font-size: .8125rem;
  3616. line-height: 1.5rem;
  3617. }
  3618.  
  3619. .b-catalog_entry-tooltip .inner .line.name {
  3620. margin-bottom: 0;
  3621. line-height: 1.5rem;
  3622. }
  3623.  
  3624. .b-catalog_entry-tooltip .inner .line .key {
  3625. color: #EEEEEE;
  3626. }
  3627.  
  3628. .b-catalog_entry-tooltip .inner .line .value a {
  3629. color: #FFFFFF !important;
  3630. }
  3631.  
  3632. .b-catalog_entry-tooltip .inner .line .value .tag {
  3633. font-size: 10px;
  3634. line-height: 20px;
  3635. text-transform: uppercase;
  3636. }
  3637.  
  3638. .b-catalog_entry-tooltip .inner .rating {
  3639. bottom: 0;
  3640. color: #EEEEEE;
  3641. font-family: inherit;
  3642. font-size: 1.5rem;
  3643. line-height: 1;
  3644. }
  3645.  
  3646. .b-catalog_entry-tooltip .inner .rating .text {
  3647. margin: .5rem .5rem 0;
  3648. color: #BDBDBD;
  3649. font-size: .75rem;
  3650. line-height: 1rem;
  3651. }
  3652.  
  3653. .b-catalog_entry-tooltip .inner .additional-images .link .title {
  3654. color: #EEEEEE;
  3655. }
  3656.  
  3657. .b-club .name-logo:hover .name {
  3658. color: inherit;
  3659. }
  3660.  
  3661. .b-club .name {
  3662. color: #57576a;
  3663. }
  3664.  
  3665. .b-club .name:hover {
  3666. color: #8a8eac;
  3667. }
  3668.  
  3669. .b-club .name:active {
  3670. color: #b7b8cc;
  3671. }
  3672.  
  3673. .b-club .info {
  3674. font-size: .75rem;
  3675. line-height: inherit;
  3676. }
  3677.  
  3678. .b-club .info .number {
  3679. color: #BDBDBD;
  3680. }
  3681.  
  3682. .b-club .info .value {
  3683. color: #9E9E9E;
  3684. }
  3685.  
  3686. /* BBCode: CODE */
  3687. code {
  3688. vertical-align: middle;
  3689. padding: .5px 4px;
  3690. background-color: rgba(32, 32, 32, 0.05);
  3691. border-radius: 2px;
  3692. font-size: .875rem;
  3693. }
  3694.  
  3695. pre {
  3696. position: relative;
  3697. }
  3698.  
  3699. .b-code {
  3700. padding: 1rem;
  3701. margin: .5rem 0;
  3702. background: #263238;
  3703. border-radius: 2px;
  3704. font-size: .875rem;
  3705. font-style: normal;
  3706. font-weight: normal;
  3707. text-align: left;
  3708. }
  3709.  
  3710. @media (min-width: 960px) {
  3711. .b-code::before {
  3712. content: attr(data-language);
  3713. position: absolute;
  3714. top: 1rem;
  3715. right: .5rem;
  3716. padding: 0 .5rem;
  3717. background-color: #747474;
  3718. border-radius: 2px;
  3719. }
  3720. .tooltip-details .b-code::before {
  3721. display: none;
  3722. }
  3723. }
  3724.  
  3725. .hljs-selector-tag {
  3726. color: #FF5370;
  3727. }
  3728.  
  3729. .hljs-selector-id {
  3730. color: #FAD430;
  3731. }
  3732.  
  3733. .hljs-selector-class {
  3734. color: #FFCB6B;
  3735. }
  3736.  
  3737. .hljs-selector-pseudo,
  3738. .hljs-meta {
  3739. color: #C792EA;
  3740. }
  3741.  
  3742. .hljs-attribute {
  3743. color: #80CBC4;
  3744. }
  3745.  
  3746. .hljs-built_in {
  3747. color: #89DDFF;
  3748. }
  3749.  
  3750. .hljs-number {
  3751. color: #F77669;
  3752. }
  3753.  
  3754. .hljs-string {
  3755. color: #C3E88D;
  3756. }
  3757.  
  3758. .hljs-comment {
  3759. color: #5C7E8C;
  3760. }
  3761.  
  3762. /* Фильтры на страницах поиска */
  3763. .b-collection-filters .b-block_list li {
  3764. position: relative;
  3765. padding: .25em .5em;
  3766. margin: 0 -.5em;
  3767. font-size: 1rem;
  3768. line-height: 1.5;
  3769. }
  3770.  
  3771. .b-collection-filters .b-block_list li::before {
  3772. content: 'check_box_outline_blank';
  3773. display: inline-block;
  3774. vertical-align: top;
  3775. margin: 0 .75rem 0 0;
  3776. color: #BDBDBD;
  3777. }
  3778.  
  3779. .b-collection-filters .b-block_list li.selected::before {
  3780. content: 'check_box';
  3781. color: #3a3d50;
  3782. }
  3783.  
  3784. .b-collection-filters .b-block_list li.selected {
  3785. color: inherit;
  3786. }
  3787.  
  3788. .b-collection-filters .b-block_list li.sub {
  3789. padding-left: 2.75rem;
  3790. }
  3791.  
  3792. .b-collection-filters .b-block_list li input {
  3793. position: absolute;
  3794. width: 1.25rem;
  3795. height: 1.25rem;
  3796. margin: .125rem 0 0 -2.125rem;
  3797. opacity: 0;
  3798. }
  3799.  
  3800. .b-collection-filters .b-block_list li .b-question {
  3801. position: absolute;
  3802. right: .5rem;
  3803. }
  3804.  
  3805. .b-collection-filters .b-block_list li .b-question::before {
  3806. content: 'help_outline';
  3807. width: 1em;
  3808. height: auto;
  3809. margin: 0;
  3810. background: transparent;
  3811. color: #BDBDBD;
  3812. }
  3813.  
  3814. .b-collection-filters .b-block_list li .filter {
  3815. float: right;
  3816. position: relative;
  3817. right: auto;
  3818. margin: 0 0 0 .5rem;
  3819. color: #3a3d50;
  3820. font-weight: bold;
  3821. }
  3822.  
  3823. .b-collection-filters .b-block_list li .filter:hover {
  3824. color: #454d5f;
  3825. }
  3826.  
  3827. .b-collection-filters .b-block_list li .filter::before {
  3828. display: block;
  3829. width: auto;
  3830. font-family: inherit;
  3831. font-size: .75rem;
  3832. line-height: 1.5rem;
  3833. text-transform: lowercase;
  3834. }
  3835.  
  3836. .b-collection-filters .b-block_list li .filter.item-add::before {
  3837. content: 'Исключить';
  3838. }
  3839.  
  3840. [data-locale='en'] .b-collection-filters .b-block_list li .filter.item-add::before {
  3841. content: 'Exclude';
  3842. }
  3843.  
  3844. .b-collection-filters .b-block_list li .filter.item-minus::before {
  3845. content: 'Добавить';
  3846. }
  3847.  
  3848. [data-locale='en'] .b-collection-filters .b-block_list li .filter.item-minus::before {
  3849. content: 'Include';
  3850. }
  3851.  
  3852. .b-collection-filters .b-block_list.orders li::before {
  3853. content: 'radio_button_unchecked';
  3854. }
  3855.  
  3856. .b-collection-filters .b-block_list.orders li.selected::before {
  3857. content: 'radio_button_checked';
  3858. }
  3859.  
  3860. .b-collection-filters .b-block_list.ratings .filter, .b-collection-filters .b-block_list.genres .filter,
  3861. .b-collection-filters .b-block_list li.sub .filter {
  3862. margin-right: 2rem;
  3863. }
  3864.  
  3865. .b-collection-filters .mylist-block .subheadline {
  3866. font-size: 0;
  3867. line-height: 0;
  3868. }
  3869.  
  3870. .b-collection-filters .mylist-block .subheadline::after {
  3871. content: 'Мой список';
  3872. font-size: .875rem;
  3873. line-height: 1rem;
  3874. }
  3875.  
  3876. [data-locale='en'] .b-collection-filters .mylist-block .subheadline::after {
  3877. content: 'My List';
  3878. }
  3879.  
  3880. .b-collection-filters .mylist-block .item-sign {
  3881. margin-right: 0 !important;
  3882. }
  3883.  
  3884. .b-collection-filters .mylist-block .item-sign::before {
  3885. content: 'playlist_add_check';
  3886. }
  3887.  
  3888. .p-user_rates .mylist-block + .block + .block + .block > .b-list,
  3889. .b-collection-filters > .block:nth-child(3) > .b-list {
  3890. margin-left: 0 !important;
  3891. }
  3892.  
  3893. .p-user_rates .mylist-block + .block + .block + .block > .b-list > li,
  3894. .b-collection-filters > .block:nth-child(3) > .b-list > li {
  3895. position: relative;
  3896. margin-bottom: .5rem;
  3897. background-color: #3a3d50;
  3898. border-radius: 2px;
  3899. font-size: .875rem;
  3900. font-weight: bold;
  3901. line-height: 2rem;
  3902. text-align: center;
  3903. text-transform: uppercase;
  3904. list-style: none;
  3905. }
  3906.  
  3907. .p-user_rates .mylist-block + .block + .block + .block > .b-list > li::before, .p-user_rates .mylist-block + .block + .block + .block > .b-list > li::after,
  3908. .b-collection-filters > .block:nth-child(3) > .b-list > li::before,
  3909. .b-collection-filters > .block:nth-child(3) > .b-list > li::after {
  3910. content: '';
  3911. position: absolute;
  3912. top: 0;
  3913. right: 0;
  3914. bottom: 0;
  3915. left: 0;
  3916. border-radius: inherit;
  3917. opacity: 0;
  3918. z-index: 0;
  3919. transition: opacity .3s;
  3920. -webkit-backface-visibility: hidden;
  3921. -moz-backface-visibility: hidden;
  3922. backface-visibility: hidden;
  3923. }
  3924.  
  3925. .p-user_rates .mylist-block + .block + .block + .block > .b-list > li::before,
  3926. .b-collection-filters > .block:nth-child(3) > .b-list > li::before {
  3927. box-shadow: 0 1px 3px rgba(0, 0, 0, 0.56);
  3928. }
  3929.  
  3930. .p-user_rates .mylist-block + .block + .block + .block > .b-list > li::after,
  3931. .b-collection-filters > .block:nth-child(3) > .b-list > li::after {
  3932. background-color: rgba(0, 0, 0, 0.12);
  3933. }
  3934.  
  3935. .p-user_rates .mylist-block + .block + .block + .block > .b-list > li:hover::before, .p-user_rates .mylist-block + .block + .block + .block > .b-list > li:hover::after,
  3936. .b-collection-filters > .block:nth-child(3) > .b-list > li:hover::before,
  3937. .b-collection-filters > .block:nth-child(3) > .b-list > li:hover::after {
  3938. opacity: 1;
  3939. }
  3940.  
  3941. .p-user_rates .mylist-block + .block + .block + .block > .b-list > li > a,
  3942. .b-collection-filters > .block:nth-child(3) > .b-list > li > a {
  3943. position: relative;
  3944. display: block;
  3945. color: #FAFAFA !important;
  3946. z-index: 1;
  3947. }
  3948.  
  3949. .p-user_rates .mylist-block + .block + .block + .block > .b-list > li > a:hover,
  3950. .b-collection-filters > .block:nth-child(3) > .b-list > li > a:hover {
  3951. color: #FAFAFA !important;
  3952. text-decoration: none;
  3953. }
  3954.  
  3955. /* Поиск клубов и коллекций */
  3956. .b-collection_search .field {
  3957. margin-bottom: 1.5rem;
  3958. }
  3959.  
  3960. .b-collection_search .field input {
  3961. padding: .75rem 1rem;
  3962. background: #363643;
  3963. border-color: #4f4f4f;
  3964. border-radius: 2px;
  3965. font-size: 1rem;
  3966. }
  3967.  
  3968. .b-collection_search .field .clear {
  3969. position: absolute;
  3970. top: 0;
  3971. right: 0;
  3972. padding: .625rem;
  3973. color: #BDBDBD;
  3974. font-size: 0;
  3975. line-height: 0;
  3976. }
  3977.  
  3978. .b-collection_search .field .clear:hover {
  3979. color: #EEEEEE;
  3980. text-decoration: none;
  3981. }
  3982.  
  3983. .b-collection_search .field .clear::before {
  3984. content: 'clear';
  3985. position: static;
  3986. }
  3987.  
  3988. .b-comment header .time:hover {
  3989. text-decoration: underline;
  3990. }
  3991.  
  3992. .b-comment header .hash {
  3993. position: absolute;
  3994. top: 0;
  3995. right: 0;
  3996. bottom: 0;
  3997. left: 0;
  3998. margin: 0;
  3999. opacity: 0;
  4000. z-index: 1;
  4001. }
  4002.  
  4003. .b-comment div.body {
  4004. line-height: 1.25;
  4005. }
  4006.  
  4007. .b-comments {
  4008. line-height: inherit;
  4009. }
  4010.  
  4011. .b-comments .comments-collapser {
  4012. width: 2.5rem;
  4013. padding: .5rem;
  4014. margin: 0;
  4015. border: 0;
  4016. color: #57576a;
  4017. font-size: 0;
  4018. line-height: 0;
  4019. }
  4020.  
  4021. .b-comments .comments-collapser:hover {
  4022. color: #8a8eac;
  4023. }
  4024.  
  4025. .b-comments .comments-collapser:active {
  4026. color: #b7b8cc;
  4027. }
  4028.  
  4029. .b-comments .comments-collapser::before {
  4030. content: 'expand_less';
  4031. display: block;
  4032. }
  4033.  
  4034. .b-comments .messages-postloader {
  4035. margin-bottom: .5rem;
  4036. }
  4037.  
  4038. .b-comments-notifier {
  4039. top: 0 !important;
  4040. width: 2rem;
  4041. height: 2rem;
  4042. margin-top: 4rem;
  4043. background: #4f91e8;
  4044. border-radius: 2px;
  4045. line-height: 2rem;
  4046. }
  4047.  
  4048. .b-video.b-coub {
  4049. background: transparent;
  4050. }
  4051.  
  4052. .b-video.b-coub::before {
  4053. display: none;
  4054. }
  4055.  
  4056. .b-video.b-coub a.video-link {
  4057. height: auto;
  4058. padding: 0;
  4059. }
  4060.  
  4061. .b-video.b-coub a.video-link::before {
  4062. display: block;
  4063. }
  4064.  
  4065. /* Вывод основных данных из БД */
  4066. .b-db_entry {
  4067. line-height: inherit;
  4068. }
  4069.  
  4070. .b-db_entry > .c-about .c-info-left,
  4071. .b-db_entry > .c-about .c-info-right,
  4072. .b-db_entry > .c-about .c-info-left:last-child,
  4073. .b-db_entry > .c-about .c-info-right:last-child {
  4074. margin-bottom: 8px !important;
  4075. }
  4076.  
  4077. .b-db_entry > .c-about .contest_winners {
  4078. margin-top: 0;
  4079. margin-bottom: 1em;
  4080. }
  4081.  
  4082. @media (min-width: 768px) {
  4083. .p-people-show .b-db_entry > .c-about {
  4084. float: none;
  4085. margin-left: 30%;
  4086. overflow: hidden;
  4087. }
  4088. }
  4089.  
  4090. .b-db_entry > div:last-child .text {
  4091. line-height: 1.5;
  4092. }
  4093.  
  4094. .p-animes .b-db_entry > div:last-child {
  4095. clear: left;
  4096. padding-top: 0;
  4097. margin-left: 0;
  4098. line-height: inherit;
  4099. }
  4100.  
  4101. .b-db_entry .c-poster img {
  4102. border-radius: 2px;
  4103. }
  4104.  
  4105. @media (max-width: 480px) and (orientation: portrait) {
  4106. .b-db_entry .c-actions .b-tooltipped {
  4107. display: table;
  4108. width: 100%;
  4109. margin: 0 0 8px !important;
  4110. }
  4111. }
  4112.  
  4113. .b-db_entry .c-actions .b-tooltipped::before {
  4114. display: table-cell;
  4115. float: none;
  4116. }
  4117.  
  4118. .b-db_entry .c-actions .b-tooltipped::after {
  4119. padding-left: .5rem;
  4120. color: inherit;
  4121. font-size: .875rem;
  4122. line-height: 1.125rem;
  4123. }
  4124.  
  4125. .b-db_entry .c-actions .fav-add:hover {
  4126. color: #454d5f !important;
  4127. }
  4128.  
  4129. .b-db_entry .c-actions .fav-remove {
  4130. color: #454d5f !important;
  4131. }
  4132.  
  4133. .b-db_entry .c-actions .fav-remove:hover::before {
  4134. color: inherit;
  4135. }
  4136.  
  4137. /* "Связанное" и "Авторы" аниме и манги */
  4138. .b-db_entry-note {
  4139. position: relative;
  4140. padding: 8px 0;
  4141. margin: 0;
  4142. border: 0;
  4143. }
  4144.  
  4145. .b-db_entry-note::before {
  4146. content: '';
  4147. position: absolute;
  4148. right: -16px;
  4149. top: 0;
  4150. left: 56px;
  4151. height: 1px;
  4152. background-color: #4f4f4f;
  4153. }
  4154.  
  4155. .b-db_entry-note .name-container {
  4156. padding: .25rem 0;
  4157. margin-left: 64px;
  4158. line-height: inherit;
  4159. }
  4160.  
  4161. .b-db_entry-note .name-container .name {
  4162. color: #FFFFFF;
  4163. font-size: 1rem;
  4164. }
  4165.  
  4166. .b-db_entry-note .name-container .name:hover {
  4167. color: #8a8eac;
  4168. }
  4169.  
  4170. .b-db_entry-note .name-container .name:active {
  4171. color: #b7b8cc;
  4172. }
  4173.  
  4174. .b-db_entry-note .name-container .note {
  4175. margin-top: 4px;
  4176. color: #BDBDBD;
  4177. font-size: .875rem;
  4178. line-height: 1rem;
  4179. }
  4180.  
  4181. .b-db_entry-note .name-container .note > span {
  4182. display: inline-block;
  4183. vertical-align: top;
  4184. }
  4185.  
  4186. .b-db_entry-note .name-container .note > span::after {
  4187. color: #9E9E9E;
  4188. }
  4189.  
  4190. .b-db_entry-note .name-container .note .relation + .additional::before, .b-db_entry-note .name-container .note .relation + .additional::after {
  4191. color: #9E9E9E;
  4192. }
  4193.  
  4194. .b-db_entry-note .name-container .b-user_rate {
  4195. margin-top: .375rem;
  4196. }
  4197.  
  4198. .cc > .b-db_entry-note:first-child::before,
  4199. .block_m > .b-db_entry-note:first-child::before {
  4200. display: none;
  4201. }
  4202.  
  4203. @media only screen and (min-width: 768px) {
  4204. .c-column:first-child:last-child .cc > .b-db_entry-note:nth-child(2)::before {
  4205. display: none;
  4206. }
  4207. }
  4208.  
  4209. .b-db_entry-note::before {
  4210. right: 0;
  4211. left: 64px;
  4212. }
  4213.  
  4214. .p-db_entries-related .b-db_entry-note {
  4215. padding: 16px 0;
  4216. }
  4217.  
  4218. @media (max-width: 1024px) {
  4219. .b-dialog .time {
  4220. display: block !important;
  4221. padding-left: 0 !important;
  4222. font-size: .875em !important;
  4223. }
  4224. }
  4225.  
  4226. .b-dialog .to_dialog {
  4227. position: absolute;
  4228. top: 0;
  4229. right: 0;
  4230. bottom: 0;
  4231. left: 0;
  4232. margin: 0 -16px;
  4233. font-size: 0;
  4234. }
  4235.  
  4236. .b-dialog:hover .to_dialog {
  4237. background-color: rgba(255, 255, 255, 0.05);
  4238. z-index: 0;
  4239. }
  4240.  
  4241. .b-dialog img:not([alt]),
  4242. .b-dialog a,
  4243. .b-dialog .buttons,
  4244. .b-dialog .b-new_marker,
  4245. .b-dialog .b-spoiler {
  4246. position: relative;
  4247. z-index: 2;
  4248. }
  4249.  
  4250. .b-dialog .b-message {
  4251. position: static;
  4252. margin: 0;
  4253. padding: 0 !important;
  4254. overflow: visible;
  4255. }
  4256.  
  4257. .b-dialog .b-message .inner header img {
  4258. width: 24px;
  4259. margin: 0 12px 0 0;
  4260. }
  4261.  
  4262. .b-dialog .b-message .inner header .name-date {
  4263. line-height: inherit;
  4264. }
  4265.  
  4266. @media (max-width: 1024px) {
  4267. .b-dialog .b-message .inner header .name-date .time {
  4268. display: inline !important;
  4269. padding-left: .5em !important;
  4270. }
  4271. }
  4272.  
  4273. .b-dropzone {
  4274. padding: .5rem 1rem 3rem;
  4275. background-color: #4a4a4a;
  4276. border: 1px dashed #4f4f4f;
  4277. border-radius: .125rem;
  4278. }
  4279.  
  4280. .b-dropzone:hover {
  4281. border-color: #3a3d50;
  4282. }
  4283.  
  4284. .b-dropzone:hover::before,
  4285. .b-dropzone:hover input[type=file] {
  4286. color: #EEEEEE;
  4287. }
  4288.  
  4289. .b-dropzone::before {
  4290. margin: .5rem 0;
  4291. color: #9E9E9E;
  4292. font-size: 14px;
  4293. }
  4294.  
  4295. .b-dropzone .thank-you {
  4296. margin-bottom: .5rem;
  4297. }
  4298.  
  4299. .b-dropzone input[type=file] {
  4300. bottom: 1rem;
  4301. color: #9E9E9E;
  4302. }
  4303.  
  4304. .b-entry-info {
  4305. margin: 0;
  4306. font-size: .875rem;
  4307. }
  4308.  
  4309. .b-entry-info .line {
  4310. line-height: 1.5rem;
  4311. }
  4312.  
  4313. .b-entry-info .line a {
  4314. color: #57576a;
  4315. }
  4316.  
  4317. .b-entry-info .line a:hover {
  4318. color: #8a8eac;
  4319. }
  4320.  
  4321. .b-entry-info .line a:active {
  4322. color: #b7b8cc;
  4323. }
  4324.  
  4325. .b-entry-info .line .b-tag {
  4326. font-size: 10px;
  4327. line-height: 20px;
  4328. text-transform: uppercase;
  4329. }
  4330.  
  4331. .b-entry-info .line .b-tag > span::after {
  4332. display: none;
  4333. }
  4334.  
  4335. .b-entry-info .line .key {
  4336. color: #BDBDBD;
  4337. }
  4338.  
  4339. .b-entry-info .line .value {
  4340. color: inherit;
  4341. }
  4342.  
  4343. /* Формы */
  4344. .b-form::after {
  4345. display: block;
  4346. }
  4347.  
  4348. /* Список топиков */
  4349. .b-forums {
  4350. margin-bottom: .5rem;
  4351. line-height: inherit;
  4352. }
  4353.  
  4354. .b-forums .forum {
  4355. clear: both;
  4356. position: relative;
  4357. min-height: 1.5rem;
  4358. padding: 0 .5rem;
  4359. margin: 0 -.5rem;
  4360. line-height: 1.5rem;
  4361. }
  4362.  
  4363. .b-forums .forum input {
  4364. position: absolute;
  4365. left: .375rem;
  4366. width: 1.125rem;
  4367. height: 1.125rem;
  4368. margin: .1875rem 1rem .1875rem 0;
  4369. opacity: 0;
  4370. z-index: 1;
  4371. -webkit-appearance: none;
  4372. -moz-appearance: none;
  4373. appearance: none;
  4374. }
  4375.  
  4376. .b-forums .forum input:disabled {
  4377. pointer-events: none;
  4378. }
  4379.  
  4380. .b-forums .forum input + .link {
  4381. padding-left: 2.25rem !important;
  4382. }
  4383.  
  4384. .b-forums .forum input + .link::before {
  4385. content: 'check_box_outline_blank';
  4386. position: absolute;
  4387. top: 0;
  4388. left: 0.375rem;
  4389. width: 1em;
  4390. margin: 0.1875rem 0;
  4391. }
  4392.  
  4393. .b-forums .forum input:hover + .link::before {
  4394. opacity: .9;
  4395. }
  4396.  
  4397. .b-forums .forum input:checked + .link::before {
  4398. content: 'check_box';
  4399. }
  4400.  
  4401. .b-forums .forum input:disabled + .link::before {
  4402. color: #BDBDBD;
  4403. }
  4404.  
  4405. .b-forums .forum .link-with-input .link {
  4406. display: inline-block;
  4407. vertical-align: top;
  4408. position: absolute;
  4409. right: 0;
  4410. left: 0;
  4411. padding-left: .5rem;
  4412. }
  4413.  
  4414. .b-forums .forum .topics {
  4415. margin-left: 8px;
  4416. margin-top: 0;
  4417. font-size: .75rem;
  4418. }
  4419.  
  4420. .b-gallery .b-image {
  4421. padding: .125rem;
  4422. }
  4423.  
  4424. .b-gallery .b-image .controls {
  4425. margin: .125rem;
  4426. text-align: right;
  4427. }
  4428.  
  4429. .b-gallery .grid_sizer .controls {
  4430. margin-top: .375rem !important;
  4431. margin-right: .375rem !important;
  4432. }
  4433.  
  4434. .b-height_shortener {
  4435. position: relative;
  4436. padding-left: 0;
  4437. cursor: s-resize;
  4438. }
  4439.  
  4440. .b-height_shortener .shade {
  4441. right: 0;
  4442. left: 0;
  4443. width: auto;
  4444. height: 2.5rem;
  4445. margin-top: -2.5rem;
  4446. background-image: linear-gradient(to bottom, transparent, #181720);
  4447. }
  4448.  
  4449. .b-height_shortener .expand {
  4450. display: inline-block;
  4451. vertical-align: top;
  4452. padding: 0 .5rem;
  4453. border-radius: .625rem;
  4454. color: #EEEEEE;
  4455. font-size: .875rem;
  4456. line-height: 1.25rem;
  4457. transition: .16s;
  4458. user-select: none;
  4459. }
  4460.  
  4461. .b-height_shortener .expand:hover, .b-height_shortener .expand:active {
  4462. background: #5f6170;
  4463. color: #EEEEEE;
  4464. }
  4465.  
  4466. .b-height_shortener .expand::before {
  4467. content: 'expand_more';
  4468. display: inline-block;
  4469. vertical-align: top;
  4470. margin: 0 .375rem 0 -.375rem;
  4471. font-size: 20px !important;
  4472. }
  4473.  
  4474. .b-height_shortener .expand::after {
  4475. display: none;
  4476. }
  4477.  
  4478. .b-height_shortener .expand span {
  4479. border: 0;
  4480. font-weight: bold;
  4481. }
  4482.  
  4483. .b-comment .b-height_shortener,
  4484. .b-dialog .b-height_shortener {
  4485. padding-left: 3.5rem;
  4486. }
  4487.  
  4488. .b-review-topic .b-height_shortener {
  4489. padding-left: 0;
  4490. cursor: default;
  4491. }
  4492.  
  4493. /* ТЕМЫ ДНЯ */
  4494. .b-hot_topics {
  4495. padding: .5rem 1rem;
  4496. margin: -.5rem -1rem 0 -1rem;
  4497. background-color: initial;
  4498. border: 0;
  4499. }
  4500.  
  4501. @media (max-width: 767px) {
  4502. .b-hot_topics {
  4503. overflow: hidden;
  4504. overflow-x: auto;
  4505. white-space: nowrap;
  4506. }
  4507. .b-hot_topics::before, .b-hot_topics::after {
  4508. content: '';
  4509. position: absolute;
  4510. left: 0;
  4511. width: 1rem;
  4512. height: 2rem;
  4513. background-image: linear-gradient(-90deg, transparent, #181720);
  4514. z-index: 1;
  4515. }
  4516. .b-hot_topics::after {
  4517. left: auto;
  4518. right: 0;
  4519. margin-top: -2rem;
  4520. background-image: linear-gradient(90deg, transparent, #181720);
  4521. }
  4522. }
  4523.  
  4524. @media (max-width: 1024px) {
  4525. .b-hot_topics {
  4526. padding: 14px 16px;
  4527. margin: -16px -16px 0 -16px;
  4528. border: 0;
  4529. }
  4530. }
  4531.  
  4532. .b-hot_topics .topic {
  4533. font-size: .875rem;
  4534. line-height: 2rem;
  4535. text-align: left;
  4536. }
  4537.  
  4538. @media (max-width: 767px) {
  4539. .b-hot_topics .topic {
  4540. float: none;
  4541. vertical-align: top;
  4542. width: auto;
  4543. max-width: 100%;
  4544. }
  4545. .b-hot_topics .topic:nth-child(n) {
  4546. display: inline-block;
  4547. margin-right: 1rem;
  4548. }
  4549. .b-hot_topics .topic:last-child {
  4550. margin-right: 0;
  4551. }
  4552. }
  4553.  
  4554. @media (min-width: 1025px) {
  4555. .b-hot_topics .topic {
  4556. width: 10.6666%;
  4557. margin-right: .5%;
  4558. }
  4559. }
  4560.  
  4561. .b-hot_topics .topic.subject {
  4562. color: #FFFFFF;
  4563. font-size: .875rem;
  4564. font-weight: bold;
  4565. line-height: 2rem;
  4566. text-align: left;
  4567. text-transform: uppercase;
  4568. white-space: nowrap;
  4569. }
  4570.  
  4571. .b-hot_topics .topic a {
  4572. padding: 0 .75rem 0 2.5rem;
  4573. background-color: #4a4a4a;
  4574. border-radius: 1rem;
  4575. color: #FFFFFF;
  4576. }
  4577.  
  4578. .b-hot_topics .topic a:hover {
  4579. background-color: #5f6170;
  4580. text-decoration: none;
  4581. }
  4582.  
  4583. .b-hot_topics .topic a .poster {
  4584. width: 2rem;
  4585. height: 2rem;
  4586. margin: 0 0 0 -2.5rem;
  4587. border-radius: 100%;
  4588. }
  4589.  
  4590. .b-image {
  4591. display: inline-block;
  4592. vertical-align: top;
  4593. margin-bottom: .25rem;
  4594. }
  4595.  
  4596. .b-image:hover {
  4597. opacity: 1;
  4598. }
  4599.  
  4600. .b-image img {
  4601. vertical-align: top;
  4602. border-radius: 2px;
  4603. }
  4604.  
  4605. .b-image .marker {
  4606. right: 4px;
  4607. bottom: 4px;
  4608. left: auto;
  4609. padding: 0 8px;
  4610. background: rgba(0, 0, 0, 0.8);
  4611. border-radius: 3px;
  4612. color: #fff;
  4613. font-size: .75em;
  4614. line-height: 20px;
  4615. }
  4616.  
  4617. .b-image .controls {
  4618. bottom: 0;
  4619. left: 0;
  4620. background-image: linear-gradient(rgba(0, 0, 0, 0.6) 0%, transparent 40%);
  4621. border-radius: 2px;
  4622. }
  4623.  
  4624. .b-image.deletable img {
  4625. opacity: 1;
  4626. }
  4627.  
  4628. .b-image .delete, .b-image .confirm, .b-image .cancel, .b-image .move-left, .b-image .move-right, .b-image .mobile-edit {
  4629. z-index: 8;
  4630. }
  4631.  
  4632. .b-image .delete, .b-image .confirm, .b-image .cancel, .b-image .mobile-edit {
  4633. background: transparent;
  4634. }
  4635.  
  4636. .b-image .delete:nth-child(n), .b-image .confirm:nth-child(n), .b-image .cancel:nth-child(n), .b-image .mobile-edit:nth-child(n) {
  4637. margin-right: 4px !important;
  4638. }
  4639.  
  4640. .b-image .delete::before {
  4641. content: 'delete';
  4642. }
  4643.  
  4644. .b-image .confirm {
  4645. display: none;
  4646. }
  4647.  
  4648. .b-image .confirm::before {
  4649. content: 'check';
  4650. }
  4651.  
  4652. .b-image .cancel {
  4653. display: none;
  4654. }
  4655.  
  4656. .b-image .cancel::before {
  4657. content: 'close';
  4658. }
  4659.  
  4660. .b-image .mobile-edit {
  4661. margin-top: .375rem !important;
  4662. margin-right: .375rem !important;
  4663. }
  4664.  
  4665. .b-image .mobile-edit::before {
  4666. content: 'edit';
  4667. }
  4668.  
  4669. @media (min-width: 1025px) {
  4670. .b-image .mobile-edit {
  4671. display: none;
  4672. }
  4673. }
  4674.  
  4675. .b-input {
  4676. margin-bottom: .5rem;
  4677. }
  4678.  
  4679. .b-input:last-child {
  4680. margin-bottom: 0;
  4681. }
  4682.  
  4683. .b-input input, .b-input textarea {
  4684. padding: .3125rem 1rem;
  4685. background: #363643;
  4686. border-color: #4f4f4f;
  4687. border-radius: 2px;
  4688. font-family: inherit;
  4689. font-size: inherit;
  4690. line-height: 1.25rem;
  4691. }
  4692.  
  4693. .b-input input::-webkit-input-placeholder, .b-input textarea::-webkit-input-placeholder {
  4694. padding: 0;
  4695. color: #9E9E9E;
  4696. line-height: inherit;
  4697. }
  4698.  
  4699. .b-input input:-moz-placeholder, .b-input textarea:-moz-placeholder {
  4700. padding: 0;
  4701. color: #9E9E9E;
  4702. line-height: inherit;
  4703. }
  4704.  
  4705. .b-input input::-moz-placeholder, .b-input textarea::-moz-placeholder {
  4706. padding: 0;
  4707. color: #9E9E9E;
  4708. line-height: inherit;
  4709. }
  4710.  
  4711. .b-input input:-ms-input-placeholder, .b-input textarea:-ms-input-placeholder {
  4712. padding: 0;
  4713. color: #9E9E9E;
  4714. line-height: inherit;
  4715. }
  4716.  
  4717. .b-input input[type=checkbox] {
  4718. display: inline-block;
  4719. vertical-align: top;
  4720. width: 1.125rem !important;
  4721. height: 1.125rem;
  4722. padding: 0;
  4723. margin: .1875rem 1rem .1875rem 0;
  4724. background-color: transparent;
  4725. background-repeat: no-repeat;
  4726. background-size: 1.125rem;
  4727. background-position: -.125rem -.125rem;
  4728. border: 0.125rem solid #BDBDBD;
  4729. border-radius: .125rem;
  4730. box-sizing: border-box;
  4731. transition: 0.24s cubic-bezier(0.4, 0, 0.2, 1);
  4732. -webkit-appearance: none;
  4733. -moz-appearance: none;
  4734. appearance: none;
  4735. }
  4736.  
  4737. .b-input input[type=checkbox]:disabled {
  4738. border-color: #9E9E9E;
  4739. }
  4740.  
  4741. .b-input input[type=checkbox]:checked {
  4742. background-color: #3a3d50;
  4743. background-image: url("data\:image/svg+xml;base64,PHN2ZyBmaWxsPSIjRkZGRkZGIiBoZWlnaHQ9IjE4IiB2aWV3Qm94PSIwIDAgMjQgMjQiIHdpZHRoPSIxOCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4gICAgPHBhdGggZD0iTTAgMGgyNHYyNEgweiIgZmlsbD0ibm9uZSIvPiAgICA8cGF0aCBkPSJNOSAxNi4xN0w0LjgzIDEybC0xLjQyIDEuNDFMOSAxOSAyMSA3bC0xLjQxLTEuNDF6Ii8+PC9zdmc+");
  4744. border-color: transparent;
  4745. }
  4746.  
  4747. .b-input input[type=checkbox]:checked:disabled {
  4748. background-color: #9E9E9E;
  4749. border-color: transparent;
  4750. }
  4751.  
  4752. .b-input input[disabled] {
  4753. padding: .375rem 0 .25rem;
  4754. background: transparent;
  4755. border-width: 0;
  4756. border-bottom-width: .125rem;
  4757. color: #9E9E9E !important;
  4758. }
  4759.  
  4760. .b-input textarea {
  4761. padding: .4375rem 1rem;
  4762. }
  4763.  
  4764. .b-input select {
  4765. height: 2rem;
  4766. padding: 2px .5rem;
  4767. background: #363643;
  4768. font-family: inherit;
  4769. font-size: .875rem;
  4770. line-height: 2rem;
  4771. }
  4772.  
  4773. .b-input select:disabled {
  4774. opacity: .5;
  4775. }
  4776.  
  4777. .b-input label {
  4778. line-height: 1.5;
  4779. }
  4780.  
  4781. .b-input .hint {
  4782. color: #9E9E9E;
  4783. font-size: .75rem;
  4784. line-height: 1.25rem;
  4785. }
  4786.  
  4787. /* Переключение языка описания */
  4788. .b-lang_trigger {
  4789. position: absolute;
  4790. top: -53px;
  4791. right: 0;
  4792. width: 40px;
  4793. height: 40px;
  4794. margin: 4px;
  4795. background-color: #4a4a4a;
  4796. border-radius: 2px;
  4797. font-size: 12px;
  4798. font-weight: bold;
  4799. line-height: 40px;
  4800. text-align: center;
  4801. text-transform: uppercase;
  4802. cursor: pointer;
  4803. user-select: none;
  4804. }
  4805.  
  4806. .b-lang_trigger:hover {
  4807. background-color: #424242;
  4808. }
  4809.  
  4810. .b-lang_trigger::before, .b-lang_trigger::after {
  4811. display: none;
  4812. }
  4813.  
  4814. .b-lang_trigger span {
  4815. border: 0;
  4816. color: #BDBDBD;
  4817. }
  4818.  
  4819. .b-lang_trigger span:hover {
  4820. color: #EEEEEE;
  4821. }
  4822.  
  4823. .b-lang_trigger:hover span {
  4824. color: #EEEEEE;
  4825. }
  4826.  
  4827. /* Еще кнопка */
  4828. .b-link_button {
  4829. display: block;
  4830. margin: 0 0 .5em;
  4831. background-color: #4a4a4a;
  4832. color: #FFFFFF;
  4833. font-size: 15px !important;
  4834. text-transform: none;
  4835. }
  4836.  
  4837. .b-link_button:last-child {
  4838. margin-bottom: 0;
  4839. }
  4840.  
  4841. .b-link_button:hover {
  4842. background-color: #5f6170;
  4843. }
  4844.  
  4845. .b-link_button:active {
  4846. background-color: #212121;
  4847. }
  4848.  
  4849. .b-link_button.maxi {
  4850. padding: 0;
  4851. font-size: 1rem;
  4852. line-height: 2.5rem;
  4853. }
  4854.  
  4855. .b-link_button.dark {
  4856. display: block;
  4857. margin: 0 auto .5em;
  4858. text-transform: none;
  4859. }
  4860.  
  4861. .b-link_button.dark:disabled {
  4862. background-color: #5b5b5f;
  4863. color: #9E9E9E;
  4864. }
  4865.  
  4866. .b-link_button.join-club::before, .b-link_button.watch-online::before, .b-link_button.is-licensed::before, .b-link_button.upload-video::before, .b-link_button.create-topic::before {
  4867. display: none;
  4868. }
  4869.  
  4870. /* Списки */
  4871. .b-list {
  4872. margin: .5rem 0 1rem 2rem;
  4873. }
  4874.  
  4875. .b-list li {
  4876. margin: 0;
  4877. line-height: 1.5;
  4878. list-style-image: none;
  4879. list-style-type: disc;
  4880. }
  4881.  
  4882. .b-list li + li {
  4883. margin: .5rem 0 0 0;
  4884. }
  4885.  
  4886. .b-list .b-list li + li {
  4887. margin: 0;
  4888. }
  4889.  
  4890. .b-list_switchers .switcher.list::before {
  4891. content: 'view_list';
  4892. }
  4893.  
  4894. .b-list_switchers .switcher.lines::before {
  4895. content: 'view_headline';
  4896. }
  4897.  
  4898. .b-list_switchers .switcher.posters::before {
  4899. content: 'view_module';
  4900. }
  4901.  
  4902. .b-list_switchers .switcher.popularity::before {
  4903. content: 'trending_up';
  4904. }
  4905.  
  4906. .b-list_switchers .switcher.alphabet::before {
  4907. content: 'sort_by_alpha';
  4908. }
  4909.  
  4910. .b-list_switchers .switcher.selected {
  4911. color: #454d5f !important;
  4912. }
  4913.  
  4914. .b-message header .broadcast-by {
  4915. display: inline-block;
  4916. vertical-align: top;
  4917. padding: 0;
  4918. margin-right: .5rem;
  4919. font-size: .875rem;
  4920. line-height: inherit;
  4921. }
  4922.  
  4923. .b-modal > .inner {
  4924. padding: 1rem 1.5rem;
  4925. background: #5e5f6c;
  4926. border-radius: .125rem;
  4927. box-shadow: 0 4px 10px 2px rgba(0, 0, 0, 0.24);
  4928. }
  4929.  
  4930. .b-modal .subheadline {
  4931. font-size: 20px;
  4932. font-weight: 400;
  4933. text-transform: none;
  4934. }
  4935.  
  4936. /* Переключатели для подзаголовков */
  4937. .b-options-floated {
  4938. right: 0;
  4939. margin-top: 16px;
  4940. font-size: 14px;
  4941. font-weight: 700;
  4942. line-height: 16px;
  4943. }
  4944.  
  4945. @media (min-width: 768px) {
  4946. .b-options-floated.before-buttons-2 {
  4947. padding-right: 112px;
  4948. }
  4949. }
  4950.  
  4951. @media (min-width: 768px) {
  4952. .b-options-floated.r-edit {
  4953. margin-right: 48px;
  4954. }
  4955. }
  4956.  
  4957. .b-options-floated a, .b-options-floated .link {
  4958. color: #57576a;
  4959. }
  4960.  
  4961. .b-options-floated a:hover, .b-options-floated .link:hover {
  4962. color: #8a8eac;
  4963. }
  4964.  
  4965. .b-options-floated a:active, .b-options-floated .link:active {
  4966. color: #b7b8cc;
  4967. }
  4968.  
  4969. .b-options-floated a::after, .b-options-floated .link::after {
  4970. padding: 0 .375rem;
  4971. color: #9E9E9E;
  4972. }
  4973.  
  4974. .b-options-floated a span.brackets, .b-options-floated .link span.brackets {
  4975. display: inline-block;
  4976. vertical-align: text-top;
  4977. min-width: 20px;
  4978. height: 16px;
  4979. padding: 0 4px;
  4980. background-color: #454d5f;
  4981. border-radius: 4px;
  4982. color: #FAFAFA;
  4983. font-size: 10px;
  4984. font-weight: 700;
  4985. line-height: 16px;
  4986. text-align: center;
  4987. }
  4988.  
  4989. .b-options-floated a span.brackets::before, .b-options-floated a span.brackets::after, .b-options-floated .link span.brackets::before, .b-options-floated .link span.brackets::after {
  4990. display: none;
  4991. }
  4992.  
  4993. .b-options-floated.count {
  4994. color: #BDBDBD;
  4995. }
  4996.  
  4997. .b-options-floated .action {
  4998. color: #57576a;
  4999. }
  5000.  
  5001. .b-options-floated .action:hover {
  5002. color: #8a8eac;
  5003. }
  5004.  
  5005. .b-options-floated .action:active {
  5006. color: #b7b8cc;
  5007. }
  5008.  
  5009. .b-options-floated .selected {
  5010. color: #8a8eac;
  5011. }
  5012.  
  5013. .b-options-floated .selected:hover {
  5014. color: #b7b8cc;
  5015. }
  5016.  
  5017. .b-options-floated .selected.always-active {
  5018. color: inherit;
  5019. }
  5020.  
  5021. .b-options-floated .selected.always-active:hover {
  5022. color: #8a8eac;
  5023. }
  5024.  
  5025. .b-options-floated .selected.always-active:active {
  5026. color: #b7b8cc;
  5027. }
  5028.  
  5029. .b-options-floated.mobile-desktop a, .b-options-floated.mobile-phone_portrait a, .b-options-floated.mobile-phone a, .b-options-floated.mobile-tablet a {
  5030. color: #57576a;
  5031. }
  5032.  
  5033. .b-options-floated.mobile-desktop a:hover, .b-options-floated.mobile-phone_portrait a:hover, .b-options-floated.mobile-phone a:hover, .b-options-floated.mobile-tablet a:hover {
  5034. color: #8a8eac;
  5035. }
  5036.  
  5037. .b-options-floated.mobile-desktop a:active, .b-options-floated.mobile-phone_portrait a:active, .b-options-floated.mobile-phone a:active, .b-options-floated.mobile-tablet a:active {
  5038. color: #b7b8cc;
  5039. }
  5040.  
  5041. .b-options-floated.mobile-desktop a.selected, .b-options-floated.mobile-phone_portrait a.selected, .b-options-floated.mobile-phone a.selected, .b-options-floated.mobile-tablet a.selected {
  5042. color: inherit;
  5043. }
  5044.  
  5045. .b-options-floated.mobile-desktop a.selected:hover, .b-options-floated.mobile-phone_portrait a.selected:hover, .b-options-floated.mobile-phone a.selected:hover, .b-options-floated.mobile-tablet a.selected:hover {
  5046. color: #b7b8cc;
  5047. }
  5048.  
  5049. /* Опросы */
  5050. .b-poll {
  5051. margin: .5rem 0;
  5052. line-height: inherit;
  5053. }
  5054.  
  5055. .b-poll .poll {
  5056. margin-bottom: .5em;
  5057. }
  5058.  
  5059. .b-poll .poll-variants {
  5060. padding: .25em 0;
  5061. margin: 0;
  5062. }
  5063.  
  5064. .b-poll .poll-variants .poll-variant {
  5065. padding: .25em 0;
  5066. line-height: 1.5em;
  5067. }
  5068.  
  5069. .b-poll .poll-variants .poll-variant label {
  5070. margin-bottom: 0;
  5071. border: 0;
  5072. color: #FFFFFF;
  5073. }
  5074.  
  5075. .b-poll .poll-variants .poll-variant.result {
  5076. margin-bottom: .5em;
  5077. }
  5078.  
  5079. .b-poll .poll-variants .poll-variant.result .bar .bar, .b-poll .poll-variants .poll-variant.result .bar .line {
  5080. height: 4px;
  5081. margin-bottom: 0;
  5082. border-radius: 2px;
  5083. line-height: 4px;
  5084. }
  5085.  
  5086. .b-poll .poll-variants .poll-variant.result .bar .bar.s0, .b-poll .poll-variants .poll-variant.result .bar .bar.s1, .b-poll .poll-variants .poll-variant.result .bar .bar.s2, .b-poll .poll-variants .poll-variant.result .bar .bar.s3 {
  5087. background-color: #3a3d50;
  5088. }
  5089.  
  5090. .b-poll .poll-variants .poll-variant.result .bar .line {
  5091. background-color: #4f4f4f;
  5092. }
  5093.  
  5094. .b-poll .poll-variants .poll-variant.result .votes-percent {
  5095. margin-right: 1em;
  5096. color: #9E9E9E;
  5097. font-size: .75em;
  5098. line-height: inherit;
  5099. }
  5100.  
  5101. .b-poll .poll-variants .poll-variant.result .votes-total {
  5102. margin-left: 1em;
  5103. color: #BDBDBD;
  5104. font-size: .75em;
  5105. line-height: inherit;
  5106. }
  5107.  
  5108. .b-poll .poll-variants .poll-variant.result label .voted-for {
  5109. padding-left: 1em;
  5110. color: #66bb6a;
  5111. }
  5112.  
  5113. .b-poll .poll-variants .poll-variant.result label .voted-for::after, .b-poll .poll-variants .poll-variant.result label .voted-for::before {
  5114. display: none;
  5115. }
  5116.  
  5117. /* Псевдо переключатель */
  5118. .b-radio input[type='radio'] {
  5119. pointer-events: none;
  5120. }
  5121.  
  5122. .b-radio input[type='radio'] + .radio-label::before {
  5123. content: '';
  5124. display: inline-block;
  5125. vertical-align: top;
  5126. width: 18px;
  5127. height: 18px;
  5128. margin: 3px 18px 0 0;
  5129. border-radius: 100%;
  5130. border: 1.5px solid #BDBDBD;
  5131. box-sizing: border-box;
  5132. box-shadow: 0 0 0 2.75px #181720 inset;
  5133. }
  5134.  
  5135. .b-radio input[type='radio']:checked + .radio-label::before {
  5136. width: 18px;
  5137. height: 18px;
  5138. background-color: #3a3d50;
  5139. border: 1.5px solid #3a3d50;
  5140. }
  5141.  
  5142. /* Цитаты */
  5143. .b-quote {
  5144. padding: .5rem 1rem;
  5145. margin: .5rem 0;
  5146. background: #363643;
  5147. border-color: #4f4f4f;
  5148. border-style: solid;
  5149. border-radius: 2px;
  5150. color: inherit;
  5151. }
  5152.  
  5153. .b-quote .quoteable {
  5154. margin: 0 0 .5rem;
  5155. line-height: 20px;
  5156. }
  5157.  
  5158. .b-quote .quoteable::before {
  5159. float: left;
  5160. margin-right: 8px;
  5161. color: #BDBDBD;
  5162. }
  5163.  
  5164. .b-quote .quoteable a {
  5165. padding-right: 0;
  5166. margin-right: .375rem;
  5167. }
  5168.  
  5169. .b-quote .b-quote {
  5170. margin-left: 0 !important;
  5171. background: #4a4a4a;
  5172. }
  5173.  
  5174. .b-quote .b-quote .b-quote {
  5175. background: #363643;
  5176. }
  5177.  
  5178. .b-quote .b-quote .b-quote .b-quote {
  5179. background: #4a4a4a;
  5180. }
  5181.  
  5182. /* Звёзды рейтинга */
  5183. .b-rate {
  5184. padding: 6px 0;
  5185. }
  5186.  
  5187. .b-rate:last-child {
  5188. margin-bottom: 15px;
  5189. }
  5190.  
  5191. .b-rate .text-score {
  5192. vertical-align: top;
  5193. color: inherit;
  5194. }
  5195.  
  5196. .b-rate .score-notice {
  5197. color: inherit;
  5198. font-size: 10px;
  5199. margin-top: -46px;
  5200. text-transform: uppercase;
  5201. }
  5202.  
  5203. .b-review-topic .b-rate .score-notice {
  5204. margin-top: -58px;
  5205. }
  5206.  
  5207. .b-rate .score-value {
  5208. line-height: 36px;
  5209. }
  5210.  
  5211. .b-rate .stars::before {
  5212. width: auto !important;
  5213. font-size: 36px !important;
  5214. letter-spacing: -6px;
  5215. }
  5216.  
  5217. .b-rate .stars::after {
  5218. display: none;
  5219. }
  5220.  
  5221. .b-rate .stars.background {
  5222. color: #4f4f4f;
  5223. }
  5224.  
  5225. .b-rate .stars.background::before {
  5226. content: 'star_border star_border star_border star_border star_border';
  5227. }
  5228.  
  5229. .b-rate .stars.hover {
  5230. color: #454d5f;
  5231. }
  5232.  
  5233. .b-rate .stars.score {
  5234. color: #3a3d50;
  5235. }
  5236.  
  5237. .b-rate .stars.score-1::before {
  5238. content: 'star_half';
  5239. }
  5240.  
  5241. .b-rate .stars.score-2::before {
  5242. content: 'star';
  5243. }
  5244.  
  5245. .b-rate .stars.score-3::before {
  5246. content: 'star star_half';
  5247. }
  5248.  
  5249. .b-rate .stars.score-4::before {
  5250. content: 'star star';
  5251. }
  5252.  
  5253. .b-rate .stars.score-5::before {
  5254. content: 'star star star_half';
  5255. }
  5256.  
  5257. .b-rate .stars.score-6::before {
  5258. content: 'star star star';
  5259. }
  5260.  
  5261. .b-rate .stars.score-7::before {
  5262. content: 'star star star star_half';
  5263. }
  5264.  
  5265. .b-rate .stars.score-8::before {
  5266. content: 'star star star star';
  5267. }
  5268.  
  5269. .b-rate .stars.score-9::before {
  5270. content: 'star star star star star_half';
  5271. }
  5272.  
  5273. .b-rate .stars.score-10::before {
  5274. content: 'star star star star star';
  5275. }
  5276.  
  5277. .b-review_votes {
  5278. color: inherit;
  5279. font-size: inherit;
  5280. line-height: inherit;
  5281. }
  5282.  
  5283. .b-review_votes::before {
  5284. content: 'thumbs_up_down';
  5285. display: inline-block;
  5286. vertical-align: top;
  5287. color: #9E9E9E;
  5288. font-size: 1.125rem !important;
  5289. }
  5290.  
  5291. .b-review_votes span {
  5292. color: #9E9E9E;
  5293. }
  5294.  
  5295. .b-review_votes .votes-for {
  5296. color: #66BB6A;
  5297. }
  5298.  
  5299. .b-review_votes .votes-against {
  5300. color: #EF5350;
  5301. }
  5302.  
  5303. .b-shiki_editor aside.markers {
  5304. position: relative;
  5305. height: auto;
  5306. padding: .5rem 0 0;
  5307. z-index: 1;
  5308. }
  5309.  
  5310. .b-shiki_editor aside.buttons {
  5311. margin: 0;
  5312. }
  5313.  
  5314. .b-shiki_editor aside.buttons .editor-strike {
  5315. display: inline-block;
  5316. }
  5317.  
  5318. .b-shiki_editor .hidden-block {
  5319. height: auto;
  5320. line-height: 3em;
  5321. }
  5322.  
  5323. .b-shiki_editor .hidden-block p {
  5324. padding: 0 !important;
  5325. white-space: nowrap;
  5326. overflow-x: auto;
  5327. }
  5328.  
  5329. .b-shiki_editor .hidden-block label {
  5330. vertical-align: top;
  5331. margin: 0;
  5332. }
  5333.  
  5334. .b-shiki_editor .hidden-block label + label {
  5335. margin-left: .5rem;
  5336. }
  5337.  
  5338. .b-shiki_editor .hidden-block .link-value {
  5339. vertical-align: top;
  5340. width: 16rem !important;
  5341. height: 36px;
  5342. padding: 0 .75rem;
  5343. margin: .375rem 0;
  5344. margin-left: .5rem !important;
  5345. background: #181720;
  5346. border: 2px solid #3a3d50;
  5347. border-right-width: 0;
  5348. border-radius: 4px 0 0 4px;
  5349. color: #FFFFFF;
  5350. line-height: 32px;
  5351. }
  5352.  
  5353. .b-shiki_editor .hidden-block .b-button.ok {
  5354. min-width: 0;
  5355. border-radius: 0 4px 4px 0;
  5356. }
  5357.  
  5358. .b-shiki_editor .body .editor textarea {
  5359. padding: .5rem 1rem;
  5360. margin: 0;
  5361. background: #363643;
  5362. border-radius: 2px;
  5363. font-size: 1rem;
  5364. line-height: 1.25rem;
  5365. }
  5366.  
  5367. .b-shiki_editor .body .editor textarea::-webkit-input-placeholder {
  5368. padding: 0;
  5369. line-height: inherit;
  5370. }
  5371.  
  5372. .b-shiki_editor .body .editor textarea:-moz-placeholder {
  5373. padding: 0;
  5374. line-height: inherit;
  5375. }
  5376.  
  5377. .b-shiki_editor .body .editor textarea::-moz-placeholder {
  5378. padding: 0;
  5379. line-height: inherit;
  5380. }
  5381.  
  5382. .b-shiki_editor .body .editor textarea:-ms-input-placeholder {
  5383. padding: 0;
  5384. line-height: inherit;
  5385. }
  5386.  
  5387. .b-shiki_editor .body .preview {
  5388. padding: 0;
  5389. margin: 0;
  5390. background: transparent;
  5391. border: 0;
  5392. }
  5393.  
  5394. .b-shiki_editor.previewed .body .preview .b-comment {
  5395. padding-bottom: 0;
  5396. }
  5397.  
  5398. .b-shiki_editor footer {
  5399. margin-top: .25em;
  5400. }
  5401.  
  5402. .b-shiki_editor footer input[type=submit],
  5403. .b-shiki_editor footer .unpreview,
  5404. .b-shiki_editor footer .preview {
  5405. margin: .375rem .5rem .375rem 0;
  5406. }
  5407.  
  5408. .b-shiki_editor footer .about-bb_codes {
  5409. padding: .5rem;
  5410. margin: .25rem 0;
  5411. border-radius: 3px;
  5412. color: #BDBDBD;
  5413. font-size: 0;
  5414. line-height: inherit;
  5415. transition: 0.16s cubic-bezier(0.4, 0, 0.6, 1);
  5416. transition: .3s;
  5417. }
  5418.  
  5419. .b-shiki_editor footer .about-bb_codes:hover {
  5420. text-decoration: none;
  5421. color: #BDBDBD;
  5422. }
  5423.  
  5424. .b-shiki_editor footer .about-bb_codes:active {
  5425. color: #BDBDBD;
  5426. }
  5427.  
  5428. .b-shiki_editor footer .about-bb_codes::before {
  5429. content: 'help';
  5430. font-size: 1rem;
  5431. }
  5432.  
  5433. .b-shiki_editor footer .about-bb_codes::after {
  5434. content: 'Справка';
  5435. display: none;
  5436. vertical-align: top;
  5437. font-size: .875rem;
  5438. }
  5439.  
  5440. [data-locale='en'] .b-shiki_editor footer .about-bb_codes::after {
  5441. content: 'Help';
  5442. }
  5443.  
  5444. @media (min-width: 768px) {
  5445. .b-shiki_editor footer .about-bb_codes {
  5446. padding: .5rem 1rem;
  5447. margin: .375rem 0;
  5448. font-weight: bold;
  5449. line-height: 1.25rem;
  5450. text-transform: uppercase;
  5451. }
  5452. .b-shiki_editor footer .about-bb_codes:hover {
  5453. background: rgba(189, 189, 189, 0.12);
  5454. }
  5455. .b-shiki_editor footer .about-bb_codes:active {
  5456. background: rgba(189, 189, 189, 0.24);
  5457. }
  5458. .b-shiki_editor footer .about-bb_codes::before {
  5459. display: none;
  5460. }
  5461. .b-shiki_editor footer .about-bb_codes::after {
  5462. display: inline;
  5463. }
  5464. }
  5465.  
  5466. body[data-locale] .b-abuse_marker {
  5467. color: #ef5350;
  5468. }
  5469.  
  5470. body[data-locale] .b-broadcast_marker {
  5471. color: #ef8d50;
  5472. }
  5473.  
  5474. body[data-locale] .b-offtopic_marker {
  5475. color: #f58ebb;
  5476. }
  5477.  
  5478. body[data-locale] .b-offtopic_marker.active:hover {
  5479. color: #9E9E9E;
  5480. }
  5481.  
  5482. body[data-locale] .b-offtopic_marker.off:hover {
  5483. color: #f58ebb;
  5484. }
  5485.  
  5486. body[data-locale] .b-summary_marker {
  5487. color: #66bb6a;
  5488. }
  5489.  
  5490. body[data-locale] .b-summary_marker.active:hover {
  5491. color: #9E9E9E;
  5492. }
  5493.  
  5494. body[data-locale] .b-summary_marker.off:hover {
  5495. color: #66bb6a;
  5496. }
  5497.  
  5498. body[data-locale] .b-spoiler_marker {
  5499. color: #ef8d50;
  5500. }
  5501.  
  5502. body[data-locale] .b-new_marker {
  5503. display: none;
  5504. color: #4f91e8;
  5505. }
  5506.  
  5507. body[data-locale] .b-new_marker.active:hover {
  5508. color: #9E9E9E;
  5509. }
  5510.  
  5511. body[data-locale] .b-new_marker.off:hover {
  5512. color: #4f91e8;
  5513. }
  5514.  
  5515. /* Источники описаний */
  5516. .b-source {
  5517. margin-top: .5rem;
  5518. margin-bottom: 1rem;
  5519. line-height: 1.5rem;
  5520. }
  5521.  
  5522. .b-source .contributors, .b-source .mal, .b-source .source {
  5523. padding: 0;
  5524. }
  5525.  
  5526. .b-source .contributors .b-user16, .b-source .mal .b-user16, .b-source .source .b-user16 {
  5527. margin-right: .5rem;
  5528. }
  5529.  
  5530. .b-source .contributors .b-user16::after, .b-source .mal .b-user16::after, .b-source .source .b-user16::after {
  5531. display: none;
  5532. }
  5533.  
  5534. .b-source .contributors .key, .b-source .mal .key, .b-source .source .key {
  5535. margin-right: .5em;
  5536. color: #BDBDBD;
  5537. line-height: inherit;
  5538. }
  5539.  
  5540. .b-source .contributors .val a, .b-source .mal .val a, .b-source .source .val a {
  5541. color: #57576a;
  5542. }
  5543.  
  5544. .b-source .contributors .val a:hover, .b-source .mal .val a:hover, .b-source .source .val a:hover {
  5545. color: #8a8eac;
  5546. }
  5547.  
  5548. .b-source .contributors .val a:active, .b-source .mal .val a:active, .b-source .source .val a:active {
  5549. color: #b7b8cc;
  5550. }
  5551.  
  5552. /* Спойлеры */
  5553. .b-spoiler label {
  5554. color: #57576a;
  5555. font-size: inherit;
  5556. letter-spacing: initial;
  5557. }
  5558.  
  5559. .b-spoiler label:hover {
  5560. color: #8a8eac;
  5561. }
  5562.  
  5563. .b-spoiler label:active {
  5564. color: #b7b8cc;
  5565. }
  5566.  
  5567. .b-spoiler .content .before, .b-spoiler .content .after {
  5568. color: #57576a;
  5569. font-size: inherit;
  5570. letter-spacing: initial;
  5571. }
  5572.  
  5573. .b-spoiler .content:hover .before, .b-spoiler .content:hover .after {
  5574. color: #8a8eac;
  5575. }
  5576.  
  5577. .b-stats_bar .title {
  5578. color: #BDBDBD;
  5579. }
  5580.  
  5581. .b-stats_bar a.title {
  5582. color: #57576a;
  5583. }
  5584.  
  5585. .b-stats_bar a.title:hover {
  5586. color: #8a8eac;
  5587. }
  5588.  
  5589. .b-stats_bar a.title:active {
  5590. color: #b7b8cc;
  5591. }
  5592.  
  5593. .b-stats_bar .bar {
  5594. height: auto;
  5595. border-radius: 2px;
  5596. }
  5597.  
  5598. .b-stats_bar .bar .first, .b-stats_bar .bar .second, .b-stats_bar .bar .third {
  5599. color: inherit;
  5600. font-size: .75rem;
  5601. line-height: 1.25rem;
  5602. }
  5603.  
  5604. .b-stats_bar .bar .third {
  5605. background: #4f4f4f;
  5606. color: #FFFFFF;
  5607. }
  5608.  
  5609. .b-stats_bar .stat_names {
  5610. font-size: .875rem;
  5611. line-height: 2rem;
  5612. }
  5613.  
  5614. .b-stats_bar .stat_names .stat_name {
  5615. padding: 0 1rem 0 0;
  5616. }
  5617.  
  5618. .b-stats_bar .stat_names .stat_name::after {
  5619. display: none;
  5620. }
  5621.  
  5622. .b-stats_bar .stat_names .stat_name a {
  5623. display: block;
  5624. color: #FFFFFF;
  5625. }
  5626.  
  5627. .b-stats_bar .stat_names .stat_name a:hover {
  5628. color: #8a8eac;
  5629. }
  5630.  
  5631. .b-stats_bar .stat_names .stat_name a:active {
  5632. color: #b7b8cc;
  5633. }
  5634.  
  5635. .b-stats_bar .stat_names .stat_name .size::before, .b-stats_bar .stat_names .stat_name .size::after {
  5636. color: #9E9E9E;
  5637. }
  5638.  
  5639. .b-status-line {
  5640. margin-top: .125rem;
  5641. margin-bottom: .5rem;
  5642. font-size: .875rem;
  5643. line-height: 1.25rem;
  5644. }
  5645.  
  5646. .b-status-line .section {
  5647. vertical-align: top;
  5648. padding-left: .5rem;
  5649. margin-left: .5rem;
  5650. border-color: #4f4f4f;
  5651. }
  5652.  
  5653. .b-status-line .section.about span.about {
  5654. padding-left: .5rem;
  5655. }
  5656.  
  5657. .b-status-line .section.about .b-link {
  5658. padding-left: .5rem;
  5659. }
  5660.  
  5661. .b-status-line .section.about .author {
  5662. padding-left: .5rem;
  5663. }
  5664.  
  5665. .b-status-line .section.created_at time::before,
  5666. .b-status-line .section.changed_at time::before,
  5667. .b-status-line .section.additional .collection-size::before,
  5668. .b-status-line .section.additional .comments::before,
  5669. .b-status-line .section.additional .b-review_votes::before {
  5670. display: inline-block;
  5671. vertical-align: top;
  5672. padding: 0;
  5673. margin-right: .375rem;
  5674. color: #9E9E9E;
  5675. font-size: 1.125rem !important;
  5676. }
  5677.  
  5678. .b-status-line .section.created_at time::before {
  5679. content: 'create';
  5680. }
  5681.  
  5682. .b-status-line .section.changed_at time::before {
  5683. content: 'history';
  5684. }
  5685.  
  5686. .b-status-line .section.additional .collection-size {
  5687. margin-right: 1rem;
  5688. color: inherit;
  5689. }
  5690.  
  5691. .b-status-line .section.additional .collection-size::before {
  5692. content: 'collections_bookmark';
  5693. content: 'widgets';
  5694. }
  5695.  
  5696. .b-status-line .section.additional .comments::before {
  5697. content: 'mode_comment';
  5698. }
  5699.  
  5700. .b-status-line .section.additional .b-review_votes {
  5701. margin-left: 1rem;
  5702. }
  5703.  
  5704. /* Table */
  5705. .b-table td {
  5706. padding: .25em 0;
  5707. line-height: 1.5;
  5708. }
  5709.  
  5710. .b-table td.num {
  5711. white-space: nowrap;
  5712. }
  5713.  
  5714. .b-table th {
  5715. color: inherit;
  5716. }
  5717.  
  5718. .b-table tr.border {
  5719. border-color: #4f4f4f;
  5720. }
  5721.  
  5722. .b-table a {
  5723. color: #57576a;
  5724. }
  5725.  
  5726. .b-table a:hover {
  5727. color: #8a8eac;
  5728. }
  5729.  
  5730. .b-table a:active {
  5731. color: #b7b8cc;
  5732. }
  5733.  
  5734. .b-to-top .slide::before {
  5735. width: 56px;
  5736. background: #4a4a4a;
  5737. }
  5738.  
  5739. .b-to-top .slide::before:hover + .arrow::before {
  5740. color: #EEEEEE;
  5741. }
  5742.  
  5743. .b-to-top .arrow {
  5744. top: auto;
  5745. bottom: 4px;
  5746. width: 48px;
  5747. height: 48px;
  5748. padding: .75em;
  5749. margin: 0 4px;
  5750. border-radius: 50%;
  5751. font: inherit;
  5752. pointer-events: none;
  5753. }
  5754.  
  5755. .b-to-top .arrow::before {
  5756. content: 'arrow_upward';
  5757. color: #BDBDBD;
  5758. font-family: 'Material Icons';
  5759. font-size: 24px;
  5760. line-height: 1;
  5761. text-shadow: none;
  5762. letter-spacing: normal;
  5763. text-transform: none;
  5764. word-wrap: normal;
  5765. white-space: nowrap;
  5766. direction: ltr;
  5767. /* Support for all WebKit browsers. */
  5768. -webkit-font-smoothing: antialiased;
  5769. /* Support for Safari and Chrome. */
  5770. text-rendering: optimizeLegibility;
  5771. /* Support for Firefox. */
  5772. -moz-osx-font-smoothing: grayscale;
  5773. /* Support for IE. */
  5774. font-feature-settings: 'liga';
  5775. }
  5776.  
  5777. .b-topic {
  5778. margin-bottom: 0;
  5779. line-height: inherit;
  5780. }
  5781.  
  5782. .b-topic > .editor-container {
  5783. margin-top: 1rem;
  5784. }
  5785.  
  5786. .b-topic > .inner > header .name-date a {
  5787. font-size: inherit;
  5788. }
  5789.  
  5790. .b-topic > .inner > header .about {
  5791. margin-right: .5rem;
  5792. }
  5793.  
  5794. .b-topic > .inner > header .about > span {
  5795. color: #BDBDBD;
  5796. padding: 0 .5rem 0 0;
  5797. font-size: .875rem;
  5798. }
  5799.  
  5800. .b-topic > .inner > header .about a {
  5801. font-size: 1rem;
  5802. font-weight: bold;
  5803. }
  5804.  
  5805. .b-topic .footer-vote {
  5806. padding: 0;
  5807. margin-top: 1rem;
  5808. margin-bottom: 1rem;
  5809. background: transparent;
  5810. border: 0;
  5811. color: inherit;
  5812. font-size: inherit;
  5813. line-height: inherit;
  5814. }
  5815.  
  5816. .b-topic .footer-vote::after {
  5817. content: '';
  5818. display: block;
  5819. clear: both;
  5820. }
  5821.  
  5822. .b-topic .footer-vote .star {
  5823. vertical-align: top;
  5824. padding: .5rem;
  5825. line-height: 0;
  5826. }
  5827.  
  5828. .b-topic .footer-vote .star::before {
  5829. content: 'thumbs_up_down';
  5830. width: 1.5rem;
  5831. padding: 0;
  5832. font-size: 1.5rem;
  5833. }
  5834.  
  5835. .b-topic .footer-vote .notice {
  5836. margin: 0 1.5rem 0 1rem;
  5837. line-height: 2.5rem;
  5838. }
  5839.  
  5840. .b-topic .footer-vote .vote-group {
  5841. float: right;
  5842. }
  5843.  
  5844. .b-topic .footer-vote .vote-group .separator {
  5845. display: none;
  5846. }
  5847.  
  5848. .b-topic .footer-vote .vote-group .vote {
  5849. min-width: 5.5rem;
  5850. padding: 0 1rem;
  5851. margin: .25rem 0;
  5852. background-color: #212121;
  5853. border: 0;
  5854. border-radius: .125rem;
  5855. color: inherit;
  5856. font-size: .875rem;
  5857. font-weight: 700;
  5858. line-height: 2rem;
  5859. text-transform: uppercase;
  5860. opacity: 1;
  5861. transition: background-color .24s ease, color .24s ease;
  5862. }
  5863.  
  5864. .b-topic .footer-vote .vote-group .vote:not(:last-child) {
  5865. margin-right: .5rem;
  5866. }
  5867.  
  5868. .b-topic .footer-vote .vote-group .vote.yes::before, .b-topic .footer-vote .vote-group .vote.no::before {
  5869. display: inline;
  5870. vertical-align: middle;
  5871. padding: 0;
  5872. margin-right: .875rem;
  5873. font-size: 1.125rem !important;
  5874. }
  5875.  
  5876. .b-topic .footer-vote .vote-group .vote.yes.selected, .b-topic .footer-vote .vote-group .vote.yes:hover {
  5877. background-color: #4CAF50;
  5878. background-color: #66BB6A;
  5879. color: #FFFFFF;
  5880. }
  5881.  
  5882. .b-topic .footer-vote .vote-group .vote.yes::before {
  5883. content: 'thumb_up';
  5884. }
  5885.  
  5886. .b-topic .footer-vote .vote-group .vote.no.selected, .b-topic .footer-vote .vote-group .vote.no:hover {
  5887. background-color: #F44336;
  5888. background-color: #EF5350;
  5889. color: #FFFFFF;
  5890. }
  5891.  
  5892. .b-topic .footer-vote .vote-group .vote.no::before {
  5893. content: 'thumb_down';
  5894. }
  5895.  
  5896. .b-topic > .b-comments {
  5897. margin-top: 0;
  5898. }
  5899.  
  5900. .b-topic.aside-expanded > .b-comments {
  5901. margin-left: 0;
  5902. }
  5903.  
  5904. /* Полоса загрузки. thx Dewopalaxy */
  5905. .b-upload_progress.active {
  5906. height: 1.5rem;
  5907. }
  5908.  
  5909. .b-upload_progress .bar {
  5910. min-width: 0;
  5911. height: 4px;
  5912. background-color: #3a3d50;
  5913. border-radius: 2px;
  5914. color: #FFFFFF;
  5915. font-size: .875rem;
  5916. text-align: left;
  5917. text-indent: 1rem;
  5918. line-height: 2rem;
  5919. overflow: visible;
  5920. }
  5921.  
  5922. .b-upload_progress .bar::first-letter {
  5923. text-transform: uppercase;
  5924. }
  5925.  
  5926. .b-user.named_avatar .name {
  5927. margin: auto;
  5928. }
  5929.  
  5930. /* Плашки пользователей */
  5931. .b-user16 {
  5932. margin-right: .375rem;
  5933. margin-left: 0;
  5934. border-radius: 1rem;
  5935. color: #BDBDBD;
  5936. font-weight: bold;
  5937. line-height: 1.25rem;
  5938. }
  5939.  
  5940. .b-user16:hover {
  5941. color: #EEEEEE;
  5942. }
  5943.  
  5944. .b-user16:active {
  5945. color: #b7b8cc;
  5946. }
  5947.  
  5948. .b-user16 a {
  5949. display: inline-block;
  5950. vertical-align: top;
  5951. color: inherit;
  5952. }
  5953.  
  5954. .b-user16 a:hover, .b-user16 a:active {
  5955. color: inherit;
  5956. text-decoration: none;
  5957. }
  5958.  
  5959. .b-user16:hover a {
  5960. color: inherit;
  5961. }
  5962.  
  5963. .b-user16 img {
  5964. padding: 0;
  5965. margin: 2px 0 2px -12px !important;
  5966. border-radius: 50%;
  5967. }
  5968.  
  5969. .b-user16 span {
  5970. vertical-align: top;
  5971. padding: 0 .5rem;
  5972. font-size: .875rem;
  5973. line-height: 1.25rem;
  5974. }
  5975.  
  5976. .b-user16:hover span {
  5977. color: inherit;
  5978. text-decoration: none;
  5979. }
  5980.  
  5981. .subheadline .b-user16 {
  5982. margin: -.125rem 0;
  5983. line-height: 1.25rem;
  5984. }
  5985.  
  5986. .subheadline .b-user16 img {
  5987. margin-top: 2px;
  5988. }
  5989.  
  5990. .b-user16 a,
  5991. a.b-user16 {
  5992. padding-left: 14px;
  5993. background: #4a4a4a;
  5994. border-radius: 1rem;
  5995. transition: .24s ease;
  5996. }
  5997.  
  5998. .b-user16 a:hover, .b-user16 a:focus,
  5999. a.b-user16:hover,
  6000. a.b-user16:focus {
  6001. background: #5f6170;
  6002. }
  6003.  
  6004. .b-user16 a:active,
  6005. a.b-user16:active {
  6006. background: #212121;
  6007. }
  6008.  
  6009. .b-user16 a:focus,
  6010. a.b-user16:focus {
  6011. color: #8a8eac;
  6012. }
  6013.  
  6014. /* Форма выставления оценки и редактирования комментария под постером */
  6015. .b-user_rate .rate-show {
  6016. margin-bottom: .5rem;
  6017. }
  6018.  
  6019. .b-user_rate .rate-show .episodes {
  6020. margin-bottom: 8px;
  6021. font-size: 14px;
  6022. line-height: 32px;
  6023. }
  6024.  
  6025. .b-user_rate .rate-show .note {
  6026. padding: .5rem 1rem;
  6027. background: #4a4a4a;
  6028. border-radius: 2px;
  6029. color: #BDBDBD;
  6030. font-size: .875rem;
  6031. line-height: 1.25rem;
  6032. max-height: 10rem;
  6033. overflow-x: hidden;
  6034. overflow-y: auto;
  6035. }
  6036.  
  6037. .b-user_rate .rate-show .note::before {
  6038. content: 'Заметка';
  6039. display: block;
  6040. font-size: 10px;
  6041. font-weight: bold;
  6042. }
  6043.  
  6044. .b-user_rate .rate-show .rate-number {
  6045. margin-right: 0;
  6046. }
  6047.  
  6048. .b-user_rate .rate-show .rate-number .current-episodes, .b-user_rate .rate-show .rate-number .b-separator, .b-user_rate .rate-show .rate-number .total-episodes {
  6049. display: inline-block;
  6050. vertical-align: top;
  6051. line-height: 32px;
  6052. }
  6053.  
  6054. .b-user_rate .rate-show .rate-number .item-add {
  6055. margin: -4px 0 0 8px !important;
  6056. }
  6057.  
  6058. .b-user_rate .rate-show .rate-number .item-add::before {
  6059. content: 'add';
  6060. }
  6061.  
  6062. .b-user_rate .rate-edit .b-input.integer input {
  6063. width: 7rem;
  6064. }
  6065.  
  6066. /* Контейнер для видеоплеера */
  6067. .b-video_player .cc-player_controls .cc-navigation > .c-control > b,
  6068. .b-video_player .cc-player_controls .cc-navigation > .c-control > span {
  6069. display: inline-block;
  6070. vertical-align: top;
  6071. margin: .25rem auto;
  6072. line-height: 2.5rem;
  6073. }
  6074.  
  6075. @media (max-width: 480px) and (orientation: portrait) {
  6076. .b-video_player .cc-player_controls .cc-navigation > .c-control > b,
  6077. .b-video_player .cc-player_controls .cc-navigation > .c-control > span {
  6078. display: none;
  6079. }
  6080. }
  6081.  
  6082. .b-video_player .cc-player_controls .cc-navigation > .c-control > b {
  6083. margin-left: .5rem;
  6084. }
  6085.  
  6086. .b-video_player .cc-player_controls .cc-options > .c-video_stats {
  6087. margin: .25rem auto;
  6088. }
  6089.  
  6090. .b-video_player .cc-player_controls a.c-control {
  6091. display: block;
  6092. color: #57576a;
  6093. }
  6094.  
  6095. .b-video_player .cc-player_controls a.c-control:hover {
  6096. color: #8a8eac;
  6097. text-decoration: none;
  6098. }
  6099.  
  6100. .b-video_player .cc-player_controls a.c-control:active {
  6101. color: #b7b8cc;
  6102. }
  6103.  
  6104. .b-video_player .cc-player_controls .c-control {
  6105. color: #57576a;
  6106. }
  6107.  
  6108. .b-video_player .cc-player_controls .c-control:hover {
  6109. color: #8a8eac;
  6110. text-decoration: none;
  6111. }
  6112.  
  6113. .b-video_player .cc-player_controls .c-control:active {
  6114. color: #b7b8cc;
  6115. }
  6116.  
  6117. .b-video_player .cc-player_controls .c-control.selected {
  6118. color: #8a8eac;
  6119. }
  6120.  
  6121. .b-video_player .cc-player_controls .c-control.selected:hover {
  6122. color: #b7b8cc;
  6123. }
  6124.  
  6125. .b-video_player .cc-player_controls .c-control .icon {
  6126. margin: .25rem auto !important;
  6127. }
  6128.  
  6129. .b-video_player .cc-player_controls .c-control:hover .icon {
  6130. background-color: #424242;
  6131. }
  6132.  
  6133. .b-video_player .cc-player_controls .label {
  6134. font-size: .75rem;
  6135. }
  6136.  
  6137. .b-video_player .cc-player_controls .episode-num {
  6138. color: #EEEEEE !important;
  6139. }
  6140.  
  6141. .b-video_player .cc-player_controls .episode-num input {
  6142. margin: .75rem .25rem;
  6143. }
  6144.  
  6145. .b-video_player .cc-player_controls .episode-num .video-link a {
  6146. color: #57576a;
  6147. }
  6148.  
  6149. .b-video_player .cc-player_controls .episode-num .video-link a:hover {
  6150. color: #8a8eac;
  6151. }
  6152.  
  6153. .b-video_player .cc-player_controls .episode-num .video-link a:active {
  6154. color: #b7b8cc;
  6155. }
  6156.  
  6157. .b-video_player .cc-player_controls .episode-title {
  6158. color: #FFFFFF !important;
  6159. }
  6160.  
  6161. .b-video_player .cc-player_controls .episode-title .video-link {
  6162. font-size: .75rem;
  6163. }
  6164.  
  6165. .b-video_player .cc-player_controls .episode-title .video-link a {
  6166. display: block;
  6167. border: 0;
  6168. color: #57576a;
  6169. line-height: inherit;
  6170. }
  6171.  
  6172. .b-video_player .cc-player_controls .episode-title .video-link a:hover {
  6173. color: #8a8eac;
  6174. }
  6175.  
  6176. .b-video_player .cc-player_controls .episode-title .video-link a:active {
  6177. color: #b7b8cc;
  6178. }
  6179.  
  6180. .b-video_player .cc-player_controls .next .icon::before {
  6181. content: 'skip_next';
  6182. }
  6183.  
  6184. .b-video_player .cc-player_controls .prev .icon::before {
  6185. content: 'skip_previous';
  6186. }
  6187.  
  6188. .b-video_player .cc-player_controls .create-user_rate .icon::before {
  6189. content: 'add';
  6190. }
  6191.  
  6192. .b-video_player .cc-player_controls .show-options .icon::before {
  6193. content: 'settings';
  6194. }
  6195.  
  6196. .b-video_player .cc-player_controls .edit .icon::before {
  6197. content: 'build';
  6198. }
  6199.  
  6200. .b-video_player .cc-player_controls .upload .icon::before {
  6201. content: 'cloud_upload';
  6202. }
  6203.  
  6204. .b-video_player .cc-player_controls .increment-user_rate .icon::before {
  6205. content: 'done';
  6206. }
  6207.  
  6208. .b-video_player .cc-player_controls .delete .icon::before {
  6209. content: 'delete';
  6210. }
  6211.  
  6212. .b-video_player .cc-player_controls .report .icon::before {
  6213. content: 'flag';
  6214. }
  6215.  
  6216. .b-video_variant {
  6217. margin: 0 0 4px;
  6218. border-radius: 3px;
  6219. transition: .24s ease-out;
  6220. }
  6221.  
  6222. .b-video_variant:hover {
  6223. background-color: #5f6170;
  6224. }
  6225.  
  6226. .b-video_variant:active, .b-video_variant.active {
  6227. background-color: #3a3d50;
  6228. }
  6229.  
  6230. .b-video_variant:active a, .b-video_variant.active a {
  6231. border: 0;
  6232. color: rgba(250, 250, 250, 0.8);
  6233. }
  6234.  
  6235. .b-video_variant:active a:hover span, .b-video_variant.active a:hover span {
  6236. color: #FAFAFA;
  6237. }
  6238.  
  6239. .b-video_variant:active .video-author,
  6240. .b-video_variant:active .episode-num,
  6241. .b-video_variant:active .video-id, .b-video_variant.active .video-author,
  6242. .b-video_variant.active .episode-num,
  6243. .b-video_variant.active .video-id {
  6244. color: #FAFAFA !important;
  6245. }
  6246.  
  6247. .b-video_variant a {
  6248. display: block;
  6249. padding: 8px 12px;
  6250. color: inherit;
  6251. font-size: .875em;
  6252. }
  6253.  
  6254. .b-video_variant a::after {
  6255. content: '';
  6256. display: block;
  6257. clear: both;
  6258. }
  6259.  
  6260. .b-video_variant a:hover {
  6261. border: 0;
  6262. }
  6263.  
  6264. .b-video_variant a.broken::before, .b-video_variant a.wrong::before, .b-video_variant a.rejected::before, .b-video_variant a.banned_hosting::before {
  6265. font-size: 10px;
  6266. font-weight: bold;
  6267. line-height: 16px;
  6268. text-transform: uppercase;
  6269. }
  6270.  
  6271. .b-video_variant a span {
  6272. float: left;
  6273. color: #BDBDBD;
  6274. font-size: 10px;
  6275. font-weight: bold;
  6276. line-height: 16px;
  6277. text-transform: uppercase;
  6278. backface-visibility: hidden;
  6279. }
  6280.  
  6281. .b-video_variant a span::before, .b-video_variant a span::after {
  6282. color: inherit !important;
  6283. }
  6284.  
  6285. .b-video_variant a:hover span {
  6286. color: #BDBDBD;
  6287. }
  6288.  
  6289. .b-video_variant .video-author {
  6290. float: none;
  6291. clear: both;
  6292. display: block;
  6293. font-size: 14px;
  6294. font-weight: bold;
  6295. line-height: 20px;
  6296. text-transform: none;
  6297. }
  6298.  
  6299. .b-video_variant .video-quality.bd,
  6300. .b-video_variant .video-quality.dvd {
  6301. margin: 2px 4px 2px 0;
  6302. }
  6303.  
  6304. .b-video_variant .video-kind.english::before {
  6305. left: -16px;
  6306. margin-top: 0;
  6307. }
  6308.  
  6309. .b-video_variant .episode-num {
  6310. display: none;
  6311. }
  6312.  
  6313. .p-anime_videos-index .same-videos .b-video_variant {
  6314. vertical-align: top;
  6315. margin: 0 4px 0 0;
  6316. }
  6317.  
  6318. .p-anime_videos-index .same-videos .b-video_variant::after {
  6319. display: none;
  6320. }
  6321.  
  6322. .c-anime_video_episodes .b-video_variant::before {
  6323. content: attr(data-episode);
  6324. position: absolute;
  6325. width: 32px;
  6326. height: 32px;
  6327. padding: 0;
  6328. margin: 8px 12px;
  6329. line-height: 32px;
  6330. background: rgba(0, 0, 0, 0.16);
  6331. border-radius: 50%;
  6332. text-align: center;
  6333. font-size: 12px;
  6334. font-weight: bold;
  6335. z-index: 1;
  6336. pointer-events: none;
  6337. }
  6338.  
  6339. .c-anime_video_episodes .b-video_variant.active::before {
  6340. color: #FAFAFA !important;
  6341. }
  6342.  
  6343. .c-anime_video_episodes .b-video_variant a {
  6344. padding-left: 56px;
  6345. }
  6346.  
  6347. .c-anime_video_episodes .b-video_variant a span:last-child {
  6348. clear: both;
  6349. }
  6350.  
  6351. /* Страница видео */
  6352. .p-anime_videos-index .c-videos .video-variant-switcher {
  6353. float: right;
  6354. margin: 0;
  6355. border: 0;
  6356. color: #57576a;
  6357. font-size: .875rem;
  6358. font-weight: 700;
  6359. line-height: 1rem;
  6360. text-transform: capitalize;
  6361. }
  6362.  
  6363. .p-anime_videos-index .c-videos .video-variant-switcher:hover, .p-anime_videos-index .c-videos .video-variant-switcher.active {
  6364. color: #8a8eac;
  6365. }
  6366.  
  6367. .p-anime_videos-index .c-videos .video-variant-switcher:active, .p-anime_videos-index .c-videos .video-variant-switcher.active:hover {
  6368. color: #b7b8cc;
  6369. }
  6370.  
  6371. .p-anime_videos-index .c-videos .video-variant-switcher:not(:first-child)::after {
  6372. content: '/';
  6373. padding: 0 .375rem;
  6374. color: #9E9E9E;
  6375. font-weight: normal;
  6376. }
  6377.  
  6378. .p-anime_videos-index .c-video_stats {
  6379. font-size: .875rem;
  6380. }
  6381.  
  6382. .p-anime_videos-index .c-video_stats .views_count {
  6383. color: #BDBDBD;
  6384. }
  6385.  
  6386. .p-anime_videos-index .c-video_stats .uploader .b-user16 {
  6387. padding-left: 0;
  6388. line-height: 1.25rem;
  6389. }
  6390.  
  6391. .p-anime_videos-index .c-video_stats .uploader .b-user16 img {
  6392. margin-top: 0;
  6393. }
  6394.  
  6395. .p-anime_videos-index .same-videos .title,
  6396. .p-anime_videos-index .c-anime_video_episodes .title,
  6397. .p-anime_videos-index .c-videos .title {
  6398. padding: 1rem 0;
  6399. margin: 0;
  6400. color: #BDBDBD;
  6401. color: inherit;
  6402. font-size: .875rem;
  6403. font-weight: 700;
  6404. line-height: 1rem;
  6405. text-transform: uppercase;
  6406. }
  6407.  
  6408. .p-anime_videos-index.x1000 .c-videos .title {
  6409. font-size: 0;
  6410. line-height: 0;
  6411. }
  6412.  
  6413. .p-anime_videos-index.x1000 .c-videos .title::after {
  6414. content: 'Варианты';
  6415. font-size: .875rem;
  6416. line-height: 1rem;
  6417. }
  6418.  
  6419. .p-anime_videos-index.x1000[data-locale='en'] .c-videos .title::after {
  6420. content: 'Variants';
  6421. }
  6422.  
  6423. .p-animes-show .other-names.click-loader,
  6424. .p-mangas-show .other-names.click-loader {
  6425. background-color: #4a4a4a;
  6426. border-color: #5f6170;
  6427. color: inherit !important;
  6428. }
  6429.  
  6430. .p-animes-show .other-names.click-loader:hover,
  6431. .p-mangas-show .other-names.click-loader:hover {
  6432. background-color: #5f6170;
  6433. border-color: #212121;
  6434. }
  6435.  
  6436. .p-animes-show .other-names.click-loader:active,
  6437. .p-mangas-show .other-names.click-loader:active {
  6438. background-color: #212121;
  6439. border-color: #4f4f4f;
  6440. }
  6441.  
  6442. @media screen and (min-width: 1200px) {
  6443. .p-animes-show .c-image .b-user_rate,
  6444. .p-mangas-show .c-image .b-user_rate {
  6445. margin: 0;
  6446. }
  6447. }
  6448.  
  6449. .watch-online-placeholer {
  6450. margin: 2rem auto .5rem;
  6451. }
  6452.  
  6453. .b-animes-menu .friend-rate {
  6454. padding: 2px 0;
  6455. line-height: 1.25rem;
  6456. }
  6457.  
  6458. .b-animes-menu .friend-rate .status {
  6459. margin-left: .5rem;
  6460. font-size: .75em;
  6461. }
  6462.  
  6463. .b-animes-menu .total-rates {
  6464. color: inherit;
  6465. }
  6466.  
  6467. .b-animes-menu .site-icon {
  6468. margin-top: .25rem;
  6469. margin-right: .75rem;
  6470. }
  6471.  
  6472. .b-animes-menu .menu-topics-block .entry {
  6473. font-size: .875rem;
  6474. line-height: 1.5rem;
  6475. }
  6476.  
  6477. .b-animes-menu .menu-topics-block .entry .time {
  6478. color: #BDBDBD;
  6479. font-size: .75rem;
  6480. }
  6481.  
  6482. .b-animes-menu .menu-topics-block .history-entry-tooltip .tooltip-details a {
  6483. font-size: .875rem;
  6484. }
  6485.  
  6486. .b-animes-menu .b-external_link {
  6487. font-size: .875rem;
  6488. line-height: 1.5rem;
  6489. }
  6490.  
  6491. .b-animes-menu .b-external_link a, .b-animes-menu .b-external_link .linkeable {
  6492. display: block;
  6493. margin-left: 2rem;
  6494. color: #FFFFFF !important;
  6495. }
  6496.  
  6497. .b-animes-menu .b-external_link a:hover, .b-animes-menu .b-external_link .linkeable:hover {
  6498. text-decoration: underline;
  6499. }
  6500.  
  6501. .b-animes-menu .b-external_link a::before, .b-animes-menu .b-external_link .linkeable::before {
  6502. width: 1.125rem;
  6503. height: 1.125rem;
  6504. margin-top: .1875rem;
  6505. margin-left: -2rem;
  6506. background-size: 1rem;
  6507. background-position: center;
  6508. background-repeat: no-repeat;
  6509. }
  6510.  
  6511. @media screen and (min-width: 1200px) {
  6512. .p-animes_collection-index.x1200 .cc-entries > .c-column,
  6513. .p-recommendations-index.x1200 .cc-entries > .c-column {
  6514. width: 18.4%;
  6515. margin-right: 2%;
  6516. }
  6517. }
  6518.  
  6519. .p-animes_collection-index .pagination,
  6520. .p-recommendations-index .pagination {
  6521. margin: 8px auto;
  6522. color: inherit;
  6523. font-size: .875em;
  6524. font-weight: normal;
  6525. line-height: 48px;
  6526. }
  6527.  
  6528. .p-animes_collection-index .pagination:last-child,
  6529. .p-recommendations-index .pagination:last-child {
  6530. margin: 8px auto 0;
  6531. }
  6532.  
  6533. .p-animes_collection-index .pagination .no-hover,
  6534. .p-recommendations-index .pagination .no-hover {
  6535. vertical-align: top;
  6536. }
  6537.  
  6538. .p-animes_collection-index .pagination .link,
  6539. .p-recommendations-index .pagination .link {
  6540. font-size: 0;
  6541. }
  6542.  
  6543. .p-animes_collection-index .pagination .link.disabled,
  6544. .p-recommendations-index .pagination .link.disabled {
  6545. color: #9E9E9E !important;
  6546. }
  6547.  
  6548. .p-animes_collection-index .pagination .link.disabled:hover,
  6549. .p-recommendations-index .pagination .link.disabled:hover {
  6550. background: transparent;
  6551. color: #9E9E9E !important;
  6552. }
  6553.  
  6554. .p-animes_collection-index .pagination .link.link-prev::before,
  6555. .p-recommendations-index .pagination .link.link-prev::before {
  6556. content: 'chevron_left';
  6557. }
  6558.  
  6559. .p-animes_collection-index .pagination .link.link-next::before,
  6560. .p-recommendations-index .pagination .link.link-next::before {
  6561. content: 'chevron_right';
  6562. }
  6563.  
  6564. .p-club_pages .l-content .subheadline,
  6565. .p-club_pages .l-content .subheadline > a {
  6566. max-width: 100%;
  6567. white-space: normal;
  6568. }
  6569.  
  6570. .p-clubs-edit .pages .b-button {
  6571. margin-right: .5rem;
  6572. }
  6573.  
  6574. .p-clubs-edit .pages .club_page-layout {
  6575. padding-left: 1rem;
  6576. font-size: .875rem;
  6577. }
  6578.  
  6579. .p-clubs-edit .pages .club_page-actions {
  6580. padding-left: 1rem;
  6581. font-size: .875rem;
  6582. }
  6583.  
  6584. .p-clubs-edit .pages .club_page-actions .b-js-link {
  6585. margin-right: .5rem;
  6586. }
  6587.  
  6588. .b-clubs-menu .club-actions {
  6589. margin-bottom: .5rem;
  6590. }
  6591.  
  6592. .b-clubs-menu .club-actions .b-tooltipped {
  6593. width: auto;
  6594. height: auto;
  6595. line-height: 0;
  6596. }
  6597.  
  6598. @media (max-width: 480px) and (orientation: portrait) {
  6599. .b-clubs-menu .club-actions .b-tooltipped {
  6600. display: block;
  6601. margin: 0 !important;
  6602. }
  6603. .b-clubs-menu .club-actions .b-tooltipped::after {
  6604. padding-left: 1.5rem;
  6605. color: #FFFFFF;
  6606. font-size: inherit;
  6607. line-height: 1.5;
  6608. }
  6609. }
  6610.  
  6611. .b-clubs-menu .club-actions .edit-club::before {
  6612. content: 'build';
  6613. }
  6614.  
  6615. .b-clubs-menu .club-actions .broadcast::before {
  6616. content: 'speaker_notes';
  6617. }
  6618.  
  6619. .b-clubs-menu .club-actions .upload::before {
  6620. content: 'attach_file';
  6621. }
  6622.  
  6623. .b-clubs-menu .club-actions .join::before,
  6624. .b-clubs-menu .club-actions .invite::before {
  6625. content: 'person_add';
  6626. }
  6627.  
  6628. .b-clubs-menu .club-actions .leave::before {
  6629. content: 'directions_run';
  6630. }
  6631.  
  6632. /**
  6633. * ТУРНИРЫ
  6634. */
  6635. .p-contests .match-container.b-ajax::after {
  6636. z-index: 10;
  6637. }
  6638.  
  6639. .p-contests .b-contest_match {
  6640. padding: 16px 0;
  6641. margin-bottom: 0;
  6642. }
  6643.  
  6644. .p-contests .b-contest_match .current-match .match-members:last-child {
  6645. margin-bottom: 0 !important;
  6646. }
  6647.  
  6648. .p-contests .match-day {
  6649. position: relative;
  6650. margin-bottom: 16px;
  6651. text-align: center;
  6652. }
  6653.  
  6654. .p-contests .match-day::before {
  6655. content: '';
  6656. display: block;
  6657. position: absolute;
  6658. top: 10px;
  6659. right: 0;
  6660. left: 0;
  6661. height: 1px;
  6662. }
  6663.  
  6664. .p-contests .match-day > .date {
  6665. position: relative;
  6666. display: inline-block;
  6667. padding: 0 16px;
  6668. margin-bottom: 4px;
  6669. text-align: center;
  6670. text-transform: uppercase;
  6671. }
  6672.  
  6673. .p-contests .match-day > .date .from,
  6674. .p-contests .match-day > .date .to {
  6675. margin-right: 8px;
  6676. }
  6677.  
  6678. .p-contests .match-day > .date .to {
  6679. margin-left: 8px;
  6680. }
  6681.  
  6682. .p-contests .match-day .match-link {
  6683. padding-left: 0;
  6684. text-align: left;
  6685. }
  6686.  
  6687. .p-contests .match-day .match-link:hover, .p-contests .match-day .match-link.active {
  6688. background: #363643;
  6689. }
  6690.  
  6691. .p-contests .match-day .match-link:active {
  6692. background-color: #4a4a4a;
  6693. }
  6694.  
  6695. .p-contests .match-day .match-link .c-column {
  6696. line-height: 32px !important;
  6697. }
  6698.  
  6699. .p-contests .match-day .match-link .draw {
  6700. padding-left: 0;
  6701. }
  6702.  
  6703. .p-contests .match-day .match-link .draw::before {
  6704. position: static;
  6705. top: 0;
  6706. left: 0;
  6707. width: 12px;
  6708. height: 12px;
  6709. margin: 10px 4px;
  6710. margin-right: 16px;
  6711. }
  6712.  
  6713. .p-contests .match-day .match-link .voted::before, .p-contests .match-day .match-link .winner::before, .p-contests .match-day .match-link .loser::before, .p-contests .match-day .match-link .created::before, .p-contests .match-day .match-link .started::before, .p-contests .match-day .match-link .finished::before {
  6714. display: inline-block;
  6715. vertical-align: top;
  6716. padding-right: 0;
  6717. padding-left: 0;
  6718. margin: 7px 0;
  6719. margin-right: 14px;
  6720. }
  6721.  
  6722. .p-contests .match-day .match-link .created::before {
  6723. content: 'lock';
  6724. color: #9E9E9E;
  6725. padding-right: 0;
  6726. }
  6727.  
  6728. .p-contests .match-day .match-link .winner::before {
  6729. content: 'thumb_up';
  6730. }
  6731.  
  6732. .p-contests .match-day .match-link .loser::before {
  6733. content: 'thumb_down';
  6734. padding-right: 0;
  6735. }
  6736.  
  6737. .p-contests .match-day .match-link .started::before,
  6738. .p-contests .match-day .match-link.voted-abstain .started::before {
  6739. content: 'check_box_outline_blank';
  6740. color: #757575;
  6741. }
  6742.  
  6743. .p-contests .match-day .match-link.voted-abstain .started::before {
  6744. color: #9E9E9E;
  6745. }
  6746.  
  6747. .p-contests .match-day .match-link.voted-left .started:first-child::before,
  6748. .p-contests .match-day .match-link.voted-right .started:last-child::before {
  6749. content: 'check_box';
  6750. }
  6751.  
  6752. .p-contests .match-day .match-link.voted-left .started:last-child::before,
  6753. .p-contests .match-day .match-link.voted-right .started:first-child::before {
  6754. content: 'indeterminate_check_box';
  6755. }
  6756.  
  6757. .p-contests .match-day .match-link.voted-left .started:first-child::before,
  6758. .p-contests .match-day .match-link.voted-right .started:last-child::before,
  6759. .p-contests .match-day .match-link .winner::before {
  6760. color: #66BB6A;
  6761. }
  6762.  
  6763. .p-contests .match-day .match-link.voted-left .started:last-child::before,
  6764. .p-contests .match-day .match-link.voted-right .started:first-child::before,
  6765. .p-contests .match-day .match-link .loser::before {
  6766. color: #EF5350;
  6767. }
  6768.  
  6769. .p-contests .match-day .matches-num {
  6770. display: inline-block;
  6771. width: 56px;
  6772. padding-right: 0;
  6773. font-size: 16px;
  6774. }
  6775.  
  6776. .p-contests-show .cc-round_stats > .c-column:first-child:last-child > .block:last-child {
  6777. padding: 4px 0;
  6778. }
  6779.  
  6780. .p-contests-show .warning {
  6781. margin-top: 0;
  6782. margin-bottom: 16px;
  6783. }
  6784.  
  6785. .p-contests .rating .member {
  6786. height: auto;
  6787. }
  6788.  
  6789. .p-contests-users .subheadline a:hover {
  6790. background: none;
  6791. }
  6792.  
  6793. .p-contests .b-contest_match .votes-percents {
  6794. border-radius: 4px;
  6795. font-size: 14px;
  6796. line-height: 24px;
  6797. }
  6798.  
  6799. .p-contests .b-contest_match .votes-percents span {
  6800. float: left;
  6801. position: relative;
  6802. white-space: nowrap;
  6803. z-index: 1;
  6804. }
  6805.  
  6806. .p-contests .b-contest_match .votes-percents .left-part {
  6807. position: relative;
  6808. border-radius: inherit;
  6809. padding-left: 8px;
  6810. background-color: #454d5f;
  6811. }
  6812.  
  6813. .p-contests .b-contest_match .votes-percents .left-part:hover {
  6814. background-color: #454d5f;
  6815. }
  6816.  
  6817. .p-contests .b-contest_match .votes-percents .left-part > span {
  6818. color: #FAFAFA;
  6819. }
  6820.  
  6821. .p-contests .b-contest_match .votes-percents .right-part {
  6822. position: absolute;
  6823. top: 0;
  6824. right: 0;
  6825. padding-right: 8px;
  6826. }
  6827.  
  6828. .p-contests .b-contest_match .votes-percents .right-part span {
  6829. float: right;
  6830. }
  6831.  
  6832. .p-contests .b-contest_match .votes-percents .left-part,
  6833. .p-contests .b-contest_match .votes-percents .right-part {
  6834. height: auto;
  6835. }
  6836.  
  6837. .p-contests .b-contest_match .votes-percents .right-part::before {
  6838. left: -24px;
  6839. border-right-width: 24px;
  6840. border-top-width: 48px;
  6841. }
  6842.  
  6843. .p-contests .b-contest_match .votes-percents .left-part:hover .right-part::before {
  6844. border-right-width: 24px;
  6845. }
  6846.  
  6847. .p-contests .b-contest_match .votes-percents .right-part::before,
  6848. .p-contests .b-contest_match .votes-percents .left-part:hover .right-part::before {
  6849. border-right-color: inherit;
  6850. }
  6851.  
  6852. .p-contests .results .cc-result .c-rounds .label {
  6853. color: #EEEEEE;
  6854. font-size: .875rem;
  6855. }
  6856.  
  6857. .p-contests .results .cc-result .c-rounds .match-day::before {
  6858. display: none;
  6859. }
  6860.  
  6861. .p-contests .results .cc-result .c-rounds .match-day .match {
  6862. padding-bottom: 0;
  6863. line-height: 32px;
  6864. text-align: left;
  6865. }
  6866.  
  6867. .p-contests .results .cc-result .c-rounds .match-link {
  6868. display: inline-block;
  6869. }
  6870.  
  6871. /* Кнопки турнира */
  6872. .b-contest_match .vs .action {
  6873. display: inline-block;
  6874. vertical-align: top;
  6875. min-width: 112px;
  6876. padding: 0;
  6877. margin: .25rem 0;
  6878. background-color: transparent;
  6879. border-radius: 2px;
  6880. font-size: .875rem;
  6881. font-weight: 700;
  6882. text-align: center;
  6883. text-transform: uppercase;
  6884. transition: 0.16s cubic-bezier(0.4, 0, 0.6, 1);
  6885. user-select: none;
  6886. }
  6887.  
  6888. .b-contest_match .vs .action:hover {
  6889. background-color: rgba(58, 61, 80, 0.12);
  6890. }
  6891.  
  6892. .b-contest_match .vs .action:active {
  6893. background-color: rgba(58, 61, 80, 0.24);
  6894. }
  6895.  
  6896. /* Текст внутри кнопки */
  6897. .b-contest_match .vs .actions .action span {
  6898. padding: 0 1rem;
  6899. line-height: 2rem;
  6900. }
  6901.  
  6902. .b-contest_match .vs .actions .action span,
  6903. .b-contest_match .vs .actions .action span:hover,
  6904. .b-contest_match .vs .actions .action span:active {
  6905. color: #3a3d50;
  6906. border: 0;
  6907. -webkit-tap-highlight-color: transparent;
  6908. }
  6909.  
  6910. /* Убираем желтое свечение постеров */
  6911. .b-contest_match .current-match .match-members .match-member > .b-catalog_entry.yellow-fade {
  6912. background: transparent;
  6913. outline-color: transparent;
  6914. }
  6915.  
  6916. .p-contests .b-contest_match .prev-match, .p-contests .b-contest_match .next-match {
  6917. color: #BDBDBD !important;
  6918. }
  6919.  
  6920. .p-contests .b-contest_match .prev-match:hover, .p-contests .b-contest_match .next-match:hover {
  6921. background-color: #424242;
  6922. color: #EEEEEE !important;
  6923. }
  6924.  
  6925. @media (min-width: 481px) {
  6926. .p-contests .b-contest_match .prev-match:hover, .p-contests .b-contest_match .next-match:hover {
  6927. background-color: transparent;
  6928. }
  6929. }
  6930.  
  6931. /* BUG: font-size нужно указать внутри соответствующего элемента */
  6932. @media (min-width: 768px) {
  6933. .b-contest_match .vs {
  6934. font-size: inherit;
  6935. }
  6936. .b-contest_match .vs .label {
  6937. font-family: inherit;
  6938. font-size: 64px;
  6939. }
  6940. }
  6941.  
  6942. /* Мобильная версия */
  6943. @media (max-width: 480px) {
  6944. .p-contests .b-contest_match .prev-match, .p-contests .b-contest_match .next-match {
  6945. position: absolute;
  6946. left: 0;
  6947. width: auto;
  6948. padding: 8px;
  6949. border-radius: 2px;
  6950. line-height: 32px;
  6951. z-index: 2;
  6952. }
  6953. .p-contests .b-contest_match .next-match {
  6954. right: 0;
  6955. left: auto;
  6956. }
  6957. .p-contests .b-contest_match .next-match::before {
  6958. margin: 0;
  6959. }
  6960. .p-contests .b-contest_match .prev-match::before,
  6961. .p-contests .b-contest_match .next-match::before {
  6962. display: block;
  6963. font-family: 'Material Icons';
  6964. font-size: 24px;
  6965. line-height: 1;
  6966. text-transform: none;
  6967. letter-spacing: normal;
  6968. word-wrap: normal;
  6969. white-space: nowrap;
  6970. direction: ltr;
  6971. /* Support for all WebKit browsers. */
  6972. -webkit-font-smoothing: antialiased;
  6973. /* Support for Safari and Chrome. */
  6974. text-rendering: optimizeLegibility;
  6975. /* Support for Firefox. */
  6976. -moz-osx-font-smoothing: grayscale;
  6977. /* Support for IE. */
  6978. font-feature-settings: 'liga';
  6979. }
  6980. .p-contests .b-contest_match .prev-match::before {
  6981. content: 'chevron_left';
  6982. }
  6983. .p-contests .b-contest_match .next-match::before {
  6984. content: 'chevron_right';
  6985. }
  6986. .p-contests .b-contest_match .current-match {
  6987. clear: both;
  6988. padding: 0;
  6989. }
  6990. .p-contests .b-contest_match .current-match .match-members {
  6991. padding-top: 96px;
  6992. margin-bottom: 4px;
  6993. }
  6994. .p-contests .b-contest_match .current-match .match-member {
  6995. position: relative;
  6996. width: 48%;
  6997. z-index: 2;
  6998. }
  6999. .p-contests .b-contest_match .current-match .match-member:first-child {
  7000. float: left;
  7001. }
  7002. .p-contests .b-contest_match .current-match .match-member:last-child {
  7003. float: right;
  7004. }
  7005. .p-contests .b-contest_match .match-losers {
  7006. display: block;
  7007. padding: 0;
  7008. }
  7009. /* Контейнер подсказок и кнопок турнира */
  7010. .p-contests .b-contest_match .vs {
  7011. position: absolute;
  7012. top: 0;
  7013. width: 100%;
  7014. padding: 3rem 0 0;
  7015. margin: 0;
  7016. font-size: inherit;
  7017. }
  7018. /* Блок кнопок турнира */
  7019. .b-contest_match .vs .actions {
  7020. position: absolute;
  7021. top: 0;
  7022. left: 0;
  7023. right: 0;
  7024. font-size: inherit;
  7025. }
  7026. /* Кнопка "К следующей паре" */
  7027. .b-contest_match .vs .action:nth-child(2) {
  7028. display: none;
  7029. }
  7030. /* Подсказка: "Кликните по одному из двух вариантов" */
  7031. /* Подсказка: "Ваш голос учтён!" */
  7032. /* Подсказка: "Вы воздержались в этом голосовании" */
  7033. /* Подсказка: "На сегодня всё! Спасибо за участие!" */
  7034. /* Подсказка: "Голосование ещё не началось" */
  7035. .b-contest_match .vs .invitation,
  7036. .b-contest_match .vs .vote-voted,
  7037. .b-contest_match .vs .vote-abstained,
  7038. .b-contest_match .vs .thanks,
  7039. .b-contest_match .vs .hint {
  7040. font-size: 1rem;
  7041. line-height: 40px;
  7042. margin: 0;
  7043. }
  7044. /* Подсказка: "На сегодня всё! Спасибо за участие!" */
  7045. .b-contest_match .vs .thanks {
  7046. position: absolute;
  7047. top: 0;
  7048. right: 0;
  7049. left: 0;
  7050. }
  7051. .b-contest_match .vs .vote-abstained[style='display: none;'] ~ .thanks {
  7052. display: none !important;
  7053. }
  7054. /* Иконка VS */
  7055. .b-contest_match .vs .label {
  7056. display: inline-block;
  7057. position: absolute;
  7058. top: 192px;
  7059. right: 0;
  7060. left: 0;
  7061. width: 72px;
  7062. height: 72px;
  7063. margin: auto;
  7064. border-radius: 100%;
  7065. font-size: 24px;
  7066. line-height: 72px;
  7067. text-transform: uppercase;
  7068. z-index: 6;
  7069. }
  7070. }
  7071.  
  7072. @media (max-width: 1024px) {
  7073. .p-contests .match-day .match-link .c-column {
  7074. text-overflow: ellipsis;
  7075. white-space: nowrap;
  7076. overflow: hidden;
  7077. }
  7078. .p-contests .match-day .match-link .draw::before,
  7079. .p-contests .match-day .match-link .loser::before,
  7080. .p-contests .match-day .match-link .winner::before {
  7081. display: none;
  7082. }
  7083. .p-contests .match-day .matches-num {
  7084. width: auto;
  7085. padding: 0 4px;
  7086. margin-right: 8px;
  7087. border-radius: 2px;
  7088. color: #FFF;
  7089. font-size: 12px;
  7090. line-height: 20px;
  7091. }
  7092. .p-contests .match-day .draw .matches-num {
  7093. background-color: #4f91e8;
  7094. }
  7095. .p-contests .match-day .loser .matches-num {
  7096. background-color: #ef5350;
  7097. }
  7098. .p-contests .match-day .winner .matches-num {
  7099. background-color: #66bb6a;
  7100. }
  7101. }
  7102.  
  7103. .p-contests .contest-match .vs .refrain,
  7104. .p-contests .contest-match .votes-percents,
  7105. .p-contests .contest-match .vs > div:first-child,
  7106. .p-contests .contest-match .vs .next {
  7107. font-weight: bold;
  7108. }
  7109.  
  7110. /**
  7111. * Dashboard Layout
  7112. * Изменение положения блоков на главной странице
  7113. */
  7114. .p-dashboards-show .cc-second .cc-inner {
  7115. display: none;
  7116. }
  7117.  
  7118. @media (max-width: 767px) and (orientation: landscape) {
  7119. .p-dashboards-show .cc-second > .c-forum {
  7120. width: 100%;
  7121. }
  7122. .p-dashboards-show .cc-second > .c-forum .b-forums,
  7123. .p-dashboards-show .cc-second > .c-forum .contests {
  7124. float: left;
  7125. width: 48%;
  7126. }
  7127. .p-dashboards-show .cc-second > .c-forum .b-forums {
  7128. margin-right: 4%;
  7129. }
  7130. }
  7131.  
  7132. @media (min-width: 768px) {
  7133. .p-dashboards-show .cc-second {
  7134. float: right;
  7135. width: 30.33333%;
  7136. margin-bottom: 0;
  7137. }
  7138. .p-dashboards-show .cc-second > .cc-inner {
  7139. display: block;
  7140. float: none;
  7141. width: 100%;
  7142. margin: 0;
  7143. }
  7144. .p-dashboards-show .cc-second > .cc-inner > .c-content,
  7145. .p-dashboards-show .cc-second > .cc-inner > .c-my_list {
  7146. float: none;
  7147. width: 100%;
  7148. padding: 0;
  7149. }
  7150. .p-dashboards-show .cc-second > .c-forum {
  7151. float: none;
  7152. width: 100%;
  7153. }
  7154. .p-dashboards-show .cc-second > .c-forum > .b-forums,
  7155. .p-dashboards-show .cc-second > .c-forum > .block:last-child {
  7156. margin-bottom: 1.5rem;
  7157. }
  7158. .p-dashboards-show .cc-second .cc-inner {
  7159. display: none;
  7160. }
  7161. }
  7162.  
  7163. @media (max-width: 767px) {
  7164. .p-dashboards-show .cc-second {
  7165. margin-bottom: .5rem;
  7166. }
  7167. }
  7168.  
  7169. /* END of Dashboard Layout */
  7170. /**
  7171. * INDEX
  7172. * Изменения главной страницы.
  7173. */
  7174. .p-dashboards-show .c-my_list {
  7175. padding: 0;
  7176. background: initial;
  7177. border: none;
  7178. }
  7179.  
  7180. .p-dashboards-show .c-my_list .title .switch, .p-dashboards-show .c-my_list .title .link {
  7181. float: right;
  7182. }
  7183.  
  7184. /* Изменение новостей на главной */
  7185. .p-dashboards-show .cc-news {
  7186. /* FIX: исправление стандартного правила */
  7187. }
  7188.  
  7189. .p-dashboards-show .cc-news .c-news_topics .b-topic {
  7190. padding: 1rem 0 1.5rem;
  7191. margin-bottom: 0;
  7192. border-top-width: 1px;
  7193. }
  7194.  
  7195. .p-dashboards-show .cc-news .c-news_topics .b-topic .name-date a {
  7196. padding: 0 0 .25rem;
  7197. font-size: 22px !important;
  7198. font-weight: 400 !important;
  7199. line-height: 1.65;
  7200. white-space: normal;
  7201. }
  7202.  
  7203. .p-dashboards-show .cc-news .c-news_topics .b-topic .b-anime_status_tag {
  7204. display: none;
  7205. }
  7206.  
  7207. .p-dashboards-show .cc-news .c-generated_news .b-topic .name-date a {
  7208. font-size: 16px !important;
  7209. }
  7210.  
  7211. /* Change Forum Button */
  7212. /* NOTE: Цвета настраиваются в общем блоке ЦВЕТА */
  7213. .p-dashboards-show .b-forums > .b-link_button.maxi {
  7214. position: relative;
  7215. margin-bottom: 0;
  7216. background-color: transparent;
  7217. font-size: 0 !important;
  7218. line-height: 0;
  7219. text-align: left;
  7220. text-transform: uppercase;
  7221. overflow: visible;
  7222. }
  7223.  
  7224. .p-dashboards-show .b-forums > .b-link_button.maxi::after {
  7225. content: 'Форум';
  7226. min-width: 0;
  7227. margin-left: -1rem;
  7228. color: #3a3d50 !important;
  7229. }
  7230.  
  7231. .p-dashboards-show .b-forums > .b-link_button.maxi:hover::after, .p-dashboards-show .b-forums > .b-link_button.maxi:focus::after {
  7232. background-color: rgba(58, 61, 80, 0.12);
  7233. }
  7234.  
  7235. .p-dashboards-show .b-forums > .b-link_button.maxi:active::after {
  7236. background-color: rgba(58, 61, 80, 0.24);
  7237. }
  7238.  
  7239. .p-dashboards-show[data-locale='en'] .b-forums > .b-link_button.maxi::after {
  7240. content: 'Forum';
  7241. }
  7242.  
  7243. /* Ссылки на текущие турниры */
  7244. .p-dashboards-show .contests .contest {
  7245. margin: 0 -.5rem;
  7246. }
  7247.  
  7248. .p-dashboards-show .contests .contest:hover {
  7249. background-color: #4a4a4a;
  7250. }
  7251.  
  7252. .p-dashboards-show .contests .contest a {
  7253. display: block;
  7254. padding: 0 .5rem;
  7255. color: #FFFFFF !important;
  7256. font-size: .875rem;
  7257. line-height: 2rem;
  7258. text-overflow: ellipsis;
  7259. white-space: nowrap;
  7260. overflow: hidden;
  7261. }
  7262.  
  7263. .p-dashboards-show .contests .contest a:hover {
  7264. text-decoration: none;
  7265. }
  7266.  
  7267. .block2,
  7268. .contests.block {
  7269. margin-bottom: 1.5rem;
  7270. line-height: 1.5rem;
  7271. }
  7272.  
  7273. .p-dialogs .misc-links {
  7274. position: absolute;
  7275. top: 56px;
  7276. right: 0;
  7277. margin: 0;
  7278. }
  7279.  
  7280. .p-dialogs .misc-links > a {
  7281. position: relative;
  7282. font-size: 0;
  7283. line-height: 0;
  7284. }
  7285.  
  7286. .p-dialogs .misc-links > a::before {
  7287. content: 'low_priority';
  7288. transform: scale(-1, 1);
  7289. }
  7290.  
  7291. .p-dialogs .misc-links > a::after {
  7292. content: 'Непрочитанные начиная со старых';
  7293. }
  7294.  
  7295. .p-dialogs[data-locale='en'] .misc-links > a::after {
  7296. content: 'Unread messages from oldest one';
  7297. }
  7298.  
  7299. .p-messages .mass-actions {
  7300. position: absolute;
  7301. top: 56px;
  7302. right: 0;
  7303. margin: 0;
  7304. }
  7305.  
  7306. .p-messages .mass-actions .action {
  7307. vertical-align: top;
  7308. }
  7309.  
  7310. .p-messages .mass-actions .action + .action {
  7311. margin-left: 8px;
  7312. }
  7313.  
  7314. .p-messages .mass-actions .action::after {
  7315. display: none;
  7316. }
  7317.  
  7318. .p-messages .mass-actions .action a {
  7319. position: relative;
  7320. border: 0;
  7321. font-size: 0;
  7322. line-height: 1;
  7323. }
  7324.  
  7325. .p-messages .mass-actions .action:nth-child(1) > a::before {
  7326. content: 'done_all';
  7327. }
  7328.  
  7329. .p-messages .mass-actions .action:nth-child(1) > a::after {
  7330. content: 'Прочитать всё';
  7331. }
  7332.  
  7333. .p-messages .mass-actions .action:nth-child(2) > a::before {
  7334. content: 'delete_sweep';
  7335. }
  7336.  
  7337. .p-messages .mass-actions .action:nth-child(2) > a::after {
  7338. content: 'Удалить всё';
  7339. }
  7340.  
  7341. .p-messages[data-locale='en'] .mass-actions .action:nth-child(1) > a::after {
  7342. content: 'Mark all messages as read';
  7343. }
  7344.  
  7345. .p-messages[data-locale='en'] .mass-actions .action:nth-child(2) > a::after {
  7346. content: 'Remove all messages';
  7347. }
  7348.  
  7349. .p-oauth_applications-show .b-form.green-form {
  7350. padding: 1em 1em 0;
  7351. background: rgba(102, 187, 106, 0.24);
  7352. border: 1px solid #66bb6a;
  7353. border-radius: 3px;
  7354. color: inherit;
  7355. }
  7356.  
  7357. /**
  7358. * PROFILE
  7359. * ПРОФИЛЬ ПОЛЬЗОВАТЕЛЯ
  7360. */
  7361. .p-profiles-show .profile-content {
  7362. overflow: visible;
  7363. }
  7364.  
  7365. .p-profiles .profile-content .cc-2,
  7366. .p-profiles .profile-content .about,
  7367. .p-profiles .profile-content .cc-2 .c-right .cc-2a {
  7368. margin-bottom: 1rem !important;
  7369. }
  7370.  
  7371. @media screen and (max-width: 767px) {
  7372. .cc-2 > .c-column {
  7373. margin-bottom: 1rem;
  7374. }
  7375. .p-profiles-show .profile-content .activity:last-child {
  7376. margin-bottom: 1.25rem !important;
  7377. }
  7378. }
  7379.  
  7380. .line:nth-child(even) > .bar-container > .bar,
  7381. .line:nth-child(even) > .bar-container > .bar:hover {
  7382. background-color: #303243;
  7383. }
  7384.  
  7385. /* Столбики активности */
  7386. .bar.vertical {
  7387. padding: 0;
  7388. border: none;
  7389. }
  7390.  
  7391. .bar.vertical .line {
  7392. border: none;
  7393. }
  7394.  
  7395. .bar.vertical .line .bar-container .value {
  7396. font-size: .75rem;
  7397. line-height: 1.25rem;
  7398. }
  7399.  
  7400. /* Горизонтальные полосы */
  7401. .bar.horizontal .line {
  7402. padding: 0;
  7403. margin: 0;
  7404. line-height: 1.25em;
  7405. }
  7406.  
  7407. .bar.horizontal .line .bar-container .bar {
  7408. height: 1.25em;
  7409. text-align: right;
  7410. }
  7411.  
  7412. .bar.horizontal .line .bar-container .value {
  7413. float: none;
  7414. display: inline-block;
  7415. vertical-align: top;
  7416. padding-right: .25em;
  7417. color: #FAFAFA;
  7418. font-size: .75em;
  7419. line-height: inherit;
  7420. }
  7421.  
  7422. .bar.horizontal .line .x_label {
  7423. font-size: .75em;
  7424. font-weight: normal;
  7425. line-height: inherit;
  7426. }
  7427.  
  7428. .p-profiles-show .about .item-edit::before {
  7429. content: 'edit';
  7430. }
  7431.  
  7432. /* FIX: update 2017-03-19 */
  7433. .p-profiles .profile-head .c-info .c-lists-info .b-stats_bar::after {
  7434. clear: none;
  7435. }
  7436.  
  7437. /* Выпадающий список аниме/манги в профиле */
  7438. @media (max-width: 599px) {
  7439. .p-profiles .profile-head .c-info .c-lists-info .b-stats_bar {
  7440. position: relative;
  7441. }
  7442. .b-stats_bar .stat_names {
  7443. position: absolute;
  7444. top: 0;
  7445. min-width: 165px;
  7446. border-radius: .125rem;
  7447. }
  7448. .b-stats_bar .stat_names:hover {
  7449. padding: 3rem 0 .5rem;
  7450. background-color: #5e5f6c;
  7451. z-index: 10;
  7452. }
  7453. .b-stats_bar .stat_names::after {
  7454. content: '';
  7455. position: absolute;
  7456. top: 0;
  7457. right: 0;
  7458. bottom: 0;
  7459. left: 0;
  7460. box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.32);
  7461. z-index: -1;
  7462. }
  7463. .b-stats_bar .stat_names::before {
  7464. content: 'arrow_drop_down';
  7465. display: block;
  7466. position: absolute;
  7467. top: 0;
  7468. right: 0;
  7469. width: 2rem;
  7470. height: 2rem;
  7471. padding: .25rem;
  7472. margin: .5rem .25rem;
  7473. border-radius: 100%;
  7474. font-size: 1.5rem;
  7475. font-family: 'Material Icons';
  7476. line-height: 1;
  7477. box-sizing: border-box;
  7478. pointer-events: auto;
  7479. text-transform: none;
  7480. letter-spacing: normal;
  7481. word-wrap: normal;
  7482. white-space: nowrap;
  7483. direction: ltr;
  7484. -webkit-font-smoothing: antialiased;
  7485. text-rendering: optimizeLegibility;
  7486. -moz-osx-font-smoothing: grayscale;
  7487. font-feature-settings: 'liga';
  7488. }
  7489. .b-stats_bar .stat_names:hover .stat_name {
  7490. display: block;
  7491. }
  7492. .b-stats_bar .stat_names .stat_name {
  7493. display: none;
  7494. padding: 0 1rem;
  7495. }
  7496. .b-stats_bar .stat_names .stat_name a {
  7497. display: block;
  7498. padding: 0 1rem;
  7499. margin: 0 -1rem;
  7500. }
  7501. .b-stats_bar .stat_names .stat_name a:hover {
  7502. background-color: rgba(0, 0, 0, 0.24);
  7503. text-decoration: none;
  7504. }
  7505. }
  7506.  
  7507. .p-profiles .profile-head .c-brief header h1 {
  7508. vertical-align: top;
  7509. font-size: 1.5em;
  7510. line-height: 1;
  7511. }
  7512.  
  7513. .p-profiles .profile-head .c-brief header h1.aliases {
  7514. cursor: help;
  7515. }
  7516.  
  7517. .p-profiles .profile-head .c-brief header h1.aliases::before {
  7518. content: 'label';
  7519. display: inline-block;
  7520. vertical-align: top;
  7521. float: right;
  7522. margin-left: .5rem;
  7523. opacity: .5;
  7524. }
  7525.  
  7526. .p-profiles .profile-head .c-brief header h1.aliases::after {
  7527. display: none;
  7528. }
  7529.  
  7530. .p-profiles .profile-head .c-brief header .misc {
  7531. vertical-align: top;
  7532. padding: .5rem 1rem;
  7533. margin: 0;
  7534. font-size: .875rem;
  7535. line-height: 1.5rem;
  7536. }
  7537.  
  7538. .p-profiles .profile-head .c-brief header .notice {
  7539. font-size: .75em;
  7540. line-height: 1.25rem;
  7541. }
  7542.  
  7543. @media (min-width: 768px) {
  7544. .p-profiles .profile-head .c-brief .avatar {
  7545. margin: .5rem 2rem 3rem 1rem;
  7546. }
  7547. }
  7548.  
  7549. .p-profiles .profile-head .c-brief .avatar .profile-actions {
  7550. margin-top: 1rem;
  7551. margin-right: -.75rem;
  7552. margin-left: -.75rem;
  7553. }
  7554.  
  7555. .p-profiles .profile-head .c-brief .avatar img {
  7556. display: block;
  7557. margin: auto;
  7558. }
  7559.  
  7560. @media (min-width: 768px) {
  7561. .p-profiles .profile-head .c-brief .avatar img {
  7562. width: 160px;
  7563. height: 160px;
  7564. }
  7565. }
  7566.  
  7567. .p-profiles .profile-head .c-info .c-lists-info .b-stats_bar {
  7568. overflow: visible;
  7569. margin-bottom: 0;
  7570. }
  7571.  
  7572. .p-profiles .profile-head .c-info .c-lists-info .b-stats_bar::after {
  7573. clear: none;
  7574. }
  7575.  
  7576. .p-profiles .profile-head .c-info .c-additionals {
  7577. margin-top: 8px;
  7578. margin-bottom: 8px;
  7579. }
  7580.  
  7581. .p-profiles .profile-head .c-info .c-additionals b {
  7582. padding-right: 8px;
  7583. font-size: 0;
  7584. }
  7585.  
  7586. .p-profiles .profile-head .c-info .c-additionals b::after {
  7587. content: 'Активность на сайте:';
  7588. font-size: 14px;
  7589. }
  7590.  
  7591. .p-profiles[data-locale='en'] .profile-head .c-info .c-additionals b::after {
  7592. content: 'Activity:';
  7593. }
  7594.  
  7595. /* USER PROFILE |> HISTORY ENTRY */
  7596. .p-profiles .profile-head .c-history .entry {
  7597. position: relative;
  7598. padding: .5rem 0;
  7599. margin: 0;
  7600. border: 0;
  7601. overflow: initial;
  7602. }
  7603.  
  7604. .p-profiles .profile-head .c-history .entry,
  7605. .p-profiles .profile-head .c-history .entry:first-child {
  7606. padding-top: .5rem;
  7607. margin-top: 0;
  7608. }
  7609.  
  7610. .p-profiles .profile-head .c-history .entry::before {
  7611. content: '';
  7612. display: block;
  7613. position: absolute;
  7614. right: -.5rem;
  7615. bottom: 0;
  7616. left: 3.5rem;
  7617. height: 1px;
  7618. pointer-events: none;
  7619. }
  7620.  
  7621. .p-profiles .profile-head .c-history .entry:last-child::before {
  7622. display: none;
  7623. }
  7624.  
  7625. /* Полноразмерная ссылка .entry, работает только для .c-history & .l-menu */
  7626. .p-profiles .profile-head .c-history .entry a {
  7627. display: block;
  7628. padding: .5rem .5rem;
  7629. margin: -.5rem;
  7630. }
  7631.  
  7632. @media (min-width: 960px) {
  7633. .p-profiles .profile-head .c-history .entry a {
  7634. padding: .75rem .5rem;
  7635. }
  7636. }
  7637.  
  7638. .p-profiles .profile-head .c-history .entry a::after {
  7639. content: '';
  7640. clear: both;
  7641. display: block;
  7642. }
  7643.  
  7644. .p-profiles .profile-head .c-history .entry:hover .title {
  7645. text-decoration: none;
  7646. }
  7647.  
  7648. /* END of FULLENTRY LINK */
  7649. .p-profiles .profile-head .c-history .entry img {
  7650. margin: 0 16px 0 0;
  7651. max-height: 72px;
  7652. max-width: 40px;
  7653. border-radius: 2px;
  7654. }
  7655.  
  7656. .p-profiles .profile-head .c-history .entry .misc {
  7657. font-size: .75em;
  7658. }
  7659.  
  7660. .p-profiles-show .b-stats_bar.anime a.title {
  7661. margin-left: -1rem;
  7662. }
  7663.  
  7664. .p-profiles-show .b-stats_bar.anime .bar {
  7665. color: #FAFAFA;
  7666. }
  7667.  
  7668. .p-profiles-show .b-stats_bar.anime .bar .first {
  7669. background: #3a3d50;
  7670. }
  7671.  
  7672. .p-profiles-show .b-stats_bar.anime .bar .second {
  7673. background: #303243;
  7674. }
  7675.  
  7676. .p-profiles-show .b-stats_bar.manga a.title {
  7677. margin-left: -1rem;
  7678. color: #454d5f;
  7679. }
  7680.  
  7681. .p-profiles-show .b-stats_bar.manga a.title:hover, .p-profiles-show .b-stats_bar.manga a.title:focus {
  7682. background: rgba(69, 77, 95, 0.12);
  7683. color: #454d5f;
  7684. }
  7685.  
  7686. .p-profiles-show .b-stats_bar.manga a.title:active {
  7687. background: rgba(69, 77, 95, 0.24);
  7688. color: #454d5f;
  7689. }
  7690.  
  7691. .p-profiles-show .b-stats_bar.manga .bar {
  7692. color: #FAFAFA;
  7693. }
  7694.  
  7695. .p-profiles-show .b-stats_bar.manga .bar .first {
  7696. background: #454d5f;
  7697. }
  7698.  
  7699. .p-profiles-show .b-stats_bar.manga .bar .second {
  7700. background: #383e4d;
  7701. }
  7702.  
  7703. .p-profiles-show .b-stats_bar.lifetime .title {
  7704. display: block;
  7705. width: auto;
  7706. }
  7707.  
  7708. .p-profiles-show .b-stats_bar.lifetime .bar {
  7709. height: .5rem;
  7710. }
  7711.  
  7712. .p-profiles-show .b-stats_bar.lifetime .bar .first {
  7713. background: #3a3d50;
  7714. }
  7715.  
  7716. .p-profiles-show .b-stats_bar.lifetime .cuts .cut {
  7717. width: 0;
  7718. height: 0;
  7719. margin: 0 -.25rem;
  7720. background: transparent;
  7721. border: .25rem solid transparent;
  7722. border-bottom-color: #181720;
  7723. z-index: 1;
  7724. }
  7725.  
  7726. .p-profiles-show .b-stats_bar.lifetime .times {
  7727. line-height: 0;
  7728. }
  7729.  
  7730. .p-profiles-show .b-stats_bar.lifetime .times .time {
  7731. color: #9E9E9E;
  7732. font-size: .625rem;
  7733. line-height: 1.25rem;
  7734. text-transform: uppercase;
  7735. }
  7736.  
  7737. .p-profiles-show .b-stats_bar.lifetime .times .time.checked {
  7738. color: #3a3d50;
  7739. font-weight: bold;
  7740. }
  7741.  
  7742. .p-profiles-show .b-stats_bar.lifetime .times .time.checked::before {
  7743. display: none;
  7744. color: #3a3d50;
  7745. opacity: .72;
  7746. }
  7747.  
  7748. /* Иконки совместимости для профиля */
  7749. .p-profiles .profile-head .c-info .c-lists-info .b-stats_bar {
  7750. position: relative;
  7751. overflow: visible;
  7752. }
  7753.  
  7754. .p-profiles .profile-head .c-info .c-lists-info .b-stats_bar .compatibility a {
  7755. font-size: 0;
  7756. }
  7757.  
  7758. .p-profiles .profile-head .c-info .c-lists-info .b-stats_bar .compatibility a:hover {
  7759. text-decoration: none;
  7760. }
  7761.  
  7762. .b-stats_bar .compatibility a[href$='=similar'] {
  7763. position: relative;
  7764. font-size: 0;
  7765. line-height: 0;
  7766. margin: 4px 0 !important;
  7767. }
  7768.  
  7769. .b-stats_bar .compatibility a[href$='=similar']::before {
  7770. content: 'compare_arrows';
  7771. }
  7772.  
  7773. .b-stats_bar .compatibility a[href$='=similar']::after {
  7774. content: 'Найти похожих пользователей';
  7775. }
  7776.  
  7777. [data-locale='en'] .b-stats_bar .compatibility a[href$='=similar']::after {
  7778. content: 'Find similar users';
  7779. }
  7780.  
  7781. .b-stats_bar .compatibility a[href^='/comparer']::before {
  7782. display: none;
  7783. }
  7784.  
  7785. .b-stats_bar .compatibility .text:first-child {
  7786. position: relative;
  7787. font-size: 0;
  7788. line-height: 0;
  7789. margin: 4px 0 !important;
  7790. }
  7791.  
  7792. .b-stats_bar .compatibility .text:first-child::before {
  7793. content: 'people';
  7794. }
  7795.  
  7796. .b-stats_bar .compatibility .text:first-child.zero::before {
  7797. content: 'people_outline';
  7798. }
  7799.  
  7800. .b-stats_bar .compatibility .text:first-child.zero::after {
  7801. content: 'Нет совместимости';
  7802. }
  7803.  
  7804. [data-locale='en'] .b-stats_bar .compatibility .text:first-child.zero::after {
  7805. content: 'No compatibility';
  7806. }
  7807.  
  7808. .b-stats_bar .compatibility .text:first-child.weak {
  7809. background-color: #F9FBE7;
  7810. color: #CDDC39 !important;
  7811. }
  7812.  
  7813. .b-stats_bar .compatibility .text:first-child.weak:hover {
  7814. background-color: #F0F4C3;
  7815. color: #C0CA33 !important;
  7816. }
  7817.  
  7818. .b-stats_bar .compatibility .text:first-child.weak::after {
  7819. content: 'Низкая совместимость';
  7820. }
  7821.  
  7822. [data-locale='en'] .b-stats_bar .compatibility .text:first-child.weak::after {
  7823. content: 'Low compatibility';
  7824. }
  7825.  
  7826. .b-stats_bar .compatibility .text:first-child.moderate {
  7827. background-color: #F1F8E9;
  7828. color: #8BC34A !important;
  7829. }
  7830.  
  7831. .b-stats_bar .compatibility .text:first-child.moderate:hover {
  7832. background-color: #DCEDC8;
  7833. color: #7CB342 !important;
  7834. }
  7835.  
  7836. .b-stats_bar .compatibility .text:first-child.moderate::after {
  7837. content: 'Средняя совместимость';
  7838. }
  7839.  
  7840. [data-locale='en'] .b-stats_bar .compatibility .text:first-child.moderate::after {
  7841. content: 'Medium compatibility';
  7842. }
  7843.  
  7844. .b-stats_bar .compatibility .text:first-child.high {
  7845. background-color: #E8F5E9;
  7846. color: #4CAF50 !important;
  7847. }
  7848.  
  7849. .b-stats_bar .compatibility .text:first-child.high:hover {
  7850. background-color: #C8E6C9;
  7851. color: #43A047 !important;
  7852. }
  7853.  
  7854. .b-stats_bar .compatibility .text:first-child.high::after {
  7855. content: 'Высокая совместимость';
  7856. }
  7857.  
  7858. [data-locale='en'] .b-stats_bar .compatibility .text:first-child.high::after {
  7859. content: 'High compatibility';
  7860. }
  7861.  
  7862. .b-stats_bar .compatibility .text:first-child.full {
  7863. background-color: #E1F5FE;
  7864. color: #03A9F4 !important;
  7865. }
  7866.  
  7867. .b-stats_bar .compatibility .text:first-child.full:hover {
  7868. background-color: #B3E5FC;
  7869. color: #039BE5 !important;
  7870. }
  7871.  
  7872. .b-stats_bar .compatibility .text:first-child.full::after {
  7873. content: 'Полная совместимость';
  7874. }
  7875.  
  7876. [data-locale='en'] .b-stats_bar .compatibility .text:first-child.full::after {
  7877. content: 'Full compatibility';
  7878. }
  7879.  
  7880. .b-stats_bar .compatibility .link-replacement {
  7881. cursor: help;
  7882. }
  7883.  
  7884. .b-stats_bar .compatibility .link-replacement .text:first-child,
  7885. .b-stats_bar .compatibility .link-replacement:hover .text:first-child {
  7886. background-color: transparent !important;
  7887. }
  7888.  
  7889. .b-stats_bar .compatibility .text + .text {
  7890. display: none;
  7891. }
  7892.  
  7893. .b-stats_bar .compatibility .rate {
  7894. position: absolute;
  7895. top: -.125rem;
  7896. right: -.5rem;
  7897. padding: 0 .25rem;
  7898. background-color: #454d5f;
  7899. border-radius: 2px;
  7900. color: #FAFAFA;
  7901. font-size: .75rem;
  7902. line-height: 1rem;
  7903. }
  7904.  
  7905. .b-stats_bar .compatibility .rate::before, .b-stats_bar .compatibility .rate::after {
  7906. display: none;
  7907. }
  7908.  
  7909. .p-dialogs .l-page > div > header.head,
  7910. .p-messages .l-page > div > header.head,
  7911. .p-profiles-edit .l-page > div > header.head {
  7912. margin-bottom: 0;
  7913. }
  7914.  
  7915. .p-dialogs header.head,
  7916. .p-messages header.head,
  7917. .p-profiles-edit header.head {
  7918. padding: 16px 16px 8px;
  7919. margin: -16px -16px 0;
  7920. background-color: #5f6170;
  7921. }
  7922.  
  7923. @media (min-width: 481px) {
  7924. .p-dialogs header.head,
  7925. .p-messages header.head,
  7926. .p-profiles-edit header.head {
  7927. padding: 0;
  7928. margin: 0;
  7929. background-color: transparent;
  7930. }
  7931. }
  7932.  
  7933. .p-dialogs .b-options-floated,
  7934. .p-messages .b-options-floated,
  7935. .p-profiles-edit .b-options-floated {
  7936. position: static;
  7937. padding: 0;
  7938. margin: 0 -16px 8px;
  7939. background-color: #5f6170;
  7940. text-align: left;
  7941. white-space: nowrap;
  7942. overflow: hidden;
  7943. overflow-x: auto;
  7944. }
  7945.  
  7946. @media (min-width: 481px) {
  7947. .p-dialogs .b-options-floated,
  7948. .p-messages .b-options-floated,
  7949. .p-profiles-edit .b-options-floated {
  7950. position: initial;
  7951. padding: 0;
  7952. margin: 0 -16px 8px;
  7953. background-color: transparent;
  7954. text-align: right;
  7955. }
  7956. }
  7957.  
  7958. .p-dialogs .b-options-floated > a,
  7959. .p-messages .b-options-floated > a,
  7960. .p-profiles-edit .b-options-floated > a {
  7961. display: inline-block;
  7962. width: auto;
  7963. min-width: 88px;
  7964. height: 48px;
  7965. padding: 0 12px;
  7966. color: #EEEEEE;
  7967. font-size: 14px;
  7968. font-weight: 700;
  7969. line-height: 48px;
  7970. text-align: center;
  7971. text-transform: uppercase;
  7972. }
  7973.  
  7974. .p-dialogs .b-options-floated > a:hover,
  7975. .p-messages .b-options-floated > a:hover,
  7976. .p-profiles-edit .b-options-floated > a:hover {
  7977. text-decoration: none;
  7978. }
  7979.  
  7980. .p-dialogs .b-options-floated > a::after,
  7981. .p-messages .b-options-floated > a::after,
  7982. .p-profiles-edit .b-options-floated > a::after {
  7983. display: none;
  7984. }
  7985.  
  7986. .p-dialogs .b-options-floated > a.selected,
  7987. .p-messages .b-options-floated > a.selected,
  7988. .p-profiles-edit .b-options-floated > a.selected {
  7989. border-bottom: 2px solid #454d5f;
  7990. color: #FFFFFF !important;
  7991. }
  7992.  
  7993. /* Страница редактирования аккаунта */
  7994. .p-profiles-edit .account .c-column .block:not(:last-child) {
  7995. margin-bottom: 3rem;
  7996. }
  7997.  
  7998. .p-profiles-edit .account .change-password {
  7999. max-width: 375px;
  8000. margin-top: .25em;
  8001. margin-bottom: 2em;
  8002. }
  8003.  
  8004. .p-profiles-edit .account .change-password::after {
  8005. content: '';
  8006. clear: both;
  8007. display: block;
  8008. }
  8009.  
  8010. .p-profiles-edit .account .change-password a {
  8011. float: right;
  8012. font-size: 0;
  8013. }
  8014.  
  8015. .p-profiles-edit .account .change-password a:hover {
  8016. text-decoration: none;
  8017. }
  8018.  
  8019. .p-profiles-edit .account .change-password a::after {
  8020. content: 'Изменить';
  8021. vertical-align: top;
  8022. font-size: .875rem;
  8023. }
  8024.  
  8025. .p-profiles-edit[data-locale=en] .account .change-password a::after {
  8026. content: 'Change';
  8027. }
  8028.  
  8029. .p-profiles-edit .edit_user_preferences .about-options {
  8030. position: absolute;
  8031. right: 0;
  8032. margin: .75rem 0;
  8033. background: transparent !important;
  8034. text-align: right;
  8035. z-index: 1;
  8036. }
  8037.  
  8038. .p-profiles-edit .edit_user_preferences .about-options .b-input label {
  8039. line-height: 1.5rem;
  8040. }
  8041.  
  8042. /* MENU ENTRY REVIEW & CLUBS */
  8043. .p-topics header h1 a.reload {
  8044. color: #EEEEEE !important;
  8045. }
  8046.  
  8047. .p-topics header h1 a.reload:hover::after {
  8048. position: static;
  8049. }
  8050.  
  8051. .p-topics .l-menu .b-forums {
  8052. margin-bottom: 1.5rem;
  8053. line-height: 1.5rem;
  8054. }
  8055.  
  8056. .p-topics .l-menu .calendar .entry, .p-topics .l-menu .clubs .entry, .p-topics .l-menu .reviews .entry {
  8057. position: relative;
  8058. padding: 8px 0;
  8059. margin: 0;
  8060. border: 0;
  8061. overflow: initial;
  8062. }
  8063.  
  8064. .p-topics .l-menu .calendar .entry:first-child, .p-topics .l-menu .clubs .entry:first-child, .p-topics .l-menu .reviews .entry:first-child {
  8065. padding-top: 8px;
  8066. margin-top: 0;
  8067. }
  8068.  
  8069. .p-topics .l-menu .calendar .entry::before, .p-topics .l-menu .clubs .entry::before, .p-topics .l-menu .reviews .entry::before {
  8070. content: '';
  8071. position: absolute;
  8072. right: -8px;
  8073. bottom: 0;
  8074. left: 56px;
  8075. height: 1px;
  8076. background-color: #4f4f4f;
  8077. pointer-events: none;
  8078. }
  8079.  
  8080. .p-topics .l-menu .calendar .entry:last-child::before, .p-topics .l-menu .clubs .entry:last-child::before, .p-topics .l-menu .reviews .entry:last-child::before {
  8081. display: none;
  8082. }
  8083.  
  8084. .p-topics .l-menu .calendar .entry a, .p-topics .l-menu .clubs .entry a, .p-topics .l-menu .reviews .entry a {
  8085. display: block;
  8086. padding: 8px;
  8087. margin: -8px;
  8088. color: #FFFFFF;
  8089. }
  8090.  
  8091. .p-topics .l-menu .calendar .entry a::after, .p-topics .l-menu .clubs .entry a::after, .p-topics .l-menu .reviews .entry a::after {
  8092. content: '';
  8093. clear: both;
  8094. display: block;
  8095. }
  8096.  
  8097. .p-topics .l-menu .calendar .entry:hover a, .p-topics .l-menu .clubs .entry:hover a, .p-topics .l-menu .reviews .entry:hover a {
  8098. background-color: #4a4a4a;
  8099. color: #FFFFFF;
  8100. }
  8101.  
  8102. .p-topics .l-menu .calendar .entry:hover .title, .p-topics .l-menu .clubs .entry:hover .title, .p-topics .l-menu .reviews .entry:hover .title {
  8103. text-decoration: none;
  8104. }
  8105.  
  8106. .p-topics .l-menu .calendar .entry .misc, .p-topics .l-menu .clubs .entry .misc, .p-topics .l-menu .reviews .entry .misc {
  8107. color: #BDBDBD !important;
  8108. }
  8109.  
  8110. .p-topics .l-menu .calendar .entry .misc.date, .p-topics .l-menu .clubs .entry .misc.date, .p-topics .l-menu .reviews .entry .misc.date {
  8111. color: #9E9E9E !important;
  8112. }
  8113.  
  8114. .p-topics .l-menu .clubs .entry img {
  8115. width: 40px;
  8116. min-width: 40px;
  8117. height: 40px;
  8118. margin: 2px 16px 2px 0;
  8119. border-radius: 2px;
  8120. }
  8121.  
  8122. .p-topics .l-menu .reviews .entry img {
  8123. min-width: 40px;
  8124. max-height: 64px;
  8125. margin: 2px 16px 2px 0;
  8126. border-radius: 2px;
  8127. }
  8128.  
  8129. .p-topics .l-menu .sticky-topics .topic,
  8130. .p-topics .l-menu .contests .contest {
  8131. padding: 8px;
  8132. margin: 0 -8px;
  8133. border: 0;
  8134. }
  8135.  
  8136. .p-topics .l-menu .sticky-topics .topic:first-child,
  8137. .p-topics .l-menu .contests .contest:first-child {
  8138. padding-top: 8px;
  8139. margin-top: 0;
  8140. }
  8141.  
  8142. .p-topics .l-menu .sticky-topics .topic:hover,
  8143. .p-topics .l-menu .contests .contest:hover {
  8144. background-color: #4a4a4a;
  8145. }
  8146.  
  8147. .p-topics .l-menu .sticky-topics .topic .title,
  8148. .p-topics .l-menu .contests .contest .title {
  8149. color: #FFFFFF;
  8150. line-height: 20px;
  8151. }
  8152.  
  8153. .p-topics .l-menu .sticky-topics .topic .title::after,
  8154. .p-topics .l-menu .contests .contest .title::after {
  8155. display: none;
  8156. }
  8157.  
  8158. .p-topics .l-menu .sticky-topics .topic:hover .title,
  8159. .p-topics .l-menu .contests .contest:hover .title {
  8160. color: #FFFFFF;
  8161. text-decoration: none;
  8162. }
  8163.  
  8164. .p-topics .l-menu .sticky-topics .topic:active .title,
  8165. .p-topics .l-menu .contests .contest:active .title {
  8166. color: #FFFFFF;
  8167. }
  8168.  
  8169. .p-topics .l-menu .sticky-topics .topic .notice,
  8170. .p-topics .l-menu .contests .contest .notice {
  8171. margin-top: 2px;
  8172. color: #BDBDBD;
  8173. line-height: 18px;
  8174. }
  8175.  
  8176. /* Страница истории пользователя */
  8177. .p-user_history-index .history-page .mischeadline {
  8178. margin-bottom: 0;
  8179. }
  8180.  
  8181. .p-user_history-index .history-page .history-interval {
  8182. margin-bottom: .5rem;
  8183. }
  8184.  
  8185. .p-user_history-index .history-page .history-interval p {
  8186. margin-bottom: 0;
  8187. line-height: 1.5rem;
  8188. }
  8189.  
  8190. .p-user_history-index .history-page .history-interval p:hover {
  8191. background-color: #4a4a4a;
  8192. }
  8193.  
  8194. .p-user_history-index .history-page .history-interval p a {
  8195. color: #57576a;
  8196. }
  8197.  
  8198. .p-user_history-index .history-page .history-interval p a:hover {
  8199. color: #8a8eac;
  8200. }
  8201.  
  8202. .p-user_history-index .history-page .history-interval p a:active {
  8203. color: #b7b8cc;
  8204. }
  8205.  
  8206. .p-user_history-index .history-page .history-interval p .date {
  8207. color: #BDBDBD;
  8208. }
  8209.  
  8210. /* Пользовательские списки */
  8211. .p-user_rates-index .l-content .b-options-floated span::before, .p-user_rates-index .l-content .b-options-floated span::after {
  8212. color: #9E9E9E;
  8213. }
  8214.  
  8215. .p-user_rates-index .l-content .order-control {
  8216. color: #FFFFFF;
  8217. }
  8218.  
  8219. .p-user_rates-index .l-content .order-control:hover {
  8220. background-color: #4a4a4a;
  8221. color: #FFFFFF;
  8222. }
  8223.  
  8224. .p-user_rates-index .l-content .order-control:active {
  8225. color: #b7b8cc;
  8226. }
  8227.  
  8228. .p-user_rates-index .stat-categories .category {
  8229. height: 20px;
  8230. color: #57576a;
  8231. }
  8232.  
  8233. .p-user_rates-index .stat-categories .category:hover, .p-user_rates-index .stat-categories .category.active {
  8234. color: #8a8eac;
  8235. }
  8236.  
  8237. .p-user_rates-index .stat-categories .category:active, .p-user_rates-index .stat-categories .category.active:hover {
  8238. color: #b7b8cc;
  8239. }
  8240.  
  8241. .p-user_rates-index .list-lines thead tr {
  8242. font-size: 13px;
  8243. line-height: 2rem;
  8244. }
  8245.  
  8246. .p-user_rates-index .list-lines .selectable:hover {
  8247. background-color: #4a4a4a;
  8248. }
  8249.  
  8250. .p-user_rates-index .list-lines tr td .anime-remove:hover, .p-user_rates-index .list-lines tr td .anime-remove.selected {
  8251. color: #8a8eac;
  8252. }
  8253.  
  8254. .p-user_rates-index .list-lines tr td .anime-remove:active {
  8255. color: #b7b8cc;
  8256. }
  8257.  
  8258. .p-user_rates-index .list-lines tr td .anime-status:hover {
  8259. color: #8a8eac;
  8260. }
  8261.  
  8262. .p-user_rates-index .list-lines tr td .anime-status:active {
  8263. color: #b7b8cc;
  8264. }
  8265.  
  8266. .p-user_rates-index .list-lines tr td .rate-text {
  8267. color: #EEEEEE;
  8268. font-size: .875rem;
  8269. line-height: 1.25rem;
  8270. }
  8271.  
  8272. .p-user_rates-index .list-lines tr td .episodes_total {
  8273. color: #EEEEEE;
  8274. }
  8275.  
  8276. .p-user_rates-index .list-lines tr td .new-value input {
  8277. height: 1.5rem;
  8278. background: #363643;
  8279. border-color: #4f4f4f;
  8280. border-radius: 2px;
  8281. color: #FFFFFF !important;
  8282. font-size: 1rem;
  8283. line-height: 1.5rem;
  8284. }
  8285.  
  8286. .p-user_rates-index .list-lines tr.edit-form form {
  8287. padding: 1rem;
  8288. margin: .5rem 0;
  8289. background: #4a4a4a;
  8290. border: 1px solid #4f4f4f;
  8291. border-radius: 2px;
  8292. }
  8293.  
  8294. .p-user_rates-index .list-lines tr.edit-form .b-input {
  8295. vertical-align: top;
  8296. }
  8297.  
  8298. .p-user_rates-index .list-lines tr.edit-form .b-input.integer input {
  8299. width: 7rem;
  8300. }
  8301.  
  8302. .p-user_rates-index .list-lines tr.edit-form .b-input.text textarea {
  8303. font-size: .875rem;
  8304. resize: vertical;
  8305. }
  8306.  
  8307. .p-user_rates-index .list-lines tr.edit-form .buttons {
  8308. margin-top: 0;
  8309. }
  8310.  
  8311. .p-user_rates-index .list-lines tr.edit-form .remove {
  8312. border: 0;
  8313. font-size: 0;
  8314. }
  8315.  
  8316. .p-user_rates-index .list-lines tr.edit-form .remove::before {
  8317. content: 'delete';
  8318. }
  8319.  
  8320. .p-user_rates-index .list-lines tr .index {
  8321. width: 2em;
  8322. padding-right: .5em;
  8323. color: #BDBDBD;
  8324. }
  8325.  
  8326. .p-user_rates-index .list-lines tr .name a {
  8327. color: #57576a;
  8328. }
  8329.  
  8330. .p-user_rates-index .list-lines tr .name a:hover {
  8331. color: #8a8eac;
  8332. }
  8333.  
  8334. .p-user_rates-index .list-lines tr .name a:active {
  8335. color: #b7b8cc;
  8336. }
  8337.  
  8338. .p-user_rates-index .list-posters .user_rate .b-catalog_entry::after {
  8339. content: '';
  8340. position: absolute;
  8341. top: 0;
  8342. right: 0;
  8343. bottom: 0;
  8344. left: 0;
  8345. background-image: linear-gradient(rgba(0, 0, 0, 0.6) 0%, transparent 40%);
  8346. border-radius: .125rem;
  8347. opacity: 0;
  8348. pointer-events: none;
  8349. }
  8350.  
  8351. .p-user_rates-index .list-posters .user_rate:hover .b-catalog_entry::after {
  8352. opacity: 1;
  8353. }
  8354.  
  8355. .p-user_rates-index .list-posters .user_rate.b-ajax::after {
  8356. margin-top: -1.5rem;
  8357. }
  8358.  
  8359. .p-user_rates-index .list-posters .user_rate .edit-user_rate {
  8360. background-color: transparent;
  8361. color: #fff !important;
  8362. }
  8363.  
  8364. .p-user_rates-index .list-posters .user_rate .edit-user_rate:last-child {
  8365. margin-right: .25rem !important;
  8366. }
  8367.  
  8368. .p-user_rates-index .list-posters .user_rate .edit-user_rate:hover {
  8369. background-color: #3a3d50;
  8370. color: #FAFAFA !important;
  8371. }
  8372.  
  8373. .p-user_rates-index .list-posters .user_rate .edit-user_rate::before {
  8374. content: 'edit';
  8375. position: static;
  8376. height: auto;
  8377. background: transparent;
  8378. }
  8379.  
  8380. @media (min-width: 768px) {
  8381. .p-user_rates-index .list-posters .user_rate .edit-user_rate {
  8382. display: none;
  8383. }
  8384. }
  8385.  
  8386. .p-user_rates-index .list-posters .user_rate > .text {
  8387. padding: .5rem;
  8388. background: rgba(0, 0, 0, 0.8);
  8389. border-radius: 0 0 2px 2px;
  8390. }
  8391.  
  8392. .p-user_rates-index .list-posters .user_rate > .text::before {
  8393. display: none;
  8394. }
  8395.  
  8396. .p-user_rates-index .list-groups .summary.posters {
  8397. padding: .5em 1em;
  8398. background: #363643;
  8399. border-color: #4f4f4f;
  8400. border-radius: 2px;
  8401. }
  8402.  
  8403. .p-user_rates-index .list-groups .summary.lines {
  8404. font: inherit;
  8405. font-size: .875em;
  8406. color: inherit;
  8407. }
  8408.  
  8409. .p-user_rates-index .list-groups .summary .stat-value::after {
  8410. padding: 0 3px;
  8411. color: #9E9E9E;
  8412. }
  8413.  
  8414. /* Страница сравнения списков */
  8415. .p-userlist_comparer .comparer table .selectable:hover {
  8416. background-color: #5f6170;
  8417. }
  8418.  
  8419. .p-userlist_comparer .comparer table a {
  8420. color: inherit;
  8421. }
  8422.  
  8423. .p-userlist_comparer .comparer table .name a {
  8424. color: #57576a;
  8425. }
  8426.  
  8427. .p-userlist_comparer .comparer table .name a:hover {
  8428. color: #8a8eac;
  8429. }
  8430.  
  8431. .p-userlist_comparer .comparer table .name a:active {
  8432. color: #b7b8cc;
  8433. }
  8434.  
  8435. .p-userlist_comparer .notice span {
  8436. padding: 1.5px 4px !important;
  8437. border-radius: 2px;
  8438. }
  8439.  
  8440. .p-userlist_comparer .notice span:nth-child(6) {
  8441. background: rgba(244, 67, 54, 0.5) !important;
  8442. }
  8443.  
  8444. .p-userlist_comparer .notice span:nth-child(4) {
  8445. background: rgba(255, 138, 128, 0.5) !important;
  8446. }
  8447.  
  8448. .p-userlist_comparer .notice span:nth-child(3) {
  8449. background: rgba(185, 246, 202, 0.5) !important;
  8450. }
  8451.  
  8452. .p-userlist_comparer .notice span:nth-child(5) {
  8453. background: rgba(76, 175, 80, 0.5) !important;
  8454. }
  8455.  
  8456. .p-userlist_comparer .comparer table .abslt-difr,
  8457. .p-userlist_comparer .legend .abslt-difr {
  8458. background: rgba(244, 67, 54, 0.5) !important;
  8459. }
  8460.  
  8461. .p-userlist_comparer .comparer table .slightly-difr,
  8462. .p-userlist_comparer .legend .slightly-difr {
  8463. background: rgba(255, 138, 128, 0.5) !important;
  8464. }
  8465.  
  8466. .p-userlist_comparer .comparer table .almost-same,
  8467. .p-userlist_comparer .legend .almost-same {
  8468. background: rgba(185, 246, 202, 0.5) !important;
  8469. }
  8470.  
  8471. .p-userlist_comparer .comparer table .exact-same,
  8472. .p-userlist_comparer .legend .exact-same {
  8473. background: rgba(76, 175, 80, 0.5) !important;
  8474. }
  8475.  
  8476. a.b-button {
  8477. color: #3a3d50;
  8478. }
  8479.  
  8480. .b-form input[type=submit][disabled], .b-form input[type=submit].disabled {
  8481. background-color: #424242;
  8482. box-shadow: none;
  8483. color: #9E9E9E !important;
  8484. }
  8485.  
  8486. .b-form .cancel:hover {
  8487. text-decoration: none;
  8488. }
  8489.  
  8490. .buttons > div,
  8491. .buttons a {
  8492. line-height: 1.5rem !important;
  8493. }
  8494.  
  8495. .b-shiki_editor footer .unpreview:not(.link) {
  8496. font-size: 0;
  8497. }
  8498.  
  8499. .b-shiki_editor footer .unpreview:not(.link)::after {
  8500. content: 'Редактировать';
  8501. vertical-align: top;
  8502. font-size: .875rem;
  8503. }
  8504.  
  8505. [data-locale=en] .b-shiki_editor footer .unpreview:not(.link)::after {
  8506. content: 'Edit';
  8507. }
  8508.  
  8509. .b-contests-menu .results {
  8510. display: block;
  8511. float: none;
  8512. margin: .5rem 0;
  8513. border-radius: 2px;
  8514. font-size: 0;
  8515. }
  8516.  
  8517. .b-contests-menu .results:hover {
  8518. text-decoration: none;
  8519. }
  8520.  
  8521. .b-contests-menu .results::after {
  8522. content: attr(title);
  8523. vertical-align: top;
  8524. font-size: .875rem;
  8525. }
  8526.  
  8527. @media (max-width: 1024px) {
  8528. .l-menu {
  8529. position: fixed !important;
  8530. top: 0;
  8531. right: 0;
  8532. width: 25rem !important;
  8533. max-width: calc(100% - 3.5rem);
  8534. height: 100%;
  8535. background-color: #5e5f6c;
  8536. padding: 4.5rem 1rem 1.5rem;
  8537. box-shadow: 0 2px 3px 1px rgba(0, 0, 0, 0.24);
  8538. overflow-y: auto;
  8539. -webkit-transform: translateX(110%);
  8540. -ms-transform: translateX(110%);
  8541. transform: translateX(110%);
  8542. transition: .25s ease;
  8543. z-index: 9;
  8544. }
  8545. .l-page.menu-expanded .l-menu {
  8546. -webkit-transform: translateX(0);
  8547. -ms-transform: translateX(0);
  8548. transform: translateX(0);
  8549. }
  8550. .menu-slide-outer .l-content {
  8551. margin-left: 0 !important;
  8552. }
  8553. }
  8554.  
  8555. .l-page .menu-toggler {
  8556. position: fixed;
  8557. top: 74px;
  8558. right: 0;
  8559. width: auto;
  8560. height: auto;
  8561. padding: 8px 0;
  8562. transform: rotate(270deg);
  8563. transform-origin: bottom right;
  8564. z-index: 10;
  8565. }
  8566.  
  8567. .l-page .menu-toggler .toggler {
  8568. border-radius: 4px;
  8569. padding: 0 .25em;
  8570. line-height: 24px;
  8571. }
  8572.  
  8573. .l-page .menu-toggler .toggler::before {
  8574. content: 'chevron_right' !important;
  8575. display: inline-block;
  8576. vertical-align: top;
  8577. width: 1em;
  8578. margin: 0;
  8579. font-size: 1.5em;
  8580. opacity: .72;
  8581. transition: 0.16s cubic-bezier(0.4, 0, 0.6, 1);
  8582. }
  8583.  
  8584. .l-page .menu-toggler .toggler::after {
  8585. margin: 0 .25em;
  8586. color: inherit;
  8587. font: inherit;
  8588. }
  8589.  
  8590. .l-page.menu-expanded .menu-toggler .toggler::before {
  8591. transform: rotate(90deg);
  8592. }
  8593.  
  8594. [data-locale='ru'] .l-page .menu-toggler .toggler::after {
  8595. content: 'меню';
  8596. }
  8597.  
  8598. [data-locale='en'] .l-page .menu-toggler .toggler::after {
  8599. content: 'sidebar';
  8600. }
  8601.  
  8602. @media screen and (max-width: 1024px) and (min-width: 768px) and (orientation: landscape) {
  8603. .l-page .menu-toggler.ipad-expanded {
  8604. display: block;
  8605. }
  8606. }
  8607.  
  8608. /**
  8609. * List of User
  8610. * Список пользователей меняется на карточки пользователей
  8611. */
  8612. .p-users .b-user.detailed {
  8613. display: inline-block;
  8614. vertical-align: top;
  8615. float: none;
  8616. position: relative;
  8617. width: 48%;
  8618. height: auto;
  8619. min-height: 261px;
  8620. padding: 8px;
  8621. margin-bottom: 4%;
  8622. margin-right: 4%;
  8623. background-color: #5e5f6c;
  8624. border: 0;
  8625. border-radius: 2px;
  8626. box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.16);
  8627. backface-visibility: hidden;
  8628. }
  8629.  
  8630. .p-users .b-user.detailed:nth-child(2n+2) {
  8631. margin-right: 0;
  8632. }
  8633.  
  8634. .p-users .b-user.detailed::before {
  8635. content: '';
  8636. position: absolute;
  8637. top: 0;
  8638. right: 0;
  8639. bottom: 0;
  8640. left: 0;
  8641. box-shadow: 0 2px 8px 1px rgba(0, 0, 0, 0.16);
  8642. opacity: 0;
  8643. transition: .3s all;
  8644. }
  8645.  
  8646. .p-users .b-user.detailed:hover::before {
  8647. opacity: 1;
  8648. }
  8649.  
  8650. .p-users .b-user.detailed .info,
  8651. .p-users .b-user.detailed .history {
  8652. clear: both;
  8653. float: none;
  8654. width: 100%;
  8655. margin: 0;
  8656. }
  8657.  
  8658. .p-users .b-user.detailed .info .image-name {
  8659. display: block;
  8660. padding: 16px 0;
  8661. margin: auto;
  8662. color: #57576a;
  8663. text-align: center;
  8664. }
  8665.  
  8666. .p-users .b-user.detailed .info .image-name:hover {
  8667. color: #8a8eac;
  8668. }
  8669.  
  8670. .p-users .b-user.detailed .info .image-name:active {
  8671. color: #b7b8cc;
  8672. }
  8673.  
  8674. .p-users .b-user.detailed .info .image-name .name {
  8675. position: absolute;
  8676. top: 0;
  8677. right: 0;
  8678. bottom: 0;
  8679. left: 0;
  8680. padding: 97px 0 0;
  8681. line-height: 32px;
  8682. text-overflow: ellipsis;
  8683. white-space: nowrap;
  8684. overflow: hidden;
  8685. }
  8686.  
  8687. .p-users .b-user.detailed .info .image-name .image {
  8688. clear: both;
  8689. float: none;
  8690. display: block;
  8691. padding: 0;
  8692. margin: auto auto 24px;
  8693. border-radius: 100%;
  8694. }
  8695.  
  8696. .p-users .b-user.detailed .info .last-online {
  8697. color: #BDBDBD;
  8698. text-align: center;
  8699. }
  8700.  
  8701. .p-users .b-user.detailed .history {
  8702. padding-top: 8px;
  8703. margin-top: 0;
  8704. font-size: 12px;
  8705. line-height: 20px;
  8706. }
  8707.  
  8708. .p-users .b-user.detailed .history .line .event {
  8709. color: inherit;
  8710. }
  8711.  
  8712. .p-users .b-user.detailed .history .line .date {
  8713. color: #9E9E9E;
  8714. }
  8715.  
  8716. .p-users .b-user.detailed .history .line a .event {
  8717. color: #57576a;
  8718. }
  8719.  
  8720. .p-users .b-user.detailed .history .line a .event:hover {
  8721. color: #8a8eac;
  8722. }
  8723.  
  8724. .p-users .b-user.detailed .history .line a .event:active {
  8725. color: #b7b8cc;
  8726. }
  8727.  
  8728. @media (min-width: 540px) {
  8729. .p-users .b-user.detailed {
  8730. width: 32%;
  8731. margin-right: 2%;
  8732. margin-bottom: 2%;
  8733. }
  8734. .p-users .b-user.detailed:nth-child(2n+2) {
  8735. margin-right: 2%;
  8736. }
  8737. .p-users .b-user.detailed:nth-child(3n+3) {
  8738. margin-right: 0;
  8739. }
  8740. }
  8741.  
  8742. @media (min-width: 768px) {
  8743. .p-users .b-user.detailed {
  8744. width: 23.5%;
  8745. margin-right: 2%;
  8746. margin-bottom: 2%;
  8747. }
  8748. .p-users .b-user.detailed:nth-child(2n+2) {
  8749. margin-right: 2%;
  8750. }
  8751. .p-users .b-user.detailed:nth-child(3n+3) {
  8752. margin-right: 2%;
  8753. }
  8754. .p-users .b-user.detailed:nth-child(4n+4) {
  8755. margin-right: 0;
  8756. }
  8757. }
  8758.  
  8759. @media (min-width: 960px) {
  8760. .p-users .b-user.detailed {
  8761. width: 18.4%;
  8762. margin-right: 2%;
  8763. margin-bottom: 2%;
  8764. }
  8765. .p-users .b-user.detailed:nth-child(2n+2) {
  8766. margin-right: 2%;
  8767. }
  8768. .p-users .b-user.detailed:nth-child(3n+3) {
  8769. margin-right: 2%;
  8770. }
  8771. .p-users .b-user.detailed:nth-child(4n+4) {
  8772. margin-right: 2%;
  8773. }
  8774. .p-users .b-user.detailed:nth-child(5n+5) {
  8775. margin-right: 0;
  8776. }
  8777. }
  8778.  
  8779. @media (min-width: 1200px) {
  8780. .p-users.x1200 .b-user.detailed {
  8781. width: 15%;
  8782. margin-right: 2%;
  8783. margin-bottom: 2%;
  8784. }
  8785. .p-users.x1200 .b-user.detailed:nth-child(2n+2) {
  8786. margin-right: 2%;
  8787. }
  8788. .p-users.x1200 .b-user.detailed:nth-child(3n+3) {
  8789. margin-right: 2%;
  8790. }
  8791. .p-users.x1200 .b-user.detailed:nth-child(4n+4) {
  8792. margin-right: 2%;
  8793. }
  8794. .p-users.x1200 .b-user.detailed:nth-child(5n+5) {
  8795. margin-right: 2%;
  8796. }
  8797. .p-users.x1200 .b-user.detailed:nth-child(6n+6) {
  8798. margin-right: 0;
  8799. }
  8800. }
  8801.  
  8802. /* END of List of User */
  8803. /**
  8804. * PROFILE HEAD
  8805. * Adaptive profile header includes: avatar, history, information, anime/manga bars.
  8806. */
  8807. .p-profiles .profile-head {
  8808. position: relative;
  8809. min-height: 15.5rem;
  8810. padding-top: 3rem;
  8811. margin-top: -1rem;
  8812. overflow: visible;
  8813. }
  8814.  
  8815. @media (min-width: 600px) {
  8816. .p-profiles .profile-head {
  8817. background-color: inherit;
  8818. }
  8819. }
  8820.  
  8821. @media (min-width: 960px) {
  8822. .p-profiles .profile-head {
  8823. padding-top: 0;
  8824. margin-top: 0;
  8825. }
  8826. }
  8827.  
  8828. .p-profiles .profile-head .c-info {
  8829. margin-bottom: .5rem;
  8830. overflow: visible;
  8831. }
  8832.  
  8833. @media (min-width: 600px) {
  8834. .p-profiles .profile-head .c-info {
  8835. margin-left: 11.5rem;
  8836. }
  8837. }
  8838.  
  8839. @media (min-width: 768px) {
  8840. .p-profiles .profile-head .c-info {
  8841. margin-left: 12.5rem;
  8842. }
  8843. }
  8844.  
  8845. @media (min-width: 960px) {
  8846. .p-profiles .profile-head .c-info {
  8847. margin-left: 13.5rem;
  8848. margin-right: calc(23% + 3.5rem);
  8849. margin-bottom: 1.5rem;
  8850. }
  8851. }
  8852.  
  8853. .p-profiles .profile-head .c-brief {
  8854. position: relative;
  8855. margin: -3rem -1rem 1rem;
  8856. overflow: hidden;
  8857. }
  8858.  
  8859. @media (min-width: 600px) {
  8860. .p-profiles .profile-head .c-brief {
  8861. margin: -3rem -1rem 0;
  8862. overflow: visible;
  8863. }
  8864. }
  8865.  
  8866. @media (min-width: 768px) {
  8867. .p-profiles .profile-head .c-brief {
  8868. overflow: visible;
  8869. }
  8870. }
  8871.  
  8872. @media (min-width: 960px) {
  8873. .p-profiles .profile-head .c-brief {
  8874. max-height: 504px;
  8875. margin: 0;
  8876. overflow: visible;
  8877. }
  8878. }
  8879.  
  8880. .p-profiles .profile-head .c-brief::before {
  8881. content: '';
  8882. display: block;
  8883. height: 0;
  8884. padding-bottom: 0;
  8885. }
  8886.  
  8887. @media (min-width: 320px) {
  8888. .p-profiles .profile-head .c-brief::before {
  8889. padding-bottom: 48px;
  8890. }
  8891. }
  8892.  
  8893. @media (min-width: 600px) {
  8894. .p-profiles .profile-head .c-brief::before {
  8895. padding-bottom: 56px;
  8896. }
  8897. }
  8898.  
  8899. @media (min-width: 960px) {
  8900. .p-profiles .profile-head .c-brief::before {
  8901. padding-bottom: 0;
  8902. }
  8903. }
  8904.  
  8905. @media (min-width: 320px) {
  8906. .p-profiles .profile-head .c-brief .avatar {
  8907. float: none;
  8908. max-width: 100%;
  8909. margin: 1rem auto 0;
  8910. }
  8911. }
  8912.  
  8913. @media (min-width: 320px) and (max-width: 599px) {
  8914. .p-profiles .profile-head .c-brief .avatar {
  8915. position: relative;
  8916. height: 160px;
  8917. }
  8918. }
  8919.  
  8920. @media (min-width: 600px) {
  8921. .p-profiles .profile-head .c-brief .avatar {
  8922. position: absolute;
  8923. max-width: 160px;
  8924. margin: 1rem 1rem 1rem .5rem;
  8925. }
  8926. }
  8927.  
  8928. @media (min-width: 960px) {
  8929. .p-profiles .profile-head .c-brief .avatar {
  8930. margin: 1rem 2rem 1rem 0;
  8931. }
  8932. }
  8933.  
  8934. @media (min-width: 320px) {
  8935. .p-profiles .profile-head .c-brief .avatar img {
  8936. display: block;
  8937. width: 36%;
  8938. max-width: 160px;
  8939. margin: auto;
  8940. }
  8941. }
  8942.  
  8943. @media (min-width: 320px) and (max-width: 599px) {
  8944. .p-profiles .profile-head .c-brief .avatar img {
  8945. position: absolute;
  8946. top: 0;
  8947. bottom: 0;
  8948. left: 0;
  8949. right: 0;
  8950. }
  8951. }
  8952.  
  8953. @media (min-width: 600px) {
  8954. .p-profiles .profile-head .c-brief .avatar img {
  8955. width: 160px;
  8956. }
  8957. }
  8958.  
  8959. @media (min-width: 320px) {
  8960. .p-profiles .profile-head .c-brief header {
  8961. clear: both;
  8962. margin: 0;
  8963. text-align: center;
  8964. }
  8965. }
  8966.  
  8967. @media (min-width: 320px) and (max-width: 599px) {
  8968. .p-profiles .profile-head .c-brief header {
  8969. background-color: inherit !important;
  8970. }
  8971. }
  8972.  
  8973. @media (min-width: 600px) {
  8974. .p-profiles .profile-head .c-brief header {
  8975. clear: none;
  8976. padding: 1rem 0 .5rem;
  8977. margin-left: 12.5rem;
  8978. text-align: left;
  8979. }
  8980. }
  8981.  
  8982. @media (min-width: 768px) {
  8983. .p-profiles .profile-head .c-brief header {
  8984. margin-left: 13.5rem;
  8985. }
  8986. }
  8987.  
  8988. @media (min-width: 320px) and (max-width: 599px) {
  8989. .p-profiles .profile-head .c-brief header .notice {
  8990. padding: .5rem 1rem;
  8991. }
  8992. }
  8993.  
  8994. @media (min-width: 320px) {
  8995. .p-profiles .profile-head .c-mobile-actions {
  8996. display: none;
  8997. }
  8998. }
  8999.  
  9000. .p-profiles .profile-head .c-history {
  9001. margin-bottom: 3rem;
  9002. }
  9003.  
  9004. .p-profiles .profile-head .c-history.x3 {
  9005. margin-bottom: 2rem;
  9006. }
  9007.  
  9008. @media (min-width: 320px) and (max-width: 959px) {
  9009. .p-profiles .profile-head .c-history {
  9010. display: block;
  9011. position: absolute;
  9012. top: 0;
  9013. right: 0;
  9014. left: 0;
  9015. width: auto;
  9016. padding: 0 1rem;
  9017. margin: 0 -1rem;
  9018. background-color: rgba(0, 0, 0, 0.48);
  9019. white-space: nowrap;
  9020. overflow-x: auto;
  9021. z-index: 1;
  9022. }
  9023. .p-profiles .profile-head .c-history .subheadline {
  9024. display: inline-block;
  9025. vertical-align: top;
  9026. }
  9027. .p-profiles .profile-head .c-history .subheadline a {
  9028. color: #eee !important;
  9029. }
  9030. .p-profiles .profile-head .c-history .subheadline a::before {
  9031. display: none;
  9032. }
  9033. .p-profiles .profile-head .c-history .b-block_list {
  9034. display: inline-block;
  9035. vertical-align: top;
  9036. padding: .5rem;
  9037. margin-left: .5rem;
  9038. }
  9039. .p-profiles .profile-head .c-history .entry {
  9040. display: inline-block !important;
  9041. vertical-align: top;
  9042. min-width: 112px;
  9043. height: 2rem;
  9044. padding-right: .5rem;
  9045. padding-left: .5rem;
  9046. margin-left: .5rem;
  9047. border-radius: 1rem;
  9048. overflow: hidden;
  9049. }
  9050. .p-profiles .profile-head .c-history .entry .image-name {
  9051. float: left;
  9052. width: 32px;
  9053. height: 32px;
  9054. margin: -8px 8px -8px -8px;
  9055. border-radius: 50%;
  9056. font-size: 0;
  9057. line-height: 0;
  9058. overflow: hidden;
  9059. }
  9060. .p-profiles .profile-head .c-history .entry::before,
  9061. .p-profiles .profile-head .c-history .entry span.misc {
  9062. display: none;
  9063. }
  9064. }
  9065.  
  9066. @media (min-width: 600px) and (max-width: 959px) {
  9067. .p-profiles .profile-head .c-history {
  9068. padding: .25rem 1rem;
  9069. }
  9070. }
  9071.  
  9072. @media (min-width: 960px) {
  9073. .p-profiles .profile-head .c-history {
  9074. display: block;
  9075. position: relative;
  9076. top: 1rem;
  9077. margin-left: 3.5rem;
  9078. z-index: 1;
  9079. }
  9080. }
  9081.  
  9082. @media (min-width: 320px) and (max-width: 600px) {
  9083. .p-profiles .profile-head .c-brief .avatar .profile-actions a:first-child {
  9084. margin-right: 0 !important;
  9085. }
  9086. }
  9087.  
  9088. @media (min-width: 320px) {
  9089. .p-profiles .profile-head .c-brief .avatar .profile-actions {
  9090. display: block;
  9091. position: absolute;
  9092. top: 50%;
  9093. width: 100%;
  9094. padding: .75rem 1rem;
  9095. margin: 0 auto;
  9096. text-align: left;
  9097. }
  9098. .p-profiles .profile-head .c-brief .avatar .profile-actions a:first-child,
  9099. .p-profiles .profile-head .c-brief .avatar .profile-actions .fav-add,
  9100. .p-profiles .profile-head .c-brief .avatar .profile-actions .fav-remove {
  9101. float: right;
  9102. }
  9103. }
  9104.  
  9105. @media (min-width: 600px) {
  9106. .p-profiles .profile-head .c-brief .avatar .profile-actions {
  9107. position: static;
  9108. width: auto;
  9109. padding: 0;
  9110. margin-top: 1rem;
  9111. margin-right: -12px;
  9112. margin-left: -12px;
  9113. text-align: center;
  9114. }
  9115. .p-profiles .profile-head .c-brief .avatar .profile-actions a:first-child {
  9116. float: none;
  9117. margin: 0;
  9118. }
  9119. .p-profiles .profile-head .c-brief .avatar .profile-actions .fav-add,
  9120. .p-profiles .profile-head .c-brief .avatar .profile-actions .fav-remove {
  9121. float: none;
  9122. }
  9123. }
  9124.  
  9125. /* END of PROFILE HEAD */
  9126.  
  9127.  
  9128.  
  9129. /**
  9130. * Profile Content
  9131. */
  9132. /* Lifetime */
  9133. .p-profiles .lifetime {
  9134. margin-bottom: 0;
  9135. min-height: 0;
  9136. }
  9137.  
  9138. .p-profiles .lifetime .bar,
  9139. .p-profiles .lifetime .times {
  9140. display: none;
  9141. }
  9142.  
  9143. .p-profiles .lifetime .title .value {
  9144. height: 16px;
  9145. margin-top: 0;
  9146. line-height: 16px;
  9147. }
  9148.  
  9149. .p-profiles .lifetime .title > .label {
  9150. font-size: 0;
  9151. line-height: 0;
  9152. }
  9153.  
  9154. .p-profiles .lifetime .title > .label::before {
  9155. content: 'Активность';
  9156. display: block;
  9157. font-size: 0.875rem;
  9158. line-height: 1rem;
  9159. }
  9160.  
  9161. .p-profiles[data-locale='en'] .lifetime .title > .label::before {
  9162. content: 'Time spent';
  9163. }
  9164.  
  9165. .p-profiles .activity .title {
  9166. display: none;
  9167. }
  9168.  
  9169. /* Layout */
  9170. .p-profiles .profile-content > .cc-2 .c-right .cc-2a {
  9171. margin-bottom: 16px !important;
  9172. }
  9173.  
  9174. @media (min-width: 768px) {
  9175. .p-profiles .profile-content .graph {
  9176. height: 155px;
  9177. }
  9178. .p-profiles .profile-content > .cc-2 > .c-column {
  9179. width: 100%;
  9180. margin-bottom: 1rem;
  9181. }
  9182. .p-profiles .profile-content > .cc-2 .activity {
  9183. padding-bottom: 1rem;
  9184. }
  9185. }
  9186.  
  9187. @media (min-width: 960px) {
  9188. .p-profiles .profile-content > .cc-2 {
  9189. position: relative;
  9190. }
  9191. .p-profiles .profile-content > .cc-2 .c-left {
  9192. position: relative;
  9193. width: calc(77% - 16px);
  9194. min-height: 220px;
  9195. padding-right: 40px;
  9196. margin-right: 0;
  9197. margin-bottom: 1.5rem;
  9198. z-index: 1;
  9199. }
  9200. .p-profiles .profile-content > .cc-2 .c-right .cc-2a {
  9201. width: calc(23% + 16px);
  9202. padding-left: 16px;
  9203. margin-left: -16px;
  9204. overflow: hidden;
  9205. }
  9206. .p-profiles .profile-content > .cc-2 .c-right .cc-2a > .c-column {
  9207. clear: both;
  9208. width: 100%;
  9209. margin: 0;
  9210. }
  9211. .p-profiles .profile-content .c-right:last-child {
  9212. float: none;
  9213. }
  9214. .p-profiles .profile-content .c-right > .block:last-child {
  9215. clear: both;
  9216. }
  9217. }
  9218.  
  9219. /* Achievements */
  9220. .p-profiles-show .achievements .header {
  9221. align-items: baseline;
  9222. }
  9223.  
  9224. .p-profiles-show .achievements .header .title {
  9225. color: #BDBDBD;
  9226. font-size: .875em;
  9227. }
  9228.  
  9229. .p-profiles-show .achievements .header .size {
  9230. font-size: .75em;
  9231. }
  9232.  
  9233. /* END of Profile Content */
  9234. /* Круглые аватарки */
  9235. .b-comment > .inner header > a > img,
  9236. .b-dialog > .inner header > a > img,
  9237. .b-message > .inner header > a > img,
  9238. .p-user_rates-index .l-menu .avatar img,
  9239. .avatar > img {
  9240. border-radius: 100%;
  9241. }
  9242.  
  9243. .p-achievements-index .cc-achievements {
  9244. display: flex;
  9245. flex-wrap: wrap;
  9246. align-items: stretch;
  9247. align-content: stretch;
  9248. }
  9249.  
  9250. .p-achievements-index .cc-achievements .b-achievement {
  9251. display: inline-flex;
  9252. flex-direction: column-reverse;
  9253. justify-content: flex-end;
  9254. float: none;
  9255. background: #5e5f6c;
  9256. border-radius: 2px;
  9257. box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.08);
  9258. overflow: hidden;
  9259. transition: box-shadow .16s ease;
  9260. }
  9261.  
  9262. .p-achievements-index .cc-achievements .b-achievement:hover {
  9263. box-shadow: 0 2px 8px 1px rgba(0, 0, 0, 0.12);
  9264. }
  9265.  
  9266. @media (min-width: 768px) {
  9267. .p-achievements-index .cc-achievements .b-achievement:nth-child(n) {
  9268. width: calc(25% - (16px * 3 / 4));
  9269. margin-right: 16px;
  9270. margin-bottom: 16px;
  9271. }
  9272. .p-achievements-index .cc-achievements .b-achievement:nth-child(4n+4) {
  9273. margin-right: 0;
  9274. }
  9275. .p-achievements-index .cc-franchises-genres .c-genres .b-achievement:nth-child(n) {
  9276. margin-right: 16px;
  9277. margin-bottom: 16px;
  9278. }
  9279. .p-achievements-index .cc-franchises-genres .c-genres .b-achievement:nth-child(4n+4) {
  9280. margin-right: 0;
  9281. }
  9282. .p-achievements-index .cc-franchises-genres .c-genres,
  9283. .p-achievements-index .cc-franchises-genres .c-franchises {
  9284. width: 100%;
  9285. }
  9286. }
  9287.  
  9288. .b-achievement .c-image,
  9289. .b-achievement .c-about {
  9290. width: 100%;
  9291. }
  9292.  
  9293. .b-achievement .c-image {
  9294. padding-top: 50%;
  9295. }
  9296.  
  9297. .b-achievement .c-image .inner .border {
  9298. border: 0;
  9299. }
  9300.  
  9301. .b-achievement .c-about {
  9302. padding: 16px;
  9303. white-space: normal;
  9304. }
  9305.  
  9306. .b-achievement .c-about .title {
  9307. margin: 0 0 8px;
  9308. line-height: 20px;
  9309. }
  9310.  
  9311. .b-achievement .c-about .hint {
  9312. color: #BDBDBD;
  9313. }
  9314.  
  9315. .b-achievement .c-about .percent {
  9316. color: #BDBDBD;
  9317. }
  9318.  
  9319. .b-achievement .c-about .progress {
  9320. margin: 0 0 8px;
  9321. background-color: #4f4f4f;
  9322. }
  9323.  
  9324. .b-achievement .c-about .progress .bar {
  9325. background-color: #3a3d50;
  9326. }
  9327.  
  9328. .b-achievement .c-about .text {
  9329. margin: 0;
  9330. font-size: 14px;
  9331. }
  9332.  
  9333. .b-achievement .c-about a.title {
  9334. color: #FFFFFF;
  9335. }
  9336.  
  9337. .b-achievement .c-about a.title:hover {
  9338. color: #8a8eac;
  9339. }
  9340.  
  9341. .b-achievement .c-about a.title:active {
  9342. color: #b7b8cc;
  9343. }
  9344.  
  9345. .p-achievements-index .tipsy {
  9346. display: none !important;
  9347. }
  9348.  
  9349. .p-achievements-index .c-franchises .b-badge {
  9350. position: relative;
  9351. background: rgba(0, 0, 0, 0.4);
  9352. border-radius: 3px;
  9353. overflow: hidden;
  9354. }
  9355.  
  9356. .p-achievements-index .c-franchises .b-badge,
  9357. .p-achievements-index .c-franchises .b-badge img {
  9358. transition: .24s ease;
  9359. }
  9360.  
  9361. .b-badge .no-image,
  9362. .p-achievements-index .c-franchises .b-badge img {
  9363. border-radius: inherit;
  9364. }
  9365.  
  9366. .p-achievements-index .c-franchises .b-badge::after,
  9367. .p-achievements-index .c-franchises .b-badge::before {
  9368. display: block;
  9369. position: absolute;
  9370. top: auto;
  9371. right: 0;
  9372. bottom: 0;
  9373. left: 0;
  9374. width: auto;
  9375. height: auto;
  9376. padding: 12px 12px 6px;
  9377. border-radius: 0 0 3px 3px;
  9378. color: #fff;
  9379. font-size: 14px;
  9380. font-weight: bold;
  9381. line-height: 20px;
  9382. text-shadow: 0 0 1px black, 0 1px 5px rgba(0, 0, 0, 0.32);
  9383. backface-visibility: hidden;
  9384. transition: .24s ease;
  9385. opacity: 1;
  9386. z-index: 1;
  9387. }
  9388.  
  9389. .p-achievements-index .c-franchises .b-badge:hover::after,
  9390. .p-achievements-index .c-franchises .b-badge:hover::before {
  9391. transform: translate3d(0, 100%, 0);
  9392. }
  9393.  
  9394. .p-achievements-index .c-franchises .b-badge[original-title]::before {
  9395. content: attr(original-title);
  9396. }
  9397.  
  9398. .p-achievements-index .c-franchises .b-badge[title]::before {
  9399. content: attr(title);
  9400. }
  9401.  
  9402. .p-achievements-index .c-franchises .b-badge::before {
  9403. padding-right: 48px;
  9404. background: linear-gradient(transparent, rgba(0, 0, 0, 0.32));
  9405. text-align: left;
  9406. }
  9407.  
  9408. .p-achievements-index .c-franchises .b-badge::after {
  9409. content: attr(data-progress) "%";
  9410. background: none;
  9411. text-align: right;
  9412. }
  9413.  
  9414. .p-achievements-index .c-franchises .b-badge .no-image {
  9415. transition: .24s ease;
  9416. }
  9417.  
  9418. .p-achievements-index .c-franchises .b-badge.level-0.unavailable:not(:hover) .no-image {
  9419. opacity: 0.2;
  9420. }
  9421.  
  9422. .p-achievements-index .c-franchises .b-badge.level-0:not(:hover) .no-image,
  9423. .p-achievements-index .c-franchises .b-badge.unavailable:not(:hover) .no-image {
  9424. opacity: 0.5;
  9425. }
  9426.  
  9427. .b-list_switchers .switcher.popularity:before {
  9428. content: 'trending_up';
  9429. }
  9430.  
  9431. .b-list_switchers .switcher.alphabet:before {
  9432. content: 'sort_by_alpha';
  9433. }
  9434.  
  9435. .p-achievements-index .b-list_switchers .switcher[title]::after {
  9436. content: attr(title);
  9437. }
  9438.  
  9439. .p-achievements-index .b-list_switchers .switcher[original-title]::after {
  9440. content: attr(original-title);
  9441. }
  9442.  
  9443. @media screen and (max-width: 767px) {
  9444. .p-achievements-index .cc-franchises-genres .c-franchises {
  9445. padding: 0 16px;
  9446. margin: 0 -16px;
  9447. overflow: hidden;
  9448. }
  9449. }
  9450.  
  9451.  
  9452.  
  9453.  
  9454.  
  9455.  
  9456. .l-top_menu-v2 .menu-dropdown>button>span, .l-top_menu-v2 .submenu>a, .l-top_menu-v2 .global-search, .l-top_menu-v2 .global-search input{
  9457. font-size: 16px;
  9458. }
  9459. .l-top_menu-v2 .submenu>a{
  9460. height:35px;
  9461. padding-left: 15px;
  9462. }
  9463. .l-top_menu-v2 .menu-dropdown.main>button:not(.mobile) span {
  9464. margin-left: 15px;
  9465. }
  9466. .l-top_menu-v2 .menu-dropdown.profile>button, .l-top_menu-v2 .menu-dropdown.main, .l-top_menu-v2 .menu-dropdown.main>button:not(.mobile) {
  9467. min-width: 130px;
  9468. max-width: 150px;
  9469. }
  9470. /*фон*/
  9471. .l-top_menu-v2 {
  9472. background: #22242f;
  9473. border-bottom: 0px;
  9474. height: 55px;
  9475. }
  9476. /*фон под разворотами*/
  9477. .l-top_menu-v2 .submenu, .b-main_search ul.popup{
  9478. border: 0px;
  9479. background: #22242f;
  9480. }
  9481. .l-top_menu-v2 .menu-icon, .l-top_menu-v2 .menu-dropdown>button{
  9482. height: 45px;
  9483. }
  9484. /*выборы прочих разворотов*/
  9485. .l-top_menu-v2 .submenu>.entry, .b-main_search ul.popup li {
  9486. border: 0px;
  9487. }
  9488. /*обычное состояние*/
  9489. .l-top_menu-v2 .inner .logo, .l-top_menu-v2 .menu-items>.entry.selected, .l-top_menu-v2 .menu-items>.entry, .menu.menu-userbox {
  9490. transition: 0.2s;
  9491. }
  9492. /*логотип*/
  9493. .l-top_menu-v2 .logo-container .logo{
  9494. background: url(http://www.picshare.ru/uploads/190429/xS8ifVHq2y.png) no-repeat;
  9495. height:25px;
  9496. }
  9497. .l-top_menu-v2 .logo-container .glyph, .l-top_menu-v2 .global-search .hotkey-marker, .l-top_menu-v2 .global-search .search-marker, .l-top_menu-v2 .global-search .clear,
  9498. .l-top_menu-v2 .icon-profile:before, .l-top_menu-v2 .icon-anime_list:before, .l-top_menu-v2 .icon-manga_list:before, .l-top_menu-v2 .icon-characters:before, .l-top_menu-v2 .icon-mail:before, .l-top_menu-v2 .icon-achievements:before, .l-top_menu-v2 .icon-settings:before,
  9499. .l-top_menu-v2 .icon-site_rules:before, .l-top_menu-v2 .icon-faq:before, .l-top_menu-v2 .icon-sign_out:before, .l-top_menu-v2 .icon-anime:before, .l-top_menu-v2 .icon-manga:before, .l-top_menu-v2 .icon-ranobe:before, .l-top_menu-v2 .icon-forum:before, .l-top_menu-v2 .icon-clubs:before, .l-top_menu-v2 .icon-collections:before, .l-top_menu-v2 .icon-reviews:before, .l-top_menu-v2 .icon-contests:before, .l-top_menu-v2 .icon-users:before, .l-top_menu-v2 .icon-calendar:before, .l-top_menu-v2 .icon-info:before, .l-top_menu-v2 .icon-socials:before, .l-top_menu-v2 .icon-moderation:before,
  9500. .l-top_menu-v2 .global-search .search-results .nothing_found.active:before, .l-top_menu-v2 .global-search .search-results .nothing_found:focus:before, .l-top_menu-v2 .global-search .search-results .b-db_entry-variant-list_item.active:before, .l-top_menu-v2 .global-search .search-results .b-db_entry-variant-list_item:focus:before, .l-top_menu-v2 .global-search .search-results .search-mode.active:before, .l-top_menu-v2 .global-search .search-results .search-mode:focus:before,
  9501. .l-top_menu-v2 .global-search .search-results .nothing_found:before, .l-top_menu-v2 .global-search .search-results .b-db_entry-variant-list_item:before, .l-top_menu-v2 .global-search .search-results .search-mode:before,
  9502. .l-top_menu-v2 .global-search input.has-value ~ .clear,
  9503. .l-top_menu-v2.is-search-mobile .global-search .clear{
  9504. display:none;
  9505. }
  9506. .l-top_menu-v2 .global-search .search-results .search-mode:active:before, .l-top_menu-v2 .global-search .search-results .b-db_entry-variant-list_item:active:before
  9507. {
  9508. background: none;
  9509. }
  9510. /*фикс поиска*/
  9511. .l-top_menu-v2 .global-search, .l-top_menu-v2 .global-search input{
  9512. background: rgba(25,25,25,0.65);
  9513. color: #3a3d50;
  9514. transition: 0.2s;
  9515. height: 30px;
  9516. margin-right: 0px;
  9517. }
  9518. .l-top_menu-v2 .global-search input{
  9519. padding: 0 0 0 4px;
  9520. border-radius: 0px;
  9521. }
  9522. .l-top_menu-v2 .menu-dropdown.profile>button img {
  9523. height: 24px;
  9524. }
  9525. .l-top_menu-v2 .global-search .search-results .nothing_found, .l-top_menu-v2 .global-search .search-results .search-mode{
  9526. font-size: 11px;
  9527. line-height: 20px;
  9528. padding-top: 0px;
  9529. }
  9530. .l-top_menu-v2 .global-search .search-results{
  9531. top:28px;
  9532. }
  9533. .l-top_menu-v2 .global-search .search-results .nothing_found.active, .l-top_menu-v2 .global-search .search-results .nothing_found:focus, .l-top_menu-v2 .global-search .search-results .b-db_entry-variant-list_item.active, .l-top_menu-v2 .global-search .search-results .b-db_entry-variant-list_item:focus, .l-top_menu-v2 .global-search .search-results .search-mode.active, .l-top_menu-v2 .global-search .search-results .search-mode:focus,
  9534. .l-top_menu-v2 .global-search .search-results .nothing_found, .l-top_menu-v2 .global-search .search-results .search-mode{
  9535. padding-left: 5px;
  9536. }
  9537. .l-top_menu-v2 .menu-icon.search:before {
  9538. line-height: 35px;
  9539. }
  9540. @media screen and (max-width: 1024px){
  9541. .l-top_menu-v2.is-search-mobile .global-search {
  9542. position: relative;
  9543. background: none;
  9544. }
  9545. .l-top_menu-v2.is-search-mobile .global-search{
  9546. padding: 0px 0;
  9547. top: 0px;
  9548. }
  9549. .l-top_menu-v2.is-search-mobile .global-search .search-results {
  9550. margin-top: 0px;
  9551. }
  9552. }
  9553. .l-top_menu-v2 .menu-icon.trigger:before{
  9554. line-height: 0px;
  9555. }
  9556. .l-top_menu-v2 .global-search .search-results .nothing_found, .l-top_menu-v2 .global-search .search-results .b-db_entry-variant-list_item, .l-top_menu-v2 .global-search .search-results .search-mode{
  9557. padding-left:5px
  9558. }
  9559. .l-top_menu-v2 .global-search {
  9560. margin-right: 10px;
  9561. margin-left: auto;
  9562. width: 20%;
  9563.  
  9564. }
  9565.  
  9566. .l-top_menu-v2 .menu-dropdown.profile {
  9567. margin-left: 0;
  9568. }
  9569.  
  9570.  
  9571.  
  9572. /* МОИ НАСТРОЙКИ */
  9573. /* Фон страницы */
  9574. body {
  9575. background-attachment: fixed;
  9576. background-image: url(https://pp.userapi.com/c855036/v855036771/2e3/Dvwo9E_G7EA.jpg);
  9577. background-position: top center;
  9578. background-size: cover;
  9579. }
Add Comment
Please, Sign In to add comment