1

00:00:00,510 --> 00:00:06,240

OK, guys, in this video, we will add that section, we will make the same as here with this hover



2

00:00:06,240 --> 00:00:09,140

effect and we will add some content inside.



3

00:00:09,690 --> 00:00:16,020

So let's go now to this one, to the source code, our project here.



4

00:00:16,590 --> 00:00:17,660

Scroll down.



5

00:00:18,390 --> 00:00:21,760

We will start from here.



6

00:00:21,810 --> 00:00:22,280

Yes.



7

00:00:23,070 --> 00:00:29,010

And then after this part, the first thing we will do is to add the S, T and L.



8

00:00:29,400 --> 00:00:31,980

We can search the gain for services.



9

00:00:33,250 --> 00:00:35,680

We can take this one right here.



10

00:00:36,730 --> 00:00:41,200

Scroll down, down, down, down, and take this one here.



11

00:00:42,370 --> 00:00:48,670

The closure of this section and then here we can change this one to be blocked.



12

00:00:49,990 --> 00:00:58,600

And then we can go to the documents and copy this title property and we can paste it here.



13

00:00:59,890 --> 00:01:06,530

And we can be here with class of row and give it a title of margin.



14

00:01:06,550 --> 00:01:09,930

Chop chop off 70 pixels.



15

00:01:10,480 --> 00:01:16,200

And then here inside we can make death with class of cold in the room.



16

00:01:16,930 --> 00:01:25,390

But first we came here, justified content be really a center where we can make Jaffa and give it a



17

00:01:25,390 --> 00:01:27,550

class called them explorers.



18

00:01:27,790 --> 00:01:33,280

We call them Explorer three and call them the Law of the Sea.



19

00:01:34,480 --> 00:01:41,990

And then inside here, the first thing we can do is to give it a position affiliative park.



20

00:01:42,010 --> 00:01:50,950

We can make it from the AS because if we wanted to add some padding we can make here Jannika and give



21

00:01:50,950 --> 00:01:59,800

it a class picture so we can add at the Hoover function, we can make here a we will be needing to use



22

00:02:00,400 --> 00:02:09,670

that tag name of eight and then inside we can make it the third one got JP Dean and give it a class



23

00:02:09,670 --> 00:02:23,230

of immagine slide and then we can go to the seasons and add this function where OK, it's, uh, we



24

00:02:23,230 --> 00:02:24,190

can make it here.



25

00:02:25,100 --> 00:02:33,140

OK, and activist part, we can make class of picture A inside eight and eight, we can the display



26

00:02:33,140 --> 00:02:41,030

of pluck, which we talked about before and the video of the display and then we can make, I mean,



27

00:02:41,510 --> 00:02:51,500

the closure and then we can make a picture and decide at and image to be having the translation of three



28

00:02:51,500 --> 00:02:52,850

hundred milliseconds.



29

00:02:53,570 --> 00:03:04,160

And then here we can make up this and having to iji off, we can make this to be four features, then



30

00:03:04,160 --> 00:03:05,000

we can cover this.



31

00:03:05,000 --> 00:03:14,870

One goal here is to be harsh and then inside it burrow and inside the row column X.



32

00:03:15,750 --> 00:03:17,560

We went over.



33

00:03:17,570 --> 00:03:24,110

I want something to be changing with the picture and inside at an image.



34

00:03:24,610 --> 00:03:34,550

I can up on the bracket right here and transform off scale for the scale that can make it one point



35

00:03:34,550 --> 00:03:39,330

three and four rotating 15 degrees.



36

00:03:39,680 --> 00:03:44,270

We can go now and see what we've got when we go and reload.



37

00:03:45,530 --> 00:03:52,820

OK, now we got this we just got something wrong with this part, we can just give it we can cover this



38

00:03:52,820 --> 00:03:58,000

one and take care of the children of relatives.



39

00:03:58,010 --> 00:04:01,760

We can tell you this one ended up here.



40

00:04:04,450 --> 00:04:06,620

OK, we got something wrong with this part.



41

00:04:06,890 --> 00:04:15,290

