Help with Layout

I've used a 4-column layout before, but this time I am not getting the proper layout. Here is a link to the form: http://sec.powermediallc.org/department-info/forms/entry-forms/winter/swimming-championships/ (password is test). I would like the rows to line up under one another.

Here is the code I used:

[css]
.gform_wrapper .top_label li.gfield.gf_one_quarter { float:left; margin-right: 4%; width: 18%; clear:right !important; }

.gform_wrapper .top_label li.gfield.gf_quarter_last { margin-right:0; }

.gform_wrapper .top_label li.gfield.gfield_error.gf_one_quarter { width: 18% }

.gform_wrapper .top_label li.gfield.gf_one_quarter input.medium, .gform_wrapper .top_label li.gfield.gf_one_quarter input.large, .gform_wrapper .top_label li.gfield.gf_one_quarter select.medium, .gform_wrapper .top_label li.gfield.gf_one_quarter select.large { width: 95% }

.gform_wrapper .top_label li.gfield.gf_one_quarter+li.gsection, .gform_wrapper .top_label li.gfield.gf_one_quarter+li.gsection { padding: 16px 0 8px 0 }

.gform_wrapper .top_label li.gfield.gf_one_quarter+li.gfield, .gform_wrapper .top_label li.gfield.gf_one_quarter+li.gfield, .gform_wrapper .top_label li.gfield.gf_one_quarter+li.gfield, .gform_wrapper .top_label li.gfield.gf_one_quarter+.gform_footer, .gform_wrapper .top_label li.gfield.gf_one_quarter+.gform_footer, .gform_wrapper .top_label li.gfield.gf_one_quarter+.gform_footer { clear: both }

Thanks for any help!!!

Thanks for your response Chris. I was able to figure it out yesterday morning.