.cursorPointer {
    cursor: pointer;
}

.width100per {
    width: 100%;
}

.height100per {
    height: 100%;
}

.vlignTop {
    vertical-align: top !important;
}

.vlignMiddle {
    vertical-align: middle !important;
}

.vlignBottom {
    vertical-align: bottom !important;
}

.alignLeft {
    text-align: left !important;
}

.alignCenter {
    text-align: center !important;
}

.alignRight {
    text-align: right !important;
}

.noDisplay {
    display: none;
}

.table100100 {
    width: 100%;
    height: 98%;
}

.controlGroup button {
    width: 90px;
    height: 25px;
    border-radius: 3px;
    border: 1px #ced4d8 solid;
    background-color: #eef6ff;
    font-size: 12px;
    font-weight: bold;
    color: #67767e;
    cursor: pointer;
    margin-left: 1px;
    margin-right: 1px;
    background-repeat: no-repeat;
    background-position: 10px 3px;
    padding-left: 22px !important;
    padding-top: 0px !important;
}

[class^="controlButton"] {
    width: 90px;
    height: 25px;
    border-radius: 3px;
    border: 1px #ced4d8 solid;
    background-color: #eef6ff;
    font-size: 12px;
    font-weight: bold;
    color: #67767e;
    cursor: pointer;
    margin-left: 1px;
    margin-right: 1px;
    background-repeat: no-repeat;
    background-position: 10px 3px;
    padding-left: 22px !important;
    padding-top: 1px !important;
}

.controlButtonAdd {
    background-image: url(/img/add.png);
}

.controlButtonDelete {
    background-image: url(/img/delete.png);
}

.controlButtonClear {
    background-image: url(/img/clear.png);
}

.controlButtonRefresh {
    background-image: url(/img/refresh.png);
}

.controlButtonOK {
    background-image: url(/img/confirm.png);
}

.controlButtonDocument {
    background-image: url(/img/document.png);
}

.controlButtonSearch {
    background-image: url(/img/search1.png);
}

.controlButtonShowHide {
    background-image: url(/img/showhide.png);
}

.controlButtonHistory {
    background-image: url(/img/history.png);
}

.controlButtonCalculator {
    background-image: url(/img/calculator.png);
}

.controlButtonPlus {
    background-image: url(/img/plus.png);
}

.controlButtonMinus {
    background-image: url(/img/minus.png);
}

.controlButtonSetting {
    background-image: url(/img/setting.png);
}

[class^="controlButton"]:hover,
.controlGroup button:hover {
    background-color: aliceblue;
    border: 1px #6dadd8 solid;
    color: #2694e8;
}

.controlImg {
    width: 90px;
    height: 90px;
    border: lightgray solid 1px;
}

.controlTable {
    border-collapse: separate !important;
    border-spacing: 2px !important;
}

.controlTableLeft td {
    text-align: left !important;
}

.controlTable td {
    padding: 0px 5px 0px 0px !important;
}

.controlTable td {
    padding: 0px 5px 0px 0px !important;
}

.controlTable tr td:first-child,
.controlTable tr td:last-child {
    padding: 0px 5px 0px 0px !important;
}

.controlTable input[type="text"],
.controlTable input[type="password"] {
    width: 100%;
    padding-left: 3px;
    line-height: 18px;
}

.controlTable select {
    height: 21px;
    width: 100%;
}

.controlImageSearch {
    width: 16px;
    cursor: pointer;
    background-color: transparent;
    border-radius: 0px;
    content: url(/img/search.png);
}

.controlImageAdd {
    width: 16px;
    cursor: pointer;
    background-color: transparent;
    border-radius: 0px;
    content: url(/img/add.png);
}

.controlMenuTitle {
    padding: 6px 2px;
    border-bottom: 0px dotted gray;
    border-top: 0px dotted gray;
    margin: 10px 0px;
    color: black;
    color: rgb(20, 111, 196);
}

.controlMiddleTitle {
    font-size: 12px;
    font-weight: bold;
    border-bottom: 1px dotted rgb(182, 182, 182);
    color: #54595e;
    padding-top: 5px;
    padding-bottom: 5px;
}

/*
remove jquery tab's border and background-color
*/
.ui-widget-content {
    border: none !important;
    background: none !important;
}

/*
remove jquery tab's border and background-color
*/
.ui-tabs .ui-tabs-panel {
    padding: 3;
}

/*
add jquery datepicker's border and background-color
*/
#ui-datepicker-div.ui-widget-content {
    box-shadow: 2px 2px 6px #cfcfcf;
    background: white !important;
}

/* 
jquery ui font size
*/

.select-editable {
    position: relative !important;
    background-color: white !important;
    border: solid grey 1px !important;
    width: 100% !important;
    height: 23px !important;
}
.select-editable select {
    position: absolute !important;
    top: 0px !important;
    left: 0px !important;
    border: none !important;
    width: 100% !important;
    margin: 0 !important;
}
.select-editable input {
    position: absolute !important;
    top: 0px !important;
    left: 0px !important;
    width: 80% !important;
    padding-left: 4px !important;
    padding-top: 1px !important;
    border: none !important;
}
.select-editable select:focus,
.select-editable input:focus {
    outline: none !important;
}
