/* TEMP */


/* //// */


.a {color:red;}

div#preload { display: none; }

img, div {behavior:url(css/iepngfix.htc);}
* {margin:0; padding:0; font:1em tahoma, arial; line-height:1.5em;}
a img {border:0;}
a {color:#5888BC; text-decoration:none;}
.wh a {color:#fff;}
a:hover, .wh a:hover {color:#aec556;}
.br10 {line-height:10px;}
sup {font-size:50%;}
b {font-weight:bold;}
i {font-style:italic;}
h3 i {font-weight:bold;}
td, th {vertical-align:top;}
.hide {display:none;}
.left {float:left;}
.right {float:right;}
.ctr {margin:0 auto;}
.moreLink {font-size:0.9em; font-weight:bold;}
div.newsItem {border-top:0px solid #ccc; border-bottom:1px dotted #5888BC; padding:10px 0;}
.newsItem .moreLink {text-transform:uppercase; margin-top:8px; display:block;}
.newsItem .moreLink img {margin-left:3px;}
.date span {color:#fff; background:#5888BC; font-size:1em; padding:2px 10px;}
.note {font-size:0.9em; color:#888;}
.blue {color:#1073ba;}
.boldBlue {color:#1073ba; font-weight:bold;}
.blueBox {border:1px solid #1073ba; padding:5px 15px; margin-top:15px; background:#e7f1f8; font-size:0.9em;}
.blueBox p {}
.name {color:#1073ba; font-size:1.2em;}
.imgTop {vertical-align:text-top;}
.imgBtm {vertical-align:text-bottom;}
div.box #questions {border-left:1px solid #c8c8c8; border-right:1px solid #c8c8c8;}
div.box .boxBtm {height:28px; background:url(../images/box-btm.gif) no-repeat; text-align:right; padding:0px 10px 0 0;}
div.box .boxBtm a {color:#fff; font-weight:bold; /*font-size:1.1em; text-transform:uppercase;*/}

h1, h2, h3, h4 {color:#1073ba;}
h1 {font-size:1.7em; padding-bottom:6px; line-height:1.3em;}
h1 div {font-size:0.55em;}
h2 {font-size:1.1em; font-weight:bold; padding:10px 0 5px 0;}
h3 {font-size:1.15em; font-weight:bold;}
.colLeft h3 {padding:15px 20px 0px 20px;}
.colLeft .article h3 {padding-left:0px;}
#navLeft h3 {background:#515151;  color:#fff; /*text-transform:uppercase;*/}
#home #navLeft h3 {font-weight:normal; font-size:1em;}
h4 {font:bold 1.2em arial narrow; text-transform:uppercase; margin:20px 0 10px 0; border-bottom:1px dotted #1073ba;}
h5 {font:bold 0.92em arial; text-transform:uppercase; color:#fff; margin:5px 2px 5px 5px;}
.iBrow {padding: 0px; margin: 0px; line-height: 1.2em; color:#aec556; font-size: 1.2em; font-weight:bold; font-style: italic;}

p {margin-bottom:10px;}
p.accented {border-top:0px dotted #1073ba; font-size:1.2em;}
p.accented span {border-bottom:1px dotted #1073ba; padding:2px 0 4px; line-height:1.8em;}
p.blueBgr {background:#1073ba; color:#fff; padding:5px 20px; /*font-weight:bold;*/ font-size:1.2em;}

ul {margin-left:15px; list-style-image:url(../images/bullet-blue.gif);}
li {padding-bottom:5px;}
ul.more li {padding-bottom:10px;}
ul.lines li {border-bottom:1px dotted #ccc; padding-top:10px;}
ul.pics {margin-left:0;}
ul.pics li {list-style:none; padding:20px 0 10px 0;}
ul.pics img {float:left;}
ul.pics p, ul.pics div {margin-left:190px;}
ul.pics ul#list1 li  {list-style: circle; padding:20px 0 10px 0; margin-left: 190px;}
ul.pics ul#list1 li ul li {list-style:disc; margin-left:15px }
.imagesLeft {border-top:1px dotted #1073ba; padding:20px 10px 10px 0;}
.imagesLeft img {float:left; padding:2px; border:1px solid #ccc; margin-top:15px;}
.imagesLeft h2, .imagesLeft p, .imagesLeft ul {margin-left:200px;}


#linkWaterproof {padding:30px 0 0 20px; font-size:1.5em;}
ul.linksLeft {/*margin-top:40px;*/ list-style:url(../images/bullet-green-bg.gif); margin:0 20px 20px 40px;}
ul.linksLeft li {border-bottom:1px solid #ccc;}
ul.linksLeft a {display:block; width:160px; padding:10px 5px 2px 0;}
/*
#navLeft ul {list-style:none; font-size:1em; background:#181818; margin-left:0;}
#navLeft a {display:block; color:#fff; text-transform:uppercase; padding:12px 10px 7px 20px; border-top:1px solid #000;}
#navLeft a:hover {background:#d8e2c3; color:#000;}
*/

#navLeft ul {list-style:none; font-size:1em; background:#888; margin-left:0;}
#navLeft li {padding:0;}
#navLeft a {display:block; color:#fff; padding:12px 10px 7px 35px; border-top:1px solid #acacac; border-bottom:1px solid #5f5f5f; font-weight:bold; }
#navLeft a:hover {border-bottom:1px solid #acacac; border-top:1px solid #5f5f5f; padding-left:35px;}
#navLeft h3 {font-size:1.15em; font-weight:bold; margin: 0; padding: 7px 20px;}



body {background:#f0f0f0;}
#shadow {width:1024px; background:url(../images/bgr.jpg);}
#container {width:990px; background:#fff; border:5px solid #fff;}
.colLeft {float:left; width:220px; font-size:0.75em; color: #000; background-color:#e6e6e6}
/*#content .colLeft {border-bottom:5px solid #bebebe;}*/
.colMain {margin:30px 20px 20px 250px; font-size: 0.75em;}
.colRight {float:right; width:190px; margin-top:75px; font-size:0.9em;}


#home .colLeft {background:#fff;}

/* HEAD */
#top {height:20px; background:#333 url(../images/top.jpg); padding-top:14px;}
#topNav {width:960px; text-align:right; color:#fff; font-size:0.6em;}
#topNav a {margin:0 10px; text-transform:uppercase;}

#header {height:130px; background:#7297ba url(../images/bgr-blue.gif); border-bottom:5px solid #fff;}

#image {background:#e6e6e6; height:150px;}
#intro {background:url(../images/header-left.jpg); height:130px; width:194px; padding:15px 10px 5px 16px; color:#fff; line-height:20px; font-size:0.82em;}
#intro div#starts {font:1.7em/1.1em arial; /*font-size:1.3em; line-height:1.1em; font-weight:bold; text-transform:uppercase;*/ margin-bottom:5px;}
#image #intro a {color:#fff;}
#imgMain {margin-left:220px; height:150px; background:url(../images/banner.jpg) no-repeat;}

#quoteTop {font-size:1em; font-family:georgia;}
.quo {margin-left:-0.5em; display:none}
#quoteTopName {font-size:0.8em; line-height:1.2em; margin:3px 15px 0 0px; text-align:right;}
#quoteTopName i {font-style:italic;}

#text blockquote {margin-left:1.2em; border-bottom:1px dotted #ccc;}
#text .quo {display:block; float:left; margin:0 0.1em 0 -0.5em;}
#text .quo, #text .quoE {/*font-weight:bold; font-size:1.4em;*/ color:#666;}

/* #leftFade {margin:205px 7px 10px 7px; font-size:.8em; color: #000; text-align:center; line-height: 1.4; }
#leftFade div {text-align:center; padding: 0; font-size:0.87em; color: #0c73ba; font-weight: bold;}
#leftFade div i {} */

#about #imgMain {background:url(../images/banner-02.jpg) no-repeat;}
#support #imgMain, #news #imgMain, #howtobuy #imgMain {background:url(../images/banner-03.jpg) no-repeat;}
#waterproof #imgMain, #contact #imgMain {background:url(../images/banner-04.jpg) no-repeat;}
#distributors #imgMain {background:url(../images/banner-05.jpg) no-repeat;}
#products #imgMain {background:url(../images/banner-06.jpg) no-repeat;}
#gallery #imgMain, #testimonials #imgMain {background:url(../images/banner-07.jpg) no-repeat;}
#faq #imgMain {background:url(../images/banner-08.jpg) no-repeat;}
#newProds #imgMain {background:url(../images/banner-09.jpg) no-repeat;}

#howtobuy #btnHowToBuy, #faq #btnFaq {display:none;}

#home #intro {height:250px; padding: 0; width:220px; height: 270px;}
#home #intro div {margin-right:10px;}
#home #imgMain {background: none;}
#home .moreLink {float:right; margin:10px 10px 0 0; background: #8ab73d; font-size:0.6em; font-weight:bold; color:#fff; padding:1px 7px; text-transform:uppercase;}
#home .moreLink:hover {background:#6585aa;}
#home #intro a {color: #aec556; font-weight: bold;}
#home #intro a:hover {color: #aec556; font-weight: bold; text-decoration: underline;}


#testimonials #intro {background:url(../images/header-left-testimonials.jpg) no-repeat;}

/*home header*/
#home #image, #home #imgMain {height:270px;}
#imgMain #arrow {margin:30px 0 0 360px; position:absolute;}
/* #quickBlok {width:400px; position:relative; margin:27px 5px 0 0; font-size:0.73em; line-height:1.3em;}
#quickBlok img {margin-top:6px;}
#quickBlok #qBtext {width:185px; position:absolute; top:0px; right:10px;}
#quickBlok div#title {font-size:1.5em; font-weight:bold; color:#1073ba; line-height:1.2em; margin-bottom:5px;}
#quickBlok #qBtext a {display:block; margin-top:10px;}*/

#home #text {width:400px;}
#home .colMain {margin-right:7px; margin-top: 15px;}
#home .colRight {width:310px; margin-top:0px; font-size:inherit;}
ul#productShowcase {list-style:none; margin:0;}
ul#productShowcase li {float:left;}
#actions {background:#fff;}
#actions img {margin-bottom:1px;}
#questions {border:0px solid #1073ba; padding:5px 5px 10px 5px; background:#fff;}
#questions span {float:left; color:#1073ba; font-weight:bold; font-size:2em; margin-top:-4px;}
#questions div div {margin-left:30px;  line-height:1.3em;}
#questions .question a {font-weight:bold; display:block; margin-bottom:3px;}
#questions .answer {font-size:0.95em;}
#questions .answer a {font-weight:bold; line-height:0.95em;}

#home .colRight h2 {padding-top:0;}
a#actWaterproof {display:block; height:83px; width:160px; padding:12px 40px 5px 200px; background:url(../images/act-waterproof.jpg);}
a#actWaterproof:hover {background:url(../images/act-waterproof-ro.jpg);}
a#actWaterproof div {color:#1073ba; font-size:1.9em; line-height:1.2em;}
a#actWaterproof:hover div {color:#7cb327;}
a#actWaterproof p {line-height:1.2em; margin:0; color:#333;}
#newsletter {background:url(../images/newsletter.jpg); width:289px; height:68px; padding:32px 10px 0 10px;}
#newsletter form {float:right; display:block; width:130px; /*border:1px solid #ccc;*/}
#newsletter form input {border:0px solid #1073ba; padding:4px; margin-top:5px; width:120px;}
#newsletter form input.button {padding:3px 0 1px 0; width:128px; background:#aec556; border-bottom:3px solid #899f34; border-right:3px solid #899f34; border-top:3px solid #ddf096; border-left:3px solid #ddf096; text-transform:uppercase; font-size:0.8em;}
#newsletter div {display:none;}
#newsletter p {width:150px; color:#fff; font-size:0.9em; line-height:1.3em;}

#1newsletter div {font-size:1.8em; color:#fff;}
#1newsletter p {float:right; width:120px;}

#0newsletter div {font-size:1.2em; color:#aec556;}
#0newsletter p {font-size:0.9em; line-height:1.3em; width:150px; color:#fff;}
#0newsletter form input {border:1px solid #ccc; padding:2px; margin-top:5px; width:125px;}
#0newsletter form input.button {width:inherit; padding:0px 20px; width:131px;}

	ul#actions {margin:20px 0 10px 0;}
	ul#actions li {list-style:none; float:left; padding-right:10px;}
	ul#actions li a {display:block; width:130px; height:80px; background:url(../images/box.gif); padding:10px; color:#000;}
	ul#actions li a:hover {}
	ul#actions li a div {color:#1073ba; font-size:1.5em; padding-bottom:0px;}
	ul#actions li a p {font-size:0.85em; line-height:1.3em;}

#leftRotation {text-align: center; color: 000;} 
#leftRotation span { color: 000; line-height: 1.2; padding: 0; margin: 0; font-size: .90em;}
#leftRotation h3 {font-weight: bold; text-align: center; color: #0c73ba; font-size:.95em; padding:0; margin:0; }
#fadeshow1 {}

/* CONTENT */
#content {border-top:5px solid #fff;}

.article {padding:20px 20px 30px 20px; border-top:1px solid #fff;}

.colLeft #quote {padding:50px 30px 0 30px; font-size:1.2em; font-family:georgia; background:url(../images/quote.png) no-repeat 5px 10px;}
#quoteName {font-size:0.9em; margin:0px 5px 0 15px; background:url(../images/quote-end.png) no-repeat top right; padding:0 0px 0px 30px;}
#quoteName i {font-style:italic;}

#actionButtons {padding:10px 0 15px 0; background:#fff;}
#actionButtons img {margin-top:10px;}

#text {width:500px;}

#about #content .colLeft, #products #content .colLeft {background:#fff;}
#logos {text-align:center;}
#logos a {display:block;}
#logos img {margin-top:30px;}
#logosICC {float: right; margin:5px; text-align:center;}


/* TABS */
div.tabContent.inactive {display:none;}
ul#tabbed {margin: 6px 0 20px 0; padding:0; float:right; height:2em; list-style:none; border-left:1px solid #1073ba; width:400px;}
ul#tabbed li {float:left;}
ul#tabbed a {display:block; float:left; color:#1073ba; text-transform:uppercase; font-size:0.8em; border:1px solid #1073ba; border-left:none; cursor:pointer; padding:3px 18px 0;}
ul#tabbed a:hover {background:#85aace; color:#fff;}	
ul#tabbed a.active {background:#1073ba; color:#fff;}
ul#tabbed span {display:block; line-height:2em;}


/* GALLERY */
#gallery ul.colFull, #gallery ul.colFull ul {list-style:none;}
#gallery ul.colFull ul {margin:10px 0 30px 0; padding-bottom:10px; border-bottom:1px dotted #ccc; height:190px;}
#gallery ul.colFull ul li {/*display:inline-block;*/ float:left; width:150px; color:#666; font-size:0.8em; margin:0 10px 20px 0; border:1px dotted #ddd; padding:5px;}
#gallery ul.colFull ul li img {margin-bottom:2px;}
#gallery .moreLink {float:right; margin:7px 27px 0 0; background:#aec556; font-size:0.85em; font-weight:bold; color:#fff; padding:1px 5px; text-transform:uppercase;}
#gallery .moreLink:hover {background:#1073ba;}





	#contact form {text-align:right; width:400px; margin-top:20px;}
	#contact form div {margin:5px 0;}
	#contact form label {vertical-align:top; font-size:0.9em; color:#333;}
	/*#contact form input, #contact form textarea {margin-left:20px; border:1px solid #ccc; width:250px;}
	#contact form .button {background:#666; color:#fff; font-size:0.9em; padding:3px 0 2px 0; border-bottom:2px solid #999; border-right:2px solid #999; border-top:2px solid #ccc; border-left:2px solid #ccc;}*/


#contactTable td {padding-bottom:5px; text-align:left;}
#contactTable td.title {width: 50px; white-space: nowrap; text-align:right; padding-right:5px;}
#contactTable td.status {width: 240px; vertical-align: middle; white-space: nowrap; font-size: 9pt;}
#contactTable .error {color:#c00;}
	#contactTable #contactPerson {font:bold 10pt tahoma; color:#1073ba; width:350px;}
#contactTable .note input {width:13px; margin-top:5px;}
#contactTable input, #contactTable textarea {border:1px solid #ccc; color:#666; font-weight:normal; width:300px; padding:1px 5px; background:#e8e8e8;}
#contactTable input.shrt {width:200px;}
#contactTable #buttons input {padding:3px 0 1px 0; width:100px; background:#aec556; border-bottom:3px solid #899f34; border-right:3px solid #899f34; border-top:3px solid #ddf096; border-left:3px solid #ddf096; text-transform:uppercase; font-size:1em; color:#fff;}
#contactTable #contactForm label.error {font-weight: bold; color: #EA5200; }
#contactTable #contactForm label.checked { }
#message {color:red; text-align:left;}
#contactTable span.req { color: #EA5200;}



/* PRODUCTS */
#products .colRight {margin-top:0px; font-size:inherit;}
#prodRight {width: 360px; padding-left: 30px;}
.floatRight {float: right; padding: 0px 0px 2px 7px;}
#products .videos {width:465px;}
#products .videos .youtube {float:right; margin-top:20px;}
#products #text {width:360px; margin-top: 40px;}
#products ul.parts {width:280px;}
#products #text a.moreLink {padding:5px 5px 0px 10px; display:block; text-align:right;}
#products div.prodLeft {margin: 0; padding-right:40px }
#products #specsTable {width:100%;}
#products #specsTable th {border-bottom:1px solid #6699cc; padding:5px 15px 5px 0; font-weight:bold; text-align:left; width:170px;}
#products #specsTable td {border-bottom:1px solid #6699cc; background:#e2ebf9; font-weight:normal; padding:5px 15px;}
#products .two li {float:left; width:200px;}
#products ul li {padding-bottom:0;}
#products h2 {font-size:1.1em; font-weight:bold; padding: 0 0 2px 0;}
.linkDownload {border-bottom:1px dotted #1073ba; padding:5px 0; margin-right:30px;}
.linkDownload img {margin-right:3px;}
#products .imagesLeft h2, #products .imagesLeft p, #products .imagesLeft ul {margin-left:270px;}
#products .imagesLeft img {border:none; padding:0;}
#prodRight li {line-height: 1.3; margin-bottom: 5px;}
.installation {color: #24357e; font-weight: bold; padding: 0px 5px 0 20px;}
.qbase {background: #dfebf3; width: 205px; padding: 9px; float: right; margin: 20px 40px 0 0; text-align: center; font-size: 11px;}
#products p.accented {border-top:1px dotted #1073ba; font-size:1.1 em;}
.prodLeft h1  {padding-bottom: 6px;}
#products .moreLink {float:right; margin: 0 10px 0 0; font-size:0.7em; font-weight:bold; padding:0; text-transform:uppercase;}
#prodLeft .accented span {}


#support #downloads {margin-top:10px;}
#support #downloads th, #support #downloads td {border-bottom:1px solid #6699cc; vertical-align:middle; color:#1073ba;}
#support #downloads th {text-align:left; font-size:0.9em; font-weight:bold; text-transform:uppercase; width:160px;  /*padding:10px 5px 10px 0;*/ padding:7px 10px 7px 0;}
#support #downloads td {background:#e2ebf9; text-align:center; padding:8px 0;}
#support #downloads #tableHead td {background:#fff; font-weight:bold; font-size:0.95em;}

#distributors .pics li {height:80px; float:left; width:360px;}
#distributors ul.pics p, #distributors ul.pics div {margin-left:130px;}


#faq .colMain {width:600px;}
#faq ol li {margin-left:45px; padding-bottom:10px;}
#faq ol li ul li {padding-bottom:5px;}
#faq ol img, .plus {float:right;}
#faq ol b {margin-bottom:10px; display:block; font-size:0.85em;}
#faq ol h2 {margin-top:10px;}
#faq ol li div, #collapsible div {display:none; margin-top:5px;}


#popup {font-size:0.75em; padding:30px 60px; background:#fff;}

/*PRODUCTS TABLE*/

#table { font-size: 10pt; margin-top: 10px;}
.tableHeader {background: #5D5D5D; color: #fff; font-weight: bold;}
.tableGreen {background: #AEC556; color: #fff; font-weight: bold; }
#table tr {padding: 3px; text-align: center; background: #E8E8E8;}
#table td {padding: 5px; vertical-align: middle;}
#table p {line-height: 1.25;}

#table a {color: #fff; font-weight: bold; display: block; padding: 12px;}

.tableCells { }
.code {font-size: 7pt; color: #333; line-height: 3;}

#prodOverview { float: left; clear: both; margin: 20px 0 0 100px;}

/* image bank */

.highRes {text-align: center; padding: 25px 0; border-bottom: 1px dashed #666; width: 900px;}
#imageBank { }
#imageBank h2 {text-align: left; margin-left: 25px; color: #8ea535;}
#imageBank p {text-align: left; font-size: 12px; margin: 10px 0px 0px 15px; }
#imageBank h5 { text-align: left; font-size: 12px; color:#333; font-weight: bold; padding: 14px 0 0 14px;}
#imageBank ul { text-align: left; font-size: 12px; padding: 14px 0 0 14px;}
#imageBank a {font-weight: bold;}
#imageBank a:hover {font-weight: bold; text-decoration: underline;}

/* footer */
#footer {clear:both; text-align:center; color:#1073ba; font-size:0.65em; padding-top:30px;}
#footer a {margin:0 8px;}
#copy {width:1004px; background:url(../images/bgr-btm-shd.jpg) no-repeat; color:#999; font-size:9px; padding:20px 0 20px 20px; margin-bottom:20px;}
#copy .right {margin-right:12px;}

/* iPad [portrait + landscape] */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
	div#ddtopmenubar ul {padding:70px 0px 0 0;}
.mattblackmenu ul li a {padding: 0 5px;}
}

/* iPhone [portrait + landscape] */
@media only screen and (max-device-width: 480px) {
	div#ddtopmenubar ul {padding:70px 0px 0 0;}
.mattblackmenu ul li a {padding: 0 5px;}
}
