title: Google+ signin button [class='g-signin']
body: <p>I am trying to make a google+ siginin button for my site. I went through this link <a href="https://developers.google.com/+/web/signin/#button_attributes" rel="noreferrer">https://developers.google.com/+/web/signin/#button_attributes</a> and tried to make it working but now my styling is all messed up. I am not able to mess around with the [class='g-sinin'] in CSS. 
  <img src="https://i.stack.imgur.com/ZqmWX.jpg" alt="enter image description here">
  <br/>This is my code:</p>
  
  <pre><code> &lt;section class='login_G' &gt;
     &lt;span class='g-signin' data-callback='signinCallback' 
     data-scope='https://www.googleapis.com/auth/plus.login'&gt;&lt;/span&gt;
  &lt;/section&gt;
  </code></pre>
  
  <p>This is my css:</p>
  
  <pre><code>.login_G {
    cursor: pointer;
    margin-left: 35px;
    float: left;
    height: 72px;
    width: 72px;
    background:url(images/register-google-sprite.png) 0 0;
  }
  </code></pre>
  
  <p>How do I hide the default class<code>class='g-signin'</code> or make it good. If I remove the class inside the span then whole google+ signin function goes off. Can anyone tell me how can I make the siginin function work when clicked on the background image.</p>