@charset "UTF-8";

@font-face{
    font-family: 'ploni';
    font-weight: 400; /*(regular)*/
    font-style: normal;
    src: url('/wp-content/webfont_files/ploni-regular-aaa.woff2') format('woff2'),
        url('/wp-content/webfont_files/ploni-regular-aaa.woff') format('woff');
}
@font-face{
    font-family: 'ploni';
    font-weight: 700; /*(bold)*/
    font-style: normal;
    src: url('/wp-content/webfont_files/ploni-bold-aaa.woff2') format('woff2'),
        url('/wp-content/webfont_files/ploni-bold-aaa.woff') format('woff');
}
@font-face{
    font-family: 'ploni';
    font-weight: 900; /*(black)*/
    font-style: normal;
    src: url('/wp-content/webfont_files/ploni-black-aaa.woff2') format('woff2'),
        url('/wp-content/webfont_files/ploni-black-aaa.woff') format('woff');
}

body{
    height: 100%;
    margin-top: 0;
    direction: rtl;

}
p{
    margin: 0;
}
*{
    font-family: 'Ploni';

}
.flex{
  display: flex;
}
.aic {
  align-items: center;
}
.col-15{
    width: 15%;
}
.col-20{
    width: 20%;
}
.col-28{
    width: 28%;
}
.col-30{
    width: 30%;
}
.col-40{
    width: 40%;
}
.col-60{
    width: 60%;

}
.col-70{
    width: 70%;
}
.col-50{
    width: 50%;
}
.col-72{
    width: 72%;
}
.col-80{
    width: 80%;
}
.col-85{
    width: 85%;
}
.col-100{
    width: 100%;
}

img#logOut {
    position: absolute;
    right: 10px;
    bottom: 50px;
}

#background_connection{
    width: 35%;
    position: absolute;
    z-index: 1;
    right: 32%;
    top: 15%;
}
#left_img_connection{
    position: absolute;
    width: 35%;
    top: 40%;
    left: 0px;
    z-index: 1;
}
#right_img_connection{
    position: absolute;
    width: 35%;
    top: 23%;
    z-index: 1;
}
#form_connection {
    position: absolute;
    top: 38vh;
    left: 42%;
    width: 300px;
    background-color: white;
    box-shadow: 0px 1px 26px rgba(2, 99, 209, 0.1);
    border-radius: 10px;
    overflow: hidden;
    height: 215px;
    padding: 15px;
    box-sizing: border-box;
    z-index: 1;
    width: 25%;
    top: calc(15% + 12vw);
    height: 21vw;
    width: 274px;
    height: 219px;
}
#form_connection p{
    font-weight: 600;
    margin-bottom: 8px;
    text-align: center;
}
#form_connection .form_fields{
    background: #F5F9FC;
    border-radius: 5px;
    border: 0px;
    outline: 0px;
    width: 99%;
    height: 30px;
    margin: 5px 0px;
}
#form_connection input[type="checkbox"]{
    margin: 15px 0px;
    height: 12px;
}
#form_connection label{
    position: absolute;
    margin: 10px;
}
#form_connection input[type="submit"], #sentEmailPass{
    position: absolute;
    bottom: 10px;
    left: 10px;
    border: 0px;
    padding: 5px 10px;
    border-radius: 5px;
    color: white;
    background: #627DDF;
    font-weight: 600;
    cursor: pointer;
}
input#sentEmailPass {
    bottom: auto;
    margin-top: 10px;
    left: calc(50% - 40px);
}
a#forgetPassword {
    color: #627DDF;
    position: absolute;
    bottom: 15px;
    text-decoration: underline;
    right: 15px;
    cursor: pointer;
}
p#error_login {
    position: absolute;
    bottom: 10px;
    right: 30px;
    font-weight: 400;
    color: #E5252A;
    text-decoration: underline;
    display: none;
}
div#wrapIconCurtain {
    position: absolute;
    top: 23px;
    left: 40px;
}
img#notificationCurtain {
    width: 25px;
    cursor: pointer;
}
label#countAlerts {
    position: absolute;
    font-size: 7px;
    background-color: #FEB704;
    padding: 0px 4.5px;
    text-align: center;
    border-radius: 50%;
    right: 1px;
    top: 1px;
    font-weight: 700;
}

#upfp_nav, #upfp_pl_home, #upfp_info, #upfp_share_fldr_btn{
    display: none;
}


#search_all_tasks{
    margin-top: 25px;
    margin-right: 10px;
    border: 0px;
    border-right: 1px solid black;
    padding-right: 5px;
    height: 20px;
    font-size: 16px;
}
#search_all_tasks:focus{
    outline: 0px;
}

.profile {
    text-align: center;
    padding: 30px;
    position: relative;
}
.profile #user_name_in_profile{
    font-weight: 600;
}
.profile #user_email_in_profile{
    font-size: 14px;
}
p#countTasksAllocated {
    position: absolute;
    top: 29px;
    left: 79px;
    background-color: #feb704;
    padding: 0px 5px;
    border-radius: 50%;
    border: 2px solid black;
    font-weight: 600;
    font-size: 11px;
}
/* img#editProfile {
    position: absolute;
    width: 60px;
    top: calc(40% - 10px);
    left: 60px;
} */
ul#slider {
    width: 95%;
    padding-right: 0px;
}
.ilSlider {
    background-color: #F5F9FC;
    width: 91%;
    display: block;
    padding: 15px 10px;
    position: relative;
    margin: 7px 0px;
}
.ilSliderNow{
    background-color: #DBECFF;
}
.ilSlider > * {
    display: inline-block;
}
img.iconSlider {
    position: relative;
    top: 4px;
    right: 4px;
}
p.sliderTitle {
    position: relative;
    right: 14px;
    font-weight: 700;
    font-size: 16px;
}
img.sliderDowmArrow {
    position: absolute;
    left: 17px;
    top: 23px;
}
il.projectTask, il.userTask{
    display: block;
    padding: 7px;
}
.projectTask input[type="checkbox"]:checked::before, .userTask input[type="checkbox"]:checked::before{
    top: -1px;
    font-size: 12px;
}
input.selectProject, .selectUserTask{
    -webkit-appearance: none;
    border: 1px solid black;
    border-radius: 3px;
    margin-right: 20px;
    width: 18px;
    height: 18px;
    position: relative;
    top: 7px;
    margin-left: 10px;
}

input.selectProject:checked, .selectUserTask:checked{
	background: #63D0B4 url("/wp-content/uploads/2023/04/Vector-10.svg") no-repeat center center;
}

ul#projectsTasks {
    padding-right: 0px;
}
ul#usersTasksList {
    padding-right: 10px;
}
#wraProjectsTasks{
    margin: 15px;
}
#createProject{
    width: 116px;
    height: 26px;
    border-radius: 6px;
    background-color: #627DDF;
    border: 0px;
    color: white;
    font-weight: 700;
    position: relative;
    right: 44px;
    margin: 7px 0px;
    cursor: pointer;
}
ul#slider {
    cursor: pointer;
}
.dropDownSlider{
    display: none;
    height: 246px;
    overflow: hidden;
    height: 20vh;
    overflow-y: auto;
    margin: 15px;
}
input#newProjectName {
    background-color: #F5F9FC;
    border: 0px;
    outline: 0px;
    border-radius: 6px;
    font-size: 18px;
    padding: 7px 12px;
    margin-bottom: 9px;
}
div#popUpProject {
    width: 230px;
    height: 150px;
    border-radius: 6px;
    box-shadow: 0px 8px 40px rgba(16, 48, 131, 0.2);
    padding: 15px;
    background-color: white;
    position: fixed;
    right: 5%;
    z-index: 10;
}
button#okProject, #okUser {
    background-color: #627DDF;
    border: 0px;
    border-radius: 6px;
    color: white;
    padding: 2px 15px;
    position: absolute;
    bottom: 15px;
    left: 20px;
    cursor: pointer;
}
input#newProjectColor {
    border: 0px;
    background-color: #F5F9FC;
    border-radius: 5px;
    position: relative;
    top: 5px;
}
#popup_delete_file{
    height: auto;
}
button#createUser, #deleteUser {
    width: 168px;
    height: 40px;
    background-color: #627DDF;
    border: 0px;
    border-radius: 6px;
    padding-top: 2px;
    text-align: start;
    padding-right: 15px;
    position: relative;
    font-size: 18px;
    color: white;
    cursor: pointer;
}
button#createUser > img {
    position: absolute;
    top: 12px;
    left: 20px;
}
h1#titleUsersPage {
    font-size: 36px;
    display: inline-block;
    margin-left: 20px;
    margin-top: 7px;
    margin-right: 20px;
}
.user {
    display: flex;
    width: 777px;
    height: 85px;
    border-radius: 12px;
    background-color: #FFF;
    margin: 0px 0px 15px 0px;
    align-items: center;
    position: relative;
}
.user input[type="checkbox"] {
    width: 23px;
    height: 23px;
    position: relative;
    /* top: 25px; */
    -webkit-appearance: none;
    border: 1px solid black;
    border-radius: 3px;
    margin-right: 20px;
}
.user input[type="checkbox"]:checked::before
{
    content: "\2714";
    font-size: 14px;
    position: absolute;
    margin-right: 5px;
    top: 2px;
    color: black;
}
.userImg {
    border: 1.5px solid white;
    border-radius: 50%;
    width: 65px;
    height: 65px;
    margin: 0px 20px;
	background-size: cover;
	background-position: center;
}
p.nameUser {
    font-size: 18px;
    font-weight: 700;
}
select.roleUser {
    border: 0px;
    background-color: transparent;
    width: 80px;
}
.nameRoleUser {
    width: 100px;
    margin-left: 20px;
}
p.emailUser {
    margin: 0px 20px;
    width: 170px;
}
p.dateUser {
    margin: 0px 20px;
    width: 150px;
}
div#popUpUser {
    height: auto;
    padding-bottom: 90px;
}
select#roleUser {
    width: 93%;
    height: 45px;
}
.detailsUser {
    background-color: #F5F9FC;
    border: 0px;
    outline: 0px;
    border-radius: 6px;
    font-size: 18px;
    padding: 7px 12px;
    margin-bottom: 9px;
    width: 85%;
}
img.editUser {
    cursor: pointer;
    position: absolute;
    left: -54px;
    top: -7px;
}
input#buttonImgUser {
    background-color: #627DDF;
    border: 0px;
    border-radius: 6px;
    color: white;
    padding: 2px 15px;
    float: left;
    margin-left: 12px;
}
div#popupDeleteUser {
    height: auto;
}

