.formRow { width: 100%; display: flex; flex-direction: column; } .formRow-label { font-size: 20px; color: #404040; } .formRow-input > input, .formRow-input > select { margin: 3px; width: 100%; border-radius: 5px; border: none; box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.2); padding: 5px; font-size: 1.4em; -webkit-appearance: none; -moz-appearance: none; appearance: none; } .formRow-input > input:disabled { background-color: #bebebe; color: #4b4b4b; } .formInput[type="date"], .formInput[type="time"] { padding: 5px; font-size: 1.6em; } .formRow-input > select:hover, .formRow-input > input:not([disabled]):hover { background-color: #fbfbfb; } .formButtons { display: flex; flex-direction: row; margin-top: 5px; } .formButtons > button { margin: 5px; width: 50%; padding: 5px; border: none; border-radius: 7px; box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.4); } .formButtons > button:hover { background-color: #dadada; } .formButtons > button:focus { background-color: #d5d5d5; }