@charset "utf-8";
 
body  {
   font: 85% Arial, Helvetica, sans-serif;
   background: #252525;
   margin: 0; 
   padding: 0;
   text-align: center; 
   color: #444;
}

#container {
   width: 960px;
   background: #fff;
   margin: 0 auto 2em auto;  /* the auto margins (in conjunction with a width) center the page if needed */
   text-align: left; /* this overrides the text-align: center on the body element. */
}  


/*  Links
------------------------------------------------------------- */
a:link, a:visited { text-decoration: none; color: #2f56bf; }
/* a:hover           { text-decoration: none; color: #ffffff; background: #2f56bf; } */
a:hover { text-decoration: underline; background: #acbf7d; color: #fff;}
a img             { border: 0px; }
img {vertical-align:bottom;}

/*  Logo & Banner
------------------------------------------------------------- */
#search                 { float: right; padding: 1px; margin-top: 1.5em; background-color: #ffffff;}
#search input           { padding: 0; margin-top:0px;}
#search form            { margin: 0; padding: 0; }
#search a.noborder      { border: 0; }

#header                 { clear: both; background: #252525; }
#header img.banner      { margin: 0; margin-bottom: -.25em; padding: 0; }
#header a img.banner    { text-decoration: none; color: #ffffff;  /* eeps the image from showing 2px of blue background and the bottom b/c it's a link */ }
#header a.banner,
#header a.banner:visited,
#header a.banner:hover  { background-color: #252525; text-decoration:none; } /* this ensures the black background instead of bright blue on hover */

#header h1 {                  /* might be able to remove this if I add the stuff to #header img (to prevent margin collapse */
   margin: 0;                 /* zeroing the margin of the last element in the #header div will avoid margin collapse - an unexplainable space between divs. 
                                 If the div has a border around it, this is not necessary as that also avoids the margin collapse */
   padding: 0;                /* using padding instead of margin will allow you to keep the element away from the edges of the div */
   border: 1px solid black;
   text-align: left; 
   height: 1px; 
   position: relative; 
   left: -9999px;
}

#logo { background: #252525; margin-top: -.5em; margin-bottom: .5em; padding: .5em 0 .25em 0; float: left; border: 0; }


/*-----------------------------------------------------------
                         Sidebars
------------------------------------------------------------- */

#sidebar1 {  
   float: left; 
   width: 16em;            /* since this element is floated, a width must be given */
   background: #fff;       /* the background color will be displayed for the length of the content in the column, but no further */
   padding: 0;             /* top and bottom padding create visual space within this div */
   margin-left: 1em;
   margin-top: 1em;
}

#sidebar2 {
   float: right; 
   width: 16em;             /* since this element is floated, a width must be given */
   background: #fff;        /* the background color will be displayed for the length of the content in the column, but no further */
   padding: 0;              /* top and bottom padding create visual space within this div */
   margin-right: 1em;
   margin-top: 0em;
}

#sidebar2 .article {
margin-bottom: -.5em;
}


#sidebar2 h4, #sidebar2 p {
   margin-left: .5em;         /* the left and right margin should be given to every element that will be placed in the side columns */
   margin-right: 1em;
   margin-top: 0;
}


#sidebar1 h3, 
#sidebar2 h4, 
#grandnews h3,

#sidebar1 h3 { margin: 2em 1em .45em .3em; } /* top margin only applies to the space between hcwh and needtoknow */

#sidebar1 li { margin-right: 1em; }

#sidebar2 h4 {
   background: url(/index.pl?binobjid=7206) left center no-repeat;
   padding-left: 1em;
   font-size: 100%;
   margin-bottom: .15em;
   margin-left: .5em;
   margin-top: 0em;
}

#sidebar1 ul { margin: 0; padding-left: 1.7em; }
#sidebar1 li { padding-bottom: .5em; margin-left: 0; font-size: 90%; }
#sidebar2 p { font-size: 90%; line-height: 1.5em; padding-bottom: .5em; }



/*-----------------------------------------------------------
    HOME PAGE - Need to Know - col 1
------------------------------------------------------------- */

ul#needtoknow           { list-style-image: url(/index.pl?binobjid=7206); margin-left: .15em; }
ul#needtoknow li a      { font-size: 96%; line-height: 1.45; }
#sidebar1 h3.needtoknow { font-size: 120%; font-style: italic; background: url(/index.pl?binobjid=7295) 0 0 no-repeat; 
                          color: #fff; width: 192px; height: 23px; padding-top: .15em; padding-left: .5em; }



/*----------------------------------------------------------
    HOME PAGE - Grand News - col 2
------------------------------------------------------------- */

h2#pagetitle         { font: bold italic 2.5em Helvetica, Arial, sans-serif; padding-left: 1.2em; margin: 0 0 0.5em 0.5em; background: url(/index.pl?binobjid=7294) 0 90% no-repeat; }
h2#pagetitle .green  { color: #acbf7d; }

#grandnews { line-height: 1.45em; padding: 0 1em 0 .5em; margin: 0 17.5em 0 17.5em;   /* r. margin can be in ems or px. It creates the space down the right side of the page. */ } 
#grandnews p                           { font-size: 95%; margin: 0; padding: 0; }
#grandnews a img                        { border: none; background: none; text-decoration: none; }
#grandnews .article                     { width: 100%; padding: 1em 0; overflow: hidden; }
#grandnews .article h3                { background: url(/index.pl?binobjid=7227) 0 50% no-repeat; padding-left: 1.65em; margin: 0 0 .5em 0; }
#grandnews .article h3 a:link,
#grandnews .article h3 a:visited,
#grandnews .ft_title a:link, 
#grandnews .ft_title a:visited       { color: #acbf7d; text-decoration: none; padding: 0 .25em; }
#grandnews .ft_title a:link, 
#grandnews .ft_title a:visited      {padding: 0em; font-size: 95%; font-weight: bold; }
#grandnews .article h3 a:hover,
#grandnews .ft_title a:hover     { color: #ffffff; text-decoration: none; background: #acbf7d; }

