@charset "utf-8";

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@200;300;400;500;600;700&display=swap');

:root {
    --blue: #232323;
    --black: #363636;
    --project-color: #dfdddd;

    --brand-primary: #0056b3;
    --brand-primary-lighter: #1a70cd;
}

/*FONTS*/
@font-face {
    font-family: Rubik;
    src: url('../fonts/Rubik/static/Rubik-Regular.ttf');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: Rubik;
    src: url('../fonts/Rubik/static/Rubik-Bold.ttf');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: Rubik;
    src: url('../fonts/Rubik/static/Rubik-SemiBold.ttf');
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: Rubik;
    src: url('../fonts/Rubik/static/Rubik-ExtraBold.ttf');
    font-weight: 800;
    font-style: normal;
}

@font-face {
    font-family: Rubik;
    src: url('../fonts/Rubik/static/Rubik-Light.ttf');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: Rubik;
    src: url('../fonts/Rubik/static/Rubik-Medium.ttf');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: Verdana;
    src: url('../fonts/Verdana/Verdana-Bold.ttf');
    font-weight: 700;
    font-style: normal;
}

/* --------------- Style to null --------------- */
html, body, div, span, h1, h2, h3, h4, h5, h6, p, em, img, strong, sub, sup, b, u, i, dl, dt, dd,
ol, ul, li, fieldset, form, label, table, tbody, tfoot, thead, tr, th, td, article, aside, canvas,
details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio,
video {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    vertical-align: baseline;
    background: transparent;
    font-size: 100%;
}

a {
    margin: 0;
    padding: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

td, td img {
    vertical-align: top;
}

.site input, .site select, .site button, .site textarea {
    margin: 0;
    font-size: 12px;
    /*font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;*/
    font-family: Rubik;
}

.site input[type="text"], .site input[type="password"], .site textarea, .site input[type="email"], .site input[type="phone"], .site input[type="number"] {
    padding: 0;
}

/*.site input[type="checkbox"] {
    vertical-align: bottom;
}*/
.site input[type="radio"], .site input[type="checkbox"] {
    vertical-align: text-bottom;
}

sub {
    vertical-align: sub;
    font-size: smaller;
}

sup {
    vertical-align: super;
    font-size: smaller;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
    display: block;
}

ul,
ol {
    list-style: none;
}

html {
    overflow-y: scroll;
    overflow-x: auto;
}

html,
body {
    height: 100%;
}

body {
    line-height: 1;
    color: #000;
    text-align: left;
    z-index: 1;
    position: relative;
}

input,
textarea {
    outline: none;
}

textarea {
    overflow: auto;
}

input[type="button"], input[type="submit"], button {
    cursor: pointer;
}

a {
    color: #08c;
}

a, a:visited {
    text-decoration: none;
}

a:hover {
    text-decoration: none;
}

a:focus, a:active {
    text-decoration: none;
}

input[type="search"]:focus {
    outline: none;
}

input[type="submit"]::-moz-focus-inner,
input[type="button"]::-moz-focus-inner,
button::-moz-focus-inner {
    padding: 0;
    border: 0;
}

:focus {
    outline: none;
}

::-webkit-input-placeholder {
    color: #ccc;
}

:-moz-placeholder {
    color: #ccc;
}

.placeholder {
    color: #ccc;
}

.mb-16 {
    margin-bottom: 4rem;
}

.text-shortened {
    display: inline-block;
    vertical-align: middle;
    max-width: 250px;
    text-overflow: ellipsis;
    overflow-x: hidden;
}

img {
    object-fit: contain;
}

/* --------------- /Style to null --------------- */

/* --------------- b-content --------------- */
.content {
    min-height: 1080px;
    font-size: 12px;
    line-height: 16px;
    width: 100%;
    margin: 0 auto;
    background: #fff;
    padding: 20px;
    box-sizing: border-box;
}

.content h1 {
    font-size: 150%;
    margin-bottom: 20px;
    color: #08c;
}

.content h2 {
    font-size: 140%;
    margin-bottom: 15px;
    color: #08c;
}

.content h3 {
    font-size: 130%;
    margin-bottom: 12px;
    color: #08c;
}

.content h4 {
    font-size: 120%;
    margin-bottom: 10px;
}

.content h5 {
    font-size: 110%;
    margin-bottom: 10px;
}

.content h6 {
    font-size: 100%;
    margin-bottom: 10px;
}

.content ul {
    list-style: disc;
}

.content ul ul {
    margin: 10px 0 10px 25px;
}

.content ol {
    list-style: decimal;
    /* margin: 0 15px 10px 20px; */
}

.content ol ol {
    margin: 10px 0 10px 25px;
}

.content li {
    margin-bottom: 5px;
}

.content p {
    margin-bottom: 10px;
}

.content table {
    margin-bottom: 15px;
    font-size: 100%;
    width: 100%;
    border-top: 1px solid #ddd;
    border: none;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}

.content th,
.content td {
    border: none;
    border-bottom: 1px solid #f0f0f0;
    padding: 12px 12px;
    text-align: left;
    font-size: 12px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}

.content th {
    vertical-align: middle;
    text-align: center;
    font-weight: normal;
    background: #fff;
    color: var(--black);
    border: none;
    border-bottom: 1px solid #ddd;
}

.base_table.files tbody th,
.base_table.comments tbody th {
    border: none;
}

.base_table th,
.base_table tr td {
    font-size: 11px;
}

.base_table th.order,
.base_table th.small {
    font-size: 10px;
}

.content a,
.content a font {
    color: var(--blue);
    text-decoration: none;
    font-size: 12px;
}

.content a:visited,
.content a:visited font {
    color: var(--blue);
    text-decoration: none;
}

.content a:hover,
.content a:hover font {
    color: var(--black);
    text-decoration: none;
}

.content a:active,
.content a:active font {
    color: #ff0000;
}

.content img[align=left] {
    margin: 0 10px 10px 0;
    float: left;
}

.content img[align=right] {
    margin: 0 0 10px 10px;
    float: right;
}

.wrap_delete {
    display: inline-block;
    margin-right: 10px;
}

.content dl {
    margin: 0 0 15px 0;
}

.content dt {
    font-weight: bold;
    margin-bottom: 2px;
}

.content dd {
    margin-bottom: 5px;
}

.content hr {
    height: 1px;
    border: none;
    color: #aaa;
    background: #aaa;
    margin: 10px 0;
    clear: both;
}

/* --------------- /b-content --------------- */

/* --------------- site --------------- */
.site {
    min-height: 100%;
    position: relative;
    z-index: 1;
    font-family: Rubik;
    /*font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;*/
}

.site__layout {
    background: #f8f8f8;
    margin-top: 63px;
}

.site__content > tbody {
    width: 100%;
    display: block;
}

.site__content > tbody > tr > td:first-child + td {
    border-left: 1px solid #e5e5e5 !important;
}

.site__content {
    display: block;
    /*max-width: 1408px;*/
    width: 100%;
    margin: 0 auto;
    /*border-left: 1px solid #e5e5e5;*/
    /*border-right: 1px solid #e5e5e5;*/
    border: none;
    background: #f8f8f8;
}

.left_td_bg {
    background-color: #232323;
}

span.info {
    padding: 0 0 0 10px;
    font-size: 12px;
    color: #a4a4a4;
}

.site input[type="text"].small,
.site input[type="number"].small {
    width: 90px;
}

/* Hide arrows in Chrome, Safari, Edge, Opera */
.site input[type="number"].no-appearance::-webkit-outer-spin-button,
.site input[type="number"].no-appearance::-webkit-inner-spin-button {
    -webkit-appearance: none;
    appearance: none;
}

/* Hide arrows in Firefox */
.site input[type="number"].no-appearance {
    -moz-appearance: textfield;
}

select {
    font-size: 12px;
    background-color: #fff;
    border: 1px solid #ccc;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    height: 28px;
    line-height: 28px;
    padding: 0 6px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}

.site input[type="text"].error,
.site input[type="number"].error,
.site input[type="file"].error,
.site input[type="password"].error,
.site select.error,
.site input[type="search"].error,
.site textarea.error,
.site .content .error:focus {
    border: 1px solid #ff0000 !important;
}

.error ~ p.error_text {
    display: block;
    margin-top: 5px;
}

.error ~ .editorjs-container {
    border-color: #f00;
}

p.error_text {
    display: none;
    color: #ff0000;
    font-size: 12px;
    padding: 0;
    line-height: 19px;
    margin: 0;
}

p.error_text_header {
    color: #ff0000;
}

.site input[type="text"]:focus,
.site input[type="number"]:focus,
.site input[type="password"]:focus,
.site input[type="search"]:focus,
.site textarea:focus {
    /*border: 1px solid #08c;*/
    border: 2px solid var(--blue);
}

.site input[type='checkbox']:focus, .site input[type='radio']:focus {
    outline: 2px solid var(--blue);
}

.site input[type="text"],
.site select {
    box-shadow: none;
}

.site input[type="text"],
.site input[type="number"],
.site input[type="password"] {
    background-color: #fff;
    border: 1px solid #ccc;
    /*-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,0.075);*/
    /*-moz-box-shadow: inset 0 1px 1px rgba(0,0,0,0.075);*/
    /*box-shadow: inset 0 1px 1px rgba(0,0,0,0.075);*/
    width: 100%;
    height: 28px;
    line-height: 28px;
    padding: 0 6px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
}

.site textarea {
    width: 100%;
    display: inline-block;
    vertical-align: top;
    resize: vertical;
    background-color: #fff;
    border: 1px solid #ccc;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    min-height: 60px;
    padding: 6px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
}

.site input[type="text"]:not(.count):disabled,
.site input[type="number"]:disabled,
.site input[type="password"]:disabled,
.site textarea:disabled {
    background-color: #f7f7f7;
    cursor: not-allowed;
}

.base_table.tasks input[type="text"],
.base_table.tasks textarea,
.base_table.tasks select {
    border: 1px solid transparent;
}

.base_table.tasks input[type="text"]:hover,
.base_table.tasks textarea:hover,
.base_table.tasks select:hover {
    border: 1px solid #f0f0f0;
}

.base_table.tasks textarea {
    box-shadow: none;
    min-width: 100px;
}

.base_table.tasks .select-emoji-only {
    width: 50px;
}

.form_table {
    width: 100%;
    border: 1px solid #ddd;
}

.form_table p, .login_form p {
    margin-bottom: 0;
}

.form_table.search td,
#form_tasks table td {
    border-bottom: none;
}

tr.odd {
    background: #ffffff;
}

.site input[type='submit']:hover,
.site input[type='button']:hover {
    opacity: 0.8;
}

.site input[type='submit'],
.site input[type='button'] {
    font-weight: bold;
    height: auto;
    background: var(--blue);
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    color: #fff;
    border: none;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    padding: 10px 30px;
}

.form_table .info:hover span, .base_table .info:hover span {
    display: block;
}

.statistic-info,
.form_table .info, .base_table .info {
    font-weight: bold;
    font-size: 12px;
    text-align: center;
    line-height: 15px;
    cursor: pointer;
    border: 1px solid var(--blue);
    background: var(--blue);
    color: #fff;
    border-radius: 50%;
    width: 15px;
    height: 15px;
    display: inline-block;
    vertical-align: top;
    position: relative;
}

.statistic-info span,
.form_table .info span, .base_table .info span {
    z-index: 1;
    min-width: 350px;
    position: absolute;
    top: 5px;
    left: 5px;
    display: none;
    background: #fff;
    padding: 10px;
    border: 1px solid #ddd;
    /*box-shadow: 0 0 5px #ddd;*/
    color: #000;
    font-weight: normal;
    font-size: 12px;
    text-align: left;
}

.statistic-info:before,
.form_table .info:before, .base_table .info:before {
    content: "?";
}

.statistic-info.white,
.form_table .info.white, .base_table .info.white {
    border: 1px solid #fff;
    background: #fff;
    color: var(--blue);
}

.item_tags .wrap_input:first-child {
    margin: 0;
}

.item_tags .wrap_input:first-child input {
    margin: 0;
}

.item_tags .wrap_input {
    margin: 5px 0 0 0;
}

.wrap_input {
    margin-bottom: 5px;
}

.wrap_input input {
    display: inline-block;
    vertical-align: top;
    margin: 2px 0 0 0;
}

.options_add {
    font-size: 12px;
    padding-bottom: 5px;
    margin-bottom: 10px;
    background: #fff;
    /*height: 35px;*/
    padding-left: 14px;
    padding-top: 5px;
    line-height: 35px;
    cursor: pointer;
    color: var(--black);
    position: relative;
    font-weight: bold;
    /*z-index: 1;*/
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
}

.options_add:hover,
.options_add {
    background: #f7f7f7;
}

.options_add.open:before {
    margin-top: 3px;
    border: 5px solid transparent;
    border-top: 5px solid #000;
}

.options_add:before {
    content: '';
    position: absolute;
    top: 50%;
    right: 12px;
    transform: translateY(-50%);
    border: 5px solid transparent;
    border-right: 5px solid #000;
    background-color: transparent;
}

.options_add + table {
    display: none;
    margin-top: -10px;
}

.options_add.open + table {
    display: table;
    margin-bottom: 25px;
}

.sub_links {
    font-size: 12px;
    padding-right: 2px;
    float: right;
}

.sub_links a:first-child:before {
    display: none;
}

.sub_links a {
    color: var(--blue);
    display: inline-block;
    vertical-align: top;
}

.item_options label {
    width: 13%;
    line-height: 28px;
    display: inline-block;
    vertical-align: top;
}

.item_options input[type='text'] {
    width: 87% !important;
    margin-bottom: 10px;
}

.item_options {
    display: none;
}

.login_form {
    width: 241px;
    margin: 0 auto;
}

.login_form input[type='submit'] {
    margin: 6px 0 0 64px;
}

.content .login_table {
    display: block;
    margin: 0 auto;
    width: 241px;
}

.login_table input[type='submit'] {
    margin-left: 2px;
}

.login_table td {
    border: none;
    border-bottom: 1px solid #ddd;
    vertical-align: middle;
    padding: 6px;
}

.content .wrap_sub td:first-child {
    width: 28%;
    vertical-align: middle;
    padding-left: 14px;
}

.content .wrap_sub td {
    border: none;
    padding: 30px;
}

.content .wrap_sub {
    border: none;
    /*margin-bottom: 30px;*/
    position: fixed;
    right: 0;
    bottom: -20px;
    text-align: right;
    display: flex;
    justify-content: flex-end;
    background: #fff;
    width: min-content;
    z-index: 100;
}

.content .wrap_sub.search {
    right: auto;
    left: 0;
}

.site input[type='submit'], .site input[type='button'] {
    border-radius: 40px;
    padding: 13px 25px;
}

.base_table th {
    height: 55px;
    background: #eff0f2;
    color: #4b4b4d;
}

.statistic .base_table th {
    height: 55px;
    color: #fff;
    background: #4b4b4d;
}

.base_table th.order-stat .order_desc,
.base_table th.order .order_desc {
    margin-bottom: -12px;
    bottom: 50%;
    border-top: 5px solid #000;
}

.base_table th.order-stat .order_desc {
    border-top: 5px solid #fff;
    right: 25px;
}

.base_table th.order-stat .order_asc,
.base_table th.order .order_asc {
    top: 50%;
    margin-top: -12px;
    border-bottom: 5px solid #000;
}

.base_table th.order-stat .order_asc {
    border-bottom: 5px solid #fff;
    right: 25px;
}

.base_table th.order.small div div * {
    position: unset;
}

.base_table th.order.small div div {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 5px;
    margin-left: 10px;
}
.base_table th.order.small div {
    display: flex;
    align-items: center;
    justify-content: center;
}

.base_table th.order-stat span,
.base_table th.order span {
    opacity: 1;
}

.base_table th.order-stat a,
.base_table th.order a {
    opacity: 0.5;
}

.base_table th.order-stat a, .base_table th.order-stat span,
.base_table th.order a, .base_table th.order span {
    right: 5px;
    position: absolute;
    color: #000;
    border: 5px solid transparent;
}

.base_table th.order {
    position: relative;
    padding-right: 17px;
}

.base_table tr:hover {
    background: #f7f7f7;
}

.base_table td {
    vertical-align: middle;
    /*text-align: center;*/
}

.base_table tr {
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
}

.table-fixed-sections {
    border-collapse: separate;
}

.table-fixed-sections thead {
    position: sticky;
    top: 50px;
}

.table-fixed-sections tfoot {
    position: sticky;
    bottom: -1px;
    z-index: 4;
}

.table-invoice-tasks thead {
    border-bottom: 1px solid #ddd;
}

.table-invoice-tasks tfoot tr:hover {
    background: #fff;
}

