/* GENERAL */



#wrapper {

	max-width: 940px;

	margin: 0 auto;	

	padding: 0 5%;

}



body {

	font-family: "Open Sans", sans-serif;	

}



a {

	text-decoration: none;

	color: #6ab47b;

}



img {

	max-width: 100%;	

}



h3 {

	margin: 0 0 1em 0;

}





/* HEADING */



header {

 float: left;

	margin: 0 0 30px 0;

	padding: 5px 0 0 0;

	width: 100%;

}



#logo {

	text-align: center;

	margin: 0;

}



h1 {

	font-family: 'Open Sans', sans-serif;

	margin: 15px 0;

	font-size: 1.75em;	

	font-weight: normal;

	line-height: 0.8em;

}



h2 {

	font-size: 0.75em;

	margin: -5px 0 0;

	font-weight: normal;

}



/* NAVIGATION */



nav {

	text-align: center;

	padding: 10px 0;

	margin: 20px 0 0;

}



nav ul {

	list-style: none;

	margin: 0 10px;

	padding: 0

}



nav li {

	display: inline-block;

}



nav a {

	font-weight: 800;

	padding: 15px 10px;

}



h1, h2 {

	color: #fff;	

}





/* FOOTER */



footer {

	font-size: 0.75em;

	text-align: center;

	padding-top: 50px;

	color: #ccc;

	clear: both;

}



.social-icon {

	width: 20px;

	height: 20px;

	margin: 0 5px;

}





/* PAGE: PORTFOLIO */



#gallery {

	margin: 0;

	padding: 0;

	list-style: none;

}



#gallery li {

	float: left;

	width: 45%;

	margin: 2.5%;

	background-color: #f5f5f5;

	color: #bdc3c7;

}



#gallery li a p {

	margin: 0;

	padding: 5%;

	font-size: 0.75em;

	color: #bdc3c7;

}





/* PAGE: ABOUT */



.profile-photo {

	display: block;

	max-width: 150px;

	margin: 0 auto 30px;

	border-radius: 100%;

}





/* PAGE: CONTACT */



.contact-info {

	list-style: none;

	padding: 0;

	margin: 0;

	font-size: .85em;

}



.contact-info a {

	display: block;

	min-height: 20px;

	background-repeat: no-repeat;

	background-size: 20px 20px;

	padding: 0 0 0 30px;

	margin: 0 0 5px;

}



.contact-info li.phone a {

	background-image: url(../img/phone.png);

}



.contact-info li.mail a {

		background-image: url(../img/mail.png);

}



.contact-info li.twitter a {

		background-image: url(../img/twitter.png);

}



.contact-info li.phone a:hover {

	cursor: default;

}



.contact-info li.mail a:hover {

	cursor: default;

}



/* COLORS */



nav {

	background-color: #599a68;	

}



nav a, nav a:visited {

	color: #fff

}



nav a.selected, nav a:hover {

	color: #32673f;	

}



body {

	background: #fff;

	color: #999;	

}



header {

	background: #6ab47b;

	border-color: #599a68;	

}