.taskCard-popup > .modal-dialog {
    width: 600px;
}

    .taskCard-popup > .modal-dialog > .modal-content {
        width: 600px;
        border: none;
    }

.taskCard-popup .header {
    height: 46px;
    border-bottom: 1px solid #e0e0e0;
    padding-top: 15px;
    padding-left: 20px;
}

    .taskCard-popup .header .taskIcon {
        position: relative;
        top: -1px;
    }

    .taskCard-popup .header .heading {
        display: inline-block;
        color: #4a4a4a;
        font-family: GlowSemibold;
        font-size: 14px;
        margin-left: 1px;
        margin-top: 1px;
    }

.taskCard-popup .mainContent {

}

    .taskCard-popup .mainContent .scrollableContainer {
        height: 100%;
        max-height: 80vh;
        position: relative;
        padding: 0 20px 20px 20px;
    }

    .taskCard-popup .mainContent .topBlur {
        position: absolute;
        height: 12px;
        width: 100%;
        pointer-events: none;
        /* Go from completely solid white on the top to completely transparent on the bottom */
        background-image: linear-gradient(rgba(255, 255, 255, 1) 10%, rgba(255, 255, 255, 0) 100%);
        top: 46px;
    }

    .taskCard-popup .mainContent .bottomBlur {
        position: absolute;
        height: 12px;
        width: 100%;
        pointer-events: none;
        /* Go from completely transparent on the top to completely solid white on the bottom */
        background-image: linear-gradient(rgba(255, 255, 255, 0) 10%, rgba(255, 255, 255, 1) 100%);
        bottom: 74px;
    }

    .taskCard-popup .mainContent .scrollableContainer .itemLabel {
        font-family: GlowRegular;
        font-size: 14px;
        color: #B6B6B6;
        margin-top: 10px;
        margin-bottom: 2px;
    }

    /*Tags section*/
    .taskCard-popup .mainContent .scrollableContainer .itemTags {
        position: relative;
        margin-top: 10px;
    }
    /*Tags section end*/

    .taskCard-popup .mainContent .scrollableContainer .summaryStep {
        margin-bottom: 10px;
    }

    .taskCard-popup .mainContent .scrollableContainer .itemLabel.taskName {
        margin-top: 10px;
    }

    .taskCard-popup .mainContent .scrollableContainer input.ui-input-bordered {
        padding-left: 10px;
        width: 100%;
    }

    .taskCard-popup .mainContent .scrollableContainer .relationsDropdownMultiselect .clear-input {
        top: 10px;
    }

    /* Project Dropdown */
    .taskCard-popup .mainContent .scrollableContainer .projectDropdown {
        width: 100%;
        margin-top: 3px;
        cursor: pointer;
        height: 28px;
        display: block;
    }

        .taskCard-popup .mainContent .scrollableContainer .projectDropdown > .dropdown-multiselect {
            width: 100%;
        }

            .taskCard-popup .mainContent .scrollableContainer .projectDropdown > .dropdown-multiselect > input.dropdown-header {
                padding-left: 10px;
                border-radius: 4px;
                height: 28px;
            }
            /* Cross icon at the right of filled input */
            .taskCard-popup .mainContent .scrollableContainer .projectDropdown > .dropdown-multiselect > div.clear-input {
                top: 9px;
            }

    /* Assignment Section */
    .taskCard-popup .mainContent .scrollableContainer .assignmentSection {
        position: relative;
        border: 1px solid #f4f5fc;
        border-radius: 4px;
        background-color: #FBFBFB;
        padding: 9px 19px 19px 19px;
        margin-top: 10px;
    }

        .taskCard-popup .mainContent .scrollableContainer .assignmentSection .trashIcon {
            position: absolute;
            right: 21px;
            top: 11px;
            width: 12px;
            height: 12px;
            background-image: url('/images/shared/delete_blue.png');
            cursor: pointer;
        }

            .taskCard-popup .mainContent .scrollableContainer .assignmentSection .trashIcon:hover {
                background-image: url('/images/shared/delete_hover.png');
            }

        .taskCard-popup .mainContent .scrollableContainer .assignmentSection .assigneeDropdown {
            height: 28px;
            width: 100%;
            display: block;
            margin-top: 3px;
        }

        .taskCard-popup .mainContent .scrollableContainer .assignmentSection .assignmentInfo {
            display: flex;
        }

        .taskCard-popup .mainContent .scrollableContainer .assignmentSection .totalWorkContainer {
            flex: 1 1 auto;
        }

            .taskCard-popup .mainContent .scrollableContainer .assignmentSection .totalWorkContainer input {
                width: 100%;
            }

        .taskCard-popup .mainContent .scrollableContainer .assignmentSection .assignmentUnitsContainer {
            flex: 1 1 auto;
        }

            .taskCard-popup .mainContent .scrollableContainer .assignmentSection .assignmentUnitsContainer input {
                width: 100%;
            }

        .taskCard-popup .mainContent .scrollableContainer .assignmentSection .totalBaselineContainer {
            flex: 1 1 auto;
        }

            .taskCard-popup .mainContent .scrollableContainer .assignmentSection .totalBaselineContainer input {
                width: 100%;
            }

        .taskCard-popup .mainContent .scrollableContainer .assignmentSection .spacer {
            flex: 0 0 15px;
        }

    .taskCard-popup .mainContent .scrollableContainer .addAssigneeContainer {
        width: 115px;
        /* Align horizontally */
        margin: 0 auto;
        margin-top: 7px;
    }

    .taskCard-popup .mainContent .scrollableContainer .addAssigneeIcon {
        cursor: pointer;
    }

    .taskCard-popup .mainContent .scrollableContainer .addAssigneeLabel {
        display: inline;
    }

    .taskCard-popup .mainContent .scrollableContainer .linkedTaskDropdown {
        width: 100%;
        margin-top: 3px;
        cursor: pointer;
        height: 28px;
    }

        .taskCard-popup .mainContent .scrollableContainer .linkedTaskDropdown > .dropdown-multiselect {
            width: 100%;
        }

            .taskCard-popup .mainContent .scrollableContainer .linkedTaskDropdown > .dropdown-multiselect > input.dropdown-header {
                padding-left: 10px;
                border-radius: 4px;
                height: 28px;
            }
            /* Cross icon at the right of filled input */
            .taskCard-popup .mainContent .scrollableContainer .linkedTaskDropdown > .dropdown-multiselect > div.clear-input {
                top: 9px;
            }

    .taskCard-popup .mainContent .scrollableContainer .notesArea {
        width: 100%;
        height: 110px;
        resize: none;
        margin-top: 2px;
        padding: 10px;
    }

