@charset "UTF-8";

/*===================== Structure =====================*/
* {
	margin: 0;
	padding: 0;
}

body {
	background: #f6dcb3 url(images/backgroundTexture.png) repeat;
	font: 100% Helvetica, Arial, Verdana, sans-serif;
	text-align: center;
	color: #3e3e3e;
}

#wrapper {
	width: 100%;
	position: relative;
}

.texture {
	background: url(images/foregroundTexture.png) repeat;
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 1;
}

#content {
	width: 48em;
	margin: 2.7em auto 1em;
	padding: 2em;
	border: 1em #3e3e3e solid;
	position: relative;
}

#footer {
	margin-bottom: 40em;
	font-size: .7em;
}

img { border: none; }

/*===================== Navigation =====================*/
.nav {
	width: 100%;
	margin: 2em auto 1em;
}

#homeSection .nav { margin: -3.4em auto 0; }

#homeSection .nav a, .nav a {
	text-decoration: none;
	color: #f6dcb3;
	position: relative;
	left: 0;
	top: 0;
	z-index: 2;
	transition: all 10s ease;
	-moz-transition: all 10s ease;
	-webkit-transition: all 10s ease;
	-o-transition: all 10s ease;
}

.navLinks li {
	background-color: #3e3e3e;
	height: 100%;
	padding: .25em 1em;
	font: 500 1.4em 'Kelly Slab';
	color: #f6dcb3;
	list-style-type: none;
	display: inline-block;
	position: relative;
	margin-right: -4px;
}

.navLinks li:first-child {
	padding-left: 1.5em;
	border-top-left-radius: 2em;
	border-bottom-left-radius: 2em;
	-moz-border-radius-topleft: 2em;
	-moz-border-radius-bottomleft: 2em;
	-webkit-border-top-left-radius: 2em;
	-webkit-border-bottom-left-radius: 2em;
	-o-border-top-left-radius: 2em;
	-o-border-bottom-left-radius: 2em;
}

.navLinks li:last-child {
	padding-right: 1.5em;
	border-top-right-radius: 2em;
	border-bottom-right-radius: 2em;
	-moz-border-radius-topright: 2em;
	-moz-border-radius-bottomright: 2em;
	-webkit-border-top-right-radius: 2em;
	-webkit-border-bottom-right-radius: 2em;
	-o-border-top-right-radius: 2em;
	-o-border-bottom-right-radius: 2em;
}

.navLinks li:hover, .navLinks li:focus { background-color: #d44441; }

/*===================== Home Section =====================*/
#homeSection, #portfolioSection, #cvResumeSection {
	margin-bottom: 40em;
	position: relative;
}

#portfolioSection, #cvResumeSection, #contactSection { margin-top: 40em; }

#homeSection h1 {
	font: 3.925em 'Holtwood One SC';
	text-align: center;
	text-transform: uppercase;
	position: relative;
}

#homeSection h2 {
	width: 100%;
	margin-top: -.25em;
	font: 2.5em 'Lobster';
	text-align: center;
	text-transform: capitalize;
	border-top: .15em #3e3e3e solid;
	border-bottom: .15em #3e3e3e solid;
}

#homeSection h3 {
	font: 2.7em 'Kelly Slab';
	text-transform: uppercase;
	text-align: center;
	margin-top: .2em;
}

#homeSection h4 {
	margin-top: -.3em;
	font: 500 5.15em 'Oswald';
	text-align: center;
	text-transform: uppercase;
}

.starLeft {
	height: .75em;
	margin-right: .3em;
}

.starRight {
	height: .75em;
	margin-left: .3em;
}

#homeSection .star {
	height: .75em;
	margin: 0 1%;
}

#homeSection .banner {
	width: 100%;
	height: 15em;
	margin: 1.4em 0 1.9em;
}

#homeSection .banner img { width: 100%; }

/*===================== Quote One Section =====================*/
#quoteOne, #quoteTwo, #quoteThree, #quoteFour {
	width: 36em;
	margin: 0 auto;
	text-align: center;
}

.arrow { width: 6em; }

.verticalRule {
	background-color: #3e3e3e;
	width: .15em;
	height: 15em;
	margin: -.5em auto;
}

.bracket { width: 100%; }

