body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	background-color: #032659;
	padding: 0px;
	margin: 0px;
	}
		
	h1{
		font-family: Georgia, "Times New Roman", Times, serif;
		font-size: 16px;
		color: #123784;
		}
	
	h2{
		font-family: Georgia, "Times New Roman", Times, serif;
		font-size: 14px;
		color: #123784;
		}
	
	h3{
		font-family: Arial, Helvetica, sans-serif;
		font-size: 16px;
		font-weight: bold;
		color: #123784;
		padding:0;
		margin:0;
		}
	
	

	
	
	/* This is a container div that centers the box in the browser window and creates the yellow-beige BG color */
	#frame {
    margin: 10px auto;
	width:710px;
	padding:0px;
	background-color: #FFFDE4;
	}
	
	
	/*This is the header. It holds the illuminated border and the title.*/	
	
	#heading {
	width:710px;
	height:80px;
	padding:0;
	margin: 0;
	background: url(img/title.gif);
	}

		
	/*This is the navigation bar (holds the three links)*/	
	
	#navbar {
	clear: both;
	padding: 15px 31px;
	margin: 0px;
	width:648px;
	height:36px;
	background-color: #FFFDE4;
	}
	
		
	/*#navbar li are the list items within the navigation bar*/	
	
	#navbar ul {
		list-style: none;
		display: inline;
		margin: 0px;
		}
	
	#navbar li {
	float: left;
	text-align: center;
	background-color: #E0D9B5;
	height: 36px;
	}
	
	#navbar li.currentpage {
	background-color: #C6BF97;
	}
	
		
		
	/*#footer is the code for the footer at the bottom of each page*/	
	
	#footer {
	padding: 0;
	margin:0;
	width: 710px;
	height: 36px;
	clear: both;
	background-color: #E0D9B5;
	}
	
		
	/*This is the code for the text in the footer*/
	
	.footertext {
	text-align: center;
	position: relative;
	color: black;
	top: 28%;
	font-size: 12px;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-weight: normal;
	}
	
	
	/*This is the code for links in the footer*/
	
	#footer a{
	text-decoration: none;
	color: #000000;
	font-size: 12px;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-weight: normal;
	}
	
	
	/*This is the code for what happens when a mouse moves over the links in the footer.*/
	
	#footer a:hover{
	color: #660000;
	font-weight: bold;
	}

	/*This is the code for the style of the links located in the navigation bar*/	
	
	#navbar a {
	font-weight: normal;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 20px;
	color: #123784;
	letter-spacing: 1px;
	line-height: 36px;
	 padding-top: 0;
	padding-right: 7px;
	padding-left: 7px;
	text-align: center;
	margin: 0;
	text-decoration: none;
	}
	
	
	/*This is the code for what happens when a mouse hovers over the links in the nav bar.*/
	
	#navbar a:hover{
	background-color: #C6BF97;
	padding-top: 7px;
	padding-bottom: 7px;
	}

	/*HOME PAGE-SPECIFIC CODE*/
	/*#contentleft is the left pane of the home page*/
	
	#contentleft {
	width:270px;
	height: 415px;
	padding-left:15px;
	margin: 0;
	float:left;
	line-height: 20px;
	}
	
	
	/*#contentright is the right pane of the home page*/	
	
	#contentright {
	width:400px;
	height: 415px;
	float:right;
	margin: 0;
	line-height: 19px;
	}
	
	
	/*#contentright li is the code for the list items (the images) within the right content pane on the home page*/
	
	#contentright ul {
		list-style: none;
		display: inline;
		padding: 0px;
		margin-top: 0px;
	}
	
	#contentright li {
	
	float: left;
	margin: 10px 3px 20px 3px;
	padding: 0;
	}
	
	
	/*This is the code for the text in the left content pane on the home page*/
	
	.leftboxtext{
	text-align: right;
	color: black;
	font-size: 16px;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: normal;
	padding-bottom: 5px;
	}
	
	
	/*This is the code for the text in the right content pane on the home page */
	
	.rightboxtext{
	text-align: left;
	color: black;
	font-size: 16px;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: normal;
	padding-left: 5px;
	}
	
	/*EXPLORING THE ERA-SPECIFIC CODE
	
	.erabox defines the divs that contain both an image and text, i.e. "People" or "Places" */
	.erabox {
		width: 306px;
		margin-left: 25px;
	}
	
	.erabox img {
		padding-right: 25px;
		align: left;
	}
	
	
	/*This is the code for the list items within the .erabox divs on "Exploring the Era" AND
	the list items in various other content pages*/ 
	.erabox li, .maintext li, #masstext li{
	list-style: square;
	color: #000000;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: normal;
	text-decoration: none;
	padding: 0;
	margin: 0;
	}
	
	/*This is the code for the links within the .erabox divs on "Exploring the Era" AND
	the links in various other content pages*/ 
	
	#erapagepic a, #erapagetext a, #masstext a, .maintext a, .erabox a, .scoreText a {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: normal;
	color: #000000;
	letter-spacing: 1px;
	padding: 0;
	margin:0;
	line-height: 20px;
	border: none;
	text-decoration: underline;
	}
	
	.musicNote {
		border: none;
		color: #FFFDE4;
		}
		
	
	
	#erapagepic a:hover, #erapagetext a:hover, #masstext a:hover, .maintext a:hover, .erabox a:hover, .scoreText a:hover {
	text-decoration: none;
	color: #330066;
	}
	
	
	#erapagepic a:visited, #erapagetext a:visited, #masstext a:visited, .maintext a:visited, .erabox a:visited, .scoreText a:visited {
	color: #000000;
	}
	
	
	/*THIS IS "EXPERIENCE THE MASS"-SPECIFIC CODE*/
	.maintext {
	padding: 0px 40px;	
	}	

	#masstext{
	width: 250px;
	padding: 0px 0px 20px 40px;
	margin: 0;
	float: left;
	}
	
	/*This is the code for the container of the media player*/
	#flashplayer{
	width: 390px;
	float: right;
	margin: 0;
	padding: 15px 20px 0px 0px;
	}
	
	
	/* THIS IS "EXAMINE THE SCORE"-SPECIFIC CODE */
	.scoreText {
		padding: 20px 0px 20px 15px;
	}
	
	.scoreText img {
		padding: 2px 6px 2px 3px;
	}
	
	/*THIS IS CODE FOR THE PAGES LINKED TO THE "ERA" PAGE*/
	/*This is the code for the text on each page.*/
	#erapagetext {
	padding-right: 20px;
	padding-left: 20px;
	padding-bottom: 20px;
	padding-top: 0;
	margin: 20px;	
	}	
	
	#erapageheader{
	font-weight: normal;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 28px;
	color: #123784;
	letter-spacing: 1px;
	line-height: 36px;
	padding-top:20px;
	padding-bottom: 10px;
	text-align: center;
	margin: 0;
	}
	
	#erapagepic{
	padding: 20px;
	margin: 0;
	}
	
	#erapage a{
	padding: 0;
	margin: 0;
	}

