#container {
    width: 100%;
    height: 100%;
}

    #container p {
        text-align: left;
    }

    #container #area-drag .computer .ComputerOffInfo {
        width: 100%;
        height: 70px;
        background: #9f3327;
        border-bottom: #880303 1px solid;
    }

    #container #area-drag .computer .computer-info img {
        width: 50px;
        float: right;
        margin-top: -60px;
    }


    #container #area-drag #formConfirm {
        display: block;
        background: #012854;
        color: #fff;
        float: left;
        padding: 10px;
        margin-left: 38%;
        position: absolute;
        margin-top: 10%;
        z-index: 19;
    }

        #container #area-drag #formConfirm p {
            color: #fff;
        }

        #container #area-drag #formConfirm #txtPasswordConfirm {
            margin-top: 10px;
        }

        #container #area-drag #formConfirm a {
            float: left;
            padding: 5px;
            background: #056801;
            color: #fff;
            border-radius: 3px;
            margin: 10px 2px 0px 13px;
        }

    #container #area-drag .computer .list-apps {
        position: relative;
    }

        #container #area-drag .computer .list-apps .app {
            display: block;
            overflow: hidden;
        }

            #container #area-drag .computer .list-apps .app .app-info {
                /* position: relative; */
            }

.appComOff {
    background: #b12e24 !important;
    border: 1px solid #801d14 !important;
}


.cpu-app {
    margin-left: 69px;
}

.ram-app {
    margin-left: 67px;
}

.popupError {
    width: 50%;
    position: absolute;
    margin-left: 25%;
    height: 88px;
    color: #fff;
    z-index: 11;
    background: #4a4a4a;
    border: 1px solid #727282;
    padding: 10px;
    border-radius: 4px;
    margin-top: 76px;
}

.appOff {
    background: #b12e24 !important;
    border: solid 1px #801d14 !important;
}

.hide-show {
    display: block !important;
}

.listAppOff {
    background: #b83f34 !important;
    border-top: 1px solid #cd3f33 !important;
    width: 100%;
    height: 100%;
}

.sttWarning {
    background: #cf6900 !important;
    cursor: pointer;
}

.sttOff {
    background: #c42b1d !important;
}

.ckControl {
    display: none;
}

.block {
    display: none;
}

.active {
    display: block !important;
}



#images {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    border: 1px solid #00ff21;
    background-color: #00ff21;
}

#state, #images {
    display: inline-block;
}

#states, #images1 {
    display: inline-block;
}

#state, #states {
    color: white;
    text-align: left;
    padding: 7px 7px 7px 7px;
}

#images1 {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    border: 1px solid #fc0000;
    background-color: #fc0000;
}

.pOff {
    color: #deb5b3 !important;
}



/**********
*   VTD - style home page
**********/

/** khung **/
.divMainTbl {
    display: flex;
    flex-wrap: wrap;
    margin: 0 -8px;
}

.divWrapBox {
    width: 33.33%;
    max-width: 510px;
    min-width: 430px;
    padding: 0 8px;
}

.divContentBox {
    background: #232639;
    box-shadow: 0 0 20px rgba(0,0,0,0.3);
    border-radius: 5px;
    min-height: 110px;
    display: flex;
    padding: 20px 30px;
    margin: 10px 0 30px;
}

.divMainTop .divWrapBox:nth-child(2) .divContentBox > div {
    padding-top: 20px;
}

.divContentBox > div {
    width: 33.33%;
}

.tbl_db_Conn .divContentBox .mainConn {
    width: 50%;
    position: relative;
    padding: 20px 10px 0 85px;
}

    .tbl_db_Conn .divContentBox .mainConn img {
        position: absolute;
        width: 70px;
        top: 0;
        left: 0;
    }


/** font **/
.divMainTbl, .conn {
    color: #55d24a;
}

.lblTitle, .lbl, .divMainTbl {
    font-weight: bold;
}

.lbl {
    color: #4e5b87;
    margin-bottom: 8px;
}

.lblTitle {
    color: #7c98fb;
    font-size: 14px;
}

h3.lblTitle {
    font-size: 18px;
    margin-bottom: 10px;
}

.notConn {
    color: #d13447;
}

.lbl-name {
    text-transform: uppercase;
    margin-bottom: 5px;
}

.lbl-order {
    padding-top: 7px;
    color: #a5b9ff;
}

.lbl-order-detail {
    padding-top: 7px;
    margin-left: 10px;
    color: #a5b9ff;
    font-weight: normal;
}

    .lbl-order-detail:before {
        content: '- ';
    }

.mainDivRefresh {
    display: flex;
    justify-content: flex-end;
    position: fixed;
    top: 10px;
    right: 230px;
    overflow: hidden;
}

.divRefresh {
    display: flex;
    position: relative;
    margin-right: -180px;
    transition: 0.2s;
}

    .divRefresh .btn div img {
        position: absolute;
        left: 0;
        top: 0;
        width: 20px;
    }

    .divRefresh .btn span {
        position: absolute;
        left: 3px;
        top: 2px;
    }

.divRefreshBtn {
    /*     margin-right: 20px; */
}

.divDropRefresh {
    padding: 10px;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}

    .divDropRefresh:before {
        content: '';
        border-right: 5px solid #fff;
        border-top: 4px solid transparent;
        border-bottom: 4px solid transparent;
    }

.divDropRefreshActive:before {
    border-right: none;
    border-left: 5px solid #fff;
}


.divRefreshBtn .btn {
    position: relative;
    background: #2c3145;
    min-width: auto;
    padding: 5px 10px;
}

.divRefreshBtn .divRefeshBtnActive {
    background: #7a98f8;
}


.divRefreshBtn div {
    position: absolute;
    width: 20px;
    height: 20px;
    top: 8px;
    left: 10px;
}

.divRefreshInput {
    overflow: hidden;
    border-radius: 2px;
    height: 35px;
    width: 180px;
    padding: 4px 0;
    transition: 0.2s;
}

.divRefreshActive {
    margin-right: 0;
}

#txtTimeUpdate {
    width: 10px;
    font-family: Helvetica,Arial, Verdana,sans-serif;
    font-weight: normal;
    font-size: 10px;
}

.divRefreshInput > label > .checkmark-refresh {
    position: absolute;
    top: 0;
    left: 0;
    height: 15px;
    width: 15px;
    border: 1px solid #7a98f8;
}

.divRefreshInput label:hover input ~ .checkmark-refresh {
    background-color: #7a98f8;
}

.divRefreshInput label input:checked ~ .checkmark-refresh {
    background-color: #7a98f8;
}

.checkmark-refresh:after {
    content: "";
    position: absolute;
    display: none;
}

.divRefreshInput label input:checked ~ .checkmark-refresh:after {
    display: block;
}

.divRefreshInput label .checkmark-refresh:after {
    left: 3px;
    top: -2px;
    width: 5px;
    height: 10px;
    border: solid white;
    border-width: 0 2px 2px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

.divRefreshInput label {
    padding-left: 20px;
    padding-right: 10px;
    position: relative;
}
/*-------màu placehoder---------*/
input::placeholder {
    color: #4e5b87;
}

input:-ms-input-placeholder {
    color: #4e5b87;
}

input::-ms-input-placeholder {
    color: #4e5b87;
}



/*******
*   style màu cho dòng buy và sell
********/
.c-sell td {
    color: #c71585;
}

.c-buy td {
    color: #1ad31a;
}

.c-selected td {
    background-color: #232639;
}

.c-cancel td {
    text-decoration: line-through;
}