:root {
	--size-font-def: 15px;
	--size-font-min: max(13px, .875rem);
	--size-width-def: unset;
	--size-width-comp: 220px;
	--size-radius-def: 6px;
	--style-fontfamily: "SF Pro Display", Calibri, Helvetica, Verdana, Arial, sans-serif;
	--style-fontfamily-code: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
	--style-letterspacing: .02rem;
	--style-border: 1px solid var(--color-greyscale-3);
	--style-border-thk: 3px solid var(--color-greyscale-3);
	--style-shadow-light: 0 1px 2px 0 var(--color-shadow-lit);
	--style-shadow-heavy: 0 3px 8px 0 var(--color-shadow-hev);
	--pattern-dots-def: radial-gradient(var(--color-greyscale-2) .8px, transparent .8px);
	--pattern-dots-ph: radial-gradient(var(--color-greyscale-2) .8px, var(--color-greyscale-5) .8px);
	--pattern-dots-size: 16px 16px;
	--color-dark: var(--color-greyscale-1);
	--color-primary: var(--color-greyscale-1);
	--color-medium: var(--color-greyscale-1);
	--color-light: var(--color-greyscale-1);
	--color-lighter: var(--color-greyscale-1);
	--color-error: var(--color-warning-prim);
	--link-color-primary: var(--color-greyscale-1);
	--link-color-focus: var(--color-brand-prim);
	--link-color-hover: var(--color-brand-prim);
	--avatar-color-letter: var(--color-greyscale-6);
	--alert-color-info: var(--color-info-prim);
	--alert-background-color-info: var(--color-info-cont);
	--alert-color-default: var(--color-reminder-prim);
	--alert-background-color-default: var(--color-reminder-cont);
	--alert-color-normal: var(--color-greyscale-1);
	--alert-background-color-normal: var(--color-greyscale-5);
	--alert-color-error: var(--color-warning-prim);
	--alert-background-color-error: var(--color-warning-cont);
	--alert-color-success: var(--color-success-prim);
	--alert-background-color-success: var(--color-success-cont);
	--activity-title-color: var(--color-greyscale-1);
	--user-mention-color: var(--color-greyscale-1);
	--board-task-limit-color: var(--color-warning-prim);
	--button-default-color: var(--color-greyscale-1);
	--button-default-background-color: var(--color-greyscale-6);
	--button-default-border-color: var(--color-greyscale-6);
	--button-default-color-focus: var(--color-brand-prim);
	--button-default-background-color-focus: var(--color-greyscale-6);
	--button-default-border-color-focus: var(--color-greyscale-6);
	--button-primary-color: var(--color-brand-cont);
	--button-primary-background-color: var(--color-brand-prim);
	--button-primary-border-color: var(--color-brand-prim);
	--button-primary-color-focus: var(--color-brand-secd);
	--button-primary-background-color-focus: var(--color-brand-prim);
	--button-primary-border-color-focus: var(--color-brand-prim);
	--button-danger-color: var(--color-warning-cont);
	--button-danger-border-color: var(--color-warning-prim);
	--button-danger-background-color: var(--color-warning-prim);
	--button-danger-color-focus: var(--color-warning-secd);
	--button-danger-background-color-focus: var(--color-warning-prim);
	--button-danger-border-color-focus: var(--color-warning-prim);
	--button-disabled-color: var(--color-greyscale-2);
	--button-disabled-background-color: var(--color-greyscale-3);
	--button-disabled-border-color: var(--color-greyscale-3)
}

html,
body {
	font-size: var(--size-font-def)
}

body {
	background-color: var(--color-greyscale-4);
	padding: .5rem 2rem;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	font-family: var(--style-fontfamily);
	letter-spacing: var(--style-letterspacing)
}

body.TR a {
	font-size: 1rem;
	line-height: 1rem;
/*	font-weight: 400;	*/
	opacity: 1;
	text-decoration: none
}

body.TR a:not(.btn):hover,
body.TR a>*:hover {
	color: var(--link-color-hover);
	text-decoration: none
}

li {
	padding: 0;
	margin: 0 0 1rem 1rem;
	line-height: 1.5rem;
	font-size: 1rem;
	list-style-type: inherit
}

p {
	margin-bottom: 1em;
	line-height: 1.5em;
	font-size: 1rem;
	color: var(--color-greyscale-1)
}

hr {
	margin: 0;
	border-top: 1px solid var(--color-greyscale-4);
	border-bottom: 0
}

small {
	font-size: var(--size-font-min)
}


.btn:disabled {
	cursor: auto;
	box-shadow: none
}

button:not([class]):not([id]):not([data-value]) {
  color: #000 !important;
  cursor: pointer !important;
  border-radius: var(--size-radius-def) !important;
  padding: 0.75rem !important;
  background: #FFFFFF !important;
  transition: 0.2s !important;
  line-height: 1rem;
  font-size: 1rem;
  margin-top: 1rem;
  margin-bottom: 1rem;
  min-width: 6rem;
  text-align: center;
  box-shadow: var(--style-shadow-light);
}


/* Hover - Maintain yellow background but keep the icon black */
button:hover:not([class]):not([id]) {
  color: #000 !important;
  transform: translate(-0.25rem, -0.25rem) !important;

  box-shadow: 0.15rem 0.15rem #000 !important;
}

i[title="select cell"] {
    float: right !important;
    margin-top: 8px !important;
    margin-right: 5px !important;
}

/* Active - Exclude Toast UI buttons */
button:active:not([class]):not([id]) {
  transform: translate(0);
  box-shadow: none;
}
/* inspired form gumroad website */
code {
	font-family: var(--style-fontfamily-code)
}

#luckysheet-administerRule-dialog .chooseSheet {
    height: unset !important;
    line-height: 24px;
    margin-bottom: 5px;
}

/* spreadsheet icon below */
#custom-icons {
    display: flow;
}

h1,
h2,
h3,
h1 a,
h2 a,
h3 a,
.accordion-title {
	line-height: 1.2em !important;
	font-weight: bold !important;
	border: none !important;
	margin: 0
}

h1,
h1 a {
	font-size: 2rem !important
}

h2,
h2 a,
.accordion-title {
	font-size: 1.3rem !important
}

h3,
h3 a {
	font-size: 1rem !important
}

article {
	line-height: 1.5rem;
	word-break: break-word
}

body.TR i.fa:not([title="select cell"]) {
	line-height: 1rem;
	width: 1rem;
	padding: 0;
	margin: 0;
	margin-right: .5rem;
	color: var(--color-greyscale-1)
}

i.luckysheet-filter-dropdown {
    -moz-osx-font-smoothing: unset !important;
    font: unset !important;
    line-height: unset !important;
    width: unset !important;
    padding: unset !important;
    margin: unset !important;
    margin-right: unset !important;
    color: unset !important;
}

body.TR a:hover i.fa:not([title="select cell"]) {
	color: var(--link-color-hover)
}

.TR .avatar.avatar-left {
	margin-right: .5rem
}

.TR .avatar.avatar-inline {
	margin: 0 .5rem 0 0;
	vertical-align: middle
}

.TR .avatar .avatar-letter,
.TR .avatar div {
	white-space: nowrap;
	border-radius: var(--size-radius-def) !important
}

.TR .avatar img {
	vertical-align: middle;
	border-radius: var(--size-radius-def) !important
}

.TR .avatar.avatar-13 .avatar-letter {
	font-size: var(--size-font-min);
	line-height: 1rem;
	width: 1rem;
	padding: 1px
}

.TR .avatar.avatar-13 img {
	width: calc(1rem + 2px);
	height: auto;
	display: block
}

.TR .avatar.avatar-20 .avatar-letter {
	font-size: 1rem;
	line-height: 1.538rem;
	width: 1.538rem
}

.TR .avatar.avatar-20 img {
	width: 1.538rem;
	height: auto;
	display: block
}

.TR .avatar.avatar-48 .avatar-letter {
	font-size: 1.5rem;
	line-height: 3.692rem;
	width: 3.692rem;
	font-weight: 700
}

.TR #user-section .sidebar-content>.avatar-48,
#user-section .sidebar-content>.avatar-48 {
	padding: 1rem
}

.alert {
	margin: 1rem 0;
	border-radius: var(--size-radius-def);
	padding: .5rem 1rem;
	max-width: calc(var(--size-width-def) - 2rem);
	border: 0
}

#tooltip-container {
	width: unset;
	min-width: 0;
	overflow-wrap: break-word;
	padding: 1rem;
	background: var(--color-greyscale-6);
	border: var(--style-border);
	border-radius: var(--size-radius-def);
	box-shadow: var(--style-shadow-heavy);
	position: absolute;
	z-index: 1
}

#tooltip-container>* {
	min-width: 0;
	max-width: 350px;
	width: unset
}

#tooltip-container .tooltip-large {
	overflow: auto
}

.margin-bottom {
	margin-bottom: 1rem
}

.margin-bottom>form,
.filter-box>form {
	margin: 0;
	padding: 0;
	background: none;
	border: none
}

.pagination {
	font-size: var(--size-font-min);
	margin-bottom: 1rem
}

.pagination-showing {
	margin-right: .5em;
	padding-right: .5em;
	border-right: var(--style-border)
}

.pagination-previous,
.pagination-next {
	margin-right: .5em;
	color: var(--color-greyscale-2)
}

input[type="date"]:not([class]):not([id]),
input[type="email"]:not([class]):not([id]),
input[type="number"]:not([class]):not([id]),
input[type="password"]:not([class]):not([id]),
input[type="text"]:not([class]):not([id]),
input[type="checkbox"]:not([class]):not([id]),
input[type="radio"]:not([class]):not([id]),
input[type="file"]:not([class]):not([id]),
input:not([class]):not([id]),
textarea:not([class]):not([id]),
select:not([class]):not([id]),
form > select:not([class]):not([id]) {
  border: none;
  background: var(--color-greyscale-6);
  border-bottom: var(--style-border);
  border-radius: var(--size-radius-def);
  line-height: calc(1rem + 2px);
  width: auto;
  height: auto;
  font-size: 1rem;
  color: var(--color-greyscale-1);
  padding: 0.75rem;
  box-shadow: var(--style-shadow-light);
  font-family: var(--style-fontfamily);
  letter-spacing: var(--style-letterspacing);
  box-sizing: border-box;
}


textarea:not(.luckysheet-protection-textarea) {
	min-height: 10rem
}

input:focus:not(.luckysheet-protection-input), input:hover:not(.luckysheet-protection-input) {
 outline: none !important;
 border-radius: 1rem !important;
 border-color: #FFD966 !important;
}

input::placeholder {
 color: #777 !important;
}

input:focus::placeholder {
 opacity: 0 !important;
 transition: opacity .3s !important;
}

input[type="text"][name*="url"],
input[type="text"][name*="mail"],
input[type="email"],
input[type="text"][value*="http"],
textarea:not(.luckysheet-protection-textarea) {
	min-width: var(--size-width-comp)
}

textarea[name="application_stylesheet"] {
	width: 40rem;
	height: 15rem
}

input[type="date"][name*="metamagikkey"] {
	max-width: calc(var(--size-width-comp) - 1.5rem)
}

