/*--------------------------------------------------------------
  Social Menu Navigation
--------------------------------------------------------------*/
.johannes-menu-social li a:after{
    font-family: "FontAwesome";
}

.johannes-menu-social{
    margin:0;
    padding:0;
    li{
    display: inline-block;
    }
    a{
        background: transparent;
    }
}
.johannes-menu-social li{
    margin: 0 8px;
    &:last-child{
        margin-right: 0;
    }
}
.johannes-menu-social a span{
    opacity: 0;
    display: none;
}

.johannes-menu-social li a[href*="/feed"]::after,
.johannes-menu-social li a[href*="/rss"]::after,
.johannes-menu-social li a[href*="feedburner"]::after {
    content: "\f09e";
}

.johannes-menu-social li a[href*="@"]::after {
    content: "\f0e0";
}

.johannes-menu-social li a[href*="codepen."]::after {
    content: "\f1cb";
}

.johannes-menu-social li a[href*="digg."]::after {
    content: "\f1a6";
}

.johannes-menu-social li a[href*="dribbble."]::after {
    content: "\f17d";
}

.johannes-menu-social li a[href*="dropbox."]::after {
    content: "\f16b";
}

.johannes-menu-social li a[href*="facebook."]::after {
    content: "\f09a";
}

.johannes-menu-social li a[href*="t.me"]::after {
    content: "\f2c6";
}

.johannes-menu-social li a[href*="whatsapp"]::after {
    content: "\f232";
}

.johannes-menu-social li a[href*="flickr."]::after {
    content: "\f16e";
}

.johannes-menu-social li a[href*="foursquare."]::after {
    content: "\f180";
}

.johannes-menu-social li a[href*="google."]::after {
    content: "\f0d5";
}

.johannes-menu-social li a[href*="github."]::after {
    content: "\f09b";
}

.johannes-menu-social li a[href*="instagram."]::after {
    content: "\f16d";
}

.johannes-menu-social li a[href*="linkedin."]::after {
    content: "\f0e1";
}

.johannes-menu-social li a[href*="last.fm"]::after {
    content: "\f202";
}

.johannes-menu-social li a[href*="pinterest."]::after {
    content: "\f0d2";
}

.johannes-menu-social li a[href*="reddit."]::after {
    content: "\f1a1";
}

.johannes-menu-social li a[href*="soundcloud."]::after {
    content: "\f1be";
}

.johannes-menu-social li a[href*="spotify."]::after {
    content: "\f1bc";
}

.johannes-menu-social li a[href*="stumbleupon."]::after {
    content: "\f1a4";
}

.johannes-menu-social li a[href*="tumblr."]::after {
    content: "\f173";
}

.johannes-menu-social li a[href*="twitter."]::after {
    content: "\f099";
}

.johannes-menu-social li a[href*="vimeo."]::after {
    content: "\f194";
}

.johannes-menu-social li a[href*="vine.co"]::after {
    content: "\f1ca";
}

.johannes-menu-social li a[href*="vk."]::after {
    content: "\f189";
}

.johannes-menu-social li a[href*="wordpress."]::after {
    content: "\f19a";
}

.johannes-menu-social li a[href*="xing."]::after {
    content: "\f168";
}

.johannes-menu-social li a[href*="youtube."]::after {
    content: "\f16a";
}

.johannes-menu-social li a[href*="medium."]::after {
    content: "\f23a";
}

.johannes-menu-social li a[href*="buysellads."]::after {
    content: "\f20d";
}

.johannes-menu-social li a[href*="behance."]::after {
    content: "\f1b4";
}

.johannes-menu-social li a[href*="slack."]::after {
    content: "\f198";
}

.johannes-menu-social li a[href*="weibo."]::after {
    content: "\f18a";
}

.johannes-menu-social li a[href*="snapchat."]::after {
    content: "\f2ac ";
}
.johannes-menu-social li a[href*="500px."]::after {
    content: "\f26e";
}
.johannes-menu-social li a[href*="amazon."]::after {
    content: "\f270";
}
.johannes-menu-social li a[href*="mixcloud."]::after {
    content: "\f289";
}
.johannes-menu-social li a[href*="ok.ru"]::after {
    content: "\f263";
}


// Colors
.johannes-modal .johannes-menu-social li a,
.johannes-modal .johannes-menu-social li a:hover{
    color: #FFF;
}
.johannes-modal .johannes-menu-social li a[href*="/feed"],
.johannes-modal .johannes-menu-social li a[href*="/rss"] {
    background-color: #FA9B39;
}

