/* Stylesheet by Mark Fischer (Top Page Design)
 * Copyright 2014
 */

/* DEFAULTS */
html {
	font-family: 'Roboto Slab', serif;
	font-size: 24px;
	background: #EEE;
}
html, body {
	height: 100%;
}
html * {
	box-sizing: border-box;
}

h1, h2, h3, h4, h5, h6 {
	font-weight: normal;
	font-family: 'Oswald', sans-serif;
	text-align: center;
}
h1 {
	color: #32e3b3;
}
h2 {
	color: #53391f;
}

a {
	text-decoration: none;
	transition: 200ms;
	color: #65E3C1;
}
a.button {
	background-color: #65E3C1;
	border-radius: 5px;
	padding: .2em;
	color: #fff;
}
#follow a.button {
	background-color: #201300;
	color: #fff;
}


ul.nobullets {
	list-style: none;
	padding: 0;
	margin: 0;
}

table.gallery {
	width: 100%;
}

table.form {
	width: 60%;
	margin: 0 20%;
}
table.form td {
	padding: 0;
	margin: 0;
}

input, textarea, select, option {
	background: #201300;
	color: #FFD088;
	border: none;
	padding: 5px;
}
input:active, input:focus,
textarea:focus, textarea:active,
input[type='submit']:hover, input[type='submit']:active {
	background: #53391F;
}
input {
	width: 50%;
	float: left;
}
input[type="submit"], select {
	width: 100%;
}
textarea {
	width: 100%;
}

section {
	overflow: hidden;
	text-align: center;
	padding-bottom: 3em;
	padding-top: 1em;
}
section img {
	max-width: 100%;
	margin: 0 auto;
}
section figure {
	text-align: center;
	width: 80%;
	margin: 0 10%;
	margin-bottom: 3em;
}
section figure img {
	width: 100%;
}
section.text {
	padding-left: 20%;
	padding-right: 20%;
}
section.text h1 {
	border-bottom: 1px solid #65E3C1;
}
section.grey {
	background-color: #E8ECED;
}
section.teal {
	background-color: #65e3c1;
}
section.teal, section.teal h1 {
	color: #201300;
}
section.white {
	background-color: #fff;
}
section.brown {
	color: #65e3c1;
	background-color: #201300;
}
section.scrollbg {
	background-attachment: fixed;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	min-height: 300px;
}

/* HEADER */
header.main {
	background-color: #201300;
	overflow: hidden;
}
header.main .logo {
	padding: 13px 1%;
	float: left;
	height: 88px;FFF
}
header.main .menu-button {
	float: right;
	padding: 20px 1%;
	font-size: 24px;
}
#navicon {
	color: #86623E;
}
#navicon:hover {
	color: #65e3c1;
}

/* POPUP NAV */
#popup-nav {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	background: rgba(0,0,0,.8);
	text-align: center;
	overflow: auto !important;
}
#close-popup-nav {
	position: fixed;
	top: 0;
	right: 0;
	display: block;
	color: #fff;
	padding: 1%;
}

/* SECTIONS */
#welcome {
	background-image: url('../images/backgrounds/welcome.gif');
	background-size: auto 100%;
	background-repeat: no-repeat;
	background-position: right;
	background-color: #201300;
	min-height: 90%;
	color: #fff;
	font-size: 1.5em;
}
#welcome h1 {
	color: #65e3c1;
	text-shadow: 0 0 5px #000;
}
#welcome h2 {
	color: #86623E;
}
#more {
	cursor: pointer;
	color: #53391F;
	transition: 100ms;
}
#more:hover {
	color: #65e3c1;
}
/*#welcome h2 {
	color: #FFD088;
}*/

#projects img {
	width: 90%;
}

#follow {
	background-color: #53391f;
	color: #201300;
	padding-bottom: 100px;
}
#follow h1, #follow h2 {
	color: inherit;
}
#follow i {
	padding: 0 3%;
}
#follow a {
	color: #201300;
}
#follow .social-google-plus:hover {
	color: #FF3530;
}
#follow .social-twitter:hover {
	color: #55ACEE;
}
#follow .social-facebook:hover {
	color: #3B599E;
}

/* FOOTER */
footer.main {
	background-color: #201300;
	overflow: hidden;
	padding: 3%;
	padding-bottom: 0;
	text-align: center;
	color: #53391f;
}
footer.main a {
	color: #53391f;
}
footer.main a:hover {
	color: #65E3C1;
}
footer.main table {
	width: 50%;
	margin: 0 auto;
	text-align: center;
}
footer.main p {
	font-size: 18px;
	padding-top: 1em;
}



/* MOBILE OPTIMIZATION */
@media (max-width: 60em) {
	html {
		font-size: 14px;
	}
	#more, #welcome h2 {
		color: #FFD088;
	}
}