.inlineBlock{
    display: inline-block;
}




.perform_user {
    border: 1.5px solid #5ACB63;
    border-radius: 50%;
    cursor: pointer;
}
.participants{
    position: absolute;
    background-color: white;
    border-radius: 5px;
    top: 50px;
    right: 3px;
    padding: 5px;
    /* max-height: 0px; */
    max-height: 100px;
    overflow: hidden;
    /* max-width: 0px; */
    max-width: 1000px;
    z-index: 1;
    box-shadow: 0px 8px 40px rgba(16, 48, 131, 0.2);
}
hr{
    width: 90%;
    height: 2px;
    background-color: #D3D3D3;
    border-radius: 5px;
    border: 0px;
}
.tasks_now{
    background: #627DDF;
    border-radius: 8px;
    color: white;
}
.task_open{
    box-shadow: 0px 0px 8px 1px #D3D3D3;
}
.icons{
    height: 20px;
    margin-right: 10px;
    border-radius: 0px !important;
    display: inline-block;
    width: 20px;
    border-radius: 5px !important;
    box-shadow: 0px 1px 7px rgba(76, 87, 116, 0.2);
    text-align: center;
    font-family: auto;
}
#filters{
    border: 1px solid #D3D3D3;
    border-radius: 8px;
    padding: 5px;
    background-color: white;
    font-size: 16px;
	position: relative;
    z-index: 0;
}
#filters il{
    margin-left: 5px;
    padding: 3px 9px;
    cursor: pointer;
    display: inline-block;
	position: relative;
	z-index: 9;
}
#all_filters #date_creation, #all_filters #end_date{
    border: 1px solid #D3D3D3;
    border-radius: 8px;
    height: 35px;
    font-size: 16px;
    padding: 0px 10px;
    background-color: white;
    cursor: pointer;
    margin: 0px 10px 0px 0px;
}
#filters, #all_filters select{
    font-style: normal;
    font-weight: 400;
}
input#end_date {
    width: 100px;
    margin: 0px !important;
    padding: 0px 12px 0px 0px !important;
    text-align: start;
}
#arrowDownOrders{
	    transform: rotate(45deg);
    border: solid black;
    border-width: 0 2px 2px 0;
    display: inline-block;
    padding: 3px;
    position: absolute;
    top: 12px;
    left: 14px;
}
ul#orfers {
    position: absolute;
    top: 25px;
    display: none;
	background-color: white;
    border-radius: 5px;
    box-shadow: 0px 8px 40px 0px rgba(16, 48, 131, 0.16);
    z-index: 1;
    padding: 0px;
    font-size: 14px;
	    width: 98px;
}
li.order {
    appearance: auto;
    border-bottom: 1px solid rgba(0, 0, 0, 0.20);
    padding: 5px;
	cursor: pointer;
}
.tasks{
    overflow: hidden;
    height: calc(100vh - 300px);
    overflow-y: auto;
    width: 60%;
}
.wrap_background{
    background-color: #f5f9fc;
    border-radius: 33px;
    margin: 25px;
    padding: 25px 15px 25px 0px;
    position: relative;
}
.tasks_wrap{
    padding: 0 30px;
}
.chat_wrap{
    height: calc(100% - 15px);
    /* background-color: white; */
    border-radius: 6px;
    padding: 15px 10px 0px 10px;
    position: relative;

}
.active:hover + div, .active + div:hover, .cancel_partnership_start:hover{
    display: inline-block;
}
.cancel_partnership{
    display: none;
    /* position: absolute;
    height: 12px;
    width: 12px;
    background-color: #FA5454;
    border-radius: 50%;
    top: 9px; */
    position: relative;
    height: 12px;
    width: 12px;
    background-color: #FA5454;
    border-radius: 50%;
    top: -17px;
    left: 20px;
    margin-right: -12px;
}
.cancel_partnership img {
    position: absolute;
    top: 3px;
    left: -2px;
	margin: 0 5px;
}
.cancel_partnership_start{
    display: none;
    position: relative;
    top: -5px;
    height: 15px;
    width: 15px;
    left: 18px;
    background-color: #FA5454;
    border-radius: 50%;
    margin-right: -17px;
}
.cancel_partnership_start img {
    position: absolute;
    top: 2px;
    left: 3px;
    width: 10px;
}
#deleteUser > img {
    position: absolute;
    top: 12px;
    left: 13px;
}
button#deleteUser {
    background-color: #FA5454;
    margin-right: 20px;
}



/* Hide scrollbar for Chrome, Safari and Opera */
.noneScroll::-webkit-scrollbar {
    display: none;
}

/* Hide scrollbar for IE, Edge and Firefox */
.noneScroll {
-ms-overflow-style: none; 
scrollbar-width: none; 
}

/* multiple selection */
#optionsSelected{
    margin-right: 20px;
    margin-top: 20px;
}
.textSelected {
    margin-right: 15px;
}
#optionsSelected > *{
    display: inline-block;
}
.iconSelected {
    position: relative;
    top: 5px;
}
#setPerformPopup{
    position: absolute;
    background-color: white;
    box-shadow: 0px 1px 26px rgba(2, 99, 209, 0.1);
    border-radius: 5px;
    padding: 5px;
    top: 129px;
    z-index: 1;
    width: 80px;
    right: 45px;
}
img.usersForSetPer {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    cursor: pointer;
}
#levelSelected{
    top: 130px !important;
    right: 344px;
}



