/*        CSS style for UlsterLiteracy.org  */
/*           colors used:
               logo book (light blue): #0F74BC
               logo text (dark blue): #25368F
                              (gold): #E4BD82
*/

@media screen {     /* Following entry for online use only */
a.external:after {        /* flag external links */      
                  content: url(images/External.png) ;   
                  display: inline ;
                  margin-left: .25em ;
                 }
              }
a img {
       border-style: none ;     /* no border on image links */
       text-decoration: none ;
      }
body {
      background-color: white ; 
      color: black ; 
      font-family: arial, sans-serif ;
      margin-left: 3% ;
      margin-right: 3% ;
     }
div.ads {
         margin-left: auto ; 
         margin-right: auto ; 
        }
div.ads img {
             border: solid black 1px;
             margin: 20px; 
            }
div.caption {                       /* Image caption */
  /*        border: solid black 1px ;     */
          font-size: .95em ;
          margin-bottom: 0 ;        /* bottom-margin provided by div.photo */
          margin-left: auto ;       /* Center caption under image */
          margin-right: auto ;
          margin-top: .5em ;
          max-width: 40em ;         /* Limit width of text box */
          padding-left: .5em ; 
          padding-right: .5em ;
          text-align: center ;
         }
div.caption p {
               margin-bottom: 0 ;
              }
div.debug {
           border: solid red 1px ; 
           padding: 1em ; 
          }
div.footer {
            background-color: white ;
            border-top: solid #25368F 1px ; 
            bottom: 0 ; 
            clear: left ;
            font-size: 85% ;          /* minimum for readability */
            margin-left: auto ;
            margin-right: auto ;
            text-align: center ;
            width: 100% ;
           }
div.footer p {
              margin: .5em ; 
             }
div.leftcol {
             clear: left ; 
             float: left ;
             margin-right: 20px ;
             min-width: 5em ;
             width: 20% ;
            }
div.logo {
          float: left ;  
          margin-bottom: 0 ;
          margin-right: 20px ;       /* Leave space between banner text */
         }
div.logo img {
              border-style: none ;   /* no border on logo */
             }
div.main {
          float: left ;              /* against navigation if container width allows */
          max-width: 40em ; 
          width: 70% ;               /* leave gutter under nav */
                                     /* also determines stacking point */
         }
div.nav ul {
 /*           background-color: white ;  /* in case adjacent text has different bg */ 
            margin-left: 0 ;           /* no margin for non-existant marker */
 /*           margin-top: 0 ;            /* snug against logo */
            padding-left: 0 ;          /* no padding for non-existant marker */
           }
div.nav li {
            list-style-type: none ;
            padding: .25em ;
            text-align: center ;
           }
div.navplus {
             background-color: #0F74BC ;  /* needed for IE 6 and earlier only */
             border-bottom: solid 1px #6DAAD6 ;  /* extend background image, match color */
             border-top: solid 1px #0F74BC ;     /* extend background image, match color */ 
             position: relative ; /* containing block for position: absolute background */
            }
div.navplus * {
               position: relative ; /* enables z-index */
               z-index: 1 ;         /* above scaling background */
              }
div.photo {
           display: table-cell ;       /* Force shrink-to-fit width */
           margin-bottom: 1em ;
           overflow: hidden ;          /* clip if exceeds container size */ 
          } 
div.photo img {
               display: block ;
               margin-left: auto ;
               margin-right: auto ;
              }
div.sidestory {
               position: relative ; /* containing block for position: absolute background */
              }
div.sidestory p {
                 padding-left: .5em ;
                 padding-right: .5em ;  
                }
div.sidestory * {
                 position: relative ; /* enables z-index */
                 z-index: 1 ;         /* above scaling background */
                }
div.sidestory img {
                   height: auto ;       /* retain aspect ratio */ 
                   width: 100% ;        /* Scale the image */       
                  }
div.sidestory img.dummy {               /* Ensure background fills top of sidestory div 
                                           when no story image is present */
                         height: 1px ;
                         width: 1px ; 
                        }
div.sidestory img.dummy + p {           /* First paragraph after a dummy image */
                             margin-top: 0 ; 
                            }
