﻿
#Social {
	margin: 1rem 0;
	text-align: center;
}

#Social > .socialInner {
	display: inline-block;
	position: relative;
	font-size: .8rem;
}

#Social .links a {
	margin: 0;
	padding: .4rem .3rem;
	display: inline-block;
	color: #ffffff;
	font-size: 1rem;
	font-weight: normal;
	line-height: 0;
	text-transform: none;
	text-decoration: none;
	border-bottom: none;
}
#Social .shares {
	max-width: 400px;
	margin: 0 auto;
	padding: 0 .6rem .6rem .6rem;
	display: none;
}
#Social .shares ul,
#Social .shares li {
	margin: 0;
	padding: 0;
	background: none;
	text-align: center;
}

#Social .shares h2 {
	margin: .5rem;
	display: block;
	color: #ffffff;
	line-height: 2.2rem;
	white-space: nowrap;
}

#Social .shares .close {
	display: none;
}

#Social .shares ul,
#Social .shares ul li {
	display: inline-block;
}
#Social .shares ul li a {
	padding: .4rem;
	display: block;
	color: #ffffff;
	font-size: 1.2rem;
	text-align: left;
	white-space: nowrap;
}
#Social .shares ul li a i {
	padding: 0 .4rem 0 0;	
}

@media (min-width: 1100px) {
	
	#Social {
		position: fixed;
		top: 3rem;
		right: 0;
		color: #ffffff;
		z-index: 1199;
		background-color: #032d53;
		border: 1px solid #032d53;
		border-right: none;
		border-bottom-left-radius: 10px;
		border-top-left-radius: 10px;
		box-shadow: 0.2rem 0.2rem 0.15rem 0 rgba(0, 0, 0, 0.4);
	}

	#Social .links a {
		display: block;
	}

	#Social .shares {
		position: absolute;
		top: -1px; right: 0;
		display: none;
		text-align: left;
		background-color: #032d53;
		border: 1px solid #032d53;
		border-bottom-left-radius: 10px;
		border-top-left-radius: 10px;
	}
	
	#Social .shares h2 {
		margin: 0 0 .3rem 1rem;
		color: #ffffff;
		font-size: .8rem;
	}
	#Social .shares .close {
		color: #ffffff;
		display: block;
		position: absolute;
		top: .5rem; left: .6rem;
	}
	#Social .shares ul,
	#Social .shares ul li {
		text-align: left;
		font-size: .7rem;
	}
	#Social .shares ul li a,
	#Social .shares ul li a i {
		color: #ffffff;
	}
	#Social .shares ul li a i {
		padding: 0 1.5rem 0 0;	
	}
}

@media (max-width: 479px) {
	
	#Social .shares ul li {
		display: block;
	}
}