/* css task */
.sidebar{
    border-left: 1px solid #E7EBEE;
   /* display: none;*/
}
.task_item{
    padding: 10px;
    background-color: white;
    margin: 5px 0;
    border-radius: 15px;
    border-left: 2px solid red;
    margin-left: 15px;
    height: 33px;
    position: relative;
    cursor: pointer;
}
.height_expand_task{
    height: 90px;
}
.hr_expand_task{
    width: 100%;
    height: 0.2px;
    background: black;
    border-radius: 0px;
}
#content_task > #title_task_content {
    font-weight: 700;
    margin-bottom: -3px;
}
.update_level{
    background-color: #63D0B4;
    height: 12px;
    width: 12px;
    border-radius: 50%;
    margin-left: 10px;
}
.update_level_mobile{
    display: none;
}
.update_level_mobile_icon{
    display: none;
}
.levels, #levelSelected{
    display: none; 
    position: absolute;
    background-color: white;
    box-shadow: 0px 1px 26px rgba(2, 99, 209, 0.1);
    border-radius: 5px;
    /* padding: 5px; */
    padding: 0px 10px 7px 5px;
    top: 37px;
    z-index: 1;
    width: 80px;
    text-align: center;
}
.levels_mobile{
    display: none;
}
.levels hr, #levelSelected hr{
    height: 1px;
    width: 100%;
}
.levels [class^=level], #levelSelected [class^=level]{
    height: 29px;
    margin-top: -14px;
}
/* .levels .level_now{
    background-color: #627DDF;
    color: white;
} */
.icon_level {
    height: 10px;
    width: 10px;
    position: relative;
    top: 17px;
    right: -1px;
    border-radius: 50%;
}
.levels input, #levelSelected input{
    border: 0px;
    border-radius: 5px;
    background-color: white;
}
.task_title {
    font-weight: 500;
    padding: 2px 0px;
    display: inline-block;
    overflow: hidden;
    max-width: calc(100% - 33px);
    font-size: 18px;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.edit_title, .edit_name_file{
    /* display: none; */
    position: relative;
    top: -8px;
    width: 12px;
    cursor: pointer;
}
.title_in_edit{
    border: 0px;
    outline: 0px;
    border-bottom: 1px solid;
    width: 60%;
    height: 19px;
    vertical-align: 15px;
}
.wrap_edit_title, .wrap_edit_name_file{
    display: none;
    position: relative;
    padding-right: 15px;
    right: -15px;
}
.task_item:hover .wrap_edit_title, .wrap_edit_title:hover, .name_file:hover ~ .wrap_edit_name_file, .wrap_edit_name_file:hover{
    display: inline-block;
}

.X_and_V{
    /* position: absolute; */
    display: inline-block;
    width: 30px;
    /* top: 14.5px; */
    /* left: 412px; */
    cursor: pointer;
}
.task_content{
    display: none;
    margin-right: 6px;
}
#task_content{
    word-wrap: break-word;
    overflow: auto;
    max-height: calc(30vh - 120px);
}
#task_content img{
    width: 100%;
}
#content_task{
    border: 1px solid rgba(88, 88, 88, 0.2);
    border-radius: 2px;
    background-color: white;
    padding: 10px;
    position: relative;
}
.file_fold_link{
    background: rgba(217, 234, 255, 0.5);
    border-radius: 4px;
    margin-top: 5px;
    padding: 10px;
    position: relative;
    max-height: calc(30vh - 120px);
    overflow: auto;
}
.task_expand{
    background-color: white;
    padding: 10px;
    border-radius: 6px;
    height: 100%;
    overflow: hidden;
    overflow-y: auto;
}
.wrap_title_content{
    height: 24px;
    width: calc(100% - 282px);
    overflow: hidden;
}

.task_item img {
    max-width: 35px;
    /* border-radius: 50%; */
}
.task_item .perform_user {
    max-width: 35px;
    /* border: 2px solid #5ACB63; */
}
.all_icons{
    position: absolute;
    left: 20px;
    margin-top: 5px;
}
.all_icons > div:nth-child(1){
    box-shadow: none;
    position: relative;
    top: 2px;
}
.all_icons > div:nth-child(2){
    box-shadow: none;
    position: relative;
    top: 1px;
}
.all_icons > div:nth-child(1) > img{
    height: 15px;
    position: relative;
    top: 2px;
}
.all_icons > div:nth-child(2) > img{
    height: 15px;
    position: relative;
    top: 3px;
}
.all_icons > div:nth-child(3) > img{
    height: 9px;
    position: relative;
    top: 1px;
}
.all_icons > div:last-child > img{
    height: 6px;
}
.all_icons > div:last-child{
    background: #F5F7FB;
}
.cancel_task_repeated{
    cursor: pointer;
    background: #FA5454;
    border-radius: 6px;
    border: 0px;
    color: white;
    width: 77px;
    height: 29px;
    display: inline-block;
    font-weight: 600;
    font-size: 13px;
    margin-right: 10px;
}
.projects{
    padding: 3.5px 8px 3.5px;
    color: white;
    border-radius: 5px;
    position: absolute;
	left: 109px;
    top: 18px;
    width: 81px;
    text-align: center;
    outline: none;
    border: none;
    -webkit-appearance: none;
    -moz-appearance: none;
}
.add_task{
    font-size: 20px;
    border-radius: 10px;
    border: 1.4px solid #0174EE;
    width: 100%;
    padding: 7px;
    margin: 0 20px;
}
.user_task{
    border-radius: 50%;
    border: 3px solid transparent;
    height: 30px;
    width: 30px;
    background-position: center center!important;
    background-size: cover!important;
    background-repeat: no-repeat!important;
    border: 1px solid #eeeeee;
    /* display: inline-block; */
    /* margin-right: 10px; */
}
.user_task:first-of-type{
    margin-right: 0px;
}
#active_users{
    border-left: 1px solid rgba(56, 56, 56, 0.4);
    padding-left: 10px;
    padding: 5px 5px 0px 5px;
    border-radius: 5px;
    margin-left: 9px;
    border-left: 0px;
    background-color: #eaf2fd;
    display: flex;
    height: 43px;
}
#all_users{
    overflow: hidden;
    overflow-x: auto;
    width: 100%;
    position: relative;
    padding: 5px 0px 0px 0px;
    height: 47px;
}
span.textUser {
    position: relative;
    font-size: 11px;
    bottom: -26px;
    left: -3px;
    width: 24px;
    text-align: center;
    display: block;
    top: 27.5px;
    display: none;
}
/* div#all_users > img {
    opacity: 0.3;
} */
.user_task.perform_user{
    border-color: #63D0B4;
}
.user_in_no_task, .user_in_task{
    display: inline-block;
    padding: 5px;
    padding-bottom: 2px;
    margin: 3px 0px;
}
.participants .user_img{
    width: 25px;
    height: 25px;
    margin: 0px 5px;
    border-radius: 50%;
    background-position: center!important;
    background-size: cover!important;
    display: inline-block;
    background-repeat: no-repeat;
    border: 1px solid #eeeeee;
}
.perform_user_task, .createor{
    border: 1px solid #5ACB63;
    box-sizing: border-box;
}
.active_b {
    min-height: 25px;
}


/* task open css */
.arrow_wrap{
    display: inline-block;
    position: relative;
    top: -4px;
    height: 16px;
    width: 16px;
    background-color: #F5F7FB;
    margin-right: 10px;
}
.arrow_down{
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    border: solid black;
    border-width: 0 1.5px 1.5px 0;
    display: inline-block;
    padding: 3px;
    margin: 4px;
    margin-top: 0px;
}
.wrap_expand_all_tasks{
    top: 2px;
    border: 1px solid black;
    border-radius: 3px;
    padding: 3px;
    cursor: pointer;
}
.hr_task_open{
    height: 1px;
    width: 99%;
}
.task_contant_edit{
    border: 1px solid rgba(88, 88, 88, 0.2);
    border-radius: 2px;
    width: 50%;
    font-size: 13px;
    outline: 0px;
    padding: 3px 5px;
    height: 15px;
}
.edit_content{
    /* position: absolute;
    margin-right: -20px;
    cursor: pointer;
    width: 13px;
    top: 5px;
    right: 338px; */
    position: absolute;
    top: 14px;
    left: 10px;
}
.wrap_files img{
    max-width: 15px;
    padding: 4px;
    border-radius: 5px;
}
.wrap_files > div{
    display: inline-block;
    margin-left: 5px;
    padding: 2px 2px 0px 2px;
    background-color: #d9eaff7a;
    border-radius: 5px;
    height: 25px;
    /* width: 23px; */
}
.add_file, .add_link, .add_folder, .update_level, .projects, .edit_content, .switch_text, .ignore{
    cursor: pointer;
}
.folder .open_folder{
    padding: 0px;
    border-radius: 0px;
    margin: 5px 5px 0px 5px;
    width: 36px;
}
.name_file_expand{
    position: relative;
    font-size: 8px;
    overflow: hidden;
    top: 5px;
    margin-left: -31px;
    width: 35px;
    height: 10px;
    display: inline-block;
    right: -41px;
    text-align: center;
}
.name_folder_expand{
    position: relative;
    font-size: 8px;
    overflow: hidden;
    top: 8px;
    margin-left: -35px;
    width: 36px;
    height: 8px;
    display: inline-block;
    right: -45px;
    text-align: center;;
}
#title_expand{
    width: calc(100% - 733px);
    position: absolute;
    left: 0px;
    top: 44px;
    font-weight: 700;
    line-height: 14px;
    font-size: 18px;
    line-height: 1.2;
    right: 55%;
    width: 43%;
}

/* Styling for the switcher container */
.switcher {
    display: flex;
    align-items: center;
    cursor: pointer;
    margin-right: 10px;
    border-radius: 10px;
    background-color: #DBECFF;
    padding-left: 3px;
  }
  
  /* Styling for the switch text */
  .switch-text {
    font-size: 16px;
    margin-right: 10px;
  }
  
  /* Styling for the circle indicator */
  .circle-indicator {
    width: 19px;
    height: 19px;
    background-color: red;
    border-radius: 50%;
    margin-right: 5px;
    /* opacity: 0.5; */
    transition: background-color 0.2s;
  }
  
  /* Active state for the circle indicator */
  .switcher.active .circle-indicator {
    background-color: #63D0B4;
    /* opacity: 1; */
  }
