.selectbox { vertical-align: middle; cursor: pointer; } .selectbox .select { width: 293px; height: 37px; padding: 0 45px 0 10px; font: 14px/37px Arial; color: #171717; background-color: #ffffff; } .selectbox .select:hover { background-color: #ffffff; background-position: 0 -10px; } .selectbox .select:active { background: #f5f5f5; box-shadow: inset 0 1px 3px rgba(0,0,0,0.15); } .selectbox.focused .select { border: 1px solid #5794BF; } .selectbox .select .text { display: block; width: 100%; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } .selectbox .trigger { position: absolute; top: 0; right: 0; width: 34px; height: 100%; } .selectbox .trigger .arrow { background-image: url("../img/select.png"); position: absolute; top: 14px; right: 12px; width: 10px; height: 7px; overflow: hidden; } .selectbox:hover .arrow { opacity: 1; filter: alpha(opacity=100); } .selectbox .dropdown { top: 33px; width: 348px; margin: 0; padding: 4px 0; background: #FFF; font: 14px/18px Arial; } .selectbox li { padding: 5px 10px 6px; color: #231F20; } .selectbox li.selected { background: #A3ABB1; color: #FFF; } .selectbox li:hover { background: #08C; color: #FFF; } .selectbox li.disabled { color: #AAA; } .selectbox li.disabled:hover { background: none; }