When you use the shortcode for a sign-up form in Arigato PRO it generates a very clean basic responsive HTML code without any pre-formatting. The idea is that the form will nicely fit your WordPress theme design and stay consistent with it.

If your theme does not have any styling of standard form elements or have odd styling you may need to modify the CSS yourself. Here is the HTML code of a basic form:

<form method="post" enctype="multipart/form-data" class="bftpro-front-form" onsubmit="return validateBFTProUser(this,false);" >
	<div><label>Your Name:</label> <input type="text" name="bftpro_name"></div>
	<div><label>*Your Email:</label> <input type="text" name="email"></div>	
	<div class="bftpro-front-signup-button">
	   <input type="submit" value="Subscribe">				
	</div>
	<input type="hidden" name="bftpro_subscribe" value="1">
        <input type="hidden" name="list_id" value="1">		
	<input type="hidden" name="required_fields[]" value="">	
</form>

Such a form looks good on our theme:

But with a bit of CSS you can make it look different if you wish. The form has class so you can style the elements. Example CSS:

.bftpro-front-form div label {
display:block;
float:left;
width: 150px;
font-weight:bold;
font-size: 120%;
font-family: Verdana;
color: darkblue;
}

.bftpro-front-form input[type=text] {
height: 25px;
font-weight: bold;
font-size: 120%;
}

.bftpro-front-form input[type=submit] {
padding:5px 15px;
background:#ccc;
border:0 none;
cursor:pointer;
-webkit-border-radius: 5px;
border-radius: 5px;
}

With this CSS the same form code starts looking like this:

Your custom CSS code can be written either directly to the theme CSS or be added on the site using a plugn like Simple Custom CSS