.wrapSwitcher {
    display: inline-flex;
}
.wrapSwitcher {
    position: absolute;
    top: 19px;
    left: 90px;
    background-color: #F0F6FF;
    padding: 7px 15px 7px 5px;
    border-radius: 8px;
}

  
div#wrapNotifications {
    position: fixed;
    z-index: 9;
    background-color: white;
    width: 20%;
    height: 0%;
    /* left: -20%; */
    left: 0px;
    box-shadow: 0px 8px 40px rgba(16, 48, 131, 0.2);
    top: 70px;
    
	-moz-transition: all 300ms;
	-webkit-transition: all 300ms;
	transition: all 300ms;
    padding: 0px;
    overflow: hidden;
}
/* div#wrapNotifications *{
    visibility: hidden;
}
.notifications-active div#wrapNotifications *{
    visibility: visible;
} */
.notifications-active div#wrapNotifications { 
	height: auto;
    padding-top: 30px;
    overflow: auto;
}
.groupNotes {
    padding: 10px;
    position: relative;
    background-color: #F5F9FC;
    margin: 10px;
    border-radius: 5px;
}
p.numNew:not(:empty){
    padding: 3px;
    background-color: red;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    text-align: center;
    color: white;
    display: inline-block;
}
p.titleGroupNotes {
    display: inline-block;
    margin: 0px 15px;
    position: relative;
    top: -1px;
}
img.seeNotes {
    position: absolute;
    left: 14px;
    top: 20px;
}
div#approvalsNotes {
    /* margin-top: 30px; */
}
.wrapNotes{
    display: none;
}
.alert_curtain {
    width: 93%;
    height: 50px;
}
.wrapNotes {
    width: 85%;
    margin-top: 15px;
    margin-right: 25px;
}
p.titleTaskNote{
    font-size: 16px !important;
    font-weight: 700 !important;
    display: block !important;
    margin: 0px !important;
}
p.titleTaskNote ~ p {
    margin: 0px;
    font-weight: 500;
}
p.note_x {
    position: absolute;
    top: 15px;
    left: 17px;
    cursor: pointer;
}
.okNote{
    position: absolute !important;
    top: 43px !important;
    left: 15px !important;
    right: auto !important;
    cursor: pointer;
}
.titleTaggingNote > *, .titleTaggingNote > p.titleTaskNote {
    display: inline-block !important;
}
.wrapMessNote p {
    font-weight: 500 !important;
    margin: auto !important;
}



/* popups task css */
.alert_open{
    background-color: white;
    position: absolute;
    padding: 10px;
    right: -132px;
    box-shadow: 0px 8px 40px rgba(16, 48, 131, 0.2);
    border-radius: 6px;
    width: 222px;
    z-index: 1;
}
.alert_open_text{
    background: #627DDF;
    border-radius: 4px;
    border: 0px;
    padding: 5px 10px;
    color: white;
    font-size: 13px;
    width: 85px;
    display: block;
    margin-bottom: 3px;
    font-weight: 400;
    text-align: start;
    cursor: pointer;
}
input[type="date"]{
    border: 0px;
    outline: 0px;
    font-weight: 400;
    font-size: 14px;
    background-color: transparent;
    /* border-left: 0.5px solid rgba(0, 0, 0, 0.2); */
    z-index: 0;
    position: relative;
}
input[type="time"]{
    background-color: transparent;
    border: 0px;
    outline: 0px;
    margin-right: 10px;
    position: relative;
    right: -22px;
    border-right: 0.5px solid rgba(0, 0, 0, 0.2);
    padding: 0px 10px;
}
.date_wrap{
    width: 95.3%;
    background-color: #DBECFF;
    border-radius: 6px;
    padding: 5px;
    margin-top: 10px;
}
.great, .great_alert{
    background-color: #627ddf;
    border: 0px;
    padding: 5px;
    border-radius: 5px;
    color: white;
    font-weight: 500;
    padding-left: 30px;
    margin-right: -19px;
    cursor: pointer;
}
.icon_great{
    width: 15px;
    position: absolute;
    right: 198px;
    top: 125px;
}
img.alert_popup_icon {
    width: 13px;
    position: absolute;
    top: 84px;
    left: calc(45% + 6px);
}

#add_file, #add_folder{
    height: 110px;
    margin-top: 0px;
    display: inline-block;
}
#add_file span{
    font-weight: 700;
    font-size: 16px;
    position: absolute;
    z-index: 1;
    color: white;
    left: 49px;
    bottom: 17px;
}
.add_file + label{
    position: absolute;
    left: 16px;
    color: white;
    font-size: 30px;
    top: 3px;
}
#add_file .add_file{
    background: #627DDF;
    border-radius: 6px;
    padding: 6px 10px 5px 10px;
    color: white;
    width: 96px;
    left: 10px;
    border: 0px;
    font-weight: 700;
    font-size: 12px;
    position: absolute;
    text-align: start;
}
#add_folder label{
    position: absolute;
    right: 79px;
    color: white;
    font-size: 30px;
    top: 3px;
}
#add_folder .add_folder{
    background: #627DDF;
    border-radius: 6px;
    padding: 6px 10px 5px 10px;
    color: white;
    width: 96px;
    right: 10px;
    border: 0px;
    font-weight: 700;
    font-size: 12px;
    position: absolute;
    text-align: start;
}
.file a {
    text-decoration: none;
    color: white;
    font-size: 15px;
    padding: 7px;
    position: absolute;
    top: 9px;
    z-index: 1;
    left: -0.5px;
}
.file .file_task {
    position: relative;
    display: inline-block;
    top: 4px;
    padding: 0px;
    /* height: 23px; */
    overflow: hidden;
    margin: 0px 2px;
}
.file .backIcon {
    padding: 0px;
    max-width: 36px;
    border-radius: 0px;
}
.file div:first-of-type {
    margin-right: 4px;
}
/* .file:has(.file_task:hover) .edit_file, .edit_file:hover{ */
/* .file:hover .edit_file, .edit_file:hover{
    display: block;
} */
.file .edit_file{
    position: fixed;
    background-color: white;
    /* top: 26px; */
    box-shadow: 0px 8px 40px rgba(16, 48, 131, 0.16);
    border-radius: 5px;
    /* left: 204px; */
    z-index: 1;
    display: none;
    /* width: 130px; */
    /* width: 246px; */
    padding:  15px 15px 15px 1px;
    padding-top: 5px;
    /* height: 185px; */
    height: 32px;
    visibility: visible;
    /* transition: width 0.3s ease-in-out, height 0.3s ease-in-out; */
}
.file hr {
    width: 100%;
    height: 1px;
}
.file .edit_file > *{
    /* display: block; */
    position: relative!important;
    margin-left: 10px;
}
.file .name_file{
    display: inline-block;
    /* max-width: 71%; */
    max-width: 75px;
    overflow: hidden;
    height: 20px;
    font-weight: 600;
    margin-top: 10px;
    margin-left: 10px; 
    margin-right: 5px;
    text-overflow: ellipsis;
}
.file .edit_file img{
    cursor: pointer;
    padding: 0px;
    border-radius: 0px;
    margin-left: 10px;
    top: initial!important;
    right: initial!important;
    position: relative!important;    
}
.file .edit_file a{
    top: -2px;
    padding: 0px;
    left: 0px;
    position: relative;
}
/* .file .wrap_edit_name_file{
    right: 0px;
    padding-right: 0px;
    top: 2px;
} */
.file .remove_file{
    /* top: 8px;
    position: absolute;
    left: 85px; */
    width: 15px;
}
.file .down_file{
    /* top: 6px;
    left: 57px; */
}
.file .down_file img{
    width: 15px;
}
.file .shar_file{
    top: -3px;
    width: 15px;
    /* position: absolute;
    left: 35px; */
}
.file .email_file{
    /* top: 6px; */
    /* margin-left: 5px; */
}
.file .edit_name_file{
    padding: 0px;
    border-radius: 0px;
    padding-right: 7px;
}
.file .wrap_edit_name_file{
    margin-right: 0px;
    top: 0px;
}
.delete_or_edit, #popUpMessage{
    background-color: white;
    box-shadow: 0px 8px 40px rgba(16, 48, 131, 0.16);
    border-radius: 5px;
    position: absolute;
    top: 27px;
    padding: 5px;
    z-index: 1;
    /* height: 25px; */
    width: 50px;
    height: 0px;
}

.link_task{
    display: inline-block;
    position: relative;
    top: -2px;
    border-radius: 2px;
    background-color: #36AA8C;
    margin-right: 4px;
    margin-left: 2px;
    text-decoration: none;
    width: 90px;
    height: 23px;
}
.link_task p{
    position: relative;
    color: white;
    margin-right: 5px;
    display: inline-block;
    width: 90%;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-left: 1px;
    top: 1.5px;
    font-weight: 400;
    font-size: 14px;
    white-space: nowrap;
    word-wrap: break-word;
}
.link_task img{
    height: 7px;
    display: inline-block;
    position: relative;
    top: -1px;
    padding: 4px;
    margin-left: 2px;
    margin-right: -4px;
    display: none;
}
#add_link{
    height: 50px;
}
#add_link span{
    position: absolute;
    font-weight: 700;
    font-size: 16px;
    z-index: 1;
    color: white;
    left: 49px;
    bottom: 17px;
}
#add_link img{
    position: absolute;
    height: 13px;
    top: 18px;
    left: 20px;
}
#add_link .add_link{
    background: #627DDF;
    border-radius: 6px;
    padding: 6px 10px 5px 10px;
    color: white;
    width: 95px;
    left: 10px;
    border: 0px;
    font-weight: 700;
    font-size: 12px;
    position: absolute;
    text-align: start;
}

