/***** reset *****/

html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,a,img,ol,ul,li,form,label,table,caption,tbody,tfoot,thead,tr,th,td,input {
  margin: 0;
  padding: 0;
  border: 0;
  font-weight: inherit;
  font-style: inherit;
  font-size: 100%;
  font-family: inherit;
  vertical-align: baseline;
}
body { line-height: 1.5; }
a img { border: none; }
table {border-collapse: separate; border-spacing: 0;}/* Tables still need 'cellspacing="0"' in the markup. */
caption,th,td {text-align: left; font-weight: normal;}
table,td,th {vertical-align: middle;}

/***** global style *****/

body {
  color: #222;
  background-color: #a67c52;
  font-family:"Palatino Linotype","Book Antiqua",Palatino,FreeSerif,Georgia,serif;
}

h1,h2,h3,h4,h5,h6 { font-weight: normal; color: #111; }

h1 { font-size: 3em; margin-bottom: 0.5em; }
h2 { font-size: 2em; margin-bottom: 0.75em; }
h3 { font-size: 1.5em; margin-bottom: 1em; }
h4 { font-size: 1.2em; margin-bottom: 1.25em; }

p { font-size:1.1em; }

a:focus,a:hover { color: #D80F06; }
a { color: #0666D8; text-decoration: underline; }

li ul,li ol { margin:0 1.5em; }
ul, ol { margin: 0 1.5em 1.5em 1.5em; }

ul { list-style-type: disc; }
ol { list-style-type: decimal; }

div.note {background-color:#f9f8eb;margin-bottom:.65em;padding:1.1em 5.7em;}
div.info {background-color:#ebf3f9;margin-bottom:.65em;padding:1.1em 5.7em;}
div.main {background-color:#fffef5;margin-bottom:.65em;padding:1.1em 5.7em;}

div.info p {color:#223140;}

div.alert,div.infoSmall {
  padding-top:.8em;
  padding-bottom:.8em;
}
div.alert p,div.infoSmall p{font-size:1em;line-height:1em;}
div.alert p{color:#e26000;}

.hide{display:none;}
span.nw{ white-space:nowrap; }
.alertText {color:#e26000;}
span.by {font-style:italic;margin-right:.3em;}

/* The main page container */
#container {
  background-color:#223140;
  width:800px;
  margin:0 auto;
  padding:.4em 1.25em;
}

/***** Tabbed boxes *****/

.tabbedBox {position:relative;}
.tabbedBoxTab{position:absolute;left:0;top:0;bottom:0;;width:24px;}
.tabbedBoxTab img{position:absolute;top:0;bottom:0;margin:auto;}

.note .tabbedBoxTab {background-color:#e26000;}
.info .tabbedBoxTab {background-color:#658498;}
.main .tabbedBoxTab {background-color:#658498;}

/***** Header *****/

div#title {
  width:800px;
  height:105px;
  background-image:url("/img/graphics.png");
}

div#title a{
  display:block;
  width:100%;
  height:100%;
}

/***** Navigation *****/

#nav ul,#extendedNav ul{
  width:800px;
  height:40px;
  margin:0;
  list-style:none;
  position:relative;
}

#nav li,#extendedNav li{
  position:absolute;
  top:0;
}

#nav li,#nav a,#extendedNav li,#extendedNav a{
  height:40px;
  display:block;
  background-image:url("/img/graphics.png");
}

/* Regular nav */

#nav li, #nav a{width:225px;}
#nav li#subscribeButton, #nav li#subscribeButton a{width:125px;}

#nav #aboutButton{left:0px;}
#nav #archiveButton{left:225px;}
#nav #lettersButton{left:450px;}
#nav #subscribeButton{left:675px;}

#nav #aboutButton a{background-position:0px -105px;}
#nav #archiveButton a{background-position:-225px -105px;}
#nav #lettersButton a{background-position:-450px -105px;}
#nav #subscribeButton a{background-position:-675px -105px;}

#nav #aboutButton a:focus,#nav #aboutButton a:hover{background-position:0px -145px;}
#nav #archiveButton a:focus,#nav #archiveButton a:hover{background-position:-225px -145px;}
#nav #lettersButton a:focus,#nav #lettersButton a:hover{background-position:-450px -145px;}
#nav #subscribeButton a:focus,#nav #subscribeButton a:hover{background-position:-675px -145px;}

/* Extended nav (with submit) */

#extendedNav #aboutButton{left:0px;width:200px;}
#extendedNav #archiveButton{left:200px;width:202px;}
#extendedNav #lettersButton{left:402px;width:202px;}
#extendedNav #subscribeButton{left:604px;width:100px;}
#extendedNav #submitButton{left:704px;width:94px;}

#extendedNav #aboutButton a{background-position:0px -185px;width:200px;}
#extendedNav #archiveButton a{background-position:-200px -185px;width:202px;}
#extendedNav #lettersButton a{background-position:-402px -185px;width:202px;}
#extendedNav #subscribeButton a{background-position:-604px -185px;width:100px;}
#extendedNav #submitButton a{background-position:-704px -185px;width:94px;}

#extendedNav #aboutButton a:focus,#extendedNav #aboutButton a:hover{background-position:0px -225px;}
#extendedNav #archiveButton a:focus,#extendedNav #archiveButton a:hover{background-position:-200px -225px;}
#extendedNav #lettersButton a:focus,#extendedNav #lettersButton a:hover{background-position:-402px -225px;}
#extendedNav #subscribeButton a:focus,#extendedNav #subscribeButton a:hover{background-position:-604px -225px;}
#extendedNav #submitButton a:focus,#extendedNav #submitButton a:hover{background-position:-704px -225px;}

/***** Footer *****/

#footer p {
  font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;
  font-size: .75em;
  text-align:center;
  margin:0;
  padding: 1em 0;
  color: #aaa;
}

/***** Story *****/

div.story {padding-bottom:4em;}

div.story h1.storyTitle {
  font-size: 1.3em;
  font-weight:700;
  margin: 0;
  text-align: center;
  padding-top:1.5em;
}

div.story h2.storyAuthor {
  font-size: 1.1em;
  margin: 0 0 1.7em 0;
  text-align: center;
}

div.story h3{
  font-size:1.1em;
  text-align: center;
  font-style:italic;
  font-weight:700;
  margin:2.5em 0 1em;
  page-break-after:avoid;
}

div.story p {
  text-indent:3em;
  widows:2;
  orphans:2;
}

div.story p.noindent {
  text-indent:0;
}

div.story div.footnote{
  margin-top:2em;
}

div.story div.footnote p{
  text-indent:0;
  font-size:1em;
  line-height:1.1em;
  font-weight:700;
  text-align: center;
}

div.story hr {
  border: none 0;
  border-top: 1px solid #222;
  height: 1px;
  width: 25%;
  text-align: center;
  margin: 2em auto;
}

/***** Story About *****/

div.about {
  page-break-before:always;
  background-image: url("/img/splot.png");
  background-position: 640px bottom;
  background-repeat: no-repeat;
  padding-top:2em;
  padding-bottom:2em;
}

div.about h1 {
  color:#e26000;
  font-size:1.2em;
  font-style:italic;
  font-weight:700;
  margin:0;
}

/***** Submissions *****/

div.submissionInstructions ol{
  margin-left:3em;
  margin-top:1em;
}

div.submissionInstructions ol li{
  margin-bottom:1em;
}

/***** About Popcorn Fiction *****/

div.aboutPF {
  padding-top:2.2em;
  padding-bottom:2.2em;
  background-image: url("/img/splot2.png");
  background-position: 680px bottom;
  background-repeat: no-repeat;
  text-indent:3em;
}

.sig{margin:1em 0 0 22em;}
.sig p.sigName {font-weight:700;}

/***** Letters *****/

.letter h2 {
  font-size:1.1em;
  font-weight:700;
  margin:.5em 0 1em 0;
}

.letter p,.reply p {
  margin-top:.5em;
  margin-bottom:1em;
}

.letter .sig { margin-top:0; }
.letter .sig .valediction { margin-bottom:0; }
.letter .sig .sigName { margin-top:0; }

.reply div.script{
  background-color:#fff;
  padding: 1em;
}

.reply div.script p{
  font-size: 1.1em;
}

/***** Previous Stories *****/

div.archiveListing h1.storyTitle {
  font-size: 1.3em;
  font-weight:700;
  margin: 0;
  display:inline;
}

div.archiveListing h1.storyTitle a{color:#222;text-decoration:none;}

div.archiveListing h2.storyAuthor {
  font-size: 1.1em;
  display:inline;
}

div.archiveListing span.by {
  margin-left:.4em;
}

div.archiveListing p {margin-top:0em;}

.currentButton,.previousButton {display:block;width:100%;height:100%;position:absolute;top:0;left:0;}
.archiveListing:hover{background-color: #d9e9f3;}
.currentArchiveListing:hover{background-color: #ffe9c1;}

.storyIntro p{font-style:italic;font-weight:700;color:#223140;min-height:48px;}
.currentStoryIntro p{font-style:italic;font-weight:700;color:#e26000;min-height:48px;}

/***** Printing *****/

@media print{
  body,#container,div.main,div.story,div.info,div.about{
    background:none;
  }
  div#title,#nav,#extendedNav{display:none;}
  #container{width:100%;}
  #footer p {margin:0 2em;}
  .storyIntro,.currentStoryIntro{display:none;}
}