#quoteOne h4 {
	margin-top: -.2em;
	font: 7.5em 'Oswald';
	text-transform: uppercase;
}

#quoteOne h5 {
	margin-top: -.6em;
	font: 3.3em 'Lobster';
	text-transform: lowercase;
}

#quoteOne h6 {
	margin-top: -.1em;
	font: 4em 'Rye';
	text-transform: uppercase;
}

.author {
	margin-top: -.5em;
	font-family: 'Oswald';
	text-transform: uppercase;
	text-align: right;
}

/*===================== Gallery Section =====================*/
#portfolioSection h1 {
	margin-top: .4em;
	border-top: .15em #3e3e3e double;
	border-bottom: .15em #3e3e3e double;
	font: 3.7em 'Rye';
	text-align: center;
	text-transform: uppercase;
}

#the {
	height: .8em;
	margin-right: .2em;
}

#portfolioSection h2 {
	margin-top: .1em;
	font: 2.5em 'Lobster';
	text-align: center;
	text-transform: capitalize;
}

#portfolioSection h3 {
	margin-top: 4em;
	font: 2.55em/100% 'Kelly Slab';
	text-align: center;
	text-transform: uppercase;
}

#portfolioSection .star {
	height: .75em;
	margin: 0 .1em;
}

#slider {
	width: 60em;
	margin: .6em -6em;
}

#sliderViewPort {
	width: 40em;
	margin: .25em auto 2.25em;
	border: 1em #fff solid;
	overflow: hidden;
	position: relative;
	z-index: 10;
	-webkit-box-shadow: 0 5px 20px rgba(0, 0, 0, 0.5);
	-moz-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
	box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
}

#sliderViewPort ul {
	list-style: none;
	position: relative;
}

#sliderViewPort ul li {
	width: 40em;
	float: left;
}

.sliderImage {
	background-color: #3e3e3e;
	width: 40em;
	height: 22.5em;
	text-align: center;
	float: left;
	overflow: hidden;
}

.sliderImage img { width: 100%; }

.titleLink {
	font-weight: bold;
	text-decoration: underline;
	color: #fff;
}

.sliderHidden { visibility: hidden; }

#sliderNav {
	margin-top: -19em;
	width: 100%;
	height: 8em;
}

.sliderNavLink {
	background-color: #3e3e3e;
	width: 50%;
	height: 100%;
	float: left;
	border-radius: 4em;
	-moz-border-radius: 4em;
	-webkit-border-radius: 4em;
	-o-border-radius: 4em;
}

.sliderNavLink:hover { background-color: #d44441; }

#sliderNav img {
	width: 100%;
	position: relative;
	left: 0;
	top: 0;
	z-index: 2;
}

#sliderNavPrev {
	width: 7em;
	float: left;
	cursor: pointer;
	margin-top: 2.4em;
	margin-left: 1em;
}

#sliderNavNext {
	width: 7em;
	float: right;
	margin-top: 2.45em;
	margin-right: 1em;
	cursor: pointer;
}

#sliderViewPort a {
	text-decoration: none;
	position: relative;
	left: 0;
	top: 0;
	z-index: 2;
}

/*===================== Quote Two Section =====================*/
#quoteTwo h3 {
	margin-top: -.16em;
	font: 7.25em 'Rye';
	text-transform: uppercase;
}

#quoteTwo h4 {
	margin-top: -.3em;
	font: 6.75em Georgia, "Times New Roman", Times, serif;
	text-transform: lowercase;
}

#quoteTwo h5 { font: 3.3em 'Fredericka the Great'; }

#quoteTwo h6 {
	margin: -.25em 0 -.25em;
	font: 6em 'Oswald';
	text-transform: uppercase;
}

/*===================== CV/Resume Section =====================*/
#cvResumeSection h1 {
	margin-bottom: .25em;
	font: 3.9em 'Fredericka the Great';
	text-transform: uppercase;
	text-align: center;
}

#cvResumeSection .star {
	height: .75em;
	margin: 0 .1em;
}

#cvResumeInfo {
	width: 100%;
	display: inline-block;
}

#cvResumeSection h2 {
	font: 2em 'Lobster';
	text-transform: capitalize;
}

#pdf { height: 2em; }