/* css frequency */
.repeated_open{
    background-color: white;
    position: absolute;
    padding: 10px;
    right: -214px;
    box-shadow: 0px 8px 40px rgba(16, 48, 131, 0.2);
    border-radius: 6px;
    width: 274px;
    z-index: 1;
    text-align: start;
}
.text_frequency{
    font-weight: 400;
    font-size: 13px;
    display: inline-block;
}
.frequency_selection{
    display: inline-block;
    background: #DBECFF;
    border-radius: 4px;
    margin-right: 6px;
    padding: 3px;
    height: 22px;
    position: relative;
    top: 3px;
}
.frequency{
    font-weight: 400;
    font-size: 13px;
    border: 0px;
    border-radius: 5px;
    height: 18px;
    padding: 0px 10px;
    position: relative;
    top: -1px;
    background: transparent;
    cursor: pointer;
}
.frequency_now{
    background: #254C71 !important;
    color: white;
}
.settings_frequency_text{
    font-weight: 400;
    font-size: 13px;
    display: inline-block;
    margin-top: 17px;
}
.settings_frequency{
    display: inline-block;
    background: #DBECFF;
    border-radius: 4px;
    margin-right: 6px;
    padding: 3px;
    height: 18px;
    position: relative;
    top: 2px;
}
.settings_frequency input[type="time"]{
    right: 0px;
    border: 0px;
    margin: 0px;
    top: -1px;
}
.repeated_open .great{
    width: 97%;
    margin: 0px;
    font-weight: 700;
    margin-top: 12px;
}
.repeated_open .icon_great{
    top: 87px;
    right: 154px;
}
input[type="number"]{
    width: 30px;
    display: inline-block;
    background-color: #DBECFF;
    border: 0px;
    height: 29px;
    border-radius: 5px;
    outline: 0px;
    padding-right: 6px;
}
.settings_frequency select{
    display: inline-block;
    background-color: #DBECFF;
    border: 0px;
    height: 29px;
    border-radius: 5px;
    outline: 0px;
    -webkit-appearance: none;
    width: 55px;
    padding-right: 5px;
}
.arrow_number{
    position: absolute;
    width: 9px;
    height: 9px;
    background-color: white;
    top: 9px;
    right: 26px;
    border-radius: 3px;
}
.arrow_f_up{
    width: 0;
    height: 0;
    border-left: 2px solid transparent;
    border-right: 2px solid transparent;
    border-bottom: 3px solid black;
    position: absolute;
    top: 3px;
    right: 2.5px;
}
.arrow_f_down{
    width: 0;
    height: 0;
    border-left: 2px solid transparent;
    border-right: 2px solid transparent;
    border-top: 3px solid black;
    position: absolute;
    top: 3.5px;
    right: 2.5px;
}
.alert, .repeated, .completed, .participants .user_img, .div_expand_task, .cancel_completed, .textSelected, .icon_level, .icon_level+p{
    cursor: pointer;
}
 
.alert:hover, #wrapIconCurtain:hover{
	animation: swing ease-in-out 0.4s infinite alternate;
    transform-origin: center -20px;
}

@keyframes swing {
    0% { transform: rotate(3deg); }
    100% { transform: rotate(-3deg); }
}
 
.div_expand_task{
    display: none;
}

/* chat css */
.chat_users .first_name{
    font-size: 22px;
    font-weight: 600;
}
.chat_users .first_name:after {
    content: ",";
    padding-left: 10px;
}
.chat_users .first_name:last-child:after {
    content: ".";
}
.chat_user .profile_massage {
    width: 16px;
    height: 16px;
    border-radius: 50%;
}
img.option_massage {
    position: absolute;
    top: 12px;
    margin-right: 10px;
    left: 15px;
    cursor: pointer;
}
.chat_user .first_name{
    color: #637BD0;
    text-decoration: underline;
    position: relative;
    top: -5px;
    margin-right: 5px;
}
#deleteMassage, #qouteMessage{
    cursor: pointer;
    display: block;
    margin-right: 10px;
}
#deleteMassage img, #qouteMessage img{
    height: 10px;
    margin-left: 5px!important;
}
div#popUpMessage {
    left: 17px;
    padding: 5px 10px;
    /* width: auto; */
    padding-left: 15px;
    padding-bottom: 1px;
    /* height: auto; */
}
p.quoteUserName {
    color: #627ddf;
}
.chat_item{
    margin-bottom: 5px;
    word-break: break-word;
}
.chat_item.userCurrent{
    justify-content: end;
}
.chat_item .chat_style{
    padding: 10px;
    border-radius: 15px;
}
.chat_item.userCurrent .chat_style{
    background-color: #DBECFF;
}
.chat_item .chat_style{
    min-width: 50%;
    position: relative;
    margin: 0px 10px;
    max-width: 75%;
    line-height: 1.2;
}
p.time_mess {
    font-size: 10px;
    color: #627DDF;
    position: absolute;
    left: 12px;
    /* top: 11px; */
    color: black;
    bottom: 3px;
}
.triangle {
    width: 0;
    height: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-top: 15px solid #F0F6FF;
} 
.noCurrent .triangle_massege {
    position: absolute;
    top: 0px;
    right: -9px;
    border-top-color: white;
} 
.userCurrent .triangle_massege {
    position: absolute;
    top: 0px;
    right: auto;
    border-top: 15px solid #DBECFF;
    left: -10px;
} 
.chat_item.noCurrent .chat_style{
    background-color: white;
}
.users{
    margin-right: 7%;
    align-items: flex-start;
}
#search, #message{
    border: #637bd0 1px solid;
    border-radius: 5px;
    height: 25px;
    width: 95%;
}
#message img{
    border-radius: 5px;
    display: block;
    margin: 5px;
    width: 100%;
}
.wrapSearchAllChats {
    position: relative;
    background-color: white;
    border-radius: 5px;
    padding: 5px;
    font-size: 13px;
    width: 93%;
    margin-bottom: 10px;
}
.wrapSearchAllChats > * {
    display: inline-block;
    margin-right: 5px;
}
input#isSearchAllchats {
    float: right;
}
#message {
    /* bottom: 17px;
    position: absolute;
    width: 89%; */
    border: 0px;
    outline: 0px;
    overflow: auto;
    white-space: nowrap;
    height: auto;
    white-space: pre-wrap;
    max-height: 150px;
    padding: 2px 0px;

}
.imgMessage{
    /* height: 50px; */
    max-width: 100%;
    display: block;
}
#wrapMessage{
    border: #637bd0 1px solid;
    border-radius: 5px;
    height: auto;
    bottom: 0;
    position: absolute;
    width: 89%;
    background-color: white;
}
#quoteMessage, .quoteMessage {
    /* background-color: #63d0b426; */
    background-color: #F0F6FF;
    width: 85%;
    border-radius: 5px;
    margin: 5px;
    padding: 5px 20px 5px 5px;
    position: relative;
    display: none;
}
.quoteMessage {
    display: block;
    width: 70%;
}
#quoteSite{
    width: 5px;
    background-color: #627ddf;
    border-radius: 5px;
    position: absolute;
    right: 7px;
    top: 5px;
    bottom: 5px;
}

.chat_content{
    overflow-x: hidden;
    height: calc(98VH - 414px);
    width: 100%;
}
div.contant_message > p {
    word-break: break-word;
    margin-left: 30px;
}
img.userSee {
    border-radius: 50%;
    width: 20px;
    height: 20px;
    margin-left: 10px;
}
.usersShow {
    position: absolute;
}
div#taggingUser {
    position: absolute;
    background-color: white;
    z-index: 1;
    border-radius: 5px;
    bottom: 50px;
    box-shadow: 0px 0px 20px #80808073;
    padding: 15px;
    overflow-y: auto;
    max-height: 150px;
    width: 82%;
}
span.taggedUser{
    background-color: #ecf4ff;
    padding: 2px 4px;
    border-radius: 5px;
}
div#chatWrapSearch {
    height: calc(100% - 15px) !important;
    border-radius: 6px;
    padding: 0px 10px 0px 10px;
    position: relative;
    background-color: white;
    height: 100% !important;
}
#contentSearch{
    height: 78%;
    overflow: hidden;
}
p.closeSearch {
    position: absolute;
    z-index: 1;
    top: 8px;
    cursor: pointer;
}
img.arrowScroll {
    position: absolute;
    bottom: -40px;
    left: 0px;
    cursor: pointer;
    width: 40px;
    height: 109px;
    overflow: hidden;
    object-fit: cover;
    margin: 0px 10px;
}
p.titleSearch {
    background-color: #F0F6FF;
    width: calc(100% + 20px);
    position: relative;
    right: -10px;
    padding: 7px 28px 7px 0px;
    margin-bottom: 20px;
    width: 100%;
}
.searchWrapNessages.scrollbar {
    height: 150px;
    overflow: hidden;
    overflow-y: auto;
    margin: 10px 0px;
}
p.searchTitleTask {
    font-weight: 700;
}

