@media screen and (min-width: 480px) {
	
	/************************
	TWO COLUMN LAYOUT
	*************************/
	
	#primary {
		width: 50%;
		float: left;
	}
	
	#secondary {
		width: 40%;
		float: right;
	}
	
	
	
	/************************
	PAGE: PORTFOLIO
	*************************/
	
	#gallery li {
		width: 28.3333%;
	}
	
	#gallery li:nth-child(4n) {
		clear: left;
	}
	
	
	
	/************************
	PAGE: PORTFOLIO
	*************************/
	
	.profile-photo {
		float: left;
		margin: 0 5% 25px 0;
	}
}

@media screen and (min-width: 660px) {
	
	/************************
	HEADER
	*************************/
	
	nav {
		background: none;
		float: right;
		font-size: 1.125em;
		margin-right: 5%;
		text-align: right;
		width: 45%;
	}
	
	#logo {
		float: left;
		margin-left: 5%;
		text-align: left;
		width: 45%;
	}
	
	h1 {
		font-size: 2.5em;
	}
	
	h2 {
		font-size: 0.825em;
		margin-bottom: 20px;
	}
	
	header {
		border-bottom: 5px solid #424254;
		margin-bottom: 60px;
	}
	
	
	
		/************************
	ABOUT
	*************************/
	
	#about_photo {
		width: 30%;
		float: left;
	}
	
	#about_body {
		width: 70%;
		float: right;
	}
	
	.profile-photo {
		clear: both;
		margin-left: 10%;
	}
	
}