﻿.toggle-btn {
    font-size: 52px;
    line-height: 0px;
    height: 10px;
    background: transparent;
    color: #1a79bf;
    outline: none !important;
}

    .toggle-btn:hover {
        background: transparent !important;
    }

    .toggle-btn .fa {
        line-height: 22px;
    }

    .toggle-btn .fa-caret-up {
        display: none;
    }

.active-toggle.toggle-btn .fa-caret-up {
    display: inline-block;
    line-height: 12px !important;
}

.active-toggle.toggle-btn .fa-caret-down {
    display: none;
}

.toggle-show-area {
    background: rgb(159, 231, 209) !important;
    -webkit-box-shadow: 2px 2px 8px 0px rgba(0,0,0,0.32);
    -moz-box-shadow: 2px 2px 8px 0px rgba(0,0,0,0.32);
    box-shadow: 2px 2px 8px 0px rgba(0,0,0,0.32);
    padding: 8px;
}

.toggle-btn {
    font-size: 52px;
    line-height: 0px;
    height: 10px;
    background: transparent;
    color: #1a79bf;
    outline: none !important;
}

    .toggle-btn:hover {
        background: transparent !important;
    }

    .toggle-btn .fa {
        line-height: 22px;
    }

    .toggle-btn .fa-caret-up {
        display: none;
    }

.active-toggle.toggle-btn .fa-caret-up {
    display: inline-block;
    line-height: 12px !important;
}

.active-toggle.toggle-btn .fa-caret-down {
    display: none;
}

.toggle-show-area {
    background: white !important;
    -webkit-box-shadow: 2px 2px 8px 0px rgba(0,0,0,0.32);
    -moz-box-shadow: 2px 2px 8px 0px rgba(0,0,0,0.32);
    box-shadow: 2px 2px 8px 0px rgba(0,0,0,0.32);
    padding: 8px;
}


.viewDetail {
    font-family: var(--font-family);
    border-collapse: collapse;
    width: 100%;
}

    .viewDetail td, .viewDetail th {
        border-bottom: 3px solid white;
        padding: 8px;
        font-size: 13px;
        white-space: nowrap;
        text-align: center;
    }

        .viewDetail td:nth-child(01) {
            position: relative;
            text-align: center;
        }

            .viewDetail td:nth-child(01) div {
                position: absolute;
                left: 17px;
            }

            .viewDetail td:nth-child(01) img {
                height: 20px;
            }

        .viewDetail td:nth-child(02) {
            text-align: left;
        }

        .viewDetail td:nth-last-child(01) img {
            height: 30px;
        }

/* code for drop-down (with checkboxes) for phases on WO */
.multiselectOption .checkbox input {
    width: auto;
    height: auto;
    position: relative;
    top: 1px;
    left: 0;
    opacity: 1;
}

.multiselectOption a:hover {
    text-decoration: none;
}

.multiselectOption .btn-group {
    width: 100%;
}

.multiselectOption .multiselect {
    text-align: left;
}

.multiselectOption .multiselect-container {
    width: 100%;
}

    .multiselectOption .multiselect-container li a {
        display: block;
    }

        .multiselectOption .multiselect-container li a label {
            display: block;
            padding-left: 10px;
        }
