Customizing Newsletter Signup Widget to match logo/site colors

Hello!

I would like to make my newsletter signup box look like this example:

I uploaded the Subscribe & Connect Plugin and am trying to customize the code to match the above style.

Here is the widget/plugin code for my version:

<section class="widget clearfix widget_subscribe_and_connect_items" id="subscribe-and-connect-2"><h3 class="widgettitle">Get free health tips in your inbox!</h3><div class="subscribe-and-connect-connect">Receive practical tips on how to increase energy, feel better, and love who you see in the mirror every day!<form method="post" action="http://us1.list-manage.com/subscribe/post?u=XXXXXXXXXdccb&id=XXXXXXXXX" class="newsletter-form">
<input type="text" name="EMAIL" placeholder="Your Email Address">
<input type="submit" value="Subscribe" name="submit" class="submit">
</form>
</div><!--/.subscribe-and-connect-connect--><span class="seperator extralight-border"></span></section>

How can I change the button color (and rollover effect), change the h3 title to be larger font, and add the line as per above example?

So far I have:

`.subscribe-and-connect-connect {
background: none repeat scroll 0 0 #009eca;
color: white;
padding: 10px 10px 1px;
}’

But I’m not quite there yet! Please see link below (private). Thank you!