/* Golden Mile Club - table-free form styling, including info boxes. 
 *   qv - www.alistapart.com/articles/prettyaccessibleforms
 *      - jeffhowden.com/code/css/forms */

  form {
    margin-right: 120px;  /* should this be in #right? */
  }
  
  form fieldset {
    margin: 0;
    /* rule at top of fieldset */
    border-color: #cccccc;
    border-width: 1px 0 0 0;
    border-style: solid none none none;
    margin-top: 2em;
    padding-left: 0.01em;  /* FF bug? using 0 loses rule to left of legend */
  }
  
  form fieldset legend {
    margin-left: 2em;
    padding: 0 0.5em; /* breathing-space for rule */
  }
  
  form ul {
    margin-top: 0.8em;
    border: none;
  }
  
  form li {
    list-style: none;
    font-style: italic;
    color: #666666;
    padding: 0.8em 0 0 4px;
    /* WARNING: < 4px on padding-left introduces bug in IE where fieldset border repeats on each li!! */
  }
  
  form label {
    display: inline-block;
    vertical-align: top;
    font-style: italic;
    width: 8em;
  }
  
  form input+label {  /* label following an input (eg checkbox, radio) doesn't have width set */
    width: auto;
  }
  
  form fieldset fieldset {  /* for radio / checkboxes */
    border: none;
  }
  
  form fieldset fieldset legend {
    margin-left: 0;
    padding-left: 0;
  }
  
  form fieldset fieldset label {  /* label for each option */
    margin-left: 8em;
    display: block;
    width: auto;
  }
  
  /* required field indicator markup on * indicator */
  
  form span.reqd {
    color: #990000;
    padding-left: 0;
  }
  
  /* notes */
  
  form fieldset div.notes {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 75%;
    color: #999999;  /* not too attention grabbing... */
    background: none;
    float: right;
    width: 150px;
    height: auto;
    margin: 0 0 10px 0;
    padding: 8px;
    border: 1px solid #cccccc;
  }
  
  form fieldset div.notes h4 {
    font-weight: bold;
    background: url(../img/icon_info.gif) top left no-repeat;
    padding: 3px 0 3px 27px;  /* space for info-icon, breathing-space */
    border-width: 0 0 1px 0;  /* rule below */
    border-style: solid;
    border-color: #cccccc;
    font-size: 110%;
  }
  
  form fieldset div.notes p {
    line-height: 125%;
    margin: 1.2em 0 0 0;
  }
  
  input, select {
    font-style: normal;  /* no italic within fields! */
  }
  
  input:focus { 
    border: 1px dotted black; 
    background-color: #e7e7e7;
  }