.number-input-with-buttons{display:flex;align-items:center}.number-input-with-buttons .inputs{display:flex;flex-direction:row;width:125px;height:30px;margin-right:1rem}.number-input-with-buttons .inputs button,.number-input-with-buttons .inputs input{width:100%;height:100%;display:block;border:1px solid #ccc;outline:0}.number-input-with-buttons .inputs button{width:32px;position:relative;cursor:pointer;line-height:30px;text-align:center}.number-input-with-buttons .inputs button i{line-height:27px;font-size:18px;font-weight:700;position:absolute;left:calc(50% - 9px);top:1px;margin-top:0}.number-input-with-buttons .inputs button.decrement{border-right:0}.number-input-with-buttons .inputs button.increment{border-left:0}.number-input-with-buttons .inputs input.value{flex:1;-moz-appearance:textfield}.number-input-with-buttons .inputs input.value::-webkit-inner-spin-button,.number-input-with-buttons .inputs input.value::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.number-input-with-buttons .inputs input.value{text-align:center;padding:4px}.number-input-with-buttons.invalid .inputs input.value{border-color:red;color:red}.number-input-with-buttons .validation-messages-container{visibility:hidden;color:red;line-height:normal}.number-input-with-buttons.invalid .validation-messages-container{visibility:visible;font-size:14px}.number-input-with-buttons .validation-messages-container>*{display:none}