1. Applying Additional Responsive Design Techniques to Your Personal Portfolio Website
Personal
Part 1:

In Chapter 5, you styled your personal portfolio website for a mobile layout. In this exercise,
you update that page to use responsive design as follows:
1. Open the external style sheet you created in Chapter 5 and save it with the name
    portfoliostyles06.css in the styles folder within the your_turn_1 folder.
2. Add your name and the current date as a comment to the first line of the
    portfoliostyles06.css file.
3. In your HTML editor, open the  files you created for your portfolio website in Chapter 5
    and make sure your name and the current date are added as a comment to the first line

     of all files.
          a. Update the HTML files to modify the link to the external style sheet to reference
               portfoliostyles06.css.
           b. Apply a class named mobile to elements that should only be displayed on a
               mobile viewport, such as the telephone link.
            c. Apply a class named desktop to elements that should only be displayed on a tablet
               or desktop viewport.

4. Update the CSS file to:
       a. Create a media query for tablet and desktop viewports.
       b. Create style rules for tablet and desktop viewports.
       c. Hide the desktop class for the mobile layout.
       d. Hide the mobile class for the desktop layout.
       e. Refine your style sheet as desired.
       f. Adjust viewport widths if necessary.
       g. Add comments to note all changes and updates.
5. Save and test your files.
6. Validate and correct your HTML and CSS files, and submit your assignment in the format
     specified by your instructor.

Part 2:
Use your browser to research responsive storytelling and discuss how this web design
process could be helpful to your portfolio site.