/* * Global */ * { margin: 0; padding: 0; } /* * Base typography */ body { background: #edeae5; color: black; font-family: "NotoSans-SemiCondensed", sans-serif; font-size: 0.75rem; } body b, body strong { font-family: "NotoSans-SemiCondensedBold", sans-serif; font-weight: normal; } body i, body em { font-family: "NotoSans-SemiCondensedItalic", sans-serif; font-style: normal; } /* Debug */ #site_debug td { border: 1px solid black; } code, pre { font-family: "NotoSansMono-SemiCondensed", monospace; } /* * Common Elements */ a { color: #016670; text-decoration: none; } a:hover { color: black; text-decoration: underline; } button:not(.editor-toolbar button), input[type="button"], input[type="submit"] { background: #fbe180; box-shadow: 2px 2px 10px -5px slategray; } button:hover, input[type="button"]:hover, input[type="submit"]:hover { background: #fff9c7; } button:focus, input[type="button"]:focus, input[type="submit"]:focus { background: #fff9c7; } /* .spoilerButton { max-width: 540px; } */ .forum_post .body a:not([href="#"]), .rule_summary a, .wiki_article a, #actual_rules a, .news_post .pad a, .store_table a { color: #016670; text-decoration: none; } .forum_post .body a:hover:not([href="#"]), .rule_summary a:hover, .wiki_article a:hover, #actual_rules a:hover, .news_post .pad a:hover, .store_table a:hover { color: black; text-decoration: underline; } h1, h2, h3, h4 { margin: 0.5em 0; font-weight: bold; } h2 { text-align: center; /* font-size: 12pt; */ } /* h4 { font-size: 8pt; } */ p { margin: 1em 0.5em; /* margin: 10px 5px; */ } li { margin: 0.5em 2em; /* margin: 5px 15px; */ } img { border: none; } /* * Styles generated by the BBCode parser */ span.size1 { font-size: 0.75em; } span.size2 { font-size: 1em; } span.size3 { font-size: 1.25em; } span.size4 { font-size: 1.5em; } span.size5 { font-size: 1.75em; } span.size6 { font-size: 2em; } span.size7 { font-size: 2.25em; } span.size8 { font-size: 2.5em; } span.size9 { font-size: 2.75em; } span.size10 { font-size: 3em; } /* ul.thin { margin: 0px 0px 0px 25px; padding: 0px; } ul.thin li { margin: 0px 0px; padding: 0px; } */ /* * Main Layout */ #header { background: url("matcha/sam-komon.png"); margin-bottom: 2em; /* margin-bottom: 10px; */ padding: 0; width: 100%; } #content { margin: auto; margin-top: 2em; /* margin-top: 10px; */ min-width: 720px; overflow: hidden; width: 90%; } #footer { margin-top: 2em; /* margin-top: 10px; */ padding: 1em 0; text-align: center; width: 100%; /* opacity: 0; transition: ease-in-out 0.2s; transition-delay: 0.5s; */ } /* #footer:hover { opacity: 1; } */ #logo { background: url("/static/common/logos/matcha.png") no-repeat center; background-size: contain; width: 250px; height: 50px; margin: 0 0 0 10%; } #logo a { border: none; display: block; width: 100%; height: 50px; } #logo a:hover { border: none; } /* * Menus/Navigation */ /* Main */ #menu { background-color: #016670; font-size: 1.2em; /* font-size: 10pt; */ text-align: center; width: 100%; } #menu > ul { display: flex; width: 80%; margin: 0 auto; } #menu > ul > li { display: flex; flex: 1 1 auto; height: 2.4em; /* height: 32px; */ margin: 0; position: relative; } #menu ul > li > a { padding: 0.6em 0; display: inline-block; width: 100%; color: white; transition: ease-in-out 0.1s; text-decoration: none; } #nav_links { max-width: 2.4em; /* max-width: 40px; */ } #menu ul li a.active { background-color: #016670; } #menu ul li a:hover { /* #016670 44% → 65% brightness */ background-color: #0298a6; color: white; text-decoration: none; } /* Dropdown */ #menu .nav_dropdown { background: #016670; margin-top: 0; } .nav_dropdown > div { box-shadow: 2px 2px 10px -2px slategray; position: absolute; background-color: #016670; width: 100%; z-index: 99999; margin-top: 2.4em; /* margin-top: 32px; */ left: 0; } #nav_links > #links_menu { width: 8em; margin-left: -80px; /* width: 120px; margin-left: -80px; */ } .nav_dropdown > div > a { display: none; color: white; height: 2.4em; line-height: 2.4em; /* height: 32px; line-height: 32px; */ text-decoration: none; } .nav_dropdown:hover > div > a { display: block; } /* Search Bars */ #searchbars { text-align: center; background-color: #9fedd7; box-sizing: content-box; padding: 0.5em 10%; /* padding: 4px 10%; */ display: flex; } #searchbars > .search_form { flex: 1 1 auto; text-align: center; margin: 0 0.1em; /* margin: 0 3px; */ } #searchbars input { position: relative; border: 1px solid transparent; box-sizing: border-box; padding: 0.25em 0.25em 0.25em 0.5em; /* padding: 2px 2px 2px 4px; font-size: 0.9em; */ background-color: white; width: 100%; color: black; } #searchbars ul { margin: 0 auto; display: block; text-align: center; } #searchbars ul li { display: inline; margin: 0px 1px; list-style: none; position: relative; } #searchbars ul li ul { display: block; position: absolute; top: 1em; left: 0; z-index: 1000; background-color: white; width: 12em; margin-top: 1em; /* margin-top: 12px; */ } #searchbars ul li ul li { margin: 0 0 0 0; padding: 0; display: block; width: 100%; } #searchbars ul li ul li.highlight { background: white; } #searchbars ul li form { display: inline; } /* Upload, Invite, etc. */ #userinfo { background: #fff9c7; box-shadow: 0 2px 10px -2px slategray; color: black; padding: 0.5em 0; /* padding: 4px 0px; */ width: 100%; text-align: center; /* font-size: 8pt; */ } /* #userinfo img { margin-top: -5px; } */ #userinfo ul { display: inline; margin: 0 1%; /* margin: 0px 0.8%; */ } #userinfo ul li { display: inline; margin: 0 0.1em; line-height: 2em; /* line-height: 20px; */ vertical-align: middle; padding: 0; } #userinfo a { color: black; text-decoration: none; } #userinfo a:hover { text-decoration: underline; } #userinfo b a { font-weight: normal; font-size: 0.9em; font-weight: bold; } #cat-selector ul { width: 100%; } #cat-selector ul li { display: inline; /* width: 12em; height: 1em; float: left; */ } /* Alerts, Toolbox, etc. */ .alertbar { background-color: #fff9c7; text-align: center; color: black; font-weight: bold; /* font-size: 0.95em; */ width: 320px; margin: 2em auto; padding: 1em; /* padding: 10px; */ } .alertbar.warning { background-color: #ffe68a; } .alertbar.error { background-color: #ff8a8a; } .alertbar a { color: black; text-decoration: none; } .alertbar.modbar a { margin: 0 0.5em; /* margin: 0px 5px; */ } .alertbar a:hover { color: black; text-decoration: underline; } /* * IE doesn't appear to like a simple display:none in our header. * Random things start fucking up pretty badly. */ .hidden { position: absolute; left: -10000px; } input.hidden { position: absolute; display: none; } /* * Flexbox Layout */ .main_column { width: 590px; } .main_column table { margin-bottom: 1em; /* margin-bottom: 10px; */ } /* .main_column { display: flex; flex-direction: column; align-items: stretch; max-width: 85%; } .main_column table { display: flex; flex-direction: column; align-items: stretch; margin-bottom: 1em; /* margin-bottom: 10px; * } */ .box { /* font-size: 8pt; */ background-color: white; border: none; margin-bottom: 1em; /* border: 1px solid #666666; margin-bottom: 10px; */ } .sidebar { float: right; width: 250px; } /* .sidebar { display: flex; flex-direction: column; float: right; width: 250px; } */ /* * Generic Layout */ .thin { width: 850px; margin: 0px auto; } #userinfo_major .brackets:before { font-weight: bold; } #userinfo_major .brackets:after { font-weight: bold; } #userinfo_minor { position: absolute; text-align: left; } #userinfo_minor > li > ul { display: none; position: absolute; padding: 5px; left: -5px; background-color: #fff9c7; z-index: 100; } #userinfo #userinfo_minor li { display: block; } div.linkbox { text-align: center; padding: 0.5em; /* padding: 5px; */ } .center { text-align: center; } .right { text-align: right; } .pad { padding: 1em; } .donation_info ul { margin-left: 1em; } .slight_margin { margin: 0.5em; /* margin: 4px; */ } .vertical_space { margin-bottom: 1em; /* margin-bottom: 10px; */ } .torrents_nomatch { margin-top: 1em; /* margin-top: 10px; */ } .pad h3, .pad h4, .padbox h3, .padbox h4 { margin-top: 0px; padding-top: 0px; } .head { background: #9fedd7; color: black; padding: 0.5em 1em; /* padding: 4px; border-bottom: 1px solid #666; background: #E1E1E1; */ } .body { padding: 3px 10px 10px 10px; } .tags { /* padding: 0 0 0 2em; */ font-style: italic; } .tags a, a.search_link { color: black; font-weight: normal; } .tags a:hover, a:hover.search_link { color: black; text-decoration: underline; } ul.nobullet, ul.nobullet li { list-style-type: none; } table { width: 100%; border-collapse: collapse; /* border: 1px solid #666666; */ } tr { background-color: white; } td, th { /* border: 1px solid #666666; */ padding: 0.5em; /* padding: 5px; */ text-align: left; } .colhead { background: #9fedd7; font-weight: bold; color: black; } td.colhead, .colhead td, .colhead th { padding-left: 10px; padding-right: 10px; } .colhead .sign, .colhead_dark .sign { padding: 0 1em; /* padding: 0px 8px 0px 8px; */ vertical-align: middle; text-align: center; /* font-size: 12pt; */ font-weight: bold; } .colhead .sign { padding: 0 1em; /* padding: 0px 8px 0px 8px; font-size: 12pt; */ font-weight: bold; } .colhead_dark { background: #9fedd7; color: black; } .forum_post .colhead_dark { background: #9fedd7; } .forum_post.staff_post .colhead_dark { background: #fbe180; } .forum_post.sticky_post { border: 2px solid #fbe180; } td.label { font-weight: bold; text-align: right; width: 180px; } table.slice { margin-top: -1px; } .error_message { padding: 1em; /* padding: 10px; */ background-color: #ff8a8a; text-align: center; color: white; font-weight: bold; box-shadow: 2px 2px 10px -5px slategray; } .save_message { padding: 1em; /* padding: 10px; */ width: 50%; margin: 2em auto; background: #fbe180; text-align: center; color: black; font-weight: bold; box-shadow: 2px 2px 10px -5px slategray; } .elem_error { border: 2px solid red; } .hidden { display: none; } ul.nobullet { display: inline-block; } /* Layout (home page) */ ul.stats li { padding: 0 0 1px 0; } ul.poll li { padding: 0 0 0 10px; margin: 0; clear: left; } ul.poll li.graph { margin-bottom: 3px; padding-left: 20px; } /* Layout (torrents page) */ .show_torrents { width: 21px; height: 28px; background: url("images/show2.png") no-repeat center center; } .hide_torrents { width: 21px; height: 28px; background: url("images/hide2.png") no-repeat center center; } .show_torrents_link { border: none; width: 28px; height: 28px; display: block; cursor: pointer; } .filter_torrents { background: white; margin: auto; width: 765px; /* width: 750px; */ } .filter_torrents .submit { text-align: right; padding-top: 5px; } #content form.search_form + .torrent_table { margin-top: 20px; } #content form.search_form .submit { text-align: center; } .cat_list tr td { border: none; } .torrent_title { font-size: larger; } .torrent_table tr { /* vertical-align: top; */ vertical-align: middle; } /* .torrent_table .number_column { text-align: center; } */ .torrent_table, .torrent_table td { border: none; } /* .torrent_table tr.torrent, .torrent_table tr.group { font-weight: bold; } */ .torrent_table tr.group { background-color: white; } .torrent_table tr.group_torrent { background-color: white; } .torrent_table tr.torrent { background-color: white; } .torrent_table tr.group td.center:first-child { padding: 3px; width: 21px; } .torrent_table tr.torrent:nth-child(2n), .collage_table tr.row:nth-child(2n) { background-color: whitesmoke; } .torrent_table tr.torrent:nth-child(2n-1), .collage_table tr.row:nth-child(2n-1) { background-color: white; } .torrent_table tr.group { background-color: white; } .torrent_table div.tags { font-weight: normal; max-width: 500px; } .torrent_table tr .center, #collage_table td { vertical-align: middle; /* text-align: center; */ } /* #collage_name, #request_name { font-weight: bold; } */ .group_torrent span { float: right; } .torrent span { font-weight: normal; float: right; } .nobr { white-space: nowrap; } /* Layout (forums) */ /* .last_read { margin-left: 5px; fill: #A9A9A9; } .colhead_dark .last_read { fill: #DC86E0; } */ .unread_locked_sticky { background: url(images/locked_sticky_unread.png) no-repeat center center; } .read_locked_sticky { background: url(images/locked_sticky_read.png) no-repeat center center; } .read_sticky { background: url(images/sticky_read.png) no-repeat center center; } .unread_sticky { background: url(images/sticky_unread.png) no-repeat center center; } .unread_locked { background: url(images/locked_unread.png) no-repeat center center; } .read_locked { background: url(images/locked_read.png) no-repeat center center; } .unread { background: url(images/unread.png) no-repeat center center; } .read { background: url(images/read.png) no-repeat center center; } strong.quoteheader { color: black; } tr.row:nth-of-type(odd) { background-color: white; } table.forum_post { margin: 2em 0; /* margin: 10px 0px; */ width: 100%; } table.forum_post td { /* border: 1px solid #666; */ border: none; } table.forum_unread { border: 2px solid red; } td.avatar, #torrent_comments table.forum_post td.avatar { width: 120px; padding: 0px; } .box_description > div:not(.head) { max-height: 400px; overflow-y: scroll; } .box_description, table.forum_post td.body { word-break: break-word; word-wrap: break-word; display: inline-block; } .box_description { width: 100%; } .thin > table.forum_post td.body { width: 690px; } #torrent_comments table.forum_post td.body { width: 422px; } /* .thin > table.forum_post td.body { min-width: 600px; /* width: 690px; * } #torrent_comments table.forum_post td.avatar { max-width: 120px; padding: 0px; } #torrent_comments table.forum_post td.body { width: 600px; /* width: 422px; * } */ blockquote { margin: 0.5em 2em; padding: 1em; border: 1px solid #bbb; /* margin: 10px; padding: 10px; border: 1px dashed #666; */ } /* * Inbox Layout */ tr.unreadpm { background-color: #fff9c7; } /* Layout (permission page) */ .permission_head { width: 50%; margin: 1em auto; } .permissions { width: 90%; margin: 1em auto; } .permission_container { margin: auto; float: left; width: 30%; padding: 1em; } .permission_container input { margin: 0px 3px 5px 0px; vertical-align: top; } .submit_container { clear: both; text-align: right; } /* Layout (invite tree) */ ul .invitetree { margin: 0px 0px 0px 25px; } .invitetree li { list-style: none; margin: 10px 2px; } /* Layout (user options) */ .user_options .options_list li { margin: 0; } /* Layout (misc) */ .left_poll { display: none; width: 2px; height: 9px; float: left; margin: 0px; padding: 0px; } .center_poll { height: 9px; background: white; border-radius: 4px; float: left; margin: 0px; padding: 0px; } .right_poll { display: none; width: 2px; height: 9px; float: left; margin: 0px; padding: 0px; } .curtain { position: fixed; top: 0%; left: 0%; width: 100%; height: 100%; background: black; z-index: 1001; -moz-opacity: 0.8; opacity: 0.8; filter: alpha(opacity=80); } .lightbox { position: fixed; text-align: center; top: 5%; left: 5%; width: 90%; height: 90%; padding: 0px; z-index: 1002; overflow: auto; } .lightbox img { background: white; } .center { text-align: center; } tr.torrent .bookmark > a:before { color: black; } tr.torrent .bookmark > a:after { color: black; } .field_div { margin-bottom: 10px; } .brackets { font-weight: normal; } .post_id { font-weight: normal; } /* Get rid of extraneous padding in the Top Contributors box */ #request_top_contrib { border: none; } #request_top_contrib tr:first-child th { border-top: 0; } #request_top_contrib tr:last-child td { border-bottom: 0; } #request_top_contrib tr td:first-child, #request_top_contrib tr th:first-child, #request_top_contrib tr td:nth-child(2), #request_top_contrib tr th:nth-child(2) { border-left: 0; border-top: 0; } #request_top_contrib tr td:last-child, #request_top_contrib tr th:last-child { border-right: 0; } #request_table { margin-bottom: 0.5em; /* margin-bottom: 5px; */ } #request_table .request:nth-of-type(odd) { background: whitesmoke; } #request_table .request:nth-of-type(even) { background: white; } ol { margin-left: 1em; } #forum_search_cat_list { border: none; } #coverCont { background-color: #fff9c7; padding: 5px; box-shadow: 2px 2px 10px -2px slategray; } #coverCont img { background-color: #fff9c7; } .torrent_info { font-size: 100%; font-weight: 100; } .recent_snatches_images, .recent_uploads_images { position: relative; } .edit_tags_votes { padding-left: 5px; } .row_hl { background-color: #edeae5; } input.inputtext { border: none; border-bottom: 1px solid #edeae5; background-color: white; font-size: 13px; outline: none; transition: ease-in-out 0.12s; } input.inputtext:focus { border-bottom: 1px solid #fbe180; } .bbcode_bar { background: white; border: 1px solid #c7c7c7; border-bottom: none; } .bbcode_bar .emoji_box { background-color: white; } .collage_images .collage_image { margin: 1px; width: 120px; /* width: 121px; */ display: inline-block; } .box, .border, .alertbar, .artist_table, .request_table, .forum_index, #userinfo_minor > li > ul, .permissions table { box-shadow: 2px 2px 10px -2px slategray; /* margin: 1em auto; */ } /* .last_edited { font-size: 10px; opacity: 0.7; } */ #comm_badge_tr .badge_icon, #user_badge_edit_tr .badge_icon { margin-right: 1em; margin-left: 2px; } .store_table .badge_icon { display: inline-block; width: 4em; /* width: 16px; */ } .store_table .badge_icon img { display: block; margin-left: auto; margin-right: auto; } .hnr-yes { color: red; } .hnr-no { color: green; } .webm { max-width: 100%; } .point_gift_box p { margin: 7px 2px 0px; } .point_gift_box input[type="text"], .point_gift_box textarea { width: 100%; box-sizing: border-box; } .dead { opacity: 0.5; } /* .search_warning { fill: #E197E5; } */ caption { border-bottom: 1px solid #edeae5; font-weight: bold; } /* Torrent labels for the Format class */ .tl_free { color: green; } .tl_reported { color: red; } .tl_approved { color: green; } .tl_seeding { color: green; } .tl_leeching { color: orange; } .tl_notice { color: black; } .tl_snatched { color: black; } /* .tag_parody { color: #e08e00 !important; } .tag_character { color: #099809 !important; } .tag_female { color: #d51b8a !important; } .tag_male { color: #0000ff !important; } */