#cvResumeSection .col1 {
	margin-right: .75em;
	width: 19em;
	text-align: left;
	float: left;
}

#cvResumeSection .col2 {
	width: 8.5em;
	text-align: center;
	float: left;
}

#cvResumeSection .col2 img { width: 100%; }

#cvResumeSection .col3 {
	margin-left: .75em;
	width: 19em;
	text-align: right;
	float: right;
}

#cvResumeSection p {
	margin-bottom: 1.25em;
	font: .9em/140% Georgia, "Times New Roman", Times, serif;
}

#downloadPDF {
	background: url(images/pdf.png) no-repeat left top;
	height: .75em;
	margin-top: 1em;
	padding: .4em 0 .6em;
	font: 1.5em 'Kelly Slab';
	text-transform: uppercase;
}

#downloadPDF a {
	text-decoration: none;
	color: #3e3e3e;
	position: relative;
	left: 0;
	top: 0;
	z-index: 2;
}

#downloadPDF a:hover, #downloadPDF a:focus { color: #d44441; }

#downloadPDF:hover, #downloadPDF:focus { background: url(images/pdfRed.png) no-repeat left top; }

/*===================== Quote Three Section =====================*/
#quoteThree h3 {
	margin-top: -.3em;
	font: 7.25em 'Holtwood One SC';
	text-transform: uppercase;
}

#quoteThree h4 {
	margin-top: -.7em;
	font: 4.75em 'Oswald';
	text-transform: uppercase;
}

#quoteThree h5 {
	margin: -.3em 0 -.3em;
	font: 3.75em 'Lobster';
}

#quoteThree h6 {
	margin-top: -.6em;
	font: 4.2em 'Kelly Slab';
	text-transform: uppercase;
}

/*===================== Contact Section =====================*/
#contactSection .banner {
	width: 100%;
	height: 15em;
	margin-top: 1.25em;
	padding: 1em 0;
	border-top: .3em #3e3e3e solid;
	border-bottom: .3em #3e3e3e solid;
	display: inline-block;
}

#contactSection .col1, #contactSection .col2 {
	width: 16em;
	height: 14em;
	margin-right: .5em;
	float: left;
}

#contactSection .col1 img, #contactSection .col3 img {
	width: 16em;
	margin-top: .3em;
}

#contactSection .col2 {
	background-color: #3e3e3e;
	width: 15em;
	height: 15em;
	border-radius: 7.5em;
	-moz-border-radius: 7.5em;
	-webkit-border-radius: 7.5em;
	-o-border-radius: 7.5em;
	overflow: hidden;
}

#contactSection h1 {
	margin-top: 1.2em;
	font: 100 4em 'Oswald';
	color: #f6dcb3;
	text-align: center;
}

#contactSection .col3 {
	width: 16em;
	height: 14em;
	float: left;
}

#contactSection h2 {
	margin-bottom: -.625em;
	font: 3.5em 'Lobster';
	text-transform: capitalize;
}

#contactSection h3 {
	font: 4.5em 'Holtwood One SC';
	text-transform: capitalize;
}

#contactSection h4 {
	margin-top: .125em;
	font: 3.5em 'Kelly Slab', Helvetica;
	text-transform: uppercase;
	text-align: center;
}

#contactSection h5 {
	margin-top: -.25em;
	font: 4.1em 'Diplomata SC';
	text-transform: uppercase;
	text-align: center;
}

#hrDecor {
	width: 70%;
	margin-top: 0;
}

#contactSection h6 {
	margin-top: .125em;
	font: 3.4em/100% 'Lobster';
	text-transform: capitalize;
}

#contactLinks a {
	text-decoration: none;
	color: #3e3e3e;
	position: relative;
	left: 0;
	top: 0;
	z-index: 2;
}

#contactSection h4 a:hover, #contactSection h4 a:focus, #contactSection h5 a:hover, #contactSection h5 a:focus {
	color: #d44441;
	position: relative;
	left: 0;
	top: 0;
	z-index: 10;
}

/*===================== Quote Four Section =====================*/
#quoteFour { margin-bottom: 2em; }

#quoteFour h6 {
	margin-top: 0;
	font: 2.7em 'Oswald';
	text-transform: uppercase;
}
