@charset "utf-8";
/* CSS Document */
/* COLORS
red - b80000
*/

*{margin:0; padding:0;}

body {
background:#fafafa url(../images/bg-body.gif) repeat-x top left;
text-align:center;
font-family:"Arial Narrow", Arial, Verdana, sans-serif;
color:#000000;
font-size:14px;
}

.wrapper {
width:990px;
margin:0 auto;
text-align:left;
}

a {
color:#b80000;
text-decoration:underline;
}

a:hover {
text-decoration:none;
}

a.more {
text-transform:uppercase;
text-decoration:none;
font-size:10px;
}

a.more:hover {
text-decoration:underline;
}

ul {list-style:none; margin-bottom:20px;}

ul.circlelist {margin-left:6px;}
ul.circlelist li{
padding:3px 0 3px 15px;
background:url(../images/blt-red-circle.gif) no-repeat left 9px;
}

ul.list2 li a{
color:#000000;
text-decoration:none;
}

ul.list2 li.active a, ul.list2 li a:hover{
color:#b80000;
}

ul.circlelist  ol {}

ul.circlelist  ol li {
background:none;
padding-left:0;
}

ul.nobullet li {padding-left:0; background:none;}

ul.nobullet span.number{color:#b80000; font-size:14px; font-weight:bold;}

h1, h2, h3, h4, h5 {
font-size:28px; color:#bf0000;
font-weight:normal;
margin-bottom:0.8em;
margin-top:2.2em;
}

h2{font-size:18px;
}

h3{
font-size:18px;
color:#000000;
}

h4{
font-size:16px;
color:#bf0000;
}

h5{
font-size:14px;
font-weight:bold;
}

p{
margin-bottom:1.3em;
line-height:18px;
line-height:1.3em;
}

input{
font-family:"Arial Narrow", Arial, Verdana, sans-serif;
}


/* ArcaStor ********** HEADER ********** */

#header {
	padding:0 30px 0 0px;
	height:75px;
}
#header .side {
	float: right;
	width:150px;

}
.phone {
	font-size: 13px;
	text-transform: none; /*KB:changed from uppercase;*/
	color: #b80000;
	text-align: right;
	margin-top:12px;
	margin-bottom:17px;
	padding-right:3px;
	
	margin-top:30px; /*KB:changed from 45px;*/
	margin-bottom:0;
}
h1#logo {margin:0; }

#logo a{
background:url(../images/arcastor.png) no-repeat left top;
width:215px;
height:49px;
float:left;
margin-top:20px;
margin-right:50px; /*KB:changed from 50px; space between header nav from logo*/
margin-left:20px; /*KB:changed from 20px; how far logo from left margin*/
text-indent:-9999px;
outline:none;
}

#frm-search
{
display:none;
background:url(../images/bg-search.gif) no-repeat right top;
float:right;
width:220px;
height:30px;
position:relative;
bottom:6px;
}
#frm-search label {position:absolute; left:-9999px;}
#frm-search #search {
position:absolute;
top:5px;
left:5px;
border:none;
font-size:14px;
color:#7a7a7a;
padding:0px 0px 4px 2px;
width:181px;
border:0;
}

#frm-search .submit {position:absolute; right:0; top:0; }


/* ********** MAINNAV ********** */

#mainnav{
float:left;
margin-top:34px;
margin-bottom:0;
}

#mainnav li{
float:left;
}

#mainnav li.parent{
}

#mainnav li a{
font-size:18px;
display:block;
padding:0px 13px;
text-decoration:none;
color:#000000;
line-height:41px;
float:left;
padding-right:0px;
background:url(../images/bg-mainnav-left.gif) no-repeat top left;
}


#mainnav li a span {float:left; }

#mainnav li a span {
padding-right:8px;
cursor:pointer;
background:url(../images/bg-mainnav-right.gif) no-repeat top right;
padding-right:13px;
}



