﻿/*this is to keep page from shifting to left on load in safari and firefox*/
/*html { min-height: 100%; margin-bottom: 1px; } */
html { overflow: -moz-scrollbars-vertical; }


body {
	/*font-family: 'Tahoma', ‘Palatino Linotype’, ‘Book Antiqua’, Palatino, serif;*/
	font-family: 'Copperplate Gothic Light', Verdana, sans-serif;
	font-size: 12px;
	background-color: #333; /*#EEEEE6;*/
	/* width:600px; */
	margin:75px auto;

	
}

div {
margin-right:auto;
} 


body * {
	margin:0; 
	padding:0;
}

#container {
	/*position: absolute; */  
	background-color:#333;
	background-image:url('rounded-corners-adap-8.gif');
	height:600px;
	width:800px;
	margin-left:auto;
	margin-right:auto;

}

#menu {
	width:350px;
	background-color:#BEB291;
	border-bottom:2px #333 solid;
	position:absolute; left:50%;
	margin-left: -180px;
	margin-top:30px;
	padding-top:0px;
}

#menu ul {
	width:350px;
	margin-left:0px;
}

#menu li {
	list-style-type:none;	
	float:left;
	width:70px;  /* can't get width right to completely fill in */
	background-color:#BEB291;
	height:1.35em;  /* 1.5em seemed to work ok for fonts, but when I used Copperplate Gothic, a gap was created between the underline of the menu and the hover / active highlight on IE and FF. - but was ok on Safari.   Reducing this to 1.4 helped.  1.0 made the line disappear. So started fudging this value to get the look ok and ended up at 1.35.  Clearly not the correct way.... but not sure how to do this properly with any font */
	text-align:center;
	padding-left:0px;
}

#menu a {
	color:#333;
	font-size:0.9em;  /* reduced this from 1.0em due to Copperplate size.  1.0 was fine for other fonts */
	background-color:#BEB291;
	text-decoration:none;
	width:70px;
	display:block;
	text-align:center;
	position:relative; 
	line-height:1.5em;
	height:1.5em;
}

#menu a:hover {
	color:white;
	background-color:#BAC0B3;
	/* border:1px white solid;  *had to disable the border as it made the underneath screen area "jump" down on the hover* on IE6 */
}


#menu-active a {
	color:white;
	background-color:#5B5A50;
}


#mastgraphic {
	 padding-top:50px;
	/* height:180px;
	 width:370px; */

}

#masthead {
	width:600px;
	margin:5px auto;
	color:rgb(72,74,70);
	padding-top:0px;	
}

#masthead h1 {
	font-size: 24px;
	font-weight:normal;
	top:5px;
	text-align:center;
}

#masthead h2 {
	font-size:1.5em;
	font-weight:normal;
	text-align:center;				
}


	
#content {
	width:600px;
	/*position:absolute; top:356px; */
	font-size:1.3em;
	margin: 40px auto;	
}


#content-text-region h3 {
	width:600px;
	font-size:1.4em;
	text-align:center;
	letter-spacing:0.1em;
	color:#333;
	margin:20px auto;
}                                    

#content span {
	color:white;
}

.clear {
	clear:both;
	background-color:0px solid blue;
}


#contact-text-region a {
	text-decoration:none;
	color:#333;
}

#contact-text-region a:hover {
	text-decoration:underline;
	font-weight:bold;
}


