/* 
** banshee -- stylesheet
** 
** July 6, 2010 (version 1.0  Release Candidate 2)
** June 13, 2010 (version 1.0  Release Candidate 1)
** June 8, 2010 (version 0.3)
** May 24, 2010 (version 0.2)
** April 16, 2010 - (version 0.1)
**
** Copyright - Inforonics, LLC - www.inforonics.com
*/
 
/* 
	General settings
	----------------
	All margins, paddings and borders are set here
*/
	
	body,div,p,img,form,h1,h2,h3,h4,h5,h6,ul,li { 
		margin: 0; 
		padding: 0;
	}
	.inline { display: inline; }
	
	.clear { clear: both; }
	.pipe { margin-left: 9px;}
	.indent {
		position:relative;
		left: 130px;
	}
	
	#page{
		margin: auto;
		position:  relative;
	}
	
	/* header */
	#header {
		margin: none;
		}
	#header-logo {
		display: block;
		position: relative;
		}
	
	/* navigation */
	#header-bar {
		margin: auto;
		position: relative;
	}
	
	#header-bar a {
		margin-left: 2px;
		padding-left: 2px;
		padding-right: 2px;
		padding-top: 3px;
		padding-bottom: 3px;
	}
	
	#header-nav { 
		margin: 0;
		position: relative;
		top:  -60px;
		left:  75px;
		padding-bottom: 0px;
		z-index: 20;
		}
	#header-nav ul {
	 	margin: 0;
	 	padding: 0;
		list-style: none;
	  
	}
	#header-nav ul li {
		display: block;
		position: relative;
		float: left;
	}
	#header-nav li ul { 
		display: none; 
	}
	#header-nav ul li a {
		display: block;
		padding-top: 6px;
		padding-right: 15px;
		padding-bottom: 6px;
		padding-left: 15px;
		margin-left: 1px;
		white-space: nowrap;
		z-index: 10;
	}
	#header-nav li:hover ul {
		display: block;
		position: absolute;
		z-index: 10;
	}
	#header-nav li:hover li {
		float: none;
		z-index: 10;
	}
	#header-nav ul ul,
	#header-nav ul li:hover ul ul,
	#header-nav ul ul li:hover ul ul {
		display: none;
	}
	#header-nav ul li:hover ul,
	#header-nav ul ul li:hover ul,
	#header-nav ul ul ul li:hover ul {
		display: block;
	}
	#header-nav li {
		position: relative;
	}
	#header-nav ul ul {
		position: absolute;
		z-index: 20;
	}
	#header-nav ul ul ul {
		top: 0;
		left: 99%;
		z-index: 100;
	}
	#header-stripe {
		margin:  auto;
		position: relative;
		display: block;
		left:  0px;
		top: -55px;
		border-top-style: solid;
		border-bottom-style: solid;
		border-width: 2px;
	}
	
	#breadcrumb {
		margin:  0;
		position: relative;
		top: 5px;
		left: 18px;
	}
	#help-button{
		margin: 0;
		position: relative;
		top: -10px;
		left: 875px;
	}
	
	#help-button a{
		padding: 2px;
		background-origin: padding-box;
		border-radius: 2px;
		border-radius: 2px;
		-moz-border-radius: 2px;
		-webkit-border-radius: 2px;
		-moz-border-radius: 2px;
		-webkit-border-radius: 2px;
	}
	
	#warranty-button{
		margin: 0;
		position: relative;
		width: 15px;
		top: -95px;
		left: 630px;
	}

	#warranty-button a{
		color: #000000; 
		padding: 2px;
		background-origin: padding-box;
		border-radius: 2px;
		border-radius: 2px;
		-moz-border-radius: 2px;
		-webkit-border-radius: 2px;
		-moz-border-radius: 2px;
		-webkit-border-radius: 2px;
	}
	
	
	
	/* jquery image slider */
	#graphic-slider {
		position:relative;
		border-bottom-style: solid;
		border-bottom-width: 2px;
	}
	
	#slider {
		margin:  0;
		z-index: 0;
		position:relative;
	}
	#slider img {
		z-index: 0;
		position:absolute;
		top:0px;
		left:0px;
	}
	
	/* content */
	
	#content { 
		position: relative;
		top: -30px;
		margin: auto; 
		overflow: hidden;
	}
	/*wrap column scheme with this*/
	.column-wrapper {
		position: relative;
		margin: auto;
		overflow: hidden;
	}
	#one-column-full{ 
		float: left;
		margin-top: 15px; 
		margin-left: 15px;
		margin-right: 15px;
		margin-bottom: 15px;
		overflow: hidden;
	}
	#two-column-left{ 
		float: left;
		margin-left: 15px;
		margin-right: 10px;
		margin-top: 15px;
		margin-bottom: 15px;
		overflow: hidden;
	}
	#two-column-right{ 
		float: left; 
		margin-top: 15px;
		margin-bottom: 15px;
		padding-left: 10px; 
		margin-right: 15px; 
		border-left: dashed 1px; 
		overflow: hidden;
	}
	#two-column-wideleft{ 
		float: left;
		position: relative;
		margin-left: 15px;
		margin-right: 10px;
		margin-top: 15px;
		margin-bottom: 15px;
		padding-right: 10px;
		border-right: dashed 1px; 
		overflow: hidden;
	}
	#two-column-smallright{ 
		float: left; 
		position: relative;
		margin-top: 15px;
		margin-bottom: 15px; 
		margin-right: 15px; 
		overflow: hidden;
	}
	#two-column-smallleft{ 
		float: left;
		position: relative;
		margin-left: 15px;
		margin-right: 10px;
		margin-top: 15px;
		margin-bottom: 15px;
		overflow: hidden;
	}
	#two-column-wideright{ 
		float: left;
		position: relative;
		margin-top: 15px;
		margin-bottom: 15px;
		padding-left: 10px; 
		margin-right: 15px; 
		border-left: dashed 1px; 
		overflow: hidden;
	}
	#three-column-left{ 
		float: left;
		position: relative;
		margin-top: 15px;
		margin-bottom: 15px;
		margin-left: 15px;
		margin-right: 10px;
		overflow: hidden;
	}
	#three-column-center{ 
		float: left; 
		position: relative;
		margin-top: 15px; 
		padding-left: 10px;
		margin-right: 10px; 
		margin-bottom: 15px; 
		border-left: dashed 1px; 
		overflow: hidden;
	}
	#three-column-right{
		float: left;
		position: relative;
		margin-top: 15px; 
		padding-left: 10px;
		margin-right: 15px; 
		margin-bottom: 15px; 
		border-left: dashed 1px; 
		overflow: hidden;
	}
	/*front page highlight boxes*/
	#box-container{
		position: relative;
		float:  left;
		margin-top: 10px;
		margin-bottom: 10px;
		margin-left: 15px;
		margin-right:  15px;
	}
	
	.highlight-box{
		position: relative;
		float: left;
		margin-left: 4px;
		margin-right: 4px;
		border-style: solid;
	}
	.box-link{
		position: relative;
		float: left;
		top: 20px;
		left: 0px;
	}
	
	.box-text{
		position: relative;
		list-style: square;
		float: left;
		top: 40px;
		left: 60px;
	}
	
	.box-text li{
		list-style: square;
	}
	
	#infolist-container{
		position: relative;
		margin-top: 5px;
	}
	.infolist-box{
		position: relative;
		float: left;
		margin-top: 10px;
		margin-bottom: 10px;
		margin-left: 10px;
		margin-right: 10px;
		list-style: none;
	}
	.infolist-box-text{
		position: relative;
		left: 18px;
	}
	
	.infolist-box-text li{
		list-style: square;
	}
	.square-bullets{
		display: block;
		position: relative;
		left: 18px;
		list-style: square;
	}
	 
	.image-border{
		border-style: solid;
		border-width: 2px;
		border-color: #2e3436;
	}
	.image-border-right{
		float: right;
		border-style: solid;
		border-width: 2px;
		border-color: #2e3436;
	}
	.image-border-left{
		float: left;
		margin-right: 15px;
		border-style: solid;
		border-width: 2px;
		border-color: #2e3436;
	}
 
	/* footer */
	#footer { 
		margin: auto;
		display: block;
		border-top-style: solid;
		}
	
	#footer-copyright { 
		float:left;	
		padding-left: 25px; 
		position: relative;
		top: 10px;
	}
	#footer-copyright .pipe { margin-left: 3px; margin-right: 3px; }
	#footer-copyright a { margin-right: 3px; }
	#footer-logos {
		float: left;
		position: relative;
		top: -5px;
	}
 
 