.close:not(#cancel_completed_popup .ignore), .close_ignore, .close_popup, .close_alert_popup, .close_chat{
    position: absolute;
    top: 0px;
    right: 0px;
    background-color: transparent;
    border: 0px;
    cursor: pointer;
}

#popup_delete{
    height: auto;
}


/* width */
.scrollbar::-webkit-scrollbar {
    width: 6px;
    height: 4px;
    /* margin-right: 10px; */
  }
  
  /* Track */
  .scrollbar::-webkit-scrollbar-track {
    background: #EDEDED    ; 
    border-radius: 5px;
  }
   
  /* Handle */
  .scrollbar::-webkit-scrollbar-thumb {
    background: #63D0B4; 
    border-radius: 5px;
  }
  
  /* Handle on hover */
  .scrollbar::-webkit-scrollbar-thumb:hover {
    background: #555; 
  }

   /* input[type="date"]::-webkit-inner-spin-button, */
.scrollbarHighlight{
    height: 15px;
    width: 19px;
    background-color: #63d0b4;
    border-radius: 50%;
    position: relative;
    right: -11px;
    margin-left: -15px;
    cursor: pointer;
    box-shadow: 0px 0px 5px 0px #9b9b9b;
    display: none;
}

input[type="date"]::-webkit-calendar-picker-indicator, input[type="time"]::-webkit-calendar-picker-indicator {
    background: transparent;
    bottom: 0;
    color: transparent;
    cursor: pointer;
    height: auto;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: auto;
}
/* input[type="time"]::-webkit-inner-spin-button, */

/* popup*/
#background_popup{
    background-color: #80808073;
    width: 100%;
    height: 100%;
    position: fixed;
    z-index: 2;
	top: 0;
    left: 0;
	display: none;
}
.popup{
    position: fixed;
    background-color: white;
    top: 40%;
    left: 40%;
    height: 90px;
    width: 316px;
    border-radius: 5px;
    box-shadow: 0px 0px 20px #80808073;
    padding: 10px;
    text-align: center;
    z-index: 10;
	visibility: hidden;
	transform: translateY(-20px);
	transition: all .5s ease;
    /* left: 20% !important;
    top: 40% !important; */
}
.popup.visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(10px);
  transition: all .5s ease;	
}
.popup p{
    font-weight: 700;
    margin-top: 15px;
    font-size: 14px;
}
#cancel{
    margin-top: 15px;
    height: 25px;
    width: 45%;
    color: white;
    background: #D3D3D3;
    border: 0px;
    border-radius: 6px;
    cursor: pointer;
}
.popup .yes{
    height: 25px;
    width: 45%;
    margin-right: 10px;
    border: 0px;
    background: #627DDF;
    border-radius: 6px;
    color: white;
    cursor: pointer;
}
.popup img:not(.img_popup_stack img, div#popUpsettingsUser img){
    width: 20px;
    position: absolute;
    top: 61px;
    right: 104px;
}
.img_popup_stack{
    position: absolute;
    top: 5px;
    left: 5px;
    display: none;
}
.img_popup_stack img{
    margin-left: 10px;
    width: 10px;
}
#content_popup_task{
    border: 1px solid rgba(88, 88, 88, 0.2);
    border-radius: 5px;
    padding: 5px 7px;
    outline: 0px;
    resize: none;
    width: 95%;
    margin-top: 10px;
    height: 130px;
    margin-bottom: 10px;
}
.popup img:last-child{
    right: 259px;
    top: 63px;
}
.tox.tox-tinymce {
    height: 250px !important;
    margin: 10px 0px;
}
.tox-statusbar, .tox-promotion {
    display: none !important;
}

/* pop_up change perform css */
#popup_change_perform{
    height: 110px;
    padding: 25px;
    width: 235px;
}
.ask_pop_up{
    display: inline-block;
}
.name_user_pop_up{
    margin: 0px 3px !important;
    color: #627DDF;
}
#popup_change_perform #cancel{
    width: 40%;
    text-align: start;
    padding-right: 15px;
}
#popup_change_perform .yes{
    width: 30%;
}
#popup_change_perform img{
    width: 15px;
    top: 110px;
    right: 129px;
}

/* popup add link */
#popup_add_link{
    height: 190px;
    padding: 20px;
}
#popup_add_link #text, #popup_add_link #url{
    display: block;
    width: 90%;
    margin-top: 10px;
    background-color: #F5F9FC;
    border: 0px;
    padding: 7px 10px;
    border-radius: 5px;
    outline: 0px;
}

/* alert css */
#alerts_popup{
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 2;
    width: 25%;
    text-align: center;
}
.alert_popup:not(#cancel_completed_popup){
    background-color: white;
    border-radius: 6px;
    padding: 10px;
    position: absolute;
    width: 100%;
    z-index: 5;
    /* height: 120px; */
    margin-bottom: 10px;
    bottom: 0px;
    box-shadow: 0px 1px 26px rgba(2, 99, 209, 0.1);
}
.alert_popup:not(.alertCurtain){
    display: none;
}
#cancel_completed_popup{
    visibility: visible;
    display: block;
    height: auto;
}
.alert_tagg_user p {
    display: inline-block;
    margin-left: 7px;
}
.alert_tagg_user p.name_user_pop_up {
    margin: 0px 7px !important;
}
.alert_popup p{
    font-weight: 500;
    font-size: 14px !important;
    margin: 16px 0px !important;
}
.alert_popup .titleTaskNote{
    font-weight: 500 !important;
}
.first_button{
    background: #D3D3D3;
    border-radius: 4px;
    border: 0px;
    padding: 5px;
    width: 92px;
    color: white;
    font-weight: 600;
    cursor: pointer;
}
.alert_popup .second_button{
    border-radius: 4px;
    border: 0px;
    padding: 5px;
    width: 92px;
    background-color: #63D0B4;
    margin-right: 5px;
    font-weight: 600;
    color: white;
    text-align: start;
    padding-right: 20px;
    cursor: pointer;
}
.chird_button{
    background: #627DDF;
    border-radius: 4px;
    border: 0px;
    padding: 5px;
    width: 105px;
    color: white;
    margin-right: 5px;
    font-weight: 600;
    text-align: start;
    padding-right: 10px;
    cursor: pointer;
}
.alert_now{
    background-color: #DBECFF;
}
input[type=number]::-webkit-inner-spin-button {
    /* opacity: 1;
    background-color: white;
    width: 100px; */
    -webkit-appearance: none;
    margin: 0;
  
}
.alert_change_perform p{
    display: inline-block;
}



.yes:active, .great:active, .add_link:active, .add_file:active, .add_folder:active, .icons > *:active:not(.popup_for_remove) {
    transform: scale(0.85);
    box-shadow: 3px 2px 25px 1px rgba(0,0,0,0.25);
}
input.select_task {
    margin-left: 10px;
    width: 20px;
    height: 20px;
    border: 1px solid #A5A6F6;
    border-radius: 3px;
    -webkit-appearance: none;
}
input[type="checkbox"]:checked::before:not(#isSearchAllchats, #remember_login)
{
    content: "\2714";
    font-size: 14px;
    position: absolute;
    margin-right: 3px;
    top: 16px;
    color: #A5A6F6;
}
.switch{
    display: none;
}
.expand{
    display: inline-block;
    height: 100%;
}
.close_chat, .chat_users, #main_title{
    display: none !important;
}
#wrap_tablet{
    width: 52%;
    height: calc(100vh - 300px);
    overflow: hidden;
}
/*#burger{
    display: none;
}*/
.profile:not(.menu-active .sidebar .profile){
    right: -20px;
    top: 23px;
}
p#countTasksAllocated:not(.menu-active .sidebar #countTasksAllocated){
    font-size: 7px;
    padding: 0px 2px;
    left: -13px;
}
img.perform_user:not(.menu-active .sidebar .perform_user){
    width: 38px  !important;
}
img#editProfile:not(.menu-active .sidebar #editProfile){
    left: -30px;
    width: 45px;
    top: calc(53% - 10px);
}
.profile #user_name_in_profile:not(.menu-active .sidebar #user_name_in_profile){
    display: none;
}
p#user_email_in_profile:not(.menu-active .sidebar #user_email_in_profile){
    display: none;
}
hr:not(.menu-active .sidebar hr, .levels hr){
    display: none;
}
p.sliderTitle:not(.menu-active .sidebar p.sliderTitle){
    display: none;
}
img.sliderDowmArrow:not(.menu-active .sidebar img.sliderDowmArrow){
    display: none;
}
.sidebar:not(.menu-active .sidebar){
    width: 55px;
    border-left: 0px;
}
.dropDownSlider:not(.menu-active .sidebar .dropDownSlider){
    display: none !important;
}




