.form {
    width: 300px;
    margin: 20px;
}

.main-div {
    width: 100%;
    margin-top: 10px;
}

.header {
    display: flex;
    font-family: "Inter", sans-serif;
    font-weight: 600;
    font-size: 25px;
    padding-bottom: 10px;
    align-items: center;
}

.leftJustifyHeader {
    position: absolute;
    left: 1.25%;
    /*display: flex;*/
    /*float: left;*/
}

.taskFormGridHeader {
    display: flex;
    justify-content: center;
    padding-bottom: 2vh;
    padding-top: 2vh;
    font-family: "Inter", sans-serif;
    font-weight: 600;
    font-size: 3vh;
}

.label-div {
    display: flex;
    justify-content: flex-start;
    width: 100%;
}

.defaultLabel {
    color: #6e6893;
    font-family: "Inter", sans-serif;
    font-weight: 600;
    font-size: 16px;
}

.response-div {
    display: flex;
    justify-content: flex-start;
    width: 100%;
}

.defaultInput,
.defaultSelect {
    border-radius: 6px;
    border: 1px solid #ddd;
    height: 2rem;
    font-size: 16px;
    padding: 5px 4px 3px 4px;
    background: #fff;
    color: #272727;
    font-family: "Roboto Condensed", "Roboto", Helvetica, Arial, Lucida, sans-serif;
    box-sizing: border-box;
    box-shadow: none !important;
}

input[type="datetime-local"] {
    -webkit-appearance: none;
}

span.defaultInput:empty::before {
    content: attr(placeholder);
    color: #ccc;
    pointer-events: none;
}

.defaultCheckbox {
    scale: 1.25;
}

.checkboxContainer {
    margin-bottom: 25px;
}

.defaultSelect[disabled] {
    pointer-events: none;
    background-color: #9b9b9b9b;
}

.defaultInput:focus,
.defaultSelect:focus {
    border: 1px solid #082222;
}

.swal2-container .textEditorContainer,
.swal2-container .defaultInput,
.swal2-container .defaultSelect {
    width: 100%;
}

.button-div {
    display: flex;
    justify-content: center;
    padding-top: 3vh;
    margin-left: 5%;
    float: left;
}

.button-div-center {
    display: flex;
    justify-content: center;
    padding-top: 3vh;
}

.button-label-div-form {
    padding-left: 10%;
    padding-right: 10%;
}

.button-div .button {
    padding-left: 2vh;
    padding-right: 2vh;
    margin: 0;
    font-size: 16px;
}

.button-div .button + .button {
    margin: 0 2%;
}

#cancelBtn {
    background-color: #FFFFFF;
    color: #082222;
    border-radius: 6px;
    border: 1px solid #082222;
}

#editForm {
    width: 40%;
    padding-right: 10%;
    /*border-right: 1px solid #082222;*/
    margin-left: 5%;
    max-width: 500px;
}

#editForm.small-form {
    width: 30%;
    margin: auto;
    border: none;
    padding: 0;
    max-width: 300px;
}

.swal2-container #editForm {
    width: 100%;
    border: none;
    padding: 0;
}

#taskEditFormGridsContainer {
    width: 40%;
    padding-left: 10%;
}

.swal2-container #taskEditFormGridsContainer {
    display: none;
}

@media(max-width: 800px) {
    .main-div {
        box-sizing: border-box;
        padding: 0 16px;
    }

    .mainArea {
        overflow: hidden;
    }

    #editForm {
        border: none;
        width: 100%;
        margin: 0;
    }

    #taskEditFormGridsContainer {
        width: 100%;
        padding: 0;
    }
}