/* Style Sheet for use with Choir Remix and Remix Voices December 2009 */


/* Sets up the yellow body and general text,
   margins and padding */

body {
       margin: 0;
       padding: 0;
       font: 90% arial, helvetica, sans-serif;
       background: #ffff66;
       color: #000066;
     }

/* Sets up the general h1 heading for the page */

h1 {
     color: #000066;
     margin: 0;
     padding: 0;
   }

/* Sets up the general h2 heading for the page */

h2 {
     color: #000000;
     margin: 0;
     padding: 0;
   }

/* Sets up image divisions to be left aligned */

/* Sets up image divisions to be centered */

/* Sets up image divisions to be right aligned */

/* Sets up the top heading graphic, with a minimum width 
   to correspond to other minimum widths */

#header {
     min-width: 610px;
     background: #000066;
     color: #ffff66;
     margin: 0;
     padding: .5em 3%;
     border-bottom: 5px solid #ffff66;
     text-align: center;
   }

/* Sets up the container for the 2000 pixel wide two color background graphic
   for the first two columns, with the color change set to 15%, as in
   the graphic, minimum width to correspond to other minimum widths */

#container {
             min-width: 646px;
             background: url(../images/backgroundnavandconta.gif) repeat-y 15% 0;
           }

/* Sets up the container for the 2000 pixel wide transparent and one color 
   background graphic for the third column, with the color change set to 75%,
   as in the graphic, minimum width to correspond to other minimum widths */

#container2 {
             min-width: 646px;
             background: url(../images/backgroundnewsa.gif) repeat-y 80% 0;
           }

/* Sets up the content for the first column, navigation, floated left. 
   Column is 15% of the screen width, minimum width to just contain 
   navigation labels */

#navigation {
              width: 13%;
              min-width: 80px;
              float: left;
              margin: 1em 1%;
              display: inline;
            }

/* Sets up the appearance and behaviour of the navigation column */

ul#navigationlist {
                 margin-left: 0;
                 padding-left: 0;
                 list-style-type: none;
               }

ul#navigationlist a {
                   display: block;
                   text-decoration: none;
                   background: #ccffcc;
                   color: #000066;
                   padding: .2em .3em;
                   border-bottom: 1px solid #000066;
                   width: 6em;
                 }

ul#navigationlist a#thispage {
                              display: block;
                              text-decoration: none;
                              background: #99cc99;
                              color: #000066;
                              padding: .2em .3em;
                              border-bottom: 1px solid #000066;
                              width: 6em;
                             }

ul#navigationlist a:visited {
                             background: #dfffdf;
                             color: #000066;
                            }


ul#navigationlist a:hover {
                           background: #000066;
                           color: #ffff99;
                          }

ul#navigationlist li {
                      background: #ffff99;
                      display: inline;
                      width: 6em;
                     }

/* Sets up the content for the second column, content, floated left next to
   the navigation column. Column is 60% of the screen width, minimum width 
   set to accomodate a maximum image width of 360px */

#content {
           width: 61%;
           min-width: 400px;
           float: left;
           margin: 1em 2%;
           display: inline;
         }

/* Sets up the default h1 appearance in the content column */

#content h1 {
             color: #6c000a;
             font-size: 200%;
             font-weight: bold;
             text-align: center;
             letter-spacing: .3em;
             padding-bottom: .5em;
            }

/* Sets up the default h2 appearance in the content column */

#content h2 {
             color: #6c000a;
             font-size: 160%;
             font-weight: normal;
             text-align: center;
             letter-spacing: .1em;
             padding-bottom: .3em;
            }

/* Sets up the default h3 appearance in the content column */

#content h3 {
             color: #6c000a;
             font-size: 125%;
             font-weight: bold;
             text-align: left;
             letter-spacing: .1em;
             padding-bottom: .3em;
            }

/* Sets up the default p appearance in the content column */

#content p {
             color: #000066;
             font-size: normal;
             font-weight: normal;
             text-align: justify;
             letter-spacing: normal;
             padding-bottom: .8em;
            }

/* Sets up the content for the third column, news, floated left next to
   the content column. Column is 25% of the screen width. Minimum width set
   to look OK as a text column at minimum */

#news {
        width: 18%;
        min-width; 100px;
        float: left;
        margin: 1em 0 1em 1%;
        display: inline;
      }

/* Sets up the default h1 appearance in the news column */

#news h1 {
             color: #000000;
             font-size: 150%;
             font-weight: normal;
             text-align: left;
             letter-spacing: normal;
             padding-bottom: .5em;
            }

/* Sets up the default h2 appearance in the news column */

#news h2 {
             color: #003d39;
             font-size: 125%;
             font-weight: bold;
             text-align: left;
             letter-spacing: normal;
             padding-bottom: .3em;
            }

/* Sets up the default h3 appearance in the content column */

#news h3 {
             color: #003d39;
             font-size: 115%;
             font-weight: normal;
             text-align: left;
             letter-spacing: normal;
             padding-bottom: .3em;
            }

/* Sets up the default p appearance in the content column */

#news p {
             color: #002809;
             font-size: normal;
             font-weight: normal;
             text-align: left;
             letter-spacing: normal;
             padding-bottom: .6em;
            }

/* Sets up the content for the footer, floated to clear the 
   navigation, content and news columns. */

#footer {
          clear: both;
          background: #000066;
          color: #ffff66;
          font: 60% arial, helvetica, san-serif;
          padding: 5px 3%;
          text-align: center;
          border-top: 5px solid #ffff66;
        }

/* Sets up a division class to style and left align images */

.imageleft {
              text-align: left;
             }

/* Sets up a division class to style and center images */

.imagecenter {
              text-align: center;

             }
/* Sets up a division class to style and right align images */

.imageright {
              text-align: right;
             }