html - positioning of Google Captcha works fine on desktop / tablet, but not on mobile -

i have following html :

   <div class="form-group" style="margin-left: 7%;" id="gcaptcha">      @html.recaptcha("mykey", captchatheme.dark)      @html.validationmessage("recaptcha")    </div> 

as can see have specified margin-left:7% reason behind because want appear in middle instead of floating left shown here:

this works fine on desktop / tablets when viewed on mobile device pushed further right because of margin-left:7% have specified, fix assumed of put margin-left:auto; margin-right:auto doesn't anything, can suggest way make captcha appear in middle devices?

hello there try in @media phones:

important inline-styles overwrite other css

remove style="margin-left: 7%;"

#gcaptcha{   margin: 0 auto;   width: 85%; } 

if doesn't work please provide css .form-group