ul.flex-form { display: flex; flex-direction: row; justify-content: space-between; flex-wrap: wrap; list-style-type: none; padding-left: 0; } .flex-form input { width: 100%; padding: 0.375rem 0.75rem; font-size: 1rem; line-height: 1.5; color: #495057; background-color: #FFFFFF; background-image: none; background-clip: padding-box; border: 1px solid #ced4da; border-radius: 0.25rem; transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s; } .flex-form input:focus { color: #495057; background-color: #FFFFFF; border-color: #b991cc; outline: none; box-shadow: 0 0 0 0.2rem rgba(125, 70, 152, 0.25); } .flex-form textarea { width: 100%; padding: 0.375rem 0.75rem; font-size: 1rem; line-height: 1.5; color: #495057; background-color: #FFFFFF; background-image: none; background-clip: padding-box; border: 1px solid #ced4da; border-radius: 0.25rem; transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s; } .flex-form textarea:focus { color: #495057; background-color: #FFFFFF; border-color: #b991cc; outline: none; box-shadow: 0 0 0 0.2rem rgba(125, 70, 152, 0.25); } .flex-form input:focus { color: #495057; background-color: #FFFFFF; border-color: #b991cc; outline: none; box-shadow: 0 0 0 0.2rem rgba(125, 70, 152, 0.25); } .flex-form select{ width: 100%; padding: 0.375rem 0.75rem; font-size: 1rem; line-height: 1.5; color: #495057; background-color: #FFFFFF; background-image: none; background-clip: padding-box; border: 1px solid #ced4da; border-radius: 0.25rem; transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s; } .flex-form select:focus { color: #495057; background-color: #FFFFFF; border-color: #b991cc; outline: none; box-shadow: 0 0 0 0.2rem rgba(125, 70, 152, 0.25); } .flex-form li { flex-basis: 16%; } /* .flex-form label { display: none; } */ button.new-line{ flex-basis: 1; } p.short-height { line-height: 1.3rem; }