#grandnews .article div.blurb_fltL      { width: 290px; float: left; text-align: left; }
#grandnews .article div.img_fltR        { width: 150px; float: right; text-align: right; margin-top: 1em; }
#grandnews .article div.blurb_fltR      { width: 290px; float: right; text-align: left; }
#grandnews .article div.img_fltL        { width: 150px; float: left; text-align: left; }

#grandnews .article img.feature         { width: 460px; margin: -0.85em 0 1em 0; }
#grandnews a.feature, 
#grandnews a.feature:hover              { background: none; }
#grandnews .icon  {
   vertical-align: text-top;
   float: left;
   margin-right: 7px;
   margin-top: 6px;

}


/*  Entire linked article - full story page
--------------------------------------------- */
#rapidgrowth img { float: right; padding: 2px; background: #fff; border: 1px solid #ccc; margin-left: 15px; }



/*-----------------------------------------------------------
            HOME PAGE - Other News - col 3
------------------------------------------------------------- */
#sidebar2 a:hover                   { text-decoration: none; background: none; }
#sidebar2 img                       { margin: .5em 0 .5em 1em; border: none; }

/*  "Read More" arrow link
----------------------------------- */	
#sidebar2 .article a.readmore       { background: url(/index.pl?binobjid=7109) 0 0 no-repeat; height: 15px; width: 20px; text-indent: -9999px; }
/* #sidebar2 .article a.readmore:hover { background: #2f56bf; color: #fff; text-decoration: none; } */
#sidebar2 .article a.readmore:hover { text-decoration: underline; background: #acbf7d; color: #fff;}

/*  headline
------------------------------------ */
#sidebar2 .article h4 a:link,
#sidebar2 .article h4 a:visited,
#sidebar2 .ft_title a:link,
#sidebar2 .ft_title a:visited     { font-size: 90%; color: #acbf7d; text-decoration: none; padding: 0 .25em; }
#sidebar2 .ft_title a:link,
#sidebar2 .ft_title a:visited     {padding: 0em; font-size: 95%; font-weight: bold;}
#sidebar2 .article h4 a:hover,
#sidebar2 .ft_title a:hover       { color: #fff; background-color: #acbf7d; text-decoration: none; }
#sidebar2 a:hover {background: #acbf7d;}
  

/*-----------------------------------------------------------
                         footer
------------------------------------------------------------- */

#footer   { background: #ddd; margin: 2em 0 0 0; padding: 0 1em; /* padding matches the left alignment of the elements in the divs that appear above it. */ } 
#footer p {
   margin: 0;        /* zeroing the margins of the 1st element in footer will avoid the possibility of margin collapse - a space between divs */
   padding: 10px 0;  /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
   font-size: 80%;
}
#footer .right { text-align: right; }



/*-----------------------------------------------------------
    Miscellaneous classes for reuse 
------------------------------------------------------------- */

.floatright { /* can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
   float: right; 
   margin: .25em 0 1em 1em; 
   vertical-align: text-top;
}
.floatleft {  /* can be used to float an element left in your page */
   float: left; 
   margin-right: 1em; 
   margin-top: 1.25em; 
   vertical-align: text-top; 
} 
.clearfloat { /* this class should be placed on a <div> or <br /> and should be the final element before the close of a container that should fully contain a float */
   clear: both;
   height: 0;
   font-size: 1px;
   line-height: 0px;
}

.small { font-size: 80%; }



/*------------------------------------------------------------
                          Top menu 
------------------------------------------------------------- */

#topnav            { float: left; width: 960px; margin-bottom: .5em;  padding: 0; background: #acbf7d; }
#topnav ul         { margin: 0; padding: 0 0 0 1.5em; list-style: none; }
#topnav li         { position: relaative; float: left; margin: 0; padding: 0;}
#topnav a          { float: left; display: block; padding: 0.3em 1.75em; text-decoration: none; font: bold 100% Arial, sans-serif; margin-right: 0; color: #fff; width: auto; background: #acbf7d;}
#topnav a:link,
#topnav a:visited  { color: #ffffff; }
#topnav a:hover    { background-color: #c2d0a0; color: #ffffff; }
#topnav a:active   { background-color: #ffffff; color: #acbf7d; }
#topnav ul ul {display:none; position: absolute; width: auto; margin-top:24px; border: 1px solid #fff; background-color: #fff; padding: 0px;}
#topnav ul li ul li {clear:left;margin-top:1px;}
#topnav ul li:hover ul {display:block;}
#topnav ul li ul li a {width: 175px;}



ul.help            { margin-top: 0em; margin-right: -.75em; list-style: none; width: 25em; float: right; text-align: right; }
ul.help li         { display: inline; }
ul.help a          { font-size: 80%; padding: 0 1em; border-right: 1px solid #aaa;}
ul.help a:link,
ul.help a:visited  { color: #ffffff; text-decoration: none; }
ul.help a:hover    { background: #3f3f3f; color: #fff; text-decoration: none; }
ul.help a.noborder { border: 0; }

ul.skip            { margin: .25em 0 -.75em -.75em; padding: 0; list-style: none; }
ul.skip li         { display: inline; }
ul.skip a          { font-size: 80%; padding: 0 10px; border-right: 1px solid #aaa; }
ul.skip a:link, 
ul.skip a:visited  { color: #ffffff; text-decoration: none; }
ul.skip a:hover    { background: #3f3f3f; color: #fff; text-decoration: none; }
ul.skip a.noborder { border: 0; }