select:not([class]):not([id]),
form>select {
	min-width: 150px;
	appearance: none;
	background-image: linear-gradient(45deg, transparent 50%, var(--color-greyscale-2) 50%), linear-gradient(135deg, var(--color-greyscale-2) 50%, transparent 50%);
	background-position: calc(100% - .5rem - 8px) calc(1rem + 2px), calc(100% - .5rem - 4px) calc(1rem + 2px);
	background-size: 4px 4px, 4px 4px;
	background-repeat: no-repeat;
	padding-right: calc(1.5rem + 8px)
}

input[required]:not(:hover),
select[required]:not(:hover),
textarea[required]:not(:hover) {
	border-bottom-color: var(--color-warning-prim) !important
}

input[type=checkbox]:not(#geTitleOption):not(#geContainerOption),
input[type=radio] {
	margin: 0 .25rem 1rem 0
}

input::placeholder,
textarea::placeholder {
	color: var(--color-greyscale-2) !important
}

.task-form-main-column input[type="text"] {
	width: unset;
	max-width: 90%
}

.form-inline input,
.form-inline select {
	margin: 0 .5rem .5rem 0 !important
}

.text-editor {
	margin: 0 0 1rem;
	width: 100%
}

.text-editor a {
	margin-right: 1rem
}

.text-editor .text-editor-toolbar,
.text-editor textarea,
.text-editor .text-editor-preview-area {
	padding: .75rem;
	width: 100%;
	max-width: unset;
	margin: 0;
	background: var(--color-greyscale-6);
	border-radius: var(--size-radius-def);
	border: none;
	border-bottom: var(--style-border);
	line-height: 1.5rem;
	overflow-wrap: anywhere;
	box-sizing: border-box
}

.text-editor .text-editor-toolbar {
	border-color: var(--color-greyscale-5);
	border-radius: var(--size-radius-def) var(--size-radius-def) 0 0
}

.text-editor textarea {
	border-radius: 0 0 var(--size-radius-def) var(--size-radius-def)
}

.text-editor-write-mode {
	line-height: 0
}

.js-text-editor-rendered {
	width: unset;
	max-width: 90%
}

.select2-container,
.select2-container--default,
.select2-container--below,
.select2-container--below,
.select2-container--focus {
	border: none;
	margin: 0 0 1rem !important;
	background: var(--color-greyscale-6);
	border-bottom: var(--style-border);
	border-radius: var(--size-radius-def);
	height: auto;
	width: var(--size-width-comp) !important;
	padding: .75rem;
	box-shadow: var(--style-shadow-light)
}

.select2-selection--multiple,
.select2-selection--single {
	border: none !important;
	background: none;
	border-radius: 0 !important;
	line-height: calc(1rem + 2px);
	height: auto !important;
	margin: 0;
	font-size: 1rem;
	color: var(--color-greyscale-1);
	padding: 0
}

.select2-selection--multiple {
	min-height: calc(2rem + 2px) !important
}

.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple {
	background: none
}

.select2-selection__arrow {
	height: 1rem !important;
	top: .75rem !important;
	right: 0.5rem !important;
	width: 1rem !important
}

.select2-selection__rendered {
	color: var(--color-greyscale-1) !important;
	line-height: calc(1rem + 2px) !important;
	padding: 0 1rem 0 0 !important
}

.select2-selection__choice {
	font-size: 1rem;
	color: var(--color-greyscale-6);
	list-style-type: none;
	background-color: var(--color-greyscale-1) !important;
	border: none !important;
	border-radius: var(--size-radius-def) !important;
	cursor: default !important;
	float: left !important;
	margin: 0 .5rem .5rem 0 !important;
	padding: 0 .5em !important
}

.select2-selection__choice__remove {
	color: var(--color-greyscale-6) !important;
	margin-right: .5em !important
}

.select2-search,
.select2-search--inline {
	list-style: none;
	margin: 0;
	padding: 0;
	line-height: 1rem
}

.select2-search__field {
	margin: 0 !important
}

.select2-dropdown {
	background-color: var(--color-greyscale-6);
	border: var(--style-border);
	border-radius: var(--size-radius-def) !important;
	border-top: var(--style-border) !important;
	box-shadow: var(--style-shadow-heavy)
}

.select2-results__option {
	-webkit-user-select: none;
	list-style: none;
	margin: 0;
	line-height: 2em;
	padding: .25rem .75em;
	background: var(--color-greyscale-6);
	border-bottom: 1px solid var(--color-greyscale-5)
}

.select2-results__option[aria-selected=true] {
	background-color: var(--color-greyscale-3) !important;
	color: var(--color-greyscale-1) !important
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
	background: var(--color-brand-prim);
	color: var(--color-brand-cont)
}

.select2-container--default .select2-selection--single .select2-selection__arrow b {
	border-color: var(--color-greyscale-2) transparent transparent transparent;
	border-width: 4px 4px 0 4px
}

.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
	border-color: transparent transparent var(--color-greyscale-2) transparent;
	border-width: 0 4px 4px 4px
}

.color-picker-option {
	height: 2rem;
	line-height: 2rem
}

.select2-selection__rendered .color-picker-option {
	height: calc(1rem + 2px);
	line-height: calc(1rem + 2px)
}

.color-picker-label {
	display: inline-block;
	vertical-align: text-bottom;
	padding: 0;
	line-height: 1rem
}

.color-picker-square {
	width: 1em;
	height: 1em;
	margin-right: 1em;
	margin-left: 1px;
	border-radius: var(--size-radius-def);
	vertical-align: text-bottom
}

.select-dropdown-menu-item {
	margin: 0
}

.select-dropdown-input-container {
	max-width: unset;
	border: none;
	min-width: var(--size-width-comp);
	border-bottom: var(--style-border);
	border-radius: var(--size-radius-def);
	background-color: var(--color-greyscale-4)
}

.select-dropdown-input-container input.select-dropdown-input {
	width: 90%;
	max-width: unset;
	margin: 0;
	border: none;
	padding: .5rem;
	background: none;
	box-shadow: none
}

.select-dropdown-input-container .select-dropdown-chevron {
	top: .5em;
	right: .5em
}

#dropdown ul.dropdown-submenu-open #dropdown-search {
	padding: 0;
	background: none;
	border-bottom: 0
}

#dropdown ul.dropdown-submenu-open #dropdown-search input {
	box-sizing: border-box
}

.select2-container .select2-search--dropdown .select2-search__field,
#dropdown ul.dropdown-submenu-open #dropdown-search input {
	border: 0;
	border-bottom: var(--style-border);
	margin: .25rem .25rem .75rem !important;
	width: calc(100% - .5rem);
	padding: .5rem;
	background: var(--color-greyscale-6)
}

.select2-container .select2-search--dropdown .select2-search__field:focus-visible,
#dropdown ul.dropdown-submenu-open #dropdown-search input:focus-visible {
	border-bottom-color: var(--color-brand-prim);
	outline: 0
}

#modal-content form[action*="ActionCreationController"]>.select2 {
	width: 45rem !important
}

#select2-form-action_name-results {
	max-height: calc(100vh - 20rem)
}

.dropdown {
	line-height: 2rem
}

.dropdown-menu-link-text,
.dropdown-menu-link-icon {
	color: var(--color-greyscale-1)
}

body.TR .dropdown-menu i.fa-caret-down,
body.TR .active-dropdown-menu i.fa-caret-down {
	margin-left: -.25rem
}

#select-dropdown-menu {
	overflow: auto
}

ul.dropdown-submenu-open,
#select-dropdown-menu {
	border-radius: var(--size-radius-def);
	padding: .5rem 0;
	background-color: var(--color-greyscale-6);
	border: var(--style-border);
	box-shadow: var(--style-shadow-heavy);
	max-height: calc(100vh - 16.5rem);
	overflow: auto
}

ul.dropdown-submenu-open li,
#select-dropdown-menu li {
	font-size: 1rem;
	padding: .5rem 1rem;
	border-bottom: 1px solid var(--color-greyscale-5)
}

.dropdown-submenu-open li:hover a {
	color: var(--color-greyscale-6)
}

ul.dropdown-submenu-open li.js-autocomplete-email {
	font-size: 1rem
}

ul.dropdown-submenu-open li i.fa {
	font-size: 1rem;
	vertical-align: middle;
	margin-right: 1rem
}

ul.dropdown-submenu-open a {
	color: var(--color-greyscale-1);
	vertical-align: middle
}

body.TR #suggest-menu {
	padding: 1rem 1rem 0 0;
	border-radius: var(--size-radius-def);
	border: var(--style-border);
	box-shadow: var(--style-shadow-heavy);
	background: var(--color-greyscale-6)
}

body.TR #suggest-menu>.suggest-menu-item {
	padding: .5rem
}

body.TR #suggest-menu>.suggest-menu-item.active {
	color: var(--color-greyscale-6);
	background: var(--color-brand-prim)
}

body.TR #suggest-menu>.suggest-menu-item.active small {
	color: var(--color-greyscale-6)
}

input[type=date]:focus,
input[type=email]:focus,
input[type=number]:focus,
input[type=password]:focus,
input[type=text]:focus:not(.luckysheet-protection-input),
input[type=checkbox]:focus:not(.luckysheet-mousedown-cancel):not(#geTitleOption),
input[type=radio]:focus,
input[type=file]:focus,
textarea:focus,
.text-editor textarea:focus,
select:focus,
.select2-container--focus,
input[type=date]:hover,
input[type=email]:hover,
input[type=number]:hover,
input[type=password]:hover,
input[type=text]:hover,
input[type=checkbox]:hover,
input[type=radio]:hover,
input[type=file]:hover,
textarea:hover,
.text-editor textarea:hover,
select:hover,
.select2-container:hover,
.select-dropdown-input-container:hover {
	box-shadow: var(--style-shadow-heavy);
	border-color: var(--color-brand-prim);
	color: var(--color-greyscale-1);
}

body.TR a.dropdown-menu-link-icon:hover>* {
	color: var(--link-color-hover)
}

.dropdown-submenu-open li:hover:not(.no-hover),
.textarea-dropdown .active,
.textarea-dropdown li:hover,
.select-dropdown-menu-item.active {
	background: var(--color-brand-prim);
	color: var(--color-brand-cont)
}

.dropdown-submenu-open li:hover:not(.no-hover) a:hover,
.dropdown-submenu-open li:hover:not(.no-hover) i.fa {
	color: var(--color-greyscale-6)
}

.select-dropdown-input-container:hover {
	background-color: var(--color-greyscale-6)
}

.select-dropdown-input-container>input[type="text"]:hover {
	box-shadow: none
}

.assign-me {
	vertical-align: super
}

label:not(.dataBarLabel):not(.luckysheet-mousedown-cancel):not([for="geTitleOption"]):not([for="geContainerOption"]) {
	line-height: 1rem;
	font-size: 1rem;
	margin: 1rem .5rem .75rem 0;
	padding: 0
}

.form-required {
	display: none
}

.form-help {
	margin: -.5rem 0 1rem;
	font-size: .857rem;
	color: var(--color-warning-prim)
}

.form-actions {
	padding: 0;
	margin: 0
}

.form-errors li {
	color: inherit;
	margin-top: -.5rem
}

.form-errors li::marker {
	font-size: 0
}

.form-inline {
	height: auto;
	padding: 1rem;
	padding-left: 1rem !important;
	width: auto;
	min-width: var(--size-width-comp);
	background: var(--color-greyscale-4);
	border-left: var(--style-border-thk)
}

fieldset {
	border: none;
	background: var(--color-greyscale-4);
	border-bottom: var(--style-border);
	border-radius: var(--size-radius-def);
	line-height: calc(1rem + 2px);
	height: auto;
	margin: 0 0 1rem;
	font-size: 1rem;
	color: var(--color-greyscale-1);
	padding: 1rem 0;
	box-shadow: none
}

legend {
	font-size: 1rem;
	font-weight: 700;
	line-height: 1rem;
	padding: .75rem 0 !important
}

.ui-timepicker-select {
	width: 100%;
	min-width: unset
}

.form-actions a:not(.btn),
#modal-content small a.assign-me {
	border-bottom: 1px dotted;
	vertical-align: middle
}

