@charset "UTF-8";
/* CSS Document */

/* Added behavior (hover.htc) for BugFix IE6 so it recognizes :hover, also an element class .hover has to be defined in the styles where the :hover actually takes place */
.navbar {
	width: 110px;
	bottom: 0px;
	float: left;
	height: 100px;
	behavior: url("/htc/hover.htc");
}
div.navbar:hover ul.submenu, div.navbar.hover ul.submenu {
	/*	visibility: visible; */
	display:block;
}

a.navbar-main {
	display: block;
	width: 110px;
	height: 100px;
}

/* BugFix for IE6 so it recognizes :hover, also a class.hover has to be defined */
#navbar-products  {
	background: url(/images/products_1.png) no-repeat 0 0;
	behavior: url("/htc/hover.htc");
}
#navbar-iphone {
	background: url(/images/iphone_1.png) no-repeat 0 0;
	behavior: url("/htc/hover.htc");
}
#navbar-services {
	background: url(/images/services_1.png) no-repeat 0 0;
	behavior: url("/htc/hover.htc");
}
#navbar-partners {
	background: url(/images/partners_1.png) no-repeat 0 0;
	behavior: url("/htc/hover.htc");
}
#navbar-contact, #navbar-contact#current {
	background: url(/images/contact_1.png) no-repeat 0 0;
	behavior: url("/htc/hover.htc");
}
#navbar-about {
	background: url(/images/about_1.png) no-repeat 0 0;
	behavior: url("/htc/hover.htc");
}
#navbar-news {
	background: url(/images/news_1.png) no-repeat 0 0;
	behavior: url("/htc/hover.htc");
}


/* visibility hidden so you don't see it initially only after :hover. position absolute so the items come on top of the rest in combination with z-index: 200. Margin-top 100px for ul to display below the .navbar divisions */
.navbar ul {
	list-style-type: none;
	/*	visibility: hidden; */
	display: none;
/*	background:url(/images/subnav_back.png) repeat; */
	background-color: #000;
	margin: -1px 0px 0px 0px;
	position: absolute;
	z-index: 200;
/*	border-bottom: 1px solid #2E2E2E; */
	border-bottom: 4px solid #FFF; 
}

/* Extra definition for IE6 to work. UL tags get a class called submenu in html */
ul.submenu {
	display: none;
	padding: 0px;
}

/* Extra definition for IE6 to work. -> Remove the gap between the li's in IE6 */

ul.submenu li {
	display: inline;
}

/* Set display to block so the a tag (for the link) inherits the width an or height form the .navbar ul a element. */
.navbar ul a, .navbar ul a:visited {
	color:#999;
	text-decoration: none;
	padding:10px 5px 10px 15px;
	width:150px;
	font-family: "Tahoma";
	font-size: 9px;
	letter-spacing: 1px;
	border-color: #2E2E2E;
	border-width: 1px 1px 0px 1px;
	border-style: solid;
	text-transform: uppercase;
	display: block;
}

.navbar ul a:hover {
	color:#FFF;
	background-color:#1C1C1C;
/*	border-color: #2E2E2E;
	border-width: 1px 1px 0px 1px;
	border-style: solid; */
}


/* BugFix for IE6  an element class .hover has to be defined for all :hovers ne link-elements */
#navbar-products:hover, #navbar-products.hover, #navbar-products.current:hover, #navbar-products.current.hover   {
	background: url(/images/products_1.png) no-repeat 0 -100px;
}

#navbar-iphone:hover, #navbar-iphone.hover, #navbar-iphone.current:hover, #navbar-iphone.current.hover  {
	background: url(/images/iphone_1.png) no-repeat 0 -100px;
}

#navbar-services:hover, #navbar-services.hover, #navbar-services.current:hover, #navbar-services.current.hover  {
	background: url(/images/services_1.png) no-repeat 0 -100px;
}

#navbar-partners:hover, #navbar-partners.hover, #navbar-partners.current:hover, #navbar-partners.current.hover   {
	background: url(/images/partners_1.png) no-repeat 0 -100px;
}

#navbar-contact:hover, #navbar-contact.hover, #navbar-contact.current:hover, #navbar-contact.current.hover  {
	background: url(/images/contact_1.png) no-repeat 0 -100px;
}

#navbar-about:hover, #navbar-about.hover, #navbar-about.current:hover, #navbar-about.current.hover   {
	background: url(/images/about_1.png) no-repeat 0 -100px;
}

#navbar-news:hover, #navbar-news.hover, #navbar-news.current:hover, #navbar-news.current.hover   {
	background: url(/images/news_1.png) no-repeat 0 -100px;
}

/* In case the primairy menu item pages are selected the class current is defined for the navigation menu */
#navbar-products.current {
	background-position: 0 -200px;
}

#navbar-iphone.current {
	background-position: 0 -200px;
}

#navbar-services.current {
	background-position: 0 -200px;
}

#navbar-partners.current {
	background-position: 0 -200px;
}

#navbar-contact.current {
	background-position: 0 -200px;
}

#navbar-about.current {
	background-position: 0 -200px;
}

#navbar-news.current {
	background-position: 0 -200px;
}