1 00:00:05,090 --> 00:00:08,540 Let's move then to our style success. 2 00:00:08,730 --> 00:00:14,840 Let's insert our love and Sobolev containers to begin. 3 00:00:15,960 --> 00:00:24,150 Container underscore, live and container underscore Sublette. 4 00:00:28,390 --> 00:00:33,850 In container live fancy that, lets insert our display flex. 5 00:00:35,020 --> 00:00:44,290 Clearly, in this case, the just one container which has inside additional device connected to other 6 00:00:44,290 --> 00:00:53,380 containers or better some containers, so inside Sobolev, there's no need to insert display Fleck's 7 00:00:53,380 --> 00:00:53,860 again. 8 00:00:54,820 --> 00:01:04,990 Let's set our classical flex wrap as the baize property to trigger the wrap when the page gets represented 9 00:01:04,990 --> 00:01:13,650 with inferior to the minimum standard required dimensions for a Bairo representation. 10 00:01:14,560 --> 00:01:21,880 After that, let's send to the content through justified content and let's insert also a line items. 11 00:01:25,060 --> 00:01:33,910 By selecting this time Flagstad so that the content may start from the top and may get always represented 12 00:01:33,910 --> 00:01:36,770 on the top even is one of the sublevels. 13 00:01:36,790 --> 00:01:43,850 So one of the sub containers should have content happening to be higher than the others. 14 00:01:43,870 --> 00:01:53,290 Let's close with a 20 percent margin bottom like we have been doing for all the other selectors in containers 15 00:01:53,290 --> 00:01:54,170 sublevels. 16 00:01:54,180 --> 00:01:58,460 Let's represent in this case, Fleck's Direction column. 17 00:01:59,410 --> 00:02:01,630 This is because we want the content. 18 00:02:03,170 --> 00:02:09,110 Every single day inside Sobolev to get vertically represented. 19 00:02:10,070 --> 00:02:15,050 In this case as well, let's specify the content should be centered. 20 00:02:19,270 --> 00:02:22,300 And let's insert a 10 picture margin bottom. 21 00:02:25,110 --> 00:02:32,100 In addition to and again, 10 piece of padding to make all content they touch correctly. 22 00:02:33,700 --> 00:02:37,270 Let's represent then the item level property. 23 00:02:38,370 --> 00:02:42,480 With a left aligned text at. 24 00:02:44,050 --> 00:02:46,120 A 10 pics of padding. 25 00:02:48,910 --> 00:02:59,650 A text, a mention of, for example, 16 pixels and one bold font weight, so seven hundred, let's 26 00:02:59,650 --> 00:03:02,430 now define the progress bar. 27 00:03:02,440 --> 00:03:10,510 So the levels to do this, we have to create some properties in sight, which. 28 00:03:11,790 --> 00:03:16,180 To define height, weight and background color. 29 00:03:16,380 --> 00:03:25,320 Let's start then with height, giving 15 pixels as a value width with three hundred pixels. 30 00:03:28,000 --> 00:03:29,620 And the background color. 31 00:03:34,090 --> 00:03:40,510 Featuring a light gray, therefore, let's insert gray and let's modify. 32 00:03:41,420 --> 00:03:44,390 It by selecting an inferior shade. 33 00:03:45,300 --> 00:03:53,640 And we also have to insert the background color within container, because given the fact the main container 34 00:03:53,640 --> 00:03:58,640 is not present anymore here as well, we have to choose white as background. 35 00:03:58,650 --> 00:04:00,390 Now, getting back to level. 36 00:04:00,570 --> 00:04:06,540 In addition to define these features, let's insert a border radius. 37 00:04:09,590 --> 00:04:11,780 Ten pizzas, so that. 38 00:04:12,630 --> 00:04:17,760 Our Dave sides may appear rounded. 39 00:04:19,930 --> 00:04:23,950 Let's step now to level zero one. 40 00:04:25,600 --> 00:04:33,550 In this case, we have to define the same height to the base has 15 pixels. 41 00:04:35,210 --> 00:04:39,350 Representing, though, an 80 percent width. 42 00:04:40,380 --> 00:04:51,370 So that comparing to the three hundred percent total, our skills may be lifted up to 80 percent. 43 00:04:52,350 --> 00:05:00,480 So when you have to create a resumé with these programs first, you have to define different levels. 44 00:05:00,520 --> 00:05:07,500 So zero two zero three, et cetera, with different percentages according to your skills. 45 00:05:07,510 --> 00:05:17,880 You may also change the background color, which in here let's define in always adhering to an Exalogic, 46 00:05:17,880 --> 00:05:19,320 tending to yellow. 47 00:05:20,070 --> 00:05:24,660 So let's choose a shade like this. 48 00:05:26,170 --> 00:05:31,570 And here as well, let's complete with a 10 pixel border radius use of. 49 00:05:34,960 --> 00:05:45,490 After that, let's turn to our SEC or to starting from the base, we already have more refined, though, 50 00:05:45,850 --> 00:05:52,120 the initial margin, which will not be eight, but thirty eight pixels. 51 00:05:52,570 --> 00:06:00,430 So that one sincerity, certain support to the division in between the first and the second section 52 00:06:00,910 --> 00:06:03,010 should look more clear-cut. 53 00:06:03,730 --> 00:06:07,630 Let's end our stylesheet with level X. 54 00:06:10,550 --> 00:06:16,040 In this case, defining a 14 pixel font size. 55 00:06:17,460 --> 00:06:32,190 If 300 pixel weights and a background color directly from level so that anyway, a certain logic may 56 00:06:32,190 --> 00:06:41,310 be obvious in the colourings choice as well, let's close with border radius 10 or also in this case 57 00:06:41,310 --> 00:06:43,620 and a 20 foot PADI. 58 00:06:45,660 --> 00:06:53,880 OK, then, after saving and refreshing, let's verify our contents to be correctly inserted, as you 59 00:06:53,880 --> 00:07:02,770 see in Resumé now we have all our contents which haven't been inserted with the general Blackstrap, 60 00:07:02,800 --> 00:07:05,010 but they have fought by shrinking. 61 00:07:05,040 --> 00:07:12,690 They will appear one below the other and by stretching the will appear perfectly centered one beside 62 00:07:12,690 --> 00:07:22,580 the other with a line item in Flagstad, which does not send to singularly design coding and education. 63 00:07:22,590 --> 00:07:30,300 So we have correctly completed also the resumé page and we can now deal with the UNTUK page.