#modal-content .task-form-secondary-column small a.assign-me {
	vertical-align: super
}

table:not(.luckysheet-grid-window-2):not(.luckysheet-grid-window-1):not(.geInsertTablePicker):not(.geFormatSection *) {
	font-size: 1rem;
	line-height: 2rem;
	border-top: none;
	border-right: none;
	margin-bottom: 1rem
}

table.geInsertTablePicker {
    margin-left: 8px;
    margin-right: 8px;
}

table.table-small {
	font-size: var(--size-font-min)
}

table:not(.geInsertTablePicker) td:not(.geInsertTablePicker):not(.mxPopupMenuItem):not(.luckysheet-paneswrapper):not(.geFormatSection):not(.addTableMatrix) {
    border-bottom: 1px solid var(--color-greyscale-4);
    border-left: 1px solid var(--color-greyscale-4);
    line-height: 2rem;
    padding: inherit;
    vertical-align: middle !important;
    border-color: var(--color-greyscale-4);
}

table td.luckysheet-paneswrapper {
    border: unset !imoprtant;
    padding: unset !important;
}

table th {
	background: var(--color-greyscale-4);
	border-bottom: var(--style-border)
}

body.TR table th a {
	font-weight: 700
}

table th a:focus,
table th a:hover {
	text-decoration: auto
}

table:not(.geFormatSection table) tr:last-child td {
  border-bottom: var(--style-border);
}

table:not(.geFormatSection table).table-striped tr:nth-child(odd) {
  background: none;
}

table:not(.geFormatSection table) tbody tr:nth-child(even) td:not([class*="color-"]) {
  background: var(--color-greyscale-5);
}

table:not(.geFormatSection table) tbody tr:nth-child(odd) td:not([class*="color-"]) {
  background: var(--color-greyscale-6);
}

table tr th:first-child,
table tr td:first-child {
	border-left: none
}

table:not(.geFormatSection table) tr:first-child th:first-child {
	border-top-left-radius: var(--size-radius-def)
}

table:not(.geFormatSection table) tr:first-child th:last-child {
	border-top-right-radius: var(--size-radius-def)
}

table:not(.geFormatSection table) tr:last-child td:first-child {
	border-bottom-left-radius: var(--size-radius-def)
}

table:not(.geFormatSection table) tr:last-child td:last-child {
	border-bottom-right-radius: var(--size-radius-def)
}

table:not(.geFormatSection table) tr th:last-child,
table:not(.geFormatSection table) tr td:last-child {
	border-right: none
}

table:not(.geFormatSection table) td li {
	float: left;
	list-style: none;
	margin: 0 1rem 0 0
}

table select {
	margin: 0
}

table td>a {
	text-decoration: underline
}

table td a.dropdown-menu strong {
	color: var(--link-color-primary)
}

.subtasks-table .column-30 {
	width: unset
}

.subtasks-table .subtask-table-td {
	align-items: center;
	min-width: unset
}

.subtasks-table .subtask-table-td>* {
	margin-right: .5rem
}

.subtasks-table tr[data-subtask-id] td>p:last-child {
	margin-bottom: 0
}

.js-subtask-toggle-status {
	align-items: center;
	display: inline;
	word-break: break-all
}

.page {
	margin: 0
}

#main {
	display: flex;
	flex-wrap: wrap;
	flex-direction: column
}

.page>#main>p,
.page>#main>.alert,
.page>.filter-box,
.page>.margin-bottom {
	margin: 0 0 1rem;
	max-width: var(--size-width-def)
}

.page>.activity-event {
	margin: 0;
	max-width: calc(var(--size-width-def) - 2rem)
}

.project-header {
	padding: 0;
	background: none;
	max-width: 100%;
	height: fit-content
}

#board-container {
	background: var(--color-greyscale-4);
/*	overflow-x: inherit; */
    overflow-x: auto;
    white-space: nowrap;
    width: 100%
}

.sidebar-container {
	max-width: calc(var(--size-width-def) + var(--size-width-comp) - 4rem)
}

.sidebar-content,
.accordion-section {
	padding-left: 0;
	max-width: var(--size-width-def);
	background: var(--color-greyscale-6);
	padding: 1rem 2rem;
	border-radius: var(--size-radius-def);
	border-bottom: var(--style-border);
	margin-bottom: 1rem;
	box-sizing: border-box
}

.accordion-section {
	margin-bottom: 0;
	border-bottom: 0
}

#main .sidebar-content,
#main>.accordion-section,
.page>.table-list {
	box-shadow: var(--style-shadow-heavy)
}

#main>.accordion-section {
	border-radius: 0
}

#main>.accordion-section:first-of-type {
	border-top-left-radius: var(--size-radius-def);
	border-top-right-radius: var(--size-radius-def)
}

#main>.accordion-section:last-of-type {
	border-bottom-left-radius: var(--size-radius-def);
	border-bottom-right-radius: var(--size-radius-def)
}

#main .sidebar-content {
	padding: 2rem
}

.page-header,
.sidebar-content>h2,
.sidebar-content>h3,
.accordion-title {
	border: none;
	border-radius: var(--size-radius-def) var(--size-radius-def) 0 0;
	padding: 1rem 0;
	margin: 0 0 .5rem;
	background-image: var(--pattern-dots-def);
	background-size: var(--pattern-dots-size);
	text-shadow: 0 0 1em var(--color-greyscale-6)
}

.sidebar-content>h3 {
	background-image: none
}

.page>#main>.page-header,
.page>.page-header {
	background: none;
	border: none;
	padding: 0;
	margin-bottom: 3rem;
	box-shadow: none;
	margin-top: -1.5rem
}

.page-header ul {
	width: 100%
}

.panel,
.table-list,
form,
.accordion-content {
	border: none;
	border-radius: var(--size-radius-def);
	line-height: 1.5rem;
	margin: 0;
	margin-bottom: 1rem;
	font-size: 1rem;
	color: var(--color-greyscale-1);
	height: auto;
	padding: 1rem 1.5rem;
	width: auto;
	max-width: var(--size-width-def);
	background: var(--color-greyscale-4);
	box-sizing: border-box
}

.accordion-section>* {
	max-width: 900px;
	margin-left: auto;
	margin-right: auto
}

.accordion-section .accordion-content {
	padding: 1.5rem
}

.accordion-section .accordion-content .buttons-header>* {
	margin-top: 0
}

form>.panel {
	border-left: var(--style-border-thk)
}

.table-list {
	background: var(--color-greyscale-6)
}

.panel>*,
.table-list>*,
form>*:not(textarea, select, input),
.accordion-content>* {
	border-bottom: none;
/*	margin: 0 0 1rem; */
	padding: 0
}

.panel>*:last-child:not(.alert),
.table-list>*:last-child:not(.alert),
form>*:last-child:not(.alert),
.accordion-content>*:last-child:not(.alert) {
	margin-bottom: 0;
	margin-right: 0
}

.panel li {
	list-style-type: unset;
	margin-left: 1.25rem;
	line-height: unset
}

.panel>ul:last-child>li:last-child {
	margin-bottom: 0
}

.accordion-content>table {
	table-layout: fixed
}

.TR .form-login {
	margin: 1rem auto;
	height: calc(100vh - 3rem);
	min-height: 480px;
	background: var(--color-greyscale-6);
	position: relative;
	box-shadow: var(--style-shadow-light);
	border-radius: var(--size-radius-def);
	border-bottom: var(--style-border);
	text-align: center
}

.TR .form-login>.page-header {
	position: absolute;
	display: block;
	height: 4.5vh;
	width: auto;
	top: 5.5vh;
	left: 1rem;
	right: 1rem
}

.TR .form-login>.logo {
	background: var(--color-greyscale-6);
	margin: 10vh 1.25rem .25rem;
	height: 2.7rem;
	border-radius: var(--size-radius-def);
	box-shadow: var(--style-shadow-heavy);
	border-bottom: var(--style-border);
	z-index: 999;
	position: relative
}

.TR .form-login>form {
	text-align: left;
	padding: 2rem;
	background-color: var(--color-greyscale-6);
	box-shadow: inset 0 15rem 10rem 0 var(--color-greyscale-5);
	margin: 1.25rem;
	z-index: 999;
	position: relative
}

.TR .form-login input#form-username,
.form-login input#form-password {
	width: 100%
}

header .title-container {
	flex: 14
}

header .title-container span.title {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap
}

header h1 {
/*	height: 3rem;	*/
	display: flex;
	align-items: flex-end;
	font-size: 1.5rem !important
}

header h1 .logo {
	line-height: 0;
	width: 3rem
}

header h1 .logo a {
	font-size: 0 !important;
	line-height: 0 !important
}

header h1 .logo a img {
	height: 2rem;
	border-radius: var(--size-radius-def);
	border-bottom: var(--style-border);
	box-shadow: var(--style-shadow-light)
}

header h1 .tooltip {
	font-size: 1rem;
	line-height: 2rem;
	padding-left: .5rem;
	opacity: 1
}

header h1 .tooltip i.fa {
	color: var(--color-greyscale-2)
}

header .board-selector-container {
	display: contents;
	width: 100%;
	padding-top: 1rem
}

header .menus-container {
	align-items: flex-end;
	padding: 1rem 0 .25rem;
	flex: 1;
	min-width: 10rem
}

.notification {
	line-height: 2rem
}

header .notification i.web-notification-icon {
	color: var(--color-brand-prim) !important;
	text-shadow: 0 0 2rem var(--color-brand-prim)
}

.TR .fc-toolbar.fc-header-toolbar,
.TR .page>#main>.menu-inline {
	background: var(--color-greyscale-6);
	border: none;
	border-radius: var(--size-radius-def) var(--size-radius-def) 0 0;
	border-bottom: var(--style-border);
	padding: 1.5rem;
	margin: 0
}

.TR .fc-toolbar.fc-header-toolbar {
	padding: .5rem 0 1.5rem
}

.TR .page>#main>.menu-inline {
	max-width: unset;
	box-shadow: var(--style-shadow-heavy)
}

