Your IP : 18.188.62.10
.main-kanban {
--white: rgba(255,255,255,1);
--white_alpha_15: rgba(255,255,255,.15);
--white_alpha_30: rgba(255,255,255,.3);
--white_alpha_40: rgba(255,255,255,.4);
--white_alpha_50: rgba(255,255,255,.5);
--white_alpha_60: rgba(255,255,255,.6);
--white_alpha_70: rgba(255,255,255,.7);
--white_alpha_80: rgba(255,255,255,.8);
--green: rgba(187,237,33,1);
--red: rgba(229,73,89,1);
--graphite: rgba(82,92,105,1);
--graphite_alpha_08: rgba(82,92,105,.08);
--graphite_alpha_10: rgba(82,92,105,.1);
--graphite_alpha_14: rgba(82,92,105,.14);
--graphite_alpha_15: rgba(82,92,105,.15);
--graphite_alpha_20: rgba(82,92,105,.2);
--graphite_alpha_30: rgba(82,92,105,.3);
--graphite_alpha_40: rgba(82,92,105,.4);
--graphite_alpha_50: rgba(82,92,105,.5);
--graphite_alpha_60: rgba(82,92,105,.6);
--graphite_alpha_70: rgba(82,92,105,.7);
--graphite_alpha_80: rgba(82,92,105,.8);
max-width: 100%;
clear: both;
display: block;
font-family: var(--ui-font-family-secondary, var(--ui-font-family-open-sans));
font-weight: var(--ui-font-weight-regular, 400);
height: 100%;
/*overflow: hidden;*/
-webkit-box-sizing: border-box;
box-sizing: border-box;
position: relative;
}
.main-kanban-inner {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
position: relative;
z-index: 9;
/*overflow-x: hidden;*/
/*overflow-x: hidden;*/
}
.main-kanban-inner-shadow {
position: absolute;
overflow: hidden;
width: 10px;
left: 0;
top: 0;
bottom: 0;
z-index: 9;
opacity: 0;
transition: .2s;
pointer-events: none;
}
.main-kanban-inner-shadow-right {
left: auto;
right: 0;
}
.main-kanban-left-ear-shown .main-kanban-inner-shadow-left,
.main-kanban-right-ear-shown .main-kanban-inner-shadow-right {
opacity: 1;
}
.main-kanban-inner-shadow:after {
content: '';
position: absolute;
top: 10px;
width: 10px;
left: -10px;
bottom: 10px;
-webkit-border-radius: 80%;
border-radius: 80%;
box-shadow: 0 0 10px rgba(0,0,0,.2);
}
.main-kanban-inner-shadow-right:after {
left: auto;
right: -10px;
}
.main-kanban-fixed {
position: fixed;
top: 15px;
bottom: 0;
}
.main-kanban-grid {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
position: relative;
margin-top: -8px;
padding-top: 8px;
z-index: 1;
-ms-overflow-y: hidden;
overflow: auto;
scrollbar-arrow-color: #ccc;
scrollbar-track-color: transparent;
scrollbar-base-color: #ccc;
scrollbar-shadow-color: #fff;
scrollbar-highlight-color: #fff;
}
.main-kanban-grid::-webkit-scrollbar {
height: 6px;
}
.main-kanban-grid::-webkit-scrollbar-track {
background: transparent;
}
.main-kanban-grid::-webkit-scrollbar-thumb {
background: #ccc;
-webkit-border-radius: 5px;
border-radius: 5px;
cursor: pointer;
-webkit-transition: .2s;
transition: .2s;
}
.main-kanban-ear-left,
.main-kanban-ear-right {
position: absolute;
top: 0;
bottom: 0;
left: -50px;
width: 50px;
opacity: 0;
pointer-events: none;
-webkit-transition: .2s;
transition: .2s;
}
.main-kanban-ear-right {
left: auto;
right: -50px;
background: url('data:image/svg+xml;charset=US-ASCII,%0A%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2042%2081%22%3E%3Cpath%20fill%3D%22%23535c69%22%20opacity%3D%220.3%22%20d%3D%22M40.024%2C0H42a0%2C0%2C0%2C0%2C1%2C0%2C0V81a0%2C0%2C0%2C0%2C1%2C0%2C0H40.977A40.977%2C40.977%2C0%2C0%2C1%2C0%2C40.024v0A40.024%2C40.024%2C0%2C0%2C1%2C40.024%2C0Z%22/%3E%3Cpath%20fill%3D%22%23ffffff%22%20d%3D%22M20.2%2C31.91l8.014%2C8.576L20.2%2C49.061a0.762%2C0.762%2C0%2C0%2C0%2C0%2C1.026l1.563%2C1.672a0.647%2C0.647%2C0%2C0%2C0%2C.958%2C0l8.014-8.576h0L32.776%2C41a0.762%2C0.762%2C0%2C0%2C0%2C0-1.025L22.72%2C29.212a0.647%2C0.647%2C0%2C0%2C0-.958%2C0L20.2%2C30.885A0.762%2C0.762%2C0%2C0%2C0%2C20.2%2C31.91Z%22/%3E%3C/svg%3E%0A') center right no-repeat;
}
.main-kanban-ear-left {
background: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2042%2081%22%3E%3Cpath%20fill%3D%22%23535c69%22%20opacity%3D%220.3%22%20d%3D%22M0%2C0H1.023A40.977%2C40.977%2C0%2C0%2C1%2C42%2C40.977v0A40.024%2C40.024%2C0%2C0%2C1%2C1.977%2C81H0a0%2C0%2C0%2C0%2C1%2C0%2C0V0A0%2C0%2C0%2C0%2C1%2C0%2C0Z%22/%3E%3Cpath%20fill%3D%22%23ffffff%22%20d%3D%22M20.8%2C49.09l-8.014-8.576L20.8%2C31.939a0.762%2C0.762%2C0%2C0%2C0%2C0-1.026l-1.563-1.673a0.647%2C0.647%2C0%2C0%2C0-.959%2C0l-8.014%2C8.576h0L8.224%2C40a0.762%2C0.762%2C0%2C0%2C0%2C0%2C1.026L18.28%2C51.788a0.647%2C0.647%2C0%2C0%2C0%2C.959%2C0L20.8%2C50.116A0.761%2C0.761%2C0%2C0%2C0%2C20.8%2C49.09Z%22/%3E%3C/svg%3E') center left no-repeat;
}
.main-kanban-left-ear-shown .main-kanban-ear-left,
.main-kanban-right-ear-shown .main-kanban-ear-right {
opacity: .6;
z-index: 99;
pointer-events: auto;
}
.main-kanban-right-ear-shown .main-kanban-ear-right {
right: 0;
}
.main-kanban-left-ear-shown .main-kanban-ear-left {
left: 0;
}
.main-kanban-left-ear-shown .main-kanban-ear-left:hover,
.main-kanban-right-ear-shown .main-kanban-ear-right:hover {
opacity: .8;
}
.main-kanban-ear-shown {
opacity: .5;
z-index: 99;
pointer-events: auto;
}
.main-kanban-column {
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
min-width: 240px;
max-width: 340px;
padding: 0 3px;
position: relative;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
transform: translateZ(0);
}
.main-kanban-column:hover {
z-index: 99;
}
.main-kanban-column:first-child {
padding-left: 0;
}
.main-kanban-column:before {
content: '';
position: absolute;
left: 3px;
top: 30px;
bottom: 5px;
width: 2px;
border-left: 1px dashed #d7dee1;
z-index: 9;
}
.main-kanban-column:first-child:before {
left: 0;
}
.main-kanban-column.--animate-slide-left {
animation: main-kanban-column--animate-slide-left .4s ease-out forwards;
}
@keyframes main-kanban-column--animate-slide-left {
0% {
opacity: 0;
transform: translateX(-100%);
z-index: -9;
}
100% {
opacity: 1;
transform: translateX(0);
z-index: -9;
}
}
.main-kanban-column.--animate-slide-left:before {
opacity: 0;
animation: main-kanban-column--animate-slide-left-before .2s linear forwards;
animation-delay: .5s;
}
@keyframes main-kanban-column--animate-slide-left-before {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
.main-kanban-column-draggable {
z-index: 1000;
background: #fff;
opacity: .6;
}
.main-kanban-column-disabled {
opacity: 0.6;
pointer-events: none;
}
.main-kanban-column-header:after {
bottom: -55px;
background: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2012.969%207.938%22%20height%3D%228px%22%20width%3D%2214px%22%3E%3Cpath%20opacity%3D%220.17%22%20fill-rule%3D%22evenodd%22%20d%3D%22M307.5%2C151.03l-1.308%2C1.332-5.175%2C5.266%2C1.309%2C1.332%2C5.174-5.267%2C5.175%2C5.267%2C1.308-1.332-5.174-5.266L307.5%2C151.03%22%20transform%3D%22translate%28-301%20-151.031%29%22/%3E%3C/svg%3E') center 10px no-repeat, -webkit-linear-gradient(to bottom, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, .9) 50%, rgba(255, 255, 255, 0) 100%);
background: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2012.969%207.938%22%20height%3D%228px%22%20width%3D%2214px%22%3E%3Cpath%20opacity%3D%220.17%22%20fill-rule%3D%22evenodd%22%20d%3D%22M307.5%2C151.03l-1.308%2C1.332-5.175%2C5.266%2C1.309%2C1.332%2C5.174-5.267%2C5.175%2C5.267%2C1.308-1.332-5.174-5.266L307.5%2C151.03%22%20transform%3D%22translate%28-301%20-151.031%29%22/%3E%3C/svg%3E') center 10px no-repeat, -moz-linear-gradient(to bottom, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, .9) 50%, rgba(255, 255, 255, 0) 100%);
background: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2012.969%207.938%22%20height%3D%228px%22%20width%3D%2214px%22%3E%3Cpath%20opacity%3D%220.17%22%20fill-rule%3D%22evenodd%22%20d%3D%22M307.5%2C151.03l-1.308%2C1.332-5.175%2C5.266%2C1.309%2C1.332%2C5.174-5.267%2C5.175%2C5.267%2C1.308-1.332-5.174-5.266L307.5%2C151.03%22%20transform%3D%22translate%28-301%20-151.031%29%22/%3E%3C/svg%3E') center 10px no-repeat, linear-gradient(to bottom, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, .9) 50%, rgba(255, 255, 255, 0) 100%);
}
.main-kanban-column-top-button-shown .main-kanban-column-header:after,
.main-kanban-column-bottom-button-shown:after {
opacity: 1;
z-index: 999;
}
.main-kanban-column-title-info {
display: -ms-flexbox;
display: flex;
position: relative;
z-index: 9;
margin: 0 18px 0 12px;
}
.main-kanban-column-title-text {
display: -ms-flexbox;
display: flex;
-ms-flex: 1;
flex: 1;
overflow: hidden;
margin: 0 4px 0 0;
vertical-align: middle;
height: 32px;
line-height: 32px;
font-family: var(--ui-font-family-secondary, var(--ui-font-family-open-sans));
font-weight: var(--ui-font-weight-semi-bold, 600);
font-size: 12px;
color: #000;
white-space: nowrap;
text-overflow: ellipsis;
pointer-events: none;
}
.main-kanban-column-title-text-inner {
display: inline-block;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.main-kanban-column-total-item {
-ms-flex: 1;
flex: 1;
height: 32px;
margin: 0 0 0 2px;
line-height: 32px;
font-size: 11px;
color: #000;
opacity: .7;
font-family: var(--ui-font-family-secondary, var(--ui-font-family-open-sans));
font-weight: var(--ui-font-weight-regular, 400);
}
.main-kanban-column-title-dark .main-kanban-column-total-item,
.main-kanban-column-title-dark .main-kanban-column-title-text { color: #fff }
.main-kanban-column-total-item:before { content: '(' }
.main-kanban-column-total-item:after { content: ')' }
.main-kanban-column-edit {
display: inline-block;
width: 0;
height: 32px;
background: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2210%22%20height%3D%2210%22%20viewBox%3D%220%200%2010%2010%22%3E%0A%20%20%3Cpath%20fill%3D%22%23535C69%22%20d%3D%22M907.061669%2C258%20L908.990291%2C259.928622%20L902.07275%2C266.844782%20L900.144127%2C264.91616%20L907.061669%2C258%20Z%20M899.007124%2C267.723439%20C898.987783%2C267.79666%20899.008506%2C267.874026%20899.061004%2C267.927906%20C899.114884%2C267.981786%20899.19225%2C268.002509%20899.265471%2C267.981786%20L901.551911%2C267.365621%20L899.623289%2C265.436999%20L899.007124%2C267.723439%20Z%22%20transform%3D%22translate%28-899%20-258%29%22/%3E%0A%3C/svg%3E%0A') center center no-repeat;
background-size: 11px 11px;
cursor: pointer;
opacity: 0;
-webkit-transition: .3s;
transition: .3s;
}
.main-kanban-column-title-dark .main-kanban-column-edit {
background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2210%22%20height%3D%2210%22%20viewBox%3D%220%200%2010%2010%22%3E%0A%20%20%3Cpath%20fill%3D%22%23ffffff%22%20d%3D%22M907.061669%2C258%20L908.990291%2C259.928622%20L902.07275%2C266.844782%20L900.144127%2C264.91616%20L907.061669%2C258%20Z%20M899.007124%2C267.723439%20C898.987783%2C267.79666%20899.008506%2C267.874026%20899.061004%2C267.927906%20C899.114884%2C267.981786%20899.19225%2C268.002509%20899.265471%2C267.981786%20L901.551911%2C267.365621%20L899.623289%2C265.436999%20L899.007124%2C267.723439%20Z%22%20transform%3D%22translate%28-899%20-258%29%22/%3E%0A%3C/svg%3E%0A');
}
.main-kanban-column-title:hover .main-kanban-column-edit {
width: 19px;
opacity: .4;
}
.main-kanban-column:last-child .main-kanban-column-edit {
right: 12px;
}
.main-kanban-column-title:hover .main-kanban-column-edit:hover {
opacity: 1;
}
.main-kanban-column-title-edit {
display: block;
position: relative;
z-index: 9;
margin: 0 0 0 5px;
}
.main-kanban-column-title-input-edit {
display: inline-block;
width: calc(100% - 70px);
margin: 0 5px 0 0;
vertical-align: middle;
background: #fff;
border: 1px solid #eaecef;
height: 26px;
padding: 0 6px;
font-family: var(--ui-font-family-secondary, var(--ui-font-family-open-sans));
font-weight: var(--ui-font-weight-bold, 700);
font-size: 12px;
color: #525c68;
}
.main-kanban-column-title-add-column {
position: absolute;
top: 0;
bottom: 0;
right: -9px;
width: 30px;
opacity: 0;
-webkit-transform: translateX(5px);
transform: translateX(5px);
-webkit-transition: .2s;
transition: .2s;
cursor: pointer;
z-index: 9;
}
.main-kanban-column:hover .main-kanban-column-title-add-column,
.main-kanban-column:last-of-type .main-kanban-column-title-add-column {
opacity: .7;
}
.main-kanban-column:last-child .main-kanban-column-title-add-column {
width: 18px;
right: 10px;
}
.main-kanban-column-title-add-column-before,
.main-kanban-column-title-add-column-after {
content: '';
position: absolute;
width: 18px;
height: 18px;
left: 0;
top: 50%;
background: #fff;
box-shadow: 0 1px 2px 0 rgba(0,0,0,0.15);
-webkit-border-radius: 100%;
border-radius: 100%;
-webkit-transition: .1s;
transition: .1s;
-webkit-transform: translateY(-50%) scale(1, 1);
transform: translateY(-50%) scale(1, 1);
}
.main-kanban-column-title-add-column-after {
content: '';
opacity: .5;
box-shadow: none;
background: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2010%2010%22%3E%0A%20%20%3Cpath%20fill%3D%22%2380868E%22%20fill-rule%3D%22evenodd%22%20d%3D%22M109%2C16%20L109%2C12%20L107%2C12%20L107%2C16%20L103%2C16%20L103%2C18%20L107%2C18%20L107%2C22%20L109%2C22%20L109%2C18%20L113%2C18%20L113%2C16%20L109%2C16%20Z%22%20transform%3D%22translate%28-103%20-12%29%22/%3E%0A%3C/svg%3E') center center no-repeat;
background-size: 10px 10px;
}
.main-kanban-column-title-add-column:hover .main-kanban-column-title-add-column-after {
opacity: 1;
}
.main-kanban-column-title-add-column.--pulse .main-kanban-column-title-add-column-before {
animation: main-kanban-column-title-add-column--bg-round 1.5s linear infinite;
}
.main-kanban-column-title-add-column.--pulse .main-kanban-column-title-add-column-after {
animation: main-kanban-column-title-add-column--bg-plus 1.5s linear infinite;
}
@keyframes main-kanban-column-title-add-column--bg-round {
0% {
transform: translateY(-50%) scale(1, 1);
opacity: .5;
}
10% {
transform: translateY(-50%) scale(1, 1);
opacity: .5;
}
50% {
transform: translateY(-50%) scale(1.15, 1.15);
opacity: 1;
}
90% {
transform: translateY(-50%) scale(1, 1);
opacity: .5;
}
100% {
transform: translateY(-50%) scale(1, 1);
opacity: .5;
}
}
@keyframes main-kanban-column-title-add-column--bg-plus {
0% {
opacity: .5;
}
10% {
opacity: .5;
}
50% {
opacity: 1;
}
90% {
opacity: .5;
}
100% {
opacity: .5;
}
}
.main-kanban-column-title-add-column:hover .main-kanban-column-title-add-column-before,
.main-kanban-column-title-add-column:hover .main-kanban-column-title-add-column-after {
animation: none !important;
opacity: 1;
}
.main-kanban-column-title-add-column:hover .main-kanban-column-title-add-column-before {
transform: translateY(-50%) scale(1.25, 1.25);
}
.main-kanban-column:hover .main-kanban-column-title:hover .main-kanban-column-title-add-column {
opacity: 1;
}
.main-kanban-column-edit-mode .main-kanban-column-title-add-column { display: none }
.main-kanban-column-color {
display: inline-block;
vertical-align: middle;
width: 20px;
height: 32px;
background: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2012%2012%22%3E%0A%20%20%3Cpath%20fill%3D%22%23525C69%22%20fill-rule%3D%22evenodd%22%20d%3D%22M654.321749%2C269.521789%20C654.725275%2C269.53104%20655.191703%2C269.537588%20655.648332%2C269.417898%20C655.922924%2C269.34597%20655.966073%2C269.244885%20655.847247%2C268.98851%20C655.240804%2C267.680182%20654.269314%2C266.71975%20653.057555%2C265.991007%20C652.613651%2C265.72403%20652.123776%2C265.524512%20651.614918%2C265.53766%20C650.758149%2C265.5598%20650.35488%2C266.110437%20650.459853%2C267.004657%20C650.547638%2C267.752942%20650.863533%2C268.428154%20651.304256%2C269.041001%20C651.389682%2C269.159808%20651.480905%2C269.235218%20651.620202%2C269.264738%20C652.490567%2C269.448925%20653.369756%2C269.5379%20654.321749%2C269.521789%20M649.933704%2C266.634309%20C649.873522%2C266.662737%20649.855%2C266.666323%20649.84402%2C266.677445%20C648.677873%2C267.858392%20647.499208%2C269.026969%20646.351634%2C270.226157%20C645.656635%2C270.952406%20645.458079%2C271.819757%20645.912193%2C272.754463%20C646.596264%2C274.162316%20647.652153%2C275.206682%20649.053181%2C275.87966%20C649.512836%2C276.100486%20650.004764%2C276.137646%20650.502643%2C276.018787%20C650.96435%2C275.908556%20651.315646%2C275.614398%20651.641033%2C275.288433%20C652.618987%2C274.308772%20653.592939%2C273.325109%20654.564121%2C272.338639%20C654.710088%2C272.190417%20654.900384%2C272.085954%20655.036193%2C271.871312%20C654.357766%2C271.868922%20653.751425%2C271.695857%20653.173457%2C271.420045%20C652.295037%2C271.000947%20651.611018%2C270.332803%20650.980204%2C269.608113%20C650.63527%2C269.211883%20650.336204%2C268.776519%20650.158683%2C268.269746%20C649.977315%2C267.751902%20649.905178%2C267.216857%20649.933704%2C266.634309%20M649.850074%2C276.856566%20C649.293706%2C276.84903%20648.818505%2C276.602842%20648.360594%2C276.322456%20C647.538919%2C275.819373%20646.858799%2C275.145459%20646.233629%2C274.418951%20C645.737084%2C273.841913%20645.293077%2C273.221634%20645.088569%2C272.464202%20C645.039366%2C272.282043%20644.999142%2C271.515828%20645.000014%2C271.49769%20C645.031311%2C270.86473%20645.343973%2C270.362894%20645.762122%2C269.933714%20C647.136522%2C268.523262%20648.522055%2C267.123932%20649.911796%2C265.729019%20C650.241544%2C265.398065%20650.636861%2C265.168871%20651.093181%2C265.036084%20C651.255105%2C264.988946%20651.684079%2C265.001887%20651.724919%2C265.000952%20C652.220027%2C264.98957%20652.662803%2C265.167364%20653.076949%2C265.414124%20C654.250536%2C266.113452%20655.192883%2C267.068582%20655.981773%2C268.181758%20C656.435169%2C268.821474%20656.754706%2C269.515812%20656.705401%2C270.334414%20C656.688469%2C270.615631%20656.597195%2C270.884375%20656.596939%2C271.17027%20C656.596682%2C271.524091%20656.680773%2C271.864244%20656.720741%2C272.211154%20C656.751423%2C272.477611%20656.811297%2C272.740638%20656.858243%2C273.005225%20C656.858243%2C273.178445%20656.822533%2C273.714219%20656.808065%2C273.809222%20C656.716432%2C274.411675%20656.574158%2C274.739355%20656.15678%2C274.7946%20C655.91764%2C274.826251%20655.713132%2C274.740238%20655.532994%2C274.612337%20C655.02075%2C274.248589%20654.778583%2C273.883542%20655.229619%2C273.212383%20C655.34157%2C273.045814%20655.497542%2C272.923422%20655.623807%2C272.772445%20C655.827904%2C272.528439%20655.973051%2C272.259383%20655.935443%2C271.905146%20C655.880596%2C271.918191%20655.874234%2C271.96959%20655.845708%2C271.998694%20C654.564173%2C273.30536%20653.28197%2C274.611453%20651.996587%2C275.914273%20C651.582902%2C276.333578%20651.129404%2C276.689998%20650.542354%2C276.836661%20C650.424246%2C276.866181%20649.877523%2C276.856982%20649.850074%2C276.856566%22%20transform%3D%22translate%28-645%20-265%29%22/%3E%0A%3C/svg%3E%0A') center center no-repeat;
background-size: 12px 12px;
opacity: .6;
cursor: pointer;
-webkit-transition: .1s;
transition: .1s;
}
.main-kanban-column-remove-button {
display: inline-block;
vertical-align: middle;
width: 20px;
height: 32px;
background: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2010%2010%22%3E%0A%20%20%3Cpath%20fill%3D%22%23525C69%22%20d%3D%22M671%2C270%20L671%2C266%20L669%2C266%20L669%2C270%20L665%2C270%20L665%2C272%20L669%2C272%20L669%2C276%20L671%2C276%20L671%2C272%20L675%2C272%20L675%2C270%20L671%2C270%20Z%22%20transform%3D%22rotate%28-45%2016.41%20940.726%29%22%20/%3E%0A%3C/svg%3E%0A') center center no-repeat;
background-size: 10px 10px;
opacity: .6;
cursor: pointer;
-webkit-transition: .1s;
transition: .1s;
}
.main-kanban-column-remove-button:hover,
.main-kanban-column-color:hover { opacity: 1 }
.main-kanban-column-title-info {
opacity: 1;
transition: .2s;
z-index: 99;
}
.main-kanban-column-title-block-edit {
display: block;
position: relative;
opacity: 0;
margin: 0 0 0 4px;
transform: translateY(-32px);
transition: .2s;
}
.main-kanban-column-edit-mode .main-kanban-column-title-info {
opacity: 0;
}
.main-kanban-column-edit-mode .main-kanban-column-title-block-edit {
opacity: 1;
z-index: 99;
}
.main-kanban-column-top-button,
.main-kanban-column-bottom-button {
display: none;
position: absolute;
overflow: hidden;
top: 0;
height: 60px;
left: 3px;
right: 10px;
z-index: 100;
pointer-events: none;
}
.main-kanban-column-bottom-button {
top: auto;
bottom: 0;
}
.main-kanban-column-top-button-shown .main-kanban-column-top-button,
.main-kanban-column-bottom-button-shown .main-kanban-column-bottom-button {
display: block;
}
.main-kanban-drag-mode-item .main-kanban-column-top-button,
.main-kanban-drag-mode-item .main-kanban-column-bottom-button {
pointer-events: auto;
}
.main-kanban-column-top-button:before {
content: '';
position: absolute;
left: 0;
right: 0;
top: -9px;
height: 10px;
box-shadow: 0 0 10px rgba(0,0,0,.3);
opacity: 0;
transition: .2s;
-webkit-border-radius: 80%;
border-radius: 80%;
}
.main-kanban-column-top-button:after {
content: '';
position: absolute;
left: 0;
right: 0;
top: 0;
background: #d5dce0;
height: 1px;
}
.main-kanban-column-top-button-shown .main-kanban-column-top-button:before {
opacity: 1;
}
.main-kanban-column-body {
flex: 1;
padding: 1px 3px 0 1px;
margin: 0 -2px 0 0;
overflow-x: hidden;
overflow-y: auto;
position: relative;
opacity: 1;
z-index: 99;
scrollbar-arrow-color: #ccc;
scrollbar-track-color: transparent;
scrollbar-base-color: #ccc;
scrollbar-shadow-color: #fff;
scrollbar-highlight-color: #fff;
transition: .2s;
/*Firefox fix */
scrollbar-width: thin;
scrollbar-color: #ccc transparent;
}
.main-kanban-search-mode .main-kanban-column-body {
opacity: .5;
}
.main-kanban-column-body::-webkit-scrollbar {
width: 6px;
}
.main-kanban-column-body::-webkit-scrollbar-track {
background: transparent;
}
.main-kanban-column-body::-webkit-scrollbar-thumb {
background: #dde2e6;
-webkit-border-radius: 5px;
border-radius: 5px;
cursor: pointer;
opacity: .4;
-webkit-transition: .2s;
transition: .2s;
}
.main-kanban-column-body:hover::-webkit-scrollbar-thumb {
background: #d1d6da;
}
.main-kanban-column-body:hover::-webkit-scrollbar-thumb:hover {
background: #c8cdd2;
}
.main-kanban-item-drag-target,
.main-kanban-column-drag-target {
content: '';
display: block;
height: 0;
background: #e4ebee !important;
border: 0 dashed transparent;
border-radius: var(--ui-border-radius-md, 3px);
-webkit-transition: .1s;
-moz-transition: .1s;
transition: .1s;
-webkit-box-sizing: border-box;
box-sizing: border-box;
opacity: 0;
}
.main-kanban-column-drag-target { margin: 0 0 0 -1px }
.main-kanban-column-target-shown .main-kanban-column-drag-target {
border: 1px dashed #c7ced3;
margin-bottom: 7px;
opacity: 1;
}
.main-kanban-item-target-shown .main-kanban-item-drag-target {
border: 1px dashed #c7ced3;
margin-bottom: 7px;
opacity: 1;
}
.main-kanban-column-header {
position: relative;
margin: 0 -4px 5px 0;
z-index: 9;
}
.main-kanban-column:last-child .main-kanban-column-header {
margin: 0 0 5px 0;
}
.main-kanban-column-top-button-shown .main-kanban-column-header {
z-index: 999;
}
.main-kanban-column-title {
display: block;
height: 32px;
position: relative;
width: 100%;
white-space: nowrap;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.main-kanban-aha-mode .main-kanban-column-title.--animate-complete {
animation: main-kanban-column-title--animate-complete 1.4s ease-out forwards;
}
@keyframes main-kanban-column-title--animate-complete {
0% {
transform: translateY(0);
}
20% {
transform: translateY(-8px);
}
60% {
transform: translateY(-8px);
}
100% {
transform: translateY(0);
}
}
.main-kanban-column:last-child .main-kanban-column-title {
padding-right: 10px;
}
.main-kanban-column-title-wrapepr {
display: block;
}
.main-kanban-column-title-dark .main-kanban-column-title-name {
color: #fff;
}
.main-kanban-column-title-dark .main-kanban-column-title-total {
color: #f0f5f6;
}
.main-kanban-column-title-dark .main-kanban-column-title-edit {
background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2211%22%20height%3D%2211%22%20viewBox%3D%220%200%2011%2011%22%3E%3Cpath%20fill%3D%22%23FFFFFF%22%20d%3D%22M0.8%2C9.052%20L0.01%2C11.862%20L2.9%2C11.03%20C2.72219093%2C10.5765823%202.45719065%2C10.1624344%202.12%2C9.811%20C1.74496149%2C9.45885887%201.29300419%2C9.19898342%200.8%2C9.052%20L0.8%2C9.052%20Z%20M7.21%2C2.567%20L1.54%2C8.236%20C2.01127432%2C8.46113133%202.44882703%2C8.75092585%202.84%2C9.097%20C3.16135611%2C9.46816456%203.42743478%2C9.88378617%203.63%2C10.331%20C3.98%2C9.98%207.57%2C6.392%209.29%2C4.664%20C9.07328539%2C4.1783772%208.77572741%2C3.73305464%208.41%2C3.347%20C8.05892616%2C3.01445721%207.64846419%2C2.75087957%207.2%2C2.57%20L7.21%2C2.567%20Z%20M10.44%2C1.417%20C10.1600426%2C1.13941601%209.78090397%2C0.985002768%209.38667053%2C0.988006451%20C8.99243708%2C0.991010135%208.61569532%2C1.15118246%208.34%2C1.433%20L8.31%2C1.462%20L7.97%2C1.802%20C8.42191844%2C1.99228357%208.83534809%2C2.26338497%209.19%2C2.602%20C9.55192111%2C2.97960848%209.84620972%2C3.41664398%2010.06%2C3.894%20C10.27%2C3.684%2010.4%2C3.552%2010.4%2C3.552%20C10.9968031%2C2.9871271%2011.0280144%2C2.04722073%2010.47%2C1.444%20L10.44%2C1.414%20L10.44%2C1.414%20L10.44%2C1.417%20Z%22%20transform%3D%22translate%280%20-1%29%22/%3E%3C/svg%3E%0A');
}
.main-kanban-column-title-dark .main-kanban-column-color {
background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2012%2012%22%3E%0A%20%20%3Cpath%20fill%3D%22%23FFFFFF%22%20fill-rule%3D%22evenodd%22%20d%3D%22M654.321749%2C269.521789%20C654.725275%2C269.53104%20655.191703%2C269.537588%20655.648332%2C269.417898%20C655.922924%2C269.34597%20655.966073%2C269.244885%20655.847247%2C268.98851%20C655.240804%2C267.680182%20654.269314%2C266.71975%20653.057555%2C265.991007%20C652.613651%2C265.72403%20652.123776%2C265.524512%20651.614918%2C265.53766%20C650.758149%2C265.5598%20650.35488%2C266.110437%20650.459853%2C267.004657%20C650.547638%2C267.752942%20650.863533%2C268.428154%20651.304256%2C269.041001%20C651.389682%2C269.159808%20651.480905%2C269.235218%20651.620202%2C269.264738%20C652.490567%2C269.448925%20653.369756%2C269.5379%20654.321749%2C269.521789%20M649.933704%2C266.634309%20C649.873522%2C266.662737%20649.855%2C266.666323%20649.84402%2C266.677445%20C648.677873%2C267.858392%20647.499208%2C269.026969%20646.351634%2C270.226157%20C645.656635%2C270.952406%20645.458079%2C271.819757%20645.912193%2C272.754463%20C646.596264%2C274.162316%20647.652153%2C275.206682%20649.053181%2C275.87966%20C649.512836%2C276.100486%20650.004764%2C276.137646%20650.502643%2C276.018787%20C650.96435%2C275.908556%20651.315646%2C275.614398%20651.641033%2C275.288433%20C652.618987%2C274.308772%20653.592939%2C273.325109%20654.564121%2C272.338639%20C654.710088%2C272.190417%20654.900384%2C272.085954%20655.036193%2C271.871312%20C654.357766%2C271.868922%20653.751425%2C271.695857%20653.173457%2C271.420045%20C652.295037%2C271.000947%20651.611018%2C270.332803%20650.980204%2C269.608113%20C650.63527%2C269.211883%20650.336204%2C268.776519%20650.158683%2C268.269746%20C649.977315%2C267.751902%20649.905178%2C267.216857%20649.933704%2C266.634309%20M649.850074%2C276.856566%20C649.293706%2C276.84903%20648.818505%2C276.602842%20648.360594%2C276.322456%20C647.538919%2C275.819373%20646.858799%2C275.145459%20646.233629%2C274.418951%20C645.737084%2C273.841913%20645.293077%2C273.221634%20645.088569%2C272.464202%20C645.039366%2C272.282043%20644.999142%2C271.515828%20645.000014%2C271.49769%20C645.031311%2C270.86473%20645.343973%2C270.362894%20645.762122%2C269.933714%20C647.136522%2C268.523262%20648.522055%2C267.123932%20649.911796%2C265.729019%20C650.241544%2C265.398065%20650.636861%2C265.168871%20651.093181%2C265.036084%20C651.255105%2C264.988946%20651.684079%2C265.001887%20651.724919%2C265.000952%20C652.220027%2C264.98957%20652.662803%2C265.167364%20653.076949%2C265.414124%20C654.250536%2C266.113452%20655.192883%2C267.068582%20655.981773%2C268.181758%20C656.435169%2C268.821474%20656.754706%2C269.515812%20656.705401%2C270.334414%20C656.688469%2C270.615631%20656.597195%2C270.884375%20656.596939%2C271.17027%20C656.596682%2C271.524091%20656.680773%2C271.864244%20656.720741%2C272.211154%20C656.751423%2C272.477611%20656.811297%2C272.740638%20656.858243%2C273.005225%20C656.858243%2C273.178445%20656.822533%2C273.714219%20656.808065%2C273.809222%20C656.716432%2C274.411675%20656.574158%2C274.739355%20656.15678%2C274.7946%20C655.91764%2C274.826251%20655.713132%2C274.740238%20655.532994%2C274.612337%20C655.02075%2C274.248589%20654.778583%2C273.883542%20655.229619%2C273.212383%20C655.34157%2C273.045814%20655.497542%2C272.923422%20655.623807%2C272.772445%20C655.827904%2C272.528439%20655.973051%2C272.259383%20655.935443%2C271.905146%20C655.880596%2C271.918191%20655.874234%2C271.96959%20655.845708%2C271.998694%20C654.564173%2C273.30536%20653.28197%2C274.611453%20651.996587%2C275.914273%20C651.582902%2C276.333578%20651.129404%2C276.689998%20650.542354%2C276.836661%20C650.424246%2C276.866181%20649.877523%2C276.856982%20649.850074%2C276.856566%22%20transform%3D%22translate%28-645%20-265%29%22/%3E%0A%3C/svg%3E%0A');
}
.main-kanban-column-title-dark .main-kanban-column-remove-button {
background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2010%2010%22%3E%0A%20%20%3Cpath%20fill%3D%22%23FFFFFF%22%20d%3D%22M671%2C270%20L671%2C266%20L669%2C266%20L669%2C270%20L665%2C270%20L665%2C272%20L669%2C272%20L669%2C276%20L671%2C276%20L671%2C272%20L675%2C272%20L675%2C270%20L671%2C270%20Z%22%20transform%3D%22rotate%28-45%2016.41%20940.726%29%22%20/%3E%0A%3C/svg%3E%0A');
}
.main-kanban-column-title-bg {
position: absolute;
left: 0;
top: 0;
bottom: 0;
right: 13px;
z-index: -999;
background: #ace9fb;
border-radius: var(--ui-border-radius-2xs, 3px);
border-top-right-radius: 0;
border-bottom-right-radius: 0;
}
.main-kanban-column-title-right {
content: '';
width: 14px;
height: 32px;
position: absolute;
right: 0;
top: 0;
}
.main-kanban-column:last-child .main-kanban-column-title-right {
display: none;
}
.main-kanban-column:last-child .main-kanban-column-title-bg {
right: 1px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
}
.main-kanban-column-title-input {
position: absolute;
height: 26px;
left: 3px;
top: 3px;
border: none;
border-radius: 2px;
background: #fff;
width: calc(100% - 37px);
padding: 0 4px;
z-index: 99;
color: #404956;
opacity: 1;
font-size: 13px;
font-family: var(--ui-font-family-secondary, var(--ui-font-family-open-sans));
font-weight: var(--ui-font-weight-semi-bold, 600);
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
-webkit-transition: .2s;
-moz-transition: .2s;
transition: .2s;
}
.main-kanban-column-title-input::selection {
background: #def2f4
}
.main-kanban-column-title-input::-moz-selection {
background: #def2f4
}
.main-kanban-column-title-input:disabled {
width: 0;
opacity: 0;
}
.main-kanban-column-title-edit {
position: absolute;
width: 32px;
height: 32px;
background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMSAxMSI+ICA8cGF0aCBmaWxsPSIjNTM1QzY5IiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0wLjgsOS4wNTIgTDAuMDEsMTEuODYyIEwyLjksMTEuMDMgQzIuNzIyMTkwOTMsMTAuNTc2NTgyMyAyLjQ1NzE5MDY1LDEwLjE2MjQzNDQgMi4xMiw5LjgxMSBDMS43NDQ5NjE0OSw5LjQ1ODg1ODg3IDEuMjkzMDA0MTksOS4xOTg5ODM0MiAwLjgsOS4wNTIgTDAuOCw5LjA1MiBaIE03LjIxLDIuNTY3IEwxLjU0LDguMjM2IEMyLjAxMTI3NDMyLDguNDYxMTMxMzMgMi40NDg4MjcwMyw4Ljc1MDkyNTg1IDIuODQsOS4wOTcgQzMuMTYxMzU2MTEsOS40NjgxNjQ1NiAzLjQyNzQzNDc4LDkuODgzNzg2MTcgMy42MywxMC4zMzEgQzMuOTgsOS45OCA3LjU3LDYuMzkyIDkuMjksNC42NjQgQzkuMDczMjg1MzksNC4xNzgzNzcyIDguNzc1NzI3NDEsMy43MzMwNTQ2NCA4LjQxLDMuMzQ3IEM4LjA1ODkyNjE2LDMuMDE0NDU3MjEgNy42NDg0NjQxOSwyLjc1MDg3OTU3IDcuMiwyLjU3IEw3LjIxLDIuNTY3IFogTTEwLjQ0LDEuNDE3IEMxMC4xNjAwNDI2LDEuMTM5NDE2MDEgOS43ODA5MDM5NywwLjk4NTAwMjc2OCA5LjM4NjY3MDUzLDAuOTg4MDA2NDUxIEM4Ljk5MjQzNzA4LDAuOTkxMDEwMTM1IDguNjE1Njk1MzIsMS4xNTExODI0NiA4LjM0LDEuNDMzIEw4LjMxLDEuNDYyIEw3Ljk3LDEuODAyIEM4LjQyMTkxODQ0LDEuOTkyMjgzNTcgOC44MzUzNDgwOSwyLjI2MzM4NDk3IDkuMTksMi42MDIgQzkuNTUxOTIxMTEsMi45Nzk2MDg0OCA5Ljg0NjIwOTcyLDMuNDE2NjQzOTggMTAuMDYsMy44OTQgQzEwLjI3LDMuNjg0IDEwLjQsMy41NTIgMTAuNCwzLjU1MiBDMTAuOTk2ODAzMSwyLjk4NzEyNzEgMTEuMDI4MDE0NCwyLjA0NzIyMDczIDEwLjQ3LDEuNDQ0IEwxMC40NCwxLjQxNCBMMTAuNDQsMS40MTQgTDEwLjQ0LDEuNDE3IFoiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAgLTEpIi8+PC9zdmc+);
background-position: center center;
background-repeat: no-repeat;
background-size: 11px 11px;
right: 2px;
top: 0;
opacity: 0;
z-index: 9;
cursor: pointer;
-webkit-transform: translate(3px, 0);
-moz-transform: translate(3px, 0);
transform: translate(3px, 0);
-webkit-transition: .2s;
-moz-transition: .2s;
transition: .2s;
}
.main-kanban-column-title-save {
background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxNCAxMCI+ICA8cGF0aCBmaWxsPSIjNTM1QzY5IiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xMS41OTMsMC4xIEw0LjY4LDcuMDEyIEwxLjY3Miw0LjAwNCBDMS41NDA2OTUwMSwzLjg3NDExMDYzIDEuMzI5MzA0OTksMy44NzQxMTA2MyAxLjE5OCw0LjAwNCBMMC4wOTgsNS4xMDQgQy0wLjAzMTg4OTM3Miw1LjIzNTMwNDk5IC0wLjAzMTg4OTM3Miw1LjQ0NjY5NTAxIDAuMDk4LDUuNTc4IEwzLjM0NCw4LjgyNCBMNC40NDQsOS45MjQgQzQuNTc1NjQ2MjgsMTAuMDU0MDA2OSA0Ljc4NzM1MzcyLDEwLjA1NDAwNjkgNC45MTksOS45MjQgTDYuMDE5LDguODI0IEw2LjAxOSw4LjgyNCBMMTMuMTcsMS42NzMgQzEzLjMwMDU1MDIsMS41NDE1NzcyNCAxMy4zMDA1NTAyLDEuMzI5NDIyNzYgMTMuMTcsMS4xOTggTDEyLjA3LDAuMDk4IEMxMi4wMDY1MTg1LDAuMDM0OTM5MDU4OSAxMS45MjA1NjQsLTAuMDAwMjg2NjA5NDQ2IDExLjgzMTA4NTMsOC44NTYzMzY0NWUtMDUgQzExLjc0MTYwNjYsMC4wMDA0NjM3MzYxNzUgMTEuNjU1OTUwNCwwLjAzNjQwODk0NiAxMS41OTMsMC4xIEwxMS41OTMsMC4xIFoiLz48L3N2Zz4=);
opacity: 1 !important;
-webkit-transform: translate(0, 0);
-moz-transform: translate(0, 0);
transform: translate(0, 0);
}
.main-kanban-column-title:hover .main-kanban-column-title-edit {
opacity: .3;
-webkit-transform: translate(0, 0);
-moz-transform: translate(0, 0);
transform: translate(0, 0);
}
.main-kanban-column-title:hover .main-kanban-column-title-edit:hover {
opacity: .9;
}
.main-kanban-column:last-child .main-kanban-column-title:before {
display: none;
}
.main-kanban-column-title-name {
float: left;
max-width: calc(100% - 35px);
overflow: hidden;
height: 32px;
line-height: 32px;
font-family: var(--ui-font-family-secondary, var(--ui-font-family-open-sans));
font-weight: var(--ui-font-weight-semi-bold, 600);
color: #404956;
font-size: 13px;
white-space: nowrap;
-ms-text-overflow: ellipsis;
text-overflow: ellipsis;
}
.main-kanban-column-title-total {
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
position: relative;
line-height: 32px;
font-size: 11px;
color: #5e8589;
padding: 0 0 0 4px;
z-index: 9;
}
.main-kanban-column-title-total:before {
content: '(';
}
.main-kanban-column-title-total:after {
content: ')';
}
.main-kanban-column-subtitle {
overflow: hidden;
position: relative;
font-family: var(--ui-font-family-secondary, var(--ui-font-family-open-sans));
font-weight: var(--ui-font-weight-light);
min-height: 25px;
line-height: 70px;
color: #525c68;
text-align: center;
z-index: 9;
}
.main-kanban-column-subtitle-box {
/*min-height: 35px;*/
/*padding-top: 5px;*/
padding: 6px 1px 0 6px;
}
.main-kanban-column-add-item-button {
display: flex;
width: calc(100% - 8px);
align-items: center;
justify-content: center;
white-space: nowrap;
line-height: normal;
height: 30px;
margin: 0 7px 0 3px;
cursor: pointer;
background-color: transparent;
transition: .2s;
border-radius: var(--ui-border-radius-3xl);
}
.main-kanban-column-add-item-button.--pulse {
animation: kanban-column-add-item-button--pulse 3s infinite forwards;
}
.bitrix24-light-theme .main-kanban-column-add-item-button.--pulse {
animation: kanban-column-add-item-button--pulse-white 3s infinite forwards;
}
@keyframes kanban-column-add-item-button--pulse {
0% {
background-color: var(--graphite_alpha_15);
}
35% {
background-color: var(--graphite_alpha_15);
}
45% {
background-color: var(--graphite_alpha_08);
}
55% {
background-color: var(--graphite_alpha_15);
}
65% {
background-color: var(--graphite_alpha_08);
}
75% {
background-color: var(--graphite_alpha_15);
}
100% {
background-color: var(--graphite_alpha_15);
}
}
@keyframes kanban-column-add-item-button--pulse-white {
0% {
background-color: var(--white_alpha_30);
}
35% {
background-color: var(--white_alpha_30);
}
45% {
background-color: var(--white_alpha_15);
}
55% {
background-color: var(--white_alpha_30);
}
65% {
background-color: var(--white_alpha_15);
}
75% {
background-color: var(--white_alpha_30);
}
100% {
background-color: var(--white_alpha_30);
}
}
.main-kanban-column:hover .main-kanban-column-add-item-button,
.main-kanban-column-add-item-button.--hover,
.main-kanban-column-add-item-button:hover {
/*background-color: var(--graphite_alpha_08);*/
background-color: var(--white_alpha_40);
}
.bitrix24-light-theme .main-kanban-column:hover .main-kanban-column-add-item-button,
.bitrix24-light-theme .main-kanban-column-add-item-button.--hover {
background-color: var(--white_alpha_15);
}
.bitrix24-light-theme .main-kanban-column .main-kanban-column-add-item-button:hover {
background-color: var(--white_alpha_40);
}
.bitrix24-default-theme .main-kanban-column:hover .main-kanban-column-add-item-button,
.bitrix24-default-theme .main-kanban-column-add-item-button.--hover,
.bitrix24-dark-theme .main-kanban-column:hover .main-kanban-column-add-item-button,
.bitrix24-dark-theme .main-kanban-column-add-item-button.--hover {
background: var(--graphite_alpha_08);
}
.bitrix24-default-theme .main-kanban-column .main-kanban-column-add-item-button:hover,
.bitrix24-dark-theme .main-kanban-column .main-kanban-column-add-item-button:hover {
background: var(--graphite_alpha_14);
}
.main-kanban-column-add-item-button:before {
content: '';
display: inline-block;
vertical-align: middle;
width: 18px;
height: 18px;
background: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2010%2010%22%3E%0A%20%20%3Cpath%20fill%3D%22%23525C69%22%20fill-rule%3D%22evenodd%22%20d%3D%22M109%2C16%20L109%2C12%20L107%2C12%20L107%2C16%20L103%2C16%20L103%2C18%20L107%2C18%20L107%2C22%20L109%2C22%20L109%2C18%20L113%2C18%20L113%2C16%20L109%2C16%20Z%22%20transform%3D%22translate%28-103%20-12%29%22%20opacity%3D%221%22/%3E%0A%3C/svg%3E') center center no-repeat;
background-size: 10px 10px;
-webkit-border-radius: 100%;
border-radius: 100%;
}
.main-kanban-column-add-item-button-text {
display: inline-block;
overflow: hidden;
width: 0;
vertical-align: middle;
font-family: var(--ui-font-family-secondary, var(--ui-font-family-open-sans));
font-weight: var(--ui-font-weight-semi-bold, 600);
font-size: 13px;
color: var(--graphite);
transition: .3s;
}
.main-kanban-column-add-item-button.--hover .main-kanban-column-add-item-button-text {
width: auto;
}
.bitrix24-light-theme .main-kanban-column-add-item-button-text {
color: var(--white);
}
.main-kanban-column-subtitle-total {
width: 100%;
overflow: hidden;
display: inline-block;
font-size: 26px;
white-space: nowrap;
-ms-text-overflow: ellipsis;
text-overflow: ellipsis;
padding: 0 10px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.main-kanban-item-aha-cursor {
position: absolute;
bottom: 15px;
right: 10px;
width: 20px;
height: 20px;
z-index: 9;
}
.main-kanban-item-aha-cursor-round {
position: absolute;
width: 16px;
height: 16px;
top: 50%;
left: 50%;
margin: -8px 0 0 -8px;
background: #2fc6f6;
border-radius: 100%;
opacity: 0;
animation: main-kanban-item-aha-cursor-round 2.5s infinite cubic-bezier(0.36, 0.6, 0.54, 0.85) forwards;
animation-delay: 2s;
}
@keyframes main-kanban-item-aha-cursor-round {
0% {
opacity: 0;
transform: translateX(0) rotate(0deg);
}
5% {
opacity: 0;
transform: translateX(0) rotate(0deg);
}
15% {
opacity: 1;
transform: translateX(0) rotate(0deg);
}
20% {
transform: translateX(0) rotate(0deg);
}
50% {
transform: translateX(30px) rotate(0deg);
}
80% {
transform: translateX(0) rotate(0deg);
}
85% {
opacity: 1;
transform: translateX(0) rotate(0deg);
}
95% {
opacity: 0;
transform: translateX(0) rotate(0deg);
}
100% {
opacity: 0;
transform: translateX(0) rotate(0deg);
}
}
.main-kanban-item-aha-cursor:before {
content: '';
position: absolute;
top: 1px;
left: 0;
width: 35px;
height: 35px;
background: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%2254%22%20height%3D%2261%22%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22c%22%20x1%3D%2250%25%22%20x2%3D%2250%25%22%20y1%3D%220%25%22%20y2%3D%2298.338%25%22%3E%3Cstop%20offset%3D%220%25%22%20stop-color%3D%22%23FFF%22%2F%3E%3Cstop%20offset%3D%22100%25%22%20stop-color%3D%22%23F5FCFF%22%2F%3E%3C%2FlinearGradient%3E%3Cfilter%20id%3D%22a%22%20width%3D%22131.9%25%22%20height%3D%22127.6%25%22%20x%3D%22-15.9%25%22%20y%3D%22-9.8%25%22%20filterUnits%3D%22objectBoundingBox%22%3E%3CfeOffset%20dy%3D%222%22%20in%3D%22SourceAlpha%22%20result%3D%22shadowOffsetOuter1%22%2F%3E%3CfeGaussianBlur%20in%3D%22shadowOffsetOuter1%22%20result%3D%22shadowBlurOuter1%22%20stdDeviation%3D%222%22%2F%3E%3CfeColorMatrix%20in%3D%22shadowBlurOuter1%22%20values%3D%220%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200.10598264%200%22%2F%3E%3C%2Ffilter%3E%3Cpath%20id%3D%22b%22%20d%3D%22M17.432%200c2.534.007%204.715%201.766%204.867%204.192l.008.216.019%201.445.028%202.013.026%201.524.026%201.299.01.4.024.994.093-.033a6.108%206.108%200%20011.642-.32l.304-.012.128-.002c2.263-.012%203.927.92%204.855%202.643l.108.21.028.059.08-.038a5.092%205.092%200%20011.776-.473l.254-.01h.12c2.298.035%203.955%201.017%204.81%202.788l.099.217.007.017.048-.015a6.64%206.64%200%20011.645-.304l.337-.01h.146c2.597.039%204.938%202.31%204.96%205.152.014%202.08.018%203.502.011%205.062l-.001.363-.026%203.68c-.007%201.21-.008%202.27-.003%203.492l.003.626.015%201.972c.035%203.821-1.735%207.263-4.663%209.95-2.379%202.184-5.386%203.672-7.393%203.697-.332.004-.636.006-.967.008h-.343l-6.322-.025c-.75-.001-1.44%200-2.127.003l-.517.003-1.238.01c-2.583.028-4.602-1.313-6.758-4.03l-.232-.297-.218-.287c-.785-1.048-3.914-5.797-4.975-7.28l-.102-.142-.207-.282a41.358%2041.358%200%2000-1.235-1.589c-.262-.32-.4-.487-.705-.826l-.141-.157-1.592-1.737C1.933%2031.742.88%2030.307.314%2028.576c-.674-2.056-.275-4.02%201.313-5.73%201.69-1.82%203.958-2.021%206.373-.701%201.231.673%202.547%201.754%203.963%203.246l.304.326.049.052-.012-7.37c-.008-5.915-.005-9.934.007-12.067v-.189l.014-1.265C12.379%202.07%2014.712-.006%2017.432%200z%22%2F%3E%3C%2Fdefs%3E%3Cg%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%20transform%3D%22translate%284.5%203.018%29%22%3E%3Cuse%20fill%3D%22%23000%22%20fill-rule%3D%22nonzero%22%20filter%3D%22url%28%23a%29%22%20xlink%3Ahref%3D%22%23b%22%2F%3E%3Cpath%20fill%3D%22url%28%23c%29%22%20stroke%3D%22%23979797%22%20d%3D%22M18.088%2048.691l-3.39-2.718-5.489-7.884-5.427-6.877-1.921-5.795%201.921-2.17%202.519-.469%203.674%202.639%203.671%203.654V4.244L15.759%201.7h3.099l2.172%201.29.392%2011.395%202.249-1.046%203.55%201.046%201.495%201.436h4.739l1.734%201.255.586%201.691%202.029-.509h2.146l1.875%201.606v1.567l.461%2017.254-1.382%204.523-5.129%204.605-5.086%201.456z%22%2F%3E%3Cpath%20fill%3D%22%23333%22%20fill-rule%3D%22nonzero%22%20d%3D%22M17.432%200c2.608.007%204.844%201.87%204.875%204.408l.019%201.445.028%202.013.026%201.524c.011.609.023%201.176.035%201.7l.025.993.093-.033a6.286%206.286%200%20011.946-.332l.128-.002c2.354-.012%204.06.996%204.963%202.853l.028.059.08-.038c.677-.31%201.353-.475%202.03-.483h.12c2.39.036%204.086%201.097%204.909%203.005l.007.017.048-.015a6.643%206.643%200%20011.982-.315h.146c2.597.04%204.938%202.312%204.96%205.153.015%202.24.018%203.717.01%205.425l-.026%203.68c-.008%201.411-.009%202.618%200%204.118l.015%201.972c.035%203.821-1.735%207.263-4.663%209.95-2.379%202.184-5.386%203.672-7.393%203.697-.442.005-.835.008-1.31.009l-6.322-.026c-.938-.002-1.78%200-2.644.006l-1.238.01c-2.675.029-4.745-1.41-6.99-4.327l-.218-.287c-.812-1.084-4.132-6.129-5.077-7.422l-.207-.282a41.358%2041.358%200%2000-1.235-1.589%2020.62%2020.62%200%2000-.846-.983l-1.592-1.737C1.933%2031.742.88%2030.307.314%2028.576c-.674-2.056-.275-4.02%201.313-5.73%201.69-1.82%203.958-2.021%206.373-.701%201.32.721%202.735%201.91%204.267%203.572l.049.052-.012-7.37c-.008-6.094-.005-10.176.008-12.256l.013-1.265C12.379%202.07%2014.712-.006%2017.432%200zm-.008%202.99l-.072.001c-1.115.032-2.017.858-2.038%201.944-.018.976-.026%204.049-.024%209.21v1.333l.025%2014.448c.003%201.434-1.819%202.05-2.686.908-2.392-3.151-4.438-5.177-6.064-6.065-1.284-.702-2.055-.634-2.747.111-.836.9-1.003%201.726-.663%202.765.407%201.24%201.358%202.506%203.445%204.775l.915.996c.623.68.846.93%201.104%201.24l.498.608c.442.55.88%201.123%201.322%201.73%201.006%201.377%204.312%206.4%205.055%207.392l.095.127c1.769%202.33%203.144%203.307%204.688%203.29%201.66-.017%203.055-.02%204.895-.013l3.962.02c.718.003%201.231.004%201.688.002l.964-.008c1.168-.015%203.525-1.18%205.408-2.91%202.347-2.154%203.722-4.826%203.695-7.72a374.031%20374.031%200%2001-.017-5.712l.02-2.765c.013-1.875.016-3.272.007-5.18l-.01-1.543c-.009-1.19-1.017-2.17-2.014-2.184a3.718%203.718%200%2000-1.606.338v5.674a1.495%201.495%200%2001-2.988.064l-.001-.064v-6.049c0-.062.003-.124.01-.184a2.281%202.281%200%2001-.02-.137c-.187-1.665-.883-2.31-2.488-2.335-.42-.007-.946.19-1.57.63l-.001%205.638a1.495%201.495%200%2001-2.989.065l-.001-.065v-6.048c0-.073.005-.145.015-.215-.26-1.738-1.013-2.404-2.613-2.395-1.212.006-1.794.395-2.108%201.095l.009-.019.001%209.11a1.495%201.495%200%2001-2.989.065l-.001-.064v-10.06c0-.07.005-.138.014-.204a49.409%2049.409%200%2001-.036-.686l-.024-.582c-.029-.786-.055-1.78-.08-2.953l-.034-1.87-.02-1.27-.037-2.823c-.01-.78-.817-1.453-1.894-1.456z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E) no-repeat center;
background-size: contain;
z-index: 9;
animation: main-kanban-item-aha-cursor 2.5s infinite cubic-bezier(0.36, 0.6, 0.54, 0.85) forwards;
animation-delay: 2s;
transform: translateX(0) rotate(-30deg) scale(1);
}
@keyframes main-kanban-item-aha-cursor {
0% {
transform: translateX(0) rotate(-30deg) scale(1);
}
5% {
transform: translateX(0) rotate(-30deg) scale(1);
}
15% {
transform: translateX(0) rotate(-30deg) scale(.88);
}
20% {
transform: translateX(0) rotate(-30deg) scale(.88);
}
50% {
transform: translateX(30px) rotate(-30deg) scale(.88);
}
80% {
transform: translateX(0) rotate(-30deg) scale(.88);
}
85% {
transform: translateX(0) rotate(-30deg) scale(.88);
}
95% {
transform: translateX(0) rotate(-30deg) scale(1);
}
100% {
transform: translateX(0) rotate(-30deg) scale(1);
}
}
.main-kanban-item-aha-cursor-round:before {
content: '';
position: absolute;
top: -4px;
right: -4px;
bottom: -4px;
left: -4px;
border: 2px solid #2fc6f6;
border-radius: 100%;
}
.main-kanban-item {
display: block;
position: relative;
padding: 0 0 6px 0;
margin: 0 1px 0 -1px;
}
.main-kanban-item-aha {
height: 106px;
opacity: 1;
position: absolute;
top: 0;
left: 5px;
right: 4px;
background: var(--graphite_alpha_08);
border: 1px dashed var(--graphite_alpha_30);
border-radius: 3px;
}
.bitrix24-light-theme .main-kanban-item-aha {
background: var(--white_alpha_15);
border: 1px dashed var(--white_alpha_70);
}
.main-kanban {
--main-kanban-item-aha: translate(-8px, -2px) scale(.8) rotate(-15deg);
}
.main-kanban-item-aha:before {
content: '';
position: absolute;
width: 56px;
height: 36px;
top: 50%;
left: 50%;
margin: -28px 0 0 -18px;
opacity: .7;
background: url("data:image/svg+xml,%0A%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='31' viewBox='0 0 56 31'%3E%3Cpath fill='%23525C69' d='M43.0324462,14.4725932 C46.193524,17.5294261 48.744023,20.8045494 50.737802,24.0810239 C51.4365373,25.2292897 52.0160771,26.2965068 52.4831105,27.2556718 L52.7101225,27.7328788 L52.8992985,28.1518066 L52.8992985,28.1518066 L52.9267598,28.2171693 L54.3055649,21.5796977 C54.3492073,21.3694011 54.5190177,21.2175908 54.7195503,21.1869056 L54.8070955,21.1813533 L54.896733,21.1917283 C55.137072,21.2416054 55.3010206,21.4562732 55.2952338,21.6932589 L55.2847024,21.7828964 L53.6477135,29.6709257 C53.5949468,29.9251884 53.3588855,30.0918733 53.1093498,30.0670368 L53.0259051,30.051522 L44.9149654,27.8890371 C44.648656,27.8160032 44.4919753,27.5409111 44.5650092,27.2746018 C44.6299283,27.0378824 44.8544982,26.8877831 45.0906387,26.9086443 L45.1794445,26.9246457 L52.0697598,28.7571693 L51.983403,28.5532234 L51.8023982,28.1524461 L51.5840277,27.6934503 L51.5840277,27.6934503 C51.1303124,26.7616373 50.5656218,25.7217649 49.8835344,24.6008573 C47.9321057,21.3939792 45.4337004,18.18575 42.337292,15.1914538 C32.4694031,5.64898442 18.9441199,0.400394742 1.18098965,1.69010929 C0.905572272,1.71010631 0.666091583,1.50304721 0.646094556,1.22762984 C0.626097529,0.952212462 0.833156632,0.712731773 1.10857401,0.692734746 C19.1639302,-0.618197236 32.9654597,4.73759191 43.0324462,14.4725932 Z'/%3E%3C/svg%3E%0A") center no-repeat;
transform: var(--main-kanban-item-aha);
animation: main-kanban-item-aha-before 2s infinite ease-in-out forwards;
animation-delay: 1s;
}
.bitrix24-light-theme .main-kanban-item-aha:before {
background-image: url("data:image/svg+xml,%0A%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='31' viewBox='0 0 56 31'%3E%3Cpath fill='%23FFF' d='M43.0324462,14.4725932 C46.193524,17.5294261 48.744023,20.8045494 50.737802,24.0810239 C51.4365373,25.2292897 52.0160771,26.2965068 52.4831105,27.2556718 L52.7101225,27.7328788 L52.8992985,28.1518066 L52.8992985,28.1518066 L52.9267598,28.2171693 L54.3055649,21.5796977 C54.3492073,21.3694011 54.5190177,21.2175908 54.7195503,21.1869056 L54.8070955,21.1813533 L54.896733,21.1917283 C55.137072,21.2416054 55.3010206,21.4562732 55.2952338,21.6932589 L55.2847024,21.7828964 L53.6477135,29.6709257 C53.5949468,29.9251884 53.3588855,30.0918733 53.1093498,30.0670368 L53.0259051,30.051522 L44.9149654,27.8890371 C44.648656,27.8160032 44.4919753,27.5409111 44.5650092,27.2746018 C44.6299283,27.0378824 44.8544982,26.8877831 45.0906387,26.9086443 L45.1794445,26.9246457 L52.0697598,28.7571693 L51.983403,28.5532234 L51.8023982,28.1524461 L51.5840277,27.6934503 L51.5840277,27.6934503 C51.1303124,26.7616373 50.5656218,25.7217649 49.8835344,24.6008573 C47.9321057,21.3939792 45.4337004,18.18575 42.337292,15.1914538 C32.4694031,5.64898442 18.9441199,0.400394742 1.18098965,1.69010929 C0.905572272,1.71010631 0.666091583,1.50304721 0.646094556,1.22762984 C0.626097529,0.952212462 0.833156632,0.712731773 1.10857401,0.692734746 C19.1639302,-0.618197236 32.9654597,4.73759191 43.0324462,14.4725932 Z'/%3E%3C/svg%3E%0A");
}
@keyframes main-kanban-item-aha-before {
0% {
opacity: .7;
transform: var(--main-kanban-item-aha);
}
10% {
opacity: .7;
transform: var(--main-kanban-item-aha);
}
50% {
opacity: 1;
transform: translate(0,0) scale(1) rotate(3deg);
}
90% {
opacity: .7;
transform: var(--main-kanban-item-aha);
}
100% {
opacity: .7;
transform: var(--main-kanban-item-aha);
}
}
.main-kanban-item.--aha-drag .main-kanban-item-wrapper {
animation: main-kanban-item--aha-drag 2.5s infinite cubic-bezier(0.36, 0.6, 0.54, 0.85) forwards;
animation-delay: 2s;
}
@keyframes main-kanban-item--aha-drag {
0% {
transform: translateX(0) rotate(0deg);
}
5% {
transform: translateX(0) rotate(0deg);
}
15% {
transform: translateX(0) rotate(4deg);
}
20% {
transform: translateX(0) rotate(4deg);
}
50% {
transform: translateX(30px) rotate(4deg);
}
80% {
transform: translateX(0) rotate(4deg);
}
85% {
transform: translateX(0) rotate(4deg);
}
95% {
transform: translateX(0) rotate(0deg);
}
100% {
transform: translateX(0) rotate(0deg);
}
}
.main-kanban-aha .main-kanban-item,
.main-kanban-column-aha .main-kanban-item{
opacity: .25;
transition: .8s;
pointer-events: none;
}
.main-kanban-aha .ui-tour-selector.main-kanban-item,
.main-kanban-column-aha .ui-tour-selector.main-kanban-item {
opacity: 1;
pointer-events: auto;
}
.main-kanban-item:hover {
z-index: 9;
}
.main-kanban-item-default {
height: 100px;
border: 1px solid #dfe0e3;
padding: 10px;
border-radius: 2px;
}
.main-kanban-item-wrapper {
position: relative;
background: var(--ui-color-background-transparent, #fff);
border-radius: var(--ui-border-radius-none, 2px);
font-family: var(--ui-font-family-secondary, var(--ui-font-family-open-sans));
font-weight: var(--ui-font-weight-regular, 400);
-moz-user-select: -moz-none;
-moz-user-select: none;
user-select: none;
-webkit-user-select: text;
}
.main-kanban-item-wrapper:hover {
-ms-transform: translateY(-1px);
transform: translateY(-1px);
}
.main-kanban-aha-mode .main-kanban-item-new .main-kanban-item-wrapper {
opacity: 0;
transform: translateY(-10px);
animation: animate-main-kanban-item-new .8s linear forwards;
background: #fdf6e3;
}
@keyframes animate-main-kanban-item-new {
0% {
opacity: 0;
background: #fdf6e3;
transform: translateY(-10px);
}
20% {
opacity: 1;
transform: translateY(-10px);
}
70% {
opacity: 1;
transform: translateY(-10px);
}
100% {
opacity: 1;
background: #fff;
transform: translateY(0px);
}
}
.main-kanban-item-wrapper:before {
content: '';
display: none;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(119,222,255,.35);
z-index: 9;
pointer-events: none;
}
.main-kanban-item-selected .main-kanban-item-wrapper:before {
display: block;
}
.main-kanban-item-checkbox {
position: absolute;
width: 18px;
height: 18px;
background: #fff;
border: 1px solid rgba(130,139,149,.67);
border-radius: 2px;
top: 9px;
right: 10px;
pointer-events: none;
opacity: 0;
transition: .05s;
z-index: 9;
}
.main-kanban-item-checkbox:before {
content: ' ';
position: absolute;
width: 11px;
height: 9px;
top: 5px;
left: 4px;
transition: .1s;
background: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20width%3D%2211px%22%20height%3D%229px%22%20viewBox%3D%220%200%2011%209%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20xmlns%3Axlink%3D%22http%3A//www.w3.org/1999/xlink%22%3E%3Cg%20transform%3D%22translate%28-429.000000%2C%20-293.000000%29%22%20fill%3D%22%23fff%22%3E%3Cg%20transform%3D%22translate%28235.000000%2C%20274.000000%29%22%3E%3Cpolygon%20points%3D%22195.763786%2021.7055734%20198.039772%2023.9815596%20203.025463%2019%20204.789249%2020.763786%20199.807689%2025.7453457%20198.039772%2027.5091317%20196.275986%2025.7453457%20194%2023.4693595%22%3E%3C/polygon%3E%3C/g%3E%3C/g%3E%3C/svg%3E') center center no-repeat;
}
.main-kanban-multiselect-mode .main-kanban-item-checkbox {
opacity: 1;
}
.main-kanban-item-selected .main-kanban-item-checkbox {
border-color: #2687E8;
background: #2687E8;
transition: .1s;
}
.main-kanban-item-selected > * {
pointer-events: none;
}
.main-kanban-item-disabled .main-kanban-item-wrapper {
opacity: .45;
pointer-events: none;
}
.main-kanban-item-waiting .main-kanban-item-wrapper {
opacity: .3;
}
.main-kanban-item-drag {
background: #fff;
z-index: 999999;
-webkit-transition: 0s;
-moz-transition: 0s;
transition: 0s;
margin: 0;
padding: 0;
pointer-events: none;
border-radius: var(--ui-border-radius-md);
-webkit-transform: rotate(4deg) translate(-30px, -20px);
-moz-transform: rotate(4deg) translate(-30px, -20px);
transform: rotate(4deg) translate(-30px, -20px);
}
.main-kanban-item-draft {
display: flex;
flex-direction: column;
justify-content: space-between;
position: relative;
height: 92px;
border: 1px solid #65d2f6;
padding: 7px 11px 7px 11px;
box-sizing: border-box;
background: #fff;
-webkit-border-radius: 2px;
border-radius: 2px;
}
.main-kanban-item-draft-info {
font-family: var(--ui-font-family-secondary, var(--ui-font-family-open-sans));
font-weight: var(--ui-font-weight-regular, 400);
font-style: italic;
color: var(--graphite_alpha_60);
font-size: 13px;
}
.main-kanban-item-draft-info span {
display: inline-block;
}
.main-kanban-item-draft-info span:before {
content: '';
display: inline-block;
vertical-align: top;
width: 12px;
height: 9px;
margin: 6px 1px 0 1px;
background: url("data:image/svg+xml,%0A%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='9' viewBox='0 0 12 9'%3E%3Cpath fill='%239AA0A8' fill-rule='evenodd' d='M7.89560765,-2.84217094e-14 L11.0291329,3.13352523 L7.86010193,6.30255618 L7.875,3.679 L3.15593627,3.67946698 C2.13895927,3.67946698 1.30536727,4.4646315 1.22828363,5.46183719 L1.22246653,5.61293671 C1.22246653,6.68076256 2.08811042,7.54640645 3.15593627,7.54640645 L3.15593627,7.54640645 L3.784,7.546 L3.784,8.668 L3.09857968,8.6686511 C1.38728138,8.6686511 -1.48894595e-14,7.28136972 -1.50990331e-14,5.57007142 C-1.53086067e-14,3.85877311 1.38728138,2.47149173 3.09857968,2.47149173 L7.881,2.471 L7.89560765,-2.84217094e-14 Z' transform='rotate(-180 5.515 4.334)'/%3E%3C/svg%3E%0A") center no-repeat;
}
.main-kanban-item-draft-textarea {
width: 100%;
height: 100%;
overflow: hidden;
word-wrap: break-word;
border: none;
outline: none;
resize: none;
font-family: var(--ui-font-family-secondary, var(--ui-font-family-open-sans));
font-weight: var(--ui-font-weight-semi-bold, 600);
color: #333;
font-size: 13px;
line-height: 15px;
}
.main-kanban-item-draft-textarea::-webkit-input-placeholder { /* Chrome/Opera/Safari */
color: #b1b6bb;
-webkit-transition: color .3s;
transition: color .3s;
}
.main-kanban-item-draft-textarea::-moz-placeholder { /* Firefox 19+ */
color: #b1b6bb;
-webkit-transition: color .3s;
transition: color .3s;
opacity: 1;
}
.main-kanban-item-draft-textarea:-ms-input-placeholder { /* IE 10+ */
color: #b1b6bb;
-webkit-transition: color .3s;
transition: color .3s;
}
.main-kanban-item-draft-textarea:-moz-placeholder { /* Firefox 18- */
color: #b1b6bb;
-webkit-transition: color .3s;
transition: color .3s;
}
.main-kanban-item-draft-textarea:disabled {
background: #fff;
}
.main-kanban-item-draft-disabled {
opacity: 0.6;
pointer-events: none;
}
.main-kanban-dropzone-area {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
position: absolute;
-webkit-box-align: end;
-ms-flex-align: end;
align-items: flex-end;
left: 0;
bottom: 0;
padding: 0;
height: 67px;
width: 100%;
line-height: 0;
opacity: 1;
pointer-events: none;
z-index: 99;
}
.main-kanban-drag-mode-column .main-kanban-dropzone-area {
display: none !important;
}
.main-kanban-dropzone[data-id="DELETED"] .main-kanban-dropzone-title:before {
content: '';
display: inline-block;
vertical-align: middle;
width: 22px;
height: 22px;
background: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2217%22%20height%3D%2217%22%20viewBox%3D%220%200%2017%2017%22%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M14.9171481%2C4.05422857%20L14.1381742%2C15.2060291%20C14.078121%2C16.0692771%2013.277699%2C16.7414692%2012.3117178%2C16.7414692%20L4.76905264%2C16.7414692%20C3.80307144%2C16.7414692%203.00264058%2C16.0692771%202.94259619%2C15.2060291%20L2.16362231%2C4.05422857%20L0.99088986%2C4.05422857%20C0.611692165%2C4.05422857%200.304574098%2C3.77952929%200.304574098%2C3.44035898%20C0.304574098%2C3.10195477%200.611692165%2C2.82648939%200.99088986%2C2.82648939%20L16.0898366%2C2.82648939%20C16.4690343%2C2.82648939%2016.7761524%2C3.10195477%2016.7761524%2C3.44035898%20C16.7761524%2C3.77952929%2016.4690343%2C4.05422857%2016.0898366%2C4.05422857%20L14.9171481%2C4.05422857%20Z%20M13.4570196%2C4.05422857%20L3.62392656%2C4.05422857%20L4.28364621%2C14.7400775%20C4.31024012%2C15.1736168%204.71087503%2C15.5135532%205.19731368%2C15.5135532%20L11.8836764%2C15.5135532%20C12.370093%2C15.5135532%2012.7707477%2C15.1736168%2012.7973438%2C14.7400775%20L13.4570196%2C4.05422857%20Z%20M8.54036325%2C6.52952285%20C8.86942124%2C6.52952285%209.13697765%2C6.73090084%209.13697765%2C6.97856837%20L9.13697765%2C13.1340931%20C9.13697765%2C13.3817606%208.86942124%2C13.5831386%208.54036325%2C13.5831386%20C8.21130525%2C13.5831386%207.94374884%2C13.3817606%207.94374884%2C13.1340931%20L7.94374884%2C6.97856837%20C7.94374884%2C6.73090084%208.21130525%2C6.52952285%208.54036325%2C6.52952285%20Z%20M5.98461271%2C6.52952285%20C6.31845507%2C6.52952285%206.59320848%2C6.72729985%206.60837941%2C6.97796821%20L6.98215281%2C13.1665788%20C6.99493157%2C13.3865927%206.76890099%2C13.5723356%206.47738186%2C13.5825538%20C6.46939524%2C13.5825538%206.46140842%2C13.5831551%206.45342119%2C13.5831551%20C6.14274415%2C13.5831551%205.88637171%2C13.4004129%205.86958554%2C13.1665799%20L5.4207344%2C6.97796928%20C5.40396214%2C6.74353613%205.64275757%2C6.54335846%205.95345505%2C6.53012409%20C5.96383794%2C6.53012409%205.97422001%2C6.52952285%205.98460249%2C6.52952285%20L5.98461271%2C6.52952285%20Z%20M11.0961138%2C6.52952285%20C11.4075882%2C6.52952285%2011.6607711%2C6.7200825%2011.6607711%2C6.95451566%20C11.6607711%2C6.96233025%2011.6607711%2C6.97014454%2011.6599723%2C6.97795897%20L11.2135133%2C13.1347148%20C11.1959424%2C13.3859833%2010.919602%2C13.5831601%2010.5849622%2C13.5831601%20C10.2734878%2C13.5831601%2010.0203049%2C13.3926005%2010.0203049%2C13.1581673%20C10.0203049%2C13.1503527%2010.0203049%2C13.1425384%2010.0211038%2C13.134724%20L10.4675627%2C6.97796821%20C10.4851336%2C6.72669969%2010.761474%2C6.52952285%2011.0961138%2C6.52952285%20Z%20M6.71048071%2C0.0812263395%20L10.3702458%2C0.0812263395%20C11.3817105%2C0.0812263395%2012.2009848%2C0.900522644%2012.2009848%2C1.9119654%20L12.2009848%2C2.82648939%20L4.87969772%2C2.82648939%20L4.87969772%2C1.9119654%20C4.87969772%2C0.900500682%205.69899403%2C0.0812263395%206.71043678%2C0.0812263395%20L6.71048071%2C0.0812263395%20Z%20M6.801417%2C1.45385786%20C6.49858154%2C1.45385786%206.25236439%2C1.70007502%206.25236439%2C2.00291047%20L6.25236439%2C2.82648939%20L10.8283885%2C2.82648939%20L10.8283885%2C2.00291047%20C10.8283885%2C1.70007502%2010.5821713%2C1.45385786%2010.2793358%2C1.45385786%20L6.801417%2C1.45385786%20Z%22%20transform%3D%22translate%280%20.158%29%22/%3E%3C/svg%3E') center top no-repeat;
margin-right: 5px;
}
.main-kanban-dropzone[data-id="DELETED"] .main-kanban-dropzone-title,
.main-kanban-dropzone[data-id="DELETED"] .main-kanban-dropzone-cancel-link {
color: #fff !important;
}
.main-kanban-dropzone[data-id="DELETED"] .main-kanban-dropzone-cancel-link {
margin-left: 24px;
}
.main-kanban-dropzone-show {
opacity: 1;
pointer-events: auto;
}
@keyframes main-kanban-dropzone-show {
from {
opacity: 0;
height: 0;
}
to {
opacity: 1;
height: 60px;
}
}
.main-kanban-dropzone {
font-family: var(--ui-font-family-secondary, var(--ui-font-family-open-sans));
font-weight: var(--ui-font-weight-regular, 400);
position: relative;
overflow : hidden;
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
height: 100%;
align-content: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
transition: .2s;
}
.main-kanban-dropzone:first-child .main-kanban-dropzone-bg {
border-top-left-radius: var(--ui-border-radius-md);
}
.main-kanban-dropzone:last-child .main-kanban-dropzone-bg {
border-top-right-radius: var(--ui-border-radius-md);
}
.main-kanban-dropzone .main-kanban-item {
position: absolute;
margin-left: 50%;
opacity: .9;
z-index: 99;
animation: main-kanban-item-remove-animate .2s linear forwards;
animation-delay: .1s;
}
@keyframes main-kanban-item-remove-animate {
from {
opacity: .7;
transform: translateY(0);
}
to {
opacity: 0;
transform: translateY(30px);
}
}
.main-kanban-dropzone-title {
display: inline-block;
position: relative;
text-align: center;
font-size: 16px;
color: #fff;
opacity: 0;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
line-height: 160px;
padding: 0 15px;
z-index: 9;
transition: 1s;
}
.main-kanban-dropzone-title-light {
color: #333;
}
.main-kanban-dropzone-bg {
position: absolute;
left: 0;
bottom: 0;
right: 0;
opacity: .8;
height: 0;
transition: 1.1s;
}
.main-kanban-dropzone[data-id="DELETED"] .main-kanban-dropzone-bg {
background: rgb(197, 197, 197) !important;
}
.main-kanban-dropzone-show .main-kanban-dropzone-title {
line-height: 60px;
opacity: 1;
transition: .1s;
}
.main-kanban-dropzone-show .main-kanban-dropzone-bg {
height: 60px;
transition: .1s;
}
.main-kanban-dropzone-show .main-kanban-dropzone-bg {
opacity: .9;
}
.main-kanban-dropzone-show .main-kanban-dropzone-bg {
opacity: .9;
}
.main-kanban-dropzone-active .main-kanban-dropzone-bg,
.main-kanban-dropzone-captured .main-kanban-dropzone-bg {
opacity: 1;
height: 68px;
border-radius: var(--ui-border-radius-md);
border-bottom-right-radius: 0;
border-bottom-left-radius: 0;
}
.main-kanban-dropzone-active .main-kanban-dropzone-title,
.main-kanban-dropzone-captured .main-kanban-dropzone-title {
transform: translateY(-7px);
transition: .1s;
}
.main-kanban-dropzone-captured {
position: relative;
z-index: 99;
animation: main-kanban-dropzone-captured .37s linear forwards;
}
@keyframes main-kanban-dropzone-captured {
0% {
transform: scale3d(1,1,1);
}
50% {
transform: scale3d(1.05,1.05,1.05);
}
100% {
transform: scale3d(1,1,1);
}
}
.main-kanban-dropzone-cancel {
position: relative;
display: none;
text-align: center;
line-height: normal;
padding-bottom: 6px;
z-index: 9;
}
.main-kanban-dropzone-cancel-link {
display: inline-block;
border-bottom: 2px solid #fff;
color: #666;
font-size: 14px;
cursor: pointer;
}
.main-kanban-dropzone-captured .main-kanban-dropzone-cancel {
display: inline-block;
}
.main-kanban-dropzone-captured .main-kanban-dropzone-cancel-link {
color: #fff;
}
.main-kanban-loader {
display: block;
overflow: hidden;
position: relative;
height: 50px;
margin: 10px 0;
-webkit-transition: .1s;
-moz-transition: .1s;
transition: .1s;
}
.main-kanban-loader-shown {
}
.main-kanban-loader-shown .main-kanban-loader-circle {
display: block;
}
.main-kanban-loader-outer {
position: absolute;
left: 50%;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
}
.main-kanban-loader-inner {
position: relative;
height: 50px;
width: 50px;
margin: auto;
}
.main-kanban-loader-inner:before {
content: '';
display: block;
padding-top: 100%;
}
.main-kanban-loader-circle {
display: none;
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
height: 50px;
width: 50px;
-webkit-animation: main-kanban-loader-rotate 2s linear infinite;
animation: main-kanban-loader-rotate 2s linear infinite;
-webkit-transform-origin: center center;
transform-origin: center center;
}
.main-kanban-loader-path {
stroke: #3bc8f5;
stroke-dasharray: 20, 200;
stroke-dashoffset: 0;
-webkit-animation: main-kanban-loader-dash 1.5s ease-in-out infinite;
animation: main-kanban-loader-dash 1.5s ease-in-out infinite;
stroke-linecap: round;
}
@keyframes main-kanban-loader-rotate {
100% {
transform: rotate(360deg);
}
}
@-webkit-keyframes main-kanban-loader-rotate {
100% {
transform: rotate(360deg);
}
}
@keyframes main-kanban-loader-dash {
0% {
stroke-dasharray: 1, 200;
stroke-dashoffset: 0;
}
50% {
stroke-dasharray: 89, 200;
stroke-dashoffset: -35px;
}
100% {
stroke-dasharray: 89, 200;
stroke-dashoffset: -124px;
}
}
@-webkit-keyframes main-kanban-loader-dash {
0% {
stroke-dasharray: 1, 200;
stroke-dashoffset: 0;
}
50% {
stroke-dasharray: 89, 200;
stroke-dashoffset: -35px;
}
100% {
stroke-dasharray: 89, 200;
stroke-dashoffset: -124px;
}
}
.main-kanban-no-data {
display: none;
overflow: hidden;
position: absolute;
min-height: 220px;
top: 32px;
left: -15px;
right: -15px;
bottom: 0;
}
.main-kanban-no-data-mode {
/*overflow: hidden;*/
}
.main-kanban-no-data-mode .main-kanban-no-data {
display: block;
}
.main-kanban-no-data-inner {
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
.main-kanban-no-data-image {
margin: auto auto 40px auto;
width: 87px;
height: 111px;
background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2087%20111%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%20%7B%20fill%3A%20%23535c69%3B%20fill-rule%3A%20evenodd%3B%20opacity%3A%200.12%3B%20%7D%3C/style%3E%3C/defs%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M86.93%2025.17l.018-.018L61.884.032l-.03.03v-.05H.012v111h86.8v-.008h.17V31.988h.034v-6.82h-.085zM61.84%209.63l15.504%2015.54H61.84V9.63zm18.336%2094.564H6.816V6.83h48.222v18.34h-.02v6.818h25.16v72.206zM56.91%2044.814L44.43%2057.32%2031.95%2044.812%2026.576%2050.2l12.48%2012.508-12.48%2012.507%205.376%205.388L44.43%2068.1l12.48%2012.508%205.377-5.388-12.48-12.508L62.288%2050.2z%22/%3E%3C/svg%3E');
background-repeat: no-repeat;
}
.bitrix24-light-theme .main-kanban-no-data-image {
background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2087%20111%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%20%7B%20fill%3A%20%23fff%3B%20fill-rule%3A%20evenodd%3B%20opacity%3A%201%3B%20%7D%3C/style%3E%3C/defs%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M86.93%2025.17l.018-.018L61.884.032l-.03.03v-.05H.012v111h86.8v-.008h.17V31.988h.034v-6.82h-.085zM61.84%209.63l15.504%2015.54H61.84V9.63zm18.336%2094.564H6.816V6.83h48.222v18.34h-.02v6.818h25.16v72.206zM56.91%2044.814L44.43%2057.32%2031.95%2044.812%2026.576%2050.2l12.48%2012.508-12.48%2012.507%205.376%205.388L44.43%2068.1l12.48%2012.508%205.377-5.388-12.48-12.508L62.288%2050.2z%22/%3E%3C/svg%3E');
}
.bitrix24-dark-theme .main-kanban-no-data-image {
background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2087%20111%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%20%7B%20fill%3A%20%23333%3B%20fill-rule%3A%20evenodd%3B%20opacity%3A%201%3B%20%7D%3C/style%3E%3C/defs%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M86.93%2025.17l.018-.018L61.884.032l-.03.03v-.05H.012v111h86.8v-.008h.17V31.988h.034v-6.82h-.085zM61.84%209.63l15.504%2015.54H61.84V9.63zm18.336%2094.564H6.816V6.83h48.222v18.34h-.02v6.818h25.16v72.206zM56.91%2044.814L44.43%2057.32%2031.95%2044.812%2026.576%2050.2l12.48%2012.508-12.48%2012.507%205.376%205.388L44.43%2068.1l12.48%2012.508%205.377-5.388-12.48-12.508L62.288%2050.2z%22/%3E%3C/svg%3E');
}
.main-kanban-no-data-text {
font: 32px var(--ui-font-family-primary, var(--ui-font-family-helvetica));
color: #c6c8cc;
text-align: center;
white-space: nowrap;
}
.bitrix24-light-theme .main-kanban-no-data-text {
color: #fff;
}
.bitrix24-dark-theme .main-kanban-no-data-text {
color: #333;
}
.main-kanban-no-data-title {
font-family: var(--ui-font-family-secondary, var(--ui-font-family-open-sans));
font-weight: var(--ui-font-weight-light, 300);
font-size: 31px;
color: #c6c8cc;
text-align: center;
margin-bottom: 21px;
}
.bitrix24-light-theme .main-kanban-no-data-title {
color: #fff;
}
.bitrix24-dark-theme .main-kanban-no-data-title {
color: #333;
}
.main-kanban-no-data-description {
font-family: var(--ui-font-family-secondary, var(--ui-font-family-open-sans));
font-weight: var(--ui-font-weight-light, 300);
font-size: 16px;
color: #c6c8cc;
text-align: center;
max-width: 525px;
line-height: normal;
}
.bitrix24-light-theme .main-kanban-no-data-description {
color: #fff;
}
.bitrix24-dark-theme .main-kanban-no-data-description {
color: #333;
}
.main-kanban-loader-container {
display: none;
position: absolute;
top: 50%;
left: 50%;
width: 110px;
height: 110px;
margin-left: -55px;
margin-top: -55px;
z-index: 1001;
}
.main-kanban-faded .main-kanban-loader-container {
display: block;
}
.main-kanban-loader-circular {
position: absolute;
top: 50%;
left: 0;
right: 0;
bottom: 0;
height: 110px;
width: 110px;
margin-top: -55px;
-webkit-animation: rotate 2s linear infinite;
animation: rotate 2s linear infinite;
-webkit-transform-origin: center center;
transform-origin: center center;
}
.main-kanban-loader-path {
stroke: #bfc3c8;
stroke-width: 1.5;
stroke-dasharray: 20, 200;
stroke-dashoffset: 0;
-webkit-animation: dash 1.5s ease-in-out infinite;
animation: dash 1.5s ease-in-out infinite;
stroke-linecap: round;
}
.main-kanban-faded .main-kanban-grid {
opacity: .5;
pointer-events: none;
}
.main-kanban-faded .main-kanban-no-data,
.main-kanban-faded .main-kanban-ear-left,
.main-kanban-faded .main-kanban-ear-right {
display: none;
}
.main-kanban-faded .main-kanban-grid {
opacity: 0.5;
pointer-events: none;
}
.main-kanban-faded .main-kanban-no-data,
.main-kanban-faded .main-kanban-ear-left,
.main-kanban-faded .main-kanban-ear-right {
display: none;
}
.main-kanban-item-drag-multi {
transform: translate(-20px, -20px);
position: absolute;
z-index: 999999;
}
.main-kanban-item-drag-multi .main-kanban-item {
position: absolute;
top: 0;
left: 0;
z-index: 99;
pointer-events: none;
}
.main-kanban-item-drag-multi .main-kanban-item:nth-child(2) {
transform: rotate(4deg) translate(2px, 0px);
z-index: 9;
}
.main-kanban-item-drag-multi .main-kanban-item:nth-child(3) {
transform: rotate(8deg) translate(6px, 0px);
z-index: 1;
}
.main-kanban-item-drag-multi .main-kanban-item-wrapper {
box-shadow: 0 0 3px rgba(0,0,0,.2);
background: #fff;
}
/*css for column revert */
.main-kanban.--columns-revert .main-kanban-column-title-bg {
left: 13px;
right: -3px;
border-radius: var(--ui-border-radius-2xs, 3px);
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
.main-kanban.--columns-revert .main-kanban-column-title-right {
right: auto;
left: 3px;
transform: scaleX(-1);
}
.main-kanban.--columns-revert .main-kanban-column:first-child .main-kanban-column-title-bg {
left: 0;
border-radius: 3px;
}
.main-kanban.--columns-revert .main-kanban-column:last-child .main-kanban-column-title-right {
display: block;
}
.main-kanban.--columns-revert .main-kanban-column:first-child .main-kanban-column-title-right {
display: none;
}
.main-kanban.--columns-revert .main-kanban-column-title-text {
padding-left: 6px;
}
.main-kanban.--columns-revert .main-kanban-column:first-child .main-kanban-column-title-text {
padding-left: 2px;
}