/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : 08/02/2018, 11:12:00 AM
    Author     : jzhu
*/

body {
    font-size: 14px;
}

.tableDiv {
    padding: 1em;
}

.inactiveTr{
    color:red;
}
.first {
    float: left;
}

.item_notes_span {
    color:red;
}

.table {
    position: relative;
    padding: 1em;
    border: 1px solid #DDD;
    box-shadow: 0 15px 10px -10px rgba(31, 31, 31, 0.5);
}

.table__cell {
    vertical-align: top;
    padding: 3px 5px;
    text-align: center;
    padding-top: 25px;
}

.table__cell2 {
    vertical-align:middle !important;
    padding: 3px 5px;
    text-align: center !important;
}

th {
    text-align: center !important;
}
.text-field {
    margin: 0;
    padding: .45em 0.92em;
    font-size: 1em;
    line-height: 1.4;
    color: #555555;
    background-color: #FFF;
    background-image: none;
    border: 1px solid #CCC;
    border-left: 1px solid #CCC;
    text-align: center;
}

.table__add-row {
    margin-top: 0;
    position: relative;
    border-top: 1px solid #EEE;
}

.table__add-row-btn {
    display: block;
    cursor: pointer;
    position: absolute;
    right: 60px;
    left: 0;
    width: 4em;
    margin: 0 auto;
    -webkit-transition: all .2s easy-in;
    transition: all .2s easy-in;
    text-align: center;
    opacity: 0.5;
    color: #fff;
    border: 1px solid #16A085;
    border-bottom-right-radius: 1em;
    border-bottom-left-radius: 1em;
    background: #16A085;
    height: 1.5em;
    line-height: 1.5em;
}

.table__add-row-btn2 {
    display: block;
    cursor: pointer;
    position: absolute;
    right: 60px;
    left: 0;
    width: 4em;
    margin: 0 auto;
    -webkit-transition: all .2s easy-in;
    transition: all .2s easy-in;
    text-align: center;
    opacity: 0.5;
    color: #fff;
    border: 1px solid #16A085;
    border-bottom-right-radius: 1em;
    border-bottom-left-radius: 1em;
    background: #16A085;
    height: 1.5em;
    line-height: 1.5em;
}

.table__add-row-btn-10 {
    display: block;
    cursor: pointer;
    position: absolute;
    right: 0;
    left: 60px;
    width: 4em;
    margin: 0 auto;
    -webkit-transition: all .2s easy-in;
    transition: all .2s easy-in;
    text-align: center;
    opacity: 0.5;
    color: #fff;
    border: 1px solid #16A085;
    border-bottom-right-radius: 1em;
    border-bottom-left-radius: 1em;
    background: #16A085;
    height: 1.5em;
    line-height: 1.5em;
}

.table__add-row-btn:hover {
    opacity: 1;
}
.table__add-row-btn-10:hover {
    opacity: 1;
}

.table__del-row-btn,
.table__notes-row-btn,
.table__new-row-btn {
    cursor: pointer;
    display: inline-block;
    padding: .45em 0.92em;
    font-size: 1em;
    line-height: 1.4;
    border: 1px solid #F39C12;
    color: #F39C12;
    text-decoration: none;
    transition: all .3s;
    text-align: center;
    background-color: #fff;
}

.table__del-row-btn:hover,
.table__notes-row-btn:hover,
.table__new-row-btn:hover {
    background: #F39C12;
    color: #fff;
}

.drag-handler {
    width: 1.4em;
    position: relative;
    background-color: #E4E6EB;
    background-image: linear-gradient(45deg, #E4E6EB, #E4E6EB 2px, #fff 2px, #fff 4px, #E4E6EB 4px, #E4E6EB 9px, #fff 9px, #fff 11px, #E4E6EB 11px, #E4E6EB 16px, #fff 16px, #fff 18px, #E4E6EB 18px, #E4E6EB 22px);
    background-size: 10px 20px;
    cursor: move;
    border-top: 2px solid #FFF;
    border-bottom: 2px solid #FFF;
}

.drag-handler:active {
    background-image: linear-gradient(45deg, #bab86c, #bab86c 2px, #fff 2px, #fff 4px, #bab86c 4px, #bab86c 9px, #fff 9px, #fff 11px, #bab86c 11px, #bab86c 16px, #fff 16px, #fff 18px, #bab86c 18px, #bab86c 22px);
    background-size: 10px 20px;
}