/* animated smooth transition style */
.fadeout {
    opacity: 0;
    transition: opacity 100ms ease-out;
}
.fadein {
    opacity: 1;
    transition: opacity 50ms ease-in;
}

/* small numbers style */
input[type=number] {
    width: 5em;
    text-align: right;
}

/* highlighting input-group instead of individual inputs */
.input-group {
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}
.input-group:focus-within {
    border-color: #86b7fe;
    box-shadow: 0 0 0 .25rem rgba(13, 110, 253, .25);
}
.input-group input:focus {
    box-shadow: none;
}