.table-stat-05 tfoot td,
.table-invoice-tasks tfoot td {
    font-weight: 700;
    background-color: #DEDEDE;
}

.form-invoices-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 25px;
}

.form-invoices-footer-buttons {
    display: flex;
    align-items: center;
    gap: 1rem;
}

    /* --------------- /site --------------- */

/* --------------- main-menu --------------- */
.main-menu {
    padding-left: 153px;
}

.main-menu a:hover {
    text-decoration: underline;
}

.main-menu a, .main-menu span {
    display: inline-block;
    vertical-align: top;
    padding: 20px 15px;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
}

.main-menu span {
    cursor: default;
    color: #555;
    text-decoration: none;
    background-color: #e5e5e5;
    -webkit-box-shadow: inset 0 3px 8px rgba(0, 0, 0, 0.125);
    -moz-box-shadow: inset 0 3px 8px rgba(0, 0, 0, 0.125);
    box-shadow: inset 0 3px 8px rgba(0, 0, 0, 0.125);
}

/* --------------- /main-menu --------------- */

/* --------------- left_aside --------------- */
.left_aside {
    width: 27px;
}

.left_aside.active {
    width: 260px;
}

/* --------------- /left_aside --------------- */

/* --------------- sub_menu --------------- */
.sub_menu {
    background: #f8f8f8;
    font-size: 14px;
}

.sub_menu.top_menu {
    position: fixed;
    top: 0;
    left: 0;
    margin: auto;
    z-index: 1200;
    display: flex;
    width: 100%;
    justify-content: space-between;
    background-color: #fff;
    padding: 0 20px;
    box-sizing: border-box;
}

.top_menu.sub_menu a,
.top_menu.sub_menu a:hover {
    padding: 20px;
    text-align: center;
}

.top_menu.sub_menu a.fix {
    padding: 15px 35px;
    font-size: 11px;
}

.top_menu.sub_menu ul li a.fix {
    padding: 15px 10px;
}

.top_menu.sub_menu a.dropdown:before {
    content: "";
    top: 43%;
    right: 10px;
    position: absolute;
    border: 5px solid transparent;
    border-right: 5px solid #ffffff;
}

.top_menu.sub_menu a.active.dropdown:before {
    border: 5px solid transparent;
    border-top: 5px solid #ffffff;
    top: 43%;
    right: 8px;
}

.top_menu.sub_menu .menu-level-2 {
    border-top: none;
}

.top_menu.sub_menu li {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    position: relative;
}

.top_menu.sub_menu ul a,
.top_menu.sub_menu ul a:hover {
    padding: 15px 10px;
    font-size: 12px;
    text-align: center;
}

.top_menu.sub_menu li > ul {
    display: none;
}

.top_menu.sub_menu li:hover > ul {
    display: block;
    position: absolute;
    right: 0;
    top: 63px;
    left: 0;
}

.top_menu.sub_menu li:hover > .menu-level-3 {
    display: block;
}

.top_menu.sub_menu .menu-level-3 {
    position: absolute;
    top: 0 !important;
    left: auto !important;
    right: -150px !important;
    width: 150px;
    max-height: 128px; /* 42px * 3 + 2px */
    overflow-y: auto;
    box-sizing: border-box;
}

.top_menu.sub_menu .menu-level-3.left {
    left: -150px !important;
}

.top_menu.sub_menu .menu-level-3.fix_sub {
    max-height: 131px;
}

.top_menu.sub_menu .menu-level-3::-webkit-scrollbar {
    width: 5px;
}

.top_menu.sub_menu .menu-level-3::-webkit-scrollbar-thumb {
    background-color: #ccc;
    border-radius: 6px;
}

.top_menu.sub_menu .dropdown-level-2:after {
    content: '';
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 10px;
    background-image: url("../img/arrow-down.svg");
    width: 10px;
    height: 6px;
    background-repeat: no-repeat;
    background-size: 100%;
}

.top_menu.sub_menu .menu-level-2 > li:hover .dropdown-level-2.left:after {
    transform: translateY(-50%) rotate(90deg);
}

.top_menu.sub_menu .menu-level-2 > li:hover .dropdown-level-2:after {
    transform: translateY(-50%) rotate(-90deg);
}

.top_menu.sub_menu li:hover .dropdown:before {
    border: 5px solid transparent;
    border-top: 5px solid #ffffff;
}

.top_menu.sub_menu .dropdown + ul.fix_sub,
.top_menu.sub_menu #projects-list-menu ul.fix_sub {
    top: 41px;
}

.sub_menu ul {
    border: none;
}

.sub_menu li:first-child {
    border: none;
    margin: 0 !important;
}

.sub_menu li {
    /*border-top: 1px solid #e5e5e5;*/
    background-color: #232323;
    border: none;
}

.sub_menu a.active, .sub_menu a.active:hover {
    background: #08c;
    color: #fff;
}

.sub_menu a.active.dropdown,
.sub_menu a.active.dropdown:hover {
    background: #4c4b4b;
    color: #ffffff;
}

.sub_menu a.active.dropdown:before {
    border: 5px solid transparent;
    border-top: 5px solid #ffffff;
    top: 15px;
    right: 8px;
}

.sub_menu a.dropdown:before {
    content: "";
    top: 12px;
    right: 10px;
    position: absolute;
    border: 5px solid transparent;
    border-right: 5px solid #ffffff;
}

.sub_menu a:hover {
    /*background: #f0f0f0;*/
    /*padding: 10px 14px;*/
    /*background: #4c4b4b;*/
    padding: 16px 12px;
}

.sub_menu a {
    position: relative;
    /*padding: 10px 14px;*/
    display: block;
    color: #ffffff;
    font-size: 13px;
    padding: 16px 12px;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
}

.sub_menu ul {
    display: none;
    background: #f9f9f9;
    border-top: 1px solid #e5e5e5;
}

.sub_menu ul li a:hover {
    padding: 10px 14px;
}

.sub_menu li span, .sub_menu li a.current {
    font-weight: bold;
    background: #333333;
    color: #ffffff;
    display: block;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
}

.sub_menu ul li a, .sub_menu li span {
    display: block;
    padding: 10px 14px;
}

.sub_menu > li > span {
    padding: 10px 14px 10px 14px;
}

.sub_menu .logo {
    display: flex;
}

.sub_menu .logo-container {
    display: flex;
    width: auto;
    align-items: center;
    justify-content: center;
}

.sub_menu.top_menu .logo-container {
    padding-right: 20px;
    flex: 0;
}

.menu_btn:before {
    content: "";
    top: 11px;
    left: 12px;
    position: absolute;
    border: 5px solid transparent;
    border-left: 5px solid #ffffff;
}

.menu_btn.active:before {
    top: 11px;
    left: 8px;
    border: 5px solid transparent;
    border-right: 5px solid #ffffff;
}

.menu_btn {
    height: 10px;
    cursor: pointer;
    position: relative;
    background: #232323;
    font-size: 14px;
    padding: 10px 14px;
    font-weight: bold;
    color: #fff;
}

#projects-list-menu ul {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    grid-template-rows: none !important;
    grid-auto-flow: row !important;
    grid-gap: 12px;
    background: #fff;
    position: absolute;
    top: 79px;
    right: 12%;
    left: 25%;
    padding: 12px;
    z-index: 2;
    box-shadow: 0 20px 30px rgba(0, 0, 0, 0.08);
    border: 1px solid #deeaeb;
    border-top: none;
    border-bottom-left-radius: 8px;
    border-bottom-right-radius: 8px;
    max-width: 800px;
}

#projects-list-menu ul.hidden {
    display: none;
}

#projects-list-menu ul li a {
    font-size: 11px;
    position: relative;
}

/*#projects-list-menu ul li:first-child {*/
/*    grid-row-start: 1;*/
/*    grid-row-end: 8;*/
/*}*/
/*#projects-list-menu ul li:first-child a {*/
/*    font-weight: bold;*/
/*}*/
.top_menu.sub_menu #projects-list-menu ul.fix_sub {
    top: 41px;
}

.top_menu.fix_menu #projects-list-menu ul {
    top: 49px;
}

/* --------------- /sub_menu --------------- */

/* --------------- bread_crumbs --------------- */
.bread_crumbs {
    color: var(--black);
    /*padding-left: 14px;*/
    border-bottom: 1px solid #e5e5e5;
    margin-bottom: 15px;
    font-size: 14px;
    padding-bottom: 6px;
    /*color: #08c;*/
    font-weight: bold;
}

/* --------------- /bread_crumbs --------------- */

/* --------------- pagination --------------- */
.pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    width: 100%;
    gap: 16px;
    margin: 24px 0;
}

.pagination-list {
    display: flex;
    align-items: center;
    gap: 16px;
    list-style: none !important;
}

.pagination-item {
    margin-bottom: 0 !important;
}

.pagination-piece {
    width: 32px;
    height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    background-color: #fff;
    border-radius: 5px;
    color: rgba(29, 36, 51, 0.6) !important;
    font-size: 13px !important;
    user-select: none;
    padding: 2px;
    box-sizing: border-box;
}

.pagination-piece.pagination-piece_current {
    background-color: rgba(120, 120, 128, 0.12);
    color: #1D2433 !important;
}

.pagination-piece.pagination-piece_clickable {
    transition: all 0.2s ease;
}

.pagination-piece.pagination-piece_clickable:hover {
    background-color: #316BFF;
    color: #fff !important;
}

.pagination-piece.pagination-piece_prev,
.pagination-piece.pagination-piece_next {
    background-color: #446FDD;
    color: #fff !important;
    padding: 11px 8px;
    width: auto;
    min-width: 32px;
}

.pagination-piece.pagination-piece_disabled {
    background-color: rgba(120, 120, 128, 0.04);
    color: rgba(119, 124, 133, 0.5) !important;
}

.pagination-piece.pagination-piece_disabled svg path {
    stroke: rgba(119, 124, 133, 0.5);
}

.pagination-form {
    display: flex;
    align-items: center;
    gap: 8px;
}

.pagination-form__text {
    color: #BDBEC2;
    margin-bottom: 0 !important;
}

.pagination-form__input {
    font-size: 13px !important;
    padding: 8px 7px !important;
    border-radius: 5px;
    border: 1px solid #D4D7DD !important;
    background: #fff;
    color: rgba(0, 0, 0, 0.85);
    width: 48px !important;
    height: 32px !important;
}

.pagination-form__input:focus {
    border: 1px solid #1D2433 !important;
    box-shadow: 0 0 0 2px rgba(29, 36, 51, 0.20);
}

.pagination-form__input.pagination-form__input_error {
    border: 1px solid red !important;
}

.pagination-form__button {
    padding: 8px 12px;
    text-align: center;
    border: none;
    border-radius: 5px;
    background-color: rgba(29, 36, 51, 0.07);
    font-size: 13px !important;
    transition: all 0.2s ease;
    height: 32px;
}

.pagination-form__button:hover {
    background-color: #1D2433;
    color: #fff;
}

@media (max-width: 580px) {
    .pagination-item:not(.pagination-item_prev):not(.pagination-item_next) {
        display: none;
    }
}

@media (min-width: 581px) {
    .pagination {
        gap: 32px;
        margin: 32px 0;
    }

    .pagination-list {
        gap: 2px;
    }

    .pagination-item_prev {
        margin-right: 16px;
    }

    .pagination-item_next {
        margin-left: 16px;
    }

    .pagination-piece__label {
        display: none;
    }
}

@media (min-width: 768px) {
    .pagination {
        flex-direction: row;
    }
}
/* --------------- /pagination --------------- */

td.small, th.small {
    width: 1%;
}

table.small {
    width: auto !important;
}

.content table.no_indent {
    margin-bottom: 0;
}

#ui-datepicker-div {
    font-size: 12px;
}

.ui-datepicker .ui-datepicker-title select {
    height: 19px;
    line-height: 19px;
}

#search_block table {
    border-collapse: collapse;
    margin-bottom: 0;
    width: auto;
}

#search_block p {
    margin-bottom: 0;
}

#search_block table td {
    padding: 5px 20px;
    font-family: 'Rubik';
    font-size: 16px;
    line-height: 40px;
    letter-spacing: -0.015em;
    color: #393C5B;
}

#search_block .form_table td:first-child {
    width: 100%;
}

#search_block {
    position: absolute;
    display: none;
    left: 10px;
    max-height: 300px;
    overflow: auto;
    z-index: 9;
    width: 360px;
    background: #FFFFFF;
    border: 1px solid #cccccc;
    box-shadow: 0px 20px 30px rgba(0, 0, 0, 0.08);
    border-radius: 0 0 12px 12px;
    padding: 10px 0;
}
.not-table input[name="task_name"]:focus, .not-table input[name="task_name_de"]:focus{
    border: 1px solid #cccccc;
}
.not-table input[name="task_name"], .not-table input[name="task_name_de"]{
    font-family: 'Rubik';
    font-size: 16px;
    line-height: 40px;
    letter-spacing: -0.015em;
}
#search_block tr {
    position: relative;
    width: 100%;
    display: inline-block;
}
#search_block tr.focus{
    background: lightgrey;
}

#search_block tr a {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    font-size: 0px;
}

.inline_input {
    display: inline-block;
    vertical-align: top;
    width: 32%;
}

tr.disable, tr.disable a {
    color: #c2c2c2 !important;
}

/*.left_aside .aside_content {
position: fixed;
}*/
.left_aside.active .aside_content {
    width: 260px;
}

input:focus, select:focus, textarea:focus {
    border: 2px solid #000;
}

input[type='checkbox']:focus, input[type='radio']:focus {
    outline: 1px solid #08c;
}

.content, .taskField {
    position: relative;
}

.task-grid {
    display: flex;
    grid-gap: 3.5rem;
}

.task-grid > div {
    width: 100%;
    min-width: 0;
}

.task-info {
    margin: 15px 0;
}

.taskField .filtersFormItemWrap {
    flex-wrap: wrap;
}

.has_info {
    cursor: pointer;
    position: relative;
}

.has_info > a {
    text-decoration: underline;
    color: #08c;
}

.popup_info {
    display: none;
    text-decoration: none;
    color: #000;
    z-index: 1;
    word-wrap: break-word;
    position: absolute;
    top: 10px;
    right: 10px;
    width: 250px;
    padding: 15px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.6);
    background: #fff;
}

.site input[type="text"].phone {
    width: 140px;
}

td.row_left_enabled {
    cursor: pointer;
}

.site input[type='submit']:disabled, .site input[type='button']:disabled {
    opacity: 0.4;
}

.open_close {
    display: inline-block;
    vertical-align: top;
    width: 14px;
    height: 14px;
    line-height: 14px;
    border: solid 1px #08c;
    color: #08c;
    text-align: center;
    margin-right: 10px;
    cursor: pointer;
    padding: 0;
}

table td img {
    width: 12px;
}

.filtersForm .ms-parent {
    width: 250px !important;
}

.tooltip {
    position: relative;
}

.tooltip span {
    visibility: hidden;
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: 999;
    width: fit-content;
    margin-left: -127px;
    padding: 10px;
    border: 1px solid #ccc;
    background-color: #fff;
    -moz-border-radius: 4px;
    border-radius: 4px;
    text-align: center;
}

.tooltip:hover span {
    visibility: visible;
}

.tooltip p {
    margin-bottom: 0;
    background: #f7f7f7;
    border-radius: 50%;
    width: 42px;
    height: 42px;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}

.tooltip p img {
    position: absolute;
    width: calc(100% + 2px);
    height: calc(100% + 2px);
    top: -1px;
    left: -1px;
    object-fit: cover;
    border-radius: 50%;
    pointer-events: unset;
}

.base_table th.tooltip span {
    color: #000;
    border: 1px solid #ccc;
}

table td.number {
    width: 60px;
}

table td.date {
    width: 70px;
    text-align: center;
}

table td.task-list-item-status {
    padding-left: 0;
    padding-right: 25px;
}

table td.pay {
    width: 40px;
}

table td.project {
    width: 100px;
}

.content th.text-center,
.content td.text-center {
    text-align: center;
}

/*.options_add.open + .projects_with_report {*/
/*    margin-bottom: 100px;*/
/*}*/

/* MOBILE MENU */
.mobile-menu {
    display: none;
    width: 100%;
    background: #232323;
    line-height: 1.6em;
    font-weight: 400;
    width: 100%;
    text-align: center;
    position: relative;
    margin: 0 auto;
}

.mobile-menu .lines span {
    display: block;
    width: 34px;
    height: 2px;
    margin-bottom: 8px;
    position: relative;
    background: #446fdd;
    border-radius: 3px;
    z-index: 1;
    transform-origin: 4px 0px;
    transition: transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0), background 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0), opacity 0.55s ease;
}

