body{
    padding: 0;
    margin: 0;
    overflow-x: hidden;
}
a {

    text-decoration: none;
}
.bg-lifewill-load{
    position: absolute;
    top: 0;
    width: 100%;
    height: 100vh;
    background-color: #122634;
    font-size: 35px;
    font-family: 'Comfortaa', sans-serif;
    font-weight: 700;
    color: #39dc76;
    display: flex;
    align-items: center;
    justify-content: center;
}
.bg-system{
    position: relative;
    z-index: 9;
    background: white;
    min-height: 100vh;
}
.fade-enter-active, .fade-leave-active {
    transition: opacity .5s;
}
.fade-enter, .fade-leave-to /* .fade-leave-active до версии 2.1.8 */ {
    opacity: 0;
}
.head-index{
    background: #8870FF;
    height: calc(100vh - 80px);
    margin: 40px 80px;
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
}
.balans-info{
    display: flex;
    font-size: 13px;
    justify-content: space-between;
    font-family: 'Comfortaa', sans-serif;
    color: #122634;
    background: gainsboro;
    padding: 5px 10px;
    border-radius: 5px;
}
.balans-data{
    font-size: 17px;
    font-family: 'Comfortaa', sans-serif;
    font-weight: bold;
    color: #122634;
}
.balans-info p{
    margin: 0;
}
.left-index-head{
    padding-left: 40px;
    max-width: 505px;
}
.left-index-head p{
    color: white;
    font-size: 25px;
    font-family: 'Comfortaa', sans-serif;
    font-weight: 700;
    text-transform: uppercase;
    line-height: 39px;
    /* text-shadow: #ffffffa8 0px 0 6px; */
    margin: 5px 0;
}
.left-index-head p span{
    font-size: 35px;
    color: #FFEB3B;
}

.image-index-head img{
    width: 100%;
    position: relative;
    left: 20%;
    max-width: 800px;
}

.button-no-active{
    padding: 11px 20px;
    /* background: #ffeb3b; */
    color: white;
    border-radius: 7px;
    border: 2px solid #ffffff;
    min-width: 170px;
    text-align: center;
    font-family: 'Comfortaa', sans-serif;
    font-size: 17px;
    font-weight: 600;
    /* text-transform: uppercase; */
    line-height: 17px;
}
.nigative-block{
    position: relative;
    width: 100%;
    height: 100vh;
    background-color: black;
    display: flex;
    align-items: center;
    justify-content: center;
}
.nigative-block p{
    color: white;
    font-size: 80px;
    text-transform: uppercase;
    font-family: 'Comfortaa', sans-serif;
}



.marquee-nigative span{
    color: white;
    font-size: 32px;
    font-family: 'Comfortaa', sans-serif;
    font-weight: 200;
    text-transform: uppercase;
    line-height: 39px;
    margin: 0 20px;
    text-decoration: line-through;
    opacity: 0.5;
}
.marquee-success span{
    color: #ffeb3b;
    font-size: 32px;
    font-family: 'Comfortaa', sans-serif;
    font-weight: 200;
    text-transform: uppercase;
    line-height: 39px;
    margin: 0 20px;
}
.h2-index{
    font-family: 'Comfortaa', sans-serif;
    text-transform: uppercase;
    font-weight: bold;
    color: #b8b8b8;
    font-size: 25px;
    margin-top: 20px;
    margin-bottom: 25px;
}
.problems-list{
    padding: 0 15px;
}
.item-problem{

}
.head-problem{
    background: #000000;
    color: white;
    margin: 0 -15px;
    background: #122634;
    padding: 10px 15px;
    font-family: 'Comfortaa', sans-serif;
}
.item-problem ul{
    padding: 0 0 0 20px;
    margin: 20px 0;
}
.item-problem ul li{
    font-family: 'Comfortaa', sans-serif;
    font-size: 15px;
}
.item-problem p{
    font-family: 'Comfortaa', sans-serif;
    font-size: 15px;
    margin: 10px 0 20px;
}