#mainnav li a:hover{
color:#ffffff;
background:url(../images/bg-mainnav-left.gif) no-repeat left bottom;
}

#mainnav li a:hover span{
background:url(../images/bg-mainnav-right.gif) no-repeat bottom right;
}


#mainnav li.parent a {
padding-right:0;
}

#mainnav li.parent a span {
padding-right:34px;
background:url(../images/bg-mainnav-parent-right.gif) no-repeat top right;
}

#mainnav li.parent a:hover, #mainnav li.active a
{
color:#ffffff;
background:url(../images/bg-mainnav-left.gif) no-repeat bottom left;
}

#mainnav li.parent a:hover span, #mainnav li.active a span{
background:url(../images/bg-mainnav-parent-right.gif) no-repeat bottom right;
}

#mainnav li.active ul a {background:none; }


/* second level - subnav */

#mainnav ul { /* all lists */
	padding: 0;
	margin: 0;
	list-style: none;
	line-height: 1;
}

#mainnav li ul { /* second-level lists */
position: absolute;
margin-top:41px;

float:left;
width:158px;
z-index:2;
/*left: -999em; *//*using left instead of display to hide menus because display: none isn't read by screen readers*/
background:url(../images/bg-bottom-subnav.gif) no-repeat left bottom;
padding-bottom:3px;
left:auto;
clear:both;
top:34px;	
margin-bottom:0;
left:-9999px;
}

#mainnav li:hover ul, #mainnav li.over ul {left:auto; /*display:block;*/}

#mainnav li.parent ul li, #mainnav li.parent ul a {background:none; padding:0; margin:0; }
#mainnav li.parent ul li { display:block; width:100%;background:#f1f1f1;  }
#mainnav li.parent ul li.first {padding-top:12px;}
#mainnav li.parent ul li a {font-size:14px; display:block; float:none; padding:4px 8px 6px 8px; line-height:15px; color:#000; display:block; }

#mainnav li.parent ul a:hover, #mainnav li.parent ul li.active a {background:#be0000; color:#fff; }
#mainnav li.parent ul li.last {}


/* ********** TOPIMG ********** */

 #topimg /*KB:990x212 bg-splash.png is outer shadow of product page topimages, just over bg-secondnav.png*/{
background:url(../images/bg-splash.gif) no-repeat left top;
float:left;
padding:24px 30px 17px 30px;
width:930px; 
height:170px;
position:relative;
z-index:1;
line-height:1px;
font-size:1px;
}



#topimg #splash li{padding:0; margin:0;}
#topimg #splash  {margin-bottom:0;}

#topimg .text{
position:absolute;
z-index:1;
left:478px;
top:132px;
line-height:normal;
font-size:14px;
width:450px; /*KB:width=???, but I changed it on 3WS to 400px*/
}

#topimg .text {
top:100px;
/*text-align:right;*/
}

#topimg .text h1, #topimg .text h2 {font-size:28px; margin:0; line-height:27px; }
#topimg .text p {font-size:18px;}

.page-home .text {top:132px;}
.page-home .text  h1, .page-home .text h2 {}

.page-home #topimg /*990x311*/{
width:930px; height:270px; /*KB:dimm's of home page splash images*/
background:url(../images/bg-splash-home.gif) no-repeat left top; /*KB:bg-splash-home.png is the large shadow around the homepage splash images*/
}

.page-home #topimg .text{
/*KB:splash image text location, changed from l:443px & t:113px;*/
left:435px !important;
top:70px; /*KB:how far from top the red title falls in the splash images*/
}


/* ********** CONTENT ********** */

#content{
clear:both;
float:left;
width:100%;
}


.maincontentwrapper{
background:url(../images/bg-1column-top.gif) no-repeat left top;
float:left;
width:100%;
padding-top:17px;
}


.maincontent{
float:left;
width:890px;

padding:20px 50px;
padding-bottom:44px;
padding-bottom:32px;
background:url(../images/bg-1column-bottom.gif) no-repeat left bottom;
margin:0;

}

