/* 1. Set the margin-bottom of the header to 3rem. */
header {
  margin-bottom: 3rem;
}

/* 2. Set the line-height of all paragraphs to 1.6. */
p {
  line-height: 1.6;
}

/* 3. Make the font-size of the "See All..." links 
0.8em, and make them uppercase. */
.see-all {
  font-size: 0.8em;
  text-transform: uppercase;
}

/* 4. Make the font-size of show titles 2.5rem. */
.shows h1 {
  font-size: 2.5rem;
}

/* 5. Make the section-titles uppercase, and 
font-size 1rem. */
.shows h2 {
  text-transform: uppercase;
  font-size: 1rem;
}

/* 6. Make all title fonts light weight. */
h1,
h2 {
  font-weight: 100;
}

/* 7. Make the cast images width:100%;. */
.cast img {
  width: 100%;
}

/* 8. Make each castmember element width: 25%;. 
(The element that represents the whole 
castmember in the list, not just the image.) */
.cast ul li {
  width: 25%;
}

/* 9. Add a 1px solid black border above each 
show — without unintentionally adding borders 
elsewhere. */
.shows > li {
  border-top: 1px solid black;
}

/* 10. Make the navigation tab with the .selected 
class be bold and black. */
.selected a {
  font-weight: bold;
  color: black;
}

/* 11. Make the castmember labels 0.8rem. */
.cast ul li a div {
  font-size: 0.8rem;
}

/* 12. Make the actor/actress names bold. */
.cast ul li a div:nth-child(2) {
  font-weight: bold;
}

/* 13. Make the character names italic. */
.cast ul li a div:nth-child(3) {
  font-style: italic;
}

/* 14. Add an asterisk (*) to the last year in 
the Game of Thrones seasons list. */
#game-of-thrones .seasons ul li:last-child::after {
  content: "*";
}

/* 15. Add the text "* Final Season" on the next 
line after the Game of Thrones season list. 
Make it 0.7rem, and color it to be #999. */
#game-of-thrones .seasons ul::after {
  content: "* Final Season";
  display: block;
  font-size: 0.7rem;
  color: #999;
}
