/* CSS Page to dictate styles for the tasks view */

.mainContentHolder .tasksPage .headers.sticky{
    position: fixed;
    width: 1220px;
    top: 0px;
    box-shadow: 0px 2px 8px #484848;
    border-bottom: 1px solid #000;
    z-index: 10;
    line-height: 31px;
    height: 36px;
    transition: height 300ms ease, line-height 300ms ease;
}

/* --- Width Values ---- */
.taskHeader{
    float: left;
    width: 100px;
    text-align:center;
    opacity: 0.7;
    height: 50px;
    overflow: hidden;
}
.taskHeader.clickable{
    cursor:pointer;
    /*transition: font-size 300ms ease;*/
    opacity: 1;
}
.taskHeader.clickable:hover{
    /*font-size: 105%;
    transition: font-size 300ms ease;*/
}
.taskHeader.selected{
    color: #f9b334;
    opacity: 1 !important;
}
.mainContentHolder.customDark .taskHeader.selected{
    background: var(--selectedColor);
    color: white;
    line-height: 34px;
    height: 34px;
    position: relative;
    top: 7px;
    border-radius: 4px;
}
.projectMasterPopup.customDark .taskHeader.selected{
    background: var(--selectedColor);
    color: white;
    line-height: 34px;
    height: 34px;
    position: relative;
    top: 8px;
    border-radius: 4px;
}
.taskHeader.status, .taskHolder .value.status{
    width:50px;
}
.taskHeader.name, .taskHolder .projectTaskNameHolder{
    width:310px;
    text-align: left;
}
.projectMasterPopup.customDark .taskHeader.name{
    padding-left: 10px;
}
.mainContentHolder.customDark .taskHeader.name{
    padding-left: 10px;
}
.taskHolder.popup.linkedTask{
    /*padding-left: 30px;*/
    /*background: #f0f0f0;*/
    padding: 10px 0px 0px;
}

/* linkedTaskIcon */

.taskHolder .linkedTaskIcon{
    position: absolute;
    left: -4px;
    left: 3px;
    top: 4px;
    color: #b4b4b4;
    font-size: 16px;
    display: none;
    opacity: 0.5;
}
.taskHolder.linkedTask .linkedTaskIcon{
    display: block;
    display: none;
}


.taskHolder .taskPTOIcon{
    float: left;
    border: 1px solid #808080;
    border-radius: 4px;
    padding: 0px 5px;
    background: #808080;
    color: #fff;
    position: absolute;
    top: 2px;
    left: 409px;
    display: none;
}
.taskHolder.isPTO .taskPTOIcon{
    display: block;
}


/* Task Orig Hourly Rate */

.taskHolder .taskOrigHourlyRate{
    float: left;
    background: none;
    width: 30px;
    color: #0000002e;
    height: 30px;
    text-align: center;
    border-radius: 30px;
    line-height: 30px;
    border: 1px solid #0000003b;
    position: relative;
    top: -3px;
}
.taskHolder.collapseTask .taskOrigHourlyRate{
    display: none;
}
.taskHolder.linkedTaskExpand .taskOrigHourlyRate{
    top: 4px;
}
.taskHolder.isClientView .taskOrigHourlyRate{
    visibility: hidden;
}

.taskHolder .taskProjectedBillableRate{
    float: left;
    width: 50px;
    position: relative;
    top: 30px;
    left: -42px;
    text-align: center;
    opacity: 0;
}
.taskHolder.collapseTask .taskProjectedBillableRate{
    display: none;
}
.taskHolder.linkedTaskExpand .taskProjectedBillableRate{
    visibility: hidden;
}

