Internal CSS
Click on CSS panel and New CSS Rule button (below)
Select Tag, H1, This document only

• H1 - 22 pixels, #CC6666
• H2 - 18 pixels, #8E673D (sample color from the bar - dark brawn)

CSS panel:  All - Current > double click to edit

To create class style:
Create new class style and name it .maintext (no spaces). This document only:

• Size: 10 pixels
• Line height: 12
• verdana
• # 484B3A

• Click apply and notice no changes to the page.
• Select part of the text, and apply .maintext style - undo
• Click inside paragraph without highlighting, and apply
• Examine the codes of paragraph
• Undo
• Select cell by clicking at <td> and apply style - notice that heading styles are not effected, but font changed to verdana
• In CSS panel click on H1 and H2, and delete (select one at the time, and click on trash basket below)

• .section - 18 pixels, Georgia, 737A51 - apply to "About tea:"
• .subsection - 18 pixels, Georgia, bold, 664322 - apply to "history"
• .subhead - 14 pixels, Georgia, bold, 664322 - apply to "The Legendary Origins of Tea" and "CommonaliTea" (below)
• .subnav - 10 pixels, Line height 7, Georgia, bold, 664322 - apply to nav. bar

In CSS panel click on .subnav in order to add padding
Click on Box, uncheck "Same for all (move rulers to estimate distance), and set Left: 75, 78 - Preview in browser

• Link Color:  # 336633
• Visited Links:  # 336633
• Active Links: # FFFFFF
• Rollover links: # 990000
• Hide underline on rollover

• Preview in browser
• Select bottom line and apply .maintext style

Setting Marins and Borders

• Click on New CSS Rule button and name it: .standardimgrt - click OK
• Select Box and uncheck "Same for all" in Margins
• Type 5 under left

Select Border:

• Style: solid
• Width: 2
• Color: #993300 and click OK

Select image and apply .standardimgrt class

Exporting and Linking to External Style Sheets

• File > Export > CSS Styles
• Create new folder "styles" in the root directory, and name it "main"

• Open fields.html and click on Attach Style Sheet button
• have Link check and select main.css from style folder
• expend main.css to see all styles

• select <td> and select maintext style
• select image and select standardimgrt style
• select "The Method" and apply subhead
• select "about tea:" and apply section
• select "from the fields to your cup" and apply subsection
• select text in navigation bar and apply subnav
• select navigation at the bottom and apply maintext

Ctrl > S to save it.

• Open about_us.html, link it to main, and apply all styles as above.
• Save it.
• Click on section style to edit color to red.
• Go back to fields.html and notice change to red color.

• Go to index.html and notice no changes to color due to existence of internal styles.
• Link to main.css and delete all internal styles.