@charset "utf-8";
/* MAVEN Master Stylesheet */
/* Tom Parker */
/* July 2008 */

@import url("reset.css");

/*-------------------------------------------------------------------------LAYOUT*/

body {
	background:					#040404;
	font:								normal 62.5% Helvetica, Arial, sans-serif;
}

a.skip{
	display:							none;
}

/*-------------------------------------------------------------------------WRAP*/

div#container{
	float:								left;
	background:					#040404 url("../img/bg.jpg") center top no-repeat;
	width: 								100%;
	text-align: 						center;
}

div#wrap{
	position:							relative;
	width:								900px;
	margin:							0 auto;
	text-align: 						left;
}

div#wrap ul#image_rotate{
	height:								443px;
	overflow:							hidden;
}

/*-------------------------------------------------------------------------HEADER*/

div#header{
	float:								left;
	position:							absolute;
	z-index:							10;
	top:								0px;
	left:								0px;
	width:								900px;
	height:								443px;
	overflow:							hidden;
}

ul#image_rotate{
	float:								left;
	width:								900px;
	height:								443px;
}

div#header embed, div#header object{
	position:							absolute;
}

div#headerText{
	float:								left;
	position:							absolute;
	z-index:							9000;
	bottom:								0;
	margin-top:							210px;
	padding-bottom:						20px;
	width:								900px;
	background:							url('../img/headertext_bg.png') top left no-repeat;
}

div#headerText h2{
	float:								left;
	width:								530px;
	display:							inline;
	font-size:							2.4em;
	font-weight:						normal;
	color:								#FFF;
	margin:								25px 0 12px 20px;
}

div#headerText p.strapLine{
	float:								left;
	display:							inline;
	width:								450px;
	font-size:							1.4em;
	line-height:						1.4em;
	color:								#FFF;
	margin-left:						20px;
}

div#headerText h5{
	float:								left;
	display:							inline;
	width:								450px;
	font-size:							1.4em;
	line-height:						1.4em;
	color:								#FFF;
	margin-left:						20px;
}

div#headerText p.phoneContact {
	float:								right;
	font-size:							2.4em;
	color:								#808080;
}

div#headerText a#mailto {
	float:								right;
	position:							relative;
	color:								#808080;
	text-decoration:					none;
	font-size:							2.2em;
	cursor:								pointer;
}

div#headerText a#mailto:hover{
	color:								#FF0000;
}

div#headerTextContact{
	float:								right;
	display:							inline;
	width:								190px;
	margin:								105px 30px 0 0;
}

/*-------------------------------------------------------------------------SUBHEAD*/

div#subHead{
	float:								left;
	position: 							absolute;
	z-index:							8000;
	width:								900px;
	height:								50px;
	color:								#FFF;
}

div#subHead img{
	float:								left;
	width:								900px;
	height:								50px;
	position:							absolute;
}
/*-------------------------------------------------------------------------NAV*/

div#nav{
	float:								left;
	width:								900px;
	font-size:							1.1em;
}
div#nav ul#navul
{
	float:								left;
	width:								900px;

}
div#nav ul#navul li{
	float:								left;
	display:							inline;
	position:							relative;
	z-index:							99;
}

div#nav ul#navul li a{
	text-indent:						-9999px;
}

div#nav ul#navul li ul{
	float:								left;
	width:								150px;
	position: 							absolute;
	top: 								31px;
	left: 								0;
	clear:								left;
	background:							#1F1E1E;
}

div#nav ul#navul li ul li {
	
}

div#nav span.darkArrow{
	color:							#FF0000;	
}

div#nav ul#navul li li:hover ul,
div#nav ul#navul li li.sfHover ul
{
  top:              0;
  left:             150px;
}

div#nav ul#navul li ul li a{
	display:							block;
	width:							140px;
	float:								left;
	color:							#CCC;
	text-decoration:				none;
	padding:							5px;
}

ul#navul li:hover, ul#navul li.sfHover, ul#navul li ul a, ul#navul li ul li.sfHover ul a, ul#navul li ul li li.sfHover ul a, ul#navul a:hover
{
  background-color: #1F1E1E;
}

ul#navul li ul a:hover, ul#navul li ul li.sfHover a, ul#navul li ul li li.sfHover a, ul#navul li ul li.sfHover ul a:hover
{
  background-color: #3a3a3a;
}

