/*TYPOGRAPHY*/

body {
	font-weight:500;
	color:#323232;
	font-family: "Montserrat", sans-serif;
}

h1, h2, h3, h4, h5, h6 {
	font-family: "Karla", sans-serif;
}

h1, .h1{
	font-size:24px;
	line-height: 28px;
	font-weight:900;
	text-transform: uppercase;
	font-family: "Montserrat", sans-serif;
	margin-bottom: 30px;	
}

h2, .h2{
	font-size:36px;
	line-height: 60px;
	font-weight:200;
}

h3, .h3{
	text-transform: uppercase;
	color:#91AC31;
	font-size:14px;
	font-weight:700;
	margin-bottom: 15px;
	letter-spacing:.125rem;
	font-family: "Montserrat", sans-serif;
}

h4, .h4{
	font-size:32px;
	line-height: 40px;
	font-weight:600;
}

h5, .h5{
	font-weight: 600;
}



small{
	text-transform: uppercase;
	color:#575757;
	font-size:12px;
	font-weight:600;	
}

p{
	line-height: 30px;
	font-weight:500;
}

a {
	color:#91AC31;
	text-decoration:none;
}

a:hover, a:visited, a:active, .icon-link:hover, .project-links a.icon-link:hover{
	color:#91AC31;
	text-decoration: underline;
	text-decoration-color:rgba(119, 138, 53, .5);
}
.icon-link{
	text-decoration: none;
	text-decoration-color:none;
	font-family: 'Karla', sans-serif;
}
.project-links a.icon-link, .footer a{
    color:#31352E;
}
/* END TYPOGRAPHY*/

.intro{
	padding:150px 0 200px;
	color:#EBEBE8;
	background-color:#31352E;
}

.header{
	margin-bottom: 40px;
}
.header-link{
		margin-top:40px;
	}
img.avatar{
	width:72px;
	display:inline-block;
	margin-right: 16px;
}

.name{
	display:inline-block;
	vertical-align: middle;
	margin-top:24px;
}

.work-examples{
	padding:80px 0px;
	background-color: #EBEBE8;
}

.button{
	text-transform: uppercase;
	letter-spacing: .125rem;
	font-weight:600;
	font-size:15px;
	border: 2px solid #91AC31;
	background-color:transparent;
	padding:20px 60px;
	border-radius: 2px;
	color:#FFFFFF;
}

.button:hover, .btn:active, .btn:focus{
	color:#323232;
	text-decoration: none;
	background-color:#91AC31;
	border-color: #91AC31;
}

.project-intro{
	margin-bottom: 24px;
}
.project-img{
	margin-bottom:140px;
    border-radius:40px;
}
.project-description{
	margin-top:40px;
}

.footer{
	text-align: center;
	padding: 80px 0;
	margin-top:40px;
}

/* Small only */
@media screen and (max-width: 39.9375em) {
	.intro{
		padding:60px 0 100px;
	}

	h2{
		font-size:24px; line-height: 36px;
	}

	.header{
		margin-bottom: 0px;
	}
    .work-examples{
        padding:40px 0 0 0;
    }   
	.project-description{
		margin-top:0px;
	}
	.project-img{
		margin-bottom:80px;
        border-radius: 16px;
	}
}

@media screen and (max-width: 61.999em) {
    .header-link{
		display:none;
	}
}
@media screen and (max-width: 74.938em){
    h1, .h1{
		font-size:18px;
        line-height:20px;
        font-weight:700;
	}
}