.TR .js-calendar {
	padding: 1rem 2rem;
	background: var(--color-greyscale-6);
	border-radius: var(--size-radius-def);
	border-bottom: var(--style-border);
	min-width: 680px;
	box-shadow: var(--style-shadow-heavy)
}

.TR #modal-content .js-calendar {
	padding: 0;
	box-shadow: none
}

.TR .fc-button .fc-icon {
	display: block
}

.TR .fc-state-default,
.TR .fc-button {
	text-shadow: none;
	background-image: none;
	color: var(--color-greyscale-1);
	font-size: 1rem;
	line-height: 1rem;
	padding: .5rem 1rem;
	height: auto;
	border-radius: 0
}

.TR .fc-button-group .fc-button:not(.fc-state-active,.toastui-editor-defaultUI-toolbar) {
	font-weight: normal !important
}

.TR .fc-button:not(.fc-state-disabled,.toastui-editor-defaultUI-toolbar):hover {
	color: var(--link-color-hover)
}

.TR .fc-state-default.fc-corner-right {
	border-top-right-radius: var(--size-radius-def);
	border-bottom-right-radius: var(--size-radius-def)
}

.TR .fc-state-default.fc-corner-left {
	border-top-left-radius: var(--size-radius-def);
	border-bottom-left-radius: var(--size-radius-def)
}

.TR .fc-toolbar .fc-state-active {
	background: var(--color-greyscale-6);
	box-shadow: inset 0 2px 0 0 var(--color-greyscale-5)
}

.TR .fc-state-disabled {
	opacity: .5;
	cursor: default !important
}

.TR .fc-unthemed .fc-content,
.TR .fc-unthemed .fc-divider,
.TR .fc-unthemed .fc-list-heading td,
.TR .fc-unthemed .fc-list-view,
.TR .fc-unthemed .fc-popover,
.TR .fc-unthemed .fc-row,
.TR .fc-unthemed tbody,
.TR .fc-unthemed td,
.TR .fc-unthemed th,
.TR .fc-unthemed thead {
	border-color: var(--color-greyscale-3);
	border-right: 0
}

.TR .fc-unthemed th {
	line-height: 2rem;
	border-top: 0;
	background: var(--color-greyscale-6)
}

.TR .fc-unthemed td.fc-today {
	background: var(--color-greyscale-4) !important
}

.TR .fc-row table {
	margin: 0
}

.TR .fc-row .fc-content-skeleton td,
.TR .fc-row .fc-helper-skeleton td {
	background: transparent !important
}

.TR .fc-toolbar h2 {
	line-height: 2rem
}

.TR .fc-head-container,
.TR .fc-widget-header {
	border-top: 0 !important
}

.TR .fc-event {
	border-radius: var(--size-radius-def);
	color: var(--color-greyscale-1) !important;
	font-size: var(--size-font-min) !important;
	border-top: 1px solid var(--color-greyscale-5) !important;
	box-shadow: var(--style-shadow-light)
}

.TR .fc-event .fc-content {
	padding: 1px 4px 0
}

.TR .fc-event:hover {
	z-index: 999;
	font-weight: 700;
	box-shadow: var(--style-shadow-heavy)
}

.TR .fc-event:hover .fc-title,
.TR .fc-event:hover .fc-time {
	color: var(--color-greyscale-1) !important;
	line-height: 1.2rem
}

.TR .fc-basic-view .fc-day-number,
.TR .fc-basic-view .fc-week-number {
	padding: .5rem
}

.TR a.fc-more {
	font-size: var(--size-font-min) !important;
	display: block;
	color: var(--color-greyscale-2)
}

.TR hr.fc-divider {
	background: none
}

.TR .fc-time-grid .fc-slats tr.fc-minor td {
	background: var(--color-greyscale-4) !important
}

.TR .fc-time-grid .fc-slats tr:not(.fc-minor) td {
	background: var(--color-greyscale-5) !important
}

.TR .fc-day.fc-widget-content {
	background: var(--color-greyscale-5)
}

.TR .fc-time-grid-container {
	border-top: var(--style-border)
}

#gantt-chart {
	width: 100%;
	background: var(--color-greyscale-6)
}

.TR .page>#main>#gantt-chart {
	margin: 0 0 1rem;
	box-shadow: var(--style-shadow-heavy);
	border-radius: 0 0 var(--size-radius-def) var(--size-radius-def)
}

.TR .page>#main>section>#gantt-chart {
	padding-top: 1.5rem;
	border-radius: var(--size-radius-def)
}

.TR div.ganttview {
	border: none;
	border-bottom: var(--style-border);
	padding: 0 1.5rem 1.5rem
}

.TR div.ganttview-vtheader {
	background: var(--color-greyscale-6)
}

.TR div.ganttview-slide-container {
	border-color: var(--color-greyscale-3)
}

.TR div.ganttview-vtheader-item {
	color: var(--color-greyscale-1)
}

.TR div.ganttview-vtheader-series-name {
	padding-left: 1rem;
	border-top: var(--style-border);
	padding-right: 1rem;
	width: calc(400px - 2rem);
	font-size: var(--size-font-min)
}

.TR div.ganttview-vtheader-series-name a {
	color: var(--color-greyscale-1);
	font-size: var(--size-font-min) !important
}

.TR div.ganttview-hzheader-month {
	border-right: var(--style-border);
	font-size: var(--size-font-min)
}

.TR div.ganttview-hzheader-day {
	border-right: var(--style-border);
	border-top: var(--style-border);
	color: var(--color-greyscale-2)
}

.TR div.ganttview-grid-row-cell {
	border-right: var(--style-border);
	border-top: var(--style-border);
	background-color: var(--color-greyscale-5)
}

.TR div.ganttview-grid-row-cell.ganttview-weekend {
	background-color: var(--color-greyscale-6)
}

.TR div.ganttview-grid-row-cell.ganttview-today {
	background-color: var(--color-greyscale-4)
}

.TR div.ganttview-block {
	border-radius: var(--size-radius-def);
	border-top: 0;
	box-shadow: var(--style-shadow-heavy)
}

.TR div.ganttview-block-text {
	color: var(--color-greyscale-1);
	z-index: 1
}

.TR #config-section>.sidebar-content>.row>.column {
	width: 100%;
	padding: 0
}

.TR #config-section>.sidebar-content>.row>.column>.metadata-table {
	table-layout: fixed
}

.TR .task-board-expanded>span {
	float: left;
	font-size: 0
}

.TR .assigned-group-label {
	display: none
}

.TR .assigned-group {
	display: inline-block;
	padding: 1px;
	font-weight: 400;
	border-radius: var(--size-radius-def);
	line-height: 1rem;
	margin: 0 6px calc(1rem - 3px) 0;
	color: var(--color-greyscale-6) !important;
	font-size: var(--size-font-min);
	vertical-align: middle
}

.TR #task-summary .assigned-group {
	margin-right: 0;
	margin-left: 1rem
}

.TR .assigned-group:hover {
	max-width: unset
}

.TR .task-board .task-board-expanded .assigned-other-label {
	display: none
}

.TR .task-board .task-board-expanded>.avatar {
	margin-bottom: calc(1rem - 3px);
	margin-right: 6px;
	line-height: 1rem;
	vertical-align: top
}

.TR .tr-color-picker .sp-replacer {
	border: 0;
	background: none;
	color: var(--color-greyscale-1)
}

.TR .tr-color-picker .sp-preview {
	border: 1px solid var(--color-greyscale-1)
}

.TR #table-view {
	overflow: auto
}

.TR #table-view .assigned-group {
	line-height: 1.667rem;
	margin: 0;
	padding: 0 .35rem;
	font-size: 1rem;
	max-width: unset;
	text-overflow: initial;
	white-space: initial;
	overflow: initial
}

.TR #main #embed-anything {
	border-radius: var(--size-radius-def)
}

.TR #main #embed-anything>iframe {
	border-radius: var(--size-radius-def);
	box-shadow: inset 0 0 1px 0 var(--color-greyscale-1)
}

.project-header .dropdown-component,
.project-header .views-switcher-component {
	margin: 0 .5rem 1rem 0
}

.project-header .filter-box-component {
	margin: 0 0 1rem 0
}

.filter-box {
	max-width: unset
}

.page-header ul,
.menu-inline ul,
.views-switcher-component .views,
.project-header>.dropdown-component,
.filter-box .input-addon,
.fc-state-default,
.fc button {
	background: var(--color-greyscale-6);
	border-bottom: var(--style-border);
	border-top: 1px solid var(--color-greyscale-6)
}

.page-header ul,
.menu-inline ul,
.fc-state-default,
.fc button {
	margin: 0;
	border-radius: var(--size-radius-def);
	display: inline-block;
	box-shadow: none
}

.sidebar-content .page-header>ul,
#modal-content .page-header>ul,
.menu-inline ul,
.fc-state-default,
.fc button {
	border: 1px solid var(--color-greyscale-4);
	border-bottom: var(--style-border);
	background: var(--color-greyscale-5)
}

.sidebar-content .page-header>ul {
	box-shadow: 0 2rem 0 0 var(--color-greyscale-6)
}

.sidebar-content .page-header>ul,
#modal-content .page-header>ul {
	margin: 1rem 0
}

.views-switcher-component .views {
	margin: 0 1rem 0 0;
	font-size: 1rem;
	border-radius: 0 var(--size-radius-def) var(--size-radius-def) 0
}

.project-header>.dropdown-component {
	padding: 0 0 0 1rem;
	margin-right: 0;
	border-radius: var(--size-radius-def) 0 0 var(--size-radius-def)
}

.views-switcher-component .views li,
.page-header li,
.menu-inline li,
.filter-box .input-addon .input-addon-item,
.filter-box .input-addon input[type=text] {
	line-height: 1rem;
	margin: 0
}

.page-header li,
.menu-inline li {
	padding: 0;
	border-left: var(--style-border)
}

.page-header li:last-child,
.menu-inline li:last-child {
	border-right: var(--style-border)
}

.page>.page-header li:first-child,
.page>#main>.page-header li:first-child,
.sidebar-content .page-header>ul>li:first-child,
#modal-content .page-header>ul>li:first-child {
	border-left: 0
}

.page-header li.active a,
.menu-inline li.active a {
	box-shadow: inset 0 2px 0 0 var(--color-greyscale-5);
	background: var(--color-greyscale-6);
	box-sizing: border-box;
	font-weight: 700
}

.views-switcher-component .views li,
.filter-box .input-addon .input-addon-item,
.filter-box .input-addon input[type=text] {
	padding: .75rem;
	background: var(--color-greyscale-6);
	border: 0
}

.views-switcher-component .views li {
	display: inline-block;
	min-width: 4rem;
	text-align: center;
	box-sizing: border-box
}

.views-switcher-component .views li:first-child {
	border-top-left-radius: var(--size-radius-def);
	border-bottom-left-radius: var(--size-radius-def);
	border-left: 1px solid var(--color-greyscale-6);
	border-radius: 0
}

.views-switcher-component .views li:last-child {
	border-top-right-radius: var(--size-radius-def);
	border-bottom-right-radius: var(--size-radius-def);
	border-color: var(--color-greyscale-6);
	border-bottom-color: var(--color-greyscale-3)
}

