SGF Donate

by Koubenec

HTML

<div id="hdrdonate">Support the SGF by donating online:<div id="hdrbutton">DONATE</div></div>
<div id="sidebarfb"><img class="icon" src="http://summerallguardfoundation.org/wp-content/uploads/2012/10/FB_icon_on.png"></div>

CSS

#hdrdonate {
    width: 330px;
    height: 100px;
    font-family: 'Arbutus Slab', serif;
    font-size: 22px;
    color: #414042;
}

#hdrbutton {
    width: 330px;
    height: 30px;
    background-color: #BE1E2D;
    font-family: 'Arbutus Slab', serif;
    color: #fff;
    font-size: 24px;
    text-align: center;
    line-height: 30px;
    margin-top: 5px;
}

#sidebarfb {
    width: 85px;
    height: 85px;
    background-image: url('http://summerallguardfoundation.org/wp-content/uploads/2012/10/FB_icon_off.png');
}

.icon {
    opacity: 0;
}

.icon:hover {
    opacity: 1;
}