title: Strange border with gradient around submit button. How do I remove?
body: <p>I have this weird problem, which I can't seem to get around and I'm not sure why it is here. </p>
  
  <p>I am trying to style my form button and upon styling I have this weird outline that I didn't code in
  <a href="http://imgur.com/QpCPRju" rel="nofollow">http://imgur.com/QpCPRju</a></p>
  
  <p>Here is the code:</p>
  
  <pre><code>button {
    background: #3e779d;
    padding: 12.5px 25px;
    -webkit-border-radius: 40px;
    -moz-border-radius: 40px;
    border-radius: 40px;
    color: white;
    font-size: 18px;
    text-decoration: none;
    vertical-align: middle
  }
  button:hover {
    background: #28597a;
    color: #ffffff;
  }
  </code></pre>
  
  <p>Can anyone shed some light into why this is happening please.</p>
  
  <p>Thank you</p>
  
  <p>HUGE EDIT: Thank you to all. I was missing a semi colon so the code wasn't running for me. All the answers below are correct (its a sign you shouldn't spend so long in front of the screen)</p>