.selecter {  position:relative;  display:block;  margin:10px 0;  z-index:1;  max-width:30%; } .selecter:focus {  box-shadow:none;  outline:none; } .selecter, .selecter * {  -webkit-user-select:none !important;   -moz-user-select:none !important; -ms-user-select:none !important;   user-select:none !important; } .selecter, .selecter *, .selecter *:before, .selecter *:after {  -moz-box-sizing:border-box; box-sizing:border-box; } .selecter-element {  width:100%;  height:100%;  position:absolute;  left:0;  opacity:0;  z-index:-1; } .selecter-element, .selecter-element:focus {  outline:none;  -webkit-tap-highlight-color:rgba(255, 255, 255, 0);  -webkit-tap-highlight-color:transparent; } .no-opacity .selecter-element {  left:-999999px; } .selecter-selected {  position:relative;  background:#ffffff;  border:1px solid #cccccc;  color:#222222;  cursor:pointer;  display:block;  font-size:13px;  margin:0;  overflow:hidden;  padding:10px 15px;  text-overflow:clip;  z-index:2;  border-radius:3px; } .selecter-selected:after {  height:0;  width:0;  position:absolute;  top:0;  right:15px;  bottom:0;  border-left:5px solid transparent;  border-right:5px solid transparent;  border-top:5px solid #cccccc;  content:'';  display:block;  margin:auto 0; } .no-touch .selecter-selected:hover {  color:#333333; } .no-touch .selecter.disabled .selecter-selected:hover {  color:#cccccc; } .selecter-options {  width:100%;  max-height:260px;  position:absolute;  top:100%;  left:0;  border:1px solid #cccccc;  border-width:0 1px 1px;  background-color:#ffffff;  display:none;  margin:0;  overflow:auto;  overflow-x:hidden;  padding:0;  z-index:50;  border-radius:0 0 3px 3px;  box-shadow:0 1px 4px rgba(0, 0, 0, 0.15); } .selecter-options.scroller {  position:absolute; } .no-opacity .selecter-options {  width:auto; } .selecter-group {  border-bottom:1px solid #cccccc;  color:#999999;  display:block;  font-size:11px;  padding:10px 15px;  text-transform:uppercase; } .selecter-item {  width:100%;  background:#ffffff;  border-bottom:1px solid #cccccc;  color:#222222;  cursor:pointer;  display:block;  font-size:13px;  margin:0;  overflow:hidden;  padding:10px 15px;  text-decoration:none;  text-overflow:ellipsis; } .selecter-item.placeholder {  display:none; } .selecter-item.selected {  background:#eeeeee; } .selecter-item.disabled {  color:#999999;  cursor:default; } .selecter-item:first-child {  border-radius:0; } .selecter-item:last-child {  border-bottom:0;  border-radius:0 0 2px 2px; } .no-touch .selecter-item:hover, .no-touch .selecter-item.selected:hover {  color:#333333;  background-color:#cccccc; } .selecter-item.disabled, .no-touch .selecter-item.disabled:hover {  color:#cccccc;  background-color:#ffffff; } .selecter.open {  z-index:3; } .selecter.open .selecter-selected {  z-index:51;  border-radius:3px 3px 0 0; } .selecter.open .selecter-selected, .selecter.focus .selecter-selected {  background-color:#ffffff;  box-shadow:0 0 5px rgba(0, 0, 0, 0.1); } .selecter.cover .selecter-options {  border-width:1px;  top:0;  border-radius:3px; } .selecter.cover .selecter-options .selecter-item.first {  border-radius:3px 3px 0 0; } .selecter.cover.open .selecter-selected {  z-index:49;  border-radius:3px 3px 0 0; } .selecter.bottom .selecter-options {  top:auto;  bottom:100%;  border-width:1px 1px 0; } .selecter.bottom .selecter-item:last-child {  border:none; } .selecter.bottom.open .selecter-selected {  border-radius:0 0 3px 3px; } .selecter.bottom.open .selecter-options {  border-radius:3px 3px 0 0; } .selecter.bottom .cover .selecter-options {  top:auto;  bottom:0; } .selecter.bottom .cover.open .selecter-selected {  border-radius:3px; } .selecter.bottom .cover.open .selecter-options {  border-radius:3px; } .selecter.multiple .selecter-options {  width:100%;  position:static;  border-width:1px;  display:block;  border-radius:3px;  box-shadow:none; } .selecter.disabled .selecter-selected {  background:#ffffff;  border-color:#cccccc;  color:#cccccc;  cursor:default; } .selecter.disabled .selecter-options {  background:#ffffff;  border-color:#cccccc; } .selecter.disabled .selecter-group, .selecter.disabled .selecter-item {  border-color:#cccccc;  color:#cccccc;  cursor:default; } .selecter.disabled .selecter-item.selected, .no-touch .selecter.disabled .selecter-item.selected:hover {  background:#fafafa; } .selecter.disabled .selecter-item, .no-touch .selecter.disabled .selecter-item:hover {  color:#cccccc;  background-color:#ffffff; } .selecter-options.scroller {  overflow:hidden; } .selecter-options.scroller .scroller-content {  max-height:260px;  padding:0; } @media screen and (max-width:740px) {  .selecter {   max-width:40%;  } } @media screen and (max-width:500px) {  .selecter {   max-width:100%;  } }