/*
   New Perspectives on HTML and CSS
   Tutorial 4
   Case Problem 1

   History Style Sheet
   Author: Ricky Garcia
   Date:   9/26/25

   Filename:         history.css
   Supporting Files: 

*/
   header {
      display: block;
      background-color: rgb(51,51,51);
      text-align: center;

    }
	
	header img{
		width: 55em;
		height: 4em;
	}
	
	nav {
		display: block;
		width: 15em;
		background-color: rgb(51,51,51);
		float: left; 						/* sets element on the left */
	}
	
	nav li {
		font-family: "Century Gothic";
		font-size: 0.7em;
		list-style-type: none;
		line-height: 1.4em;
		margin-left: 1em;
		margin-bottom: 1.2em;	
}
	nav li a {
		color: rgb(212,212,212);
		text-decoration: none;
		
	}
		
	nav li a:hover{
		color: white;
	}
	
	#speech {
		background-color: rgb(212,212,212);
		width: 40em;
		float: left;
		font-family: "Palatino Linotype";
	}
	
	#speech h1 {
		background-color: rgb(51,51,51);
		color: rgb(212,212,212);
		font-size: 2em;
		text-align: center;
	}
	
	#speech p {
		font-size: 0.9em;
		margin: 1em;
	}
	
	#speech p:first-of-type::first-letter { /* Does the first paragraph, then first letter only */
		float: left; 
		font-size: 4em;
		line-height: 0.8em;
		margin-right: 0.3em;
		padding-right: 0.2em;
		padding-left: 0.2em;
		border-right: 0.02em solid black;
		border-bottom: 0.02em solid black;
	}
		
	#speech p:first-of-type::first-line { /* Does the first paragraph, then first line of text only */
		text-transform: uppercase;
	}
	
	#speech img {
	  float: right;       
	  display: block;     /* Makes each image starts on a new line */
	  clear: right;       /* Stops multiple images from showing up on the same line */
	  height: 4em;
	}