.mobile-menu .lines span:last-of-type {
    margin-bottom: 0;
}

.mobile-menu ul {
    background: #fff;
    border: none;
    display: none;
}

.mobile-menu li {
    display: inline-block;
}

.mobile-menu li a {
    text-transform: uppercase;
}

.mobile-menu .show-menu {
    text-decoration: none;
    color: #446fdd;
    background: #fff;
    text-align: center;
    display: none;
    cursor: pointer;
    text-transform: uppercase;
}

.mobile-menu .show-menu.active .lines span:nth-child(1) {
    transform: rotate(45deg) translate(1px, -1px);
}

.mobile-menu .show-menu.active .lines span:nth-child(2) {
    opacity: 0;
    transform: rotate(0deg) scale(0.2, 0.2);
}

.mobile-menu .show-menu.active .lines span:nth-child(3) {
    transform: rotate(-45deg) translate(0, 0px);
}

.mobile-menu .sub_menu__layout.active .sub_menu {
    display: block;
    padding: 0;
}

.mobile-menu .show-menu .icon {
    width: 24px;
    height: 24px;
    background: url(../img/menu-of-three-lines.svg) no-repeat center/100%;
}

.mobile-menu .show-menu.active .icon {
    background: url(../img/close.svg) no-repeat center/90%;
    margin-right: 15px;
}

/*----------------------------------*/
.site__layout {
    margin-top: 80px;
}

.sub_menu.top_menu {
    height: 80px;
    /*border-bottom: 1px solid #deeaeb;*/
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
}

.sub_menu.top_menu::after {
    content: '';
    position: absolute;
    width: 100%;
    bottom: 0;
    left: 0;
    height: 1px;
    background: #deeaeb;
}

.top_menu.sub_menu li:hover > ul {
    top: 79px;
    border: 1px solid #deeaeb;
    z-index: 1;
}

.sub_menu.fix_menu {
    height: 50px;
}

.top_menu.sub_menu .dropdown + ul.fix_sub {
    top: 50px;
}

.sub_menu li {
    background-color: #fff;
    height: inherit;
}

.top_menu.sub_menu li a {
    display: flex;
    align-items: center;
    justify-content: center;
    color: #3e3e3e;
    width: 100%;
    height: 100%;
    font-size: 12px;
    font-weight: 600;
    box-sizing: border-box;
}

.sub_menu li span, .sub_menu li a.current {
    background: #fff;
}

.top_menu.sub_menu a {
    border-bottom: 1px solid transparent;
}

.top_menu.sub_menu li:hover > a,
.top_menu.sub_menu a.current,
.top_menu.sub_menu a:hover {
    color: #0056b3;
    background: #fff;
    -webkit-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

.top_menu.sub_menu a.dropdown:before {
    content: none;
    top: 43%;
    right: 10px;
    position: absolute;
    border: 5px solid transparent;
    border-right: 5px solid #000000;
}

.top_menu.sub_menu a.fix {
    font-size: 12px;
    padding: 15px 10px;
}

.sub_menu a.active.dropdown, .sub_menu a.active.dropdown:hover {
    background: #ffffff;
    color: #0056b3;
}

.top_menu.sub_menu ul a, .top_menu.sub_menu ul a:hover {
    padding: 15px 10px;
    font-size: 11px;
    display: flex;
    justify-content: flex-start;
    text-align: left;
}

.add-task-link {
    font-weight: bold;
}

.not-table {
    max-width: 45.9027778vw;
    margin: auto;
    margin-top: 140px;
}

@media (max-width: 1440px) {
    .not-table {
        max-width: 661px;
    }
}

.not-table input[type="text"] {
    padding: 25px 15px;
    height: 56px;
    border-radius: 8px;
}

.not-table .ck-rounded-corners .ck.ck-editor__main > .ck-editor__editable, .ck.ck-editor__main > .ck-editor__editable.ck-rounded-corners {
    border-radius: 0 0 8px 8px;
}

.not-table .ck.ck-editor__editable:not(.ck-editor__nested-editable).ck-focused {
    border: 2px solid #000;
}

.not-table .ms-search input[type="text"] {
    padding: 0 15px;
}

.not-table select,
.not-table .ms-choice {
    height: 56px;
    border-radius: 8px;
    padding: 10px 36px 10px 12px !important;
}

.not-table select > span,
.not-table .ms-choice > span {
    padding-left: 15px;
    padding-top: 14px;
}

.not-table .ms-choice > div {
    top: 23px;
    right: 16px;
}

.ck.ck-editor {
    width: 100%;
}

/*#form_tasks tr.odd input[type="checkbox"] {*/
/*    float: right;*/
/*    right: 60%;*/
/*    position: absolute;*/
/*}*/
html, body {
    /*scroll-behavior: smooth;*/
}

.not-table.edit-reg {
    margin-top: 65px;
    /*margin-top: 0;*/
}

.not-table .form_table {
    border: none;
    /*font-family: Circular, -apple-system, BlinkMacSystemFont, Roboto, Helvetica Neue, sans-serif;*/
    font-family: Rubik;
    /*margin-bottom: 25px;*/
}

.not-table .form_table > div {
    margin-top: 25px;
    margin-bottom: 25px;
}

.not-table .form_table .odd.for-check {
    display: flex;
    align-items: center;
}

.not-table .form_table .odd.for-check .col-title {
    margin-right: 20px;
    margin-bottom: 0;
}

.not-table .form_table .col-title {
    font-weight: 800;
    font-size: 12px;
    line-height: 19px;
    color: #15110e;
    margin-bottom: 15px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.not-table select,
.filters-row-2 select,
.project-stage select {
    -webkit-appearance: none;
    appearance: none;
}

.select-cover {
    position: relative;
    width: max-content;
    cursor: pointer;
}

.select-cover select {
    cursor: pointer;
}

.not-table .col-about .select-cover .arr,
.filters-row-2 .select-cover .arr,
.hours .select-cover .arr,
.about-task .arr {
    position: absolute;
    top: 23px;
    right: 16px;
    border: solid black;
    border-width: 0 2px 2px 0;
    display: inline-block;
    padding: 2.5px;
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
}

.about-task .arr {
    top: 16px;
    right: 10px;
}

.not-table .form_table .col-about {
    color: #333;
    font-weight: 400;
    font-size: 14px;
    position: relative;
}

.not-table .form_table .col-about a {
    font-weight: 400;
    font-size: 14px;
}

.not-table .options_add,
.not-table .options_add:hover,
.not-table .options_add.open {
    background: #fff;
    padding-left: 0;
    scroll-margin-top: 135px;
    margin-top: 80px;
}

.not-table .options_add:before {
    content: none;
}

.not-table.edit-reg .options_add {
    /*margin-top: 40px;*/
    margin-top: 0px;
}

.not-table select[name="project_type_id"],
.not-table select[name="project_stage_id"] {
    width: 281px;
}

.not-table .project-stage select[name="project_stage_id"] {
    border-radius: 8px;
    width: 150px;
}

.not-table .col-about img {
    width: fit-content;
    max-width: 800px;
}

.not-table .options_add {
    font-size: 14pt;
}

.not-table .form_table.info .ms-parent {
    width: 100% !important;
}

.site .not-table input[type="text"].count {
    width: 90px;
}

.edit.edit-btn {
    padding: 0;
}

.under-menu {
    position: fixed;
    max-width: 800px;
    margin: auto;
    top: 80px;
    left: 0;
    right: 0;
    z-index: 9;
    background-color: #fff;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
}

.under-menu.fix_under {
    top: 32px;
}

.under-menu.fix_under .tabs {
    margin-top: -15px;
    background-color: #fff;
}

.under-menu.edit-task {
    top: 90px;
}

.under-menu.edit-task.fix_under {
    top: 70px;
}

.under-menu.edit-task.fix_under .tabs {
    margin-top: -20px;
}

.under-menu.edit-task.fix_under .tabs .tablink {
    padding-top: 7px;
}

.under-menu .about-task {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 0 10px 0;
}

.col-title.task-name {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.col-title.task-name span {
    cursor: pointer;
}

.under-menu .about-task .task-name {
    width: 270px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    display: none;
}

.under-menu .about-task .about-task-left,
.under-menu .about-task .about-task-right {
    display: flex;
    align-items: center;
}

.under-menu .about-task .project-name,
.under-menu .about-task .status-title {
    font-weight: bold;
    margin: 0 15px;
    text-transform: uppercase;
    padding: 20px 0;
    background-color: #fff;
}

.under-menu .about-task .project-name {
    text-transform: none;
}

.under-menu .about-task .status-title {
    text-transform: lowercase;
}

.content .tabs {
    max-width: 800px;
    margin: auto;
    justify-content: space-between;
    display: flex;
}

.content .tablink {
    display: inline-flex;
    align-items: baseline;
    border: none;
    outline: none;
    cursor: pointer;
}

.content .tablink a {
    scroll-margin-top: 50px;
    color: #272727;
    font-size: 11px;
    /* font-weight: bold; */
    text-transform: uppercase;
    padding: 7px 10px 14px 10px;
    border-bottom: 2px solid transparent;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
}

.content .tablink .tablink-edit {
    opacity: 0;
    visibility: hidden;
    display: inline-block;
    height: 12px;
    width: 12px;
}

.content .tablink:hover .tablink-edit {
    opacity: 1;
    visibility: visible;
}

.content .tablink a:hover,
.content .tablink a.active {
    border-bottom: 2px solid #446fdd;
}

.tablink.active {
    border-bottom: 2px solid #446fdd;
}

.tabcontent {
    /*display: none;*/
    /*padding: 5px 15px 5px 15px;*/
    /*border: 1px solid #aaa;*/
    /*border-top: none;*/
}

.tabcontent:first-child {
    display: block;
}

.edit-btn {
    position: fixed;
    right: 20px;
    bottom: 20px;
}

.copyParams {
    padding: 5px 10px !important;
}

.edit-btn, .btn {
    font-weight: bold;
    height: auto;
    background: var(--blue);
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    color: #fff !important;
    border: 1px solid var(--blue);
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    border-radius: 40px;
    padding: 13px 25px;
    display: inline-block;
    cursor: pointer;
}

.edit-btn:disabled,
.btn:disabled {
    opacity: 0.75;
    cursor: not-allowed;
}

.btnSecondary {
    background: rgba(0, 0, 0, 0);
    color: var(--blue) !important;
}

.btnSecondary:hover {
    color: #fff !important;
    background: var(--blue);
}

.btn.btn-brand {
    background-color: var(--brand-primary);
    border: currentColor;
}

.btn.btn-brand:hover {
    background-color: var(--brand-primary-lighter);
}

.btn.btn-icon {
    width: 40px;
    height: 40px;
    padding: 0;
}

.btn.btn-icon:hover {
    opacity: 0.8;
}

/*.fixed_head {*/
/*    position: fixed;*/
/*    top: 50px;*/
/*    left: 0;*/
/*    right: 0;*/
/*    margin: auto;*/
/*    z-index: 9;*/
/*}*/
.base_table.tasks .project {
    position: relative;
}

.base_table.tasks .tooltip p {
    margin: 0 auto;
}

.base_table.tasks .project .tasks_icon {
    position: absolute;
    right: -10px;
    bottom: 25px;
    display: none;
}

.base_table.tasks .project:hover .tasks_icon {
    display: block;
}

.tasks_icon img {
    width: 20px;
}

.top_menu.sub_menu .icon_link.tasks_icon {
    opacity: 0;
    flex: 0;
    z-index: 9;
    background: transparent;
    padding: 0;
    border-bottom: none;
    height: auto;
    margin-left: -15px;
}

.top_menu.sub_menu li:hover > .icon_link.tasks_icon {
    opacity: 1;
}

.top_menu.sub_menu .icon_link.tasks_icon:hover {
    border-bottom: none;
}

#projects-list-menu ul li:hover .icon_link.tasks_icon {
    /*display: block;*/
}

.to-show {
    display: none;
    position: absolute;
    right: 15px;
    z-index: 99;
    top: 4%;
    cursor: pointer;
}

.content .wrap_sub {
    background: transparent;
}

.tasks_icon .add-task-top {
    width: 15px;
}

.form_table.search .ms-choice > div {
    top: 10px;
}

.base_table.tasks td {
    border-bottom: none;
    text-align: center;
}

.base_table.tasks td.text-left {
    text-align: left;
    vertical-align: top;
}

.base_table.tasks td.h-1px {
    height: 1px;
}

.base_table.tasks td.h-1px textarea {
    height: 100%;
}

.textarea-like {
    display: inline-block;
    padding: 7px; /* 6px padding + 1px border */
}

.options_add_tasks,
.search_filters {
    font-size: 9pt;
    padding-bottom: 5px;
    margin-bottom: 10px;
    background: #fff;
    height: 35px;
    padding-left: 14px;
    padding-top: 5px;
    line-height: 35px;
    color: var(--black);
    font-weight: bold;
}

.row-item {
    margin-right: 10px;
}

.filters-row,
.filters_create_date {
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

.filtersForm .filters-row .ms-parent {
    position: initial;
}

.filters-row .ms-choice {
    height: 56px;
    border-radius: 8px;
    padding: 26px 36px 10px 12px !important;
}

.filters-row .ms-choice:active,
.filters-row .ms-choice:focus,
.filters-row input[type="text"]:focus {
    border: 2px solid var(--blue);
}

.filters-row .filters_create_date input,
.filters-row .filters_search input,
.more-filter select {
    height: 56px;
    border-radius: 8px;
    padding: 0 10px !important;
}

.filters-row .filters_create_date input[name="task_create_date_from"] {
    margin-right: 5px;
}

.filters-row .ms-choice > span {
    top: 14px;
}

.filters-row .ms-choice > div {
    top: 23px;
    right: 16px;
}

.filters-row-2 {
    margin-top: 10px;
}

.filters_search {
    width: 250px;
}

.filters_search_btn {
    margin-left: 15px;
}

.site .filters_search_btn input[type='submit'] {
    background: url("../img/loupe_b.svg") no-repeat;
    background-size: 30px;
    background-position: center;
    width: 35px;
    height: 35px;
    padding: 0;
    color: rgba(0, 0, 0, 0);
}

.site .filters_search_btn svg {
    fill: #fff;
}

.filters-row-1 {
    display: flex;
    align-items: center;
}

.earnings {
    margin-right: 30px;
}

.earningsTitle {
    cursor: pointer;
}

.earningsText {
    display: none;
}

.titleChangeView {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-direction: row;
    max-width: 1175px;
    margin: auto auto 30px auto;
    width: 100%;
}

.show-more-filters {
    width: 24px;
    display: flex;
    flex-direction: column;
}

.show-more-filters img {
    width: 100%;
    cursor: pointer;
}

.more-filter {
    visibility: visible;
    pointer-events: auto;
    opacity: 1;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
}

.more-filter.hidden-filters {
    visibility: hidden;
    pointer-events: none;
    opacity: 0;
    height: 0;
}

.top_menu.sub_menu #tasks-list-menu,
.top_menu.sub_menu #projects-list-menu {
    flex-direction: row;
}

#projects-list-menu {
    position: static;
}

.sub_menu.top_menu > li > a.current,
.sub_menu.top_menu .dropdown-level-1.active {
    border-bottom: 1px solid #0056b3;
    z-index: 1;
}

.top_menu.sub_menu #projects-list-menu ul li .projects_top_link {
    /*width: auto;*/
    /*max-width: 130px;*/
    overflow: hidden;
    position: relative;
    display: inline-block;
    text-align: left;
    text-decoration: none;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 11px;
    color: #3e3e3e;
    font-weight: 600;
    padding: 8px 10px;
    border: 2px solid #DFDDDD;
    border-radius: 40px;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
}

.top_menu.sub_menu #projects-list-menu ul li .projects_top_link::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 30px;
    left: 0;
    top: 0;
    opacity: 0;
    background: transparent;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
}

.top_menu.sub_menu #projects-list-menu ul li:hover .projects_top_link {
    /*width: 170px;*/
    /*max-width: 170px;*/
}

.top_menu.sub_menu #projects-list-menu ul li:hover .projects_top_link::after {
    background: #fff;
    opacity: 0.5;
}

select[name="task_time_client_enabled"] {
    width: 210px;
}

.ck.ck-editor__editable_inline {
    min-height: 100px;
}

/*Responsive Styles*/