.johannes-modal .johannes-menu-social li a[href*="@"] {
    background-color: #AAA;
}

.johannes-modal .johannes-menu-social li a[href*="codepen."] {
    background-color: #fff;
}

.johannes-modal .johannes-menu-social li a[href*="digg."] {
    background-color: #fff;
}

.johannes-modal .johannes-menu-social li a[href*="dribbble."] {
    background-color: #ea4c89;
}

.johannes-modal .johannes-menu-social li a[href*="dropbox."] {
    background-color: #007ee5;
}

.johannes-modal .johannes-menu-social li a[href*="facebook."] {
    background-color: #3b5998;
}
.johannes-modal .johannes-menu-social li a[href*="t.me"] {
    background-color: #0088cc;
}
.johannes-modal .johannes-menu-social li a[href*="whatsapp"] {
    background-color: #25D366;
}
.johannes-modal .johannes-menu-social li a[href*="flickr."] {
    background-color: #ff0084;
}

.johannes-modal .johannes-menu-social li a[href*="foursquare."] {
    background-color: #0732a2;
}

.johannes-modal .johannes-menu-social li a[href*="google."] {
    background-color: #dd4b39;
}

.johannes-modal .johannes-menu-social li a[href*="github."] {
    background-color: #4183c4;
}

.johannes-modal .johannes-menu-social li a[href*="instagram."]{
    background-color: #3f729b;
}

.johannes-modal .johannes-menu-social li a[href*="linkedin."] {
    background-color: #0e76a8;
}

.johannes-modal .johannes-menu-social li a[href*="last.fm"] {
    background-color: #e31b23;
}

.johannes-modal .johannes-menu-social li a[href*="pinterest."] {
    background-color: #c8232c;
}

.johannes-modal .johannes-menu-social li a[href*="reddit."] {
    background-color: #336699;
}

.johannes-modal .johannes-menu-social li a[href*="soundcloud."] {
    background-color: #f50;
}

.johannes-modal .johannes-menu-social li a[href*="vk."]{
    background-color: #597da3;
}


.johannes-modal .johannes-menu-social li a[href*="spotify."]{
    background-color: #81b900;
}

.johannes-modal .johannes-menu-social li a[href*="stumbleupon."] {
    background-color: #ff2618;
}

.johannes-modal .johannes-menu-social li a[href*="tumblr."] {
    background-color: #34526f;
}

.johannes-modal .johannes-menu-social li a[href*="twitter."] {
    background-color: #55acee;
}

.johannes-modal .johannes-menu-social li a[href*="vimeo."] {
    background-color: #1AB7EA;
}

.johannes-modal .johannes-menu-social li a[href*="vine."] {
    background-color: #00d9a3;
}

.johannes-modal .johannes-menu-social li a[href*="vk."] {
    background-color: #4e729a;
}

.johannes-modal .johannes-menu-social li a[href*="wordpress."]{
    background-color: #21759b;
}

.johannes-modal .johannes-menu-social li a[href*="xing."]{
    background-color: #026466;
}

.johannes-modal .johannes-menu-social li a[href*="youtube."]{
    background-color: #c4302b;
}

.johannes-modal .johannes-menu-social li a[href*="medium."] {
    background-color: #57ad68;
}

.johannes-modal .johannes-menu-social li a[href*="buysellads."] {
    background-color: #c90100;
}

.johannes-modal .johannes-menu-social li a[href*="behance."] {
    background-color: #1769ff;
}

.johannes-modal .johannes-menu-social li a[href*="slack."] {
    background-color: #6ecadc;
}

.johannes-modal .johannes-menu-social li a[href*="weibo."] {
    background-color: #B53434;
}

.johannes-modal .johannes-menu-social li a[href*="snapchat."] {
    background-color: #FFFC00;
}
.johannes-modal .johannes-menu-social li a[href*="500px."] {
    background-color: #0099e5;
}
.johannes-modal .johannes-menu-social li a[href*="amazon."] {
    background-color: #ff9900;
}
.johannes-modal .johannes-menu-social li a[href*="mixcloud."] {
    background-color: #314359;
}
.johannes-modal .johannes-menu-social li a[href*="ok.ru"] {
    background-color: #ed812b;
}