/*
Social Media Colors
v0.0.1
Created By: JDsWebService
Author Link: http://github.com/jdswebservice
Description: CSS Button Classes
Imported @: core.scss
*/

// Define Specificity
.btn-social.btn- {
    /*--------------------------*/
    // Facebook
    /*--------------------------*/
    &facebook {
        background-color: $facebookBlue;
        &-dark {
            background-color: $facebookDarkBlue;
        }
    }

    /*--------------------------*/
    // Twitter
    /*--------------------------*/
    &twitter {
        background-color: $twitterBlue;
        &-dark {
            background-color: darken($twitterBlue, 15);
        }
    }

    /*--------------------------*/
    // YouTube
    /*--------------------------*/
    &youtube {
        background-color: $youtubeRed;
        &-dark {
            background-color: darken($youtubeRed, 15);
        }
    }


    /*--------------------------*/
    // Instagram
    /*--------------------------*/
    &instagram {
        background-color: $instagramMagenta;
        &-blue {
            background-color: $instagramBlue;
        }
        &-purple {
            background-color: $instagramPurple;
        }
        &-orange {
            background-color: $instagramOrange;
        }
        &-yellow {
            background-color: $instagramYellow;
            @include blackout;
        }
    }

    /*--------------------------*/
    // LinkedIn
    /*--------------------------*/
    &linkedin {
        background-color: $linkedinBlue;
        &-light {
            background-color: $linkedinLightBlue;
        }
    }

    /*--------------------------*/
    // Google
    /*--------------------------*/
    &google {
        background-color: $googleBlue;
        &-red {
            background-color: $googleRed;
        }
        &-green {
            background-color: $googleGreen;
        }
        &-yellow {
            background-color: $googleYellow;
        }
    }

    /*--------------------------*/
    // WhatsApp
    /*--------------------------*/
    &whatsapp {
        background-color: $whatsappGreen;
        @include blackout;
        &-dark {
            background-color: $whatsappDarkGreen;
        }
        &-light {
            background-color: $whatsappLightGreen;
        }
        &-light-secondary {
            background-color: $whatsappLighterGreen;
            @include blackout;
        }
        &-blue {
            background-color: $whatsappBlue;
        }
    }


    /*--------------------------*/
    // Reddit
    /*--------------------------*/
    &reddit {
        background-color: $redditOrange;
        &-secondary {
            background-color: $redditOrangeSecondary;
        }
        &-blue {
            background-color: $redditBlue;
        }
        &-dark {
            background-color: $redditDarkBlue;
        }
        &-light {
            background-color: $redditLightBlue;
            @include blackout;
        }
    }

    /*--------------------------*/
    // TikTok
    /*--------------------------*/
    &tiktok {
        background-color: $tiktokBlack;
        &-blue {
            background-color: $tiktokBlue;
            @include blackout;
        }
        &-pink {
            background-color: $tiktokPink;
        }
    }

    /*--------------------------*/
    // Mastodon
    /*--------------------------*/
    &mastodon {
        background-color: $mastodonBlue;
        &-dark {
            background-color: $mastodonBlack;
        }
        &-secondary {
            background-color: $mastodonGrey;
            @include blackout;
        }
        &-light {
            background-color: $mastodonLightGrey;
            @include blackout;
        }
    }

    /*--------------------------*/
    // Spotify
    /*--------------------------*/
    &spotify {
        background-color: $spotifyGreen;
        @include blackout;
        &-dark {
            background-color: $spotifyDarkGreen;
        }
    }

    /*--------------------------*/
    // Apple
    /*--------------------------*/
    &apple {
        background-color: $appleGrey;
        @include blackout;
        &-dark {
            background-color: $appleDarkGrey;
        }
        &-light {
            background-color: $appleLightGrey;
            @include blackout;
        }
    }

    /*--------------------------*/
    // Alexa
    /*--------------------------*/
    &alexa {
        background-color: $alexaBlue;
        @include blackout;
        &-dark {
            background-color: $alexaDarkGrey;
        }
    }

    /*--------------------------*/
    // Miscrosoft
    /*--------------------------*/
    &microsoft {
        background-color: $microsoftRed;
        @include blackout;
        &-green {
            background-color: $microsoftGreen;
            @include blackout;
        }
        &-blue {
            background-color: $microsoftBlue;
            @include blackout;
        }
        &-yellow {
            background-color: $microsoftYellow;
            @include blackout;

        }
    }

    /*--------------------------*/
    // Periscope
    /*--------------------------*/
    &periscope {
        background-color: $periscopeBlue;
        &-red {
            background-color: $periscopeRed;
        }
        &-secondary {
            background-color: $periscopeGrey;
            @include blackout;
        }
        &-dark {
            background-color: $periscopeDarkGrey;
        }
        &-light {
            background-color: $periscopeLightBlue;
            @include blackout;
        }
    }

    /*--------------------------*/
    // Swarm
    /*--------------------------*/
    &swarm {
        background-color: $swarmOrange;
        @include blackout;
        &-secondary {
            background-color: $swarmOrangeSecondary;
            @include blackout;
        }
        &-dark {
            background-color: $swarmDarkOrange;
        }
        &-blue {
            background-color: $swarmBlue;
        }
    }

    /*--------------------------*/
    // Medium
    /*--------------------------*/
    &medium {
        background-color: $mediumGreen;
        &-dark {
            background-color: $mediumDark;
        }
        &-light {
            background-color: $mediumLight;
            @include blackout;
        }
    }

    /*--------------------------*/
    // Skype
    /*--------------------------*/
    &skype {
        background-color: $skypeBlue;
        &-dark {
            background-color: $skypeDarkBlue;
        }
    }

    /*--------------------------*/
    // Quora
    /*--------------------------*/
    &quora {
        background-color: $quoraRed;
        &-blue {
            background-color: $quoraBlue;
        }
    }

    /*--------------------------*/
    // Dribble
    /*--------------------------*/
    &dribble {
        background-color: $dribblePink;
        &-secondary {
            background-color: $dribbleDarkPink;
        }
        &-dark {
            background-color: $dribbleDarkGrey;
        }
        &-light {
            background-color: $dribbleGrey;
        }
    }

    /*--------------------------*/
    // Slack
    /*--------------------------*/
    &slack {
        background-color: $slackPurple;
        &-blue {
            background-color: $slackBlue;
        }
        &-green {
            background-color: $slackGreen;
        }
        &-pink {
            background-color: $slackPink;
        }
        &-yellow {
            background-color: $slackYellow;
        }
    }

    /*--------------------------*/
    // Stumbleupon
    /*--------------------------*/
    &stumbleupon {
        background-color: $stumbleuponOrange;
        &-secondary {
            background-color: $stumbleuponOrangeSecondary;
        }
        &-light {
            background-color: $stumbleuponLightGrey;
            @include blackout;
        }
    }

    /*--------------------------*/
    // Flickr
    /*--------------------------*/
    &flickr {
        &-pink {
            background-color: $flickrPink;
            &-secondary {
                background-color: $flickrPinkSecondary;
            }
            &-contrast {
                background-color: $flickrPinkContrast;
            }
        }
        &-blue {
            background-color: $flickrBlue;
            &-secondary {
                background-color: $flickrBlueSecondary;
            }
            &-contrast {
                background-color: $flickrBlueContrast;
            }
        }
    }

    /*--------------------------*/
    // Twitch
    /*--------------------------*/
    &twitch {
        background-color: $twitchPurple;
        &-secondary {
            background-color: $twitchLightPurple;
            @include blackout;
        }
    }

    /*--------------------------*/
    // Soundcloud
    /*--------------------------*/
    &soundcloud {
        background-color: $soundcloudOrange;
        &-secondary {
            background-color: $soundcloudOrangeSecondary;
        }
        &-dark {
            background-color: $soundcloudDarkOrange;
        }
        &-light {
            background-color: $soundcloudLightOrange;
        }
    }

    /*--------------------------*/
    // Deviantart
    /*--------------------------*/
    &deviantart {
        background-color: $deviantartGreen;
        @include blackout;
        &-darker {
            background-color: $deviantartDarkGreen;
        }
        &-darkest {
            background-color: $deviantartDarkestGreen;
        }
        &-lighter {
            background-color: $deviantartLightGreen;
            @include blackout;
        }
        &-lightest {
            background-color: $deviantartLightestGreen;
            @include blackout;
        }
    }

    /*--------------------------*/
    // Pocket
    /*--------------------------*/
    &pocket {
        background-color: $pocketPink;
        &-secondary {
            background-color: $pocketGreen;
            @include blackout;
        }
        &-dark {
            background-color: $pocketDarkGreen;
            @include blackout;
        }
        &-light {
            background-color: $pocketLightGreen;
            @include blackout;
        }
        &-yellow {
            background-color: $pocketYellow;
        }
    }

    /*--------------------------*/
    // Slideshare
    /*--------------------------*/
    &slideshare {
        background-color: $slideshareOrange;
        &-secondary {
            background-color: $slideshareBlue;
        }
        &-dark {
            background-color: $slideshareDarkBlue;
        }
    }

    /*--------------------------*/
    // 500px
    /*--------------------------*/
    &500 {
        background-color: $fivehundredpxBlue;
        &-dark {
            background-color: $fivehundredpxDarkGrey;
        }
    }
    /*--------------------------*/
    // vk
    /*--------------------------*/
    &vk {
        background-color: $vkBlue;
        &-blue {
            &-dark {
                background-color: $vkDarkBlue;
            }
            &-light {
                background-color: $vkLightBlue;
            }
        }
        &-light {
            background-color: $vkLight;
            @include blackout;
            &-secondary {
                background-color: $vkLightSecondary;
                @include blackout;
            }
        }
    }
    /*--------------------------*/
    // Steam
    /*--------------------------*/
    &steam {
        background-color: $steamPrimary;
        &-secondary {
            background-color: $steamGrey;
            @include blackout;
        }
        &-blue {
            background-color: $steamBlue;
            &-dark {
                background-color: $steamDarkBlue;
            }
            &-light {
                background-color: $steamLightBlue;
                @include blackout;
            }
        }
    }

    /*--------------------------*/
    // Discord
    /*--------------------------*/
    &discord {
        background-color: $discordPurple;
        &-secondary {
            background-color: $discordGrey;
            &-dark {
                background-color: $discordDarkGrey;
            }
            &-light {
                background-color: $discordLightGrey;
            }
        }
    }

    /*--------------------------*/
    // Listly
    /*--------------------------*/
    &listly {
        background-color: $listlyOrange;
        &-dark {
            background-color: $listlyDarkOrange;
        }
        &-secondary {
            background-color: $listlyBlue;
            &-dark {
                background-color: $listlyDarkBlue;
            }
        }
    }

    /*--------------------------*/
    // Vimeo
    /*--------------------------*/
    &vimeo {
        background-color: $vimeoBlue;
    }

    /*--------------------------*/
    // Telegram
    /*--------------------------*/
    &telegram {
        background-color: $telegram;
    }
    /*--------------------------*/
    // Clarity
    /*--------------------------*/
    &clarity {
        background-color: $clarity;
    }

    /*--------------------------*/
    // Yahoo
    /*--------------------------*/
    &yahoo {
        background-color: $yahoo;
    }

    /*--------------------------*/
    // Android
    /*--------------------------*/
    &android {
        background-color: $android;
    }

    /*--------------------------*/
    // Amazon
    /*--------------------------*/
    &amazon {
        background-color: $amazon;
    }

    /*--------------------------*/
    // Yelp
    /*--------------------------*/
    &yelp {
        background-color: $yelp;
    }

    /*--------------------------*/
    // Tumblr
    /*--------------------------*/
    &tumblr {
        background-color: $tumblr;
    }

    /*--------------------------*/
    // Snapchat
    /*--------------------------*/
    &snapchat {
        background-color: $snapchat;
        @include blackout;
    }

    /*--------------------------*/
    // Pintrest
    /*--------------------------*/
    &pinterest {
        background-color: $pinterest;
    }

    /*--------------------------*/
    // Homeadvisor
    /*--------------------------*/
    &homeadvisor {
        background-color: $homeAdvisor;
    }

    /*--------------------------*/
    // Houzz
    /*--------------------------*/
    &houzz {
        background-color: $houzz;
    }

    /*--------------------------*/
    // Angie's List
    /*--------------------------*/
    &angieslist {
        background-color: $angiesList;
    }

    /*--------------------------*/
    // GlassDoor
    /*--------------------------*/
    &glassdoor {
        background-color: $glassDoor;
    }
    /*--------------------------*/
    // Google +
    /*--------------------------*/
    &googleplus {
        background-color: $googlePlus;
    }
    /*--------------------------*/
    // Vine
    /*--------------------------*/
    &vine {
        background-color: $vine;
    }

    /*--------------------------*/
    // Battlemetrics
    /*--------------------------*/
    &battlemetrics {
        background-color: $battlemetrics;
    }
}