/*-----------------------------------------------------------------------------------

	Shortcodes: social-icons.scss

-----------------------------------------------------------------------------------*/

/* ----------------------------------------------------------------
	Social Icons
-----------------------------------------------------------------*/


.social-icon {
	margin: 0 5px 5px 0;
	width: 40px;
	height: 40px;
	font-size: 20px;
	line-height: 38px !important;
	color: #555;
	text-shadow: none;
	border: 1px solid #AAA;
	@include border-radius(3px);
	overflow: hidden;
}


/* Social Icons - Rounded
-----------------------------------------------------------------*/

.si-rounded { @include border-radius(50%); }

/* Social Icons - Borderless
-----------------------------------------------------------------*/

.si-borderless { border-color: transparent !important; }

/* Social Icons - Dark
-----------------------------------------------------------------*/

.si-dark {
	background-color: #444;
	color: #FFF !important;
	border-color: transparent;
}

/* Social Icons - Light
-----------------------------------------------------------------*/

.si-light {
	background-color: rgba(0,0,0,0.05);
	color: #666 !important;
	border-color: transparent;
}

/* Social Icons - Colored
-----------------------------------------------------------------*/

.si-colored {
	border-color: transparent !important;
	i {
		color: #FFF;
	}
}

/* Social Icons - Large
-----------------------------------------------------------------*/

.social-icon {
	&.si-large {
		margin: 0 10px 10px 0;
		width: 56px;
		height: 56px;
		font-size: 30px;
		line-height: 54px !important;
	}
}

/* Social Icons - Small
-----------------------------------------------------------------*/

.social-icon {
	&.si-small {
		width: 32px;
		height: 32px;
		font-size: 14px;
		line-height: 30px !important;
	}
	i {
		display: block;
		position: relative;
	}
}

body:not(.device-touch) {
	.social-icon {
		i {
			@include transition(all .3s ease);
		}
	}
}

.social-icon {
	i {
		&:last-child {
			color: #FFF !important;
		}
	}
	&:hover {
		color: #555;
		border-color: transparent;
		i {
			&:first-child {
				margin-top: -38px;
			}
		}
	}
	&.si-large {
		&:hover {
			i {
				&:first-child {
					margin-top: -54px;
				}
			}
		}
	}
	&.si-small {
		&:hover {
			i {
				&:first-child {
					margin-top: -30px;
				}
			}
		}
	}
}
.si-colored {
	&.social-icon {
		border-color: transparent;
	}
}

/* Social Icons - Sticky
-----------------------------------------------------------------*/

.si-sticky {
	position: fixed;
	top: 50%;
	left: 5px;
	width: 36px;
	z-index: 100;
}

/* Social Icons - Sticky Right
-----------------------------------------------------------------*/

.si-sticky {
	&.si-sticky-right {
		left: auto;
		right: 8px;
	}
}

/* Social Icons - Share
-----------------------------------------------------------------*/

.si-share {
	position: relative;
	padding-left: 5px;
	border-top: 1px solid #EEE;
	border-bottom: 1px solid #EEE;
	span {
		line-height: 36px;
		font-weight: bold;
		font-size: 13px;
	}
	div {
		float: right;
	}
	.social-icon {
		margin: -1px 0;
		@include border-radius(0);
		font-size: 15px;
	}
}

