/*

   Cascading Style Sheet for the Ozone Watch web site
      http://ozonewatch.gsfc.nasa.gov/

   Written by:
      Rob Simmon
      Leslie Lait

   Revision history:
      $Log: o3watch.css,v $
*/

/*
  ===========================================================
                  Page-Specific Styles
  ===========================================================
*/


/*------------------  Map Pages (Home and Monthly) --------------------------*/

/*
  This holds the main image, right-hand text, and link information
*/
div#main_block {
  left : 0;
  height : 35em;
  margin : 0 0 0 0;
  min-height : 430px;
  padding : 0 0 0 0;
  position : relative;
  text-align : left;
  width : 100%;
}

/*
  This holds the main image and its color legend. 
*/
div#main_img_block {
  left : 0;
  margin : 0 0 0 0;
  padding : 0 0 0 0;
  position : absolute;
  text-align : right;
  width : 48.5%;
}

/*
  Because the "content" DIV is very long, Mozilla wants to push it's
  start onto the next page. We want to avoid this.
*/
@media print {
  div#main_img_block {
    page-break-before : avoid;
  }
}

/*
  The date of the image is displaced above the block, to go alongside
  the H1 title.
*/
h1#image_title {
  float : left;
  margin : 0 0 0 0;
  padding : 0 0 0 0;
  text-align : left;
  text-transform : none;
  width : 50%;
}

h2#image_date {
  float : right;
  color : #444444;
  font-size : 1em ;
  font-weight : lighter;
  margin : 0 0 0 0;
  padding : 0 0 0 0;
  text-align : right;
  text-transform : none;
  width : 50%;
}

/*
  DIV container for the main image
*/
div#main_image {
  margin : 0 0 0 0;
  text-align : center;
}

/*
  Add a little space at the top of the color palette.
*/
img.palette {
  margin : 5px 0 0 0;
}

/*
  The main image is usually a link to a higher-quality version. We want
  the link to be undecorated.
*/
div#main_image a {
  border-style : none;
  color : #FFFFFF;
  text-decoration : none;
}

/*
  DIV container for the color legend
*/
div#color_legend
{
  text-align : center;
}

/*
  This DIV is a container for links that go back and forth over short
  intervals
*/
div#cback_cforward {
  margin : 0.5em 0 0 0;
}

/*
  This DIV is a container for links that go back and forth over short
  intervals
*/
div#back_forward {
  float : left;
  margin : 0.5em 0 0 0;
  text-align : left;
  width : 50%;
}

/*
  This DIV is a container for links that go back and forth over long
  intervals
*/
div#up_down {
  float : right;
  margin : 0.5em 0 0 0;
  text-align : right;
  width : 50%;
}

/*
  This DIV holds the text that usually goes along the right, beside the
  main image. Note: users should be able to change the font size, making
  this column extend or shrink vertically, with minimal ill effects.
*/
div#main_text_block {
  left : 52%;
  margin : 0 0 0 0;
  padding : 0 0 0 0;
  position : absolute;
  text-align : left;
  width : 48%;
}

div#main_text_block dt {
  margin : 0 0 0 1em;
  padding : 0 0 0 0;
}

div#main_text_block dd {
  margin : 0 0 0 1em;
  padding : 0 0 0 0;
  text-align : left;
}

table.anim3 {
  float : left;
  margin : 0 0 1em 0;
  padding : 0 0 0 0;  
  width : 100%;
}

/*
  This DIV specifies the 7-day block of small images across the page
*/
div.daily_block {
  clear : both;
  position : relative;
  padding : 0 0 1em 0;
  text-align : left;
}

/*
  Special setup for the calendar entries for print.
*/
@media print {
  div.daily_block {
    page-break-before: always;
    page-break-inside: avoid;
  }
}


/*
  The "daily" table contains daily thumbnail images. It stretches the
  full width of the "body"-class DIV, minus the padding on either
  side of the DIV#content.
*/
table.daily {
  border-spacing : 0;
  border : 0;
  clear : both;
  margin : 0 0 0 0;
  padding : 0 0 0 0;
  position : relative;
  text-align : center;
  width : 100%;
}

/*
  Table header text.
*/
table.daily th {
  font-weight : normal;
  padding : 0 0 0.3em 0;
  text-align : center;
}

/*
  Table data elements.  Each of these holds a small image and a date.
*/
table.daily tr {
  margin : 0 0 0 0;
  padding : 0 0 0 0;
}

table.daily td {
  border : 0;
  color : #444444;
  margin : 0 0 0 0;
  padding : 0 0 0 0;
  text-align : center;
  vertical-align : top;
}

table.daily a {
  color : #444444;
}
/*table.daily a.span {
  color : #444444;
  z-index : 1;
}*/

/*
  The thumbnail images are links to larger versions. We want these links
  to be unobtrusive.
*/
/*table.daily a {
  border-style : none;
  color : #444444;
  text-decoration : none;
  width : 14.29%;
}*/

/*
  This is for a thumbnail image
*/
/*table.daily img {
  padding : 0 0 0 0;
  z-index: 0;
}*/

/*
  This is for the date beside a thumbnail image
*/
/*
table.daily span.date {
 color : #444444;
 margin : 75px 0 0 -106px;
}
*/
/*
  This is for future dates
*/
/*table.daily span.future  {
  color : #888888;
  margin : 80px 0 0 0;
}*/

/*
  This is for days-of-the-week numbering
*/
/*table.daily span.day_of_week {
  color : #444444;
  position : absolute;
  margin : 78px 0 0 -110px;
}
*/