@charset "UTF-8";

/* ===== colors ================================================== */

.error,
.formfieldRedBold {
	font-weight: bold;
	color: #B00;
}

/* ===== base ================================================== */

html,
body {
	background-color: #393939;
	margin: 0;
	padding: 0;
	font: normal 12px Arial, Helvetica, sans-serif;
	color: #CCC;
	text-align: center;
}

a img { border: none; }

a {
	color: #C00;
	outline: none;
}

a:hover { color: #333; }

em,
strong { color: #C00; }

h3,
h4,
h5 { color: #333; }

h2 {
	font: normal 18px Georgia, "Times New Roman", Times, serif;
	text-transform: uppercase;
	color: #555;
}

h3 { font-size: 16px; }

h4 { font-size: 14px; }

h5 { font-size: 12px; }

/* ===== containers ================================================== */

#container {
	position: relative;
	width: 970px;
	margin: 20px auto;
	text-align: left;
}

#containerA {
	border: 8px solid #666;
	padding: 7px 7px 0;
}

#container1 {
	background: #474747 url('../images/header_bg.gif') no-repeat left top;
	height: 90px;
}

#container2 { padding-top: 7px; }

#container3 { height: 47px; }

#container4 {
	background-color: #202020;
	color: #999;
	height: 110px;
}

/* ===== header ================================================== */

#header h1 a {
	display: block;
	width: 318px;
	height: 90px;
	float: left;
}

/* ===== nav ================================================== */

#nav ul li { float: left; }

#nav ul li a {
	display: block;
	background: transparent url('../images/nav_matrix.gif') no-repeat left top;
	height: 90px;
}
/*
#nav ul li a.nav1 {
	background-position: left top;
	width: 124px;
}

#nav ul li a.nav2 {
	background-position: -124px top;
	width: 137px;
}

#nav ul li a.nav4 {
	background-position: -261px top;
	width: 184px;
}

#nav ul li a.nav5 {
	background-position: -445px top;
	width: 127px;
}

#nav ul li a.nav1:hover,
#nav ul li.on a.nav1 { background-position: left bottom; }

#nav ul li a.nav2:hover,
#nav ul li.on a.nav2 { background-position: -124px bottom; }

#nav ul li a.nav4:hover,
#nav ul li.on a.nav4 { background-position: -261px bottom; }

#nav ul li a.nav5:hover,
#nav ul li.on a.nav5 { background-position: -445px bottom; }
*/


#nav ul li a.nav1 {
	background-position: left top;
	width: 97px;
}

#nav ul li a.nav2 {
	background-position: -97px top;
	width: 112px;
}

#nav ul li a.nav3 {
	background-position: -209px top;
	width: 106px;
}

#nav ul li a.nav4 {
	background-position: -315px top;
	width: 158px;
}

#nav ul li a.nav5 {
	background-position: -473px top;
	width: 98px;
}

#nav ul li a.nav1:hover,
#nav ul li.on a.nav1 { background-position: left bottom; }

#nav ul li a.nav2:hover,
#nav ul li.on a.nav2 { background-position: -97px bottom; }

#nav ul li a.nav3:hover,
#nav ul li.on a.nav3 { background-position: -209px bottom; }

#nav ul li a.nav4:hover,
#nav ul li.on a.nav4 { background-position: -315px bottom; }

#nav ul li a.nav5:hover,
#nav ul li.on a.nav5 { background-position: -473px bottom; }



/* ===== index ================================================== */

#index {
	background-color: #FFF;
	color: #000;
}

.indexHtml {
	background: transparent url('../images/indexHtml_matrix.jpg') no-repeat left top;
	width: 466px;
	height: 260px;
	border-right: 8px solid #393939;
	float: left;
}

.indexHtml ul li a {
	display: block;
	height: 20px;
	margin-bottom: 1px;
}

#indexHtml_commercial { background-position: left -260px; }

#indexHtml_recodable { background-position: left bottom; }

a#btn_seeVideoToLearnMore {
	display: block;
	width: 130px;
	height: 30px;
	margin: 140px auto 0;
}

#indexFlash {
	background: transparent url('../images/altimg.png') no-repeat left top;
	width: 466px;
	height: 260px;
	float: left;
}

/* ===== content ================================================== */

#content {
	background-color: #FFF;
	font: normal 12px "Myriad Pro", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;
	color: #000;
}

/* ===== selector ================================================== */

#selector ul li,
#selector ul li a {
	display: block;
	background: transparent url('../images/selector_matrix.gif') no-repeat left top;
	width: 235px;
	height: 50px;
	float: left;
}

#selector ul li#selector1,
#selector ul li#selector1 a { background-position: left top; }

#selector ul li#selector2,
#selector ul li#selector2 a { background-position: -235px top; }

#selector ul li#selector3,
#selector ul li#selector3 a { background-position: -470px top; }