.taskCard-popup .footer {
    padding: 20px 20px 16px 20px;
    height: 74px;
    border-top: 1px solid #e0e0e0;
}

    .taskCard-popup .footer .checkboxContainer {
        display: inline-block;
        padding-top: 10px;
    }

    .taskCard-popup .footer .ui-checkbox {
        margin-right: 2px;
        vertical-align: middle;
    }

    .taskCard-popup .footer .checkboxContainer .checkBoxTitle {
        cursor: pointer;
        display: inline-block;
        font-family: GlowRegular;
        font-size: 14px;
        color: #4a4a4a;
        -webkit-user-select: none; /* Chrome all / Safari all */
        -moz-user-select: none; /* Firefox all */
        -ms-user-select: none; /* IE 10+ */
        user-select: none; /* Likely future */
    }

    .taskCard-popup .footer .ui-btn-grey {
        height: 38px;
        width: 104px;
    }

    .taskCard-popup .footer .ui-btn-light {
        width: 131px;
    }

    .taskCard-popup .footer .loadingSpinnerContainer {
        position: absolute;
        top: 10px;
        right: 20px;
    }

.taskCard-popup [hidden] {
    display: none !important;
}

.taskCard-popup .mainContent .teams.stepComponent {
    padding: 0;
    margin-top: 6px;
}
 
.taskCard-popup .mainContent .teams.stepComponent .teamName-wrapper {
    width: fit-content;
}

.taskCard-popup .mainContent .teams.stepComponent .teamName-wrapper .teamName-icon {
    margin-bottom: 1px;
}

.taskCard-popup .mainContent .teams.stepComponent .add-new-team__content {
    column-gap: 5px;
}

.taskCard-popup .mainContent .scrollableContainer .taskSkills,
.taskCard-popup .mainContent .scrollableContainer .taskAttributes {
    margin-bottom: 10px;
}

.taskCard-popup .mainContent .scrollableContainer .resizableTextArea {
    margin: 3px 0px 5px 0px;
}