@import url(../StyleSheet.css);

#FeaturedProducts:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
#FeaturedProducts { zoom: 1; }

.labelInField { position: relative; }
.labelInField label { position: absolute; top: 3px; left: 4px; }

a.button, input.button, button.button {
    background: #b0bc22; 
    padding: 3px 6px; 
    margin: 0;
    border: 0;
    color: #fff; 
    text-decoration: none; 
    text-transform: uppercase; 
    font-size: 1.1em; 
    font-weight: bold;
    cursor: pointer;
    font-family: Arial, Verdana;
    overflow: visible;
}
a.button { display: inline-block; padding: 5px 8px; }
a.button:hover, input.button:hover { background-color: #C4CF40; text-decoration: none; }
a.moreInfo {
    background: #036cb6;
    color: #fff;
    text-decoration: none;
    padding: 10px 14px;
    display: inline-block;
    text-transform: uppercase;
    font-weight: bold;
    font-size: 12px;
    line-height: 12px;
}
a.moreInfo:hover { background: #2b84c2; text-decoration: none; }

.summary { font-family: Helvetica, Arial, Verdana; font-size: 1.3em; line-height: 1.5em; color: #666; }
.summary h1 { font-weight: normal; margin: 0 0 .5em; color: #666; }

#canvas { 
    width: 960px;
    margin: 0 auto;
}
#header { position: relative; height: 137px; z-index: 200; }
#body { margin: 0 0 15px; }
#headerRight { float: right; }
#headerLeft { float: left; }
#headerLogo { margin: 0 0 15px; }
#accountInfo { font-size: 11px; background: #f2f2f2; color: #4d4c4c; padding: 5px 10px; float: right; margin: 0 0 20px; }
#accountInfo .cartItems { background: url(Canvas/Cart-Icon.gif) top left no-repeat; padding-left: 26px; }
#searchContainer { position: relative; float: right; clear: right; margin: 0 0 20px; border: 2px solid #f2f2f2; width: 271px; }
#mediaSearchContainer { position: relative; float: left; clear: left; margin: 0 0 20px; border: 2px solid #f2f2f2; width: 271px; }
#searchContainer .wrapper, #mediaSearchContainer .wrapper { border: 1px solid #c6c6c6; background: #b0bc22; float: right; }
#searchContainer label, #mediaSearchContainer label { color: #999; text-transform: uppercase; }
#searchContainer input.text, #mediaSearchContainer input.text { border: 0; width: 239px; padding: 3px; float: left; }
#searchContainer input.button, #mediaSearchContainer input.button { 
    background: url(Canvas/Search-Button.gif) top left no-repeat;  
    border: 0;
    width:24px;
    height:22px;
    overflow:hidden;
    margin:0;
    padding:0;
    float: right;
    cursor: pointer;
    cursor: hand;
}

ul#contactNav, ul#contactNav li { margin: 0; padding: 0; list-style-type: none; text-transform: uppercase; }
ul#contactNav li.phone { background: url(Canvas/Phone-Icon.gif) top left no-repeat; }
ul#contactNav li { padding: 5px 0 5px 20px; }

#footer { border-top: 1px solid #d7d7d7; padding: 15px 0; }
#footer ul, #footer ul li { padding: 0; margin: 0; list-style-type: none; }
#footer ul { width: 450px; float: left; }
#footer ul ul { width: auto; float: none; }
#footer ul li { font-size: .96em; }
#footer ul li, #footer ul li a { color: #424242; }
#footer ul li h3 { margin: 0 0 8px; font-weight: normal; font-size: 1.1em; }
#footer ul li { float: left; width: 140px; margin: 0 10px 0 0; }
#footer ul li li { float: none; width: auto; margin: 0 0 4px; }
#footer ul li.socialMedia li { 
    float: none; width: auto; margin: 0 0 4px; 
    padding: 2px 0 2px 20px;
    background: url(Canvas/Social-Media-Icons.gif) top left no-repeat;
}
#footer ul li.socialMedia li.facebook { background-position: 0 -23px; }
#footer ul li.socialMedia li.linkedin { background-position: 0 -46px; }
#footer ul li.socialMedia li.twitter { background-position: 0 -70px; }
#footer ul li.socialMedia li.digg { background-position: 0 -93px; }
#footer ul li.socialMedia li.youtube { background-position: 0 -118px; }
#footer ul li.socialMedia li.share { background-position: 0 -143px; }

.FooterSection1 #footer .FooterSection1 h3 { color: #f15c22; border-bottom: 2px solid #f15c22; padding-bottom: 3px; margin-bottom: 4px; }
.FooterSection1 #leftContent ul.menu { border-color: #f15c22; }
.FooterSection1 #leftContent ul.menu li a { color: #f15c22; }
.FooterSection2 #footer .FooterSection2 h3 { color: #889212; border-bottom: 2px solid #889212; padding-bottom: 3px; margin-bottom: 4px; }
.FooterSection2 #leftContent ul.menu { border-color: #889212; }
.FooterSection2 #leftContent ul.menu li a { color: #889212; }

#footer h3.joinMailingListHeader, #footer .joinMailingList, #footer .copyright { float: right; clear: right; }
#footer .joinMailingList {
    border: 2px solid #f2f2f2;
    background: #b0bc22;
}
#footer h3.joinMailingListHeader {
    background: url(Canvas/Email-Icon.gif) 0 2px no-repeat;
    padding: 0 0 0 25px;
    margin: 0 0 10px;
}
#footer .joinMailingList .wrapper { border: 1px solid #c6c6c6; background: #b0bc22; padding-right: 58px; }
#footer .joinMailingList input.text { border: 0; width: 180px; float: left; }
#footer .joinMailingList label { color: #999; text-transform: uppercase; font-size: 11px; }
#footer .joinMailingList input.button { 
    border: 0;
    margin:0;
    padding:3px 0 0;
    width: 54px;
    background: transparent;
    color: #fff;
    text-transform: uppercase;
    font-weight: bold;
    font-size: 12px;
    cursor: pointer;
    cursor: hand;
    float: right;
    position: absolute;
    top: 0;
    right: 2px;
}

