/* Card CSS for Live Card View of Temperature and Weighing Balance. */
.live-cards-temp-wb-div {
    /*display: inline-grid;*/
    min-width: 275px;
    min-height: 226px;
    word-wrap: break-word;
    padding-top: 10px;
    padding-bottom: 2px;
    padding-left: 10px;
}

    .live-cards-temp-wb-div .card {
        background-color: rgba(255, 255, 255, 1);
        border: 1px solid rgba(111, 115, 213, 1);
        border-radius: 10px;
    }

        .live-cards-temp-wb-div .card .card-header {
            min-height: 3rem;
            color: rgba(111, 115, 213, 1);
            border-radius: 10px 10px 0px 0px;
            background-color: rgba(111, 115, 213, 0.1);
            border-bottom: 1px solid rgba(0,0,0,.125);
        }

/* Card CSS for Live Card View of Stirrer. */
.live-cards-stir-div {
    display: inline-grid;
    min-width: 460px;
    min-height: 226px;
    word-wrap: break-word;
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 10px;
}

    .live-cards-stir-div .card {
        background-color: rgba(255, 255, 255, 1);
        border: 1px solid rgba(111, 115, 213, 1);
        border-radius: 10px;
    }

        .live-cards-stir-div .card .card-header {
            min-height: 3rem;
            color: rgba(111, 115, 213, 1);
            border-radius: 10px 10px 0px 0px;
            background-color: rgba(111, 115, 213, 0.1);
            border-bottom: 1px solid rgba(0,0,0,.125);
        }

/* Card CSS for Live Card View of Stirrer. */
.live-cards-vac-div {
    width: auto;
    min-width: 560px;
    min-height: 226px;
    word-wrap: break-word;
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 10px;
}

    .live-cards-vac-div .card {
        background-color: rgba(255, 255, 255, 1);
        border: 1px solid rgba(111, 115, 213, 1);
        border-radius: 10px;
    }

        .live-cards-vac-div .card .card-header {
            min-height: 3rem;
            color: rgba(111, 115, 213, 1);
            border-radius: 10px 10px 0px 0px;
            background-color: rgba(111, 115, 213, 0.1);
            border-bottom: 1px solid rgba(0,0,0,.125);
        }

/* Card CSS for Live Card View of DataLogger. */
.live-cards-data-logger-div {
    /*display: inline-grid;*/
    min-width: 275px;
    min-height: 226px;
    word-wrap: break-word;
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 10px;
}

    .live-cards-data-logger-div .card {
        background-color: rgba(255, 255, 255, 1);
        border: 1px solid rgba(111, 115, 213, 1);
        border-radius: 10px;
    }

        .live-cards-data-logger-div .card .card-header {
            min-height: 3rem;
            color: rgba(111, 115, 213, 1);
            border-radius: 10px 10px 0px 0px;
            background-color: rgba(111, 115, 213, 0.1);
            border-bottom: 1px solid rgba(0,0,0,.125);
        }

/* CSS for action log icon. */
.live-cards-log-icon {
    color: rgba(111, 115, 213, 1);
}

/* Live Card Header Name font. */
.live-cards-name-font {
    font: normal normal bold 16px Open Sans;
}

.live-cards-green-color {
    color: rgba(94, 203, 161, 1);
}

.live-cards-red-color {
    color: rgba(255, 113, 113, 1);
}

.live-cards-black-color {
    color: rgba(5, 12, 66, 1);
}

.live-cards-grey-color {
    color: rgba(193, 193, 193, 1);
}

.live-cards-grey-background-color {
    background: rgba(246, 245, 246, 1) 0% 0% no-repeat padding-box;
}

/* Font for the Status icon of Live Card. */
.live-cards-status-font {
    font: normal normal 600 12px Open Sans;
}

.lightSkyBgColor1 {
    background-color: rgba(111, 115, 213, 0.1);
}

/* Font for the Reading Rate text of Live Card. */
.live-cards-reading-rate-font {
    text-align: center;
    font: normal normal normal 10px Open Sans;
    letter-spacing: 0px;
    color: rgba(5, 12, 66, 1);
    margin-bottom: 0px;
    padding-bottom: 0px;
    padding-top: 0px;
    margin-top: 0px;
}

/* Font for the Reading Rate blinking number of Live Card. */
.live-cards-blink-font {
    font: normal normal bold 14px Open Sans;
    color: rgba(5, 12, 66, 1);
    margin-bottom: 0px;
    padding-bottom: 0px;
    padding-top: 0px;
    margin-top: 0px;
}

/* Font for the Process Value of Live Card for Temperature. */
.live-cards-temp-pv-font {
    font: normal normal bold 22px Open Sans;
    letter-spacing: 0px;
}

/* Font for the Set Value of Live Card for Temperature. */
.live-cards-temp-sv-font {
    font: normal normal bold 22px Open Sans;
    letter-spacing: 0px;
}

/* Font for the placeholder which only shows PV or SV of Live Card. */
.live-cards-placeholder-font {
    font: normal normal bold 12px Open Sans;
}

/* Font for the header for Channel Name of Live Card. */
.live-cards-header-font {
    font: normal normal bold 13px Open Sans;
}

/* Text-Box size for the Temperature SV text-box of Live Card. */
.live-cards-temp-sv-textbox {
    top: 439px;
    left: 947px;
    width: 60px;
    height: 40px;
    border: 1px solid rgba(193, 193, 193, 1);
    border-radius: 5px;
}

/* Vertical Alignment in middle for Live Card. */
.live-cards-vertical-middle {
    vertical-align: middle;
}

/* Live Card Icon size for device status in Card Header. */
.live-cards-status-circle-icon-size {
    transform: scale(0.8, 0.8);
}

/* Font for the Process Value of Live Card for WB. */
.live-cards-wb-pv-font {
    font: normal normal bold 24px Open Sans;
    letter-spacing: 0px;
}

/* Font for the Process Value of Live Card for Stirrer. */
.live-cards-stir-pv-font {
    font: normal normal bold 18px Open Sans;
    letter-spacing: 0px;
}

/* Font for the Set Value of Live Card for Stirrer. */
.live-cards-stir-sv-font {
    font: normal normal bold 18px Open Sans;
    letter-spacing: 0px;
}

/* To center content to image for Live Card. */
.live-cards-center-img-content {
    display: flex;
    flex-direction: column;     /* align flex items vertically */
    justify-content: center;    /* center items vertically */
    align-items: center;        /* center single-line items horizontally */
    align-content: center;      /* center multi-line items horizontally */
}

/* To center content to image for Live Card. */
.live-cards-left-img-content {
    display: flex;
    flex-direction: column; /* align flex items vertically */
    justify-content: flex-start; /* center items vertically */
    align-items: flex-start; /* center single-line items horizontally */
    align-content: flex-start; /* center multi-line items horizontally */
}