body a p {text-size:12px helvetica, arial, sans-serif, verdana;border:2px solid #000;}

body {color:navy;margin: 2% 5% 5% 5%;padding:0px;
     background-image: url('images/bkgrnd.gif');}

a {color:#09c;font-weight:600;text-decoration:none;}

html>body #banner_box {background:#000;border:0px solid #fff;}

#banner1 {height:20px;background:#000;border:0px solid #fff;z-index:1;}

#banner2 {height:135px;color:white;text-align:center;
         width:100%;background:#000;             /*  background-attachment: scroll;  */
         border:0px solid green;z-index:1;}

#banner3 {height:10px;color:white;text-align:center;width:100%;
         background:#000;border:2px solid #000;}


a:link {color:#09f;}
a:visited {color:#07a;}
a:hover {background-color:#eee;}

a:link, a:visited, a:hover {text-size:12px verdana, arial, helvetica, sans-serif;}

h1 p {text-align:center;margin:0px 0px 5px 0px;padding:0px;
      font:bold 12px verdana, arial, helvetica, sans-serif;}
h1 {font-size:24px;color:red;font-weight:900;}
h2 {font-size:20px;color: blue;}
h3 {font-size:16px;color: gold;}
h4 {font-size:12px;color: #f8f;}
h5 {font-size:12px;color: #080;}

.center>p {margin:0px;}
.center>p+p {text-indent:30px;}


/*  =========================================================================  */
/*  =========================================================================  */
#leftnav {position:absolute;left:5%;}

#rightnav {position:absolute;right:5%;border:4px solid blue;}
          
#leftnav, #rightnav {width:15%;height:2500px;top:160px;margin-top:0px;
          color:red;text-align:center;padding:10px;
          background-color:#000;border:0px solid;z-index:1;
          voice-family: "\"}\"";           /* Again, the ugly brilliant hack. */
          voice-family:inherit;}

body>#navAlpha {width:128px;}
body>#navBeta {width:168px;}               /* Again, "be nice to Opera 5".    */



/*  ========================================================================  */
/*          These are the content boxes belong to the content class.          */
/*          That are center position under the HCSR banner                    */
/*          "Content goes INSIDE the "centerbox"                              */
/*  ========================================================================  */
/*  <!--  A "left-float" and a specific width does not work.  Why?       -->  */
.centerbox {position:relative;      
/* Position is declared "relative" to gain control of stacking order (z-index). */
	width:auto;min-width:120px;
	margin:0% 20% 5% 20%;
/*  inside spacing between ".content" and ".center"  */
    border: 0px solid #000;
	padding-top:20px;padding-left:2px;padding-right:1px;
    /*  The padding variable above sets the vertical distance between the
    banner and the top of the shaded area  */
	z-index:3;}               /* This allows the content to overlap the 
                             right menu in narrow windows in good browsers. */


/*  <!--  Working code  -->  */
.content {
	position:relative;  /* Position is declared "relative" to gain control 
                        of stacking order (z-index). */
	width:auto;
	min-width:120px;
	margin:0% 0% 5% 0%;  /*  The margins move the ".content" border, but 
                         does NOT move rc area  */
                         /*  A negative margin-right moves over the ".content" 
                         border, but NOT the shaded rc area.  */
    border: 0px solid #f00;
	padding-top:20px;    /*  This provides spacing for the first line INSIDE the shaded top  */
    padding-left:10px;padding-right:15px;
    text-align:left;
	z-index:3;}           /* This allows the content to overlap the right menu 
                         in narrow windows in good browsers. */


.image_frame
            {position:relative;width:auto;min-width:120px;margin:0% 0% 5% 0%;
             border: 0px solid #f00;padding-left:0px;padding-right:0px;text-align:center;z-index:3;}
/* Position is declared "relative" to gain control of stacking order (z-index). */
/*  The margins move the ".content" border, but does NOT move rc area  */
/*  A negative margin-right moves over the ".content" border, but NOT the shaded rc area.  */
/* This allows the content to overlap the right menu in narrow windows in good browsers. */

.nav         {position:relative;width:auto;height:500px;text-align:center;margin-top:1%;
             padding-top:50px;padding-left:0px;padding-right:0px;border:0px solid #f00;
             z-index:3;}  /*  padding-top provides good spacing to the top of the nav bars  */
/* position:relative;*/  
/* Position is declared "relative" to gain control of stacking order (z-index). */
/*  The margins move the ".content" border, but does NOT move rc area  */
/*  A negative margin-right moves over the ".content" border, but NOT the shaded rc area.  */
/*  A "padding-top" parameter only heightens the box  */
/* This allows the content to overlap the right menu in narrow windows in good browsers. */

.date        {position:relative;width:auto;height:60px;font-size:10pt;color:#0f0;
             padding-left:0px;padding-right:0px;text-align:center;z-index:3;}
             
/* Position is declared "relative" to gain control of stacking order (z-index). */
/*  A negative margin-right moves over the ".content" border, but NOT the shaded rc area.  */
/* This allows the content to overlap the right menu in narrow windows in good browsers. */



.hdr         
{position:relative;text-align:center;background-color:#000;border:#000 0px dashed;}
/*       left here for future reference only      font-weight:bold;           */
/*       color:#ffd700;  this is the code for 'gold'.                         */
/*       padding:14px;                                                        */
/*       Each hdr div is "styled" w. color attributes                         */





/* ---  =============    round corner code follows     ================== --- */

#tlc, #trc, #blc, #brc{background-color:transparent;background-repeat:no-repeat;}

#tlc{background-image:url('images/tlc.gif');background-position: 0% 0%}

#trc{background-image:url('images/trc.gif');background-position: 100% 0%}
	
#blc{background-image:url('images/blc.gif');background-position: 0% 100%}

#brc{background-image:url('images/brc.gif');background-position: 100% 100%}

#tb, #bb {background-color:transparent;background-repeat: repeat-x;}
			
#tb {background-image:url('images/tb.gif');background-position: 0% 0%}

#bb {background-image:url('images/bb.gif');background-position: 50% 100%}
	
#rb {background-image:url('images/r.gif');background-position: 100% 0%;
    background-repeat:repeat-y}

#lb {background-color: #eeeeee;background-image:url('images/l.gif');
    background-position: 0% 100%;background-repeat:repeat-y}
			

/*   Notes for "left_nav"                                                                    */
/* Here is the ugly brilliant hack that protects IE5/Win from its own stupidity.             */
/* IE5/Win incorrectly parses the "\"}"" value, prematurely closing the style declaration.   */
/* The incorrect IE5/Win value is above, while the correct value is below.                   */
/* See http://glish.com/css/hacks.asp for details.                                           */
/*                                                                                           */
/* I've heard this called the "be nice to Opera 5" rule. Basically, it feeds correct length  */
/* values to user agents that exhibit the parsing error exploited above yet get the CSS box  */
/* model right and understand the CSS2 parent-child selector. ALWAYS includea "be nice to    */
/* Opera 5" rule every time you use the hack (above).                                        */