div#nav ul#navul li ul, div#nav ul#navul li ul li ul {
	display:							none;
}

div#nav ul#navul li ul li{
	clear:							left;
}

div#nav ul#navul li ul li a{
	text-indent:					0px;
}

div#nav ul#navul li a{
	float:								left;
	display:							block;
	padding:							8px 0 9px 0;
}

div#nav ul#navul li:hover ul{
	display:							block;
}

div#nav ul#navul li ul li ul {
	visibility:						hidden;
}

div#nav ul#navul li ul li:hover ul {
	visibility:						visible;
}

div#nav ul#navul li a.home{
	background:					url('../img/navbuttons/nav_home.gif') left top no-repeat;
	width:								109px;
	height:							14px;
}

div#nav ul#navul li a.services{
	background:					url('../img/navbuttons/nav_services.gif') left top no-repeat;
	width:								117px;
	height:							14px;
}

div#nav ul#navul li a.showcase{
	background:					url('../img/navbuttons/nav_showcase.gif') left top no-repeat;
	width:								134px;
	height:							14px;
}

div#nav ul#navul li a.products{
	background:					url('../img/navbuttons/nav_products.gif') left top no-repeat;
	width:								133px;
	height:							14px;
}

div#nav ul#navul li a.aboutUs{
	background:					url('../img/navbuttons/nav_aboutus.gif') left top no-repeat;
	width:								134px;
	height:							14px;
}

div#nav ul#navul li a.news{
	background:					url('../img/navbuttons/nav_news.gif') left top no-repeat;
	width:								117px;
	height:							14px;
}	

div#nav ul#navul li a.contactUs{
	background:					url('../img/navbuttons/nav_contactus.gif') left top no-repeat;
	width:								156px;
	height:							14px;
}

body#home ul#navul li a.home,
div#nav ul#navul li a.home:hover,
body#services ul#navul li a.services,
div#nav ul#navul li a.services:hover,
body#showcase ul#navul li a.showcase,
div#nav ul#navul li a.showcase:hover,
body#products ul#navul li a.products,
div#nav ul#navul li a.products:hover,
body#aboutUs ul#navul li a.aboutUs,
div#nav ul#navul li a.aboutUs:hover,
body#news ul#navul li a.news,
div#nav ul#navul li a.news:hover,
body#contactUs ul#navul li a.contactUs,
div#nav ul#navul li a.contactUs:hover{
	background-position:		0 -31px;
}

/*-------------------------------------------------------------------------CONTENTWRAP*/

div#contentWrap{
	float:								left;
	width:								900px;
	margin-top:						25px;
	margin-bottom:				2px;
}

/*-------------------------------------------------------------------------CONTENT*/

div#content{
	float:								left;
	width:								428px;
	background:					#010101;
	min-height:						440px;
	margin-left:					20px !important;
	margin-left:					10px;
}

div#content h3{
	float:								left;
	padding:							33px 0 0 0px;
	font-size:							1.6em;
	font-weight:					normal;
	color:								#FFF;
	width:							300px;
}

div#content span#imagesarrow{
	float:								left;
	display:							inline;
	height:							15px;
	width:							50px;
	margin:							35px 50px 0 0;
}

div#content span#imagesarrow a{
	float:								left;
	height:							15px;
	display:							inline;
	color:							#808080;
	font-size:						1.2em;
	padding:							0 15px 0 0;
	background:					url('../img/imagesdown.gif') right top no-repeat;
}

div#content div#imgs {
	width:							390px;
	float:								left;
}

div#content span#imagesarrow a:hover{
	color:							#FF0000;
	background-position:		right -15px;
}

div#content ul {
	float:							left;
	color:							#808080;
	padding-left:					20px;
	list-style-type:				disc;
	font-size:						1.2em;
}

div#content ul#siteMap {
	float:								left;
	width:							400px;
}

div#content ul#siteMap li{
	float:								left;
	clear:							left;
	width:							300px;
}

div#content ul#siteMap li a{
	color:							#CCC;
}

div#content ul#siteMap li a:hover{
	color:							#FF0000;
}

div#content ul#siteMap li ul{
	margin-left:					30px;
}


div#content ul#siteMap li ul li{
	margin-bottom:				0px;
}

