body { background-color: lightpink; font-family: "Arial, Helvetica, sans-serif"; } div { width: 100%; display: inline-block; } /* Inputs */ input, button { margin: 5px; height: 4vh; width: 20vw; border-radius: 1vh; border-color: darkviolet; padding: 3px 10px 3px; } select { height: 3vh; width: 100px; border-radius: 1vh; border-width: 2px; border-color: darkviolet; padding: 3px 10px 3px; } datalist { /* display: flex; display: block; position: relative; */ } option { border-color: darkviolet; } input[type="text"] { border-radius: 1vh; } input[type="number"] { width: 3vw; } input[type="date"] { width: 8vw; } input[type="checkbox"] { -moz-appearance:none; -webkit-appearance:none; -o-appearance:none; outline: none; content: none; width: 50px; } input[type="checkbox"]:before { width: 30px; height: 30px; content: '✓'; font-size: 20px; font-style: bold; text-align: center; border-radius: 5px; border: 2px solid darkviolet; background-color: white; color: transparent; display: inline-block; margin-top: 0px; margin-bottom: 20px; } input[type="checkbox"]:checked:before { color: black; } /* Labels */ label { margin: 5px; } .div_title { font-size: 24px; } .input_title { font-size: 20px; } .input_subtitle { font-size: 18px; } .errmsg { display: none; visibility: hidden; } /* table */ .div_label_input { margin: auto; width: 100%; display: flex; flex-wrap: wrap; justify-content: center; } .input_label { box-sizing: border-box; flex: 1; margin: 1rem; padding: 1rem; border-radius: 5px; width: 100%; } .input_label.label_title { margin: 0; padding: 0; font-size: 20px; } .tbl_container { display: flex; flex-wrap: flex; justify-content: center; } label.input_label { padding-left: 5% !important; padding-right: 5% !important; } .column { align-items: center; flex: 1; display: flex; flex-direction: column; }