Modify the html template below with the follow css inputs:

instructions for css file:

/* To do 1 */

To do 1: Style the body element

1. Select the body element 2. Set body properties: 2.1: Font family with: 1. Prefer font: Helvetica 2. Web-font safe: Arial 3. Genetic font: sans-serif 2.2: Font size to 12px

/* To do 2 */

To do 2: Style for all ul element 1. Select all ul elements 2. Set ul property with No bullet symbol for list item

/* To do 3 */

To do 3: Style for all header element 1. Select all header element 2. Set header width to 100%

/* To do 4 */

To do 4: Style all nav element inside of header element in To do 3, 1. Select all nav element inside of header element in To do 3, 2. Set nav properties: 2.1: Background color with color code is #333, 2.2: Color with code name is "white", 2.3: Overflow to hidden

/* To do 5 */ To do 5: Style for all hyperlink inside of nav element in To do 4, 1. Select all hyperlink inside of nav element in To do 4, 2. Set hyperlink properties:,2.1: Float to left 2.2: Color with code is "#f2f2f2", 2.3: Text aglinment to center, 2.4: Text decoration is none.

/* To do 6 */

/* To do 6: Style for all hyperlink that has class="active" from links of To do 5

1. for all hyperlink that has class="active" from links of To do 6

2. Set hyperlink properties:

2.1: Background color with color code is "#4CAF50"

2.2: Color with code name is "white"

*/

/* ======================== To do 7 ======================== */

/* To do 7: Style for all hyperlink while hover status from links of To do 5

1. Select all hyperlink with hover status from links of To do 5

2. Set hyperlink properties:

2.1: Background color with color code is "#ddd"

2.2: Color with code name is "black"

*/

/* ======================== To do 8 ======================== */

/* To do 8: Style for main element

1. Select main element

2. Set clear property to "both"

*/

/* ======================== To do 9 ======================== */

/* To do 9: Style img inside of section element with id="profile"

1. Select img inside of section element with id="profile"

2. Set img property float to "left"

*/

/* ======================== To do 10 ======================== */

/* To do 10: Style article inside of section element with id="profile"

1. Select article inside of section element with id="profile"

2. Set article properties:

2.1: Float to "left"

2.2: Font size to 1.2em

*/

/* ======================== To do 11 ======================== */

/* To do 11: Style first direct-child section element inside of main element

1. Select first direct-child section element inside of main element

*Note: just the first direct-child, not all section elements

2. Set section property clear to "both"

*/

/* ======================== To do 12 ======================== */

/* To do 12: Style all ul elements that are child of section element inside of main element

1. Select all ul elements that are child of section element inside of main element

*Note: In this case, we first select all section in main element and then select all ul elements inside of the selected section.

2. Set ul property which make the item list includes bullet point symbol

*/

/* ======================== To do 13 ======================== */

/* To do 13: Style all p elements that has class="date-location" inside of main element

1. Select all p elements that has class="date-location" inside of main element

2. Set h3 and p property float to "right":

*/

/* ======================== To do 14 ======================== */

/* To do 14: Style all span elements that has class="skills" inside of an element with id="Skills"

1. Style all span elements that has class="skills" inside of an element with id="Skills"

2. Set span font weight to "normal"

*/

HTML Template:

• HOME
• RESUME

FULL_NAME

• ADDRESS
• 2314988844
• username@ucla.edu
• Linked In

EDUCATION

---

START_YEAR - END_YEAR, LOCATION

DEGREE in MAJOR

SCHOOL - GPA: #.##

EXPERIENCE

---

START_YEAR - END_YEAR, LOCATION

POSITION_TITLE

COMPANY

• Job responsiblity 1
• Job responsiblity 2

Reference: NAME - TITLE - 2314988844

SKILLS

---

Familiar: SKILL_1, SKILL_2, SKILL_3, SKILL_4, SKILL_5, SKILL_6, SKILL_7

Experience: SKILL_1, SKILL_2, SKILL_3, SKILL_4, SKILL_5, SKILL_6, SKILL_7

Language: SKILL_1, SKILL_2, SKILL_3, SKILL_4, SKILL_5, SKILL_6, SKILL_7

PROJECTS

---

PROJECT_TITLE

• PROJECT_KEY_DESCRIPTION_1
• PROJECT_KEY_DESCRIPTION_2
• PROJECT_KEY_DESCRIPTION_3