Customize Contact Form 7 textboxes arrangement

I’m trying to figure out how to make my text boxes from Contact Form 7 look like they way they do on link below.

http://buildingmatters.ie/contact-us/

Mine are just in a straight line up and down.. I’ve been able to get them on the same line or get some on the left on some on the right but never like the way above.

my current code in Contact Form 7 is:

[text form1-firstname 200/50 id:author class:input-name placeholder "First (required)"]</br>[email* form1-email 200/50 id:email class:input-email placeholder “Email (required)”][textarea form1-textarea 200/50 id:textarea class:input-email placeholder “Message (required)”]

<p>[submit “Send”]</p>

Im sure it’s something with the CSS and probably easy but I can’t get it.
Ideas? Thanks in advance.