#burger{
	display: inline-block;
    position: fixed;
    top: 18px;
    cursor: pointer;
    z-index: 9;
    right: 26px;
}
.sidebar{
    z-index: 1;
    background-color: white;
    width: 225px;
    height: 100VH;
	-moz-transition: all 300ms;
	-webkit-transition: all 300ms;
	transition: all 300ms;
	/* right: -225px; */
	position: fixed;
}
.menu-active .sidebar {
  right: 0px;
}
#section_tasks {
	right: 0;
	position: relative;
	width: 100VW;
	-moz-transition: all 300ms;
	-webkit-transition: all 300ms;
	transition: all 300ms;
    /* right: 45px;
    width: calc(100VW - 53px); */
    right: 45px;
    width: calc(100VW - 53px);
}
.menu-active #section_tasks {
	right: 225px;
	width: calc(100VW - 251px);
}
section.sidebar.col-15[style="display: block;"] + #section_tasks #wrap_search_all_tasks #burger {
    position: fixed;
    top: 56px;
    right: 38px;
}
#wpadminbar {
	display: none;
}
html {
	margin-top: 0!important;
}
.loading {
	background:#f5f9fcdb;
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 9999999;
    vertical-align: middle;
	border-radius: 33px;
	top:0;
	right:0;
}

#filters li.slider {
	position: absolute;
    width: 50px;
    height: 29px;
    right: 5px;
    top: 5px;
    background-color: #627DDF;
    z-index: 8;
    transition: right 0.4s;
    list-style: none;
    pointer-events: none;
    border-radius: 8px;
}

#filters il {
	color: black;
	transition: color 0.8s;
}

#filters il:hover,
#filters il.tasks_now{
	color: white;
}

#filters il:nth-child(1).tasks_now ~ .slider {
    /* width: 50px;
    right: 5px; */
    width: 75px;
    right: 5px;
}

#filters il:nth-child(2).tasks_now ~ .slider {
    /* right: 65px;
    width: 64px; */
    right: 90px;
    width: 65px;
}

#filters il:nth-child(3).tasks_now ~ .slider {
    /* right: 179px;
    width: 50px; */
    right: 166px;
    width: 59px;
}

#filters il:nth-child(4).tasks_now ~ .slider {
    right: 240px;
    width: 28px;
}

#filters il:nth-child(5).tasks_now ~ .slider {
    right: 323px;
    width: 74px;
}


#filters il:nth-child(1):hover ~ .slider,
#filters il:nth-child(1):focus ~ .slider {
    width: 75px;
    right: 5px;
}
#filters il:nth-child(2):hover ~ .slider,
#filters il:nth-child(2):focus ~ .slider{
    right: 90px;
    width: 65px;
}
#filters il:nth-child(3):hover ~ .slider,
#filters il:nth-child(3):focus ~ .slider {
    /* right: 179px;
    width: 50px; */
    /* right: 168px;
    width: 55px; */
    right: 166px;
    width: 59px;

}
#filters il:nth-child(4):hover ~ .slider,
#filters il:nth-child(4):focus ~ .slider {
    right: 240px;
    width: 28px;
}
#filters il:nth-child(5):hover ~ .slider,
#filters il:nth-child(5):focus ~ .slider {
    right: 323px;
    width: 74px;
}

.onOffWrapper{
	height: 23px;
	display: inline-block;
	line-height: 19px;
}

.onOffWrapper p{
    display: inline-block;
    margin: 0;
    vertical-align: top;
    padding-top: 2px;
    padding-left: 5px;
}

.onOffWrapper input{
	display: none!important;
}

.onOffWrapper label{
width: 77px;
    height: 23.5px;
    display: inline-block;
    position: relative;
    font-size: 0;
    overflow: hidden;
    border-radius: 10px;
    transform: translateZ(0);
    cursor: pointer;
}

.onOffWrapper label div{
    width: 19px;
    height: 19px;
    -webkit-transition: all 0.3s ease 0s;
    -moz-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    position: absolute;
    top: 2px;
    left: 3px;
    box-sizing: border-box;
    border-radius: 50%;
    background: red;
    z-index: 100;
}

.onOffWrapper label:after{
	z-index: 10;
    content: 'מושתק';
    position: absolute;
    width: 77px;
    height: 23.5px;
    background: #DBECFF;
    border-radius: 10px!important;
    color: black;
    font-size: 16px;
    text-align: right;
    -webkit-transition: all 0.3s ease 0s;
    -moz-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    padding-right: 6px;
    padding-top: 2px;
}

.onOffWrapper label:before{
	z-index: 5;
    content: 'מופעל';
    position: absolute;
    width: 77px;
    height: 23.5px;
    background: #DBECFF;
    border-radius: 10px!important;
    color: black;
    font-size: 16px;
    text-align: center;
    text-indent: 17px;
    transform: translatex(-79px);
    -webkit-transition: all 0.3s ease 0s;
    -moz-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    padding-top: 2px;	
}


.onOffWrapper input:checked + label div{
	transform: translatex(52px);
	background: #63D0B4;
}
.onOffWrapper input:checked + label:after{
	transform: translatex(79px);
}
.onOffWrapper input:checked + label:before{
	transform: translatex(0px);
}

#usersPage {
    height: calc(100VH - 108px);
}

#users {
    height: calc(100% - 89px);
    overflow: auto;
}

