Consensus button

by karin

HTML

<a class="btn">Consensus</a>

CSS

.btn {
    text-decoration:none;
  display: inline-block;
  margin-bottom: 0;
  margin-right:2px;
  font-weight: normal;
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
  background-image: none; 
  border: 1px solid #98afbb;
  color:#fff;
  white-space: nowrap;
    padding:4px 14px;
    font-size:22px;
    line-height:1.5;
    -ms-border-radius: 4px;
    border-radius: 4px;
    background:#98afbb;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -o-user-select: none;
    user-select: none;
    margin-left: 0.5em;
    
     -webkit-box-shadow: inset 0 0 10px rgba(0,0,0,.125);
    -ms-box-shadow: inset 0 0 10px rgba(0,0,0,.125);
    box-shadow: inset 0 0 10px rgba(0,0,0,.125);
}

    .btn:hover,
    .btn:focus {
        color: #fff;
        text-decoration: none;
        background:rgba(152, 175, 187, 0.9);
        border: 1px solid rgba(152, 175, 187, 0.5);
    }  

  .btn.disabled,
  .btn.disabled:hover,   
  .btn[disabled],
  .btn[disabled]:hover{
    cursor: default;
    border: 1px solid #CFCFCF;
  }
  .btn:active,
  .btn.active {
    outline: 0;
    background-image: none;
    -webkit-box-shadow: inset 0 3px 5px rgba(0,0,0,.125);
    -ms-box-shadow: inset 0 3px 5px rgba(0,0,0,.125);
    box-shadow: inset 0 3px 5px rgba(0,0,0,.125);
  }