@charset "UTF-8"; .loginForm section {width: 50%; float: left; padding-right: 1.5em} .loginForm section+section {padding: 0 0 0 1.5em} /* position sticky elements */ #content .checkout .right #summary, #content .checkout .left .fields .shippingMethod, #content .checkout .left .billing .creditC {top:4.38em; width: 100%; margin: 0; position: sticky; -webkit-position: sticky} /*grid */ .grid {width:100%; float: left; clear: both; display: block} .grid .col{float:left; -webkit-flex: 1 1 auto; -ms-flex: 1 1 auto; flex: 1 1 auto;} .gridInline .col{display: inline-block; float: none} .grid .col10{width:10%} .grid .col20{width:20%} .grid .col25{width:25%} .grid .col30{width:30%} .grid .col33{width:33.333%} .grid .col40{width:40%} .grid .col50{width:50%} .grid .col60{width:60%} .grid .col60{width:60%} .grid .col66{width:66.666%} .grid .col70{width:70%} .grid .col75{width:75%} .grid .col80{width:80%} .grid .col90{width:90%} .grid .colInside{width:100%;background-color:#efefef} #content .checkout > .grid {padding-bottom: 6em} #content .checkout, #content .checkout > form {width:100%; padding-right:0} #content .checkout h1 {margin-bottom: 1.25em; line-height: 120%} #content .checkout li {text-indent: 0} #content .checkout li:before {display: none} #content .checkout .print {float:right; padding:0.5em 1em; display: inline-block; margin-top: -6em} #content .checkout .print:before {content: "\f02f"; font-family: FontAwesome; margin-right:0.5em; display:inline-block; font-weight:100} #content .checkout .print+p {margin: -2em 0 2em; display: block} #content .checkout .grid { display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: stretch; -ms-flex-align: stretch; align-items: stretch;} #content .checkout .creditcard.grid {display: block} #content .checkout .col .grid {display: block} #content .checkout img {max-width:100%; height: auto} #content .checkout .back, #content .checkout .edit {float: right; font-size: 0.8em} #content .checkout .back:before, #content .checkout .edit:before {content: ""; display: inline-block; width: 0.81em; height: 0.81em; margin-right:0.4em} #content .checkout .back:before {background: url(/Products/ShoppingCart/images/icon-cart.svg) no-repeat center / contain} #content .checkout .edit:before {background: url(/Products/ShoppingCart/images/icon-pencil.svg) no-repeat center / contain} #content .checkout section > h1 {font-size: 1.35em; margin-bottom: 0.5em} #content .checkout section h2 {font-size: 1.15em;} #content .checkout .left {width:70%; padding-right:5%; border-right: 1px solid #ccc} #content .checkout .left > section {width:100%; float: left; clear:both} #content .checkout .left .bulky {float: right} #content .checkout .left [value="Place Order"] {float: right;} #content .checkout .left .items {width:100%; float: left; clear:both} #content .checkout .left .items li {overflow: auto; border-bottom: 1px solid #ccc; padding: 1.5em 0; background:none} #content .checkout .left .items li .product-name {margin-bottom: 0.125em} #content .checkout .left .items li a:hover .product-name {color: #007DB5} #content .checkout .left .items li .item-number {font-size: 0.8em; margin-bottom: 0.75em; opacity: 0.75; font-style: italic} #content .checkout .left .items li .col {text-align: right} #content .checkout .left .items li .col.product-image {min-height: 1px; text-align: center; padding-right: 2%} #content .checkout .left .items li .col.product-image a {display: block; padding-right: 1em} #content .checkout .left .items li .col.product-image a:hover {opacity: 0.8} #content .checkout .left .items li .col.product-image a img {max-width: 100px; max-height: 100px; display:inline-block; width:auto; height: auto} #content .checkout .left .items li .col40 {text-align: left} #content .checkout .left .items li .col40+.col20 label {line-height: 2.3rem} #content .checkout .order-confirmation .left .items li .col {text-align: left} #content .checkout .order-confirmation .left .items li .col.module {clear: both; margin-left: 20%; font-size: 0.875em} #content .checkout .order-confirmation .left .items li .col.module span {float:right} #content .checkout .order-confirmation .left .items li .col40 + .col20 label {line-height: 1.3rem} #content .checkout .left .items li .col40+.col20 label.unit-price span {white-space: nowrap; line-height: 1.3rem; margin-bottom: 0.5em} #content .checkout .left .items li .price {text-align: right; font-weight:500; line-height: 1.3rem} #content .checkout .left .items span {display: block; line-height: 120%;} #content .checkout .left .items .option {font-size: 0.8em; margin-top: 0.25em} #content .checkout .left .items .option span {display: inline-block} #content .checkout .left .items .selected-option {font-size: 0.9em; margin-bottom: 0.25em} #content .checkout .left .items .related-products {margin-top: 0.5em; border-top: 1px dashed #ccc; padding-top: 0.5em} #content .checkout .left .items .related-products > em {font-size: 0.8em;} #content .checkout .left .items .related-products > div {margin-top: 0.25em; position: relative; padding-right:3em;} #content .checkout .left .items .related-products > div .ExpandSkus {width: 1em; height: 1em; text-align: center; line-height: 1em; background: #007DB5; color: #fff; border-radius: 2px; display: inline-block; margin-right: 0.5em;} #content .checkout .left .items .related-products > div .ExpandSkus:hover {background: #007DB5} #content .checkout .left .items .related-products > div .DependentProducts div {font-size: 0.8em; margin-top: 0.5em; padding-top: 0.5em; position: relative; padding-right: 3.25rem} #content .checkout .left .items .related-products > div .DependentProducts div+div {border-top: 1px dashed #ccc} #content .checkout .left .items .related-products > div a:not(.button) {font-size: 0.875em} #content .checkout .left .items .related-products > div .button {position: absolute; right:0; top: 0.5em; font-size: 0.8rem; padding: 0.25em 0.5em} #content .checkout .left .items .discounted {} #content .checkout .left .items .remove {cursor:pointer; display: block; margin-top: 0.75em; font-size: 0.75em} #content .checkout .left .items .remove:before {content: "\00D7\ "; font-weight:600} #content .checkout .left .items input {width: 3.5em} #content .checkout .left .items input[value="Update Cart"] {width: auto; float: right} #content .checkout .left .productList {margin:3em 0 5em; padding:0} #content .checkout .left .productList h1 {text-align: left} #content .checkout .left .productList h1:before, #content .checkout .left .productList h1:after {content: ''} #content .checkout .left .productList .subCat {border:0} #content .checkout .left .callout {background: #ececec; padding: 3em; margin-top:3em; text-align: center; border-radius: 0.35em} #content .checkout .left .callout p:first-child {font-style: italic} #content .checkout .left .callout h1 {font-size: 2em; color:#0085c3; margin: 0.75em 0 1em} #content .checkout .left .callout p:nth-child(3) {line-height: 150%; color:#666; margin-bottom:2em} #content .checkout .left .fields {border-bottom: 1px solid #ccc} #content .checkout .left .fields.closed h1 {margin-bottom: 0} #content .checkout .left .fields div {margin-bottom: 0.25em} #content .checkout .left .fields form > div, #content .checkout .left .fields .paypal {margin: 1em 0} #content .checkout .left .fields.billing form > label {display: inline-block; border: 1px solid rgba(0,0,0,.2);padding: 0 1em;box-shadow: none; cursor: pointer; line-height: 2.3rem;height: 2.3rem;background: #eee;border-radius: 0.25em;} #content .checkout .left .fields [type="text"], #content .checkout .left .fields [type="email"], #content .checkout .left .fields [type="password"], #content .checkout .left .fields select {width: 100%} #content .checkout .left .shipping {padding-bottom: 3em} #content .checkout .left .shipping.closed {padding: 0 0 1em} #content .checkout .left .fields .shipping-info {padding-right:5%} #content .checkout .left .fields .shipping-info.no-padding {padding-right:0} #content .checkout .left .fields .shippingMethod {padding-left: 1em} #content .checkout .left .fields .shippingMethod div {margin-bottom: 0; width:100%} #content .checkout .left .fields .shippingMethod div label {display: block; position: relative; padding-left: 1.5em} #content .checkout .left .fields .shippingMethod div label input {position: absolute; left: 0} #content .checkout .left .fields .shippingMethod > #shipMethodContainer {margin-top: 1em; clear:right; font-size: 0.875em} #content .checkout .left .fields .shippingMethod span {float: right} #content .checkout .left .text-right {text-align: right} #content .checkout .left .billing {padding: 2em 0 3em; margin-bottom:1.75em} #content .checkout .left .billing.closed {padding: 1em 0} #content .checkout .left .billing .billingAddress {padding-right:5%} #content .checkout .left .billing #useAddress {margin-bottom: 2em} #content .checkout .left .billing .billingAddress :checked ~ label + div, /*#content .checkout .left .billing .cardInfo label + div {display: none}*/ #content .checkout .left .billing .cardInfo :checked ~ label + div {display: block} #content .checkout .left .billing .cardInfo {margin-bottom: 1em} #content .checkout .left .billing .cardInfo .payP .cardOptions {margin-left: -100%} #content .checkout .left .billing .cardInfo [for="CreditCard"]:before {content: "\f09d"; font-family:FontAwesome; display:inline-block; margin-right:0.25em;} #content .checkout .left .billing .cardInfo [for="PayPal"]:before {content: "\f1ed"; font-family:FontAwesome; display:inline-block; margin-right:0.25em;} #content .checkout .left .billing .cardInfo :checked ~ [for="CreditCard"], #content .checkout .left .billing .cardInfo :checked ~ [for="PayPal"] {color: #000} #content .checkout .left .billing input + span {font-size: 0.8em; font-style: italic; color:#666; display:block; margin:0.25em 0 0.75em; line-height:120%;} #content .checkout .left .billing .verNum [type="text"] {width: calc(100% - 2em)} #content .checkout .left .billing .verNum #que {display: none} #content .checkout .left .billing .verNum label {cursor: pointer} #content .checkout .left .billing .verNum label[for="que"] {width:1.25rem; height: 1.25rem; text-align: center; background:#333; line-height: 1.25rem; border-radius:50%; margin-left:0.25em; display:inline-block; vertical-align:middle; transition:all 200ms ease-out; cursor:pointer} #content .checkout .left .billing .verNum label[for="que"]:before {content: "?"; display: block; color:#fff; font-size: 0.7em} #content .checkout .left .billing .verNum label[for="que"]:hover, #content .checkout .left .billing .verNum :checked ~ label[for="que"] {background: #ccc} #content .checkout .left .billing .verNum aside {display: none; width: 100%; padding:0; margin:1em 0; font-size: 0.8em; line-height: 120%;} #content .checkout .left .billing .verNum aside strong {display: block} #content .checkout .left .billing .verNum :checked ~ label[for="que"] + aside {display: block;} #content .checkout .left .billing .expiration select {width:4em} #content .checkout .left .billing .expiration select+select {width:5em} #content .checkout .order-confirmation .left .items, #content .checkout .order-confirmation .left .shipping, #content .checkout .order-confirmation .left .billing {margin: 0; padding-bottom: 0; border-bottom: 0} #content .checkout .order-confirmation .left .createAccount {margin: 1em 0; padding-bottom: 2em; border-bottom: 1px solid #ccc} #content .checkout .order-confirmation .left .createAccount h3 {margin: 0} #content .checkout .order-confirmation .left .billing {padding-top: 0} #content .checkout .order-confirmation .left section > h1 {margin-bottom: 0} #content .checkout .order-confirmation .left .items ul {margin-bottom: 0} #content .checkout .order-confirmation .left .items li:last-child {border: 0} #content .checkout .right {width:22em; padding-left:5%;} #content .checkout .right [type="text"], #content .checkout .right [type="email"] {} #content .checkout .right .overview {font-size: 0.9em; padding:1.5rem 1rem; background: #f0f0f0; border-radius: 4px 4px 0 0} #content .checkout .right input[type="text"], #content .checkout .right input[type="email"], #content .checkout .right input[type="password"] {background: #fff} #content .checkout .right .overview hr {margin: 1em 0} #content .checkout .right .overview.closed {border-radius: 0.35em} #content .checkout .right .overview ul {margin:0} #content .checkout .right .overview li {background:none; overflow: auto; text-indent: 0; padding: 0} #content .checkout .right .overview li+li {margin-top: 0.25em} #content .checkout .right .overview li:last-child {font-size: 1.1em; border-top: 1px solid #ccc;margin-top: 1.25em; padding: 0.75em 0 0} #content .checkout .right .overview li span {background:none; padding: 0; float: right} #content .checkout .right .overview li:last-child span {font-weight:600} #content .checkout .right .overview li input {width: 7em} #content .checkout .right .overview li.calculateShipping input[type="text"] {width: calc(100% - 7em); height: 2.5rem; padding: 0 0.5em} #content .checkout .right .overview li #btnCalcShipping {padding: 0; width:7em; text-align: center; line-height: 1.6rem; height: 2.5rem; padding: 0} #content .checkout .right .action {padding: 1rem 1rem 1.5rem; background: #3b3b3b; border-radius: 0 0 4px 4px} #content .checkout .right .action input {width:100%; margin-bottom: 0.25em} #content .checkout .right .action [value="Login To Checkout"] {margin: 0 0 0.25em} #content .checkout .right .action .forgot-password {display: block; font-size: 0.875em; color:#fff; opacity: 0.7; text-align: center} #content .checkout .right .action .forgot-password:hover {opacity: 1} #content .checkout .right .action > .button {margin-top: 1rem; width: 100%; text-align: center} #content .checkout .right .action >.small{font-size: .75em; color:#fff; font-style: italic; opacity: 0.5} #content .checkout .right .action >.small:hover {opacity: 1} #content .checkout .right .action [value="Place Order"] {margin:0} #content .checkout .right .discount {margin-top: 3em} #content .checkout .right .discount span {display: block;} #content .checkout .right .discount form span {float:right} #content .checkout .right .discount input {display: inline-block;} #content .checkout .right .discount [type="submit"] {width: 6em; float: right; height: 2.5rem; padding: 0 0.5em} #content .checkout .right .discount [type="text"] {width:calc(100% - 6.25em); height: 2.5rem; padding: 0 0.5em} #content .checkout .manageLinks {position: absolute; top: -0.5em; right: 0;} /* removing links on checkout confirmation page */ #content .checkout.hide-product-links .left .items ul li {pointer-events: none} #content .checkout.hide-product-links .left .items .related-products {display: none} #content .checkout.hide-product-links .left .items h2+div {display: none} .paypal-button {width:26em !important; max-width:100% !important; height: calc(3rem + 2px) !important; border: 1px solid #0085c3 !important; position: relative !important; max-width:100% !important; background:#339dcf !important} .paypal-button:hover {background: #0085c3 !important} .paypal-button span img, .paypal-button br + span, .paypal-button span span, .paypal-button span.paypal-button-content {display: none !important} .paypal-button .paypal-button-logo {display: block !important} .paypal-button .paypal-button-logo:before {content: ""; position: absolute; top:0; left:0; font-size: 1rem; background: url(/images/icons/misc/paypal-logo.svg) no-repeat center #fff; transition: ease all 200ms; width: 3.2rem;height: 100%;display: inline-block;background-size: 23px 27px} .paypal-button:hover .paypal-button-logo:before {background: url(/images/icons/misc/paypal-logo.svg) no-repeat center #eee;background-size: 23px 27px} .paypal-button .paypal-button-logo:after {content: "Check out with PayPal ›"; text-shadow: 0 2px 0 #0085c3; vertical-align: middle;font-size: 0.9rem;display: inline-block;padding-left: 3.75rem; line-height: 3rem; font-style: italic;} .cartTable td{padding:.2em 0} .cartTable input, .cartTable select, .cartTable textarea,.cartTable table{width:100%;max-width:400px;max-width:30rem} .cartTable td:first-child{width:1%; white-space:nowrap;padding-right:.2em} .cartTable table td{width:50%;padding-left:.2em} .cartTable table td:first-child{width:50%;padding-right:.2em;padding-left:0} #content .checkout .left50{float:left;width:50%;padding:0 2em 0 0;margin-bottom:1em} #content .checkout .left50+.left50{padding:0 0 0 2em} #content .checkout .left50+hr{clear:both} .cartTabs{white-space:nowrap;float:left} .cartTabs>*{margin-right:1em} .cartTabs>*:before{content:"\203A";margin-right:1em;opacity:.5} .cartTabs>*:first-child:before{content:"";margin-right:0} .cartTabs .on{background:#ccc;padding:.5em .8em} .checkout .twoCol{margin-top:4em} #content .twoSec section{display:inline-block;margin:0;width:50;margin-top:0;float: left;} #content .threeSec section{display:inline-block;margin:0;width:33%;margin-top:0;float: left;} .twoSec section, .threeSec section{padding-bottom:2em;display:inline-block;} .createAccountBtn{line-height:2em;padding-top:2em} .cartTotal{font-size:1.5em;font-weight:bold} table input{width:100%} .checkout table input[type="submit"], .checkout table input[type="radio"], .checkout table input[type="checkbox"],table input[type="submit"], table input[type="radio"], table input[type="checkbox"]{width:auto} .checkout hr{clear:both} .checkout .order-confirmation hr{float: left; width:100%} .threeCol td{width:50%} .cartRedText { color:red; } .cartGreenText { color:green; } .wsProductsTable3 {border-collapse:collapse; margin:20px 0; width:100%} .wsProductsTable { border-collapse:collapse;width:100%; margin:20px 0 20px;border-bottom:1px solid #dadada} .wsProductsTable tr>*{text-align:right;padding:.5em 0 .5em 1em} .wsProductsTable tr>*:first-child, .wsProductsTable tr>td:first-child+td{text-align:left;padding-left:0} .wsProductsTable th {padding-bottom:5px} .wsProductsTable td {border-top:1px solid #dadada} .wsProductsTable em, .wsProductsTable td>span {line-height:1.3em;} .wsProductsTable em, .wsProductsTable td>span, .wsProductsTable2 em, .wsProductsTable3 table tr>td:first-child, .wsProductsTable4 tr>td:first-child {font-size:.9em;opacity:.65;filter:alpha(opacity=65);} .wsProductsTable3 table tr>td:first-child, .wsProductsTable4 tr>td:first-child {font-style:italic} strong.bulky {font-size:1.5em} .discountCode{white-space:nowrap;float:left} .updateTotal{float:right} .products .threeCol section{display:inline-block} .cartTabs img {position:relative;bottom:-3px} .wsProductsTable3 table tr>td:first-child.text {opacity:1;filter:alpha(opacity=100); font-style:normal} #wsDashboardChartTable li:before, #wsDashboardButtons li:before, #content .wsDashboardChart li:before, #wsDashboardLinks ul li:before {display: none} #content #wsDashboardChartTable tr+tr li {background:none; padding:0 0 0 25px; text-indent:-25px} #content #wsDashboardChartTable tr+tr ul {background:none; margin-left:30px;} #content #wsDashboardChartTable tr+tr strong {color:#000; font-size:1.6em} #wsDashboardButtons, #wsDashboardLinks {position:relative} #wsDashboardButtons>div, #wsDashboardLinks>div {float:right;position:relative;left:-50%;} #wsDashboardButtons>div>ul, #wsDashboardLinks>div>div {position:relative;left:50%} #wsDashboardButtons>div>ul>li, #wsDashboardLinks>div>div>ul {float:left;position:relative;background:none;} #wsDashboardButtons>div>ul>li>a , #wsDashboardLinks>div>div>ul {padding:15px 0 10px;width:170px; margin:0 25px 20px;} #wsDashboardButtons>div>ul>li {padding:0} #wsDashboardButtons li {margin: 0} #wsDashboardButtons>div>ul>li>a {display:block;border:1px solid #e6e6e6; text-decoration:none;text-align:center;color:#999; -moz-border-radius: .5em;border-radius: .5em; background: #efefef; /* for non-css3 browsers */ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f2f2f2', endColorstr='#e6e6e6'); /* for IE */ background: -webkit-gradient(linear, left top, left bottom, from(#f2f2f2), to(#e6e6e6)); /* for webkit browsers */ background: -moz-linear-gradient(top, #f2f2f2, #e6e6e6); /* for firefox 3.6+ */ -moz-box-shadow: 0px 3px 8px rgba(0,0,0,0.25), inset 0 0 0 rgba(49,101,155,0);-webkit-box-shadow: 0px 3px 8px rgba(0,0,0,0.25), inset 0 0 0 rgba(49,101,155,0);box-shadow: 0px 3px 8px rgba(0,0,0,0.25), inset 0 0 0 rgba(49,101,155,0); -webkit-transition: all 300ms ease-out; -moz-transition: all 300ms ease-out; -o-transition: all 100ms ease-out; transition: all 300ms ease-out; } #wsDashboardButtons>div>ul>li>a>strong { font-size:1.6em;color:#333} #wsDashboardButtons>div>ul>li>a>img { margin:5px 0 0} #wsDashboardButtons>div>ul>li>a:hover {color:#666; -webkit-box-shadow: 0px 3px 8px rgba(0,0,0,0.25), inset 0 0 45px rgba(49,101,155,0.15); -moz-box-shadow: 0px 3px 8px rgba(0,0,0,0.25), inset 0 0 45px rgba(49,101,155,0.15); box-shadow: 0px 3px 8px rgba(0,0,0,0.25), inset 0 0 45px rgba(49,101,155,0.15); } #wsDashboardLinks>div>div>ul>li{ background:none} #wsDashboardLinks>div>div>ul>li>a{text-decoration:none} #wsDashboardLinks>div>div>ul>li img{position:relative;bottom:-3px;margin:0 5px 0 0} .mobileOnly {display: none} @media screen and (max-width: 975px) { #content .checkout .left .items li {overflow: hidden} #content .checkout .left .items li .product-info {width: 60%; padding-right: 1em} #content .checkout .left .items li .product-price {width: 100%; margin-top: 1em} #content .checkout .left .shipping form > .grid, #content .checkout .left .billing form > .grid {display: block} #content .checkout .left .fields .shipping-info, #content .checkout .left .fields .shipping-rates, #content .checkout .left .billing .billingAddress, #content .checkout .left .billing .cardInfo {width: 100%; padding-right: 0} #content .checkout .left .billing .creditC {position: relative; margin-top: 2em; top:auto; width:100%} #content .checkout .left .billing .cardInfo .cardOptions, #content .checkout .left .billing .cardInfo .poOptions {margin-top: 1.5em} #content .checkout .left .text-right {clear: both; text-align: center} #content .checkout .left .fields.shipping div, #content .checkout .left .fields.billing div, #content .checkout .left .fields.shipping grid, #content .checkout .left .fields.billing grid {width: 100%; display: block} .loginForm section, .loginForm section+section {width: 100%; float: none; padding: 0} .loginForm section+section {margin-top: 3em} } @media screen and (max-width:750px) { /* resetting overflows for position sticky elements */ .products .wrap, body > * > .wrap, #content .checkout, .interior main > .wrap, #content .checkout > form, #alertApp > *, .home .wrap, body > footer > .fatFooter, .interior main:not(.products) > .wrap #content {overflow: unset !important} #content .checkout .right #summary, #content .checkout .left .fields .shippingMethod, #content .checkout .left .billing .creditC {position: relative; width:100%; top:auto} .mobileOnly {display: block} .mobileHide {display: none !important} .mobileLarge {font-size: 1.125em !important; padding: 0.875em 0; margin-top:1em; width:100%} .checkout .twoCol, .checkout .threeCol{ -webkit-columns:1; -moz-columns:1; columns:1; -webkit-column-gap:0; -moz-column-gap:0; column-gap:0; -webkit-column-rule:0; -moz-column-rule:0; column-rule:0; } #content .checkout .right {margin-bottom: 2em} #content .checkout section:not(#summary):not(.review) h1, #content .checkout section h2, #content .checkout .left .fields.billing .cardInfo > .creditC p {margin-bottom: 0} #content .checkout .left .shipping:not(.review), #content .checkout .left .billing:not(.review) {padding: 0; border: 0} #content .checkout .left .text-right {text-align: center} #content .checkout section:not(.review):not(.billing)+section:not(.review):not(.billing){margin-top:2em;padding-top:2em;border-top:1px solid #ccc} #content .checkout .left50, #content .checkout .left50+.left50{float: none;width:100%;padding:0} #content .checkout .CTA {display: none} #content .checkout .grid {-webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap;} #content .checkout .left, #content .checkout .right {width:100%; order:1} #content .checkout .left {border-right: 0; order:2; padding: 0 0 2em} #content .checkout .right h2, #content .checkout .left h2 {margin-bottom: 0.5rem} #content .checkout .left .items h2 {margin-bottom: 0} #content .checkout .left .items li .col, #content .checkout .left .items li .price {width: 100%; text-align: left} #content .checkout .left .items li .product-quantity {margin: 1em 0} #content .checkout .left .items li .col.product-image a {display: block; padding: 0; max-width: 10em; margin:0 0 1em} #content .checkout .left .items input[value="Update Cart"] {display: block;float: none;width: auto;margin: 0 auto;} #content .checkout .left .bulky, #content .checkout .left .fields.shipping .col50, #content .checkout .left .fields.shipping .col60.shipping-info, #content .checkout .left .fields.shipping .shipping-rates, #content .checkout .left .fields.billing .col50 {width: 100%; padding: 0; display: block; float: none} #content .checkout .left .fields.billing .col50 {padding-right: 0} #content .checkout .left .fields.billing #useAddress {margin-bottom: 1em} #content .checkout .left .fields.shipping .col60, #content .checkout .left .fields.billing .col60 {width:70%} #content .checkout .left .fields .shippingMethod > .col30 {text-align: left; font-weight: 400} #content .checkout .left .fields .shippingMethod > .col70 {font-size: 0.875em} #content .checkout .right {padding: 0} #content .checkout .right .action > a.bulky {font-size: 1.2em} #content .checkout .right .create {display: none} #content .checkout .right .action {display: none} #content .checkout.cartView .right .action {display: block} #content .checkout .left .billing .cardInfo label + div .col {width: 100%} #content .checkout .left .billing .cardInfo :checked ~ label + div {display: block; overflow: auto; width: 100%; padding-left: 1.5em} #content .checkout .left .billing .cardInfo .cardOptions, #content .checkout .left .billing .cardInfo .poOptions {width:100%; margin-top:0.5em} #content .checkout .left .billing .cardInfo .payP .cardOptions {margin-left: 0} #content .checkout .left .billing .expiration select, #content .checkout .left .billing .expiration select+select {width:49%} #content .checkout .order-confirmation .right {order: 1; border-top: 0} #content .checkout .order-confirmation .left {order: 2} #content .checkout .order-confirmation .left .shipping, #content .checkout .order-confirmation .left .billing {padding: 1.75em 0} #content .checkout .order-confirmation .left .createAccount {border: 0; padding-bottom: 1.75em} #content .checkout .right .discount {margin-top: 1em} .formTable input[type="text"], .formTable input[type="password"], .formTable input[type="tel"], .formTable input[type="number"], .formTable input[type="email"], .formTable input[type="url"], .formTable select, .formTable textarea {margin-bottom: 1em} #content .roamingButton {position: sticky;position: -webkit-sticky; bottom:0; padding: 0.75em 0; background: #fff} #content .loginForm {column-count: 1} #content .loginForm section+section {border-top: 1px solid #ccc; padding-top: 2em; margin-top: 1em} } @media screen and (max-width:450px) { .noMobile{display:none} .wsProductsTable th{font-size:1em} .wsProductsTable tr>*{text-align:right;padding:.2em 0 .2em .5em} .cartTabs>*{margin-right:.5em} .cartTabs>*:before{margin-right:.5em} }