/* mobile */
@media only screen and (max-width: 768px) {
    .update_level{
        /* position: absolute;
        top: 41px;
        right: 37px; */
        display: none;
    }
    .levels{
        top: 112px;
        right: 105px;
        width: 56px;
        font-size: 12px;
    }
    .img_chat{
        position: absolute;
        top: 93px !important;
        left: 105px;
    }
    .projects{
        position: absolute;
        right: 10px;
        top: 90px;
    }
    .all_icons{
        position: absolute;
        top: 84px !important;
    }
    .col-15{
        display: none;
    }
    .col-20{
        display: none;
    }
    .col-28{
        display: none;
    }
    .col-30{
        display: none;
    }
    .col-40{
        display: none;
    }
    .col-60{
        display: none;
    
    }
    .col-70{
        display: none;
    }
    .col-72{
        /* width: 100%; */
    }
    .col-80{
        display: none;
    }
    .col-85{
        width: 100%;
    }
    .col-100{
        width: 100%;
    }
    .wrap_background{
        margin: 0px;
        padding: 10px;
        padding-top: 0px;
    }
    .task_item{
        margin-left: 0px;
        width: 92%;
        height: 100px;
        align-content: flex-start;
        flex-wrap: wrap;
        align-items: flex-start;
    }
    .wrap_title_content{
        width: 85%;
        height: 50px;
        margin-top: 2px;
    }
    .X_and_V{
        left: auto;
    }
    .X_and_V:nth-child(3){
        left: 104px;
    }
    .task_title{
        height: 46px;
        overflow: hidden;
        width: auto;
        font-size: 16px;
        
    }
    .hr_task_open{
        margin-top: 65px;
    }
    .task_contant_edit{
        width: 96%;
    }
    /* .edit_content{
        right: auto;
        left: 7px;
    } */
    .wrap_files{
        margin-top: 8px;
        position: initial !important;
        width: 4000px;
    }
    .height_expand_task{
        height: 205px;
    }
    .wrap_add_task{
        margin-top: 10px;
        flex-wrap: wrap;
    }
    .wrap_input_add_task{
        width: 86%;
        display: block;
        margin-bottom: 20px;
    }
    .users{
        width: 100%;
        display: block;
    }
    #active_users{
        display: inline-block;
    }
    #all_users{
        display: inline-block;
        width: 79%;
        height: 51px;
    }
    #popup_delete{
        width: 200px;
    }
    .popup{
        width: 200px;
        /* height: 150px; */
        height: auto;
        top: 15% !important;
        left: 20% !important;
        /* top: 40% !important; */
    }
    #cancel, .popup .yes{
        width: 70% !important;
        margin-right: 0px !important;
    }
    #cancel{
        margin-bottom: 10px;
    }
    #ok_delete_file{
        display: block;
        margin-right: 27px;
        margin-top: 10px;
    }

    #all_filters{
        display: block;
        width: 100% !important;
        margin-bottom: 10px;
    }
    .wrap_wrap_expand_all_tasks_for_mobile{
        display: inline-block;
    }
    #wrap_filters{
        overflow: hidden;
        overflow-x: scroll;
        width: 343px;
        margin-right: -9px;
    }
    #filters{
        width: 344px;
        margin-top: 0px;
        font-size: 14px;
    }
    #filters il{
        margin-left: 0px;
    }
    .tasks_now{
        font-size: 15px;
    }
    .update_level_mobile{
        display: block;
        position: relative;
        top: 28px;
        height: 22px;
        width: 70px;
        border-radius: 5px;
        border: 0px;
        color: white;
        right: 95px;
    }
    /* .levels_mobile{
        display: block;
    } */
    .levels [class^=level]{
        height: 22px;
        margin-top: -13px;
    }
    .icon_level {
        height: 8px;
        width: 8px;
        position: relative;
        top: 13.5px;
        right: -1px;
        border-radius: 50%;
    }
    div#upfp_container{
        display: none !important;
    }
    #wrap_search_all_tasks{
        display: none;
    }
    #remove_task{
        margin-right: 0px;
        margin-top: 8px;
    }
    #cancel_remove_task_icon{
        width: 10px !important;
        right: 126px !important;
        top: 88px !important;
    }
    #remove_task_icon{
        width: 13px !important;
        right: 127px !important;
        top: 121px !important;
    }
    #delete_file_or_link{
        width: 10px !important;
        top: 125.5px !important;
        right: 129px !important;
    }
    #cancel_delete_file_or_link{
        width: 10px !important;
        top: 90px !important;
        right: 129px !important;
        
    }
    #popup_task{
        /* height: 253px !important; */
        width: 290px !important;
        left: 8% !important;
        top: 25% !important;
    }
    #update_popup_content{
        width: 40% !important;
        /* position: absolute;
    bottom: 13px;
    left: 5px; */
    }
    #popup_change_perform{
        left: 12% !important;
    height: auto;
    }
    #popup_change_perform #cancel{
        margin-bottom: 10px;
        padding-right: 45px;
    }
    #popup_change_perform img{
        right: 168px;
    }
    #popup_add_link{
        height: auto;
    }
    #popup_add_link #cancel{
        margin-right: 0px !important;
        margin-bottom: 10px;
    }
    #popup_add_link #cancel + img{
        right: 139px !important;
    }
    #ok_edit_name_file{
        right: 188px;
    }
    #main_title{
        margin-top: 10px;
    }
    .repeated_open{
        width: 120px;
    }
    .cancel_task_repeated{
        width: 42px;
    }
    .text_frequency, .settings_frequency_text, .settings_frequency{
        display: block;
    }
    .frequency_selection{
        display: block;
        background: white;
        height: auto;
        width: auto;
        padding: 0px;
        margin: 0px;
    }
    .repeated_open .great{
        width: 99%;
    }
    .repeated_open .icon_great{
        right: 68px;
    }
    .settings_frequency{
        margin-right: 0px;
        height: auto !important;
    }
    .settings_frequency p, .settings_frequency input{
        margin-right: 0px !important;
        display: block !important;
    }
    .frequency{
        width: 100%;
        margin-bottom: 5px;
        height: 22px;
        text-align: start;
        background: #dbecff;
        display: block;
    }
    .settings_frequency_text{
        font-size: 16px;
    }
    .cancel_partnership{
        height: 24px;
        width: 24px;
        top: 0px;
        left: 17px;
        background-color: #fa545480;
    }
    .cancel_partnership img{
        height: 16px;
    top: 4px;
    left: 1px;
    }
    .arrow_number{
        display: none;
    }
    .alert_open{
        width: 100px;
        right: -50px;
    }
    .alert_open_text{
        width: 99%;
    }
    .alert_open input[type="date"]{
        display: block;
    }
    .alert_open input[type="time"]{
        display: block;
        right: 0px;
        margin: 0px;
        padding: 0px;
        width: 99%;
        border: 0px;
    }
    .alert_open .great{
        width: 99%;
        margin-right: 0px;
    }
    .alert_open .icon_great{
        top: 169px;
        right: 72px;
    }
    .update_level_mobile_icon{
        position: relative;
        top: 24px;
        right: 70px;
        color: white;
        transform: rotate(180deg);
    }
    #form_connection{
        top: 35vh;
        left: 13%;
        width: 260px;
    }
    #right_img_connection {
        position: absolute;
        width: 57%;
        top: auto;
        z-index: 1;
    }
    #left_img_connection {
        position: absolute;
        width: 70%;
        top: auto;
        left: 0px;
        z-index: 1;
        bottom: 0px;
    }
    .expand{
        display: none !important;
    }
    #title_expand{
        display: none !important;
    }
    #wrap_tablet{
        display: none;
    }
    .tasks{
        height: 62vh;
    }
    
    
}




@media only screen and (min-width: 769px) and (max-width: 1699px) {
    .col-15{
        /*display: none;*/
        overflow: hidden;
        overflow-y: auto;
    }
    .col-85 {
        width: 100%;
    }
    /* #title_expand{
        display: none !important;
    }
    .switch{
        display: block;
        position: relative;
        width: 135px;
        background: #DBECFF;
        border-radius: 21px;
        height: 28px;
        margin-right: 15px;
        margin-top: 15px;
    }
    p.switch_text {
        position: absolute;
        top: 4px;
        width: 40%;
        text-align: center;
        height: 20px;
        font-weight: 400;
        font-size: 14px;
        border-radius: 21px;
        padding-left: 13px;
    }
    .switch_now{
        color: white;
        background: #627DDF;
    }
    #wrap_tablet{
        background-color: white;
        width: 45%;
        border-radius: 6px;
        margin-left: 15px;
        margin-right: 15px;
    }
    .expand{
        width: 94% !important;
        height: 54vh !important;
    }
    .expand:last-child{
        display: none;
    }
    .task_title{
        font-size: 16px;
    } */

    div#wrap_search_all_tasks {
        margin-right: 30px;
    }
    #title_expand{
        left: 34px;
    }
}



svg.seePass {
    position: absolute;
    top: 11px;
    left: 25px;
}

.imgMessage{
    cursor: pointer;
}
div#add_folder {
    display: none;
}
/* 
.alert_tagg_user{
    display: none;
} */
.edit_file hr {
    display: block !important;
    margin: 5px;
}
img.edit_link {
    margin-right: 10px;
}
#popUpMessage hr {
    display: block;
    /* position: absolute; */
    top: 21px;
    width: 83px;
    height: 0.5px;
    margin: 2px 0px;
}
.delete_project + label, .edit_project + label{
    cursor: pointer;
}
div#popUpsettingsUser{
    visibility: visible;
    width: 130px;
    right: auto;
    padding: 0px 10px;
    border-radius: 5px;
    box-shadow: 0px 0px 20px #80808073;
    position: fixed;
    background-color: white;
    /* height: 90px; */
    z-index: 10;
    transition: height 0.3s 0s;
    height: 0px;
    overflow: hidden;
}
div#popUpsettingsUser p {
    margin-top: 15px;
}
div#popUpsettingsUser * {
    display: inline-block;
    cursor: pointer;
    font-weight: 500;
    font-size: 18px;
}
div#popUpsettingsUser img {
    position: relative;
    top: 4px;
    width: 20px;
    margin-left: 10px;
}

#popUpLogOut{
    visibility: visible;
    width: 145px;
    left: auto;
    right: auto;
}
#delete_or_edit_link label{
    cursor: pointer;
}
#editProfile img {
    max-width: 100%;
    height: auto;
}
.alertCurtain {
    position: relative !important;
    right: -16px;
    text-align: center;
}
.alert_tagg_user:not(.alertCurtain ){
    display: none;
}
.same_user .first_name, .same_user .profile_massage{
display: none;}

#tasksForMeNotes{
    display: none;
}
p#errorCon {
    color: red;
}
.titleTaskNote{
    cursor: pointer;
}
.move_date_chat {
    background-color: white;
    border-radius: 5px;
    padding: 3px 5px;
    width: 25%;
    font-size: 14px;
    position: relative;
    right: 30%;
    margin: 5px;
    text-align: center;
    box-shadow: 0px 0px 4px 0px #d3d3d394;
    color: gray;
}
p.error {
    color: red;
    margin-top: 45px;
}
.removeImgChat{
    left: 8px;
    position: absolute;
    top: 10px;
    background-color: #0000009c;
    color: white;
    padding: 3px 10px;
    border-radius: 50%;
    display: block;
    position: relative;
    width: 10px;
    top: 40px;
    float: left;
    /* margin-top: -24px; */
}
body#tinymce p {
    margin: 0px 0px;
}
.bold{
    font-weight: 600 !important;
}
.noteTab {
    position: absolute;
    width: 10px;
    height: 10px;
    background-color: red;
    top: 3px;
    left: 4px;
    border-radius: 50%;
    /* box-shadow: 0px 0px 2px 0px gray; */
    border: 1px solid white;
    /* right: 4px; */
}