css - Transition-delay not working in Chrome and Safari -
    edit   i've got working now, i'm still not sure how did fixed it.  if understands happening i'd love hear it.     i'm making animated menu icon , it's working great...except middle bar's transition.  it's supposed disappear using transition-delay  after top , bottom bars come during first animation, , appear after top , bottom ones meet again second 1 (one third of way through in both instances).  there no animation on middle bar, transition on background-color  property.  i've tried both shorthand transition  , explicit transition-delay  properties.  both give exact same results.  whole process works great in ie , firefox, fails in chrome , safari, makes me think it's possible webkit issue.    i'm going post relevant code here (since there's 2 hundred lines whole thing).  rest available @ codepen .  if think should add more code let me know , add more.   css:   #menu label span.icon, #menu.lightbox label span.icon {   height: 5em;   widt...