@media screen and (max-width: 992px) {
    .task-grid {
        display: grid;
    }

    body {
        /* overflow-x: hidden; */
    }

    .site {
        min-width: auto;
        overflow: hidden;
    }

    .sub_menu.top_menu {
        top: 0;
        left: 0;
        right: 0;
        max-width: 1350px;
        margin: 0 auto;
    }

    .sub_menu.top_menu {
        display: none;
    }

    .mobile-menu {
        display: block;
    }

    .nav-toogle {
        display: block;
    }

    .base_table {
        display: block;
        overflow-x: scroll;
    }

    .ms-parent {
        /*width: 223px !important;*/
        width: 100% !important;
    }

    .site select,
    .ck.ck-editor {
        /*width: 223px;*/
        /*max-width: 223px;*/
        /*width: 100%;*/
    }

    .not-table select[name="project_type_id"], .not-table select[name="project_stage_id"] {
        width: 100%;
    }

    th, td {
        background: #fff;
    }

    .options_add.open + table:not(.stat) {
        display: block;
        overflow: auto;
        max-width: 100%;
    }

    .base_table.tasks input[type="text"] {
        width: 200px;
    }

    .mobile-menu .lines {
        display: flex;
        flex-direction: column;
        align-items: flex-end;
    }

    .sub_menu__layout {
        position: fixed;
        overflow-y: auto;
        max-height: 100%;
        top: 80px;
        left: 0;
        right: 0;
        margin: auto;
        z-index: 999;
    }

    .sub_menu__layout.active {
        height: calc(100% - 80px);
        background: #fff;
    }

    .mobile-menu ul li, .mobile-menu li a {
        width: 100%;
    }

    .mobile-menu .show-menu {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 20px;
        height: 80px;
        position: fixed;
        top: 0;
        right: 0;
        left: 0;
        margin: auto;
        z-index: 999;
        border-bottom: 1px solid #DEEAEB;
        box-sizing: border-box;
    }

    .mobile-menu .show-menu .logo {
        display: flex;
    }

    .filtersForm {
        position: relative;
    }

    .filtersForm .filters-row {
        /*flex-wrap: initial;*/
    }

    .filters-row {
        flex-wrap: wrap;
    }

    .content .wrap_sub td {
        background: transparent;
    }

    .content .tablink a {
        padding: 20px 10px 14px 10px;
    }

    .row-item {
        margin-bottom: 10px;
    }
}

@media screen and (max-width: 768px) {
    .not-table .form_table tr {
        margin-bottom: 40px;
        display: block;
    }

    .under-menu.edit-task {
        top: 70px;
    }

    .not-table.edit-reg {
        margin-top: 50px;
    }

    .content .tabs {
        overflow-x: auto;
        white-space: nowrap;
        max-width: 100%;
        width: 800px;
        padding: 0 20px;
        box-sizing: border-box;
    }

    .under-menu {
        top: 45px;
        left: 0;
        right: 0;
    }

    .content .tabs {
        border-bottom: none;
    }

    .not-table .col-about img {
        width: fit-content;
        max-width: 350px;
    }

    .filters-row .ms-parent {
        width: 100% !important;
        margin-bottom: 10px;
    }

    .filters-row .filters_create_date {
        width: 100%;
        margin-bottom: 10px;
    }

    .site .filters-row .filters_create_date input {
        width: 50%
    }

    .filters-row .filters_search input {
        width: 230px;
    }

    .row-item {
        margin-left: 0;
        margin-bottom: 0;
    }

    .show-more-filters.show-more-filters--cut {
        margin-right: 10px;
        margin-left: 35px;
        right: 0;
    }

    .more-filter {
        /*justify-content: center;*/
        /*margin: auto;*/
        width: 100%;
    }

    .more-filter select {
        margin-bottom: 10px;
    }

    .not-table .col-about .select-cover, .filters-row-2 .select-cover,
    .filters-row-2 .select-cover select,
    .form_table.hours .select-cover {
        width: 100%;
    }
}

.options_add_not_open {
    font-size: 9pt;
    padding-bottom: 5px;
    margin-bottom: 10px;
    background: #fff;
    height: 35px;
    padding-left: 14px;
    padding-top: 5px;
    line-height: 35px;
    color: var(--black);
    position: relative;
    font-weight: bold;
    z-index: 1;
}

.ttime {
    width: 5%;
    padding: 0 !important;
}

.ttime .sub,
.ttime .subBtn,
.ttime .add,
.ttime .addBtn {
    visibility: hidden;
    /* border: 1px solid #f0f0f0; */
    border: none;
    text-align: center;
    width: min-content;
    margin: 0;
    padding: 0;
    background: transparent;
}

.ttime:hover .sub,
.ttime:hover .subBtn,
.ttime:hover .add,
.ttime:hover .addBtn {
    visibility: visible;
}

.base_table.tasks input[type="text"].small {
    width: 54px;
    text-align: center;
}

.base_table.tasks .time-controls {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
}

@media (min-width: 1400px) {
    .base_table.tasks .time-controls {
        flex-direction: row;
    }
}

.not-table .sub,
.not-table .subBtn,
.not-table .add,
.not-table .addBtn {
    font-size: 15px;
    font-weight: bold;
    border: none;
    text-align: center;
    width: min-content;
    margin: 0 5px;
    padding: 0;
    background: transparent;
}

.sub_menu__layout .mobile-menu-tabs {
    display: none;
}

.sub_menu__layout.active .mobile-menu-tabs {
    display: flex;
    justify-content: space-evenly;
    margin: 20px auto;
}

.sub_menu__layout.active .mobile-menu-tabs .tab {
    cursor: pointer;
}

.sub_menu__layout.active .mobile-menu-tabs .tab.active {
    font-weight: bold;
}

.sub_menu__layout .tab_content .tab_item {
    display: none;
}

.sub_menu__layout.active .tab_content .tab_item:first-child {
    display: block;
}

.sub_menu__layout.active #projects-list-menu-mob ul {
    display: flex;
    flex-direction: column;
    width: 100%;
    margin-bottom: 50px;
}

.sub_menu__layout.active #projects-list-menu-mob {
    max-width: 300px;
    margin: 25px auto;
}

.sub_menu__layout.active #projects-list-menu-mob ul li {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin-bottom: 10px;
}

.sub_menu__layout.active #projects-list-menu-mob ul li a {
    text-align: left;
    font-size: 11px;
    color: #3e3e3e;
    font-weight: bold;
    text-transform: lowercase;
}

.sub_menu__layout.active #projects-list-menu-mob ul li a.projects_top_link {
    border: 2px solid #DFDDDD;
    border-radius: 40px;
    padding: 2px 10px;
}

.sub_menu__layout.active #projects-list-menu-mob .icon_link {
    width: 20px;
    margin-left: 0;
}

.options_add a img {
    margin-top: 6px;
    margin-left: 20px;
    width: 20px;
}

.not-table.without-edit .tox-checklist li {
    position: relative;
    list-style: none;
    padding-left: 20px;
}

.not-table.without-edit .tox-checklist li:before {
    content: "➖";
    position: absolute;
    width: 10px;
    height: 10px;
    left: 0;
    top: 0;
}

.not-table.without-edit .tox-checklist li.tox-checklist--checked:before {
    content: "✅";
    position: absolute;
    width: 10px;
    height: 10px;
    left: 0;
    top: 0;
}

.about-task-right select {
    height: 40px;
    padding: 5px 23px 5px 10px !important;
}

.about-task-right .task-timer-wrap {
    margin: 0 20px 0 5px;
}

.task-list-timer, .task-timer-wrap {
    display: inline-flex;
    align-items: center;
    position: relative;
}

.task-list-timer .work_data, .task-timer-wrap .work_data {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    opacity: 0;
    transition: all .3s ease-in-out;
    z-index: 5;
    background: #ffffff;
    font-size: 15px;
    line-height: 150.7%;
    padding: 7px;
    pointer-events: none;
    text-align: center;
    margin: 0;
}

.task-list-timer-btn {
    vertical-align: top !important;
}

.task-list-timer .work_data[work_process_enabled="1"],
.task-timer-wrap .work_data[work_process_enabled="1"] {
    opacity: 1;
}

.task-list2-timer-wrap {
    position: relative;
}

.task-list2-timer-wrap .work_data {
    margin-left: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    opacity: 0;
    transition: all .3s ease-in-out;
    z-index: 5;
    background: #ffffff;
    font-size: 15px;
    line-height: 150.7%;
    padding: 7px;
    pointer-events: none;
}

.task-list2-timer-wrap {
    margin-left: 0.5rem;
}

.task-list2-timer-wrap .work_data[work_process_enabled="1"] {
    opacity: 1;
}

.about-task-right .hours-cover, .hours-cover {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #FFFFFF;
    border: 1px solid #CCCCCC;
    border-radius: 8px;
    width: 95px;
    height: 40px;
    position: relative;
    z-index: 2;
    font-size: 15px;
    line-height: 150.7%;
}

#form_tasks_list_update *[disabled] {
    background: transparent;
}

#form_tasks_list_update .hours-cover {
    margin: 0 auto;
}

.work_data {
    margin: 0 1rem;
}

.hours-cover.disabled * {
    pointer-events: none;
}

.hours-cover.disabled button {
    opacity: 0;
}

.about-task-right .worker {
    margin-right: 20px;
}

.about-task-right p {
    margin: 0;
}

.about-task-right .work_data {
    margin: 0;
}

.about-task-right .worker {
    margin-left: 20px;
}

.about-task-right .hours-cover input[type="text"].count, .hours-cover input[type="text"].count {
    height: auto;
    padding: 0;
    border: 0 !important;
    width: 40px;
    text-align: center;
    font-weight: 400;
    font-size: 15px;
    line-height: 150.7%;
}

.about-task-right .hours-cover button, .hours-cover button {
    font-size: 1rem;
    color: #cccccc;
    transition: all .3s ease-in-out;
    font-weight: normal;
    border: 0;
    background: #ffffff;
}

.about-task-right .hours-cover button:hover, .hours-cover button:hover {
    color: #000;
}

@media screen and (max-width: 768px) {
    .ttime .sub,
    .ttime .subBtn,
    .ttime .add,
    .ttime .addBtn {
        visibility: visible;
    }

    .under-menu .about-task {
        flex-wrap: wrap;
        padding-left: 10px;
        margin-top: -30px;
    }

    .under-menu .about-task .about-task-left, .under-menu .about-task .about-task-right {
        width: 100%;
    }
}

/* New Tasks List View */
.tasks-list-title {
    display: flex;
    align-items: center;
}

.tasks-list-title h1 {
    font-weight: 400;
    font-size: 36px;
    color: #000;
    margin-bottom: 0;
}

.tasks-list-title-results {
    margin: 6px 0 0 1rem;
}

.new_task {
    display: inline-block;
    background: #446fdd;
    width: 33px;
    height: 33px;
    border-radius: 50%;
    text-align: center;
    position: relative;
    top: 0px;
    left: 20px;
}

.new_task img {
    display: inline-block;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    /*width: 15px;*/
}

.tasks-list {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-gap: 40px;
    max-width: 1200px;
    margin: 0 auto;
}

.tasks-list .task-block {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 15px;
    background: #fff;
    border: 1px solid rgb(167 167 167);
    border-radius: 10px;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
}

.task-block .task-block-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.task-block .task-block-bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.task-block .task-block-bottom .task-block-date {
    margin-right: auto;
    margin-left: 10px;
}

.task-block .task-block-top {
    margin-bottom: 25px;
}

.task-block .task-block-top .priority {
    width: 10px;
    height: 10px;
    display: block;
    border-radius: 50%;
    margin-right: 5px;
    position: absolute;
}

.task-block .task-block-top .task-block-name {
    display: inline-flex;
    align-items: center;
    width: auto;
    /*max-width: 140px;*/
    /*overflow: hidden;*/
    /*text-overflow: ellipsis;*/
    white-space: nowrap;
    position: relative;
    font-weight: bold;
    font-size: 12px;
    color: #15110E;
    padding: 5px 0;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    max-width: 60%;
    white-space: nowrap;
}

.task-block .task-block-top .task-block-link {
    margin-left: 5px;
    max-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.task-block .task-block-top .task-block-link::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 30px;
    left: 0;
    top: 0;
    opacity: 0;
    background: transparent;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
}

.task-block-logo {
    border-radius: 50%;
    width: 17px;
    height: 17px;
}

.tasks .project .task-logos {
    display: flex;
    align-items: baseline;
}

.tasks .project .task-logos .task-client-logo {
    margin-left: 8px;
}

.under-menu .about-task .task-logos {
    display: flex;
    align-items: baseline;
}

.under-menu .about-task .task-logo {
    width: 44px;
    border-radius: 50%;
}

.about-task .task-logos .task-project-logo {
    margin-left: 8px;
}

.task-block .task-block-title {
    margin-top: 20px;
    margin-bottom: 35px;
    max-width: 200px;
    text-overflow: ellipsis;
    overflow: hidden;
}

.task-block-name {
    position: relative;
}

.task-block-name .project-link-overlay a {
    margin: 0 3px;
    z-index: 9;
}

.task-block-name .tasks_icon .add-task-top {
    margin: 0;
}

.task-block .worker {
    display: flex;
    align-items: center;
}

.task-block .worker .tooltip span {
    left: calc(100% + 10px);
    padding: 5px;
    right: auto;
    margin-left: 0;
    white-space: nowrap;
    margin-bottom: -3px;
}

.task-block .worker-img, .tasks .worker-img {
    border: 1px solid #ffffff;
    z-index: 2;
    width: 35px;
    height: 35px;
}

.task-block .worker-img, .task-block .worker-manager,
.tasks .worker-img, .tasks .worker-manager {
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.task-block .worker-manager, .tasks .worker-manager {
    margin-left: -17px;
    width: 34px;
    height: 34px;
}

.task-block .worker-img img, .task-block .worker-manager img,
.tasks .worker-img img, .tasks .worker-manager img {
    position: absolute;
    top: 0;
    left: 0;
    object-fit: cover;
    width: 100%;
    height: 100%;
    border-radius: 50%;
}

.worker-group .worker-manager {
    left: 30px;
    z-index: -1;
}

.worker-group .worker-img {
    border: 1px solid #ffffff;
}

.task-block-time {
    text-align: right;
    margin-left: 5px;
    background: #FFFFFF;
    border: 1px solid #CCCCCC;
    border-radius: 8px;
    width: 85px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 400;
    font-size: 15px;
    line-height: 150.7%;
    text-align: center;
    color: #000000;
}

.task-block-bottom a.task-timer, .task-block-bottom span.task-timer {
    position: relative;
    z-index: 2;
    opacity: 0;
    transition: all .3s ease-in-out;
    margin-left: auto;
}

.tasks-list .task-block:hover .task-block-bottom a.task-timer, .task-block-bottom a.task-timer.active,
.tasks-list .task-block:hover .task-block-bottom span.task-timer, .task-block-bottom span.task-timer.active {
    opacity: 1;
}

a.task-timer, span.task-timer {
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: 40px;
    height: 40px;
}

a.task-timer img, span.task-timer img {
    width: 100%;
    height: auto;
}

.task-block .worker.tooltip span, .worker.tooltip span {
    right: auto;
    left: calc(100% + 10px);
    white-space: nowrap;
    margin: 0;
}

.task-block .task-block-status select {
    cursor: pointer;
    border: 1px solid transparent;
    background: transparent;
    text-align-last: right;
    /*appearance: none;*/
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
}

.task-block .task-block-bottom .task-block-time input {
    width: 50px;
    text-align: center;
    background: transparent;
    border: 1px solid transparent;
    font-weight: 400;
    font-size: 15px;
    line-height: 150.7%;
    text-align: center;
    color: #000000;
}

.task-block .task-block-bottom .task-block-time button {
    background: transparent;
    border: none;
    font-weight: bold;
    margin: 0;
    padding: 0;
    font-weight: normal;
    color: #CCCCCC;
    transition: all .3s ease-in-out;
    font-size: 1rem;
}

.task-block .task-block-bottom .task-block-time button:hover {
    color: #000;
}

.task-link-cover {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}

.task-block .task-block-top .task-block-name,
.task-block .task-block-top .task-block-status,
.task-block .worker,
.task-block-time {
    z-index: 2;
}

.tasks-list-submit {
    position: fixed;
    right: 20px;
    bottom: 20px;
    z-index: 100;
}

.change-view {
    display: flex;
    justify-content: flex-end;
}

.change-view div:first-of-type {
    margin-right: 17px;
}

.project-link-overlay {
    visibility: hidden;
    /*pointer-events: none;*/
    opacity: 0;
    transition: all .25s ease-in-out;
    position: absolute;
    /*height: 30px;*/
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    width: max-content;
    margin: auto;
    left: 100%;
    top: 0;
    padding-left: 8px;
}

.task-block .task-block-name .project-link-overlay {
    height: 25px;
}

#projects-list-menu ul li:hover .project-link-overlay,
.task-block-name:hover .project-link-overlay {
    visibility: visible;
    pointer-events: auto;
    opacity: 1;
}

#projects-list-menu ul li .project-link-overlay::after,
.task-block-name .project-link-overlay::after {
    content: "";
    position: absolute;
    width: 95%;
    height: 26px;
    left: 3px;
    top: 3px;
    opacity: 0;
    border-radius: 40px;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
}

#projects-list-menu ul li:hover .project-link-overlay::after,
.task-block-name:hover .project-link-overlay::after {
    /*background: var(--project-color);*/
    background: #fff;
    opacity: 0.8;
}

#projects-list-menu .project-link-overlay .icon_link.tasks_icon,
.task-block-name .project-link-overlay .icon_link.tasks_icon {
    position: relative;
    right: 0;
    bottom: 0;
    margin: 0 3px;
}

#projects-list-menu ul li:hover .project-link-overlay .icon_link.tasks_icon,
.task-block-name:hover .project-link-overlay .icon_link.tasks_icon {
    display: flex;
}

#projects-list-menu ul li:hover .project-link-overlay .icon_link.tasks_icon img,
.task-block-name:hover .project-link-overlay .icon_link.tasks_icon img {
    margin: 0;
}

@media screen and (max-width: 768px) {
    .about-task-right .worker {
        margin: 0 10px;
    }

    .about-task-right .hours-cover, .hours-cover {
        margin-right: 10px;
    }

    .task-block-bottom a.task-timer, .task-block-bottom span.task-timer {
        opacity: 1;
    }

    #projects-list-menu-mob ul li {
        position: relative;
    }

    #projects-list-menu-mob .tasks_icon .add-task-top {
        margin: 0;
    }

    .sub_menu__layout.active #projects-list-menu-mob .icon_link {
        margin: 0 5px;
    }

    .project-link-overlay {
        display: flex;
        justify-content: flex-end;
        visibility: visible;
        pointer-events: auto;
        background: #ffffffc4;
    }

    #projects-list-menu-mob .project-link-overlay {
        top: 4px;
        background: transparent;
    }

    .task-block .task-block-top .task-block-name {
        width: 165px;
        max-width: initial;
    }
}

