/* CSS Document */

	body#bodyStyle	{
		/* center the content within body */
		margin: 0 auto 0 auto;
		background-image: url('../images/pattern.gif');
    		background-repeat: repeat;
		font-family: verdana;
		font-size: 10px;
	}

	body#topNavBody	{
		/* center the content within body */
		margin: 0 auto 0 auto;
		background-color: #25190E;
	}

	div#container	{
		/* make sure to set a width of something less than 100% */
		width: 811px; /* perfect width within 800x600 */
		/* don't give a height so that content can expand */
		
		/* center the container */
		margin: 0 auto 0 auto;
		
		/* give it a border so we can see what's happening */ 
                background-color: #999179;
		border: 2px solid #25190E;
		border-top: none;
		border-bottom: none;
	}
	
	body#bodyStyle h1	{
		margin: 0; padding: 0;
		display: inline;
		font-weight: normal;
		font-size: 16px;
	}
	
	body#bodyStyle h2	{
		margin: 0; padding: 0;
		display: inline;
		font-weight: normal;
		font-size: 14px;
		color: #ffffff;
	}

	body#bodyStyle h3	{
		margin: 0; padding: 0;
		display: inline;
		font-weight: normal;
		font-size: 14px;
		color: #AFA78E;
	}

	div#topNavContainer	{
		/* top nav might be different which is why I kept it separate */
		width: 100%;
		margin: 0;
		
		/* center all text/content */
		text-align: center;
		border-bottom: 2px solid #000000;
		height: 35px;
	}

	/* Top Navigation Links */
	div#topNavContainer a	{
		font-size: 14px;
		font-family: verdana, sans-serif;
		letter-spacing: 0.02em;
		/* get rid of the line underneath */
		text-decoration: none;
		color: #ffffff;
		
		/* change behavior of links - turn them into buttons (same as linkable P tag) */
		display: inline-block;
		margin: 0; padding: 0;
		padding-left: 35px;
		margin-left: 0px;
	}


	/* on mouse over, do this effect */
	div#topNavContainer a:hover	{
		color: #F9F8BB;
	}



	body#bodyStyle a{
	text-decoration: none;
	font-size: 12px;
	color: #403F3F;
	}

	body#bodyStyle a:hover{
  	/* This lays the foundation for all links in the document hover pseudo class (mouse over)*/
	color: #F9F8BB;
	}


	p.textlight	{
			font-size: 12px;
			font-family: verdana;
			color: #ffffff;
	}

	p.textdark	{
			font-size: 12px;
			font-family: verdana;
			color: #000000;
	}

	p.darklarge	{
			font-size: 16px;
			font-family: verdana;
			color: #000000;
	}