/* sleet_0115.css */
/* derived from 
   sleet 10 */

/* Working Sequence: */
/*
Base

B01. meyer style reset: most tags
	- Enhancements and Exceptions to style reset:

B02. Site Defaults: Background and Text
   -  B02.01  html, body and basic form defaults
	- background color and image
	- base font family, color, text shadow
	- base margin, padding, indent
   -  B02.02  lists and list elements
	- list types, bullet style
   -  B02.03  heading and paragraph styles (note: p uses body defaults as of v8)
	- font and color overrides, font size and weight, line height, margin, padding, indent

B03. HTML5-specific tags to display:block

B04. Anchor tags
	- font family, color, size, weight, hover/visited

B05. Form-specific hacks and cheats
	- included for reset; future development only

Metro Disruptors

Standard

S01. body classes (.main, etc)
S02. content header (header, h1, h2 classes)
   - header 

S03. non-header h3-6 tags and classes
   - h3-6
   - main
   - blank

S04. standard features of main
  - main-panels 
  - main-announcements (container)


S05. navs of different types
   - nav
   - small format (iPhone)
   - vertical format (phone, tablet) 
   - nav anchors
     - padding
     - font

S06. article and genre class

S07. page-specific styles
   - archive styles 
   - about us styles 
   - submission styles 

S08. <p> styles
S09. bio styles 

(custom styles go here)

S20. footer (last element in css, following custom)


Custom
C01. 

*** ( No custom styles yet )  ***

*/

/* B01 - meyer reset style */
html, body, body div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  vertical-align: baseline;
  text-decoration : none;
}

/* Exceptions and enhancements to above */

	/* 1) Always force a scrollbar in non-IE
	2) Remove iOS text size adjust without disabling user zoom: www.456bereastreet.com/archive/201012/		
	controlling_text_size_in_safari_for_ios_without_disabling_user_zoom/ */
	/* fails validation at w3.org */
html { overflow-y: scroll; 
	-webkit-text-size-adjust:100%; 
	-ms-text-size-adjust:100%; 
}

/* B02 - Background and Text 
   B02.01:  Body Defaults */
body, select, input, textarea {
   color: #41555e; /*#666666*/
   text-shadow: 2px 2px 2px #8d9789; 
  /* Set your base font here, to apply evenly */
   font-family : Arial, Helvetica, sans-serif;
   font-weight : normal;
   font-style : normal;
   font-variant : normal;
}

/* now we're sleet-specific */
body {
/*   background : url('../images/ice_crystal_rain_6_1b.gif') repeat left top #88ccaa; */
   background-color : #becabc;
   margin-top : 6px;
   margin-left : 11%;
   margin-right : 11%;
   letter-spacing : normal;
   word-spacing : normal;
}

/* Vertical format */
  @media screen and (max-device-width: 1024px) /*and (min-device-width: 768px)*/ and (orientation: portrait){
  body{ 
	margin : 6px 8% 0 8%;
	padding: 0;
	text-align : left; 
	letter-spacing : -.2px;
	word-spacing: -.2px;
	}
}

/* Small Format */
  @media screen and (max-device-width: 320px){
  body{
	-webkit-text-size-adjust:none; /*does not exist per w3c validator*/
	padding:3px;
	margin : 6px 6% 0 6%
	font-family: pt-sans-narrow, Helvetica, Arial, Verdana, sans-serif;
	font-size : 1.2em;
    }
}
/* body classes (e.g. .main) are in S01.*/

/* B02.02  Lists: also see navs */
ol,ul,li { list-style:none; list-style-image: none; }
ul, ol { margin-left: 1em; margin-right: 1em;}
ol { list-style-type: decimal; }


/* B02.03  Selection is a CSS3 selector */
/* These selection declarations have to be separate
No text-shadow: twitter.com/miketaylr/status/12228805301 */
  /* fails validation at w3.org: "Unknown pseudo-element.." */
