Step 1 

You will need to go to your form code and add a little snippet to it.

You will notice your form html looks something like this:

<form>

<input  type='text'/>

<input type="submit" value="Submit"/>

</form>

You need to make it look like this:

<form>

<input class="css3byleeformfield" type='text'/>

<input id="css3byleesubmit" type="submit" value="Submit"/>

</form>

*NOTICE

All I have done is added id="css3byleesubmit" and class="css3byleeformfield" to the existing code. Now when we add the CSS to the page (in step 2) we will call these styles and there you have it, styled forms.

Look at the difference above and see if you can work out where the code below goes in your form.  If your stuck with it ask at the Yola forum for help

Remember you put the 'id' below into the <input type="submit" row of your form (it's normally at the bottom)
&
You put the 'class' below into the actual form field rows.

STEP 1 CODE:

Step 2

Put the code below into an html widget at the top of your page. (or, of course, add it to an existing file)

• I have left /*notes*/ on the lines you can edit.
  

• You can change the shadow colours to anything you like.