.selectdiv {
    position: relative;
    /*Don't really need this just for demo styling*/
    float: left;
    min-width: 160px;
    padding-left:5px;
    /*margin: 50px 33%;*/
}



/*To remove button from IE11, thank you Matt */

select::-ms-expand {
    display: none;
}



.selectdiv:after {
    content: ">"; /*url(Images/ic_arrow_down.png);*/
    font: 24px "Consolas", monospace;
    color: #003764;
    -webkit-transform: scaleY(0.85) rotate(90deg);
    -moz-transform: scaleY(0.85) rotate(90deg);
    -ms-transform: scaleY(0.85) rotate(90deg);
    transform: scaleY(0.85) rotate(90deg);
    top: 5px;
    right: 11px;
    /*Adjust for position however you want*/
    padding: 0 0 2px;
    /*border-bottom: 1px solid #999;*/
    /*left line */
    position: absolute;
    pointer-events: none;
}

.selectdiv:before {
    content: "|"; /*url(Images/ic_arrow_down.png);*/
    font: 20px "Consolas", monospace;
    color: #999;
    top: 7px;
    right: 28px;
    /*left line */
    position: absolute;
    pointer-events: none;
}



.selectdiv select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    /* Add some styling */
    display: block;
    width: 100%;
    /*max-width: 320px;*/
    /*height: 50px;*/
    float: right;
    /*margin: 5px 0px;*/
    padding: 0px 14px;
    font-size: 12pt;
    line-height: 1.75;
    color: #333;
    background-color: #ffffff;
    background-image: none;
    border: 1px solid #cccccc;
    -ms-word-break: normal;
    word-break: normal;
}