/* Originally generated by CaScadeS, a stylesheet editor for Mozilla Composer */
/* edited by Lee Oliver */

/* import css for thickbox to work for image galleries */                                                         
/* @import "/css/thickbox.css" screen; */   /* the 'screen' media attribute causes big problems for IE 6&7 */ 
@import "/css/thickbox.css";

/* body tag to be declared first */

  body {
  margin: 0pt;
  padding: 0em 1em 1em 1em;
  font-family: "Comic Sans","Comic Sans MS",sans-serif;
  background-color: rgb(239, 231, 214);
  }

/* headings */

  h1, h2, h3, h4, h5, h6 { 
  color: rgb(139, 69, 19);
  padding-top: 0pt;
  margin-top: 0pt;
  clear: both;  /* force headings to start on a new line, clear of any floated images from earlier sections */     
  }

  hr {
  width: 90%;
  height: 2px;
  }

/* paragraphs */

  p {
  line-height: 1.25em;
  font-size: 14px;
  }
  
/* class for error highlighting on forms */  
  
  p.error { color: #FF0000;
  }
/* class for author's name at bottom of a piece */  
  
  p.author { float: right;
  }
  
  p.author + p {
  clear: right;  /* selector for p immediately following p.author */
  /* paras immediately following p.author must be cleared of the float:right */
  /* does not work with IE 5/6, does work with IE 7 and others */  
  }                             

  form {border: 1px solid #000; padding-left:5px; padding-right:5px; margin-bottom: 10px;}

/* images */

  img { border-style: none;
    margin: 0.5em;
    }

    /* The following two classes prevent images from being shown on the same row, if floated */
    /* will need some other method for this - another class? */

  img.img_left {
    float: left;
    clear: left;    /* force image on a new line, clear of anything else floated on the left */
    }

  img.img_right {
    float: right;
    clear: right;   /* force image on a new line, clear of anything else floated on the right */
    }
    
  img.img_centre {
    display: block;
    margin-left: auto;
    margin-right: auto;
    clear: both;
    }        

/* Tables */

  table { 
    vertical-align: top;
    text-align: left;
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 1em;
    border: none; 
    border-collapse: collapse;         
    }
	
  table caption {
  font-size: 125%;
  }
  
  thead, tfoot {
  font-size: 125%;
  background-color: rgb(255, 204, 153);
  }
  
  tbody {
  background-color: rgb(255, 255, 204);
  }
    
  th, td {
  border-bottom: 2px solid rgb(239, 231, 214);  /* same as body background */ 
  padding: 0.25em;
  vertical-align: top;
  font-weight: normal;   
  }

  ul.table {
  margin: 0pt;
  padding: 0pt;
  clear: both;
  list-style-type: none;
  }
  
  ul.table li {
  display: block;
  float: left;
  margin: 0px; 
  padding: 0px;
  border: 1px solid #000;
  }
  
  li.date {width: 80px; }
  li.score {width: 70px; }
  li.text {width: 150px; }

/* image gallery of thumbnails as an unordered list */
/* thumbnails must be no more than 160 x 135 pixels */
/* to be used with the thickbox script */ 

  ul.gallery {
  margin: 0pt;
  padding: 0pt;
  clear: both;
  list-style-type: none;
  }
  
  ul.gallery li {
  display: block;
  float: left;
  width: 190px;
  height: 150px;
  margin: 0px; 
  padding: 0px;
  }
  
  ul.gallery li img {
  background-color: #fff;   /* adds white border to each photo */
  margin: 6px;
  padding: 6px;
  border: 1px solid #000; 
  }

/* header div */

  #header { margin: 0pt;
    padding: 0em;
    }

  #header h1 { margin: 0pt;
    padding: 0pt;
    display: inline;
    }

/* main content div */

  #content { margin: 0pt;
    padding: 1em 0em 0pt;
    float: right;
    width: 75%;
    }

/* Navigation sidebar */

  #nav { margin: 1em 0em;
    padding: 1em;
    font-size: smaller;
    background-color: rgb(255, 255, 204);
    float: left;
    width: 14%;
    }

  #nav ul { margin: 0pt;
    padding: 0pt;
    list-style-type: none;
    }

  #nav ul li { margin-bottom: 0.5em;
    }

/* Search input box - intended to sit within navigation sidebar */

  #searchBox { margin: 0em 0em 0.5em 0em; 
    /* needs more work */
    /* ideally, the 'Caption needs to be normal size, with the 'powered by' smaller */ 
    /* font-size: smaller; */
    }
    
/* Footer */

  #footer { /* border: 1px solid rgb(0, 71, 250); */
    margin: 1em 0em;
    padding: 0.5em;
    clear: both;
    text-align: center;
    }

  #footer p { margin: 0em;
    padding: 0em;
    }

  #footer img { margin-right: 1em;
    }

  #nav, #footer { border: 1px solid rgb(139, 69, 19);
    }

  a:link, a:visited { color: rgb(139, 69, 19);
    }

  a:active, a:hover { color: rgb(255, 0, 0);
    }

select.middle, textarea.middle, input.middle { position:absolute; left:570px; }
select.midmid, input.midmid { position:absolute; left:400px; width:360px;}
input.middlewide { position:absolute; left:570px; width:340px;}
select.middleday { position:absolute; left:570px; width:40px; }
select.middlemonth { position:absolute; left:615px; }
select.middleyear  { position:absolute; left:720px; width 45px;}
input.middlescore { position:absolute; left:570px; width:30px; }
p.withtextbox { padding-bottom:55px;}
textarea.middle { position:absolute; left:350px; width:570px; height:85px; wrap:soft; }

/* Atomz classes - used by the results page template displayed by atomz.com */

.atomz_ad_text_small {
	COLOR: gray;
	/* FONT-FAMILY: "arial,helvetica"; */
	FONT-SIZE: 75%;
}

.atomz_ch{
	cursor:pointer;
	cursor:hand;
	/* Next line hides the adverts - probably against the terms and conditions */
    /* display: none; */
}