/* 
	Sizes
	-----
	All widths, heights and other sizes are set here
*/  
  	/* basics */
  	html,body{
  		height: 100%;
  	}
	#page {
		width:  980px;
		min-height: 100%;
	}
	
	/* header */
	#header { width: 980px; height: 162px; }
	#header-bar { height:  15px; }
	#header-logo {height: 120px; }
	#header-nav { height: 30px; width: 880px;}
	#header-stripe { width: 980px; height: 25px; }
	#breadcrumb {
		width: 800px;
		height: 15px;
	}
	#help-button { width: 100px; height: 15px; }
	
	/*jquery image slider*/
	#graphic-slider { width: 980px; height: 230px; }
		
	/* content */
	#content { 
		width: 980px; 
		min-height:300px; 
		height:auto !important;
		height:700px;
	}
	#content-highlight { width: 300px; height: 200px; }
	#content-text { width: 980px; }
	#content-text-bottom { width: 875px; }
	#one-column-full{ width: 950px; }
	#two-column-left{ width:465px; }
	#two-column-right{ width: 464px;  }
	#two-column-wideleft{ width:664px; }
	.wideleft {
		max-width: 650px;
	}
	.split {
		max-width: 450px;
	}
	#two-column-smallright{ width: 264px;  }
	#two-column-smallleft{ width:265px; }
	#two-column-wideright{ width: 664px;  }
	#three-column-left{ width:303px; }
	#three-column-center{ width: 302px;	}
	#three-column-right{ width: 302px; }
	/*highlight boxes*/
	#box-container { width: 950px; height: 240px; }
	.highlight-box { width: 300px; height: 230px; }
	.box-link {
		width: 300px;
		height: 60px;
	}
	/*info boxes*/
	#infolist-container { width: 640px; height: 225px; }
	.infolist-box {
		width: 300px;
	}
	/* footer */
	#footer { width: 980px; height: 440px; }
	