@media screen and (max-width: 580px) {
    .tasks-list {
        grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
    }

    .filtersResultsItem {
        display: flex;
        margin-top: 0;
        margin-bottom: 10px;
    }
}

.ihfos {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    padding-right: 15px;
}

.ihfos .filtersResults {
    margin-right: auto;
}

@media (max-width: 580px) {
    .ihfos.ihfos-tasks {
        display: grid;
        grid-template-columns: calc(100% - 80px) auto;
        justify-content: space-between;
        align-items: flex-start;
    }

    .ihfos .filtersResults {
        display: grid;
        grid-gap: 10px;
    }

    .ihfos a.filtersResultsClear {
        text-align: left;
    }
}

.worker-cover a, .worker-cover .tooltip {
    padding: 5px;
    margin: 2px;
    background: #f7f7f7;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    display: inline-flex;
    vertical-align: top;
    justify-content: center;
    align-items: center;
    position: relative;
}

.worker-cover a img, .worker-cover .tooltip img {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    object-fit: cover;
    pointer-events: unset;
    border-radius: 50%;
}

.worker-cover p {
    margin-bottom: 10px;
}

.projects-list-task {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

.projects-list-task a {
    display: inline-block;
    position: relative;
    border-radius: 50%;
    width: 28px;
    height: 28px;
    margin-right: 2px;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
}

.projects-list-task a span {
    margin: 0;
    left: 0;
    font-weight: bold;
    top: calc(100% + 4px);
    background: rgba(255, 255, 255, 0.8);
    border: 0.5px solid #DEEAEB;
    box-sizing: border-box;
    border-radius: 200px;
    white-space: nowrap;
    padding: 4px 7px;
    font-weight: 400;
    font-size: 10px;
    line-height: 150.7%;
    color: #373842;
    text-align: center;
    display: inline-block;
    height: 23px;
}

.projects-list-task a img {
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover;
    top: 0;
    left: 0;
}

.projects-list-task a:last-of-type {
    margin-right: 0;
}

.projects-list-task a:hover {
    max-width: 100%;
}

.top_menu .logo svg {
    transition: all 0.3s ease;
}

.top_menu.fix_menu svg {
    width: 28px;
}

/* Avatar */

.avatar-upload {
    position: relative;
    max-width: 150px;
    margin: 50px;
}

.avatar-upload .avatar-edit {
    position: absolute;
    right: 0;
    z-index: 1;
    top: 10px;
}

.avatar-upload .avatar-edit input {
    display: none;
}

.avatar-upload .avatar-edit input + label {
    display: inline-block;
    width: 34px;
    height: 34px;
    margin-bottom: 0;
    border-radius: 100%;
    border: 1px solid #d6d6d6;
    cursor: pointer;
    font-weight: normal;
    transition: all 0.2s ease-in-out;
    background: url(/images/pencil.svg) no-repeat;
    background-size: 15px;
    background-position: center;
    background-color: #FFFFFF;
}

.avatar-upload .avatar-edit input + label:hover {
    background-color: #f1f1f1;
}

/*.avatar-upload .avatar-edit input + label:after {*/
/*    content: "";*/
/*    color: #757575;*/
/*    position: absolute;*/
/*    background: url(https://app.agenturro.co/images/pencil.svg) no-repeat;*/
/*    background-size: 15px;*/
/*    top: 10px;*/
/*    left: 0;*/
/*    right: 0;*/
/*    text-align: center;*/
/*    margin: auto;*/
/*}*/
.avatar-upload .avatar-preview {
    width: 150px;
    height: 150px;
    position: relative;
    border-radius: 100%;
    border: 6px solid #F8F8F8;
}

.avatar-upload .avatar-preview > div {
    width: 100%;
    height: 100%;
    border-radius: 100%;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

/* View without edit */
.not-table.without-edit .col-about.task-name {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 36px;
    line-height: 36px;
    font-weight: bold;
    padding-top: 20px;
    word-break: break-word;
}

.not-table.without-edit .col-about.task-name-de {
    font-size: 36px;
    line-height: 36px;
    font-weight: bold;
    padding-top: 20px;
    word-break: break-word;
}

.not-table.without-edit .col-about.task-name span {
    display: flex;
    align-items: center;
    /*padding: 3px;*/
    /*border: 1px solid #446fdd;*/
    cursor: pointer;
    font-size: 18px;
}

.not-table.without-edit .col-about.task-name span svg {
    margin-left: 3px;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
}

.not-table.without-edit .col-about.task-name span.active svg {
    transform: rotate(180deg);
}

.hidd {
    /*position: absolute;*/
    visibility: hidden;
    opacity: 0;
    display: block;
    height: 0;
    pointer-events: none;
}

.hidd div,
.hidd table {
    display: none !important;
}

.filters {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    width: 100%;
    max-width: 1175px;
    margin: 0 auto;
}

.filtersResults {
    margin-right: auto;
}

.filtersResultsItem {
    margin-right: 20px;
    display: inline-flex;
    align-items: center;
    cursor: pointer;
    margin-top: 5px;
    margin-bottom: 5px;
    vertical-align: top;
}

@media screen and (max-width: 580px) {
    .filtersResultsItem {
        display: flex;
        margin-top: 0;
        margin-bottom: 10px;
    }
}

.filtersResultsItem svg {
    margin-left: 5px;
    margin-bottom: -2px;
}

.filtersResultsItem img, .filtersResultsItemColor {
    width: 15px;
    height: 15px;
    border-radius: 50%;
    margin-right: 5px;
}

a.filtersResultsClear {
    margin-left: 17px;
    transition: all .25s ease-in-out;
    font-weight: 600;
    font-size: 12px;
    line-height: 14px;
    text-align: right;
    text-decoration-line: underline;
    color: #373842;
    white-space: nowrap;
}

@media screen and (max-width: 580px) {
    a.filtersResultsClear {
        margin-left: 0;
    }
}

a.filtersResultsClear:hover {
    color: #446FDD;
}

.filtersResultsItem:last-of-type {
    margin-right: 0;
}

.filters .filtersItem {
    width: 24px;
    display: flex;
    flex-direction: column;
    cursor: pointer;
    margin-left: 27px;
}

.filters .filtersItem svg {
    width: 100%;
    height: auto;
}

.filters .filtersItem.active .close {
    display: initial;
}

.filters .filtersItem .close, .filters .filtersItem.active .open {
    display: none;
}

.filtersForm {
    margin: 20px 0 30px 0;
    width: 100%;
    max-width: 1340px;
    margin-left: auto;
    margin-right: auto;
}
@media (min-width: 1025px) {
    .filtersForm {
        width: 85%;
    }
}
.pageTasksList .filtersForm {
    max-width: 1340px;
}

.filtersFormSwitch {
    display: inline-flex;
    align-items: center;
    cursor: pointer;
    position: relative;
    font-weight: 500;
    padding-left: 34px;
    min-height: 15px;
    margin: 11px 25px 11px 0;
    white-space: nowrap;
}

.filtersFormSwitch::before, .filtersFormSwitch::after {
    transition: all .25s ease-in-out;
}

.filtersFormSwitch.checked::before {
    border-color: #446FDD;
}

.filtersFormSwitch.checked::after {
    background: #446FDD;
    left: 2px;
}

.filtersFormSwitch::before {
    content: '';
    width: 25px;
    height: 13px;
    border: 1px solid #DEEAEB;
    border-radius: 10px;
    position: absolute;
    left: 0;
    top: 0;
}

.filtersFormSwitch::after {
    content: '';
    background: #DEEAEB;
    width: 11px;
    height: 11px;
    border-radius: 50%;
    position: absolute;
    left: 14px;
    top: 2px;
}

.filtersFormSwitch input {
    display: none;
}

.filters-row .ms-parent {
    width: 130px !important;
}

.filtersForm .filters-row .ms-parent {
    width: auto !important;
}

.filtersForm .filters-row {
    min-height: 42px;
    flex-wrap: wrap;
    grid-gap: 10px 0;
}

.filtersFormMore {
    font-weight: 600;
    text-decoration-line: underline;
    color: #446FDD;
    cursor: pointer;
    margin-right: 20px;
    display: inline-flex;
}

.filtersFormMore img {
    display: none;
    width: 24px;
    height: auto;
}

.filtersFormMore.active {
    font-size: 0px;
}

.filtersFormMore.active img {
    display: initial;
}

input[type=submit].filtersFormBtn {
    font-weight: 600;
    font-size: 15px;
    line-height: 150.7%;
    text-align: center;
    color: #4772DA;
    padding: 8px 26px;
    background: #ffffff;
    border: 1.5px solid #4772DA;
    box-sizing: border-box;
    border-radius: 200px;
    display: none;
    margin-bottom: auto;
}

input[type=submit].filtersFormBtn:hover {
    background: #4772DA;
    color: #ffffff;
    opacity: 1;
}

.filtersFormItem {
    margin-right: 20px;
    display: flex;
    position: relative;
    white-space: nowrap;
    margin-top: 11px;
    margin-bottom: 11px;
}

@media (max-width: 1400px) {
    .filtersFormItem, .filtersFormDate, .filtersFormSwitch, .filtersFormMore {
        margin-right: 15px;
    }

    .pageProjectsList .filtersFormItem, .pageProjectsList .filtersFormDate, .pageProjectsList .filtersFormSwitch, .pageProjectsList .filtersFormMore, .pageProjectsList .filtersForm .inputCheckboxProjectStageActive {
        /*margin-right: 10px;*/
    }
}

.filtersFormItemTitle {
    display: none;
    padding: 5px 0;
    border-bottom: 2px solid rgba(0, 0, 0, 0);
    transition: all .25s ease-in-out;
}

.filtersFormItemTitle.active {
    border-color: #446FDD;
    font-weight: 700;
}

.filtersFormItemWrap {
    display: flex;
    align-items: center;
}

.filtersFormItem label, .filtersFormItem label.tooltip span.filtersFormItemCircle {
    position: relative;
    width: 28px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    cursor: pointer;
    margin-right: 6px;
}

.filtersFormItem label.tooltip span.filtersFormItemCircle {
    margin-right: 0;
    visibility: visible;
    position: initial;
    margin-left: 0;
    border: 0px;
    padding: 0;
    display: inline-block !important;
}

.filtersFormItem label:last-of-type {
    margin-right: 0;
}

.filtersFormItem label.tooltip span:not(.filtersFormItemCircle) {
    margin: 0;
    left: 0;
    top: calc(100% + 4px);
    background: rgba(255, 255, 255, 0.8);
    border: 0.5px solid #DEEAEB;
    box-sizing: border-box;
    border-radius: 200px;
    white-space: nowrap;
    padding: 4px 7px;
    font-weight: 400;
    font-size: 10px;
    line-height: 150.7%;
    color: #373842;
    text-align: center;
    display: inline-block;
    height: 23px;
}

.filtersFormItem label.checked::after, .filtersFormItem label.checked2::after {
    content: '';
    height: 2px;
    width: 12px;
    background: #446FDD;
    position: absolute;
    bottom: -7px;
    left: 50%;
    margin-left: -6px;
}

.filtersFormItem label input {
    display: none;
}

.filtersFormItem label img {
    position: absolute;
    border-radius: 50%;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.filtersFormItem .ms-drop label img, span.filtersFormItemSelectColor {
    position: initial;
    width: 17px;
    height: 17px;
    margin-right: 5px;
    border-radius: 50%;
}

.filtersFormItem label .filtersFormItemEmoji {
    position: absolute;
    border-radius: 50%;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 0.5px solid #DEEAEB;
    box-sizing: border-box;
}

.filtersFormItemEmoji div {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    bottom: 0;
    border-radius: 50%;
    background-size: cover;
    background-position: center;
}

.filtersFormItem label.filtersFormItemMore {
    font-family: Verdana;
    font-weight: 700;
    font-size: 9px;
    line-height: 11px;
    text-align: center;
    letter-spacing: -0.095em;
    color: #8688A1;
    border: 0.5px solid #DEEAEB;
    box-sizing: border-box;
}

.filtersFormItem .ms-choice {
    display: none !important;
}

.filtersFormItem.showAll .filtersFormItemSelect {
    display: block;
}

.filtersFormItemSelect {
    position: absolute;
    top: calc(100% + 14px);
    left: 0;
    display: none;
    background: #FFFFFF;
    border: 1px solid #E8E8E8;
    box-sizing: border-box;
    box-shadow: 0px 11px 54px rgba(234, 229, 229, 0.25);
    border-radius: 12px;
    padding: 15px;
    z-index: 100;
}

.filtersFormItemSelectFilter {
    display: flex;
    align-items: center;
    border-top: 1px solid #E8E8E8;
    padding-top: 10px;
    margin-top: 15px;
}

.filtersFormItemSelectFilterItem {
    cursor: pointer;
    margin-right: 10px !important;
    font-weight: 400;
    letter-spacing: -0.03em;
    background-color: #fff;
    border-color: transparent;
    color: #C4C4C4 !important;
    padding: 0;
    transition: all .25s ease-in-out;
}

.filtersFormItemSelectFilterItem.active {
    color: #373842 !important;
}

.filtersFormItemSelectFilterItem:last-of-type,
.filtersFormItemSelectFilterItemIcon:last-of-type {
    margin-right: 0 !important;
}

.filtersFormItemSelectFilterItemIcon {
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    border: 1px solid #DEEAEB;
    margin-right: 2px !important;
}

.filtersFormItemSelectFilterItemIcon.active, .filtersFormItemSelectFilterItemIcon:hover {
    border-color: #446FDD;
}

.filtersFormItemSelect .ms-drop.bottom {
    display: block !important;
    width: auto;
    padding: 0;
    position: initial;
    border: 0px;
    box-shadow: none;
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none; /* Internet Explorer 10+ */
}

/*.filtersFormItemSelect .ms-parent.active{*/
/*    display: initial!important;*/
/*}*/
/*.filtersFormItemSelect .ms-parent{*/
/*    display: none!important;*/
/*}*/
.filtersFormItemSelect .ms-drop ul {
    overflow-y: scroll;
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none; /* Internet Explorer 10+ */
    margin-bottom: -10px;
}

.filtersForm .filters-row, .filtersResults {
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none; /* Internet Explorer 10+ */
}

.filtersFormItemSelect .ms-drop.bottom::-webkit-scrollbar, .filtersFormItemSelect .ms-drop ul::-webkit-scrollbar, .filtersForm .filters-row::-webkit-scrollbar, .filtersResults::-webkit-scrollbar { /* WebKit */
    width: 0;
    height: 0;
}

.filtersFormItemSelect .ms-parent {
    width: auto !important;
}

.filtersFormItemSelect .ms-drop.bottom .ms-search {
    padding: 0;
    min-height: auto;
    margin-bottom: 15px;
}

.filtersFormItemSelect .ms-drop.bottom .ms-search input {
    border: 0px;
    padding: 0 0 0 32px;
    background-image: url('../img/search_blue.svg');
    background-position: left center;
    font-weight: 400;
    font-size: 12px;
    line-height: 14px;
    letter-spacing: -0.03em;
    color: #373842;
}

.filtersFormItemSelect .ms-drop.bottom .ms-search input::placeholder {
    color: #373842;
}

.filtersFormItemSelect .ms-drop ul > li {
    padding: 0;
    background: rgba(0, 0, 0, 0) !important;
}

.filtersFormItemSelect .ms-drop ul > li.hidden {
    display: none;
}

.filtersFormItemSelect .ms-drop ul > li.ms-no-results,
.filtersFormItemSelect .ms-drop ul > li:not(:last-child) label {
    margin-bottom: 10px;
}

.filtersFormItemSelect .ms-drop ul > li.ms-no-results:hover {
    color: inherit;
}

.filtersFormItemSelect .ms-drop ul > li label {
    width: auto;
    height: auto;
    padding: 5px 8px;
    display: inline-flex;
    align-items: center;
    border: 1px solid #E8E8E8;
    box-sizing: border-box;
    border-radius: 6px;
    font-weight: 500;
    letter-spacing: -0.01em;
    color: #373842;
    position: relative;
    cursor: pointer;
    transition: all .25s ease-in-out;
}

.filtersFormItemSelect .ms-drop ul > li label::after {
    display: none !important;
}

.filtersFormItemSelect .ms-drop ul > li label span {
    padding: 0;
    max-width: 275px;
    text-overflow: ellipsis;
    overflow-x: hidden;
}

.filtersFormItemSelect .ms-drop ul > li label:hover {
    background: #F3F6FF;
}

.filtersFormItemSelect .ms-drop ul > li.selected label {
    border: 1px solid #446FDD;
}

.filtersFormItemSelect .ms-drop ul > li label input {
    opacity: 0;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    cursor: pointer;
}

.filters .topTitle {
    display: none;
}

.top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 64px auto 40px auto;
    max-width: 481px;
    width: 100%;
}

.topTitle {
    display: flex;
    align-items: center;
    max-width: 1175px;
}

.topTitle h1 {
    font-weight: 700;
    font-size: 36px;
    color: #000;
    margin-bottom: 0;
}

.top .topSort {
    display: flex;
    align-items: center;
}

.top .topSort .topSortTitle {
    font-weight: 700;
}

.top .topSort ul {
    padding: 0;
    margin: 0;
    list-style: none;
    position: relative;
    margin-left: 12px;
    padding-right: 26px;
    cursor: pointer;
    padding-top: 10px;
    padding-bottom: 10px;
}

.top .topSort ul li {
    margin: 0;
    font-weight: 600;
}

.top .topSort ul li:not(.current) {
    display: none;
}

.top .topSort ul svg {
    display: initial;
    position: absolute;
    top: 15px;
    right: 0;
    transition: all .25s ease-in-out;
}

.top .topSort ul.active svg {
    transform: rotate(180deg);
}

@media (min-width: 993px) {
    .top .topSort ul:hover svg {
        transform: rotate(180deg);
    }
}

.contentWrap {
    display: flex;
    flex-direction: column;
}

.filtersFormBlock {
    display: grid;
    grid-template-columns: 78% 22%;
    align-items: start;
}

.filtersSearchWrap {
    flex: 0 1 100%;
    margin-top: auto;
}

.filtersSearch {
    display: flex;
    justify-content: flex-end;
}

.filtersSearch input[type="text"] {
    height: 24px;
    padding: 0 0 11px 19px;
    background-image: url('../img/search_blue.svg');
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 12px auto;
    border: 0;
    border-bottom: 1px solid #E8E8E8;
    border-radius: 0px;
    background-color: #ffffff;
    max-width: 192px;
}

.filtersSearch input[type="text"]:focus {
    outline: none;
    border: 0;
    border-bottom: 1px solid #E8E8E8;
}

.filtersSearch input[type="text"]::placeholder {
    color: #C1C3D3;
}

.filtersFormBlockWrap {
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
    min-height: 50px;
    flex-wrap: wrap;
}

.filtersFormBlockWrap .filtersResultsClear {
    margin-left: auto;
    min-height: 42px;
    display: flex;
    align-items: center;
    margin-right: auto;
    margin-bottom: auto;
}

.filtersFormBlockWrap .filtersFormFavourite {
    position: absolute;
    top: 12px;
    right: 0;
}

.filtersFormFavourite input {
    display: none;
}

.filtersFormFavourite {
    display: flex;
    flex-direction: column;
    cursor: pointer;
}

.filtersFormFavourite span, .base_table.tasks .tooltip p span {
    margin: 0;
    right: auto;
    left: calc(100% + 10px);
    white-space: nowrap;
    bottom: -2px;
    padding: 5px 10px;
}

.base_table.tasks .tooltip p span {
    bottom: 8px;
}

.filtersFormFavourite.filtersFormFavouriteEmpty svg path {
    fill: #C4C4C4;
}

.filtersFormDate {
    width: 28px;
    height: 28px;
    border: 1px solid #E8E8E8;
    border-radius: 50%;
    position: relative;
    margin-right: 20px;
    cursor: pointer;
}

.filtersFormDate input.task_date {
    opacity: 0;
    visibility: hidden;
}

.filtersFormDate svg, .filtersFormDate input.task_date {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    margin: auto;
}

@media (max-width: 1250px) {
    .filtersFormBlock {
        grid-template-columns: 75% 25%;
    }

    .tasks-list {
        grid-gap: 20px;
    }
}

@media (max-width: 992px) {
    .mobile-menu-active {
        overflow: hidden;
    }

    #tasks-list-menu-mobile,
    #projects-list-menu-mobile {
        display: flex;
        align-items: center;
    }

    #tasks-list-menu-mobile .icon_link,
    #projects-list-menu-mobile .icon_link {
        display: block;
        width: 20px;
        height: 20px;
        margin-left: -140px;
        padding: 0;
    }

    #tasks-list-menu-mobile a img,
    #projects-list-menu-mobile a img {
        width: 20px;
        margin-left: 0;
    }

    .sub_menu li,
    .sub_menu li span, .sub_menu li a.current {
        background: #fff;
        color: #446fdd;
    }

    .sub_menu li a.current {
        border: none;
        color: #446fdd;
    }

    .sub_menu a {
        color: #446fdd;
    }

    .sub_menu a.active, .sub_menu a.active:hover {
        background: #fff;
        color: #446fdd;
        font-weight: bold;
    }

    .tasks-list {
        grid-gap: 20px;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .top .topSort ul li:not(.current) {
        display: none;
        position: absolute;
        right: 26px;
        top: 100%;
        white-space: nowrap;
    }

    .top .topSort ul.active li {
        display: initial;
    }

    .filtersFormItem {
        position: initial;
    }

    .filtersFormSwitch, .filtersFormItem, .filtersFormDate {
        margin: 0 15px;
    }

    .pageProjectsList .filtersFormItem, .pageProjectsList .filtersFormDate, .pageProjectsList .filtersFormSwitch, .pageProjectsList .filtersFormMore, .pageProjectsList .filtersForm .inputCheckboxProjectStageActive {
        margin-right: 15px;
    }

    .taskField .filtersFormItem {
        margin: 0;
    }

    .filtersFormItem:first-of-type {
        margin-left: 0;
    }

    .filtersFormBlockWrap .filtersResultsClear {
        margin-bottom: initial;
        margin-right: 10px;
    }

    .filtersFormItemSelect .ms-drop ul {
        max-height: 45vh !important;
    }

    input[type=submit].filtersFormBtn {
        position: absolute;
        right: 0;
        top: calc(100% + 40px);
        z-index: 100;
        padding: 8px 22px !important;
        font-weight: 600;
        font-size: 12px;
        line-height: 14px;
        letter-spacing: -0.03em;
    }

    .filtersFormItemSelect {
        top: calc(100% + 20px);
    }

    .filtersFormBlock {
        min-height: auto;
        flex-wrap: initial;
        overflow-x: auto;
        display: flex;
        align-items: center;
    }

    .filtersForm .filters-row {
        flex-wrap: initial;
    }

    .filtersFormBlockWrap {
        padding-right: 0;
        position: initial;
        flex-wrap: initial;
    }

    .filtersFormBlockWrap .filtersFormFavourite {
        position: initial;
        margin-left: 20px;
    }

    .filtersFormItemSelect, .filtersFormItemSelect .ms-drop.bottom {
        width: 100%;
    }

    .filtersFormItemTitle {
        display: block;
    }

    .ihfos .filtersResults {
        padding-top: 0;
        border-top: 0;
    }

    .filtersFormItemWrap, .filtersFormMore {
        display: none;
    }

    .taskField .filtersFormItemWrap, .filtersFormMore {
        display: flex;
    }

    .filtersFormShowMore {
        display: initial !important;
    }

    .contentWrap .top, .tasksHeader {
        order: 1;
    }

    .contentWrap .filtersForm {
        order: 2;
    }

    .contentWrap .filters, #form_tasks_list_update {
        order: 3;
    }

    .filtersSearchWrap {
        margin-top: initial;
        flex: none;
        margin-left: 30px;
    }

    .contentWrap .projectsListForm {
        order: 4;
    }

    .contentWrap .pagination {
        order: 5;
    }

    .top {
        max-width: 100%;
        margin: 10px 0 20px 0;
    }

    .filters {
        justify-content: space-between;
        margin: 0px 0 30px 0;
        padding: 0;
    }

    .ihfos.ihfos-tasks .filters {
        margin-top: 0;
    }

    .filtersResults {
        margin-top: 0px;
        display: flex;
        white-space: nowrap;
        overflow: scroll;
        max-width: 100%;
        border-top: 1px solid #DEEAEB;
        padding-top: 18px;
        width: 100%;
    }

    .filters .filtersItem {
        margin-left: 0;
    }

    .topTitle h1 {
        font-weight: 600;
        font-size: 18px;
        line-height: 21px;
        letter-spacing: -0.015em;
        margin-right: 14px;
    }

    .top .topSort ul li {
        font-weight: 400;
        text-transform: lowercase;
    }

    .topTitle .new_task {
        width: 20px;
        height: 20px;
        position: initial;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .topTitle .new_task img {
        position: initial;
        width: 9px;
        height: auto;
        transform: none;
    }

    .top .topSort ul {
        margin-left: 0;
        padding-top: 0;
        padding-bottom: 0;
        display: grid;
    }

    .top .topSort ul li {
        margin-bottom: 5px;
    }

    .top .topSort ul svg {
        top: 4px;
    }

    .tasks-list-title-results {
        margin: 6px 1rem 2px 1rem;
    }
}

