Actually this website will have around three or forms scattered throughout the site and I intend to have reCaptchas everywhere a form is found. I will remove some and just put a link to the contact page too.
The problem I'm having is every time I insert the reCaptcha, two or sometimes three of the form fields doesn't work. The mouse over effect doesn't seem to highlight the field. Usually it's the First Name, Last Name and sometimes other fields as well. But as soon as I remove the reCaptcha, it works. I got the API for the reCaptcha 2 (the checkbox one). I'm going to try the smart reCaptcha instead to see how that one works and I'll let you know.
Thanks for you help,
I see the problem. The recaptcha takes the whole height. It is not a theme issue, but just a formatting issue I think.
I think this should be easily solved by wrapping the recaptcha code into a div with a col-md-12 class.
<div class="col-md-12"> add receptcha code here </div>
If you want to have receptcha side by side with the request appointment button, then change both classes to col-md-6 like this:
<div class="col-md-6"> add receptcha code here </div>
<div class="col-md-6">[submit class:btn class:btn-c1 class:btn-lg "Request Appointment"]</div>