/*! normalize.css 2012-03-06T10:21 UTC - http://github.com/necolas/normalize.css */ /* ============================================================================= HTML5 display definitions ========================================================================== */ /* * Corrects block display not defined in IE6/7/8/9 & FF3 */ article, aside, details, figcaption, figure, footer, header, hgroup, nav, section, summary { display: block; } /* * Corrects inline-block display not defined in IE6/7/8/9 & FF3 */ audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; } /* * Prevents modern browsers from displaying 'audio' without controls * Remove excess height in iOS5 devices */ audio:not([controls]) { display: none; height: 0; } /* * Addresses styling for 'hidden' attribute not present in IE7/8/9, FF3, S4 * Known issue: no IE6 support */ [hidden] { display: none; } /* ============================================================================= Base ========================================================================== */ /* * 1. Corrects text resizing oddly in IE6/7 when body font-size is set using em units * http://clagnut.com/blog/348/#c790 * 2. Prevents iOS text size adjust after orientation change, without disabling user zoom * www.456bereastreet.com/archive/201012/controlling_text_size_in_safari_for_ios_without_disabling_user_zoom/ */ html { font-size: 100%; /* 1 */ -webkit-text-size-adjust: 100%; /* 2 */ -ms-text-size-adjust: 100%; /* 2 */ } /* * Addresses font-family inconsistency between 'textarea' and other form elements. */ html, button, input, select, textarea { font-family: Verdana, sans-serif; } /* * Addresses margins handled incorrectly in IE6/7 */ body { margin: 0; } /* ============================================================================= Links ========================================================================== */ /* * Addresses outline displayed oddly in Chrome */ a:focus { outline: 0; } /* * Improves readability when focused and also mouse hovered in all browsers * people.opera.com/patrickl/experiments/keyboard/test */ a:hover, a:active { outline: 0; } /* ============================================================================= Typography ========================================================================== */ /* * Addresses font sizes and margins set differently in IE6/7 * Addresses font sizes within 'section' and 'article' in FF4+, Chrome, S5 */ h1, h2, h3, h4, h5, h6 { font-size: 13px; line-height: 1.6em; font-weight: normal; margin: 0; font-family: 'PT Sans', Arial, sans-serif; } /* * Addresses styling not present in IE7/8/9, S5, Chrome */ abbr[title] { border-bottom: 1px dotted; } /* * Addresses style set to 'bolder' in FF3+, S4/5, Chrome */ b, strong { font-weight: bold; } blockquote { margin: 1em 40px; } /* * Addresses styling not present in S5, Chrome */ dfn { font-style: italic; } /* * Addresses styling not present in IE6/7/8/9 */ mark { background: #ff0; color: #000; } /* * Addresses margins set differently in IE6/7 */ p, pre { margin: 0; } /* * Corrects font family set oddly in IE6, S4/5, Chrome * en.wikipedia.org/wiki/User:Davidgothberg/Test59 */ pre, code, kbd, samp { font-family: monospace, serif; _font-family: 'courier new', monospace; } /* * Improves readability of pre-formatted text in all browsers */ pre { } /* * 1. Addresses CSS quotes not supported in IE6/7 * 2. Addresses quote property not supported in S4 */ /* 1 */ q { quotes: none; } /* 2 */ q:before, q:after { content: ''; content: none; } small { font-size: 75%; } /* * Prevents sub and sup affecting line-height in all browsers * gist.github.com/413930 */ sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sup { top: -0.5em; } sub { bottom: -0.25em; } /* ============================================================================= Lists ========================================================================== */ /* * Addresses margins set differently in IE6/7 */ dl, menu, ol, ul { margin: 0 0; } dd { margin: 0 0 0 0; } /* * Addresses paddings set differently in IE6/7 */ menu, ol, ul { padding: 0 0 0 0; } /* * Corrects list images handled incorrectly in IE7 */ ul, ol { list-style: none; list-style-image: none; } /* ============================================================================= Embedded content ========================================================================== */ /* * 1. Removes border when inside 'a' element in IE6/7/8/9, FF3 * 2. Improves image quality when scaled in IE7 * code.flickr.com/blog/2008/11/12/on-ui-quality-the-little-things-client-side-image-resizing/ */ img { border: 0; /* 1 */ -ms-interpolation-mode: bicubic; /* 2 */ } /* * Corrects overflow displayed oddly in IE9 */ svg:not(:root) { overflow: hidden; } /* ============================================================================= Figures ========================================================================== */ /* * Addresses margin not present in IE6/7/8/9, S5, O11 */ figure { margin: 0; } /* ============================================================================= Forms ========================================================================== */ /* * Corrects margin displayed oddly in IE6/7 */ form { margin: 0; } /* * Define consistent border, margin, and padding */ fieldset { border: none; margin: 0; padding: 0; } /* * 1. Corrects color not being inherited in IE6/7/8/9 * 2. Corrects text not wrapping in FF3 * 3. Corrects alignment displayed oddly in IE6/7 */ legend { border: 0; /* 1 */ padding: 0; white-space: normal; /* 2 */ *margin-left: -7px; /* 3 */ } /* * 1. Corrects font size not being inherited in all browsers * 2. Addresses margins set differently in IE6/7, FF3+, S5, Chrome * 3. Improves appearance and consistency in all browsers */ button, input, select, textarea { font-size: 100%; /* 1 */ margin: 0; /* 2 */ vertical-align: baseline; /* 3 */ *vertical-align: middle; /* 3 */ } /* * Addresses FF3/4 setting line-height on 'input' using !important in the UA stylesheet */ button, input { line-height: normal; /* 1 */ } /* * 1. Improves usability and consistency of cursor style between image-type 'input' and others * 2. Corrects inability to style clickable 'input' types in iOS * 3. Removes inner spacing in IE7 without affecting normal text inputs * Known issue: inner spacing remains in IE6 */ button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; /* 1 */ -webkit-appearance: button; /* 2 */ *overflow: visible; /* 3 */ } /* * Re-set default cursor for disabled elements */ button[disabled], input[disabled] { cursor: default; } /* * 1. Addresses box sizing set to content-box in IE8/9 * 2. Removes excess padding in IE8/9 * 3. Removes excess padding in IE7 Known issue: excess padding remains in IE6 */ input[type="checkbox"], input[type="radio"] { box-sizing: border-box; /* 1 */ padding: 0; /* 2 */ *height: 13px; /* 3 */ *width: 13px; /* 3 */ } /* * 1. Addresses appearance set to searchfield in S5, Chrome * 2. Addresses box-sizing set to border-box in S5, Chrome (include -moz to future-proof) */ input[type="search"] { -webkit-appearance: textfield; /* 1 */ -moz-box-sizing: content-box; -webkit-box-sizing: content-box; /* 2 */ box-sizing: content-box; } /* * Removes inner padding and search cancel button in S5, Chrome on OS X */ input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; } /* * Removes inner padding and border in FF3+ * www.sitepen.com/blog/2008/05/14/the-devils-in-the-details-fixing-dojos-toolbar-buttons/ */ button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; } /* * 1. Removes default vertical scrollbar in IE6/7/8/9 * 2. Improves readability and alignment in all browsers */ textarea { overflow: auto; /* 1 */ vertical-align: top; /* 2 */ } /* ============================================================================= Tables ========================================================================== */ /* * Remove most spacing between table cells */ table { border-collapse: collapse; border-spacing: 0; } iframe { border: none; } /* Display settings: theme colors and font scale (see templates/common/display-settings.js) */ :root { --font-scale: 1; --font-scale-large: 1.35; /* Main text (topic body, comments) grows more than the rest of the content */ --font-scale-text-large: 1.6; --sprite-icons: url(https://hype.retroscene.org/templates/skin/synio-hype-mod/images/icons.png); --bg-header: #000000; } html[data-theme="dark"] { /* The header is black in both themes */ --bg-header: #000000; /* Sprites with dark gray glyphs get lightened copies (tools/display-settings/darken-sprite.mjs) */ --sprite-icons: url(https://hype.retroscene.org/templates/skin/synio-hype-mod/images/icons-dark.png); color-scheme: dark; } html[data-font="large"] { --font-scale: var(--font-scale-large); } html[data-font="large"] .text { --font-scale: var(--font-scale-text-large); } /* Large font: text in the content zone scales (its rules use calc(Npx * var(--font-scale))). Zone roots take the body size explicitly so inherited text scales too. */ #content, #sidebar, .modal { font-size: calc(12px * var(--font-scale)); line-height: calc(18px * var(--font-scale)); } /* Header, menus, votes, toolbars and footer keep their size: their own font rules compute with --font-scale back at 1 */ :where(#header, #footer, .nav, .vote, .vote-count, .toolbar, .dropdown-user-menu, .dropdown-menu) { --font-scale: 1; } /* Fixed parts inside the content zone without their own font rules would inherit the enlarged size: bring it back. Zero specificity, so own rules still win. */ :where(html[data-font="large"] :is(#content, #sidebar, .modal) :is(.nav, .vote, .vote-count, .toolbar, .dropdown-menu)) { font-size: calc(1em / var(--font-scale-large)); } /* tokens:start — generated by tools/display-settings/themeify.mjs, edit values by hand if needed */ :root { --bg-black-0-a60: rgba(0, 0, 0, 0.6); --bg-black-0-a70: rgba(0, 0, 0, 0.7); --bg-black-0-a80: rgba(0, 0, 0, 0.8); --bg-blue-20: #093357; --bg-blue-23: #063573; --bg-blue-45: #0362eb; --bg-blue-58: #228dfa; --bg-blue-60: #1999e2; --bg-blue-62: #3399ff; --bg-blue-69: #22b3fe; --bg-blue-70: #2ab6fe; --bg-blue-72: #2abcfe; --bg-blue-75: #4ec4ff; --bg-blue-76: #88c4ea; --bg-blue-79: #66cfff; --bg-blue-79-2: #64ceff; --bg-blue-92: #d3edf8; --bg-blue-92-2: #c9eeff; --bg-cyan-94: #c8f5ff; --bg-gray-0: #000000; --bg-gray-1: #020202; --bg-gray-2: #090909; --bg-gray-9: #191919; --bg-gray-11: #1d1d1d; --bg-gray-22: #353535; --bg-gray-70: #aaaaaa; --bg-gray-80: #c5c5c5; --bg-gray-82: #cccccc; --bg-gray-88: #dddddd; --bg-gray-91: #e6e6e6; --bg-gray-94: #eeeeee; --bg-gray-94-2: #e0eff9; --bg-gray-95: #f0f2f5; --bg-gray-95-2: #eaf2f8; --bg-gray-96: #f4f4f4; --bg-gray-96-2: #f3f3f3; --bg-gray-96-3: #fef1ec; --bg-gray-97: #f0f7fd; --bg-gray-97-2: #f7f7f7; --bg-gray-97-3: #f1f7fd; --bg-gray-97-4: #edf8fd; --bg-gray-97-5: #f6f8f9; --bg-gray-97-6: #f6f6f6; --bg-gray-97-7: #f5f5f5; --bg-gray-97-8: #f3f7fa; --bg-gray-98: #eefbfc; --bg-gray-98-2: #f8fbfe; --bg-gray-98-3: #fafafa; --bg-gray-98-4: #f9fbfb; --bg-gray-98-5: #f7f8fa; --bg-gray-98-6: #fbf9ee; --bg-gray-99: #fbfcfc; --bg-gray-99-2: #fefef1; --bg-gray-99-3: #fbfbfc; --bg-gray-99-4: #fdfdfd; --bg-gray-99-5: #f5fdff; --bg-gray-100: #ffffff; --bg-gray-100-2: #fffffa; --bg-green-74: #4ace56; --bg-green-83: #6ce777; --bg-green-86: #b0e3ac; --bg-green-92: #cdf5a6; --bg-green-92-2: #cbf4bc; --bg-green-93: #ccf4d0; --bg-green-95: #def7dc; --bg-green-95-2: #dafad8; --bg-green-96: #e4fae2; --bg-green-96-2: #f4f4d9; --bg-green-97: #e9fdea; --bg-green-97-2: #ffff00; --bg-green-98: #feffa3; --bg-green-98-2: #fffea8; --bg-green-98-3: #ffff99; --bg-green-99: #fcfce9; --bg-green-99-2: #ffffcc; --bg-orange-27: #850505; --bg-orange-68: #ff8181; --bg-orange-70: #ff8a8a; --bg-orange-84: #f0c8c8; --bg-orange-85: #ffc8c8; --bg-purple-51: #8961e4; --border-black-0-a80: rgba(0, 0, 0, 0.8); --border-blue-40: #5055b2; --border-blue-42: #275ec2; --border-blue-49: #2770e8; --border-blue-51: #727a90; --border-blue-66: #27ace8; --border-blue-68: #70aae0; --border-blue-72: #57bceb; --border-blue-75: #4ec4ff; --border-blue-78: #aac6d9; --border-gray-0: #000000; --border-gray-11: #1d1d1d; --border-gray-16: #272727; --border-gray-21: #333333; --border-gray-24: #393939; --border-gray-38: #595959; --border-gray-55: #7b848d; --border-gray-59: #878e96; --border-gray-63: #949aa1; --border-gray-63-2: #999999; --border-gray-70: #aaaaaa; --border-gray-76: #bbbbbb; --border-gray-80: #c5c5c5; --border-gray-81: #c9c9c9; --border-gray-82: #cccccc; --border-gray-84: #c3d4dc; --border-gray-85: #d3d3d3; --border-gray-88: #dddddd; --border-gray-89: #dce1e6; --border-gray-90: #dfe3e8; --border-gray-91: #dbe6f0; --border-gray-93: #e7ebed; --border-gray-93-2: #eaeaea; --border-gray-94: #eeeeee; --border-gray-94-2: #e8eef5; --border-gray-94-3: #ededf2; --border-gray-95: #ebf0f4; --border-gray-95-2: #eaf1f7; --border-gray-96: #f1f3f5; --border-gray-97: #edf8fd; --border-gray-99: #fefef1; --border-gray-100: #ffffff; --border-gray-100-2: #fefefe; --border-green-85: #dddb5c; --border-green-86: #bae48e; --border-green-86-2: #afe3ab; --border-green-90: #e6e6bd; --border-green-91: #e8e8c0; --border-green-91-2: #ccefca; --border-green-92: #cdf5a6; --border-green-92-2: #eaeac4; --border-green-93: #ededc9; --border-green-94: #eeeed8; --border-green-95: #f2f2dd; --border-green-96: #e4fae2; --border-green-98: #fffea8; --border-orange-43: #cd0a0a; --border-orange-43-2: #cc0000; --border-orange-53: #ff0000; --border-orange-68: #ff8181; --border-orange-72: #c8a8a8; --border-orange-77: #fea8a8; --border-orange-85: #ffc8c8; --border-purple-51: #8961e4; --border-yellow-79: #eabe21; --border-yellow-90: #ffe25d; --border-yellow-94: #fcefa1; --shadow-black-0-a3: rgba(0, 0, 0, 0.03); --shadow-black-0-a5: rgba(0, 0, 0, 0.05); --shadow-black-0-a7: rgba(0, 0, 0, 0.07); --shadow-black-0-a10: rgba(0, 0, 0, 0.1); --shadow-black-0-a15: rgba(0, 0, 0, 0.15); --shadow-black-0-a20: rgba(0, 0, 0, 0.2); --shadow-black-0-a30: rgba(0, 0, 0, 0.3); --shadow-black-0-a50: rgba(0, 0, 0, 0.5); --shadow-blue-57: #128af3; --shadow-blue-66: #00a8ff; --shadow-blue-66-2: #27ace8; --shadow-blue-79: #55d0ff; --shadow-blue-83: #b4d5e2; --shadow-gray-88: #dddddd; --shadow-gray-90: #dfe3e8; --shadow-gray-92: #e2eaf1; --shadow-gray-100: #ffffff; --shadow-gray-100-a30: rgba(255, 255, 255, 0.3); --shadow-gray-100-a50: rgba(255, 255, 255, 0.5); --shadow-green-82: #acd7a7; --shadow-green-87: #dbdbba; --shadow-green-91: #e8e8c0; --shadow-orange-58: #e95e5e; --text-blue-36: #4b5468; --text-blue-40: #5055b2; --text-blue-42: #275ec2; --text-blue-51: #727a90; --text-blue-53: #727fa0; --text-blue-56: #3f8ad7; --text-blue-57: #628fa5; --text-blue-59: #7b90a5; --text-blue-66: #12aaeb; --text-blue-67: #999ddb; --text-blue-73: #a2b6cd; --text-blue-76: #b4b8ed; --text-blue-77: #7dc6ff; --text-blue-81: #93d3f2; --text-blue-83: #aed6e9; --text-cyan-55: #258fa7; --text-gray-0: #000000; --text-gray-13: #222222; --text-gray-13-2: #212121; --text-gray-21: #333333; --text-gray-23: #363636; --text-gray-28: #434343; --text-gray-31: #4a4a4a; --text-gray-32: #4c4c4c; --text-gray-36: #555555; --text-gray-43: #666666; --text-gray-48: #6c7272; --text-gray-50: #777777; --text-gray-54: #818189; --text-gray-55: #7b848d; --text-gray-57: #888888; --text-gray-57-2: #828a93; --text-gray-59: #878e96; --text-gray-60: #8b9191; --text-gray-63: #949aa1; --text-gray-63-2: #999999; --text-gray-70: #aaaaaa; --text-gray-78: #b9c2c2; --text-gray-83: #cfcfcf; --text-gray-88: #dddddd; --text-gray-94: #eeeeee; --text-gray-100: #ffffff; --text-green-25: #3e3e16; --text-green-51: #148c11; --text-green-54: #139643; --text-green-55: #27964c; --text-green-56: #898953; --text-green-57: #51983c; --text-green-60: #27a736; --text-green-61: #5fa459; --text-green-61-2: #4aa731; --text-green-64: #32b319; --text-green-65: #4bb23b; --text-green-71: #43c70f; --text-green-76: #6bd24b; --text-orange-40: #b22626; --text-orange-43: #cd0a0a; --text-orange-51: #da4242; --text-orange-53: #ff0000; --text-orange-56: #d95f5f; --text-purple-19: #1d2273; --text-purple-29: #4128b1; --text-yellow-85: #f3d50b; --text-yellow-89: #f9de7e; } /* tokens:end */ /* dark-tokens:start */ html[data-theme="dark"] { --bg-black-0-a60: rgba(0, 0, 0, 0.6); --bg-black-0-a70: rgba(0, 0, 0, 0.7); --bg-black-0-a80: rgba(0, 0, 0, 0.8); --bg-blue-20: #1c324d; --bg-blue-23: #1f3361; --bg-blue-45: #002f8a; --bg-blue-58: #00367b; --bg-blue-60: #003a68; --bg-blue-62: #003676; --bg-blue-69: #003562; --bg-blue-70: #003460; --bg-blue-72: #00345b; --bg-blue-75: #003154; --bg-blue-76: #002e44; --bg-blue-79: #002e4a; --bg-blue-79-2: #002f4b; --bg-blue-92: #1b2428; --bg-blue-92-2: #18252b; --bg-cyan-94: #142327; --bg-gray-0: #000000; --bg-gray-1: #020202; --bg-gray-2: #090909; --bg-gray-9: #191919; --bg-gray-11: #1d1d1d; --bg-gray-22: #353535; --bg-gray-70: #404040; --bg-gray-80: #333333; --bg-gray-82: #303030; --bg-gray-88: #282828; --bg-gray-91: #242424; --bg-gray-94: #212121; --bg-gray-94-2: #1d2225; --bg-gray-95: #1e1f20; --bg-gray-95-2: #1d2022; --bg-gray-96: #1e1e1e; --bg-gray-96-2: #1e1e1e; --bg-gray-96-3: #221d1c; --bg-gray-97: #1b1e1f; --bg-gray-97-2: #1d1d1d; --bg-gray-97-3: #1b1d1f; --bg-gray-97-4: #1a1e1f; --bg-gray-97-5: #1c1d1d; --bg-gray-97-6: #1d1d1d; --bg-gray-97-7: #1e1e1e; --bg-gray-97-8: #1c1d1e; --bg-gray-98: #191d1d; --bg-gray-98-2: #1a1b1c; --bg-gray-98-3: #1c1c1c; --bg-gray-98-4: #1b1b1b; --bg-gray-98-5: #1c1c1d; --bg-gray-98-6: #1d1c19; --bg-gray-99: #1b1b1b; --bg-gray-99-2: #1a1b17; --bg-gray-99-3: #1b1b1b; --bg-gray-99-4: #1a1a1a; --bg-gray-99-5: #191b1c; --bg-gray-100: #191919; --bg-gray-100-2: #1a1a18; --bg-green-74: #003700; --bg-green-83: #003000; --bg-green-86: #092909; --bg-green-92: #102400; --bg-green-92-2: #0d2400; --bg-green-93: #0c2310; --bg-green-95: #1a2219; --bg-green-95-2: #0f210e; --bg-green-96: #192018; --bg-green-96-2: #1f1f17; --bg-green-97: #181e18; --bg-green-97-2: #291e00; --bg-green-98: #1f1d00; --bg-green-98-2: #201d00; --bg-green-98-3: #201d00; --bg-green-99: #1c1c16; --bg-green-99-2: #1c1c00; --bg-orange-27: #69140b; --bg-orange-68: #5f0e19; --bg-orange-70: #5b121a; --bg-orange-84: #382a2a; --bg-orange-85: #381b1c; --bg-purple-51: #3a237a; --border-black-0-a80: rgba(0, 0, 0, 0.8); --border-blue-40: #5055b2; --border-blue-42: #275ec2; --border-blue-49: #2770e8; --border-blue-51: #676a72; --border-blue-66: #005e89; --border-blue-68: #445669; --border-blue-72: #345262; --border-blue-75: #00527b; --border-blue-78: #3e484e; --border-gray-0: #000000; --border-gray-11: #1d1d1d; --border-gray-16: #272727; --border-gray-21: #333333; --border-gray-24: #393939; --border-gray-38: #595959; --border-gray-55: #626669; --border-gray-59: #5e6063; --border-gray-63: #585a5d; --border-gray-63-2: #5a5a5a; --border-gray-70: #525252; --border-gray-76: #4a4a4a; --border-gray-80: #454545; --border-gray-81: #434343; --border-gray-82: #424242; --border-gray-84: #3b4043; --border-gray-85: #3f3f3f; --border-gray-88: #3a3a3a; --border-gray-89: #37393b; --border-gray-90: #37383a; --border-gray-91: #34383b; --border-gray-93: #343535; --border-gray-93-2: #353535; --border-gray-94: #333333; --border-gray-94-2: #323436; --border-gray-94-3: #333335; --border-gray-95: #313334; --border-gray-95-2: #303234; --border-gray-96: #313132; --border-gray-97: #2d3032; --border-gray-99: #2d2d29; --border-gray-100: #2c2c2c; --border-gray-100-2: #2c2c2c; --border-green-85: #3d4100; --border-green-86: #264509; --border-green-86-2: #314230; --border-green-90: #38382c; --border-green-91: #37372b; --border-green-91-2: #2f392e; --border-green-92: #203c08; --border-green-92-2: #36372b; --border-green-93: #35352a; --border-green-94: #34342d; --border-green-95: #32322c; --border-green-96: #2c322b; --border-green-98: #2e3100; --border-orange-43: #cd0a0a; --border-orange-43-2: #cc0000; --border-orange-53: #cc1c0b; --border-orange-68: #8f3539; --border-orange-72: #584c4c; --border-orange-77: #5e4040; --border-orange-85: #4b3939; --border-purple-51: #7757bc; --border-yellow-79: #5a4300; --border-yellow-90: #443800; --border-yellow-94: #37341c; --shadow-black-0-a3: rgba(0, 0, 0, 0.03); --shadow-black-0-a5: rgba(0, 0, 0, 0.05); --shadow-black-0-a7: rgba(0, 0, 0, 0.07); --shadow-black-0-a10: rgba(0, 0, 0, 0.1); --shadow-black-0-a15: rgba(0, 0, 0, 0.15); --shadow-black-0-a20: rgba(0, 0, 0, 0.2); --shadow-black-0-a30: rgba(0, 0, 0, 0.3); --shadow-black-0-a50: rgba(0, 0, 0, 0.5); --shadow-blue-57: #142e51; --shadow-blue-66: #002b46; --shadow-blue-66-2: #022b3e; --shadow-blue-79: #002432; --shadow-blue-83: #151f23; --shadow-gray-88: #1b1b1b; --shadow-gray-90: #181a1b; --shadow-gray-92: #16181a; --shadow-gray-100: #131313; --shadow-gray-100-a30: rgba(19, 19, 19, 0.3); --shadow-gray-100-a50: rgba(19, 19, 19, 0.5); --shadow-green-82: #152213; --shadow-green-87: #1c1c12; --shadow-green-91: #1a1a0c; --shadow-orange-58: #4d1f1e; --text-blue-36: #a0a8bd; --text-blue-40: #aca7ff; --text-blue-42: #93acff; --text-blue-51: #848ba0; --text-blue-53: #808ba9; --text-blue-56: #5e97de; --text-blue-57: #628a9e; --text-blue-59: #6e8093; --text-blue-66: #12aaeb; --text-blue-67: #999ddb; --text-blue-73: #a2b6cd; --text-blue-76: #b4b8ed; --text-blue-77: #7dc6ff; --text-blue-81: #93d3f2; --text-blue-83: #aed6e9; --text-cyan-55: #4599ae; --text-gray-0: #eeeeee; --text-gray-13: #d2d2d2; --text-gray-13-2: #d3d3d3; --text-gray-21: #c1c1c1; --text-gray-23: #bebebe; --text-gray-28: #b2b2b2; --text-gray-31: #acacac; --text-gray-32: #aaaaaa; --text-gray-36: #a3a3a3; --text-gray-43: #959595; --text-gray-48: #888d8d; --text-gray-50: #878787; --text-gray-54: #7f7f86; --text-gray-55: #777f88; --text-gray-57: #7b7b7b; --text-gray-57-2: #747b83; --text-gray-59: #71787f; --text-gray-60: #717676; --text-gray-63: #949aa1; --text-gray-63-2: #999999; --text-gray-70: #aaaaaa; --text-gray-78: #b9c2c2; --text-gray-83: #cfcfcf; --text-gray-88: #dddddd; --text-gray-94: #eeeeee; --text-gray-100: #ffffff; --text-green-25: #c4c197; --text-green-51: #65bf54; --text-green-54: #4fb366; --text-green-55: #53af6a; --text-green-56: #908f5e; --text-green-57: #6baa56; --text-green-60: #27a736; --text-green-61: #5fa459; --text-green-61-2: #4aa731; --text-green-64: #32b319; --text-green-65: #4bb23b; --text-green-71: #43c70f; --text-green-76: #6bd24b; --text-orange-40: #ff8e7e; --text-orange-43: #ff8261; --text-orange-51: #ff7c73; --text-orange-53: #ff633f; --text-orange-56: #e97875; --text-purple-19: #d6c5ff; --text-purple-29: #dcb0ff; --text-yellow-85: #f3d50b; --text-yellow-89: #f9de7e; } /* dark-tokens:end */ /* Light-colored background images, redrawn with CSS in the dark theme only (the light theme keeps the original images pixel for pixel) */ html[data-theme="dark"] .block .block-header.sep { background: linear-gradient(var(--border-gray-94), var(--border-gray-94)) 0 100% / 242px 1px no-repeat; } html[data-theme="dark"] #wrapper { background-image: linear-gradient(var(--border-gray-94), var(--border-gray-94)); background-size: 1px 100%; background-position: right 276px top 0; background-repeat: no-repeat; } html[data-theme="dark"] .block.block-type-blogs .block-blog-list li, html[data-theme="dark"] .blog-info li, html[data-theme="dark"] .profile-dotted-list li, html[data-theme="dark"] .registration-form dl.form-item dd .form-item-help.active { background-image: linear-gradient(to right, var(--border-gray-90) 50%, transparent 50%); background-size: 2px 1px; } /* jQuery UI (css/smoothness): its light texture images would cover the dark colors, and its dark icon sets would vanish on them */ html[data-theme="dark"] :is(.ui-widget-content, .ui-widget-header, .ui-state-default, .ui-state-hover, .ui-state-focus, .ui-state-active, .ui-state-highlight, .ui-state-error, .ui-widget-overlay, .ui-widget-shadow) { background-image: none; } html[data-theme="dark"] :is(.ui-icon, .ui-widget-content .ui-icon, .ui-widget-header .ui-icon, .ui-state-hover .ui-icon, .ui-state-focus .ui-icon, .ui-state-active .ui-icon) { background-image: url(https://hype.retroscene.org/templates/skin/synio-hype-mod/css/smoothness/images/ui-icons_888888_256x240.png); } /* Third-party styles from engine/lib/external (not edited there) */ /* prettify: code highlighting */ html[data-theme="dark"] .pln { color: #e3e6ea; } html[data-theme="dark"] .str, html[data-theme="dark"] .atv { color: #a6e22e; } html[data-theme="dark"] .kwd, html[data-theme="dark"] .tag { color: #66d9ef; } html[data-theme="dark"] .com { color: #9a9a86; } html[data-theme="dark"] .typ, html[data-theme="dark"] .atn, html[data-theme="dark"] .dec { color: #d7a6ff; } html[data-theme="dark"] .lit { color: #fd971f; } html[data-theme="dark"] .pun { color: #e6db74; } html[data-theme="dark"] pre.prettyprint { border-color: var(--border-gray-90); } /* markitup: editor (skins/synio, sets/synio) */ html[data-theme="dark"] .markItUp a:link, html[data-theme="dark"] .markItUp a:visited, html[data-theme="dark"] .markItUpHeader ul ul a { color: var(--text-gray-0); } html[data-theme="dark"] .markItUpEditor { background: var(--bg-gray-100); color: var(--text-gray-21); border-color: var(--border-gray-90); } html[data-theme="dark"] .markItUpHeader { background: linear-gradient(to bottom, var(--bg-gray-99) 0%, var(--bg-gray-95) 100%); border-color: var(--border-gray-90); } html[data-theme="dark"] .markItUpHeader ul ul, html[data-theme="dark"] .markItUpHeader ul ul .markItUpDropMenu { background-color: var(--bg-gray-94); border-color: var(--border-gray-0); } html[data-theme="dark"] .markItUpHeader ul ul li { border-color: var(--border-gray-0); } html[data-theme="dark"] .markItUpHeader ul ul a:hover { background-color: var(--bg-gray-100); } html[data-theme="dark"] .markItUpHeader ul .markItUpSeparator { border-left-color: var(--border-gray-90); border-right-color: var(--border-gray-100); } /* Toolbar icons are dark glyphs without text, so inverting them is safe */ html[data-theme="dark"] .markItUpHeader > ul > li > a { filter: invert(0.85); } html[data-theme="dark"] .markItUpPreviewFrame { background-color: var(--bg-gray-100); border-color: var(--border-gray-94); } html[data-theme="dark"] .markItUpPreviewFrame blockquote, html[data-theme="dark"] .markItUpPreviewFrame pre { background: var(--bg-gray-98-3); color: var(--text-gray-21); } /* jcrop: avatar/photo cropping */ html[data-theme="dark"] .jcrop-holder { background-color: var(--bg-gray-0); } /* ------------------------------------------------------------------- ОСНОВНЫЕ СТИЛИ ------------------------------------------------------------------- */ body { font-size: 12px; font-family: Verdana, "Helvetica Neue", Helvetica, Arial, sans-serif; line-height: 18px; color: var(--text-gray-0); background-color: var(--bg-gray-99); } /* Ссылки ---------------------------------------------------- */ a { color: var(--text-blue-56); } a:hover { color: var(--text-orange-53); } .text a:visited { color: var(--text-purple-19); } a.link-dashed { border-bottom: 1px dashed var(--border-blue-40); text-decoration: none; } a.link-dashed:hover { border-color: var(--border-orange-53); } a.link-dotted { text-decoration: none; border-bottom: 1px dotted var(--border-blue-40); } a.link-dotted:hover { border-color: var(--border-orange-53); } /* Заголовки ---------------------------------------------------- */ h2.page-header { color: var(--text-gray-21); font-size: calc(27px * var(--font-scale)); line-height: 1em; font-weight: normal; margin-bottom: 20px; } h2.page-header span { color: var(--text-gray-70); } h2.page-header i { vertical-align: middle; } h2.header-table { margin-bottom: 10px; font-size: calc(22px * var(--font-scale)); font-weight: normal; } h2.header-table a { color: var(--text-blue-42); } h2.header-table span { color: var(--text-gray-63); } /* Шапка сайта ---------------------------------------------------- */ #header .site-name { line-height: 1em; float: left; padding-top: 1px; margin: 0 10px 0 0; } #header .site-name a { color: var(--text-gray-100); text-decoration: none; display: table-cell; width: 128px; height: 48px; text-align: center; vertical-align: middle; } #header .site-name a:hover { color: var(--text-gray-94); } #header .new-messages { position: absolute; top: 0; right: 205px; color: var(--text-yellow-89); font-size: calc(11px * var(--font-scale)); margin-right: 11px; margin-top: 18px; line-height: 1em; text-decoration: none; } #header .new-messages i { position: relative; top: -1px; } .mozilla #header .new-messages i { top: 0; } #header .dropdown-user { width: 89px; height: 51px; line-height: calc(47px * var(--font-scale)); position: absolute; top: 0; right: 0; padding-right: 60px; padding-left: 54px; background: var(--bg-gray-22); background: -moz-linear-gradient(top, #353535 0%, #020202 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,var(--bg-gray-22)), color-stop(100%,var(--bg-gray-1))); background: -webkit-linear-gradient(top, var(--bg-gray-22) 0%,var(--bg-gray-1) 100%); background: -o-linear-gradient(top, #353535 0%,#020202 100%); background: -ms-linear-gradient(top, #353535 0%,#020202 100%); background: linear-gradient(top, #353535 0%,#020202 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#353535', endColorstr='#020202',GradientType=0 ); } #header .dropdown-user.opened { background: var(--bg-gray-11); } #header .dropdown-user .dropdown-user-trigger { position: absolute; top: 0; right: 0; width: 36px; height: 51px; border-left: 1px solid var(--border-gray-16); cursor: pointer; } #header .dropdown-user .dropdown-user-trigger i { position: absolute; top: 23px; left: 14px; height: 0; width: 0; border: 4px solid transparent; border-top-color: var(--border-gray-63); } #header .dropdown-user .dropdown-user-trigger:hover, #header .dropdown-user.opened .dropdown-user-trigger { background: var(--bg-blue-20); } #header .dropdown-user .dropdown-user-trigger:hover i, #header .dropdown-user.opened .dropdown-user-trigger i { border-top-color: var(--border-gray-100); } #header .dropdown-user .dropdown-user-shadow { height: 51px; width: 51px; background: url(https://hype.retroscene.org/templates/skin/synio-hype-mod/images/icons-synio.png) 0 -230px no-repeat; position: absolute; top: 0; right: 36px; } #header .dropdown-user.opened .dropdown-user-shadow { background-position: 0 -281px; } #header .dropdown-user .username { color: var(--text-gray-83); font-size: calc(11px * var(--font-scale)); text-decoration: underline; white-space: nowrap; max-width: 89px; overflow: hidden; display: block; } #header .dropdown-user .username:hover { color: var(--text-gray-70); } #header .dropdown-user .avatar { position: absolute; top: 11px; left: 13px; width: 30px; height: 30px; } .dropdown-user-menu { position: absolute; background: var(--bg-gray-11); border: none; border-top: 1px solid var(--border-gray-0); border-radius: 0 0 10px 10px; -webkit-box-shadow: 0 0 7px var(--shadow-black-0-a50); box-shadow: 0 0 7px var(--shadow-black-0-a50); z-index: 30; } .dropdown-user-menu li { border-bottom: 1px solid var(--border-gray-0); border-top: 1px solid var(--border-gray-24); position: relative; } .dropdown-user-menu li:last-child { border-bottom: none; } .dropdown-user-menu li:last-child a { border-radius: 0 0 10px 10px; } .dropdown-user-menu li.item-stat { padding: 20px 17px; font-size: calc(11px * var(--font-scale)); background: var(--bg-gray-9) url(https://hype.retroscene.org/templates/skin/synio-hype-mod/images/dropdown-user-shadow.png) left bottom repeat-x; } .dropdown-user-menu li.item-stat .rating { color: var(--text-blue-81); } .dropdown-user-menu li.item-stat .rating.negative { color: var(--text-orange-56); } .dropdown-user-menu li.item-stat .rating i { position: relative; top: 2px; } .dropdown-user-menu li.item-stat .strength { color: var(--text-yellow-85); margin-right: 21px; } .dropdown-user-menu li.item-stat .arrow { position: relative; top: 3px; } .dropdown-user-menu li.item-stat .icon-synio-star-small { position: relative; top: 2px; } .dropdown-user-menu li.item-stat .icon-synio-strength { position: relative; top: 1px; } .dropdown-user-menu li a { display: block; zoom: 1; *width: 138px; height: 50px; padding: 0 10px 0 55px; line-height: calc(50px * var(--font-scale)); color: var(--text-gray-100); text-decoration: none; } .dropdown-user-menu li a:hover { background: var(--bg-blue-20); color: var(--text-gray-100); } .dropdown-user-menu li .item-icon { position: absolute; top: 15px; left: 17px; width: 21px; height: 21px; background: url(https://hype.retroscene.org/templates/skin/synio-hype-mod/images/icons-synio.png) no-repeat; } .dropdown-user-menu li.item-messages .item-icon { background-position: 0 0; } .dropdown-user-menu li.item-profile .item-icon { background-position: -23px 0; } .dropdown-user-menu li.item-settings .item-icon { background-position: -46px 0; } .dropdown-user-menu li.item-create .item-icon { background-position: -69px 0; } .dropdown-user-menu li.item-signout .item-icon { background-position: -92px 0; } .dropdown-user-menu li.item-favourite .item-icon { background-position: -115px 0; } .dropdown-user-menu li.item-messages .new { position: absolute; top: 15px; right: 7px; cursor: pointer; color: var(--text-gray-100); border-radius: 15px; border: 2px solid var(--border-yellow-79); line-height: 1em; padding: 2px 7px 3px; } #header .auth { position: absolute; top: 0; right: 0; line-height: calc(49px * var(--font-scale)); font-size: calc(11px * var(--font-scale)); margin-right: 17px; } #header .auth li { float: left; margin-left: 23px; } #header .auth li a { color: var(--text-gray-83); text-decoration: none; } #header .auth li a.sign-in { color: var(--text-blue-77); } /* Футер ---------------------------------------------------- */ #footer .copyright { float: right; width: 255px; } #footer a { color: var(--text-gray-0); } #footer a:hover { color: var(--text-gray-21); } #footer .footer-list { float: left; width: 138px; padding-right: 20px; } #footer .footer-list li { margin-bottom: 3px; } #footer .footer-list .footer-list-header { font-size: calc(12px * var(--font-scale)); font-weight: bold; margin-bottom: 11px; } #footer .footer-list a { color: var(--text-gray-32); } /* Навигация ---------------------------------------------------- */ #nav .button.button-write { float: right; margin-left: 35px; margin-top: 1px; } #nav .search-header { float: right; } #nav .search-header .search-header-show { font-size: calc(11px * var(--font-scale)); margin-top: 4px; } #nav .search-header .search-header-show a { color: var(--text-gray-59); border-color: var(--border-gray-59); } #nav .search-header .search-header-show a:hover { color: var(--text-orange-53); border-color: var(--border-orange-53); } #nav .search-header .search-header-form { position: relative; top: 0px; } #nav .search-header .search-header-form .input-text { padding: 4px 25px 4px 5px; width: 290px; } #nav .search-header .search-header-form .input-submit { position: absolute; top: 5px; right: 5px; width: 16px; height: 16px; border: none; background: url(https://hype.retroscene.org/templates/skin/synio-hype-mod/images/icons-synio.png) -115px -55px no-repeat; } /* Stat ---------------------------------------------------- */ .stat-performance { width: 910px; margin: 0 auto 20px; padding: 15px 20px; background: var(--bg-gray-100); border-top: 1px solid var(--border-gray-94); border-bottom: 1px solid var(--border-gray-94); } .stat-performance table { } .stat-performance table td { width: 200px; vertical-align: top; } .stat-performance h4 { font-weight: bold; } /* Userfeed ---------------------------------------------------- */ .userfeed-get-more {display:block; width:90%; margin:0px auto; text-align:center; height:2.5em; padding-top:1em;} .userfeed-get-more:hover { background: var(--bg-gray-97);} .userfeed_loading {background: var(--bg-gray-97-2) url(https://hype.retroscene.org/templates/skin/synio-hype-mod/images/loader.gif) no-repeat center;} /* Stream ---------------------------------------------------- */ .stream-get-more { margin-top: 50px; border-radius: 5px; display: block; text-align: center; padding: 12px 0; color: var(--text-cyan-55); text-decoration: none; background: var(--bg-gray-98); background: -moz-linear-gradient(top, #eefbfc 0%, #d3edf8 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,var(--bg-gray-98)), color-stop(100%,var(--bg-blue-92))); background: -webkit-linear-gradient(top, var(--bg-gray-98) 0%,var(--bg-blue-92) 100%); background: -o-linear-gradient(top, #eefbfc 0%,#d3edf8 100%); background: -ms-linear-gradient(top, #eefbfc 0%,#d3edf8 100%); background: linear-gradient(top, #eefbfc 0%,#d3edf8 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eefbfc', endColorstr='#d3edf8',GradientType=0 ); } .stream-get-more:hover { background: var(--bg-gray-98); color: var(--text-cyan-55); } .stream-get-more.loader { background-image: url(https://hype.retroscene.org/templates/skin/synio-hype-mod/images/loader.gif); background-repeat: no-repeat; background-position: 50% 50%; } .stream_loading { background: var(--bg-gray-97-2) url(https://hype.retroscene.org/templates/skin/synio-hype-mod/images/loader.gif) no-repeat center; } .stream-comment-preview { position: relative; padding: 5px 10px 6px; background: var(--bg-gray-99-2); color: var(--text-gray-23); margin-top: 13px; font-size: calc(11px * var(--font-scale)); border-radius: 3px; -webkit-box-shadow: 0 2px 4px var(--shadow-green-91) inset; box-shadow: 0 2px 4px var(--shadow-green-91) inset; } .stream-comment-preview:after { display: block; content: ""; position: absolute; top: -12px; left: 15px; width: 0; height: 0; border-width: 6px; border-color: transparent transparent var(--border-green-91) transparent; border-style: solid; } .stream-list { margin: 0 0 20px; } .stream-list li.stream-item { margin-bottom: 23px; min-height: 48px; _height: 48px; border-bottom: 1px solid var(--border-gray-93); padding: 0 0 20px 60px; position: relative; } .stream-list li.stream-item:last-child { border: none; } .stream-list li.stream-item .info { color: var(--text-gray-78); font-size: calc(11px * var(--font-scale)); line-height: 1em; margin-bottom: 8px; } .stream-list li.stream-item .info a { color: var(--text-blue-42); } .stream-list li.stream-item .info .date { color: var(--text-gray-54); } .stream-list li.stream-item .avatar { position: absolute; top: 0; left: 0; } .stream-list li.stream-item .user-avatar { margin-left: 3px; } .stream-list li.stream-header-date { font-size: calc(16px * var(--font-scale)); color: var(--text-gray-63-2); font-family: 'PT Sans', sans-serif; margin-top: 50px; margin-bottom: 20px; padding-bottom: 5px; border-bottom: 1px solid var(--border-gray-94); } /* Userfields ---------------------------------------------------- */ .userfield-list { width: 450px; } .userfield-list li { background: var(--bg-gray-94); margin-bottom: 1px; padding: 10px 10px; overflow: hidden; zoom: 1; line-height: calc(12px * var(--font-scale)); color: var(--text-gray-50); } .userfield-list li .userfield-actions { float: right; } .userfield-list li .userfield_admin_name { font-weight: bold; color: var(--text-gray-21); } .userfield-add { text-decoration: none; border-bottom: 1px dashed var(--border-blue-68); } .userfield-add:hover { color: var(--text-gray-21); border-color: var(--border-gray-21); } /* Talk ---------------------------------------------------- */ .talk-search { padding: 15px; background: var(--bg-gray-98-2); border-radius: 5px; margin-bottom: 35px; } .talk-search header { position: relative; min-height: 27px; } .talk-search header .close { position: absolute; top: 3px; right: 0; font-size: calc(11px * var(--font-scale)); cursor: pointer; } .talk-search .talk-search-content { display: none; padding-top: 15px; border-top: 1px solid var(--border-gray-100); } .talk-search .talk-search-content p { margin-bottom: 25px; } .talk-search.opened header { border-bottom: 1px solid var(--border-gray-94-2); padding-bottom: 15px; } .talk-search.opened .talk-search-content { display: block; } .talk-search.talk-friends header .close { left: 0; right: auto; } .talk-search.talk-friends .friend-list { margin-bottom: 15px; font-weight: bold; } .talk-search.talk-friends .friend-list li { margin-bottom: 5px; } .talk-blacklist-form { padding: 15px; background: var(--bg-gray-98-2); border-radius: 5px; margin-bottom: 15px; } /* Misc ---------------------------------------------------- */ .avatar-edit { margin-bottom: 15px; } .avatar-edit img { vertical-align: bottom; } .avatar-edit label { margin-top: 10px; } .drafts { float: right; font-size: calc(11px * var(--font-scale)); color: var(--text-blue-42); } .content-error { padding: 110px 160px; } .content-error h2.page-header { font-weight: bold; font-size: calc(30px * var(--font-scale)); margin-bottom: 35px; } .content-error a { color: var(--text-blue-51); } .content-error a:hover { color: var(--text-orange-53); } .help { display: none; position: relative; padding: 10px 7px 13px; background: var(--bg-gray-99-2); color: var(--text-gray-23); margin-top: 13px; font-size: calc(11px * var(--font-scale)); border-radius: 3px; -webkit-box-shadow: 0 0 5px var(--shadow-green-91) inset; box-shadow: 0 0 5px var(--shadow-green-91) inset; } .help:before { display: block; content: ""; position: absolute; top: -12px; left: 15px; width: 0; height: 0; border-width: 6px; border-color: transparent transparent var(--border-green-95) transparent; border-style: solid; } .help .help-col { float: left; width: 230px; padding: 0 10px; } .help .help-col.help-wide { float: none; width: 96%; } .help .help-item { margin-bottom: 20px; } .help .help-item:last-child { margin-bottom: 0; } .help .help-item h4 { font-family: Verdana, sans-serif; font-size: calc(11px * var(--font-scale)); color: var(--text-blue-51); font-weight: bold; } .help .help-item h4 a { color: var(--text-blue-51); border-bottom: 1px dotted var(--border-blue-51); } .link-dotted.help-link { font-size: calc(11px * var(--font-scale)); color: var(--text-gray-0); border-color: var(--border-gray-0); } /* ------------------------------------------------------------------- // markItUp! Universal MarkUp Engine, JQuery plugin // By Jay Salvat - http: //markitup.jaysalvat.com/ // ------------------------------------------------------------------*/ .markItUp a: link, .markItUp a: visited { color: #000; text-decoration: none; } .markItUp { margin-bottom: 5px; } .markItUpContainer { font: 11px Verdana, Arial, Helvetica, sans-serif; } .markItUpEditor { font: 12px "Courier New", Courier, monospace; padding: 5px; height: 400px; line-height: 18px; overflow: auto; width: 100%; -moz-box-sizing: border-box; box-sizing: border-box; border: 1px solid #dfe3e8; } .markItUpPreviewFrame { overflow: auto; background-color: #FFF; border: 1px solid #eee; padding: 10px; height: 300px; margin: 5px 0; font: 12px Tahoma, Arial, Helvetica, sans-serif; } .markItUpFooter { width: 100%; } .markItUpResizeHandle { overflow: hidden; height: 8px; background: url(https://hype.retroscene.org/engine/lib/external/jquery/markitup/skins/synio/images/handle.png) 50% 3px no-repeat; cursor: n-resize; } /***************************************************************************************/ /* first row of buttons */ .markItUpHeader { background: #fbfcfc; background: -moz-linear-gradient(top, #fbfcfc 0%, #f0f2f5 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fbfcfc), color-stop(100%,#f0f2f5)); background: -webkit-linear-gradient(top, #fbfcfc 0%,#f0f2f5 100%); background: -o-linear-gradient(top, #fbfcfc 0%,#f0f2f5 100%); background: -ms-linear-gradient(top, #fbfcfc 0%,#f0f2f5 100%); background: linear-gradient(top, #fbfcfc 0%,#f0f2f5 100%); border-radius: 3px 3px 0 0; padding: 7px 10px 5px; border-top: 1px solid #dfe3e8; border-left: 1px solid #dfe3e8; border-right: 1px solid #dfe3e8; } .markItUpHeader ul { overflow: visible; zoom: 1; display: inline-block; *display: inline; /* ie <= 7 */ } .markItUpHeader ul li { list-style: none; float: left; position: relative; margin-right: 10px; } .markItUpHeader ul li: hover > ul{ display: block; } .markItUpHeader ul .markItUpDropMenu { background: transparent url(https://hype.retroscene.org/engine/lib/external/jquery/markitup/skins/synio/images/menu.png) no-repeat 115% 50%; margin-right: 5px; } .markItUpHeader ul .markItUpDropMenu li { margin-right: 0px; } /* next rows of buttons */ .markItUpHeader ul ul { display: none; position: absolute; top: 16px; left: 0px; background: #eee; border: 1px solid #000; } .markItUpHeader ul ul li { float: none; border-bottom: 1px solid #000; } .markItUpHeader ul ul .markItUpDropMenu { background: #eee url(https://hype.retroscene.org/engine/lib/external/jquery/markitup/skins/synio/images/submenu.png) no-repeat 100% 50%; } .markItUpHeader ul .markItUpSeparator { margin: 0 10px 0 0; width: 0; height: 16px; overflow: hidden; border-left: 1px solid #dfe3e8; border-right: 1px solid #fff; } .markItUpHeader ul ul .markItUpSeparator { width: auto; height: 1px; margin: 0px; } /* next rows of buttons */ .markItUpHeader ul ul ul { position: absolute; top: -1px; left: 150px; } .markItUpHeader ul ul ul li { float: none; } .markItUpHeader ul a { display: block; width: 16px; height: 16px; text-indent: -10000px; background-repeat: no-repeat; margin: 0px; } .markItUpHeader ul ul a { display: block; padding-left: 0px; text-indent: 0; width: 120px; padding: 5px 5px 5px 25px; background-position: 2px 50%; color: #000; text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow:ellipsis; } .markItUpHeader ul ul a:hover { background-color: #fff; } .markItUpPreviewFrame { } .markItUpPreviewFrame p { margin-bottom: 18px; } .markItUpPreviewFrame blockquote { background: #fafafa; padding: 10px 15px; color: #555; margin-bottom: 5px; clear: both; } .markItUpPreviewFrame pre { background: #fafafa; border: 1px solid #dce6f0; margin-bottom: 10px; overflow: auto; padding: 5px 10px; } .markItUpPreviewFrame ul { list-style-type: disc; margin-left: 17px; } .markItUpPreviewFrame ol { list-style-type: decimal; margin-left: 22px; } .markItUpPreviewFrame img[align="right"] { margin: 4px 0 5px 15px; } .markItUpPreviewFrame img[align="left"] { margin: 4px 15px 10px 0; } /* ------------------------------------------------------------------- // markItUp! // By Jay Salvat - http://markitup.jaysalvat.com/ // ------------------------------------------------------------------*/ .markItUp a { background: url(https://hype.retroscene.org/engine/lib/external/jquery/markitup/sets/synio/images/icons.png) no-repeat; } .markItUp .editor-h4 a { background-position: -11px -9px; } .markItUp .editor-h5 a { background-position: -39px -9px; } .markItUp .editor-h6 a { background-position: -65px -9px; } .markItUp .editor-bold a { background-position: -107px -9px; } .markItUp .editor-italic a { background-position: -134px -9px; } .markItUp .editor-stroke a { background-position: -188px -9px; } .markItUp .editor-underline a { background-position: -161px -9px; } .markItUp .editor-quote a { background-position: -326px -9px; } .markItUp .editor-code a { background-position: -353px -9px; } .markItUp .editor-ul a { background-position: -257px -9px; } .markItUp .editor-ol a { background-position: -230px -9px; } .markItUp .editor-li a { background-position: -550px -9px; } .markItUp .editor-picture a { background-position: -423px -9px; } .markItUp .editor-image a { background-position: -423px -9px; } .markItUp .editor-link a { background-position: -299px -9px; } .markItUp .editor-clean a { background-position: -519px -9px; } .markItUp .editor-preview a { background-position: -11px -9px; } .markItUp .editor-cut a { background-position: -491px -9px; } .markItUp .editor-video a { background-position: -450px -9px; } .markItUp .editor-user a { background-position: -380px -9px; }/* Fixes issue here http://code.google.com/p/jcrop/issues/detail?id=1 */ .jcrop-holder { text-align: left; } .jcrop-vline, .jcrop-hline { font-size: 0px; position: absolute; background: white url(https://hype.retroscene.org/engine/lib/external/jquery/jcrop/Jcrop.gif) top left repeat; } .jcrop-vline { height: 100%; width: 1px !important; } .jcrop-hline { width: 100%; height: 1px !important; } .jcrop-vline.right { right: 0px; } .jcrop-hline.bottom { bottom: 0px; } .jcrop-handle { font-size: 1px; width: 7px !important; height: 7px !important; border: 1px #eee solid; background-color: #333; } .jcrop-tracker { width: 100%; height: 100%; } .custom .jcrop-vline, .custom .jcrop-hline { background: yellow; } .custom .jcrop-handle { border-color: black; background-color: #C7BB00; -moz-border-radius: 3px; -webkit-border-radius: 3px; } .str{color:#080}.kwd{color:#008}.com{color:#800}.typ{color:#606}.lit{color:#066}.pun{color:#660}.pln{color:#000}.tag{color:#008}.atn{color:#606}.atv{color:#080}.dec{color:#606}pre.prettyprint{padding:2px;border:1px solid #888}@media print{.str{color:#060}.kwd{color:#006;font-weight:bold}.com{color:#600;font-style:italic}.typ{color:#404;font-weight:bold}.lit{color:#044}.pun{color:#440}.pln{color:#000}.tag{color:#006;font-weight:bold}.atn{color:#404}.atv{color:#060}}/* -------------------------------------------- СЕТКА -------------------------------------------- */ #container { margin: 0 auto; margin-bottom: 20px; padding: 0 48px; } #header-back { position: absolute; top: 0; left: 0; width: 100%; height: 51px; background: var(--bg-header); } #header { background-color: var(--bg-header); height: 51px; margin: 0 auto; position: relative; padding-right: 270px; } #nav { min-height: 26px; margin-bottom: 32px; overflow: hidden; padding: 12px 17px 15px; -webkit-box-shadow: 0 0 10px var(--shadow-black-0-a15); box-shadow: 0 0 10px var(--shadow-black-0-a15); border-radius: 0 0 10px 10px; position: relative; background: var(--bg-gray-99-4); background: -moz-linear-gradient(top, #fdfdfd 0%, #f6f8f9 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,var(--bg-gray-99-4)), color-stop(100%,var(--bg-gray-97-5))); background: -webkit-linear-gradient(top, var(--bg-gray-99-4) 0%,var(--bg-gray-97-5) 100%); background: -o-linear-gradient(top, #fdfdfd 0%,#f6f8f9 100%); background: -ms-linear-gradient(top, #fdfdfd 0%,#f6f8f9 100%); background: linear-gradient(top, #fdfdfd 0%,#f6f8f9 100%); } #wrapper { overflow: hidden; zoom: 1; padding: 20px 16px 20px 27px; margin-bottom: 60px; background: var(--bg-gray-100) url(https://hype.retroscene.org/templates/skin/synio-hype-mod/images/sidebar-border.png) 100% 0px repeat-y; border-bottom: 1px solid var(--border-gray-94); -webkit-box-shadow: 0 0 5px var(--shadow-black-0-a5); box-shadow: 0 0 5px var(--shadow-black-0-a5); border-radius: 10px; } #content { min-height: 1px; margin-right: 295px; background: var(--bg-gray-100); position: relative; } #sidebar { float: right; width: 240px; } #footer { overflow: hidden; zoom: 1; margin-bottom: 20px; padding: 0 0 50px 30px; font-size: calc(11px * var(--font-scale)); } #wrapper.no-sidebar { background-image: none; } #wrapper.no-sidebar #content { width: 100%; margin-right: 0; } #container.toolbar-margin { padding: 0; } #container.toolbar-margin #wrapper { margin-right: 48px; } /* ------------------------------------------------------------------- ОБЩИЕ СТИЛИ ------------------------------------------------------------------- */ /* Голосование ---------------------------------------------------- */ .vote-topic { height: 24px; border-radius: 15px; overflow: hidden; font-size: calc(11px * var(--font-scale)); float: left; zoom: 1; } .vote-topic .vote-item { cursor: pointer; overflow: hidden; display: block; float: left; height: 22px; border: 1px solid var(--border-gray-90); background: var(--bg-gray-99-3); background: -moz-linear-gradient(top, #fbfbfc 0%, #f0f2f5 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,var(--bg-gray-99-3)), color-stop(100%,var(--bg-gray-95))); background: -webkit-linear-gradient(top, var(--bg-gray-99-3) 0%,var(--bg-gray-95) 100%); background: -o-linear-gradient(top, #fbfbfc 0%,#f0f2f5 100%); background: -ms-linear-gradient(top, #fbfbfc 0%,#f0f2f5 100%); background: linear-gradient(top, #fbfbfc 0%,#f0f2f5 100%); } .vote-topic .vote-item i { width: 16px; height: 16px; display: block; background: url(https://hype.retroscene.org/templates/skin/synio-hype-mod/images/icons-synio.png) no-repeat; } .vote-topic .vote-item span { display: block; border-right: 1px solid var(--border-gray-100); border-top: 1px solid var(--border-gray-100-2); } .vote-topic .vote-item.vote-up { border-radius: 0 15px 15px 0; } .vote-topic .vote-item.vote-up i { background-position: -83px -23px; } .vote-topic .vote-item.vote-up span { padding: 2px 7px 3px 4px; border-radius: 0 15px 15px 0; } .vote-topic.not-voted .vote-item.vote-up:hover { background: var(--bg-green-96); background: -moz-linear-gradient(top, #e4fae2 0%, #b0e3ac 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,var(--bg-green-96)), color-stop(100%,var(--bg-green-86))); background: -webkit-linear-gradient(top, var(--bg-green-96) 0%,var(--bg-green-86) 100%); background: -o-linear-gradient(top, #e4fae2 0%,#b0e3ac 100%); background: -ms-linear-gradient(top, #e4fae2 0%,#b0e3ac 100%); background: linear-gradient(top, #e4fae2 0%,#b0e3ac 100%); border-color: var(--border-green-96) var(--border-green-91-2) var(--border-green-86-2); } .vote-topic.not-voted .vote-item.vote-up:hover i { background-position: -83px -39px; } .vote-topic.not-voted .vote-item.vote-up:hover span { border-color: transparent; } .vote-topic .vote-item.vote-count { color: var(--text-blue-57); line-height: calc(23px * var(--font-scale)); border-left: transparent; border-right: transparent; } .vote-topic .vote-item.vote-count i { background-position: -99px -23px; margin-top: 1px; } .vote-topic .vote-item.vote-count span { padding: 1px 4px 5px 5px; } .topic .vote-topic.vote-not-self.not-voted.vote-not-expired .vote-item.vote-count:hover { background: var(--bg-blue-75); background: -moz-linear-gradient(top, #4ec4ff 0%, #22b3fe 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,var(--bg-blue-75)), color-stop(100%,var(--bg-blue-69))); background: -webkit-linear-gradient(top, var(--bg-blue-75) 0%,var(--bg-blue-69) 100%); background: -o-linear-gradient(top, #4ec4ff 0%,#22b3fe 100%); background: -ms-linear-gradient(top, #4ec4ff 0%,#22b3fe 100%); background: linear-gradient(top, #4ec4ff 0%,#22b3fe 100%); -webkit-box-shadow: 0 -1px 0 var(--shadow-gray-100-a30) inset; box-shadow: 0 -1px 0 var(--shadow-gray-100-a30) inset; border-color: var(--border-blue-66); } .vote-topic.not-voted .vote-item.vote-count:hover i { background-position: -99px -87px; } .vote-topic.not-voted .vote-item.vote-count:hover span { border-color: transparent; } .vote-topic .vote-item.vote-down { border-radius: 15px 0 0 15px; } .vote-topic .vote-item.vote-down i { background-position: -67px -23px; } .vote-topic .vote-item.vote-down span { padding: 2px 4px 3px 7px; } .vote-topic.not-voted .vote-item.vote-down:hover { background: var(--bg-orange-85); background: -moz-linear-gradient(top, #ffc8c8 0%, #ff8181 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,var(--bg-orange-85)), color-stop(100%,var(--bg-orange-68))); background: -webkit-linear-gradient(top, var(--bg-orange-85) 0%,var(--bg-orange-68) 100%); background: -o-linear-gradient(top, #ffc8c8 0%,#ff8181 100%); background: -ms-linear-gradient(top, #ffc8c8 0%,#ff8181 100%); background: linear-gradient(top, #ffc8c8 0%,#ff8181 100%); border-color: var(--border-orange-85) var(--border-orange-77) var(--border-orange-68); } .vote-topic.not-voted .vote-item.vote-down:hover i { background-position: -67px -55px; } .vote-topic.not-voted .vote-item.vote-down:hover span { border-color: transparent; } .vote-topic.voted { -webkit-box-shadow: 0 2px 3px var(--shadow-black-0-a20) inset; box-shadow: 0 2px 3px var(--shadow-black-0-a20) inset; } .vote-topic.voted-down { padding: 0; } .vote-topic.voted-down .vote-item { border: none; background: none; } .vote-topic.voted-down .vote-item span { border: none; } .vote-topic.voted-down .vote-item.vote-down { display: none; } .vote-topic.voted-down .vote-item.vote-up span { padding: 4px 8px 3px 4px; } .vote-topic.voted-down .vote-item.vote-count { color: var(--text-orange-51); } .vote-topic.voted-down .vote-item.vote-count span { padding: 0 3px 0 10px !important; } .vote-topic.vote-count-positive.voted-down .vote-item.vote-up i { background-position: -67px -39px; } .vote-topic.vote-count-negative.voted-down .vote-item.vote-up i { background-position: -67px -55px; } .vote-topic.voted-up { padding: 0; } .vote-topic.voted-up .vote-item { border: none; background: none; } .vote-topic.voted-up .vote-item span { border: none; } .vote-topic.voted-up .vote-item.vote-down { display: none; } .vote-topic.voted-up .vote-item.vote-up span { padding: 4px 8px 3px 4px; } .vote-topic.voted-up .vote-item.vote-count { float: left; color: var(--text-green-61); } .vote-topic.voted-up .vote-item.vote-count span { padding: 0 3px 0 10px !important; } .vote-topic.vote-count-positive.voted-up .vote-item.vote-up i { background-position: -83px -39px; } .vote-topic.vote-count-negative.voted-up .vote-item.vote-up i { background-position: -83px -55px; } .vote-topic.voted-zero { padding: 0; } .vote-topic.voted-zero .vote-item { border: none; background: none; } .vote-topic.voted-zero .vote-item span { border: none; } .vote-topic.voted-zero .vote-item.vote-down { display: none; } .vote-topic.voted-zero .vote-item.vote-up { } .vote-topic.voted-zero .vote-item.vote-up i { width: 16px; background-position: -99px -23px; } .vote-topic.voted-zero .vote-item.vote-up span { padding: 4px 8px 3px 4px; } .vote-topic.voted-zero .vote-item.vote-count { float: left; color: var(--text-green-61); } .vote-topic.voted-zero .vote-item.vote-count span { padding: 0 3px 0 10px !important; } .vote-topic.vote-count-positive.voted-zero .vote-item.vote-up i { background-position: -99px -39px; } .vote-topic.vote-count-negative.voted-zero .vote-item.vote-up i { background-position: -99px -55px; } .vote-topic.vote-count-positive.vote-nobuttons, .vote-topic.vote-count-positive .vote-item.vote-count { -webkit-box-shadow: 0 2px 3px var(--shadow-green-82) inset; box-shadow: 0 2px 3px var(--shadow-green-82) inset; } .vote-topic.vote-count-negative.vote-nobuttons, .vote-topic.vote-count-negative .vote-item.vote-count { -webkit-box-shadow: 0 2px 3px var(--shadow-orange-58) inset; box-shadow: 0 2px 3px var(--shadow-orange-58) inset; } .vote-topic.vote-count-zero.vote-nobuttons, .vote-topic.vote-count-zero .vote-item.vote-count { -webkit-box-shadow: 0 2px 3px var(--shadow-blue-83) inset; box-shadow: 0 2px 3px var(--shadow-blue-83) inset; } .vote-topic.vote-nobuttons { } .vote-topic.vote-nobuttons .vote-item { border: none; } .vote-topic.vote-nobuttons .vote-item span { border: none; } .vote-topic.vote-nobuttons .vote-item.vote-up, .vote-topic.vote-nobuttons .vote-item.vote-down { display: none; } .vote-topic.vote-nobuttons .vote-item.vote-count { border-radius: 15px; padding: 0 5px; -webkit-box-shadow: none; box-shadow: none; } .vote-topic.vote-count-positive .vote-item.vote-count { background: var(--bg-green-95); color: var(--text-green-61); height: 24px; border: none; } .vote-topic.vote-count-positive .vote-item.vote-count span { border: none; padding: 0 7px; } .vote-topic.vote-count-positive.voted { background: var(--bg-green-95); } .vote-topic.vote-count-positive.voted .vote-item.vote-count, .vote-topic.vote-count-positive.vote-nobuttons .vote-item.vote-count { -webkit-box-shadow: none; box-shadow: none; background: none; } .vote-topic.vote-count-positive.vote-nobuttons { background: var(--bg-green-95); } .vote-topic.vote-count-negative .vote-item.vote-count { background: var(--bg-orange-70); color: var(--text-orange-51); height: 24px; border: none; } .vote-topic.vote-count-negative .vote-item.vote-count span { border: none; padding: 0 7px; } .vote-topic.vote-count-negative.voted { background: var(--bg-orange-70); } .vote-topic.vote-count-negative.voted .vote-item.vote-count, .vote-topic.vote-count-negative.vote-nobuttons .vote-item.vote-count { -webkit-box-shadow: none; box-shadow: none; background: none; } .vote-topic.vote-count-negative.vote-nobuttons { background: var(--bg-orange-70); } .vote-topic.vote-count-zero .vote-item.vote-count { background: var(--bg-gray-97-4); color: var(--text-blue-57); height: 24px; border: none; } .vote-topic.vote-count-zero .vote-item.vote-count span { border: none; padding: 0 7px; } .vote-topic.vote-count-zero.voted { background: var(--bg-gray-97-4); } .vote-topic.vote-count-zero.voted .vote-item.vote-count, .vote-topic.vote-count-zero.vote-nobuttons .vote-item.vote-count { -webkit-box-shadow: none; box-shadow: none; background: none; } .vote-topic.vote-count-zero.vote-nobuttons { background: var(--bg-gray-97-4); } /* Избранное ---------------------------------------------------- */ .favourite { display: inline-block; width: 11px; height: 11px; vertical-align: text-top; background: url(https://hype.retroscene.org/templates/skin/synio-hype-mod/images/icons-synio.png) 0 -37px no-repeat; cursor: pointer; } .favourite.active { background-position: 0 -65px; } .favourite-count { margin-left: 0; } .follow { display: inline-block; width: 17px; height: 17px; vertical-align: text-top; background: url(https://hype.retroscene.org/templates/skin/synio-hype-mod/images/icons-synio.png) 0 -76px no-repeat; cursor: pointer; } .follow.active { background-position: -17px -76px; } /* Пагинация ---------------------------------------------------- */ .pagination { overflow: hidden; zoom: 1; } .pagination ul { overflow: hidden; zoom: 1; line-height: 1em; float: left; margin-top: 5px; } .pagination ul li { float: left; margin-right: 5px; } .pagination ul li span { color: var(--text-gray-70); } .pagination ul li span, .pagination ul li a { float: left; padding: 4px 6px;} .pagination ul li a:hover { } .pagination ul li.active span { color: var(--text-gray-21); border: 1px solid var(--border-gray-94); border-radius: 4px; } .pagination ul li i { opacity: .5; filter: alpha(opacity=50); } .pagination ul li.prev span, .pagination ul li.prev a { padding-left: 0; } .pagination ul li.next { margin-right: 50px; } /* Actions ---------------------------------------------------- */ .actions { overflow: hidden; zoom: 1; margin-bottom: 10px; font-size: calc(11px * var(--font-scale)); } .actions li { float: left; margin-right: 10px; } /* Toolbar ---------------------------------------------------- */ .toolbar { position: fixed; top: 136px; z-index: 20; display: none; } .toolbar section { width: 25px; padding: 8px; overflow: hidden; line-height: calc(14px * var(--font-scale)); background: var(--bg-gray-100); -webkit-box-shadow: 0 0 5px var(--shadow-black-0-a3); box-shadow: 0 0 5px var(--shadow-black-0-a3); margin-bottom: 10px; border-radius: 10px; } .toolbar section i { display: block; width: 25px; height: 25px; } /* Admin button */ .toolbar .toolbar-admin i { background: url(https://hype.retroscene.org/templates/skin/synio-hype-mod/images/icons-synio.png) -268px -23px no-repeat; } .toolbar .toolbar-admin i:hover { background-position: -268px -48px; } .toolbar .toolbar-admin i:active { background-position: -268px -73px; } /* Update comments button */ .toolbar .toolbar-update { } .toolbar .toolbar-update .update-comments { } .toolbar .toolbar-update .update-comments i { background: url(https://hype.retroscene.org/templates/skin/synio-hype-mod/images/update.gif) no-repeat; } .toolbar .toolbar-update .update-comments.active i { background-position: -25px 0; } /* Modified by byuk */ .toolbar .toolbar-update .new-comments { display: block; background-color: var(--bg-gray-98-5); border: 1px solid var(--border-gray-90); border-radius: 5px; margin-top: 15px; padding: 5px 0; font-size: calc(13px * var(--font-scale)); font-weight: bold; color: var(--text-green-57); text-align: center; text-decoration: none; width: 25px; } .toolbar .toolbar-update .new-comments:hover { background-color: var(--bg-blue-70); color: var(--text-gray-100); } /* Topic navigation */ .toolbar .toolbar-topic { width: 19px; padding: 11px; } .toolbar .toolbar-topic a.toolbar-topic-prev i { display: block; width: 19px; height: 32px; background: url(https://hype.retroscene.org/templates/skin/synio-hype-mod/images/icons-synio.png) -211px -23px no-repeat; } .toolbar .toolbar-topic a.toolbar-topic-prev i:hover { background-position: -230px -23px; } .toolbar .toolbar-topic a.toolbar-topic-prev i:active { background-position: -249px -23px; } .toolbar .toolbar-topic a.toolbar-topic-next i { display: block; width: 19px; height: 32px; background: url(https://hype.retroscene.org/templates/skin/synio-hype-mod/images/icons-synio.png) -211px -55px no-repeat; } .toolbar .toolbar-topic a.toolbar-topic-next i:hover { background-position: -230px -55px; } .toolbar .toolbar-topic a.toolbar-topic-next i:active { background-position: -249px -55px; } /* Scroll up */ .toolbar .toolbar-scrollup { display: none; } .toolbar .toolbar-scrollup i { background: url(https://hype.retroscene.org/templates/skin/synio-hype-mod/images/icons-synio.png) -294px -23px no-repeat; } .toolbar .toolbar-scrollup i:hover { background-position: -294px -48px; } .toolbar .toolbar-scrollup i:active { background-position: -294px -73px; } /* Список пользователей ---------------------------------------------------- */ .user-list-avatar { overflow: hidden; zoom: 1; } .user-list-avatar li { width: 48px; overflow: hidden; float: left; margin-right: 12px; margin-bottom: 12px; text-align: center; font-size: calc(11px * var(--font-scale)); } .user-list-avatar li img { margin-bottom: 2px; display: block; } .user-list-mini li { padding: 0 25px 4px 5px; margin-bottom: 0; position: relative; } .user-list-mini li img { width: 17px; height: 17px; position: relative; top: 4px; margin-right: 2px; } .user-list-mini li input { position: relative; top: 2px; } .user-list-mini li i { position: absolute; top: 4px; right: 5px; cursor: pointer; display: none; } .user-list-mini li:hover { background: var(--bg-green-99); } .user-list-mini li:hover i { display: block; } /* Поиск ---------------------------------------------------- */ .search { margin-bottom: 20px; position: relative; } .search .input-text { padding-right: 25px; } .search .input-submit { border: none; width: 16px; height: 16px; position: absolute; top: 6px; right: 5px; opacity: .7; filter: alpha(opacity=70); } .search .input-submit:hover { opacity: 1; filter: alpha(opacity=100); } .search-item { margin-bottom: 35px; padding: 15px; background: var(--bg-gray-98-2); } .search-item .input-text { width: 100%; padding-right: 5px; } .search-item .submit { width: 16px; height: 16px; background: url(https://hype.retroscene.org/templates/skin/synio-hype-mod/images/icons-synio.png) -115px -55px no-repeat; } .search-item.search-item-abc ul { overflow: hidden; zoom: 1; margin-top: 10px; } .search-item.search-item-abc ul li { float: left; } .search-item.search-item-abc ul li a { float: left; color: var(--text-blue-51); text-decoration: none; padding: 1px 5px; border-radius: 3px; } .search-item.search-item-abc ul li a span { border-bottom: 1px dotted var(--border-blue-51); } .search-item.search-item-abc ul li a:hover { background: var(--bg-blue-79-2); color: var(--text-gray-100); } .search-item.search-item-abc ul li a:hover span { border: none; } .search-item.search-item-abc ul li.active a { color: var(--text-gray-21); } .search-item.search-item-abc ul li.active a:hover { color: var(--text-gray-21); background: none; } .search-item.search-item-abc ul li.active a span { border: none; } .search-tags { margin-bottom: 15px; } .search-form-wrapper { background: var(--bg-gray-98-4); padding: 15px; border-radius: 5px; margin-bottom: 15px; } .search-input-wrapper { position: relative; } .search-input-wrapper .input-submit { position: absolute; top: 3px; right: 3px; width: 22px; height: 22px; border: none; background: url(https://hype.retroscene.org/templates/skin/synio-hype-mod/images/icons-synio.png) -319px -24px no-repeat; cursor: pointer; } .search-input-wrapper .input-submit:hover { background-position: -341px -24px; } .search-input-wrapper .input-submit:active { background-position: -363px -24px; } .search-input-wrapper .input-text { padding-right: 25px; } /* Облако тегов ---------------------------------------------------- */ .tag-cloud { text-align: center; width: 100%; } .tag-cloud li { display: inline; margin-right: 5px; line-height: calc(22px * var(--font-scale)); } .tag-cloud li a { color: var(--text-blue-51); } .tag-cloud li a:hover { color: var(--text-orange-53); } .tag-cloud li .tag-size-1 { font-size: calc(12px * var(--font-scale)); } .tag-cloud li .tag-size-2 { font-size: calc(12px * var(--font-scale)); } .tag-cloud li .tag-size-3 { font-size: calc(14px * var(--font-scale)); } .tag-cloud li .tag-size-4 { font-size: calc(14px * var(--font-scale)); } .tag-cloud li .tag-size-5 { font-size: calc(18px * var(--font-scale)); } .tag-cloud li .tag-size-6 { font-size: calc(18px * var(--font-scale)); } .tag-cloud li .tag-size-7 { font-size: calc(20px * var(--font-scale)); } .tag-cloud li .tag-size-8 { font-size: calc(20px * var(--font-scale)); } .tag-cloud li .tag-size-9 { font-size: calc(22px * var(--font-scale)); } .tag-cloud li .tag-size-10 { font-size: calc(22px * var(--font-scale)); } /* Item List ---------------------------------------------------- */ .item-list { border-top: 1px solid var(--border-gray-94); } .item-list li { min-height: 51px; padding: 7px 0 10px 58px; border-bottom: 1px solid var(--border-gray-94); position: relative; zoom: 1; } .item-list li p { padding-top: 2px; font-size: calc(11px * var(--font-scale)); } .item-list li a { text-decoration: none; } .item-list li .avatar { position: absolute; top: 10px; left: 0; margin-right: 10px; } .item-list li .author { font-weight: bold; color: var(--text-gray-21); } .item-list li .blog-name { font-weight: bold; } /* Хелперы ---------------------------------------------------- */ .mt-10 { margin-bottom: 10px !important; } .mt-20 { margin-bottom: 20px !important; } .mb-10 { margin-bottom: 10px !important; } .mb-15 { margin-bottom: 15px !important; } .mb-20 { margin-bottom: 20px !important; } .mb-30 { margin-bottom: 30px !important; } .ta-c { text-align: center !important; } .ta-r { text-align: right !important; } .va-m { vertical-align: middle; } .fl-r { float: right !important; } .fl-l { float: left !important; } .clearfix:before, .clearfix:after { content: ""; display: table; } .clearfix:after { clear: both; } .clearfix { zoom: 1; } .wrapper { overflow: hidden; zoom: 1; } .wrapper-content { padding: 20px 20px; background: var(--bg-gray-98-2); } .wrapper-content h3 { font-size: calc(15px * var(--font-scale)); margin-bottom: 10px; font-family: Verdana, sans-serif; } .wrapper-content.wrapper-content-dark { padding: 15px 20px; background: var(--bg-gray-97-3); } .word-wrap { white-space: -moz-pre-wrap !important; white-space: -pre-wrap; white-space: -o-pre-wrap; white-space: pre-wrap; word-wrap: break-word; white-space: normal; } /* Разное ---------------------------------------------------- */ .system-message-error { background: var(--bg-orange-84); color: var(--text-orange-40); padding: 10px 15px; margin-bottom: 15px; } .system-message-notice { background: var(--bg-green-95-2); color: var(--text-green-65); padding: 10px 15px; margin-bottom: 15px; } .notice-empty { color: var(--text-gray-70); } .loader { background: var(--bg-gray-98-3) url(https://hype.retroscene.org/templates/skin/synio-hype-mod/images/loader.gif) 50% 50% no-repeat; } .user, .ls-user { font-weight: bold; color: var(--text-gray-21); } .user:before, .ls-user:before { content: ''; display: inline-block; width: 12px; height: 12px; margin-right: 4px; background: url(https://hype.retroscene.org/templates/skin/synio-hype-mod/images/icons-synio.png) -165px -75px no-repeat; vertical-align: middle; position: relative; top: -1px; } .user .icon-user { margin-right: 3px; } .username.inactive, .user.inactive { color: var(--text-gray-70) !important; } .user-avatar img { width: 16px; height: 16px; vertical-align: middle; margin-right: 1px; } .user-avatar a { color: var(--text-gray-0); font-size: calc(11px * var(--font-scale)); } .user-avatar.user-avatar-n a { color: var(--text-blue-56); font-size: calc(12px * var(--font-scale)); } .counter.exceeded { color: var(--text-orange-53); } .page-header-menu { overflow: hidden; zoom: 1; margin-bottom: 10px; } .page-header-menu .page-header { float: left; margin-right: 20px; margin-bottom: 10px; } .page-header-menu .nav.nav-pills { margin-top: 5px; float: left; } .blog-list-info { width: 19px; height: 19px; display: inline-block; background: url(https://hype.retroscene.org/templates/skin/synio-hype-mod/images/icons-synio.png) 0 -107px no-repeat; cursor: pointer; } .blog-list-info:hover, .blog-list-info.active { background-position: -19px -107px; }/* ------------------------------------------------------------------- ФОРМАТИРОВАННЫЙ ТЕКСТ ------------------------------------------------------------------- */ .text { font-size: calc(13px * var(--font-scale)); line-height: 1.6em; overflow: hidden; zoom: 1; } .text a { text-decoration: underline; } .text h4 { font-size: calc(24px * var(--font-scale)); margin-bottom: 7px; font-weight: bold; } .text h5 { font-size: calc(20px * var(--font-scale)); margin-bottom: 7px; font-weight: bold; } .text h6 { font-size: calc(18px * var(--font-scale)); margin-bottom: 7px; font-weight: bold; } .text p { margin-bottom: 1em; } .text abbr[title] { border-bottom: 1px dotted; } .text b, .text strong { font-weight: bold; } .text blockquote { margin: 0; background: var(--bg-gray-99-3); color: var(--text-gray-36); padding: 10px 15px; clear: both; border-left: 5px solid var(--border-gray-94-3); } .text dfn { font-style: italic; } .text hr { display: block; height: 1px; border: 0; border-top: 1px solid var(--border-gray-82); margin: 1em 0; padding: 0; } .text ins { background: var(--bg-green-98-3); color: var(--text-gray-0); text-decoration: none; } .text mark { background: var(--bg-green-97-2); color: var(--text-gray-0); font-style: italic; font-weight: bold; } .text pre { margin: 0; padding: 10px 15px; border: none; background: var(--bg-gray-98-3); font-size: calc(12px * var(--font-scale)); line-height: calc(18px * var(--font-scale)); overflow: auto; width: 100%; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; clear: both; } .text q { quotes: none; clear: both; } .text q:before, q:after { content: ""; content: none; } .text small { font-size: 85%; } .text sub, .text sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } .text sup { top: -0.5em; } .text sub { bottom: -0.25em; } .text ul, .text ol { margin: 0; padding: 0 0 0 40px; } .text ul { list-style-type: disc; } .text ol { list-style-type: decimal; } .text dd { margin: 0 0 0 40px; } .text img[align="right"] { margin: 4px 0 5px 15px; } .text img[align="left"] { margin: 4px 15px 10px 0; } .text img.image-center { display: block; margin: 0 auto; } .text object, .text img { max-width: 100%; vertical-align: top; } .text .ls-user { color: var(--text-blue-56); } .text .ls-user:visited { color: var(--text-blue-56); } .text .ls-user:hover { color: var(--text-orange-53); } /* ------------------------------------------------------------------- ФОРМЫ ------------------------------------------------------------------- */ .input-text { width: 150px; padding: 5px; border: 1px solid var(--border-gray-81); -webkit-box-shadow: 0 2px 4px var(--shadow-black-0-a7) inset; box-shadow: 0 2px 4px var(--shadow-black-0-a7) inset; border-radius: 3px; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; } .input-text:focus { border-color: var(--border-blue-72); -webkit-box-shadow: 0 2px 4px var(--shadow-black-0-a7) inset, 0 0 3px var(--shadow-blue-66); box-shadow: 0 2px 4px var(--shadow-black-0-a7) inset, 0 0 3px var(--shadow-blue-66); outline: none; } .input-checkbox { position: relative; top: 1px; margin: 0 2px 0 1px; } .input-width-full { width: 100%; } .input-width-50 { width: 50px; } .input-width-100 { width: 100px; } .input-width-150 { width: 150px; } .input-width-200 { width: 200px; } .input-width-250 { width: 250px; } .input-width-300 { width: 300px; } .input-width-400 { width: 400px; } .input-width-500 { width: 500px; } textarea { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; } select { padding: 4px; border: 1px solid var(--border-gray-88); border-radius: 3px; } fieldset { margin-bottom: 30px; padding-top: 20px; border-top: 1px solid var(--border-gray-93-2); } fieldset legend { color: var(--text-gray-0); font-size: calc(18px * var(--font-scale)); padding-right: 10px; } form p { margin-bottom: 20px; } form label { display: block; margin-bottom: 3px; } form .icon-question-sign { cursor: help; } .note { display: block; margin-top: 3px; font-size: calc(11px * var(--font-scale)); line-height: calc(16px * var(--font-scale)); color: var(--text-gray-70); } .note.note-header { margin-bottom: 20px; } .captcha-image { vertical-align: top; } .counter-wrapper { margin-bottom: 15px; position: relative; } .counter-wrapper .counter { color: var(--text-gray-50); position: absolute; top: 0; right: 0; } .counter-wrapper label { margin-right: 50px; } .poll-create { padding: 15px 20px; margin-bottom: 20px; background: var(--bg-gray-97-3); } .question-list { margin-bottom: 15px; } .question-list li { margin-bottom: 5px; } .question-list li .input-text { margin-right: 5px; } dl.form-item { overflow: hidden; zoom: 1; margin-bottom: 20px; } dl.form-item dt { float: left; width: 125px; padding-top: 4px; padding-right: 15px; overflow: hidden; } dl.form-item dd { float: left; width: 250px; } .form-profile { position: relative; } .form-profile .avatar-change { position: absolute; top: 20px; right: 20px; font-size: calc(11px * var(--font-scale)); } .form-profile .avatar-change .avatar { width: 80px; border-radius: 5px; margin-bottom: 10px; background: var(--bg-gray-100); padding: 5px; -webkit-box-shadow: 0 0 5px var(--shadow-black-0-a20); box-shadow: 0 0 5px var(--shadow-black-0-a20); } .form-profile .avatar-change img { width: 80px; vertical-align: top; } .form-profile .avatar-change a { color: var(--text-blue-51); border-color: var(--border-blue-51); } /* Placeholder */ :-moz-placeholder { color: var(--text-gray-70); } .placeholder { color: var(--text-gray-70); } .mceEditor { display: block; margin-bottom: 20px; } /* Registration form ---------------------------------------------------- */ .registration-form .form-item:last-child { margin-bottom: 0; } .registration-form dl.form-item dd { position: relative; width: 355px; } .registration-form dl.form-item dd .form-item-help { width: 100px; height: 20px; position: absolute; top: 1px; right: 0; } .registration-form dl.form-item dd .form-item-help.active { background: url(https://hype.retroscene.org/templates/skin/synio-hype-mod/images/dots.png) 0 12px repeat-x; } .registration-form dl.form-item dd .form-item-help i { background-color: var(--bg-gray-98-2); } .registration-form dl.form-item dd .form-item-help i.icon-ok-green { position: absolute; top: 3px; right: 0; } /* Валидатор ---------------------------------------------------------------*/ .validate-error-hide { display: none; } .validate-error-show { display: block; line-height: calc(16px * var(--font-scale)); position: relative; padding: 10px 15px 12px 38px; background: var(--bg-gray-99-2) url(https://hype.retroscene.org/templates/skin/synio-hype-mod/images/error.png) 15px 12px no-repeat; color: var(--text-gray-23); margin-top: 13px; font-size: calc(12px * var(--font-scale)); border-radius: 3px; -webkit-box-shadow: 0 1px 5px var(--shadow-green-91) inset; box-shadow: 0 1px 5px var(--shadow-green-91) inset; } .validate-error-show:before { display: block; content: ""; position: absolute; top: -12px; left: 15px; width: 0; height: 0; border-width: 6px; border-color: transparent transparent var(--border-green-95) transparent; border-style: solid; } /* ------------------------------------------------------------------- КНОПКИ Примеры использования: Preview ------------------------------------------------------------------- */ .button { display: inline-block; padding: 3px 10px 6px; *padding: 3px 10px 4px; text-align: center; border: 1px solid var(--border-gray-90); border-radius: 5px; font-size: calc(13px * var(--font-scale)); line-height: calc(15px * var(--font-scale)); color: var(--text-gray-28); background: var(--bg-gray-99); background: -moz-linear-gradient(top, #fbfcfc 0%, #f0f2f5 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,var(--bg-gray-99)), color-stop(100%,var(--bg-gray-95))); background: -webkit-linear-gradient(top, var(--bg-gray-99) 0%,var(--bg-gray-95) 100%); background: -o-linear-gradient(top, #fbfcfc 0%,#f0f2f5 100%); background: -ms-linear-gradient(top, #fbfcfc 0%,#f0f2f5 100%); background: linear-gradient(top, #fbfcfc 0%,#f0f2f5 100%); font-family: Verdana, sans-serif; cursor: pointer; text-decoration: none; *margin-right: 5px; } .button:hover { text-decoration: none; background: var(--bg-gray-95); } .button:active { -moz-box-shadow: 0 0 3px rgba(0, 0, 0, .3) inset; -webkit-box-shadow: 0 0 3px var(--shadow-black-0-a30) inset; box-shadow: 0 0 3px var(--shadow-black-0-a30) inset; } .button.fl-r { *margin-right: 0; } .opera .button { padding-top: 4px; padding-bottom: 5px; } /* Button Primary */ .button.button-primary { background: var(--bg-blue-79); background: -moz-linear-gradient(top, #66cfff 0%, #2abcfe 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,var(--bg-blue-79)), color-stop(100%,var(--bg-blue-72))); background: -webkit-linear-gradient(top, var(--bg-blue-79) 0%,var(--bg-blue-72) 100%); background: -o-linear-gradient(top, #66cfff 0%,#2abcfe 100%); background: -ms-linear-gradient(top, #66cfff 0%,#2abcfe 100%); background: linear-gradient(top, #66cfff 0%,#2abcfe 100%); border: 1px solid var(--border-blue-66); color: var(--text-gray-100); } .button.button-primary:hover { background: var(--bg-blue-72); } /* Button Icon (Without text) */ .button.button-icon { padding: 7px 10px; } /* Button Write */ .button.button-write { background: var(--bg-blue-79); background: -moz-linear-gradient(top, #66cfff 0%, #2abcfe 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,var(--bg-blue-79)), color-stop(100%,var(--bg-blue-72))); background: -webkit-linear-gradient(top, var(--bg-blue-79) 0%,var(--bg-blue-72) 100%); background: -o-linear-gradient(top, #66cfff 0%,#2abcfe 100%); background: -ms-linear-gradient(top, #66cfff 0%,#2abcfe 100%); background: linear-gradient(top, #66cfff 0%,#2abcfe 100%); border: 1px solid var(--border-blue-66); padding: 2px 15px 4px; border-radius: 15px; line-height: calc(17px * var(--font-scale)); color: var(--text-gray-100); font-size: calc(11px * var(--font-scale)); } .button.button-write:hover { background: var(--bg-blue-75); background: -moz-linear-gradient(top, #4ec4ff 0%, #22b3fe 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,var(--bg-blue-75)), color-stop(100%,var(--bg-blue-69))); background: -webkit-linear-gradient(top, var(--bg-blue-75) 0%,var(--bg-blue-69) 100%); background: -o-linear-gradient(top, #4ec4ff 0%,#22b3fe 100%); background: -ms-linear-gradient(top, #4ec4ff 0%,#22b3fe 100%); background: linear-gradient(top, #4ec4ff 0%,#22b3fe 100%); -webkit-box-shadow: 0 -1px 0 var(--shadow-gray-100-a50) inset; box-shadow: 0 -1px 0 var(--shadow-gray-100-a50) inset; } /* Button Small */ .button.button-small { font-size: calc(11px * var(--font-scale)); padding: 1px 7px 3px; } /* Button Action */ .button.button-action { border: none; padding: 4px 4px 3px; background: var(--bg-cyan-94); background: -moz-linear-gradient(top, #c8f5ff 0%, #88c4ea 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,var(--bg-cyan-94)), color-stop(100%,var(--bg-blue-76))); background: -webkit-linear-gradient(top, var(--bg-cyan-94) 0%,var(--bg-blue-76) 100%); background: -o-linear-gradient(top, #c8f5ff 0%,#88c4ea 100%); background: -ms-linear-gradient(top, #c8f5ff 0%,#88c4ea 100%); background: linear-gradient(top, #c8f5ff 0%,#88c4ea 100%); } .button.button-action span { display: none; } .button.button-action:hover span { display: inline; padding: 0 5px 0 5px; position: relative; top: -2px; color: var(--text-gray-100); } .button.button-action.active, .button.button-action:hover { border: 1px solid var(--border-blue-49); -webkit-box-shadow: 0 -1px 0 var(--shadow-blue-57) inset, 0 2px 2px var(--shadow-gray-88); box-shadow: 0 -1px 0 var(--shadow-blue-57) inset, 0 2px 2px var(--shadow-gray-88); color: var(--text-gray-100); padding: 3px 3px 2px; background: var(--bg-blue-58); background: -moz-linear-gradient(top, #228dfa 0%, #0362eb 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,var(--bg-blue-58)), color-stop(100%,var(--bg-blue-45))); background: -webkit-linear-gradient(top, var(--bg-blue-58) 0%,var(--bg-blue-45) 100%); background: -o-linear-gradient(top, #228dfa 0%,#0362eb 100%); background: -ms-linear-gradient(top, #228dfa 0%,#0362eb 100%); background: linear-gradient(top, #228dfa 0%,#0362eb 100%); } .button.button-action:hover i { vertical-align: top; position: relative; top: -1px; } .button.button-action.button-action-add-friend:hover i { background-position: -147px -39px; } .button.button-action.button-action-send-message:hover i { background-position: -163px -39px; } .button.button-action.button-action-join.active i, .button.button-action.button-action-join:hover i { background-position: -179px -39px; } .button.button-action.button-action-note { background: var(--bg-green-93); background: -webkit-linear-gradient(top, var(--bg-green-97) 0%,var(--bg-green-93) 100%); background: -moz-linear-gradient(top, #e9fdea 0%,#ccf4d0 100%); background: -o-linear-gradient(top, #e9fdea 0%,#ccf4d0 100%); background: -ms-linear-gradient(top, #e9fdea 0%,#ccf4d0 100%); background: linear-gradient(top, #e9fdea 0%,#ccf4d0 100%); padding: 6px 6px 6px 7px; } .button.button-action.button-action-note:hover { background: var(--bg-green-74); background: -webkit-linear-gradient(top, var(--bg-green-83) 0%,var(--bg-green-74) 100%); background: -moz-linear-gradient(top, #6ce777 0%,#4ace56 100%); background: -o-linear-gradient(top, #6ce777 0%,#4ace56 100%); background: -ms-linear-gradient(top, #6ce777 0%,#4ace56 100%); background: linear-gradient(top, #6ce777 0%,#4ace56 100%); border: none; box-shadow: none; -webkit-box-shadow: none; padding: 6px 6px 6px 7px; cursor: default; } .button.button-action.button-action-note i { display: block; } .button.button-action.button-action-note:hover i { top: 0; background-position: -46px -65px; }/* -------------------------------------------- НАВИГАЦИЯ -------------------------------------------- */ .nav { overflow: hidden; zoom: 1; } .nav li { float: left; } .nav li:last-child { } .nav li a:hover { } .nav li.active a { } /* Nav Pills */ .nav.nav-pills { margin-bottom: 15px; font-size: calc(11px * var(--font-scale)); } .nav.nav-pills li { margin-right: 10px; border: 1px solid transparent; line-height: calc(13px * var(--font-scale)); border-radius: 5px; padding: 3px 6px 4px; } .nav.nav-pills li a { display: block; color: var(--text-blue-51); text-decoration: underline; float: left; } .nav.nav-pills li a:hover { color: var(--text-gray-21); border-color: var(--border-gray-21); } .nav.nav-pills li a.new { margin-left: 5px; text-decoration: none; } .nav.nav-pills li.active { border-color: var(--border-gray-95); } .nav.nav-pills li.active a { color: var(--text-blue-57); text-decoration: none; border-color: var(--border-gray-95); } .nav.nav-pills.nav-pills-profile { margin-bottom: 30px; } /* Nav Topic Filter */ .nav.nav-menu { font-size: calc(11px * var(--font-scale)); border-radius: 13px; border: 1px solid var(--border-gray-100); float: left; position: relative; } .nav.nav-menu li { position: relative; height: 22px; padding: 1px 1px 1px 0; -webkit-box-shadow: -1px 0 0 var(--shadow-gray-90) inset, 0 1px 0 var(--shadow-gray-90) inset, 0 -1px 0 var(--shadow-gray-90) inset; box-shadow: -1px 0 0 var(--shadow-gray-90) inset, 0 1px 0 var(--shadow-gray-90) inset, 0 -1px 0 var(--shadow-gray-90) inset; } .nav.nav-menu li a { background: var(--bg-gray-99-3); background: -moz-linear-gradient(top, #fbfbfc 0%, #f0f2f5 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,var(--bg-gray-99-3)), color-stop(100%,var(--bg-gray-95))); background: -webkit-linear-gradient(top, var(--bg-gray-99-3) 0%,var(--bg-gray-95) 100%); background: -o-linear-gradient(top, #fbfbfc 0%,#f0f2f5 100%); background: -ms-linear-gradient(top, #fbfbfc 0%,#f0f2f5 100%); background: linear-gradient(top, #fbfbfc 0%,#f0f2f5 100%); height: 22px; line-height: calc(21px * var(--font-scale)); color: var(--text-gray-28); padding: 0 13px; float: left; text-decoration: none; -webkit-box-shadow: 1px 0 0 var(--shadow-gray-100) inset, 0 1px 0 var(--shadow-gray-100) inset; box-shadow: 1px 0 0 var(--shadow-gray-100) inset, 0 1px 0 var(--shadow-gray-100) inset; } .nav.nav-menu li:first-child { border-top-left-radius: 13px; border-bottom-left-radius: 13px; } .nav.nav-menu li:first-child a { border-top-left-radius: 13px; border-bottom-left-radius: 13px; padding-left: 15px; -webkit-box-shadow: 1px 0 0 var(--shadow-gray-90) inset, 0 1px 0 var(--shadow-gray-100) inset; box-shadow: 1px 0 0 var(--shadow-gray-90) inset, 0 1px 0 var(--shadow-gray-100) inset; } .nav.nav-menu li:last-child { border-top-right-radius: 13px; border-bottom-right-radius: 13px; -webkit-box-shadow: 0 1px 0 var(--shadow-gray-90) inset, 0 -1px 0 var(--shadow-gray-90) inset; box-shadow: 0 1px 0 var(--shadow-gray-90) inset, 0 -1px 0 var(--shadow-gray-90) inset; padding-right: 0; } .nav.nav-menu li:last-child a { border-top-right-radius: 13px; border-bottom-right-radius: 13px; padding-right: 15px; box-shadow: -1px 0 0 var(--shadow-gray-90) inset, 0 1px 0 var(--shadow-gray-100) inset; } .nav.nav-menu li:hover { -webkit-box-shadow: -1px 0 0 var(--shadow-blue-66-2) inset, 0 1px 0 var(--shadow-blue-66-2) inset, 0 -1px 0 var(--shadow-blue-66-2) inset; box-shadow: -1px 0 0 var(--shadow-blue-66-2) inset, 0 1px 0 var(--shadow-blue-66-2) inset, 0 -1px 0 var(--shadow-blue-66-2) inset; } .nav.nav-menu li:hover a { color: var(--text-gray-100); -webkit-box-shadow: 1px 0 0 var(--shadow-blue-66-2) inset, 0 -1px 0 var(--shadow-blue-79) inset; box-shadow: 1px 0 0 var(--shadow-blue-66-2) inset, 0 -1px 0 var(--shadow-blue-79) inset; background: var(--bg-blue-75); background: -moz-linear-gradient(top, #4ec4ff 0%, #22b3fe 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,var(--bg-blue-75)), color-stop(100%,var(--bg-blue-69))); background: -webkit-linear-gradient(top, var(--bg-blue-75) 0%,var(--bg-blue-69) 100%); background: -o-linear-gradient(top, #4ec4ff 0%,#22b3fe 100%); background: -ms-linear-gradient(top, #4ec4ff 0%,#22b3fe 100%); background: linear-gradient(top, #4ec4ff 0%,#22b3fe 100%); } .nav.nav-menu li.active { background: var(--bg-gray-97-4); border: none; -webkit-box-shadow: 0 2px 3px var(--shadow-blue-83) inset; box-shadow: 0 2px 3px var(--shadow-blue-83) inset; } .nav.nav-menu li.active a { background: none; color: var(--text-blue-57); -webkit-box-shadow: none; box-shadow: none; border: none; } .nav.nav-menu.nav-filter-sub li a { padding: 5px 10px; font-size: calc(11px * var(--font-scale)); color: var(--text-gray-50); } .nav.nav-menu.nav-filter-sub li.active a { color: var(--text-gray-100); } .nav-menu-wrapper { margin-bottom: 40px; position: relative; } .oldie .nav.nav-menu { border-color: var(--border-gray-90); border-right: none; } .oldie .nav.nav-menu li { border-right: 1px solid var(--border-gray-90); } .oldie #nav { background: var(--bg-gray-97-6); } /* Userbar */ #userbar { border: 1px solid var(--border-gray-88); border-top: none; border-radius: 0 0 4px 4px; -webkit-box-shadow: 0 0 5px var(--shadow-gray-88); box-shadow: 0 0 5px var(--shadow-gray-88); background: var(--bg-gray-100); background: -moz-linear-gradient(top, #ffffff 0%, #f3f3f3 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,var(--bg-gray-100)), color-stop(100%,var(--bg-gray-96-2))); background: -webkit-linear-gradient(top, var(--bg-gray-100) 0%,var(--bg-gray-96-2) 100%); background: -o-linear-gradient(top, #ffffff 0%,#f3f3f3 100%); background: -ms-linear-gradient(top, #ffffff 0%,#f3f3f3 100%); background: linear-gradient(top, #ffffff 0%,#f3f3f3 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f3f3f3',GradientType=0 ); } #userbar .search { float: left; margin: 5px 0 0 6px; *margin: 4px 0 0 4px; } .nav.nav-userbar { float: right; } .nav.nav-userbar li { border-radius: 0 0 0 4px; border-left: 1px solid var(--border-gray-93-2); } .nav.nav-userbar li a { color: var(--text-gray-36); } .nav.nav-userbar li:first-child a { border-radius: 0 0 0 4px; } .nav.nav-userbar li:last-child a { border-radius: 0 0 4px 0; } .nav.nav-userbar li.nav-userbar-username a { position: relative; padding-left: 47px; font-weight: bold; color: var(--text-gray-21); } .nav.nav-userbar li.nav-userbar-username .avatar { position: absolute; top: 7px; left: 15px; } .nav.nav-userbar li .new-messages { color: var(--text-green-61-2); font-weight: bold; } /* Nav Main */ .nav.nav-main { height: 51px; overflow: hidden; } .nav.nav-main li { margin-right: 22px; position: relative; height: 51px; line-height: calc(49px * var(--font-scale)); } .nav.nav-main li:last-child { margin-right: 0; } .nav.nav-main li a { color: var(--text-gray-83); text-decoration: none; } .nav.nav-main li a:hover { color: var(--text-gray-70); } .nav.nav-main li i { display: none; position: absolute; bottom: 0; left: 50%; margin-left: -2px; width: 0; height: 0; border: 3px solid transparent; border-bottom-color: var(--border-gray-100); } .nav.nav-main li.active i { display: block; } .nav.nav-main li.active a { color: var(--text-blue-83); } .nav.nav-main li.nav-main-more { display: none; } .nav.nav-main li.nav-main-more a { border: 1px solid var(--border-gray-38); border-radius: 3px; padding: 0 5px 2px; position: relative; padding-right: 15px; } .nav.nav-main li.nav-main-more a:before { content: ''; position: absolute; top: 8px; right: 5px; width: 0; height: 0; border: 3px solid var(--border-gray-100); border-color: var(--border-gray-100) transparent transparent transparent; } /* Nav Profile */ .nav.nav-profile { margin-bottom: 15px; } .nav.nav-profile li { float: none; font-size: calc(15px * var(--font-scale)); border-bottom: 1px dotted var(--border-gray-89); padding: 8px 10px 10px 30px; } .nav.nav-profile li a { text-decoration: underline; color: var(--text-blue-42); } .nav.nav-profile li a:hover { color: var(--text-orange-53); } .nav.nav-profile li.active a { text-decoration: none; color: var(--text-gray-0); } /* Dropdown */ .nav.nav-pills li.dropdown { position: relative; } .nav.nav-pills li.dropdown a { padding-right: 12px; } .nav.nav-pills li.dropdown i { position: absolute; top: 4px; right: 3px; cursor: pointer; } .nav.nav-pills li.dropdown ul { display: none; position: absolute; } .nav.nav-pills li.dropdown.opened a { } .dropdown-menu { display: none; padding: 10px 15px 13px; border: 3px solid var(--border-gray-97); border-radius: 10px; -webkit-box-shadow: 0 0 10px var(--shadow-black-0-a50); box-shadow: 0 0 10px var(--shadow-black-0-a50); position: absolute; top: 32px; overflow: hidden; z-index: 10; background: var(--bg-gray-100); min-width: 150px; } .dropdown-menu li { line-height: 1em; margin-bottom: 15px; } .dropdown-menu li:last-child { margin-bottom: 0; } .dropdown-menu li a { display: block; } .dropdown-menu li a:hover { } .dropdown-menu li.active a { color: var(--text-gray-70); } .dropdown-menu.dropdown-nav-main { background: var(--bg-gray-2); border: 1px solid var(--border-gray-21); } .dropdown-menu.dropdown-nav-main li a { color: var(--text-gray-100); text-decoration: none; } .dropdown-menu.dropdown-nav-main li a:hover { color: var(--text-gray-88); } .dropdown-menu.dropdown-nav-main li.active a { color: var(--text-gray-36); } .dropdown-create { margin-right: 120px; line-height: calc(23px * var(--font-scale)); } .dropdown-create a { font-weight: normal; } .dropdown-create h2 a { text-transform: lowercase; display: inline-block; } .dropdown-menu-create { padding: 10px 15px 15px; border: 3px solid var(--border-gray-97); border-radius: 10px; -webkit-box-shadow: 0 0 10px var(--shadow-black-0-a50); box-shadow: 0 0 10px var(--shadow-black-0-a50); position: absolute; background: var(--bg-gray-100); min-width: 150px; z-index: 10; font-family: 'PT Sans', sans-serif; font-size: calc(27px * var(--font-scale)); text-transform: lowercase; } .dropdown-menu-create li { line-height: 1em; margin-bottom: 10px; } .dropdown-menu-create li:last-child { margin: 0; } .dropdown-menu-create li a { color: var(--text-blue-42); text-decoration: none; border-bottom: 1px solid var(--border-blue-42); display: inline-block; } .dropdown-menu-create li a:hover { color: var(--text-orange-53); border-color: var(--border-orange-53); } .dropdown-menu-create li.active a { color: var(--text-gray-70); border-color: var(--border-gray-70); } .nav.nav-pills.nav-pills-dropdown { position: absolute; top: 0; right: 0; margin: 0; display: none; } .nav.nav-pills.nav-pills-dropdown li { margin: 0; } /* Display settings toggles in the header (templates/common/display-settings-buttons.tpl) */ /* Reserve room for the toggles: the main menu moves overflowing items into "More" */ #header { padding-right: 342px; } #header .new-messages { right: 277px; } #header .display-settings { position: absolute; top: 0; height: 51px; display: flex; align-items: center; gap: 4px; } #header .display-settings.is-guest { right: 206px; } #header .display-settings.is-user { right: 211px; } .display-toggle { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; padding: 0; border: 0; border-radius: 4px; background: transparent; color: var(--text-gray-83); font: bold 14px/1 "PT Sans", Arial, sans-serif; cursor: pointer; } .display-toggle:hover { color: var(--text-gray-100); background: var(--bg-gray-11); } .display-toggle:focus-visible { outline: 2px solid var(--border-blue-75); outline-offset: 1px; } .display-toggle svg { width: 16px; height: 16px; fill: currentColor; } /* The icon shows the current theme, like "A"/"A+" shows the current size */ .display-toggle .display-icon-moon, html[data-theme="dark"] .display-toggle .display-icon-sun { display: none; } html[data-theme="dark"] .display-toggle .display-icon-moon { display: block; } html[data-font="large"] .display-toggle-font::after { content: "+"; } /* ------------------------------------------------------------------- ИКОНКИ Иконки Glyphicons http://glyphicons.com/ Пример использования: Remove ------------------------------------------------------------------- */ [class^="icon-"], [class*=" icon-"] { display: inline-block; vertical-align: text-top; width: 14px; height: 14px; line-height: calc(14px * var(--font-scale)); background: var(--sprite-icons) no-repeat; } [class^="icon-synio-"], [class*=" icon-synio-"] { background: url(https://hype.retroscene.org/templates/skin/synio-hype-mod/images/icons-synio.png) no-repeat; } .icon-white { background-image: url(https://hype.retroscene.org/templates/skin/synio-hype-mod/images/icons-white.png); } .icon-glass { background-position: 0 0; } .icon-music { background-position: -24px 0; } .icon-search { background-position: -48px 0; } .icon-envelope { background-position: -72px 0; } .icon-heart { background-position: -96px 0; } .icon-star { background-position: -120px 0; } .icon-star-empty { background-position: -144px 0; } .icon-user { background-position: -168px 0; } .icon-film { background-position: -192px 0; } .icon-th-large { background-position: -216px 0; } .icon-th { background-position: -240px 0; } .icon-th-list { background-position: -264px 0; } .icon-ok { background-position: -288px 0; } .icon-remove { background-position: -312px 0; } .icon-zoom-in { background-position: -336px 0; } .icon-zoom-out { background-position: -360px 0; } .icon-off { background-position: -384px 0; } .icon-signal { background-position: -408px 0; } .icon-cog { background-position: -432px 0; } .icon-trash { background-position: -456px 0; } .icon-home { background-position: 0 -24px; } .icon-file { background-position: -24px -24px; } .icon-time { background-position: -48px -24px; } .icon-road { background-position: -72px -24px; } .icon-download-alt { background-position: -96px -24px; } .icon-download { background-position: -120px -24px; } .icon-upload { background-position: -144px -24px; } .icon-inbox { background-position: -168px -24px; } .icon-play-circle { background-position: -192px -24px; } .icon-repeat { background-position: -216px -24px; } .icon-refresh { background-position: -240px -24px; } .icon-list-alt { background-position: -264px -24px; } .icon-lock { background-position: -287px -24px; } .icon-flag { background-position: -312px -24px; } .icon-headphones { background-position: -336px -24px; } .icon-volume-off { background-position: -360px -24px; } .icon-volume-down { background-position: -384px -24px; } .icon-volume-up { background-position: -408px -24px; } .icon-qrcode { background-position: -432px -24px; } .icon-barcode { background-position: -456px -24px; } .icon-tag { background-position: 0 -48px; } .icon-tags { background-position: -25px -48px; } .icon-book { background-position: -48px -48px; } .icon-bookmark { background-position: -72px -48px; } .icon-print { background-position: -96px -48px; } .icon-camera { background-position: -120px -48px; } .icon-font { background-position: -144px -48px; } .icon-bold { background-position: -167px -48px; } .icon-italic { background-position: -192px -48px; } .icon-text-height { background-position: -216px -48px; } .icon-text-width { background-position: -240px -48px; } .icon-align-left { background-position: -264px -48px; } .icon-align-center { background-position: -288px -48px; } .icon-align-right { background-position: -312px -48px; } .icon-align-justify { background-position: -336px -48px; } .icon-list { background-position: -360px -48px; } .icon-indent-left { background-position: -384px -48px; } .icon-indent-right { background-position: -408px -48px; } .icon-facetime-video { background-position: -432px -48px; } .icon-picture { background-position: -456px -48px; } .icon-pencil { background-position: 0 -72px; } .icon-map-marker { background-position: -24px -72px; } .icon-adjust { background-position: -48px -72px; } .icon-tint { background-position: -72px -72px; } .icon-edit { background-position: -96px -72px; } .icon-share { background-position: -120px -72px; } .icon-check { background-position: -144px -72px; } .icon-move { background-position: -168px -72px; } .icon-step-backward { background-position: -192px -72px; } .icon-fast-backward { background-position: -216px -72px; } .icon-backward { background-position: -240px -72px; } .icon-play { background-position: -264px -72px; } .icon-pause { background-position: -288px -72px; } .icon-stop { background-position: -312px -72px; } .icon-forward { background-position: -336px -72px; } .icon-fast-forward { background-position: -360px -72px; } .icon-step-forward { background-position: -384px -72px; } .icon-eject { background-position: -408px -72px; } .icon-chevron-left { background-position: -432px -72px; } .icon-chevron-right { background-position: -456px -72px; } .icon-plus-sign { background-position: 0 -96px; } .icon-minus-sign { background-position: -24px -96px; } .icon-remove-sign { background-position: -48px -96px; } .icon-ok-sign { background-position: -72px -96px; } .icon-question-sign { background-position: -96px -96px; } .icon-info-sign { background-position: -120px -96px; } .icon-screenshot { background-position: -144px -96px; } .icon-remove-circle { background-position: -168px -96px; } .icon-ok-circle { background-position: -192px -96px; } .icon-ban-circle { background-position: -216px -96px; } .icon-arrow-left { background-position: -240px -96px; } .icon-arrow-right { background-position: -264px -96px; } .icon-arrow-up { background-position: -289px -96px; } .icon-arrow-down { background-position: -312px -96px; } .icon-share-alt { background-position: -336px -96px; } .icon-resize-full { background-position: -360px -96px; } .icon-resize-small { background-position: -384px -96px; } .icon-plus { background-position: -408px -96px; } .icon-minus { background-position: -433px -96px; } .icon-asterisk { background-position: -456px -96px; } .icon-exclamation-sign { background-position: 0 -120px; } .icon-gift { background-position: -24px -120px; } .icon-leaf { background-position: -48px -120px; } .icon-fire { background-position: -72px -120px; } .icon-eye-open { background-position: -96px -120px; } .icon-eye-close { background-position: -120px -120px; } .icon-warning-sign { background-position: -144px -120px; } .icon-plane { background-position: -168px -120px; } .icon-calendar { background-position: -192px -120px; } .icon-random { background-position: -216px -120px; } .icon-comment { background-position: -240px -120px; } .icon-magnet { background-position: -264px -120px; } .icon-chevron-up { background-position: -288px -120px; } .icon-chevron-down { background-position: -313px -119px; } .icon-retweet { background-position: -336px -120px; } .icon-shopping-cart { background-position: -360px -120px; } .icon-folder-close { background-position: -384px -120px; } .icon-folder-open { background-position: -408px -120px; } .icon-resize-vertical { background-position: -432px -119px; } .icon-resize-horizontal { background-position: -456px -118px; } .icon-contact { width: 16px; height: 16px; background: url(https://hype.retroscene.org/templates/skin/synio-hype-mod/images/icons-contact.png) no-repeat; } .icon-contact-default { background-position: 0 0; } .icon-contact-mail { background-position: -20px 0; } .icon-contact-icq { background-position: -40px 0; } .icon-contact-jabber { background-position: -60px 0; } .icon-contact-phone { background-position: -80px 0; } .icon-contact-skype { background-position: -100px 0; } .icon-contact-vkontakte { background-position: -120px 0; } .icon-contact-twitter { background-position: -140px 0; } .icon-contact-facebook { background-position: -160px 0; } .icon-contact-pouet { background-position: -180px 0; } .icon-contact-www { background-position: -200px 0; } .icon-contact-zxart { background-position: -220px 0; } .icon-ok-green { width: 18px; height: 20px; background: url(https://hype.retroscene.org/templates/skin/synio-hype-mod/images/icons-synio.png) -479px -2px no-repeat; } .icon-question-sign { width: 23px; height: 23px; background: url(https://hype.retroscene.org/templates/skin/synio-hype-mod/images/icons-synio.png) -138px 0 no-repeat; } .icon-synio-arrow-up { width: 9px; height: 9px; background-position: -24px -24px; } .icon-synio-arrow-down { width: 9px; height: 9px; background-position: -33px -24px; } .icon-synio-star-green { width: 12px; height: 11px; background-position: 0 -23px; } .icon-synio-star-blue { width: 11px; height: 11px; background-position: 0 -37px; } .icon-synio-star-white { width: 11px; height: 11px; background-position: 0 -51px; } .icon-synio-star-yellow { width: 11px; height: 11px; background-position: 0 -65px; } .icon-synio-share-blue { width: 11px; height: 11px; background-position: -12px -37px; } .icon-synio-share-white { width: 11px; height: 11px; background-position: -12px -51px; } .icon-synio-rating { width: 11px; height: 11px; background-position: -12px -23px; } .icon-synio-arrows { width: 11px; height: 11px; background-position: -22px -65px; } .icon-synio-comments-green { width: 11px; height: 11px; background-position: -46px -23px; } .icon-synio-comments-green-filled { width: 11px; height: 11px; background-position: -46px -51px; } .icon-synio-comments-blue { width: 11px; height: 11px; background-position: -46px -37px; } .icon-synio-comments-small { width: 11px; height: 11px; background-position: -28px -51px; } .icon-synio-tags { width: 15px; height: 11px; background-position: -26px -37px; } .icon-synio-actions-edit { width: 16px; height: 16px; background-position: -115px -23px; } .icon-synio-actions-delete { width: 16px; height: 16px; background-position: -131px -23px; } .icon-synio-actions-draft { width: 16px; height: 16px; background-position: -115px -39px; } .icon-synio-topic-private { width: 23px; height: 23px; background-position: -230px 0; } .icon-synio-topic-draft { width: 23px; height: 23px; background-position: -253px 0; } .icon-synio-topic-link { width: 23px; height: 23px; background-position: -276px 0; } .icon-synio-close { width: 16px; height: 16px; background-position: -131px -39px; } .icon-synio-link { width: 11px; height: 11px; background-position: -11px -65px; } .icon-synio-add-friend { width: 16px; height: 16px; background-position: -147px -23px; } .icon-synio-send-message { width: 16px; height: 16px; background-position: -163px -23px; } .icon-synio-new-message { width: 16px; height: 16px; background-position: -163px -55px; } .icon-synio-join { width: 16px; height: 16px; background-position: -179px -23px; } .icon-synio-search { width: 16px; height: 16px; background-position: -147px -55px; } .icon-synio-submit { width: 16px; height: 16px; background-position: -115px -55px; } .icon-synio-arrow-left { width: 16px; height: 16px; background-position: -115px -71px; } .icon-synio-arrow-right { width: 16px; height: 16px; background-position: -131px -71px; } .icon-synio-remove { width: 24px; height: 24px; background-position: -368px 0; vertical-align: middle; position: relative; top: -2px; } .icon-synio-remove:hover { background-position: -392px 0; } .icon-synio-vote-info-down { width: 16px; height: 16px; background-position: -67px -71px; } .icon-synio-vote-info-up { width: 16px; height: 16px; background-position: -83px -71px; } .icon-synio-vote-info-zero { width: 16px; height: 16px; background-position: -99px -71px; } .icon-synio-vote-info-view { width: 16px; height: 16px; background-position: -179px -39px; } /* ------------------------------------------------------------------- ТАБЛИЦЫ ------------------------------------------------------------------- */ .table { width: 100%; margin-bottom: 15px; border-collapse: separate; } .table th { text-align: left; font-weight: normal; border-bottom: 1px solid var(--border-gray-84); } .table td { padding: 13px 10px; } .table th, .table .cell-tab .cell-tab-inner { padding: 6px 10px 8px; } .table tr:hover td { background: var(--bg-gray-99-5); } .table tr.active td { background: var(--bg-green-92-2); } .table tbody td { border-top: 1px solid var(--border-gray-96); } .table tbody tr:first-child td { border-top: none; } .table thead a { color: var(--text-blue-51); text-decoration: none; } .table thead a span { border-bottom: 1px dotted var(--border-blue-51); } .table a.asc, .table a.desc { color: var(--text-gray-0); border-color: var(--border-gray-0); } .table a.asc:after { content: " ↑"; } .table a.desc:after { content: " ↓"; } .table .cell-rating.negative { color: var(--text-orange-53) !important; } .table .cell-tab { padding: 0; } .table .cell-tab .cell-tab-inner { position: relative; top: 1px; display: inline-block; border: 1px solid transparent; border-radius: 3px 3px 0 0; border-bottom: none; } .table .cell-tab .cell-tab-inner.active { background: var(--bg-gray-100); border-color: var(--border-gray-84); } /* Table Blogs */ .table.table-blogs .cell-info { width: 19px; padding-right: 0; padding-left: 0; } .table.table-blogs tbody .cell-info { vertical-align: top; } .table.table-blogs tbody .cell-info .blog-list-info { display: block; } .table.table-blogs .cell-name { padding-left: 3px; } .table.table-blogs .cell-name .avatar { float: left; margin-right: 10px; clear: right; } .table.table-blogs .cell-name p { overflow: hidden; margin-bottom: 5px; } .table.table-blogs .cell-name p .blog-name { font-size: calc(16px * var(--font-scale)); color: var(--text-blue-42); } .table.table-blogs .cell-name p i { vertical-align: middle; position: relative; top: -1px } .table.table-blogs tbody .cell-rating { width: 70px; font-weight: bold; font-size: calc(11px * var(--font-scale)); color: var(--text-green-61); } .table.table-blogs .cell-readers { width: 90px; text-align: center; vertical-align: middle; } .table.table-blogs tbody .cell-readers { text-align: center; vertical-align: middle; font-size: calc(11px * var(--font-scale)); } .table.table-blogs .cell-join { width: 130px; text-align: center; vertical-align: middle; } .table.table-blogs .cell-rating { width: 90px; text-align: center; vertical-align: middle; } /* Table Plugins */ .table.table-plugins .cell-checkbox { width: 20px; padding: 12px 0 10px 10px; } .table.table-plugins h3 { font-weight: bold; font-size: calc(17px * var(--font-scale)); line-height: calc(20px * var(--font-scale)); margin-bottom: 5px; } /* Table Profile Notes */ .table.table-profile-notes { border-top: 1px solid var(--border-gray-94); } .table.table-profile-notes td { vertical-align: top; } .table.table-profile-notes .cell-username { width: 20%; font-weight: bold; } .table.table-profile-notes .cell-note { width: 50%; } .table.table-profile-notes .cell-date { text-align: right; } /* Table Profile Info */ .table.table-profile-info { margin-bottom: 40px; } .table.table-profile-info td { vertical-align: top; } .table.table-profile-info .cell-label { width: 30%; color: var(--text-gray-50); } /* Table Users */ .table.table-users th { } .table.table-users .cell-follow { width: 17px; text-align: center; } .table.table-users thead .cell-follow i { position: relative; top: 3px; } .table.table-users .cell-name { width: 190px; padding-right: 0; padding-left: 0; } .table.table-users .cell-name img { float: left; margin-right: 14px; } .table.table-users tbody .cell-name div { float: left; width: 125px; } .table.table-users .cell-name .name { margin-top: 2px; } .table.table-users .cell-name .name.no-realname { margin-top: 11px; } .table.table-users .cell-name .username { width: 125px; position: relative; top: 1px; margin-bottom: 3px; } .table.table-users .cell-name .realname { font-size: calc(11px * var(--font-scale)); } .table.table-users tbody .cell-date { font-size: calc(11px * var(--font-scale)); } .table.table-users .cell-rating { text-align: center; width: 70px; } .table.table-users .cell-skill { text-align: center; width: 70px; } .table.table-users .cell-date { text-align: center; width: 130px; } .table.table-users tbody .cell-skill { color: var(--text-blue-57); font-size: calc(11px * var(--font-scale)); font-weight: bold; } .table.table-users tbody .cell-rating { color: var(--text-green-61); font-size: calc(11px * var(--font-scale)); } .table.table-users button { float: left; margin-right: 5px; } /* Table Talk */ .table.table-talk .cell-checkbox { width: 20px; padding: 15px 0 10px 10px; } .table.table-talk thead .cell-checkbox { padding: 10px 0 10px 10px; } .table.table-talk .cell-favourite { text-align: center; } .table.table-talk tbody .cell-favourite { padding: 17px 0; } .table.table-talk .cell-recipients { width: 130px; } .table.table-talk tbody .cell-recipients { font-size: calc(11px * var(--font-scale)); } .table.table-talk tbody .cell-recipients a { color: var(--text-gray-0); } .table.table-talk tbody .cell-date { font-size: calc(11px * var(--font-scale)); width: 115px; } .table.table-talk tbody .cell-title { } .table.table-talk tbody .cell-title a { color: var(--text-blue-42); } .table.table-talk tbody .cell-title a:hover { color: var(--text-orange-53); } .table.table-talk tbody .cell-title span { color: var(--text-blue-57); font-weight: bold; margin-left: 4px; } .table.table-talk tbody .cell-title .new { color: var(--text-green-64); } .table.table-talk tbody .cell-title i { position: relative; left: -3px; } .table.table-talk tbody td { vertical-align: top; }/* -------------------------------------------- ТОПИК -------------------------------------------- */ .topic { margin-bottom: 50px; } .topic:last-child { margin-bottom: 0; } /* Header */ .topic .topic-header { margin-bottom: 20px; } .topic .topic-header .topic-title { font-size: calc(27px * var(--font-scale)); line-height: 1.1em; font-weight: normal; margin: 0 0 10px; } .topic .topic-header .topic-title a { text-decoration: underline; color: var(--text-blue-42); } .topic .topic-header .topic-title a:hover { color: var(--text-orange-53); } .topic .topic-header .topic-title i { position: relative; top: 9px; cursor: help; margin-right: 5px; } .topic .topic-header .topic-info { margin-bottom: 25px; color: var(--text-gray-50); } .topic .topic-header .topic-info time { margin-right: 15px; } .topic .topic-header .topic-info .topic-blog { font-family: 'PT Sans', sans-serif; font-size: calc(18px * var(--font-scale)); color: var(--text-gray-0); text-decoration: underline; } .topic .topic-header .topic-info .topic-blog:hover { color: var(--text-gray-43); } .topic .topic-header .topic-info .blog-list-info { position: relative; top: 5px; } .topic .topic-header .topic-actions { background: var(--bg-green-99); border-radius: 5px; padding: 10px 15px; font-size: calc(11px * var(--font-scale)); overflow: hidden; } .topic .topic-header .topic-actions li { float: left; margin-right: 18px; } .topic .topic-header .topic-actions li.draft a { color: var(--text-green-55); } .topic .topic-header .topic-actions li.delete a { color: var(--text-orange-51); } .topic .topic-header .topic-actions li i { margin-right: 3px; } /* Content */ .topic .topic-content { margin-bottom: 15px; } .topic .topic-content.text { color: var(--text-gray-21); } /* Tags */ .topic .topic-footer .topic-tags { margin: 0 0 10px; font-size: calc(11px * var(--font-scale)); } .topic .topic-footer .topic-tags li { display: inline; color: var(--text-gray-57); } .topic .topic-footer .topic-tags li i { position: relative; top: 4px; margin-right: 3px; } .topic .topic-footer .topic-tags li a { color: var(--text-gray-32); text-decoration: underline; } .topic .topic-footer .topic-tags li a:hover { text-decoration: none; } .topic .topic-footer .topic-tags li a.link-dotted { text-decoration: none; color: var(--text-gray-55); border-color: var(--border-gray-55); } .topic .topic-footer .topic-tags li a.link-dotted:hover { color: var(--text-gray-21); border-color: var(--border-gray-21); } .topic .topic-footer .topic-tags li.topic-tags-edit { margin-left: 20px; } .topic .topic-footer .topic-tags li.topic-tags-user a { color: var(--text-green-54); } /* Info */ .topic .topic-footer .topic-info { overflow: hidden; border-top: 1px solid var(--border-gray-93); padding-top: 8px; font-size: calc(11px * var(--font-scale)); line-height: calc(11px * var(--font-scale)); } .topic .topic-footer .topic-info li { float: left; margin-right: 10px; border-right: 1px solid var(--border-gray-100); padding: 6px; } .topic .topic-footer .topic-info li a { text-decoration: none; } .topic .topic-footer .topic-info li.topic-info-vote { float: right; padding: 0; margin-right: 0; overflow: hidden; } .topic .topic-footer .topic-info li.topic-info-author { padding: 4px 0; } .topic .topic-footer .topic-info li.topic-info-author a { text-decoration: underline; } .topic .topic-footer .topic-info li.topic-info-author a:hover { } .topic .topic-footer .topic-info li.topic-info-author a img { width: 16px; height: 16px; vertical-align: middle; margin-right: 2px; } .topic .topic-footer .topic-info li.topic-info-date { color: var(--text-gray-55); } .topic .topic-footer .topic-info li.topic-info-share { padding: 6px; cursor: pointer; border-radius: 4px; position: relative; } .topic .topic-footer .topic-info li.topic-info-share i { float: left; } .topic .topic-footer .topic-info li.topic-info-share.active, .topic .topic-footer .topic-info li.topic-info-share:hover { background: var(--bg-blue-79-2); } .topic .topic-footer .topic-info li.topic-info-share.active i, .topic .topic-footer .topic-info li.topic-info-share:hover i { background-position: -12px -51px; } .topic .topic-footer .topic-info li.topic-info-comments a { color: var(--text-blue-53); float: left; } .topic .topic-footer .topic-info li.topic-info-comments a:hover { color: var(--text-orange-53); } .topic .topic-footer .topic-info li.topic-info-comments a.new { color: var(--text-gray-0); } .topic .topic-footer .topic-info li.topic-info-comments span { text-decoration: underline; } .topic .topic-footer .topic-info li.topic-info-comments span.count { color: var(--text-green-60); text-decoration: none; } .topic .topic-footer .topic-info li.topic-info-comments i { float: left; margin-right: 7px; } .topic .topic-footer .topic-info li.topic-info-favourite { padding: 6px; color: var(--text-gray-57-2); border-radius: 4px; cursor: pointer; } .topic .topic-footer .topic-info li.topic-info-favourite i { float: left; margin-right: 3px; } .topic .topic-footer .topic-info li.topic-info-favourite:hover { background: var(--bg-blue-79-2); color: var(--text-gray-100); } .topic .topic-footer .topic-info li.topic-info-favourite:hover i { background-position: 0 -51px; } /* Share */ .topic .topic-share { display: none; border: 3px solid var(--border-gray-97); padding: 3px 35px 3px 3px; border-radius: 10px; margin-bottom: 10px; position: relative; } .topic .topic-share .close { content: ''; position: absolute; top: 7px; right: 7px; width: 19px; height: 22px; background: url(https://hype.retroscene.org/templates/skin/synio-hype-mod/images/icons-synio.png) -479px -26px no-repeat; cursor: pointer; opacity: .8; } .topic .topic-share .close:hover { opacity: 1; } .topic .topic-share .arrow { position: absolute; border: none; width: 15px; height: 11px; background: url(https://hype.retroscene.org/templates/skin/synio-hype-mod/images/icons-synio.png) no-repeat; background-position: -53px -107px; bottom: -11px; } /* Poll */ .topic .poll { margin-bottom: 15px; } .topic .poll .poll-vote { margin-bottom: 20px; margin-left: 0; list-style-type: none; } .topic .poll .poll-vote li { margin-bottom: 10px; } .topic .poll .poll-vote li:last-child { margin-bottom: 0; } .topic .poll .poll-vote li label { display: inline; } .topic .poll .poll-vote li input { position: relative; top: 1px; margin-right: 2px; } .topic .poll .poll-result { margin-bottom: 10px; list-style-type: none; background: var(--bg-gray-100); overflow: hidden; } .topic .poll .poll-result li { margin-bottom: 20px; } .topic .poll .poll-result li dl { overflow: hidden; zoom: 1; } .topic .poll .poll-result li dl dt { float: left; width: 80px; } .topic .poll .poll-result li dl dt span { font-size: calc(11px * var(--font-scale)); color: var(--text-gray-70); } .topic .poll .poll-result li dl dd { float: left; width: 400px; } .topic .poll .poll-result li dl dd div { height: 7px; margin-top: 3px; background: var(--bg-gray-82); overflow: hidden; border-radius: 4px; } .topic .poll .poll-result li.most dl dd div { background: var(--bg-blue-60); background: url(https://hype.retroscene.org/templates/skin/synio-hype-mod/images/poll-most.png) repeat-x; -webkit-box-shadow: 0 1px 2px var(--shadow-black-0-a20); box-shadow: 0 1px 2px var(--shadow-black-0-a20); } .topic .poll .poll-result li.most dl dt { color: var(--text-blue-66); } .topic .poll .poll-total { position: relative; color: var(--text-gray-54); font-size: calc(11px * var(--font-scale)); line-height: calc(16px * var(--font-scale)); padding-left: 80px; margin-bottom: 30px; } .topic .poll .poll-total .poll-sort { position: absolute; top: 2px; left: 0; width: 23px; height: 23px; background: url(https://hype.retroscene.org/templates/skin/synio-hype-mod/images/icons-synio.png) -161px 0 no-repeat; cursor: pointer; } .topic .poll .poll-total .poll-sort.active { background-position: -184px 0; } /* Topic Photo */ .topic.topic-type-photoset { } .topic.topic-type-photoset .topic-photo-preview { position: relative; margin-bottom: 15px; cursor: pointer; } .topic.topic-type-photoset .topic-photo-preview img { vertical-align: top; } .topic.topic-type-photoset .topic-photo-preview .topic-photo-count { display: none; cursor: pointer; position: absolute; top: 5px; right: 5px; background: var(--bg-gray-0); color: var(--text-green-76); padding: 4px 7px; background: var(--bg-black-0-a60); } .topic.topic-type-photoset .topic-photo-preview .topic-photo-desc { display: none; width: 96%; padding: 7px 2%; position: absolute; bottom: 0; left: 0; background: var(--bg-gray-0); color: var(--text-green-76); color: var(--text-gray-100); line-height: calc(16px * var(--font-scale)); background: var(--bg-black-0-a70); } .topic.topic-type-photoset .topic-photo-images { padding-top: 10px; margin-bottom: 15px; } .topic.topic-type-photoset .topic-photo-images h2 { border-bottom: 1px solid var(--border-gray-82); padding-bottom: 4px; margin-bottom: 15px; font-size: calc(25px * var(--font-scale)); } .topic.topic-type-photoset .topic-photo-images ul { overflow: hidden; zoom: 1; } .topic.topic-type-photoset .topic-photo-images ul li { float: left; margin: 0 9px 9px 0; position: relative; } .topic.topic-type-photoset .topic-photo-images ul li .image-number { display: none; position: absolute; top: 5px; right: 5px; background: var(--bg-gray-0); color: var(--text-green-76); padding: 1px 6px; font-size: calc(11px * var(--font-scale)); background: var(--bg-black-0-a60); } .topic.topic-type-photoset .topic-photo-images ul li:hover .image-number { display: block; } .topic.topic-type-photoset .topic-photo-images ul li img { vertical-align: top; } .topic.topic-type-photoset .topic-photo-images .topic-photo-more { display: block; border-top: 1px solid var(--border-gray-91); text-align: center; padding: 10px 0; margin-bottom: 15px; text-decoration: none; background: var(--bg-gray-97-8); color: var(--text-blue-59); } .topic.topic-type-photoset .topic-photo-images .topic-photo-more:hover { background: var(--bg-gray-95-2); } .topic-photo-upload { background: var(--bg-gray-97-3); padding: 15px 15px 15px; margin-bottom: 20px; } .topic-photo-upload h2 { margin-bottom: 15px; } .topic-photo-upload ul { overflow: hidden; zoom: 1; } .topic-photo-upload ul li { min-height: 100px; _height: 100px; margin-bottom: 10px; padding-left: 110px; position: relative; } .topic-photo-upload ul li img { position: absolute; top: 0; left: 0; } .topic-photo-upload ul li label { color: var(--text-gray-70); } .topic-photo-upload ul li textarea { border: 1px solid var(--border-gray-88); width: 350px; height: 60px; padding: 3px; font-size: calc(12px * var(--font-scale)); font-family: Arial, sans-serif; color: var(--text-gray-21); } .topic-photo-upload ul li .image-delete { text-decoration: none; margin-right: 15px; } .topic-photo-upload ul li .image-delete:hover { color: var(--text-orange-53); } .topic-photo-upload ul li.marked-as-preview .mark-as-preview { display: inline; color: var(--text-green-71); font-weight: bold; } .topic-photo-upload ul li .mark-as-preview { display: none; text-decoration: none; } .topic-photo-upload ul li:hover .mark-as-preview { display: inline; } .topic-photo-upload .topic-photo-upload-rules { color: var(--text-gray-57); margin-bottom: 15px; } .topic-photo-upload .topic-photo-upload-input { margin-bottom: 20px; } .topic-photo-upload .topic-photo-upload-input input { margin-top: 3px; } /* Topic Talk */ .topic.topic-type-talk header .topic-info { background: var(--bg-gray-98-2); font-size: calc(11px * var(--font-scale)); padding: 15px; border-radius: 5px; margin-bottom: 0; } .topic.topic-type-talk .talk-recipients { padding: 15px; background: var(--bg-gray-98-2); margin-bottom: 0; border-radius: 0; } .topic.topic-type-talk .talk-recipients-header { font-size: calc(11px * var(--font-scale)); min-height: 0; } .topic.topic-type-talk .talk-recipients-content h3 { font-size: calc(16px * var(--font-scale)); font-weight: normal; margin-bottom: 10px; } .topic.topic-type-talk .topic-footer .topic-info li.topic-info-favourite i { margin-right: 0; } /* Topic Link */ .topic.topic-type-link { } .topic.topic-type-link .topic-header .topic-title a { color: var(--text-green-55); } .topic.topic-type-link .topic-url { font-size: calc(11px * var(--font-scale)); margin-bottom: 30px; padding-top: 10px; } .topic.topic-type-link .topic-url a { color: var(--text-green-55); } .topic.topic-type-link .topic-url a:hover { color: var(--text-orange-53); } /* Topic Preview */ .topic-preview { margin-top: 30px; } .topic-preview .profile-page-header { border-top: 1px solid var(--border-gray-88); } .topic-preview .topic { margin-bottom: 20px; } .vote-topic-info li { margin-bottom: 3px; }/* -------------------------------------------- КОММЕНТАРИИ -------------------------------------------- */ /* Блок с комментариями */ .comments-header { margin-bottom: 10px; position: relative; } .comments-header h3 { font-size: calc(27px * var(--font-scale)); margin-bottom: 5px; } .comments-header .subscribe { position: absolute; top: 15px; right: 0; font-size: calc(11px * var(--font-scale)); color: var(--text-gray-55); } .comments-header .subscribe input { top: 2px; } .comments { margin-bottom: 30px; } .comment-wrapper { position: relative; } .comment-wrapper .comment-wrapper { padding-left: 40px; } .comment-preview { padding: 5px 10px 6px; margin-bottom: 10px; background: var(--bg-gray-98-3); border: 1px solid var(--border-gray-94); border-radius: 3px; font-size: calc(13px * var(--font-scale)); line-height: 1.6em; } /* Комментарий */ .comment { min-height: 48px; margin-bottom: 10px; padding: 10px 0 0 40px; position: relative; } .comment .deleted { padding: 5px 10px; color: var(--text-gray-50); background: var(--bg-gray-96); } .comment .comment-avatar { position: absolute; top: 10px; left: 0; width: 30px; height: 30px; } .comment .folding { width: 13px; height: 13px; position: absolute; top: 18px; left: -20px; background: url(https://hype.retroscene.org/templates/skin/synio-hype-mod/images/icons-synio.png) 0 -94px no-repeat; cursor: pointer; } .comment .folding.folded { background-position: -13px -94px; } /* Стили для списка комментариев на странице http://ваш_сайт/comments/ */ .comments.comment-list .comment { margin-bottom: 50px; padding-left: 0; } .comments.comment-list .comment .comment-avatar { position: static; width: 16px; height: 16px; vertical-align: middle; } .comments.comment-list .comment .comment-content { margin-bottom: 5px; } .comments.comment-list .comment .comment-info li.vote .vote-count { margin-right: 0; } .comments.comment-list .comment .comment-content:after { top: -12px; left: 25px; border-color: transparent transparent var(--border-gray-93); } .comments.comment-list .comment .comment-content:before { top: -11px; left: 25px; border-color: transparent transparent var(--border-gray-100); } .comments.comment-list .comment-path { font-size: calc(11px * var(--font-scale)); color: var(--text-blue-73); } .comments.comment-list .comment-path .blog-name, .comments.comment-list .comment-path .comment-path-comments { color: var(--text-gray-0); } .comments.comment-list .comment-path .comment-path-topic { color: var(--text-blue-42); } /* Типы комментариев * * deleted - удаленный комментарий * self - ваш комментарий * new - новый, непрочитанный комментарий * current - активный комментарий, который выделяется при исползование кнопки обновления в тулбаре * */ .comment { background: var(--bg-gray-100); } .comment.comment-deleted .comment-content { background: var(--bg-gray-80); border-color: var(--border-orange-72); } .comment.comment-deleted .comment-content:after { border-color: var(--border-orange-72) transparent transparent; } .comment.comment-deleted .comment-content:before { border-color: var(--border-gray-80) transparent transparent; } .comment.comment-self .comment-content { background: var(--bg-gray-99-2); border-color: var(--border-green-90); } .comment.comment-self .comment-content:after { border-color: var(--border-green-90) transparent transparent; } .comment.comment-self .comment-content:before { border-color: var(--border-gray-99) transparent transparent; } .comment.comment-new .comment-content { background: var(--bg-gray-100); border-color: var(--border-green-85); box-shadow: 0 2px 3px var(--shadow-black-0-a10); } .comment.comment-new .comment-content:after { border-color: var(--border-green-85) transparent transparent; } .comment.comment-new .comment-content:before { border-color: var(--border-gray-100) transparent transparent; } .comment.comment-current .comment-content { background: var(--bg-green-92); border-color: var(--border-green-86); } .comment.comment-current .comment-content:after { border-color: var(--border-green-86) transparent transparent; } .comment.comment-current .comment-content:before { border-color: var(--border-green-92) transparent transparent; } .comment.comment-bad .comment-content { opacity: 0.3; filter: alpha(opacity=30); } .comment.comment-bad:hover .comment-content { opacity: 1; filter: alpha(opacity=100); } .ls-user-role-not-admin .comment.comment-deleted { padding: 10px 15px; min-height: 0; background: var(--bg-gray-97-2); color: var(--text-gray-57); } /* Info Block */ .comment .comment-info { padding: 0 70px 7px 0; line-height: calc(12px * var(--font-scale)); position: relative; top: -2px; overflow: hidden; zoom: 1; font-size: calc(11px * var(--font-scale)); } .comment .comment-info li { float: left; height: 18px; padding-top: 3px; margin-right: 13px; } .comment .comment-info li a { } .comment .comment-info li a.link-dotted { color: var(--text-blue-51); text-decoration: none; border-bottom: 1px dotted var(--border-blue-51); } .comment .comment-info li a.link-dotted:hover { color: var(--text-orange-53); border-color: var(--border-orange-53); } .comment .comment-info li.comment-author a { font-weight: bold; color: var(--text-blue-53); } .comment .comment-info li.comment-author.comment-topic-author a { color: var(--text-blue-36); } .comment .comment-info li.comment-author.comment-topic-author { background: var(--bg-green-98); background: -moz-linear-gradient(left, rgba(254,255,163,1) 0%, rgba(255,255,255,1) 100%); background: -webkit-gradient(linear, left top, right top, color-stop(0%,var(--bg-green-98)), color-stop(100%,var(--bg-gray-100))); background: -webkit-linear-gradient(left, var(--bg-green-98) 0%,var(--bg-gray-100) 100%); background: -o-linear-gradient(left, rgba(254,255,163,1) 0%,rgba(255,255,255,1) 100%); background: -ms-linear-gradient(left, rgba(254,255,163,1) 0%,rgba(255,255,255,1) 100%); background: linear-gradient(to right, var(--bg-green-98) 0%,var(--bg-gray-100) 100%); padding-left: 7px; } .comment .comment-info li.comment-date { color: var(--text-gray-54); } .comment .comment-info li.comment-favourite { position: relative; top: 1px; } .comment .comment-info li.comment-link { position: relative; top: 1px; } .comment .comment-info li.goto a { color: var(--text-blue-73); text-decoration: none; } .comment .comment-info li .favourite-count { font-size: calc(10px * var(--font-scale)); color: var(--text-blue-73); position: relative; top: -2px; } .comment .comment-info li.vote { position: absolute; top: 0; right: 0; margin: 0; } .comment .comment-info li.vote .vote-count { float: left; color: var(--text-gray-63); font-weight: bold; padding-top: 3px; margin: 0 6px; } .comment .comment-info li.vote .vote-down { float: left; width: 20px; height: 20px; background: url(https://hype.retroscene.org/templates/skin/synio-hype-mod/images/icons-synio.png) 0 -130px no-repeat; cursor: pointer; } .comment .comment-info li.vote .vote-down:hover { background-position: 0 -150px; } .comment .comment-info li.vote .vote-up { float: left; width: 20px; height: 20px; background: url(https://hype.retroscene.org/templates/skin/synio-hype-mod/images/icons-synio.png) -20px -130px no-repeat; cursor: pointer; } .comment .comment-info li.vote .vote-up:hover { background-position: -20px -150px; } .comment .comment-info li.vote.vote-count-positive .vote-count { color: var(--text-green-57); } .comment .comment-info li.vote.vote-count-negative .vote-count { color: var(--text-orange-51); } .comment .comment-info li.vote.voted-up .vote-down { display: none; } .comment .comment-info li.vote.voted-up .vote-up { background-position: -20px -170px; } .comment .comment-info li.vote.voted-down .vote-down { background-position: 0 -170px; } .comment .comment-info li.vote.voted-down .vote-up { display: none; } .comment .comment-info li.vote.vote-expired .vote-up, .comment .comment-info li.vote.vote-expired .vote-down { display: none; } .comment .comment-info li.goto-comment-child { display: none; } /* Content */ .comment .comment-content { margin-bottom: 10px; border: 1px solid var(--border-gray-93); padding: 9px 10px 10px; border-radius: 3px; position: relative; } .comment .comment-content.text { font-size: calc(13px * var(--font-scale)); } .comment .comment-content.text blockquote { background: var(--bg-gray-100); border-color: var(--border-gray-82); padding: 5px 10px; margin-bottom: 5px; } .comment .comment-content:after { display: block; content: ""; position: absolute; bottom: -12px; left: 10px; width: 0; height: 0; border-width: 6px; border-color: var(--border-gray-93) transparent transparent; border-style: solid; } .comment .comment-content:before { display: block; content: ""; position: absolute; bottom: -11px; left: 10px; width: 0; height: 0; border-width: 6px; border-color: var(--border-gray-100) transparent transparent; border-style: solid; z-index: 10; } /* Actions */ .comment .comment-actions li { display: inline; margin-right: 10px; } /* Форма комментирования */ .reply-header { font-size: calc(20px * var(--font-scale)); line-height: 1.3em; margin-bottom: 15px; } .reply { background: var(--bg-gray-98-2); padding: 15px; border-radius: 5px; } .reply textarea { height: 100px; } .reply textarea.loader { background: var(--bg-gray-97-2) url(https://hype.retroscene.org/templates/skin/synio-hype-mod/images/loader.gif) no-repeat center;} .reply .mceEditor { display: block; margin-bottom: 10px; } .wall-submit.wall-submit-reply.wall-submit-comment { -webkit-box-shadow: none; box-shadow: none; margin-top: 0; margin-bottom: 50px; } .wall-submit.wall-submit-reply.wall-submit-comment:after { display: none; }/* ------------------------------------------------------------------- БЛОКИ ------------------------------------------------------------------- */ .block { padding-bottom: 25px; margin-bottom: 25px; border-bottom: 1px dotted var(--border-gray-89); } .block:last-child { margin-bottom: 0; border: none; } .sidebar-left .block { margin-bottom: 10px; } .block .block-header { position: relative; margin-bottom: 4px; padding-bottom: 16px; } .block .block-header.sep { background: url(https://hype.retroscene.org/templates/skin/synio-hype-mod/images/block-sep.png) 0 100% no-repeat; } .block .block-header h3 { font-size: calc(22px * var(--font-scale)); line-height: 1em; font-weight: normal; font-family: 'PT Sans', sans-serif; } .block .block-header h3 a { text-decoration: none; color: var(--text-gray-21); } .block .block-header h3 a.link-dotted { color: var(--text-blue-40); } .block .block-content { } .block footer { margin-top: 15px; font-size: calc(11px * var(--font-scale)); color: var(--text-gray-78); } .block footer a { color: var(--text-blue-51); } .block .max-height-200 { overflow: auto; max-height: 200px; _height: expression( this.scrollHeight > 200 ? "200px" : "auto" ); position: relative; } .block .nav.nav-pills { margin-bottom: 0; padding-top: 15px; } .block .nav.nav-pills a { text-decoration: none; border-bottom: 1px dotted var(--border-blue-51); } .block .nav.nav-pills li.active a { border: none; } /* Block Type - Stream */ .block .block-update { position: absolute; top: 38px; right: 5px; width: 20px; height: 20px; background: url(https://hype.retroscene.org/templates/skin/synio-hype-mod/images/icons-synio.png) 0 -200px no-repeat; cursor: pointer; } .block .block-update:hover { background-position: -20px -200px; } .block .block-update.active { background-position: -40px -200px; } .block.block-type-stream .block-content .latest-list { } .block.block-type-stream .block-content .latest-list li { margin-bottom: 15px; color: var(--text-gray-54); } .block.block-type-stream .block-content .latest-list li.unread .stream-topic { font-weight: bold; } .block.block-type-stream .block-content .latest-list p { font-size: calc(11px * var(--font-scale)); } .block.block-type-stream .block-content .latest-list .stream-topic { text-decoration: underline; } .block.block-type-stream .block-content .latest-list .stream-blog { color: var(--text-purple-29); } .block.block-type-stream .block-content .latest-list .stream-blog:hover { color: var(--text-orange-53); } .block.block-type-stream .block-content .latest-list .author { color: var(--text-gray-32); text-decoration: underline; } .block.block-type-stream .block-content .latest-list .author:hover { color: var(--text-orange-53); } .block.block-type-stream .block-content .latest-list .block-item-comments { font-size: calc(11px * var(--font-scale)); text-decoration: none; color: var(--text-gray-54); white-space: nowrap; } .block.block-type-stream .block-content .latest-list .block-item-comments i { position: relative; top: 3px; margin-right: 2px; } .block.block-type-stream span.comments-new { color: var(--text-green-51); } /* Block Type - Activity Settings */ .block.block-type-activity p { margin-bottom: 15px; } .block.block-type-activity ul li { } .block.block-type-activity ul.stream-settings-blogs li { margin-bottom: 3px; } .block.block-type-activity .note { display: block; margin-bottom: 15px; color: var(--text-gray-70); } /* Block Type - Profile */ .block.block-type-profile { background: none; border: none; padding: 0; } .block.block-type-profile .profile-photo-wrapper { position: relative; min-height: 50px; } .block.block-type-profile .profile-photo { vertical-align: top; max-width: 240px; } .block.block-type-profile .status { position: absolute; top: 10px; left: 0; padding: 0 0 0 10px; font-size: calc(11px * var(--font-scale)); line-height: calc(18px * var(--font-scale)); height: 20px; } .block.block-type-profile .status:before { content: ''; position: absolute; top: 0; right: -20px; width: 0; height: 0; border-width: 10px; border-style: solid; border-color: var(--border-gray-21); border-color: var(--border-gray-21) transparent var(--border-gray-21) var(--border-gray-21); } .block.block-type-profile .status.status-online { background: var(--bg-purple-51); color: var(--text-gray-100); } .block.block-type-profile .status.status-online:before { border-color: var(--border-purple-51) transparent var(--border-purple-51) var(--border-purple-51); } .block.block-type-profile .status.status-offline { background: var(--bg-gray-100); color: var(--text-gray-21); opacity: .5; filter: alpha(opacity=50); } .block.block-type-profile .status.status-offline:before { border-color: var(--border-gray-100) transparent var(--border-gray-100) var(--border-gray-100); } .block.block-type-profile .upload-photo { padding: 10px 30px 15px 30px; background: var(--bg-gray-98-2); font-size: calc(11px * var(--font-scale)); } .block.block-type-profile .upload-photo a { color: var(--text-blue-51); border-color: var(--border-blue-51); } .block.block-type-profile-note { border: 2px solid var(--border-yellow-90); padding: 15px; border-radius: 5px; } .block.block-type-profile-note p { margin-bottom: 10px; } .block.block-type-profile-note .actions { margin-bottom: 0; font-size: calc(11px * var(--font-scale)); } .block.block-type-profile-note .actions a { color: var(--text-blue-42); border-color: var(--border-blue-42); } .block.block-type-profile-note .actions a:hover { color: var(--text-orange-53); border-color: var(--border-orange-53); } .block.block-type-profile-nav { padding: 0; background: none; border: none; } .block.block-type-profile-actions { border: none; } .block.block-type-profile-actions .block-content { padding: 0 0 0 30px; } .block.block-type-profile-actions ul li { margin-bottom: 5px; font-size: calc(11px * var(--font-scale)); } .block.block-type-profile-actions ul li:last-child { margin-bottom: 0; } .block.block-type-profile-actions ul li a { color: var(--text-blue-51); } .block.block-type-profile-actions ul li a:hover { color: var(--text-orange-53); } .block.block-type-profile-actions ul li a.followed { color: var(--text-orange-53); } /* Block Type - Foldable */ .block.block-type-foldable { background: none; } .block.block-type-foldable .block-header { background: none; border: none; padding: 0 0 10px; } .block.block-type-foldable .block-content { display: none; background: var(--bg-gray-98-3); } .block.block-type-talk-search { margin-bottom: 10px; } .block.block-type-talk-friends { margin-bottom: 10px; } /* Block Type - Blogs */ .block.block-type-blogs .block-blog-list li { margin-bottom: 10px; background: url(https://hype.retroscene.org/templates/skin/synio-hype-mod/images/dots.png) 0% 14px repeat-x; position: relative; padding-right: 50px; } .block.block-type-blogs .block-blog-list li a { background: var(--bg-gray-100); padding-right: 5px; } .block.block-type-blogs .block-blog-list li i { background-color: var(--bg-gray-100); position: relative; top: -2px; } .block.block-type-blogs .block-blog-list li strong { position: absolute; top: 0; right: 0; background: var(--bg-gray-100); padding-left: 2px; font-weight: normal; font-size: calc(11px * var(--font-scale)); } /* Block Type - Blogs */ .block.block-type-blog { border-radius: 5px; padding: 10px; border-bottom: none; background: var(--bg-gray-100); background: -moz-linear-gradient(top, #ffffff 0%, #f9fbfb 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,var(--bg-gray-100)), color-stop(100%,var(--bg-gray-98-4))); background: -webkit-linear-gradient(top, var(--bg-gray-100) 0%,var(--bg-gray-98-4) 100%); background: -o-linear-gradient(top, #ffffff 0%,#f9fbfb 100%); background: -ms-linear-gradient(top, #ffffff 0%,#f9fbfb 100%); background: linear-gradient(top, #ffffff 0%,#f9fbfb 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f9fbfb',GradientType=0 ); } .block.block-type-blog .block-header { margin-bottom: 0; padding: 0 7px 10px; } .block.block-type-blog .block-header h3 { font-size: calc(19px * var(--font-scale)); } .block.block-type-blog .block-header h3 a { color: var(--text-blue-42); text-decoration: underline; } .block.block-type-blog .block-content { padding: 0 7px; } .block.block-type-blog footer { font-size: calc(11px * var(--font-scale)); } .block.block-type-blog footer button { } .block.block-type-blog footer a { color: var(--text-blue-51); margin-left: 7px; } /* Block Type - Tags */ .block.block-type-tags .search-form-wrapper { margin-bottom: 15px; } .block-events-date { font-size: calc(11px * var(--font-scale)); color: var(--text-gray-54); } /* -------------------------------------------- MODALS -------------------------------------------- */ .modal { display: none; position: fixed; top: 25%; left: 50%; width: 300px; margin-left: -150px; color: var(--text-gray-21); background-color: var(--bg-gray-99); border-radius: 10px; -webkit-box-shadow: 0 0 15px var(--shadow-black-0-a50); box-shadow: 0 0 15px var(--shadow-black-0-a50); overflow: hidden; } .modal .close { position: absolute; top: 7px; right: 8px; width: 16px; height: 16px; background: url(https://hype.retroscene.org/templates/skin/synio-hype-mod/images/icons-synio.png) no-repeat -131px -39px; } .modal .close:hover { background-position: -131px -55px; } .modal .modal-header { padding: 15px 30px 0; } .modal .modal-header h3 { font-size: calc(20px * var(--font-scale)); font-weight: bold; margin-right: 20px; } .modal .modal-content { padding: 30px 30px; } .jqmOverlay { background-color: var(--bg-gray-0); } * html .modal { position: absolute; top: expression((document.documentElement.scrollTop || document.body.scrollTop) + Math.round(17 * (document.documentElement.offsetHeight || document.body.clientHeight) / 100) + 'px'); } /* Login */ .modal.modal-login { width: 450px; margin-left: -225px; top: 50px; } .modal.modal-login .nav { margin-bottom: 30px; } .modal.modal-login .modal-header { margin-bottom: 0; } .modal.modal-login .modal-content { padding-top: 15px; } .modal.modal-login .remember-label { font-size: calc(11px * var(--font-scale)); color: var(--text-gray-48); } .modal.modal-login .remember-label input { top: 2px; } .modal.modal-login .icon-question-sign { position: relative; top: -3px; } .modal.modal-login .icon-ok-green { position: relative; top: -1px; } .modal.modal-login .js-block-popup-login-content .button { position: relative; top: -1px; margin-left: 1px; } .ie .modal.modal-login .js-block-popup-login-content .button { margin-left: 1px; } /* Write */ .modal.modal-write { width: 620px; margin-left: -310px; top: 70px; background: var(--bg-gray-94-2); } .modal.modal-write .modal-content { padding: 20px 10px 20px; *padding: 20px 10px 25px; } .modal.modal-write .write-list { *overflow: hidden; *zoom: 1; } .modal.modal-write .write-list li { width: 125px; margin: 0 10px 20px; font-size: calc(19px * var(--font-scale)); font-family: 'PT Sans', sans-serif; text-align: center; overflow: hidden; display: inline-table; *float: left; } .modal.modal-write .write-list li a { color: var(--text-blue-51); } .modal.modal-write .write-list li:hover a { color: var(--text-blue-42); } .modal.modal-write .write-list li .write-item-image { display: block; margin: 0 auto; width: 115px; height: 115px; border-radius: 3px; text-align: center; background: url(https://hype.retroscene.org/templates/skin/synio-hype-mod/images/write.png) no-repeat; margin-bottom: 0; } .modal.modal-write .write-list li.write-item-type-draft { padding-right: 20px; margin-right: 0; border-right: 1px dotted var(--border-blue-78); } .modal.modal-write .write-list li.write-item-type-topic .write-item-image { background-position: 0 0; } .modal.modal-write .write-list li.write-item-type-poll .write-item-image { background-position: -115px 0; } .modal.modal-write .write-list li.write-item-type-link .write-item-image { background-position: -230px 0; } .modal.modal-write .write-list li.write-item-type-message .write-item-image { background-position: -345px 0; } .modal.modal-write .write-list li.write-item-type-blog .write-item-image { background-position: -115px 0; } .modal.modal-write .write-list li.write-item-type-draft .write-item-image { background-position: -578px 0; } .modal.modal-write .write-list li.write-item-type-topic:hover .write-item-image { background-position: 0 -115px; } .modal.modal-write .write-list li.write-item-type-poll:hover .write-item-image { background-position: -115px -115px; } .modal.modal-write .write-list li.write-item-type-link:hover .write-item-image { background-position: -230px -115px; } .modal.modal-write .write-list li.write-item-type-message:hover .write-item-image { background-position: -345px -115px; } .modal.modal-write .write-list li.write-item-type-blog:hover .write-item-image { background-position: -115px -115px; } .modal.modal-write .write-list li.write-item-type-draft:hover .write-item-image { background-position: -578px -115px; } /* Upload Image */ .modal.modal-image-upload { width: 500px; margin-left: -250px; } .modal.modal-upload-photo .image-border, .modal.modal-upload-avatar .image-border { float: left; border-radius: 5px; background: var(--bg-gray-100); padding: 5px; margin-bottom: 15px; -webkit-box-shadow: 0 0 5px var(--shadow-black-0-a20); box-shadow: 0 0 5px var(--shadow-black-0-a20); } #avatar-resize-original-img { max-width: 200px; width: 100%; } /* -------------------------------------------- БЛОГ -------------------------------------------- */ .blog-top { position: relative; padding-right: 150px; } .blog-top .vote-topic { position: absolute; top: 3px; right: 15px; } /* Blog Mini */ .blog-mini { padding: 15px; margin-bottom: 17px; font-size: calc(11px * var(--font-scale)); overflow: hidden; zoom: 1; border-radius: 5px; background: var(--bg-gray-100); background: -moz-linear-gradient(top, #ffffff 0%, #f9fbfb 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,var(--bg-gray-100)), color-stop(100%,var(--bg-gray-98-4))); background: -webkit-linear-gradient(top, var(--bg-gray-100) 0%,var(--bg-gray-98-4) 100%); background: -o-linear-gradient(top, #ffffff 0%,#f9fbfb 100%); background: -ms-linear-gradient(top, #ffffff 0%,#f9fbfb 100%); background: linear-gradient(top, #ffffff 0%,#f9fbfb 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f9fbfb',GradientType=0 ); } .blog-mini button { margin-left: 20px; } .blog-mini .fl-r a { margin-left: 14px; color: var(--text-blue-51); } .blog-mini .fl-r a:hover { color: var(--text-orange-53); } .blog-mini .fl-r a.link-dotted { border-color: var(--border-blue-51); } .blog-mini .fl-r a.link-dotted:hover { border-color: var(--border-orange-53); } .blog { overflow: hidden; margin-bottom: 17px; background: var(--bg-gray-98-2); border-radius: 5px; border-radius: 5px; } .blog-inner { padding: 20px; } /* Header */ .blog .blog-header { position: relative; padding: 10px 0 13px 78px; border-bottom: 1px solid var(--border-gray-94-2); min-height: 16px; } .blog .blog-header h2 { font-size: calc(20px * var(--font-scale)); font-weight: bold; line-height: 1em; margin-top: 3px; margin-bottom: 7px; } .blog .blog-header h2 i { position: relative; top: 5px; } .blog .blog-header .close { position: absolute; top: 0; right: 0; font-size: calc(11px * var(--font-scale)); cursor: pointer; } .blog .blog-header .close i { margin-left: 5px; } .blog .blog-header .close a { color: var(--text-blue-51); border-color: var(--border-blue-51); } .blog .blog-header .close a:hover { color: var(--text-orange-53); border-color: var(--border-orange-53); } .blog .blog-header .avatar { position: absolute; top: -10px; left: 7px; width: 39px; height: 39px; } .blog .blog-header .vote-label { text-transform: uppercase; text-align: right; font-size: calc(11px * var(--font-scale)); color: var(--text-gray-70); } .blog .blog-header .count { font-size: calc(34px * var(--font-scale)); line-height: 1em; font-weight: bold; text-align: right; } .blog .blog-header .vote { position: absolute; top: 15px; right: 15px; } .blog .blog-header .vote .vote-count { padding-left: 25px; display: block; color: var(--text-gray-21); } .blog .blog-header .vote .vote-up { position: absolute; top: 22px; left: 0; display: none; } .blog .blog-header .vote .vote-down { position: absolute; top: 35px; left: 0; display: none; } .blog .blog-header .vote:hover .vote-up, .blog .blog-header .vote:hover .vote-down, .blog .blog-header .vote.voted .vote-up, .blog .blog-header .vote.voted .vote-down { display: inline-block; } .blog .blog-header .vote.vote-count-positive .vote-count { color: var(--text-blue-40); } .blog .blog-header .actions { margin-bottom: 0; } /* Content */ .blog .blog-content { padding: 22px 8px 0; border-top: 1px solid var(--border-gray-100); } .blog .blog-content .blog-description { margin-bottom: 50px; } .blog .blog-content .user-avatar { margin-right: 10px; } .blog-info { width: 300px; margin-bottom: 50px; } .blog-info li { margin-bottom: 5px; background: url(https://hype.retroscene.org/templates/skin/synio-hype-mod/images/dots.png) 0% 14px repeat-x; position: relative; padding-right: 50px; } .blog-info li span { background: var(--bg-gray-98-2); padding-right: 2px; } .blog-info li strong { width: 150px; position: absolute; top: 0; right: 0; background: var(--bg-gray-98-2); padding-left: 2px; font-weight: normal; } .blog-info li.rating strong { color: var(--text-green-61); } /* Footer */ .blog .blog-footer { padding: 22px 26px; background: var(--bg-gray-97-3); font-size: calc(11px * var(--font-scale)); } .blog .blog-footer button { margin-right: 10px; } .blog .blog-footer a { color: var(--text-blue-51); } .blog .blog-footer .admin { float: right; } .blog .blog-footer .admin img { width: 16px; height: 16px; vertical-align: middle; margin-right: 1px; } .blog .blog-footer .admin a { color: var(--text-gray-31); } /* More Button */ .blog-more { display: block; padding: 10px 0; text-align: center; text-decoration: none; background: var(--bg-gray-98-3); } .blog-more:hover { background: var(--bg-gray-94); }/* -------------------------------------------- СТРАНИЦА ПОЛЬЗОВАТЕЛЯ -------------------------------------------- */ .profile { min-height: 48px; margin-bottom: 0; padding: 0 0px 20px 0; position: relative; } .profile .button { float: right; margin-left: 7px; } .profile .avatar { position: absolute; top: 0; left: 0; } .profile .vote-label { text-transform: lowercase; text-align: center; font-size: calc(10px * var(--font-scale)); color: var(--text-gray-70); } .profile .vote-profile { float: right; margin-left: 10px; } .profile .vote-profile .vote-topic { float: none; } .profile .vote-profile .vote-topic .vote-item.vote-count { cursor: text; } .profile .strength { float: right; margin-left: 18px; } .profile .strength .count { font-size: calc(11px * var(--font-scale)); line-height: 1em; text-align: center; padding: 0 10px; line-height: calc(23px * var(--font-scale)); color: var(--text-blue-57); margin-bottom: 0px; background: var(--bg-gray-97-4); border-radius: 15px; height: 24px; -webkit-box-shadow: 0 2px 3px var(--shadow-black-0-a10) inset; box-shadow: 0 2px 3px var(--shadow-black-0-a10) inset; } .profile .user-login { width: 240px; font-size: calc(27px * var(--font-scale)); line-height: calc(26px * var(--font-scale)); font-weight: normal; margin-bottom: 5px; } .profile .user-login.no-user-name { } .profile .user-name { color: var(--text-gray-63); font-size: calc(17px * var(--font-scale)); font-family: 'PT Sans', sans-serif; } .profile-page-header { font-size: calc(12px * var(--font-scale)); font-weight: bold; margin-bottom: 20px; background: var(--bg-gray-97-7); border-top: 1px solid var(--border-gray-94); color: var(--text-gray-36); padding: 5px 10px 6px; } .profile-info-about { padding: 13px 20px 20px 135px; min-height: 100px; background: var(--bg-green-99); border-radius: 5px; margin-bottom: 30px; color: var(--text-gray-0); position: relative; } .profile-info-about .avatar { position: absolute; top: 20px; left: 20px; border-radius: 5px; background: var(--bg-gray-100); padding: 5px; -webkit-box-shadow: 0 0 5px var(--shadow-black-0-a20); box-shadow: 0 0 5px var(--shadow-black-0-a20); } .profile-info-about .avatar img { vertical-align: top; width: 80px; height: 80px; } .profile-info-about h3 { font-size: calc(19px * var(--font-scale)); margin-bottom: 5px; } .profile-info-about .edit { font-size: calc(11px * var(--font-scale)); } .profile-left { width: 360px; float: left; margin-right: 40px; } .profile-right { width: 185px; float: left; } .profile-dotted-list { margin-bottom: 50px; } .profile-dotted-list li { overflow: hidden; zoom: 1; margin-bottom: 5px; background: url(https://hype.retroscene.org/templates/skin/synio-hype-mod/images/dots.png) 0% 14px repeat-x; } .profile-dotted-list li span { background: var(--bg-gray-100); } .profile-dotted-list li strong { float: right; width: 190px; font-weight: normal; background: var(--bg-gray-100); } .profile-contact-list { margin-bottom: 50px; } .profile-contact-list li { margin-bottom: 5px; padding-left: 21px; position: relative; } .profile-contact-list li i { position: absolute; top: 2px; left: 0; }/* -------------------------------------------- СТЕНА -------------------------------------------- */ .wall-submit { margin-bottom: 30px; background: var(--bg-gray-98-2); padding: 15px; border-radius: 5px; position: relative; } .wall-submit .counter { position: absolute; bottom: 18px; right: 15px; color: var(--text-gray-54); } .wall-submit .counter.exceeded { color: var(--text-orange-53); } .wall-submit textarea { margin: 0 0 10px; } .wall-submit.wall-submit-reply { margin: 15px 0 2px 0; -webkit-box-shadow: 0 0 7px var(--shadow-gray-92) inset; box-shadow: 0 0 7px var(--shadow-gray-92) inset; } .wall-submit.wall-submit-reply:after { display: block; content: ""; position: absolute; top: -12px; left: 15px; width: 0; height: 0; border-width: 6px; border-color: transparent transparent var(--border-gray-95-2) transparent; border-style: solid; } .wall-submit.wall-submit-reply .counter { display: none; } .wall-submit.wall-submit-reply textarea { margin-bottom: 0; height: 28px; *height: 16px; *width: 590px; } .wall-submit.wall-submit-reply button { display: none; } .wall-submit.wall-submit-reply.active textarea { height: 80px; margin-bottom: 10px; } .wall-submit.wall-submit-reply.active button { display: block; } .wall-submit.wall-submit-reply.active .counter { display: block; } .wall-submit p { margin-bottom: 5px; } .wall-item-wrapper { margin-bottom: 23px; border-bottom: 1px solid var(--border-gray-93); padding: 0 0 20px 55px; position: relative; } .wall-item-wrapper:last-child { border-bottom:none; } .wall-item .avatar { width: 40px; height: 40px; position: absolute; top: 0; left: 0; } .wall-item .info { color: var(--text-gray-78); font-size: calc(11px * var(--font-scale)); line-height: 1em; margin-bottom: 8px; } .wall-item .info a { color: var(--text-blue-42); } .wall-item .info .date { color: var(--text-gray-54); } .wall-item .actions.wall-item-actions { margin-top: 5px; margin-bottom: 0; } .wall-item .actions.wall-item-actions a { color: var(--text-blue-51); border-color: var(--border-blue-51); } .wall-item-replies { padding: 4px 5px 2px; background: var(--bg-gray-99-2); position: relative; color: var(--text-gray-23); margin-top: 15px; margin-bottom: 5px; font-size: calc(11px * var(--font-scale)); border-radius: 5px; -webkit-box-shadow: 0 2px 4px var(--shadow-green-91) inset; box-shadow: 0 2px 4px var(--shadow-green-91) inset; } .wall-item-replies:after { display: block; content: ""; position: absolute; top: -12px; left: 15px; width: 0; height: 0; border-width: 6px; border-color: transparent transparent var(--border-green-94) transparent; border-style: solid; } .wall-item-reply { padding: 4px 0 8px 40px; margin: 0 7px; position: relative; font-size: calc(11px * var(--font-scale)); border-bottom: 1px solid var(--border-green-93); border-top: 1px solid var(--border-gray-100); } .wall-item-reply:first-child { border-top: none; padding-top: 0; margin-top: 3px; } .wall-item-reply:first-child .avatar { top: 4px; } .wall-item-reply:last-child { border-bottom: none; } .wall-item-reply .text { font-size: calc(11px * var(--font-scale)); } .wall-item-reply .avatar { position: absolute; top: 8px; left: 0; width: 30px; height: 30px; } .wall-item-reply .actions { margin-bottom: 0; } .wall-item-reply .actions .date { color: var(--text-gray-54); } .wall-item-reply .author { color: var(--text-blue-42); font-weight: bold; } .wall-more { } .wall-more:hover { background: var(--bg-green-96-2); } .wall-more-reply { display: block; border-radius: 5px; text-decoration: none; text-align: center; padding: 7px 0; font-size: calc(11px * var(--font-scale)); margin-bottom: 10px; color: var(--text-green-56); border: 1px solid var(--border-green-92-2); -webkit-box-shadow: 0 1px 2px var(--shadow-green-87), 0 1px 0 var(--shadow-gray-100) inset; box-shadow: 0 1px 2px var(--shadow-green-87), 0 1px 0 var(--shadow-gray-100) inset; background: var(--bg-gray-100-2); background: -moz-linear-gradient(top, #fffffa 0%, #fefef1 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,var(--bg-gray-100-2)), color-stop(100%,var(--bg-gray-99-2))); background: -webkit-linear-gradient(top, var(--bg-gray-100-2) 0%,var(--bg-gray-99-2) 100%); background: -o-linear-gradient(top, #fffffa 0%,#fefef1 100%); background: -ms-linear-gradient(top, #fffffa 0%,#fefef1 100%); background: linear-gradient(top, #fffffa 0%,#fefef1 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fffffa', endColorstr='#fefef1',GradientType=0 ); } .wall-more-reply:hover { color: var(--text-green-56); } .wall-more.loader { background: var(--bg-green-96-2) url(https://hype.retroscene.org/templates/skin/synio-hype-mod/images/loader.gif) 50% 50% no-repeat; } .wall-more.loader .wall-more-inner { visibility: hidden; } .wall-note h3 { font-size: calc(15px * var(--font-scale)); margin-bottom: 20px; font-family: Verdana, sans-serif; }/* -------------------------------------------- ВСПЛЫВАЮЩИЕ ПОДСКАЗКИ -------------------------------------------- */ .infobox { visibility: hidden; position: absolute; top: 0; left: 0; z-index: 3500; text-align: left; padding: 15px; min-width: 50px; max-width: 300px; color: var(--text-gray-100); background: var(--bg-black-0-a80); border-radius: 5px; } .infobox .tip-arrow { position: absolute; width: 0; height: 0; border-width: 6px; border-style: solid; border-color: var(--border-black-0-a80); } .infobox .tip-arrow.tip-arrow-top { top: -12px; left: 15px; border-top-color: transparent !important; border-left-color: transparent !important; border-right-color: transparent !important; } .infobox .tip-arrow.tip-arrow-bottom { bottom: -12px; left: 15px; border-bottom-color: transparent !important; border-left-color: transparent !important; border-right-color: transparent !important; } .infobox .tip-arrow.tip-arrow-right { top: 50%; margin-top: -6px; right: -12px; border-bottom-color: transparent !important; border-top-color: transparent !important; border-right-color: transparent !important; } .infobox .tip-arrow.tip-arrow-left { top: 50%; margin-top: -6px; left: -12px; border-bottom-color: transparent !important; border-top-color: transparent !important; border-left-color: transparent !important; } .infobox a { color: var(--text-blue-76); } .infobox a:hover { color: var(--text-blue-67); } /* Default Tip */ .infobox.infobox-standart { background: var(--bg-black-0-a80); } .infobox.infobox-standart .tip-arrow { border-color: var(--border-black-0-a80); } /* Yellow */ .infobox.infobox-yellow { background: var(--bg-green-98-2); color: var(--text-green-25); border-radius: 10px; padding: 15px 20px; font-size: calc(11px * var(--font-scale)); line-height: calc(16px * var(--font-scale)); -webkit-box-shadow: 0 0 15px var(--shadow-black-0-a30); box-shadow: 0 0 15px var(--shadow-black-0-a30); } .infobox.infobox-yellow .tip-arrow { border-color: var(--border-green-98); } /* Topic */ .infobox.infobox-topic { font-size: calc(11px * var(--font-scale)); -webkit-box-shadow: 0 0 10px var(--shadow-black-0-a50); box-shadow: 0 0 10px var(--shadow-black-0-a50); background: var(--bg-gray-11); border-radius: 10px; } .infobox.infobox-topic i { margin-right: 5px; } .infobox.infobox-topic .tip-arrow { left: 50%; margin-left: -5px; border-color: var(--border-gray-11); } /* Help */ .infobox.infobox-help { background: var(--bg-gray-100); width: 300px; border: 3px solid var(--border-gray-97); color: var(--text-gray-0); border-radius: 10px; padding: 25px 30px; font-size: calc(12px * var(--font-scale)); line-height: calc(18px * var(--font-scale)); -webkit-box-shadow: 0 0 15px var(--shadow-black-0-a30); box-shadow: 0 0 15px var(--shadow-black-0-a30); } .infobox.infobox-help .tip-arrow { border: none; width: 15px; height: 11px; background: url(https://hype.retroscene.org/templates/skin/synio-hype-mod/images/icons-synio.png) no-repeat; } .infobox.infobox-help .tip-arrow.tip-arrow-top { background-position: -38px -107px; top: -11px; } .infobox.infobox-help .tip-arrow.tip-arrow-bottom { background-position: -53px -107px; bottom: -11px; } .infobox.infobox-help a { color: var(--text-blue-56); } .infobox.infobox-help .blog-info { margin-bottom: 30px; } .infobox.infobox-help .blog-info li span { background: var(--bg-gray-100); } .infobox.infobox-help .blog-info li strong { background: var(--bg-gray-100); } .infobox.infobox-help .infobox-topic { color: var(--text-blue-51); font-size: calc(11px * var(--font-scale)); } .infobox.infobox-help .infobox-actions { font-size: calc(11px * var(--font-scale)); } /* Share */ .infobox.infobox-share { background: var(--bg-gray-100); width: 300px; border: 3px solid var(--border-gray-97); color: var(--text-gray-0); border-radius: 10px; padding: 10px 15px; font-size: calc(12px * var(--font-scale)); line-height: calc(18px * var(--font-scale)); -webkit-box-shadow: 0 0 15px var(--shadow-black-0-a30); box-shadow: 0 0 15px var(--shadow-black-0-a30); } .infobox.infobox-share .tip-arrow { border: none; width: 15px; height: 11px; background: url(https://hype.retroscene.org/templates/skin/synio-hype-mod/images/icons-synio.png) no-repeat; } .infobox.infobox-share .tip-arrow.tip-arrow-top { background-position: -38px -107px; top: -11px; left: 50%; margin-left: -7px; } .infobox.infobox-share .tip-arrow.tip-arrow-bottom { background-position: -53px -107px; bottom: -11px; left: 50%; margin-left: -7px; } /* -------------------------------------------- ВСПЛЫВАЮЩИЕ УВЕДОМЛЕНИЯ -------------------------------------------- */ #notifier { width: 250px; position: fixed; top: 10px; right: 10px; font-size: calc(11px * var(--font-scale)); line-height: calc(16px * var(--font-scale)); z-index: 9999; /* IE 6 Fix */ _position: absolute; _top: expression( eval(document.documentElement.scrollBottom) + 10 +"px" ); } #notifier .n-box { position: relative; padding: 15px 20px 16px; margin-bottom: 10px; color: var(--text-gray-100); background: var(--bg-gray-0); -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; -webkit-box-shadow: 0 0 5px var(--shadow-black-0-a30); box-shadow: 0 0 5px var(--shadow-black-0-a30); opacity: 0.9; filter: alpha(opacity=80); cursor: pointer; } #notifier .n-box h3 { color: var(--text-gray-100); font-size: calc(12px * var(--font-scale)); font-weight: bold; margin-bottom: 3px; font-family: Verdana, sans-serif; } #notifier .n-box p { margin: 0; } #notifier .n-box.n-notice { background: var(--bg-blue-23); color: var(--text-gray-100); } #notifier .n-box.n-error { background: var(--bg-orange-27); color: var(--text-gray-100); }/* * jQuery UI CSS Framework 1.8.14 * * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about) * Dual licensed under the MIT or GPL Version 2 licenses. * http://jquery.org/license * * http://docs.jquery.com/UI/Theming/API */ /* Layout helpers ----------------------------------*/ .ui-helper-hidden { display: none; } .ui-helper-hidden-accessible { position: absolute !important; clip: rect(1px 1px 1px 1px); clip: rect(1px,1px,1px,1px); } .ui-helper-reset { margin: 0; padding: 0; border: 0; outline: 0; line-height: 1.3; text-decoration: none; font-size: 100%; list-style: none; } .ui-helper-clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } .ui-helper-clearfix { display: inline-block; } /* required comment for clearfix to work in Opera \*/ * html .ui-helper-clearfix { height:1%; } .ui-helper-clearfix { display:block; } /* end clearfix */ .ui-helper-zfix { width: 100%; height: 100%; top: 0; left: 0; position: absolute; opacity: 0; filter:Alpha(Opacity=0); } /* Interaction Cues ----------------------------------*/ .ui-state-disabled { cursor: default !important; } /* Icons ----------------------------------*/ /* states and images */ .ui-icon { display: block; text-indent: -99999px; overflow: hidden; background-repeat: no-repeat; } /* Misc visuals ----------------------------------*/ /* Overlays */ .ui-widget-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } /* * jQuery UI CSS Framework 1.8.14 * * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about) * Dual licensed under the MIT or GPL Version 2 licenses. * http://jquery.org/license * * http://docs.jquery.com/UI/Theming/API * * To view and modify this theme, visit http://jqueryui.com/themeroller/?ffDefault=Verdana,Arial,sans-serif&fwDefault=normal&fsDefault=1.1em&cornerRadius=4px&bgColorHeader=cccccc&bgTextureHeader=03_highlight_soft.png&bgImgOpacityHeader=75&borderColorHeader=aaaaaa&fcHeader=222222&iconColorHeader=222222&bgColorContent=ffffff&bgTextureContent=01_flat.png&bgImgOpacityContent=75&borderColorContent=aaaaaa&fcContent=222222&iconColorContent=222222&bgColorDefault=e6e6e6&bgTextureDefault=02_glass.png&bgImgOpacityDefault=75&borderColorDefault=d3d3d3&fcDefault=555555&iconColorDefault=888888&bgColorHover=dadada&bgTextureHover=02_glass.png&bgImgOpacityHover=75&borderColorHover=999999&fcHover=212121&iconColorHover=454545&bgColorActive=ffffff&bgTextureActive=02_glass.png&bgImgOpacityActive=65&borderColorActive=aaaaaa&fcActive=212121&iconColorActive=454545&bgColorHighlight=fbf9ee&bgTextureHighlight=02_glass.png&bgImgOpacityHighlight=55&borderColorHighlight=fcefa1&fcHighlight=363636&iconColorHighlight=2e83ff&bgColorError=fef1ec&bgTextureError=02_glass.png&bgImgOpacityError=95&borderColorError=cd0a0a&fcError=cd0a0a&iconColorError=cd0a0a&bgColorOverlay=aaaaaa&bgTextureOverlay=01_flat.png&bgImgOpacityOverlay=0&opacityOverlay=30&bgColorShadow=aaaaaa&bgTextureShadow=01_flat.png&bgImgOpacityShadow=0&opacityShadow=30&thicknessShadow=8px&offsetTopShadow=-8px&offsetLeftShadow=-8px&cornerRadiusShadow=8px */ /* Component containers ----------------------------------*/ .ui-widget { font-family: Verdana,Arial,sans-serif; font-size: 1.1em; } .ui-widget .ui-widget { font-size: 1em; } .ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button { font-family: Verdana,Arial,sans-serif; font-size: 1em; } .ui-widget-content { border: 1px solid var(--border-gray-70); background: var(--bg-gray-100) url(https://hype.retroscene.org/templates/skin/synio-hype-mod/css/smoothness/images/ui-bg_flat_75_ffffff_40x100.png) 50% 50% repeat-x; color: var(--text-gray-13); } .ui-widget-content a { color: var(--text-gray-13); } .ui-widget-header { border: 1px solid var(--border-gray-70); background: var(--bg-gray-82) url(https://hype.retroscene.org/templates/skin/synio-hype-mod/css/smoothness/images/ui-bg_highlight-soft_75_cccccc_1x100.png) 50% 50% repeat-x; color: var(--text-gray-13); font-weight: bold; } .ui-widget-header a { color: var(--text-gray-13); } /* Interaction states ----------------------------------*/ .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default { border: 1px solid var(--border-gray-85); background: var(--bg-gray-91) url(https://hype.retroscene.org/templates/skin/synio-hype-mod/css/smoothness/images/ui-bg_glass_75_e6e6e6_1x400.png) 50% 50% repeat-x; font-weight: normal; color: var(--text-gray-36); } .ui-state-default a, .ui-state-default a:link, .ui-state-default a:visited { color: var(--text-gray-36); text-decoration: none; } .ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus { border: 1px solid var(--border-gray-63-2); background: var(--bg-blue-92-2); font-weight: normal; color: var(--text-gray-13-2); } .ui-state-hover a, .ui-state-hover a:hover { color: var(--text-gray-13-2); text-decoration: none; } .ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active { border: 1px solid var(--border-gray-70); background: var(--bg-gray-100) url(https://hype.retroscene.org/templates/skin/synio-hype-mod/css/smoothness/images/ui-bg_glass_65_ffffff_1x400.png) 50% 50% repeat-x; font-weight: normal; color: var(--text-gray-13-2); } .ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited { color: var(--text-gray-13-2); text-decoration: none; } .ui-widget :active { outline: none; } /* Interaction Cues ----------------------------------*/ .ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight {border: 1px solid var(--border-yellow-94); background: var(--bg-gray-98-6) url(https://hype.retroscene.org/templates/skin/synio-hype-mod/css/smoothness/images/ui-bg_glass_55_fbf9ee_1x400.png) 50% 50% repeat-x; color: var(--text-gray-23); } .ui-state-highlight a, .ui-widget-content .ui-state-highlight a,.ui-widget-header .ui-state-highlight a { color: var(--text-gray-23); } .ui-state-error, .ui-widget-content .ui-state-error, .ui-widget-header .ui-state-error {border: 1px solid var(--border-orange-43); background: var(--bg-gray-96-3) url(https://hype.retroscene.org/templates/skin/synio-hype-mod/css/smoothness/images/ui-bg_glass_95_fef1ec_1x400.png) 50% 50% repeat-x; color: var(--text-orange-43); } .ui-state-error a, .ui-widget-content .ui-state-error a, .ui-widget-header .ui-state-error a { color: var(--text-orange-43); } .ui-state-error-text, .ui-widget-content .ui-state-error-text, .ui-widget-header .ui-state-error-text { color: var(--text-orange-43); } .ui-priority-primary, .ui-widget-content .ui-priority-primary, .ui-widget-header .ui-priority-primary { font-weight: bold; } .ui-priority-secondary, .ui-widget-content .ui-priority-secondary, .ui-widget-header .ui-priority-secondary { opacity: .7; filter:Alpha(Opacity=70); font-weight: normal; } .ui-state-disabled, .ui-widget-content .ui-state-disabled, .ui-widget-header .ui-state-disabled { opacity: .35; filter:Alpha(Opacity=35); background-image: none; } /* Icons ----------------------------------*/ /* states and images */ .ui-icon { width: 16px; height: 16px; background-image: url(https://hype.retroscene.org/templates/skin/synio-hype-mod/css/smoothness/images/ui-icons_222222_256x240.png); } .ui-widget-content .ui-icon {background-image: url(https://hype.retroscene.org/templates/skin/synio-hype-mod/css/smoothness/images/ui-icons_222222_256x240.png); } .ui-widget-header .ui-icon {background-image: url(https://hype.retroscene.org/templates/skin/synio-hype-mod/css/smoothness/images/ui-icons_222222_256x240.png); } .ui-state-default .ui-icon { background-image: url(https://hype.retroscene.org/templates/skin/synio-hype-mod/css/smoothness/images/ui-icons_888888_256x240.png); } .ui-state-hover .ui-icon, .ui-state-focus .ui-icon {background-image: url(https://hype.retroscene.org/templates/skin/synio-hype-mod/css/smoothness/images/ui-icons_454545_256x240.png); } .ui-state-active .ui-icon {background-image: url(https://hype.retroscene.org/templates/skin/synio-hype-mod/css/smoothness/images/ui-icons_454545_256x240.png); } .ui-state-highlight .ui-icon {background-image: url(https://hype.retroscene.org/templates/skin/synio-hype-mod/css/smoothness/images/ui-icons_2e83ff_256x240.png); } .ui-state-error .ui-icon, .ui-state-error-text .ui-icon {background-image: url(https://hype.retroscene.org/templates/skin/synio-hype-mod/css/smoothness/images/ui-icons_cd0a0a_256x240.png); } /* positioning */ .ui-icon-carat-1-n { background-position: 0 0; } .ui-icon-carat-1-ne { background-position: -16px 0; } .ui-icon-carat-1-e { background-position: -32px 0; } .ui-icon-carat-1-se { background-position: -48px 0; } .ui-icon-carat-1-s { background-position: -64px 0; } .ui-icon-carat-1-sw { background-position: -80px 0; } .ui-icon-carat-1-w { background-position: -96px 0; } .ui-icon-carat-1-nw { background-position: -112px 0; } .ui-icon-carat-2-n-s { background-position: -128px 0; } .ui-icon-carat-2-e-w { background-position: -144px 0; } .ui-icon-triangle-1-n { background-position: 0 -16px; } .ui-icon-triangle-1-ne { background-position: -16px -16px; } .ui-icon-triangle-1-e { background-position: -32px -16px; } .ui-icon-triangle-1-se { background-position: -48px -16px; } .ui-icon-triangle-1-s { background-position: -64px -16px; } .ui-icon-triangle-1-sw { background-position: -80px -16px; } .ui-icon-triangle-1-w { background-position: -96px -16px; } .ui-icon-triangle-1-nw { background-position: -112px -16px; } .ui-icon-triangle-2-n-s { background-position: -128px -16px; } .ui-icon-triangle-2-e-w { background-position: -144px -16px; } .ui-icon-arrow-1-n { background-position: 0 -32px; } .ui-icon-arrow-1-ne { background-position: -16px -32px; } .ui-icon-arrow-1-e { background-position: -32px -32px; } .ui-icon-arrow-1-se { background-position: -48px -32px; } .ui-icon-arrow-1-s { background-position: -64px -32px; } .ui-icon-arrow-1-sw { background-position: -80px -32px; } .ui-icon-arrow-1-w { background-position: -96px -32px; } .ui-icon-arrow-1-nw { background-position: -112px -32px; } .ui-icon-arrow-2-n-s { background-position: -128px -32px; } .ui-icon-arrow-2-ne-sw { background-position: -144px -32px; } .ui-icon-arrow-2-e-w { background-position: -160px -32px; } .ui-icon-arrow-2-se-nw { background-position: -176px -32px; } .ui-icon-arrowstop-1-n { background-position: -192px -32px; } .ui-icon-arrowstop-1-e { background-position: -208px -32px; } .ui-icon-arrowstop-1-s { background-position: -224px -32px; } .ui-icon-arrowstop-1-w { background-position: -240px -32px; } .ui-icon-arrowthick-1-n { background-position: 0 -48px; } .ui-icon-arrowthick-1-ne { background-position: -16px -48px; } .ui-icon-arrowthick-1-e { background-position: -32px -48px; } .ui-icon-arrowthick-1-se { background-position: -48px -48px; } .ui-icon-arrowthick-1-s { background-position: -64px -48px; } .ui-icon-arrowthick-1-sw { background-position: -80px -48px; } .ui-icon-arrowthick-1-w { background-position: -96px -48px; } .ui-icon-arrowthick-1-nw { background-position: -112px -48px; } .ui-icon-arrowthick-2-n-s { background-position: -128px -48px; } .ui-icon-arrowthick-2-ne-sw { background-position: -144px -48px; } .ui-icon-arrowthick-2-e-w { background-position: -160px -48px; } .ui-icon-arrowthick-2-se-nw { background-position: -176px -48px; } .ui-icon-arrowthickstop-1-n { background-position: -192px -48px; } .ui-icon-arrowthickstop-1-e { background-position: -208px -48px; } .ui-icon-arrowthickstop-1-s { background-position: -224px -48px; } .ui-icon-arrowthickstop-1-w { background-position: -240px -48px; } .ui-icon-arrowreturnthick-1-w { background-position: 0 -64px; } .ui-icon-arrowreturnthick-1-n { background-position: -16px -64px; } .ui-icon-arrowreturnthick-1-e { background-position: -32px -64px; } .ui-icon-arrowreturnthick-1-s { background-position: -48px -64px; } .ui-icon-arrowreturn-1-w { background-position: -64px -64px; } .ui-icon-arrowreturn-1-n { background-position: -80px -64px; } .ui-icon-arrowreturn-1-e { background-position: -96px -64px; } .ui-icon-arrowreturn-1-s { background-position: -112px -64px; } .ui-icon-arrowrefresh-1-w { background-position: -128px -64px; } .ui-icon-arrowrefresh-1-n { background-position: -144px -64px; } .ui-icon-arrowrefresh-1-e { background-position: -160px -64px; } .ui-icon-arrowrefresh-1-s { background-position: -176px -64px; } .ui-icon-arrow-4 { background-position: 0 -80px; } .ui-icon-arrow-4-diag { background-position: -16px -80px; } .ui-icon-extlink { background-position: -32px -80px; } .ui-icon-newwin { background-position: -48px -80px; } .ui-icon-refresh { background-position: -64px -80px; } .ui-icon-shuffle { background-position: -80px -80px; } .ui-icon-transfer-e-w { background-position: -96px -80px; } .ui-icon-transferthick-e-w { background-position: -112px -80px; } .ui-icon-folder-collapsed { background-position: 0 -96px; } .ui-icon-folder-open { background-position: -16px -96px; } .ui-icon-document { background-position: -32px -96px; } .ui-icon-document-b { background-position: -48px -96px; } .ui-icon-note { background-position: -64px -96px; } .ui-icon-mail-closed { background-position: -80px -96px; } .ui-icon-mail-open { background-position: -96px -96px; } .ui-icon-suitcase { background-position: -112px -96px; } .ui-icon-comment { background-position: -128px -96px; } .ui-icon-person { background-position: -144px -96px; } .ui-icon-print { background-position: -160px -96px; } .ui-icon-trash { background-position: -176px -96px; } .ui-icon-locked { background-position: -192px -96px; } .ui-icon-unlocked { background-position: -208px -96px; } .ui-icon-bookmark { background-position: -224px -96px; } .ui-icon-tag { background-position: -240px -96px; } .ui-icon-home { background-position: 0 -112px; } .ui-icon-flag { background-position: -16px -112px; } .ui-icon-calendar { background-position: -32px -112px; } .ui-icon-cart { background-position: -48px -112px; } .ui-icon-pencil { background-position: -64px -112px; } .ui-icon-clock { background-position: -80px -112px; } .ui-icon-disk { background-position: -96px -112px; } .ui-icon-calculator { background-position: -112px -112px; } .ui-icon-zoomin { background-position: -128px -112px; } .ui-icon-zoomout { background-position: -144px -112px; } .ui-icon-search { background-position: -160px -112px; } .ui-icon-wrench { background-position: -176px -112px; } .ui-icon-gear { background-position: -192px -112px; } .ui-icon-heart { background-position: -208px -112px; } .ui-icon-star { background-position: -224px -112px; } .ui-icon-link { background-position: -240px -112px; } .ui-icon-cancel { background-position: 0 -128px; } .ui-icon-plus { background-position: -16px -128px; } .ui-icon-plusthick { background-position: -32px -128px; } .ui-icon-minus { background-position: -48px -128px; } .ui-icon-minusthick { background-position: -64px -128px; } .ui-icon-close { background-position: -80px -128px; } .ui-icon-closethick { background-position: -96px -128px; } .ui-icon-key { background-position: -112px -128px; } .ui-icon-lightbulb { background-position: -128px -128px; } .ui-icon-scissors { background-position: -144px -128px; } .ui-icon-clipboard { background-position: -160px -128px; } .ui-icon-copy { background-position: -176px -128px; } .ui-icon-contact { background-position: -192px -128px; } .ui-icon-image { background-position: -208px -128px; } .ui-icon-video { background-position: -224px -128px; } .ui-icon-script { background-position: -240px -128px; } .ui-icon-alert { background-position: 0 -144px; } .ui-icon-info { background-position: -16px -144px; } .ui-icon-notice { background-position: -32px -144px; } .ui-icon-help { background-position: -48px -144px; } .ui-icon-check { background-position: -64px -144px; } .ui-icon-bullet { background-position: -80px -144px; } .ui-icon-radio-off { background-position: -96px -144px; } .ui-icon-radio-on { background-position: -112px -144px; } .ui-icon-pin-w { background-position: -128px -144px; } .ui-icon-pin-s { background-position: -144px -144px; } .ui-icon-play { background-position: 0 -160px; } .ui-icon-pause { background-position: -16px -160px; } .ui-icon-seek-next { background-position: -32px -160px; } .ui-icon-seek-prev { background-position: -48px -160px; } .ui-icon-seek-end { background-position: -64px -160px; } .ui-icon-seek-start { background-position: -80px -160px; } /* ui-icon-seek-first is deprecated, use ui-icon-seek-start instead */ .ui-icon-seek-first { background-position: -80px -160px; } .ui-icon-stop { background-position: -96px -160px; } .ui-icon-eject { background-position: -112px -160px; } .ui-icon-volume-off { background-position: -128px -160px; } .ui-icon-volume-on { background-position: -144px -160px; } .ui-icon-power { background-position: 0 -176px; } .ui-icon-signal-diag { background-position: -16px -176px; } .ui-icon-signal { background-position: -32px -176px; } .ui-icon-battery-0 { background-position: -48px -176px; } .ui-icon-battery-1 { background-position: -64px -176px; } .ui-icon-battery-2 { background-position: -80px -176px; } .ui-icon-battery-3 { background-position: -96px -176px; } .ui-icon-circle-plus { background-position: 0 -192px; } .ui-icon-circle-minus { background-position: -16px -192px; } .ui-icon-circle-close { background-position: -32px -192px; } .ui-icon-circle-triangle-e { background-position: -48px -192px; } .ui-icon-circle-triangle-s { background-position: -64px -192px; } .ui-icon-circle-triangle-w { background-position: -80px -192px; } .ui-icon-circle-triangle-n { background-position: -96px -192px; } .ui-icon-circle-arrow-e { background-position: -112px -192px; } .ui-icon-circle-arrow-s { background-position: -128px -192px; } .ui-icon-circle-arrow-w { background-position: -144px -192px; } .ui-icon-circle-arrow-n { background-position: -160px -192px; } .ui-icon-circle-zoomin { background-position: -176px -192px; } .ui-icon-circle-zoomout { background-position: -192px -192px; } .ui-icon-circle-check { background-position: -208px -192px; } .ui-icon-circlesmall-plus { background-position: 0 -208px; } .ui-icon-circlesmall-minus { background-position: -16px -208px; } .ui-icon-circlesmall-close { background-position: -32px -208px; } .ui-icon-squaresmall-plus { background-position: -48px -208px; } .ui-icon-squaresmall-minus { background-position: -64px -208px; } .ui-icon-squaresmall-close { background-position: -80px -208px; } .ui-icon-grip-dotted-vertical { background-position: 0 -224px; } .ui-icon-grip-dotted-horizontal { background-position: -16px -224px; } .ui-icon-grip-solid-vertical { background-position: -32px -224px; } .ui-icon-grip-solid-horizontal { background-position: -48px -224px; } .ui-icon-gripsmall-diagonal-se { background-position: -64px -224px; } .ui-icon-grip-diagonal-se { background-position: -80px -224px; } /* Misc visuals ----------------------------------*/ /* Corner radius */ /* Overlays */ .ui-widget-overlay { background: var(--bg-gray-70) url(https://hype.retroscene.org/templates/skin/synio-hype-mod/css/smoothness/images/ui-bg_flat_0_aaaaaa_40x100.png) 50% 50% repeat-x; opacity: .30;filter:Alpha(Opacity=30); } .ui-widget-shadow { margin: -8px 0 0 -8px; padding: 8px; background: var(--bg-gray-70) url(https://hype.retroscene.org/templates/skin/synio-hype-mod/css/smoothness/images/ui-bg_flat_0_aaaaaa_40x100.png) 50% 50% repeat-x; opacity: .30;filter:Alpha(Opacity=30); -moz-border-radius: 8px; -khtml-border-radius: 8px; -webkit-border-radius: 8px; border-radius: 8px; }/* * jQuery UI Autocomplete 1.8.14 * * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about) * Dual licensed under the MIT or GPL Version 2 licenses. * http://jquery.org/license * * http://docs.jquery.com/UI/Autocomplete#theming */ .ui-autocomplete { position: absolute; cursor: default; } /* workarounds */ * html .ui-autocomplete { width:1px; } /* without this, the menu expands to 100% in IE6 */ /* * jQuery UI Menu 1.8.14 * * Copyright 2010, AUTHORS.txt (http://jqueryui.com/about) * Dual licensed under the MIT or GPL Version 2 licenses. * http://jquery.org/license * * http://docs.jquery.com/UI/Menu#theming */ .ui-menu { list-style:none; margin: 0; display:block; float: left; } .ui-menu .ui-menu { margin-top: -3px; } .ui-menu .ui-menu-item { margin:0; padding: 0; zoom: 1; float: left; clear: left; width: 100%; } .ui-menu .ui-menu-item a { text-decoration:none; display:block; padding:.2em .4em; line-height:1.4; zoom:1; } .ui-menu .ui-menu-item a.ui-state-hover, .ui-menu .ui-menu-item a.ui-state-active { font-weight: normal; margin: -1px; } /* * jQuery UI Datepicker 1.8.14 * * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about) * Dual licensed under the MIT or GPL Version 2 licenses. * http://jquery.org/license * * http://docs.jquery.com/UI/Datepicker#theming */ .ui-datepicker { width: 17em; padding: .2em .2em 0; display: none; } .ui-datepicker .ui-datepicker-header { position:relative; padding:.2em 0; } .ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next { position:absolute; top: 2px; width: 1.8em; height: 1.8em; } .ui-datepicker .ui-datepicker-prev-hover, .ui-datepicker .ui-datepicker-next-hover { top: 1px; } .ui-datepicker .ui-datepicker-prev { left:2px; } .ui-datepicker .ui-datepicker-next { right:2px; } .ui-datepicker .ui-datepicker-prev-hover { left:1px; } .ui-datepicker .ui-datepicker-next-hover { right:1px; } .ui-datepicker .ui-datepicker-prev span, .ui-datepicker .ui-datepicker-next span { display: block; position: absolute; left: 50%; margin-left: -8px; top: 50%; margin-top: -8px; } .ui-datepicker .ui-datepicker-title { margin: 0 2.3em; line-height: 1.8em; text-align: center; } .ui-datepicker .ui-datepicker-title select { font-size:1em; margin:1px 0; } .ui-datepicker select.ui-datepicker-month-year {width: 100%;} .ui-datepicker select.ui-datepicker-month, .ui-datepicker select.ui-datepicker-year { width: 49%;} .ui-datepicker table {width: 100%; font-size: .9em; border-collapse: collapse; margin:0 0 .4em; } .ui-datepicker th { padding: .7em .3em; text-align: center; font-weight: bold; border: 0; } .ui-datepicker td { border: 0; padding: 1px; } .ui-datepicker td span, .ui-datepicker td a { display: block; padding: .2em; text-align: right; text-decoration: none; } .ui-datepicker .ui-datepicker-buttonpane { background-image: none; margin: .7em 0 0 0; padding:0 .2em; border-left: 0; border-right: 0; border-bottom: 0; } .ui-datepicker .ui-datepicker-buttonpane button { float: right; margin: .5em .2em .4em; cursor: pointer; padding: .2em .6em .3em .6em; width:auto; overflow:visible; } .ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current { float:left; } /* with multiple calendars */ .ui-datepicker.ui-datepicker-multi { width:auto; } .ui-datepicker-multi .ui-datepicker-group { float:left; } .ui-datepicker-multi .ui-datepicker-group table { width:95%; margin:0 auto .4em; } .ui-datepicker-multi-2 .ui-datepicker-group { width:50%; } .ui-datepicker-multi-3 .ui-datepicker-group { width:33.3%; } .ui-datepicker-multi-4 .ui-datepicker-group { width:25%; } .ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header { border-left-width:0; } .ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header { border-left-width:0; } .ui-datepicker-multi .ui-datepicker-buttonpane { clear:left; } .ui-datepicker-row-break { clear:both; width:100%; font-size:0em; } /* RTL support */ .ui-datepicker-rtl { direction: rtl; } .ui-datepicker-rtl .ui-datepicker-prev { right: 2px; left: auto; } .ui-datepicker-rtl .ui-datepicker-next { left: 2px; right: auto; } .ui-datepicker-rtl .ui-datepicker-prev:hover { right: 1px; left: auto; } .ui-datepicker-rtl .ui-datepicker-next:hover { left: 1px; right: auto; } .ui-datepicker-rtl .ui-datepicker-buttonpane { clear:right; } .ui-datepicker-rtl .ui-datepicker-buttonpane button { float: left; } .ui-datepicker-rtl .ui-datepicker-buttonpane button.ui-datepicker-current { float:right; } .ui-datepicker-rtl .ui-datepicker-group { float:right; } .ui-datepicker-rtl .ui-datepicker-group-last .ui-datepicker-header { border-right-width:0; border-left-width:1px; } .ui-datepicker-rtl .ui-datepicker-group-middle .ui-datepicker-header { border-right-width:0; border-left-width:1px; } /* IE6 IFRAME FIX (taken from datepicker 1.5.3 */ .ui-datepicker-cover { display: none; /*sorry for IE5*/ display/**/: block; /*sorry for IE5*/ position: absolute; /*must have*/ z-index: -1; /*must have*/ filter: mask(); /*must have*/ top: -4px; /*must have*/ left: -4px; /*must have*/ width: 200px; /*must have*/ height: 200px; /*must have*/ } .ui-autocomplete-loading { background: var(--bg-gray-98-3) url(https://hype.retroscene.org/templates/skin/synio-hype-mod/images/loader.gif) 50% 50% no-repeat; }/* -------------------------------------------- СТИЛИ ДЛЯ ПЕЧАТИ -------------------------------------------- */ @media print { @page { margin: 0.5cm; } * { background: transparent !important; color: black !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; font-family: Arial, sans-serif !important; } body, .text { font-size: 14pt; } a, a:visited { text-decoration: underline; } pre, blockquote { border: 1px solid #999; page-break-inside: avoid; } thead { display: table-header-group; } tr, img { page-break-inside: avoid; } img { max-width: 100% !important; } h1 { font-size: 30pt !important; font-weight: bold !important; } h4 { font-size: 26pt !important; } h5 { font-size: 23pt !important; } h6 { font-size: 20pt !important; } p, h3, h4, h5 { orphans: 3; widows: 3; } h3, h4, h5 { page-break-after: avoid; } h1 a { text-decoration: none !important; } #header, #userbar, #nav, #sidebar, #footer, #comments, .toolbar, .nav-filter-wrapper, .topic-footer, .stat-performance, .topic-actions, .reply-header, .nav { display: none !important; } #wrapper { -webkit-box-shadow: none; box-shadow: none; border: 0; padding: 0; } #content { width: 100%; margin: 0; } .topic { margin-bottom: 100px; } }.lang-z80, .lang-6502 { background: #272822 !important; padding-top: 0px !important; max-height: 400px; } .lang-z80 .str, .lang-6502 .str { color: #E6DB74; } .lang-z80 .kwd, .lang-6502 .kwd { color: #FFFFFF; font-weight: bold; } .lang-z80 .com, .lang-6502 .com { color: #75715E; font-style: italic; } .lang-z80 .typ, .lang-6502 .typ { color: #ffff00; } .lang-z80 .lit, .lang-6502 .lit { color: #16e100; } .lang-z80 .pun, .lang-6502 .pun { color: #15deaa; font-weight: bold; } .lang-z80 .pln, .lang-6502 .pln { color: #ff0088; }