@font-face {
	font-family: 'Caveat';
	src: 	url('fonts/Caveat-Regular.woff2') format('woff2'),
			url('fonts/Caveat-Regular.ttf') format('truetype');
} 

body { 
		 font-family: Georgia, Times, serif;
		 font-size: 1em;
		 color: #9b6608;
		 background-image: linear-gradient(#e4ddcb, #b4904c);
		 background-attachment: fixed;
		 background-color: #e4ddcb;
		 max-width: 50em;
		 margin: 0.25em 0.5em 4em 0.5em;
}	  	
footer {
		border-top: 0.1em #6E470F solid;
		text-align: right;
		font-family: ui-sans-serif, sans-serif; 
		font-size: 0.75em;
		padding-top: 1em;
		color: #583B10;
}
nav {
		margin: 1em 0 1em 0;
		text-align: right;
		border-bottom: 0.1em #b4904c solid;
		max-width: 50em;
		padding: 0.05em;
}
nav a {
		font-family: ui-sans-serif, sans-serif; 
		font-size: 0.7em;
		padding: 0.3em 0.3em 0.2em 0.3em;
		text-decoration: none;
		color: #ffffff;		
		background-color: #b4904c;
		border-radius: 0.5em 0.5em 0em 0em;
		margin: 0em;
}
nav .tab {
		color: #967942;
		background-color: #e4ddcb;
		border-top: 0.1em #b4904c solid;
		border-left: 0.1em #b4904c solid;
		border-right: 0.1em #b4904c solid;
		border-bottom: 0.3em #e4ddcb solid;
}
nav a:hover {
		border-top: 0.2em #806236 solid;
}
h1   {
		 font-size: 2.0em;
		 margin: 0 0 0.25em 0;
		 line-height: 1.25em;
		 font-family: Caveat;
		 font-weight: normal;
}	
h2   { 
	    font-size: 1.5em; 
	    margin-bottom: 0.25em; 
	    margin-top: 0em;
	    font-family: Caveat;
	    font-weight: normal;
}
h2 strong {
		 color: #53360c;
}	  
p,li { 
		 font-size: 1em; 
		 color: #53360c;
		 min-width: 10em;
}
p {
		line-height: 1.5em;
		margin: 0 0 1em 0.5em;
}
li {
		line-height: 1.5em;
		margin: 0 0 0.5em 0;
}
a {
		color: inherit;
		font-style: normal;
		text-decoration: underline;		
}	
q {
		font-style: italic;
}
li {
		line-height: 1.25em;
}	  
ul {
		list-style-position: outside;
		margin: 0 0 1em 1em;
		padding-left: 1em;
}	   
img {
	width: 97%;
	margin: 0 0 1em 0.5em;
}
	
		
@media (min-width: 25em) {
	nav {
		padding: 0.2em;
	}
	nav a {
		padding: 0.5em 0.5em 0.25em 0.5em;
		border-radius: 0.75em 0.75em 0 0;
		font-size: 0.75em;
	}
}

@media (min-width: 40em) {
	  body {
		 	margin: 0.25em 2em 6em 4em;			  
	  }
	  nav {
	      padding: 0.27em;
     }
	  nav a {
			font-size: 0.9em;
	  }
     h1 {
			font-size: 2.5em;
		 	margin-left: -1em;
	  }
	  h2 { 
	    	font-size: 1.8em;
	  }
	  p,ul { 
		 	margin-left: 1em;
		 	margin-bottom: 2em;
	  }
	  img {
		   float: right;
			width: 400px;
			margin: 0.25em 1em 1em 1em;
	  }
}

@media (min-width: 60em) {
	  body {
		 	margin: 0.25em 2em 8em 10em; 			  
	  }
	  h1   {
		 	margin-left: -2em;
	  }
}	  

@media (min-width: 80em) {
	  body {
		 	margin: 0.25em 2em 10em 20em; 			  
	  }
	  h1   {
		 	margin-left: -3em;
	  }
}