@charset "UTF-8"; .spinnerUi { position: relative; display: inline-block; height: 40px; outline: none; uesr-select: none; } .spinnerUi > * { vertical-align: top; } .spinnerUi-control { position: relative; display: inline-block; width: 40px; height: 100%; } .spinnerUi-control:after { position: absolute; top: 50%; width: 100%; height: 2px; margin-top: -1px; content: ""; background-color: rgba(0, 0, 0, 0); } .spinnerUi > input[type="text"] { display: inline-block; width: 170px; height: 100%; margin: 0; border: 1px solid #e4eaec; border-radius: 0.215rem 0 0 0.215rem; box-shadow: none; } .spinnerUi > input[type="text"]:hover { border-color: #e4eaec; } .spinnerUi > input[type="text"]:focus { border-color: #3e8ef7; box-shadow: none; } .spinnerUi-down, .spinnerUi-up { position: relative; display: block; height: 50%; font-family: "Web Icons"; font-size: 20px; font-style: normal; font-weight: normal; line-height: 1; color: #a3afb7; text-align: center; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .spinnerUi-up { background-color: #f3f7f9; border-top: 1px solid #e4eaec; border-right: 1px solid #e4eaec; border-radius: 0 0.215rem 0 0; } .spinnerUi-up:before { content: ""; } .spinnerUi-down { background-color: #f3f7f9; border-right: 1px solid #e4eaec; border-bottom: 1px solid #e4eaec; border-radius: 0 0 0.215rem 0; } .spinnerUi-down:before { content: ""; } .spinnerUi:hover input { color: #76838f; } .spinnerUi:hover .spinnerUi-down, .spinnerUi:hover .spinnerUi-up { background-color: #e4eaec; } .spinnerUi_focus > input[type="text"] { color: #76838f !important; border-color: #3e8ef7 !important; } .spinnerUi_focus .spinnerUi-down, .spinnerUi_focus .spinnerUi-up { color: #fff; background-color: #3e8ef7 !important; border-color: #3e8ef7 !important; } .spinnerUi-down:active, .spinnerUi-up:active { background-color: #247cf0 !important; } .spinnerUi_disabled input, .spinnerUi_disabled:hover input { color: #76838f; background-color: #f3f7f9; } .spinnerUi_disabled input:hover, .spinnerUi_disabled input:focus, .spinnerUi_disabled:hover input:hover, .spinnerUi_disabled:hover input:focus { border-color: #e4eaec; } .spinnerUi_disabled .spinnerUi-down, .spinnerUi_disabled .spinnerUi-up, .spinnerUi_disabled:hover .spinnerUi-down, .spinnerUi_disabled:hover .spinnerUi-up { background-color: #e1e6e8 !important; }