.jq-selectbox { vertical-align: middle; cursor: pointer; } .jq-selectbox__select { width: 240px; font-family: 'Open Sans', sans-serif; height: 30px; padding: 0 45px 0 10px; color: #333; text-shadow: 1px 1px #FFF; background: #f5f5f5 url(images/bg.png) repeat-x; border: 1px solid #ccc; border-bottom-color: #b3b3b3; border-radius: 4px; box-shadow: inset 1px -1px #F1F1F1, inset -1px 0 #F1F1F1, 0 1px 2px rgba(0,0,0,0.1); } .jq-selectbox__select:hover { background-color: #E6E6E6; background-position: 0 -10px; } .jq-selectbox__select:active { background: #F5F5F5; box-shadow: inset 1px 1px 3px #DDD; } .jq-selectbox.focused .jq-selectbox__select { border: 1px solid #5794BF; } .jq-selectbox.disabled .jq-selectbox__select { border-color: #CCC; background: #F5F5F5; box-shadow: none; color: #888; } .jq-selectbox__text { display: block; width: 100%; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding: 8px 0 0 0; } .jq-selectbox__trigger { position: absolute; top: 0; right: 0; width: 34px; height: 100%; border-left: 1px solid #CCC; } .jq-selectbox__trigger-arrow { position: absolute; top: 14px; right: 12px; width: 0; height: 0; overflow: hidden; border-top: 5px solid #000; border-right: 5px solid transparent; border-left: 5px solid transparent; opacity: 0.3; filter: alpha(opacity=30); } .jq-selectbox:hover .jq-selectbox__trigger-arrow { opacity: 1; filter: alpha(opacity=100); } .jq-selectbox.disabled .jq-selectbox__trigger-arrow { opacity: 0.3; filter: alpha(opacity=30); } .jq-selectbox__dropdown { top: 33px; width: 295px; margin: 0; padding: 4px 0; background: #FFF; border: 1px solid #C6CBD0; border-radius: 4px; box-shadow: 0 2px 10px rgba(0,0,0,0.2); font-family: 'Open Sans', sans-serif; } .jq-selectbox ul { margin: 0; padding: 0; } .jq-selectbox li { padding: 5px 10px 6px; color: #231F20; margin:0; } .jq-selectbox li.selected { background: #A3ABB1; color: #FFF; } .jq-selectbox li:hover { background: #08C; color: #FFF; } .jq-selectbox li.disabled { color: #AAA; } .jq-selectbox li.disabled:hover { background: none; } .jq-selectbox li.optgroup { font-weight: bold; } .jq-selectbox li.optgroup:hover { background: none; color: #231F20; cursor: default; } .jq-selectbox li.option { padding-left: 25px; } .jq-select-multiple { padding: 1px; border: 1px solid #CCC; border-bottom-color: #B3B3B3; border-radius: 4px; box-shadow: inset 1px 1px #F1F1F1, 0 1px 2px rgba(0,0,0,0.1); color: #333; font: 14px/18px Arial, Tahoma, sans-serif; cursor: default; } .jq-select-multiple.focused { border: 1px solid #5794BF; } .jq-select-multiple.disabled { border-color: #CCC; background: #F5F5F5; box-shadow: none; color: #888; } .jq-select-multiple ul { margin: 0; padding: 0; } .jq-select-multiple li { padding: 3px 9px 4px; list-style: none; } .jq-select-multiple li:first-child { border-radius: 3px 3px 0 0; } .jq-select-multiple li:last-child { border-radius: 0 0 3px 3px; } .jq-select-multiple li.selected { background: #08C; color: #FFF; } .jq-select-multiple li.disabled { color: #AAA; } .jq-select-multiple.disabled li.selected, .jq-select-multiple li.selected.disabled { background: #CCC; color: #FFF; } .jq-select-multiple li.optgroup { font-weight: bold; } .jq-select-multiple li.option { padding-left: 25px; }