::-moz-selection { background: #a5926f; color:#4d2315; text-shadow: none; }
::selection { background:#a5926f; color:#4d2315; text-shadow: none; }


/* B02.04  heading and paragraph styles */
h1, h2, h3, h4, h5, h6 { font-weight: bold; /*color : #4d2315;*/ }
h1,h2,h3,h4 {text-shadow: 2px -2px 12px #8d9789;}
h1 { font-size : 1.8em; padding-right: .2em; margin-left: -.8em;}
h2 {padding: .2em; margin-left: -.5em;}
/*h2,h3 {color : #d11309;}*/
h3, h4 { margin-top: .8em; padding: 0; }
h4 { font-size : 1.2em; background-color : #334e45; color: #becabc; text-shadow: 2px 2px 2px #3e3935;}
h5, h6 {font-size : 1em; margin : 0; padding: 0 0 .3em 0; text-shadow: 2pt 2pt 2pt #3f6454;}
h6 {font-size : .9em; margin : 0; padding: .2em .1em .3em .1em; text-shadow: 1pt 2pt 2pt #3f6454;}
p { margin-top: .5em; margin-bottom: .5em; padding: 0 ; text-indent : 0; font-size : 1em; font-weight : normal; }

td { vertical-align: top; }
small { font-size: 85%; }
b, strong, th { font-weight: bold; }
/* Set sub, sup without affecting line-height: gist.github.com/413930 */
sub, sup { font-size: 75%; line-height: 0; position: relative; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }


/* Vertical format */
  @media screen and (max-device-width: 1024px) /*and (min-device-width: 768px)*/ and (orientation: portrait){
  h1, h2, h3, h4, h5, h6{ 
	/*background : url('../images/whatever.jpg') repeat left top #b3b0b3; */
	margin : 0 0 0 0;
	padding: 0;
	text-align : left; 
	letter-spacing : -.2px;
	word-spacing: -.2px;
	}
}


/* Small Format -- validated with iPhone5 4/16/14*/
  @media screen and (max-device-width: 320px){
  h1, h2, h3{
	-webkit-text-size-adjust:none; /*does not exist per w3c validator*/
	padding:3px;
	font-family: pt-sans-narrow, Helvetica, Arial, Verdana, sans-serif;
	font-size : 1.2em;
	}
   h1{
	font-size : 1.3em;
	}  
   h3{
	/*border : solid 1px #dd2222;*/
	letter-spacing : -.02em;
	word-spacing : -.02em;
	font-size : 1.35em;
	}
  h4, h5, h6{
	-webkit-text-size-adjust:none; /*does not exist per w3c validator*/
	padding:3px;
	font-family: pt-sans-narrow, Helvetica, Arial, Verdana, sans-serif;
	letter-spacing : -.03em;
	word-spacing : -.03em;
	line-height : 1em;
	/*border : solid 1px #dddd22;*/
    }
/* p, a{
	font-size : 1.7em;
	line-height : 1.8em;
    }
  li{ font-size : 1.6em;
    }*/
}

/* Small Vertical Format */
  @media screen and (max-device-width: 320px) and (orientation: portrait){
  h1{
	-webkit-text-size-adjust:none; /*does not exist per w3c validator*/
	padding:3px;
	font-family: pt-sans-narrow, Helvetica, Arial, Verdana, sans-serif;
	font-size : 2.5em;

	}
  h2, h3{
	-webkit-text-size-adjust:none; /*does not exist per w3c validator*/
	padding:3px;
	font-family: pt-sans-narrow, Helvetica, Arial, Verdana, sans-serif;
	font-size : 2.1em;
	} 
  h4, h5, h6{
	-webkit-text-size-adjust:none; /*does not exist per w3c validator*/
	padding: 3px;
	font-family: pt-sans-narrow, Helvetica, Arial, Verdana, sans-serif;
	font-size : 2.2em;
	letter-spacing : -.03em;
	word-spacing : -.03em;
	line-height : 1em;
    }
  h4 { font-size : 1.35em;
	}

  h5 a { /* added to fix over-wide line spacing */
	/*font-size : 24px; */
	line-height : 16px; 
	padding : 0 0 0 8px; 
	text-indent : -8px; 
	}

  p { letter-spacing : -.3px;
	font-size : 2em;
	line-height : 2em;
    }

}

/* B02.05  some IE dot hacks */
.ie6 legend, .ie7 legend { margin-left: -7px; }
/* Bicubic resizing for non-native sized IMG:
code.flickr.com/blog/2008/11/12/on-ui-quality-the-little-things-client-side-image-resizing/ */
  /* fails validation at w3.org */
.ie7 img { -ms-interpolation-mode: bicubic; }



/* B02.06  Normalize monospace sizing:
en.wikipedia.org/wiki/MediaWiki_talk:Common.css/Archive_11#Teletype_style_fix_for_Chrome */
pre, code, kbd, samp { font-family: monospace, sans-serif; }
pre {
  /* www.pathf.com/blogs/2008/05/formatting-quoted-code-in-blog-posts-css21-white-space-pre-wrap/ */
  /* fails validation at w3.org */
	white-space:pre; 
	white-space:pre-wrap; 
	word-wrap:break-word; 
	padding:15px;
}

/* B03 - HTML5-specific */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  display: block;
}
footer,#footer {margin-top: 1em;}


/* B04 - Anchor styles, hacks, cheats */ 
  
/* j.mp/webkit-tap-highlight-color */
/* fails vaildation at w3.org */
a:link { -webkit-tap-highlight-color: #f3eae1; }

/* Accessible focus treatment: people.opera.com/patrickl/experiments/keyboard/test */
/* warning at csslint: outlines should only be modified using :focus */
a:hover, a:active { outline: none; -moz-outline-style:none;}
a, a:active, a:visited { color: #3f6454; text-decoration : none;}
a:hover { color: #77bc55; text-shadow: -2px -2px 8px #8d9789;}

/* add no-hover variations for phone and tablet?  */



/* B05 - form-specific styles, hacks, cheats */

/* ** see above input and textarea style definitions ** */

/* 1) Make inputs and buttons play nice in IE: www.viget.com/inspire/styling-the-button-element-in-internet-explorer/
2) WebKit browsers add a 2px margin outside the chrome of form elements.
Firefox adds a 1px margin above and below textareas
3) Set font-size to match <body>'s, and font-family to sans-serif
4) Align to baseline */
button, input, select, textarea { 
	width: auto; 
	overflow: visible; 
	margin: 0; 
	font-size: 100%; font-family: sans-serif; vertical-align: baseline; }

/* 1) Remove default scrollbar in IE: www.sitepoint.com/blogs/2010/08/20/ie-remove-textarea-scrollbars/
2) Align to text-top */
textarea { overflow: auto; vertical-align:text-top; }

/* Hand cursor on clickable input elements */
label, input[type="button"], input[type="submit"], input[type="image"], button { cursor: pointer; }

/* Remove extra padding and inner border in Firefox */
  /* fails validation at w3.org */
input::-moz-focus-inner,
button::-moz-focus-inner { border: 0; padding: 0; }

/* Colors for form validity */
  /* fails validation at w3.org, csslint.net */
input:valid, textarea:valid { }
input:invalid, textarea:invalid { border-radius: 1px; -moz-box-shadow: 0 0 5px; -webkit-box-shadow: 0 0 5px; box-shadow: 0 0 5px; }
.no-boxshadow input:invalid, .no-boxshadow textarea:invalid { background-color: #a5926f; }



/* Metro style elements */ 


.metro{
/* container div for boxes */
   width : 98%;
	margin : 0 1%;
   	overflow : auto;
	background-color : #becabc;
	/*border-bottom : solid 4px #334e45;*/
}

.box{
	float : left;
	min-width : 15%;
	max-width : 29.6%;
	min-height : 120px;
	overflow: visible;
	margin-top : 0;
	padding-top : 0;
	padding-left : .7%;
	padding-right : .7%;
	text-indent: -.7em;
}
/* Small Format */
@media screen and (max-device-width: 320px) {
  .box{
	min-width : 32%;
	max-width : 42%;
	min-height : 80px;
	overflow: visible;
	
	}
  }
/* Small Vertical Format */
@media screen and (max-device-width: 320px) and (orientation: portrait){
  .box{
	min-width : 42%;
	max-width : 45%;
	min-height : 120px;
	overflow: visible;
	
	}
  }

.box-stop{
	clear : left;
}

.box-header{
	margin-left: 2em;
	margin-bottom: .5em;
	width: 100%;
}

.box h1 {
	margin-left : 0;
}
.box h2 {margin-left : 1em;}


/*.box001, .box001 a, .box001 h4, .box001 h4 a, .box001 h5, .box001 h5 a, .box001 h6 a, .box001 p a*/
.box001, .box001 h4, .box001 h5, .box001 h6, .box001 p {
	margin : .2em;
	padding : .2em 1.3em 0 1.3em;
	background-color : #77bc55;
	color: #3d3d35;
	text-shadow: 2px 2px 2px #22cb2a;
}
.box001 a{margin:0;}
.box001 h6 a {padding-left : 1em;}
.box001 a:link { -webkit-tap-highlight-color: #3e3945;}
.box001 a:hover, .box001 a:active { outline: none; -moz-outline-style:none;}
.box001 a:active, .box001 a:visited { color : #3e3945;  text-decoration : none; text-shadow: #becabc;}

.box001 a:hover, .box001 h4 a:hover, .box001 h5 a:hover { color: #becabc;}


/*.box002, .box002 h1 a, .box002 h4, .box002 h4 a, .box002 h5, .box002 h5 a, .box002 h6 a, .box002 p a*/
.box002, .box002 h4, .box002 h5, .box002 h6, .box002 p {
	margin : .2em;
	padding : .2em 1.3em 0 1.3em;
	background-color : #334e45; 
	color : #becabc;
	text-shadow: 2px 2px 2px #3e3935;
}
.box002 a{margin: 0;}
.box002 h6 a {padding-left : 1em;}
.box002 a:link { -webkit-tap-highlight-color: #20201b;}
.box002 a:hover, .box002 a:active { color: #becabc; text-shadow: 2px 2px 2px #becabc; outline: none; -moz-outline-style:none;}
.box002 a, .box002 p a {color : #b6c4b5; text-shadow: 2px 2px 2px #728c89;}  
.box002 a:active, .box002 a:visited, .box002 p a:active, .box002 p a:visited { color : #b6c4b5;  text-shadow: 2px 2px 2px #728c89; text-decoration : none;}

.box002 a:hover, .box002 h4 a:hover, .box002 h5 a:hover  { color: #acc4ac;}


.box003, .box003 h3, .box003 h4, .box003 h5,.box003 h6, .box003 p{
	margin: .2em;
	padding : .2em 1.3em 0 1.3em;
	background-color : #728c89;
	color : #98bd90;
	text-shadow : 2px 2px 2px #3d3d35;
}
.box003 a{margin: 0; color : #98bd90;}
.box003 h6 a {padding-left : 1em;}
/*.box003 h5 a {color : #98bd90; text-shadow : 2px 2px 2px #3d3d35;}*/
.box003 a:link { -webkit-tap-highlight-color: #4d2315; }
.box003 a:hover, .box003 a:active { outline: none; -moz-outline-style:none;}
/*.box003 a {color : #b6c4b5; text-shadow : 2px 2px 2px #3d3d35;} */
.box003 a:active, .box003 a:visited, .box003 p a:active, .box003 p a:visited { color : #98bd90; text-shadow: 2px 2px 2px #3e3935; text-decoration : none;}

.box003 a:hover { color: #acc4ac; text-shadow: 2px 2px 2px #3e3935;}


.box004, .box004 h4, .box004 h5, .box004 h6, .box004 p{
	margin: .2em;
	padding : .2em 1.3em 0 1.3em;
	background-color : #3e3935; 
	color : #bdcbbe;
	text-shadow : #3d3d35;
}
.box004 a{margin: 0;}
.box004 h5 a {color : #b6c4b5;}
.box004 a:link { -webkit-tap-highlight-color: #b6c4b5; }
.box004 a:hover, .box004 a:active { color : #b6c4b5; outline: none; -moz-outline-style:none;}
.box004 a {color : #becabc;} 
.box004 a:active, .box004 a:visited, .box004 p a:active, .box004 p a:visited { color : #bdcbbe; text-shadow: #728c89; text-decoration : none;}

.box004 a:hover { color: #acc4ac;}

/* Small Format */
@media screen and (max-device-width: 320px) {
  .box001 h4, .box002 h4, .box003 h4, .box004 h4  {
/*	font-size : .9em;*/
	line-height: 1em;
	margin : 0;	
	padding : 0 .05em;
  }
   .box001 h5, .box002 h5, .box003 h5, .box004 h5 { 
/*	font-size : 1.3em;*/
	line-height: 1.5em;
	text-indent: .3em;
	margin : 0;
	padding : 0 .1em;
  }
  .box001 h6, .box002 h6, .box003 h6, .box004 h6 {
	font-size : .9em;
	line-height: 1.4em;
	margin :0;
	padding : 0 .3em;
  }
}

/* Small Vertical Format */
@media screen and (max-device-width: 320px) and (orientation: portrait){
  .box001 h4, .box002 h4, .box003 h4, .box004 h4 {
	font-size : 1.9em;
	line-height: 1.8em;
	padding :0;
  }
  .box001 h5, .box002 h5, .box003 h5, .box004 h5 { 
	font-size : 2.5em;
	line-height: 1.8em;
	text-indent : .4em;
  }
  .box001 h6, .box002 h6, .box003 h6, .box004 h6 {
	font-size : 1.9em;
	line-height: 1.9em;
  }
}


/*  Standard Section -- styles that make basic Sleet*/

/* S05. Navigation tags */

  /* generic nav and ul tags; 
     li widths differentiated based 
     on the number of tags per page
*/
/* S05.01 - nav, > ul, li */
nav, #nav, .nav{
    letter-spacing : normal;
    color : #3f6454;
    margin-bottom : .5em;
    margin-left : .5em;
  
}

/* Small Format -- validated with iPhone5 4/16/14*/
  @media screen and (max-device-width: 320px){
    nav, #nav, .nav, .nav a:active, .nav a:visited, .nav a:link {
	letter-spacing : -.02em;
	word-spacing : -.02em;
	font-size : 1em;
    }
}
  @media screen and (max-device-width: 320px) and (orientation: portrait){
    nav, #nav, .nav, .nav a:active, .nav a:visited, .nav a:link {
	letter-spacing : -.02em;
	word-spacing : -.02em;
	font-size : 2em;
    }
}
.backnav{
  margin: 0 .3em;
}

/* S06. Genre and article styles */


/* S07.  Page-specific styles */

/* S07.1  archive style */

p.archive{
	position: fixed;
	top : 0%;
	left : 12px;
	width : 100%;
	padding : 0 6px;
	font-size: 1.17em;
	font-style: oblique;
	line-height: normal;
	font-variant: normal;
	text-transform: none;
}
.arch-link{
	font-weight: bold;
	font-style: oblique;
	color : #46932d;	
}

/* Small Format */
@media screen and (max-device-width: 480px){
	p.archive {font-size: 2em; line-height: 2.1em; letter-spacing: -.02em;}
}

.a-z-list {  
	width : 62%;
	margin : 0 11%;
   padding : 0 8% ;
}
.a-z-list h4{
   padding-top: 1%;
	padding-left: .5em;
   text-indent : -1em;
	margin-bottom : .3em;
}

.a-z-list h5{
	padding-left : 1em;
   padding-bottom : .25em;
	text-indent : -1em;
	font-size : .9em;
	line-height : 1em;
	margin-bottom : .3em;

}
/* S07.2  used on "about us" page */
.aboutus{
/* outer container for staff bios */
	clear : right;
	display : block;
	overflow : visible;
	padding-left: 1.5em;
	margin : 1em 0 0 0 ;
}

.aboutus > h4, .aboutus h5{
	width : 26%;
	text-indent : -16px;
	font-size : .9em;
	line-height : 1em;
	font-weight : normal;
}
.aboutus h4{
	font-size : 1.2em;
	padding-top : 3em;
}
.aboutus h5{
	font-size : 1em;
	font-weight : bold;
}

.aboutus img{
	position : relative;
	left : 27%;
	top : -5em;
	font-size : .9em;
	line-height : 1em;
	font-weight : normal;
	text-indent : 1em;
	margin-bottom : -5em;
	text-align : center;
}

.aboutus p{
	margin-top : 0;
	margin-bottom : 1em;
	font-size : .9em;
	line-height : 1em;
	font-weight : normal;
	text-indent : 1em;
}

/* S07.3  used on submissions page */
h4.submissions{
	font-size : 1.5em;	
}

ul.submissions{ 
   list-style-image : url("../images/woman_sm.gif");
	list-style-type: disc;
	list-style-position: outside;
	margin-bottom: 1em;
}

h6.submissions{
   letter-spacing : .03em;
}
 .emphatic{
/* used on submissions page to emphasize "we are closed" */
   font-size : 1.2em;
   letter-spacing : .03em;
   word-spacing: .02em;
   font-weight:bolder;
}

/* S07.4  used on selected pages */

#content-header{
   /* container for author and title info 
	at top of selected page */
   margin : 0 0 2% 0;
   padding-top : 0;
   /*border-bottom : solid .8em #77bc55;*/
}

#content-header h5{
   margin-top : 0;
   margin-bottom : .5em;
}

/* Small Format */
@media screen and (max-device-width: 480px){
  #content-header .piece-title	{ margin-left : .5em; }
}


h4.author{
	margin : 2% 0 2% -1em;
	padding-left : .3em;
   /*font-size : 1.5em;*/
   line-height : 1.5em;
}
h4.author-interview{
	margin : 2% 0 1% -1em;
   /*font-size : 1.3em;*/
   line-height : 1.5em;
}

/* Small Format */
@media screen and (max-device-width: 480px){
  h4.author, h4.author-interview	{
 margin-left : 0; 
 font-size : 1.6em;
  }
}

/*a*/
.piece-title{
	display : block;
	padding : 0;
	line-height : .9em;
	text-decoration : none;
	color : #20201b;
}

.piece{
  background-color : #77bc55;
  color: #3d3d35; 
  text-shadow: 2px 2px 2px #22cb2a;
  padding: .5em 5% 1.5em 5%;
}
.piece a:hover {color:#becabc;}

}


/* S08. <p> styles */

p.flush-left {
   letter-spacing : .03em;
}
p.poetry-flush-left{	/* wider between lines, less between stanzas */
   letter-spacing : .03em;
   text-indent : 0; 
   line-height : 1.4em;
   padding-bottom : .7em;
}
p.poetry-free-spaced{	/* based on poetry-flush-left */
   letter-spacing : .03em;
   text-indent : 0; 
   white-space : pre;
}

/* for indenting poetry on large screens only */
@media screen and (min-device-width: 1024px){
.indented-12 {padding : 0 0 0 12%;}
.indented-20 {padding : 0 15% 0 20%;}
.indented-32 {padding : 0 20% 0 32%;}
}

p.hanging-left {
   letter-spacing : .03em;
	text-indent : -2em;
}
p.centered {
   letter-spacing : .03em;
	padding : .8em;
	text-align : center;
}

.right-aligned {
   letter-spacing : .03em;
	padding : .8em;
	text-align : right;
}

p.indented {
   letter-spacing : .03em;
	padding: .8em;
	text-indent : 3em;
}

/* Small Format:  iPhone with portrait orientation */
@media screen and (max-device-width: 320px) and (orientation: portrait){
	p, p.flush-left, p.poetry-flush-left, p.centered, p.indented, p.right-aligned { 
		font-size : 2.3em;
		line-height : 1.8em;
		letter-spacing : -.02em;
	}
	p.indented {
		text-indent: 1.5em;
	}
}

p.epigram{
   margin : .3em 0 1% 0;
   line-height : .8em;
   font-size : .8em;
   font-style : italic;
   letter-spacing : 0;
   text-indent : 3em;
}
p.epigram-author{
  margin : .3em 0 1% 0;
  font-size : .75em;
  line-height : 1em;
  font-weight : normal;
  text-indent : 7em;
}

p.interview-intro{	
	font-size : .92em;
	line-height : 1.1em;
	letter-spacing : .01em;
	
}

p.ed-note{	
	font-size : .9em;
	line-height : 1.1em;
	letter-spacing : -.01em;
}


p.end-note{	
	font-size : .9em;
	line-height : 1.1em;
	letter-spacing : -.01em;
}
p.end-note a{
	color : #778599; text-decoration: none;}
p.end-note a:hover{color: #b3b0b3; text-shadow: 2px 2px 2px #cdd8cc;}



p.embedded-poem{
/* for, e.g., poems stuck in interviews */
   font-weight : normal;
   font-style : italic;
   margin : 1% 0 1% 0;
   line-height : 1em;
   font-size : 1em;
   letter-spacing : .03em;
   text-indent : 2em;
}

p.embedded-poem-flush-left-3m-indent{
/* for, e.g., poems stuck in interviews */
   font-weight : normal;
   font-style : italic;
   margin : 1% 0 1% 0;
   padding-left : 3em;
   line-height : 1em;
   font-size : 1em;
   letter-spacing : .03em;
   text-indent : none;
}

p.embedded-poem-3m-indent{
/* for, e.g., poems stuck in interviews */
	font-weight : normal;
	font-style : italic;
   margin : 1% 0 1% 0;
   line-height : 1em;
   font-size : 1em;
   letter-spacing : .03em;
	text-indent : 5em;
}

p.extra-space{line-height : 1.15em;}
p.extra-half-space{line-height : .5em;}

.art-credit{margin:0; padding: 0; font-style : italic; font-size: .6em; line-height: .6em;}

caption{
	font-size : .9em;
	line-height : .9em;
}

blockquote{
	margin-left : 3%;
	font-size : .9em;
	letter-spacing : -.02em;
	word-spacing : -.02em;
}


@media screen and (max-device-width: 320px) and (orientation: portrait){
  blockquote{
	font-size : 1.8em;
	line-height : 1.4em;
  }
}


/* S09.  bio */

#bio{
	margin : .3% 0 0 0;
   	padding : 0;
   	border-bottom : solid .8em #77bc55;
}
#bio.box { 
/* metro */
	border:none;
}

#bio > p{
	font-size : .9em;
	line-height : .9em;
	padding-bottom : .9em;
	text-indent : .9em;
}
#bio a{ text-decoration: none;}
#bio a:hover{color: #8c832c; text-shadow: 2px 2px 2px #4d2315;}

@media screen and (max-device-width: 320px) and (orientation: portrait){
#bio > p{
	font-size : 1.9em;
	padding-bottom : .6em;
	}
}

/* S20.  footer tags */


footer, #footer {
  position: static;
  min-height : 2em;
  width : 96%;
  margin : 3% 2% 2px 2%;
  padding : 0 .2em;
  text-align : left;  
  vertical-align : middle;
  line-height : .9em;
  font-size : .8em;
  
  }

@media screen and (max-device-width: 320px) and (orientation: portrait) {
    footer, #footer {
	/*position : fixed;
	background-color: #becabc; 
	left : 0;
	bottom : 1%; */
        width : 100%;
	font-size : 1.8em;
	min-height : 3.2em;
	padding-bottom : 2px;
	margin : 1.5em 2% 0 2%;
	}
    }

/*@media screen and (max-device-width: 320px){
    footer, #footer {
	height : 3em;
	}
}*/

/*Custom
C01.   */

/* pad lines out on main page poetry to fit copy */
@media screen and (max-device-width: 320px) {
  .main-pad { line-height : 1.4em;
	}
}

.buehner-photo-float{
  float: left;
  width : 30%;
  margin:0 1em 0 -1.5em;  
  text-align: right;
}

.dwyer-photo-float{
  float: right;
  width : 60%;
  margin:0 0 0 1em;  
  text-align: right;
}

.thomas-photo-float{
  float: right;
  width : 30%;
  margin:0 0 0 1em;  
  text-align: right;
}

.sands-flush-left {
   /* based on poetry-flush-left*/
   letter-spacing : .03em;
   text-indent : 0; 
   line-height : 2.2em;
   padding-bottom : .7em;
	}
.sands-indented-20em {
   /* based on poetry-flush-left*/
   letter-spacing : .03em;
   text-indent : 20em; 
   line-height : 2.2em;
   padding-bottom : .7em;
	}

@media screen and (max-device-width: 320px) {
.sands-flush-left {
   font-size : 1.5em;
   letter-spacing : -.03em;
     word-spacing : -.03em;
  }
.sands-indented-20em {
     font-size : 1.5em;
     margin-right : -.5em;
     padding-right : -.5em;
     letter-spacing : -.03em;
     word-spacing : -.03em;
     text-indent : 7em;
  }
}

.followon-link{
/* used for "more from (author)" links at the end of a page*/
  font-size : .92em;
  font-style : italic;
  text-align : right;
}
@media screen and (max-device-width: 320px) {
  .followon-link{
  font-size : 1.8em;
	}
}

/* for awards announcement on home page */
.awardme {
  margin-top : 0;
  margin-bottom : 0;
  padding-top : 0;
  padding-bottom : 0;
}
h3.awardme {
  font-size : 1em;
  line-height : 1em;
  margin-bottom : .2em;
}
h4.awardme {
  font-size : .9em;
  line-height : .6em;
  margin-top : 4pt;
}
h5.awardme, h5.awardme a{
  font-size : .85em;
  line-height : .7em;
}
@media screen and (max-device-width: 480px) {
  h3.awardme{
  margin : .2em 0;
  font-size : 1.8em;
  line-height : 1.4em;
	}
  h3.awardme em{
  font-size : .9em;
	}
  h4.awardme {
  font-size : 1.2em;
  line-height : 1.2em;
  margin-top : 3pt;
	}
  h5.awardme, h5.awardme a {
  font-size : 1em;
  line-height : 1em;
	}
}

/* Small Format:  iPhone with portrait orientation */
@media screen and (max-device-width: 320px) and (orientation: portrait){
  h3.awardme{
  margin : .2em 0;
  font-size : 1.8em;
  line-height : 1.6em;
	}
  h3.awardme em{
  font-size : .9em;
	}
  h4.awardme {
  font-size : 1.4em;
  line-height : 1.5em;
  margin-top : 3pt;
	}
  h5.awardme, h5.awardme a {
  font-size : 1.1em;
  line-height : 1.1em;
	}
}