h1{
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: 400px;
	font-size: 100px;
	color: #333333;
	text-shadow: 0 -1px 0px #000;
}
h2{
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: 400px;
	font-size: 40px;
}
h3{
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: 100px;
}
h4{
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: 400px;
}
a{
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: 400px;
}
p{
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: 400px;
	font-size: 30px;
}
body{
	background-color: #f4f2f1;
	min-height: 
}
header .grid-container{
	height: 100px;
}
header h2{
	text-align: center;
	color:#f4f2f1;
}
#hero-message .grid-80{
	overflow-x:hidden;
	overflow-y:hidden;
	border-bottom: solid 1px #FAF8F8;
	margin-top: 100px;
	margin-bottom: 50px;
	background-color: #E9E7E9;
	border-radius: 5 5 0 0;
	border-top: solid 1px #CFD1D0;
}
#hero-message h1{
	text-align: center;
}
#content, #portfolio_content{
	padding-bottom: 50px;
}
.grid-40{
	height: 100px;
}
#portfolio_content .grid-50 img{
	padding-left:50%;
	margin-left: -75px; 
}
#content .grid-50 img{
	padding-left: 50%;
	margin-left:-75px;
	padding-top: 50px;
}
#hero_sub{
	padding-bottom: 50px;
}
#portfolio{
	padding-bottom: 50px;
}
#contact a{
	text-decoration: none;
	color: #000;
	font-size: 40px;
	text-shadow: 0 1px 1px #fff;
	text-align: right;
}
#projects .grid-30, #projects_DG .grid-30{
	padding-right: 0px;
	padding-left: 0px;
	margin-top: 40px;
	background-color: #E9E7EB;
	border-bottom: solid 1px #FAF8F8;
	border-radius: 15 15 5 5;
}
#projects h2, #projects_DG h2{
	border-bottom:solid 2px #333;
	margin-bottom: 20px;
}
#projects .grid-50, #projects_DG .grid-50{
	padding-bottom: 20px;
}
#projects p{
		padding-left: 10px;
		padding-right: 10px;
		padding-bottom: 10px;
		font-size: 18px;
		text-align: center;
}
footer{
	border-top: solid 1px #CFD1D0;
	background-color: #E9E7EB;
	border-bottom: solid 1px #FAF8F8;
	text-align: center;
}
footer p{
	font-size: 18px;
}
#projects a, #projects_DG a{
	text-decoration: none;
	color: #717171;
}
@media screen and (min-width: 1100px) {
	#script p{
	margin-left: 40px;
	margin-right: 40px;
	padding-bottom: 50px;
	font-size: 30px;
	text-align: center;
	}
	.grid-65 h2{
		color: #333333;
		margin-top: -8px;
		font-size: 80px;
	}
	header .grid-10{
		border-top: solid 5px #852956;
		padding-left: 7px;
		margin-left: 40px;
	}
	header .grid-65 a{
		text-decoration: none;
		display: block;
		color: #333333;
	}
	header .grid-65{
		border-top:solid 5px #A14076;
		height: 100px;
		margin-left: -40px;
	}
	.portfolio{
		border-top:solid 5px #B75B8C;
		width: 84px;
	}
	.resume{
		border-top:solid 5px #CE71A3;
		width: 84px;
	}
	.contact{
		border-top:solid 5px #E687B9;
		width: 85px;
	}
	nav {
		margin-left: -10px;
		height: 100px;
		padding-left: 0px;
	}
	nav li {
		list-style: none;
		float: left;
	}
	nav li a{
		padding-top: 25px;
	}
	nav li a, nav li a:link, nav li a:visited { 
		color: #333333;
		font-size: 20px;
		text-decoration: none;
		display: block;
		line-height: 40px;
		outline: none;
		height:75px;
		text-align: center;
	}
	nav li a:hover, nav li a:focus, nav li#active a {
		color: #333333;
		font-size: 20px;
		text-align: center;
		height: 72px;
		border-bottom: solid 1px #FAF8F8;
		background-color: #E9E7E9;
		border-radius: 0 0 5 5;
		border-top: solid 2px #CFD1D0;
	}
	#content h2{
		margin-left: 40px;
		margin-right: 40px;
		text-align: center;
	}
	#portfolio_content h2{
		margin-left: 40px;
		margin-right: 40px;
		text-align: center;
		border-bottom:solid 2px #333;
	}
	#portfolio_content p{
		text-align: center;
		font-size: 20px;
	}
	.grid-30 img{
		max-width:100%; 
		max-height:108.7%;
		padding-bottom: 10px;
	}
	#projects .grid-50 img{
		padding-left: 50%;
		margin-left:-150px;
	}
	#projects_DG .grid-50 img{
		padding-left: 50%;
		margin-left:-230px;
	}
	footer{
		margin-top: 205px;
	}
}
@media screen and (min-width: 767px) and (max-width: 1100px){
	#script p{
	margin-left: 40px;
	margin-right: 40px;
	padding-bottom: 50px;
	font-size: 30px;
	text-align: center;
	}
	header .grid-10 img {
		padding-left:50%;
		margin-left: -50px;
	}
	header .grid-65{
		border-top:solid 5px #A14076;
	}
	header .grid-65 a{
		text-decoration: none;
		display: block;
		color: #333333;
	}
	header .grid-10{
		border-top: solid 5px #852956;
	}
	header h2{
		margin-top: -8px;
		font-size: 80px;
	}
	header .grid-65{
		height: 100px;
	}
	.portfolio{
		background-color: #B75B8C;
	}
	.resume{
		background-color: #CE71A3;
	}
	.contact{
		background-color: #E687B9;
	}
	nav {
		height: 23.2px;
		padding-left: 0px;
		margin-right: -10px;
		margin-left: -10px;
	}
	nav li {
		list-style: none;
		float: center;
	}
	nav li a{
	}
	nav li a, nav li a:link, nav li a:visited { 
		font-size: 20px;
		text-decoration: none;
		line-height: 30px;
		display: block;
		color: #f4f2f1;
		outline: none;
		width: 100%;
		height:23.2px;
		text-align: center;
		padding-bottom: 10px;
	}
	nav li a:hover, nav li a:focus, nav li#active a {
		font-size: 20px;
		text-align: center;
		width: 100%;
		height: 23.2px;
		opacity: 0.3;
	}
	#hero-message h1{
		font-size: 80px;
	}
	#content h2{
		margin-left: 20%;
		margin-right: 20%;
		text-align: center;
	}
	#portfolio_content h2{
		margin-left: 20%;
		margin-right: 20%;
		text-align: center;
		border-bottom: solid 2px #333;
	}
	#portfolio_content p{
		text-align: center;
		font-size: 20px;
	}	
	.tablet-grid-45 img{
		padding-bottom: 10px;
		max-height: 100%;
		max-width: 100%;
	}
	#projects .grid-50 img{
		padding-left: 50%;
		margin-left:-150px;
	}
	#projects_DG .grid-50 img{
		padding-left: 50%;
		margin-left:-230px;
	}
	footer{
		margin-top: 160px;
	}
}
@media screen and (max-width: 767px){
	#script p{
	margin-left: 0px;
	margin-right: 0px;
	padding-bottom: 10px;
	font-size: 20px;
	text-align: center;
	}
	header .mobile-grid-20 img {
		padding-left:25%;
		margin-left: -15px;
	}
	header .grid-65{
		border-bottom: solid 5px #A14076;
	}
	header .grid-65 a{
		text-decoration: none;
		display: block;
		color: #333333;
	}
	header .grid-10{
		border-bottom: solid 5px #852956;
		border-top:solid 0px;
		height: 55px;
	}
	header h2{
		margin-top: -4px;
		font-size: 40px;
	}
	header .grid-65{
		border-top: solid 0px;
		height: 55px;
	}
	.portfolio{
		background-color: #B75B8C;
	}
	.resume{
		background-color: #CE71A3;
	}
	.contact{
		background-color: #E687B9;
	}
	nav {
		height: 30px;
		padding-left: 0px;
		margin-right: -10px;
		margin-left: -10px;
	}
	nav li {
		list-style: none;
		float: center;
	}
	nav li a{
	}
	nav li a, nav li a:link, nav li a:visited { 
		font-size: 20px;
		text-decoration: none;
		display: block;
		color: #f4f2f1;
		line-height: 20px;
		outline: none;
		width: 100%;
		height:25px;
		text-align: center;
	}
	nav li a:hover, nav li a:focus, nav li#active a {
		font-size: 20px;
		text-align: center;
		width: 100%;
		height: 25px;
		opacity: 0.3;
	}
	#hero-message h1{
		font-size: 60px;
	}
	#content h2{
		margin-left: 20px;
		margin-right: 20px;
		text-align: center;
	}
	#portfolio_content h2{
		margin-left: 20px;
		margin-right: 20px;
		text-align: center;
		border-bottom: solid 2px #333;
	}
	#portfolio_content p{
		text-align: center;
		font-size: 20px;
	}
	.mobile-grid-100 img{
		padding-bottom: 10px;
		max-width: 100%;
		max-height: 100%;
	} 
	#projects .grid-50 img{
		padding-left: 50%;
		margin-left:-150px;
	}
	#projects_DG .grid-50 img{
		padding-left: 50%;
		margin-left:-150px;
	}
	footer{
		margin-top: 100px;
	}
}