ul#mainNav { clear: right; position: absolute; top: 85px; right: 0; }
ul#mainNav, ul#mainNav li, ul#mainNav ul { margin: 0; padding: 0; list-style-type: none; }
ul#mainNav li, ul#mainNav a { color: #424242; }
ul#mainNav li { position: relative; float: left; margin: 0 0 0 5px; }
ul#mainNav li a.root { 
    font-size: 14px; 
    display: block; 
    margin: 0; 
    position: relative; 
    z-index: 6;
    float: left;
    text-decoration: none;
    padding: 0 10px;
}
ul#mainNav li.active a.root { z-index: 100; }
ul#mainNav li a.root span { 
    display: block; 
    float: left; 
    border-style: solid; 
    border-width: 2px 0 0; 
    padding: 10px 0 0 0; 
    height: 40px; 
    cursor: pointer;
}
ul#mainNav li a.root:hover, ul#mainNav li a.mainNavOver { padding: 0; }
ul#mainNav li a.root:hover span, 
ul#mainNav li a.mainNavOver span,
ul#mainNav li.active a.mainNavOver span { border-width: 2px 1px 0; padding: 10px 9px 0; }
ul#mainNav li.noChildren a.root:hover span { border-bottom-width: 2px;  }
ul#mainNav li.active a.root:hover span { border-bottom-width: 0 !important; }

ul#mainNav li a.mainNavOver span, ul#mainNav li a.root:hover span { background-color: #eee; }

ul#mainNav li.noChildren a.root:hover span { border-bottom-width: 2px !important; }
ul#mainNav li ul { 
    z-index: 5; 
    padding: 15px 15px; 
    position: absolute; 
    top: 51px; left: 0; 
    border-style: solid; 
    border-width: 1px 1px 2px 1px; 
    width: 222px; 
    background-color: #eee;
}
ul#mainNav li.active ul { z-index: 99; }
ul#mainNav li ul.offsetFromRight { left: auto; right: 0; }
ul#mainNav ul li { float: none; border-top: 1px solid #ccc; padding: 5px 0 0; margin: 5px 0 0; zoom: 1; }
ul#mainNav ul li.first { margin-top: 0; border-top: 0; padding-top: 0; }
ul#mainNav ul li a span { display: block; }

