/**
 * STYLING FOR HPI TOOL INTERFACE
 **/

h2#i_want_to {
  display: block;
  margin: 0.5em 0 0.3em 1em;
  font-size: 1.5em;
}

ul#tool_options_ul {
  float: left;
}
  ul#tool_options_ul li {
    display: block;
    clear: left;
    float: left;
    z-index: 1;
    margin: 0;
    margin-bottom: 4px;
    width: 180px;
    /* background: #673499 url(/images/curves/purple_border.gif) bottom repeat-x; */
    /* background-color: #673499; */
    background-color: #9999cc;
    color: #fff;
  }
    ul#tool_options_ul li .wantto_option_wrap1 {
      display: block;
      width: 100%;
    }
      ul#tool_options_ul li .wantto_option_wrap1 .wantto_option_wrap2 {
        display: block;
        width: 100%;
      }
        ul#tool_options_ul li .wantto_option_wrap1 .wantto_option_wrap2 .wantto_option_wrap3 {
          display: block;
          width: 100%;
          background: transparent url(/images/curves/lightpurple_fill_corner_bottom_left.gif) bottom left no-repeat;
        }
          ul#tool_options_ul li .wantto_option_wrap1 .wantto_option_wrap2 .wantto_option_wrap3 .wantto_option_wrap4 {
            display: block;
            width: 100%;
            background: transparent url(/images/curves/lightpurple_fill_corner_top_left.gif) top left no-repeat;
            padding: 0;
            font-size: 1.15em;
          }
          
          ul#tool_options_ul li span {
            display: block;
            z-index: 2;
            padding: 8px 10px;
            line-height: 1.3em;
          }

  ul#tool_options_ul li.selected_option {
    position: relative;
    z-index: 99;
    background: #fff url(/images/curves/purple_border.gif) bottom repeat-x;
  }
    ul#tool_options_ul li.selected_option .wantto_option_wrap1 {
      background: transparent url(/images/curves/purple_border.gif) left repeat-y;
    }
      ul#tool_options_ul li.selected_option .wantto_option_wrap1 .wantto_option_wrap2 {
        background: transparent url(/images/curves/purple_border.gif) top repeat-x;
      }
        ul#tool_options_ul li.selected_option .wantto_option_wrap1 .wantto_option_wrap2 .wantto_option_wrap3 {
          background: transparent url(/images/curves/purple_corner_bottom_left.gif) bottom left no-repeat;
        }
          ul#tool_options_ul li.selected_option .wantto_option_wrap1 .wantto_option_wrap2 .wantto_option_wrap3 .wantto_option_wrap4 {
            background: transparent url(/images/curves/purple_corner_top_left.gif) top left no-repeat;
          }


  ul#tool_options_ul li a {
    display: inline;
    color: #fff;
  }

div#tool_options_main {
  float: left;
  position: relative;
  left: -2px;
  top: 0;
  text-align: center;
  z-index: 50;
  margin: 0;
  padding: 0;
  margin-bottom: 1em;
  font-size: 1.15em;
  width: 350px;
}

  div#tool_options_wrap1 {
    width: 100%;
    height: 5px;
    background: transparent url(/images/curves/purple_border.gif) top repeat-x;
  }
    div#tool_options_wrap1 div#tool_options_corner_tl {
      float: left;
      height: 5px;
      width: 5px;
      background: url(/images/curves/purple_border.gif) left repeat-y;
    }
    div#tool_options_wrap1 div#tool_options_corner_tr {
      float: right;
      height: 5px;
      width: 5px;
      background: url(/images/curves/purple_corner_top_right.gif) top right no-repeat;
    }
  div#tool_options_wrap2 {
    float: left;
    background: url(/images/curves/purple_border.gif) left repeat-y;
    padding: 0;
    margin: 0;
    width: 100%;
  }
    div#tool_options_wrap3 {
      float: right;
      background: url(/images/curves/purple_border.gif) right repeat-y;
      overflow: hidden;
      width: 100%;
      padding: 0;
      margin: 0;
    }
  div#tool_options_wrap4 {
    height: 5px;
    clear: left;
    background: transparent url(/images/curves/purple_border.gif) bottom repeat-x;
  }
    div#tool_options_corner_bl {
      float: left;
      height: 5px;
      width: 5px;
      background: url(/images/curves/purple_corner_bottom_left.gif) bottom left no-repeat;
    }
    div#tool_options_corner_br {
      float: right;
      height: 5px;
      width: 5px;
      background: url(/images/curves/purple_corner_bottom_right.gif) bottom right no-repeat;
    }
  
    div#tool_options {
      display: block;
      background: none;
      padding: 20px 5em;
      padding-left: 2em;
      margin-left: 1em;
      margin: 0 1em;
      text-align: left;
      width: auto;
    }

    div#tool_options p {
      clear: left;
      margin: 0.5em 0;
      width: auto;
    }

    div#tool_options select {
      margin-bottom: 0.5em;
    }
      div#tool_options select option {
        padding-right: 15px;
     }

/*     
ul#data_type_options {
  display: block;
  clear: left;
  width: 95%;
  margin: 0;
  padding: 0;
  list-style-type: none;
  text-align: center;
}
  ul#data_type_options li {
    float: left;
    width: 100%;
    background-color: #fff;
    margin: 0 1em 0 1.5em;
    padding: 1em 0;
    text-align: left;
  }
  ul#data_type_options li#scaled_option {
    border-bottom: 1px solid #ccc;
 }
    ul#data_type_options li p {
      display: block;
      clear: left;
      float: left;
      padding: 0;
      margin: 0;
      width: 94%;
      font-size: 1.2em;
    }

    ul#data_type_options li input {
      clear: right;
      float: right;
      padding: 0;
      margin: 0;
      margin-top: 0.7em;
    }
   
div#tool_options_submit {
  clear: left;
  width: 95%;
  text-align: center;
}
*/

div#data_type_options_wrapper {
  clear: both;
  float: left;
  width: 95%;
  margin: 0;
  padding: 0;

}
ul#data_type_options {
  display: block;
  list-style-type: none;
  width: 100%;
  float: left;
  margin: 0.2em 0 0.5em 0;
  padding: 0;
}
  ul#data_type_options li {
    width: 49%;
    float: left;
    text-align: center;
    padding: 0;
    margin: 0;
  }
  ul#data_type_options li#ranked_option {
    float: right;
    border-left: 1px solid #ccc;
  }
    ul#data_type_options li p {
      float: left;
      width: 75%;
      font-size: 1em;
      padding: 0 0 0 1.5em;
      margin: 0;
      text-align: left;
    }
    ul#data_type_options li input {
      float: right;
      margin: 1em 1.5em 0 0;
    }
    ul#data_type_options li p.type_desc {
      font-size: 1em;
      font-weight: normal;
    }
  
div#data_type_options_note {
  clear: both;
  display: block;
  width: 100%;
  text-align: center;
  padding: 0;
  margin: 0;
}

div#tool_options_submit {
  clear: both;
  display: block;
  width: 100%;
  float: left;
  text-align: center;
  padding: 0;
  margin: 0;
}

  div#tool_options_submit input {
    font-size: 1.4em;
    font-weight: bold;
    margin-top: 0.3em;
    padding: 0em;
    margin: 0;
  }
