/* input Control*/
.inputContainer {
    display: inline;
}

.inputControl {
    padding: 0;
    min-width:20px;
    height:27px;
    color:#686b72;
    font-size:12px;
    border:1px solid #dde0e5;
    text-indent:10px;
    border-radius:4px;
    background: url('../media/img/input_text_bg.jpg') 0 0 repeat-x;
    text-overflow: ellipsis;
}

.inputControlmonitoring {
    padding: 0;
    min-width:20px;
    height:27px;
    color:#686b72;
    font-size:13px;
    border:1px solid #dde0e5;
    text-indent:10px;
    border-radius:4px;
    background: url('../media/img/input_text_bg.jpg') 0 0 repeat-x;
    text-overflow: ellipsis;
	font-family: Arial;
}

.inputControl:disabled {
    cursor: default;
    background: #efefef;
    border: 1px solid #dadada;
    color: #c7c7c7;
}

.inputControl:focus {
    border: 1px solid #7cb2f8;
}

/* double input Control*/

.dblInputControl {
    border: 1px solid #B0B0B0;
    border-radius: 3px 3px 3px 3px;
    font-size: 12px;
    height: 20px;
    padding: 2px;
    text-indent: 5px;
    width: 99px;
}

.dblInputDivider {
    display: inline-block;
    width: 10px;
    text-align: center;
    color: #555555;
}

/* spinner */

.spinner {
    position:relative;
    padding:2px 15px 2px 2px;
    height: 23px;
    border:1px #dde0e5 solid;
    margin:0px;
    width: 40px;
    border-radius: 4px;
    overflow: hidden;
    display: inline-block;
    background: url('../media/img/input_text_bg.jpg') 0 0 repeat-x;
}
.spinner input {
    height: inherit;
    border:0 none;
    margin:0;
    padding:0;
    text-align:center;
    width:100%;
    text-indent: 0;
}
.spinner .arrowsContainer {
    position: absolute;
    top:0;
    right:0;
    height:29px;
    width:11px;
    border-left:1px #ABADB3 solid;
    background-color: #D8D8D8;
}

.spinner .arrowsContainer .up,
.spinner .arrowsContainer .down {
    width:11px;
    height:12px;
    cursor: pointer;
    background-color: #fff;
}
.spinner .arrowsContainer:not( .disabled ) .up:hover {
    background: url("../media/img/arrow_over_up.png") right center no-repeat;
}
.spinner .arrowsContainer:not( .disabled ) .down:hover {
    background: url("../media/img/arrow_over_down.png") right center no-repeat;
}
.spinner .arrowsContainer .up {
    background: url("../media/img/arrow_up.png") right center no-repeat;
}
.spinner .arrowsContainer .down {
    background: url("../media/img/arrow_down.png") right center no-repeat;
}

.spinner .arrowsContainer.disabled div,
.spinner .arrowsContainer.disabled div:hover {
    opacity: 0.4;
    cursor: auto;
}