/**** Social CSS ****/


/* General Colors */

.socialIcon {height: 20px;	width: 20px; }

.socialwrapper {text-align: center; position:absolute; width:100%; }

.socialLinks {
position: absolute; 
right: 210px; 
right: calc(50% - 960px / 2 + 200px);
top: 18px; 
z-index: 2000; 
margin-right:10px;
-webkit-transform-origin: 100% 0;
transform-origin: 100% 0;
-webkit-transition-property: min-height, width, top, right;
transition-property: margin-right, top, right;
-webkit-transition-duration: 0.5s;
transition-duration: 0.5s;
-webkit-transition-timing-function: cubic-bezier(0.7,0,0.3,1);
transition-timing-function: cubic-bezier(0.7,0,0.3,1);

}

.socialLinks a {
		display: block;
		background: transparent;
		float: left;
		height: 32px;
		margin: 3px;
		position: relative;
		width: 32px;
		}

.socialIcon {
			left: 50%;
			margin: -10px 0 0 -10px;
			position: absolute;
			top: 50%;
			fill: #999;
}
.facebook .socialIcon:hover {
		fill: rgb(59,89,152);
		}
.googleplus .socialIcon:hover {
		fill: rgb(221,75,57);
		}
.pinterest .socialIcon:hover {
		fill: rgb(204,34,41); 
		}
.twitter .socialIcon:hover {
		fill: rgb(85,172,238);
		}	
.instagram .socialIcon:hover {
		fill: rgb(207,181,143);
		}
		
@media screen and (max-width: 960px) {

.socialLinks {
		margin-right:0;
		right: 10px; 
		top: 70px; 
	}

}

@media screen and (max-width: 670px) {
	.socialLinks {
		margin-right:0;
		right: 10px; 
		top: 70px; 
	}
}