@charset "UTF-8"; /* STRUCTURE */ .header { display: table; width: 100%; background: #1c1c1c; table-layout: fixed; } .header > .item { display: table-cell; padding: 10px 0; border-bottom: 1px solid #2f2f2f; vertical-align: middle; text-align: center; } .header > .item.title { width: 250px; white-space: nowrap; } .logo { display: inline-block; font-size: 48px; height: 32px; width: 32px; padding: 10px; } .header > .item.title h1 { display: inline-block; margin: 0; } .header > .item.search input { width: 230px; } .header .item.search input:focus { width: 330px; } .header > .item.configure { width: 100px; } .item a:hover { text-decoration: none; } #global { display: table; width: 100%; height: 100%; background: #1c1c1c; table-layout: fixed; } .aside { display: table-cell; height: 100%; width: 250px; vertical-align: top; border-right: 1px solid #2f2f2f; background: #1c1c1c; } .aside .nav-form input { width: 180px; } .aside.aside_flux { padding: 10px 0 40px; } .aside.aside_feed .nav-form input { width: 140px; } .aside.aside_feed .nav-form .dropdown .dropdown-menu { right: -20px; } .aside.aside_feed .nav-form .dropdown .dropdown-menu:after { right: 33px; } .nav-login { display: none; } .nav_menu { width: 100%; background: #1c1c1c; border-bottom: 1px solid #2f2f2f; text-align: center; padding: 5px 0; } .nav_menu .search { display:none; } .favicon { height: 16px; width: 16px; } .categories { margin: 0; padding: 0; text-align: center; list-style: none; } .category { display: block; width: 220px; margin: 10px auto; text-align: left; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .category .btn:first-child { width: 195px; position: relative; } .category.stick .btn:first-child { width:160px; } .category .btn:first-child:not([data-unread="0"]):after { content: attr(data-unread); position: absolute; top: 3px; right: 3px; padding: 1px 5px; background: #1a1a1a; color: #888; font-size: 90%; border: 1px solid #000; border-radius: 5px; } .category + .feeds:not(.active) { display:none; } .categories .feeds { width: 100%; margin: 0; list-style: none; } .categories .feeds .item.active { background: #26303F; } .categories .feeds .item.active .feed { color: #888; } .categories .feeds .item.empty .feed { color: #e67e22; } .categories .feeds .item.empty.active { background: #e67e22; } .categories .feeds .item.empty.active .feed { color: #fff; } .categories .feeds .item.error .feed { color: #BD362F; } .categories .feeds .item .feed { display: inline-block; margin: 0; width: 165px; line-height: 35px; font-size: 90%; vertical-align: middle; text-align: left; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .feed:not([data-unread="0"]):before { content: "(" attr(data-unread) ") "; } .categories .feeds .dropdown-menu { left: 0; } .categories .feeds .dropdown-menu:after { left: 2px; } .categories .feeds .item .dropdown-toggle > .icon { visibility: hidden; cursor: pointer; } .categories .feeds .item .dropdown-target:target ~ .dropdown-toggle > .icon, .categories .feeds .item:hover .dropdown-toggle > .icon, .categories .feeds .item.active .dropdown-toggle > .icon { background-color: #1c1c1c; border-radius: 3px; visibility: visible; } .post { padding: 10px 50px; } .post form { margin: 10px 0; } .day { min-height: 50px; padding: 0 10px; font-size: 130%; font-weight: bold; line-height: 50px; background: #1c1c1c; border-top: 1px solid #2f2f2f; } #new-article + .day { border-top: none; } .day .name { position: absolute; right: 0; width: 50%; height: 1.5em; padding: 0 10px 0 0; overflow: hidden; color: #aab; font-size: 1.8em; opacity: .3; text-shadow: 0px -1px 0px #333; font-style: italic; white-space: nowrap; text-overflow: ellipsis; text-align: right; } #new-article { display: none; min-height: 40px; background: #26303F; text-align: center; } #new-article:hover { background: #4A5D7A; } #new-article > a { display: block; line-height: 40px; color: #fff; font-weight: bold; } #new-article > a:hover { text-decoration: none; } .flux { border-left: 3px solid #2f2f2f; background: #1c1c1c; } .flux.not_read { border-left: 3px solid #FF5300; background: #1c1c1c; } .flux.favorite { border-left: 3px solid #FFC300; background: #1c1c1c; } .flux.current { border-left: 3px solid #0062BE; background: #1a1a1a; } .horizontal-list > .item:not(.title):not(.website) > a { display: block; } .flux_header { background: inherit; height: 25px; font-size: 12px; border-top: 1px solid #2f2f2f; cursor: pointer; } .flux .item { line-height: 40px; white-space: nowrap; } .flux_header > .item { overflow: hidden; text-overflow: ellipsis; } .flux .item.manage { width: 40px; text-align: center; } .flux .item.website { width: 200px; } .website .favicon { padding: 5px; } .flux .item.title { background: inherit; } .flux .item.title a { color: #888; outline: none; } .flux.not_read .item.title, .flux.current .item.title { font-weight: bold; } .flux .item.date { width: 145px; padding:0 5px 0 0; text-align: right; font-size: 10px; color: #666; } .link { width: 40px; text-align: center; } #stream.reader .flux { padding: 0 0 30px; border: none; background: #1c1c1c; color: #888; } #stream.reader .flux .author { margin: 0 0 10px; font-size: 90%; color: #666; } #stream.global { text-align: center; } #stream.global .box-category { display: inline-block; width: 280px; margin: 20px 10px; vertical-align: top; background: #1a1a1a; border: 1px solid #000; border-radius: 5px; text-align: left; box-shadow: 0 0 5px #2f2f2f; } #stream.global .category { width: 100%; margin: 0; } #stream.global .btn { display: block; width: auto; height: 35px; margin: 0; padding: 0 10px; background: #26303F; border: none; border-bottom: 1px solid #2f2f2f; border-radius: 5px 5px 0 0; line-height: 35px; font-size: 120%; } #stream.global .btn:not([data-unread="0"]) { font-weight:bold; } #stream.global .btn:first-child:not([data-unread="0"]):after { top: 0; right: 5px; border: 0; background: none; color: #666; font-weight: bold; box-shadow: none; } #stream.global .box-category .feeds { display: block; max-height: 250px; margin: 0; list-style: none; overflow: auto; } #stream.global .box-category .feeds .item { padding: 2px 10px; font-size: 90%; } #stream.global .box-category .feed { width: 220px; } .content { min-height: 150px; max-width: 550px; margin: 0 auto; padding: 20px 10px; line-height: 170%; word-wrap: break-word; } .content h1, .content h2, .content h3 { margin: 20px 0 5px; } .content > .title { font-size: x-large; margin: 0; } .content p { margin: 0 0 20px; } img.big { display: block; margin: 10px auto; } figure img.big { margin: 0; } .content hr { margin: 30px 0; height: 1px; background: #ddd; border: 0; } .content pre { margin: 10px auto; padding: 10px; overflow: auto; background: #000; color: #fff; font-size: 110%; } .content q, .content blockquote { display: block; margin: 5px 0; padding: 5px 20px; font-style: italic; border-left: 4px solid #ccc; color: #666; } .content blockquote p { margin: 0; } #panel { display: none; position: fixed; top: 10px; bottom: 10px; left: 100px; right: 100px; overflow: auto; background: #1c1c1c; border: 1px solid #95a5a6; border-radius: 5px; } #panel .close { position: fixed; top: 10px; right: 0; display: inline-block; width: 26px; height: 26px; margin: 0 10px 0 0; border: 1px solid #ccc; border-radius: 20px; text-align: center; line-height: 26px; background: #fff; } #overlay { display: none; position: fixed; top: 0; bottom: 0; left: 0; right: 0; background: rgba(0, 0, 0, 0.9); } .flux_content .bottom { font-size: 90%; text-align: center; } .hide_posts > :not(.active) > .flux_content { display:none; } /*** PAGINATION ***/ .pagination { display: table; width: 100%; margin: 0; background: #1a1a1a; text-align: center; color: #888; font-size: 80%; line-height: 200%; table-layout: fixed; } .pagination .item { display: table-cell; line-height: 40px; } .pagination .item.pager-current { font-weight: bold; font-size: 140%; } .pagination .pager-first, .pagination .pager-previous, .pagination .pager-next, .pagination .pager-last { width: 100px; } .pagination .item a { display: block; color: #333; font-style: italic; } .pagination:first-child .item { border-bottom: 1px solid #aaa; } .pagination:last-child .item { border-top: 1px solid #aaa; } #nav_entries { display: table; width: 250px; height: 40px; position: fixed; bottom: 0; left: 0; margin: 0; background: #1c1c1c; border-top: 1px solid #2f2f2f; text-align: center; line-height: 40px; table-layout: fixed; } #nav_entries .item { display: table-cell; width: 30%; } #nav_entries a { display: block; } #nav_entries .i_up { margin: 5px 0 0; vertical-align: top; } .loading { background: url("loader.gif") center center no-repeat; font-size: 0; } #bigMarkAsRead { display: block; font-style: normal; padding: 32px 0 64px 0; text-align: center; text-decoration: none; } #bigMarkAsRead:hover { background: #1c1c1c; color: #888; } .bigTick { font-size: 72pt; line-height: 1.6em; } /*** NOTIFICATION ***/ #notification { position: absolute; top: 10px; left: 25%; right: 25%; min-height: 30px; padding: 10px; line-height: 30px; text-align: center; border-radius: 5px; box-shadow: 0 0 5px #666; background: #1a1a1a; color: #888; font-weight: bold; z-index: 10; } #notification.closed { display: none; } #notification.good { border:1px solid #f4f899; } #notification.bad { border:1px solid #f4a899; } #notification a.close { display: inline-block; width: 16px; height: 16px; float: right; margin: -20px -20px 0 0; padding: 5px; background: #1a1a1a; border-radius: 50px; line-height: 16px; } #notification.good a.close{ border:1px solid #f4f899; } #notification.bad a.close{ border:1px solid #f4a899; } .toggle_aside, .btn.toggle_aside { display: none; } .actualizeProgress { position: fixed; top: 10px; left: 25%; right: 25%; padding: 5px; background: #1a1a1a; text-align: center; border: 1px solid #2f2f2f; border-radius: 5px; } .actualizeProgress progress { max-width: 100%; vertical-align: middle; } .actualizeProgress .progress { color: #888; font-size: 90%; vertical-align: middle; } .logs { border: 1px solid #aaa; } .log { padding: 5px 2%; overflow: auto; background: #fafafa; border-bottom: 1px solid #999; color: #333; font-size: 90%; } .log .date { display: block; } .log.error { background: #fdd; color: #844; } .log.warning { background: #ffe; color: #c95; } .log.notice { background: #f4f4f4; color: #aaa; } .log.debug { background: #111; color: #eee; } .form-group table { border-collapse:collapse; margin:10px 0 0 220px; text-align:center; } .form-group tr, .form-group th, .form-group td { border:1px solid #2f2f2f; font-weight:normal; padding:.5em; } select.number option { text-align:right; } @media(min-width: 841px) { .flux:not(.current):hover .item.title { max-width: calc(100% - 580px); padding-right: 1.5em; position: absolute; } } @media(max-width: 840px) { .header, .aside .btn-important, .aside .feeds .dropdown, .flux_header .item.website span, .item.date { display: none; } .flux_header .item.website { width: 40px; text-align: center; } .flux_header .item.website .favicon { padding: 12px; } .nav-login { display: block; } .pagination { margin: 0 0 40px; } .pagination .pager-previous, .pagination .pager-next { width: 100px; } .toggle_aside, .btn.toggle_aside { display: inline-block; } .aside { position: fixed; top: 0; left: 0; width: 0; overflow: hidden; border-right: none; z-index: 10; transition: width 200ms linear; } .aside.aside_flux { padding: 10px 0 0; } .aside:target { width: 80%; border-right: 1px solid #aaa; overflow: auto; } .aside .toggle_aside { position: absolute; right: 0; display: inline-block; width: 26px; height: 26px; margin: 0 10px 0 0; border: 1px solid #ccc; border-radius: 20px; text-align: center; line-height: 26px; } .aside .categories { margin: 30px 0; } #nav_entries { width: 100%; } .nav_menu .btn { margin: 5px 10px; } .nav_menu .stick { margin: 0 10px; } .nav_menu .stick .btn { margin: 5px 0; } .nav_menu .search { display: inline-block; max-width: 97%; } .nav_menu .search input { max-width: 97%; width: 90px; } .nav_menu .search input:focus { width: 400px; } #panel { left: 5px; right: 5px; } .day .date { display: none; } .day .name { height: 2.6em; font-size: 1em; text-shadow: none; } .notification, .actualizeProgress { left: 10px; right: 10px; } } /*** FALLBACK ***/ .btn { background: #1c1c1c; } .btn:hover { background: -moz-linear-gradient(top, #4A5D7A 0%, #26303F 100%); background: -webkit-linear-gradient(top, #4A5D7A 0%, #26303F 100%); background: -o-linear-gradient(top, #4A5D7A 0%, #26303F 100%); background: -ms-linear-gradient(top, #4A5D7A 0%, #26303F 100%); } .btn-important { background: #26303F; } .btn-important:hover { background: -moz-linear-gradient(top, #4A5D7A 0%, #26303F 100%); background: -webkit-linear-gradient(top, #4A5D7A 0%, #26303F 100%); background: -o-linear-gradient(top, #4A5D7A 0%, #26303F 100%); background: -ms-linear-gradient(top, #4A5D7A 0%, #26303F 100%); } .btn-attention { background: #880011; } .btn-attention:hover { background: -moz-linear-gradient(top, #cc0044 0%, #880011 100%); background: -webkit-linear-gradient(top, #cc0044 0%, #880011 100%); background: -o-linear-gradient(top, #cc0044 0%, #880011 100%); background: -ms-linear-gradient(top, #cc0044 0%, #880011 100%); } .dropdown-menu:after { -moz-transform: rotate(45deg); -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); } .nav-head { background: #1c1c1c; } input.extend { -moz-transition: width 200ms linear; -webkit-transition: width 200ms linear; -o-transition: width 200ms linear; -ms-transition: width 200ms linear; } @media(max-width: 840px) { .aside { -moz-transition: width 200ms linear; -webkit-transition: width 200ms linear; -o-transition: width 200ms linear; -ms-transition: width 200ms linear; } } @media print { .header, .aside, .nav_menu, .day, .flux_header, .flux_content .bottom, .pagination { display: none; } html, body { background: #fff; color: #000; font-family: Serif; font-size: 12pt; } #global, .flux_content { display: block !important; } .flux_content .content { width: 100% !important; text-align: justify; } .flux_content .content a { color: #000; } .flux_content .content a:after { content: " (" attr(href) ") "; text-decoration: underline; } } .stat { border:1px solid #2f2f2f; border-radius:10px; margin:10px 0; padding:0 5px; } .stat > h2 { border-bottom:1px solid #2f2f2f; margin:0 -5px; padding-left:5px; } .stat > div { margin:5px 0; } .stat > table { border-collapse:collapse; margin:5px 0; width:100%; } .stat > table > thead > tr { border-bottom:2px solid #2f2f2f; } .stat > table > tbody > tr { border-bottom:1px solid #2f2f2f; } .stat > table > tbody > tr:last-child { border-bottom:0; } .stat > table th, .stat > table td { border-left:2px solid #2f2f2f; padding:5px; } .stat > table th:first-child, .stat > table td:first-child { border-left:0; } .stat > table td.numeric{ margin:5px 0; text-align:center; }