.views-switcher-component .views li.active {
	background: linear-gradient(to top, var(--color-greyscale-1) 2px, var(--color-greyscale-6) 2px)
}

.page-header ul a,
.menu-inline ul a {
	padding: .75rem 1.5rem;
	display: inline-block;
	min-width: 6rem;
	text-align: center;
	box-sizing: border-box
}

.views-switcher-component .views li a,
.views-switcher-component .views li.active a {
	height: 1rem;
	display: block;
	color: var(--color-greyscale-1);
	font-weight: 400
}

.project-header .filter-box-component .input-addon {
	border-radius: var(--size-radius-def)
}

.filter-box .input-addon input[type=text] {
	font-size: 1rem;
/*	height: 1rem;	Removed*/ 
	box-shadow: none;
	border-radius: var(--size-radius-def), 0, 0, var(--size-radius-def);
	box-sizing: content-box;
	background: none
}

.filter-box .input-addon .input-addon-item:last-child {
	border-radius: 0 var(--size-radius-def) var(--size-radius-def) 0
}

.dropdown .action-menu {
	display: block;
	padding: .75rem 0;
	box-sizing: border-box
}

.filter-box .input-addon .input-addon-item .dropdown-menu,
.filter-box .input-addon .input-addon-item .active-dropdown-menu {
	line-height: 1rem;
	display: block
}

#board {
	border-right: none
}

#board td,
#board th {
	border: none;
	background: var(--color-greyscale-4);
	padding: .5rem .75rem
}

#board th.board-column-header {
	line-height: 0;
	padding-bottom: .25rem
}

#board td:first-child,
#board th:first-child {
	border: none;
	padding-left: 0
}

#board td:last-child,
#board th:last-child {
	padding-right: 0
}

#board th.board-swimlane-header {
	font-size: 1.5rem;
	line-height: 4rem;
	padding: 0
}

#board th.board-swimlane-header * {
	line-height: 4rem;
	vertical-align: middle
}

#board th.board-swimlane-header .tooltip {
	font-size: 1rem
}

#board th.board-swimlane-header .tooltip i.fa {
	color: var(--color-greyscale-2)
}

#board th.board-swimlane-header .board-column-header-task-count {
	font-size: 1rem
}

#board .board-swimlane-columns-first th.board-column-header-collapsed {
	width: 4.5rem;
	min-width: 4.5rem
}

#board .board-swimlane-columns-first th.board-column-header-collapsed:last-child {
	width: 3.75rem;
	min-width: 3.75rem
}

#board th.board-column-header-collapsed {
	width: 3rem;
	min-width: 3rem
}

#board th.board-column-header-collapsed .board-add-icon {
	display: none
}

#board th.board-column-header-collapsed .board-column-title {
	display: none
}

#board td {
	border-color: var(--color-greyscale-3)
}

#board .board-swimlane {
	border-bottom: 2rem solid var(--color-greyscale-4)
}

.board-swimlane-header .board-swimlane-toggle i.fa {
	font-size: 1rem;
	color: var(--color-greyscale-2);
	line-height: 4rem;
	vertical-align: bottom
}

.board-swimlane-header .board-swimlane-toggle i.fa:hover {
	color: var(--color-greyscale-1)
}

#board th.board-column-header-collapsed {
	text-align: left
}

#board th.board-column-header-collapsed>.board-column-expanded-header {
	display: none
}

#board th.board-column-header.board-column-compact {
	padding-top: 0
}

.TR .board-column-collapsed .board-column-header-task-count {
	padding-left: 1rem
}

.board-column-expanded-header>span {
	margin-right: 0;
	display: inline;
	font-weight: 400
}

.board-column-expanded-header>span[title="Task count"]:not(.board-column-header-task-count) {
	display: none
}

.board-column-expanded-header .board-column-title {
	display: inline-block
}

.board-column-expanded-header .board-column-title a {
	font-weight: 400
}

.board-column-expanded-header .pull-right {
	display: contents
}

.board-column-expanded-header .pull-right>*:last-child {
	margin-right: .5rem
}

.board-column-expanded-header .pull-right>*:nth-child(3) {
	margin-left: .5rem
}

.board-column-expanded-header .pull-right>.tooltip i.fa {
	color: var(--color-greyscale-2);
	margin-bottom: 1px;
	margin-right: 0
}

.board-column-expanded-header .board-column-header-task-count {
	margin-right: .5rem
}

#board td.board-column-task-collapsed {
	line-height: 3rem
}

#board td.board-column-task-collapsed .board-rotation-wrapper {
	padding: 0
}

.TR .board-column-task-collapsed .board-toggle-column-view {
	cursor: pointer
}

.TR .board-column-task-collapsed .board-toggle-column-view:hover {
	color: var(--color-brand-prim)
}

.board-add-icon {
	margin: 0 1rem 0 0;
	padding: 0;
	line-height: 1rem
}

.board-add-icon .fa-plus:hover {
	text-decoration: none
}

table th .board-add-icon:hover .fa-plus:before {
	color: var(--color-brand-secd);
	background: var(--color-brand-prim)
}

.board-add-icon .fa-plus:before {
	background: var(--color-greyscale-4);
	color: var(--color-greyscale-2);
	padding: 2px;
	display: block;
	width: 1.5rem;
	height: 1.5rem;
	font-size: .5em;
	line-height: 1.5rem;
	border-radius: var(--size-radius-def)
}

table th:first-child .board-add-icon .fa-plus:before {
	background: var(--color-brand-prim);
	color: var(--color-brand-cont);
	box-shadow: var(--style-shadow-light)
}

table th:first-child .board-add-icon:hover .fa-plus:before {
	color: var(--color-brand-secd)
}

#task-view .sidebar-content>* {
	max-width: 900px;
	margin: auto
}

#task-view .sidebar-content #comments {
	background: var(--color-greyscale-4)
}

#task-view .sidebar-content .accordion-section {
	padding: 0;
	margin: 2.5rem auto;
	border-bottom: 0;
	background: none
}

#task-view .sidebar-content .accordion-title {
	border-bottom: var(--style-border) !important;
	background: none;
	border-bottom-style: dotted !important
}

#task-view .sidebar-content .accordion-content {
	background: none;
	border-bottom: 0;
	padding: 0;
	margin: 1rem 0 0
}

#task-view .sidebar-content *:not(:nth-child(2)) .accordion-content {
	padding: 1.5rem;
	background: var(--color-greyscale-4)
}

#task-view .sidebar-content .file-thumbnails {
	padding: 0;
	margin-bottom: -1rem;
	background: var(--color-greyscale-4);
	border-radius: var(--style-border)
}

#task-view .sidebar-content #comments .comment-sorting {
	margin-bottom: 0;
	padding: 0 0 1rem
}

#task-view .sidebar-content #comments .comment {
	padding: 1.5rem 0
}

#task-view .sidebar-content #comments>form {
	padding: 1.5rem 0 0;
	box-sizing: border-box;
	margin: 0
}

#task-view .sidebar-content #comments>form .form-actions button {
	margin: 0
}

#task-view .sidebar-content .page-header {
	margin-top: 2.5rem
}

#task-view .sidebar-content>.page-header {
	margin-bottom: 1rem
}

#task-view .sidebar-content .activity-event {
	box-sizing: border-box
}

#task-view .sidebar-content div[class*=js-chart-] {
	box-sizing: border-box;
	margin-bottom: 1rem
}

#task-view .sidebar-content .table-striped {
	margin-bottom: 1rem
}

#task-view .sidebar-content .alert {
	box-sizing: border-box
}

#task-view .sidebar-content #task-summary {
	margin-bottom: 1rem;
	max-width: unset;
	background-image: var(--pattern-dots-def);
	background-size: var(--pattern-dots-size)
}

#task-summary>br {
	display: none
}

#task-summary h2 {
	padding: 2.5rem 0 1rem;
	border-radius: 0;
	margin: 0 auto 1rem;
	border-bottom: 2px solid var(--color-greyscale-1) !important;
	font-size: 2rem !important;
	background: none;
	line-height: 3rem !important;
	text-shadow: 0 0 1em var(--color-greyscale-6);
	max-width: 900px
}

#task-summary .accordion-section {
	display: none
}

#task-summary .task-summary-container {
	margin: 1rem -2rem 0;
	padding: .5rem 2rem 1.5rem;
	border-bottom-width: 1px;
	border-top-width: 0;
	border-left-width: 0;
	border-right-width: 0;
	border-radius: 0;
	box-shadow: 0 -1rem 0 0 var(--color-greyscale-6);
	text-align: center
}

.task-summary-container .task-tags {
	display: inline-block;
	margin: 0 0 -1rem;
	border: inherit;
	width: 100%;
	max-width: 900px;
	box-sizing: border-box;
	border-top: 0;
	border-width: 0;
	padding: 0
}

#task-summary .task-tags ul {
	margin: 0 auto
}

#task-summary .task-summary-columns {
	display: flex;
	flex-flow: row;
	flex-direction: row-reverse;
	flex-wrap: wrap;
	padding-top: 1rem;
	border: inherit;
	border-width: 0;
	justify-content: space-between;
	padding: 1rem 0 0;
	max-width: 900px;
	margin: auto
}

#task-summary .task-summary-column {
	color: var(--color-greyscale-1);
	margin-bottom: 1rem;
	border: inherit;
	border-width: 0;
	padding-left: 0;
	margin: 1rem 0 0;
	min-width: 20%
}

#task-summary .task-summary-column ul {
	border: inherit
}

#task-summary .task-summary-column li {
	font-size: var(--size-font-min);
	border: inherit;
	border-bottom-width: 1px;
	padding-bottom: .5rem;
	border-style: dotted;
	display: flex;
	justify-content: space-between;
	line-height: 1rem;
	margin-bottom: 1.25rem
}

#task-summary .task-summary-column li a {
	font-size: var(--size-font-min);
	border-bottom: 1px dotted
}

#task-summary .task-summary-column span {
	color: var(--color-greyscale-1)
}

#task-summary .task-summary-column .avatar.avatar-inline {
	margin: -.5rem 0 0 .5rem;
	float: right;
	line-height: 1rem
}

#task-summary .task-summary-column .avatar.avatar-inline .avatar-letter {
	font-size: var(--size-font-min);
	width: 1rem;
	line-height: 1rem;
	padding: 1px
}

#task-summary .task-summary-column .avatar.avatar-inline img {
	width: calc(1rem + 2px);
	height: auto
}

.file-thumbnail {
	box-shadow: var(--style-shadow-light);
	background-color: var(--color-greyscale-6);
	border-radius: var(--size-radius-def);
	margin: 0 1rem 1rem 0;
	border: none;
	border-bottom: var(--style-border);
	width: 14rem
}

.file-thumbnail img {
	border-radius: var(--size-radius-def) var(--size-radius-def) 0 0;
	width: 100%
}

.file-thumbnail-content {
	padding: .5rem .75rem
}

.file-thumbnail-title {
	margin-bottom: .5rem
}