.taskHeader.notes{
    margin-left:80px;
}
.taskHeader.notes, .taskHolder .notesIcon{
    width:50px;
}
.taskHolder.linkedTaskExpand .notesIcon{
    visibility: hidden;
}
.taskHeader.dueDateDay, .taskHolder .dueDateDay{
    width:22px;
    min-height: 1px;
}
.taskHolder .value.hours, .taskHeader.hours{
    width:100px;
    margin-right: 10px;
}
.taskHeader.review, .taskHolder .value.needsReviewBy{
    width:100px;
    margin-right: 10px;
}
.taskHeader.hrsLeft, .taskHolder .value.hoursLeft{
    width:55px;
    margin-right: 10px;
}
.taskHeader.timer, .taskHolder .value.timer{
    width:100px;
}
.taskHeader.timer{
    visibility: hidden;
}
.mainContentHolder .tasksPage{
    width: 1235px;
    width: 1210px;
    width: 1137px;
    position: relative;
    background: #5a5a5a;
    background: #808080;
}
.mainContentHolder .tasksPage .projectsSidePanel{
    position: absolute;
    right: -260px;
    top: 100px;
    text-align: left;
    width: 230px;
    color:#9c9c9c;
    color: #fff;
}
.mainContentHolder .tasksPage .projectsSidePanel .title{
    font-size: 18px;
    margin-top: 20px;
}
.mainContentHolder .tasksPage .projectsSidePanel .projects{

}
.mainContentHolder .tasksPage .projectsSidePanel .projects .project{
    overflow: auto;
    border-bottom: 1px solid #dad5d5;
    cursor: pointer;
}
.mainContentHolder .tasksPage .projectsSidePanel .projects .project:hover{
    color: var(--trackrDarkBlueColor);
}
.mainContentHolder .tasksPage .weeklyHoursGraphicHolder{
    width: 140px;
    height: 100px;
    position: absolute;
    right: -170px;
    /*background: #e7e5e5;*/
    transition: width 300ms ease;
    z-index: 3;
    overflow: auto;
    overflow: hidden;
    border: 3px solid #fff0;
    cursor: pointer;
}
.mainContentHolder .tasksPage .weeklyHoursGraphicHolder:hover{
    /*width:450px;
    transition: width 300ms ease;
    border:3px solid #fff;*/
}
.mainContentHolder .tasksPage .weeklyHoursGraphicHolder .hoursAvailableLine{
    width: 100%;
    height: 2px;
    position: absolute;
    background: #fff;
    z-index: 1;
}
.mainContentHolder .tasksPage .weeklyHoursGraphicHolder .weeklyHours{
    float: left;
    min-width: 10px;
    background: var(--trackrBlueColor);
    border: 1px solid #2c87a6;
    position: absolute;
    bottom:0px;
    border-radius: 0px 0px 0px 0px;
    border: 1px solid #3e96b4;
    background: var(--trackrGrayColor);
    border: 1px solid black;
}
.mainContentHolder.customDark .tasksPage .weeklyHoursGraphicHolder .weeklyHours{
    background: #c1c1c1;
    border: 1px solid #888888;
}
.mainContentHolder .tasksPage .weeklyHoursGraphicHolder .weeklyHours.highlight{
    opacity:0.5;
}
.mainContentHolder.customDark .tasksPage .weeklyHoursGraphicHolder .weeklyHours.highlight{
    opacity: 1;
    background: var(--selectedColor);
    border-color: black;
}
.mainContentHolder .tasksPage .weeklyHoursGraphicHolder .weeklyHours.overBudget{
    background:var(--negativeColor);
    border:1px solid black;
    border: 1px solid #c25c5c;
}
.mainContentHolder .tasksPage .weeklyHoursGraphicHolder .weeklyHours .currentWeekDot{
    height: 5px;
    width: 5px;
    position: absolute;
    background: #fff;
    bottom: 87px;
    left: 1px;
    border-radius: 5px;
    display: none;
}
.mainContentHolder .tasksPage .weeklyHoursGraphicHolder .weeklyHours.currentWeek .currentWeekDot{
    display:block;
}
.mainContentHolder .tasksPage .headers{
	background: var(--trackrDarkBlueColor);
    height: 50px;
    color: #fff;
    line-height: 50px;
    text-align: center;
    transition:height 300ms ease, line-height 300ms ease;
    border-bottom: 2px solid #505050;
    background: linear-gradient(45deg, #1f8db5, #3bbcea);
    background: var(--trackrDarkBlueColor);
    background: var(--trackrHeaderColor);
    border-color: #fff;
}

.mainContentHolder .tasksPage .headers .tasksNotesPopupBtn{
    position: absolute;
    right: 95px;
    font-size: 24px;
    top: -2px;
    cursor: pointer;
    display: none;
}
.mainContentHolder .tasksPage .headers.sticky .tasksNotesPopupBtn{
    top: 2px;
}

.mainContentHolder .tasksPage .headers .gantChartBtn{
    position: absolute;
    right: 55px;
    font-size: 24px;
    top: -2px;
    cursor: pointer;
}
.mainContentHolder .tasksPage .headers.sticky .gantChartBtn{
    top: 2px;
}
.mainContentHolder .tasksPage .headers .tasksCollapseBtn{
    position: absolute;
    right: 15px;
    top: 10px;
    height: 25px;
    width: 25px;
    
    color: #fff;
    opacity: 0.5;
    line-height: 25px;
    text-align: center;
    border-radius: 20px;
    font-size: 18px;
    cursor: pointer;
}
.mainContentHolder .tasksPage .headers .tasksCollapseBtn.selected{
    color: var(--trackrDarkBlueColor);
    color: var(--trackrHeaderColor);
    background: #fff;
    opacity: 1;
}
.mainContentHolder .tasksPage .headers.sticky .tasksCollapseBtn{
    top: 4px;
}
.mainContentHolder .tasksPage .headers .showTasksManagedByBtn{
    display: none;
    position: absolute;
    right: 55px;
    top: 10px;
    height: 25px;
    width: 25px;
    
    color: #fff;
    opacity: 0.5;
    line-height: 25px;
    text-align: center;
    border-radius: 20px;
    font-size: 18px;
    cursor: pointer;
}
.mainContentHolder .tasksPage .headers .showTasksManagedByBtn.selected{
    color: #38b6e4;
    background: #fff;
    opacity: 1;
}
.mainContentHolder .tasksPage .headers.sticky .showTasksManagedByBtn{
    top: 4px;
}
.mainContentHolder .tasksPage .headers .headerTodosBtn{
    display: none;
    position: absolute;
    right: 15px;
    top: 10px;
    height: 25px;
    width: 25px;
    
    color: #fff;
    opacity: 0.5;
    line-height: 25px;
    text-align: center;
    border-radius: 20px;
    font-size: 18px;
    cursor: pointer;
}

.mainContentHolder .tasksPage .headers .headerTodosBtn.selected{
    color: #38b6e4;
    background: #fff;
    opacity: 1;
}
.mainContentHolder .tasksPage .headers.sticky .headerTodosBtn{
    top: 4px;
}

.mainContentHolder .tasksPage .todosNotificationHolder{
    background: #454545;
    height: 40px;
    color: #fff;
    display: none;
}
.mainContentHolder .tasksPage .todosNotificationHolder .todosNotificationText{
    text-align: center;
    line-height: 38px;
    cursor: pointer;
}
.mainContentHolder .tasksPage .todosNotificationHolder .todosNotificationText:hover{
    color:#2597c1;
}
.mainContentHolder .tasksPage .todosNotificationHolder .todosNotificationText .todosCount{
    background: var(--negativeColor);
    padding: 0px 10px;
    border-radius: 19px;
}
.mainContentHolder .tasksPage .tasksHolder{
	clear:both;
    /*overflow: auto;*/
    overflow: hidden;
    width: fit-content;
}


.taskHolder .taskIconsHolder{
    position: absolute;
    width: 20px;
    top: 8px;
    left: 14px;
    z-index: 8;
    pointer-events: none;
    color: #fff;
}
.taskHolder.popup .taskIconsHolder{
    /*display: none;*/
}
.taskHolder.expandedLinkedTask .taskIconsHolder{
    display: none;
}
.taskHolder .taskIconsHolder i{
    display: none;
    margin-bottom: 8px;
    text-shadow: 0px 0px 3px #7f7f7ff2;
}
.taskHolder .managedTaskIcon{
    /*position: absolute;
    display: none;
    top: 3px;
    left: 14px;
    z-index: 8;
    pointer-events: none;
    color: #fff;*/
}
.taskHolder.managedTask .taskIconsHolder .managedTaskIcon{
    display: block;
    text-shadow: 0px 0px 2px #28282882;
}
.taskHolder.popup .taskIconsHolder .managedTaskIcon{
    display: none;
}
.taskHolder .taskIconsHolder .siteVisitIcon{
    /*display: block;*/
    color: #0000005c;
    text-shadow: none;
}
.taskHolder.isSiteVisit .taskIconsHolder .siteVisitIcon{
    display: block;
}
.taskHolder.isQC .taskIconsHolder .qcIcon{
    display: block;
}
.taskHolder.isClientReview .taskIconsHolder .clientReviewIcon{
    display: block;
}

.taskHolder .priorityCircle{
    width: 5px;
    height: 6px;
    background: #fff;
    position: absolute;
    top: 10px;
    left: 1px;
    z-index: 10;
    border-radius: 10px;
    display: none; 
    pointer-events: none;
}
.taskHolder.highPriority .priorityCircle{
    display: block;
}

.taskHolder .warningButton{
  position: absolute;
    color: #fff;
    /*color: var(--negativeColor);*/
    border-radius: 24px;
    /*width: 20px;
    height: 20px;*/
    width: 22px;
    height: 22px;
    text-align: center;
    line-height: 15px;
    line-height: 18px;
    font-size: 11px;
    font-size: 13px;
    display: none;
    left: 26px;
    z-index: 8;
    background: #838383;
    background: #fff;
    background: var(--negativeColor);
    top: 4px;
    border: 2px solid #f0595f;
    /*box-shadow: 2px 2px 2px #00000078;*/
    pointer-events: none;
}
.tasksHolder.managed .taskHolder.flagged .warningButton{
    display:block;
}
.tasksHolder .taskHolder.flagged .warningButton{
    display: block;
}
.taskHolder .warningButton .warningToolTip{
    display:none;
    position: absolute;
    color: #000;
    width: 220px;
    background: #ffca3a;
    background: #ff7e7e;
    color: #fff;
    left: 27px;
    top: -5px;
    border-radius: 4px;
    padding:10px;
}
.taskHolder.flagged .warningButton:hover .warningToolTip{
    display:block;
}



.tasksHolder .dayDivider{
    font-size: 30px;
    padding: 20px;
    background: #7d7d7d;
    color: #fff;
    border-bottom: 2px solid #676666;
}
.tasksHolder .userDivider{
    font-size: 21px;
    padding-left: 21px;
    background: #e4e4e4;
    color: #808080;
    border-bottom: 2px solid #d2d2d2;
}



/* Weekly TasksHolder */

.weeklyTasksHolder{
    /*border-bottom: 2px solid #737373;*/
    position: relative;
    margin-top: 40px;
    padding-bottom: 40px;
    /*min-width: 1172px;*/
    transition: margin-top 300ms ease;
}
.weeklyTasksHolder:not(.currentWeek).empty{
    opacity: 0.2;
    margin-top: 10px;
    display: none;
}
.weeklyTasksHolder.collapsed{
    height:72px;
    overflow:hidden;
    margin-top: 2px;
    padding-top: 0px;
    border-top: none;
    width: 1140px;
}


/* Weekly Title */


.weeklyTasksHolder .weeklyHeader{
    
    color: #fff;

    
    padding-left: 15px;
    /*height: 70px;*/
    overflow: auto;
    transition: all 300ms ease;
}
.weeklyTasksHolder.collapsed .weeklyHeader{
    background: var(--trackrDarkGrayColor);
}
.weeklyTasksHolder .weeklyHeader.highlight{
    /*opacity:0.8;*/
}
.weeklyTasksHolder.pastWeek .weeklyHeader{
    background:#b1c98a;
    background: #444;
    /* border-bottom: 1px solid #646464; */
    color: #7a7a7a;
    /*border-bottom: 1px solid #646464;*/
    background: none;
}
.weeklyTasksHolder.pastWeek.collapsed:not(.open) .weeklyHeader{
    background: #444;
}
.mainContentHolder.customDark .weeklyTasksHolder.pastWeek .weeklyHeader{
    background: var(--trackrDarkBlueColor);
    color:#a3a3a3;
}
.weeklyTasksHolder.open.pastWeek .weeklyHeader{
    /*background:#db8082;
    color: #fff;*/
}
.weeklyTasksHolder .weeklyHeader .weeklyTitle{
    line-height: 65px;
    font-size: 20px;
    width: fit-content;
    border: 1px solid white;
    border-radius: 4px;
    padding: 0px 15px;
    margin-bottom: 20px;
}
.weeklyTasksHolder.pastWeek .weeklyHeader .weeklyTitle{
    line-height: 70px;
    border: none;
    cursor: pointer;
}
.weeklyTasksHolder.pastWeek .weeklyHeader .weeklyTitle:hover{
    color: var(--trackrBlueColor);
}
.weeklyTasksHolder.open.pastWeek .weeklyHeader .weeklyTitle{
    background: var(--negativeColor);
    color: #fff;
}
.weeklyTasksHolder.currentWeek .weeklyHeader .weeklyTitle{
    /*background: white;
    color: #525252;*/
}
.weeklyTasksHolder .weeklyHeader .weekTaskTodosHolder{
    margin-bottom: 20px;
}
.weeklyTasksHolder .weeklyHeader .weekTaskTodosHolder.hide{
    display: none;
}
.weeklyTasksHolder .weeklyHeader .weekTaskTodosHolder .weekTodoHolder{
    color: #ffffff69;
    border-bottom: 1px solid #ffffff36;
    line-height: 25px;
    height: 25px;
    clear: both;
    margin-left: 20px;
}
.weeklyTasksHolder .weeklyHeader .weekTaskTodosHolder .weekTodoHolder .todoValue{
    float: left;
    min-height: 1px;
    margin-right: 20px;
    overflow: hidden;
    height: 25px;
}
.weeklyTasksHolder .weeklyHeader .weekTaskTodosHolder .weekTodoHolder .todoValue.name{
    width: 500px;
}
.weeklyTasksHolder .weeklyHeader .weekTaskTodosHolder .weekTodoHolder .todoValue.date{
    width: 65px;
}
.weeklyTasksHolder .weeklyHeader .weekTaskTodosHolder .weekTodoHolder .todoValue.projectName{
    width: 350px;
}
.weeklyTasksHolder .weeklyHeader .weekTaskTodosHolder .weekTodoHolder .todoValue.assignedToName{
    width: 150px;
}
.weeklyTasksHolder .weeklyHeader .weekTaskTodosHolder .weekTodoHolder .todoValue.hours{
    margin-right: 0px;
}
/*
.weeklyTasksHolder .weeklyTitle{
    background: var(--trackrDarkGrayColor);
    color: #fff;
    font-size: 20px;
    padding-left: 15px;
    height: 70px;
    line-height: 70px;
}
.weeklyTasksHolder.pastWeek .weeklyTitle{
    background:#b1c98a;
    background: #444;
    color: #7a7a7a;
}
.weeklyTasksHolder.open.pastWeek .weeklyTitle{
    background:#db8082;
    color: #fff;
}
*/

.weeklyTasksHolder .weekCompletedHoursHolder{
    position: absolute;
    top: 27px;
    right: 130px;
    color: #ffffffa8;
    width: 105px;
    text-align: center;
    height: 31px;
    cursor: pointer;
}
.weeklyTasksHolder.pastWeek .weekCompletedHoursHolder{
    top: 22px;
    color: #ffffff63;
}
.weeklyTasksHolder .weekCompletedHoursHolder .timers.icon{
    float: left;
    position: relative;
    top: 6px;
    margin-right: 6px;
}
.weeklyTasksHolder .weekCompletedHoursHolder .weekCompletedHours{
    float: left;
    font-size: 17px;
    top: 3px;
    cursor: pointer;
}
.weeklyTasksHolder .weekCompletedHoursHolder:hover{
    color: var(--trackrBlueColor);
}


.weeklyTasksHolder .weekNotesPopupBtn{
    position: absolute;
    color: #ffffff7a;
    right: 250px;
    top: 30px;
    cursor: pointer;
    border-right: 1px solid #808080;
    width: 40px;
    text-align: center;
}
.weeklyTasksHolder.pastWeek .weekNotesPopupBtn{
    top: 25px;
}

.weeklyTasksHolder .hoursTotalHolder{
    position: absolute;
    top: 13px;
    right: 50px;
    color: #fff;
    display: none;
}
.tasksHolder.managed .weeklyTasksHolder .hoursTotalHolder{
    display: block;
}
.weeklyTasksHolder .hoursTotalHolder .managedHoursHolder{
    float: left;
    line-height: 45px;
}
.weeklyTasksHolder .hoursTotalHolder .managedHoursHolder .managedIcon{
    float: left;
    font-size: 15px;
}
.weeklyTasksHolder .hoursTotalHolder .managedHoursHolder .managedHoursValue{
    float: left;
    font-size: 25px;
    margin-left: 8px
}
.weeklyTasksHolder .hoursTotalHolder .assignedHoursHolder{
    float: left;
    margin-left: 30px;
    border-left: 1px solid #fafafa3b;
    line-height: 45px;
    padding-left: 30px;
}
.weeklyTasksHolder .hoursTotalHolder .assignedHoursHolder .assignedIcon{
    float: left;
    font-size: 15px;
}
.weeklyTasksHolder .hoursTotalHolder .assignedHoursHolder .assignedHoursValue{
    float: left;
    font-size: 25px;
    margin-left: 8px;
}

.weeklyTasksHolder .weekProgressMeterHolder{
    position: absolute;
    top: 25px;
    right: 40px;
    cursor: pointer;
}
.weeklyTasksHolder.collapsed .weekProgressMeterHolder{
    top: 20px;
}
.weeklyTasksHolder.pastWeek.open .weekProgressMeterHolder{
    top: 20px;
}
.weeklyTasksHolder .weekProgressMeterHolder .weekProgressMeter{
    width: 100px;
    height: 17px;
    border-radius: 4px;
    overflow: hidden;
    border: 1px solid #3f3e3e;
}
.weeklyTasksHolder .weekProgressMeterHolder .weekProgressMeter .meter{
    width: 50%;
    height: 100%;
    background: var(--okkemSelectedColor);
}
.weeklyTasksHolder.allComplete .weekProgressMeterHolder .weekProgressMeter .meter{
    background: var(--positiveColor);
}
.weeklyTasksHolder .weekProgressMeterHolder .weekHours{
    text-align: center;
    color: white;
    font-size: 18px;
}
.weeklyTasksHolder.collapsed .weekProgressMeterHolder .weekHours{
    font-size: 16px;
}
.weeklyTasksHolder .weekProgressMeterHolder:hover .weekHours{
    color: var(--trackrBlueColor);
}
.weeklyTasksHolder .weeklyCompletedWeekHours{
    width: 50px;
    border-right: 1px solid #888;
    float: left;
}
.weeklyTasksHolder .weeklyCompletedBillableHours{
    float: left;
    width: 50px;
    border-right: 1px solid #888;
}
.weeklyTasksHolder .weeklyCompletedHours{
    float: left;
    width: 50px;
}
.weeklyTasksHolder.pastWeek .weeklyCompletedHours{
    color: #fff;
    opacity: 0.5;
}
.weeklyTasksHolder.pastWeek .weeklyCompletedBillableHours{
    color: #fff;
    opacity: 0.5;
    border-right: 1px solid #fff;
}
.weeklyTasksHolder.pastWeek .weeklyCompletedWeekHours{
    color: #fff;
    opacity: 0.5;
    border-right: 1px solid #fff;
}
.tasksHolder.managed .weeklyTasksHolder .completedHoursHolder{
    visibility: hidden;
}

.weeklyTasksHolder.allSelected .weeklyCompletedHours{
    visibility: hidden;
}

.weeklyTasksHolder .noTasksHolder{
    display: none;
    text-align: center;
    padding: 25px;
    color: #bababa;
    color: #979797;
    font-size: 17px;
    position: absolute;
    top: -2px;
    left: 475px;
}
.weeklyTasksHolder.empty .noTasksHolder{
    display:block;
}
.weeklyTasksHolder .readyTasksHolder{
    display: none;
    /*border-top: 1px solid #959595;*/
    background: #ebebeb;
    background: #23d546;
    background: var(--positiveColor);
    margin-top: 20px;
    border: 2px solid #4d4d4d;
    border-radius: 4px;
    width: fit-content;
    min-width: 1137px;
}
.weeklyTasksHolder.currentWeek .readyTasksHolder{
    display: block;
}
.weeklyTasksHolder.currentWeek .readyTasksHolder.expand{

}
.weeklyTasksHolder.currentWeek .readyTasksHolder.empty{
    opacity: 0.1;
}
.weeklyTasksHolder .readyTasksHolder .readyTasksTitle{
    line-height: 50px;
    font-size: 16px;
    margin-left: 20px;
    position: relative;
    cursor: pointer;
    color: #fff;
}
.weeklyTasksHolder .readyTasksHolder .readyTasksTitle .label{

}
.weeklyTasksHolder .readyTasksHolder .readyTasksTitle .readyTasksCount{
    position: absolute;
    top: -1px;
    left: 70px;
}
.weeklyTasksHolder .readyTasksHolder .readyTasksTitle .readyTasksHours{
    position: absolute;
    top: 0px;
    right: 10px;
    font-size: 14px;
    color: #fff;
}
.weeklyTasksHolder .readyTasksHolder .readyTasks{
    display: none;
    width: fit-content;
}
.weeklyTasksHolder .readyTasksHolder.expand .readyTasks{
    display: block;
}


.weeklyTasksHolder .weeklyTasks{
    /*background: #5a5a5a;*/
}
.weeklyTasksHolder.collapsed .weeklyTasks{
    display: none;
}
.weeklyTasksHolder .weeklyTasks .dayHolder{
    /*margin-bottom: 10px;*/
}
.weeklyTasksHolder .weeklyTasks .dayHolder .dayTitle{
    color: #fff9;
    margin-left: 10px;
}
.weeklyTasksHolder .weeklyTasks .dayHolder .dayTasksHolder{
    border: 2px solid #4d4d4d;
    border-radius: 4px;
    overflow: auto;
    width: fit-content;
}
.weeklyTasksHolder .weeklyTasks .projectTaskHolder{
    border-top: 10px solid #4d4d4d;
}


/* --- Task Holder --- */
.taskHolderOuter{
    
}

/* TaskHolder */

.taskHolder{
	clear: both;
    text-align: center;
    /*padding: 10px 0px 5px;*/
    padding: 15px 0px 5px;
    border-bottom: 1px solid #e8e8e8;
    border-bottom: 1px solid #0000003b;
    display:none;
    position: relative;
    /*max-height:200px;*/
    width:100%;
    width:1235px;
    width: 1205px;
    width: 1158px;
    width: 1133px;
    overflow: hidden;
    max-height: 500px;
    background: #fff;
    transition: max-height 800ms ease;
}

.taskHolder.popup.collapsedLinkedTask{
    background-color: #e7e7e7;
    padding-top: 0px;
    max-height: 0px;
    display: none; /* this may need to be updated */
}
.taskHolder.isOverWeekBudget:not(.readyTask):not(.linkedTaskExpand){
    background: #ffc9c9;
    border-bottom: 1px solid #eba8a8;
    border-bottom: 1px solid #0000003b;
}
.taskHolder.isApproved.isOverWeekBudget:not(.readyTask):not(.linkedTaskExpand){
    background: #ffdbdb;
}
.taskHolder.isOverBufferBudget:not(.readyTask):not(.linkedTaskExpand){
    background: #ffe5a7;
}
.taskHolder.complete:not(.readyTask):not(.linkedTaskExpand){
    background: #e6f6cb;
}

/* This allows these to show up as green without hiding all the stuff that comes with complete */
.taskHolder.pendingCompleteForUser:not(.readyTask):not(.linkedTaskExpand){
    background: #e6f6cb;
}
.taskHolder.complete.isReserve:not(.readyTask):not(.linkedTaskExpand){
    background: var(--positiveColor);
    color: #fff;
}
.taskHolder.allLinkedTasksComplete.linkedTaskExpand{
    background: #e6f6cb;
}
.taskHolder.isOverWeekBudget.readyTask{
    /*background: #fff;
    border-bottom: 1px solid #e8e8e8;*/
}
.tasksPopup .taskHolder{
    /*width:1210px;*/
}
.taskHolder.show{
    display:block;
}
.taskHolder.expand{
	/*background: #f9f9f9;*/
}
.taskHolder.linkedTask{

}
.taskHolder.readyTask{

}
.taskHolder.readyTask.first{
    border-radius: 5px 0px 0px 0px;
}
.taskHolder.collapseTask{
    max-height: 60px;
    padding: 16px 0px 0px;
    transition: max-height 500ms ease;
}
.taskHolder.linkedTaskExpand{
    padding-bottom: 10px !important;
}
.taskHolder.expandedLinkedTask{
    max-height: none;
}



.taskHolder .expandOverlay{
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background: #000;
    z-index: 6;
    opacity: 0;
    /*display: none;*/
    cursor: pointer;
    pointer-events: none;
    transition: opacity 300ms ease;
}
.taskHolder.collapseTask .expandOverlay{
    display: block;
    pointer-events: auto;
}

.taskHolder.complete .expandOverlay{
    /*opacity: 0.05;*/
}
.taskHolder.popupSelected .expandOverlay{
    opacity: 0.04;
}
.taskHolder.collapseTask.popupSelected .expandOverlay{
    opacity: 0.08;
    opacity: 0.25;
    /*opacity: 0.28;*/
}
.taskHolder.collapseTask:hover .expandOverlay{
    opacity: 0.04;
    opacity: 0.10;
    transition: opacity 300ms ease;
}


.taskHolder .addBtn{
    position: absolute;
    right: 34px;
    top: -2px;
    cursor: pointer;
    width: 35px;
    height: 35px;
    line-height: 35px;
    font-size: 21px;
    z-index: 7;
    background: #565656;
    color: #fff;
    border-radius: 4px;
}
.taskHolder.collapseTask .addBtn{
    top: -2px;
    display: none;
}
.taskHolder.linkedTaskExpand .addBtn{
    display: none;
}
.taskHolder.readyTask .addBtn{
    right: 44px;
}
.taskHolder:hover .addBtn{
    /*opacity:1;
    transition: opacity 300ms ease;*/
}
.taskHolder:hover .addBtn:hover{
    color: var(--trackrBlueColor);
}

.taskHolder .weekTasksPopupBtn{
    position: absolute;
    top: 51px;
    right: 36px;
    font-size: 20px;
    opacity: 0.4;
    width: 35px;
    height: 35px;
    text-align: center;
    line-height: 35px;
    cursor: pointer;
    border-top: 1px solid #00000038;
    padding-top: 5px;
    display: none; /* im hiding this for now */
}
.taskHolder.collapseTask .weekTasksPopupBtn{
    top: -2px;
    display: none;
}
.taskHolder.linkedTaskExpand .weekTasksPopupBtn{
    display: none;
}
.taskHolder .taskCollapseBtn{
    position: absolute;
    top: 51px;
    right: 36px;
    font-size: 20px;
    opacity: 0.4;
    width: 35px;
    height: 35px;
    text-align: center;
    line-height: 35px;
    cursor: pointer;
    border-top: 1px solid #00000038;
    padding-top: 5px;
    
}
.taskHolder .taskCollapseBtn:hover{
    color: var(--trackrDarkBlueColor);
}
.taskHolder.collapseTask .taskCollapseBtn{
    display: none;
}
.taskHolder.linkedTaskExpand .taskCollapseBtn{
    display: none;
}
.taskHolder .top{
	/*height: 50px;
    overflow: hidden;*/
    position: relative;
}
.taskHolder .top.sticky{
    box-shadow: 3px 4px 6px #e9e9e9;
    overflow: auto;
}
.taskHolder .bottom{
    clear: both;
    text-align: left;
    margin:auto;
    margin-top:0px;
    margin-bottom:0px;
    color: #dadada;
    /*overflow: auto;*/
    /*height: 0px;*/
    width: 100%;
    position: relative;
    transition: all 300ms ease;
    overflow: auto;
    max-height: 400px;
    padding-top: 10px;
    -ms-overflow-style: none;  /* IE and Edge */
    scrollbar-width: none;  /* Firefox */
}
.taskHolder .bottom::-webkit-scrollbar{
    display: none;
}
.taskHolder.expand .bottom{
    margin-top:0px;
    margin-bottom:10px;
    /*height: 134px;*/
    height:auto;
 	transition: all 300ms ease;
}
.taskHolder.readyTask .bottom{
    left: -10px;
}
.taskHolder.expandedLinkedTask .bottom{
    max-height:none;
}


.taskHolder .bottom .taskDescription{
    background: #0000000d;
    /*background: #fff;
    background: none;*/
    
    width: 1000px;
    min-height: 30px;
    margin-left: 67px;
    margin-bottom: 10px;
    border-radius: 4px;
    cursor: pointer;
    
    
    padding: 10px 15px;
    color: #0000005e;
    white-space: pre-line;
    max-height: 155px;
    overflow: auto;

    -ms-overflow-style: none;  /* IE and Edge */
    scrollbar-width: none;  /* Firefox */

    /*
    background: #f4f4f4;
    border: none;
    color: #aeaeae;
    */
}
.taskHolder .bottom .taskDescription::-webkit-scrollbar{
    display: none;
}
.taskHolder.expandedLinkedTask .bottom .taskDescription{
    display: none;
}
.taskHolder .bottom .taskDescription.overflow{
    border-bottom: 2px dashed #cdcdcd;
    transition: border-color 300ms ease;
}
.taskHolder.noDescription:not(.complete):not(.noDueDateNeeded) .bottom .taskDescription{
    border: 2px dashed var(--negativeColor);
    background: #ff878c4a;
}
.taskHolder.taskDescriptionFlagged .bottom .taskDescription{
    border-left: 10px solid var(--negativeColor);
    padding-left: 20px;
    color: var(--negativeColor);
}
.taskHolder .bottom .notes{
	/*border: 1px solid #f1f1f1;*/
	width:95%;
	border-radius: 4px;
	margin:4px auto 0px;
    font-size:13px;
    display:none;
}
.taskHolder .bottom .notes textarea{
	border: none;
    width: 100%;
    min-height: 60px;
    padding: 10px;
    color:#ababab;
    background: none;
}
.taskHolder .btnsHolder{
    display:none;
}

.taskHolder.expand .bottom .btnsHolder{
	width: 153px;
    margin: 0px auto 0px;
    padding:0px 0px;
    height:0px;
    overflow:hidden;
    transition:height 300ms ease;
}
.taskHolder.showSaveBtn .bottom .btnsHolder{
    height:56px;
    padding:10px 0px;
    transition:height 300ms ease;
}
.taskHolder.expand .bottom .btn{
	color: #909090;
    border: 1px solid #c5c5c5;
    margin-left: 10px;
    cursor: pointer;
    background: #ececec;
    font-size: 13px;
}
.taskHolder.expand .bottom .saveBtn{

}
.taskHolder .tasksPopupBtn{
    position: absolute;
    right: 70px;
    top: 0px;
    font-size: 25px;
    cursor: pointer;
    opacity: 0.9;
    display: none;
}
.taskHolder.isClientView .tasksPopupBtn{
    visibility: hidden;
}
.taskHolder.linkedTaskExpand .tasksPopupBtn{
    display: block;
}
.taskHolder.linkedTaskExpand .tasksPopupBtn:hover{
    filter: brightness(200%);
}

.taskHolder .bottom .linkedTasksArea{
    position: relative;
    margin-left: 10px;
    margin-bottom: 20px;
}


/* --- Linked Tasks Holder --- */

.taskHolder .bottom .linkedTasksHolder{
    color: #b9b9b9;
    position: relative;
    left: 68px;
    top: -4px; 
    padding-bottom: 0px;
    min-height: 15px;
    transition: top 300ms ease, padding-top 300ms ease;
    width: 1050px;
    max-height: 290px;
    overflow: auto;
    /*overflow: auto;*/
}
.taskHolder .bottom .linkedTasksHolder::-webkit-scrollbar{
    display: none;
}
.taskHolder.linkedTaskExpand .bottom .linkedTasksHolder{
    top: 7px;
    padding-bottom: 0px;
    margin-bottom: 30px;
    border-bottom: 2px dashed #e7e7e700;
    border-top: 2px dashed #e7e7e700;
    border-left: 2px dashed #e7e7e700;
    border-right: 2px dashed #e7e7e700;
    max-height: none;
    transition: top 300ms ease, padding-top 300ms ease, box-shadow 500ms ease;
}
.taskHolder.linkedTaskExpand .bottom .linkedTasksHolder.overflow{
    border-bottom: 2px dashed #ededed;
}
.taskHolder.linkedTaskExpand .bottom .linkedTasksHolder.select{
    /*border-color:#4d4d4d;
    transition: border-color 500ms ease;*/
    box-shadow: 2px 2px 32px black;
}
.taskHolder.popup .bottom .linkedTasksHolder{
    /*left: 89px;*/
    top: -17px;
    transition: top 300ms ease, box-shadow: 500ms ease; 
}
.taskHolder.isOverWeekBudget .bottom .linkedTasksHolder{
    color: #cd8a8a;
}
.taskHolder.popup.hasTaskManager .bottom .linkedTasksHolder{
    top: -8px;
}
.taskHolder.popup.linkedTaskExpand .bottom .linkedTasksHolder{
    top: 14px;
    margin-bottom: 15px;
    transition: top 300ms ease, box-shadow 500ms ease;
}
.taskHolder.linkedTasksPopup .bottom .linkedTasksHolder{
    display: none;
}


.taskHolder .bottom .linkedTaskExpandBtn{
    height: 35px;
    width: 35px;
    line-height: 30px;
    transform-origin: center;
    position: absolute;
    text-align: center;
    top: -5px;
    cursor: pointer;
    left: 57px;
    font-size: 26px;
    z-index: 1;
    color: #0003;
    transition: transform 300ms ease;
}
.taskHolder .bottom .linkedTaskExpandBtn:hover{
    color: var(--trackrBlueColor);
}
.taskHolder.linkedTasksPopup .bottom .linkedTaskExpandBtn{
    display: none;
}
.taskHolder.expandedLinkedTask .bottom .linkedTaskExpandBtn{
    display: none;
}
.taskHolder.linkedTaskExpand .bottom .linkedTaskExpandBtn{
    transform: rotate(90deg);
    transition: transform 300ms ease;
    top: -2px;
}




.taskHolder .bottom .linkedTasksHolder .linkedTask{
    overflow: auto;
    width: 1050px;
    line-height: 27px;
    overflow: hidden;
    height: 0px;
    transition: height 300ms ease;
    position: relative;
    color: #00000069;
    
}
.taskHolder.linkedTaskExpand .bottom .linkedTasksHolder .linkedTask{
    background: #fff;
}
.taskHolder.linkedTaskExpand .bottom .linkedTasksHolder .linkedTask.complete{
    background: #e6f6cb;
}
.taskHolder.linkedTaskExpand .bottom .linkedTasksHolder .linkedTask.complete.isReserve{
    background: var(--positiveColor);
    color: #fff;
}
.taskHolder.linkedTaskExpand:not(.isClientView) .bottom .linkedTasksHolder .linkedTask.isOverWeekBudget{
    background: #ffc9c9;
}
.taskHolder.linkedTaskExpand:not(.isClientView) .bottom .linkedTasksHolder .linkedTask.isOverBufferBudget{
    background: #ffe5a7;
}
.taskHolder.linkedTaskExpand .bottom .linkedTasksHolder .linkedTask.popupSelected.isOverWeekBudget{
    background: #d77878;
    background: #b05858;
    color: #fff;
}
.taskHolder.linkedTaskExpand .bottom .linkedTasksHolder .linkedTask.popupSelected.isOverBufferBudget{
    background: #c59524;
    color: #fff;
}
.taskHolder .bottom .linkedTasksHolder .linkedTask.inactive{
    opacity: 0.4;
}
.taskHolder .bottom .linkedTasksHolder .linkedTask.selected{
    height: 27px;
}
.taskHolder.linkedTaskExpand .bottom .linkedTasksHolder .linkedTask.popupSelected{
    /*background: #0000001a;*/
    background: #848484;
    color:#fff;
}
.projectMasterPopup.customDark .taskHolder.linkedTaskExpand .bottom .linkedTasksHolder .linkedTask.popupSelected{
    background: var(--selectedColor);
    border-left: 6px solid #4d4adf;
    border-bottom: 1px solid #4d4adf;
    border-top: 1px solid #4d4adf;
    border-color: white;
    /*line-height: 41px;*/
}
.taskHolder.linkedTaskExpand .bottom .linkedTasksHolder .linkedTask{
    /*left: -10px;*/
    padding-left: 10px;
}

.taskHolder.linkedTaskExpand:not(.expandedLinkedTask) .bottom .linkedTasksHolder .linkedTask.selected{
    background: #0000001a;
    height: 45px;
    line-height: 45px;
    /* trial */
    background: #848484;
    color:#fff;
    
}

.mainContentHolder.customDark .taskHolder.linkedTaskExpand:not(.expandedLinkedTask) .bottom .linkedTasksHolder .linkedTask.selected{
    background: var(--selectedColor);
    border-left: 6px solid #4d4adf;
    border-bottom: 2px solid #4d4adf;
    border-top: 2px solid #4d4adf;
    border-color: white;
    line-height: 41px;
}

.taskHolder.linkedTaskExpand:not(.expandedLinkedTask) .bottom .linkedTasksHolder .linkedTask.selected.isOverWeekBudget{
    background: #d77878;
}
.taskHolder.linkedTaskExpand:not(.expandedLinkedTask) .bottom .linkedTasksHolder .linkedTask.selected.isOverBufferBudget{
    background: #eac56d;
}
.taskHolder.isOverWeekBudget .bottom .linkedTasksHolder .linkedTask.selected{
    /*color: #fff;*/
}
.taskHolder.linkedTaskExpand .bottom .linkedTasksHolder .linkedTask{
    border-top: 1px solid #0000002e;
    height: 27px;
    transition: height 300ms ease;
}

.taskHolder.linkedTaskExpand .bottom .linkedTasksHolder .linkedTask.isPayment{
    background: #4b6e14;
    color: #fff;
}
.taskHolder.linkedTaskExpand .bottom .linkedTasksHolder .linkedTask.isDeleted{
    background: #ff000b !important;
}


.taskHolder .linkedTask .warningsIcon{
    position: absolute;
    width: 12px;
    height: 12px;
    top: 3px;
    left: 3px;
    background: var(--negativeColor);
    z-index: 1;
    border-radius: 10px;
    border: 1px solid #a84d50;
    display: none;
}
.taskHolder.isClientView .linkedTask .warningsIcon{
    visibility: hidden;
}
.taskHolder .linkedTask.hasWarnings .warningsIcon{
    display: block;
}
.taskHolder .linkedTask .scopeChangeIcon{
    position: absolute;
    top: 8px;
    left: 30px;
    height: 9px;
    width: 9px;
    background: var(--inProgressColor);
    border: 1px solid black;
    z-index: 1;
    display: none;
}
.taskHolder .linkedTask .expenseIcon{
    position: absolute;
    top: 8px;
    left: 30px;
    height: 9px;
    width: 9px;
    background: var(--positiveColor);
    border: 1px solid black;
    z-index: 1;
    display: none;
}
.taskHolder .linkedTask.isScopeChange .scopeChangeIcon{
    display: block;
}
.taskHolder .linkedTask.isExpense .expenseIcon{
    display: block;
}
.taskHolder .bottom .linkedTasksHolder .linkedTask .value{
    text-align: center;
    min-height: 2px;
}
.taskHolder .bottom .linkedTasksHolder .linkedTask .showOnExpand{
    opacity:0;
}
.taskHolder.linkedTaskExpand .bottom .linkedTasksHolder .linkedTask .showOnExpand{
    opacity: 1;
}


/* LinkedTask Status */

.taskHolder .bottom .linkedTasksHolder .linkedTask .linkedTaskStatus{
    width: 15px;
    width: 25px;
    height: 27px;
    background: #d6d6d6;
    position: absolute;
    top: 0px;
    left: 0px;
    margin-right: 5px;
    cursor: pointer;
    display: none;
    border-right: 1px solid white;
}


.taskHolder .bottom .linkedTasksHolder .linkedTask .linkedTaskStatus:hover{
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    border: 4px dashed #00000021;
}
.taskHolder.linkedTaskExpand:not(.expandedLinkedTask) .bottom .linkedTasksHolder .linkedTask.selected .linkedTaskStatus{
    height: 45px;
}
.taskHolder .bottom .linkedTasksHolder .linkedTask .linkedTaskStatus.InProgress{
    background: #f9b334;
}
.taskHolder .bottom .linkedTasksHolder .linkedTask .linkedTaskStatus.Complete{
    background: var(--positiveColor);
}
.taskHolder.linkedTaskExpand .bottom .linkedTasksHolder .linkedTask .linkedTaskStatus{
    display: block;
}
.taskHolder .bottom .linkedTasksHolder .linkedTask.pendingComplete .linkedTaskStatus{
    background: repeating-linear-gradient( 45deg, #8ac925, #8ac925 2px, #bdeb72 2px, #bdeb72 5px ) !important;
}
.taskHolder .bottom .linkedTasksHolder .linkedTask.isPayment .linkedTaskStatus{
    display: none;
}


.taskHolder .bottom .linkedTasksHolder .linkedTask .linkedTaskPriorityCircle{
    width: 7px;
    height: 7px;
    position: absolute;
    top: 5px;
    left: 4px;
    background: #fff;
    border-radius: 10px;
    display: none;
    pointer-events: none;
}
.taskHolder .bottom .linkedTasksHolder .linkedTask.highPriority .linkedTaskPriorityCircle{
    display: block;
}

.taskHolder .bottom .linkedTasksHolder .linkedTask .linkedTaskName{
    width: 385px;
    width: 350px;
    width: 300px;
    text-align: left;
    margin-left: 15px;
    margin-left: 25px;
    position: relative;
    left: -15px;
}
.taskHolder .bottom .linkedTasksHolder .linkedTask.complete .linkedTaskName{
    text-decoration: line-through; 
    text-decoration-color: #0000004a;
}
.taskHolder .bottom .linkedTasksHolder .linkedTask.isMistakeHours .linkedTaskName{
    color: var(--negativeColor);
}
.taskHolder .bottom .linkedTasksHolder .linkedTask.selected .linkedTaskName{
    font-size: 15px;
}
.taskHolder.linkedTaskExpand .linkedTasksHolder .linkedTask .linkedTaskName{
    left: 0px;
}
.taskHolder .bottom .linkedTasksHolder .linkedTask .linkedTaskNameEdit{
    position: absolute;
    opacity: 0;
}
.taskHolder.linkedTaskExpand .linkedTasksHolder .linkedTask.isScopeChange .linkedTaskName{
    margin-left: 35px;
    width: 290px;
}
.taskHolder.linkedTaskExpand .linkedTasksHolder .linkedTask.isExpense .linkedTaskName{
    margin-left: 35px;
    width: 290px;
}
.taskHolder.linkedTaskExpand .bottom .linkedTasksHolder .linkedTask .linkedTaskNameEdit{
    left: 25px;
    width: 290px;
}
.taskHolder .bottom .linkedTasksHolder .linkedTask .linkedTaskNameEdit.hide{
    display: none;
}
.taskHolder .bottom .linkedTasksHolder .linkedTask .linkedTaskNotesBtn{
    float: left;
    width: 20px;
    text-align: center;
    cursor: pointer;
    color: #0000001c;
    position: relative;
    top: 0px;
    display: none;
}
.taskHolder.linkedTaskExpand .bottom .linkedTasksHolder .linkedTask .linkedTaskNotesBtn{
    display: block;
}
.taskHolder .bottom .linkedTasksHolder .linkedTask .linkedTaskNotesBtn.hasNotes{
    color: var(--trackrDarkBlueColor);
}
.taskHolder .bottom .linkedTasksHolder .linkedTask.selected .linkedTaskNotesBtn.hasNotes{
    color: #0a4c63;
}
.taskHolder .bottom .linkedTasksHolder .linkedTask .linkedTaskReadyBtn{
    float: left;
    width: 14px;
    height: 14px;
    border: 1px solid #00000042;
    border-radius: 10px;
    position: relative;
    top: 6px;
    cursor: pointer;
    display: none;
    margin-right: 15px;
    line-height: 11px;
    box-sizing: content-box;
}
.taskHolder .bottom .linkedTasksHolder .linkedTask.noDueDateNeeded .linkedTaskReadyBtn{
    visibility: hidden;
}
.taskHolder .bottom .linkedTasksHolder .linkedTask .linkedTaskReadyBtn:hover{
    border-color: var(--trackrDarkBlueColor);
}

.taskHolder.linkedTaskExpand:not(.expandedLinkedTask) .bottom .linkedTasksHolder .linkedTask.selected .linkedTaskReadyBtn{
    top: 15px;
}
.taskHolder.linkedTaskExpand .bottom .linkedTasksHolder .linkedTask .linkedTaskReadyBtn{
    display: block;
}
.taskHolder .bottom .linkedTasksHolder .linkedTask.selected .linkedTaskReadyBtn{
    border-color: #34343496;
}
.taskHolder .bottom .linkedTasksHolder .linkedTask .linkedTaskReadyBtn.isReady{
    border: 1px solid #f9b334;
    background: #f9b334;
}
.taskHolder .bottom .linkedTasksHolder .linkedTask.complete .linkedTaskReadyBtn:not(.isReady){
    visibility: hidden;
}
.taskHolder .bottom .linkedTasksHolder .linkedTask.complete.isTierC .linkedTaskReadyBtn{
    visibility: visible;
    background: orange;
    top: 5px;
    left: -1px;
    line-height: 13px;
}
.taskHolder .bottom .linkedTasksHolder .linkedTask .linkedTaskReadyBtn .tierCIcon{
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    text-align: center;
    display: none;
}
.taskHolder .bottom .linkedTasksHolder .linkedTask.isTierC .linkedTaskReadyBtn .tierCIcon{
    display: block;
}

.taskHolder .bottom .linkedTasksHolder .linkedTask .linkedTaskStartDate{
    width: 70px;
    min-height: 20px;
    line-height: 20px;
    height: 20px;
    background: #f9b334;
    color: #fff;
    border-radius: 4px;
    margin-left:10px;
    margin-right: 10px;
    text-align: center;
    position: relative;
    top: 3px;
}
.taskHolder .bottom .linkedTasksHolder .linkedTask.noDueDateNeeded .linkedTaskStartDate{
    visibility: hidden;
}
.taskHolder:not(.expandedLinkedTask) .bottom .linkedTasksHolder .linkedTask.selected .linkedTaskStartDate{
    top: 7px;
    line-height: 30px;
    min-height: 30px;
    height: 30px;
}
.taskHolder .bottom .linkedTasksHolder .linkedTask .linkedTaskStartDate.empty{
    min-height: 10px;
    height: 10px;
    background: none;
    position: relative;
    top: 9px;
    border: 1px dashed #00000054;
    border-radius: 10px;
}
.taskHolder .bottom .linkedTasksHolder .linkedTask.complete .linkedTaskStartDate.empty{
    visibility: hidden;
}
.taskHolder.linkedTaskExpand:not(.expandedLinkedTask) .bottom .linkedTasksHolder .linkedTask.selected .linkedTaskStartDate.empty{
    top: 18px;
    min-height: 10px;
    height: 10px;
}
.taskHolder .bottom .linkedTasksHolder .linkedTask .linkedTaskDueDateHolder{
    position: relative;
    width: 70px;
    height: 27px;
    float: left;
}
.taskHolder .bottom .linkedTasksHolder .linkedTask .linkedDueDateDot{
    position: absolute;
    width: 13px;
    height: 13px;
    background: var(--negativeColor);
    top: 1px;
    left: -6px;
    border-radius: 20px;
    border: 3px solid #e6f6cb;
    z-index: 2;
    display: none;
}
.taskHolder .bottom .linkedTasksHolder .linkedTask.hasDeliverable.complete .linkedDueDateDot{
    display: block;
}
.taskHolder .bottom .linkedTasksHolder .linkedTask.hasDeliverable.deliverableSent .linkedDueDateDot{
    background: var(--positiveColor);
}
.taskHolder .bottom .linkedTasksHolder .linkedTask .linkedTaskDueDate{
    width: 70px;
    min-height: 25px;
    text-align: center;
}
.taskHolder .bottom .linkedTasksHolder .linkedTask.noDueDateNeeded .linkedTaskDueDate{
    visibility: hidden;
}
.taskHolder .bottom .linkedTasksHolder .linkedTask .linkedTaskDueDate.empty{
    min-height: 10px;
    position: relative;
    top: 9px;
    border: 1px dashed #00000054;
    border-radius: 10px;
}
.taskHolder.linkedTaskExpand:not(.expandedLinkedTask) .bottom .linkedTasksHolder .linkedTask.selected .linkedTaskDueDate.empty{
    top: 18px;
}
.taskHolder .bottom .linkedTasksHolder .linkedTask.hasDeliverable .linkedTaskDueDate{
    line-height: 20px;
    position: relative;
    top: 3px;
    border-radius: 4px;
    background: var(--deliverableColor);
    min-height: 20px;
    height: 20px;
    color: #fff;
}
.taskHolder .bottom .linkedTasksHolder .linkedTask.hasInternalDeliverable .linkedTaskDueDate{
    background: var(--internalDeliverableColor);
    line-height: 20px;
    position: relative;
    top: 3px;
    border-radius: 4px;
    min-height: 20px;
    height: 20px;
    color: #fff;
}
.taskHolder:not(.expandedLinkedTask) .bottom .linkedTasksHolder .linkedTask.hasDeliverable.selected .linkedTaskDueDate{
    line-height: 30px;
    top: 7px;
    min-height: 30px;
    height: 30px;
}
.taskHolder:not(.expandedLinkedTask) .bottom .linkedTasksHolder .linkedTask.hasInternalDeliverable.selected .linkedTaskDueDate{
    line-height: 30px;
    top: 7px;
    min-height: 30px;
    height: 30px;
}
.taskHolder .bottom .linkedTasksHolder .linkedTask .linkedTaskAssignedTo{
    width: 110px;
    margin-left: 25px;
    min-height: 25px;
}
.taskHolder.isClientView .bottom .linkedTasksHolder .linkedTask .linkedTaskAssignedTo{
    visibility: hidden;
}
.taskHolder .bottom .linkedTasksHolder .linkedTask .linkedTaskHours{
    width: 105px;
    min-height: 25px;
    position: relative;
    top: 0px;
    font-size: 15px;
}
.taskHolder.isClientView .bottom .linkedTasksHolder .linkedTask .linkedTaskHours{
    visibility: hidden;
}
.taskHolder .bottom .linkedTasksHolder .linkedTask.isMistakeHours .linkedTaskHours{
    color: var(--negativeColor);
}
.taskHolder .bottom .linkedTasksHolder .linkedTask .linkedTaskProgressBar{
    position: relative;
    margin: auto;
    height: 10px;
    width: 50px;
    top: 8px;
    float: left;
    display: none;
}
.taskHolder.linkedTaskExpand .bottom .linkedTasksHolder .linkedTask .linkedTaskProgressBar{
    display: block;
}
.taskHolder:not(.expandedLinkedTask) .bottom .linkedTasksHolder .linkedTask.selected .linkedTaskProgressBar{
    top: 16px;
}

.taskHolder .bottom .linkedTasksHolder .linkedTask .linkedTaskProgressBar .progressBarHolder{
    /*background: #eaeaea;*/
    background: #00000017;
    height: 100%;
    border-radius: 2px;
    overflow: hidden;
    width: 60px;
    margin: auto;
}
.taskHolder:not(.expandedLinkedTask) .bottom .linkedTasksHolder .linkedTask.selected .linkedTaskProgressBar .progressBarHolder:not(.underBudget){
    height: 10px;
    background: #fff;
    /*border: 1px solid #054258;*/
}
.taskHolder .bottom .linkedTasksHolder .linkedTask.popupSelected .linkedTaskProgressBar .progressBarHolder{
    background: #00000026;
}
.taskHolder.isOverWeekBudget:not(.readyTask) .bottom .linkedTask .linkedTaskHours .linkedTaskProgressBar .progressBarHolder{
    /*background: #ffafaf;*/
}
.taskHolder .bottom .linkedTasksHolder .linkedTask .linkedTaskProgressBar .progressBarHolder.overBudget{
    background:var(--overBudgetColor) !important;
}
.taskHolder .bottom .linkedTasksHolder .linkedTask .linkedTaskProgressBar .progressBarHolder.underBudget{
    background:var(--underBudgetColor);
}

.taskHolder .bottom .linkedTasksHolder .linkedTask .linkedTaskProgressBar .progressBarHolder .meter{
    background: var(--trackrDarkBlueColor);
    height: 100%;
}
.taskHolder .bottom .linkedTasksHolder .linkedTask .linkedTaskHours .completedHours{
    float: left;
    width: 45px;
    padding-right: 5px;
    text-align: right;
    min-height: 25px;
}
.taskHolder .bottom .linkedTasksHolder .linkedTask .linkedTaskHours .separator{
    float: left;
}
.taskHolder .bottom .linkedTasksHolder .linkedTask .linkedTaskHours .budgetHours{
    float: left;
    width: 45px;
    text-align: left;
    padding-left: 5px;
}

.taskHolder .bottom .linkedTasksHolder .linkedTask .linkedtaskNeedsReview{
    width: 90px;
    margin-left: 10px;
    min-height: 18px;
    visibility: hidden;
    line-height: 18px;
    position: relative;
    top: 3px;
    border-radius: 4px;
}
.taskHolder.linkedTaskExpand .bottom .linkedTasksHolder .linkedTask .linkedtaskNeedsReview{
    visibility: visible;
}
.taskHolder.linkedTaskExpand .bottom .linkedTasksHolder .linkedTask.isPayment .linkedtaskNeedsReview{
    visibility: hidden;
}
.taskHolder.linkedTaskExpand:not(.expandedLinkedTask) .bottom .linkedTasksHolder .linkedTask.selected .linkedtaskNeedsReview{
    top: 4px;
    line-height: 34px;
}
.taskHolder.linkedTaskExpand .bottom .linkedTasksHolder .linkedTask .linkedtaskNeedsReview.needsReview{
    background: var(--notifyColor);
}
.taskHolder.linkedTaskExpand .bottom .linkedTasksHolder .linkedTask .linkedtaskNeedsReview.QC{
    background: #dadada;
    color: var(--trackrDarkGrayColor);
    width: 50px;
}
.taskHolder.linkedTaskExpand .bottom .linkedTasksHolder .linkedTask.pendingComplete .linkedtaskNeedsReview{
    background: var(--positiveColor);
}
.taskHolder .bottom .linkedTasksHolder .linkedTask .linkedTaskHoursLeft{
    
    line-height: 18px;
    height: 18px;
    min-height: 18px;
    position: relative;
    top: 3px;
    border-radius: 4px;
    min-width: 20px;
    width: 40px;
    text-align: center;
    font-size: 15px;
}
.taskHolder .bottom .linkedTasksHolder .linkedTask .linkedTaskHoursLeft.negative{
    background: var(--negativeColor);
    color: #fff;
}
.taskHolder.productionTeam .bottom .linkedTasksHolder .linkedTask .linkedTaskHoursLeft.negative{
    background: gray;
    color: #fff;
}
.taskHolder .bottom .linkedTasksHolder .linkedTask .linkedTaskHoursLeft.positive{
    background: var(--positiveColor);
    color: #fff;
}
.taskHolder .bottom .linkedTasksHolder .linkedTask.complete .linkedTaskHoursLeft{
    visibility: hidden;
}
.taskHolder:not(.expandedLinkedTask) .bottom .linkedTasksHolder .linkedTask.selected .linkedTaskHoursLeft{
    line-height: 34px;
    height: 34px;
    top: 4px;
}
.taskHolder .bottom .linkedTasksHolder .linkedTask.pendingComplete .linkedTaskHoursLeft{
    visibility: hidden;
}


.taskHolder .linkedTask .linkedTaskCollapsedIconsHolder{
    display: none;
    width: 40px;
    float: left;
    margin-left: 5px;
    position: absolute;
    top: 0px;
    right: 40px;
}
.taskHolder.linkedTaskExpand .linkedTask .linkedTaskCollapsedIconsHolder{
    display: block;
}
.taskHolder .linkedTask .linkedTaskCollapsedIconsHolder .linkedTaskTodosIcon{
    float: right;
    top: 0px;
    left: 0px;
    width: 20px;
    text-align: center;
    visibility: hidden;
}
.taskHolder .linkedTask.hasActiveTodos .linkedTaskCollapsedIconsHolder .linkedTaskTodosIcon{
    visibility: visible;
}
.taskHolder .linkedTask .linkedTaskCollapsedIconsHolder .linkedTaskTimerIcon{
    float: right;
    top: 0px;
    left: 0px;
    width: 20px;
    text-align: center;
    visibility: hidden;
}
.taskHolder .linkedTask.hasTimers .linkedTaskCollapsedIconsHolder .linkedTaskTimerIcon{
    visibility:visible;
}



.taskHolder .bottom .linkedTasksHolder .linkedTask .linkedTaskAddBtn{
    margin-left: 15px;
    float: left;
    display: none;
    cursor: pointer;
    background: #00000082;
    color: #fff;
    width: 27px;
    text-align: center;
    position: relative;
    top: 2px;
    line-height: 21px;
    position: absolute;
    right: 10px;
}
.taskHolder .bottom .linkedTasksHolder .linkedTask .linkedTaskAddBtn:hover{
    background: var(--trackrBlueColor);
}
.taskHolder.linkedTaskExpand .bottom .linkedTasksHolder .linkedTask .linkedTaskAddBtn{
    display: block;
    opacity: 0;
    transition: opacity 600ms ease;
}
.taskHolder.linkedTaskExpand:hover .bottom .linkedTasksHolder .linkedTask .linkedTaskAddBtn{
    opacity: 1;
    transition: opacity 600ms ease;
}
.taskHolder:not(.expandedLinkedTask) .bottom .linkedTasksHolder .linkedTask.selected .linkedTaskAddBtn{
    line-height: 37px;
    background: #767676;
    top: 3px;
    font-size: 20px;
}
.taskHolder:not(.expandedLinkedTask) .bottom .linkedTasksHolder .linkedTask.selected .linkedTaskAddBtn:hover{
    background: var(--trackrBlueColor);
}
.taskHolder .bottom .linkedTasksHolder .linkedTask .linkedTaskTypeIcon{
    position: absolute;
    left: 4px;
    top: 7px;
    pointer-events: none;
    display: none;
}
.taskHolder.linkedTaskExpand .bottom .linkedTasksHolder .linkedTask .linkedTaskTypeIcon{
    display: block;
}
.taskHolder .bottom .linkedTasksHolder .linkedTask .linkedTaskTypeIcon i{
    display: none;
    font-size: 13px;
    opacity: 0.8;
}
.taskHolder .bottom .linkedTasksHolder .linkedTask.isClientReview .linkedTaskTypeIcon .clientReview{
    display: block;
}
.taskHolder .bottom .linkedTasksHolder .linkedTask.isQC .linkedTaskTypeIcon .qc{
    display: block;
    position: relative;
    top: 1px;
}
.taskHolder .bottom .linkedTasksHolder .linkedTask.isSiteVisit .linkedTaskTypeIcon .siteVisit{
    display: block;
    position: relative;
    top: 1px;
}
.taskHolder:hover .bottom .linkedTasksHolder .linkedTask.clientReview .linkedTaskTypeIcon{
    /*display: none;*/
}
/* --- Todos Holder ---- */

.taskHolder .bottom .todosHolder{
    margin-left:30px;
    margin-bottom: 20px;
    position: relative;
    margin-top: 25px;
    width: 1100px;
    /*margin-top:55px;*/ /* may want to get rid of this eventually */
    display: none;
    display: block;
    /*overflow: auto;
    max-height: 260px;*/
    -ms-overflow-style: none;  /* IE and Edge */
    scrollbar-width: none;  /* Firefox */
}
.taskHolder .bottom .todosHolder::-webkit-scrollbar{
    display: none;
}

.taskHolder .bottom .todosHolder{
    display: block;
}

.taskHolder .bottom .todosHolder .todosTitle{
    position: relative;
    left: 38px;
    margin-bottom: 5px;
    color: #00000047;
    border-top: 1px solid #0000000d;
    padding-top: 10px;
}
.taskHolder .bottom .todosHolder .todosTitle span{
    position: relative;
    top: -2px;
}
.taskHolder .bottom .todosHolder .todosTitle i{
    font-size: 20px;
    margin-right: 5px;
    display: none;
}


.taskHolder.expandedLinkedTask .bottom .todosHolder{
    display: none;
}
.taskHolder .bottom .todosHolder .newTodoBtn{
    background: #00000014;
    width: 29px;
    position: absolute;
    left: 90px;
    top: 10px;
    margin-bottom: 10px;
    text-align: center;
    border-radius: 4px;
    color: #0003;
    cursor: pointer;
    /*
    opacity:0;
    transition: opacity 300ms ease;
    display: none;
    */
}
.taskHolder:hover .bottom .todosHolder .newTodoBtn{
    opacity:1;
    transition: opacity 300ms ease;
}
.taskHolder .bottom .todosHolder .showMoreBtn{
    float: right;
    margin-right: 32px;
    cursor: pointer;
    display:none;
    position: relative;
    top:-4px;
}
.taskHolder .bottom .todosHolder.hasCompleteTodos .showMoreBtn{
    /*display:block;*/
}

.taskHolder .bottom .todosHolder .todoHolder{
    position: relative;
    left: 30px;
    border-top: 1px solid #0000004d;
    background-color: #0000001f;
    color: #00000075;
    clear: both;
    overflow: auto;
    max-width: 1060px;
    transition: background-color 300ms ease;
    padding: 5px 0px 3px;
}
.taskHolder .bottom .todosHolder .todoHolder.first{
    border-radius: 6px 6px 0px 0px;
}
.taskHolder .bottom .todosHolder .todoHolder::-webkit-scrollbar { 
   display: none;  // Safari and Chrome
}
.taskHolder .bottom .todosHolder .todoHolder.forMe{
    /*border-left:2px solid #35aedb;*/
}
.taskHolder .bottom .todosHolder .todos .todoHolder.complete{
    background-color: var(--positiveColor);
    border-bottom: 1px solid #74a91e;
    border-top: 0px;
    color: #355109;
}
.taskHolder .bottom .todosHolder .todos.activeOnly .todoHolder.complete{
    height:0px;
    background-color:#fff;
    border:none;
    padding: 0px;
}
.taskHolder .bottom .todosHolder .todos.activeOnly .todoHolder.currentlyEditing{
    background-color: #dadada;
    transition:background-color 300ms ease;
}
.taskHolder .bottom .todosHolder .todoHolder .todoDisabledCheckbox{
    display: block;
    opacity: 0.3;
    top: 13px;
    width: 13px;
    height: 13px;
    border-radius: 3px;
    border: 1px solid #808080;
    position: absolute;
    left: 10px;
    display: none;
}
.taskHolder .bottom .todosHolder .todoHolder.question .todoDisabledCheckbox{
    display: none;
}
.taskHolder .bottom .todosHolder .todoHolder.forMe .todoDisabledCheckbox{
    display: none;
}
.taskHolder .bottom .todosHolder .todoHolder.completable .todoDisabledCheckbox{
    display: none;
}
.taskHolder .bottom .todosHolder .todoHolder .todoCheckbox{
    visibility: hidden;
    margin: 0px 10px;
    float: left;
    display: block;
    position: relative;
    top: 3px;
}
.taskHolder .bottom .todosHolder .todoHolder .todoQuestionbox{
    display: none;
}
.taskHolder .bottom .todosHolder .todoHolder.forMe .todoCheckbox{
    /*visibility: visible;*/
}
.taskHolder .bottom .todosHolder .todoHolder.completable .todoCheckbox{
    /*visibility: visible;*/
}
.taskHolder .bottom .todosHolder .todoHolder.question.forMe .todoCheckbox{
    display: none;
}
.taskHolder .bottom .todosHolder .todoHolder.complete .todoCheckbox{
    visibility: hidden;
}
.taskHolder .bottom .todosHolder .todoHolder .todoCheckboxNew{
    position: absolute;
    background: none;
    border-radius: 10px;
    width: 20px;
    height: 20px;
    text-align: center;
    left: 6px;
    color: var(--positiveColor);
    cursor: pointer;
    line-height: 20px;
    top: 4px;
    border: 1px solid #d5d5d5a6;

}
.taskHolder .bottom .todosHolder .todoHolder.completable .todoCheckboxNew{
    border: 1px solid #d5d5d5;
    background: #fff;
}
.taskHolder .bottom .todosHolder .todoHolder.complete .todoCheckboxNew{
    background: var(--positiveColor);
    color: #fff;
    border: none;
}
.taskHolder .bottom .todosHolder .todoHolder .todoCheckboxNew i{
    opacity: 0;
}
.taskHolder .bottom .todosHolder .todoHolder .todoCheckboxNew:hover i{
    opacity: 0.2;
    color: gray;
}
.taskHolder .bottom .todosHolder .todoHolder.complete .todoCheckboxNew i{
    opacity: 1;
}

.taskHolder .bottom .todosHolder .todoHolder.question.forMe .todoQuestionbox{
    display: block;
    float: left;
    margin: 8px;
    font-size: 19px;
    position: relative;
    top: 2px;
    cursor: pointer;
}
.taskHolder .bottom .todosHolder .todoHolder .todoNameHolder{
    height: 0px;
    width: 600px;
    float: left;
    min-height: 20px;
}
.taskHolder .bottom .todosHolder .todoHolder .createdByTooltip{
    position: absolute;
    opacity: 0;
    top: 4px;
    left: 683px;
    background: var(--trackrHeaderColor);
    color: #fff;
    padding: 0px 15px;
    border-radius: 4px;
    z-index: 1;
    transition: opacity 300ms ease;
}
.taskHolder .bottom .todosHolder .todoHolder .todoNameHolder:hover .createdByTooltip{
    opacity: 1;
}
.taskHolder .bottom .todosHolder .todoHolder .todoValue{
    float:left;
    margin-right:10px;
}
.taskHolder .bottom .todosHolder .todoHolder .todoValue.date{
    width: 70px;
    margin-left: 10px;
    position: relative;
    top: -2px;
    height: 20px;
    line-height: 20px;
    border-radius: 4px;
    border: 1px dashed #c6c6c6;
    text-align: center;
}
.taskHolder .bottom .todosHolder .todoHolder.pastDue .todoValue.date{
    color:var(--negativeColor);
}
.taskHolder .bottom .todosHolder .todoHolder .todoValue.completedDate{
    width: 75px;
    min-height: 1px;
    position: relative;
    top: 0px;
}
.taskHolder .bottom .todosHolder .todoHolder .todoValue.needsReceipt{
    margin-left: 17px;
    position: relative;
    top: 5px;
}
.taskHolder .bottom .todosHolder .todoHolder .todoValue.name{
    width: 640px;
    line-height: 19px;
    white-space: pre-line;
    margin-left: 5px;
}
.taskHolder .bottom .todosHolder .todoHolder .todoNameHolder:hover .todoValue.name{
    color: black;
}
.taskHolder .bottom .todosHolder .todoHolder .todoValue.hours{
    width: 50px;
    text-align: center;
    margin-right: 10px;
    border: 1px solid #bebebe;
    border-radius: 4px;
    line-height: 19px;
    position: relative;
    top: -2px;
    font-size: 13px;
}
.taskHolder .bottom .todosHolder .todoHolder .todoValue.hours.zero{
    visibility: hidden;
}
.taskHolder .bottom .todosHolder .todoHolder .todoValue.assignedToName{
    width: 160px;
    text-align: right;
    visibility: visible;
    position: relative;
    top: 0px;
}
.taskHolder .bottom .todosHolder .todoHolder.forMe .todoValue.assignedToName{
    visibility: hidden;
}
.taskHolder .value{
	float:left;
	width:100px;
}
.taskHolder .todoHolder .todoEditBtn{
    position: absolute;
    right: 9px;
    top: 1px;
    /*background: #fbfbfb;
    background:#efefef;
    background: #fff;*/
    border-radius: 15px;
    /*border: 1px solid #d2d2d2;*/
    width: 22px;
    height: 22px;
    text-align: center;
    /*display:none;*/
    right: -31px;
    cursor:pointer;
    transition: right 300ms ease;
    font-size: 17px;
}
.taskHolder .todoHolder .todoEditBtn:hover{
    color:var(--trackrBlueColor);
}
.taskHolder .todoHolder.editable:hover .todoEditBtn{
    display:block;
    right: 9px;
    transition: right 300ms ease;

}
.taskHolder.popup .value.expandedShow, .taskHeader.expandedShow{
    /*width:0px;*/
    max-width:0px;
    min-width:0px;
    /*overflow:hidden;*/
    transition:max-width 300ms ease, min-width 300ms ease;
}
.tasksPopup .taskHolder.popup .value.expandedShow, .tasksPopup.expanded .taskHeader.expandedShow{
    max-width:200px;
    min-width:25px;
    transition:max-width 300ms ease, min-width 300ms ease;
}

.taskHolder .deleteBtn{
	display: none;
    position: absolute;
    right: 19px;
    cursor: pointer;
}
.taskHolder:hover .deleteBtn{
	/*display:block;*/
}

.taskHolder .notesIcon{
    font-size: 19px;
    color: var(--trackrDarkBlueColor);
    border-radius: 4px;
    float: left;
    position: relative;
    top: -1px;
    cursor:pointer;
}
.taskHolder .notesIcon:hover{
    color:#55bae2;
}
.taskHolder.noNotes .notesIcon{
    opacity:0;
    opacity: 0.2;
    color: #808080;
}
.taskHolder .notesCounter{
    position: absolute;
    top: 1px;
    left: 26px;
    background: #fd7474;
    color: #fff;
    border-radius: 21px;
    padding: 0px 6px;
    text-align: center;
    font-size: 12px;
    border: 2px solid #fff;
    z-index: 1;
    pointer-events: none;
    transform:scale(1);
    transition:transform 300ms ease;
}
.taskHolder .notesCounter.hide{
    transition:transform 300ms ease;
    transform:scale(0);
}

/* Status Ribbons */
.taskHolder .statusRibbon{
	position: absolute;
    left: 0px;
    top: 0px;
    width: 8px;
    background: #000;
    height: 100%;
}
.taskHolder .statusRibbon.Lead{
    background: repeating-linear-gradient( 45deg, #d6d6d6, #d6d6d6 2px, #e6e6e6 2px, #e6e6e6 5px );
}
.taskHolder .statusRibbon.RFQ{
	background: repeating-linear-gradient( 45deg, #d6d6d6, #d6d6d6 2px, #e6e6e6 2px, #e6e6e6 5px );
}
.taskHolder .statusRibbon.Quoted{
	background:#cecece;
}
.taskHolder .statusRibbon.Approved{
	background:#fff;
    border:2px solid #ffb734;
}
.taskHolder .statusRibbon.InProgress{
	background:var(--inProgressColor);
}
.taskHolder .statusRibbon.Paused{
    background: repeating-linear-gradient( 45deg, #f9b334, #f9b334 2px, #fdd690 2px, #fdd690 5px );
    background: repeating-linear-gradient( 45deg, #f9b334, #f9b334 2px, #fdd69000 4px, #fdd69000 5px );
}
.taskHolder .statusRibbon.Complete{
	background: repeating-linear-gradient( 45deg, #8ac925, #8ac925 2px, #bdeb72 2px, #bdeb72 5px );
}
.taskHolder .statusRibbon.Paid{
	background:var(--positiveColor);
}
.taskHolder .statusRibbon.Declined{
	background:#ff7676;
}

/* --- Task Status --- */
.taskHolder .taskStatus{
	position: absolute;
    top: 0px;
    left: 8px;
    width: 30px;
    height: 100%;
    border-left: 2px solid #fff;
    border-right: 1px solid #fff;
    z-index: 7;
    cursor: pointer;
    opacity: 1;
    transition: opacity 300ms ease;
}
.taskHolder .taskStatus:hover{
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    border: 4px dashed #00000021;
}
.taskHolder.linkedTaskExpand .taskStatus{
    opacity: 0;
    pointer-events: none;
}
.taskHolder.linkedTask .taskStatus{
    
}
.taskHolder .taskStatus.NotStarted{
	background:#d6d6d6;
}
.taskHolder .taskStatus.InProgress{
	background:var(--inProgressColor);
}
.taskHolder .taskStatus.Complete{
	background:var(--positiveColor);
}
.taskHolder.pendingComplete .taskStatus{
    /*background: repeating-linear-gradient( 45deg, #8ac925, #8ac925 2px, #bdeb72 2px, #bdeb72 5px ) !important;*/
    background: repeating-linear-gradient( 45deg, #8ac925, #8ac925 2px, #d5efab 2px, #d5efab 5px ) !important;
}
.taskHolder.collapseTask .taskStatus{
    /*top: -5px;*/
}
.taskHolder .taskStatusEdit{
    pointer-events:none;
}



/* Status */
.taskHolder .value.status{
	opacity:0;
    overflow: hidden;
    float:left;
}

.taskHeader.status{
    overflow: hidden;
    /*opacity: 0.5;*/
    font-size: 12px;
}

/* ProjectName */
.taskHolder .value.projectName, .taskHeader.projectName{
    text-align:left;
}




.taskHolder .value.projectName{
    color: #fffc;
    cursor: pointer;
    padding: 0px 8px;
    border-radius: 2px;
    float: none;
    width: 100%;
    width: fit-content;
    border: 1px solid #0000;
    font-size: 13.5px;
}
.taskHolder.otherProject .value.projectName{
    color: var(--trackrDarkBlueColor);
}
.taskHolder.internalBillable .value.projectName{
    background: var(--internalBillableColor);

}
.taskHolder.designProject .value.projectName{
    background: var(--designProjectColor);
}
.taskHolder.structuralProject .value.projectName{
    background: var(--structuralProjectColor);
}
.taskHolder.caProject .value.projectName{
    background: var(--caProjectColor);
}
.taskHolder.inspectionProject .value.projectName{
    background: var(--inspectionProjectColor);
}

.taskHolder .value.projectName:hover{
    /*transform: scale(1.1);
    transform-origin: left;*/
    color: var(--trackrBlueColor);
}
.taskHolder.collapseTask .value.projectName{
    height: 22px;
    overflow: hidden;
}
.taskHolder .projectTaskNameHolder{
    float: left;
    width: 310px;
    /*overflow: auto;*/
    margin-bottom: 5px;
    position: relative;
}
.taskHolder.collapseTask .projectTaskNameHolder{
    position: relative;
    top: -5px;
    width: 320px;
    margin-right: 70px;
}
.taskHolder.collapseTask.noProjectNames .projectTaskNameHolder{
    position: relative;
    top: 2px;
    top: -5px;
    width: 320px;
    margin-right: 70px;
}
.taskHolder.noProjectNames.linkedTaskExpand .projectTaskNameHolder{
    position: relative;
    top: 13px;
}
.taskHolder .projectTaskNameHolder .taskManagedByHolder{
    display: none;
}
.taskHolder.showManagedBy .taskManagedByHolder{
    display: block;
    /*margin-top: 30px;*/
    position: relative;
    clear: both;
    overflow: auto;
}
.taskHolder.showManagedBy .taskManagedByHolder .divider{
    height: 1px;
    width: 220px;
    background: #00000014;
    position: absolute;
    top: 0px;
    left: 15px;
}
.taskHolder.showManagedBy.collapseTask .taskManagedByHolder{
    opacity: 0;
}
.taskHolder.showManagedBy.expandedLinkedTask .taskManagedByHolder{
    display: none;
}
.taskHolder .projectTaskNameHolder .taskManagedByHolder .projectManager{
    border: 1px solid #808080;
    overflow: auto;
    text-align: center;
    width: auto;
    border-radius: 4px;
    position: relative;
    /*top: 5px;*/
    left: 18px;
    font-size: 13px;
    opacity: 0.5;
    display: block;
    padding: 0px 8px;
    float: left;
    margin-right: 5px;
}
.taskHolder .projectTaskNameHolder .taskManager{
    border: 1px solid #808080;
    overflow: auto;
    text-align: center;
    width: auto;
    border-radius: 4px;
    position: relative;
    /*top: 5px;*/
    left: 18px;
    font-size: 13px;
    opacity: 0.5;
    display: block;
    padding: 0px 8px;
    float: left;
    min-height: 21px;
    opacity: 0.15;
}
.taskHolder.hasTaskManager .projectTaskNameHolder .taskManager{
    opacity: 0.5;
}
.taskHolder .projectTaskNameHolder .taskCategory{
    background: #00000024;
    position: relative;
    top: 0px;
    overflow: auto;
    text-align: center;
    width: auto;
    border-radius: 4px;
    font-size: 13px;
    opacity: 0.5;
    display: block;
    padding: 0px 8px;
    float: left;
    margin-left: 50px;
    min-height: 20px;
    min-width: 70px;
}
.taskHolder .projectTaskNameHolder .taskCategory.show{
    background: gray;
    color: #fff;
    opacity: 1;
}
.taskHolder .projectTaskNameHolder .taskReceipt{
    float: left;
    width: 22px;
    margin-left: 20px;
    background: none;
    text-align: center;
    position: relative;
    top: 5px;
    cursor: pointer;
    border-radius: 10px;
    color: #808080;
    opacity: 0.3;
    display: none;
}
.taskHolder .projectTaskNameHolder .taskReceipt.hasReceipt{

}
.taskHolder .projectTaskNameHolder .taskActionBtnsHolder{
    margin-top: 10px;
    margin-left: 20px;
    width: 326px;
    margin-bottom: 10px;
    border-radius: 4px;
    border: 1px solid #0000005e;
    overflow: hidden;
    line-height: 26px;
}
.taskHolder.collapseTask .taskActionBtnsHolder{
    opacity: 0;
}
.taskHolder.showManagedBy.expandedLinkedTask .taskActionBtnsHolder{
    display: none;
}
.taskHolder .projectTaskNameHolder .taskActionBtnsHolder .taskActionBtn{
    float: left;
    width: 54px;
    background: none;
    text-align: center;
    cursor: pointer;
    color: #000;
    opacity: 0.3;
    border-right: 1px solid #000;
}
.taskHolder .projectTaskNameHolder .taskActionBtnsHolder .taskActionBtn:hover{
    color: var(--trackrDarkBlueColor);
    /*transform: scale(1.3);*/
    opacity: 1;
}
.taskHolder .projectTaskNameHolder .taskActionBtnsHolder .taskActionBtn.taskDeliverable{
   margin-left: 0px;
}
.taskHolder .projectTaskNameHolder .taskActionBtnsHolder .taskActionBtn.taskApprovalBtn{
    border-right: none;
}


.taskHolder.hasDeliverable .projectTaskNameHolder .taskDeliverable{
    background: var(--deliverableColor);
    opacity: 1;
    color: #fff;
    border-color: #fff;
}
.taskHolder.hasInternalDeliverable .projectTaskNameHolder .taskDeliverable{
    background: var(--internalDeliverableColor);
    color: #fff;
    opacity: 1;
    border-right: 1px solid #808080;
}
.taskHolder.deliverableSent .projectTaskNameHolder .taskDeliverableSentBtn{
    background: #5a5a5a;
    opacity: 1;
    color: #fff;
    border-color: #fff;
}
.taskHolder .projectTaskNameHolder .taskPriorityBtn{

}
.taskHolder.highPriority .projectTaskNameHolder .taskPriorityBtn{
    background: #5a5a5a;
    opacity: 1;
    color: #fff;
}
.taskHolder .projectTaskNameHolder .taskMistakeHoursBtn{
}
.taskHolder.isMistakeHours .projectTaskNameHolder .taskMistakeHoursBtn{
    background: #5a5a5a;
    background: var(--negativeColor);
    opacity: 1;
    color: #fff;
}
.taskHolder.noDueDateNeeded .projectTaskNameHolder .taskHoursBucketBtn{
    background: #5a5a5a;
    opacity: 1;
    color: #fff;
}
.taskHolder.isApproved .projectTaskNameHolder .taskApprovalBtn{
    background: #5a5a5a;
    opacity: 1;
    color: #fff;
}

.taskHolder .value.projectName.highlight{
    color:#ff991a !important;
}
.taskHolder.noProjectNames .value.projectName{
    display:none;
}

.taskHolder .taskWarningsHolder{

}
.taskHolder .taskWarningsHolder .taskWarning{
    float: left;
    background: var(--negativeColor);
    color: white;
    padding: 0px 5px;
    border-radius: 4px;
    margin-right: 10px;
    margin-top: 5px;
}
.taskHolder.expandedLinkedTask .taskWarningsHolder .taskWarning{
    display: none;
}


.taskHolder.flagged .value.projectName{
    /*color: #797979;*/
}

/* TaskName */
.taskHolder .value.taskName, .taskHeader.taskName{
	width: 267px;
    margin-right: 10px;
    text-align:left;
}
.taskHolder .value.taskName{
    cursor: pointer;
    width: 100%;
    position: relative;
    left: 20px;
    color: var(--trackrDarkGrayColor);
    display: none;
}
.taskHolder.isMistakeHours .value.taskName{
    color: var(--negativeColor);
}
.taskHolder.isMistakeHours.expandedLinkedTask .value.taskName{
    color: var(--trackrDarkGrayColor);
}
.taskHolder.noDueDateChanged .value.taskName{
    background: #008000;
    color: #fff;
}
.taskHolder.popup .value.taskName{
    left:5px;
}
.taskHolder.collapseTask .value.taskName, .taskHolder.linkedTasksPopup .value.taskName{
    display: none;
}
.taskHolder.linkedTaskExpand .value.taskName:hover{
    /*filter: brightness(150%);*/
    color: var(--trackrBlueColor);
}
.taskHolder.expandedLinkedTask .value.taskName{
    display: block;
}


/* Task Scope Change Icon */

.taskHolder .taskScopeChangeIcon, .taskHolder .taskExpenseIcon{
    position: absolute;
    top: 27px;
    left: 3px;
    width: 11px;
    height: 11px;
    background: var(--inProgressColor);
    border: 1px solid black;
    display: none;
}
.taskHolder.noProjectNames .taskScopeChangeIcon, .taskHolder.noProjectNames .taskExpenseIcon{
    top: 4px;
}
.taskHolder.isScopeChange:not(.expandedLinkedTask) .taskScopeChangeIcon{
    display: block;
}


/* Task ExpenseIcon */
.taskHolder .taskExpenseIcon{
    background: var(--positiveColor);
}

.taskHolder.isExpense:not(.expandedLinkedTask) .taskExpenseIcon{
    display: block;
}
.taskHolder .collapseTaskName{
    /*display: none;*/
    width: 390px;
    margin-left: 10px;
    margin-bottom: 10px;
}
.taskHolder.collapseTask .collapseTaskName, .taskHolder.linkedTasksPopup .collapseTaskName{
    display: block;
}
.taskHolder.linkedTasksPopup .collapseTaskName{

}
.taskHolder.isMistakeHours .collapseTaskName{
    color: var(--negativeColor);
}
.taskHolder.noDueDateChanged .collapseTaskName{
    background: #008000;
    color: #fff;
}
.taskHolder.expandedLinkedTask .collapseTaskName{
    display: none;
}
.taskHolder.isScopeChange .collapseTaskName{
    width: 280px;
    margin-left: 20px;
}
.taskHolder.isExpense .collapseTaskName{
    width: 280px;
    margin-left: 20px;
}

/* Start and Due Date */
.taskHolder .value.startDate, .taskHeader.startDate{
	width:65px;
	margin-right:10px;
}
.taskHolder .value.startDate{
    background: var(--inProgressColor);
    border-radius: 4px;
    color: #fff;
    min-height: 22px;
    line-height: 25px;
    height: 25px;
}
.taskHolder.linkedTaskExpand .value.startDate{
    visibility: hidden;
}
.taskHolder.noDueDateNeeded .value.startDate{
    visibility: hidden;
}
.taskHolder .value.dueDate, .taskHeader.dueDate{
	width:65px;
	margin-right:10px;
}
.taskHolder .value.dueDate{
    height: 25px;
    line-height: 25px;
}
.taskHolder .dueDateHolder{
    position: relative;
    float: left;
}
.taskHolder .dueDateHolder .dueDateDot{
    position: absolute;
    width: 13px;
    height: 13px;
    background: var(--negativeColor);
    top: -3px;
    left: -6px;
    border-radius: 20px;
    border: 3px solid #e6f6cb;
    display: none;
}
.taskHolder.complete.hasDeliverable .dueDateHolder .dueDateDot{
    display: block;
}
.taskHolder.complete.hasDeliverable.deliverableSent .dueDateHolder .dueDateDot{
    display: block;
    background: var(--positiveColor);
}
.taskHolder.noDueDate .value.dueDate, .taskHolder.noStartDate .value.startDate{
    min-height: 25px;
    border: 1px dashed #0000005c;
    border-radius: 4px;
    background: none;
}

.taskHolder.hasDeliverable .value.dueDate{
    background: var(--deliverableColor);
    color: #fff;
    border-radius: 4px;
}
.taskHolder.hasInternalDeliverable .value.dueDate{
    background: var(--internalDeliverableColor);
    border-radius: 4px;
    color: #fff;
}

.taskHolder.linkedTaskExpand .dueDateHolder{
    visibility: hidden;
}
.taskHolder.noDueDateNeeded .dueDateHolder{
    visibility: hidden;
}
.taskHolder.linkedTaskExpand .value.dueDate{
    visibility: hidden;
}
.taskHolder.noDueDateNeeded .value.dueDate{
    visibility: hidden;
}
.taskHolder.pastDue .value.dueDate{
    color: var(--negativeColor);
    border-radius: 4px;
    border: 1px solid var(--negativeColor);
    line-height: 24px;
}
.taskHolder.hasInternalDeliverable.pastDue .value.dueDate{
    color: #bb343a;
}


.taskHolder.complete.noStartDate .value.startDate{
    visibility: hidden;
}
.taskHolder.complete.noDueDate .value.dueDate{
    /*visibility: hidden;*/
}
/*
.taskHolder.complete.showStartDate.noStartDate .value.startDate{
    visibility: visible;
    background: var(--negativeColor);
}
*/
.taskHolder.startDateFlagged.noStartDate .value.startDate{
    visibility: visible;
    background: var(--negativeColor);
}
.taskHolder .readyDate{
    position: absolute;
    top: 3px;
    left: 420px;
    color: #00000038;
    transition: opacity 300ms ease;
    width: 20px;
    height: 20px;
    border-radius: 20px;
    overflow: hidden;
    text-align: center;
    background: none;
    border: 1px solid #00000038;
    cursor: pointer;
    z-index: 1;
    line-height: 18px;
}
.taskHolder .readyDate:hover{
    border: 3px dashed #0000003b;
}
.taskHolder.isReady .readyDate{
    background: #f9b334 !important;
    color: #f9b334 !important;
    border: 1px solid #f9b334;
    outline:  3px solid #fff;
}
.taskHolder.isReady.lowerTier .readyDate{
    color: #c29134 !important;
    background: #ffdc9c !important;
}
.taskHolder.noDueDateNeeded .readyDate{
    visibility: hidden;
}
.taskHolder.complete:not(.isReady) .readyDate{
    visibility: hidden;
}
.taskHolder.isReady .readyDate:hover{
    border: 3px dashed #0000003b;
}

.taskHolder.linkedTaskExpand .readyDate{
    visibility: hidden;
}
.taskHolder.collapseTask .readyDate{
    top: 3px;
    left: 420px;
}


.taskHolder:hover .readyDate :not(.show){
    /*opacity: 1;
    top: 28px;*/
}
.taskHolder.isPTO .readyDate{
    display: none;
}

.taskHolder .dueDateChanged{
    position: absolute;
    left: 538px;
    top: 33px;
    color: #0000004f;
    opacity: 0;
    transition: opacity 300ms ease;
    width: 120px;
    text-align: center;
    border-radius: 4px;
    background: #787878;
    color: #fff;
}
.taskHolder.collapseTask .dueDateChanged{
    left: 645px;
    top: 19px;
}
.taskHolder .dueDateChanged.show{
    opacity: 1;
    transition:opacity 300ms ease;
}
.taskHolder .dueDateChanged .lbl{
    opacity: 0.4;
    font-size: 12px;
}
.taskHolder .dueDateChanged .val{

}
.taskHolder .pendingCompleteDate{
    position: absolute;
    left: 950px;
    top: 38px;
    color: #0000004f;
    opacity: 0;
    transition: opacity 300ms ease;
    width: 120px;
    text-align: center;
    border-radius: 4px;
    background: #787878;
    color: #fff;
}
.taskHolder .pendingCompleteDate.show{
    opacity: 1;
    transition:opacity 300ms ease;
}
.taskHolder .lastWorkedDate{
    position: absolute;
    left: 770px;
    top: 40px;
    color: #0000004f;
    opacity: 0;
    transition: opacity 300ms ease;
    width: 85px;
    text-align: center;
    border-radius: 4px;
    background: #787878;
    color: #fff;
}
.taskHolder .lastWorkedDate.show{
    opacity: 1;
    transition:opacity 300ms ease;
}
.taskHolder .lastWorkedDate .lbl{
    opacity: 0.4;
    font-size: 12px;
}
.taskHolder .dueDateDay{
    float: left;
    border: 1px solid #00000075;
    border-radius: 4px;
    font-size: 12px;
    color: #00000075;
    padding: 0px 2px;
    width: 22px;
    position: relative;
    top: 2px;
}
.taskHolder.linkedTaskExpand .dueDateDay{
    visibility: hidden;
}
.taskHolder.noDueDate .dueDateDay{
    opacity: 0;
}
.taskHolder .dueDateDay.empty{
    opacity:0;
}
.taskHolder.popup .dueDateDay{
    /*display:none;*/
}

/* Assigned To */
.taskHolder .value.assignedTo, .taskHeader.assignedTo{
	width: 90px;
    margin-left: 5px;
    margin-right: 5px;
}
.taskHolder.isClientView .value.assignedTo{
    visibility: hidden;
}
.taskHolder.linkedTaskExpand .value.assignedTo{
    visibility: hidden;
}

/* Hours */
.taskHolder .todoIcon{
    position: absolute;
    right: 18px;
    font-size: 20px;
    cursor: pointer;
}
.taskHolder.hasTodos .todoIcon{
    color: var(--trackrDarkBlueColor);
}
.tasksPopup .taskHolder .todoIcon{
    right: 35px;
}

.taskHolder .collapsedIconsHolder{
    display: none;
}
.taskHolder.collapseTask .collapsedIconsHolder{
    display: block;
    position: relative;
    height: 28px;
    width: 70px;
    float: left;
    top: 1px;
    opacity: 0.4;
    font-size: 16px;
}
.taskHolder .collapsedIconsHolder .collapsedIcon{
    float: left;
    top: 0px;
    left: 0px;
    width: 25px;
    text-align: center;
    visibility: hidden;
}
.taskHolder .collapsedIconsHolder .taskTodosIcon{
    
}
.taskHolder.hasActiveTodos .collapsedIconsHolder .taskTodosIcon{
    visibility: visible;
}
.taskHolder .collapsedIconsHolder .taskTimerIcon{
    
}
.taskHolder.hasTimer .collapsedIconsHolder .taskTimerIcon{
    visibility:visible;
}
.taskHolder .collapsedIconsHolder .taskApprovedIcon{
    
}
.taskHolder.isApproved .collapsedIconsHolder .taskApprovedIcon{
    visibility: visible;
}

/* Timer */
.taskHeader.timer{
    display: none;
}
.taskHolder .value.timer, .taskHeader.timer{
    position:relative;
}
.taskHolder .value.timer{
    font-size:19px;
}
.taskHolder.collapseTask .value.timer{
    display: none;
}
.taskHolder .value.timer i{
	cursor:pointer;
}



/* Hours Left */
.taskHolder .value.hoursLeft{
    font-size: 20px;
    position: relative;
    top: -4px;
}
.taskHolder.collapseTask .value.hoursLeft{
    top: -4px;
}
.taskHolder .value.hoursLeft.negative{
    color: #e66767;
}
.taskHolder.complete .value.hoursLeft{
    visibility:hidden;
}
.taskHolder.pendingComplete .value.hoursLeft{
    visibility: hidden;
}
.taskHolder .hoursLeft .hoursLeftValue{
    margin: auto;
    width: 50px;
    border-radius: 4px;
}
.taskHolder.linkedTaskExpand .value.hoursLeft{
    visibility: hidden;
}
.taskHolder .hoursLeft .hoursLeftValue.override{
    /*background: #eaeaea;*/
    border: 1px solid #e3d7d7;
}
.taskHolder.isOverWeekBudget .hoursLeft .hoursLeftValue.override{
    border: 1px solid #e7a2a2;
}
.taskHolder .hoursLeft .hoursLeftValue.override.negative{
    background: var(--negativeColor);
    color:#fff;
    border: 1px solid #e3d7d700;
}
.taskHolder.productionTeam .hoursLeft .hoursLeftValue.override.negative{
    background: gray;
    color:#fff;
    border: 1px solid #e3d7d700;
}
.taskHolder .hoursLeft .hoursLeftValue.override.positive{
    background: var(--positiveColor);
    color:#fff;
    border: 1px solid #e3d7d700;
}
.taskHolder .hours{
    overflow: auto;
    min-height: 1px;
    position: relative;
}
.taskHolder.isClientView .hours{
    left: -35px;
}
.taskHolder.linkedTaskExpand .value.hours{
    display: none;
}
.taskHolder .hours .progressBarHolder{
	/*border: 2px solid var(--trackrDarkBlueColor);*/
    background:#eaeaea;
    background: #00000017;
    height: 14px;
    border-radius: 11px;
    border-radius: 2px;
    overflow: hidden;
    width: 65px;
    margin: auto;
}
.taskHolder .hours .progressBarHolder.overBudget{
	background:var(--overBudgetColor) !important;
}
.taskHolder .hours .progressBarHolder.underBudget{
	background:var(--underBudgetColor);
}

.taskHolder .hours .progressBarHolder .meter{
	background: var(--trackrDarkBlueColor);
    height: 100%;
}
.taskHolder .hours .hoursHolder{
	font-size: 13px;
    color: var(--trackrDarkBlueColor);
    width: 100px;
    min-height: 25px;
    margin: auto;
}
.taskHolder.isClientView .hours .hoursHolder{
    visibility: hidden;
}
.taskHolder.isMistakeHours .hours .hoursHolder{
    color: var(--negativeColor);
}
.taskHolder .completedHours{
    cursor:pointer;
}
.taskHolder .hours .hoursHolder .completedHours{
	cursor: pointer;
    float: left;
    width: 45px;
    text-align: right;
    font-size: 15px;
    padding-right: 5px;
}
.taskHolder .hours .hoursHolder .separator{
    float: left;
    width: 10px;
    text-align: center;
}
.taskHolder .hours .hoursHolder .projectedHours{
	float: left;
    width: 45px;
    min-width: 40px;
    text-align: left;
    font-size: 15px; 
    padding-left: 5px;   
}



.taskHolder .linkedTaskHoursHolder{
    display: none;
    cursor: pointer;
    position: relative;
}
.taskHolder.isClientView .linkedTaskHoursHolder{
    left: -35px;
}
.taskHolder.linkedTaskExpand .linkedTaskHoursHolder{
    display: block;
    position: relative;
    top: 5px;
}
.taskHolder.linkedTaskExpand .linkedTaskHoursHolder:hover{
    filter: brightness(90%);
}
.taskHolder .linkedTaskHoursHolder .progressBarHolder{
    /*border: 2px solid var(--trackrDarkBlueColor);*/
    background:#eaeaea;
    height: 20px;
    border-radius: 4px;
    overflow: hidden;
    width: 65px;
    margin: auto;
}
.taskHolder.isClientView .linkedTaskHoursHolder .progressBarHolder{
    
}
.taskHolder .linkedTaskHoursHolder .progressBarHolder.overBudget{
    background:var(--overBudgetColor);
}
.taskHolder .linkedTaskHoursHolder .progressBarHolder.underBudget{
    background:var(--underBudgetColor);
}

.taskHolder .linkedTaskHoursHolder .progressBarHolder .meter{
    background: var(--trackrDarkBlueColor);
    height: 100%;
}
.taskHolder .linkedTaskHoursHolder .hoursHolder{
    font-size: 13px;
    color: var(--trackrDarkBlueColor);
    width: 100px;
    min-height: 25px;
    margin: auto;
}
.taskHolder.isClientView .linkedTaskHoursHolder .hoursHolder{
    visibility: hidden;
}
.taskHolder .linkedTaskHoursHolder .hoursHolder .completedHours{
    cursor: pointer;
    float: left;
    width: 45px;
    text-align: right;
    font-size: 15px;
    padding-right: 5px;
}
.taskHolder .linkedTaskHoursHolder .hoursHolder .separator{
    float: left;
    width: 10px;
    text-align: center;
}
.taskHolder .linkedTaskHoursHolder .hoursHolder .projectedHours{
    float: left;
    width: 45px;
    min-width: 40px;
    text-align: left;
    font-size: 15px; 
    padding-left: 5px;   
}





.taskHolder .needsReviewBy{
  border-radius: 4px;
  padding: 1px 7px;
  min-width: 90px;
  background: var(--notifyColor);
  /*border: 1px solid #00000045;*/
    /*color: #3c3c3c;*/
   /* border: 2px solid var(--notifyColorDark);*/
}
.taskHolder .needsReviewBy.QC{
    /*background: var(--internalDeliverableColor);
    color: white;*/
    border-radius: 20px;
    min-width: 50px;
    width: 50px;
    position: relative;
    left: 24px;
}
.taskHolder.pendingComplete .needsReviewBy{
    /*background: var(--positiveColor);*/
    background: repeating-linear-gradient( 45deg, #8ac925, #8ac925 2px, #d5efab 2px, #d5efab 5px );
    outline: 4px solid var(--positiveColor);
}

.taskHolder.pendingComplete.pendingCompleteOverdue .needsReviewBy{
    /*border: 3px solid var(--negativeColor);
    box-shadow: 1px 1px 10px #00000063;*/
    outline: 4px solid var(--negativeColor);
}
.taskHolder.needsReviewFlagged .needsReviewBy{
    /*border: 3px solid var(--negativeColor);
    box-shadow: 1px 1px 10px #00000063;*/
    background: var(--negativeColor);
}
.taskHolder.linkedTaskExpand .needsReviewBy{
    visibility: hidden;
}
.taskHolder.complete .needsReviewBy{
    visibility: hidden;
}
.taskHolder .needsReviewBy.empty{
  border: 1px solid #0000001a;
    background: none;
}
.taskHolder.previouslyPendingComplete .needsReviewBy{
    border: 3px solid var(--positiveColor);
}
.mainContentHolder .tasksTotals{
    height: 44px;
    background: var(--trackrDarkBlueColor);
    background: var(--trackrHeaderColor);
    position:relative;
}
.mainContentHolder .tasksTotals .hoursTotal{
    color: #fff;
    font-size: 28px;
    position: absolute;
    right: 0px;
    width: 65px;
    text-align: center;
}



/* toolTip */
.taskStatusToolTip{
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: 15;
    background: #fff;
    border-radius: 4px;
    padding: 15px;
    border:2px solid black;
}
.taskStatusToolTip .progressionHolder{


}
.taskStatusToolTip .progressionHolder .statusCircle{
    height: 15px;
    width: 15px;
    background: #d6d6d6;
    border-radius: 10px;
    float: left;
}
.taskStatusToolTip .progressionHolder .statusCircle.InProgress{
    background:#f9b334;
}
.taskStatusToolTip .progressionHolder .statusCircle.Complete{
    background:#4dbf34;
}
.taskStatusToolTip .progressionHolder .statusCircle{
    
}
.taskStatusToolTip .progressionHolder .currentStatus{
    margin-right:5px;
}
.taskStatusToolTip .progressionHolder .arrow{
    float:left;
    position:relative;
    margin-right:7px;
    top:3px;
}
.taskStatusToolTip .progressionHolder .futureStatus{
    
}


.deliverableTypePopup{
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    z-index: 20;
}
.deliverableTypePopup .background{
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background: #000;
    opacity: 0.3;
}
.deliverableTypePopup .content{
    position: absolute;
    background: #fff;
    border: 2px solid #000;
    border-radius: 4px;
    overflow: hidden;
}
.deliverableTypePopup .content .deliverableTypeBtn{
   line-height: 50px;
    border-bottom: 1px solid #000;
    overflow: auto;
    padding: 0px 10px;
    position: relative;
    cursor: pointer;
}
.deliverableTypePopup .content .deliverableTypeBtn:hover .label{
    color: var(--trackrDarkBlueColor);
}

.deliverableTypePopup .content .deliverableTypeBtn.softInternal{
    background: #fff;
    color: #000;
}
.deliverableTypePopup .content .deliverableTypeBtn.hardInternal{
    background: #bfbfbf;
    color: #fff;
}
.deliverableTypePopup .content .deliverableTypeBtn.external{
    background: #5a5a5a;
    color: #fff;
}
.deliverableTypePopup .content .deliverableTypeBtn i{
    position: absolute;
    width: 35px;
    height: 99%;
    text-align: center;
    line-height: 39px;
    left: 0px;
    /*border-right: 1px solid #000;*/
    line-height: 50px;
}
.deliverableTypePopup .content .deliverableTypeBtn.softInternal i{
    color: gray;
}
.deliverableTypePopup .content .deliverableTypeBtn .label{
    margin-left: 35px;
}