/*ul#mainNav li.ContentSection1 a.root span { width: 73px; }*/
ul#mainNav li.ContentSection1 a.root span { border-color: #f15c22 #fbd0bf; }
ul#mainNav li.ContentSection1 a.mainNavOver span, ul#mainNav li.ContentSection1 a.root:hover span { background-color: #fdf7f4; color: #f15c22; }
ul#mainNav li.ContentSection1 ul { background: #fdf7f4; border-color: #fbd0bf #fbd0bf #f15c22; }
ul#mainNav li.ContentSection1 ul a { color: #f15c22; }
ul#mainNav li.ContentSection1 ul li { border-color: #fbd0bf; }
div.ContentSection1 #leftContent ul.menu { border-color: #f15c22; }
div.ContentSection1 #leftContent ul.menu li a { color: #f15c22; }
div.ContentSection1 ul#mainNav li.ContentSection1 a span { border-bottom-width: 2px; }

/*ul#mainNav li.ContentSection2 a.root span { width: 110px; }*/
ul#mainNav li.ContentSection2 a.root span { border-color: #b0bc22 #d3d98d; }
ul#mainNav li.ContentSection2 a.mainNavOver span, ul#mainNav li.ContentSection2 a.root:hover span { background-color: #f7f8e9; color: #b0bc22; }
ul#mainNav li.ContentSection2 ul  { background: #f7f8e9; border-color: #d3d98d #d3d98d #b0bc22; }
ul#mainNav li.ContentSection2 ul a { color: #b0bc22; }
ul#mainNav li.ContentSection2 ul li { border-color: #d3d98d; } 
div.ContentSection2 #leftContent ul.menu { border-color: #b0bc22; }
div.ContentSection2 #leftContent ul.menu li a { color: #b0bc22; }
div.ContentSection2 ul#mainNav li.ContentSection2 a span { border-bottom-width: 2px; }

/*ul#mainNav li.ContentSection3 a.root span { width: 90px; }*/
ul#mainNav li.ContentSection3 a.root span { border-color: #036cb6 #7bacce; }
ul#mainNav li.ContentSection3 a.mainNavOver span, ul#mainNav li.ContentSection3 a.root:hover span { background-color: #eef5f9; color: #036cb6; }
ul#mainNav li.ContentSection3 ul { background: #eef5f9; border-color: #7bacce #7bacce #036cb6; }
ul#mainNav li.ContentSection3 ul a { color: #036cb6; }
ul#mainNav li.ContentSection3 ul li { border-color: #7bacce; }
div.ContentSection3 #leftContent ul.menu { border-color: #036cb6; }
div.ContentSection3 #leftContent ul.menu li a { color: #036cb6; }
div.ContentSection3 ul#mainNav li.ContentSection3 a span { border-bottom-width: 2px; }

/*ul#mainNav li.ContentSection4 a.root span { width: 73px; }*/
ul#mainNav li.ContentSection4 a.root span { border-color: #87b2d8; }
ul#mainNav li.ContentSection4 a.mainNavOver span, ul#mainNav li.ContentSection4 a.root:hover span { background-color: #ecf3f9; color: #6393bd; }
ul#mainNav li.ContentSection4 ul, ul#mainNav li.mainNav4 ul li { background: #ecf3f9; border-color: #87b2d8; }
ul#mainNav li.ContentSection4 ul a { color: #6393bd; }
div.ContentSection4 #leftContent ul.menu { border-color: #87b2d8; }
div.ContentSection4 #leftContent ul.menu li a { color: #6393bd; }
div.ContentSection4 ul#mainNav li.ContentSection4 a span { border-bottom-width: 2px; }

/*ul#mainNav li.ContentSection5 a.root span { width: 128px; }*/
ul#mainNav li.ContentSection5 a.root span { border-color: #003468 #b2c2d1; }
ul#mainNav li.ContentSection5 a.mainNavOver span, ul#mainNav li.ContentSection5 a.root:hover span { background-color: #f3faff; color: #003468; }
ul#mainNav li.ContentSection5 ul { background: #f3faff; border-color: #b2c2d1 #b2c2d1 #003468; }
ul#mainNav li.ContentSection5 ul a { color: #003468; }
ul#mainNav li.ContentSection5 ul li { border-color: #5b7fa3; }
div.ContentSection5 #leftContent ul.menu { border-color: #003468; }
div.ContentSection5 #leftContent ul.menu li a { color: #003468; }
div.ContentSection5 ul#mainNav li.ContentSection5 a span { border-bottom-width: 2px; }

