.slid { display: inline-flex; font-size: 21px;}
 .slid span{ line-height: 2.5em; padding:0 5px;}
 .slid .slider { display:inline-block; width:3.5em; margin:1em 1.5em 1em 0.5em; pointer-events: none;}
 .slid .handle {pointer-events: auto; width: 1.5em; height:1.5em; top: 80%; margin-top: -1em; text-align: center; line-height: 1.6em; transition:all 0.03s; border-radius:2em; background: #3399ee; ;border:0; box-shadow: -1px 1px 2px rgba(0,0,0,0.4); }
 .slid .handle:before { content: '►'; position: relative;top:-0.1ex;left:0.1ex;  font-size: 0.9em;  color: #fff;}
 .slid .handle[data-val='100'] { background: #33aa44; }
 .slid .handle:focus{ outline: none; }