WEBVTT

STYLE
::cue(b) {
color: peachpuff;
}
::cue(c) {
color: white;
}
::cue(a) {
color: red;
}
::cue(d) {
color: red;
background-image: linear-gradient(to bottom, dimgray, lightgray);
}

Region: id=bill lines=3 regionanchor=100%,100% scroll=up viewportanchor=90%,90% width=40%
Region: id=fred lines=3 regionanchor=0%,100% scroll=up viewportanchor=10%,90% width=40%

NOTE this a nice example
of a VTT

1
00:01:39.000 --> 00:01:41.040 region:bill
(deep rumbling)

NOTE This a comment inside the VTT
and this is the second line

2
00:02:04.080 --> 00:02:07.120 align:left position:10%,line-left region:fred size:35%
MAN:
How did we end up here?

3
00:02:12.160 --> 00:02:15.200
This place is horrible.

4
00:02:20.240 --> 00:02:22.280
Smells like balls.

5
00:02:28.320 --> 00:02:31.360
We don't belong
in this shithole.

6
00:02:31.400 --> 00:02:33.440
(computer playing
electronic melody)