/*  */
/** ---------------------------------------- */
/** SOCIAL */

#socialbar {
	position: relative;
	width: 600px;
	margin-top: 32px;
	text-align: center;
}

a.social {
	display: inline-block;
	width: 23px;
	height: 23px;
	background-size: 23px 23px;
	background-repeat: no-repeat;
	margin-left: 15px;
	margin-right: 15px;
}

#twitter {
	background-image: url("/static/images/SocialTwitterWhite@2x.png");
}
#twitter:hover {
	background-image: url("/static/images/SocialTwitterGreen@2x.png");
}
.tint-4peaks #twitter:hover {
	background-image: url("/static/images/SocialTwitterPink@2x.png");
}
.tint-enzymex #twitter:hover {
	background-image: url("/static/images/SocialTwitterYellow@2x.png");
}
.tint-about #twitter:hover {
	background-image: url("/static/images/SocialTwitterBlue@2x.png");
}
.tint-support #twitter:hover {
	background-image: url("/static/images/SocialTwitterMoss@2x.png");
}
.tint-df #twitter:hover {
	background-image: url("/static/images/SocialTwitterCyan@2x.png");
}
#twitter:active {
	background-image: url("/static/images/SocialTwitterBlack@2x.png");
}

#facebook {
	background-image: url("/static/images/SocialFacebookWhite@2x.png");
}
#facebook:hover {
	background-image: url("/static/images/SocialFacebookGreen@2x.png");
}
.tint-4peaks #facebook:hover {
	background-image: url("/static/images/SocialFacebookPink@2x.png");
}
.tint-enzymex #facebook:hover {
	background-image: url("/static/images/SocialFacebookYellow@2x.png");
}
.tint-about #facebook:hover {
	background-image: url("/static/images/SocialFacebookBlue@2x.png");
}
.tint-support #facebook:hover {
	background-image: url("/static/images/SocialFacebookMoss@2x.png");
}
.tint-df #facebook:hover {
	background-image: url("/static/images/SocialFacebookCyan@2x.png");
}
#facebook:active {
	background-image: url("/static/images/SocialFacebookBlack@2x.png");
}

#google {
	background-image: url("/static/images/SocialGooglePlusWhite@2x.png");
}
#google:hover {
	background-image: url("/static/images/SocialGooglePlusGreen@2x.png");
}
.tint-4peaks #google:hover {
	background-image: url("/static/images/SocialGooglePlusPink@2x.png");
}
.tint-enzymex #google:hover {
	background-image: url("/static/images/SocialGooglePlusYellow@2x.png");
}
.tint-about #google:hover {
	background-image: url("/static/images/SocialGooglePlusBlue@2x.png");
}
.tint-support #google:hover {
	background-image: url("/static/images/SocialGooglePlusMoss@2x.png");
}
.tint-df #google:hover {
	background-image: url("/static/images/SocialGooglePlusCyan@2x.png");
}
#google:active {
	background-image: url("/static/images/SocialGooglePlusBlack@2x.png");
}

#github {
	background-image: url("/static/images/SocialGitHubWhite@2x.png");
}
#github:hover {
	background-image: url("/static/images/SocialGitHubGreen@2x.png");
}
.tint-4peaks #github:hover {
	background-image: url("/static/images/SocialGitHubPink@2x.png");
}
.tint-enzymex #github:hover {
	background-image: url("/static/images/SocialGitHubYellow@2x.png");
}
.tint-about #github:hover {
	background-image: url("/static/images/SocialGitHubBlue@2x.png");
}
.tint-support #github:hover {
	background-image: url("/static/images/SocialGitHubMoss@2x.png");
}
.tint-df #github:hover {
	background-image: url("/static/images/SocialGitHubCyan@2x.png");
}
#github:active {
	background-image: url("/static/images/SocialGitHubBlack@2x.png");
}

/*  */
/** ---------------------------------------- */
/** COPYRIGHT */

#copyright-wrapper {
	position: relative;
	width: 882px;
	margin-top: 34px;
}

#copyright {
	position: relative;
	width:700px;
	padding-top: 22px;
	padding-bottom: 22px;
	text-align: center;
	font-size: 11px;
	line-height: 16px;
	color: #6D6D6D;
}


/*  */
/** ---------------------------------------- */
/** MEDIA QUERY: 900 PX */

/* iPhone 6  = 750 px */
/* iPhone 6+ = 828 px */

@media screen and (max-width: 900px) {
	
	#copyright-wrapper {
		width: 670px;
	}
	#copyright {
		width: 670px;
	}
	
	#socialbar {
		width: 600px;
		margin-top: 20px;
	}
}


/*   */
/** MEDIA QUERY: 700 PX */

/* iPhone 5S = 640 px */
@media screen and (max-width: 700px) {
	
	#copyright-wrapper {
		width: 300px;
	}
	#copyright {
		width: 280px;
	}
	
	#socialbar {
		width: 300px;
		margin-top: 10px;
	}

	a.social {
		margin-left: 10px;
		margin-right: 10px;
	}
}