@charset "UTF-8";

html { }

body { margin: 0; padding: 0 0 36px 0; background: #FFF url(../images/bg-lightpaperfibers.png) repeat; font: 700 1em "Source Sans Pro", Tahoma, Geneva, sans-serif; color: #333; }

nav { position: absolute; top: 25px; right: 25px; }
nav a { margin-right: 5px; opacity:  0.78; transition: 0.5s; color: #333; }
nav a:last-child { margin-right: 0; }
nav a:hover { opacity: 1; }
nav a img { width: 30px; height: 30px; }

.wrapper { margin: 0 auto; width: calc(100% - 50px); max-width: 960px; }

#logo { position: fixed; right: 25px; bottom: 36px; width: 127px; height: 86px; z-index: 10; overflow: hidden; cursor: pointer; }
#blurb {  position: relative; margin: 80px auto 20px auto; }

#logo img {	max-width:  100%; }
#logo div { position: absolute; }
#logo .email-box { bottom: -200px left: -2.5px; width: 131px; height: 90px; background: #fff; z-index: 1; }
#logo .email-top { top: -200px; left: -2.5px; width: 131px; height: 93px; background: url(../images/email-top.png) no-repeat; z-index: 4; }
#logo .email-left { top: -2.5px; left: -200px; width: 119px; height: 91px; background: url(../images/email-left.png) no-repeat; z-index: 2; }
#logo .email-right { top: -2.5px; right: -200px; width: 119px; height: 91px; background: url(../images/email-right.png) no-repeat; z-index: 3; }

h1 { margin: 20px 0; padding: 0; font: bold 3.75em/1.2 "Source Sans Pro", Tahoma, Geneva, sans-serif; color: #333; text-decoration: none; text-transform: lowercase; text-shadow: 1px 1px #FFF, 1px 1px 1px rgba(0,0,0,0.5); letter-spacing: 0.05em; transition: 0.15s; }

header { clear: both; }

section { clear: both; }

footer { font-weight: 400; }

a { color: #333; text-decoration: none; transition: 0.5s; }
a:hover { color: #666; }

#showcase { position: relative; }

#showcase ul { margin: 0 0 3em 0; padding: 0; list-style: none; }
#showcase ul li { display: inline; margin: 0; padding: 0; font-size: 2.4em; color: #333; }
#showcase ul li:first-child { margin: 0; }
#showcase ul li:after { margin: 0 5px 0 0; content: ','; color: #333; }
#showcase ul li:last-child:after { content: ''; }
#showcase ul li a { color: #333; text-decoration: none; transition: 0.5s; }
#showcase ul li a:hover { color: #666; }

#showcase p { font-size: 18px; }
#showcase a { color: #666; text-decoration: none; text-shadow: 1px 1px #fff, 1px 1px 1px rgba(0, 0, 0, 0.5); transition: 0.5s; }
#showcase a:hover { color: #c00; }
#showcase small { display: block; font-size: 14px; }

@media screen and (min-width: 768px) and (max-width: 959px) {
	#showcase ul { max-width: calc(100% - 152px); }
	#showcase ul li { font-size: 2.1em; }
}

@media screen and (min-width: 768px) {
	.wrapper {
		position: relative;
	}
}

@media screen and (max-width: 767px) {
	#logo { position: absolute; top: 25px; left: 25px; }
	#blurb { margin-top: 120px; }
}

@media screen and (min-width: 600px) and (max-width: 767px) {
	h1 { font-size: 3em; line-height: 60px; }
	#showcase ul { max-width: calc(100% - 152px); }
	#showcase ul li { font-size: 2em; }
}

@media screen and (min-width: 480px) and (max-width: 599px) {
	h1 { font-size: 2.3em; }
	#showcase ul li { font-size: 1.8em; }
}

@media screen and (max-width: 479px) {
	h1 { font-size: 1.4em; line-height: 80px; }
	#showcase ul li { font-size: 1.2em; }
}