/* --------------------------------------------
   Viewport less than 1200px Stylesheet 
-------------------------------------------- */			
				
@media (max-width: 1200px) {

#container { width: 960px; }
#content { width: 700px; }
#sidebar { width: 240px; }
	
header { width: 720px; }
	
header hgroup h1 { font-size: 32px; }
header hgroup h2 { font-size: 18px; }

header nav { margin-top: 18px; }
header nav ul li { font-size: 16px; }
	
#banner { margin-bottom: 20px; }
	
#content article { margin-bottom: 12px; }
#content article h3 { font-size: 18px; }
#content article p { font-size: 14px; }
ol.interlist { font-size: 14px !important; }

#content .index { width: 150px; }
#content .index h3 { line-height:22px; padding-bottom:15px; font-weight:normal; }
#content .index p { line-height:17px; }
#content .index p a.title { font-size:13px; }
#content .index p a.author { font-size:13px; }
#content .index p.thisfile { font-size:13px; }
#content .index p span.thisfile { font-size:13px; }
#content .page { width:450px; }
#content .page p { line-height:18px; }
#content .page p.poemauthor, #content .page a.poemauthor { font-size:17px; }
#content .page p.epigraph { font-size:13px;line-height:18px; }
#content .page .poembody ol { font-size:14px; }
#content .page .poembody ol li { margin-bottom:10px; }
	
#sidebar aside { margin-bottom: 12px; }

#content div.leftimagetext { width:490px; }

#content div.videocontainer video { width:400px; }

table.vol9no1 tr td {
	font-size:14px; line-height:18px;
}

#content p.pulloutright, #content p.pulloutleft  { font-size:22px;line-height:24px; }

div img.pagetopad { width:75%; }

div.interview5pictures { width:400px !important; }

}


/* --------------------------------------------
   Viewport iPad Stylesheet : Landscape
-------------------------------------------- */

/* 	
	Desktop preview, replace query with below
	@media (max-width: 1024px) {  } 
*/
	
@media (max-device-width: 1024px) and (orientation: landscape) {

#container { width: 768px; }
#content { width: 540px; }
#sidebar { width: 208px; }

header { margin-bottom: 12px; width: 75%; }

header hgroup { margin-bottom: 12px; }

header nav { float: none; clear: both; }
header nav ul { width: 100%; }
header nav ul li { font-size: 14px; width: 191px; text-align: center; }
header nav ul li:last-child { width: 192px; }
			
#banner { margin-bottom: 18px; }
		
#content article img { float: none; margin: 0 0 10px 0; width: 100%; height:100%; }

#content .index { width: 130px; }
#content .page { width:345px; padding-left:20px; }

#content .index p.thisfile { font-size:12px; }
#content .index p a.title { font-size: 12px; }
#content .index p a.author { font-size: 12px; }
#content .page .poembody ol { font-size:12px; }
#content .page .poembody ol li { margin-bottom:10px; }
ol.interlist { font-size: 12px !important; }

#content article .containerdiv .page p.poemtitle { font-size: 20px; }
#content article .containerdiv .page p { font-size: 12px; }

#content div.leftimagetext { width:340px; }

#content p.audiobuttons span { padding:5px 0; font-size:18px; margin-top:2px; }
#content p.audiobuttons img.volbtn { display: none; }
#content div.audiocontainer div#sliderBox { display:none; }
#content .index p img { padding:0 0 4px 0; margin: 0 0 4px 5px; }

}


/* --------------------------------------------
  Viewport iPad Stylesheet : Portrait
-------------------------------------------- */

/* 	
	Desktop preview, replace query with below
	@media (max-width: 768px) {  } 
*/

@media (max-device-width: 1024px) and (orientation: portrait) {

#container { width: 600px; }
#content { float: none; width: 600px; margin: 0 0 12px 0; }
#sidebar { float: none; width: 600px; }
	
header { margin-bottom: 12px; width: 75%; }
	
header hgroup { margin-bottom: 12px; }
	
header nav { float: none; clear: both; }
header nav ul { width: 100%; }
header nav ul li { font-size: 14px; width: 149px; text-align: center; }
header nav ul li:last-child { width: 150px; }
			
#banner { margin-bottom: 18px; }
	
#content article { padding: 20px; }
#content article img { float: none; margin: 0 0 10px 0; width: 100%; height: 100%; }
	
#sidebar aside {
	background: #A79F91; 
	color: #fff; 
	float: left; 
	width: 250px; 
	min-height: 170px; 
	margin-right: 20px; 
	padding: 20px; 
	}