.projectsList {
    max-width: 481px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 100%;
    grid-gap: 20px;
}

@media (max-width: 768px) {
    .projectsList {
        max-width: 100%;
    }
}

.projectsList .projectsListItem {
    border: 1px solid #d5d5d5;
    box-sizing: border-box;
    border-radius: 14px;
    padding: 24px;
}

@media (max-width: 768px) {
    .projectsList .projectsListItem {
        padding: 20px;
    }
}

.projectsList .projectsListItemDeadline {
    position: relative;
    display: inline-block;
    padding: 5px 10px;
    border-radius: 7px;
    font-weight: normal;
    margin-left: 0.5rem;
    color: #000000;
    text-align: center;
    margin-bottom: -2px;
}

.projectsList .projectsListItemDeadline .projectsListItemDeadlineDate {
    position: absolute;
    bottom: 120%;
    left: 0;
    opacity: 0;
    transition: all .3s ease-in-out;
    width: 100%;
}

.projectsList .projectsListItemDeadline:hover .projectsListItemDeadlineDate {
    opacity: 1;
}

.projectsList .projectsListItem .projectsListItemTop {
    display: flex;
    justify-content: space-between;
    margin-bottom: 20px;
}

@media (max-width: 768px) {
    .projectsList .projectsListItem .projectsListItemTop {
        margin-bottom: 40px;
    }
}

.pageTasksList div.projectsListItemTopStage {
    z-index: 10;
    width: 30px;
    margin-left: 15px;
}

div.projectsListItemTopStage select {
    visibility: hidden;
    border: none;
    padding: 0;
    height: auto;
    cursor: pointer;
}

div.projectsListItemTopStage .ms-parent {
    width: 30px !important;
}

div.projectsListItemTopStage .ms-parent .ms-drop.bottom {
    left: auto;
    width: 190px;
    right: 0;
}

div.projectsListItemTopStage .ms-parent button {
    border: 0px;
    background: rgba(0, 0, 0, 0);
}

div.projectsListItemTopStage .ms-parent .ms-choice > span {
    padding: 0;
    width: 30px !important;
    overflow: hidden;
    text-overflow: initial;
    font-size: 25px;
}

div.projectsListItemTopStage .ms-parent .ms-choice > div {
    right: 0;
    top: 9px;
    border-width: 0 1px 1px 0;
    display: none;
}

div.projectsListItemTopStage .ms-parent label {
    cursor: pointer;
}

div.projectsListItemTopStage .ms-parent .ms-drop ul > li {
    margin-bottom: 5px;
}

div.projectsListItemTopStage .ms-parent .ms-drop ul > li:last-of-type {
    margin-bottom: 0;
}

div.projectsListItemTopStage .ms-parent .ms-drop ul > li:hover {
    background: rgba(0, 0, 0, 0);
    color: #373842;
}

div.projectsListItemTopStage .ms-parent .ms-drop ul > li input {
    display: none;
}

div.projectsListItemTopStage .ms-parent .ms-drop.bottom {
    background: #FFFFFF;
    border: 1px solid #E8E8E8;
    box-sizing: border-box;
    box-shadow: 0px 11px 54px rgba(234, 229, 229, 0.25);
    border-radius: 12px;
    padding: 15px 5px;
}

.projectsList .projectsListItem .projectsListItemTop .projectsListItemTopTitle {
    display: flex;
    align-items: center;
    font-weight: 700;
    color: #373842;
    text-decoration: none;
    max-width: calc(100% - 50px);
}

.projectsList .projectsListItem .projectsListItemTop .projectsListItemTopTitle svg circle {
    fill: #ffffff;
}

.projectsList .projectsListItem .projectsListItemTop .projectsListItemTopTitle svg rect {
    stroke: #446FDD;
    fill: #446FDD;
}

@media (max-width: 768px) {
    .projectsList .projectsListItem .projectsListItemTop .projectsListItemTopTitle {
        font-weight: 600;
        font-size: 13px;
        line-height: 15px;
    }
}

