/*  These ID's/classes appear ONLY on the index page
 ============================

*/
#maincontent_index { background-color: #FFFFFF; padding: 15px 0 15px 28px; }
.helpToday { color: #507999; font-size: 18px; font-weight: bold;
  font-family: arial,helvetica,san-serif;
}
.stepText { color: #555; font-weight: bold; font-size: 13px; float: left; margin: 0 4px 5px 0;  width: 200px; }
.stepArrow { float: left; margin-left: 70px; display: inline; }

#dropdown {
  width: 390px; padding: 0;
  /*border: 1px solid purple; */
  float: left;
  padding-bottom: 15px;
  margin: 0 0 0 40px;
  background-image: url(images/dropdownbg-bigger2.gif); background-repeat: no-repeat;

  /* background-position: 0 -16px; */
  background-position: 0 -70px;
    /* IE ignores any height specified here.  This is the setting make the box smaller for different-height
       select lists.
    */
}

#homedrop { /* border: 1px solid red; */  float: left; width:100%; 
   /*   for the mac. */ height: 290px; 
}
#dropdown #homedrop form { margin: 0px; }

/*  it made sense to set the width here for the old-style page, where there were numerous selects,
    all wanting to be the same size.  With the new version, there are only 2 selects and we want them
    to be independent. [miles]  */
#homedrop select {/* width: 148px;*/ margin: 0 0 5px 0;
     border: 3px solid #ccc;
     font-family:  Arial, Verdana, Helvetica, sans-serif; color: #0F3377; font-size: 11px; }

#links_wrap {
  border: 2px solid #ccc; float: right;
  padding: 10px;
  width: 340px; margin-top: 15px;
}

.clearBoth { clear: both; height: 0; padding: 0; margin: 0; line-height: 0; font-size: 0; }

#index_content { /* derived from #content_wrapper */
  /*float: left; */ /* no difference, with or without. */
  padding: 0 3px;
  text-align: center; 
  margin-left: 30px;
  margin-right: 8px; /* FF looks at this, but sizes to the nearest word. */
}
#index_instructions {
  border-top: 1px solid #999;
  margin: 0 0 4px 5px; padding: 10px 0 0 0;
}
* html #index_content { margin-right: 1em; } /* IE uses a straight margin, and pads the text. */
#formcont_btn { background: transparent; padding: 0; border: 0; width: 198; height: 40;
   margin-top: 2px; margin-left: 105px;
}
/* * html #formcont_btn { margin-top: 10px; } */
#dropdowncontainer { text-align: center; margin: 10px 0 10px 10px;}

#pa_sel_box { float: left;} #spa_sel_box { float: left;} #spa_sel_box select {width: 188px; margin: 0;}
.pa_sel_title { font-size: 11px; font-weight: bold; margin: 4px 0 5px 0; padding: 0; }
#pa_sub_select { /*width: 20em;*/ float: right; } /* was 18em, and even that's a bit too narrow. Auto-sizing seems to work. */
select option { font-size: 11px; }

/* ------------------  for step arrows ------------------- */

/* these can span up to 400 pixels wide, but the height should remain at 18px */
/* these have their text rendered in HTML */
#firstnt, #firstnt_ie {width: 315px; height:16px; padding: 2px 0 0 8px;
    background: url(images/first_nt.jpg); background-repeat: no-repeat; }
#secondnt, #secondnt_ie {width: 315px; height:16px; padding: 2px 0 0 8px;
    background: url(images/second_nt.jpg); background-repeat: no-repeat;
    display: none; }

/*  Note: we need to use an additional style inside the .html file to hack around IE bugs.
    Using the M$ conditional <!--[if IE]> <[endif]--> construct.

*/




.area {float: left; color:#fff; font-family: Verdana, Arial, Helvetica, sans-serif;
   font-size: 9px; text-transform:uppercase; font-weight: bold;}
.issue {float: left; display: inline; margin-left: 68px; color:#fff;
   font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 9px; text-transform:uppercase; font-weight: bold;}