#selector ul li#selector4,
#selector ul li#selector4 a { background-position: -705px top; }

#selector ul li#selector1 a:hover { background-position: left -50px; }

#selector ul li#selector2 a:hover { background-position: -235px -50px; }

#selector ul li#selector3 a:hover { background-position: -470px -50px; }

#selector ul li#selector1.on,
#selector ul li#selector1.on a { background-position: left bottom; }

#selector ul li#selector2.on,
#selector ul li#selector2.on a { background-position: -235px bottom; }

#selector ul li#selector3.on,
#selector ul li#selector3.on a { background-position: -470px bottom; }

#selector ul li#selector4.on { background-position: -705px bottom; }

/* ===== breadcrumb ================================================== */

#breadcrumb {
	background-color: #CCC;
	height: 17px;
	padding: 3px 20px 0;
	font: bold 10px Arial, Helvetica, sans-serif;
	color: #000;
}

#breadcrumb ul li {
	display: block;
	padding: 0 2em 0 0;
	float: left;
	white-space: nowrap;
}

#breadcrumb ul li.lit,
#breadcrumb ul li a { color: #B00; }

#breadcrumb ul li a:hover { text-decoration: none; }

/* ===== copy ================================================== */

#copy {
	background: transparent url('../images/copy_bg.gif') repeat-y left top;
	padding: 1em 20px;
	color: #000;
}

#copy ul,
#copy ol { margin-top: 1em; }

#copy li { margin-bottom: 1em; }

.sitemap ul li li { margin-bottom: 0; }

ol.faqs li { margin-bottom: 1em; }

ol.faqs li { margin-bottom: 1em; }

span.faqs_question {
	display: block;
	padding-top: 1em;
	padding-bottom: .75em;
	border-top: 1px solid #CCC;
}

span.faqs_answer { display: block; }

span.faqs_question strong.faqs_q,
span.faqs_answer strong.faqs_a {
	font-size: 18px;
	line-height: 0;
	color: #999;
}

ul.pdfs li {
	background: transparent url('../images/icon_pdf.gif') no-repeat left top;
	padding-top: 2px;
	padding-left: 20px;
}

ul.audio li {
	background: transparent url('../images/icon_itunes.gif') no-repeat left top;
	padding-left: 20px;
	padding-bottom: 2px;
}

ul.zips li {
	background: transparent url('../images/icon_zip.gif') no-repeat left top;
	padding-left: 20px;
	padding-bottom: 2px;
}

.step1 img,
.step2 img,
.step3 img { margin-bottom: 1em; }

.step1 .cellName { }

.step1 .shortDescription {
	display: block;
	height: 115px;
}

.step3 .shortDescription {
	display: block;
	height: 6em; /*old: 55px*/
}

.step4 h3 { margin-bottom: 0; }

.step4 img { margin: 1em 0; }

/* ===== contentFooter ================================================== */

#contentFooter {
	background: transparent url('../images/contentFooter_bg.gif') no-repeat left top;
	height: 50px;
	clear: both;
}

/* ===== learnAbout_matrixA ================================================== */

ul.learnAbout_matrix li { float: left; }

ul.learnAbout_matrix li a {
	display: block;
	background: transparent url('../images/learnAbout_matrix.gif') no-repeat left top;
	width: 315px;
	height: 47px;
}

ul#learnAbout_matrixA li a.learnAbout3,
ul#learnAbout_matrixB li a.learnAbout3 { width: 310px; }

ul#learnAbout_matrixA li a.learnAbout1 { background-position: left top; }

ul#learnAbout_matrixA li a.learnAbout2 { background-position: -315px top; }

ul#learnAbout_matrixA li a.learnAbout3 { background-position: right top; }

ul#learnAbout_matrixA li a.learnAbout1:hover { background-position: left -47px; }

ul#learnAbout_matrixA li a.learnAbout2:hover { background-position: -315px -47px; }

ul#learnAbout_matrixA li a.learnAbout3:hover { background-position: right -47px; }

ul#learnAbout_matrixB li a.learnAbout1 { background-position: left -94px; }

ul#learnAbout_matrixB li a.learnAbout2 { background-position: -315px -94px; }

ul#learnAbout_matrixB li a.learnAbout3 { background-position: right -94px; }

ul#learnAbout_matrixB li a.learnAbout1:hover { background-position: left bottom; }

ul#learnAbout_matrixB li a.learnAbout2:hover { background-position: -315px bottom; }

ul#learnAbout_matrixB li a.learnAbout3:hover { background-position: right bottom; }

/* ===== productbins_matrix ================================================== */

ul.productbins li { float: left; }

ul.productbins li a {
	display: block;
	background: transparent url('../images/productbins_matrix.jpg') no-repeat left top;
	width: 188px;
	height: 110px;
	margin-bottom: 7px;
}