.projectsList .projectsListItem .projectsListItemTop .projectsListItemTopTitle .projectsListItemTopTitleProject {
    display: inline-flex;
    align-items: center;
    margin-right: 5px;
    font-size: 14px;
    line-height: 19px;
    font-weight: 500;
    max-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.projectsListItemTopTitleProjectTitle {
    max-width: 310px;
    text-overflow: ellipsis;
    display: inline-block;
    overflow: hidden;
    white-space: nowrap;
}

.projectsList .projectsListItem .projectsListItemTop .projectsListItemTopTitle .projectsListItemTopTitleProject .tooltip {
    margin-right: 6px;
    display: inline-flex;
    font-size: 12px;
    font-weight: normal;
}

.projectsList .projectsListItem .projectsListItemTop .projectsListItemTopTitle .projectsListItemTopTitleProject .tooltip span {
    left: calc(100% + 15px);
    margin: 0;
    white-space: nowrap;
}

.projectsList .projectsListItem .projectsListItemTop .projectsListItemTopTitle .projectsListItemTopTitleProject .projectsListItemTopTitleProjectLogo, .projectsList .projectsListItem .projectsListItemTop .projectsListItemTopTitle .projectsListItemTopTitleProject .projectsListItemTopTitleProjectClientLogo {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.projectsList .projectsListItem .projectsListItemTop .projectsListItemTopTitle .projectsListItemTopTitleProject .projectsListItemTopTitleProjectLogo {
    border: 1px solid #ffffff;
    position: relative;
    margin-top: -1px;
}

/* .projectsList .projectsListItem .projectsListItemTop .projectsListItemTopTitle .projectsListItemTopTitleProject .projectsListItemTopTitleProjectClientLogo {
    margin-left: -7px;
} */
.projectsList .projectsListItem .projectsListItemTop .projectsListItemTopTitle .projectsListItemTopTitleProject .tooltip div:nth-child(2) {
    margin-left: -7px;
}
.projectsList .projectsListItem .projectsListItemTop .projectsListItemTopTitle .projectsListItemTopTitleTask {
    opacity: 0;
    visibility: hidden;
    transition: all .25s ease-in-out;
}

.projectsList .projectsListItem .projectsListItemTop .projectsListItemTopTitle:hover .projectsListItemTopTitleTask {
    opacity: 1;
    visibility: visible;
}

@media (max-width: 768px) {
    .projectsList .projectsListItem .projectsListItemTop .projectsListItemTopTitle span {
        padding-bottom: 3px;
        margin-right: 11px;
    }
}

.projectsList .projectsListItem .projectsListItemBottom {
    display: flex;
    justify-content: space-between;
}

.projectsList .projectsListItem .projectsListItemBottom .projectsListItemBottomTime {
    display: flex;
    margin-left: auto;
    margin-right: 34px;
    align-items: flex-end;
    font-size: 18px;
    line-height: 26px;
}

@media (max-width: 425px) {
    .projectsList .projectsListItem .projectsListItemBottom .projectsListItemBottomTime {
        display: none;
    }

    .projectsListItemTopTitleProjectTitle {
        width: 200px;
    }
}

@media (max-width: 375px) {
    .projectsListItemTopTitleProjectTitle {
        width: 160px;
    }
}

.projectsList .projectsListItem .projectsListItemBottom .projectsListItemBottomTimeSep {
    color: #CCCCCC;
    margin: 0 3px;
    font-weight: 400;
}

.projectsList .projectsListItem .projectsListItemBottom .projectsListItemBottomTimeItem {
    display: flex;
    margin-left: auto;
    align-items: baseline;
}

.projectsList .projectsListItem .projectsListItemBottom .projectsListItemBottomTimeItem div {
    font-size: 12px;
    line-height: 14px;
    color: #CCCCCC;
    margin-left: 2px;
}

.projectsList .projectsListItem .projectsListItemBottom .projectsListItemBottomTimeItem span {
    font-size: 12px;
    line-height: 14px;
    margin: 0;
    left: calc(100% + 10px);
}

.projectsList .projectsListItem .projectsListItemBottom .projectsListItemBottomClient {
    width: 28px;
    height: 28px;
    background: #C4C4C4;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: 30px;
    margin-top: 2px;
}

.projectsList .projectsListItem .projectsListItemBottom .projectsListItemBottomTasks {
    display: flex;
    align-items: flex-end;
}

.projectsList .projectsListItem .projectsListItemBottom .projectsListItemBottomTasksClosed {
    font-size: 16px;
    line-height: 19px;
    letter-spacing: -0.035em;
    color: #C4C4C4;
}

.projectsList .projectsListItem .projectsListItemBottom .projectsListItemBottomTasksClosed a {
    color: #C4C4C4;
    transition: all .25s ease-in-out;
}

.projectsList .projectsListItem .projectsListItemBottom .projectsListItemBottomTasksClosed a:hover {
    color: #373842;
}

.projectsList .projectsListItem .projectsListItemBottom .projectsListItemBottomTasksOpen {
    font-size: 34px;
    line-height: 41px;
    letter-spacing: -0.105em;
    color: #373842;
    margin-right: 4px;
    margin-bottom: -4px;
}

.projectsList .projectsListItem .projectsListItemBottom .projectsListItemBottomTasksOpen a {
    font-size: 34px;
    line-height: 41px;
    letter-spacing: -0.105em;
    color: #373842;
    display: inline-block;
}

@media (max-width: 768px) {
    .projectsList .projectsListItem .projectsListItemBottom .projectsListItemBottomTasksOpen, .projectsList .projectsListItem .projectsListItemBottom .projectsListItemBottomTasksOpen a {
        font-size: 30px;
        line-height: 36px;
        letter-spacing: 0.005em;
    }

    .projectsList .projectsListItem .projectsListItemBottom .projectsListItemBottomTasksClosed {
        font-size: 14px;
        line-height: 17px;
        letter-spacing: -0.035em;
    }

    .projectsList .projectsListItem .projectsListItemBottom .projectsListItemBottomClient {
        display: none;
    }
}

.projectsList .projectsListItem .projectsListItemBottom .projectsListItemBottomWorkers {
    max-width: 130px;
    display: flex;
    align-items: center;
}

.projectsList .projectsListItem .projectsListItemBottom .projectsListItemBottomWorkers.showAll {
    flex-wrap: wrap;
    max-width: 240px;
}

.projectsList .projectsListItem .projectsListItemBottom .projectsListItemBottomWorkers.showAll .projectsListItemBottomWorkersItem {
    display: inline-flex !important;
}

.projectsList .projectsListItem .projectsListItemBottom .projectsListItemBottomWorkersCount {
    font-weight: 700;
    font-size: 9px;
    line-height: 11px;
    letter-spacing: -0.095em;
    color: #8688A1;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: #F4F5F7;
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 28px;
    cursor: pointer;
    margin-bottom: 5px;
}

.projectsList .projectsListItem .projectsListItemBottom .projectsListItemBottomWorkersCount span {
    text-align: left;
    font-weight: normal;
    color: #000;
    line-height: 1.7;
}

.projectsList .projectsListItem .projectsListItemBottom .projectsListItemBottomWorkersItem {
    position: relative;
    width: 28px;
    height: 28px;
    font-size: 9px;
    line-height: 11px;
    border-radius: 50%;
    background: #F4F5F7;
    margin-right: 6px;
    display: none;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    flex: 0 0 28px;
    vertical-align: top;
    margin-bottom: 5px;
}

.projectsList .projectsListItem .projectsListItemBottom .projectsListItemBottomWorkers .projectsListItemBottomWorkersItem:nth-child(1), .projectsList .projectsListItem .projectsListItemBottom .projectsListItemBottomWorkers .projectsListItemBottomWorkersItem:nth-child(2), .projectsList .projectsListItem .projectsListItemBottom .projectsListItemBottomWorkers .projectsListItemBottomWorkersItem:nth-child(3), .projectsList .projectsListItem .projectsListItemBottom .projectsListItemBottomWorkers .projectsListItemBottomWorkersItem:nth-child(4) {
    display: inline-flex;
}

.projectsList .projectsListItem .projectsListItemBottom .projectsListItemBottomWorkers.projectsListItemBottomWorkersMore .projectsListItemBottomWorkersItem:nth-child(4) {
    display: none;
}

.projectsList .projectsListItem .projectsListItemBottom .projectsListItemBottomWorkersItem span, .projectsList .projectsListItem .projectsListItemBottom .projectsListItemBottomClient span, .projectsList .projectsListItem .projectsListItemBottom .projectsListItemBottomWorkersCount span,
.worker-cover a span, .worker-cover .tooltip span {
    right: auto;
    left: calc(100% + 10px);
    margin: 0;
    font-size: 12px;
    line-height: 1.2;
    white-space: nowrap;
}

.projectsList .projectsListItem .projectsListItemBottom .projectsListItemBottomWorkersItemImg img {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    object-fit: cover;
    border-radius: 50%;
}

.statistics, .earnings {
    display: flex;
    justify-content: flex-end;
    max-width: 1175px;
    margin: 20px auto;
    width: 100%;
}

@media (max-width: 768px) {
    .statistics, .earnings {
        justify-content: flex-start;
        margin: 30px auto;
    }
}

.statisticsItem {
    margin-right: 25px;
    letter-spacing: -0.015em;
    line-height: 40px;
    display: flex;
    align-items: flex-end;
}

.statisticsItem:last-of-type {
    margin-right: 0;
}

.statisticsItemTitle {
    font-weight: 300;
    font-size: 22px;
    margin-right: 5px;
}

.statisticsItemNum {
    font-size: 26px;
}

#files_table a:hover {
    color: var(--blue);
    text-decoration: underline;
}

.inputCheckbox {
    font-weight: 600;
    position: relative;
    padding-left: 20px;
    cursor: pointer;
    display: inline-block;
    color: #373842;
}

.inputCheckbox input {
    display: none;
}

.inputCheckbox::before {
    content: '';
    position: absolute;
    top: 1px;
    left: 0;
    width: 14px;
    height: 14px;
    border: 0.5px solid #DEEAEB;
    box-sizing: border-box;
    border-radius: 2px;
}

.inputCheckbox.checked::after {
    content: url("../img/check.svg");
    position: absolute;
    top: 2px;
    left: 0;
}

.filtersForm .inputCheckboxProjectStageActive {
    margin-right: 20px;
    white-space: nowrap;
}

@media (max-width: 768px) {
    .filtersForm .inputCheckboxProjectStageActive {
        margin-left: 0px;
    }
}

.projectsListAlphabeticalSorting {
    position: fixed;
    top: 100px;
    left: 40px;
    display: flex;
    flex-direction: column;
    z-index: 1000;
}

@media (max-width: 1024px) {
    .projectsListAlphabeticalSorting {
        display: none;
    }
}

.projectsListAlphabeticalSorting a {
    text-decoration: none;
    font-size: 13px;
    line-height: 15px;
    text-transform: uppercase;
    color: #000000;
    margin-bottom: 8px;
    transition: all .25s ease-in-out;
    text-align: center;
    position: relative;
}

@media (min-height: 1000px) {
    .projectsListAlphabeticalSorting a {
        font-size: 14px;
        margin-bottom: 12px;
        font-weight: 300;
    }
}

@media (max-height: 650px) {
    .projectsListAlphabeticalSorting a {
        margin-bottom: 4px;
    }
}

.projectsListAlphabeticalSorting a:visited {
    color: #000000;
}

.projectsListAlphabeticalSorting a.active, .projectsListAlphabeticalSorting a:hover {
    color: #446FDD;
}

.projectsListAlphabeticalSorting a.active::before {
    visibility: visible;
    opacity: 1;
}

.projectsListAlphabeticalSorting a:last-of-type {
    margin-bottom: 0;
}

.projectsListAlphabeticalSorting a:hover {
    transform: scale(2);
}

.filtersFormShowMore {
    display: none;
}

.filtersFormItemSelectNotActive {
    display: none;
}

/*Confetti animation*/
@keyframes confetti-slow {
    0% {
        transform: translate3d(0, 0, 0) rotateX(0) rotateY(0);
    }
    100% {
        transform: translate3d(25px, 105vh, 0) rotateX(360deg) rotateY(180deg);
    }
}

@keyframes confetti-medium {
    0% {
        transform: translate3d(0, 0, 0) rotateX(0) rotateY(0);
    }
    100% {
        transform: translate3d(100px, 105vh, 0) rotateX(100deg) rotateY(360deg);
    }
}

@keyframes confetti-fast {
    0% {
        transform: translate3d(0, 0, 0) rotateX(0) rotateY(0);
    }
    100% {
        transform: translate3d(-50px, 105vh, 0) rotateX(10deg) rotateY(250deg);
    }
}

.confetti-container {
    perspective: 700px;
    position: absolute;
    overflow: hidden;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}

.confetti {
    position: absolute;
    z-index: 1;
    top: -10px;
    border-radius: 0;
}

.confetti--animation-slow {
    animation: confetti-slow 2.25s linear 1 forwards;
}

.confetti--animation-medium {
    animation: confetti-medium 1.75s linear 1 forwards;
}

.confetti--animation-fast {
    animation: confetti-fast 1.25s linear 1 forwards;
}

.confetti-element {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    pointer-events: none;
    z-index: 100000;
}

/*File input drag and drop with preview*/
.drag-image {
    border: 1px dashed #446FDD;
    height: 200px;
    width: 250px;
    border-radius: 5px;
    font-weight: 400;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    position: relative;
    cursor: pointer;
}

.drag-image.active {
    border: 2px solid #8688A1;
}

.drag-image .icon {
    font-size: 24px;
    color: #446FDD;
}

.drag-image h6 {
    font-size: 16px;
    font-weight: 300;
    color: #446FDD;
}

.drag-image.active h6, .drag-image.active .text, .drag-image.active .button {
    opacity: 0;
}

.drag-image .fileName {
    text-align: center;
    position: absolute;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 2;
    font-size: 16px;
    background: #fff;
    border-radius: 5px;
}

.drag-image .text {
    font-size: 14px;
    font-weight: 300;
    color: #446FDD;
    margin: 10px 0 15px 0;
}

.drag-image .button {
    padding: 10px 25px;
    font-size: 14px;
    font-weight: 300;
    border: none;
    outline: none;
    background: transparent;
    color: #446FDD;
    border: 1px solid #446FDD;
    border-radius: 5px;
    cursor: pointer;
    transition: all 0.5s;
}

.drag-image .button:hover {
    background-color: #446FDD;
    color: #ffffff;
}

.drag-image img {
    height: auto;
    width: 70%;
    object-fit: cover;
    max-height: 100%;
    position: absolute;
    cursor: pointer;
    z-index: 2;
    background: #fff;
}

.task-add-member {
    display: flex;
    align-items: center;
}

.not-table .form_table .task-add-member .col-title {
    margin-right: 1rem;
    color: red;
    margin-bottom: 0;
}

.tasksWorkerTime {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 1rem;
    max-width: 1175px;
    margin: 0 auto 11px auto;
    width: 100%;
}

@media (max-width: 768px) {
    .tasksWorkerTime {
        justify-content: flex-start;
    }
}

.tasksWorkerTimeItem {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-family: 'Rubik';
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 20px;
}

.tasksWorkerTimeItemBlue {
    color: #446FDD;
}

.tasksWorkerTimeItem span {
    font-weight: 600;
    font-size: 14px;
}

.copyTask {
    display: flex;
    text-decoration: none;
    margin-left: auto;
    position: relative;
    z-index: 2;
}

.copyTask svg path {
    transition: all .3s ease-in-out;
}

.copyTask:hover svg path {
    stroke: #446FDD;
}

.editorjs-container {
    position: relative;
    border: 1px solid #ccc;
    padding: 15px;
    border-radius: 8px;
    word-break: break-word;
}

.editorjs-container img {
    max-width: 100% !important;
}

.link-tool__content {
    padding: 12px !important;
}

.link-tool__title {
    font-size: 12px !important;
    margin: 0 0 4px 0 !important;
}

.link-tool__description,
.link-tool__anchor {
    font-size: 10px !important;
}

.table-wide-holder {
    /*position: relative;*/
    /*overflow-x: scroll;*/
    /*border: 1px solid black;*/
    /*white-space: nowrap;*/
    /*width: 100%;*/
    /*overflow-x: auto;*/
    /*height: 400px;*/
    /*margin-left: 5em;*/
    /*overflow-y: visible;*/
    /*padding: 0;*/
}

/*.table-stat-05 {*/
/*    display: block;*/
/*    max-width: fit-content;*/
/*    margin: 0 auto;*/
/*    overflow-x: auto;*/
/*    white-space: nowrap;*/
/*}*/

.table-stat-05 {
    /*width: calc(100% - 1px);*/
    width: auto !important;
    table-layout: fixed;
    padding-right: 30px;
    position: relative;
}

.table-stat-05 th,
.table-stat-05 td {
    /*white-space: nowrap;*/
}

.table-stat-05 thead {
    z-index: 2;
    /*box-shadow: 0 20px 16px 0 rgb(0 0 0 / 0.1);*/
}

.table-stat-05 thead .col-client {
    top: 50px;
}

.table-stat-05 .col-select,
.table-stat-05 thead .col-client,
.table-stat-05 thead .col-total,
.table-stat-05 thead .col-total-sub {
    background-color: #eff0f2;
    color: #4b4b4d;
}

.statistic .table-stat-05 .col-select,
.statistic .table-stat-05 thead .col-client,
.statistic .table-stat-05 thead .col-total,
.statistic .table-stat-05 thead .col-total-sub {
    background-color: #4b4b4d;
    color: #fff;
    border: 1px solid #eff0f2;
}

.table-stat-05 .hidden {
    display: none;
}

.table-stat-05 .active {
    display: block;
}

.table-stat-05 .diff {
    position: relative;
    display: inline-block;
}

.table-stat-05 .show {
    display: table-cell;
}

.table-stat-05 tbody .col-total-sub,
.table-stat-05 .display-total
{
    background-color: #DEDEDE
}

.statistic .control-total {
    width: 200px;
    display: inline-block;
    padding: 12px 20px;
    margin-bottom: 20px;
    background: lightgrey;
    border-radius: 30px;
    float: right;
    font-size: 12px;
    font-weight: 600;
}

.statistic-page-info {
    margin-bottom: 25px;
}

.statistic .time-balance-select {
    width: 224px;
    display: inline-block;
    padding: 12px 8px;
    margin-bottom: 20px;
    background: lightgrey;
    border-radius: 30px;
}

.statistic .time-balance-select a.item {
    margin: 10px 0;
    padding: 5px 30px;
    vertical-align: middle;
    line-height: 13px;
}

.statistic .time-balance-select a.item.active {
    background: #fff;
    border-radius: 25px;
    font-size: 15px;
    font-weight: 600;
}

.table-stat-05 .hidden {
    display: none;
}

.table-stat-05 .diff {
    position: relative;
    display: inline-block;
}

.table-stat-05 .show {
    display: table-cell;
}

.table-stat-05 tbody .col-total-sub.display-total,
.table-stat-05 .display-total {
    background-color: #DEDEDE
}

.table-stat-05 tbody td,
.table-stat-05 tfoot td {
    text-align: right;
    border: 1px solid #d0d0d3;
}

.table-stat-05 tfoot td {
    font-weight: bold;
}

.table-stat-05 td,
.table-stat-05 th {
    border: 1px solid #d0d0d3;
}

.table-stat-05 .col-client,
.table-stat-05 .col-project,
.table-stat-05 .col-worker,
.table-stat-05 .col-head,
.table-stat-05 .col-total {
    position: sticky;
    box-shadow: 20px 2px 16px 0 rgb(0 0 0 / 0.1);
    text-align: left;
    left: 40px;
    min-width: 260px;
    z-index: 2;
}

.statistic .table-stat-05 tbody tr.row-sticky {
    position: sticky;
    top: 110px;
    z-index: 3;
}

.statistic-client .table-stat-05 .col-client,
.statistic-client .table-stat-05 .col-project,
.statistic-client .table-stat-05 .col-worker,
.statistic-client .table-stat-05 .col-head {
    left: 40px;
}

.statistic .table-fixed-sections thead,
.statistic .table-stat-05 thead .col-client {
    position: sticky;
    top: 0;
    z-index: 3;
}

.statistic-am .client-invoice a {
    color: red;
}

.table-stat-05 tfoot .col-total {
    min-width: 150px; /* 110 + 40 */
    box-shadow: 20px 2px 16px 0 rgb(0 0 0 / 0.1), -40px 0 0 0 #fff;
    left: -40px;
}

.table-stat-05 .col-project {
    background-color: #ffffff;
}

.table-stat-05 .col-select {
    position: sticky;
    left: 0;
    min-width: 40px;
    box-shadow: -40px 0 0 0 #fff;
    z-index: 2;
}

.table-stat-05 .col-income,
.table-stat-05 .col-expenses,
.table-stat-05 .col-profit,
.table-stat-05 .col-percent,
.table-stat-05 .col-invoice {
    min-width: 130px;
    font-family: monospace;
}

.table-stat-05 .col-profit {
    font-weight: bold;
}

.table-stat-05 .col-month:not(:last-child),
.table-stat-05 .col-invoice:not(.col-total-sub):not(:last-child),
.table-stat-05 .col-profit:not(.col-total-sub):not(:last-child) {
    border-right-color: #4b4b4d;
    border-right-width: 2px;
}

.table-stat-05 thead .col-income,
.table-stat-05 thead .col-expenses,
.table-stat-05 thead .col-profit,
.table-stat-05 thead .col-percent,
.table-stat-05 thead .col-invoice {
    font-family: Rubik;
}

.table-stat-05 .col-total {
    position: sticky;
    right: 0;
    left: 0 !important;
    min-width: 330px; /* 110 * 3 */
    box-shadow: -20px 2px 16px 0 rgb(0 0 0 / 0.1), 110px 0 0 0 #fff;
    text-align: center;
}

.table-stat-05 .col-total-sub {
    position: sticky;
}

.table-stat-05 .col-total-sub.col-profit {
    right: 0;
    box-shadow: 110px 0 0 0 #fff;
}

.table-stat-05 .col-total-sub.col-expenses {
    right: 130px;
}

.table-stat-05 .col-total-sub.col-income {
    right: 260px;
    box-shadow: -20px 2px 16px 0 rgb(0 0 0 / 0.1);
}

.table-stat-05 .stat-sign {
    font-family: Rubik;
}

.table-stat-05 .stat-up {
    color: #0f0;
}

.table-stat-05 .stat-down {
    color: #f00;
}

.table-stat-05 tbody tr:hover td,
.table-stat-05 tbody tr:hover .col-select,
.table-stat-05 tbody tr:hover .col-project,
.table-stat-05 tbody tr:hover .col-client,
.table-stat-05 tbody tr:hover .col-total-sub {
    background-color: #c2e1ff;
}

.table-stat-05 .row-selected:hover td,
.table-stat-05 .row-selected:hover .col-select,
.table-stat-05 .row-selected:hover .col-client,
.table-stat-05 .row-selected:hover .col-total-sub {
    background-color: #c2e1ff;
}

.checkbox-slider {
    --slider-circle-size: 20px;
    --slider-label-gap: 6px;
    --slider-box-padding: 2px;
    --slider-box-width: calc((var(--slider-circle-size) * 2) + (var(--slider-box-padding) * 2));
    --slider-box-height: calc(var(--slider-circle-size) + (var(--slider-box-padding) * 2));

    position: relative;
    display: inline-flex;
    align-items: center;
    cursor: pointer;
    font-weight: 500;
    padding-left: calc(var(--slider-box-width) + var(--slider-label-gap));
    height: var(--slider-box-height);
}

.checkbox-slider .slider {
    width: var(--slider-box-width);
    height: var(--slider-box-height);
    background-color: #ccc;
    position: absolute;
    top: 0;
    left: 0;
    transition: .4s;
}

.checkbox-slider .slider:before {
    content: '';
    position: absolute;
    width: var(--slider-circle-size);
    height: var(--slider-circle-size);
    top: var(--slider-box-padding);
    left: var(--slider-box-padding);
    background-color: #D4D7DD;
    box-shadow: 0 0.5px 1.5px 0 rgba(0, 0, 0, 0.12) inset, 0 0 1px 0 rgba(0, 0, 0, 0.02) inset;
    transition: .4s;
}

.checkbox-slider input {
    display: none;
}

.checkbox-slider input:checked + .slider {
    background-color: #66bb6a;
}

.checkbox-slider input:checked + .slider:before {
    transform: translateX(var(--slider-circle-size));
}

.checkbox-slider .slider.round {
    border-radius: var(--slider-circle-size);
}

.checkbox-slider .slider.round:before {
    border-radius: 100%;
    background: #FFF;
    box-shadow: 0 0.25px 0.5px 0.1px rgba(0, 0, 0, 0.12);
}

.info.left span {
    right: 5px;
    left: auto;
}

.form_table.search .search-block {
    display: flex;
}

.form_table.search .search-inputs {
    display: flex;
    flex-wrap: nowrap;
}

.form_table.search .search-inputs input + input {
    margin-left: 3px;
}

.form_table.search .search-controls {
    display: flex;
    flex-wrap: wrap;
    margin: 0 -4px -4px 0;
}

.form_table.search .search-controls button {
    padding: 5px 15px;
    border: 1px solid darkgrey;
    border-radius: 15px;
    background: lightgrey;
    transition: all 0.2s ease;
    margin: 0 4px 4px 0;
}

.form_table.search .search-controls button:hover {
    color: #f00;
}

.form_table.search td #stat_date_to {
    margin-right: 25px;
}

