body { font-size: 12px; font-family: Helvetica; line-height: 14px; color: #222222; }
br.clear { clear: both; line-height: 0; height: 0; font-size: 0; }
a { color: #333333; text-decoration: none; outline: 0; }
a:link { }
a:visited { }
a:hover { text-decoration: underline; cursor: pointer; }
a:active { }
hr { border-color: Black; border-width: 1px 0 0 0; border-style: solid; margin: 10px 0; }
h2 { color: #6D131B; font-size: 16px; font-weight: bold; margin: 8px 0; font-family: Arial, Helvetica,sans-serif; ; }
strong { font-weight: bold; }
em { font-style: italic; }

#wrapper { width: 730px; margin: 0 auto; padding: 0 10px; }
#header { padding: 10px; position: relative; }
#nav { padding: 10px 10px 10px 0; box-shadow: 0 0 6px -2px #555555; position: relative; }
#content { padding: 15px; font-size: 1.1em; }
#content p { padding-left: 15px; line-height: 16px; }
#footer { font-size: 1em; color: White; }
#footer a { color: White; }
#footer li { width: auto; margin-left: 15px; }
#logo { width: 177px; height: 105px; }
#userLinks { position: absolute; top: 7px; right: 0; }
#userLinks ul { display: block; margin: 0; padding: 0; }
#userLinks li { display: block; float: left; }
#userLinks a { font-size: 14px; margin-right: 10px; line-height: 22px; }
#userLinks img, #loginLinks img { width: 18px; height: 18px; vertical-align: middle; }
#loginForm { }
#loginForm div { float: left; margin-right: 10px; }
#loginForm input[type=text], #loginForm input[type=password] { width: 100px; height: 18px; line-height: 18px; margin: 0; }
#loginForm span, #loginForm label { margin: 0 3px 0 0; }
#loginFormDiv, #userLinks { 
    background: url("../images/navtriangle_left.png") no-repeat scroll left center transparent;
    padding-left: 9px;
    position: absolute;
    right: -8px;
    top: 2px;
    width: auto;
}
#loginFormDiv > span, #userLinks > span { 
    background: url("../images/navwrap_right.png") no-repeat scroll right bottom transparent;
    position: absolute;
    right: -1px;
    bottom: -10px;
    display: block;
    width: 8px;
    height: 11px;
    z-index: -1;
}
#loginFormDiv > div, #userLinks > div { 
    background: none no-repeat scroll left top #D8AA55;
    border-bottom: 1px solid #BF9D47;
    border-top: 1px solid #BF9D47;
    color: #222222;
    font-size: 14px;
    height: 22px;
    line-height: 18px;
    padding-left: 15px;
    padding-right: 5px;
}
#loginFormDiv button { font-size: 12px; padding: 0 5px }
#loginFormSubDiv { display: none; }
#loginLinks { padding-right: 5px; }
#loginLinks a, #loginLinks span, #userLinks a, #userLinks span { margin-right: 8px; line-height: 22px; }

