﻿*
{
margin: 0;
padding: 0;
border: none;
outline: none;
list-style: none;
font-size: 1.0em;
font-weight: normal;
text-decoration: none;
behavior: url(/Content/img/iepngfix.htc);
}

body 
{
background: #43434b url(img/body-background.png) repeat-x left top;
font-size: 10px;
font-family: Lucida Grande, Arial;
color: #545454;
}

#wrapper
{
position: relative;
margin: 0 auto;
width: 956px; /*total width 956px*/
}

#branding
{
float: left;
width: 956px;
height: 159px; /*actual img height 209px*/
background: #000 url(img/branding-background.jpg) no-repeat left bottom;
}

#branding img
{
margin: 20px 28px;
}

#nav
{
float: left;
width: 956px;
height: 90px;
background: #000 url(img/nav-background.png) repeat-x left top;
}

#nav h1
{
float: left;
margin: 10px 0 0 30px;
font-family: Helvetica, Arial;
font-size: 1.3em;
letter-spacing: 0.2em;
color: #fff;
text-transform: uppercase;
}

#nav-main ul
{
clear: both;
float: left;
width: 956px;
background: #17212f url(img/nav-button-background.png) repeat-x left top;
}

#nav-main li
{
float: left;
/*width: 118px; */
overflow: hidden;
height: 21px;
padding: 6px 18px 0 18px;
border-left: solid 1px #000;
background: #17212f url(img/nav-button-background.png) repeat-x left top;
font-family: Helvetica, Arial;
font-size: 1.1em;
letter-spacing: 0.2em;
text-align: center;
text-transform: uppercase;
}

*+html #nav-main li
{
padding: 6px 19px 0 19px;
}

#nav-main li a
{
display: block;
/*width: 118px; */
color: #fff;
}

#nav-main li a:hover, #nav-main li a.current
{
color: #3996dd;
}

#search
{
float: right;
margin: 10px 20px;
position: relative;
}

#search label
{
float: left;
margin: 6px 5px 0 0;
font-family: Helvetica, Arial;
font-size: 1.1em;
letter-spacing: 0.2em;
text-transform: uppercase;
color: #999;
}

#search label.error 
{
 position: absolute;
 right: 0px;
 top: -40px;
}

#search .search-box
{
float: left;
width: 189px; /*total width 194px*/
height: 18px; /*total height 23px*/
padding: 5px;
background: url(img/search-box.gif) no-repeat left top;
font-size: 1.1em;
}

#SearchSubmitButton 
{
 position: absolute;
 right: 0;
}

#content
{
float: left;
width: 882px; /*total width 956px;*/
padding: 20px 37px;
min-height: 400px;
background: #fefefe url(img/content-background.png) repeat-y left top;
}

.background-column
{
float: left;
margin: -20px;
padding: 20px;
background: #fefefe url(img/background-column.png) repeat-y left top;
}

#footer
{
clear: both;
float: left;
width: 876px;
padding: 20px 40px;
border-top: solid 5px #000;
background-color: #17212f;
font-size: 1.1em;
line-height: 1.8em;
text-transform: uppercase;
letter-spacing: 0.2em;
color: #fff;
}

#footer-sitemap
{
float: left;
}

#footer-sitemap li
{
float: left;
}

#footer-sitemap a
{
border-left: solid 1px #3b668f;
padding: 0 10px;
font-size: 0.9em;
text-transform: lowercase;
color: #3996dd;
}

#footer-sitemap .first
{
border-left: none;
padding-left: 0;
}

#footer a:hover
{
color: #fff;
}

#footer-address
{
float: right;
text-align: right;
}

/*---------------------------- GLOBAL ELEMENTS ---------------------------------*/

hr
{
border: none 0;
border-bottom: solid 1px #c0c0c0;
height: 1px;
}

h1
{
margin-bottom: 0.5em;
font-family: Verdana, Arial;
font-size: 1.6em;
line-height: 1.8em;
letter-spacing: 0.1em;
text-transform: uppercase;
color: #000;
font-weight: bold;
}

*+html h1
{
font-weight: normal;
letter-spacing: 0.2em;
}

h1.subsection
{
float: left;
width: 429px; /*total width 449px*/
height: 24px; /*total height 24px*/
padding: 0px 20px 0 0;
margin-bottom: 15px;
background: url(img/header-background.gif) no-repeat left top;
font-family: Verdana, Arial;
font-size: 1.5em;
line-height: 1.5em;
letter-spacing: 0;
text-transform: none;
color: #1e3852;
text-align: right;
}

h1.subsection span
{
text-transform: uppercase;
color: #3b668f;
}

