/* SOCIAL ICONS - GENERAL */
.social {
    list-style: none;
}

    .social li {
        display: inline;
        float: left;
        background-repeat: no-repeat;
        margin:0px 2px;
    }

        .social li a {
            display: block;
            position: relative;
            text-decoration: none;
        }

            .social li a strong {
                font-weight: normal;
                position: absolute;
                left: 20px;
                top: -1px;
                color: #fff;
                padding: 3px;
                z-index: 9999;
                text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.75);
                background-color: rgba(0, 0, 0, 0.7);
                -moz-border-radius: 3px;
                -moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
                -webkit-border-radius: 3px;
                -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
                border-radius: 3px;
                box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
            }

        .social li.facebook {
            background-image: url("../img/homepage-icon.png");
        }

        .social li.twitter {
            background-image: url("../img/red-sitemap-icon.png");
        }

        .social li.delicious {
            background-image: url("../img/rss-header.png");
        }

/* SOCIAL ICONS - CSS3 */
#css3:hover li {
    opacity: 0.2;
}

#css3 li {
    -webkit-transition-property: opacity;
    -webkit-transition-duration: 500ms;
    -moz-transition-property: opacity;
    -moz-transition-duration: 500ms;
}

    #css3 li a strong {
        opacity: 0;
        -webkit-transition-property: opacity, top;
        -webkit-transition-duration: 300ms;
        -moz-transition-property: opacity, top;
        -moz-transition-duration: 300ms;
    }

    #css3 li:hover {
        opacity: 1;
    }

        #css3 li:hover a strong {
            opacity: 1;
            top: -10px;
        }