/*ul#mainNav li.ContentSection6 a.root span { width: 40px; }*/
ul#mainNav li.ContentSection6 a.root span { border-color: #f8971d; }
ul#mainNav li.ContentSection6 a.mainNavOver span, ul#mainNav li.ContentSection6 a.root:hover span { background-color: #fdf7f4; color: #f8971d; }
ul#mainNav li.ContentSection6 ul, ul#mainNav li.mainNav6 ul li { background: #fdf7f4; border-color: #f8971d; }
ul#mainNav li.ContentSection6 ul a { color: #f8971d; }
div.ContentSection6 #leftContent ul.menu { border-color: #f8971d; }
div.ContentSection6 #leftContent ul.menu li a { color: #f8971d; }
div.ContentSection6 ul#mainNav li.ContentSection6 a span { border-bottom-width: 2px; }

.CategorySection1 #leftContent ul.menu { border-color: #87b2d8; }
.CategorySection1 #leftContent ul.menu li a { color: #6393bd; }

.CategorySection2 #leftContent ul.menu { border-color: #d3d98d; }
.CategorySection2 #leftContent ul.menu li a { color: #b0bc22; }

.CategorySection3 #leftContent ul.menu { border-color: #fbd0bf; }
.CategorySection3 #leftContent ul.menu li a { color: #f15c22; }

.CategorySection4 #leftContent ul.menu { border-color: #d3d98d; }
.CategorySection4 #leftContent ul.menu li a { color: #b0bc22; }

.CategorySection5 #leftContent ul.menu { }
.CategorySection5 #leftContent ul.menu li a { }

.CategorySection6 #leftContent ul.menu { }
.CategorySection6 #leftContent ul.menu li a { }

.CategorySection7 #leftContent ul.menu { }
.CategorySection7 #leftContent ul.menu li a { }

.focusArea { margin: 0 0 15px; }
.focusArea .item { width: 220px; overflow: hidden; float: left; margin: 0 25px 13px 0; position: relative; }
.focusArea .catalogItem { margin:0 15px 13px 0; }
div.focusArea .last { margin-right: 0; }
.focusArea .item a { display: block; text-decoration: none; display: block; }
.focusArea .item .overlay { 
    width: 230px; height: 30px; 
    background: #333; 
    position: absolute;
    bottom: 0;
    left: 0;
    opacity: .7;
    filter: alpha(opacity=70);
    display: block;
}
.focusArea .item .caption {
    width: 218px; 
    height: 23px;
    color: #fff;
    position: absolute;
    bottom: 0;
    left: 0;
    font-family: "Century Gothic", Verdana, Arial;
    font-size: 13px;
    text-transform: uppercase;
    background: url(Canvas/White-Arrow.gif) 0 2px no-repeat;
    padding: 0 0 0 12px;
    display: block;
    cursor: pointer;
}
#FeaturedProducts .item { float: left; margin-right: 10px; }