.file-thumbnail-title .dropdown>a i.fa {
	position: absolute;
	right: 0;
	margin-right: 0
}

.file-thumbnail-description {
	font-size: var(--size-font-min);
	color: var(--color-greyscale-2);
	margin: 0
}

body.TR .file-thumbnail-description .tooltip>i.fa {
	margin-right: 0;
	color: var(--color-greyscale-2)
}

.file-thumbnail-title .dropdown>a {
	height: 1.5rem;
	display: block;
	text-overflow: ellipsis;
	overflow: hidden;
	line-height: 1.5rem;
	white-space: nowrap;
	width: 11rem
}

#file-dropzone,
#screenshot-zone {
	width: auto;
	background: var(--color-greyscale-4);
	border: none;
	border-bottom: var(--style-border)
}

#file-dropzone-inner,
#screenshot-inner {
	color: var(--color-greyscale-1)
}

.public-task>* {
	width: 100%
}

.public-task #task-summary .task-summary-container {
	margin: 1rem 0 0;
	width: 100%;
	box-sizing: border-box
}

.project-overview-columns {
	margin: 0 auto 1rem;
	background-color: var(--color-greyscale-6);
	border-radius: var(--size-radius-def);
	border-bottom: var(--style-border);
	width: 100%;
	padding: 1.5rem 0 1rem;
	box-shadow: var(--style-shadow-heavy)
}

.project-overview-column {
	margin: 1rem 0;
	padding: 0 3rem;
	background: var(--color-greyscale-6);
	border: 0;
	border-right: var(--style-border);
	border-radius: var(--size-radius-def);
	font-size: 2rem;
	line-height: 2rem
}

.project-overview-column:first-child {
	border-left: var(--style-border)
}

.project-overview-column strong {
	font-size: 3rem;
	font-family: var(--style-fontfamily-code)
}

.project-overview-column small {
	padding-top: .75rem;
	display: block
}

.sidebar {
	width: 16%;
	padding: 0;
	margin-right: 4rem;
	display: block
}

.sidebar .sidebar-title {
	padding: 1rem 1.25rem;
	border-radius: 0;
	border-bottom: var(--style-border)
}

.sidebar .sidebar-title h2 {
	margin-bottom: 0
}

.sidebar>ul {
	background: none;
	border-bottom: var(--color-greyscale-3);
	border-radius: 0 0 var(--size-radius-def) var(--size-radius-def)
}

.sidebar-content div[class*=js-chart-] {
	padding: 1rem;
	background: var(--color-greyscale-5);
	margin-bottom: 1rem;
	border-bottom: var(--style-border)
}

.sidebar>ul li {
	margin: 0;
	line-height: 3rem;
	border-bottom: var(--style-border);
	padding-left: 1.25rem !important
}

.sidebar>ul li.active,
.sidebar>ul li:hover {
	border-left: 2px solid var(--color-greyscale-1);
	background: var(--color-greyscale-6);
	border-radius: var(--size-radius-def)
}

.sidebar>ul li a {
	display: inline-block;
	vertical-align: middle;
	width: 100%;
	line-height: 3rem
}

.sidebar>ul li.active a {
	font-weight: 700
}

.sidebar>ul li.active a:focus,
.sidebar>ul li.active a:hover {
	color: var(--color-greyscale-1)
}

.sidebar.sidebar-icons>ul ul li {
	font-size: 0
}

.sidebar-icons>ul ul li a {
	width: calc(100% - 2.6rem)
}

.sidebar.sidebar-icons li i.fa {
	margin-right: 1.5rem;
	font-size: 1rem
}

.sidebar-icons>ul ul li i.fa {
	vertical-align: middle
}
/* Added ThemeRevisionMenuBtn active also on Desktop */
.themeRevisionMenuBtn {
	font-size: 1.3rem;
	background: var(--color-greyscale-6);
	width: 2rem;
	height: 2rem;
	line-height: 2rem;
	text-align: center;
	border-radius: var(--size-radius-def);
	border-bottom: var(--style-border);
	font-weight: 700;
	margin-bottom: 1rem;
	display: block;
	cursor: pointer;
    margin-top: -2.5rem;
}

.sidebar-container>.sidebar {
    order: unset;
    display: none;
    background: var(--color-greyscale-6);
    border-radius: var(--size-radius-def);
    border: var(--style-border);
    max-width: 40vw; /* Adjust the max-width as needed */
    width: 100%;
    max-height: unset; /* Remove vertical constraint */
    overflow: hidden; /* Prevent scrolling on the vertical axis */
    position: fixed;
    box-shadow: var(--style-shadow-heavy);
    z-index: 999;
}

.table-list-header {
	background: none;
	border: none;
	border-bottom: var(--style-border);
	border-radius: var(--size-radius-def) var(--size-radius-def) 0 0;
	line-height: 2rem;
	padding: .5rem 1rem
}

.table-list-row {
	padding: 1rem;
	border: none;
	border-bottom: var(--style-border) !important;
	border-radius: 0;
	position: relative;
	margin: 0
}

.table-list-header+.table-list-row {
	border-top-left-radius: var(--size-radius-def);
	border-top-right-radius: var(--size-radius-def)
}

.table-list-header~.table-list-row:last-child,
.table-list-row:last-child {
	border-bottom-left-radius: var(--size-radius-def);
	border-bottom-right-radius: var(--size-radius-def)
}

.table-list-row:nth-child(even) {
	background: var(--color-greyscale-6) !important
}

.table-list-row:nth-child(odd) {
	background: var(--color-greyscale-5) !important
}

.table-list-row:hover,
.table-list-row:nth-child(odd):hover {
	border-right: 0;
	border-bottom: var(--style-border)
}

.table-list-row.table-border-left>div:first-child {
	margin-right: 1rem
}

.page>.table-list,
.page>.panel,
.page>#main>.table-list {
	background-color: var(--color-greyscale-6);
	padding: 3rem
}

.table-list-row.table-border-left {
	border-left: none !important
}

body.TR .table-list-header * {
	color: var(--color-greyscale-1)
}

.table-list-header .list-item-links,
.table-list-header .list-item-actions,
.table-list-header .table-list-header-menu a {
	margin: 0 0 0 1rem
}

div[class^="table-list-row color-"] {
	padding-right: 3rem;
	border-left-width: 2px !important;
	border-bottom-color: var(--color-greyscale-3) !important
}

.table-list-row .table-list-title a {
	color: var(--color-greyscale-1)
}

.table-list-row>div:first-child {
	display: inline;
	line-height: 1rem;
}

.table-list-row>div:first-child *:not(.avatar-letter) {
	color: var(--color-greyscale-1);
	margin-bottom: 0
}

.table-list-row .table-list-title {
	display: inline;
	margin-right: 1rem
}

.table-list-row .table-list-details {
	font-weight: 400;
	color: var(--color-greyscale-1);
	line-height: 2rem;
	display: inline
}

.table-list-row .table-list-details-with-icons {
	float: none
}

.table-list-row .table-list-details li {
	margin-left: 0
}

.table-list-row .table-list-details i {
	margin-right: .5rem
}

.table-list-row .table-list-details strong {
	font-weight: 700;
	color: var(--color-greyscale-1)
}

.table-list-row .table-list-details small {
	padding-right: 1rem;
	color: var(--color-greyscale-1)
}

.table-list-row .table-list-details span:first-child {
	margin-left: .5rem !important
}

.task-list-icons {
	margin-top: .5rem !important
}

.table-list-row .table-list-icons {
	line-height: inherit
}

.table-list-row .task-list-subtasks {
	margin-top: 1rem !important
}

.subtask-cell {
	border-top: 1px solid var(--color-greyscale-3);
	border-left: 1px solid var(--color-greyscale-5);
	padding: 1rem .5rem
}

.board-task-list {
	min-height: 500px;
	border-radius: var(--size-radius-def);
	background-image: var(--pattern-dots-def);
	background-size: var(--pattern-dots-size);
	border-left: var(--style-border);
}

.board-task-list-compact {
	max-height: calc(100vh - 16.5rem)
}

.task-board {
	border-radius: var(--size-radius-def);
	padding: 1rem;
	border: none;
	border-bottom: 1px solid;
	transition: box-shadow .15s, transform .15s;
	transition-timing-function: ease-in-out;
	font-size: 1rem;
	margin-bottom: .5rem;
	box-shadow: var(--style-shadow-light)
}

.task-board:hover {
	transform: translateY(-2px);
	box-shadow: var(--style-shadow-heavy)
}

.task-board a {
	color: var(--color-greyscale-1)
}

.draggable-placeholder {
	border: 1.5rem solid var(--color-greyscale-5);
	background-image: var(--pattern-dots-ph);
	background-size: var(--pattern-dots-size);
	margin-bottom: .75rem
}

.task-board-collapsed a.dropdown-menu strong {
	color: var(--color-greyscale-1)
}

.task-board-expanded {
	overflow: hidden
}

.task-board-expanded .task-board-saving-icon {
	left: 0;
	right: 0;
	bottom: 0;
	top: 0;
	color: var(--color-greyscale-6);
	background-color: rgba(0, 0, 0, .6)
}

.task-board-expanded .task-board-saving-icon i.fa {
	margin: 0;
	position: absolute;
	font-size: 1rem;
	bottom: 1rem;
	right: 1rem
}

.task-board-sort-handle i.fa-arrows-alt {
	padding: 1rem;
	margin: -.5rem 0 0 -1rem
}

.task-board.task-board-recent,
.task-board.task-board-status-closed {
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-top: none;
	border-left: none;
	border-right: none
}

.task-board.task-board-status-closed .task-board-title {
	text-decoration: line-through;
	font-style: italic
}

.task-board.task-board-recent .task-board-header:before {
	content: "\25CF";
	position: relative;
	margin: 0 8px 8px 0;
	color: var(--color-brand-prim);
	text-shadow: 1px 2px 6px var(--color-greyscale-2);
	font-size: var(--size-font-min)
}

.task-board-header {
	line-height: 1rem;
	display: flex;
	align-items: flex-start;
	flex-wrap: wrap;
	justify-content: space-between;
	margin-bottom: 0
}

.task-board-expanded .task-board-header>a i.fa {
	color: var(--color-greyscale-1);
	opacity: .08
}

.task-board-header>.dropdown {
	margin-bottom: 1rem;
	min-width: 3.3rem;
	font-size: var(--size-font-min);
	line-height: var(--size-font-min)
}

body.TR .task-board-header>.dropdown * {
	color: var(--color-greyscale-1);
	font-size: var(--size-font-min);
	line-height: var(--size-font-min)
}

.task-board-header>.js-modal-large {
	padding: 0 .5rem 0 0;
	flex: 20px;
	margin-bottom: 1rem;
	line-height: var(--size-font-min);
	font-size: var(--size-font-min)
}

.task-board-avatars {
	text-align: right;
	float: right;
	margin-bottom: 6px
}

.task-list-avatars {
	position: absolute;
	top: 1rem;
	right: 1rem
}

.task-board-avatars .avatar.avatar-inline,
.task-list-avatars .avatar.avatar-inline {
	margin-right: 0
}

.task-board-header>.task-board-assignee,
.task-avatar-assignee {
	display: none
}