div#content ul#siteMap li ul li a{
	padding-bottom:				10px;
	color:							#808080;
}

div#content ul#siteMap li ul li ul li a{
	color:							#4e4e4e;
}

div#content p#lead{
	float:								left;
	clear:								left;
	padding:							25px 0 0 0px;
	color:								#808080;
	font-size:							1.4em;
	line-height:						1.6em;
	width:								355px;
	margin-right:						40px;
}

div#content p{
	float:								left;
	width:								414px;
	w\idth:								409px;
	padding:							25px 19px 20px 0px;
	font-size:							1.2em;
	line-height:						1.4em;
	color:								#808080;
}

div#content p.tip{
	float:								left;
	font-size:						1em;
	color:							#313131;
	padding:							0px 19px 10px 0;
}

div#content p.testimonialp{
	line-height:						1.4em;
	padding-bottom:				15px;
}

div#content p.good{
	color:								#36e400;
}

div#content p.bad{
	color:								#FF0000;
}

div#content p span.heading{
	color:							#CCC;
	padding-bottom:				15px;
}

div#content h3 span.articleDate{
	float:							left;
	clear:							left;
	width:							400px;
	font-size:						0.7em;
	color:							#808080;
}

div#content a{
	float:								left;
	color:								#CCC;
	text-decoration:				none;
	font-size:							1.2em;
	padding-bottom:				20px;
}

div#content p a {
	float:								none;
	display:							inline;
	font-size:							1.1em;
}

div#content a.return{
	clear:							left;
	width:							300px;
}

div#content img{
	float:								left;
	padding:							3px;
	border:							1px solid #181818;
	margin:							10px 18px;
}

div#content img:hover{
	border:							1px solid #FF0000;
}

div#content a:hover{
	color:								#FF0000;
}

div#content a.findOutMore{
	float:								left;
	display:							block;
	width:								380px;	
	height:								10px;
	background:						url('../img/content_findoutmorearrow.gif') right top no-repeat;
	color:								#808080;
	text-decoration:					none;
	font-size:							1.2em;
	padding:								0 0 0 0px;
}

div#content a.findOutMore:hover{
	background-position:		right -13px;
	color:								#FF0000;
}

div#content div.serviceBox{
	float:								left;
	margin:							20px 0 30px 0;
	width:								381px;
}

div#content div.serviceBox h4{
	color:								#FFF;
	display:							block;
	margin-bottom:				10px;
	font-size:							1.4em;
	font-weight:					normal;
}

div#content div.serviceBox img{
	float:								right;
	padding:							3px;
	border:							1px solid #181818;
	margin:							0;
}

div#content div.serviceBox img:hover{
	border:							1px solid #FF0000;
}

div#content div.serviceBox p{
	float:								left;
	width:								310px;
	padding:							0 0 15px 0;
	margin-right:					5px;
}

div#content div.serviceBox a.lightbox-enabled, div#content div.serviceBox a.inlineImage{
	float:								right;
	width:							60px;
	
}

div#content div.video{
	float:								left;
	margin-bottom:				10px;
}


div#content p span.lquote
{
	display:				block;
	width:					21px;
	height:					19px;
	float:					left;
	margin:					0 10px 0 0;
	text-indent:			-9999px;
	background:				url("../img/leftquote.gif") no-repeat;
}
div#content p a.rquote
{
	float:						none;
	white-space:			nowrap;
	display:				inline;
	padding:				0 0 5px 0;
	margin:					0 0 0 8px;
	background:				url("../img/rightquote.gif") no-repeat;
}
div#content p a.rquote:hover
{
	text-decoration:		none;
}

div#content p.client{
	font-size:						1.1em;
	display:							block;
	float:								left;
	width:							380px;
	text-align:						right;
	padding:							0px;
	margin:							0 0px 20px 0;
}

div#content div.serviceBox p.newsDate{
	float:								left;
	display:							block;
	width:							380px;
	padding-bottom:				0px;
	font-size:						1.1em;
	color:							#373737;
}

div#content p.article {
	padding-top:					0px;

}

div#content p.terms {
	padding-top:					0px;
	padding-bottom:				0px;
}

div#content a.termlink{
	float:									none;
	padding:								0px;
}

div#content fieldset legend{
	display: 								none;
}