.sortClassContainer { background: #F2F2F2; }
table.sortClass { margin: 0; }
table.sortClass td { padding: 10px 0 10px 10px; }

table.engineTable td { padding: 0 10px 8px 0; }
.productPager .pagerFrame table.CatalogPriceDisplay { margin: 0; }
.productPager .pagerFrame table.CatalogPriceDisplay .ListPriceLabelCell { text-align: left; }
.productPager .pagerFrame table.CatalogPriceDisplay .PriceLabelCell { text-align: left; }
.productPager .pagerFrame table.CatalogPriceDisplay .PriceDisplayCell { font-weight: bold; }
.productPager .pagerFrame table.CatalogPriceDisplay .Strike { text-align: left; text-decoration: line-through; }
.productPager .pagerFrame table.ListItemTable { margin: 0; }
.productPager .pagerFrame td { vertical-align: top; }
.productPager .pagerFrame table.ListItemTable .Image { text-align: left; padding: 0; }
.productPager .pagerFrame table.ListItemTable .Price { padding: 0; }
.productPager .pagerFrame table.ListItemTable .AddToCart { text-align: left; padding: 8px 0 0; }
.productPager .pagerFrame table.ListItemTable .Quantity { text-align: left; padding: 0 !important; height: 28px; }
.productPager .pagerFrame table.ListItemTable .Name { font-weight: bold; text-align: left; padding: 30px 0 0; vertical-align: top; }



/* modal window */
#control_overlay { background-color: #000; }
.modalOverlay { background-color: #000; }
#modal_overlay { background: #000; }
/*#modal_container { background-color: #fff; padding: 10px; border: 1px solid #333; }*/

/* Cart Action */
div.cartActionContent
{
    width: 410px;
    background-color: #013469;
    padding: 6px;
}

div.cartActionContent div.leftMessage { float: left; }

div.cartActionContent div.closeButton
{
    cursor: pointer;
    float: right;
    margin: 0 0 4px 0;
}

div.cartActionContent div.content
{
    clear: both;
    background-color: #fff;
    padding: 4px;
}

div.cartActionContent div.action
{
    margin: 6px 0 6px 0;
    float: right;
}

.productDescription { width: 500px; float: left; padding-right: 0 !important; }

table.cartSummaryHeader { padding-top: 0 !important; }

ul.CartToolCommand, ul.CartToolCommand li {
    margin: 0;
    padding: 0;
    list-style-type: none;
}
ul.CartToolCommand:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
ul.CartToolCommand { zoom: 1; margin: 0 0 15px; }
ul.CartToolCommand li { 
    float: left; 
    background: #c3c3c3 ; 
    text-transform: uppercase;
    color: #fff;
    padding: 3px 3px 3px 8px;
    font-weight: bold;
    font-size: 12px;
    position: relative;
}
ul.CartToolCommand li span {
    position: absolute;
    top: 0;
    right: -15px;
    display: block;
    width: 15px;
    height: 23px;
    background: url(Canvas/Wizard-Divider.gif) top left no-repeat;
}
ul.CartToolCommand li.current { background-color: #8c8c8c; }
ul.CartToolCommand li.current span { background-position: 0 -23px; }
ul.CartToolCommand li.completed { background-color: #ddd; }
ul.CartToolCommand li.completed span { background-position: 0 -46px; }
ul.CartToolCommand li.Shipping { z-index: 7; }
ul.CartToolCommand li.Billing { z-index: 6; padding-left: 22px; }
ul.CartToolCommand li.Review { z-index: 5; padding-left: 22px; }
ul.CartToolCommand li.Complete { z-index: 4; padding-left: 22px; }

/*==== Autocomplete ==========================================================*/
div.AutoCompleteWrapper { position: relative; }
div.AutoComplete
{
    position: absolute;
    width: 500px !important;
    background-color: white;
    border: 1px solid #000000;
    top: 0 !important;
    left: 0 !important;
    margin: 0px;
    padding: 0px;
    overflow: hidden !important;
}
div.AutoComplete ul { list-style-type: none; margin: 0px; padding: 0px; }
div.AutoComplete ul li.selected { background-color: #f2f2f2; }
div.AutoComplete ul .itemId { color: #486CB5; }
div.AutoComplete ul li.selected .itemId { font-weight: bold; }
div.AutoComplete ul li
{
    list-style-type: none;
    display: block;
    margin: 0;
    width: 500px;
    cursor: pointer;
    font-size: 11px;
    outline: none;
    background-color: #fff;
    text-decoration: none;
    padding: 1px 0 1px 5px;
    border-bottom: 1px solid #f2f2f2;
}
div.AutoComplete ul li td.price
{
    font-weight: normal;
    vertical-align: middle;
    font-style: italic;
}
div.AutoComplete ul li td.itemName
{
    font-size: 11px;
    font-weight: normal;
    height: 25px;
    vertical-align: middle;
}

/*==== Tooltip ================================================================*/
/* TIP */
div.Tip
{
    background-color: #fff;
    border: solid 1px #796c63;
    padding: 4px;
    z-index: 125;
    height: 100%;
    text-align: left;
}

div.Tip p
{
    margin: 0;
    padding: 0;
    width: 250px;
    text-align: left;
}

div.TipContainer
{
    padding: 10px;
    position: absolute;
    z-index: 100;
    text-align: left;
}

/*==== Case Study List =======================================================*/
table.CaseStudyList td { padding: 0 0 15px 0; line-height: 1.5em; }
table.caseStudyFilter { margin: 0; }
table.caseStudyFilter td { vertical-align: bottom; padding: 3px 10px 3px 0 !important; }

.cartSummaryContainer { border: 1px solid #eee; }
.accountContainer { border: 1px solid #eee; padding: 15px !important; }

#AddressValidation table.engineTable { width: 100%; border-collapse: collapse; }
#AddressValidation table.engineTable td.background { width: 50%; padding: 5px !important; }
#AddressValidation table.engineTable td td { width: 50%; }