@charset "utf-8";
/* CSS Document */

/* Top Menu */

#nav {
	position:relative;
	width: 800px; 
	height: 38px;
	margin: 0 auto;
	top:3px;
	left:100px;
}

#nav ul {
	margin: 0 auto; 
	padding: 0; 
	list-style: none; 
	z-index: 100;
}

#nav li { 
	float: left; 
	padding: 0; 
	margin: 0; 
}

#nav li a, #nav li a:hover, #nav li a:active  { padding: 0; display: block; }

#nav li a: { padding: 0; }

#nav li.home a { background: url(/images/nav_home.png) no-repeat left top; }
#nav li.home a:hover { background: url(/images/nav_home.png) no-repeat left bottom; }

#nav li.about a { background: url(/images/nav_about.png) no-repeat left top; }
#nav li.about a:hover, #nav li.about a:active { background: url(/images/nav_about.png) no-repeat left bottom; }

#nav li.products a { background: url(/images/nav_products.png) no-repeat left top; }
#nav li.products a:hover { background: url(/images/nav_products.png) no-repeat left bottom; }

#nav li.news a { background: url(/images/nav_news.png) no-repeat left top; }
#nav li.news a:hover { background: url(/images/nav_news.png) no-repeat left bottom; }

#nav li.contact a { background: url(/images/nav_contact.png) no-repeat left top; }
#nav li.contact a:hover { background: url(/images/nav_contact.png) no-repeat left bottom; }

#nav li.customers a { background: url(/images/nav_customers.png) no-repeat left top; }
#nav li.customers a:hover { background: url(/images/nav_customers.png) no-repeat left bottom; }

#nav li.literature a { background: url(/images/nav_literature.png) no-repeat left top; }
#nav li.literature a:hover { background: url(/images/nav_literature.png) no-repeat left bottom; }


<!-- use these for submenus -->
#nav li.home li, #nav li.home ul { width: 86px; }
#nav li.about li, #nav li.about ul { width: 89px; }

#nav li li { 
	height: auto; 
	text-align: left;
	border: 1px solid white; 
	border-top: none; 
	background: #e2e4ea; 
	display: block;
}

#nav li li a { 
	display: block; 
	padding: 6px; 
	width: 100%;
	font-weight: bold;
	color: #303a54;
}

#nav li li>a { display: block; padding: 6px; width: auto; }

#nav li li a: { 
	display: block;
	text-decoration: none; 
	padding: 6px;
	background: #c5c9d4;
	color: #7f4153;
}

/* Section Menu*/

#smenu {
	background: url(/assets/img/smenu_tile.png) repeat-y left top;
	width: 195px; margin: 0 auto; padding: 0;
	position:relative;
}

#smenu_bot {
	background: url(/assets/img/smenu_bot.png) no-repeat left top;
	width: 195px; height: 2px; overflow-y: hidden;
	margin: 0 auto; padding: 0;
}

#smenu ul { 
	margin: 0 auto; padding: 0;
	list-style: none; display: block;
}

#smenu ul li {
    min-height: 25px;
    margin: 0 auto; padding: 0;
}

#smenu ul li a {
	background: url(/assets/img/smenu_li_tile.png) no-repeat left bottom;
    margin: 0 auto; padding: 5px 0 5px 10px;
	display: block;
	font-size: 14px; color: #7f2e46; font-weight: bold; text-decoration: none;
}

#smenu ul li a: {
	background: url(/assets/img/smenu_li_over.png) no-repeat left bottom;
	display: block;
	color: #1e2e54; text-decoration: none;
}

#smenu ul li a::after { content: " »"; }