html {
height: 100%;
}

body {
margin: 0;
background-color: grey;
display: flex;
flex-direction: column;
align-items: center;
min-height: 100%;
justify-content: center;
}

.mainContainer {
    display: flex;
    align-items: center;
    flex-grow: 1;
}

.fieldsetForm {
    border: none;
}

.formList {
    border-radius: 25px;
    margin: 0;
    max-width: 400px;
    padding: 20px;
    display: flex;
    flex-direction: column;
    align-items: end;
    background-color: antiquewhite;
}

.formItem {
    margin-bottom: 20px;
    list-style: none;
}

.formItem:last-child{
    margin: 0
};

.labelForm {
    margin-right: 10px;
}

.buttonItem {
    align-self: center;
}

.buttonForm {
    cursor: pointer;
}

.outputValue {
    margin: 0;
}

input::-webkit-outer-spin-button,
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 */
}

input[type='number'] {
    -moz-appearance: textfield;
}
