@media screen and (max-height: 624px) { 
	#piece #title {
		top: 20px
	}
}
@media screen and (min-width: 1024px) {
	#alert {
	background-color: #FFFDF3;
	padding: 0 10px;
}
#alert.white {
	background-color: transparent;
}
}

@media screen and (max-width: 1024px) {
	#piece .pg_nmbr {
		bottom: 56px;
		top: auto;
	}
	#content { height: 100%; }
#piece #content.visual img {
	height: auto;
	margin-left: 0;
	max-width: 100%;
	max-height: 100%;
}
}
@media screen and (max-width: 870px) {
	.cover { display: none; }
	#alert { display: none; }
	#logo-container { display: none; }
	center { margin-top: 60px; }
	.nav-container {
		width: auto; 
		height: auto;
		float: none;
		margin-right: 0;
		margin-top: 60px;
	}
	.nav-container h2 {
		margin-bottom: 30px;
	}
	.nav-piece {
		font-size: 1.2em;
		margin-bottom: 30px;
	}

	.nav-piece .last {
		margin-bottom: 0px;
	}
	#spacer { display: none; }
	.nav-container a.title.visual {
		width: 238px;
	}
	#container { 
		height: auto;
		width: 80% }
	.nav-container:last-child {
		margin-bottom: 100px;
	}
	.archive-author {
		margin-top: 60px;
	}	
	#alert.hidden { display: none; }
	#piece #author {
		top: 20px;
		right: 10%;
	}
	#piece #content.poetry {
		padding-left: 0;
		top: 60px;
		left: 10%;
		width: 80%;
	}
	#piece #title {
		position: absolute;
		top: 86px;
		left:10%;
	}
	#piece #author {
		top: 20px;
		right: 10%;
		position: absolute;
	}
	#piece #pages {
		display: none;
	}
	#piece #content.prose {
		column-count: auto;
		-moz-column-count: auto;
		-webkit-column-count: auto;
		-webkit-column-gap: normal;
		column-gap: normal;
		-moz-column-gap: normal;
		column-width: auto;
		-moz-column-width: auto;
		-webkit-column-width: auto;
		width: 80%;
		height: auto;
		overflow: visible;
		position: relative;
		left: 10%;
		top: 220px;
		margin-bottom: 100px;
	}
	#content.prose p {
		line-height: 26px;
	}
	#quad-container {
		width: 520px;
		margin-top: 100px;
	}

	#piece #content.visual img {
		max-width: 100%;
		height: auto;
		margin-left: 0;
	}
	.get_out { display: block; }
}

@media screen and (max-width: 670px) {

	.speceial { margin: 0; }
	#piece #content.poetry p {
		position: relative;
		top: 0;
		margin-bottom: 86px;
	}
	#piece #content.poetry p.hidden {
		display: inline-block;
	}
	.nav-container:last-child {
		margin-bottom: 40px;
	}
	#triangle { display: none; 
		left: 10%;
	}
	#container {
		height: auto;
		margin-bottom: 30px;
	}
	#quad-container {
		width: auto;
		margin-top: 40px;
	}
	.archive-author {
		margin-top: 47px;
		position: relative;
	}
	.archive-pieces {
		left: auto;
		position: relative;
		top: auto;
	}
	#menu-toggle {
		padding: 22px 22px 20px;
	}
	#menu-toggle {
		background-color: rgba( 255, 253, 243, .8);
	}
	#menu-toggle.white {
		background-color: rgba(0,0,0,.4);
	}
}

@media screen and (max-width: 670px) and (max-height: 400px) {
	
	#nav-overlay ul {
		height: auto;
		top: 15px;
	}
	#nav-overlay ul li {
		margin-bottom: 12px;
	}
	.circle {
		background-color: rgba(255, 253, 243, 0.5);
}