/* 
	Colors / Backgrounds
	-----
	All colors for individual components are set here
*/  
  	/* basics */
	body { 
		background-position: center;
		background-color: #d3d7cf;
		color: #2e3436; 
	}
	a { color: #3465a4;}
	h1 {
		color:  #2e3436;
	}
	h2 { color: #2e3436; }
	h3 { color: #2e3436; }
	.pipe { color: #CCC; }
 	.red { color: #e61e2b; }
 	.gold { color: #d79d00; }
 	.green { color: #006633; }
 	.blue { color: #1c5288; }
 	
 	#page { 
 		background-color: #FFF; 
 	}
 	
	/* header */
	#header {
		background-color: #3465a4;
		}
	#header-logo {
		background-image: url(../images/inforonics.png);
		background-repeat: no-repeat;
	}
	/* navigation */
	#header-bar {
		background-color: #2e3436;
	}
	
	#header-bar a {
		color:  #FFF;
	}
	
	#header-bar a:hover{
		color: #FFF;
	}
	
	#header-nav { 
		color: #FFF; 
	}
	#header-nav a { color: #FFF; }
	#header-nav a:hover { color: #ffba00; }
	#header-nav ul li a {
	  color: #fff;
	  border-top-color: #fff;

	}
	#header-nav ul li a:hover { 
		color: #ffba00; 
	}
	#header-nav ul ul li:hover > a{ 
		background-color: #195e99;
		color: #ffba00; 
	}
	#header-nav ul li:hover > a{ 
		color: #ffba00; 
	}
	#header-nav li:hover a { 
		background: #1c5288;
		}
	#header-nav li:hover li a:hover { color: #ffba00; }
	#header-stripe {
		background-color: #2e3436;
		border-color: #2e3436;
	}
	#breadcrumb, #breadcrumb a { 
		color: #fff; 
	}
	#help-button a{
		color: #3465a4;
		background-color: #fff;
	}
	#help-button a:hover{
		color: #fff;
		background-color: #3465a4;
	}
	
	/*jquery image slider*/
	#graphic-slider {
		border-color: #2e3446;
	}
	
	/* content */
	#content { 
		color:  #2e3436;
		background-color: #FFFFFF;
		}
	#content-box { color: #333333; background: #EAF2F9; }
	#two-column-right { border-left-color:#DDDDDD;  }
	#two-column-wideleft { border-color:#DDDDDD;  }
	#two-column-smallright { border-color:#DDDDDD;  }
	#three-column-center { border-color:#DDDDDD;  }
	#three-column-right { border-color:#DDDDDD; }
	
	/*highlight boxes*/
	.highlight-box{
		border-color: #2e3436;
	}
	#getaware-box {
		background-image: url(../images/getaware_box.jpg);
		background-repeat: no-repeat;
	}
	#getcontrol-box {
		background-image: url(../images/getcontrol_box.jpg);
		background-repeat: no-repeat;
	}
	#getresults-box {
		background-image: url(../images/getresults_box.jpg);
		background-repeat: no-repeat;
	}
	.infolist-box a{
		color: #2e3436;
	}
	.infolist-box-text li a{
		color: #1c5288;
	}
	/* footer */
	#footer { 
		background-color: #FFFFFF;
		border-color: #2e3436;
		}
	
