@import url(./tales.css);
@import url(http://fonts.googleapis.com/css?family=Eagle+Lake);

@media screen, print {
  h2, h3 { font-family:'Eagle Lake', serif; color:cyan; }
  h2 { font-size:2em; }
  h3 { font-size:1.7em; padding:0.4em 0; border:1px solid yellow; }
  ol.zero  { }
} /* @media screen, print */

@media screen {
  /* Colour Scheme */
  body       { background:#222 url(../backgrounds/stones.gif);
            margin:0px;
            padding:0px; }
  
  a:link     { color:#0ff; text-decoration:none; }
  a:visited  { color:#0aa; text-decoration:none; }
  a:focus    { color:#0cc; text-decoration:none; } 
  a:hover    { color:#0cc; text-decoration:none; } 
  a:active   { color:#0cc; text-decoration:none; }
  
  dl.index   { border-color:#222; }
  
  .alone, .begin, .last,
  div.content h2, div.content h3
             { border-color:#222; }
  
  /* Layout */
  
  h2       { position:absolute;
             top:0;
             left:0;
             width:100%; }
  
  div.upper-bar
             { background:url(../tales/bar1.gif);
               background-repeat:repeat-x;
               background-position:bottom;
               width:100%;
               height:24px;
               padding-top:80px;
               z-index:2 }
  
  div.upper-tbar
             { background:url(../tales/barto.gif);
               position:absolute;
               width:23px;
               height:24px;
               top:80px;
               left:15em;
               z-index:5; }
               
  div.middle-bar
             { background:url(../tales/bar2.gif); 
               position:absolute;
               width:23px;
               top:104px;
               left:15em;
               bottom:0;
               z-index:5; }
               
  dl.index  { width:15em;
              border-top:none;
              margin:0; }
  
  dl.index dd,dl.index dt
            { padding-left:0.5em;
              padding-right:0.5em; }

  dl.index dd { padding-left:1.5em; }
             
  div.content { margin:0;
                width:auto;
                margin-left:15em;
                padding-left:23px;
                padding-top:0;
                border-top:1px solid black;
                border-bottom:1px solid; }
  
  /* Paragraphs and Lists */
  h3      { background:transparent; text-align:center; } 
  
  p       { padding-left:2em;
            padding-right:2em; }
  
  p.lines { clear:none;
            margin:1em 0; }
  
  .highlight
          { color: aqua; }
            
  p.last  { margin-bottom:0; }
  p.begin { margin-top:0; }
  
  div.lonewolf
          { background:#003 url(../backgrounds/bluestuff.jpg);
            border-color:#003; }
  
  div.ishra
          { background:#202 url(../backgrounds/stone.jpg);
            border-color:#202; }
  
  div.people
          { background:#210 url(../backgrounds/bronze.jpg);
            border-color:#210; }
          
  div.people p.alone,
  div.people p.begin,
  div.people p.last
          { border-color:#210; }
  
  div.ishra p.alone,
  div.ishra p.begin,
  div.ishra p.last
          { border-color:#303; }
  
  div.lonewolf p.alone,
  div.lonewolf p.begin,
  div.lonewolf p.last
          { border-color:navy; }
} /* @media screen */        

@media print {
  h3      { background:black;
            color:white;
            padding-top:2px;
            margin-bottom:1em; }

  div.upper-bar, div.upper-tbar, div.middle-bar
          { visibility:hidden;
            display:none; }

  div.lonewolf, div.ishra, div.people
          {  border-color:black; }

  div.lonewolf
          { background:transparent;
            color:navy; }
  
  div.ishra
          { background:transparent;
            color:black; }
  
  div.people
          { background:transparent;
            color:maroon; }
            
  p.lines { margin-left:0;
            margin-right:0; }
} /* @media print */