@media screen and (max-width: 480px)
{
	.gallery
	{
		column-count: 1;
	}
}

@media screen and (min-width: 481px)
{
	/*
		TWO COLUMN CONTACT LAYOUT
	*/

	.primary
	{
		width: 50%;
		float: left;
	}

	.secondary
	{
		width: 35%;
		float: right;
	}

	.contact
	{
		clear: none;
	}

	footer
	{
		clear: both;
	}

	/*
		TWO COLUMN ABOUT LAYOUT
	*/

	.about
	{
		clear: both;
		padding-top: 4em;
	}

	.profile-photo
	{
		float: left;
		margin: 0 10% 180px 0;
		padding: 0;
	}
}

@media screen and (min-width: 661px)
{
	.gallery
	{
		column-count: 3;
	}

	/*
		HEADER
	*/

	nav
	{
		background: none;
		float: right;
		font-size: 1.25em;
		margin-right: 5%;
		text-align: right;
		width: 50%;
	}

	nav a, nav a:visited:not(.selected):not(:hover)
	{
		color: #6b5970;
	}

	.logo
	{
		float: left;
		margin-left: 5%;
		text-align: left;
		width: 40%;
		padding-bottom: 2em;
		font-size: 0.825em;
	}

	header
	{
		border-bottom: 8px solid #6b5970;
		margin-bottom: 3em;
	}
}