/* 
	Fonts
	-----
	Font families and sizes are defined below.
 
  	/* basics */
	body { font-family: arial,helvetica,lucida,verdana,sans-serif; font-size: 12px; }
	a { text-decoration: none; }
	a:hover { text-decoration: underline; }
	h1 { font-size: 25px; font-weight: normal; font-family: lucida,helvetica,verdana,sans-serif;}
	h2 { font-size: 19px; font-weight: normal; font-family: lucida,helvetica,verdana,sans-serif;}
	h3 { font-size: 16px; font-weight: normal; font-family: lucida,helvetica,verdana,sans-serif;}
	h4 { font-size: 15px; font-weight: bold; }
	h5 { font-size: 12px; font-weight: normal; }
	h6 { font-size: 10px; font-weight: normal; }
	h7 { font-size: 8px; font-weight: normal; }
	h9 { font-size: 8px; font-weight: normal; }
	i { font-style: italic; }
	p.italic { font-style: italic; }
	b { font-weight: bold; }
	p.bold { font-weight: bold; }
	p.small { line-height: 25%; }
	p.big { line-height: 150%; }
	.bold-italic {
		font-weight:600;
		font-style: italic;
	}
	h7 {
		disply: inline;
		font-weight:600;
		font-style: italic;
	}
	h8 {
		font-weight:bold;
	}
	
	/* header */
	#header-bar a {
		font-size: 10px;
		letter-spacing: 0px;
		font-family: helvetica,lucida,verdana,sans-serif;
		}
	#header-bar a:hover {
		font-size: 10px;
		font-family: helvetica,lucida,verdana,sans-serif;
		}
	#header-nav a {
		font-size: 15px;
		font-family: lucida,verdana,sans-serif;
		font-weight: normal;
		}
 	#header-nav a:hover {
		font-size: 15px;
		font-family: lucida,verdana,sans-serif;
		font-weight: normal;
		}
	#header-nav ul {
	  font-family: Arial, Verdana;
	  font-size: 14px;
	}
	#header-nav ul li a {
	  text-decoration: none;
	}
	#header-nav li:hover li {
	  font-size: 11px;
	}
	#breadcrumb { font-family: lucida,verdana,sans-serif; font-size: 12px; font-style:normal;}
	#help-button a { font-family: lucida,verdana,sans-serif; font-size: 12px; font-style:normal; font-weight: bold;}
		
	/* content */
	#content-box { font-family: helvetica,lucida,verdana,sans-serif; font-size: 14px; font-style:italic}
	#one-column-full { font-family: lucida,verdana,sans-serif; font-size: 15px; }
	#two-column-left { font-family: lucida,verdana,sans-serif; font-size: 14px; }
	#two-column-right { font-family: lucida,verdana,sans-serif; font-size: 14px; }
	#two-column-wideleft { font-family: lucida,verdana,sans-serif; font-size: 14px; }
	#two-column-smallright { font-family: lucida,verdana,sans-serif; font-size: 12px; }
	#two-column-smallleft { font-family: lucida,verdana,sans-serif; font-size: 14px; }
	#two-column-wideright { font-family: lucida,verdana,sans-serif; font-size: 14px; }
	#three-column-left { font-family: lucida,verdana,sans-serif; font-size: 14px; }
	#three-column-center { font-family: lucida,verdana,sans-serif; font-size: 14px; }
	#three-column-right { font-family: lucida,verdana,sans-serif; font-size: 14px; }
	/*highlight boxes*/
	.box-text { font-family: lucida,lucidia, verdana,sans-serif; font-size: 13px; } 
	/*info boxes*/
	.infolist-box a{ font-family: arial,lucida,helvetica,verdana,sans-serif; font-size: 14px; font-weight: bold; }
	.infolist-box-text a{ font-family: lucida,verdana,sans-serif; font-size: 12px; font-weight: normal;} 
	.infolist-box-text { font-family: lucida,verdana,sans-serif; font-size: 12px; font-weight: normal;} 
	/* footer */
	#footer-copyright { font-family: lucida,helvetica,verdana,sans-serif; font-size: 12px; }
	
	
