a:link {
	color: #666;
}
a:visited {
	text-decoration: none;
	color: #666;
}
a:hover {
	text-decoration: none;
	color: #c76653;
}
a:active {
	text-decoration: none;
	color: #999;
}

p{
	padding: 0 20px 0 20px;
	font-family:Georgia, Times New Roman, Times, serif;
	color:#666;
}

strong{
	color:#333;
}

ul{
	color:#333;
	list-style:circle;
	line-height:16pt;
}

h1 {
	font-family:"Georgia", Times New Roman, Times, serif;
	color:#999;
	font-style:italic;
	font-size:18pt;
	text-align: left;
}

h2{
	font-family:"Georgia", Times New Roman, Times, serif;
	color:#c76653;
	font-size:16pt;
}

body {
	font-family:"Georgia", Times New Roman, Times, serif;
	background: #96b0bf;
	margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
	padding: 0;
	text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
	color: #999;
}

.title{
	color:#666;
	font-family:Arial,Helvetica,sans-serif;
	text-align:right;
	font-size:24pt;
	font-weight:bold;
	width:651px;
}

.title2{
	position:relative;
	color:#666;
	font-family:Arial,Helvetica,sans-serif;
	text-align:right;
	font-size:24pt;
	font-weight:bold;
	width:870px;
	right:0px;
}

.biline{
	font:"Georgia", serif;
	color:#c76653;
	font-style:italic;
	text-align:left;
	font-size:18pt;
	font-weight:bold;
	padding-left:20px;
}

#front-page-box{
	position:absolute;
	z-index:-1;
	left: 1px;
	top: 182px;
}

#menubar{
	position:absolute;
	z-index:10;
	background-color:#F60;
}

#mem-left{
	width:297px;
	height:915px;
	padding-left:10px;
	float:left;
}

#mem-right{
	width:337px;
	height:915px;

	padding-left:10px;
	float:right;
}

#index-menu{
	position:relative;
	width:949px;
	text-align:center;
	float:left;
	margin-top:10px;
	margin-bottom:10px;
}

.index-buttons{
	position:relative;
	float:none;
	width:218px;
	padding:5px;
}

#contact-info{
	position:relative;
	float:none;
	left:20px;
}

#container { 
	width: 949px;  /* using 20px less than a full 800px width allows for browser chrome and avoids a horizontal scroll bar */
	background: #FFFFFF;
	margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
	text-align: left; /* this overrides the text-align: center on the body element. */
} 
#header { 
	background: #fff;
	position:relative;
	width:949px;
	height:120px;
	
} 

	#header-slogan{
		width:706px;
		height:83px;
		position:absolute;
		top:0px;
		right:0px;
		background-color:#fff;
		background-image:url(images/header-slogan.jpg);
	}
	
#side-menu {
	position:relative;
	float: left; /* since this element is floated, a width must be given */
	width: 182px;
  	top:53px;
  	left:56px;
  	background-image:url(images/side-menu-bg.png);
 	background-repeat:repeat-y;
  	background-position:right;
	padding: 0px 0px 0px 0px;
}

	#side-menu-top{
		position:absolute;
		float:right; /* since this element is floated, a width must be given */
		width: 94px;
		right:0px;
	}
	
	#side-menu-bottom{
		position:relative;
		float: right; /* since this element is floated, a width must be given */
		width: 94px;
		bottom:-10px;
		right:0px;
	}
	
#iframe-box{
	position:relative;
	float:right;
	width:652px;
	}



#mainContent { 
	margin: -40px 0 0 250px; /* the left margin on this div element creates the column down the left side of the page - no matter how much content the sidebar1 div contains, the column space will remain. You can remove this margin if you want the #mainContent div's text to fill the #sidebar1 space when the content in #sidebar1 ends. */
	padding: 0 45px 20px 0px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
	position:relative;
	
} 
	#mainContent p{
		font:"Georgia", serif;
		color:#666666;
		text-align:justify;
		font-size:12pt;
	}
	
#mainContent-prod { 
	margin: -40px 0 0 0px; /* the left margin on this div element creates the column down the left side of the page - no matter how much content the sidebar1 div contains, the column space will remain. You can remove this margin if you want the #mainContent div's text to fill the #sidebar1 space when the content in #sidebar1 ends. */
	padding: 0 0px 0px 0px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
	position:relative;
	z-index:1;
} 

#mainContent-prod p{
		font:"Georgia", serif;
		color:#666666;
		text-align:justify;
		font-size:12pt;
	}
	


.prod-box{
	position:relative;
	float:none;
	width:698px;
	height:126px;
	left:19px;
	background-color:#fff;
	border-left: 0px solid #999;
	border-right: 5px solid #999;
	border-top: 5px solid #999;
	border-bottom: 5px solid #999;
	margin-bottom:35px;
	margin-left:179px;
	padding-left:15px;
	padding-right:10px;
	z-index:1;
}

.font-change{
		font:"Georgia", serif;
		color:#000;
		text-align:justify;
		font-size:10pt;
}

.font-change2{
		font:"Georgia", serif;
		color:#666;
		text-align:justify;
		font-size:10pt;
		
}

.prod-box p{
	font-size:32pt;
}

.prod-button{
	position:relative;
	float:left;
	left:27px;
	bottom:9px;
	width:174px;
	height:140px;
	background-color:#Fff;
	border-bottom: 5px solid #999;
	border-right: 0px solid #999;
	z-index:100;
}

#thum-table{
	position:relative;
	float:none;
	left:10px;
}
	
	
#footer { 
	padding: 5px 10px 0 20px; /* this padding matches the left alignment of the elements in the divs that appear above it. */
	background-color:#96b0bf;
	text-align:center;
} 

	#footer .text{
		font-family:Arial, "Helvetica", sans-serif;
		font-size:10pt;
		font-variant:small-caps;
		color:#333;
	}
	
	#footer .links{
		font-family:Arial, "Helvetica", sans-serif;
		font-size:11pt;
		color:#333;
	}
	
	#footer .text a:link {
		color:#333;
		font-variant:normal;
	}
	#footer .text a:visited {
		text-decoration: none;
		color: #333;
		font-variant:normal;
	}
	#footer .text a:hover {
		text-decoration: none;
		color:#fff;
		font-variant:normal;
	}
	#footer .text a:active {
		text-decoration: none;
		color: #999;
		font-variant:normal;
	}
	
	#footer .links a:link {
		text-decoration: none;
		color:#fff;
	}
	
	#footer .links a:visited {
		text-decoration: none;
		color: #fff;
	}
	
	#footer .links a:hover {
		text-decoration:underline;
		color:#fff;
	
	}
	
	#footer .links a:active {
		text-decoration: none;
		color: #fff;
	}

.fltrt { /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
	float: right;
	margin-left: 8px;
}
.fltlft { /* this class can be used to float an element left in your page */
	float: left;
	margin-right: 8px;
}
.clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}