/*! * Derived from Moon - Theme for Kanboard by kenlog * Licensed under the MIT license - Moon/LICENSE * https://github.com/kenlog/Moon * Copyright (c) 2018 Valentino Pesce - https://iltuobrand.it */ h1, li, ul, ol, table, tr, td, th, p, blockquote, body { margin: 0; padding: 0; font-size: 100% } body { padding-bottom: 10px; color: #8d9498; background-color: #fefefe; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; text-rendering: optimizeLegibility } ::selection{background:rgba(113,113,113,0.5);color:#ffffff}::-moz-selection{background:rgba(113,113,113,0.5);color:#ffffff} small { font-size: 0.8em } hr { border: 0; height: 0; border-top: 1px solid rgba(0, 0, 0, 0.1); border-bottom: 1px solid rgba(255, 255, 255, 0.3) } .page { margin-left: 10px; margin-right: 10px } .margin-top { margin-top: 20px } .margin-bottom { margin-bottom: 20px } .pull-right { text-align: right } ul.no-bullet li { list-style-type: none; margin-left: 0 } #app-loading-icon { position: fixed; right: 3px; bottom: 3px } .assign-me { vertical-align: bottom } a { color: #0366d6; border: none; text-decoration: none; } a:focus { outline: 0; color: #0366d6; text-decoration: none } a:hover { color: #333; text-decoration: none } a .fa { padding-right: 3px; text-decoration: none; color: #acafb1 } h1, h2, h3 { font-weight: normal; color: #333 } h1 { font-size: 1.5em } h2 { font-size: 1.4em; margin-bottom: 10px } h3 { margin-top: 10px; font-size: 1.2em } table { width: 100%; border-collapse: collapse; border-spacing: 0; margin-bottom: 20px } table.table-fixed { table-layout: fixed; white-space: nowrap } table.table-fixed th { overflow: hidden } table.table-fixed td { white-space: nowrap; overflow: hidden; text-overflow: ellipsis } table.table-small { font-size: 0.8em } table.table-striped tr:nth-child(odd) { background: #fefefe } @media (max-width: 768px) { table.table-scrolling { overflow-x: auto; display: inline-block; vertical-align: top; max-width: 100%; white-space: nowrap } } table th { text-align: left; padding: 0.5em 5px; border: 1px solid #eee; background: #fafbfc; } table th a { text-decoration: none; color: #333 } table th a:focus, table th a:hover { text-decoration: underline } table td { border: 1px solid #f5f5f5; padding: 0.5em 7px; vertical-align: top } table td li { margin-left: 20px } .column-1 { width: 1% } .column-2 { width: 2% } .column-3 { width: 3% } .column-4 { width: 4% } .column-5 { width: 5% } .column-6 { width: 6% } .column-7 { width: 7% } .column-8 { width: 8% } .column-9 { width: 9% } .column-10 { width: 10% } .column-11 { width: 11% } .column-12 { width: 12% } .column-13 { width: 13% } .column-14 { width: 14% } .column-15 { width: 15% } .column-16 { width: 16% } .column-17 { width: 17% } .column-18 { width: 18% } .column-19 { width: 19% } .column-20 { width: 20% } .column-21 { width: 21% } .column-22 { width: 22% } .column-23 { width: 23% } .column-24 { width: 24% } .column-25 { width: 25% } .column-26 { width: 26% } .column-27 { width: 27% } .column-28 { width: 28% } .column-29 { width: 29% } .column-30 { width: 30% } .column-31 { width: 31% } .column-32 { width: 32% } .column-33 { width: 33% } .column-34 { width: 34% } .column-35 { width: 35% } .column-36 { width: 36% } .column-37 { width: 37% } .column-38 { width: 38% } .column-39 { width: 39% } .column-40 { width: 40% } .column-41 { width: 41% } .column-42 { width: 42% } .column-43 { width: 43% } .column-44 { width: 44% } .column-45 { width: 45% } .column-46 { width: 46% } .column-47 { width: 47% } .column-48 { width: 48% } .column-49 { width: 49% } .column-50 { width: 50% } .column-51 { width: 51% } .column-52 { width: 52% } .column-53 { width: 53% } .column-54 { width: 54% } .column-55 { width: 55% } .column-56 { width: 56% } .column-57 { width: 57% } .column-58 { width: 58% } .column-59 { width: 59% } .column-60 { width: 60% } .column-61 { width: 61% } .column-62 { width: 62% } .column-63 { width: 63% } .column-64 { width: 64% } .column-65 { width: 65% } .column-66 { width: 66% } .column-67 { width: 67% } .column-68 { width: 68% } .column-69 { width: 69% } .column-70 { width: 70% } .column-71 { width: 71% } .column-72 { width: 72% } .column-73 { width: 73% } .column-74 { width: 74% } .column-75 { width: 75% } .column-76 { width: 76% } .column-77 { width: 77% } .column-78 { width: 78% } .column-79 { width: 79% } .column-80 { width: 80% } .column-81 { width: 81% } .column-82 { width: 82% } .column-83 { width: 83% } .column-84 { width: 84% } .column-85 { width: 85% } .column-86 { width: 86% } .column-87 { width: 87% } .column-88 { width: 88% } .column-89 { width: 89% } .column-90 { width: 90% } .column-91 { width: 91% } .column-92 { width: 92% } .column-93 { width: 93% } .column-94 { width: 94% } .column-95 { width: 95% } .column-96 { width: 96% } .column-97 { width: 97% } .column-98 { width: 98% } .column-99 { width: 99% } .column-100 { width: 100% } .draggable-row-handle { cursor: move; color: #dedede } .draggable-row-handle:hover { color: #333 } tr.draggable-item-selected { background: #fff; border: 2px solid #666; box-shadow: 4px 2px 10px -4px rgba(0, 0, 0, 0.55) } tr.draggable-item-selected td { border-top: none; border-bottom: none } tr.draggable-item-selected td:first-child { border-left: none } tr.draggable-item-selected td:last-child { border-right: none } .table-stripped tr.draggable-item-hover, .table-stripped tr.draggable-item-hover { background: #FEFFF2 } .table-list { font-size: 0.85em; margin-bottom: 20px } .table-list-header { background: #f6f8fa; border: 1px solid #d1d5da; border-radius: 3px 3px 0px 0px; line-height: 28px; padding-left: 7px; padding-right: 7px; } .table-list-header a { color: #333; font-weight: 500; text-decoration: none; margin-right: 10px } .table-list-header a:hover, .table-list-header a:focus { color: #767676 } .table-list-header .table-list-header-count { color: #767676; display: inline-block; float: left } .table-list-header .table-list-header-menu { text-align: right } .table-list-row { padding-left: 7px; padding-right: 7px; border-bottom: 1px solid #e5e5e5; border-right: 1px solid #e5e5e5 } .table-list-row.table-border-left { border-left: 1px solid #e5e5e5 } .table-list-row:nth-child(odd) { background: #fefefe } .table-list-row:last-child { border-radius: 0 0 5px 5px } .table-list-row:hover { background: #f6f8fa; border-bottom: 1px solid #f6f8fa; border-right: 1px solid #f6f8fa } .table-list-row .table-list-title { font-weight: 500; line-height: 23px } .table-list-row .table-list-title.status-closed { text-decoration: line-through; margin-right: 10px } .table-list-row .table-list-title.status-closed a { font-style: italic } .table-list-row .table-list-title a { color: #333; text-decoration: none } .table-list-row .table-list-title a:hover, .table-list-row .table-list-title a:focus { text-decoration: underline } .table-list-row .table-list-details { color: #999; font-weight: 300; line-height: 20px } .table-list-row .table-list-details span { margin-left: 5px } .table-list-row .table-list-details span:first-child { margin-left: 0 } .table-list-row .table-list-details li { display: inline; list-style-type: none } .table-list-row .table-list-details li:after { content: ', ' } .table-list-row .table-list-details li:last-child:after { content: '' } .table-list-row .table-list-details strong { font-weight: 400; color: #555 } .table-list-row .table-list-details-with-icons { float: left } @media (max-width: 768px) { .table-list-row .table-list-details-with-icons { float: none } } .table-list-row .table-list-icons { font-size: 0.8em; text-align: right; line-height: 30px } @media (max-width: 768px) { .table-list-row .table-list-icons { text-align: left; line-height: 20px } } .table-list-row .table-list-icons span { margin-left: 5px } .table-list-row .table-list-icons a { text-decoration: none } .table-list-row .table-list-icons a:hover { color: #333 } .table-list-row .table-list-icons a:hover i { color: #333 } .table-list-category { font-size: 0.9em; font-weight: 500; color: #000; padding: 1px 2px 1px 2px; border-radius: 3px; background: #fcfcfc; border: 1px solid #ccc } .table-list-category a { text-decoration: none; color: #000 } .table-list-category a:hover { color: #0366d6 } fieldset { border: 1px solid #ddd; margin-top: 10px } legend { font-weight: 500; font-size: 1.2em } label { cursor: pointer; display: block; margin-top: 10px; font-weight: 400 } .select2-container--default .select2-selection--multiple .select2-selection__choice { background-color: #f9f9f9; border: 1px solid #ccc; border-radius: 4px; cursor: default; float: left; margin-right: 5px; margin-top: 5px; padding: 0 5px; } input[type="number"], input[type="date"], input[type="email"], input[type="password"], input[type="text"]:not(.input-addon-field) { color: #999; border: 1px solid #ccc; width: 300px; max-width: 95%; font-size: 1em; height: 25px; border-radius: 3px; padding-bottom: 0; padding-left: 4px; font-family: sans-serif; -webkit-appearance: none; -moz-appearance: none } input[type="number"]::-webkit-input-placeholder, input[type="date"]::-webkit-input-placeholder, input[type="email"]::-webkit-input-placeholder, input[type="password"]::-webkit-input-placeholder, input[type="text"]:not(.input-addon-field)::-webkit-input-placeholder { color: #dedede } input[type="number"]::-moz-placeholder, input[type="date"]::-moz-placeholder, input[type="email"]::-moz-placeholder, input[type="password"]::-moz-placeholder, input[type="text"]:not(.input-addon-field)::-moz-placeholder { color: #dedede } input[type="number"]:-ms-input-placeholder, input[type="date"]:-ms-input-placeholder, input[type="email"]:-ms-input-placeholder, input[type="password"]:-ms-input-placeholder, input[type="text"]:not(.input-addon-field):-ms-input-placeholder { color: #dedede } input[type="number"]:focus, input[type="date"]:focus, input[type="email"]:focus, input[type="password"]:focus, input[type="text"]:focus { color: #000; border-color: rgba(82, 168, 236, 0.8); outline: 0; box-shadow: 0 0 0 2px rgba(222,222,222,0.25) } input[type="number"] { width: 70px } input[type="text"]:not(.input-addon-field).form-numeric { width: 70px } input[type="text"]:not(.input-addon-field).form-datetime, input[type="text"]:not(.input-addon-field).form-date { width: 150px } input[type="text"]:not(.input-addon-field).form-input-large { width: 400px } input[type="text"]:not(.input-addon-field).form-input-small { width: 150px } textarea:focus { color: #000; border-color: rgba(82, 168, 236, 0.8); outline: 0; box-shadow: 0 0 0 2px rgba(222,222,222,0.25) } .text-editor-toolbar { margin-bottom: 10px!important; } textarea { padding: 4px; border: 1px solid #ccc; width: 400px; max-width: 99%; height: 200px; border-radius: 3px; font-family: sans-serif; font-size: 1em } textarea::-webkit-input-placeholder { color: #dedede } textarea::-moz-placeholder { color: #dedede } textarea:-ms-input-placeholder { color: #dedede } select { font-size: 1.0em; max-width: 95%; border: 1px solid #AAA; color: #555; font-size: inherit; overflow: hidden; border-radius: 3px; padding: 5px 10px; background-color: #fff; } select:focus { outline: 0 } select[multiple] { width: 300px } .tag-autocomplete { width: 400px } span.select2-container { margin-top: 2px } .form-actions { padding-top: 20px; clear: both } .form-required { color: red; padding-left: 5px; font-weight: bold } @media (max-width: 480px) { .form-required { display: none } } input[type="text"].form-max-width { width: 100% } input.form-error, textarea.form-error { border: 2px solid #b94a48 } input.form-error:focus, textarea.form-error:focus { box-shadow: none; border: 2px solid #b94a48 } .form-errors { color: #b94a48; list-style-type: none } ul.form-errors li { margin-left: 0 } .form-help { font-size: 0.8em; color: brown; margin-bottom: 15px } .form-inline { padding: 0; margin: 0; border: none } .form-inline label { display: inline; padding-right: 3px } .form-inline input, .form-inline select { margin: 0 15px 0 0 } .form-inline .form-required { display: none } .form-inline .form-actions { display: inline-block } .form-inline .js-submit-buttons-rendered { display: inline-block } .form-inline-group { display: inline } .form-columns { display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: flex-start; justify-content: flex-start } .form-columns .form-column { margin-right: 25px; flex-grow: 1 } .form-columns fieldset { margin-top: 0 } .form-login { max-width: 350px; margin: 5% auto 0 } @media (max-width: 480px) { .form-login { margin-left: 5px } } .form-login li { margin-left: 25px; line-height: 25px } .form-login h2 { margin-bottom: 30px; font-weight: bold } .reset-password { margin-top: 20px; margin-bottom: 20px } .reset-password a { color: #999 } .input-addon { display: flex } .input-addon-field { flex: 1; font-size: 1em; color: #999; margin: 0; -webkit-appearance: none; -moz-appearance: none } .input-addon-field:first-child { border-radius: 5px 0 0 5px } .input-addon-field:last-child { border-radius: 0 5px 5px 0 } .input-addon-item { background-image: linear-gradient(-180deg, #fafbfc 0%, #eff3f6 90%); color: #666; font: inherit; font-weight: normal; } .input-addon-item:first-child { border-radius: 5px 0 0 5px } .input-addon-item:last-child { border-radius: 0 5px 5px 0 } @media (max-width: 480px) { .input-addon-item .dropdown .fa-caret-down { display: none } } .input-addon-field, .input-addon-item { border: 1px solid rgba(147, 128, 108, 0.25); padding: 4px 0.75em } .input-addon-field:not(:first-child), .input-addon-item:not(:first-child) { border-left: 0 } .icon-success { color: #468847 } .icon-error { color: #b94a48 } .icon-fade-out { opacity: 1; animation: icon-fadeout 5s linear forwards } @keyframes icon-fadeout { 0% { opacity: 1 } 100% { opacity: 0 } } .alert { padding: 8px 35px 8px 14px; margin-top: 5px; margin-bottom: 5px; color: #464646; background-color: #FFEB3B; border: 1px solid #f9df00; border-radius: 4px } .alert-success { color: #468847; background-color: #dff0d8; border-color: #d6e9c6 } .alert-error { color: #b94a48; background-color: #f2dede; border-color: #eed3d7 } .alert-info { color: #464646; background-color: #92ddff; border-color: #83d8ff; } .alert-normal { color: #333; background-color: #f0f0f0; border-color: #ddd } .alert ul { margin-top: 10px; margin-bottom: 10px } .alert li { margin-left: 25px } .alert-fade-out { text-align: center; position: fixed; bottom: 0; left: 20%; width: 60%; padding-top: 5px; padding-bottom: 5px; margin-bottom: 0; border-width: 1px 0 0; border-radius: 4px 4px 0 0; z-index: 9999; opacity: 1; animation: fadeout 5s linear forwards } @keyframes fadeout { 0% { opacity: 1 } 100% { opacity: 0 } } a.btn { text-decoration: none } .btn { -webkit-appearance: none; -moz-appearance: none; font-size: 1.2em; font-weight: normal; cursor: pointer; display: inline-block; border-radius: 2px; padding: 3px 10px; margin: 0; border: 1px solid #ddd; background: #f5f5f5; color: #333 } .btn:hover, .btn:focus { background-color: #eee; color: #000; border-color: #eee; border-color: #e5e5e5; } .btn-red { border-color: #b0281a; background: #d14836; color: #fff } .btn-red:hover, .btn-red:focus { background-color: #28a745; background-image: linear-gradient(-180deg, #34d058 0%, #28a745 90%); color: #fff; border-color: #28a745; } .btn-blue { border-color: #3079ed; background-image: linear-gradient(-180deg, #4d90fe 0%, #335996 90%); color: #fff } .btn-blue:hover, .btn-blue:focus { background-color: #28a745; background-image: linear-gradient(-180deg, #34d058 0%, #28a745 90%); color: #fff; border-color: #28a745; } .btn:disabled { color: #ccc; border-color: #ccc; background: #f7f7f7 } .buttons-header { font-size: 0.8em; margin-top: 5px; margin-bottom: 15px } .tooltip i.fa { cursor: pointer } .tooltip .fa-info-circle { color: #999 } #tooltip-container { padding: 5px; background: #fff; border: 1px solid #ddd; border-radius: 4px; box-shadow: 0 6px 12px #aaa; position: absolute; min-width: 350px } #tooltip-container .markdown p { margin-bottom: 0 } #tooltip-container .tooltip-large { width: 600px } h2 .dropdown ul { display: none } .dropdown { display: inline; position: relative } .dropdown ul { display: none } .dropdown-smaller { font-size: 0.85em } ul.dropdown-submenu-open { display: block; position: absolute; z-index: 1000; min-width: 285px; list-style: none; margin: 3px 0 0 1px; padding: 6px 0; background-color: #fff; border: 1px solid #b2b2b2; border-radius: 3px; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15) } .dropdown-submenu-open li { display: block; margin: 0; padding: 9px 20px; font-size: 0.9em; border-bottom: none; cursor: pointer; } .dropdown-submenu-open li.no-hover { cursor: default } .dropdown-submenu-open li:last-child { border: none } .dropdown-submenu-open li:not(.no-hover):hover { background: #f6f8fa; color: #8d9498 } .dropdown-submenu-open li:hover a { color: #262626 } .dropdown-submenu-open a { text-decoration: none; color: #333 } .dropdown-submenu-open a:focus { text-decoration: underline } .dropdown-menu-link-text, .dropdown-menu-link-icon { color: #333; text-decoration: none } .dropdown-menu-link-text:hover { text-decoration: underline } td a.dropdown-menu strong { color: #cb2431 } td a.dropdown-menu strong i { color: #cb2431 } td a.dropdown-menu i { color: #dedede } td a.dropdown-menu:hover strong { color: #555 } td a.dropdown-menu:hover strong i { color: #555 } td a.dropdown-menu:hover i { color: #333 } .accordion-title { background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAADCAYAAABS3WWCAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNSBNYWNpbnRvc2giIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NEQ5RDgxQzc2RjQ5MTFFMjhEMUNENzFGRUMwRjhBRTciIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NEQ5RDgxQzg2RjQ5MTFFMjhEMUNENzFGRUMwRjhBRTciPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo0RDlEODFDNTZGNDkxMUUyOEQxQ0Q3MUZFQzBGOEFFNyIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo0RDlEODFDNjZGNDkxMUUyOEQxQ0Q3MUZFQzBGOEFFNyIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PvXFWFAAAAAYSURBVHjaYvj//z8D0/Pnz/8zgFgAAQYAS5UJscReGMIAAAAASUVORK5CYII=) repeat-x scroll 0 10px } .accordion-title h3 { display: inline; padding-right: 5px; background: #fff } .accordion-content { margin-top: 15px; margin-bottom: 25px } .accordion-toggle { color: #333; text-decoration: none } .accordion-toggle:focus { color: #333 } .accordion-toggle:hover { color: #999 } .accordion-toggle:before { content: "\f0d7" } .accordion-collapsed { margin-bottom: 25px } .accordion-collapsed .accordion-toggle:before { content: "\f0da" } .accordion-collapsed .accordion-content { display: none } #select-dropdown-menu { position: absolute; display: block; z-index: 1000; min-width: 160px; padding: 5px 0; background: #fff; list-style: none; border: 1px solid #ccc; border-radius: 3px; box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175); overflow-x: hidden; } .select-dropdown-menu-item { white-space: nowrap; overflow: hidden; padding: 3px 10px; color: #555; cursor: pointer; border-bottom: 1px solid #f8f8f8; line-height: 1.5em; font-weight: 400 } .select-dropdown-menu-item.active { color: #fff; background: #0366d6 } .select-dropdown-menu-item:last-child { border: none } .select-dropdown-input-container { position: relative; border: 1px solid #ccc; border-radius: 3px; background-color: #fff; max-width: 300px; } .select-dropdown-input-container input.select-dropdown-input { margin: 0 0 0 5px; border: none; height: 23px } .select-dropdown-input-container input.select-dropdown-input:focus { border: none; box-shadow: none } .select-dropdown-input-container .select-dropdown-chevron { color: #555; position: absolute; top: 4px; right: 5px; cursor: pointer } .select-dropdown-input-container .select-loading-icon { color: #555; position: absolute; top: 4px; right: 5px } #suggest-menu { position: absolute; display: block; z-index: 1000; min-width: 160px; padding: 5px 0; background: #fff; list-style: none; border: 1px solid #ccc; border-radius: 3px; box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175) } .suggest-menu-item { white-space: nowrap; padding: 3px 10px; color: #333; font-weight: bold; cursor: pointer } .suggest-menu-item.active { color: #fff; background: #0366d6 } .suggest-menu-item.active small { color: #fff } .suggest-menu-item small { color: #999; font-weight: normal } #modal-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.9); overflow: auto; z-index: 100 } #modal-box { position: fixed; max-height: calc(100% - 30px); top: 0; padding: 20px; left: 50%; transform: translateX(-50%); background: #fafbfc; overflow: auto; border-radius: 0px 0px 3px 3px; } #modal-content { padding: 0 5px 5px } #modal-header { text-align: right; padding-right: 5px } #modal-close-button { color: #333 } #modal-close-button:hover { color: #b94a48 } .pagination { text-align: center; font-size: 0.9em } .pagination-showing { margin-right: 5px; padding-right: 5px; border-right: 1px solid #999 } .pagination-next { margin-left: 5px } .pagination-previous { margin-right: 5px } .header img { float: left; } .header h2 { position: relative; color:#fff; top: 16px; left: 10px; margin: 0; } header { display: flex; flex-wrap: wrap; padding: 5px 10px; margin-bottom: 5px; border-bottom: 0px solid #dedede; padding: 15px 10px; margin-bottom: 15px; background: #24292e; } header .title-container { flex: 1; min-width: 300px } @media (max-width: 480px) { header .title-container { order: 3 } } header .board-selector-container { min-width: 320px; display: flex; align-items: center } @media (max-width: 480px) { header .board-selector-container { order: 2; min-width: 300px } header .board-selector-container input[type=text] { max-width: 280px } } header .menus-container { min-width: 120px; display: flex; align-items: center; justify-content: flex-end } @media (max-width: 480px) { header .menus-container { order: 1; margin-bottom: 5px; margin-left: auto } } header h1 { font-size: 1.4em!important; color: #dddddd!important } header h1 .tooltip { opacity: 0.3; font-size: 0.7em } a i.web-notification-icon { color: #0366d6 } a i.web-notification-icon:focus, a i.web-notification-icon:hover { color: #000 } .logo a { opacity: 0.5; color: #d40000; text-decoration: none } .logo span { color: #333 } .logo a:hover { opacity: 0.8; color: #333 } .logo a:focus span, .logo a:hover span { color: #d40000 } .page-header { margin-bottom: 20px; padding: 10px; background-color: #fafbfc; border-radius: 3px; } .page-header .dropdown { padding-right: 10px } .page-header h2 { margin: 0; padding: 0; font-weight: bold; border-bottom: none; } .page-header h2 a { color: #333; text-decoration: none } .page-header h2 a:focus, .page-header h2 a:hover { color: #999 } .page-header ul { text-align: left; margin-top: 5px; display: inline-block } .page-header li { display: inline; padding-right: 15px } @media (max-width: 480px) { .page-header li { display: block; line-height: 1.5em } } .page-header li.active a { color: #333; text-decoration: none; font-weight: bold } .page-header li.active a:hover, .page-header li.active a:focus { text-decoration: underline } .menu-inline { margin-bottom: 5px } .menu-inline li { display: inline; padding-right: 15px } .menu-inline li .active a { font-weight: bold; color: #000; text-decoration: none } .sidebar-container { height: 100%; display: flex; flex-flow: row } @media (max-width: 768px) { .sidebar-container { flex-flow: wrap } } .sidebar-content { padding-left: 10px; flex: 1 100%; max-width: 85%; overflow-wrap: break-word } @media (max-width: 768px) { .sidebar-content { padding-left: 0; order: 1; max-width: 100% } } @media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 1) { .sidebar-content { max-width: 75% } } .sidebar { max-width: 25%; border: 1px solid #d1d5da; min-width: 230px; padding: 8px 10px; border-radius: 3px; background: #fafbfc; } @media (max-width: 768px) { .sidebar { flex: 1 auto; order: 2 } } .sidebar h2 { margin-top: 0 } .sidebar>ul a { text-decoration: none; color: #586069; font-weight: 500 } .sidebar>ul a:hover { color: #23292d } .sidebar>ul li { list-style-type: none; line-height: 35px; border-bottom: 1px dotted #e5e5e5; padding-left: 13px } .sidebar>ul li:hover { border-left: 5px solid #555; padding-left: 8px } .sidebar>ul li.active { border-left: 5px solid #23292d; padding-left: 8px } .sidebar>ul li.active a { color: #23292d; font-weight: bold } .sidebar-icons>ul li { padding-left: 0 } .sidebar-icons>ul li:hover, .sidebar-icons>ul li.active { padding-left: 0; border-left: none } .sidebar>ul li.active a:focus, .sidebar>ul li.active a:hover { color: #555 } .sidebar>ul li:last-child { margin-bottom: 15px } .avatar img { vertical-align: bottom } .avatar-left { float: left; margin-right: 10px } .avatar-inline { display: inline-block; margin-right: 3px } .avatar-48 img, .avatar-48 div { border-radius: 30px } .avatar-48 .avatar-letter { line-height: 48px; width: 48px; font-size: 25px } .avatar-20 img, .avatar-20 div { border-radius: 10px } .avatar-20 .avatar-letter { line-height: 20px; width: 20px; font-size: 11px } .avatar-letter { color: #fff; text-align: center } #file-dropzone, #screenshot-zone { position: relative; border: 2px dashed #ccc; width: 99%; height: 250px; overflow: auto } #file-dropzone-inner, #screenshot-inner { position: absolute; left: 0; bottom: 48%; width: 100%; text-align: center; color: #aaa } #screenshot-zone.screenshot-pasted { border: 2px solid #333 } #file-list { margin: 20px } #file-list li { list-style-type: none; padding-top: 8px; padding-bottom: 8px; border-bottom: 1px dotted #ddd; width: 95% } #file-list li .file-error { font-weight: bold; color: #b94a48 } .file-thumbnails { display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: flex-start; justify-content: flex-start } .file-thumbnail { width: 250px; border: 1px solid #efefef; border-radius: 5px; margin-bottom: 20px; box-shadow: 4px 2px 10px -6px rgba(0, 0, 0, 0.55); margin-right: 15px } .file-thumbnail img { cursor: pointer; border-top-left-radius: 5px; border-top-right-radius: 5px } .file-thumbnail img:hover { opacity: 0.5 } .file-thumbnail-content { padding-left: 8px; padding-right: 8px } .file-thumbnail-title { font-weight: 700; font-size: 0.9em; color: #555; overflow: hidden; text-overflow: ellipsis } .file-thumbnail-description { font-size: 0.8em; color: #999; margin-top: 8px; margin-bottom: 5px } .file-viewer { position: relative } .file-viewer img { max-width: 95%; max-height: 85%; margin-top: 10px } .color-picker { width: 180px } .color-picker-option { height: 25px } .color-picker-square { display: inline-block; width: 18px; height: 18px; margin-right: 5px; border: 1px solid #000 } .color-picker-label { display: inline-block; vertical-align: bottom; padding-bottom: 3px } .filter-box { max-width: 1024px } .action-menu { color: #333; text-decoration: none } .action-menu:hover, .action-menu:focus { text-decoration: underline } .js-project-creation-options { max-width: 500px; border-left: 3px solid #efefef; margin-top: 20px; padding-left: 15px; padding-bottom: 5px; padding-top: 5px } .project-overview-columns { display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; margin-bottom: 20px; font-size: 1.4em } @media (max-width: 480px) { .project-overview-columns { display: block } } .project-overview-column { text-align: center; margin-right: 3%; margin-top: 5px; padding: 3px 15px 3px 15px; border: 1px dashed #ddd } @media (max-width: 480px) { .project-overview-column { text-align: left } } .project-overview-column small { color: #999 } .project-overview-column strong { color: #555; display: block } @media (max-width: 480px) { .project-overview-column strong { display: inline } } .project-header { margin-bottom: 8px } .project-header .dropdown-component { margin-top: 4px; margin-right: 5px; float: left } @media (max-width: 768px) { .project-header .dropdown-component { float: none } } .project-header .views-switcher-component { margin-top: 4px; float: left } @media (max-width: 768px) { .project-header .views-switcher-component { float: none; margin-bottom: 10px } } .project-header .filter-box-component form { margin: 0 } .views { margin-right: 10px; margin-top: 1px; font-size: 0.9em } @media (max-width: 560px) { .views { width: 100% } } @media (max-width: 768px) { .views { margin-top: 10px; font-size: 1em } } @media (max-width: 480px) { .views { margin-top: 5px } } .views li { white-space: nowrap; background-color: #e6ebf1; background-image: linear-gradient(-180deg, #f0f3f6 0%, #e6ebf1 90%); background-position: -.5em; border-color: rgba(27,31,35,0.35); border: 1px solid #ddd; border-right: none; padding: 4px 8px; display: inline; } .views li:hover { white-space: nowrap; background-image: linear-gradient(-180deg, #fafbfc 0%, #eff3f6 90%); border: 1px solid #ddd; border-right: none; padding: 4px 8px; display: inline; } @media (max-width: 560px) { .views li { display: block; margin-top: 5px; border-radius: 5px; border: 1px solid #ddd } } .views li.active a { font-weight: bold; color: #000; text-decoration: none } .views li:first-child { border-top-left-radius: 5px; border-bottom-left-radius: 5px } .views li:last-child { border-right: 1px solid #ddd; border-top-right-radius: 5px; border-bottom-right-radius: 5px } .views a { color: #555; text-decoration: none } .views a:hover { color: #333; text-decoration: none; } .dashboard-project-stats small { margin-right: 10px; color: #999 } .dashboard-table-link { font-weight: bold; color: #000; text-decoration: none } .dashboard-table-link:focus, .dashboard-table-link:hover { color: #999 } .public-board { margin-top: 5px } .public-task { max-width: 800px; margin: 5px auto 0 } #board-container { overflow-x: auto } #board { table-layout: fixed; margin-bottom: 0 } #board th.board-column-header { width: 240px } #board td { vertical-align: top } .board-container-compact { overflow-x: initial } @media all and (-ms-high-contrast: active), (-ms-high-contrast: none) { .board-container-compact #board { table-layout: auto } } #board th.board-column-header.board-column-compact { width: initial } .board-column-collapsed { display: none } td.board-column-task-collapsed { font-weight: bold; background-color: #f6f8fa } #board th.board-column-header-collapsed { width: 28px; min-width: 28px; text-align: center; overflow: hidden } .board-rotation-wrapper { position: relative; padding: 8px 4px; min-height: 150px; overflow: hidden } .board-rotation { white-space: nowrap; -webkit-backface-visibility: hidden; -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); -webkit-transform-origin: 0 100%; -moz-transform-origin: 0 100%; -ms-transform-origin: 0 100%; transform-origin: 0 100% } .board-column-title .dropdown-menu { text-decoration: none } .board-add-icon { float: left; padding: 0 5px } .board-add-icon i { text-decoration: none; color: #279f43; font-size: 1.4em } .board-add-icon i:focus, .board-add-icon i:hover { text-decoration: none; color: #23292d } .board-column-header-task-count { color: #999; font-weight: normal } a.board-swimlane-toggle { text-decoration: none } a.board-swimlane-toggle:hover, a.board-swimlane-toggle:focus { color: #000; text-decoration: none; border: none } .board-task-list { min-height: 60px } .board-task-list .task-board:last-child { margin-bottom: 0 } .board-task-list-limit { background-color: #DF5353 } .draggable-item { cursor: pointer; user-select: none; -webkit-user-select: none; -moz-user-select: none } .draggable-placeholder { border: 2px dashed #000; background: #fafafa; height: 70px; margin-bottom: 10px } div.draggable-item-selected { border: 1px solid #000 } .task-board-sort-handle { float: left; padding-right: 5px } .task-board { margin-bottom: 8px; padding: 12px; border-radius: 3px; box-shadow: 0px 1px 1px 0 rgba(46, 61, 73, 0.30); border-bottom: none; border-left: none; border-right: 2px solid; border-top: none; background-color: #f9f9f9!important; } div.task-board-recent { border-width: 2px } div.task-board-status-closed { user-select: none; border: 1px dotted #555 } .task-board a { color: #0366d6; font-weight: 600; text-decoration: none } .task-board-collapsed { overflow: hidden; white-space: nowrap; text-overflow: ellipsis } .task-board-title { margin-top: 5px; margin-bottom: 8px } .task-board-title a:hover { text-decoration: underline } .task-board-saving-state { opacity: 0.3 } .task-board-saving-icon { position: absolute; margin: auto; width: 100%; text-align: center; color: #000 } .task-board-avatars { text-align: right; float: right } .task-board-change-assignee { cursor: pointer } .task-board-change-assignee:hover { opacity: 0.6 } .task-list-avatars { display: inline-block; float: left } @media (max-width: 768px) { .task-list-avatars { float: none; display: block } } .task-list-avatars .task-avatar-assignee { font-weight: 300; color: #999 } .task-list-avatars:hover .task-avatar-assignee { font-weight: 400; color: #000 } .task-board-icons, .task-list-icons { font-size: 0.8em; text-align: right } .task-board-icons a, .task-list-icons a { text-decoration: none } .task-board-icons a:hover, .task-list-icons a:hover { color: #333 } .task-board-icons a:hover i, .task-list-icons a:hover i { color: #333 } .task-board-icons .task-score, .task-list-icons .task-score { font-weight: bold } .task-board-icons .flag-milestone, .task-list-icons .flag-milestone { color: green } .task-board-icons { margin-top: 7px } .task-board-icons a { opacity: 0.5 } .task-board-icons span { opacity: 0.5; color: #1e252a; margin-left: 4px } .task-board-icons a:hover { opacity: 1.0; font-weight: bold } .task-board-icons .task-board-icons-row { line-height: 22px } .task-list-icons { line-height: 22px } .task-list-icons a, .task-list-icons span, .task-list-icons i { color: #999; opacity: 1.0 } .task-list-icons span { margin-left: 5px } @media (max-width: 768px) { .task-list-icons { text-align: left } } .task-icon-age { display: inline-block } span.task-icon-age-total { border: 1px solid #e5e5e5; padding: 1px 3px 1px 3px; border-top-left-radius: 3px; border-bottom-left-radius: 3px } span.task-icon-age-column { border: 1px solid #e5e5e5; border-left: none; margin-left: -5px; padding: 1px 3px 1px 3px; border-top-right-radius: 3px; border-bottom-right-radius: 3px } .task-board span.task-icon-age-total, .task-board span.task-icon-age-column { border-color: #666 } .task-board-category-container { text-align: right; margin-top: 8px; margin-bottom: 8px } .task-board-category { border: 1px solid #555; font-size: 0.9em; font-weight: 500; color: #000; padding: 1px 3px 1px 2px; border-radius: 3px } .task-board-category a:hover { text-decoration: underline } .task-date { font-weight: 500; color: #000 } span.task-date-today { opacity: 1.0; color: #0366d6 } span.task-date-overdue { opacity: 1.0; color: #b94a48 } .task-tags li { display: inline-block; margin: 3px 3px 0 0; padding: 1px 3px 1px 3px; color: #333; border: 1px solid #333; border-radius: 4px } .task-summary-container .task-tags { margin-top: 10px } .task-list-tag { padding: 0.1em 0.9em; margin: 0 0.5em 0.5em 0; white-space: nowrap; background-color: #f9f9f9; border-radius: 3px; } #task-summary { margin-bottom: 15px } #task-summary h2 { color: #555; font-size: 1.6em; margin-top: 0; padding-top: 0 } .task-summary-container { border: none; border-radius: 3px; border-bottom: 5px solid; padding: 20px; } .task-summary-columns { display: flex; flex-flow: row; justify-content: space-between } @media (max-width: 768px) { .task-summary-columns { flex-flow: column } } .task-summary-column { color: #333 } .task-summary-column span { color: #555 } .task-summary-column li { line-height: 23px } #external-task-view { padding: 10px; margin-top: 10px; margin-bottom: 10px; border: 1px dotted #ccc } .task-form-container { box-sizing: border-box; display: flex; flex-wrap: wrap } .task-form-container>* { box-sizing: border-box } .task-form-container>* { width: 1% } .task-form-main-column { width: 60% } @media (max-width: 1000px) { .task-form-main-column { width: 100% } } .task-form-main-column input[type="text"] { width: 700px; max-width: 99% } .task-form-secondary-column { max-width: 250px; min-width: 200px; max-height: 600px; padding-left: 10px; overflow: auto; width: 20% } @media (max-width: 1000px) { .task-form-secondary-column { width: 100%; max-width: 99%; max-height: none } } @media (max-width: 768px) { .task-form-secondary-column { padding-left: 0 } } .task-form-secondary-column label:first-child { margin-top: 0 } @media (max-width: 1000px) { .task-form-secondary-column label:first-child { margin-top: 10px } } .task-form-bottom { width: 100% } .comment-sorting { text-align: right } .comment-sorting a { color: #555; font-weight: normal; text-decoration: none } .comment-sorting a:hover { color: #999 } .comment { padding: 5px; margin-bottom: 15px } .comment-title { border-bottom: 1px dotted #eee; margin-left: 55px } .comment-date { color: #999; font-weight: 200 } .comment-actions { text-align: right } .comment-content { margin-left: 55px } .comments .text-editor textarea { height: 90px } .comments .text-editor .text-editor-preview-area { height: 90px } .comments .comment-highlighted { background-color: #f6f8fa; border: 2px solid #ffeb8e } .comments .comment-highlighted:hover { background-color: #f6f8fa } .comments .comment:hover { background: #f6f8fa } .comments .comment:nth-child(even):not(.comment-highlighted) { background: #f6f8fa } .comments .comment:nth-child(even):not(.comment-highlighted):hover { background: #f6f8fa } .subtask-cell { padding: 4px 10px; border-top: 1px dotted #dedede; border-left: 1px dotted #dedede; display: table-cell; vertical-align: middle } .subtask-cell a { color: #333; text-decoration: none } .subtask-cell a:hover, .subtask-cell a:focus { color: #0366d6 } .subtask-cell:first-child { border-left: none } @media (max-width: 768px) { .subtask-cell { width: 90%; display: block; border-left: none } } .task-list-subtasks { display: table; width: 100% } @media (max-width: 768px) { .task-list-subtasks { display: block } } .task-list-subtask { display: table-row } @media (max-width: 768px) { .task-list-subtask { display: block } } @media (max-width: 768px) { .subtask-assignee, .subtask-time-tracking-cell { display: none } } .task-links-table td { vertical-align: middle } .task-links-task-count { color: #999; font-weight: normal } .task-link-closed { text-decoration: line-through } .text-editor { margin-top: 10px } .text-editor a { font-size: 1em; color: #999; text-decoration: none; margin-right: 10px } .text-editor a:hover { color: #0366d6 } .text-editor .text-editor-preview-area { border: none; width: 700px; max-width: 99%; height: 250px; overflow: auto; padding: 2px } .text-editor textarea { width: 700px; max-width: 98%; height: 250px; padding: 10px; } .markdown { line-height: 1.4em } .markdown h1 { margin-top: 5px; margin-bottom: 10px; font-weight: bold } .markdown h2 { font-weight: bold } .markdown p { margin-bottom: 10px } .markdown ol, .markdown ul { margin-left: 25px; margin-top: 10px; margin-bottom: 10px } .markdown pre { background: #3333330d; padding: 10px; border-radius: 5px; border: 1px solid #ddd; overflow: auto; overflow-wrap: initial; color: #555 } .markdown blockquote { font-style: italic; border-left: 3px solid #ddd; padding-left: 10px; margin-bottom: 10px; margin-left: 20px } .markdown img { display: block; max-width: 80%; margin-top: 10px } .documentation { margin: 0 auto; padding: 20px; max-width: 850px; background: #fefefe; border: 1px solid #ccc; border-radius: 5px; color: #555 } .documentation img { border: 1px solid #333 } .documentation h1 { text-decoration: none; margin-bottom: 30px } .documentation h2 { text-decoration: none; border-bottom: 1px solid #ccc; margin-bottom: 25px } .documentation li { line-height: 30px } .panel { border-radius: 4px; padding: 8px 35px 8px 10px; margin-top: 10px; margin-bottom: 15px; border: 1px solid #ddd; color: #333; background-color: #fcfcfc; overflow: auto } .panel li { list-style-type: square; margin-left: 20px; line-height: 1.35em } .activity-event { margin-bottom: 15px; padding: 10px } .activity-event:nth-child(even) { background: #fafafa } .activity-event:hover { background: #f6f8fa } .activity-date { margin-left: 10px; font-weight: normal; color: #999 } .activity-content { margin-left: 55px } .activity-title { font-weight: bold; color: #000; border-bottom: 1px dotted #efefef } .activity-description { color: #555; margin-top: 10px } @media (max-width: 480px) { .activity-description { overflow: auto } } .activity-description li { list-style-type: circle } .activity-description ul { margin-top: 10px; margin-left: 20px } .user-mention-link { font-weight: bold; color: #000; text-decoration: none } .user-mention-link:hover { color: #555 } .image-slideshow-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.95); overflow: auto; z-index: 100 } .image-slideshow-overlay img { display: block; margin: auto } .image-slideshow-overlay figcaption { color: #fff; opacity: 0.7; position: absolute; bottom: 5px; right: 15px } .slideshow-icon { color: #fff; position: absolute; font-size: 2.5em; opacity: 0.6 } .slideshow-icon:hover { opacity: 0.9; cursor: pointer } .slideshow-previous-icon { left: 10px; top: 45% } .slideshow-next-icon { right: 10px; top: 45% } .slideshow-close-icon { right: 10px; top: 10px; font-size: 1.4em } .slideshow-download-icon { left: 10px; bottom: 10px; font-size: 1.3em } .list-item-links, .list-item-actions { display: inline-block; float: left; margin-left: 10px } .list-item-links a { margin: 0 } .list-item-action-hidden { display: none } .bulk-change-checkbox { float: left } .bulk-change-inputs { float: left; padding-left: 10px } .bulk-change-inputs label { margin-top: 0; margin-bottom: 3px } #to-top { margin: 0 0px 30px 0px; } #backToTop { position: fixed; left: 50%; bottom: -25px; display: block; width: 50px; height: 50px; z-index: 10000; transition: all 0.4s; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -o-transition: all 0.4s; -ms-transition: all 0.4s; } #backToTop.topshow { bottom: 0; } #backToTop span { position: absolute; left: -25px; bottom: -25px; display: block; width: 50px; height: 50px; background: rgba(50, 50, 50, 0.15); text-decoration: none; -webkit-border-radius: 35px; -moz-border-radius: 35px; border-radius: 35px; transition: all 0.4s; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -o-transition: all 0.4s; -ms-transition: all 0.4s; } #backToTop span:hover { bottom: 5px; background: rgba(70, 70, 70, 0.9); } #backToTop i:before { position: relative; left: 12px; top: 0; display: block; margin: 0; width: 50px; color: #fff; font-size: 27px; -webkit-transition: all 0.6s ease; -moz-transition: all 0.6s ease; -ms-transition: all 0.6s ease; -o-transition: all 0.6s ease; transition: all 0.6s ease; } #backToTop:hover i:before { top: 9px; }