/* Contact Form */

	#contact-area {
		width: 730px;
		min-height: 350px; 
		margin-top: 25px;
	}
	
	#contact-area input, #contact-area textarea {
		padding: 5px;
		width: 300px;
		font-family: helvetica, sans-serif;
		font-size: 13px;
		margin: 0px 0px 10px 0px;
		border: 1px solid #ccc;
	}
	
	#contact-area textarea {
		height: 50px;
	}
	
	#contact-area textarea:focus, #contact-area input:focus {
		border: 1px solid #900;
	}
	
	#contact-area input.submit-button {
		width: 100px;
		background-color: #1c5288;
		color: #fff;
		font-size: 14px;
		float: right;
		position: relative;
		top: -25px;
		left: -100px;
	}
	
	label {
		float: left;
		text-align: right;
		margin-right: 15px;
		width: 290px;
		padding-top: 5px;
		font-size: 14px;
	}


	#assessment-form{
 		background-image: url(../images/assessment.png);
 		background-repeat: no-repeat;
 		background-position: 8px 8px;
 		border-style: solid;
 		border-width: 2px;
 		border-color: #2e3436;
 		background-color: #1c5288;
 		border-radius: 8px;
 		width: 260px;
 		height: 180px;
 	}
 	
 	#assessment-form p{
		position: absolute;
		left: 100px;
		top: 10px;
		color: #fff;
		font-size: 14px;
 	}
 	
 	#assessment-form form {
 		margin: auto;
 		position: relative;
 		top: 50px;
 		width: 240px;
 		height: 110px;
 		background-color: #fff;
 		border-radius: 10px;
 		padding: 5px;
 	}
 	
 	#assessment-form-tag{
 		position: absolute;
 		left: 50px;
 		top: 106px;
 		font-size: 10px;
 	}
 	
 	#assessment-form-note{
 		position: relative;
 		left: 60px;
 		font-size: 10px;
 	}
 	
 	#assessment-form input{
 		padding: 2px;
 		width: 150px;
 		font-family: helvetica, sans-serif;
 		font-size: 10px;
 		margin: 0px 0px 2px 0px;
 		border: 1px solid #ccc;
 	}
 	
 	#assessment-form input:focus {
 		border: 1px solid #900;
 	}
 	
 	#assessment-form input.submit-button {
 		width: 80px;
 		background-color: #1c5288;
 		border-radius: 15px;
 		color: #fff;
 		font-size: 10px;
 		float: right;
 		position: absolute;
 		top: 84px;
 		left: 120px;
 	}
 	
 	#assessment-form input.submit-button:hover {
 		background-color: #fff;
 		color: #1c5288;
 		font-weight: bold;
 		border-color: #1c5288;
 	}
 	
 	#assessment-form label {
 		float: left;
 		text-align: right;
 		margin-right: 15px;
 		width: 60px;
 		padding-top: 2px;
 		font-size: 10px;
 	}