GHOST BUTTONS



KLICKA HÄR
LÅT OSS HJÄLPA ER MED HEMSIDAN

Semi-Transparent Fade


---------- CSS -----------------------------------------


.ghost-button-semi-transparent {
  display: inline-block;
  width: 200px;
  padding: 8px;
  color: #fff;
  border: 2px solid #fff;
  text-align: center;
  outline: none;
  text-decoration: none;
  transition: background-color 0.2s ease-out,
              border-color 0.2s ease-out;
}
.ghost-button-semi-transparent:hover,
.ghost-button-semi-transparent:active {
  background-color: #fff; /* fallback */
  background-color: rgba(255, 255, 255, 0.4);
  border-color: #fff; /* fallback */
  border-color: rgba(255, 255, 255, 0.4);
  transition: background-color 0.3s ease-in,
              border-color 0.3s ease-in;
}


---------- HTML -----------------------------------------


<div style="text-align: center;">
<span style="text-shadow: 2px 2px #828282; color: black; font-size: 34px;">LÅT OSS HJÄLPA ER MED HEMSIDAN</span><br />
<br />
<a class="ghost-button-semi-transparent" href="http://www.swedishwebdesign.eu/p/kontakt.html">KLICKA HÄR</a></div>
<br /></div>
========================================================