div.staff ul {
              list-style-type: none ; 
             }
               /* Styling of definition list for events, adapted from maxdesign.com */
dl.event {
          margin-top: 0 ;
          padding: 0 ;
         }
dl.event dt {
             font-weight: bold ;
             left: 0 ;
             position: relative ;
             top: 1.2em ;   /* was 1.15 */
             width: 1em ;
            }
dl.event dd {
             margin: 0 0 0 2em ;
             padding: 0 0 .5em .5em ;
            }
dl.event span.time {
                    font-size: larger ;
                   }
h1 {
    margin-top: 0 ;
    text-align: center ; 
   }
h2.calendar {                 
             margin-bottom: 0 ;        /* used with <dl class="event"> */ 
            } 
img#bg1 {                       /* scaled background image */
         height: 100% ;         /* !!! This confuses IE6 !!! */
         left: 0 ;
         position: absolute ;
         top: 0 ;
         width: 100% ;   
         z-index: 0 ;  
        }
img#bg2 {                       /* scaled background image */
         height: 100% ;         /* !!! This confuses IE6 !!! */
         left: 0 ;
         position: absolute ;
         top: 0 ;
         width: 100% ;   
         z-index: 0 ;  
        }
img#ProLitLogo {
                float: right ;
               }
p.address {
           float: right ; 
           font-size: 85% ;
           margin-bottom: 0 ;
           margin-left: 20px ;    /* leave space between banner text */
           margin-top: 0 ;
           min-height: 124px ;    /* Logo height (22) + ? to keep banner centered */
          }
p.donate {
          text-align: center ; 
         }
p.funders img {
               vertical-align: middle ;
              }
p.imgcredit {
            font-size: .9em ;
            font-style: italic ;
            margin-bottom: 0 ;
            margin-left: auto ;
            margin-right: auto ;
            margin-top: 0 ;
            text-align: right ;
           } 
p.pullleft {
            color: #0F74BC ;           
            float: left ;
            font-size: 150% ;
            font-style: italic ;
            margin-right: 20px ;
            margin-top: 0 ;
            max-width: 30% ;
           }
p.pullright {
             color: #0F74BC ; 
             float: right ;
             font-size: 150% ;
             font-style: italic ;
             margin-left: 20px ;
             margin-top: 0 ;
             max-width: 30% ;
            }
p.quote {
         padding-top: 2em ;
        } 
p.selfbanner {
              margin-left: auto ;
              margin-right: auto ;
              margin-top: 0 ;
              text-align: center ;
             }
p.supporters {
              text-align: center ; 
             }
ul.footnav {
            margin: 0 ;                /* no margin for non-existant marker */
            padding-left: 0 ;          /* no padding for non-existant marker */
           }
ul.footnav li {
               display: inline ;
               list-style-type: none ;
               margin-right: 1em ;
              }
.debug {
        display: none ; 
       } 
.dollars {
          text-align: right ;
         }
.dbutton {
          font-weight: bold ; 
         }
.done {            /* Asserted to be completely implemented content */
       text-decoration: line-through ;
      }
.meta {            /* Development notes about future content */
       color: green ;
      }
.photoleft {
            float: left ;           /* Uses shrink-to-fit width */
            padding-right: 1em ;
           }
.photoright {
            float: right ;          /* Uses shrink-to-fit width */
            padding-left: 1em ;
           }
.stretch {                      /* Used to stretch containing block
                                   height to include previously
                                   floated material.    */
          clear: both ;
          line-height: 1px ;
          margin: 0 ;
          padding: 0 ;
         }

@media print {
.noprint {
          display: none ; 
         }
a:link {                            /* Don't decorate printed links */
        background: inherit;
        color: inherit;
        text-decoration: inherit;
       }
a:visited {                            /* Don't decorate printed links */
           background: inherit;
           color: inherit;
           text-decoration: inherit;
          }
a:active {                            /* Don't decorate printed links */
          background: inherit;
          color: inherit;
          text-decoration: inherit;
         }
body {
      font-family: serif ;
     }
h3 {
    page-break-after: avoid ;
   }
             }
/* End of print media section */