Would you like to inspect the original subtitles? These are the user uploaded subtitles that are being translated:
1
00:00:01,240 --> 00:00:04,270
In order to be able to effectively implement
2
00:00:04,270 --> 00:00:06,780
the responsive web design ingredients
3
00:00:06,780 --> 00:00:09,150
that we learned about in the last lecture,
4
00:00:09,150 --> 00:00:12,640
we now need to quickly learn about how the rem unit
5
00:00:12,640 --> 00:00:15,203
and how the max-width property work.
6
00:00:16,840 --> 00:00:19,833
And let's actually start with the max-width property.
7
00:00:20,780 --> 00:00:22,480
So, here in our HTML,
8
00:00:22,480 --> 00:00:25,060
let's quickly create a div element
9
00:00:25,060 --> 00:00:27,693
with the class of test.
10
00:00:30,610 --> 00:00:32,323
And then let's select that.
11
00:00:33,900 --> 00:00:38,100
And to start, I will simply define the width property
12
00:00:38,100 --> 00:00:40,350
as a thousand pixels.
13
00:00:40,350 --> 00:00:41,963
So, just to see what happens.
14
00:00:43,630 --> 00:00:45,830
Also we should give it some background color
15
00:00:48,554 --> 00:00:50,054
of red, let's say.
16
00:00:51,680 --> 00:00:54,260
And also to see it a bit better,
17
00:00:54,260 --> 00:00:56,133
the padding of a hundred pixels.
18
00:00:57,750 --> 00:01:01,530
Now okay, so that's a thousand pixel wide.
19
00:01:01,530 --> 00:01:04,823
But now watch what happens when I decrease the screen.
20
00:01:07,790 --> 00:01:09,720
So, the elements stays the same,
21
00:01:09,720 --> 00:01:12,350
which we can see by these vertical scroll bars
22
00:01:12,350 --> 00:01:14,050
that we have now.
23
00:01:14,050 --> 00:01:17,320
So, we can now basically scroll vertically here,
24
00:01:17,320 --> 00:01:19,410
because of course this element here
25
00:01:19,410 --> 00:01:21,640
still has a thousand pixels.
26
00:01:21,640 --> 00:01:22,950
And so therefore,
27
00:01:22,950 --> 00:01:26,450
the browser then needs to create additional space here,
28
00:01:26,450 --> 00:01:28,070
basically in the viewport.
29
00:01:28,070 --> 00:01:31,193
And so that's why we can scroll vertically like this.
30
00:01:33,490 --> 00:01:37,240
However, let's say that we don't want that to happen.
31
00:01:37,240 --> 00:01:40,000
And instead, the behavior that we want to see
32
00:01:40,000 --> 00:01:42,560
is that when there's no more additional space
33
00:01:42,560 --> 00:01:45,460
to fit these thousand pixels here,
34
00:01:45,460 --> 00:01:48,110
then the element should simply have the width
35
00:01:48,110 --> 00:01:49,860
of the parent container.
36
00:01:49,860 --> 00:01:50,930
And so, that's exactly
37
00:01:50,930 --> 00:01:54,023
what we can use the max-width property for.
38
00:01:55,150 --> 00:01:57,360 line:15%
So, let's comment this one out,
39
00:01:57,360 --> 00:01:59,963 line:15%
and now say max-width.
40
00:02:02,090 --> 00:02:04,610 line:15%
So again, I'm using a thousand pixels here,
41
00:02:04,610 --> 00:02:07,890 line:15%
and never mind about using still pixels,
42
00:02:07,890 --> 00:02:10,240 line:15%
even though I said we shouldn't use them
43
00:02:10,240 --> 00:02:11,800 line:15%
for a fluid layout.
44
00:02:11,800 --> 00:02:15,490 line:15%
Because here we are simply working with this property
45
00:02:15,490 --> 00:02:16,863 line:15%
and learning how it works.
46
00:02:18,870 --> 00:02:23,150
Okay, let's start again with the big viewport.
47
00:02:23,150 --> 00:02:25,470
So, now everything looks the same.
48
00:02:25,470 --> 00:02:27,620
We can even inspect this here.
49
00:02:27,620 --> 00:02:31,690
And so, we see that it is still a thousand pixels wide.
50
00:02:31,690 --> 00:02:33,140
But now, watch what happens
51
00:02:33,140 --> 00:02:36,563
as we approach basically the end of the element.
52
00:02:38,360 --> 00:02:40,400
So, now we don't see anything happen.
53
00:02:40,400 --> 00:02:42,630
But if we try to scroll vertically,
54
00:02:42,630 --> 00:02:44,490
you see that it doesn't work.
55
00:02:44,490 --> 00:02:45,800
And if we hover now,
56
00:02:45,800 --> 00:02:50,300
we see that the element only has 912 pixels.
57
00:02:50,300 --> 00:02:52,520
And if we go even more narrow,
58
00:02:52,520 --> 00:02:55,240
then it becomes even smaller.
59
00:02:55,240 --> 00:02:58,763
So, here we see that now it is only 455.
60
00:03:01,190 --> 00:03:03,573
Well, that's actually not the actual width.
61
00:03:04,640 --> 00:03:09,640
So, it is now 655 pixels.
62
00:03:11,230 --> 00:03:14,440
So basically, that's the width of the parent container,
63
00:03:14,440 --> 00:03:16,840
which in this case is simply the body.
64
00:03:16,840 --> 00:03:18,920
So, the body has the same width now
65
00:03:18,920 --> 00:03:20,273
as this element.
66
00:03:22,060 --> 00:03:25,550
And so, this basically immediately makes this element here,
67
00:03:25,550 --> 00:03:27,850
this test element flexible.
68
00:03:27,850 --> 00:03:31,823
Because now it very simply adapts to the viewport width.
69
00:03:33,680 --> 00:03:34,660
Now, you might've thought
70
00:03:34,660 --> 00:03:38,420
that maybe we could have used percentages for this as well.
71
00:03:38,420 --> 00:03:40,860
But actually that would not have the effect
72
00:03:40,860 --> 00:03:42,560
that we were looking for.
73
00:03:42,560 --> 00:03:45,060
So, a percentage would not have worked,
74
00:03:45,060 --> 00:03:47,553
because up until a thousand pixels,
75
00:03:48,460 --> 00:03:49,490
so like this.
76
00:03:49,490 --> 00:03:51,050
We actually want the elements
77
00:03:51,050 --> 00:03:53,820
to be exactly a thousand pixels wide.
78
00:03:53,820 --> 00:03:56,580
So, not any percentage of the viewport.
79
00:03:56,580 --> 00:03:59,003
Only once we reach a width here
80
00:03:59,003 --> 00:04:02,320
that is less than the actual width of the element.
81
00:04:02,320 --> 00:04:04,150
So, only in that situation,
82
00:04:04,150 --> 00:04:05,900
we actually want this width here,
83
00:04:05,900 --> 00:04:08,580
to adapt to the parent element.
84
00:04:08,580 --> 00:04:11,160
So, basically occupying a hundred percent
85
00:04:11,160 --> 00:04:13,263
of the width of the parent element.
86
00:04:15,370 --> 00:04:18,380
And so, that is how max-width works.
87
00:04:18,380 --> 00:04:20,880
And compressed into just one sentence,
88
00:04:20,880 --> 00:04:23,420
we can say that if the container width
89
00:04:23,420 --> 00:04:26,404
is larger than the specified max-width,
90
00:04:26,404 --> 00:04:28,300
then the width of the element
91
00:04:28,300 --> 00:04:32,470
is equal the value that was specified for max-width.
92
00:04:32,470 --> 00:04:34,260
However, if the container width
93
00:04:34,260 --> 00:04:37,140
is less than the specified max width,
94
00:04:37,140 --> 00:04:38,840
then the width of the element
95
00:04:38,840 --> 00:04:42,473
will be 100% of the container element width.
96
00:04:43,950 --> 00:04:46,350 line:15%
So, take note of that summary,
97
00:04:46,350 --> 00:04:47,260
and then hopefully
98
00:04:47,260 --> 00:04:51,440
you will never again forget this important property here.
99
00:04:51,440 --> 00:04:53,650
So, take note of what I just said,
100
00:04:53,650 --> 00:04:55,860
and then hopefully you will never again
101
00:04:55,860 --> 00:04:58,363
forget this very important property here.
102
00:05:00,200 --> 00:05:04,350
But anyway, let's now move on to the rem unit.
103
00:05:04,350 --> 00:05:06,290
Now, what does rem mean?
104
00:05:06,290 --> 00:05:08,640
Or, what does it stand for?
105
00:05:08,640 --> 00:05:12,910
Well, rem is the root element's font-size.
106
00:05:12,910 --> 00:05:15,960
So, that sounds quite strange indeed,
107
00:05:15,960 --> 00:05:19,290
but actually it is quite straightforward.
108
00:05:19,290 --> 00:05:23,540
So, the root of the document is the HTML element.
109
00:05:23,540 --> 00:05:26,563
So, basically the parent element of all the others.
110
00:05:28,250 --> 00:05:32,760
Now, if we don't define any font-size on this HTML element,
111
00:05:32,760 --> 00:05:35,760
so which is again the root element,
112
00:05:35,760 --> 00:05:37,920
then one rem is simply equal
113
00:05:37,920 --> 00:05:40,180
to the default browser font-size.
114
00:05:40,180 --> 00:05:43,340
Which is always 16 pixels
115
00:05:43,340 --> 00:05:46,210
unless the user does actually change it.
116
00:05:46,210 --> 00:05:48,933
So, let me actually demonstrate that to you here.
117
00:05:50,610 --> 00:05:53,350
And again, using the same example.
118
00:05:53,350 --> 00:05:56,520
So, I'm gonna use max-width again.
119
00:05:56,520 --> 00:05:58,603
So, let's say 500rem.
120
00:06:01,540 --> 00:06:05,010
So, what do you think the width here will be?
121
00:06:05,010 --> 00:06:07,630
Well, remember that by default
122
00:06:07,630 --> 00:06:11,333
1rem is equal to 16 pixel.
123
00:06:12,640 --> 00:06:15,690
And again, that's because we did not specify
124
00:06:15,690 --> 00:06:18,670
any font-size on the HTML element.
125
00:06:18,670 --> 00:06:19,920
And so therefore,
126
00:06:19,920 --> 00:06:23,870
the default font-size of 16 is taken.
127
00:06:23,870 --> 00:06:26,570
So, 1rem equals 16 pixels.
128
00:06:26,570 --> 00:06:31,200
And so, therefore here this 500rem
129
00:06:32,340 --> 00:06:35,140
will be, well, let's do the calculation.
130
00:06:35,140 --> 00:06:40,140
So, 16 times 500, so 8,000.
131
00:06:40,840 --> 00:06:42,773
No, and actually I just wanted 50rem.
132
00:06:43,870 --> 00:06:46,283
So, 50rem would be 800 pixels.
133
00:06:48,460 --> 00:06:49,940
So, let's give it a save.
134
00:06:49,940 --> 00:06:52,380
And then let's go and check it out.
135
00:06:52,380 --> 00:06:53,290
And so here,
136
00:06:53,290 --> 00:06:55,203
we can immediately see right here
137
00:06:55,203 --> 00:06:58,623
that it has a width of exactly 800 pixels.
138
00:06:59,780 --> 00:07:01,143
And so, that works.
139
00:07:02,460 --> 00:07:04,013
Now, you might find it strange
140
00:07:04,013 --> 00:07:06,870
that we define length in our design
141
00:07:06,870 --> 00:07:08,963
based on some font size.
142
00:07:10,260 --> 00:07:13,210
But actually, that is exactly where the strength
143
00:07:13,210 --> 00:07:15,080 line:15%
of the rem unit lies.
144
00:07:15,080 --> 00:07:17,760
Because then, we can simply change the font-size
145
00:07:17,760 --> 00:07:19,630
on the HTML element.
146
00:07:19,630 --> 00:07:22,710
And that will then automatically change all the length
147
00:07:22,710 --> 00:07:27,273
that are defined anywhere in our CSS with the rem unit.
148
00:07:29,470 --> 00:07:31,633
So, let me give you some more example here.
149
00:07:34,090 --> 00:07:36,600
So, let's just give this here some white color
150
00:07:38,310 --> 00:07:39,873
and give it a font-size.
151
00:07:41,730 --> 00:07:42,813
So, let's say 10rem.
152
00:07:45,450 --> 00:07:48,870
Or, well, maybe just 2rem actually.
153
00:07:48,870 --> 00:07:51,453
So, 2rem will be 32 pixels.
154
00:07:53,030 --> 00:07:54,500
So, let's check out,
155
00:07:54,500 --> 00:07:56,483
and indeed, that's right.
156
00:07:57,490 --> 00:07:59,890
Also, here we have another unit
157
00:07:59,890 --> 00:08:01,253
let's move that down.
158
00:08:02,770 --> 00:08:05,980
And this one, we can also specify in rem.
159
00:08:05,980 --> 00:08:07,390
Here let's say 4rem.
160
00:08:10,300 --> 00:08:13,723
And so, 4rem would be 64 pixels.
161
00:08:15,920 --> 00:08:17,493
So, lets confirm all that.
162
00:08:18,970 --> 00:08:22,390
So, indeed we have 64 pixels here of padding.
163
00:08:22,390 --> 00:08:26,330
Then the width is again as we see 800 pixels.
164
00:08:26,330 --> 00:08:28,380
And then as for the font-size,
165
00:08:28,380 --> 00:08:31,150
here it is specified of course in rem.
166
00:08:31,150 --> 00:08:32,520
But I showed you before
167
00:08:32,520 --> 00:08:35,560
that we can come here to the computer tab.
168
00:08:35,560 --> 00:08:38,810
And if we then change for font-size here,
169
00:08:38,810 --> 00:08:42,180
it will actually be the real one in pixels.
170
00:08:42,180 --> 00:08:44,910
So, as it is displayed on the screen.
171
00:08:44,910 --> 00:08:47,623
So, here it's already converted to pixels.
172
00:08:48,810 --> 00:08:50,020
Because in the end,
173
00:08:50,020 --> 00:08:52,890
before elements can be displayed on the page,
174
00:08:52,890 --> 00:08:56,870
all the relative units such as percentages or ramps,
175
00:08:56,870 --> 00:08:59,363
needs to be converted back to pixels.
176
00:09:01,400 --> 00:09:06,400
And so, here we see that it is indeed 32.
177
00:09:06,490 --> 00:09:10,780
But now, let's say that on the HTML element right here,
178
00:09:12,770 --> 00:09:17,150
we set the font-size to just 10 pixels.
179
00:09:17,150 --> 00:09:21,230
And so then, 1rem will no longer be 16 pixels,
180
00:09:21,230 --> 00:09:24,320
but it will instead be 10 pixels.
181
00:09:24,320 --> 00:09:26,350
And so, these 500rem
182
00:09:26,350 --> 00:09:30,653
that used to be 800 pixels, remember that?
183
00:09:32,580 --> 00:09:34,660
So, that's what we had before,
184
00:09:34,660 --> 00:09:36,400
but now not anymore.
185
00:09:36,400 --> 00:09:39,286
Because now 1rem will be 10 pixels.
186
00:09:39,286 --> 00:09:42,036
And so, 50rem will be 500 pixels.
187
00:09:43,050 --> 00:09:44,850
And the same will happen here.
188
00:09:44,850 --> 00:09:47,210
So, this will now be only 40 pixels
189
00:09:47,210 --> 00:09:49,853
and the font-size only 20 pixels.
190
00:09:51,220 --> 00:09:53,940
And so, if we take a look at this now,
191
00:09:53,940 --> 00:09:57,250
then you see that basically the entire design,
192
00:09:57,250 --> 00:09:59,750
which in this case is really small.
193
00:09:59,750 --> 00:10:01,800
But still, the entire design here
194
00:10:01,800 --> 00:10:06,800
shrank down basically by a factor of 62.5%.
195
00:10:07,390 --> 00:10:11,880
And that's because 10 divided by 16 is 62.5%.
196
00:10:13,260 --> 00:10:15,690
But that percentage doesn't really matter here.
197
00:10:15,690 --> 00:10:18,750
What matters is that by changing the font-size,
198
00:10:18,750 --> 00:10:21,653
we can completely change the entire layout.
199
00:10:22,630 --> 00:10:24,370
So, if we try to double it,
200
00:10:24,370 --> 00:10:27,303
then of course everything will get really big.
201
00:10:29,390 --> 00:10:32,270
So, now this element is a thousand pixels.
202
00:10:32,270 --> 00:10:35,770
Or at least it should be, yes, it is.
203
00:10:35,770 --> 00:10:39,370
And the text should be exactly 40 pixels,
204
00:10:39,370 --> 00:10:41,980
because two times 20 is 40.
205
00:10:41,980 --> 00:10:43,890
And the same for the padding.
206
00:10:43,890 --> 00:10:45,563
So now it is 80 pixels.
207
00:10:47,410 --> 00:10:49,370
And so, maybe you can start to see
208
00:10:49,370 --> 00:10:51,810
why this will be really really handy,
209
00:10:51,810 --> 00:10:54,200
when we build responsive layouts.
210
00:10:54,200 --> 00:10:57,370
Because for example, when we have a smaller screen,
211
00:10:57,370 --> 00:10:58,800
then we want all the length
212
00:10:58,800 --> 00:11:00,530
to be a little bit smaller.
213
00:11:00,530 --> 00:11:02,650
And then, instead of having to change
214
00:11:02,650 --> 00:11:05,470
all of these values here using media queries,
215
00:11:05,470 --> 00:11:09,250
we can simply change the font-size up here in the HTML.
216
00:11:09,250 --> 00:11:10,760
And that will then shrink
217
00:11:10,760 --> 00:11:14,740
everything down a little bit, okay, great.
218
00:11:14,740 --> 00:11:16,650
Now, one useful trick
219
00:11:16,650 --> 00:11:18,550
as I mentioned in the last lecture,
220
00:11:18,550 --> 00:11:21,910
is to set the font-size here to 10 pixels.
221
00:11:21,910 --> 00:11:25,620
Because then it is very easy to do the calculations.
222
00:11:25,620 --> 00:11:27,220
So, then we know immediately
223
00:11:27,220 --> 00:11:29,550
that this one here will be 500,
224
00:11:29,550 --> 00:11:31,703
this is 40, and this is 20.
225
00:11:32,870 --> 00:11:34,680
And so, this is the way to go.
226
00:11:34,680 --> 00:11:37,313
Setting the font-size here to 10 pixels.
227
00:11:38,630 --> 00:11:42,490
Because again, then 1rem will be exactly 10 pixels,
228
00:11:42,490 --> 00:11:45,840
which is very easy to do calculations with.
229
00:11:45,840 --> 00:11:48,570
However, this is still not perfect.
230
00:11:48,570 --> 00:11:50,800
Because by doing it like this,
231
00:11:50,800 --> 00:11:53,380
we will not respect the user's definition
232
00:11:53,380 --> 00:11:55,750
of the browser font-size.
233
00:11:55,750 --> 00:11:57,050
So, let's say that the user
234
00:11:57,050 --> 00:12:01,000
changes the default from 16 pixels to 20.
235
00:12:01,000 --> 00:12:02,580
Then of course they would expect
236
00:12:02,580 --> 00:12:05,343
that the font-size on our page would increase.
237
00:12:06,760 --> 00:12:08,893
But, with this setup right here,
238
00:12:08,893 --> 00:12:11,250
that would actually not happen.
239
00:12:11,250 --> 00:12:15,200
So, no matter what the user would set the font-size to now,
240
00:12:15,200 --> 00:12:18,630
we would always have our default font-size,
241
00:12:18,630 --> 00:12:22,803
or actually our root font-size here at 10 pixels.
242
00:12:24,420 --> 00:12:27,990
And so, this would create huge usability problems for users,
243
00:12:27,990 --> 00:12:32,220
who for some reason have to increase or even to decrease
244
00:12:32,220 --> 00:12:34,573
the font-size of their browsers.
245
00:12:36,111 --> 00:12:38,120
And so, in order to avoid that,
246
00:12:38,120 --> 00:12:42,110
we will not set the font-size to a fixed value like this.
247
00:12:42,110 --> 00:12:45,890
But instead to a percentage of the default font-size
248
00:12:45,890 --> 00:12:47,570
of the browser.
249
00:12:47,570 --> 00:12:49,623
So, let's comment this one out.
250
00:12:50,980 --> 00:12:55,697
And instead, we will set the font-size to 62.5 percentage.
251
00:12:57,780 --> 00:12:58,990
And so, let me explain you
252
00:12:58,990 --> 00:13:01,460
where that value comes from.
253
00:13:01,460 --> 00:13:05,580
So, we want our font-size to be 10 pixels, right?
254
00:13:05,580 --> 00:13:08,420
However, the default is 16 pixel.
255
00:13:08,420 --> 00:13:13,420
And so, we can simply divide 10 by those 16 pixels,
256
00:13:13,610 --> 00:13:15,823
which will be 0.625,
257
00:13:17,913 --> 00:13:18,746
which is 62.5%.
258
00:13:23,480 --> 00:13:25,723
And so, that's exactly this value here.
259
00:13:27,140 --> 00:13:30,650
So, this percentage here is a percentage,
260
00:13:30,650 --> 00:13:32,660
let me write that here also.
261
00:13:32,660 --> 00:13:35,910
Percentage of users
262
00:13:38,210 --> 00:13:42,623
browser font-size setting.
263
00:13:44,170 --> 00:13:48,090
And so again, if it is set to the default of 16,
264
00:13:48,090 --> 00:13:53,090
then you see that 16 times 0.625,
265
00:13:56,000 --> 00:13:58,350
which needs to be a comma in my case.
266
00:13:58,350 --> 00:14:00,443
So, that is then exactly 10.
267
00:14:02,320 --> 00:14:03,730
However, if for some reason
268
00:14:03,730 --> 00:14:06,640
the user needs to change it to 18,
269
00:14:06,640 --> 00:14:10,413
well, then the font-size increases to 11.28.
270
00:14:11,730 --> 00:14:13,430
And so, by using this technique,
271
00:14:13,430 --> 00:14:17,073
we did actually respect the user's font-size setting.
272
00:14:18,784 --> 00:14:19,617
And the same way,
273
00:14:19,617 --> 00:14:22,870
if they set it like to 12 for some reason,
274
00:14:22,870 --> 00:14:26,210
then our default font-size on our page.
275
00:14:26,210 --> 00:14:28,073
So, 1rem will then be 7.5,
276
00:14:29,340 --> 00:14:31,030
which in turn will make it so,
277
00:14:31,030 --> 00:14:33,893
that the entire layout is scaled down a little bit.
278
00:14:36,290 --> 00:14:38,040
So, I hope that made sense.
279
00:14:38,040 --> 00:14:42,330
And in fact, many many many web designers and CSS developers
280
00:14:42,330 --> 00:14:44,970
use exactly this trick.
281
00:14:44,970 --> 00:14:46,110
So, it wasn't just me
282
00:14:46,110 --> 00:14:49,890
who came up with this strange looking technique.
283
00:14:49,890 --> 00:14:53,110
But indeed, it is something that is used widely
284
00:14:53,110 --> 00:14:55,263
in the CSS developer community.
285
00:14:56,806 --> 00:14:59,203
And indeed, just to show you that it works,
286
00:15:01,330 --> 00:15:05,650
here our font-size is still at 20 pixels,
287
00:15:05,650 --> 00:15:07,480
and the padding at 40,
288
00:15:07,480 --> 00:15:09,763
and the width at 500.
289
00:15:11,960 --> 00:15:14,470
And all of that dynamically,
290
00:15:14,470 --> 00:15:16,760
because we are again,
291
00:15:16,760 --> 00:15:19,730
respecting the browser's font-size setting
292
00:15:19,730 --> 00:15:22,593
that the user chose for their particular case.
293
00:15:24,210 --> 00:15:27,590
And so, now we know how the max-width property works,
294
00:15:27,590 --> 00:15:29,760
and how rem works.
295
00:15:29,760 --> 00:15:30,770
And so, from now on,
296
00:15:30,770 --> 00:15:32,860
we will no longer use pixels,
297
00:15:32,860 --> 00:15:35,260
but we will always use rems.
298
00:15:35,260 --> 00:15:37,060
And we will simply use that trick
299
00:15:37,060 --> 00:15:39,550
where 1rem is 10 pixels.
300
00:15:39,550 --> 00:15:44,000
And so, that is then very very easy to do calculations with.
301
00:15:44,000 --> 00:15:47,500
Nice, so hopefully all of that made sense to you,
302
00:15:47,500 --> 00:15:49,090
because it is important
303
00:15:49,090 --> 00:15:52,110
that you understand this before moving on.
304
00:15:52,110 --> 00:15:54,830
So, make sure that you do understand it.
305
00:15:54,830 --> 00:15:56,930
And then let's go to the next lecture
306
00:15:56,930 --> 00:15:59,330
where we will actually and finally
307
00:15:59,330 --> 00:16:02,020
start building the Omnifood project.
308
00:16:02,020 --> 00:16:04,293
So, I can't wait to see you there.
22144
Can't find what you're looking for?
Get subtitles in any language from opensubtitles.com, and translate them here.