Border Around Responsive Form

We have the following for: https://form.jotform.com/62453833210145

We added a border around it using the following code:

.form-all {

   border:2px solid black !important;

    border-radius:5px;

    padding:10px;

}

While the form itself is responsive, the border size does not automatically enlarge or reduce like the form fields do.

Any help would be appreciated.

Please try injecting the following CSS code: http://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes 

@media only screen and (max-width: 480px) {

.form-all{

    height: 643px !important;

}

}

Result:

Let us know if you need more help.

Thank you.  I added that code but it still does not size down like the fields do

https://form.jotform.com/62453833210145

What mobile device are you using? Could you please share a screenshot of how it shows in your mobile device? Simply load the URL of this thread in your browser(URl: https://www.jotform.com/answers/923117), then include the screenshot as shown on this guide: https://www.jotform.com/answers/414264-How-to-include-screenshot-image-in-the-support-forum 

Thank you.  It looks fine in mobile.  The issue is in desktop mode once we embed it into our site.  

See the following link for a test page:  http://www.tycousa.net/page/bound-books

Please try embedding your form using the Iframe code: https://www.jotform.com/help/148-Getting-the-form-iFrame-code 

Let us know if you need more help, we will be glad to assist you.

Tried that but it didn't work either.  Same result.

I believe, this code will fix the problem: https://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes 

.form-all {

    width: 94% !important;

}

Result:

Please update us. 

Thank you.  That worked but now the form is not completely left justified within it's column.  IS there a setting for that?

Never mind.  Figured it out.

Thanks for all your help.