/* colors codes
 *
 * orange 		- #F26322
 * dark gray 	- #87898A
 * light gray 	- #CCCCCC    or    #EEEEEE
 *
 */

/*
----------------------------------------
01. default elements
----------------------------------------
*/

* { margin:0; padding:0; }
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin:0px; padding:0; border:0; vertical-align:baseline }
/* this is a hack because the body was dropping down but no margin/padding was being registered */
body { position:absolute; top:0; left:0; right:0; }
ul.menu, li.menu, ol.menu { list-style:none; }
/* render html5 elements as block */
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display:block; }

html { font-size:100%; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; text-size-adjust:100%; }

sub, sup { position:relative; font-size:75%; line-height:0; vertical-align:baseline; }

sup { top:-0.5em; }

sub { bottom:-0.25em; }

img { max-width:100%; vertical-align:middle; border:0; -ms-interpolation-mode:bicubic; }

textarea:focus,
input[type="text"]:focus,
input[type="password"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="time"]:focus,
input[type="week"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="color"]:focus,
.uneditable-input:focus { border-color:rgba(82, 168, 236, 0.8); outline:0; outline:0; box-shadow:none; border-radius:0; }

h1, h2, h3, h4, h5, h6 { font-weight:normal; line-height:1em; }

body { font-family:Arial, Helvetica, sans-serif; background:#FFFFFF; }
.nowrap { white-space:nowrap; }
.show { display:block; }
.hide { display:none; }

.show1 { display:block; }
.hide1 { display:none; }

a { text-decoration:none; outline:0; }
a:hover, a:focus { text-decoration:underline; }

p { font-size:14px; color:#333333; line-height:1.3em; }
p a { color:#f26321; }

h1 { font-size:53px; color:#af2401; }
h1 a { color:#af2401; }

h2 { font-size:21px; color:#333333; font-weight:bold; }
h2 a { color:#333333; }

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

/*
----------------------------------------
02. wrapper
----------------------------------------
*/

.wrapper { margin:0 auto; }

/* From 768px to 1920px scale the main content to 60px less than the width of the window */
@media (min-width:768px) {
  .wrapper { width: calc(100% - 60px); }
}

/* From 1920px to beyond leave the main content at 1860px width at most */
@media (min-width:1920px) {
  .wrapper { width: 1860px; }
}

/*
----------------------------------------
03. header
----------------------------------------
*/

header { width:100%; float:left; padding:12px 0 0 0; }
header .logo { float:left; line-height:.5em; padding-bottom:18px; position:relative; z-index:1; }
header .phone { text-align:right; font-weight:bold; padding-right:50px; }
header .phone a, header .phone a:visited, header .phone a:active { color:#eb6b08; text-decoration:none; margin-left:40px; }
header .lang { display:inline; padding-right:20px; }

header aside { padding:18px 38px 0 0; display:flex; justify-content:flex-end; align-items:center; position:relative; z-index:1; }
header aside p { font-size:15px; font-weight:bold; padding:0 12px 0 0; }
header aside p a { color:#3a3a3a; }
header aside ul { display:flex; font-size:14px; }
header aside ul li { background:url(/images/divider01.gif) no-repeat 0 1px; color:#4f545c; line-height:1em; padding:0 12px; }
header aside ul li.nodivider { background:none; }
header aside ul li a { color:#4f545c; }
header aside ul li a .cartText,
header aside ul li a.switchAccount { color:#eb6b08; font-weight:bold; }
header aside ul li a.logout { background:url(/images/icon_logout.png) no-repeat center left; padding-left:28px; }

header .announcement-wrapper {
  margin: 10px auto;
  display: flex;
  align-items: center;
  flex-direction: column;
  font-size: 14px;
  clear: both;
}
header .announcement-wrapper .announcement {
  display: flex;
  flex-direction:column;
  padding: 10px;
  border-top: 5px solid #f26322;
  background: #84868b url(/images/gradient01.gif) repeat-x top left;
  color: #FFF;
}

nav { display:inline-block; margin:auto ; background:#eaeaed; background:-moz-linear-gradient(#f4f4f6, #eaeaed); background:-webkit-gradient(linear, left top, left bottom, from(#f4f4f6), to(#eaeaed)); background:-o-linear-gradient(#f4f4f6, #eaeaed); -pie-background:linear-gradient(#f4f4f6, #eaeaed); border-radius:4px; behavior:url(/css/PIE.htc); position:relative; border:1px solid #bfc2c4; margin-bottom:-20px; position:relative; z-index:90; }

nav ul { font-size:14px; }
nav ul li { height:40px; float:left; background:url(/images/divider02.gif) no-repeat top left; line-height:1em; padding-left:2px; }
nav ul li.bordernone { background:none; padding-left:0; }
nav ul li.bordernone a { border-radius:4px 0 0 4px; behavior:url(/css/PIE.htc); position:relative; padding:12px 17px 0 17px; }
nav ul li.last a { border-radius:0 4px 4px 0; behavior:url(/css/PIE.htc); position:relative; }
nav ul li a { height:28px; float:left; text-decoration:none; color:#4e525a; padding:12px 14px 0 14px; }
nav ul li a:hover { text-decoration:none; background:#eaeaed; }
nav ul li a.active { background:#eaeaed; }

.nav-collapse { width:100%; display:inline-block; text-align:center; margin-bottom:16px; }
.nav-collapse .on a { color:#4e525a; background:#999999; background:-moz-linear-gradient(#eaeaed, #999999); background:-webkit-gradient(linear, left top, left bottom, from(#eaeaed), to(#999999)); background:-o-linear-gradient(#eaeaed, #999999); -pie-background:linear-gradient(#eaeaed, #999999); border-radius:6px 6px 0 0; }
.nav-collapse .on a .icon-bar {  background:url(/images/icon_bardown.png) no-repeat; }
.nav-collapse .over a { cursor:pointer; }

/* From 1920px to beyond push nav up*/
@media (min-width:1920px) {
  .nav-collapse {
    position: absolute;
    top: 42px;
    left: 0;
    right: 0;
  }
}

/*
----------------------------------------
04. searchbar
----------------------------------------
*/

.searchbar { width:100%; min-height:146px; float:left; background:#84868b url(/images/gradient01.gif) repeat-x top left; border-bottom:5px solid #f26322; padding:12px 0 0 0; }
.searchbar label { width:25.8%; float:left; font-size:16px; color:#FFFFFF; font-weight:bold; text-align:right; padding:5px 2.7% 0 0; }

.searchbar .input { width:47%; height:17px; float:left; background:#4d5259; border:none; box-shadow:inset #2a2d31 0 1px 1px, #75797f -1px 1px 1px; border-radius:4px; behavior:url(/css/PIE.htc); position:relative; font-size:13px; color:#bbbbbb; font-style:italic; padding:6px 1.1%; margin-right:15px; }

.searchbar .button { width:125px; height:29px; float:left; background:#f26322 url(/images/icon_search01.gif) no-repeat left center; border:none; border-radius:3px; behavior:url(/css/PIE.htc); position:relative; font-size:14px; color:#FFFFFF; font-weight:bold; text-decoration:none; text-align:center; cursor:pointer; padding-left:18px; }

.searchbar .button:hover { background:#e56328 url(/images/icon_search01.gif) no-repeat left center; }
 
.searchbar .input.ui-autocomplete-loading { background:url(/images/loading_grey_orange.gif) no-repeat right center; }

/*
----------------------------------------
05. buttons
----------------------------------------
*/

.buttonadd { float:left; }
.buttonadd a { width:135px; height:25px; float:left; background:#f26322; box-shadow:#bbb 0 1px 2px; border-radius:4px; behavior:url(/css/PIE.htc); position:relative; font-size:14px; color:#FFFFFF; text-decoration:none; text-align:center; font-weight:bold; cursor:pointer; white-space:nowrap; padding:9px 15px 0 5px; }
.buttonadd a span { background:url(/images/icon_shopingcart02.gif) no-repeat; text-align:center; padding:2px 0 2px 27px; }
.buttonadd a:hover { background:#e56328; }

/*
----------------------------------------
06. content
----------------------------------------
*/

#bgcontentbox { width:calc(100% - 30px); float:left; background:url(/images/shadow01_wide.png) no-repeat bottom center; padding:0 10px 102px 10px; margin:-112px 0 0 0; position:relative; }
#contentbox { width:100%; float:left; background:#FFFFFF; border-radius:3px 3px 0 0; behavior:url(/css/PIE.htc); position:relative; }

#content { width:calc(100% - 67px); min-height:250px; float:left; padding:20px 20px 0 20px; margin:0 0 -67px 0; position:relative; }
.content-heading { margin-top:10px; margin-bottom:10px; padding-left:10px; width:100%; }

/*
----------------------------------------
06. 01 content - leftpanel
----------------------------------------
*/

#leftpanel { width:18.4%; float:left; }

/*
 * orange:#E56328
 * 
 * f26322
 */

.sidebar { width:100%; float:left; padding-bottom:19px; }
.sidebar .expand_all, .collapse_all { width:100%; float:left; cursor:pointer; }
.sidebar .menu { width:100%; float:left; position:relative; }
.sidebar .menu article.collapsed { display:none; }
.sidebar .menu article ul { margin:0px; padding:0px; width:100%; }
.sidebar .menu article ul li { margin:0px; padding:0px; width:100%; }
.sidebar .menu article ul li a { border:1px solid #FFFFFF; }
/* 2 classes, .selected is for permanent selection, .active is for hover */
.sidebar .menu article ul li.selected a, .sidebar .menu article ul li.active a { border:1px solid #333333; }
.sidebar .menu article ul li a { margin:0px; padding:10px 0px 10px 20px; box-sizing: border-box; color:#E56328; }
.sidebar .menu article ul li.active a, .sidebar .menu article ul li.selected a { text-decoration:none; color:#E56328; }

.categories { width:99.5%; float:left; background:#eeeeee; border:1px solid #dfdfdf; border-radius:3px; behavior:url(/css/PIE.htc); position:relative; padding:15px 0 0 0; }
.categories h3 { color:#4e535a; font-weight:bold; padding:0 0 15px 19px; }
.categories h3 a { color:#4e535a; font-weight:bold; padding:0 0 15px 19px; text-decoration:none; }
.categories h3 a:hover { text-decoration:none; }
.categories ul { width:100%; float:left; font-size:13px; font-weight:bold; }
.categories ul li { width:100%; float:left; background:url(/images/divider04.gif) repeat-x top left; line-height:1em; }
.categories ul li a { width:100%; float:left; color:#000000; text-decoration:none; cursor:pointer; padding:12px 0; }
.categories ul li a.name { display: flex; justify-content: space-between; align-items: center; }
.categories ul li a span { float:left; padding:0 23px 0 11px; }

.categories ul li a:hover { color:#FFFFFF; background:#4e535a; }
.categories ul li a.active { color:#FFFFFF; background:#4e535a; }

.categories ul li a.expanded { background:none; }
.categories ul li a.expanded:hover { color:#333333; }

.categories article { width:100%; float:left; background:#FFFFFF; border-top:1px solid #dfdfdf; }
.categories article ul { width:86%; float:left; padding:12px 7% 3px 7%; }
.categories article ul li { width:100%; height:auto; float:left; font-size:12px; color:#54595f; background:none; line-height:1.3em; padding-bottom:15px; }
.categories article ul li a { height:auto; color:#54595f; padding:0; background:none; }
.categories article ul li a:hover { color:#54595f; text-decoration:underline; background:none; }

/*
----------------------------------------
06. 02 content - rightpanel
----------------------------------------
*/

#rightpanel { width:79.5%; float:right; }

.newinfo { width:100%; float:left; background:#f26322; border-radius:3px; behavior:url(/css/PIE.htc); position:relative; margin-bottom:18px; }
.newinfo article { width:95.2%; float:left; padding:20px 2% 20px 2.8%; }
.newinfo article h2 { color:#FFFFFF; line-height:1.2em; padding-bottom:5px; }
.newinfo article h2 a { color:#FFFFFF; }
.newinfo article h2 .normal { font-weight:normal; }
.newinfo article figure { width:36.6%; float:left; line-height:.5em; }
.newinfo article aside { width:59.1%; float:left; padding-left:4.3%; }
.newinfo article .close { width:100%; float:right; margin-bottom:-5px; }
.newinfo article .close a { width:48px; height:19px; float:right; background:#FFFFFF; border-radius:3px; behavior:url(/css/PIE.htc); position:relative; font-size:11px; color:#f26322; text-decoration:none; text-align:center; padding-top:4px; }
.newinfo article .close a:hover { background:#f1f1f1; }

.recentactivity { width:100%; float:left; }
.recentactivity h2 { border-bottom:1px solid #ea6b09; padding-bottom:12px; }

.tableinfo { width:100%; float:left; padding:35px 0 0 0; }
.tableinfo h3 { width:100%; float:left; line-height:1.2em; padding:0 0 15px 0; }
.tableinfo h3 span { float:left; background:url(/images/icon_tick.gif) no-repeat 10px 0; padding:1px 0 2px 44px; }
.tableinfo .bold { font-weight:bold; }
.tableinfo .underline { text-decoration:underline; }
.tableinfo .boldunderline { font-weight:bold; text-decoration:underline; }
.tableinfo .uppercase { text-transform:uppercase; }

table.tablesorter { width:100%; background:#f9f6fb; }
table.tablesorter thead tr th, table.tablesorter tfoot tr th { color:#3e3e3e; padding:11px 0; text-align:left; border:none; }
table.tablesorter thead tr .header { background-repeat:no-repeat; background-position:center right; cursor:pointer; border:none; }

table.tablesorter td { font-size:13px; color:#3e3e3e; vertical-align:middle; border:none; padding:11px 0; }
table.tablesorter td a { color:#3e3e3e; text-decoration:underline; }
table.tablesorter td a:hover { text-decoration:none; }
table.tablesorter tbody tr { background:#f9f6fb url(/images/divider04.gif) repeat-x bottom left; }
table.tablesorter tbody .gray1 { background:#f7f7f7 url(/images/divider04.gif) repeat-x bottom left; }
table.tablesorter tbody .gray2 { background:#eeeeee url(/images/divider04.gif) repeat-x bottom left; }
table.tablesorter tbody .gray3 { background:#fcfbfd url(/images/divider04.gif) repeat-x bottom left; }
table.tablesorter tbody .gray4 { background:#eef9fe url(/images/divider04.gif) repeat-x bottom left; }

table.tablesorter .heading { font-size:13px; color:#FFFFFF; font-weight:bold; background:#343434!important; background:-moz-linear-gradient(#535353, #343434); background:-webkit-gradient(linear, left top, left bottom, from(#535353), to(#343434)); background:-o-linear-gradient(#535353, #343434); -pie-background:linear-gradient(#535353, #343434); behavior:url(/css/PIE.htc); position:relative; }
table.tablesorter .heading th { color:#FFFFFF; vertical-align:middle; }
table.tablesorter .heading td { color:#FFFFFF; vertical-align:middle; }

.tableinfo .column1 { width:8%; min-height:5px; padding-left:1.5%; }
.tableinfo .column2 { width:20%; min-height:5px; padding-left:1.5%; }
.tableinfo .column3 { width:11%; min-height:5px; padding-left:1.5%; }
.tableinfo .column4 { width:12%; min-height:5px; padding-left:1.5%; }
.tableinfo .column5 { width:15%; min-height:5px; padding-left:1.5%; }
.tableinfo .column6 { width:25%; min-height:5px; padding-left:1.5%; }

.tableinfo2 h3 span { background:url(/images/icon_clock.gif) no-repeat 10px 0; }
.tableinfo2 .column1 { width:23%; }
.tableinfo2 .column2 { width:17%; }
.tableinfo2 .column3 { width:13%; }
.tableinfo2 .column4 { width:15%; }
.tableinfo2 .column5 { width:14%; }
.tableinfo2 .column6 { width:10%; }

.tableinfo3 h3 span { background:url(/images/icon_order.gif) no-repeat 10px 0; }
.tableinfo3 .column1 { width:15%; }
.tableinfo3 .column2 { width:14%; }
.tableinfo3 .column3 { width:26%; }
.tableinfo3 .column4 { width:13%; }
.tableinfo3 .column5 { width:14%; }
.tableinfo3 .column6 { width:10%; }

.tableinfo4 h3 span { background:url(/images/icon_trak.gif) no-repeat 10px 0; }
.tableinfo4 .column1 { width:15%; }
.tableinfo4 .column2 { width:14%; }
.tableinfo4 .column3 { width:23%; }
.tableinfo4 .column4 { width:16%; }
.tableinfo4 .column5 { width:14%; }
.tableinfo4 .column6 { width:10%; }

.tableinfo ul { width:100%; float:left; }
.tableinfo ul li { width:100%; float:left; padding-top:10px; }
.tableinfo ul ul { width:99.8%; float:left; background:url(/images/divider05.gif) repeat-y top center; border:1px solid #999999; border-bottom:none; }
.tableinfo ul ul li.gray {  background:url(/images/divider06.gif) repeat-y top center; }
.tableinfo ul ul li { width:100%; float:left; font-size:13px; border-bottom:1px solid #999999; padding:5px 0; }
.tableinfo ul ul li span { float:left; padding:0 25px 0 10px; }
.tableinfo ul ul li .left { width:50%; float:left; font-weight:bold; padding:0; }
.tableinfo ul ul li .right { width:50%; float:left; padding:0; }
.tableinfo ul ul li .right span { padding-right:0; }

/*
----------------------------------------
07. footer
----------------------------------------
*/

footer { width:96%; float:left; padding:17px 2% 42px 2%; }
footer .footerlogo { float:left; line-height:.5em; }
footer p { float:right; font-size:13px; color:#afb1b4; padding-top:7px; }
footer p span { padding:0 16px; }
footer p span.right { padding-right:0; }
footer p a { color:#afb1b4; }

/*
----------------------------------------
08. category list
----------------------------------------
*/

.breadcrumbWrapper { width:100%; float:left; padding:20px 0 18px 0; border-bottom:1px solid #ea6b09; padding-bottom:7px; margin-bottom:20px; }

.breadcrumb { width:85%; float:left; }
.breadcrumb ul { width:100%; float:left; font-size:14px; color:#333333; padding-bottom:2px; }
.breadcrumb ul li { float:left; background:url(/images/arrow06.gif) no-repeat 0 3px; line-height:1em; padding:0 9px 0px 14px; }
.breadcrumb ul li:first-child { background:none; padding-left:0px; }
.breadcrumb ul li.none { background:none; padding-left:8px; }
.breadcrumb ul li a { color:#f26322; }

.catalog { width:15%; float:right; text-align:right; }
.catalog a { color:#f26322; font-weight:bold; font-size:15px; }

.categoryDescription { width:100%; float:left; margin:0px 0px 20px 0px; }

.categorylist { width:103.4%; float:left; margin-right:-3.4%; position:relative; display:flex; flex-wrap:wrap; }
.categorylist article { width:22.9%; float:left; background:#eeeeee; margin:0 2% 20px 0; }
.categorylist article h3 { font-weight:bold; line-height:1.2em; padding-bottom:9px; }
.categorylist article p { font-weight:bold; color:#f26321; word-spacing:-1px; }
.categorylist article p span { float:left; background:url(/images/divider07.gif) no-repeat 0 2px; padding:0 9px; }
.categorylist article p span.nodivider { background:none; padding-left:0; }
.categorylist article p a { color:#f26321; }
.categorylist article aside { width:95.5%; float:left; padding:5px 2% 5px 2.5%; }
.categorylist article figure a { display:block; }
.categorylist article figure a { display:flex; flex-direction:column; background:#FFFFFF; justify-content:center; align-items:center; height:157px; overflow:hidden; }
.categorylist article .info { width:93.4%; float:left; padding:7px 3.3% 0px 3.3%; min-height:50px; }
.categorylist article .info h3 { padding-bottom:5px; }

/*
----------------------------------------
09. product detail
----------------------------------------
*/

.productdetails { width:90%; float:left; border-bottom:1px solid #dcddde; padding:24px 4.3% 0 5.7%; }
.productdetails h1 { line-height:1.3em; padding-bottom:20px; }
.productdetails article { width:99%; float:left; background:#eeeeee; border:3px solid #eeeeee; }
.productdetails article figure { width:60.3%; float:left; background:#FFFFFF; line-height:.5em; }
.productdetails article aside { width:36.5%; float:right; padding:14px 0 5px 0; }
.productdetails article p { width:100%; float:left; padding-bottom:12px; }
.productdetails article p .left { width:65px; float:left; color:#52595f; }
.productdetails article p .right { width:144px; float:left; font-weight:bold; }
.productdetails article .price { width:100%; float:left; padding:9px 0 17px 0; }
.productdetails article .price p { font-weight:bold; padding-bottom:2px; }
.productdetails article .price p a { font-weight:normal; }
.productdetails article .price h3 { font-size:21px; color:#f26320; font-weight:bold; padding:0px; }
.productdetails article .info { width:100%; float:left; }
.productdetails article label { width:100px; float:left; font-size:14px; color:#52595f; padding-top:8px; }
.productdetails article input[type="text"] { width:120px; height:20px; float:left; background:#FFFFFF; border-radius:4px; behavior:url(/css/PIE.htc); position:relative; font-size:13px; color:#333333; padding:5px; margin-top:3px!important; }
.productdetails article input[type="text"].small { width:50px!important; }

.productdetails article .buttonadd { padding-top:15px; }

.productdetails article .check { float:left; background:#434343; }
.productdetails article .check:hover { background:#1d1c1c; }


.description { width:100%; float:left; padding:20px 0 8px 0; }
.description h3 { font-weight:bold; padding-bottom:13px; }
.description p { line-height:1.7em; padding-bottom:25px; }
.description ul { width:100%; float:left; border-top:1px solid #dcddde; padding:24px 0 0 0; list-style:none; }
.description ul li { float:left; font-size:14px; font-weight:bold; line-height:1em; padding:0 4.8% 15px 0; }
.description ul li a { float:left; color:#f26320; background:url(/images/icons/download.png) no-repeat 0 0; padding:1px 0 0 25px; }

/*
----------------------------------------
10. product list
----------------------------------------
*/

.productlist { width:100%; float:left; margin-top:-16px; position:relative; }
.productlist article { width:100%; float:left; border-bottom:1px solid #dcddde; padding:20px 0 19px 0; }
.productlist article figure { width:26.5%; float:left; }
.productlist article figure img { float:left; line-height:.5em; border:3px solid #eeeeee; width:100%; }
.productlist article aside { width:48.5%; float:left; padding:0 3% 0 3.3%; margin-top:-2px; position:relative; }
.productlist article aside h2 { min-height:27px; float:left; line-height:1.1em; padding-bottom:9px; }
.productlist article aside p { width:100%; float:left; color:#666666; line-height:1.4em; padding-bottom:3px; }
.productlist article aside p.top { padding-top:6px; }
.productlist article aside p .left { width:70px; float:left; }
.productlist article aside p .right { width:220px; float:left; color:#333333; font-weight:bold; }
.productlist article aside p.seeall { color:#f26320; font-weight:bold; padding:3px 0 0 0; }
.productlist article aside p.seeall a { color:#f26320; }
.productlist article .priceinfo { width:18.3%; float:left; padding:35px 0 0 0; }
.productlist article .priceinfo p { font-weight:bold; padding:0 0 8px 5px; }
.productlist article .priceinfo p span { font-size:21px; color:#f26320; }
.productlist article .priceinfo .buttonadd { padding-top:2px; }
.productlist article .priceinfo .buttonadd a { width:135px; }

/*
----------------------------------------
11. shopping cart
----------------------------------------
*/

.shoppingcart { width:100%; float:left; }
.shoppingcart h2 { width:100%; float:left; border-bottom:1px solid #ea6b09; padding:7px 0 18px 0; }
.shoppingcart h2 span { float:left; background:url(/images/icon_shopingcart.png) no-repeat 4px 0; padding:0 0 0 40px; }

.shoppingcart .delete { color:#f26322; font-size:14px; float:right; text-align:right; background:url(/images/icon_delete.png) no-repeat 4px 0; padding:0 10px 0 20px; }
.shoppingcart .load { color:#f26322; font-size:14px; float:right; text-align:right; background:url(/images/excel_16x16.png) no-repeat 4px 0; padding:0 40px 0 25px; }

.shoppingcart table.tablesorter td { font-size:14px; font-weight:bold; padding-top:5px; border:none; padding-bottom:5px; }
.shoppingcart table.tablesorter tbody tr { background:#eeeeee url(/images/divider08.gif) repeat-x bottom left; }
.shoppingcart table.tablesorter tbody .gray1 { background:#f7f7f7 url(/images/divider08.gif) repeat-x bottom left; }

.shoppingcart .aligncenter { text-align:center; }
.shoppingcart .alignright { text-align:right; }
.shoppingcart .alignleft { text-align:left; }
.shoppingcart .price { color:#f26320; }

.shoppingcart .tableinfo { padding:20px 0 0 0; }
.shoppingcart .tableinfo .column1 { width:30%; }
.shoppingcart .tableinfo .column2 { width:20%; }
.shoppingcart .tableinfo .column3 { width:10%; }
.shoppingcart .tableinfo .column4 { width:14%; }
.shoppingcart .tableinfo .column5 { width:16%; }
.shoppingcart .tableinfo .column6 { width:9%; padding-right:5px; }
.shoppingcart .tableinfo .cart_remarks { width:100%; float:left; }
.shoppingcart .tableinfo .cart_remarks span { float:left; margin-top:2px; margin-right:10px; }
.shoppingcart .tableinfo .cart_remarks input { float:left; width:74%!important; }
.shoppingcart .tableinfo .input { width:100%; height:22px; float:left; background:#FFFFFF; text-align:center; border-radius:4px; box-shadow:inset #ddd 0 2px 2px; behavior:url(/css/PIE.htc); position:relative; padding:5px 0 0 0; }
.shoppingcart .tableinfo .input input { font-weight:bold; text-align:center; border:none; width:50px; }

.shoppingcart aside { width:100%; float:left; background:#eeeeee; padding:12px 0; }
.shoppingcart aside span { float:left; font-size:18px; color:#3a3a3a; font-weight:bold; padding:0 0 0 2.5%; }
.shoppingcart aside .column01 { width:47%; }
.shoppingcart aside .column02 { width:60px; font-size:16px; padding:0 0 0 2.5%; }
.shoppingcart aside .column03 { width:32%; text-align:right; padding:0; }

.reviewMaterials .tableinfo { padding:0px; }
.reviewMaterials.shoppingcart .tableinfo .column1 { width:40%; }
.reviewMaterials.shoppingcart .tableinfo .column2 { width:15%; }
.reviewMaterials.shoppingcart .tableinfo .column3 { width:9%; }
.reviewMaterials.shoppingcart .tableinfo .column4 { width:17%; }
.reviewMaterials.shoppingcart .tableinfo .column5 { width:18%; padding-right:5px; }
.reviewMaterials aside { width:100%; float:left; background:#eeeeee; padding:12px 0; }
.reviewMaterials aside span { float:left; font-size:18px; color:#3a3a3a; font-weight:bold; padding:0 0 0 2.5%; }
.reviewMaterials aside .column01 { width:60%; padding-left:1.5%; }
.reviewMaterials aside .column04 { width:30%; float:right; text-align:right; padding:0 5px 0 0; }

.shoppingcart article { width:100%; float:left; padding:23px 0 0 0; }
.shoppingcart article p { width:40%; float:left; font-size:14px; color:#000; }
.shoppingcart article p span { font-weight:bold; }
.shoppingcart article .bgbuttons { width:56%; float:right; } 
.shoppingcart article .button { float:right; font-size:14px; font-weight:bold; background:#f26322; color:#FFFFFF; text-decoration:none; border-radius:3px; box-shadow:0px 2px 4px #ccc; behavior:url(/css/PIE.htc); position:relative; padding:3.5%; }
.shoppingcart article .button:hover { background:#e56328; }
.shoppingcart article .check { background:#434343; }
.shoppingcart article .check:hover { background:#1d1c1c; }
.shoppingcart article .button.inprogress_img { background: #FFF; color: #333; box-shadow: none; }
.shoppingcart #promoCode::placeholder { color: #AAA; }

.shoppingcart .cart_remarks { font-weight:normal; font-size:12px; }
.shoppingcart .cart_remarks .remarksInput { display:none; }
.shoppingcart .tableinfo .remarksInput { width:100%; height:22px; background:#FFFFFF; border-radius:4px; box-shadow:inset #ddd 0 2px 2px; behavior:url(/css/PIE.htc); position:relative; padding:5px 0 0 0; }

.ui-dialog-titlebar { font-size:0.8em; }

.ui-autocomplete.ui-widget { border:2px solid #cccccc; margin-top:20px; font-size:14px; }

.ui-autocomplete li a { font-size:14px; }

.ui-autocomplete.ui-widget-content .ui-state-focus { border:1px solid #87898A; background:#FFFFFF 50% 50% repeat-x; /*this is the orange color*/
	/*background:#F26322 url(/css/jquery/smoothness/images/ui-bg_glass_50_87898A_1x400.png) 50% 50% repeat-x; */		/*this is a gray color from the search bar*/
	color:#000000; }

/*** prevents blue highlight for button focus ***/
.ui-button:focus { outline:none !important; }

.msgBox { width:100%; margin:0px 0px 10px 0px; padding:5px 10px 5px 0px; }
.messagesDiv { margin:0px!important; }
.messagesDiv ul { margin:5px 0 5px 40px; }








/*   table.adv   */
table.adv { background:#fff; border:1px solid #cdcdcd; margin-bottom:5px; width:100%; color:#111; font-size:12px; border-collapse:collapse; border-spacing:0; }

table.adv th { /*distinguishing table headers from data cells*/
	font-weight:bold; text-align:center; color:#FFFFFF!important; }

table.adv th, table.adv td { /*borders and padding to make the table readable*/
	border-left:1px solid #cdcdcd; border-right:1px solid #cdcdcd; border-bottom:1px solid #cdcdcd; padding:2px 5px; }

table.adv tr.other td { background-color:#dedede; }

table.adv td a { color:#333333; text-decoration:underline; }

table.adv caption { caption-side:bottom; font-size:11px; /*coordinated marking to match cell's padding*/
	margin-bottom:.5em; /*centered so it doesn't blend in to other content*/
	text-align:center; }

table.adv thead, table.adv tfoot { background-color:#333; color:#fff; }

table.adv tr.over td { background-color:#aaa; }

table.adv tr.over td a:link, table.adv tr.over td a:visited { color:#fff; } 

table.adv tr.over td a:hover, table.adv tr.over td a:active { color:#eb6b08; } 

.inprogress_img { display:none; }

/*    misc    */
#checkAvailabilityPopup, #uploadCartSpinPopup, #uploadCartPopup { display:none; padding:10px; text-align:center; font-size:0.8em; }

div.icon { min-width:170px; min-height:66px; margin:5px; background-image:linear-gradient(bottom, rgb(255,255,255) 0%, rgb(238,238,238) 35%); background-image:-o-linear-gradient(bottom, rgb(255,255,255) 0%, rgb(238,238,238) 35%); background-image:-moz-linear-gradient(bottom, rgb(255,255,255) 0%, rgb(238,238,238) 35%); background-image:-webkit-linear-gradient(bottom, rgb(255,255,255) 0%, rgb(238,238,238) 35%); background-image:-ms-linear-gradient(bottom, rgb(255,255,255) 0%, rgb(238,238,238) 35%); 
	/* Legacy IE gradient code. Reference:http://stackoverflow.com/questions/213750/gradient-colors-in-internet-explorer */
	filter:	progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#eeeeee', endColorstr='#ffffff'); /* IE6 & IE7 */
	-ms-filter:	"progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#eeeeee', endColorstr='#ffffff')"; /* IE8 */
	zoom:1; 
	background-image:-webkit-gradient(
		linear,
		left bottom,
		left top,
		color-stop(0, rgb(255,255,255)),
		color-stop(0.35, rgb(238,238,238))
	); }

div.icon div, div.icon img { text-align:left; float:left; }


/* some tweaks to our jquery datatables grid */
div.DataTables_sort_wrapper span, div.DataTables_sort_wrapper b { float:left; }
div.DataTables_sort_wrapper b { width:95%; }
div.DataTables_sort_wrapper span.DataTables_sort_icon { float:right!important; margin-right:-15px; }
div.dataTables_wrapper .css_right { float:right; }
div.dataTables_wrapper td { border:1px dotted #CCCCCC; }
/* this fixes table headers wrapping */
div.dataTables_wrapper th div.DataTables_sort_wrapper { white-space:nowrap; }
div.dataTables_wrapper .paging_full_numbers a.paginate_active { background-color:#F26322; color:#FFFFFF!important; }
/* this can be used on its own, too */
table.tableGridLines td { border:1px dotted #CCCCCC; }
table.tableGridLines { border-collapse:collapse; }









/*************************************/
/****** SECTION SPECIFIC ITEMS *******/
/*************************************/

.payment table td { vertical-align:top; }

.checkout *, .orders *, .myaccount *, .terms *, .priceList *, .ers *, .feedback *, .home *, .partsHistory * { color:#111; font-size:12px; }
.padding-left10 { padding-left:10px; }

#rightpanel h1 { font-size:18px; font-weight:bold; }


/*    CHECKOUT    */
.checkout a, .checkout a:visited, .checkout a:hover, .checkout.payment a:hover, .checkout.payment td a:hover, .priceList a  { color:#eb6b08; }
.checkout.payment a, .checkout.payment a:visited { color:#333333; }
.checkout a { text-decoration:underline; }
.checkout.payment div.ordering_unavailable { font-size:16px; color:#FF0000; font-weight:bold; margin-top:7px; }
.checkout.payment div.autoAttachedFiles { margin-bottom:15px; }
.checkout.payment div.autoAttachedFiles ul { margin-top:5px; margin-left:30px; }

#rightpanel .checkout .button, #rightpanel .feedback .button { width:103px; height:29px; float:left; background:#f26322; border:none; border-radius:3px; behavior:url(/css/PIE.htc); position:relative; font-size:14px; color:#FFFFFF; font-weight:bold; text-decoration:none; text-align:center; cursor:pointer; padding-left:9px; }
#rightpanel .checkout .button:hover, #rightpanel .feedback .button:hover { background:#e56328; }
#rightpanel .checkout .button.check { background:#434343; }
#rightpanel .checkout .button.check:hover { background:#1D1C1C; }


/*   SUCCESS MESSAGE   */
    .checkmark-wrapper { width:100px; margin:0; }
      .checkmark { stroke:green; stroke-dashoffset:745.74853515625; stroke-dasharray:745.74853515625; animation:dash 6s ease-out forwards 1; }

    @keyframes dash {
      0% { stroke-dashoffset:745.74853515625; }
      100% { stroke-dashoffset:0; }
    }

    .success-message { vertical-align:middle; padding-left:20px; }
      .success-message h1 { margin:0 0 10px 0; padding:0; color:#008000; font-size:36px !important; }
      .success-message h3 { margin:0; padding:0; }

/*   ORDERS   */
.orders h4 { font-weight:bold; }
.orders div.x-tab-panel-header, .orders ul.x-tab-strip-top { background-image:none; background-color:transparent; }
.orders div.x-tab-panel-header { border-top:1px solid #FFFFFF; border-left:1px solid #FFFFFF; border-right:1px solid #FFFFFF; }
.orders div.dataTables_wrapper td { border:1px dotted #CCCCCC; }

/*   MY ACCOUNT   */
.myaccount .fields.horizontal li { width:160px; padding-bottom:30px; }
.myaccount .fields.horizontal li.bottom { padding-bottom:0px; }

/*   ERs   */
.ers a { text-decoration:underline; }
.ers a:hover, .ers a:hover span { color:#F26322; }
.ers .label { font-weight:bold; }
.ers ul { margin:10px 20px; list-style-type:disc; }
.ers #mainTable input[type="file"] { width:187px; }

/*   PRICE LISTS   */
.priceList h2 { font-size:16px; margin:12px 0px; color:#EB6B08; }
.priceList.main a:hover h2 { color:#999999!important; }

/*   HOME (DASHBOARD)   */
.home h1 { padding-bottom:20px; border-bottom:1px dotted #999999; }
.home .label { margin:30px 0px 10px 0px; font-size:16px; font-weight:bold; color:#F26322; text-indent:40px; line-height:26px; }
.home .label.ers { background:url('/images/icons/checkmark.png') no-repeat 0px 0px; }
.home .label.unprocessed { background:url('/images/icons/clock.png') no-repeat 0px 0px; }
.home .label.open { background:url('/images/icons/clipboard.png') no-repeat 0px 0px; }
.home .label.shipped { background:url('/images/icons/truck.png') no-repeat 0px 0px; }
.home .datatable { width:100%; }
.home .datatable th { text-align:left; }

.home table.adv th { padding:10px; }
.home table.adv tr.odd td { background-color:#dedede!important; }
.home table.adv tr.even td { background-color:#ffffff!important; }

.home table.adv td.sorting_1 { background-color:inherit!important; }
.home table.adv tr.over td, 
.home table.adv tr.over td.sorting_1 { background-color:#aaa!important; }

/*   PARTS HISTORY    */
.partsHistory .datatable { width:100%; }
.partsHistory .datatable th { text-align:left; }

.partsHistory table.adv th { padding:10px; }
.partsHistory table.adv tr.odd td { background-color:#dedede!important; }
.partsHistory table.adv tr.even td { background-color:#ffffff!important; }

.partsHistory table.adv td.sorting_1 { background-color:inherit!important; }
.partsHistory table.adv tr.over td, 
.partsHistory table.adv tr.over td.sorting_1 { background-color:#aaa!important; }


/***********************
  clearfix
 ***********************/
.clearfix:before,
.clearfix:after {
    content:" "; /* 1 */
    display:table; /* 2 */
}
.clearfix:after { clear:both; }
.clearfix { *zoom:1; }


/*******************************
  product filtering
 *******************************/

/*** overlay for products ***/
#filterResponse { position:relative; height:100%; width:100%; }
  .filter-overlay { display:none; height:100%; width:100%; min-height:200px; position:absolute; background-color:rgba(0,0,0,0.5); z-index:9999; }
    .filter-overlay .message { margin:20px auto; background:#fff; padding:20px; width:300px; font-size:16pt; border-radius:5px; }
      .filter-overlay .message img { vertical-align:middle; margin-right:10px; } 

.filters-head { color:#565658; background:#eee; border:1px solid #dfdfdf; border-radius:3px; border-bottom-left-radius:0; border-bottom-right-radius:0; font-weight:bold; padding:13px 0; font-size:18px; }
  .filters-head div { margin-left:10px; }


.filters-content { display:block; border:1px solid #dfdfdf; border-top:1px solid #fff; border-radius:5px; border-top-left-radius:0; border-top-right-radius:0; }
 
.filter-box { float:left; width:25%; position:relative; min-height:1px; }
  .filter-head { padding:10px; background:#eee; border-bottom:1px solid #dfdfdf; color:#000; font-size:13px; font-weight:bold; }
  .filter-content { padding:10px; }
    .filter-content ul { margin:0; padding:0; list-style:none; }
      .filter-content li { display:block; list-style:none; float:left; }
        .filter-content li a { display:inline-block; padding:2px 3px; border:1px solid #ccc; text-decoration:none; margin:0 3px 3px 0; 
          color:#666; min-width:31px; text-align:center; font-size:8pt; }
        .filter-content li a:hover { border:1px solid #000 !important; } 
        .filter-content li.active a { background:#f4682c; border:1px solid #f4682c; color:#fff; }
        .filter-content li.disabled a { background:#ccc; border:1px solid #aaa; color:#666; cursor:default; } 
          /* if both selected and disabled */
          .filter-content li.active.disabled a { background:#aaa; border:1px solid #888; color:#666; cursor:default; }


/*** custom css for filter tooltips ***/
.characteristicFilterTooltip { font-size:9pt !important; }

/*** make sure floats clear after rows ***/
.row:before,
.row:after { display:table; content:" "; }
.row:after { clear:both; }

/*** tablet ***/
@media only screen and (min-width:768px) and (max-width:939px) { .filter-box { width:100% !important; } /* 1 per row */ }

/*** phone ***/
@media only screen and (max-width:767px) { .filter-box { width:100% !important; } /* 1 per row */ }

#socialmedia { margin-top:180px; }

/* .socialmediaicon { } */

#followus { font-weight:800; }

#socialmediaicons { margin-top:10px; }

/* Checkout related 
  .yellowbg { background-color:#FFFC6B; } */

  /* error handler section Normal and Stacked (phone/tablet) */
  #paymentErrors { display:block; }
  #paymentErrorsStacked { display:none; }

  /* checkout page content (form fields) */
  .block-wrapper { width:50%; float:left; }
    .block { width:100%; }
      .block-inner { padding-left:10px; /*border:1px solid #ccc; background:#eee; */
        margin:5px; }

      .block-full { width:100%; float:left; }
      .block-half { width:50%; float:left; }
  .clear { clear:both; }

  @media only screen and (max-width:767px) { /* error handler section Normal and Stacked (phone/tablet) */
    #paymentErrors { display:none; }
    #paymentErrorsStacked { display:block; }

    /* allow fields to expand & stack them! */
    .block-wrapper { float:none; width:100%; }
      .block-full { width:100%; float:none; }
      .block-half { width:100%; float:none; }
      .block-inner { padding:0;margin:0; } }

    
.alert {
  color:#334488;
  background-color:#f0f0ff;
  border: 1px solid #334488;
  padding: 30px;
  margin: 0 auto;
  max-width: 550px;
}
.alert p {
  margin: 20px 0 0 0;
  font-size: 16px;
  color:#334488;
}
.alert p.larger {
  font-size: 16px;
}
.alert .title {
  font-weight: bold;
  font-size: 24px;
  margin-bottom: 40px;
}
.alert a:hover,
.alert a {
  color:#334488;
  text-decoration: underline;
}
.alert-action {
  margin: 30px 0 20px 0;
  display: flex;
  align-items: center;
  flex-direction: column;
}
.alert-action form {
  margin: 0;
}
.alert-action span {
  font-size: 12px;
  margin-top: 10px;
}
.alert-action a {
  font-size: 12px;
  margin-top: 10px;
}