#blueBg { background-color: #343A74; height: 72px; width: 71%; position: absolute; right: -1px; top: 50%; margin-top: -36px; }
#mainNav { 
    background: url("../images/navtriangle_left.png") no-repeat scroll left center transparent;
    padding-left: 12px;
    position: absolute;
    right: -12px;
    top: 10px;
    width: auto;
}
#mainNav > span { 
    background: url("../images/navwrap_right.png") no-repeat scroll right bottom transparent;
    position: absolute;
    right: -1px;
    bottom: -10px;
    display: block;
    width: 13px;
    height: 16px;
    z-index: -1;
}
#mainNav > div { 
    background-image: url("../images/beige_bg.png");
    border-bottom: 1px solid #BF9D47;
    border-top: 1px solid #BF9D47;
    color: #222222;
    font-size: 18px;
    height: 30px;
    line-height: 30px;
    padding-left: 25px;
}
#mainNav a { margin-right: 25px; }
#belowNav { position: absolute; top: 48px; right: 0px; }
#belowNav .img { width: 68px; height: 34px; float: left; margin-right: 8px; border: 1px solid #333; }
#belowNav .text { float: left; font-size: 18px; color: White; margin-right: 8px; margin-top: 3px; }
#textBelowNav { letter-spacing: 1px; font-family: Comic Sans MS; font-size: 10px; position: absolute; bottom: 2px; right: 10px; font-style: italic; }
#goodMessage { 
    display: none;
    border: 3px solid green;
    box-shadow: 3px 3px 3px #888888;
    color: green;
    font-size: 1.6em;
    padding: 8px 8px 8px 25px;
    background: url('../images/ok.png') no-repeat left center white;
    background-size: 16px 16px;
    background-position: 6px center;
    position: fixed;
    top: 30px;
    left: 50%;
    margin-left: -125px;
    width: 250px;
    text-align: center;
    z-index: 15;
}
.pageTitle { 
    background: url("../images/navtriangle_right.png") no-repeat scroll right center transparent;
    padding-right: 11px;
    display: block;
    position: absolute;
    top: 0px;
    left:  -12px;
    margin: 20px 0 5px 0;
    width: 43%;
    z-index: 2;
}
.pageTitle > span { 
    background: url("../images/navwrap_left.png") no-repeat scroll left top transparent;
    position: absolute;
    left: -1px;
    top: -10px;
    display: block;
    width: 12px;
    height: 16px;
    z-index: -1;
}
.pageTitle > div {
    background-image: url("../images/beige_bg.png");
    border-bottom: 1px solid #BF9D47;
    border-top: 1px solid #BF9D47;
    color: #333333;
    font-size: 18px;
    height: 30px;
    line-height: 30px;
    padding-left: 16px;
    display: block; 
}
.pageSummary { font-size: 14px; float: left; width: 30%; padding: 20px; margin-top: 35px; line-height: 16px;}
.pageImage { float: right; width: 63%; border: 1px solid #343A74; position: relative; }
.pageImage > .img { width: 100%; background: white top center no-repeat url("../images/machine1.jpg"); height: 220px; }
.pageImage > .caption { background-color: #343A74; position: relative; bottom: 0px; padding: 8px; color: white; font-size: 13px; text-align: center; }
.pageNav { float: left; width: 34%; margin-top: 43px; line-height: 16px; }
.pageNav li { 
    background: url("../images/navtriangle_right.png") no-repeat scroll right center transparent;
    padding-right: 8px;
    display: block;
    position: relative;
    left:  -8px;
    margin: 7px 0;
    width: 97%;
}
.pageNav li > span { 
    background: url("../images/navwrap_left.png") no-repeat scroll left top transparent;
    position: absolute;
    left: -1px;
    top: -10px;
    display: block;
    width: 8px;
    height: 16px;
    z-index: -1;
}
.pageNav li > a { 
    background-image: url("../images/beige_bg.png");
    border-bottom: 1px solid #BF9D47;
    border-top: 1px solid #BF9D47;
    color: #333333;
    font-size: 14px;
    height: 20px;
    line-height: 20px;
    padding-left: 18px;
    display: block; 
}
.pageNav li > a:hover, .pageNav li.selected > a{ text-decoration: none; font-weight: bold; }
.pageNav li:hover, .pageNav li.selected { text-decoration: none; font-weight: bold; width: 100%; }

.bgBeige { background-color: #D8C299; }
.bgRed { background-color: #7A1D25; }
.bgBlue { background-color: #143663; }
.bgWhite { background-color: #FFFFFF; }
.bgNavItem { background-color: #D8AA55; }

.borderBeige { border-color: #CCB488; }
.borderRed { border-color: #6D131B; }
.borderBlue { border-color: #0F2F59; }
.borderBlack { border-color: #000000; }
.borderNavItem { border-color: #D8AA55; }

.block { border-width: 1px; border-style: solid; border-radius: 8px; margin: 8px 0; }

.floatList { margin: 10px 0; padding: 0; }
.floatList > li { float: left; display: block; width: 155px; margin-left: 15px; line-height: 16px; }

table.products {
    width: 100%;
}
#content table.products p {
    padding: 0;
    margin: 0;
    text-align: left;
    height: 131px;
    font-size: 12px;
}
#content table.products h2 {
    padding-bottom: 5px;
    margin: 0;
}
table.products div.product {
    padding: 10px 0px;
    text-align: center;
    border-bottom: 1px solid black;
    height: 178px;
    position: relative;
}
table.products div.product.bottom {
    border-bottom-color: transparent;
}
table.products span.caption {
    display: block;
    font-size: 14px;
    line-height: 20px;
    padding-bottom: 5px;
    text-align: center;
    height: 40px;
    overflow: hidden;
}
table.products div.img {
    background-color: white;
    background-repeat:no-repeat;
    background-position:center; 
    border: 1px solid black;
    width: auto;
    height: 130px;
    margin: 0 auto;
}
table.products a.addToCart { 
    background-attachment: scroll;
    background-clip: border-box;
    background-color: #E5FFE5;
    background-image: url("../images/cart_add.png");
    background-origin: padding-box;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 20px 20px;
    border: 1px solid green;
    height: 20px;
    padding: 2px;
    position: absolute;
    right: -4px;
    top: 51px;
    width: 20px;
}
table.products a.removeFromCart { 
    background-attachment: scroll;
    background-clip: border-box;
    background-color: #FFEAEA;
    background-image: url("../images/cart_remove.png");
    background-origin: padding-box;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 20px 20px;
    border: 1px solid red;
    height: 20px;
    padding: 2px;
    position: absolute;
    right: -4px;
    top: 51px;
    width: 20px;
}
table.products span.discount { 
    background-attachment: scroll;
    background-clip: border-box;
    background-color: transparent;
    background-image: url("../images/golden_offer.png");
    background-origin: padding-box;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 32px 32px;
    height: 32px;
    padding: 2px;
    position: absolute;
    left: -9px;
    top: 41px;
    width: 32px;
}
table.products span.d5 { 
    background-image: url("../images/offer_5.png");
}
table.products span.d10 { 
    background-image: url("../images/offer_10.png");
}
table.products span.d20 { 
    background-image: url("../images/offer_20.png");
}
table.products span.d50 { 
    background-image: url("../images/offer_50.png");
}
table.products input.quantity { 
    background-color: white;
    border: 1px solid black;
    bottom: 7px;
    padding: 1px;
    position: absolute;
    right: 13px;
    width: 25px;
    height: 18px;
    line-height: 20px;
    border-left: 1px solid gray;
    z-index: 3;
    text-align: right;
}
table.products input.quantity.readonly { 
    right: -4px;
}
table.products span.quantityText { 
    background-color: #EEEEEE;
    border-color: black;
    border-style: solid none solid solid;
    border-width: 1px 0 1px 1px;
    bottom: 7px;
    height: 18px;
    line-height: 18px;
    padding: 1px;
    position: absolute;
    right: 41px;
    text-align: center;
    width: 13px;
    z-index: 2;
}
table.products span.quantityText.readonly { 
    right: 24px;
}
table.products a.apply { 
    background-attachment: scroll;
    background-clip: border-box;
    background-color: #E5FFE5;
    background-image: url("../images/ok.png");
    background-origin: padding-box;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 12px 16px;
    border: 1px solid green;
    bottom: 7px;
    height: 16px;
    padding: 2px;
    position: absolute;
    right: -4px;
    width: 12px;
}
#editUserFieldset {  }

span.msg.user {
    display: block;
    margin-left: 115px;
}
span.msg.checkout {
    display: block;
    margin-left: 105px;
}

input { border: 1px solid #777777; height: 20px; line-height: 18px; padding: 1px; margin: 0; }
input[type=checkbox], input[type=radio] { border: 0; }
textarea { border: 1px solid #777777; line-height: 18px; font-family: Verdana, Serif; font-size: 12px; }
select { border: 1px solid #777777; height: 20px; }

.formblock label, .formblock input, .formblock textarea, .formblock a, .formblock span, .formblock select { display: block; line-height: 22px; float: left; margin-bottom: 5px; margin-right: 5px; }
.formblock label { font-weight: bold; text-align: right; }
.formblock fieldset label { font-weight: normal; }
.formblock textarea { line-height: 18px; margin-top: 0; }
.formblock br, br.clear { clear: both; font-size: 0; height: 0; margin: 0; padding: 0; }
.formblock button { }
.formblock .lastrow span, .formblock .lastrow label, .formblock .lastrow input { margin-bottom: 0; }
.formblock input[type=checkbox], .formblock input[type=radio] { height: 22px; }
.formblock fieldset { border: 1px solid #AAAAAA; margin-bottom: 5px; }
.formblock legend { font-weight: bold; margin-left: 10px; padding: 4px; }
.valid { color: Green; }
.invalid { color: #C10000; border-color: #C10000; }
span.msg { font-size: .8em; margin-top: -5px; line-height: 13px; display: none; }

.subtotal { font-size: 1.5em; font-weight: bold; line-height: 1.6em; }

table.grid { width: 100%; border-width: 1px 0px 0px 1px; border-style: solid; border-color: #707070; }
table.grid > thead > tr > th, table.grid > tbody > tr > td { line-height: 18px; padding: 1px; border-width: 0px 1px 1px 0px; border-style: solid; border-color: #707070; color: Black; }
table.grid > thead > tr > th { 
    border-color: #AAAAAA; 
    color: white; 
    font-weight: bold;
    background: #343A74; /* Old browsers */
}
table.grid > tbody > tr > td a { color: black; }
table.grid > tbody > tr.even > td { background-color: #DDEDFF; }
table.grid > tbody > tr.odd > td { background-color: #F7F9FC; }
table.grid > tbody > tr.highlight > td { background-color: #FFFFC1; }
table.grid > tbody > tr.selected > td { background-color: #FFFFC1; }

div.tableTop { 
    padding: 10px 10px 0 10px; 
    /*background-color: #f0f0f0; */
    border: 1px solid #bbbbbb; 
    border-bottom: 0px; 
    position: relative;
    background: #ffffff; /* Old browsers */
    /* IE9 SVG, needs conditional override of 'filter' to 'none' */
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjQ3JSIgc3RvcC1jb2xvcj0iI2Y2ZjZmNiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNlZGVkZWQiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-linear-gradient(top,  #ffffff 0%, #f6f6f6 47%, #ededed 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(47%,#f6f6f6), color-stop(100%,#ededed)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #ffffff 0%,#f6f6f6 47%,#ededed 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #ffffff 0%,#f6f6f6 47%,#ededed 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #ffffff 0%,#f6f6f6 47%,#ededed 100%); /* IE10+ */
    background: linear-gradient(top,  #ffffff 0%,#f6f6f6 47%,#ededed 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ededed',GradientType=0 ); /* IE6-8 */
}

/* 0-99 */
.l10.msg, .l10 label, .i10 span, .i10 input, .i10 textarea, .i10 select { width: 10px; }
.l20.msg, .l20 label, .i20 span, .i20 input, .i20 textarea, .i20 select { width: 20px; }
.l30.msg, .l30 label, .i30 span, .i30 input, .i30 textarea, .i30 select { width: 30px; }
.l40.msg, .l40 label, .i40 span, .i40 input, .i40 textarea, .i40 select { width: 40px; }
.l50.msg, .l50 label, .i50 span, .i50 input, .i50 textarea, .i50 select { width: 50px; }
.l60.msg, .l60 label, .i60 span, .i60 input, .i60 textarea, .i60 select { width: 60px; }
.l70.msg, .l70 label, .i70 span, .i70 input, .i70 textarea, .i70 select { width: 70px; }
.l80.msg, .l80 label, .i80 span, .i80 input, .i80 textarea, .i80 select { width: 80px; }
.l90.msg, .l90 label, .i90 span, .i90 input, .i90 textarea, .i90 select { width: 90px; }

/* 100-199 */
.l100.msg, .l100 label, .i100 span, .i100 input, .i100 textarea, .i100 select { width: 100px; }
.l110.msg, .l110 label, .i110 span, .i110 input, .i110 textarea, .i110 select { width: 110px; }
.l120.msg, .l120 label, .i120 span, .i120 input, .i120 textarea, .i120 select { width: 120px; }
.l130.msg, .l130 label, .i130 span, .i130 input, .i130 textarea, .i130 select { width: 130px; }
.l140.msg, .l140 label, .i140 span, .i140 input, .i140 textarea, .i140 select { width: 140px; }
.l150.msg, .l150 label, .i150 span, .i150 input, .i150 textarea, .i150 select { width: 150px; }
.l160.msg, .l160 label, .i160 span, .i160 input, .i160 textarea, .i160 select { width: 160px; }
.l170.msg, .l170 label, .i170 span, .i170 input, .i170 textarea, .i170 select { width: 170px; }
.l180.msg, .l180 label, .i180 span, .i180 input, .i180 textarea, .i180 select { width: 180px; }
.l190.msg, .l190 label, .i190 span, .i190 input, .i190 textarea, .i190 select { width: 190px; }

/* 200 - 299 */
.l200.msg, .l200 label, .i200 span, .i200 input, .i200 textarea, .i200 select { width: 200px; }
.l210.msg, .l210 label, .i210 span, .i210 input, .i210 textarea, .i210 select { width: 210px; }
.l220.msg, .l220 label, .i220 span, .i220 input, .i220 textarea, .i220 select { width: 220px; }
.l230.msg, .l230 label, .i230 span, .i230 input, .i230 textarea, .i230 select { width: 230px; }
.l240.msg, .l240 label, .i240 span, .i240 input, .i240 textarea, .i240 select { width: 240px; }
.l250.msg, .l250 label, .i250 span, .i250 input, .i250 textarea, .i250 select { width: 250px; }
.l260.msg, .l260 label, .i260 span, .i260 input, .i260 textarea, .i260 select { width: 260px; }
.l270.msg, .l270 label, .i270 span, .i270 input, .i270 textarea, .i270 select { width: 270px; }
.l280.msg, .l280 label, .i280 span, .i280 input, .i280 textarea, .i280 select { width: 280px; }
.l290.msg, .l290 label, .i290 span, .i290 input, .i290 textarea, .i290 select { width: 290px; }

/* 300 - 399 */
.l300.msg, .l300 label, .i300 span, .i300 input, .i300 textarea, .i300 select { width: 300px; }
.l310.msg, .l310 label, .i310 span, .i310 input, .i310 textarea, .i310 select { width: 310px; }
.l320.msg, .l320 label, .i320 span, .i320 input, .i320 textarea, .i320 select { width: 320px; }
.l330.msg, .l330 label, .i330 span, .i330 input, .i330 textarea, .i330 select { width: 330px; }
img.i330{ max-width: 330px; }
.l340.msg, .l340 label, .i340 span, .i340 input, .i340 textarea, .i340 select { width: 340px; }
img.i340 { max-width: 340px; }
.l350.msg, .l350 label, .i350 span, .i350 input, .i350 textarea, .i350 select { width: 350px; }
.l360.msg, .l360 label, .i360 span, .i360 input, .i360 textarea, .i360 select { width: 360px; }
.l370.msg, .l370 label, .i370 span, .i370 input, .i370 textarea, .i370 select { width: 370px; }
.l380.msg, .l380 label, .i380 span, .i380 input, .i380 textarea, .i380 select { width: 380px; }
.l390.msg, .l390 label, .i390 span, .i390 input, .i390 textarea, .i390 select { width: 390px; }

/* 400 - 499 */
.l400.msg, .l400 label, .i400 span, .i400 input, .i400 textarea, .i400 select { width: 400px; }
.l410.msg, .l410 label, .i410 span, .i410 input, .i410 textarea, .i410 select { width: 410px; }
.l420.msg, .l420 label, .i420 span, .i420 input, .i420 textarea, .i420 select { width: 420px; }
.l430.msg, .l430 label, .i430 span, .i430 input, .i430 textarea, .i430 select { width: 430px; }
.l440.msg, .l440 label, .i440 span, .i440 input, .i440 textarea, .i440 select { width: 440px; }
.l450.msg, .l450 label, .i450 span, .i450 input, .i450 textarea, .i450 select { width: 450px; }
.l460.msg, .l460 label, .i460 span, .i460 input, .i460 textarea, .i460 select { width: 460px; }
.l470.msg, .l470 label, .i470 span, .i470 input, .i470 textarea, .i470 select { width: 470px; }
.l480.msg, .l480 label, .i480 span, .i480 input, .i480 textarea, .i480 select { width: 480px; }
.l490.msg, .l490 label, .i490 span, .i490 input, .i490 textarea, .i490 select { width: 490px; }

/* >= 500 */
.l500.msg, .l500 label, .i500 span, .i500 input, .i500 textarea, .i500 select { width: 500px; }