h2
{
margin-bottom: 0.5em;
font-family: Verdana, Arial;
font-size: 1.6em;
line-height: 1.2em;
letter-spacing: 0.1em;
text-transform: uppercase;
color: #3b668f;
font-weight: bold;
}

*+html h2
{
letter-spacing: 0.2em;
font-weight: normal;
}

h3
{
margin-bottom: 0.5em;
border-bottom: dashed 1px #999;
font-family: Verdana, Arial;
font-size: 1.3em;
line-height: 3.0em;
letter-spacing: 0.2em;
text-transform: uppercase;
color: #000;
}

h4
{
margin-bottom: 0.5em;
font-family: Verdana, Arial;
font-size: 1.3em;
line-height: 1.8em;
font-weight: bold;
}

#content p
{
margin-bottom: 1.5em;
font-size: 1.2em;
line-height: 1.8em;
}

#content a
{
color: #3b668f;
}

#content a:hover
{
color: #17212f;
text-decoration: underline;
}

.img-right
{
float: right;
margin-right: 15px;
padding: 4px;
border: solid 1px #c9c9c9;
}

/*--- Global List Styles ---*/

#content ul
{
margin-bottom: 1.5em;
font-size: 1.2em;
line-height: 1.6em;
}

#content ul.bullet li
{
margin-left: 20px;
margin-bottom: 5px;
list-style: disc outside;
}

#content ul.bullet-arrows li
{
padding-left: 20px;
background: url(/Content/img/bullet-double-arrows.gif) no-repeat left 50%;
}

.error 
{
 color: Red;
 border: dotted 1px red;
 background-color:#FFFFEF;
 padding: 10px;
 font-weight: bold;
}

/*--- Global Form Styles ---*/

.form-account 
{
clear: left;
}

.form-account label
{
clear: left;
float: left;
width: 100px;
margin-bottom: 5px;
font-size: 1.2em;
line-height: 1.5em;
}

.form-account input, .form-account select
{
float: left;
margin-bottom: 5px;
padding: 2px;
font-size: 12px;
border-top: solid 1px #a9a9a9;
border-left: solid 1px #c9c9c9;
border-right: solid 1px #a9a9a9;
border-bottom: solid 1px #c9c9c9;
}

.form-account .btn
{
clear: left;
margin: 10px 0;
padding: 3px;
border: none;
font-size: 12px;
}

.checkbox input
{
width: 15px;
height: 15px;
margin-top: 2px;
padding: 0;
}

.btn
{
width: 95px;
padding: 5px;
background: url(/Content/img/nav-button-background.png) repeat-x left top;
font-size: 12px;
color: #fff;
}

#content a.btn
{
display: block;
width: 95px;
background: url(/Content/img/nav-button-background.png) repeat-x left top;
text-align: center;
font-size: 12px;
line-height: 16px;
color: #fff;
}

.btn:hover, #content a.btn:hover
{
color: #74A4CF;
text-decoration: none;
}