.si-facebook:hover,
.si-colored.si-facebook { background-color: $facebook !important; }
.si-delicious:hover,
.si-colored.si-delicious { background-color: $delicious !important; }
.si-paypal:hover,
.si-colored.si-paypal { background-color: $paypal !important; }
.si-flattr:hover,
.si-colored.si-flattr { background-color: $flattr !important; }
.si-android:hover,
.si-colored.si-android { background-color: $android !important; }
.si-smashmag:hover,
.si-colored.si-smashmag { background-color: $smashmag !important; }
.si-gplus:hover,
.si-colored.si-gplus { background-color: $gplus !important; }
.si-wikipedia:hover,
.si-colored.si-wikipedia { background-color: $wikipedia !important; }
.si-stumbleupon:hover,
.si-colored.si-stumbleupon { background-color: $stumbleupon !important; }
.si-foursquare:hover,
.si-colored.si-foursquare { background-color: $foursquare !important; }
.si-call:hover,
.si-colored.si-call { background-color: $call !important; }
.si-ninetyninedesigns:hover,
.si-colored.si-ninetyninedesigns { background-color: $ninetyninedesigns !important; }
.si-forrst:hover,
.si-colored.si-forrst { background-color: $forrst !important; }
.si-digg:hover,
.si-colored.si-digg { background-color: $digg !important; }
.si-spotify:hover,
.si-colored.si-spotify { background-color: $spotify !important; }
.si-reddit:hover,
.si-colored.si-reddit { background-color: $reddit !important; }
.si-blogger:hover,
.si-colored.si-blogger { background-color: $blogger !important; }
.si-cc:hover,
.si-colored.si-cc { background-color: $cc !important; }
.si-dribbble:hover,
.si-colored.si-dribbble { background-color: $dribbble !important; }
.si-evernote:hover,
.si-colored.si-evernote { background-color: $evernote !important; }
.si-flickr:hover,
.si-colored.si-flickr { background-color: $flickr !important; }
.si-google:hover,
.si-colored.si-google { background-color: $google !important; }
.si-instapaper:hover,
.si-colored.si-instapaper { background-color: $instapaper !important; }
.si-klout:hover,
.si-colored.si-klout { background-color: $klout !important; }
.si-linkedin:hover,
.si-colored.si-linkedin { background-color: $linkedin !important; }
.si-vk:hover,
.si-colored.si-vk { background-color: $vk !important; }
.si-rss:hover,
.si-colored.si-rss { background-color: $rss !important; }
.si-skype:hover,
.si-colored.si-skype { background-color: $skype !important; }
.si-twitter:hover,
.si-colored.si-twitter { background-color: $twitter !important; }
.si-youtube:hover,
.si-colored.si-youtube { background-color: $youtube !important; }
.si-vimeo:hover,
.si-colored.si-vimeo { background-color: $vimeo !important; }
.si-aim:hover,
.si-colored.si-aim { background-color: $aim !important; }
.si-yahoo:hover,
.si-colored.si-yahoo { background-color: $yahoo !important; }
.si-email3:hover,
.si-colored.si-email3 { background-color: $email3 !important; }
.si-macstore:hover,
.si-colored.si-macstore { background-color: $macstore !important; }
.si-myspace:hover,
.si-colored.si-myspace { background-color: $myspace !important; }
.si-podcast:hover,
.si-colored.si-podcast { background-color: $podcast !important; }
.si-cloudapp:hover,
.si-colored.si-cloudapp { background-color: $cloudapp !important; }
.si-dropbox:hover,
.si-colored.si-dropbox { background-color: $dropbox !important; }
.si-ebay:hover,
.si-colored.si-ebay { background-color: $ebay !important; }
.si-github:hover,
.si-colored.si-github { background-color: $github !important; }
.si-googleplay:hover,
.si-colored.si-googleplay { background-color: $googleplay !important; }
.si-itunes:hover,
.si-colored.si-itunes { background-color: $itunes !important; }
.si-plurk:hover,
.si-colored.si-plurk { background-color: $plurk !important; }
.si-pinboard:hover,
.si-colored.si-pinboard { background-color: $pinboard !important; }
.si-soundcloud:hover,
.si-colored.si-soundcloud { background-color: $soundcloud !important; }
.si-tumblr:hover,
.si-colored.si-tumblr { background-color: $tumblr !important; }
.si-wordpress:hover,
.si-colored.si-wordpress { background-color: $wordpress !important; }
.si-yelp:hover,
.si-colored.si-yelp { background-color: $yelp !important; }
.si-intensedebate:hover,
.si-colored.si-intensedebate { background-color: $intensedebate !important; }
.si-eventbrite:hover,
.si-colored.si-eventbrite { background-color: $eventbrite !important; }
.si-scribd:hover,
.si-colored.si-scribd { background-color: $scribd !important; }
.si-stripe:hover,
.si-colored.si-stripe { background-color: $stripe !important; }
.si-print:hover,
.si-colored.si-print { background-color: $print !important; }
.si-dwolla:hover,
.si-colored.si-dwolla { background-color: $dwolla !important; }
.si-statusnet:hover,
.si-colored.si-statusnet { background-color: $statusnet !important; }
.si-acrobat:hover,
.si-colored.si-acrobat { background-color: $acrobat !important; }
.si-drupal:hover,
.si-colored.si-drupal { background-color: $drupal !important; }
.si-buffer:hover,
.si-colored.si-buffer { background-color: $buffer !important; }
.si-pocket:hover,
.si-colored.si-pocket { background-color: $pocket !important; }
.si-bitbucket:hover,
.si-colored.si-bitbucket { background-color: $bitbucket !important; }
.si-stackoverflow:hover,
.si-colored.si-stackoverflow { background-color: $stackoverflow !important; }
.si-hackernews:hover,
.si-colored.si-hackernews { background-color: $hackernews !important; }
.si-xing:hover,
.si-colored.si-xing { background-color: $xing !important; }
.si-instagram:hover,
.si-colored.si-instagram { background-color: $instagram !important; }
.si-quora:hover,
.si-colored.si-quora { background-color: $quora !important; }
.si-openid:hover,
.si-colored.si-openid { background-color: $openid !important; }
.si-steam:hover,
.si-colored.si-steam { background-color: $steam !important; }
.si-amazon:hover,
.si-colored.si-amazon { background-color: $amazon !important; }
.si-disqus:hover,
.si-colored.si-disqus { background-color: $disqus !important; }
.si-plancast:hover,
.si-colored.si-plancast { background-color: $plancast !important; }
.si-appstore:hover,
.si-colored.si-appstore { background-color: $appstore !important; }
.si-pinterest:hover,
.si-colored.si-pinterest { background-color: $pinterest !important; }
.si-fivehundredpx:hover,
.si-colored.si-fivehundredpx { background-color: $fivehundredpx !important; }