#sidebar aside:last-child { margin: 0; }

#content .index { width: 130px; }
#content .page { width:395px; padding-left:30px; }

#content div.leftimagetext { width:400px; }

#content p.audiobuttons span { padding:4px 0; margin-top:2px; }
#content p.audiobuttons img.volbtn { display: none; }
#content div.audiocontainer div#sliderBox { display:none; }
#content .index p img { padding:0 0 4px 0; margin: 0 0 4px 5px; }

}


/* --------------------------------------------
  Viewport Mobile
-------------------------------------------- */

@media (max-width: 600px) { 

#container, #content { float: none; width: inherit; min-width:250px; }
#content { margin: 0; }

#sidebar, #banner { display: none; }
	
header { margin: 12px auto; text-align: center; width: 65%;}
header hgroup { width: 100%; margin-bottom: 12px; }
header hgroup h1 { font-size: 24px; }
header hgroup h2 { font-size: 14px; }
	
header nav { float: none; clear: both; }
header nav ul { width: 100%; }
header nav ul li {
	float: left; 
	display: block; 
	width: 49%; 
	font-size: 12px; 
	text-align: left; 
	border-bottom: 1px solid #fff; 
	text-align:center;
	}
header nav ul li:last-child { width: 49%; border-bottom: 0; }
header nav ul li a { padding: 5px; font-weight:normal; }
	
#content article { padding: 10px; -webkit-border-radius: 0; border-radius:0; }
#content article h3 { font-size: 16px; }
#content article p { font-size: 12px; }
ol.interlist { font-size: 12px !important; }

	#content article img { display: none; }
#content div.coverimage { width:100%;}
#content div.coverimage a img { width:100%; height:100%; display:inline; }
#content div.coverimage.alt340 { width:100%; }
#content div.coverimage.alt340 a img { width:100%; height:auto; }
#content article img.introCover { display: inline; width:150px; height:185px; }

#content p.front-page-separator-340 { font-size:1px; line-height:1px;padding:0; margin:0px 50px 15px 50px; border-bottom:1px dotted #555;}

#content article img.showMobile { display: inline; }
#content article div.poembody div.cover { padding:5px; margin-left:10px; }

#content p.pulloutright, #content p.pulloutleft  { font-size:18px;line-height:22px; }

#sidebar aside { 
background: #A79F91; 
color: #fff; 
float: left;
width: 250px; 
min-height: 170px; 
margin-right: 20px; 
padding: 20px; 
}
#sidebar aside:last-child { margin: 0; }
		
footer { padding: 10px; font-size: 12px; }

#content .page .nav p.randomizer, #content .page .navbottom p.randomizer { display:none; }
#content .page .nav p.toc, #content .page .navbottom p.toc { display:inline; }

#content .index { display: none; }

#content .page { width:96%; border:none; padding-left:5px; }
#content .page p { line-height:17px; }
#content .page p.poemtitle { font-size: 20px; margin-top:-5px;padding-bottom:0; line-height:26px; }

/* for the mobile table of contents page */
#content .page p a.title { display:block;font-size:18px; }
#content .page p a.author { font-size:16px; }

#content .page .poembody ol { font-size:12px; }
#content .page .poembody ol li { margin-bottom:10px; }


div.mobilewarning { display:block; }
div.leftimage { display:none; }
#content div.leftimagetext { width:100%; float:none; }
#content article h3 span.date { font-size:12px; font-weight:normal; line-height:10px;color:#888;}

#content div.audiocontainer div#sliderBox { display:none; }
#content div.audiocontainer img { display:inline; } 

#content div.videocontainer video { width:300px; }

div.partnerlist p { width:100%; float:none; }

div.pagetopad { display:none; }
div.pagetopadmobile { display:block; }
div img.pagetopad { width:100%; }

div.hideonmobile { display:none; }


#content article p.intersubhead { font-size:14px; }
#content article p.interbio { font-size:12px; }
div.left { width:100%; padding:0; }
div.right{ width:100%; padding:0; border:none; border-top:1px solid black; padding-top:10px; }
#content article div.interimage img { display:inline; }

}

/* --------------------------------------------
   Widescreen Displays
-------------------------------------------- */			


@media screen and (device-aspect-ratio: 16/9), screen and (device-aspect-ratio: 16/10) { 

}