.form_table.search td > a:visited {
    background: lightgrey;
}

.table-tfoot-submit tfoot {
    position: sticky;
    bottom: 0;
}

.table-tfoot-submit tfoot tr:hover {
    background: inherit;
}

.table-tfoot-submit tfoot td {
    text-align: right !important;
}

.table-stat-05 .diff {
    position: relative;
    display: inline-block;
}

.table-stat-05 .tooltip,
.table-stat-05 .total-tooltip {
    visibility: hidden;
    width: 120px;
    background-color: black;
    color: #fff;
    text-align: center;
    padding: 5px 0;
    border-radius: 6px;

    /* Position the tooltip text - see examples below! */
    position: absolute;
    z-index: 1;
}

.table-stat-05 .diff:hover .total-tooltip {
    position: relative;
}

.table-stat-05 .diff:hover .tooltip,
.table-stat-05 .diff:hover .total-tooltip {
    visibility: visible;
}
.statistic-am .table-stat-05 .col-total-sub.col-income,
.statistic-tl .table-stat-05 .col-total-sub.col-income {
    right: 260px;
}
.statistic-am .table-stat-05 .col-total-sub.col-expenses,
.statistic-tl .table-stat-05 .col-total-sub.col-expenses {
    right: 130px;
    min-width: 130px;
}
.statistic-am .table-stat-05 .col-total-sub.col-invoice,
.statistic-tl .table-stat-05 .col-total-sub.col-invoice {
    min-width: 130px;
    right: 0;
}

.statistic .table-stat-05 .col-client,
.statistic .table-stat-05 .col-worker,
.statistic .table-stat-05 .worker-data,
.statistic .table-stat-05 .client-data {
    font-weight: bold;
    background-color: #eff0f2;
}

.statistic {
	overflow: auto;
	position: relative;
}
.statistic table {
	display: inline-block;
	vertical-align: top;
	max-width: 100%;
    height: 100%;
    max-height: 600px;
	overflow-x: auto;
	white-space: nowrap;
	-webkit-overflow-scrolling: touch;
    padding: 0;
    margin: 0 auto;
}

.statistic .stat-statuses select{
    min-height: 30px;
    height: 100%;
}

.worker-payment-info .payment-more-tooltip table {
    border: none;
    text-align: left;
    color: lightslategray;
    margin-bottom: 20px;
}

.statisticsItem > .project-tooltip,
.statistic .diff > .project-tooltip,
.statistic-info.diff > .project-tooltip,
.workers-table th .project-tooltip,
.worker-payment-info .project-tooltip {
    display: none;
}

.statistic .more-btn > .project-worker-btn,
.statistic .more-btn > .project-client-btn {
    background-color: transparent;
    border: none;
    padding: 5px;
}

.statistic .more-btn > .project-worker-btn.open:before,
.statistic .more-btn > .project-client-btn.open:before {
    top: 3px;
    border: 5px solid transparent;
    border-top: 5px solid #000;
}

.statistic .more-btn > .project-worker-btn:before,
.statistic .more-btn > .project-client-btn:before {
    content: '';
    display: block;
    position: relative;
    border: 5px solid transparent;
    border-right: 5px solid #000;
    background-color: transparent;
}

.statistic .table-stat-05 .row-selected .col-worker,
.statistic .table-stat-05 .row-selected .col-project,
.statistic .table-stat-05 .row-selected .col-client {
    min-width: 260px;
}

.statistic .table-stat-05 .col-worker-body,
.statistic .table-stat-05 .col-client-body {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 13px;
    padding: 13px;
}

.statistic .table-stat-05 .col-project {
    background-color: #ffffff;
}

.statistic .table-stat-05 .col-link {
    display: inline-block;
    border-bottom: 1px dashed currentColor;
}

.statistic .table-stat-05 .col-link:hover {
    color: var(--brand-primary);
}

#account_manager select,
.base_table.team_roles select {
    min-width: 200px;
}

.content .message {
    padding: 15px;
    text-decoration: none;
    font-size: 12px;
    font-weight: 400;
}

.content .message.error {
    color: rgb(102, 2, 2);
    background-color: rgba(255, 53, 53, 0.247);
}

.content .message.success {
    color: rgb(2, 59, 2);
    background-color: rgba(4, 168, 4, 0.486);
}

.statistic .table-stat-05 .col-worker,
.statistic .table-stat-05 .col-client {
    padding: 0;
}

.statistic .table-stat-05 .col-worker .worker-name,
.statistic .table-stat-05 .col-client .client-name {
    flex-grow: 1;
}

.statistic .table-stat-05 .more-btn {
    display: inline-flex;
    align-items: center;
    gap: 7px;
}

.statistic .button-chart-open {
    background-color: transparent;
    padding: 0;
    border: none;
    font-size: 0;
}

.form_table.search td.period {
    width: 240px;
}

#statistic .tippy-box[data-theme~=light] {
    box-shadow: 0 0 20px 4px rgba(154,161,177,.15);
}

@media screen and (max-width: 800px) {
    .statistic .control-total {display: none;}

    .table-stat-05 .col-total.all,
    .table-stat-05 .col-total-sub,
    .table-stat-05 .col-display-total {
        position: relative;
        z-index: unset;
    }
    .table-stat-05 .col-total.all,
    .table-stat-05 .col-total-sub.col-income {
        box-shadow: none;
    }
    .statistic-am .table-stat-05 .col-total-sub.col-expenses, 
    .statistic-tl .table-stat-05 .col-total-sub.col-expenses,
    .table-stat-05 .col-total-sub.col-expenses,
    .statistic-am .table-stat-05 .col-total-sub.col-income, 
    .statistic-tl .table-stat-05 .col-total-sub.col-income,
    .table-stat-05 .col-total-sub.col-income {
        right: unset;
    }
}

/* Tables mobile - start */
.content table.table_mobile {
    margin-bottom: 40px;
}
.forMob {
    display: none;
}
@media(max-width:768px) {
    .content table.table_mobile tbody,
    table.base_table.projects.table_payments tbody,
    table.base_table.tasks.table_payments tbody {
        display: flex;
        width: 100%;
    }
    .content table.table_mobile tbody tr,
    table.base_table.projects.table_payments tbody tr,
    table.base_table.tasks.table_payments tbody tr {
        display: flex;
        flex-direction: column;
        width: 100%;
    }
    .content table.table_mobile tbody tr td, 
    .content table.table_mobile tbody tr th,
    table.base_table.projects.table_payments tbody tr td,
    table.base_table.projects.table_payments tbody tr th,
    table.base_table.tasks.table_payments tbody tr td,
    table.base_table.tasks.table_payments tbody tr th {
        height: 40px;
        text-align: left !important;
    }
    .content table.table_mobile tbody tr td:first-child,
    table.base_table.projects.table_payments tbody tr td:first-child, 
    table.base_table.tasks.table_payments tbody tr td:first-child {
        border-top: 1px solid #f0f0f0;
    }
    .content table.table_mobile tbody tr td:not(:last-child) {
        border-right: 1px solid #f0f0f0;
    }
    .content table.table_mobile tbody tr th:last-child {
        display: none;
    }
    .content table.table_mobile tbody tr td:last-child {
        border: 0;
    }
    table.base_table.tasks.table_payments tr:first-child th {
        width: 100%;
    }
    table.base_table.tasks.table_payments tr:nth-child(2):not(.odd), td.forDesc {
        display: none;
    }
    .forMob {
        display: unset;
    }
}
/* Table of create payments - end */

.content .message.hidden {
    display: none;
}

.base_table.works th {
    border: none !important;
    font-size: 11px;
}

.base_table.works tr {
    border: none !important;
    font-size: 11px;
}

#project_members_table td > input[type="radio"] {
    display: inline-block;
    vertical-align: top;
}

#project_members_table td.lead-radio {
    text-align: center;
}

.projectsListItemBottom .project-lead.active {
    position: relative;
    width: 15px;
    height: 15px;
    font-size: 7px;
    line-height: 14px;
    border-radius: 50%;
    background: aliceblue;
    border: 1px solid lightgrey;
    box-sizing: border-box;
    flex: 15px 0 0;
    vertical-align: bottom;
    margin: 0 5px -17px -16px;
    text-align: center;
}

.filters-list-quick-links {
    list-style: none !important;
    display: flex;
    flex-wrap: wrap;
    margin-bottom: -6px;
}

.filters-quick-link {
    display: inline-flex;
    align-items: center;
    padding: 4px 6px;
    border: none;
    border-radius: 8px;
    background-color: #ebebeb;
    line-height: 16px;
    color: var(--blue) !important;
    transition: all 0.2s ease;
    gap: 6px;
}

.filters-quick-link.active,
.filters-quick-link:hover {
    background-color: #446fdd;
    color: #fff !important;
}

.filters-quick-link.active:hover {
    background-color: #0056b3;
}

.filters-list-quick-link-item {
    display: inline-flex;
    margin: 0 6px 6px 0 !important;
}

.filters-list-quick-link-item.hidden {
    display: none;
}

.filters-list-quick-link-logo {
    display: inline-flex;
    padding: 2px;
    background-color: #fff;
    border-radius: 100%;
    object-fit: cover;
    box-sizing: content-box;
}

#chart-filters .filters-list-quick-links {
    margin: 0 0 4px 0;
}

.avatar_file_view {
    margin-top: 30px;
}
.avatar_file_view img {
    width: unset;
    margin-right: 30px;
}
.info.info-avatar {
    margin-right: 30px;
}
[name="avatar_file"] {
    max-width: 210px;
}
.td-avatar>input:hover ~ .info span {
    display: block;
}