ul#productbins_matrixB li a,
ul#productbins_matrixC li a { width: 313px; }

ul#productbins_matrixA li a.productbin1 { background-position: left top; }

ul#productbins_matrixA li a.productbin2 { background-position: -188px top; }

ul#productbins_matrixA li a.productbin3 { background-position: -376px top; }

ul#productbins_matrixA li a.productbin4 { background-position: -564px top; }

ul#productbins_matrixA li a.productbin5 { background-position: -752px top; }

ul#productbins_matrixA li a.productbin1:hover { background-position: left -110px; }

ul#productbins_matrixA li a.productbin2:hover { background-position: -188px -110px; }

ul#productbins_matrixA li a.productbin3:hover { background-position: -376px -110px; }

ul#productbins_matrixA li a.productbin4:hover { background-position: -564px -110px; }

ul#productbins_matrixA li a.productbin5:hover { background-position: -752px -110px; }

ul#productbins_matrixB li a.productbin1 { background-position: left -220px; }

ul#productbins_matrixB li a.productbin2 { background-position: -313px -220px; }

ul#productbins_matrixB li a.productbin3 { background-position: -626px -220px; }


ul#productbins_matrixB li a.productbin1:hover { background-position: left -330px; }

ul#productbins_matrixB li a.productbin2:hover { background-position: -313px -330px; }

ul#productbins_matrixB li a.productbin3:hover { background-position: -626px -330px; }


ul#productbins_matrixC li a.productbin1 { background-position: left -440px; }

ul#productbins_matrixC li a.productbin2 { background-position: -313px -440px; }

ul#productbins_matrixC li a.productbin3 { background-position: -626px -440px; }


ul#productbins_matrixC li a.productbin1:hover { background-position: left -550px; }

ul#productbins_matrixC li a.productbin2:hover { background-position: -313px -550px; }

ul#productbins_matrixC li a.productbin3:hover { background-position: -626px -550px; }


/* ===== footer ================================================== */

#footer {
	padding: 20px 0;
	font-size: 11px;
	color: #CCC;
	text-align: center;
}

#footer ul li {
	display: inline;
	background: transparent url('../images/icon_plus.gif') no-repeat left center;
	margin:0;
	padding: 0 .25em 0 1em;
}

#footer ul li.first {
	background: none;
	padding-left: .25em;
}

#footer ul li a { color: #CCC; }

#footer ul li a:hover { color: #FFF; }

/* ===== btns ================================================== */

a.btn_select {
	display: block;
	background: transparent url('../images/btn_select.gif') no-repeat left top;
	width: 75px;
	height: 16px;
}

a.btn_select:hover { background-position: left bottom; }

/* ===== cells ================================================== */

.cell_1_2,
.cell_1_4,
.cell_3_4,
.cell_1_3,
.cell_2_3,
.cell_1_5,
.cell_2_5,
.cell_3_5,
.cell_1_6 {
	padding: 0 20px 0 0;
	float: left;
}

.cell_1_2 { width: 430px; }

.cell_1_4 { width: 205px; }

.cell_3_4 { width: 655px; }

.cell_1_3 { width: 280px; }

.cell_2_3 { width: 580px; }

.cell_1_5 { width: 160px; }

.cell_2_5 { width: 340px; }

.cell_3_5 { width: 520px; }

.cell_1_6 { width: 130px; }

.cell_2_3_wrap {
	width: 600px;
	float: left;
}

.cell_1_3_reduced {
	width: 300px;
	float: left;
}

/* ===== tables ================================================== */

.table0 th { text-align: left; }

.table0 td {
	padding: 2em 0;
	border-top: 1px solid #CCC;
}

.table0 table th,
.table0 table td {
	padding: 1em 30px 0 0;
	border: none;
}

.table0 table tr.hdr th {
	font-size: 1.25em;
	padding-top: 0;
	margin-top: 0;
	color: #555;
}

/* ===== default ================================================== */

.tiny { font-size: 10px; }

.lower { text-transform: none; }

.upper { text-transform: uppercase; }

.right {
	margin: 0 0 1em 1em;
	float: right;
}

.left {
	margin: 0 1em 1em 0;
	float: left;
}

.clear { clear: both; }

.clear_space {
	margin: 0 0 1em;
	clear: both;
}

.reduced,
h1,
#nav ul,
.indexHtml ul,
#selector ul,
#breadcrumb ul,
ol.faqs,
ul.pdfs,
ul.audio,
ul.zips,
ul.learnAbout_matrix,
ul.productbins,
#footer ul {
	margin: 0;
	padding: 0;
	list-style: none;
	border: none;
}

.hide,
h1 a span,
#nav ul li a span,
.indexHtml ul li a span,
.indexHtml p,
a#btn_seeVideoToLearnMore span,
#selector ul li span,
a.btn_select span,
ul.learnAbout_matrix li a span,
ul.productbins li a span { display: none; }