/* ===========================================================
 *
 *  Name:          selectordie.css
 *  Updated:       2014-04-27
 *  Created by:    Per V @ Vst.mn
 *  What?:         Base CSS for Select or Die
 *
 *  Copyright (c) 2014 Per Vestman
 *  Dual licensed under the MIT and GPL licenses.
 *
 *  No, I don't usually comment my CSS, but in this
 *  case it might "help" someone.
 *
 *  Beards, Rock & Loud Guns | Cogs 'n Kegs
 * =========================================================== */

/* Remove, change to fit your needs */

.sod_select,.sod_select *{ -webkit-box-sizing: border-box; -moz-box-sizing: border-box;box-sizing: border-box; -webkit-user-select: none;   -moz-user-select: none; -ms-user-select: none; }

/* The SoD - Please keep this first three lines intact, otherwise all hell will break looooooose */
.sod_select{ float:left; background-color:#06090f;border:2px solid #eaded1; text-align:center;border-radius:16px;font-size:16px;height:32px; line-height:32px;position:relative;width:126px; clear:both;box-shadow: 0 0 16px 14px rgba(0,0,0,.2); box-sizing:content-box;
        text-transform: uppercase; outline: 0;  /*outline-offset: -2px; Opera */
        cursor: pointer; z-index:999; max-height:580px;
}

/* Up/Down arrows */
.sod_select:before,.sod_select:after{position: absolute;right: 10px; top: 12px; font-size: 7px; }

/* Down arrow */
.sod_select:after { top: auto; bottom: 12px;}

/* Change the border color on hover, focus and when open */
.sod_select:hover,.sod_select.open,.sod_select.focus { border-color: #eaded1; }
.sod_select.open { color: #919191; }
.sod_select.focus { box-shadow: 0 0 5px rgba(0,0,0,.2); }

/* When the entire SoD is disabled, go crazy! */
.sod_select.disabled{ border-color: #828282; color: #b2b2b2; cursor: not-allowed;}

/* The "label", or whatever we should call it. Keep the first three lines for truncating. */
.sod_select .sod_label{ position:relative; z-index:99 !important; overflow: hidden; color:#eaded1;}
.sod_select .sod_label:before{content:"";position:absolute;width:0px; height:0px;z-index:999 !important;border-left:7px solid transparent;border-right:7px solid transparent;cursor:pointer;right:10px;}
.sod_select .sod_label:before{border-top:7px solid #eaded1;top:13px;}
.sod_select.open .sod_label:before{border-top:7px solid transparent;border-bottom:7px solid #eaded1;top:7px;}
/*.sod_select .sod_label:after{border-top:7px solid transparent;border-bottom:7px solid #eaded1;top:7px; right:10px;}*/

.sod_select .sod_prefix { /* Use this if you're using a prefix and want to style it */ }
.sod_select .sod_placeholder { /* Use this if you're using a placeholder and want to style it */ }

/* Options list wrapper */
.sod_select .sod_list{ position: absolute; top:-2px; left: 0; display: none;height: auto;width:130px; margin-left:-2px; background: #06090f; border:2px solid #eaded1; font-weight: 300;z-index:1 !important;border-radius:16px; overflow:hidden; padding-top:32px;}

/* Shows the option list (don't edit) */
.sod_select.open .sod_list { display: block;  }

/* Don't display the options when  */
.sod_select.disabled.open .sod_list { display: none;  }

/* When the option list is displayed above the SoD */
.sod_select.above .sod_list { top: auto; bottom: 100%; }

/* Options list container */
.sod_select .sod_list ul{overflow-y: auto;  padding: 0; margin: 0;}

.sod_select .sod_list li{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;position:relative;padding:2px 0px; cursor:pointer;}
.sod_select .sod_list li:nth-child(1){/* display:none;*/}
.sod_select.ui-select-color .sod_list li:nth-child(2){ color:#fff;}
.sod_select.ui-select-color .sod_list li:nth-child(3){ color:#04d1f7;}
.sod_select.ui-select-color .sod_list li:nth-child(4){ color:#d36ae6;}
.sod_select.ui-select-color .sod_list li:nth-child(5){ color:#fc7e28;}
.sod_select .sod_list li:hover,.sod_select .sod_list .selected{background-color:#1c212c;}
.sod_select .sod_list .optgroup,.sod_select .sod_list .optgroup.disabled{background:inherit;color:#939393;font-size:10px;font-style:italic}
.sod_select .sod_list .groupchild{padding-left:0px}
.sod_select .sod_list .disabled{background:inherit;color:#ccc}
.sod_select .sod_list .active{background:#06090f;color:#fff}

.sod_select .sod_list .selected:before{position:absolute;right:10px;top:50%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);display:inline-block;color:grey;height:9px;width:10px; background:#fff;}
.sod_select.no_highlight .sod_list .selected{font-weight:300}
.sod_select.no_highlight .sod_list .selected:before{display:none}
.sod_select select{display:none!important}
.sod_select.touch select{-webkit-appearance:menulist-button;position:absolute;top:0;left:0;display:block!important;height:100%;width:100%;opacity:0;z-index:1}