@charset 'UTF-8';

/**
 * ------------------------------------------------------------
 * @section abstract drop down list
 * ------------------------------------------------------------
 */     

/* drop down list */

div.drop-down-list div.drop-down-list-outer {
  /*position: relative;*/ /* why */
  padding: 1px;
  background-image: url(../images/dots_silver.gif);
}

div.drop-down-list div.drop-down-list-outer div.drop-down-list-inner {
  padding: 0 5px;
  background-color: #FFF;
}

div.drop-down-list div.drop-down-list-outer div.drop-down-list-inner a {
  display: block;
  color: #000;
  text-decoration: none;
  /* Assuming a general line-heigth of 15px, this element's line-height should
  be 15px minus 2px for the parent element's padding. To center text we set the
  two following properties */
  padding-bottom: 1px;
  line-height: 12px;
  /* Another more dynamic idea may be margin: -1px 0; but it doesn't seem to
  work fine. */
  background-image: url(../images/stylespin_arrow_down_off.gif);
  background-repeat: no-repeat;
  background-position: right;
}

/* drop down list hover */

div.drop-down-list:hover div.drop-down-list-outer {
  background-image: url(../images/dots_cyan.gif);
}

div.drop-down-list:hover div.drop-down-list-outer div.drop-down-list-inner a {
  color: #01B9FF;
  background-image: url(../images/stylespin_arrow_down_on.gif);
}

div.drop-down-list:hover div.list { /* not really necessary, javascript cares about it */
  display: block;
}

/* drop down list values */

div.drop-down-list div.list {
  display: none;
  background-color: #FFF; /* set any value to solve an unknown bug */
}

div.drop-down-list div.list div.list-outer {
  padding: 0 1px 1px 1px;
  background-image: url(../images/dots_cyan.gif);
}

div.drop-down-list div.list div.list-outer div.list-inner {
  padding: 2px 5px 1px 5px;
  background-color: #FFF;
}

div.drop-down-list div.list div.list-outer div.list-inner ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

div.drop-down-list div.list div.list-outer div.list-inner ul li {
  float: none !important;
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 16px !important;
}

div.drop-down-list div.list div.list-outer div.list-inner ul li a {
  display: block;
  color: #000;
  text-decoration: none;
}

/* drop down list values hover */

div.drop-down-list div.list div.list-outer div.list-inner ul li a:hover {
  color: #01B9FF;
}