Issues with adding fields on one line

 Hello-

I hope someone can help me with my issues. I have several things I need to accomplish and am unable to figure out. 

1. I would like to decrease the space between the subheading and the fields

2. I have one product that needs 3 dropdown boxes to accommodate the choices it offers. I have shrunk the field, then duplicated the dropdowns, then merge the 2nd box to the first. However, I cannot get the third dropdown box to move to the same line as the others. There isn't an option to merge - only move up which doesnt accomplish what I am trying to achieve. The form should be plenty wide enough to do this.

3. I need to decrease the space between the other options. I have tried to adjust the padding and margins - all to no avail. 

4. I would also like to get rid of the drop shadow around the whole form- I believe the style for that is called formall. Not sure how to achieve this.

5. This form is being embedded on a responsive website. I need the form to fill the entire width of the webpage. I have tried setting the width to a width and also tried to set it at 100%. It doesn't seem to work. The form sits in the center of my page and doesn't fill the page.

Thanks in advance for any assistance you can provide!

Regards,

Sarah

You can inject the following css to fix the alignment of the form:

.form-header-group{

padding-bottom: 0px!important;

margin-bottom:0px!important;

}

#id_27, #id_39, #id_40, #id_31, #id_32,  #id_41 {

width:150px!important;

}

#id_35{

width:500px!important;

}

#id_33{

width:100%!important;

}

.form-all {

box-shadow: 0!important;

-webkit-box-shadow: 0 0px 0px rgba(0, 0, 0, 0)!important;

width:100%!important;

}

How to Inject Custom CSS Codes