What we can do right now is to go here and make overflow off.



42

00:04:18,260 --> 00:04:21,400

So you would got this when we make the overflow heading.



43

00:04:21,680 --> 00:04:27,760

So this will be the top right on top, but right left of Figaro.



44

00:04:27,980 --> 00:04:35,630

So when we make to overflow of head and it will be covered behind this place.



45

00:04:36,330 --> 00:04:39,020

OK, this could ask this part.



46

00:04:39,020 --> 00:04:49,410

We can add the shadow, we can copy this part and make it for the column that really we can search for



47

00:04:49,940 --> 00:04:50,990

shadow.



48

00:04:51,920 --> 00:05:00,340

We can check the last one from here and then scroll down and post it inside this part.



49

00:05:01,480 --> 00:05:05,840

OK, so here we got some folks Shadow and that's good.



50

00:05:06,230 --> 00:05:12,460

And then here we can add some content for the content right here after this.



51

00:05:12,480 --> 00:05:24,100

Tavor we can make here P with the style of marginal top 20 pixels and we can give it a class of break



52

00:05:24,410 --> 00:05:25,760

and also small.



53

00:05:26,030 --> 00:05:34,730

And then inside we can see what we have inside our demo version from here, we can copy this dent and



54

00:05:34,730 --> 00:05:35,570

pasted here.



55

00:05:36,200 --> 00:05:39,000

Let's see what we have inside our version.



56

00:05:39,980 --> 00:05:40,970

OK, that's good.



57

00:05:40,970 --> 00:05:44,690

We just don't need the text center.



58

00:05:44,690 --> 00:05:51,560

We can leave the text center from here and we can search for the right color.



59

00:05:51,650 --> 00:05:54,110

I think we got something wrong with this part.



60

00:05:54,860 --> 00:05:55,730

It's OK.



61

00:05:56,480 --> 00:06:01,370

We can just make this one to be having the center from here where.



62

00:06:02,480 --> 00:06:07,880

Yes, that we can make class up center.



63

00:06:08,690 --> 00:06:09,810

We can cover this one.



64

00:06:09,810 --> 00:06:20,810

And here, OK, and then we can add just the title from here to being the color of hash for four for



65

00:06:21,800 --> 00:06:22,550

OK.



66

00:06:22,580 --> 00:06:24,110

And now we got this nice.



67

00:06:24,110 --> 00:06:28,730

OK, after this part what we can do is to add some chunk.



68

00:06:29,520 --> 00:06:30,420

Uh yeah.



69

00:06:30,440 --> 00:06:31,790

I got the problem.



70

00:06:31,790 --> 00:06:40,640

The problem was this part we can now go and reload so now we've got the four for four and then here



71

00:06:40,820 --> 00:06:45,650

we can at P and give it a class of two and purple.



72

00:06:46,520 --> 00:06:50,750

We can now go to a spurt and cover the tax cut.



73

00:06:52,370 --> 00:06:58,070

OK, from here and let's see what we have here inside our web.



74

00:06:59,960 --> 00:07:01,160

OK, that's good.



75

00:07:01,340 --> 00:07:04,060

After this part we can add some padding for this.



76

00:07:04,580 --> 00:07:07,700

We can give it padding.



77

00:07:07,700 --> 00:07:10,310

Right, or we can make here.



78

00:07:10,490 --> 00:07:13,490

I can delete this tile.



79

00:07:14,540 --> 00:07:15,640

Where is the closure.



80

00:07:15,650 --> 00:07:17,180

The closure right here.



81

00:07:18,070 --> 00:07:23,630

We can give it style painting left and right.



82

00:07:25,010 --> 00:07:28,730

So then when we're load, OK, that's good.



83

00:07:29,030 --> 00:07:34,340

And then we can just apply to the second and the third columns.



84

00:07:34,760 --> 00:07:41,510

We can copy this one right here and back the game.



85

00:07:43,460 --> 00:07:46,520

We can think, OK, we can go back.



86

00:07:46,520 --> 00:07:49,250

And then here we got the one to three.



87

