How can I replicate a form done with Contact Form 7 as a Gravity Form?

I created a sample form to emulate yours, then grabbed the form styles from your theme stylesheet. I applied some of the CSS Ready Classes from the 1.5 release candidate to create the column layout, then targeted the fields properly and applied the existing theme form styles.

NOTE: the Ready Class styles are only in the 1.5 RC version. If you don't want to upgrade to the 1.5 release candidate version right now, you can copy the ready class styles from the link below and add those to your theme stylesheet. Then you can apply the classes to your field as described in the documentation.

Ready Class CSS: http://pastie.org/1443282

I did this in the default 2010 theme so the fonts & some of the other elements are a bit off, but when you add it them to your theme, you should be pretty close. From there, you can tweak a little and should be good to go.

test screenshot: http://grab.by/8Opa

Here's the custom CSS to add to your theme. You'll need to get your form ID and replace the "gform_wrapper_XX" with your actual form ID - example" "gform_wrapper_10""

body #gform_wrapper_XX {width:555px}
body #gform_wrapper_XX label,
body #gform_wrapper_XX input,
body #gform_wrapper_XX select { font:14px 'Droid Sans', serif; color: #4b4b4b; line-height:20px  }
body #gform_wrapper_XX form#gform_78 { -webkit-border-radius: 9px; -moz-border-radius: 9px; border-radius: 9px; border: 1px solid #dcdcc8; padding:70px 25px 25px 25px; margin-bottom:25px;background: url("http://www.ubikuos.com/wp-content/themes/Ubikuos/images/stripes.png") repeat-x scroll 0 15px #FFFFFF;}
body #gform_wrapper_XX input,
body #gform_wrapper_XX textarea { background-color:#fafaf2; padding:7px; border:1px solid #dcdcc8; }
body #gform_wrapper_XX input {width:200px; }
body #gform_wrapper_XX textarea  {width:230px; height:330px }
body #gform_wrapper_XX select { width:200px; }
body #gform_wrapper_XX .gform_footer input[type=submit] { width:109px; height:36px; background:url(http://www.ubikuos.com/wp-content/themes/Ubikuos/images/submit.png) no-repeat; text-indent:-9999px; border:none; float:right; cursor: pointer; }
body #gform_wrapper_XX .gform_footer input[type=submit]:hover{ background-position:-109px 0; }
body #gform_wrapper_XX .gform_body .gform_fields .gfield .gfield_label .gfield_required {color:#F70094}

I exported the test form so you can grab it and use it as a starter for your new form.

Download Sample Form (XML)

Okay, so that's like 95% done for you. Let me know if you need anything else.

You should be able to remove the old CSS for the previous form

div.entry-content-contact-form { width:550px; float:left; }
div.contact-form-container { -webkit-border-radius: 9px; -moz-border-radius: 9px; border-radius: 9px; border: 1px solid #dcdcc8; padding:70px 25px 25px 25px; margin-bottom:25px;background: url("images/stripes.png") repeat-x scroll 0 15px #FFFFFF;}
div.contact-sidebar { float:left; border-left:1px dotted #dcdcc8; width:270px; margin-left:75px; padding-left:75px; }
div.contact-col-one { float:left; width:210px; margin-right:40px; }
div.contact-col-two { float:left; width:230px }

You don't need that anymore.. just the new styles for your Gravity Form.

As far as embedding the form, you don't need to use the "do_shortcode" method as Gravity Forms has it's own function call.

<?php gravity_form(1, false, false); ?>

You would just replace the "1" with the actual ID of your form.

Note: When using a Gravity Form in a sidebar widget or embedding it anywhere using the function call, you need to manually enqueue the scripts and CSS by placing a short script block in your theme's functions.php file.

wp_enqueue_script("gforms_ui_datepicker", WP_PLUGIN_URL . "/gravityforms/js/jquery-ui/ui.datepicker.js", array("jquery"), "1.4.5", true);

wp_enqueue_script("gforms_datepicker", WP_PLUGIN_URL . "/gravityforms/js/datepicker.js", array("gforms_ui_datepicker"), "1.4.5", true);

wp_enqueue_script("gforms_conditional_logic_lib", WP_PLUGIN_URL . "/gravityforms/js/conditional_logic.js", array("gforms_ui_datepicker"), "1.4.5", true);

wp_enqueue_style("gforms_css", WP_PLUGIN_URL . "/gravityforms/css/forms.css");

Without this, the conditional logic scripts, datepicker script, form CSS and other elements needed for the full form functionality aren't loaded.

You can find more information at the URL below

http://www.gravityhelp.com/documentation/embedding-a-form/

Thanks for the kind words. Do you have a live URL for the new form yet? I'll be happy to look at it if you're still having problems with it.

you can send me the login information or password for the protected page to kevin@rocketgenius.com and I'll take a look at it as soon as I can

Sorry, No. I didn't see it. I just checked my spam folder too for the past week or so - nothing there. Please resend if you will and I'll make a point to look for your message.