div#content fieldset.makeChanges{
	margin-bottom:					10px;
}

div#content form{
	float:									left;
	clear:								left;
	margin:								0 0 20px 0;
	width:								405px;
}

div#content fieldset#main{
	margin-top:						10px;
}

div#content fieldset ol li{
	float:									left;
	clear:								left;
}

div#content fieldset ol li.warning textarea{
	border:								2px solid #FF0000;
}


div#content fieldset ol li.warning input{
	border:								2px solid #FF0000 !important;
}

div#content fieldset label{
	float:									left;
	width:									390px;
	font-size:								1.3em;
	font-weight:						bold;
	color:									#808080;
	padding:								3px 10px 3px 0;
	margin-bottom:					6px;
}

div#content fieldset input{
	float:									left;
	width:								400px;
	font-size:							1.3em;
	color:								#CCC;
	background:						#0f0f0f !important;
	padding:								2px 1px;
	margin-bottom:					14px;
	border:								2px solid #383838 !important;
}
div#content fieldset ol li textarea{
	float:									left;
	width:								400px;
	font-size:							1.3em;
	font-family:						Helvetica, Arial, sans-serif;
	color:								#CCC;
	background:						#0f0f0f;
	padding:								2px 1px;
	margin-bottom:					10px;
	border:								2px solid #383838;
}

div#content button{
	background:						#383838;
	float:									right;
	color:								#CCC;
	font-size:							1.3em;
	padding:								3px 10px;
	cursor:								pointer;
}

div#content button:hover{
	background:						#CA0000;
}

div#content p#required{
	float:									left;
	width:								100px;
	margin:								0;
	padding:								0;
	color:								#373737;
}

div#content p.contact{
	padding:								0px 19px 10px 0px;
}

div#content p.dent{
	padding:								0px 19px 10px 15px;
	width:								375px;
}	

div#content p.dent a.mailto{
	color:								#808080;
}

div#content p.dent a.mailto:hover{
	color:								#FF0000;
}

div#content p span.whitep{
	color:								#CCC;
	font-size:							1.1em;
}

div#content fieldset li.warning span.warning {
	color:								#FF0000;
	float:									left;
	font-size:							0.9em;
}

div#content dl.list
{
	float:									left;
	display:								inline;
	width:								320px;
	margin:								0 20px 20px 10px;
	}
div#content dl.list dt, div#content dl.list dd
{
	float:									left;
	background:     					transparent url("../img/bullet.gif") 0 3px no-repeat;
	width:								300px;
	margin:								5px 0 0;
	padding:        						0 0 0 20px;
	font-size:							1.2em;
	color:          						#808080;
	}
	
/*-------------------------------------------------------------------------SIDEBAR*/

div#sidebar{
	float:								left;
	width:								300px;
}

div#sidebar div#invisibleAudio{
	float:								right;
	width:								300px;
	height:								268px;
	margin-bottom:				2px;
}

div#sidebar div#invisibleAudio a#invisible{
	float:								left;
	position:							absolute;
	right:								0;
	margin:							233px 0 0;
	width:							300px;
	height:							35px;
	text-indent:					-9999px;
	background:					 url('../img/sidebar_invisibletext.png') top left no-repeat;
}

div#sidebar div#invisibleAudio a#invisible:hover{
	background-position:		0 -35px;
}

div#sidebar div#developers{
	float:								right;
	width:								300px;
	height:								178px;
}

div#sidebar div#developers a#dev{
	float:								left;
	position:							absolute;
	left:								600px;
	margin-top:					143px;
	width:								300px;
	height:								35px;
	text-indent:						-9999px;
	background:					url('../img/sidebar_developerstext.png') top left no-repeat;
}

div#sidebar div#developers a#dev:hover{
	background-position:		0 -35px;
}

/*-------------------------------------------------------------------------HOTLINKS*/

div#hotLinks{
	float:								left;
	width:								152px;
}

div#hotLinks div.related{
	float:								left;
	width:							150px;
	min-height:						65px;
	background:					#181818;
	margin:							0 2px 2px 0;
}

div#hotLinks div.related h3{
	margin:							16px 0 10px 18px;
	font-size:						1.4em;
	font-weight:					normal;
	color: 							#FFF;
	cursor:							pointer;
	width:							100px;
}