body.TR .task-board-title,
body.TR .table-list-title {
	line-height: 0;
	margin: 0 0 6px;
	clear: both
}

body.TR .task-board-title {
	float: left
}

body.TR .task-board-title a,
body.TR .table-list-title a {
	font-weight: 700;
	line-height: calc(1rem + 6px);
	font-size: 1rem;
	color: var(--color-greyscale-1);
	padding-right: 6px
}

.task-board .task-board-expanded>.task-board-category-container {
	margin: 0;
	text-align: left;
	display: contents;
	float: left
}

.task-board .task-tags,
.task-board .task-tags ul {
	display: contents
}

.task-board-category,
.task-tags li,
.table-list-category,
.task-list-tag {
	border: none;
	border-bottom: calc(1rem + 6px) solid var(--color-greyscale-2);
	border-radius: var(--size-radius-def);
	height: 0;
	line-height: calc(1rem + 6px);
	padding: 0 4px;
	margin: 0 6px 6px 0 !important;
	font-weight: 700;
	font-size: var(--size-font-min);
	;
	color: var(--color-greyscale-6);
	background: none !important;
	float: left;
	opacity: .85;
	white-space: nowrap;
	letter-spacing: -.5px;
	max-width: calc(100% - 1rem);
	box-shadow: var(--style-shadow-light)
}

.table-list-category,
.task-list-tag {
	float: none;
	display: inline-block;
	margin-bottom: 0 !important
}

.task-board-category:hover,
.task-tags li:hover,
.table-list-category:hover,
.task-list-tag:hover {
	opacity: 1
}

body.TR .task-board-category a,
body.TR .table-list-category a {
	color: var(--color-greyscale-6);
	font-size: var(--size-font-min);
	font-weight: 700;
	line-height: calc(1rem + 6px);
	display: contents
}

body.TR .task-board-category a:hover,
body.TR .table-list-category a:hover {
	color: var(--color-greyscale-6)
}

body.TR .task-board-category a {
	overflow: hidden;
	text-overflow: ellipsis
}

body.TR .task-board-category span.tooltip i.fa,
body.TR .table-list-category span.tooltip i.fa {
	margin: 0;
	color: var(--color-greyscale-6);
	vertical-align: middle;
	opacity: .5
}

.task-date {
	font-weight: 400;
	color: var(--color-greyscale-1)
}

.task-board-icons,
.task-list-icons {
	clear: both;
	font-size: 0;
	text-align: left;
	line-height: 0;
	margin-top: calc(1rem - 9px);
	display: block;
	width: 100%;
	transition: opacity .15s;
	transition-timing-function: ease-in-out
}

.task-board-icons .task-board-icons-row {
	line-height: 0;
	display: contents;
	font-size: 0
}

.task-board-icons .task-board-icons-row br {
	display: none
}

.task-board:hover .task-board-icons,
.task-board:hover .task-board-header>a i.fa,
.table-list-row:hover .task-list-icons {
	opacity: 1
}

.task-board-icons .task-board-icons-row *,
.task-list-icons * {
	margin: 0 .1rem 0 0 !important;
	font-size: var(--size-font-min);
/*	font-weight: 400; */
	color: var(--color-greyscale-1) !important;
	display: inline
}

.task-board-icons .task-board-icons-row>*,
.task-list-icons>* {
	margin: 0 .5rem 0 0 !important;
	opacity: 1;
	display: inline-block;
	line-height: calc(1rem + 6px)
}

.task-board-icons .task-board-icons-row>.metamagik-footer-title,
.task-list-icons>.metamagik-footer-title {
	display: none
}

.task-board-icons .task-board-icons-row .task-date-overdue,
.task-list-icons .task-date-overdue,
.task-board-icons .task-board-icons-row .task-date-overdue i.fa,
.task-list-icons .task-date-overdue i.fa {
	color: var(--color-warning-prim) !important
}

.task-board-icons .task-board-icons-row .task-icon-age,
.task-list-icons .task-icon-age {
	font-size: 0;
	height: calc(1rem + 6px)
}

.task-board-icons .task-board-icons-row .task-icon-age .task-icon-age-total,
.task-board-icons .task-board-icons-row .task-icon-age .task-icon-age-column,
.task-list-icons .task-icon-age .task-icon-age-total,
.task-list-icons .task-icon-age .task-icon-age-column {
	border: none;
	background: var(--color-greyscale-2);
	opacity: 1
}

.task-board-icons .task-board-icons-row .task-icon-age .task-icon-age-total,
.task-list-icons .task-icon-age .task-icon-age-total {
	border-top-left-radius: var(--size-radius-def);
	border-bottom-left-radius: var(--size-radius-def);
	margin: 0 !important;
	border-right: 1px solid var(--color-greyscale-2)
}

.task-board-icons .task-board-icons-row .task-icon-age .task-icon-age-column,
.task-list-icons .task-icon-age .task-icon-age-column {
	border-top-right-radius: var(--size-radius-def);
	border-bottom-right-radius: var(--size-radius-def);
	margin: 0
}

.comment-sorting {
	font-size: 1rem;
	background: var(--color-greyscale-4);
	line-height: 1rem;
	padding: 1rem;
	border-bottom: var(--style-border)
}

.comment-sorting a {
	margin-left: .5rem
}

.comment,
.activity-event {
	padding: 1.5rem;
	margin-bottom: 0;
	border-bottom: var(--style-border);
	background: none;
	border-radius: var(--size-radius-def)
}

.comments .comment:nth-child(even):not(.comment-highlighted),
.activity-event:nth-child(even) {
	background: none
}

#modal-content>.activity-event,
#task-view .activity-event {
	background: var(--color-greyscale-4);
	border-radius: 0
}

#modal-content>.page-header+.activity-event,
#task-view .page-header+.activity-event {
	border-top-left-radius: var(--size-radius-def);
	border-top-right-radius: var(--size-radius-def)
}

#modal-content>.page-header~.activity-event:last-child,
#task-view .page-header~.activity-event:last-child {
	border-bottom-left-radius: var(--size-radius-def);
	border-bottom-right-radius: var(--size-radius-def)
}

.comments .comment:hover,
.activity-event:hover,
.comments .comment:nth-child(even):not(.comment-highlighted):hover,
.comments .comment:nth-child(odd):not(.comment-highlighted):hover {
	background: unset
}

.comments .comment-highlighted,
.comments .comment-highlighted:hover {
	background-color: var(--color-brand-secd);
	border: inherit
}

.comment .avatar-left,
.activity-event .avatar-left {
	margin-right: 1rem
}

.comment-title,
.activity-title {
	font-weight: 400;
	margin-bottom: 1rem;
	border: none;
	font-size: var(--size-font-min)
}

.activity-event .activity-title a {
	font-size: var(--size-font-min);
	font-weight: 700
}

.comment-title *,
.activity-title * {
	font-size: var(--size-font-min)
}

.comment-title {
	margin-left: 5rem
}

.comment-title strong.comment-username {
	font-weight: 400
}

.comment-title .comment-date {
	font-weight: 400
}

.comment-content,
.activity-content {
	margin: 0 0 0 5rem;
	font-size: 1rem;
	word-break: break-word
}

.comment-content *,
.activity-content * {
	line-height: 1.5rem !important
}

.comment-content {
	margin-right: 4rem
}

.comment-actions {
	text-align: right;
	float: right
}

.activity-description {
	margin: 0
}

.activity-description .activity-task-title {
	font-weight: 700
}

.activity-description ul {
	margin: 1rem 0 0
}

.activity-description li {
	list-style-type: inherit
}

.activity-description>ul>li,
.activity-changes>ul>li,
.activity-description>.markdown,
.activity-changes>.markdown,
.comment-content>.markdown {
	margin: 0 0 2px;
	padding: 1rem 1.5rem;
	background: var(--color-greyscale-6);
	border-radius: var(--size-radius-def);
	box-shadow: var(--style-shadow-light);
	list-style-type: none
}

.activity-changes>p>strong {
	font-size: var(--size-font-min);
	margin-top: 1rem;
	display: block;
	font-weight: 400
}

.comments>form {
	margin-top: 1rem
}

.comments>form .js-text-editor-rendered {
	max-width: 100%
}

.comments>form .text-editor textarea,
.comments>form .text-editor .text-editor-preview-area {
	box-sizing: border-box;
	height: 10rem
}

.accordion-content>.activity-event {
	padding: 1.5rem 0
}

#modal-overlay {
	background: rgba(0, 0, 0, .8)
}

#modal-box {
	border-radius: var(--size-radius-def);
	padding: 2rem;
	background: var(--color-greyscale-6);
	max-width: 1024px !important
}

#modal-header {
	padding: 0;
	margin: 0 0 .5rem;
	font-size: var(--size-font-min);
	line-height: var(--size-font-min)
}

#modal-close-button {
	z-index: 999;
	position: relative
}

#modal-close-button i.fa {
	margin: 0
}

#modal-content {
	padding: 0
}

#modal-content>.table-list {
	padding: 0
}

#modal-content>form {
	padding: 1rem;
	background: var(--color-greyscale-4);
	max-width: unset
}

#modal-content .page-header {
	padding-top: 0;
	margin-top: -1.5rem;
	background-image: none
}

#modal-content .sidebar-container {
	margin-top: 1rem
}

#modal-content .sidebar-content {
	border: none;
	padding: 0
}

.task-form-main-column {
	display: flex;
	flex-direction: column;
	flex: 5;
	min-width: 400px;
	border-bottom: var(--style-border);
	border-right: var(--style-border);
	padding-bottom: 1rem;
	margin-bottom: 1rem;
	margin-top: 1.75rem
}

.task-form-secondary-column {
	max-width: unset;
	min-width: 280px;
	max-height: unset;
	padding: 0;
	width: auto;
	flex: 2;
	border-right: var(--style-border);
	padding-left: 1rem;
	border-bottom: var(--style-border);
	padding-bottom: 1rem;
	margin-bottom: 1rem
}

#modal-content .task-form-container>*:nth-child(3) {
	border-right: 0
}

#modal-content .js-mail-form>.dropdown {
	margin-left: .5rem
}

body.TR .markdown,
body.TR .markdown * {
	line-height: 1.8rem !important;
	font-size: 1.1rem
}

body.TR .markdown a {
	border-bottom: 1px dotted var(--color-greyscale-2);
	font-size: 1.1rem
}

body.TR .markdown p {
	margin-bottom: 1rem
}

body.TR .markdown p>code {
	font-size: 1rem;
	display: inline-block;
	background: var(--color-greyscale-3);
	border-radius: var(--size-radius-def);
	padding: 0 .5rem
}

body.TR .markdown pre {
	background: unset;
	padding: .75rem 1.5rem;
	border-radius: var(--size-radius-def);
	border: 0;
	border-left: var(--style-border-thk);
	white-space: break-spaces;
	text-align: left;
	word-break: break-word;
	font-size: 1rem;
	margin: 0 0 1rem
}

body.TR .markdown pre code,
body.TR .markdown pre code * {
	font-size: 1rem
}

