Nice Select Combo Box

NiceSelect.sass

// <div class="NiceSelect NiceSelect--focus">
//     <span class="NiceSelect__text">Option Selected</span>
//     <select>
//         <option value="1">Option Selected</option>
//         <option value="2">Other Option</option>
//     </select>
// </div>
.NiceSelect
    width: 100%
    position: relative
    overflow: hidden
    background: #e8ebed
    border: 2px solid #e8ebed
    font-weight: normal
    color: #576366
    line-height: 1
    display: block
    border-radius: 5px

.NiceSelect--focus
    background: #fff

.NiceSelect__select
    position: absolute
    top: 0
    bottom: 0
    opacity: 0
    border: none
    background: #fff
    z-index: 1x
    width: 100%

.NiceSelect__text
    cursor: pointer
    display: block
    text-overflow: ellipsis
    white-space: nowrap
    min-height: 14px
    padding: 14px 50px 13px 13px
    overflow: visible
    font-size: 14px
    font-weight: 500

.NiceSelect:after
    background: #b7c0c7 url("img/select-arrow.svg") no-repeat center
    content: ""
    position: absolute
    right: 3px
    top: 3px
    bottom: 3px
    width: 30px
    border-radius: 3px

.NiceSelect--focus:after
    background-color: #888;