@media screen and (max-width: 570px), handheld and (max-width: 570px) {
	body {
		width: 380px;
	}
	
		#header {
			width: 380px;
			margin-left: auto;
			margin-right: auto;
		}
	
			#header h1 {
				font-size: 3.1em;
			}
		
			#header p {
				font-size: 1.3em;
			}
			
		h1.pagetop {
			font-size: 2.5em;
		}
		
		#pagebody {
			width: 380px;
			margin-left: auto;
			margin-right: auto;
		}
		
			#pagebody textarea {
				width: 100%;
			}
		
			div.aboutcontent {
				float: none;
				width: 380px;
			}
			
			div.aboutbiobox {
				float: none;
				width: auto;
				margin-top: 45px;
			}
			
				div.aboutbiobox p {
					font-size: 1em;
				}
				
		#thearchive h2 {
			font-size: 4.5em;
		}
		
		#thearchive ul#filters li {
			font-size: 1.1em;
			display: inline-block;
			margin-bottom: 8px;
		}
			
		#randomoldies {
			width: 380px;
			margin-left: auto;
			margin-right: auto;
		}
		
		#photos {
			width: 380px;
            margin-left: auto;
            margin-right: auto;
		}
		
			#photos img {
				width: 380px;
			}
		
		#bottomboxes {
			width: 380px;
			margin-left: auto;
			margin-right: auto;
		}
		
			#bottomboxes div.podcastbox {
				float: none;
				margin-left: auto;
				margin-right: auto;
			}
			
			div.bottomreswrap {
				width: 380px;
				margin-left: auto;
				margin-right: auto;
			}
			
			#bottomboxes div.archivebox {
				float: left;
				
			}
			
			#bottomboxes div.aboutebox {
				float: left;
				
			}
		
	#footer {
		width: 380px;
		margin-left: auto;
		margin-right: auto;
	}

		#footer ul, #footer p {
			line-height: 1.4em;
		}
}

@media screen and (max-width: 380px), handheld and (max-width: 380px) {
	body {
		width: 100%;
	}
	
		#header {
			width: auto;
			margin-left: 10px;
			margin-right: 10px;
		}
	
			#header h1 {
				font-size: 2.8em;
			}
		
			#header p {
				font-size: 1.2em;
			}
			
		#entryheader h2 {
			margin-left: 10px;
			margin-right: 10px;
		}
			
		h1.pagetop {
			font-size: 2em;
			margin-left: 10px;
			margin-right: 10px;
		}
		
		#pagebody {
			width: auto;
			margin-left: 10px;
			margin-right: 10px;
			font-size: 1.1em;
		}
		
			div.aboutcontent {
				width: auto;
			}
			
			div.aboutbiobox {
				width: auto;
			}
			
		#thearchive h2 {
			font-size: 3em;
		}

		#fiction, #pstories, #essays, #poetry, #reporting {
			width: auto;
			margin-left: 10px;
			margin-right: 10px;
		}

			#fiction p, #pstories p, #essays p, #poetry p, #reporting p {
				font-size: 1.2em;
			}
			
		#randomoldies {
			width: auto;
			margin-left: 10px;
			margin-right: 10px;
		}

			div.essaywrap, div.pstorieswrap, div.reportingwrap, div.poetrywrap, div.fictionwrap {
				position: relative;
			}

			div.essays, div.pstories, div.reporting, div.poetry, div.fiction {
				float: none;
				width: auto;
				margin-left: auto;
				margin-right: auto;
			}
		
		#photos {
			width: auto;
            margin-left: 10px;
            margin-right: 10px;
		}
		
			#photos img {
				width: 100%;
			}
		
		#bottomboxes {
			width: auto;
			margin-left: 10px;
			margin-right: 10px;
		}
		
			#bottomboxes div.podcastbox {
				width: auto;
				float: none;
				margin-left: 0;
				margin-right: 0;
			}

				ul.graphic li a, ul.graphic li a.sm2_link {
					width: auto;
				}
			
			div.bottomreswrap {
				width: auto;
				margin-left: 0;
				margin-right: 0;
			}
			
			#bottomboxes div.archivebox {
				float: none;
				display: block;
				width: auto;
			}
			
			#bottomboxes div.aboutbox {
				float: none;
				display: block;
				width: auto;
			}
		
	#footer {
		width: auto;
		margin-left: 10px;
		margin-right: 10px;
	}

		#footer ul, #footer p {
			line-height: 1.3em;
		}
}