/*------------------------------------------------------------------------------

Faux-SELECT CSS

------------------------------------------------------------------------------*/

.faux-container {

  position: relative;
}

.faux-select {

  font-size:90%;
  
  font-family:Arial, Helvetica, sans-serif;

  color: #373737;

  background: #fff;

  border: 1px solid #636363;

  list-style: none;

  overflow: auto;

  overflow-x: hidden;

  position: absolute;
  
  padding: 0;
  
  margin: 5px 0 0 0;
}

.faux-select li {

  cursor: pointer;

  line-height: 1.25em;

  white-space: nowrap;

  position: relative;

  z-index: 1;
  
  padding: 2px 0 2px 10px;
  
  margin: 0;
}



.faux-value {

  font-size:100%;
  
  font-family:Arial, Helvetica, sans-serif;
  
  color: #373737;

  background: url(bgSelect.jpg) no-repeat top right;

  border: 3px solid #636363;
  
  cursor: pointer;

  white-space: nowrap;

  overflow: hidden;

  position: absolute;

  top: -20px;

  z-index: 100;
  
  height: 19px;
  
  width: 192px;
  
  padding: 2px 0 0 8px;
  
  margin: 0 0 0 0;
}

.closer {

  position: absolute;

  top: 0;

  right: 0;

  left: 0;
}

li.optgroup {

  font-weight: bold;

  font-style: italic;

  width: 100%;

  position: relative;
}

li.optgroup ul li {

  list-style: none;

}

ul.faux-select.multiple {

  position: relative;

  overflow: auto;

  overflow-x: hidden;
}

ul.faux-select.multiple li {

  position: static;
}

ul.faux-select.closed {

  overflow: hidden;
}

ul.faux-select.overflowing-open {

  overflow: auto;

  overflow-x: hidden;
}

ul.faux-select.overflowing-optgrouped-open {

  overflow: visible;

  overflow-y: auto;
}

ul.faux-select.optgrouped-open {

  overflow: visible;
}

.faux-select .optgroup ul {

  display: none;

  position: absolute;

  top: 0;
}

.faux-select .optgroup.optHover ul { 

  display: block;
  
  background: #000;

  z-index: 2;
}

select.replaced {

  position: relative;

  left: -999em;
}



* html .closer {

  position: absolute;

  width: expression( document.body.scrollWidth );

  height: expression( document.body.scrollHeight );

}

/* =FAUX-select STYLES */
div.faux-container {
  padding-bottom: 1.2em;
}
* html .faux-container {
  height: 10px;
}
.hover,
.selected {
  background: #636363;
  color: #fff;
}
