.dropdown,
.dropdown ul,
.dropdown li{
  margin  : 0;
  padding : 0;
}

.dropdown ul{
  display  : none;
  position : absolute;
  top      : 110%;
  left     : 16px;
  z-index  : 1;
  background : white;	/*rgb(244,244,244);*/
  border: 1px solid rgb(233,232,232);/*#f75;*/
  border-radius: 5px;
  box-shadow: 2px 2px 2px rgb(244,244,244);
  padding: 5px 10px;
}

[dir=rtl] .dropdown ul{
  left  : auto;
  right : 0;
}

.dropdown ul ul,
[dir=rtl] .dropdown ul .dropdownLeftToRight ul{
  top   : 0;
  left  : 100%;
  right : auto;
}

[dir=rtl] .dropdown ul ul,
.dropdown ul .dropdownRightToLeft ul{
  left  : auto;
  right : 100%;
}

.dropdown li{
  position        : relative;
  display         : block;
  list-style-type : none;
}

.dropdown > li{
  display : inline-block;
}

.dropdown a,
.dropdown span{
  display         : block;
  text-decoration : none;
  white-space     : pre;
}

.dropdown li:hover > ul{
  display : block;
}

.dropdownVertical{
  display : inline-block;
}

.dropdownVertical > li{
  display : block;
}

.dropdownVertical ul{
  top  : 0;
  left : 100%;
}

[dir=rtl] .dropdownVertical ul{
  left  : auto;
  right : 100%;
}

.dropdownJavaScript li:hover > ul{
  display : none;
}

.dropdownJavaScript li.dropdownOpen > ul{
  display : block;
}


/* set the background colour */
.dropdown,
.dropdown ul{

}

/* pad items, set their text colour, and fade their background colour */
.dropdown a,
.dropdown span{
  padding    : 0.25em 0.5em;
  color      : #979797;
  transition : background 0.1s;
}

/* set the background colour of active items */
.dropdown li:hover > a,
.dropdown li:hover > span,
.dropdown li.dropdownOpen > a,
.dropdown li.dropdownOpen > span{
  /*background : rgb(160,208,112);*/
  color: #f75;
}