/* select */
    .example {
      width: 98%; margin:-10px 1% 0px 1%;
    }

.jq-selectx {
  position: relative;
  display: inline-block;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.jq-selectx * {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.jq-selectx button {
  position: relative; border-radius:0px;
  border: 1px solid #999999;
  margin-top:8px; margin-bottom:5px;
  cursor: pointer;
  background-color: #ffffff;
  width: 100%; color:#333333; text-shadow:0px 1px 1px #ffffff;
  text-align: left;padding: 8px 5px 8px 10px; font-family:'Roboto', Helvetica, sans-serif; font-size:1.3em; font-weight:400;
}

.jq-selectx ul {
  width: 100%;
  position: absolute;
  z-index: 10;
  visibility: hidden;
  border: 1px solid #ccc;
  border-top: none;
  background-color: #fff;
  list-style-type: none;
  padding: 0;
  margin: 0;
}

.jq-selectx ul.open {
  visibility: visible;background-color: #ffffff; color:#1b1b1b; text-shadow:0px 1px 1px #ffffff; border: 1px solid #666666; border-top: none;
}

.jq-selectx ul li {
  padding: 10px 5px 10px 10px; border-bottom:1px solid #eeeeee; text-shadow:0px 1px 1px #ffffff;
  cursor: pointer; font-family:'Roboto', Helvetica, sans-serif; font-size:1.2em; font-weight:400;
}

.jq-selectx ul li:first-child {
  border-top:1px solid #eeeeee;

}

.jq-selectx ul li:last-child {
  border-bottom:0px solid #CCCCCC;

}

.jq-selectx ul li:hover {
  background-color: rgba(0,0,0,0.05);
}

.jq-selectx ul li.selected {
  background-color: rgba(0,0,0,0.1); background-color:#333333; color:#FFFFFF; text-shadow:0px 1px 1px #1b1b1b;
}

.jq-selectx ul li.selected:before{
content:"\25b6"; color:#FFFFFF; float:left; font-size:.7em; margin:0 5px 0 0; padding:0; line-height:1.7em;
}

.jq-selectx .caret {
  position: absolute;
  top: 20px;
  right: 12px; color:#333333;
  display: inline-block;
  width: 0;
  height: 0;
  margin-left: 2px;
  vertical-align: middle;
  border-top: 7px dashed;
  border-right: 7px solid transparent;
  border-left: 7px solid transparent;
}

/* animations */
.jq-selectx-fade {
  transition: visibility 0.4s, opacity 0.4s;
  opacity: 0;
}

.jq-selectx-fade.open {
  opacity: 1;
}

.jq-selectx-slide {
  transition: visibility 0.4s cubic-bezier(0, 1, 0.5, 1), transform 0.4s cubic-bezier(0, 1, 0.5, 1);
  transform: scaleY(0);
  transform-origin: top;
}

.jq-selectx-slide.open {
  transform: scaleY(1);
}