00:07:49,410 --> 00:07:51,680

We can just change the images.



88

00:07:51,690 --> 00:07:53,190

We can go to this part.



89

00:07:54,620 --> 00:07:57,440

Let's be three and this to be two.



90

00:07:57,590 --> 00:08:00,050

We can now go and reload Beijing.



91

00:08:01,460 --> 00:08:02,720

OK, that's good.



92

00:08:03,200 --> 00:08:07,010

After this part, we will check the response design of it.



93

00:08:07,490 --> 00:08:12,890

We can make this screen smaller right now until we go to the medium.



94

00:08:12,890 --> 00:08:13,880

This is the medium.



95

00:08:14,240 --> 00:08:18,590

So for the medium, we can go here to this part.



96

00:08:20,030 --> 00:08:21,980

Amy column medium.



97

00:08:22,790 --> 00:08:30,560

Uh, let's make it seven and then we can copy this one and apply it here and also here.



98

00:08:32,870 --> 00:08:34,490

OK, is good for the medium.



99

00:08:34,490 --> 00:08:36,410

We can just add some martiens.



100

00:08:36,980 --> 00:08:45,040

We can go here scrolling down, down, down until we reach this one right here.



101

00:08:46,040 --> 00:08:50,900

This could be having a margin of 30 or 40 pixels.



102

00:08:51,500 --> 00:08:52,820

What about this one?



103

00:08:53,330 --> 00:08:54,300

OK, that's good.



104

00:08:54,320 --> 00:08:56,740

And also we had this hover function.



105

00:08:57,200 --> 00:09:02,990

We can now apply for the rest, which is small and smaller for the small.



106

00:09:03,000 --> 00:09:06,290

We can make it small of six.



107

00:09:07,790 --> 00:09:09,970

OK, let's make it seven different.



108

00:09:09,980 --> 00:09:16,340

The last one we will apply to this one and also this one right here.



109

00:09:16,670 --> 00:09:24,230

And for the extras, the more we can make them all eight and they've cut this one and they've kids here



110

00:09:24,230 --> 00:09:35,070

and also here so we can go to the smaller and smaller and he would count for the smallest.



111

00:09:35,090 --> 00:09:41,000

OK, and then for the extra small, it's good.



112

00:09:41,120 --> 00:09:44,650

We just get a problem with just a fat content.



113

00:09:44,660 --> 00:09:45,350

I think.



114

00:09:45,740 --> 00:09:47,120

I think that's the problem.



115

00:09:47,690 --> 00:09:51,400

We can make these to be having the sorry.



116

00:09:52,500 --> 00:09:53,120

OK.



117

00:09:53,390 --> 00:09:57,360

I think we do something with this part if the fat content.



118

00:09:57,520 --> 00:09:59,160

OK, ok, ok.



119

00:09:59,770 --> 00:10:01,940

I can't believe this one right here.



120

00:10:03,560 --> 00:10:06,970

We got a problem with Spartz, so what's the problem here?



121

00:10:08,990 --> 00:10:20,490

Yes, sir, Jack of Corn Row is ending here, and this is one for the container.



122

00:10:20,510 --> 00:10:21,620

So what's the problem?



123

00:10:21,650 --> 00:10:24,770

This part, we got something wrong, this part.



124

00:10:24,780 --> 00:10:32,720

So let's try to make this container flight to get our problem, this part and we need to solve.



125

00:10:33,590 --> 00:10:36,560

So let's try to make this one to be 12.



126

00:10:37,250 --> 00:10:38,630

So you would count the 12.



127

00:10:40,080 --> 00:10:47,040

Yes, I think the problem was we are we were making the screen side and here we got no problem with



128

00:10:47,820 --> 00:10:52,290

it, we got no problem with any screen and they are centered.



129

00:10:52,930 --> 00:10:53,910

OK, that's good.



130

00:10:53,910 --> 00:10:57,450

We are done from this part and also made it responsive.



131

00:10:57,810 --> 00:11:00,950

In the next video, we would add a map to this project.



132

00:11:01,320 --> 00:11:03,150

So good luck and have fun.