@telumire Great! thanks a lot! 
1 Like
Wonderful. Works like a charm.
I see you have used some modern CSS features like media query.
Thank you for your nice work.
@telumire, I wanted to comment that your solutions, particularly your CSS ones, are very good & inspiring!
Regarding “Scrolling with an Indicator” like you and @twMat have brought to be…
I am seriously wondering if it could be combined with @EricShulman’s useful Auto-Scroll?? Could you take a look—if you have time & interest?
Best, TT
Seems doable, I’ll try this later this week
Ok so it seems that I was overly optimistic. The spec used to support translation + fixed background, but it turns out that it was too difficult to properly implement, and the CSS spec was retroactively changed to treat a fixed background attachment as if the background-attachment was set to scroll when a transform is applied (17521 – Revise of background-attachment: fixed and transforms [editorial])
Which means that the rectangle in the background, rather than being fixed relatively to the viewport as it should, scroll with the element and goes out of sight.
TL:DR; my solution can’t be used with this autoscroll.
Instead, you could use the timing of the scrolling animation to animate a horizontal bar to show the remaining time.
Many thanks for taking the time to look into it! I appreciate it.