div#hotLinks a.hotLink{
	float:								left;
	display:							inline;
	width:								150px;
	min-height:						80px;
	margin:							0 2px 2px 0;
	background:					#0f0f0f;
	text-decoration:				none;
	padding-bottom:				8px;
}

div#hotLinks a.hotLink:hover{
	background:					#181818;
}

div#hotLinks a.hotLink strong{
	float:								left;
	display:							inline;
	width:							130px;
	margin:							16px 0 10px 18px;
	font-size:							1.4em;
	font-weight:					normal;
	color: 								#FFF;
	cursor:								pointer;
	min-height:						30px;
}

div#hotLinks a.hotLink small.findOutMore{
	float:								left;
	display:							inline-block;
	width:								115px;	
	height:								12px;
	margin-left:						18px;
	background:					url('../img/hotlink_hotlinkmorearrow.gif') right top no-repeat;
	color:								#514d49;
	text-decoration:				none;
	font-size:							1.2em;
	cursor:								pointer;
}

div#hotLinks a.hotLink small.findOutMore:hover{
	background-position:		right -13px;
	color:								#FF0000;
}

/*-------------------------------------------------------------------------MANUFACTURERS*/

div#manufacturers{
	float:								left;
}

div#manufacturers ul li{
	display:							inline;
}

div#manufacturers ul li a{
	float:								left;
	display:							block;
	height:								87px;
	width:								148px;
	margin-left:						2px;
	text-indent:						-9999px;
}

div#manufacturers ul li a#loewe{
	background:					url('../img/manufacturers/loewe.gif') left top no-repeat;
	margin:							0;
}

div#manufacturers ul li a#artcoustic{
	background:					url('../img/manufacturers/artcoustic.gif') left top no-repeat;
}

div#manufacturers ul li a#crestron{
	background:					url('../img/manufacturers/crestron.gif') left top no-repeat;
}

div#manufacturers ul li a#kaleidescape{
	background:					url('../img/manufacturers/kaleidescape.gif') left top no-repeat;
}

div#manufacturers ul li a#olutron{
	background:					url('../img/manufacturers/olutron.gif') left top no-repeat;
}

div#manufacturers ul li a#runco{
	background:					url('../img/manufacturers/runco.gif') left top no-repeat;
}

div#manufacturers ul li a#bang{
	background:					url('../img/manufacturers/bang-and-olufsen.gif') left top no-repeat;
}

div#manufacturers ul li a#loewe:hover,
div#manufacturers ul li a#artcoustic:hover,
div#manufacturers ul li a#crestron:hover,
div#manufacturers ul li a#kaleidescape:hover,
div#manufacturers ul li a#olutron:hover,
div#manufacturers ul li a#runco:hover,
div#manufacturers ul li a#bang:hover{
	background-position:		0 -87px;
}
/*-------------------------------------------------------------------------FOOTER*/

div#footer{
	float:								left;
	width:								900px;
	background:					#070707;
	margin:							2px -3px 0 0;
}

div#footer span.hidden{
	display:								none;
}

div#footer p{
	float:								left;
	margin:							12px 5px 0 20px;
	display:							inline;
	color:								#747474;
	font-size:							1em
}

div#footer p.address {
	float:							left;
	clear:						left;
	margin:						2px 5px 12px 20px;
	width:						400px;
}

div#footer p.credit{
	clear: left;
	margin-top: 0;
}

div#footer p span{
	color:								#FFF;
}

div#footer p a.mailto{
	color:								#FFF;
	text-decoration:				none;
}

div#footer p a.mailto:hover{
	color:								#FF0000;
	text-decoration:				underline;
}

div#footer ul{
	float:								left;
	margin-top:						12px;
}

div#footer ul li{
	display:							inline;
	color:								#747474;
}

div#footer ul li a, div#footer p.credit a{
	color:								#747474;
	text-decoration:				none;
}

div#footer ul li a:hover, div#footer p.credit a:hover{
	color:								#FF0000;
	text-decoration:				underline;	
}

div#credit a{
	float:								right;
	background: 					url("../img/sitebydusza.gif") top right no-repeat;
	width:								90px;
	height:								40px;
	text-indent:						-9999px;
	margin-bottom:				20px;
	cursor:								pointer;
}

div#credit a:hover{
	background-position: 		0 -40px;
}