
/*
*  Here's the pop up div for mouseover messages
*  Initially display:none
*/
.popup_div {
  display     : none;
  position    : absolute;
  left        : 0px;top:0px;
  width       : 40em;
       /*
   *  border      : 1px solid #000;
        */
  border-width : 1px 1px 1px 1px;
  border-style : dashed;
  background  : #f0f7fe;
  color       : #000;
  text-align  : left;
  padding-left: 0.5em;
  font-style: Italic;
}
/* see http://www.webcredible.co.uk/user-friendly-resources/css/css-forms.shtml */
label
{
    width: 5em;
    float: left;
    text-align: right;
    margin-right: 0.5em;
    display: block
}
.submit input
{
    margin-left: 5.5em;
}
/*
*/
#hn-back-gray    {background-color:#ddd;}
.hn-back-green   {background-color:#dfd;}
.hn-back-white   {background-color:white;}
.hn-lr-pad       {padding:0 0.7692em 0 0.7692em; *padding:0 0.7507em 0 0.7507em;}
.hn-pad-10       {padding:0.7692em;*padding:0.7507em;}
#hn-art-border   {border-color: #808080; border-style:solid; border-width:0 1px 1px 1px;}
#bd p            {padding:0.1538em;*padding:0.1501em; margin:0;}
.hn-none         {margin:0;padding:0;}
.hn-right        {text-align:right;}
.hn-ul           {list-style:none;}
.hn-art          {list-style:none; margin-bottom:0.5em; border-bottom:1px solid gray;margin:0.1538em;*margin:0.1501em;}
/* hn-border-* : border style and color only. Set border widths in other classes. */
.hn-border-blue  {border-style:solid;border-color:#1600ff;}
.hn-border-green {border-style:solid;border-color:#0cff00;}
.hn-border-red   {border-style:solid;border-color:#f00;}
.hn-border-black {border-style:solid;border-color:#000;}
.hn-border-black-1px {border-style:solid;border-color:#000;border-width:1px;}
.hn-background-blue  {background:#1600ff;}
.hn-background-green {background:#0cff00;}
.hn-background-red   {background:#f00;}
.hn-background-white   {background:#fff;}
.hn-pad-img      {padding:0.3846em;*padding:0.3753em}
.hn-art-con      {overflow:none;padding:0.2308em;*padding:0.2252em;*zoom:1;} /* zoom:1: for IE layout */
.hn-art-foot         {background-color:#eef;font-size:80%;border-bottom:1px solid gray;}
.hn-art-foot A       {color:#000;font-weight:bold; text-decoration:none;}
.hn-art-foot A:hover {color:#008;font-weight:bold; text-decoration:underline;}
/* hn-1px-high-spacer for mouseover on index page */
.hn-1px-high-spacer      {border-width:0; height:1px; *font-size:0; *overflow:hidden}
.hn-1px-wide-spacer      {border-width:1px 0 1px 0; width:1px;} /* To debug, set height:10px; */
/* hn-art-title used for the front page image story */
/* .hn-art-title                   {border-width:1px 1px 0 0;} */
.hn-art-title,
.hn-art-title-mouseover         {border-width:1px 1px 1px 1px;} /* bot "border" was spacer div with width 0*/
 /* IE6 does not support border-color:transparent so don't use it. Use a 1px margin to emulate.
 *  .hn-art-title                   {border-left-color:transparent;}
  */
/*.hn-art-title                   {border-left:0;border-bottom:0;margin-left:1px;margin-bottom:1px;}*/
.hn-art-title                   {border-width:1px 0 0 0;margin:0 1px 1px 1px;}
.b1-m0,
.hn-art-img-mouseover         {border-width:1px;margin:0;}
/* hn-art-title-background: used to set matching background for other elements (eg spacer div) */
.hn-art-title,
.hn-art-title-background        {background: #fff url(img/fade-right-def.gif) repeat-y right;}
.hn-art-title-mouseover,
.hn-art-img-mouseover    {background-color:#f0f7fe}
.hn-art-title A,
.hn-art-title-mouseover A       {font-size:150%;color:#008;font-weight:bold; text-decoration:none;}
.hn-art-title A:hover,
.hn-art-title-mouseover A:hover {color:#00f;text-decoration:underline;}
/* hn-sub-headline used for other section stories */
.hn-sub-headline,
.hn-sub-headline-mouseover,
.event-group-title,
.event-group-title-open {padding:0 0 1px 0;} /* avoid flickering at hrefs */
.hn-sub-headline,
.hn-sub-headline-mouseover,
.event-group-title,
.event-group-title-open {border-width:1px 1px 0 1px; border-style:solid;}
.hn-sub-headline                   {border-color : #eef #fff #fff #fff;}
.hn-sub-headline                   {background-color:#fff;}
.hn-sub-headline-mouseover,
.event-group-title      {background-color:#f0f7fe;}
.event-group-title-open {background-color:#adc;color:#000}
.hn-sub-headline A,
.hn-sub-headline-mouseover A,
.event-group-title         A,
.event-group-title-open    A {text-decoration:none;color:#004;}
.hn-sub-headline           A:hover,
.hn-sub-headline-mouseover A:hover,
.event-group-title         A:hover,
.event-group-title-open    A:hover {text-decoration:underline;}
.hn-f-r          {float:right;}
.hn-f-l          {float:left;}
.hn-font-75      {font-size:75%;}
.hn-info         {margin:0.3846em;*margin:0.3753em; background-color:#def; font-weight:bold; font-size:110%; color:#004;}
li.tabbar span   {padding:0.5385em 0.3846em 0 0.3846em; *padding:0.5255em 0.3753em 0 0.3753em;}
li.subtabbar span   {padding:0.3846em 0.3846em 0 0.3846em; *padding:0.3753em 0.3753em 0 0.3753em;}
ul.hn-sub-art       {margin:0;padding:0;}
li.hn-sub-art       {list-style-type:none;text-indent:0.5em;}
.hn-pbar-top {background:#eef;text-align:center;}
.hn-pbar-bot {margin-top:1px;margin-bottom:2px;text-align:center;}
.hn-pbar-bot span {
    padding-right : 0.5em;
    padding-left  : 0.5em;
    margin-right  : 0.1em;
    background    : url(/img/buttons/blue_grad_1x20.gif) left 0px repeat-x;
    border-right  : 1px solid gray;
    border-bottom : 1px solid gray;
}
img.max-size-150 {
  max-height:150px; /* Not IE6 */
  height:expression(this.width>150?150:true); /* IE6 */
  max-width:150px; /* Not IE6 */
  width:expression(this.width>150?150:true); /* IE6 */
}
img.max-size-600 {
  max-height:600px; /* Not IE6 */
  height:expression(this.width>600?600:true); /* IE6 */
  max-width:600px; /* Not IE6 */
  width:expression(this.width>600?600:true); /* IE6 */
}
/* Use w-h-100 to fill element with contained link */
.w-h-100 {
    height: 100%;
    width: 100%;
         /*
     *  line-height:100%;
          */
}
.w-h-100 A {
    display:block;
    height: 100%;
    width: 100%;
         /* DEBUG
     *  background-color:#f00;
          */
}
/* 20091109 : for the story onmouseover */
.hn-storybox {
    border-width : 1px 1px 1px 1px;
    background  : #f0f7fe;
    color       : #000;
    text-align  : left;
    overflow:hidden;
         /*
     *  height:20em;
          */
    padding-left: 0.5em;
         /*
     *  padding-right: 0.5em;
     *  font-style: Italic;
          */
}
.hn-storybox-title-mo {
    border-width : 1px 0 1px 1px;
    background  : #f0f7fe;
    color       : #000;
    text-align  : left;
    padding-left: 0.5em;
         /*
     *  font-style: Italic;
          */
    /* Make the title jump right. This is browser-dependent and content
    dependent and so probably needs to be done dynamically. Handy here for
    development. */
    position:relative;
    left:0.5em;
    *left:1.1em; /* IE */
}


