/* Home CSS Document */

#top{
  float: left;
  width: 870px;
  height: 295px;
  padding: 10px;
  margin: 10px 0px 0px 20px;
  display: inline;
  background: url(../images/css/background_top.jpg) no-repeat;
}

#home_images{
  float: left;
}

#welcome{
  float: right;
  width: 260px;
  padding: 10px 20px 0px 10px;
}

#marquee{
  float: left;
  width: 900px;
  height: 100px;
  padding: 25px 10px;
  background: url(../images/css/background_marquee.jpg) no-repeat;
}

#bottom{
  float: left;
  width: 880px;
  margin: 0px 0px 0px 20px;
  display: inline;
}

#features{
  float: left;
  width: 282px;
  height: 290px;
  padding: 40px 4px 0px;
  background: url(../images/css/background_features.jpg) no-repeat;
}

#coming_events{
  float: left;
  width: 290px;
  height: 330px;
  margin: 0px 0px 0px 5px;
  display: inline;
  background: url(../images/css/background_coming_events.jpg) no-repeat;
}

#coming_events .scroll{
  float: left;
  width: 270px;
  height: 235px;
  overflow: auto;
  margin: 40px 0px 0px 15px;
  display: inline;
}

#coming_events .event{
  float: left;
  width: 250px;
  margin: 0px 0px 10px;
  display: inline;
}

#coming_events .event .date{
  float: left;
  width: 45px;
  height: 45px;
  padding: 2px 0px 0px;
  background: url(../images/css/background_date.gif) no-repeat;
}

#coming_events .event .date_alt{
  float: left;
  width: 45px;
  height: 45px;
  padding: 2px 0px 0px;
  background: url(../images/css/background_date_alt.gif) no-repeat;
}

#coming_events .event .date .month,
#coming_events .event .date_alt .month{
  float: left;
  text-align: center;
  width: 40px;
  font: bold 14px Arial, Helvetica, sans-serif;
  color: white;
  text-transform: uppercase;
}

#coming_events .event .date .day,
#coming_events .event .date_alt .day{
  float: left;
  text-align: center;
  width: 40px;
  font: 24px Arial, Helvetica, sans-serif;
  color: white;
}

#coming_events .event .description{
  float: right;
  padding: 0px 10px;
}

#coming_events .event .description .title{
  float: left;
  font: bold 13px Arial, Helvetica, sans-serif;
  color: #8CAE17;
  clear: both;
  width: 185px;
  cursor: hand;
}

#coming_events .event .description .intro{
  float: left;
  clear: both;
  font: 12px Arial, Helvetica, sans-serif;
  width: 185px;
}

#coming_events .link{
  float: left;
  margin: 15px 0px 0px 0px;
  display: inline;
}

#spotlight{
  float: right;
  width: 282px;
  height: 290px;
  padding: 40px 4px 0px;
  background: url(../images/css/background_spotlight.jpg) no-repeat;
}

#blog{
  float: right;
  width: 290px;
  height: 290px;
  padding: 40px 0px 0px;
  background: url(../images/css/background_blog.jpg) no-repeat;
}

#blog .scroll{
  float: left;
  width: 290px;
  height: 235px;
  overflow: auto;
}

#blog .scroll .headline{
  float: left;
  width: 260px;
  padding: 5px;
}

#blog .date{
  float: left;
  width: 260px;
  font: 11px Arial, Helvetica, sans-serif;
}

#blog .name{
  float: left;
  width: 260px;
  padding: 2px 0px;
  font: 18px Arial, Helvetica, sans-serif;
  color: #C94B0C;
}

#blog .author{
  float: left;
  width: 260px;
  font: 13px Arial, Helvetica, sans-serif;
  color: #074D49;
}

#blog .intro{
  float: left;
  width: 260px;
  padding: 5px 0px;
}

#blog .link{
  float: left;
  width: 290px;
  margin: 15px 0px 0px;
}

