:after and :before, how to be?

Question

css

Hello. When imposition, I ran into a trace. problem:
The :after and :before elements are not where they should be ("legs" should be on the sides of the "li" elements).
The center line is on top of the text, but should it be the other way around?
And if there are any comments / advice on the code, I will be glad to hear it.
ps can someone tell me js / fasten it for such a timer, I would be grateful.
offline

Answer 1

Thus? jsfiddle.net/g2xfjnsd/4

Answer 2

jsbin.com/lemihu/1/edit?css,output