/* Social Icons Text Color
-----------------------------------------------------------------*/

.si-text-color.si-facebook i { color: $facebook; }
.si-text-color.si-delicious i { color: $delicious; }
.si-text-color.si-paypal i { color: $paypal; }
.si-text-color.si-flattr i { color: $flattr; }
.si-text-color.si-android i { color: $android; }
.si-text-color.si-smashmag i { color: $smashmag; }
.si-text-color.si-gplus i { color: $gplus; }
.si-text-color.si-wikipedia i { color: $wikipedia; }
.si-text-color.si-stumbleupon i { color: $stumbleupon; }
.si-text-color.si-foursquare i { color: $foursquare; }
.si-text-color.si-call i { color: $call; }
.si-text-color.si-ninetyninedesigns i { color: $ninetyninedesigns; }
.si-text-color.si-forrst i { color: $forrst; }
.si-text-color.si-digg i { color: $digg; }
.si-text-color.si-spotify i { color: $spotify; }
.si-text-color.si-reddit i { color: $reddit; }
.si-text-color.si-blogger i { color: $blogger; }
.si-text-color.si-cc i { color: $cc; }
.si-text-color.si-dribbble i { color: $dribbble; }
.si-text-color.si-evernote i { color: $evernote; }
.si-text-color.si-flickr i { color: $flickr; }
.si-text-color.si-google i { color: $google; }
.si-text-color.si-instapaper i { color: $instapaper; }
.si-text-color.si-klout i { color: $klout; }
.si-text-color.si-linkedin i { color: $linkedin; }
.si-text-color.si-vk i { color: $vk; }
.si-text-color.si-rss i { color: $rss; }
.si-text-color.si-skype i { color: $skype; }
.si-text-color.si-twitter i { color: $twitter; }
.si-text-color.si-youtube i { color: $youtube; }
.si-text-color.si-vimeo i { color: $vimeo; }
.si-text-color.si-aim i { color: $aim; }
.si-text-color.si-yahoo i { color: $yahoo; }
.si-text-color.si-email3 i { color: $email3; }
.si-text-color.si-macstore i { color: $macstore; }
.si-text-color.si-myspace i { color: $myspace; }
.si-text-color.si-podcast i { color: $podcast; }
.si-text-color.si-cloudapp i { color: $cloudapp; }
.si-text-color.si-dropbox i { color: $dropbox; }
.si-text-color.si-ebay i { color: $ebay; }
.si-text-color.si-github i { color: $github; }
.si-text-color.si-googleplay i { color: $googleplay; }
.si-text-color.si-itunes i { color: $itunes; }
.si-text-color.si-plurk i { color: $plurk; }
.si-text-color.si-pinboard i { color: $pinboard; }
.si-text-color.si-soundcloud i { color: $soundcloud; }
.si-text-color.si-tumblr i { color: $tumblr; }
.si-text-color.si-wordpress i { color: $wordpress; }
.si-text-color.si-yelp i { color: $yelp; }
.si-text-color.si-intensedebate i { color: $intensedebate; }
.si-text-color.si-eventbrite i { color: $eventbrite; }
.si-text-color.si-scribd i { color: $scribd; }
.si-text-color.si-stripe i { color: $stripe; }
.si-text-color.si-print i { color: $print; }
.si-text-color.si-dwolla i { color: $dwolla; }
.si-text-color.si-statusnet i { color: $statusnet; }
.si-text-color.si-acrobat i { color: $acrobat; }
.si-text-color.si-drupal i { color: $drupal; }
.si-text-color.si-buffer i { color: $buffer; }
.si-text-color.si-pocket i { color: $pocket; }
.si-text-color.si-bitbucket i { color: $bitbucket; }
.si-text-color.si-stackoverflow i { color: $stackoverflow; }
.si-text-color.si-hackernews i { color: $hackernews; }
.si-text-color.si-xing i { color: $xing; }
.si-text-color.si-instagram i { color: $instagram; }
.si-text-color.si-quora i { color: $quora; }
.si-text-color.si-openid i { color: $openid; }
.si-text-color.si-steam i { color: $steam; }
.si-text-color.si-amazon i { color: $amazon; }
.si-text-color.si-disqus i { color: $disqus; }
.si-text-color.si-plancast i { color: $plancast; }
.si-text-color.si-appstore i { color: $appstore; }
.si-text-color.si-pinterest i { color: $pinterest; }
.si-text-color.si-fivehundredpx i { color: $fivehundredpx; }

.si-text-color:hover { color: $si_text_color; }