.head-index-to {
    height: 100%;
    border-radius: 0;
    margin: 0;
    display: block;
    background: white;
    padding: 30px 0;
    position: relative;
}
.head-index-to:before{
    display: none;
    background: url(https://img1.goodfon.ru/original/1920x1408/9/f2/alpiyskaya-skazka-heidi-gory.jpg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    opacity: 0.2;
    content: '';
    width: 100%;
    height: 100%;
}
.marquee-nigative {
    position: relative;
    top: 0;
}
.buttons-head-index {
    display: flex;
    flex-direction: column;
}
.button-active {
    margin-right: 0;
    margin-bottom: 10px;
    padding: 8px 20px;
    background: #39dc76;
    color: white;
    border-radius: 7px;
    text-align: center;
    font-family: 'Comfortaa', sans-serif;
    font-size: 14px;
    font-weight: 600;
    text-transform: uppercase;
    line-height: 14px;
    border: 2px solid #39dc76;
}
.text-head-to p:before{
    content: '';
    position: absolute;
    width: 200px;
    height: 100%;
    left: 0;
}
.button-no-active {
    padding: 8px 0;
    color: black;
    border-radius: 0;
    border-bottom: 2px solid #000000;
    text-align: center;
    font-family: 'Comfortaa', sans-serif;
    font-size: 14px;
    font-weight: 600;
    line-height: 14px;
    width: 179px;
    margin: 0 auto;
}
.text-head-to {
    text-align: left;
    padding: 0 15px;
}
.marquee-nigative span {
    font-size: 23px;
    color: #8e8e8e;
}
.logo-name {
    margin-top: 20px;
    font-size: 35px;
    font-family: 'Comfortaa', sans-serif;
    font-weight: 700;
    text-transform: uppercase;
    margin-bottom: 0;
    color: #39dc76;
    position: relative;
    width: -moz-max-content;
    width: max-content;
}
.logo-name:before{
    content: '';
    display: none;
    position: absolute;
    width: 222px;
    height: 100%;
    background-color: #505050;
    left: -48px;
    top: 0;
    border-radius: 12px;
}
.logo-name span{

}
.text-head-to p {
    font-size: 16px;
    font-weight: 400;
    margin: 17px 0;
    text-transform: inherit;
    font-family: 'Comfortaa', sans-serif;
    line-height: 22px;
    z-index: 99;
    position: relative;
    color: black;
}
.head-price-and-mens{
    background: #505050;
    margin: 30px -15px 55px;
    padding: 10px 15px;
    background: #122634;
}
.item-price-and-mens{
    font-family: 'Comfortaa', sans-serif;
    color: white;
    margin-bottom: 5px;
}
.item-price-and-mens span{
    color: #39dc76;
}
.prices-head{
    display: flex;
    justify-content: space-between;
    font-family: 'Comfortaa', sans-serif;
    color: white;
    align-items: center;
}
.prices-head .active-price{
    font-size: 20px;
    font-weight: 900;
}
.prices-head .no-active-price{
    font-size: 23px;
    text-decoration: line-through;
    opacity: 0.3;
}

.index-no-curs{
    font-family: 'Comfortaa', sans-serif;
    padding: 15px;
    background: #39dc76;
    color: white;
    margin: 30px 0 50px;
}
.index-no-curs span{
    color: #122634;
    font-weight: 700;
    font-size: 16px;
}
.who-work-system{
    padding: 0 15px;
}
.who-work-system p{
    font-family: 'Comfortaa', sans-serif;
    font-size: 15px;
}
.who-work-system .button-active{
    margin: 30px 0 40px;
}
.plus-chat{
    font-family: 'Comfortaa', sans-serif;
    padding: 15px;
    background: #39dc76;
    color: white;
    margin: 20px -15px 50px;
    position: relative;
}
.my-primer{
    padding: 0 15px;
}
.my-primer p{
    font-family: 'Comfortaa', sans-serif;
    font-size: 15px;
}
.images-primer{
    background: url('/images/primer.webp');
    height: 156px;
    border-radius: 20px;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    margin-bottom: 20px;
}
.itog-system-mln{
    color: white;
    background: #122634;
    font-family: 'Comfortaa', sans-serif;
    padding: 20px 15px;
}
.help-mans{
    text-transform: uppercase;
    font-weight: bolder;
}
.help-mans span{
    color: #39dc76;
}
.price-user-info{
    color: #cacaca;
    margin-bottom: 30px;
}
.footer-index{
    font-family: 'Comfortaa', sans-serif;
    padding: 20px 15px;
    margin-top: 40px;
    text-align: center;
    font-style: italic;
}
.footer-index span{
    color: #39dc76;
}
p{
    font-family: 'Comfortaa', sans-serif;
}
.f-input{
    border: 1px solid black;
    padding: 9px 15px;
    font-family: 'Comfortaa', sans-serif;
    background-color: white!important;
    border-radius: 5px;
    margin: 8px 0;
    width: 100%;
    max-width: 300px;
    font-size: 14px;
}
.custom-control-input:checked~.custom-control-label::before {
    color: #fff;
    border-color: #122634;
    background-color: #122634;
}
input:-webkit-autofill,
input:-webkit-autofill:focus {
    -webkit-transition: background-color 600000s 0s, color 600000s 0s;
    transition: background-color 600000s 0s, color 600000s 0s;
}
.form-login{
    display: flex;
    margin: 0 15px;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 0 0 20px;
}
.form-login .logo-name{
    font-size: 22px;
    margin: 15px 0 20px;
}
.form-login h1{
    font-family: 'Comfortaa', sans-serif;
    font-weight: 700;
    font-size: 23px;
    margin: 0 0 15px;
}
.form-login p{
    margin-bottom: 30px;
    font-size: 15px;
}
.slide-fade-enter-active {
    transition: all .2s ease;
}
.slide-fade-leave-active {
    transition: all .2s ease;
}
.slide-fade-enter, .slide-fade-leave-to
    /* .slide-fade-leave-active до версии 2.1.8 */ {

    opacity: 0;
}
.button-dark-text{
    font-family: 'Comfortaa', sans-serif;
    border-bottom: 1px solid;
    width: -moz-max-content;
    width: max-content;
    margin: 5px auto;
    padding: 5px 30px;
}
.form-login .button-active{
    width: 100%;
    max-width: 300px;
    margin-top: 40px;
}
.auth-options label{
    font-family: 'Comfortaa', sans-serif;
    font-size: 12px;
    margin: 15px 0 0 15px;
}
.pol-buttons{
    display: flex;
    flex-wrap: nowrap;
    padding: 0 5px;
}
.item-pol{
    border: 1px solid black;
    padding: 9px 15px;
    font-family: 'Comfortaa', sans-serif;
    background-color: white!important;
    margin: 8px 0;
    width: 80px;
    font-size: 14px;
    text-align: center;
}
.item-pol:first-child{
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
}
.item-pol:last-child{
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
}
.item-pol-active{
    background-color: #122634!important;
    color: white;
}
label{
    font-family: 'Comfortaa', sans-serif;
    font-size: 14px;
    text-align: left;
    margin: 0;
}
.private-text{
    background-color: #122634;
    margin: 0 -15px;
    padding: 11px 10px;
    color: white;
    line-height: 20px;
    font-family: 'Comfortaa', sans-serif;
    font-size: 15px;
    display: block;
    position: relative;
    top: -15px;
    font-weight: 100;
}
.private-text span{
    color: #39dc76;
}
.item-pol-life {
    border: 1px solid black;
    width: 100%;
    padding: 5px 0;
    font-family: 'Comfortaa', sans-serif;
    background-color: white;
    margin: 8px 0;
    font-size: 13px;
    text-align: center;
}
.item-pol-life:first-child{
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
}
.item-pol-life:last-child{
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
}
.lifes-create-user{
    display: flex;
    flex-direction: column;
    align-items: center;
}
.item-life-create-user{
    margin-bottom: 17px;
    width: 100%;
}
.form-create-input  .item-life-create-user h4 .input-text-no-bord{
    width: calc(100% - 30px)!important;
}
.form-create-input .goals-add-steep .item-life-create-user h4 .input-text-no-bord{
    width: calc(100% - 90px)!important;
}
.item-life-create-user h4{
    font-family: 'Comfortaa', sans-serif;
    font-size: 20px;
    font-weight: 800;
    position: relative;
    text-align: left;
}
.custom-control-label::before, .custom-control-label::after{
    left: -40px;
}
.delete-item-category-life{
    position: absolute;
    right: 0;
    top: 0;
    line-height: 24px;
}
.delete-item-category-life img{
    width: 18px;
}
.bg-item-color-life{
    width: 25px;
    height: 25px;
    display: block;
    position: absolute;
    border-radius: 3px;
    right: 30px;
}
.palitras-items {
    display: flex;
    flex-wrap: nowrap;
    padding: 0 5px;
}
.item-politra{
    margin: 8px 0;
    height: 25px;
    width: 100%;
}
.item-politra:first-child {
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
}
.item-politra:last-child {
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
}
.input-text-no-bord{
    font-family: 'Comfortaa', sans-serif;
    font-size: 15px;
    position: relative;
    text-align: left;
    border: none;
    background: white!important;
    outline: none;
    border-bottom: 1px solid;
    width: calc(100% - 70px);
    padding-bottom: 5px;
    overflow: hidden;
    display: inline-flex;
}
.add-item-user-life{
    margin-right: 0;
    margin-bottom: 10px;
    padding: 8px 20px;
    background: #122634;
    color: white;
    border-radius: 7px;
    text-align: center;
    font-family: 'Comfortaa', sans-serif;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    line-height: 14px;
    border: none;
}
.height-graph{
    display: flex;
    align-items: flex-end;
    height: 150px;
    margin-bottom: 70px;
    margin-top: 20px;
}
.score-count-day{
    font-size: 42px;
    font-family: 'Comfortaa', sans-serif;
    font-weight: bold;
    color: #39dc76;
}
.height-graph .item-graph-life {
    width: 25px;
    background: #122634;
    padding: 4px 0;
    text-align: center;
    margin-right: 4px;
}
.height-graph  .item-graph-life span {

    right: auto;
    bottom: -34px;
    transform: rotate(90deg);
    left: -4px;
}
.item-graph-life{
    color: white;
    padding: 4px 0px 4px 15px;
    font-family: 'Comfortaa', sans-serif;
    font-size: 14px;
    margin: 0 0 5px;
    border-radius: 4px;
    text-align: left;
    position: relative;
}
.item-graph-life span{
    position: absolute;
    right: -20px;
    color: #212529;
    font-weight: 800;
}
.timer-life-user-register{
    font-family: 'Comfortaa', sans-serif;
    font-size: 35px;
    font-weight: 700;
    color: #ffffff;
    background: #122634;
    border-radius: 10px;
    width: 270px;
    margin: 20px auto 20px;
}
.timer-life-user-register span{
    margin: 0 6px;
    position: relative;
    top: -4px;
    color: #39dc76;
}
.select-lvl-steep-register{

}
.item-select-lvl{
    display: flex;
    flex-wrap: nowrap;
    margin-bottom: 10px;
}
.check-lvl-select{
    border: 2px solid #122634;
    width: 24px;
    height: 24px;
    border-radius: 5px;
}
.check-lvl-select img{
    width: 30px;
    position: relative;
    top: -6px;
    left: -1px;
    filter: invert(68%) sepia(69%) saturate(465%) hue-rotate(85deg) brightness(95%) contrast(87%);
}
.name-lvl-select{
    font-family: 'Comfortaa', sans-serif;
    margin-left: 10px;
    font-size: 14px;
    text-align: left;
    width: calc(100% - 35px);
}
.goal-categories{
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: nowrap;
}
.goal-category-name{
    font-family: 'Comfortaa', sans-serif;
    font-weight: 700;
    font-size: 16px;
    margin: 0 0 15px;
}
.goal-category-add{
    margin-right: 0;
    margin-bottom: 10px;
    padding: 8px 15px;
    background: #39dc76;
    color: white;
    border-radius: 7px;
    text-align: center;
    font-family: 'Comfortaa', sans-serif;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    line-height: 14px;
    border: none;
}
.goal-category-add-item{
    margin-right: 0;
    margin-bottom: 10px;
    padding: 2px 9px;
    background: #122634;
    color: #ffffff;
    border-radius: 7px;
    text-align: center;
    font-family: 'Comfortaa', sans-serif;
    font-size: 11px;
    font-weight: 600;
    position: absolute;
    right: 57px;
    top: 2px;
    line-height: 19px;
}
.goal-smail-item{
    margin-left: 15px;
    width: calc(100% - 15px);
    margin-bottom: 5px;
}
.goals-add-steep .input-text-no-bord{
    width: calc(100% - 140px);
}
.goal-save img{
    width: 19px;
}
.goal-category-add-data{
    position: absolute;
    right: 27px;
    line-height: 24px;
}
.goal-category-add-data img{
    width: 19px;
}
.input-type-data-goal{
    text-align: right;
    position: relative;
    right: 0;
    width: 100%!important;
    margin-bottom: 10px;
}
.active-data-goal{
    filter: invert(68%) sepia(69%) saturate(465%) hue-rotate(85deg) brightness(95%) contrast(87%);
}
.goal-smail-item .input-text-no-bord{
    width: calc(100% - 105px);
}
.text-item{
    margin-bottom: 20px;
}
.text-item h4{
    font-family: 'Comfortaa', sans-serif;
    font-size: 11px;
    font-weight: 900;
    border-bottom: 1px solid #122634;
    width: 75px;
    color: #122634;
    margin-bottom: 5px;
    padding-bottom: 5px;
}
.text-item p{
    font-family: 'Comfortaa', sans-serif;
    font-size: 15px;
    color: #122634;
}
.ok-item-goal{
    opacity: 0.7;
    font-weight: 400;
    text-decoration: line-through;
    width: calc(100% - 80px) !important;
}

.goal-ok-item img{
    width: 19px;
    filter: invert(10%) sepia(12%) saturate(2867%) hue-rotate(162deg) brightness(100%) contrast(92%);
}
.goal-ok-item-view img{
    opacity: 0.7;
}
.opacity-goal-item{
    opacity: 0.2;
}
.text-p-decoration{
    font-weight: 700;
}
.task-datas{
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.input-width-minus-20{
    width: calc(100% - 20px);
    width: 100%;
}
.task-data-item input{
    width: 150px;
}
.task-data-item:first-child{
    margin-right: 5px;
}
.task-data-item .task-data-item-name{
    font-family: 'Comfortaa', sans-serif;
    font-size: 11px;
    text-align: left;
    display: block;
}
.header-panel{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 5px 15px;
}
.panel-user .logo-name{
    margin: 0;
    font-size: 16px;
}
.timer-panel-index{
    font-family: 'Comfortaa', sans-serif;
    font-size: 23px;
    font-weight: 700;
    color: #39dc76;
    background: #122634;
    border-radius: 10px;
    margin: 10px auto 20px;
    padding: 2px 0;
    width: 270px;
    text-align: center;
}
.timer-panel-index span{
    color: #ffffff;
    margin: 0 5px;
}
.footer-panel{
    position: fixed;
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    width: 100%;
    bottom: 0;
}
.item-nav-footer{
    width: 100%;
    text-align: center;
    padding: 15px 0;
    background: #122634;
}
.item-nav-footer img{
    filter: invert(100%) sepia(0%) saturate(7432%) hue-rotate(1deg) brightness(128%) contrast(114%);
}
.active-item-nav-footer img{
    filter: invert(79%) sepia(10%) saturate(2925%) hue-rotate(86deg) brightness(92%) contrast(90%);
}

.menu-header img{
    filter: invert(10%) sepia(8%) saturate(5149%) hue-rotate(163deg) brightness(94%) contrast(90%);
}
.layout-panel{
    padding: 0 15px 20px;
    height: calc(100vh - 150px);
    overflow-y: scroll;
}

.goal-new-width{
    width: calc(100% - 120px) !important;
}
.goal-new-width-item{
    width: calc(100% - 80px)!important;
}
.layout-panel::-webkit-scrollbar-track
{
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    border-radius: 10px;
    background-color: #fafafa;
}

.layout-panel::-webkit-scrollbar
{
    width: 7px;
    background-color: #fafafa;
}

.layout-panel::-webkit-scrollbar-thumb
{
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
    background-color: #122634;
}
.head-title-panel{
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: nowrap;
}
.head-title-panel h3{
    font-size: 17px;
    font-family: 'Comfortaa', sans-serif;
    font-weight: bold;
    color: #122634;
}
.btn-small-panel{
    font-family: 'Comfortaa', sans-serif;
    font-size: 19px;
    line-height: 20px;
    color: #ffffff;
    background: #122634;
    border-radius: 5px;
    padding: 4px 10px;
    margin-bottom: 15px;
}
.task-item{
    display: flex;
    justify-content: space-around;
    flex-wrap: nowrap;
    align-items: flex-start;
    margin-bottom: 5px;
}
.task-success .task-name .task-name-text{
    text-decoration: line-through;
}
.task-success .task-time span{
    text-decoration: none!important;
}
.task-time{
    font-size: 11px;
    color: #122634;
}
.task-warning .task-name{
    opacity: 0.5;
}
.task-ok{
    width: 20px;
    height: 20px;
    border: 2px solid #122634;
    border-radius: 16px;
    display: block;
    margin-right: 10px;
}
.task-ok img{
    filter: invert(10%) sepia(8%) saturate(5149%) hue-rotate(163deg) brightness(94%) contrast(90%);
    position: relative;
    top: -6px;
    width: 18px;
    left: 1px;
}
.task-name{
    width: calc(100% - 88px);
    font-size: 14px;
    font-family: 'Comfortaa', sans-serif;
}
.task-no{
    position: relative;
    left: -4px;
}
.task-no img{
    width: 18px;
}
.edit-buttons{
    width: 50px;
    display: flex;
    justify-content: flex-end;
}
.edit-buttons img{
    filter: invert(10%) sepia(8%) saturate(5149%) hue-rotate(163deg) brightness(94%) contrast(90%);
    width: 18px;
    margin: 0 3px;
}
.plane-actions{
    background: #122634;
    border-radius: 5px;
    padding: 6px 5px;
    margin-bottom: 15px;
}
.head-plane-action{
    display: flex;
    flex-wrap: nowrap;
}
.item-name-plane-action{
    width: 60%;
    border-right: 1px solid;
    font-family: 'Comfortaa', sans-serif;
    font-size: 14px;
    padding: 7px 0;
}
.item-action-status{
    width: 40px;
    text-align: center;
    border-right: 1px solid;
    padding: 0 5px;
    font-size: 12px;
    font-family: 'Comfortaa', sans-serif;
    color: white;
}
.item-action-status:last-child{
    border: none;
}
.active-day-plane-action{
    width: 16%;
}
.body-plane-action .item-action-status{

}
.item-body-plane-action{
    display: flex;
    flex-wrap: nowrap;
}
.items-planes-action-day, .items-habits-day{
    margin-top: 20px;
}
.item-plane-day{
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 6px;
    border-bottom: 1px solid #dedede;
    padding-bottom: 6px;
}
.item-plane-day:last-child{
    border: none;
}
.item-plane-day .name-plane-day, .item-habit-day .name-habit-day{
    font-family: 'Comfortaa', sans-serif;
    font-size: 15px;
    width: 80%;
}
.status-plane-day{
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
}
.status-item-plane-day{
    font-family: 'Comfortaa', sans-serif;
    font-size: 11px;
    border: 1px solid #122634;
    padding: 4px 6px;
    border: none;
}
.status-item-plane-day img{
    width: 16px;
    opacity: 0.3;
}
.status-no-plane-day img{
    opacity: 1;
    filter: invert(10%) sepia(12%) saturate(2867%) hue-rotate(162deg) brightness(100%) contrast(92%);
}
.status-ok-plane-day img{
    opacity: 1;
    filter: invert(10%) sepia(12%) saturate(2867%) hue-rotate(162deg) brightness(100%) contrast(92%);
}
.status-good-plane-day img{
    opacity: 1;
    filter: invert(10%) sepia(12%) saturate(2867%) hue-rotate(162deg) brightness(100%) contrast(92%);
}

.item-habit-day{
    display: flex;
    flex-wrap: nowrap;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 6px;
    border-bottom: 1px solid #dedede;
    padding-bottom: 6px;
}
.item-habit-day:last-child{
    border: none;
}
.status-habit-day{
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
}
.status-item-habit-day{
    padding: 5px 8px;
    border: 1px solid #122634;
    display: flex;
    align-items: center;
}
.status-item-habit-day:first-child{
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
}
.status-item-habit-day:last-child{
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
}
.status-item-habit-day img{
    width: 13px;
    filter: invert(10%) sepia(12%) saturate(2867%) hue-rotate(162deg) brightness(100%) contrast(92%);
}
.status-active-habit{
    background: #122634;
    color: white;
}
.status-active-habit img{
    filter: invert(100%) sepia(100%) saturate(2%) hue-rotate(96deg) brightness(108%) contrast(101%);
}
.items-happy-day{
    margin-top: 20px;
    padding-bottom: 20px;
}
.items-happy-day p{
    font-size: 15px;
}
.items-happy-day .status-item-habit-day {
    padding: 5px 17px;
}
.dates-select{
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    flex-wrap: nowrap;
    margin-bottom: 20px;
}
.dates-select span{
    margin: 0 10px;
    width: 10px;
    height: 2px;
    background: #122634;
}
.data-select{
    border: none;
    font-family: 'Comfortaa', sans-serif;
    background-color: white!important;
    border-radius: 5px;
    outline: none;
    font-size: 14px;
}
.tasks-panel h4{
    font-size: 14px;
    font-family: 'Comfortaa', sans-serif;
    font-weight: 600;
    color: #122634;
}
.item-action-status img{
    width: 15px;
}
.item-action-status-no{
    filter: invert(51%) sepia(97%) saturate(1910%) hue-rotate(331deg) brightness(99%) contrast(109%);
}
.item-action-status-ok{
    filter: invert(97%) sepia(46%) saturate(4773%) hue-rotate(320deg) brightness(108%) contrast(110%);
}
.item-action-status-good{
    filter: invert(84%) sepia(68%) saturate(554%) hue-rotate(66deg) brightness(89%) contrast(94%);
}
.item-action-status-white{
    filter: invert(100%) sepia(0%) saturate(5172%) hue-rotate(2deg) brightness(110%) contrast(102%);
}
.item-no-active-status{
    background: #FF6342;
}
.item-ok-active-status{
    background: #FFE642;
}
.item-good-active-status{
    background: #39dc76;
}
@media only screen and (max-width : 480px) {

}