/*================================================================
NAV stylesheet for the website.

Define all aspects (layout AND typography) of:
- Nav (ul)
- Nav List Items (li)
- Nav Links
- Current Page Definitions

================================================================*/


/* NAV (ul)
----------------------------------------------------------------*/

#sitenav {
	margin: 0;
	padding: 0;
	
	font-size: 13px;
	
	position: absolute;
	top: 10px;
	left: 200px;
}
#sitenav li {
	display: inline;
	margin-right: 10px;
}
#sitenav a:link, #sitenav a:visited {
	text-decoration: none;
	color: #888888;
}
#sitenav a:hover, #sitenav a:active {
	color: #CCCCCC;
}


ul#tabnav {
	font-size: 13px;
	
	list-style-type: none;
	margin: 0;
	padding: 0;
	
	position: absolute;
	top: 70px;
	left: 200px;
}
ul#tabnav li {
	float: left;
	height: 29px;
	width: 5em;
	text-align: center;
	margin: 0 5px;
	
	background-color: #333333;
	border-top: 1px solid #666666;
	border-left: 1px solid #666666;
	border-right: 1px solid #666666;
}
ul#tabnav a:link, ul#tabnav a:visited {
	display: block;
	color: #FFFFFF;
	text-decoration: none;
	margin-top: 4px;
}
ul#tabnav a:hover {
	color: #666666;
}
body#products li.products {
	font-weight: bold;
	/* border: 1px solid #3399FF; */
	border-top: 1px solid White;
	border-left: 1px solid White;
	border-right: 1px solid White;
	background-color: #3399FF;
	height: 30px;
}
body#projects li.projects {
	font-weight: bold;
	/* border: 1px solid #FF3399; */
	border-top: 1px solid White;
	border-left: 1px solid White;
	border-right: 1px solid White;
	background-color: #FF3399;
	height: 30px;
}
body#support li.support {
	font-weight: bold;
	background-color: #FF9900;
	/* border: 1px solid #FF9900; */
	border-top: 1px solid White;
	border-left: 1px solid White;
	border-right: 1px solid White;
	height: 30px;
}
body#news li.news {
	font-weight: bold;
	/* border: 1px solid #66CC33; */
	border-top: 1px solid White;
	border-left: 1px solid White;
	border-right: 1px solid White;
	background-color: #66CC33;
	height: 30px;
}
body#products li.products a:link, body#products li.products a:visited, body#projects li.projects a:link, body#projects li.projects a:visited, body#support li.support a:link, body#support li.support a:visited, body#news li.news a:link, body#news li.news a:visited {
	color: #000000;
}
/*
body {
	background: url(../img/bg/default.gif) top left repeat-x;
}
body#products {
	background: url(../img/bg/products.gif) top left repeat-x;	
}
body#discontinued {
	background: url(../img/bg/products.gif) top left repeat-x;	
}
body#projects {
	background: url(../img/bg/projects.gif) top left repeat-x;	
}
body#support {
	background: url(../img/bg/support.gif) top left repeat-x;
}
body#news {
	background: url(../img/bg/news.gif) top left repeat-x;	
}
*/

#toparea {
  background-color: Black;
}

.bg-toparea {
	background: Black url(../img/bg/default.gif) top left repeat-x;
}
.bg-topareaproducts {
	background: Black url(../img/bg/products.gif) top left repeat-x;	
}
.bg-topareadiscontinued {
	background: Black url(../img/bg/support.gif) top left repeat-x;	
}
.bg-topareaprojects {
	background: Black url(../img/bg/projects.gif) top left repeat-x;	
}
.bg-topareasupport {
	background: Black url(../img/bg/support.gif) top left repeat-x;
}
.bg-topareanews {
	background: Black url(../img/bg/news.gif) top left repeat-x;	
}

.bg-topareasearch {
	background: Black url(../img/bg/default.gif) top left repeat-x;	
}

#submenu {
	font-size: 13px;
	
	margin: 0;
	padding: 0;
	
	position: absolute;
	bottom: 2px;
	left: 200px;
}
#submenu ul {

}
#submenu li {
	display: inline;
	padding: 4px;
	list-style-type: none;
}
#submenu a:link, #submenu a:visited {
	color: #000000;
	text-decoration: none;
}

body#products #submenu a:hover {
	background-color: #48A3FF;
}
body#discontinued #submenu a:hover {
	background-color: #FFA31A;
}
body#projects #submenu a:hover {
	background-color: #FF48A3;
}
body#support #submenu a:hover {
	background-color: #FFA31A;
}
body#news #submenu a:hover {
	background-color: #76D148;
}



ul#tabs {
	margin: 0;
	padding: 0;
	margin-top: 20px;
	
	padding-left: 20px;
	padding-bottom: 20px;
	
	font-size: 12px;
	list-style-type: none;
	border-bottom: 1px solid gray;
}
ul#tabs li {
	margin: 0;
	padding: 0;
	
	display: block;
	width: 6em;
	height: 20px;
	
	text-align: center;
	
	float: left;
	margin-right: 6px;
	border: 1px solid gray;
	border-bottom: none;
}
ul#tabs a:link, ul#tabs a:visited {	
	display: block;
	text-decoration: none;
	color: gray;
}

ul#tabs a:hover {
	color: black;
}
#productinfo.overview li.overview, #projectinfo.overview li.overview,
#productinfo.detail li.detail, #projectinfo.detail li.detail,
#productinfo.support li.support, #projectinfo.features li.support,
#productinfo.gallery li.gallery
{
}
#productinfo.overview li.overview a:link, #productinfo.overview li.overview a:visited,
#projectinfo.overview li.overview a:link, #projectinfo.overview li.overview a:visited,
#productinfo.detail li.detail a:link, #productinfo.detail li.detail a:visited,
#projectinfo.detail li.detail a:link, #projectinfo.detail li.detail a:visited,
#productinfo.gallery li.gallery a:link, #productinfo.gallery li.gallery a:visited,
#productinfo.support li.support a:link, #productinfo.support li.support a:visited,
#projectinfo.features li.support a:link, #projectinfo.features li.support a:visited
{
	display: block;
	padding: 0px;
	height: 20px;
	color: #000000;
	background: #FFFFFF;
}

.tabcontent {
	border: 1px solid gray;
	border-top: none;
	padding: 10px;
	margin-bottom: 25px;
}