@charset "utf-8";
@font-face {
   font-family: Quicksand;
   src: url('Quicksand-Regular.woff') format('woff'),
        url('Quicksand-Regular.ttf') format('truetype');
}
/*
   New Perspectives on HTML5 and CSS3, 7th Edition
   Tutorial 2
   Tutorial Case
   
   TSS Typographic Style Sheet
   Author: Travon Bloodsaw
   Date:   2/14/2026
   
   Filename: tss_styles.css

*/



/* HTML and Body Styles */

html {
   background-color: hsl(27, 72%, 72%);
}
body {
   color: rgb(91,91,91);
   background-color: ivory;
   font-family: Verdana, Geneva, sans-serif;
}



/* Heading Styles */

h1, h2 {
   font-family: Quicksand, Verdana, Geneva, sans-serif;
   letter-spacing: 0.1em;
}
article#about_tss h1 {
   color: white;
   background-color: rgb(222, 128, 60);
}
article#about_tss h2 {
   color: white;
   background-color: rgb(235,177,131);
}
article.syllabus h1, article.syllabus h2 {
   background-color: rgb(255, 185, 255);
   color: rgb(101, 101, 101);
}



/* Aside and Blockquote Styles */

aside blockquote {
   color: rgb(232, 165, 116);
   margin: 20px 5px;
   quotes: "\201C" "\201D";
}
aside blockquote::before {
   content: open-quote;
   font-family: 'Times New Roman', Times, serif;
   font-size: 1.6em;
   font-weight: bold;
}
aside blockquote::after {
   content: close-quote;
   font-family: 'Times New Roman', Times, serif;
   font-size: 1.6em;
   font-weight: bold;
}



/* Navigation Styles */

nav > ul {
   line-height: 2em;
   list-style-type: none;
}
nav > ul > li.newgroup {
   margin-top: 20px;
}
nav > ul > li > a:link, nav > ul > li > a:visited {
   color: rgb(151, 151, 151);
   text-decoration: none;
}
nav > ul > li > a:hover, nav > ul > li > a:active {
   color: rgb(255, 64, 255);
   text-decoration: underline;
}



/* List Styles */

article#about_tss ul li:first-of-type {
   list-style-image: url(runicon.png);
}
article#about_tss ul li:nth-of-type(2) {
   list-style-image: url(bikeicon.png);
}
article#about_tss ul li:last-of-type {
   list-style-image: url(swimicon.png);
}
article.syllabus ol {
   list-style-type: upper-roman;
}
article.syllabus ol ol {
   list-style-type: upper-alpha;
}
article.syllabus ol ol ol {
   list-style-type: decimal;
}



/* Footer Styles */

body > footer address {
   background-color: rgb(222,128,60);
   color: white; color: rgba(255, 255, 255, 0.7);
   font: normal small-caps bold 0.9em/3em
         Quicksand, Verdana, Geneva, sans-serif;
   text-align: center;
}