strong {font-weight: bold;}
.left {float: left;}
.right {float: right;}
.clear {clear: both;}
.clear-left {clear: left;}
.clear-right {clear: right;}
label.error { color: Red; background-color: #FFFFDF; padding: 3px; border: dotted 1px #CCC;}
.txt-center {text-align: center;}

/*-------------------------- HOME PAGE -------------------------------------*/

#content-main
{
float: left;
margin-right: 45px;
margin-bottom: 20px;
width: 386px; /*total width: 426px*/
}

#content-main p
{
color: #545454;
}

#img-welcome
{
float: right;
margin: 40px 0 0 10px;
}

.product-intro
{
clear: right;
float: right;
width: 419px;
padding: 0 15px;
margin-top: 15px;
}

.product-intro h1.subsection
{
margin-left: -15px;
}

.list-parts
{
float: left;
width: 100%;
}

.list-parts li
{
float: left;
width: 43%;
margin-right: 2%;
padding-left: 20px;
background: url(/Content/img/bullet-double-arrows.gif) no-repeat left 65%;
font-size: 1.1em;
}

.category-list
{
float: left;
width: 130px;
margin-left: 14px;
}

.category-list.first
{
margin-left: 0;
}

.category-list ul
{
text-align: left;
}

.category-list li a, .category-list a
{
font-size: 1.2em;
line-height: 1.5em;
}

.category-list img
{
margin-bottom: 5px;
border: solid 1px #c9c9c9;
}

/*-------------------------- ONLINE STORE -------------------------------------*/

.store-category-list
{
float: left;
width: 42%;
margin-right: 5%;
}

.store-category-list
{
font-size: 1.2em;
}

/*------------- List Products -----------------------*/

#ListProducts
{
float: left;
margin-top: 10px;
}

#ListProducts li
{
float: left;
width: 400px;
margin-right: 40px;
margin-bottom: 10px;
border-bottom: solid 1px #e6e6e6;
}

#ListProducts li img
{
float: left;
margin-right: 10px;
}


/*------------- Show Product ------------------------*/

#ProductInfo
{
float: left;
width: 50%;
}

#ProductInfo li
{
margin-bottom: 10px;
}

#ProductImages
{
float: right;
width: 408px;
}

#ProductImages .img-main
{
margin-bottom: 5px;
border: solid 4px #e6e6e6;
}

#ProductImages ul
{
float: left;
}

#ProductImages li
{
float: left;
padding: 4px 3px;
}

#ProductImages li img
{
border: solid 2px #e6e6e6;
}

/*------------- CHART- View Cart, View Orders (My Account) ------------------------*/

#ViewCart, #ViewOrders
{
width: 100%;
margin-bottom: 20px;
font-size: 1.2em;
border-collapse: collapse;
border: solid 1px #c9c9c9;
background-color: #FFF;
}

#ViewCart th, #ViewOrders th
{
padding: 5px;
font-weight: bold;
color: #fff;
background-color: #17212F;
border-bottom: solid 1px #c9c9c9;
text-align: left;
}

#ViewCart td, #ViewOrders td
{
padding: 3px 5px;
}

#ViewCart th#SKU
{
width: 10%;
}

#ViewCart th#Name
{
width: 50%;
}

#ViewCart th#Quantity
{
width: 8%;
}

#ViewCart input#Qty
{
width: 35px;
border-top: solid 1px #a9a9a9;
border-left: solid 1px #c9c9c9;
border-right: solid 1px #a9a9a9;
border-bottom: solid 1px #c9c9c9;
}

#ViewCart th#Price
{
width: 8%;
}

#ViewCart .btn-update
{
background: none;
text-align: left;
cursor: pointer;
color: #3b668f;
font-size: 12px;
font-family: Lucida Grande, Arial;
}

#ViewCart .btn-update:hover
{
color: #17212f;
text-decoration: underline;
}

#OrderTotals
{
float: right;
width: 260px;
margin-right: 5px;
font-size: 1.2em;
text-align: right;
border-collapse: collapse;
}

#OrderTotals td
{
padding: 3px;
padding-left: 25px;
}

#OrderTotals .label
{
text-align: left;
}

#OrderTotals tr#FinalTotal td
{
font-weight: bold;
color: #17212F;
}



#ViewCartActions
{
float: right;
clear: right;
}

#CreditCardInfo
{
float: right;
width: 235px;
margin: 20px 5px 20px 0;
}

#Policies
{
float: left;
width: 520px;
margin-top: 20px;
padding: 20px;
background-color: #f4f4f4;
border: solid 1px #c9c9c9;
} 



/*-------------------------- ACCOUNT --------------------------------------------*/

/*------------- Login, Register, Edit ------------------------*/

#Login
{
margin-bottom: 10px;
}

#Register, #UpdateAccount, #ChangePassword
{
margin-top: 20px;
}

#Register label, #UpdateAccount label 
{
width: 120px;
}

#ChangePassword label
{
width: 150px;
}

#Login label.error
{
clear: none;
float: left;
width: 250px;
margin-left: 5px;
padding: 0 3px;
}


#Register.form-account form label.error 
{
 clear: both;
 width: 240px;
}
/*--------------------My Account, Review Order --------------*/

#MyAccountNav ul
{
float: left;
width: 100%;
margin-left: -3px;
border-bottom: solid 1px #c9c9c9;
}

#MyAccountNav li
{
float: left;
background-color: #dcdcdc;
margin-right: 3px;
border-top: solid 1px #a9a9a9;
border-left: solid 1px #c9c9c9;
border-right: solid 1px #a9a9a9;
}

#MyAccountNav a
{
display: block;
padding: 3px 15px;
}

#MyAccountNav a:hover
{
text-decoration: none;
background-color: #17212F;
color: #fff;
}

#MyAccountNav li a.current
{
background-color: #fff;
color: #222B39;
}

.customer-info /* View Order Details */
{
float: left;
width: 40%;
}

p#order-status /* View Order Details */
{
clear: right;
float: right;
margin-right: 5px;
font-weight: bold;
}

#MyAccountContact, #MyAccountBilling
{
float: left;
width: 33%;
margin-bottom: 10px;
}

#link-add-shipping, #link-edit-shipping
{
float: left;
margin-left: 20px;
margin-bottom: 0;
}

#shipping-addresses
{
clear: left;
}

#shipping-addresses li
{
float: left;
width: 33%;
}

.my-account-info
{
clear: left;
}

#SubmitOrder label.error 
{
 width: 150px;
 margin-left: 100px;
}