/*-------------------------------------------
Homepage styles
---------------------------------------------

Styles specific to the home page.

Specific hacks for Internet Explorer 6 are marked with "IE6 HACK". See
README.txt for details.

Author: Ben Sturmfels, Boojum, December 2008

------------------------------------------*/

/* Shrink headings a little */
h1 { font-size: 1.5em; }
h2 { font-size: 1.3em; }
h3 { font-size: 1em; }
h4 { font-size: 1em; }

/* Audience box layout */
#audience-menu { 
  background: white;
  overflow: auto;
  padding: 0 0 10px 4px;

  _padding-left: 0; /* IE6 HACK */
  _height: 1%; /* IE6 HACK */
}

div.audience { 
  float: left;
  margin-left: 9px;

  _margin-left: 7px; /* IE6 HACK */
}

div.audience div {
  width: 188px;
  padding: 0 0 128px;
  color: white;
  min-height: 8em;
  position: relative;
  overflow: hidden;
                   
  _height: 7.5em; /* IE6 HACK */
}

div.audience h3  {
  font-size: 1em;
  margin: 0;
}

div.audience h3 a {
  color: white;
  text-decoration: none;
  line-height: 1.2em;
  display: block;
  width: 172px; height: 70%;
  position: absolute;
  z-index: 10;
  padding: 0.6em 8px 1.1em;

  /* IE6 HACK to ensure link covers other text underneath */
  background: url(/images/template/trans.png); 
}

div.audience p {
  font-size: 0.9em;
  display: block;
  padding: 0 8px;
  margin: 4.4em 0 0.3em;
 }

div.audience p a {
  color: white;
 }


/* Audience box gradients */
div.audience.sec-1 {
  background: #52772e url(/images/template/bg-h-gradient-cnrs-sec-1.png) right top repeat-y;
}
div.audience.sec-2 {
  background: #8d221d url(/images/template/bg-h-gradient-cnrs-sec-2.png) right top repeat-y;
}
div.audience.sec-3 {
  background: #4a7a89 url(/images/template/bg-h-gradient-cnrs-sec-3.png) right top repeat-y;
}
div.audience.sec-4 {
  background: #591d61 url(/images/template/bg-h-gradient-cnrs-sec-4.png) right top repeat-y;
}
div.audience.sec-5 {
  background: #da5b23 url(/images/template/bg-h-gradient-cnrs-sec-5.png) right top repeat-y;
}


/* Audience box photos */
div.audience.sec-1 div {
  background: url(/images/template/bg-parents-community.jpg) left bottom no-repeat;
}
div.audience.sec-2 div {
  background:url(/images/template/bg-students-children.jpg) left bottom no-repeat;
}
div.audience.sec-3 div {
  background: url(/images/template/bg-school-professionals.jpg) left bottom no-repeat;
}
div.audience.sec-4 div {
  background:  url(/images/template/bg-early-childhood-professionals.jpg) left bottom no-repeat;
}
div.audience.sec-5 div {
  background: url(/images/template/bg-skills.jpg) left bottom no-repeat;
}

.audience h3 a:hover,
.audience h3 a:active,
.audience h3 a:focus { text-decoration: underline; }


/* Tweaks for sub-content-a and main-content */
#sub-content-a h1.top {
  /* same as menu headers */
  font-size: 1.1em;
  line-height: 1.2;
  font-weight: bold;
  background: #41689f url(/images/template/bg-v-gradient-cnrs-sub-content-a.png) left top repeat-x;
  padding: 0.3em 0.7em;
  margin: 0 -11px;

  _line-height: 1.0; /* IE6 HACK */
  _padding-top: 0.5em; /* IE6 HACK */
}

#sub-content-a h2,
#main-content h2 {
  clear: none;
  font-size: 1em;
  color: #333;
  border: none;
  padding: 0;
}

#main-content .inner h1#page-title {
  font-size: 1.1em;
  font-weight: bold;
  overflow: auto;
  line-height: 1.2;
  padding: 0.3em 0.7em;
  margin: 0 -11px;

  _line-height: 1.0; /* IE6 HACK */
  _padding-top: 0.5em; /* IE6 HACK */
  _margin-right: -12px; /* IE6 HACK */
}

.news-item,  .news-item-long{ 
  border-bottom: 1px dotted #ddd;
  margin: 0;
  overflow: auto;
}

.news-item h3, .news-item-long h3 { 
  clear: both;
}

#main-content .news-item img{
  background: yellow;
  clear: left;
  height: 64px;
  width: 60px;
  margin-bottom: 1.5em;
}

#main-content .news-item-long img{
  background: yellow;
  clear: left;
  margin-bottom: 1.5em;
}

#page-slideshow, #home-slideshow, {
   margin: 0 -10px 0.3em;
  border-left: none;
  border-right: none;
}

/* Full-width image in the intro section */
#sub-content-a .feature .intro {
   padding-top: 1px;
}