.maincontent {padding-bottom:50px;}



.page-1col .maincontentwrapper {padding:0;}
.page-1col  .maincontent {padding-top:37px;}

#content{
background:url(../images/bg-1column.gif) repeat-y top left;
}

.page-home #content .layout-3col {
}

/*home page*/
.page-home .maincontentwrapper{
background:url(../images/bg-3columns-top.gif) no-repeat left top;

}

.page-home .maincontent{
width:930px;
padding:0 30px;
padding-bottom:32px;
background:url(../images/bg-3columns-bottom.gif) no-repeat left bottom;
}

.page-home #content{
background:url(../images/bg-3columns.gif) repeat-y top left;
}

.page-home #content .layout-3col {
}

.layout-3col h1{margin:0;}
.col1, .col2, .col3{
float:left;
width:300px;

/*padding:137px 12px 7px 12px;*/
/*width:276px;*/
}

.col1 {
margin-right:14px;
}

.col2{
margin-right:15px;
}

.col1 .content, .col2 .content, .col3 .content {
padding:12px 12px 7px 12px;
}

.col1 .img, .col2 .img, .col3 .img{
background:url(../images/home-col1.jpg) no-repeat top center;
width:300px;
display:block;
height:125px;
text-indent:-9999px;
}

.col2 .img {background-image:url(../images/home-col2.jpg);}
.col3 .img {background-image:url(../images/home-col3.jpg);}




.col1 p, .col2 p, .col3 p{
line-height:normal;
margin-bottom:7px;
}

.layout-3col .more {
}

