Shape Up! 7 Add a navigation menu and more

In this exercise, youll enhance the home page you worked on in exercise 6 so it includes a two-tier horizontal navigation menu and an image link. Youll also format the list in the sidebar so the items arent indented, and youll remove the underlines from the links. When youre through, the home page should look similar to this:

Specifications

• Add a 2-tier navigation menu. The main menu and Stress Relief submenu should include the links shown above. In addition, a Healthy Diets submenu should be included with the links Why a Healthy Diet?, Plan Your Meals, Count Your Calories, and Calculate Your BMI. Be sure all the links refer to the correct pages. (The What is Stress? link should refer to the index.html page in the stress folder, and the Why a Healthy Diet? link should refer to the index.html page in the diet folder).

• Format the navigation menu so the background color is steelblue, so the link for the page thats currently displayed (in this case, Home) has black text, and so the link that the mouse is hovering over or has the focus (in this case, Meditation) has a lightsteelblue background.

• Remove the links from the h3 headings in the section, since these pages can now be accessed from the menu.

• Modify the logo in the header so its a link that displays the home page.

• Format the list in the sidebar so theres no space to the left of the list items. In addition, remove the underlines from the links in the list items.

 INDEX.HTML 

Shape Up!

Shape Up!

Find the best fit for you

Get ready to Shape Up!

How many times have you started a new workout routine or diet? And how many times has it failed to give you the results you want? Now, with the help of this site, you can learn about the exercises and diet that work best for you. We offer personalized programs as well as access to several health and dieting tools. So don't wait! Get started looking and feeling better today.

As fitness expert Amanda Russell said:

Fitness is about so much more than exercise. Its a catalyst for positive change, and it affects every aspect of your life.

What we offer

Build strong muscles

Tired of being tired? Strength training can help you manage or lose weight and increase your metabolism to help you burn more calories. It can also increase bone density and reduce the risk of osteoporosis.

Get your heart rate up

Want to lose weight? Cardiovascular exercise burns calories and improves overall health. It can reduce belly fat, promote brain growth, prevent stress, and help you focus.

Relax

Stressed out? Stress can weaken the immune system and cause high blood pressure, fatigue, depression, anxiety, and even heart disease. Learn ways to manage and reduce stress.

Eat what's right for you

Are you really what you eat? Lose weight, gain weight, or just feel great! Maintaining a healthy diet is probably the most important thing you can do to promote overall health.

Additional resources

• Physical activity and health
• Stretching exercises
• Strength training
• Cardiovascular training
• Yoga workout

2019 Shape Up!

MAIN.CSS

/* the styles for the elements */ body { font-family: Arial, Helvetica, sans-serif; width: 900px; margin: 0 auto; padding: 0; border: 3px solid steelblue; box-shadow: 0 10px 20px 10px; } h1, h2, h3, p { margin: 0; padding: 0; } a { font-weight: bold; } /* the styles for the header */ header { background-image: -webkit-linear-gradient(to bottom, white 0%, lightsteelblue 100%); background-image: -moz-linear-gradient(to bottom, white 0%, lightsteelblue 100%); background-image: -o-linear-gradient(to bottom, white 0%, lightsteelblue 100%); background-image: linear-gradient(to bottom, white 0%, lightsteelblue 100%); padding: 15px 30px; border-bottom: 2px solid steelblue; } header img { float: left; } header h2 { font-size: 250%; font-style: italic; color: steelblue; text-indent: 45px; text-shadow: 3px 3px 3px steelblue; margin-bottom: .3em; } header h3 { font-size: 150%; text-indent: 45px; padding-bottom: .75em; } /* the styles for the section */ section { width: 565px; float: right; padding: 25px 30px; } section h1 { font-size: 160%; margin-bottom: .3em; } section h2 { font-size: 130%; margin-bottom: .5em; } section h3 { color: maroon; font-size: 110%; margin-bottom: .4em; } section p { font-size: 100%; margin-bottom: .7em; } section a:link, section a:visited { color: maroon; } section a:hover, section a:focus { color: steelblue; } /* the styles for the sidebar */ aside { float: left; width: 245px; padding: 25px 0 0 30px; } aside h2 { font-size: 130%; color: maroon; margin-bottom: 8px; } aside ul { line-height: 1.5; margin: 0; } aside a:link, aside a:visited { color: steelblue } aside a:hover, aside a:focus { color: maroon; } /* the styles for the footer */ footer { clear: both; padding: 15px 30px; background-color: steelblue; } footer p { text-align: center; font-size: 85%; color: white; } 

NORMALIZE.CSS

/*! normalize.css v3.0.2 | MIT License | git.ioormalize */ /** * 1. Set default font family to sans-serif. * 2. Prevent iOS text size adjust after orientation change, without disabling * user zoom. */ html { font-family: sans-serif; /* 1 */ -ms-text-size-adjust: 100%; /* 2 */ -webkit-text-size-adjust: 100%; /* 2 */ } /** * Remove default margin. */ body { margin: 0; } /* HTML5 display definitions ========================================================================== */ /** * Correct `block` display not defined for any HTML5 element in IE 8/9. * Correct `block` display not defined for `details` or `summary` in IE 10/11 * and Firefox. * Correct `block` display not defined for `main` in IE 11. */ article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { display: block; } /** * 1. Correct `inline-block` display not defined in IE 8/9. * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera. */ audio, canvas, progress, video { display: inline-block; /* 1 */ vertical-align: baseline; /* 2 */ } /** * Prevent modern browsers from displaying `audio` without controls. * Remove excess height in iOS 5 devices. */ audio:not([controls]) { display: none; height: 0; } /** * Address `[hidden]` styling not present in IE 8/9/10. * Hide the `template` element in IE 8/9/11, Safari, and Firefox   Shape Upt C127001:56930/ch07dehtm Shape up! Find the best fit for you Strength Training Cardio Exercises Healthy Diets Stress Relief What is Stress? 5 Helpful Tips Meditation Vipassana Home Additional resources Get ready to Shape Physical activity and health Stretching exercises Strength training Cardiovascular training Yoga workout How many times have you start many times has n failed to glve y this site, you can learn about the ofter personalized programs as w tools. So dont wait! Get started diet? And now ow with the help of ork best tor you We alth and dieting As ftness expert Amanda Russell said Fitness is about so much more than exercise It's a catalyst for positive change, and it affects every aspect of your lite What we offer Build strong muscles Tired of being tirea? Strength training can heip you manage or lose weight and increase your metabolism to help you burn more calones. It can also increase bone density and reduce the risk of osteoporosis Get your heart rate up Want to lose weight? Cardiovascular exercise bums calones and improves overall health. It can reduce belly fat, promote brain growth, prevent stress, and help you focus Relax Stressed out? Stress can weaken the immune system and cause high blood pressure, fatigue, depression, anxiety, and even heart disease Learn ways to manage and reduce stress Eat what's right for you Are you really what you eat? Lose weight, gain weight, or just feel great Maintaining a healthy diet is probably the most important thing you can do to promote overall heath 2019 Shape UO 12700 1:520cM7/stresumedate.htmc