body.TR .markdown h1,
.markdown h2,
body.TR .markdown h3,
.markdown h4 {
	line-height: 1em !important;
	margin: 0 0 1rem;
	padding-top: .8em
}

body.TR .markdown h3 {
	font-size: 1.4rem !important
}

body.TR .markdown h2 {
	font-size: 1.8rem !important
}

body.TR .markdown h1 {
	font-size: 2.3rem !important
}

body.TR .markdown blockquote {
	border-left: var(--style-border-thk);
	padding: .75rem 1.5rem;
	margin-bottom: 0;
	margin-left: 0;
	margin: 0 0 1rem
}

body.TR .markdown blockquote,
body.TR .markdown blockquote * {
	font-size: 1rem;
	font-style: italic;
	color: var(--color-greyscale-2)
}

body.TR .markdown blockquote>*:last-child {
	margin-bottom: 0
}

body.TR .markdown ul {
	margin: 1rem 0 1rem 1.5rem
}

body.TR .markdown ol {
	margin: 1rem 0 1rem 1.25rem
}

body.TR .markdown>ul {
	margin: 0 0 1rem .5rem;
	list-style: circle
}

body.TR .markdown>ol {
	margin: 0 0 1rem .25rem
}

body.TR .markdown img {
	margin: 0
}

body.TR .markdown img.emojione {
	max-width: 1rem;
	max-height: 1rem
}

body.TR .markdown h3 img.emojione {
	max-width: 1.2rem;
	max-height: 1.2rem;
	vertical-align: top
}

body.TR .markdown h2 img.emojione {
	max-width: 1.6rem;
	max-height: 1.6rem;
	vertical-align: top
}

body.TR .markdown h1 img.emojione {
	max-width: 2.1rem;
	max-height: 2.1rem;
	vertical-align: top
}

body.TR .markdown img:not(.emojione) {
	vertical-align: text-top
}

body.TR .markdown>img {
	margin: 0 1rem 1rem 0
}

body.TR .markdown>*:last-child {
	margin-bottom: 0
}

body.TR .markdown>*:first-child {
	padding-top: 0
}

.TR #user-section form label[for="form-theme"] {
	display: none
}

.TR #user-section form select#form-theme {
	display: none
}

@media (max-width:1200px) {
	.task-board-sort-handle {
		display: block;
		float: none
	}

	.task-board-expanded:after {
		display: none
	}

	#task-summary .task-summary-column {
		min-width: 45%
	}
}

@media (max-width:920px) {
	.project-header {
		height: fit-content;
		margin: 0 0 2rem
	}

	.project-header .filter-box-component .input-addon {
		width: 100%
	}
}

@media (max-width:768px) {
	.project-header>.dropdown-component {
		display: inline-block
	}

	.project-header>.views-switcher-component {
		display: inline-block;
		margin-left: -.25rem
	}

	.sidebar-container {
		display: flex;
		flex-direction: column;
		flex-wrap: nowrap;
		width: 100%;
		max-width: unset
	}

	.themeRevisionMenuBtn {
		font-size: 1.3rem;
		background: var(--color-greyscale-6);
		width: 2rem;
		height: 2rem;
		line-height: 2rem;
		text-align: center;
		border-radius: var(--size-radius-def);
		border-bottom: var(--style-border);
		font-weight: 700;
		margin-bottom: 1rem;
		display: block
	}

	.sidebar-container>.sidebar {
		order: unset;
		margin: 2.5rem 0 0;
		display: none;
		background: var(--color-greyscale-6);
		border-radius: var(--size-radius-def);
		border: var(--style-border);
		max-width: calc(100vw - 4rem);
		width: 100%;
		max-height: 40vh;
		overflow: scroll;
		position: fixed;
		box-shadow: var(--style-shadow-heavy);
		z-index: 2
	}

	.sidebar-container>.sidebar-content {
		width: unset
	}

	header .board-selector-container {
		order: 2
	}

	header .board-selector-container>div {
		width: 100%;
		margin-bottom: 1rem
	}

	header .title-container {
		order: 0;
		margin-bottom: 1rem
	}

	header .title-container span.title {
		max-width: 70%
	}

	header .menus-container {
		margin-bottom: 1rem;
		margin-left: 0;
		min-width: 160px;
		padding-top: 0;
		position: absolute;
		right: 1rem;
		top: 2rem
	}

	table.table-scrolling {
		display: table;
		white-space: inherit
	}

	#modal-overlay {
		background: var(--color-greyscale-4)
	}

	#modal-box {
		position: absolute;
		padding: 0;
		transform: none;
		left: 0;
		top: 0;
		max-height: unset;
		background: var(--color-greyscale-4)
	}

	#modal-header {
		text-align: left;
		margin-left: 1rem;
		position: fixed;
		top: .75rem;
		z-index: 2
	}

	#modal-content {
		padding: 4rem .5rem 0;
		background: var(--color-greyscale-4)
	}

	#modal-content>.page-header,
	#modal-content>#main>.page-header {
		padding: 0 1rem;
		margin: 0;
		border: 0
	}

	#modal-content>.page-header>h2,
	#modal-content>#main>.page-header>h2 {
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
		line-height: 1.5rem;
		position: fixed;
		background: var(--color-greyscale-6);
		left: 0;
		top: 0;
		width: calc(100vw - 4rem);
		padding: 1rem 1rem 1rem 3rem;
		z-index: 1;
		box-shadow: var(--style-shadow-heavy)
	}

	#modal-content>form,
	#modal-content>#main>form {
		margin-bottom: 0
	}

	#modal-content>.confirm {
		padding: 0 1rem
	}

	#modal-content form>textarea,
	#modal-content form>input[type='text'],
	#modal-content form>input[type='email'],
	#modal-content form>input[type='password'],
	#modal-content form>select,
	#modal-content form>.form-inline,
	#modal-content form>.panel,
	.page .sidebar-content textarea,
	.page .sidebar-content input[type='text'],
	.page .sidebar-content input[type='email'],
	.page .sidebar-content input[type='password'],
	.page .sidebar-content select,
	.page .sidebar-content .form-inline,
	.page .sidebar-content .panel {
		width: 90%;
		min-width: 100px;
		box-sizing: border-box
	}

	.page .sidebar-content>.panel {
		width: auto
	}

	.page .sidebar-content .text-editor textarea {
		width: 100%
	}

	#modal-close-button .fa {
		line-height: 2rem
	}

	#modal-close-button .fa::before {
		content: "\f053"
	}

	.table-list-row .table-list-icons {
		text-align: right;
		line-height: inherit
	}

	.sidebar .js-select-dropdown-autocomplete-rendered {
		padding: .5rem .5rem 0
	}

	.table-list-row,
	.sidebar-content .table-list-row {
		min-width: unset;
		max-width: unset;
		width: unset
	}

	.sidebar-content>.table-list {
		flex-wrap: nowrap;
		flex-direction: column
	}

	.form-inline label {
		display: block
	}

	div.ganttview {
		max-width: unset
	}

	#task-summary .task-summary-columns {
		flex-flow: column !important
	}
}

@media (max-width:640px) {
	table.table-scrolling {
		display: inline-block;
		white-space: nowrap;
		background: var(--color-greyscale-6)
	}

	.task-form-main-column {
		min-width: 320px;
		border-right: 0
	}

	.task-form-secondary-column {
		padding-left: 0;
		border-right: 0
	}

	.task-form-main-column input[type="text"] {
		max-width: 100%
	}

	.js-text-editor-rendered {
		max-width: 100%
	}

	#modal-content form[action*="ActionCreationController"]>.select2 {
		width: calc(100vw - 4rem) !important
	}
}

@media (max-width:600px) {
	body>.page {
		margin-bottom: 3rem
	}

	.views li {
		display: inline-block;
		border-radius: 0;
		margin: 0 -4px .5rem 0
	}

	.project-header {
		height: fit-content
	}

	.project-header>.dropdown-component,
	.project-header>.views-switcher-component,
	.page>.page-header,
	.page>#main>.page-header {
		position: fixed;
		z-index: 2;
		left: 0;
		bottom: 0;
		margin: 0;
		box-shadow: 0 -4px 4px -4px var(--color-greyscale-3);
		background: var(--color-greyscale-6)
	}

	.project-header>.views-switcher-component,
	.page>.page-header,
	.page>#main>.page-header {
		width: 100%;
		overflow-x: scroll
	}

	.project-header>.dropdown-component {
		box-shadow: 4px -4px 4px -4px var(--color-greyscale-3)
	}

	.project-header>.views-switcher-component {
		left: 4.5rem;
		width: calc(100% - 4.5rem)
	}

	.project-header>.views-switcher-component::-webkit-scrollbar {
		height: 0
	}

	.dropdown .action-menu,
	.views-switcher-component .views li,
	.page-header ul a {
		padding: 1.2rem 1rem
	}

	.page-header ul a {
		width: 100%;
		padding: 1rem
	}

	.project-header>.views-switcher-component>.views,
	.page>.page-header ul,
	.page>#main>.page-header ul {
		white-space: nowrap;
		box-shadow: none
	}

	.page>.page-header li,
	.page>#main>.page-header li {
		display: inline-block
	}

	header .title-container span.title {
		max-width: 60%
	}

	.table-list-row>div:first-child {
		display: block;
		margin-bottom: .5rem
	}

	.table-list-row .table-list-details {
		margin-bottom: .5rem;
		display: block
	}
}

@media (max-width:480px) {

	html,
	body {
		font-size: 14px
	}

	body {
		padding: 1rem
	}

	header {
		margin-bottom: 1rem
	}

	header h1 .logo {
		width: 2.5rem
	}

	.logo a img {
		height: 2.2rem
	}

	header .title-container,
	.project-header .filter-box-component .input-addon {
		min-width: unset
	}

	header .title-container span.title {
		max-width: 35%;
		font-size: 1.5rem
	}

	header .board-selector-container {
		padding-top: 0
	}

	.sidebar-content>table {
		display: block;
		overflow-x: scroll
	}

	.sidebar-content .page-header li,
	#modal-content .page-header li {
		border-bottom: var(--style-border);
		border-right: var(--style-border)
	}

	.sidebar-content .page-header li:first-child,
	#modal-content .page-header li:first-child {
		border-top: var(--style-border);
		border-left: var(--style-border) !important
	}

	.sidebar-content .page-header>ul,
	#modal-content .page-header>ul {
		border: 0
	}

	input[type=file] {
		max-width: calc(100% - 2rem)
	}

	.page>.table-list,
	.page>.panel,
	.page>#main>.table-list {
		padding: 2rem
	}

	#main .sidebar-content {
		padding: 1rem
	}

	#task-summary .task-summary-container {
		margin: 1rem -1rem 0
	}
}

@media (max-width:360px) {
	header .title-container span.title {
		font-size: 1rem
	}

	.file-thumbnail {
		width: 90%
	}

	#modal-content>form,
	.task-form-main-column,
	.task-form-secondary-column {
		min-width: 200px
	}
}

header .title-container span.title {
	margin-left: 6.5rem;
}

.luckysheet-share-logo {
    height: 32px;
    width: 152px;
    z-index: 1;
    background-image: none !important;
}