.col1 a.more:hover, .col1 a.more:focus {color:#e05814; text-decoration:none;}
.col2 a.more:hover, .col2 a.more:focus {color:#0070b6; text-decoration:none;}
.col3 a.more:hover, .col3 a.more:focus {color:#eaaa0f; text-decoration:none;}

/*two columns page*/
.page-2col #content
{
clear:both;
float:left;
width:100%;
background:url(../images/bg-2columns.gif) repeat-y top left;
}

.page-2col .content-inner{
background:url(../images/bg-2columns-top.gif) no-repeat top left;
}

.page-2col .maincontent /*660*/{
padding:20px 20px 20px 50px;
width:575px;
padding-bottom:32px;
padding-bottom:10px !important;
background:url(../images/bg-2columns-bottom.gif) no-repeat left bottom;
}

.page-2col .maincontentwrapper{
width:645px;
background:url(../images/bg-2columns-top.gif) no-repeat left top;
}

.page-2col .maincontent {
background:none;
}
.bottom-2col{
clear:both;
background:url(../images/bg-2columns-bottom.gif) no-repeat left top;
height:44px;
clear:both;
}


/* ********** SECOND NAV ********** */

ul.secondnav{
padding-left:40px;
background:url(../images/bg-secondnav.gif) repeat-x top left;
/*KB:shading around bottom of top image and top of second nav bar*/
background:#f3f3f3 url(../images/bg-secondnav.jpg) no-repeat left top;
float:left;
width:920px;
margin-bottom:0;
}
.secondnav li{
float:left;
}

.secondnav li a{
display:block;
padding:0px 20px;
color:#7a7a7a;
font-size:18px;
text-decoration:none;
line-height:40px;
outline:none;
}

.secondnav li a:hover, .secondnav li a:focus{
color:#b80000;
}

.secondnav li.active a{
color:#b80000;
background:url(../images/blt-arrowdown.gif) no-repeat center 35px;
}


ul.secondnavbottom {margin-top:-15px; background:#ffffff url(../images/bg-secondnavbottom.jpg) repeat-x left top; margin-bottom:30px;}
.secondnavbottom li.active a{
background:url(../images/blt-arrowup.gif) no-repeat center 0px;
}


/* ********** SIDEBAR ********** */

#sidebar {
float:right;
width:345px;
padding:8px 0px 0 0px;
/*KB:bg-sidebar.png is over contact button, under bg-secondnav.png, to the right of bg-2columns-top.png*/
background:url(../images/bg-sidebar.gif) no-repeat left top;
min-height:15px;
}

.roundedbox{
background:url(../images/bg-roundedbox.gif) repeat-y left top;
float:left;
width:100%;
}

.roundedbox-inner{
background:url(../images/bg-roundedbox-top.gif) no-repeat left top;
padding:28px 50px 20px 35px;
}

.roundedbox h2 {margin-top:0;}

.second{
margin-top:-35px;
}

.second .roundedbox-inner { background-image:url(../images/bg-roundedbox-top-second.gif); padding-top:35px;}


.bottom{
clear:both;
background:url(../images/bg-roundedbox-bottom.gif) no-repeat left top;
height:45px;
}

.small-rounded
{
float:left;
width:345px;
height:107px;
background:url(../images/bg-small-rounded.gif) no-repeat left top;
}
.contactus {
padding-top:9px;
padding-left:15px;
width:330px;
}

.contactus a{
background:url(../images/contactus.gif) left top;
float:left;
width:300px;
height:71px;
display:block;
text-indent:-9999px;
}

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

.freeshipping {
padding-top:9px;
padding-left:15px;
width:330px;
}

.freeshipping .content{
float:left;
width:300px;
height:71px;
display:block;
/*text-indent:-9999px;*/
}

.freeshipping{
margin-top:-35px;
padding-top:15px;
background:url(../images/bg-small-rounded-second.gif) no-repeat left top;
}


h4.warranty {
background:url(../images/industry-leading-3year-warranty.jpg) no-repeat top center;
margin-top:-10px;
height:168px;
float:left;
text-indent:-9999px;
width:100%;
}


/* ********** FOOTER ********** */

#footer
{
margin:0;
clear:both;
padding-bottom:20px;
}
#footernav  {text-align:center;}
#footernav li{
display:inline;
}
#footernav li a{
color:#5f5f5f;
font-size:11px; 
text-transform:uppercase;
padding:0 13px;
text-decoration:none;
}

#footernav li a:hover, #footernav li.active a{color:#b80000;}

.copy {font-size:10px; color:#929292; text-align:center; margin-top:25px;}
.copy a {color:#929292; text-decoration:none;}
.copy a:hover {color:#b80000;}


/* ********** CONTENT ELEMENTS ********** */

.features {
margin:26px 0px 0px;
margin-bottom:0;
}

.features li {
padding:0;
float:left;
padding-left:100px;
width:180px;
min-height:100px;
height:auto !important;
height:100px;
margin-right:10px;
}
.features li h5 {margin:0 0 4px 0; color:#000000;}

.features li.last {margin-right:0px;}

.features li.clear {clear:both; float:none; min-height:1px; height:1px;}

/*KB:these are the 96px grey icons on the product pages*/
.features li.feature-a {background:url(../images/feature-a.gif) no-repeat left top;}
.features li.feature-b {background:url(../images/feature-b.gif) no-repeat left top;}
.features li.feature-c {background:url(../images/feature-c.gif) no-repeat left top;}
.features li.feature-d {background:url(../images/feature-d.gif) no-repeat left top;}
.features li.feature-e {background:url(../images/feature-e.gif) no-repeat left top;}
.features li.feature-f {background:url(../images/feature-f.gif) no-repeat left top;}
.features li.feature-g {background:url(../images/feature-g.gif) no-repeat left top;}
.features li.feature-h {background:url(../images/feature-h.gif) no-repeat left top;}


/* ********** TABLES ********** */

table {border-collapse:collapse; width:885px;}
.page-2col table {width:575px;}


table td {
padding:15px 10px;
font-size:14px;
border-top:1px solid #dfdfdf;
/*border-bottom:1px solid #dfdfdf;*/
border-right:1px solid #dfdfdf;
}

td.last, th.last, table.prices .column2{border-right:0;}

table th {
color:#b80000;
font-size:14px;
text-align:center;
border-top:1px solid #dfdfdf;
padding:10px 0;
border-right:1px solid #dfdfdf;
}
.tableheading th {border-bottom:1px solid #bfbfbf; border-top:0;}
table th.throw {border-right:1px solid #bfbfbf; text-align:left; font-weight:normal; }
table.specs th.throw {width:150px;} /*KB:changed from 170px;*/
table.specs td {/*width:80px !important; overflow:hidden;*/}
table.specs .tableheading {/*position:fixed; float:left; display:block;*/}


table.specsheading {
z-index:10;
position:absolute;
}

table.specsheading .tableheading {/*position:fixed;*/ float:left; display:block; top:0; width:885px;}
table.specs .tableheading th, table.specsheading .tableheading th{/*position:static;*/ padding:10px 0; /*KB:removed width:101px; from here so throw header doesn't get jacked when scrolling beyond page1*/ background:#fff;}
table.specs .tableheading th.empty, table.specsheading .tableheading th.empty {width:173px;}


/*table.specsheading {position:absolute; top:30px; left:40px;}*/




th.column1{border-right:0;}


table td.column1 {
border-right:1px solid #bfbfbf;
}

table.prices th{ position:absolute; left:-9999px;}

table td.price {
	font-size:14px;
	color:#b80000;
	text-align:right;
	width:75px;
	font-weight: bold;
}


/* ********** FORMS ********** */

label, select, select option, textarea{
font-family:"Arial Narrow", Arial, Verdana, sans-serif;color:#333333;
}


label {color:#7a7a7a;}
.required{color:#b80000;}
label.error {color:#b80000; font-size:12px; padding-left:10px;}
.message label.error {clear:both; float:left; width:300px; padding-left:0;}

input.txtfield{
border:1px solid #cccccc;
width:200px;
padding:2px 5px;
}

select {width:210px;  border:1px solid #cccccc; padding:1px 0;}
select option {padding:1px 6px;}

textarea{
color:#7a7a7a;
border:1px solid #cccccc;
width:350px;
padding:2px 5px;
height:100px;
overflow:auto;
font-size:14px;
color:#333333;
}

dl.form{
}

dl.form dt{
clear:both;
float:left;
width:120px;
text-align:right;
padding-bottom:10px;
margin-right:10px;
}

dl.form dd{
float:left; width:430px;
padding-bottom:10px;
}

#form-contactus {margin:30px 0;}
#form-techsupport {margin:30px 0;}
#form-techsupportrma {margin:30px 0;}

input.btn{
border:none;
float:right;
background:#ccc;
padding:2px 6px;
cursor:pointer;
}

input.btn:hover{background:#b80000; color:#FFFFFF;}


/* ********** SLIDING PANELS ********** */

ul.slidingpanels li {clear:both;}
ul.slidingpanels li .content {display:none; height:auto;}
h2.slide {cursor:pointer; margin-top:0;}


/* ********** HEADINGS ********** */

.layout-3col .h-arcanas a, .layout-3col .h-arcasan a, .layout-3col .h-arcans a {
background:url(../images/h-arcanas.gif) no-repeat left top;
height:30px;
text-indent:-9999px;
margin-bottom:10px;
width:auto;
display:block;
}

.layout-3col .h-arcanas a span {text-indent:-9999px;}

.layout-3col .h-arcasan a{background-image:url(../images/h-arcasan.gif);}
.layout-3col .h-arcans a{background-image:url(../images/h-arcans.gif);}


/* ********** LINKS ********** */

strong.green, h1.green {color:#92D050; font-style:normal;}

.notopm {margin-top:0px;}
.nobottomm {margin-bottom:0;}
.mtop20 {margin-top:20px;}
.mtop10 {margin-top:10px;}
.mtopneg20 {margin-top:-20px;}
.clear {clear:both; height:1px; line-height:1px; font-size:1px;}


 .maincontent h2
{margin-top:0;}