/*
 * Essential for kanboard
 * Licensed under the MIT license - Essential/LICENSE
 * https://github.com/kenlog/Essential
 * Copyright (c) 2019 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: #333;
     /* background: rgb(250, 250, 249); */
     background: rgb(255,255,255);
     background: -moz-radial-gradient(center, ellipse cover, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 100%, rgba(237,237,237,1) 100%);
     background: -webkit-radial-gradient(center, ellipse cover, rgba(255,255,255,1) 0%,rgba(246,246,246,1) 100%,rgba(237,237,237,1) 100%);
     background: radial-gradient(ellipse at center, rgba(255,255,255,1) 0%,rgba(246,246,246,1) 100%,rgba(237,237,237,1) 100%);
     filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ededed',GradientType=1 );
     font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
     text-rendering: optimizeLegibility
 }
 
 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: #3f74ba;
     border: none;
     text-decoration: none;
 }
 
 a:focus {
     outline: 0;
     color: #DF5353;
     text-decoration: none
 }
 
 a:hover {
     color: #333;
     text-decoration: none
 }
 
 a .fa {
     padding-right: 3px;
     text-decoration: none;
     color: #c5c5c5
 }
 
 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 3px;
     border: 1px solid #eee;
     background: #fbfbfb
 }
 
 table th a {
     text-decoration: none;
     color: #333
 }
 
 table th a:focus,
 table th a:hover {
     text-decoration: underline
 }
 
 table td {
     border: 1px solid #eee;
     padding: 0.5em 3px;
     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: #fbfbfb;
     border: 1px solid #e5e5e5;
     border-radius: 5px 5px 0 0;
     line-height: 28px;
     padding-left: 3px;
     padding-right: 3px
 }
 
 .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: block;
     float: left
 }
 
 .table-list-header .table-list-header-menu {
     text-align: right
 }
 
 .table-list-row {
     padding-left: 3px;
     padding-right: 3px;
     border-bottom: 1px solid #f1f1f1;
     border-right: 1px solid #f1f1f1
 }
 
 .table-list-row.table-border-left {
     border-left: 1px solid #f1f1f1;
     background-color: #fff;
 }
 
 .table-list-row:nth-child(odd) {
     background: #fefefe
 }
 
 .table-list-row:last-child {
     border-radius: 0 0 5px 5px
 }
 
 .table-list-row:hover {
     background: #F1F3F4;
     border-bottom: 1px solid #e5e5e5;
     border-right: 1px solid #e5e5e5
 }
 
 .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: #3f74ba
 }
 
 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
 }
 
 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;
     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: inset 0 0 2px rgba(82, 168, 236, 0.6)
 }
 
 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: inset 0 0 2px rgba(82, 168, 236, 0.6)
 }
 
 textarea {
     padding: 4px;
     border: 1px solid #ccc;
     width: 400px;
     max-width: 99%;
     height: 200px;
     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%;
     background-color: #f9f9f9;
     border: 1px solid #ccc;
     border-radius: 4px;
     cursor: default;
     margin-right: 5px;
     margin-top: 5px;
     padding: 0 5px;
 }
 
 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-color: rgba(147, 128, 108, 0.1);
     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: #c09853;
     background-color: #fcf8e3;
     border: 1px solid #fbeed5;
     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: #3a87ad;
     background-color: #d9edf7;
     border-color: #bce8f1
 }
 
 .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 {
     border-color: #bbb;
     background: #fafafa;
     color: #000
 }
 
 .btn-red {
     border-color: #b0281a;
     background: #d14836;
     color: #fff
 }
 
 .btn-red:hover,
 .btn-red:focus {
     border-color: #b0281a;
     background: #c53727;
     color: #fff
 }
 
 .btn-blue {
     border-color: #3f74ba;
     background: #3f74ba;
     color: #fff
 }
 
 .btn-blue:hover,
 .btn-blue:focus {
     border-color: #3f74ba;
     background: #357ae8;
     color: #fff
 }
 
 .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: 8px 10px;
     font-size: 0.9em;
     border-bottom: 1px solid #f8f8f8;
     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: #4078C0;
     color: #fff
 }
 
 .dropdown-submenu-open li:hover a {
     color: #fff
 }
 
 .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: #333
 }
 
 td a.dropdown-menu strong i {
     color: #333
 }
 
 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 20px
 }
 
 .accordion-title h3 {
     display: inline;
     padding-right: 5px;
     background: transparent
 }
 
 .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: #3c75b2
 }
 
 .select-dropdown-menu-item:last-child {
     border: none
 }
 
 .select-dropdown-input-container {
     position: relative;
     border: 1px solid #ccc;
     border-radius: 5px;
     background-color: #fff;
 }
 
 .select-dropdown-input-container input.select-dropdown-input {
     margin: 0 0 0 5px;
     border: none;
     height: 23px;
     width: 270px
 }
 
 .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: #428bca
 }
 
 .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: 2%;
     left: 50%;
     padding: 10px;
     transform: translateX(-50%);
     background: #fff;
     overflow: auto;
     border-radius: 5px
 }
 
 #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 {
     display: flex;
     flex-wrap: wrap;
     padding: 15px 10px;
     margin-bottom: 10px;
     border-bottom: 1px solid #dedede;
     background: #3f74ba;
     background: -moz-linear-gradient(45deg, #3f74ba 0%, #3c75b2 39%, #437cc6 52%, #356aa0 100%);
     background: -webkit-linear-gradient(45deg, #3f74ba 0%,#3c75b2 39%,#437cc6 52%,#356aa0 100%);
     background: linear-gradient(45deg, #3f74ba 0%,#3c75b2 39%,#437cc6 52%,#356aa0 100%);
     filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3f74ba', endColorstr='#356aa0',GradientType=1 );
 }
 
 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.5em;
     color: #fafaf9;
 }
 
 header h1 .tooltip {
     opacity: 0.3;
     font-size: 0.7em
 }
 
 a i.web-notification-icon {
     color: #f44
 }
 
 a i.web-notification-icon:focus,
 a i.web-notification-icon:hover {
     color: #e6e6e6
 }
 
 .logo a {
     opacity: 1;
     color: #f44;
     text-decoration: none
 }
 
 .logo span {
     color: #ffffff
 }
 
 .logo a:hover {
     opacity: 1;
     color: #F1F3F4
 }
 
 .logo a:focus span,
 .logo a:hover span {
     color: #f44
 }
 
 .page-header {
     margin-bottom: 20px
 }
 
 .page-header .dropdown {
     padding-right: 10px
 }
 
 .page-header h2 {
     margin: 0;
     padding: 0;
     font-weight: bold;
     border-bottom: 1px dotted #ccc
 }
 
 .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%;
     min-width: 230px;
     padding: 5px;
     border-radius: 5px;
     background: rgb(241,241,241);
     background: -moz-radial-gradient(center, ellipse cover, rgba(241,241,241,1) 81%, rgba(234,234,234,1) 100%);
     background: -webkit-radial-gradient(center, ellipse cover, rgba(241,241,241,1) 81%,rgba(234,234,234,1) 100%);
     background: radial-gradient(ellipse at center, rgba(241,241,241,1) 81%,rgba(234,234,234,1) 100%);
     filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f1f1f1', endColorstr='#eaeaea',GradientType=1 );
 }
 
 @media (max-width: 768px) {
     .sidebar {
         flex: 1 auto;
         order: 2
     }
 }
 
 .sidebar h2 {
     margin-top: 0
 }
 
 .sidebar>ul a {
     text-decoration: none;
     color: #777;
     font-weight: 300
 }
 
 .sidebar>ul a:hover {
     color: #3f74ba
 }
 
 .sidebar>ul li {
     list-style-type: none;
     line-height: 35px;
     border-bottom: 1px dotted #efefef;
     padding-left: 13px
 }
 
 .sidebar>ul li:hover {
     border-left: 5px solid #427bc4;
     padding-left: 8px
 }
 
 .sidebar>ul li.active {
     border-left: 5px solid #427bc4;
     padding-left: 8px
 }
 
 .sidebar>ul li.active a {
     color: #3f74ba;
     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 dotted #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: #fafafa;
     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: #3f74ba;
     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: underline
 }
 
 .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: #fbfbfb
 }
 
 #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;
     backface-visibility: hidden;
     -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: #3f74ba;
     font-size: 1.4em
 }
 
 .board-add-icon i:focus,
 .board-add-icon i:hover {
     text-decoration: none;
     color: #ffef35
 }
 
 .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 {
     position: relative;
     margin-bottom: 4px;
     border: 2px solid;
     background-color: #fff!important;
     padding: 5px;
     word-wrap: break-word;
     font-size: 0.9em;
     border-radius: 5px;
     box-shadow:  0 1px 2px rgba(70, 70, 70, 0.55);
 }
 
 div.task-board-recent {
     border-width: 2px
 }
 
 div.task-board-status-closed {
     user-select: none;
     border: 1px dotted #555
 }
 
 .task-board a {
     color: #000;
     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: 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;
     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: #3f74ba
 }
 
 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-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: 8px;
     padding: 10px;
 }
 
 .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: #ffffff;
     border: 2px solid #e5e5e5
 }
 
 .comments .comment-highlighted:hover {
     background-color: #f1f1f1
 }
 
 .comments .comment:hover {
     background: #f1f1f1
 }
 
 .comments .comment:nth-child(even):not(.comment-highlighted) {
     background: #fbfbfb
 }
 
 .comments .comment:nth-child(even):not(.comment-highlighted):hover {
     background: #f1f1f1
 }
 
 .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: #3f74ba
 }
 
 .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: #3f74ba
 }
 
 .text-editor .text-editor-preview-area {
     border: 1px solid #dedede;
     width: 700px;
     max-width: 99%;
     height: 250px;
     overflow: auto;
     padding: 2px
 }
 
 .text-editor textarea {
     width: 700px;
     max-width: 98%;
     height: 250px
 }
 
 .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: #fbfbfb;
     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: #f1f1f1
 }
 
 .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: 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;
 }