/*
This CSS hides spin-box arrows
 */

.nice-number-input {
    display: flex;
    /*align-items: stretch;*/
    border-width: 1px;
    border-style: solid;
}

.nice-number-input input::-webkit-outer-spin-button,
.nice-number-input input::-webkit-inner-spin-button {
    /* display: none; <- Crashes Chrome on hover */
    -webkit-appearance: none;
    margin: 0; /* <-- Apparently some margin are still there even though it's hidden */
}

.nice-number-input input[type=number] {
    -moz-appearance:textfield; /* Firefox */
    /*border: 1px solid #d3d3d3;*/
    border: none!important;
    width: 45px;
    text-align: center;
    font-size: 14px;
}

.nice-number-input .nice-number-input-buttons-container {
    display: flex;
    flex-direction: column;
    align-items: stretch;
}

.nice-number-input button {
    border: unset;
    flex-grow: 1;
    font-size: 28px;
    font-weight: lighter;
    background-color: transparent;
    width: 40px;
}

.nice-number-input button.btn-number-up:hover,
.nice-number-input button.btn-number-down:hover{
    background-color: #eeeeee; !important;
    color: inherit;
}

/*.nice-number-input .nice-number-input-buttons-container button.btn-number-up:hover {*/
/*    background-color: #dddddd;*/
/*}*/

/*.nice-number-input .nice-number-input-buttons-container button.btn-number-down:hover {*/
/*    background-color: #cccccc;*/
/*}*/