Designing a Page Layout CSS3 HTML5

profileramishaabbas
sp_styles.css

@charset "utf-8"; /* New Perspectives on HTML5 and CSS3, 7th Edition Tutorial 3 Case Problem 1 Typographical styles for Slate and Pencil Tutoring Filename: sp_styles.css */ /* Window and Body Styles */ html { background-color: rgb(230, 182, 144); } body { background-color: rgb(250, 238, 218); font-family: Verdana, Geneva, Arial, sans-serif; } /* Page Header Styles */ body > header { background-color: rgb(61, 138, 216); } body > header > nav a { font-size: 1em; margin: 0.4em 0; padding: 5px; } body > header > nav a:link, body > header > nav:visited { color: rgb(250, 238, 218); } body > header > nav a:hover, body > header > nav:active { background-color: rgba(0, 0, 0, 0.2); } /* Horizontal Navigation List Styles */ nav.horizontal ul li { background-color: rgb(18, 31, 102); font-size: 0.9em; padding: 10px 0; text-align: center; } nav.horizontal a:link, nav.horizontal a:visited { color: rgb(250, 238, 218); } nav.horizontal a:hover, nav.horizontal a:active { color: rgb(255, 255, 64); } /* Topics Styles */ ul#topics { margin-top: 20px; margin-bottom: 20px; } ul#topics li p { color: rgb(95, 114, 232); font-size: 0.8em; } /* Customer Comment Styles */ ul#comments li p { font-size: 0.9em; color: rgb(121, 121, 121); line-height: 1.2em; } /* Footer Styles */ footer { color: rgb(186, 186, 156); background-color: rgb(44, 91, 169); font-size: 0.9em; padding: 10px 0px; text-align: center; }