/* FONTS

font-family: helvetica-neue-lt-pro;
weights: 200,300,400,500,700
font-family: helvetica-neue-lt-pro-cond;
weight: 700
*/


:root {
  --default-font: helvetica-neue-lt-pro;
  --default-font-size: 15px;
  --default-line-height: 1.5;

  --default-input-font: helvetica-neue-lt-pro;
  --default-input-font-size: 14px;
  --dim-input-height: 50px;
  
  --button-input-font: helvetica-neue-lt-pro-cond;
  --button-font-size: 15px;
  --button-height: 50px;

  --col-primary: #3CB4E5;
  --col-accent: #E50019;

  --col-burger: #3CB4E5;
  --col-text: #000;
  --col-page-bg: #fff;
  --col-border: #DDE2E1;
  --col-input: #000;
  --col-placeholder: #000;
  --col-input-bg: #EFEFEF;
  --col-button: #fff;
  --col-button-bg: #E50019;
  --col-link: #000;
  --col-link-hover: #000000;

  --col-error: #ff6633;
  --col-attention: #ff6633;
  --col-warning: #f5b00e;
  --col-missing: #ff6633;

  --col-primary-rgb: 43, 54, 133;
  --col-accent-rgb: 99, 181, 206;
  --col-button-rgb: 255, 255, 255;
  --col-link-rgb: 0,0,0;
  --col-link-hover-rgb: 0, 0, 0;
  --col-error-rgb: 255, 51, 0;
  --col-attention-rgb: 255, 51, 0;
  --col-warning-rgb: 245, 176, 14;
  --col-border-rgb: 190, 190, 190;
  --col-missing-rgb: 255, 51, 0;

  --dim-site-width: 1920px;
  --dim-site-inner-width: 1240px;
  --dim-default-space: 80px;

  --vh: 1vh;
}


html { scroll-behavior: smooth; }

/* THEME */

h1 {color: var(--col-primary); font-size: 80px;font-style: normal;font-weight: 700;line-height: 1;text-transform: uppercase; font-family: helvetica-neue-lt-pro-cond; margin-bottom: 30px}
h2 {color: var(--col-accent); font-size: 40px;font-style: normal;font-weight: 700;line-height: 1;text-transform: uppercase; font-family: helvetica-neue-lt-pro-cond; margin-bottom: 10px}
h2.spaced {margin-bottom: 40px}
h2.small {font-size: 22px}
h2.large {font-size: 80px}
h3 {color: #000; font-size: 22px;font-style: normal;font-weight: 700;line-height: normal;text-transform: uppercase; font-family: helvetica-neue-lt-pro-cond; margin-bottom: 15px}
h4 {color: #000; font-size: 18px;font-style: normal;font-weight: 700;line-height: normal;text-transform: uppercase; font-family: helvetica-neue-lt-pro-cond; margin-bottom: 15px}

h2.h6  {color: #000; font-size: 15px;font-weight: 700;letter-spacing: 0.6px;text-transform: uppercase; font-family: helvetica-neue-lt-pro-cond; margin-bottom: 10px}
h1.tight {line-height: 0.875}

.b-gray { background: #F5F5F5 !important;}
.c-gray { color: #666666 !important;}

.shorter { max-width: 640px; margin-left: 0; margin-right: auto}
.shortest { max-width: 512px; margin-left: 0; margin-right: auto}

p.spaced { line-height: 1.66}
p.spaced2 { line-height: 1.5}

/*CONTAINERS*/
#container { max-width: 1440px; margin: 0 auto;}
div.container {padding: 40px 0; max-width: 1240px; margin: 0 auto;}
div.container2 {padding: 80px 0; max-width: 1240px; margin: 0 auto;}
div.container-no-overflow  {max-width: 1240px; margin: 0 auto; overflow: hidden}

/*BUTTONS*/
a.btn {border-radius: 5px; padding: 0 20px; position: relative; font-weight: 700; letter-spacing: 0.6px; text-transform: uppercase;}
a.btn.right { margin: 0 0 0 auto}
a.btn-small {padding: 0 12px; line-height: 22px; font-size: 12px; text-decoration: none;}
a.btn-blue {border: 2px solid var(--col-primary); color: var(--col-primary); background: #fff; }
a.btn-blue2 {border: 2px solid var(--col-primary); background-color: var(--col-primary); color: #fff; }
a.btn.btn-semi { border: 1px solid #FFF; background: rgba(0, 0, 0, 0.50);}
a.btn.btn-transparent { background: transparent}
a.btn.btn-gray { border: 2px solid #9EACAA; color: #9EACAA; background: transparent}
a.btn.btn-arrow { padding-right: 48px;}
a.btn.btn-arrow:after { content:""; display: block;position: absolute; right: 22px; top: 0; width: 17px; height: 100%; background: url(/img/svg/arrow.svg) no-repeat center center; background-size: contain; z-index: 3;}
a.btn.btn-call {border: 2px solid var(--col-primary); background-color: var(--col-primary); color: #fff; padding-left: 100px; line-height: 70px; font-size: 30px; white-space: nowrap; }  
a.btn.btn-call:after {content:""; background: url(/img/svg/phone.svg) var(--col-primary) no-repeat center center; background-size: contain; width: 40px; height: 100%; left: 37px; position: absolute; top: 0; display: block; }  

.flex-jc-spaced {justify-content: space-between !important}

div.buttons.stacked { flex-direction: column; gap: 13px; align-items: stretch}

/*HEADER AND NAV*/

header { position: relative; width: 100%; display: block; z-index: 8} 
header div.burger { display: block; z-index: 99; position: fixed; top: 30px; left: 0;  padding: 20px; display: none;}
/*div.burger ul {top: 0; left: 0; width: 100%; margin: 0}*/
/*div.burger ul li { height: 1px;}*/
/*div.burger ul li:nth-child(2) { top: 4px;}*/
/*div.burger ul li:nth-child(3) { top: 8px;}*/
/*header.active div.burger { top: 0; left: auto; left: 340px; position: fixed;}*/
/*header.active div.burger ul li { background-color: #000}*/

div.header-locations { display: block; background: #F5F5F5; margin-bottom: 20px;}
div.header-locations > div { display: flex; justify-content: space-between; gap: 0; align-items: stretch; max-width: 1240px; margin: 0 auto}
div.header-locations > div a { order: 1; display: block; line-height: 30px; max-height:30px; text-align: center; position: relative; text-transform: uppercase; flex: 1; font-size: 11px;}
div.header-locations > div a.active { order: 1; background: #0000000D; }
div.header-locations > div a.active:before{ position: absolute; left: 0; top: 0; height: 100%; display: flex; width: 37px; background: #3CB4E5; z-index: 3; content: "My Store";  font-weight: 700;line-height: 1;letter-spacing: -2%; font-size: 8px; text-transform: uppercase; align-items: center; padding-left: 29px; color: #fff; text-align: left; background: url(/img/svg/active-badge.svg) transparent no-repeat left top; background-size: contain;}
div.header-locations > div a.active:after { position: absolute; left: 8px; top: 11px; height: 9px; display: block; width: 13px; z-index: 4; content: ""; background: url(/lib/img/white/checkmark.svg) no-repeat center center; background-size: contain; }

div.header-tools { max-width: 1240px; margin: 0 auto 20px; display: flex; justify-content: space-between; gap: 26px;}
div.header-tools a.logo { width: 290px; }

div.header-tools div.js-search-input {flex: 1; position: relative;}
div.header-tools div.js-search-input input {width: 463px; max-width: 100%; line-height: 40px; min-height: 40px; border-radius: 5px; background: #F5F5F5; border: 1px solid var(--col-border); padding-left: 13px; margin: 0 0 0 auto;}
div.header-tools div.js-search-input input:placeholder {color: #9EACAA; font-size: 14px}
div.header-tools div.js-search-input a.js-search-full {position: absolute; right: 12px; top: 12px; width: 17px; height: 17px; padding: 0; z-index: 3; display: block; line-height: 1; background: transparent;}

div.js-search-results { display: none; padding: 0px; width: 463px; max-width: 100%; border-radius: 0px; border: 0px solid #fff; margin-top: 5px; max-width: 690px; margin: 0 auto; background: #fff;}
div.js-search-input.open { overflow: visible; }
div.js-search-input.open div.js-search-results { display: block; box-shadow: 5px 5px 8px rgba(0,0,0,0.3); margin: 0 0 0 auto}
div.js-search-input a.js-search-full {display: block; position: absolute; right: 10px; top: 0px; background: url(/img/i/blue/search.svg) no-repeat right center; background-size: auto 15px; width: 30px; height: 30px; cursor: pointer; }
div.js-search-results a { display: block; width: 100%;  line-height: 1.5; font-size: 16px; color: #000; text-align: left !important; padding: 5px 0px 5px 10px; border-bottom: 1px solid #fff; }
div.js-search-results a:last-child { border: 0}
div.js-search-results a small { display: block; font-size: 12px; color: #000; text-transform: uppercase;} 
div.js-search-results a:hover { color: #000 !important; background-color: #eee}
div.js-search-results a.selected { color: #fff !important; background-color: #999}
div.js-search-results a:hover small {  color: #000 !important;}
div.js-search-input a.js-search-close {display: none}
div.js-search-input.open a.js-search-close {display: block; position: absolute; right: 0px; top: 0px; background: url(/img/icons/white/x.svg) no-repeat center center; background-size: 12px 12px; width: 30px; height: 30px; cursor: pointer; display: none;}

div.header-tools a.logo  img { display: block; width: 100%; }

div.header-icons { display: flex; justify-content: space-between; gap: 20px; height: 40px; align-items: center;}
div.header-icons a { text-transform: uppercase; font-size: 10px; font-weight: 700; display: flex; justify-content: space-between; gap: 3px; align-items: center;}
div.header-icons a.cart-indicator.active:after { position: absolute;    top: 0px;    right: -16px;    width: 16px;    height: 16px;    line-height: 15px;padding-top: 2px;    text-align: center;font-size: 12px; color: #fff; content: attr(data-items); background-color: var(--col-primary); border-radius: 20px; display: block;}
header div.nav { display: flex; justify-content: space-between; gap: 50px; max-width: 1240px; margin: 0 auto; align-items: center;}
header nav { display: block; width: 100%;}
header nav div.level-1{ display: flex; justify-content: flex-start; align-items: flex-end; flex: 1; gap: 37px; }
header nav div.level-1 > div > a { display: block; line-height: 50px; font-family: helvetica-neue-lt-pro-cond; font-size: 15px; text-transform: uppercase; color: #9EACAA; font-weight: 700; letter-spacing: 4%; padding: 0;}
header nav div.level-1 > div.sub.catalog > a { background: var(--col-accent); color: #fff; padding: 0 33px 0 57px; border-radius: 10px 10px 0 0}
header nav div.level-1 > div.sub.catalog > a:after { content:""; position: absolute; top: 22px; left: 33px; width: 10px; height: 8px; background: url(/img/svg/burger.svg) no-repeat center center; background-size: contain;}

header nav div.level-1 .sub.catalog div.level-2 { display: block; left: -340px; position: absolute; top: 0; width: 340px; background: #fff; height: calc(100 * var(--vh)); position: fixed; opacity: 0; transition: all .2s ease-in;  z-index: 10; }
header nav div.level-1 .sub.catalog a.close-nav { position: absolute; top: 29px; right: 20px; width: 12px;}
header nav div.level-1 .sub.catalog a.close-nav img { display: block; width: 100%; cursor: pointer;}

header nav div.level-1 .sub.standard div.level-2 { display: block; top: -200vh; position: absolute; left: -20px; width: 680px; }
header nav div.level-1 .sub.standard div.level-2 a.close-nav { display: none}

header nav div.level-1 div.level-2 > div.subnav { width: 100%; display: flex; justify-content: flex-start; gap: 0; flex-direction: column; align-items: flex-start;}
header nav div.level-1 div.level-2 > div.subnav  > div { background: #fff; }

header nav div.level-1 div.level-2 > div.subnav  div.nav-flyer { background: var(--col-primary)}
header nav div.level-1 div.level-2 > div.subnav  div.nav-flyer span { border-radius: 2.5px; background: rgba(255, 255, 255, 0.25);}
header nav div.level-1 div.level-2 > div.subnav  div.nav-flyer a { color: #fff;}
header nav div.level-1 div.level-2 > div.subnav  div.nav-logo { padding: 20px 17px; width: 100%; }
header nav div.level-1 div.level-2 > div.subnav  div.nav-logo img { display: block; width: 100%; max-width: 217px; margin: 0 auto 0 0} 
header nav div.level-1 div.level-2 > div.subnav  div a { width: 340px; margin: 0 0 0 auto; display: block; color: #000; font-size: 15px;font-weight: 700;letter-spacing: 0.6px;text-transform: uppercase; font-family: helvetica-neue-lt-pro-cond; padding: 16px 0; padding-left: 60px; text-align: left; line-height: 1; position: relative;}

header nav div.level-1 div.level-2 > div.subnav div a { width: 340px; margin: 0 0 0 auto; display: block; color: #000; font-size: 15px;font-weight: 700;letter-spacing: 0.6px;text-transform: uppercase; font-family: helvetica-neue-lt-pro-cond; padding: 16px 0; padding-left: 20px; text-align: left; line-height: 1; position: relative;}
header nav div.level-1 div.level-2 > div.subnav > div:hover { background: #F5F5F5}
header nav div.level-1 div.level-2 > div.subnav > div.nav-flyer:hover  a { color: #000}
header nav div.level-1 div.level-2 > div.subnav > div.nav-flyer:hover  span { background: rgba(0,0,0,0.20)}
header nav div.level-1 div.level-2 > div.subnav  div a span { width: 30px; height: 30px;  display: none; position: absolute; top: 10px; left: 20px; background: #F5F5F5; }
header nav div.level-1 div.level-2 > div.subnav  div a span img { display: none; width: 100%; height: 100%; object-fit: contain;}

header nav div.level-1 .sub.catalog div.level-2 > div.subnav div  a { padding-left: 60px; }
header nav div.level-1 .sub.catalog div.level-2 > div.subnav div  a span { display: block; }
header nav div.level-1 .sub.catalog div.level-2 > div.subnav div  a span img { display: block; }

header nav div.level-1 div.level-3 { display: none; justify-content: flex-start; gap: 0; flex-direction: column; position: absolute; width: 340px; left: 340px; top: 0; background: #F5F5F5;}
header nav div.level-1 div.level-3 > a { display: block;padding: 16px 20px; text-align: left; color: #000; font-size: 15px;font-weight: 700;letter-spacing: 0.6px;text-transform: uppercase; font-family: helvetica-neue-lt-pro-cond; line-height: 1; }
header nav div.level-1 div.level-3 > a:hover { background: #D9D9D9}
header nav div.level-1 div.level-2 > div.subnav  > div:hover div.level-3 {display: flex}
header a.nav-support-link { display: block; width: 200px; }
header a.nav-support-link img { display: block; width: 100%;}

/*header nav div.level-1 div.level-2 { top: 0}*/
header nav div.level-1 > div.sub.standard:hover div.level-2 { top: 50px}
nav div.level-1 .sub.catalog.open div.level-2 { left: 0; opacity: 1;}

footer {background: #F5F5F5; padding: 80px 30px 0; max-width: 1440px; margin: 0 auto}
footer div.footer-row {max-width: 1240px; padding-bottom: 45px; border-bottom: 1px solid #D9D9D9; margin: 0 auto 35px; }
footer div.footer-row.last-row {border: 0}

footer div.logo { width: 290px; margin: 0 auto 26px 0;}

div.footer-grid { display: flex; justify-content: space-between; gap: 98px;}
div.footer-grid > div:first-child { flex: 1; }
footer div.footer-nav { display: flex; justify-content: space-between; gap: 98px;}
footer div.footer-nav div.title {  font-family: helvetica-neue-lt-pro-cond; color: #000; font-size: 13px; font-weight: 700; letter-spacing: 1.95px;text-transform: uppercase; display: block; margin-bottom: 10px;}
footer div.footer-nav p {}
footer div.footer-nav p a {font-size: 12px; line-height: 1.67; display: block; ;}
footer div.footer-nav img { display: block; height: 10px}
footer div.social { display: flex; justify-content: space-between; gap: 20px;}
footer div.social a { display: block; font-size: 20px; }

footer div.disclaimer { display: flex; justify-content: space-between; gap: 50px; align-items: flex-start;}
footer div.disclaimer > p { flex: 1;}
footer div.disclaimer div.fdo { width: 410px; max-width: 33%; }
footer div.disclaimer div.fdo img { display: block;mix-blend-mode: multiply;}

/*ELEMENTS*/



/*GRIDS*/

/*CONTENT*/

div.mask-1:after {content:""; background: rgba(0, 0, 0, 0.54); width: 100%; height: 100%; position: absolute; top: 0; left: 0; display: block; z-index: 3;}
div.caption-home { padding-left: 100px; z-index: 5;}
div.caption-home p.eyebrow { color: #FFF; }
div.caption-home h1 { color: #FFF; font-size: 100px; font-style: normal; font-weight: 700; line-height: 1; text-transform: uppercase; margin-bottom: 40px}
div.caption-home h1 span { display: block;}
div.caption-home p { color: #FFF; font-size: 20px; font-style: normal; font-weight: 400; line-height: normal; max-width: 700px; margin: 0 auto 50px 0}

p.eyebrow { font-size: 13px; font-style: normal; font-weight: 700; line-height: normal; letter-spacing: 3.38px; text-transform: uppercase; margin-bottom: 10px;font-family: helvetica-neue-lt-pro-cond; color: var(--col-primary);}
div.buttons {justify-content: flex-start;}

h2.icon-flyer {padding-left: 50px; position: relative}
h2.icon-flyer:before {content: ""; display: block; position: absolute; left: 0; top: 0; height: 100%; width: 40px; background: url(/img/svg/flyer.svg) no-repeat left center; background-size: contain;}

div.flyer-cards { display: flex; justify-content: space-between; gap: 20px; margin: 0 auto 40px;}
div.flyer-cards > div > a { display: block; background: #fff; padding: 20px;border-radius: 10px; padding-right: 240px; height: 100%}
div.flyer-cards > div { display: block;}
div.flyer-cards > div img { display: block; width: 198px; height: 143px; right: 20px; top: 50%; transform: translateY(-50%); position: absolute;}
div.flyer-cards strong { display: block;color: var(--col-accent); font-size: 60px;font-style: normal;font-weight: 700;line-height: normal;text-transform: uppercase; margin-bottom: 30px}
div.flyer-cards strong span { display: block; font-size: 0.33em; }
div.flyer-cards p.msg { font-size: 15px; margin-bottom: 0}

div.flyer-cards-alt { display: flex; justify-content: space-between; gap: 20px; margin: 0 auto 40px;}
div.flyer-cards-alt > div > a { display: block; height: 160px;}
div.flyer-cards-alt > div { background: #fff;  flex: 1;border-radius: 10px; display: flex; justify-content: space-between; gap: 10px; flex-direction: column; padding: 20px; }
div.flyer-cards-alt > div img { display: block; width: 100%; height: 100%; object-fit: contain;}
div.flyer-cards-alt p { display: block; width: 100%; padding: 0px; text-align: center; font-size: 16px; font-family: helvetica-neue-lt-pro-cond; text-transform: uppercase; letter-spacing: 0.5%; margin: 0}

a.category-slide { background: #fff; height: 295px; padding-bottom: 40px; border: 1px solid #d9d9d9; background: #fff; border-radius: 10px; overflow: hidden; display: block; position: relative}
a.category-slide div { position: absolute; width: 100%; display: block; bottom: 0; left: 0; border: 1px solid #D9D9D9; background: #D9D9D9; line-height: 40px; text-align: center; color: #000; color: #000; font-size: 15px;font-style: normal;font-weight: 700;letter-spacing: 0.6px;text-transform: uppercase; font-family: helvetica-neue-lt-pro-cond;}
a.category-slide img { width: 100%; height: 100%; object-fit: contain;}
div.slider-categories div.slick-slide { padding: 0 20px;}
div.slider-categories .slick-list { padding-bottom: 75px}
div.slider-categories ul.slick-dots { bottom: 5px; display: flex; justify-content: center; gap: 10px; width: 100%; padding: 0; margin: 0}
div.slider-categories ul.slick-dots li { margin: 0; padding: 0; width: 20px; display: block;}
div.slider-categories ul.slick-dots li button { margin: 0; padding: 0; width: 100%; height: 20px; background: var(--col-border);}
div.slider-categories ul.slick-dots li.slick-active button { background: var(--col-accent);}
div.slider-categories .slick-arrow {background: url(/img/svg/circle-arrow.svg) no-repeat center center; background-size: contain; width: 30px; height: 30px; top: auto; bottom: 0; right: auto; left: 50%;}
div.slider-categories .slick-arrow.slick-prev { margin-left: -80px;}
div.slider-categories .slick-arrow.slick-next{ margin-left: 50px; transform: rotate(180deg)}

div.video { width: 100%; margin: 40px auto; }
div.video.as-square iframe { aspect-ratio: 1}
div.video.as-wide iframe { aspect-ratio: 2.4}
div.video.rounded { border-radius: 20px; overflow: hidden}

div.grid-1 { display: flex; justify-content: space-between; gap: 20px; margin-bottom: 60px}
div.grid-1 > a { display: block; flex: 1; background: #fff; border-radius: 10px; padding: 23px;}
div.grid-1 > a > div.thumb { display: block; width: 100%; height: 160px; margin-bottom: 15px;}
div.grid-1 > a > div img { display: block; width: 100%; height: 100%; object-fit: contain; object-position: center top; }
div.grid-custom-metal a span { color: var(--col-accent); font-family: helvetica-neue-lt-pro-cond; font-size: 15px; font-weight: 700; letter-spacing: 0.6px;text-transform: uppercase; margin-bottom: 12px; display: block;}
div.grid-custom-metal a div.title { color: #000; font-family: helvetica-neue-lt-pro-cond;  font-size: 22px;font-weight: 700; text-transform: uppercase; margin-bottom: 11px; display: block;}
div.grid-custom-metal a p {font-size: 15px}

div.cta-custom-metal { display: flex; justify-content: space-between; gap: 40px; align-items: flex-end;}
div.cta-custom-metal > div {flex: 1;}

div.grid-2 { display: flex; justify-content: space-between; gap: 0;}
div.grid-2 > div { flex: 1;}

div.grid-3 {display: flex; justify-content: space-between; gap: 40px; flex-direction: column; padding-right: 90px;}

div.grid-4 {display: flex; justify-content: space-between; gap: 0;}
div.grid-4> div {flex: 1}
div.grid-4> div:first-child {padding-right: 100px}

div.grid-content-holder { display: flex; justify-content: flex-start; gap: 60px; flex-direction: column}
div.grid-content { display: flex; justify-content: flex-start; gap: 40px; align-items: center;}
div.grid-content:nth-child(even) { flex-direction: row-reverse;}
div.grid-content > div { flex: 1;}
div.grid-content div.copy { padding: 0 40px;}
div.grid-content div.copy p { max-width: 420px; margin-right: auto; margin-left: 0}
div.grid-content div.image { border-radius: 10px; overflow: hidden}

div.grid-header2 {  display: flex; justify-content: space-between; gap: 0px; margin-top: -190px; z-index: 3; padding: 0 0px 50px; align-items: flex-end; width: 100%; max-width: 1280px; margin-left: auto; margin-right: auto;}
div.grid-header2 > div {  flex: 1;}
div.caption-header { border-radius: 20px 20px 0 0; background: #fff; padding: 30px 30px 0; }
div.grid-header2 div.buttons.stacked { max-width: 260px; margin: 0 auto}

div.grid-create-account { display: flex; justify-content: space-between; gap: 0; align-items: center; max-width: 1240px; margin: 0 auto}
div.grid-create-account > div { flex: 1}
div.grid-create-account img { display: block; width: 100%; max-width: 400px; margin: 0 auto 0 80px;}
div.grid-create-account div:first-child { padding: 30px 30px 30px 0; }


div.grid-cart { display: flex; justify-content: space-between; gap: 80px;}
div.grid-cart > div { flex: 1}

div.cart-favourites { display: flex; justify-content: space-between; gap: 16px; align-items: center; max-width: 377px; width: 100%;}
div.cart-favourites img { display: block; width: 21px;}
div.cart-favourites > div { flex: 1}

div.cart-block { display: block;}
div.cart-block-border { padding-bottom: 40px; margin-bottom: 40px; border-bottom: 1px solid var(--col-border); display: block;}
div.cart-block-border2 { padding-top: 20px; margin-top: 20px; border-top: 1px solid var(--col-border); display: block;}
div.cart-products { display: flex; justify-content: space-between; gap: 20px; flex-direction:  column; margin-bottom: 60px;}
div.cart-products >  div { flex: 1}
div.cart-product { display: flex; justify-content: space-between; gap: 20px; align-items: flex-start; padding-top: 20px; border-top: 1px solid var(--col-border); }
div.cart-product > div:last-child { flex: 1}
div.cart-product .product-image { width: 150px; height: 150px; border: 1px solid var(--col-border); border-radius: 10px; overflow: hidden; padding:  10px;}
div.cart-product .product-image a { display: block; width: 100%; height: 100%; }
div.cart-product .product-image a img { display: block; width: 100%; height: 100%; object-fit: contain;}
div.cart-product div.name { font-family: helvetica-neue-lt-pro-cond; font-weight: 700;font-size: 18px;text-transform: uppercase; color: #000; margin-bottom: 5px;}
div.cart-product div.price { font-family: helvetica-neue-lt-pro-cond; font-weight: 700;font-size: 20px;text-transform: uppercase; color: #000; margin-bottom: 30px;}
div.cart-product div.product-item-number { text-transform: none; margin-bottom: 10px; color: #666666}
div.cart-tools { display: flex; justify-content: flex-start; gap: 23px;  align-items: center; align-items: center; }
a.remove-cart-product {display: block; width: 12px;}
div.cart-tools div.qty span.warning { display: none;}
div.cart-tools div.qty:after { font-weight: 700;  display: block; padding-top: 5px}
div.cart-tools.low-stock div.qty:after { content: "low stock"; color: #e25110; }
div.cart-tools.no-stock div.qty:after { content: "out of stock"; color: #ff0000; }
div.cart-tools.in-stock div.qty:after { content: "in stock"; color: #00AB39; }
div.cart-tools input { line-height: 50px; min-height: 50px; display: inline-block; width: 80px; text-align: center; border: 1px solid var(--border-colour); color: #000; font-size: 14px; font-weight: 500; border: 1px solid #9EACAA; border-radius: 5px}

div.cart-total-block { display: flex; justify-content: flex-start; gap: 8px; flex-direction: column; border-top: 1px solid var(--col-border); padding-top: 20px; margin-bottom: 20px; align-items: flex-start;}
div.cart-total-line {display: flex; justify-content: space-between; gap: 10px; margin: 12px auto; width: 100%}
div.cart-total-line > div:first-child { flex: 1; }
div.cart-total-line > div:last-child { width: 140px; text-align: right}
div.cart-total-label, div.cart-total-value {font-family: helvetica-neue-lt-pro-cond; font-weight: 700;font-size: 20px; letter-spacing: 4%; text-transform: uppercase;}
div.cart-total-label small {color: #666666; font-family: helvetica-neue-lt-pro; font-size: 15px; font-weight: normal; text-transform: none;}
div.cart-total-label p.discount-warning  {color: #EA0029; font-family: helvetica-neue-lt-pro; font-size: 15px; font-weight: normal; text-transform: none; margin-top: 20px}

div.cart-actions { display: flex; justify-content: space-between; gap: 10px; width: 100%; padding-top: 30px}
div.cart-actions .btn { margin: 0 0 20px auto;}

div.checkout-summary, div.js-checkout-review, div.js-checkout-confirmation, #shipping-instructions, #time-required, .js-payment-choice { display: none;}
div.checkout-summary.active, div.js-checkout-review.active, div.js-checkout-confirmation.active, #shipping-instructions.active, #time-required.active, .js-payment-choice.active  { display: block;}
div.checkout-holder.with-summary.in-review div.js-checkout-delivery, div.checkout-holder.with-summary.in-review div.js-checkout-payment {display: none !important}
div.checkout-holder.in-review .js-checkout-review { display: block !important;}
div.checkout-holder.with-summary .checkout-summary { display: block !important;}
div.checkout-holder.in-confirmation .checkout-summary, div.checkout-holder.in-confirmation .js-checkout-review { display: none !important;} 
div.checkout-holder.in-confirmation .js-checkout-confirmation { display:block !important;} 

div.radio.missing label { color: var(--col-missing)}
div.radio.missing label:before { border-color: var(--col-missing)}
#shipping-instructions.active { margin-bottom: 20px !important}

div.js-shipping-choices { padding-top: 0px; }
div.radio-group-1 { display: flex; justify-content: flex-start; gap: 60px; padding-bottom: 20px}
div.radio-group-1 div.radios { width: auto}

div.radio-group-2 { display: flex; justify-content: flex-start; gap: 10px; flex-direction: column; padding-bottom: 20px}

div.js-review-blocks {display: grid; gap: 50px; grid-template-columns: 1fr 1fr;} 
.js-review-block-data div { line-height: 1.5; margin-bottom: 10px;}
.js-review-block-data a.edit { text-decoration: underline}
.js-review-block-data b { display: block; margin-bottom: 5px; font-weight: 600;}
div.js-checkout-confirmation .js-review-blocks { max-width: 640px; margin: 0 auto 40px 0;}

.js-checkout-form .warning { color: var(--col-accent)}

div.checkout-warning { line-height: 1.5;    margin: 30px auto;    padding: 20px 20px 20px 70px;    background: url(/img/icons/dark/info.svg) no-repeat 20px 20px;    border: 1px solid var(--col-primary);    background-size: 30px 30px;    min-height: 50px;    color: var(--col-primary);    font-size: 15px;    font-weight: 400;    border-radius: 10px;}
div.checkout-warning a { color: var(--col-primary);   text-decoration: underline}
div.promo-code { display: flex; justify-content: space-between; gap: 20px; align-items: flex-end}
div.promo-code input { width: 280px; max-width: 100%}
.js-processing-disclaimer { padding-bottom: 20px; font-weight: 500}

div.masterclass-list { display: grid; gap: 0; grid-template-columns: 1fr 5fr 1fr; border-top: 1px solid #666; margin-bottom: 60px;}
div.masterclass-list div { padding: 20px 0; border-bottom: 1px solid #666}
div.masterclass-list div.date {color: var(--col-primary); font-family: helvetica-neue-lt-pro-cond; font-size: 13px; font-weight: 700; letter-spacing: 0.6px; text-transform: uppercase;}
div.masterclass-list div.name  {padding: 20px 50px; color: #fff;}
div.masterclass-list div.location {color: #666; text-align: right;font-size: 12px;letter-spacing: 2.4px; text-transform: uppercase;}

div.blog-home { display: flex; justify-content: space-between; gap: 20px;}
div.blog-home a.card { display: flex; flex: 1; background: #fff; border-radius: 10px; overflow: hidden; flex-direction: column; justify-content: space-between;}
div.blog-home div.card-image { display: block; width: 100%; height: 190px; }
div.blog-home div.card-image img { display: block; width: 100%; height: 100%; object-fit: cover;}
div.blog-home div.card-body {display: flex; justify-content: space-between; gap: 25px; flex-direction: column; padding: 20px; flex: 1}
div.blog-home div.title { color: #000; font-family: helvetica-neue-lt-pro-cond; font-size: 20px;font-weight: 700;line-height: normal; margin-bottom: 8px;}
div.blog-home div.card-top { flex: 1;}
div.blog-home div.card-bottom  { padding-top: 20px; border-top: 1px solid #F5F5F5;}
div.blog-home div.card-bottom span {color: #666; font-family: helvetica-neue-lt-pro-cond; font-size: 12px; letter-spacing: 2.4px;text-transform: uppercase;}

/*div.grid-suppliers { display: flex; justify-content: space-between; gap: 80px;}*/
/*div.grid-suppliers a { display: block; }*/
/*div.grid-suppliers a img { display: block; height: 100px}*/

div.grid-suppliers { padding: 30px 0; width: 120%; position: relative; left: -10%;}
div.grid-suppliers .slick-slide a { display: flex; padding: 0 40px; align-items: center; height: 100px}
div.suppliers-heading { display: flex; justify-content: space-between; gap: 40px; align-items: center; }
div.suppliers-heading > div { flex: 1;}

div.mask-2 { position: relative;}
div.mask-2:before, div.mask-2:after { content: ""; position: absolute; z-index: 2; top: 0; bottom: 0; width: clamp(50px, 10vw, 160px); pointer-events: none;}
div.mask-2:before { left: 0; background: linear-gradient(to right, #fff 0%, rgba(255,255,255,0) 100%);}
div.mask-2:after { right: 0; background: linear-gradient(to left, #fff 0%, rgba(255,255,255,0) 100%);}

div.grid-locations { display: flex; justify-content: space-between; gap: 20px; margin-bottom: 10px}
div.grid-locations > div{ flex: 1; background: #fff; padding: 25px 22px 22px; border-radius: 10px; overflow: hidden}
div.grid-locations div p { margin-bottom: 20px;color: #666;}
div.grid-locations a.phone { color: var(--col-accent);font-size: 22px;font-weight: 700;text-transform: uppercase; padding: 20px 0; border-bottom: 1px solid #F5F5F5; border-top: 1px solid #F5F5F5; margin: 20px auto; display: block;}
div.grid-locations div.hours {display: grid; gap: 10px 20px; grid-template-columns: 2fr 5fr;}
div.grid-locations div.hours span {color: #666;}
div.grid-locations div.hours span:nth-child(odd) {font-size: 12px; font-family: helvetica-neue-lt-pro-cond; letter-spacing: 2.4px;}
div.grid-locations div.directions { display: flex; justify-content: space-between; gap: 0;}
div.grid-locations div.directions a { border-radius: 5px; border: 1px solid #BEBEBE;background: #F5F5F5; line-height: 30px; color: #000; font-size: 12px;font-weight: 700;letter-spacing: 0.48px;text-transform: uppercase; font-family: helvetica-neue-lt-pro-cond; padding: 0 23px} 

/*CATALOG*/

div.category-header {display: flex; justify-content: space-between; gap: 120px;}
div.category-header > div {flex: 1;}
div.category-overview { display: flex; justify-content: space-between; gap: 0; flex-direction: column; }
div.category-image { display: block; background: #fff;}
div.category-image img { display: block; mix-blend-mode: multiply;}

div.breadcrumb { display: flex; justify-content: flex-start; gap: 20px; padding: 50px 0 40px}
div.breadcrumb * { position: relative; display: block; color: #000; font-family: helvetica-neue-lt-pro-cond; font-size: 13px; font-style: normal; font-weight: 700; line-height: normal; letter-spacing: 1.3px; text-decoration-line: underline; text-decoration-style: solid; text-decoration-skip-ink: none; text-decoration-thickness: auto; text-underline-offset: auto; text-underline-position: from-font; text-transform: uppercase;}
div.breadcrumb a { padding-left: 0px;}
div.breadcrumb a:before { content:"/"; left: -12px; position: absolute;}
div.breadcrumb span { }

div.category-description { padding-bottom: 40px}
div.category-header div.category-menu { position: relative; width: 100%; max-width: 520px;}
div.category-header div.category-menu:after { content: ""; width: 7px; height: 7px; border-right: 1px solid #fff; border-bottom: 1px solid #fff; position: absolute; top: 19px; right: 23px; transform: rotate(45deg); pointer-events: none;}
div.category-header select { min-height: 0; appearance: none; -webkit-appearance: none; width: 100%; height: 50px; padding: 0 50px 0 20px; border: 0; border-radius: 5px; outline: 0; background: #9eacaa; color: #fff; font-family: helvetica-neue-lt-pro-cond; font-size: 15px; font-style: normal; font-weight: 700; letter-spacing: 0.6px; text-transform: uppercase; cursor: pointer;}
div.category-header select option { background: #fff; color: #000;}

div.subcategories { display: grid; gap: 40px 20px; grid-template-columns: 1fr 1fr 1fr;}
div.subcategories > div { display: block; border-radius: 10px;border: 1px solid #D9D9D9;background: #FFF; overflow: hidden;}
div.subcategories > div a { width: 100%; display: flex; justify-content: space-between; gap: 0; flex-direction: column}
div.subcategories div.thumbnail { padding: 30px 60px; display: block;}
div.subcategories div.thumbnail img { display: block;width: 100%; height: 280px; object-fit: contain;}
div.subcategories div.info { display: block;width: 100%; }
div.subcategories div.info h6{ line-height: 60px; background: #F5F5F5; padding: 0 20px; color: #000; font-size: 20px;font-weight: 700;letter-spacing: 0.8px;text-transform: uppercase; font-family: helvetica-neue-lt-pro-cond; text-align: left; }

div.subcategory-header {}
div.grid-subcategory { display: flex; justify-content: space-between; gap: 20px;}
div.grid-subcategory aside { width: 300px;}
div.product-list { flex: 1; display: grid; gap: 34px 18px; grid-template-columns: 1fr 1fr 1fr;}
div.product-list div.thumbnail { display: block;padding: 30px; border: 1px solid #D9D9D9; border-radius: 10px; height: 296px; margin-bottom: 10px;}
div.product-list a.sale div.thumbnail:after { content:""; top: 11px; right: 14px; position: absolute; width: 130px; height: 66px; background: url(/img/svg/sale.svg) no-repeat center center; background-size: contain; transform: rotate(-20deg);}
div.product-list div.thumbnail div { display: block;width: 100%; height: 100%}
div.product-list div.thumbnail div img { display: block;width: 100%; height: 100%; object-fit: contain;}
div.product-list div.info h6 {color: #000; font-size: 15px;font-weight: 700;letter-spacing: 0.6px;text-transform: uppercase; font-family: helvetica-neue-lt-pro-cond; margin-bottom: 10px}
div.product-list div.info p {font-size: 13px}
div.product-list div.price { font-size: 13px;font-weight: 700;letter-spacing: 0.6px;text-transform: uppercase; font-family: helvetica-neue-lt-pro-cond; }
div.product-list div.result-category { font-size: 13px; margin-bottom: 4px;}
div.product-list div.result-description { font-size: 13px; line-height: 1.33}

div.category-nav div.title {color: #000; font-size: 13px;font-weight: 700; letter-spacing: 1.3px;text-transform: uppercase; font-family: helvetica-neue-lt-pro-cond; margin-bottom: 20px;}
div.filter-block { margin-bottom: 20px;}
div.filter-block h5 { color: #000; font-size: 13px;font-weight: 400; letter-spacing: 1.3px;text-transform: uppercase; margin-bottom: 10px;}
ul.category-list { list-style-type: none !important; padding: 0}
ul.category-list li a { display: block; width: 100%; text-align: left; font-size: 14px; color: #000; line-height: 32px;  padding-left: 30px; position: relative;}
ul.category-list li a:before { content:""; display: block; position: absolute; top: 5px; left: 0; width: 20px; height: 20px; background: #fff; border: 1px solid var(--col-border)}
ul.category-list li a.active { font-weight: 700}
ul.category-list li a.disabled { color: #eee}
ul.category-list li a.active:before { background: url(/lib/img/dark/checkmark.svg) #fff no-repeat center center; background-size: 16px 12px;}
ul.category-list li a.disabled:before { opacity: 0.3}

div.active-filters { display: flex; justify-content: flex-start; gap: 20px; margin: 0 auto 30px 0;}
div.active-filters:empty { display: none}
div.active-filters a { display: block; background: var(--col-primary); color: #fff; padding: 0 20px 0 10px; font-size: 12px; line-height: 20px; border-radius: 5px; position: relative;}
div.active-filters a:after {display: block;    content: "";    position: absolute;    right: 4px;    top: 4px;    width: 12px;    height: 12px;    background: url(/img/icons/white/x.svg) transparent no-repeat center center;    background-size: 8px 8px;    border-radius: 16px;}

div.product-header { display: flex; justify-content: space-between; gap: 80px;}
div.product-header > div:first-child { flex: 1; max-width: 520px;}
div.product-header > div:last-child { width: 45%;}
div.product-header div.brand { padding-top: 40px; margin-bottom: 20px;color: #4E5453; font-size: 20px;font-weight: 700;line-height: 1;text-transform: uppercase; font-family: helvetica-neue-lt-pro-cond; max-width: 50%}
div.product-header div.brand:empty { display: none;}
div.product-header h1 { font-size: 40px}
div.product-header h6 { color: var(--col-accent); font-size: 20px;font-weight: 700;text-transform: uppercase; font-family: helvetica-neue-lt-pro-cond; margin-bottom: 15px}

div.assembly-required { margin-top: 50px}
div.form-assembly-request { display: none;}
.active div.form-assembly-request { display: block; padding-top: 30px}

div.product-details { font-size: 13px; line-height: 1.5; margin-bottom: 50px;}
div.product-details li { font-size: 13px; line-height: 1.5; margin-bottom:5px; display: none;}
div.product-details li { font-size: 13px; line-height: 1.5; margin-bottom:5px; display: none;}
div.product-details li:nth-child(1), div.product-details li:nth-child(2), div.product-details li:nth-child(3), div.product-details li:nth-child(4) { display: list-item;}
div.product-details ul { margin-bottom: 15px}
div.product-details ul.open li { display: list-item;}
#expand-description { color: #4E5453;font-size: 12px;font-weight: 700;line-height: 1.66; text-transform: uppercase; font-family: helvetica-neue-lt-pro-cond; }
#expand-description:before { content:"+"; display: inline-block; margin-right: 6px; position: relative; top: -2px}

div.product-gallery div.slideshow { border: 1px solid #D9D9D9; border-radius: 20px; overflow: hidden;}
div.product-gallery div.slick-slide { padding: 50px }
div.additional-photos { display: flex; justify-content: space-between; gap: 20px; margin-top: 20px;}
div.additional-photos > div { flex: 1; border: 1px solid #D9D9D9; border-radius: 10px; overflow: hidden; padding: 20px;}
div.additional-photos > div img { display: block; width: 100%;}

div.product-resources { position: relative; width: 100%; max-width: 520px; border: 1px solid var(--col-border); border-radius: 5px; overflow: hidden; margin-top: 40px;}
div.product-resources:after { content: ""; width: 7px; height: 7px; border-right: 1px solid #666; border-bottom: 1px solid #666; position: absolute; top: 19px; right: 23px; transform: rotate(45deg); pointer-events: none;}
div.product-resources select { appearance: none; -webkit-appearance: none; width: 100%; height: 50px; padding: 0 50px 0 20px; border: 0; border-radius: 5px; outline: 0; background: #fff; color: #666; font-family: helvetica-neue-lt-pro-cond; font-size: 15px; font-style: normal; font-weight: 700; letter-spacing: 0.6px; text-transform: uppercase; cursor: pointer; min-height: 0;}
div.product-resources select option { background: #fff; color: #000;}

div.related-products-container { margin-top: 50px;}
div.related-products-container div.title { color: #000; font-size: 22px; font-weight: 700; text-transform: uppercase; font-family: helvetica-neue-lt-pro-cond;  margin-bottom: 10px;}
div.related-products { display: flex; justify-content: flex-start; gap: 20px;}
div.related-products > div { flex: 1; max-width: 320px; }
div.related-products div.thumbnail { display: block;padding: 30px; border: 1px solid #D9D9D9; border-radius: 10px; height: 296px; margin-bottom: 10px;}
div.related-products div.thumbnail div { display: block;width: 100%; height: 100%}
div.related-products div.thumbnail div img { display: block;width: 100%; height: 100%; object-fit: contain;}
div.related-products div.info h6 {color: #000; font-size: 15px;font-weight: 700;letter-spacing: 0.6px;text-transform: uppercase; font-family: helvetica-neue-lt-pro-cond; margin-bottom: 10px}
div.related-products div.info p {font-size: 13px}
div.related-products div.price { font-size: 13px;font-weight: 700;letter-spacing: 0.6px;text-transform: uppercase; font-family: helvetica-neue-lt-pro-cond; }

div.cantfind { margin-top: 50px; text-align: left; }

div.support-page { display: flex; justify-content: space-between; gap: 86px;}
div.support-page aside { width: 230px}
div.support-page > div { flex: 1; }

div.page-header {padding-top: 50px;}
div.page-header p.eyebrow {margin-bottom: 50px;}
div.grid-header {display: grid; grid-template-columns: minmax(0, 540px) minmax(0, 640px); gap: 100px; align-items: center;}

div.inner-menu { display: flex; justify-content: flex-start; gap: 8px; flex-direction: column; margin-bottom: 40px;}
div.inner-menu a { color: #000; font-size: 15px; 1.66}
div.inner-menu a.active { font-weight: 700}
div.account-user-name { color: #000; font-family: helvetica-neue-lt-pro-cond; font-size: 20px; font-weight: 700; line-height: 1.2; letter-spacing: .8px; text-transform: uppercase;	margin-bottom: 20px;}
div.inner-menu div.title { margin-top: 17px; margin-bottom: 8px;	}
div.inner-menu div.title:first-child { margin-top: 0;	}
div.inner-menu div.title > a { font-family: helvetica-neue-lt-pro-cond; font-size: 13px; font-weight: 700; line-height: 16px; letter-spacing: 1.3px; text-transform: uppercase;	}

div.need-help {margin-top: 60px}

div.support-page h6 {color: #4E5453; font-size: 40px;font-weight: 700;line-height: 1.2; text-transform: uppercase; margin-bottom: 15px}
/*div.support-page .inner-menu h6 {color: #4E5453; font-size: 40px;font-weight: 700;line-height: 1.2; text-transform: uppercase; margin-bottom: 15px}*/
div.need-help h6 {font-size: 20px;}

ul.listing li { text-align: left; }


div.grid-location {display: grid; grid-template-columns: minmax(0, 540px) minmax(0, 608px); gap: 92px; align-items: center;}
div.contact-location-info h2 {margin-bottom: 8px; color: var(--col-primary); font-size: 22px;}
div.contact-location-info p.contact-address {margin-bottom: 30px; color: #4e5453; font-size: 12px; line-height: 1.45;}
div.contact-hours {margin-bottom: 30px; display: grid; grid-template-columns: 106px 1fr; gap: 0; border-top: 1px solid #666;  }
div.contact-hours span {color: #4e5453; font-size: 15px; font-weight: 700; border-bottom: 1px solid #666;padding: 20px 0}
div.contact-hours span:nth-child(odd) {color: var(--col-primary); font-family: helvetica-neue-lt-pro-cond; font-size: 13px; letter-spacing: 3.38px; text-transform: uppercase;}
div.contact-hours span.closed {color: var(--col-accent);}
a.contact-call {display: flex; min-height: 60px; margin-bottom: 15px; padding: 10px 25px; align-items: center; justify-content: flex-start; border-radius: 5px; background: var(--col-accent); color: #fff; font-family: helvetica-neue-lt-pro-cond; font-size: 30px; font-weight: 700; letter-spacing: 1.2px; text-transform: uppercase;}
div.contact-directions {display: grid; grid-template-columns: 1fr 1fr; gap: 20px;}
div.contact-directions a {display: block; border: 1px solid #666; border-radius: 5px; color: #000; font-family: helvetica-neue-lt-pro-cond; font-size: 22px; font-weight: 700; letter-spacing: 0.88px; line-height: 50px; text-align: center; text-transform: uppercase;}
div.contact-media {position: relative; width: 100%; height: 0; padding-bottom: 78.947%; overflow: hidden; border-radius: 10px; background: #000;}
div.contact-media img, div.contact-media iframe {position: absolute; inset: 0; display: block; width: 100%; height: 100%; border: 0; object-fit: cover;}

div.grid-vendors { display: grid; gap: 0; grid-template-columns: 1fr 1fr 1fr 1fr; gap: 10px;}
div.grid-vendors > div { position: relative}
div.grid-vendors > div > a { display: block; aspect-ratio: 1; border: 1px solid var(--col-border); padding: 25px;}
div.grid-vendors > div > a > div { display: block; width: 100%; height: 100%;}
div.grid-vendors > div.active > a > div { height: 20%;}
div.grid-vendors > div > a > div img { display: block; width: 100%; height: 100%; object-fit: contain}
div.grid-vendors div.vendor-categories { display: none;}
div.grid-vendors .active div.vendor-categories { display: flex; justify-content: center; gap: 10px; align-items: center;  flex-direction: column; position: absolute; top: 20%; left: 0%; width: 100%; height: 80%; padding: 25px; }
div.grid-vendors .active div.vendor-categories a { display: block;  font-family: helvetica-neue-lt-pro-cond; font-size: 14px; font-weight: 700; letter-spacing: 0.88px; line-height: 1.2; text-align: center; text-transform: uppercase;}

#all-suppliers > div a { text-align: center; width: calc(20% - 40px); margin: 0 40px 30px 0; height: 0; padding-bottom: 20%; position: relative;}
div.vendor-logo { display: block; height: 100%; width: 100%; position: absolute; top: 0; left: 0; }
div.vendor-logo div { display: block; width: 100%; height: 100%; background: url() no-repeat center center; background-size: contain; }

div.caption-about {position: absolute; right: 40px; bottom: -150px; border-radius: 20px 20px 0 0; background: #FFF; padding: 35px; z-index:3; width: 470px;}
div.locations-about { display: flex; justify-content: space-between; gap: 70px; align-items: flex-end;} 
div.locations-about > div { flex: 1;} 

div.grid-locations-about {display: grid; gap: 20px; grid-template-columns: 1fr 1fr; margin-top: 35px} 
div.grid-locations-about > div {padding: 27px 22px; border: 1px solid var(--col-border); border-radius: 10px}
div.grid-locations-about p { color: #666; font-size: 15px; font-weight: 400; }
div.grid-locations-about div.hours {display: grid; gap: 10px 20px; grid-template-columns: 2fr 5fr;}
div.grid-locations-about div.hours span {color: #666;}
div.grid-locations-about div.hours span:nth-child(odd) {font-size: 12px; font-family: helvetica-neue-lt-pro-cond; letter-spacing: 2.4px;}
div.grid-locations-about div.directions { display: flex; justify-content: space-between; gap: 0;}
div.grid-locations-about div.directions a { border-radius: 5px; border: 1px solid #BEBEBE;background: #F5F5F5; line-height: 30px; color: #000; font-size: 12px;font-weight: 700;letter-spacing: 0.48px;text-transform: uppercase; font-family: helvetica-neue-lt-pro-cond; padding: 0 23px} 
div.grid-locations-about a.phone {display: block; margin-bottom: 15px; font-family: helvetica-neue-lt-pro-cond; font-size: 22px; font-weight: 700; text-transform: uppercase; color: var(--col-accent); padding: 14px 0; border-top: 1px solid #F5F5F5; border-bottom: 1px solid #F5F5F5;  margin-top: 20px; margin-bottom: 14px}

div.departments { display: flex; justify-content: flex-start; gap: 70px; flex-direction: column}
div.team { display: grid; gap: 0; grid-template-columns: 1fr 1fr 1fr 1fr; gap: 20px;}
div.team > div { position: relative; display: block; }
div.team div.thumb img { display: block; width: 100%;}
div.team div.info { padding: 10px 0 0;}
div.team div.name { font-family: helvetica-neue-lt-pro-cond; font-size: 22px; font-weight: 700; text-transform: uppercase; color: var(--col-accent); margin-bottom: 5px}
div.team div.title { font-size: 14px; text-transform: uppercase;line-height: 1.33}

div.blog { display: grid; gap: 0; grid-template-columns: 1fr 1fr 1fr; gap: 50px 20px;}
div.blog > div { position: relative; display: block; display: flex; justify-content: space-between; gap: 10px;  flex-direction: column;}
div.blog > div > div { flex: 1}
div.blog div.photo { border-radius :10px; overflow: hidden}
div.blog div.photo img { display: block; width: 100%;}
div.blog div.info { display: flex; justify-content: space-between; gap: 0; flex-direction: column; align-items: flex-start;}
div.blog div.info p { font-size: 14px;}
div.blog div.info div { flex: 1; margin-bottom: 10px; line-height: 1.5;}
div.blog div.info span.date { display: block;margin-bottom: 5px; font-family: helvetica-neue-lt-pro-cond; font-size: 14px; font-weight: 700}

div.event-pictures{ margin-bottom: 20px}
div.photo-gallery  { display: grid; gap: 0; grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr; gap: 10px; }
div.photo-gallery > div { border-radius: 5px; overflow: hidden; aspect-ratio: 16/9}
div.photo-gallery > div img { display: block; width: 100%; width: 100%; object-fit: cover;}

div.video-container { display: block; width: 100%; aspect-ratio: 16/9}
div.video-container iframe { display: block; width: 100%; height: 100%; max-height: 56.25vw; border: 0; position: relative; }


div.account-dashboard { display: block; width: auto; min-width: 0; padding: 0; margin: 0; }
div.account-block  { margin-bottom: 40px}

ul.account-icons { display: grid; grid-template-columns: repeat(4, 210px); gap: 20px; margin: 0; padding: 0; margin-top: 16px;}
ul.account-icons li { display: block; width: 210px; height: 210px; margin: 0; overflow: hidden; border: 1px solid #d9d9d9; border-radius: 10px; transition: border-color .2s ease, transform .2s ease; }
ul.account-icons li:hover { border-color: #3cb4e5; opacity: 1; transform: translateY(-2px); }
ul.account-icons li > a { display: grid; width: 100%; height: 100%; padding: 0; grid-template-rows: 169px 40px; }
ul.account-icons li div.thumbnail { width: 100%; height: 169px; margin: 0; background-repeat: no-repeat; background-position: center; }
ul.account-icons li p { display: flex; width: 100%; min-height: 40px; margin: 0; padding: 0 8px; align-items: center; justify-content: center; background: #d9d9d9; color: #000; font-family: helvetica-neue-lt-pro-cond; font-size: 15px; font-weight: 700; line-height: 1; letter-spacing: .6px; }
ul.account-icons li div.thumbnail.orders,
ul.account-icons li div.thumbnail.custom { background-image: url(/img/account/order-history.svg); background-size: 85px 77px; }
ul.account-icons li div.thumbnail.favourites { background-image: url(/img/account/favourites.svg); background-size: 85px 75px; }
ul.account-icons li div.thumbnail.profile { background-image: url(/img/account/profile.svg); background-size: 75px 85px; }
ul.account-icons li div.thumbnail.address { background-image: url(/img/account/addresses.svg); background-size: 82px 78px; }
ul.account-icons li div.thumbnail.payment { background-image: url(/img/account/payment.svg); background-size: 82px 59px; }
ul.account-icons li div.thumbnail.credit { background-image: url(/img/account/subaccounts.svg); background-size: 78px 82px; }
ul.account-icons li div.thumbnail.logout { background-image: url(/img/account/logout.svg); background-size: 48px 85px; }
ul.account-icons li div.thumbnail.credit-application { background-image: url(/img/account/credit-application.svg); background-size: 82px 79px; }


/* IMPORTED FROM OLD SITE - PRODUCT GRID */
div#skulist { position: relative; display: block; width: 100%;}


span.result-highlight { display: inline-block; background-color: #ffff66; padding: 3px 5px;}

table.product-skus { width: 100%; border-collapse: collapse; margin-bottom: 20px}
table.product-skus tr.sku-table-head td {vertical-align: bottom; padding: 30px 10px 20px; text-align: center; border: 1px solid var(--col-border); border-top: 0; font-weight: 700 text-transform: uppercase; color: var(--col-primary);}
		table.product-skus tr.sku-table-head td {background-color: var(--col-primary); color: #fff; font-size: 14px; border: 1px solid #fff; padding: 10px 10px; vertical-align: middle; text-transform: uppercase;}
table.product-skus tr.sku-table-head td:first-child {width: 30px; padding: 0; border-left: 0;}
table.product-skus tr.sku-table-head td:nth-child(2) {text-align: left; width: 150px;}
table.product-skus.two-columns tr.sku-table-head td:nth-child(2) { width: 300px;}
table.product-skus.four-columns tr.sku-table-head td:nth-child(2) { width: 200px;}
table.product-skus tr.sku-table-head td:last-child {border-right: 0; width: 340px;}
table.product-skus tr.sku-table-row td {vertical-align: middle; padding: 20px 10px; text-align: center; border-bottom: 1px solid var(--col-border); border-top: 0; position: relative}
/*table.product-skus tr.sku-table-row.on-sale td[data-label="Price"]:before {position: absolute; top: 0; left: 0; width: 100%; display: block; background: #fff200; color: #000; text-align: center; content: "ON SALE"; line-height: 20px; font-size: 12px; font-weight: 500}*/
table.product-skus tr.sku-table-row.on-sale td[data-label="Price"]:before {content:""; top: 4px; right: 0px; position: absolute; width: 50px; height: 25px; background: url(/img/svg/sale.svg) no-repeat center center; background-size: contain; transform: rotate(-20deg)}
#skulist.prices-off table.product-skus tr.sku-table-row.on-sale td.sku-label:before {position: absolute; top: 0; left: 0; width: 100%; display: block; background: #fff200; color: #000; text-align: left; padding-left: 10px; content: "ON SALE"; line-height: 20px; font-size: 12px; font-weight: 500}
/*table.product-skus tr.sku-table-row:nth-child(odd) td {background-color: #ebebeb}*/
table.product-skus tr.sku-table-row.sku-found td:nth-child(2) {background-color: #ffffbb !important}
table.product-skus tr.sku-table-row td:first-child {width: 30px; padding: 0;}
table.product-skus tr.sku-table-row td:first-child a {width: 18px; height: 18px; display: block; margin: 0 auto; background: url(/img/icons/dark/heart-off.svg) no-repeat center center; background-size: 18px auto; cursor: pointer}
table.product-skus tr.sku-table-row td:first-child a.selected, table.product-skus tr.sku-table-row td:first-child a:hover {background-image: url(/img/icons/dark/heart.svg);}
table.product-skus tr.sku-table-row td:nth-child(2) {padding-left: 10px; text-align: left;  font-weight: 700}
table.product-skus tr.sku-table-row td:last-child {padding-right: 20px; text-align: right;}
	table.product-skus tr.sku-table-row td:last-child { padding-right: 0}
	table.product-skus tr.sku-table-row td:last-child div.sku-cart-tools { text-align: right;}
	table.product-skus .select2-container--default .select2-selection--single { border: 0}
	table.product-skus .select2-container--default .select2-selection--single .select2-selection__rendered { color: #000; text-align: left;  line-height: 50px}
	table.product-skus .select2-container--default .select2-selection--single .select2-selection__arrow { height: 50px}
table.product-skus tr.sku-table-row td label {display: none;}
table.product-skus td {font-size: 16px; color: #000;  }

table.product-skus.fireplaces { margin-bottom: 50px;}
table.product-skus.fireplaces tr.sku-table-head td:first-child {width: 120px; padding: 30px 10px 20px; border-left: 0;}
table.product-skus.fireplaces tr.sku-table-head td:nth-child(2) {width: 120px;}
table.product-skus.fireplaces tr.sku-table-row td:nth-child(2) a {width: 100px; display: block; margin: 0 auto;}
table.product-skus.fireplaces tr.sku-table-row td:nth-child(2) a img {width: 100px; display: block; }
table.product-skus.fireplaces tr.sku-table-head td:nth-child(3) {text-align: left; width: calc(100% - 460px)}
table.product-skus.fireplaces.logged tr.sku-table-head td:nth-child(3) { text-align: left; width: calc(100% - 580px);}
table.product-skus.fireplaces.logged tr.sku-table-head td:nth-child(4) {width: 120px;}
table.product-skus.fireplaces tr.sku-table-head td:last-child {border-right: 0; width: 200px;}
table.product-skus.fireplaces tr.sku-table-row td:nth-child(3) {text-align: left; }

table.product-skus.fireplaces div.sku-cart-tools {width: 100%;}
table.product-skus.fireplaces div.sku-cart-tools > div.qty { width: 100%;}

div.sku-cart-tools { width: 340px; display: block; font-size: 0px; text-align: left; margin: 0px auto;}
div.sku-cart-tools > div{ width: 140px; display: inline-block; vertical-align: top}
div.sku-cart-tools > div.qty { width: calc(100% - 168px); }
table.product-skus tr.sku-table-row td div.sku-cart-tools > div.qty label { display: inline-block; vertical-align: middle; font-weight: 700; font-size: 14px; width: 80px}
div.sku-cart-tools > div.qty label span { display: block; width: 100%; color: #0d9006}
div.sku-cart-tools > div.qty label.out-of-stock span { color: #c00000; }
div.sku-cart-tools > div.qty label.low-stock span { color: #e25110; }
div.sku-cart-tools div.qty { font-size: 14px; font-weight: 500; line-height: 40px; text-align: left;}
div.sku-cart-tools div.qty em { }
div.sku-cart-tools div.qty input { line-height: 50px; min-height: 50px; display: inline-block; width: 60px; text-align: center; border: 1px solid var(--border-colour); color: #000; font-size: 14px; font-weight: 500; margin: 0 15px; border: 1px solid var(--col-border) }
div.sku-cart-tools a.button { display: block; width: 100%; line-height: 50px; text-align: right; padding-right: 10px; padding-left: 35px; background: url() no-repeat left center;  font-size: 14px; margin-bottom: 10px;}
div.sku-cart-tools a.button.add-to-cart { background: url(/img/i/white/cart.svg) no-repeat 10px 17px; background-size: 16px 15px; border: 0px; background-color: var(--col-primary); color: #fff; text-align: left; border-radius: 5px}
div.sku-cart-tools a.button.add-to-cart.disabled { opacity: .3; cursor: default; }
div.sku-cart-tools a.button.add-to-cart:hover { background-color: var(--col-accent); }
div.sku-cart-tools a.button.action-favourites { background: url(/img/icons/dark/heart.svg) no-repeat 17px center; background-size: 23px 20px; border: 1px solid var(--border-colour); background-color: #fff; color: #000; padding-right: 15px}
div.sku-cart-tools a.button.add-to-cart.notlogged { }
div.sku-cart-tools span.warning { color: #c00000; position: absolute; left: -45px; top: 11px; font-size: 30px; display: none; }
div.sku-cart-tools.insufficient-stock span.warning, div.sku-cart-tools.no-stock span.warning { display: block;}

div.sku-cart-tools a.button.fireplace-add-to-cart { display: table; width: auto; margin: -50px 0 100px auto; background: url(/img/i/white/cart.svg) no-repeat 10px 17px; background-size: 16px 15px; border: 0px; background-color: var(--col-primary); color: #fff; text-align: left; margin-top: 0px}
div.sku-cart-tools a.button.fireplace-add-to-cart.disabled  { opacity: .3; cursor: default;}

div.add-favourite-popup { display: none; max-width: 300px; margin: 0 auto 50px 0; position: absolute;}
div.add-favourite-popup a.close-add-to-favourites { position: absolute; width: 13px; height: 13px; right: 15px; top: 18px; background: url(/img/icons/white/x.svg) transparent no-repeat center center; background-size: contain; cursor: pointer; }
a.add-to-favourites-new { display: block; width: 32px; margin: 20px 0 10px auto; cursor: pointer; position: relative;}
a.add-to-favourites-new img { display: block; width: 100%}
div.add-favourite-popup.active { display: block}
/*#skulist div.add-favourite-popup.active { position: relative; }*/
div.add-favourite-popup.new-version { position: relative; display: block; background: var(--col-primary)}
div.add-favourite-popup .button { margin: 0 auto 0 0; width: 100%; text-align: left; padding-left: 36px; background: url(/img/i/white/heart.svg) var(--col-primary) no-repeat 10px center; background-size: 17px auto; position: relative; cursor: pointer; border: 0px solid #B2B9B9; color: #fff; font-size: 14px; line-height: 50px}
div.add-favourite-popup.remove-from-favourites  { width: 260px;}
div.add-favourite-popup .button { width: 300px; background: url(/img/i/white/heart.svg) var(--col-primary) no-repeat 10px center; background-size: 17px auto; line-height: 50px; display: block; border-radius: 10px 10px 0 0}
div.add-favourite-popup .button:after { content:""; display: block; position: absolute; right: 0; top: 0; width: 40px; height: 100%;  background: url(/img/icons/white/arrow-down.svg) no-repeat center center; background-size: 18px 11px;}
div.add-favourite-popup .button:after { display: none;}
div.add-favourite-popup.remove-from-favourites .button:after { display: none;}
div.add-favourite-popup .button.open { border-bottom: 0}
div.add-favourite-popup .button.open:after { transform: rotate(180deg);}
div.add-favourite-popup div.favourites-lists { display: none; width: 100%; position: absolute; left: 0; top: 50px; z-index: 5;}
div.add-favourite-popup div.favourites-lists.active { display: block; background: green; border-top: 0}
div.add-favourite-popup div.favourites-lists { display: block; background: #fff; border: 1px solid var(--col-primary); border-radius: 0 0 10px 10px; overflow: hidden}
div.add-favourite-popup div.favourites-lists > div { display: block; width: 100%; font-size: 16px; background-color: transparent; color: #000; text-align: left; padding: 10px; border-bottom: 0px solid #fff; cursor: pointer; }
div.add-favourite-popup div.favourites-lists > div.button-new-list {  background-color: var(--col-primary); color: #fff; line-height: 30px;}
div.add-favourite-popup div.favourites-lists > div.button-new-list:hover {  background-color: #ccc}
div.add-favourite-popup div.favourites-lists > div:hover { color: #fff; background: var(--col-primary)}
div.add-favourite-popup div.favourites-lists > input { display: block; width: 100%; font-size: 16px; background-color: #fff;}


/*#NewListName { line-height: 30px; min-height: 30px; background: #fff; }*/

a.add-to-favs  { display: table; margin: 0 auto 0 0; width: auto; text-align: left; padding: 0 20px 0 36px; background: url(/img/i/white/heart.svg) var(--col-primary) no-repeat 10px center; background-size: 17px auto; position: relative; cursor: pointer; color: #fff; font-size: 14px; text-transform: uppercase;line-height: 40px}
a.add-to-favs:hover  { background-color: #aaa}


div.create-new-list { display: none !important;}
div.create-new-list.active { display: block !important; width: 100%;}
div.add-favourite-popup div.favourites-lists > div.create-new-list.active:hover { background: #ebebeb}
div.create-new-list button { background-color: var(--col-primary); color: #fff; line-height: 40px; margin-top: 5px; width: 100%; padding: 0 10px; text-transform: uppercase; border: 0; cursor: pointer;}

div.step-title {font-size: 30px; color: var(--col-primary);  font-weight: 700; display: block; width: 100%; text-align: left; text-transform: uppercase; margin-bottom: 3px;}
.missing div.step-title {color: var(--col-accent);  }
div.step-name {font-size: 18px; color: #000;  font-weight: 500; display: block; width: 100%; text-align: left; margin-bottom: 20px; text-transform: uppercase;}
div.step-summary {font-size: 14px; color: var(--col-primary);  font-weight: 700; display: block; width: 100%; text-align: left; margin-top: -10px; margin-bottom: 20px; text-transform: uppercase;}
div.fireplace-step[data-mandatory="yes"] div.step-summary {color: var(--col-accent);  }

div.description-intro { line-height: 1.5;}

/* END IMPORTED FROM OLD SITE - PRODUCT GRID */

div.reset-password-row {display: none}
div.reset-password-row.active {display: block; padding-top: 20px}

div.address-block { margin-bottom: 40px; }
div.addresses { margin-bottom: 30px; margin-top: 30px; display: grid; gap: 50px; grid-template-columns: 1fr 1fr;}
div.address strong { display: block; margin-bottom: 10px;font-family: helvetica-neue-lt-pro-cond;}
div.address-actions { display: flex; justify-content: flex-start; gap: 10px; }
div.address-actions a { text-decoration: underline}


	div.order-filters {padding-bottom: 40px; margin-bottom: 40px; border-bottom: 1px solid #D9D9D9}
	div.order-filters div.form-row { align-items: center;}
	div.order-filters div.field label {display: block; color: #000;font-size: 22px;font-weight: 700;font-family: helvetica-neue-lt-pro-cond;  text-transform: uppercase; white-space: nowrap}
	div.datepicker:after {  background-image: url(/img/svg/date.svg); right: 10px; width: 32px;}
	div.order-query { font-size: 13px;  padding-top: 30px;}

.full-width { width: 100%!important; max-width: 100% !important}
div.wrapper-lists { margin-top: 40px;}
#my-lists { margin-bottom: 50px}
#my-lists h3 { font-family: helvetica-neue-lt-pro; font-weight: 400; font-size: 15px; border-bottom: 1px solid #D9D9D9; padding: 18px 0; padding-right: 20px; position: relative; text-transform: none}
#my-lists h3.ui-accordion-header-active { border-color: #fff; }
#my-lists h3 span { position: absolute; right: 0; top: 0; width: 10px; height: 100%; background:  url(/img/svg/arrow2.svg) no-repeat center center; background-size: contain;}
#my-lists h3.ui-accordion-header-active span { transform: rotate(180deg);}
div.product-list.version-2  { margin-top: 20px; padding-bottom: 50px}
div.product-list.version-2  div.cart-product { display: flex; justify-content: space-between; gap: 10px; flex-direction: column}
div.product-list.version-2  div.cart-product .product-image { width: 100%;}
div.product-list.version-2  div.price { font-size: 18px; margin-bottom: 10px}
div.product-list.version-2  .product-information { flex: 1}
div.product-list.version-2  .product-footer { display: flex; justify-content: flex-end; gap: 10px; flex-direction: column}

div.js-list-operation-area { display: none; justify-content: space-between; gap: 10px; width: 100%; max-width: 680px; margin: 20px auto 0 0;}
div.js-list-operation-area.active { display: flex; }
div.js-list-operation-area input { flex: 1;}

div.custom-orders h3 { display: flex; justify-content: space-between; gap: 10px; }
div.custom-orders h3 b { font-weight: normal; text-transform: uppercase; display: block;}
div.custom-orders h3 b:nth-child(2) { flex: 1}
div.custom-orders div.ui-accordion-content { padding-bottom: 20px}
div.custom-order-details { padding-bottom: 20px;}
div.custom-order-details > div {display: flex; justify-content: space-between; gap: 10px; padding: 10px 0; border-bottom: 1px solid var(--col-border)}
div.custom-order-details label {width: 140px; font-family: helvetica-neue-lt-pro-cond; weight: 700; display: block;}
div.custom-order-details span { display: block;display: flex; justify-content: space-between; gap: 1;}

a.remove-cart-product {display: block; width: 12px;}

div.list-cart-tools  {width: 100%;flex-direction: column;  display: flex; justify-content: space-between; gap: 10px;}
div.list-cart-tools div.qty { width: 100%; display: flex; justify-content: space-between; gap: 0; align-items: center;}

div.list-cart-tools div.qty label { display: inline-block; vertical-align: middle; font-weight: 700; font-size: 14px; width: 80px}
div.list-cart-tools div.qty label span { display: block; width: 100%; color: #0d9006}
div.list-cart-tools div.qty label.out-of-stock span { color: #c00000; }
div.list-cart-tools div.qty label.low-stock span { color: #e25110; }
/*div.sku-cart-tools div.qty { font-size: 14px; font-weight: 500; line-height: 40px; text-align: left;}*/
div.list-cart-tools div.qty input { line-height: 50px; min-height: 50px; display: inline-block; width: 60px; text-align: center; border: 1px solid var(--border-colour); color: #000; font-size: 14px; font-weight: 500; margin: 0 15px; border: 1px solid var(--col-border) }
div.cart-buttons { display: flex; justify-content: flex-start; gap: 0;}
div.cart-buttons a { margin: 0 auto 0 0}
/*div.sku-cart-tools a.button { display: block; width: 100%; line-height: 50px; text-align: right; padding-right: 10px; padding-left: 35px; background: url() no-repeat left center;  font-size: 14px; margin-bottom: 10px;}*/
/*div.sku-cart-tools a.button.add-to-cart { background: url(/img/i/white/cart.svg) no-repeat 10px 17px; background-size: 16px 15px; border: 0px; background-color: var(--col-primary); color: #fff; text-align: left;}*/
/*div.sku-cart-tools a.button.add-to-cart.disabled { opacity: .3; cursor: default; border-radius: 5px}*/
/*div.sku-cart-tools a.button.add-to-cart:hover { background-color: var(--col-accent); }*/
/*div.sku-cart-tools a.button.action-favourites { background: url(/img/icons/dark/heart.svg) no-repeat 17px center; background-size: 23px 20px; border: 1px solid var(--border-colour); background-color: #fff; color: #000; padding-right: 15px}*/
/*div.sku-cart-tools a.button.add-to-cart.notlogged { }*/
/*div.sku-cart-tools span.warning { color: #c00000; position: absolute; left: -45px; top: 11px; font-size: 30px; display: none; }*/
/*div.sku-cart-tools.insufficient-stock span.warning, div.sku-cart-tools.no-stock span.warning { display: block;}*/


/*div.list-cart-tools div.qty span.warning { display: none;}*/
/*div.list-cart-tools div.qty:after { font-weight: 700;  display: block; padding-top: 5px}*/
/*div.list-cart-tools.low-stock div.qty:after { content: "low stock"; color: #e25110; }*/
/*div.list-cart-tools.no-stock div.qty:after { content: "out of stock"; color: #ff0000; }*/
/*div.list-cart-tools.in-stock div.qty:after { content: "in stock"; color: #00AB39; }*/
/*div.list-cart-tools input { line-height: 50px; min-height: 50px; display: inline-block; width: 80px; text-align: center; border: 1px solid var(--border-colour); color: #000; font-size: 14px; font-weight: 500; border: 1px solid #9EACAA; border-radius: 5px}*/
#all-list-products { display: none;}
#all-list-products.active { display: block;}
div.address-actions { display: flex; justify-content: flex-start; gap: 10px; align-items: flex-end; padding-top: 10px}
div.address-actions a.btn { margin: 0; text-decoration: none !important; }
div.product-resources.full-width:after { display: none;}

.select2-container--default .select2-selection--single .select2-selection__arrow { background-size: 15px 7px; background-image:  url(/img/svg/arrow2.svg)}

a.forgot-password { line-height: 40px; text-decoration: underline;}
div.login-form { margin-bottom: 50px}

div.radios.radios-left { display: flex; justify-content: flex-start; gap: 20px; flex-direction: column; align-items: flex-start;}

div.custom-metal-steps { display: flex; justify-content: space-between; gap: 20px;}
div.custom-metal-steps > div { flex: 1; border-radius: 10px; overflow: hidden; text-align: left; background-color: #9EACAA; padding: 80px 20px 20px;; display: flex; justify-content: flex-end; gap: 0; align-items: flex-start; flex-direction: column; gap: 14px; color: #fff; background-image: url(/img/svg/pipe.svg);  background-repeat: no-repeat; background-position: 20px 20px; background-size: 120px auto}
div.custom-metal-steps > div:nth-child(2) { background-color: var(--col-primary)}
div.custom-metal-steps > div:nth-child(3) { background-color: var(--col-accent)}
div.custom-metal-steps div.title { padding-left: 66px; font-family: helvetica-neue-lt-pro-cond; font-weight: 700;font-size: 40px;text-transform: uppercase; text-align: left;}
div.custom-metal-steps div.title span { display: block; font-size: 20px; }
div.custom-metal-steps div.info {font-family: helvetica-neue-lt-pro-cond; font-weight: 700;font-size: 20px;text-transform: uppercase; line-height: 1.1; text-align: left;}

.custom-form { margin-top: 80px}
.custom-form h3 { font-size: 30px; color: #4E5453}
.custom-order-nav { display: flex; justify-content: space-between; gap: 10px; margin: 50px auto}
.custom-order-nav:before { content:""; display: block; height: 8px; width: 100%; background: #fff; position: absolute; top: 50%; left: 0; margin-top: -4px;}
.custom-order-nav > div { width: 100px; height: 100px; display: block; border-radius: 100px; background: #fff; line-height: 100px; font-size: 40px; color: #4E5453; font-family: helvetica-neue-lt-pro-cond; font-weight: bold; text-align: center; z-index: 3; cursor: pointer;}
.custom-order-nav > div.active { background-color: var(--col-primary); color: #fff; }
.custom-order-nav > div.active:after { content:""; width: 140px; left: 100px; top: 50%; margin-top: -4px; background-color: var(--col-primary); position: absolute; display: block;height: 8px; z-index: 2;}
.custom-order-nav > div.active:last-child:after { display: none;}
.custom-order-nav > div label { display: none;}

.custom-form button {font-family: helvetica-neue-lt-pro-cond; border-radius: 5px; font-weight: 700;  font-size: 15px; line-height: 50px; padding: 0 20px;}
button.button-transparent { background: transparent; border: 2px solid #9EACAA; color: #666666}
button.button-arrow { padding-right: 48px;; text-align: left;}
button.button-arrow:after { content:""; display: block;position: absolute; right: 22px; top: 0; width: 17px; height: 100%; background: url(/img/svg/arrow.svg) no-repeat center center; background-size: contain; z-index: 3;}
div.button-group {display: flex; justify-content: flex-start; gap: 20px; align-items: center;}
.custom-form .x4 button { margin: 0 0 0 auto;}

div.info-box { display: none; margin-bottom: 30px; border-bottom: 1px solid #D9D9D9; padding-bottom: 30px;  justify-content: space-between; gap: 80px; align-items: flex-start;}
div.info-box.active { display: flex; }
div.info-title { font-family: helvetica-neue-lt-pro-cond; font-weight: 700;font-size: 20px;letter-spacing: 0%;text-transform: uppercase; display: block; color: #4E5453}
div.info-box div.list { flex: 1; display: grid; gap: 10px 80px; grid-template-columns: 1fr 1fr 1fr;}
div.info-box div.list span { font-family: helvetica-neue-lt-pro-cond; font-weight: 700;font-size: 20px;text-transform: uppercase; color: #4E5453}

div.wrp-confirmation-block { display: flex; justify-content: space-between; gap: 20px; align-items: flex-start; margin-top: 40px; padding-top: 40px;  border-top: 1px solid #ccc;}
div.confirmation-block { display: grid; gap: 20px 10px; grid-template-columns: 1fr 3fr; flex: 1}
div.confirmation-block label { display: block; width: 100%; text-align: right; font-family: helvetica-neue-lt-pro-cond; font-weight: 700;font-size: 18px;text-transform: uppercase; color: #4E5453}
div.confirmation-block span { display: block; width: 100%; text-align: left; color: #4E5453}

#method-rush { display: none;}

#Comments { height: 200px; background: #fff; }
	#dropzone { width: 100%; height: 200px; background: #eee; padding: 20px; margin: 0px auto 20px; position: relative;}
	#dropzone:after { content:""; width: 100%; height: 100%; left: 0; top: 0; background: transparent; position: Absolute;}
	#dropzone p {font-weight: 300 ; font-size: 14px; color: #000; text-align: center; max-width: 600px; margin: 0 auto;}
	#dropzone p.dropmessage { position: relative; top: 50%; transform: translateY(-50%);  }
	div.dz-details { width: 100%; padding: 0.5em 0; border-bottom: 1px solid #ececec; display: none}
	#dropzone div.dz-preview:last-child div.dz-details { border: 0}
	div.dz-filename { float: left; width: 70%;font-weight: 300 ; font-size: 1.4em; color: #252525; display: block; text-align: left;}
	#contract div.dz-filename span { font-size: 1em;font-weight: 300 ; }
	div.dz-size { float: left; width: 30%;font-weight: 300 ; font-size: 1.4em; color: #252525; display: block; text-align: right; }
	div.dz-error-message { display: none;}
	div.dz-success-mark { display: none;}
	div.dz-error-mark { display: none;}
	#statusmsg { width: 800px; height: 160px; color:#252525; font-weight: 300 ; font-size: 16px; display: none; line-height: 1.25}

	#dropzone-validation span.error-message { font-size: 0}
	#dropzone-validation span.error-message:after { content: "please upload at least one drawing"; font-size: 14px; color: var(--col-red); display: inline-block;}

	div.slides { display: block; width: 100%; max-width: 1280px; margin: 50px auto;}
	#image-list {display: block; width: 100%; font-size: 0; margin-bottom: 20px;}
	#image-list:empty:after {content:""; display: block; width: 100%; font-size: 16px;}
	div.slide-row { width: 100%; display: block; margin-bottom: 20px; }
	div.file {  font-size: 14px; color: #acacac; position: relative; display: block; width: 100%;}
	div.file > a.file-link {  padding-left: 22px; background: url(/img/i/paperclip-solid.svg) no-repeat left center; background-size: 15px auto; }
	div.file img { width: 100%;}
	div.file span { display: inline-block; vertical-align: middle;}
	div.caption { width: calc(100% - 444px); display: inline-block; vertical-align: top; font-size: 18px; color: #000; padding-left: 40px}
	div.actions { width: 60px; display: inline-block; vertical-align: top; font-size: 18px; color: #000; text-align: center;}
	div.actions img{ display: block; margin: 0 auto}
	#RoundOther { display: none;}
	#RoundOther.active { display: block; margin-top: 10px}
	#RectangularOther { display: none;}
	#RectangularOther.active { display: block; margin-top: 10px}
	#cfDeliveryType, #cfOrderType { text-transform: uppercase;}

	div#existing div.thumbnail {display: inline-block; vertical-align: top; width: 200px; margin: 0 20px 20px 0; border: 3px solid orange;}
	div#existing div.thumbnail img {display: block; max-width: 100%;}

	a.delete-slide { display: inline-block; margin-left: 20px; vertical-align: middle;}
	a.delete-slide img { width: 11px;}


div.checkboxes {display: flex; justify-content: space-between; gap: 5px; flex-direction: column;}
div.radio label:before { background: #fff;}

button.skip-review, #row-pickup-location, div.js-shipping-choice, div.custom-work-block { display: none;}
button.skip-review.active, #row-pickup-location.active, div.js-shipping-choice.active, div.custom-work-block.active { display: block;}


div.custom-disclaimer { margin-top: 50px;}
div.talk-to-human { display: flex; justify-content: space-between; gap: 50px; margin-top: 60px; align-items: center;}
/*div.custom-work-block  { display: block; margin-top: 100px}*/

#custom-work-time-required { visibility: hidden;}
#custom-work-time-required.active { visibility: visible} 

div.custom-fieldset { display: flex; justify-content: flex-start; gap: 20px; flex-direction: column;}

p.checkout-severe { color: #000;    font-size: 16px;    line-height: 1.5;    margin: 30px auto;    padding: 10px 10px 10px 60px;    background: url(/img/i/red/warning.svg) no-repeat 10px 10px;    border: 1px solid var(--border-colour);    background-size: 30px 30px; min-height: 50px;}

.btn-toggle-support { position: fixed; bottom: 0px; right:  0px; z-index: 3; width: 180px;}
#close-support-popup { position: absolute; top: 40px; right: 40px; z-index: 4;}

div.form-smaller { max-width: 800px; margin: 0 auto 0 0}
p.form-disclaimer {font-size: 13px; margin-bottom: 10px}
		#popup-support { position: fixed;  z-index: 101; top: 0; height: calc(100 * var(--vh)); width: 720px; max-width: 100vw; opacity: 0; right: -720px; transition: all .3s cubic-bezier(0.390, 0.575, 0.565, 1.000); background: #EDF1F1; padding: 60px; }
		#popup-support.open { opacity: 1; right: 0px; }
		#popup-support div.grecaptcha-badge { right: -200vw !important}
		#popup-support img.logo {display: block; margin: 0 auto 40px 0; width: 100%; max-width: 400px}
		#popup-support form > p {font-size: 20px; font-weight: 300; font-family: helvetica-neue-lt-pro-cond;; }
		#popup-support div.title {font-size: 32px; font-family: helvetica-neue-lt-pro-cond;; margin-bottom: 27px; text-transform: uppercase; font-weight: bold; letter-spacing: 0; color: #4E5453;}
		#popup-support > div { position: relative; top: 50%; width: 100%; transform: translateY(-50%);}
		#popup-support input, #popup-support textarea, #popup-support .select2-container--default .select2-selection--single {border-color: transparent}
		#popup-support #sfComments { min-height: 200px; border-radius: 20px; font-size: 20px; font-weight: 300 padding: 20px;}
		#popup-support p.inline-response { text-align: left; font-size: 18px;}
		p.inline-response span.title { font-family: helvetica-neue-lt-pro-cond;; display: block; margin: 25px auto; width: 100%; text-transform: uppercase; color: #4E5453; font-weight: bold}
		p.inline-response a { font-family: helvetica-neue-lt-pro-cond;; text-decoration: underline; color: #4E5453; font-weight: bold}
		p.inline-response strong { font-family: helvetica-neue-lt-pro-cond;; color: #4E5453; font-weight: bold}

		#fldAssociate { display: none;}
		#fldAssociate.active { display: block;}


	div.order-filters {padding-bottom: 40px; margin-bottom: 40px; border-bottom: 1px solid #D9D9D9}
	div.order-filters div.form-row { align-items: center;}
	div.order-filters div.field label {display: block; color: #000;font-size: 22px;font-weight: 700;font-family: helvetica-neue-lt-pro-cond;  text-transform: uppercase; white-space: nowrap}
	div.datepicker:after {  background-image: url(/img/svg/date.svg); right: 10px; width: 32px;}
	div.order-query { font-size: 13px;  padding-top: 30px;}

	div.order-list { margin-top: 40px; display: flex; justify-content: space-between; gap: 30px; flex-direction: column; }
	div.order { padding-bottom: 30px; border-bottom: 1px solid #dde2e1; }

	
	div.order-header { width: 100%; margin-top: 20px; display: flex; justify-content: space-between; gap: 20px; margin-bottom: 30px}
	div.order-header strong { font-weight: 400;}
	div.order-header > div { display: grid; gap: 5px 20px; grid-template-columns: 1fr 1fr;}
	div.order-header > div:last-child > :nth-child(1), div.order-header > div:last-child > :nth-child(2) { font-weight: 700;  font-size: 20px}

	div.order-status  {color: #000; font-size: 18px;font-weight: 700;font-family: helvetica-neue-lt-pro-cond;  text-transform: uppercase; margin-bottom: 10px}

	div.order-body { display: flex; justify-content: space-between; gap: 16px; flex-direction: column}
	div.order-item { display: grid; min-height: 150px; grid-template-columns: 150px minmax(0, 1fr) 100px 165px; gap: 20px; align-items: center; }

	div.order-item div.product-image { display: block; width: 150px; height: 150px; padding: 10px; overflow: hidden; border: 1px solid #d9d9d9; border-radius: 10px; }
	div.order-item div.product-image a { display: block; width: 100%; height: 100%; }
	div.order-item div.product-image img { width: 100%; height: 100%; object-fit: contain; }
	div.order-item div.product-information { display: block; width: auto; padding: 0; }
	div.order-item div.product-information .vendor { display: none; }
	div.order-item div.product-information div.title { margin-bottom: 6px; font-family: helvetica-neue-lt-pro-cond; font-size: 22px; font-weight: 700; line-height: 1.2; text-transform: uppercase; }
	div.order-item div.product-item-number,
	div.order-item div.package-info { display: inline-block; width: auto; margin: 0; color: #666; font-family: helvetica-neue-lt-pro; font-size: 15px; line-height: 1; text-transform: none; }
	div.order-item div.package-info:empty { display: none}
	div.order-item div.product-item-number:before { content: "Part Number: "; }
	div.order-qty {text-transform: uppercase;}
	div.order-product-price { margin-top: 17px; font-family: helvetica-neue-lt-pro-cond; font-size: 20px; font-weight: 700; letter-spacing: .8px; }
	div.order-item div.order-tools { display: grid; width: 165px; grid-template-columns: 1fr; gap: 25px; align-items: center; justify-items: end; }
	div.order-item div.order-tools > span { display: block; width: auto; color: #000; font-size: 15px; white-space: nowrap; }
	div.order-item div.order-tools > span b { color: #666; font-weight: 400; }
	div.order-item div.order-tools div.cart-tools { width: auto; margin: 0; }
	div.order-item div.order-tools div.cart-tools > div { width: auto; }
	div.order-item div.order-tools a.button.add-to-cart { display: block; width: 116px; margin: 0; padding: 0; border: 1px solid #9eacaa; border-radius: 5px; background: #fff; color: #666; font-family: helvetica-neue-lt-pro-cond; font-size: 15px; line-height: 48px; letter-spacing: .6px; text-align: center; }
	div.order-item div.order-tools a.button.track-order { margin: 0; }
	div.order-buttons { margin-top: 10px; display: flex; justify-content: flex-end; gap: 20px;}
	div.order-buttons a.btn { margin: 0}

	#ui-datepicker-div .ui-datepicker-title { font-size: 18px; margin-bottom: 10px !important; position: relative; z-index: 2;}
	.ui-datepicker-next { right: 0; top: -4px; z-index: 3;}
	.ui-datepicker-prev { left: 0; top: -4px; z-index: 3;}

div.added-to-cart { position: absolute; top: 100px; right: 10px; padding: 20px; border-radius: 20px; background: #fff; width: 400px; max-width: 100vw; box-shadow: 0 7px 16px rgba(0, 0, 0, .12); display: none; opacity: 0; z-index: 98}
header.active div.added-to-cart { z-index: 8}
div.added-to-cart.active { display: block; transition: opacity 2s linear; opacity: 1;}
div.added-to-cart a.close-cart { position: absolute; top: 10px; right: 10px; width: 20px; height: 20px;  background: url(/img/icons/white/x.svg) no-repeat var(--col-accent) center center; background-size: 10px auto; border-radius: 20px; display: block; cursor: pointer}
div.added-to-cart > div.title { font-family: helvetica-neue-lt-pro-cond; font-size: 13px; margin-bottom: 20px; color: var(--col-accent)}
div.added-to-cart div.product { width: 100%; display: flex; justify-content: space-between; gap: 20px; align-items: center; margin-bottom: 20px}
div.added-to-cart div.product-image { width: 140px; height: 140px; border-radius: 10px; background: #fff; overflow: hidden; margin-bottom: 10px; border: 1px solid var(--col-border); }
div.added-to-cart div.product-image a { padding: 10px; display: block; width: 100%; height: 100%}
div.added-to-cart div.product-image img { display: block; width: 100%; height: 100%; object-fit: contain; }
div.added-to-cart div.product-information { flex: 1; display: flex; justify-content: space-between; gap: 10px; flex-direction: column; align-items: flex-start;}
div.added-to-cart div.brand { font-family: helvetica-neue-lt-pro-cond; font-size: 13px;}
div.added-to-cart div.product-information div.title { font-size: 14px;}
div.added-to-cart div.price { font-size: 14px;}
div.added-to-cart a.btn { line-height: 40px; min-height: 0}

a.js-toggle-sound { position: absolute; bottom: 20px; right: 20px; display: block; width: 100px; height: 30px; background: url(/lib/img/white/sound-off.svg) no-repeat right center; background-size: contain; z-index: 3;}
a.js-toggle-sound.toggle-top { bottom: auto; top: 20px; }
a.js-toggle-sound.active { background-image: url(/lib/img/white/sound.svg)}
/*FORMS*/

		div.form-row { margin-bottom: 20px}

		div.support-page form { margin-top: 40px;}
		fieldset { padding-bottom: 30px; margin-bottom: 30px; border-bottom: 1px solid #d9d9d9}
		input[type="text"], input[type="search"], input[type="tel"], input[type="number"], input[type="email"], input[type="password"] { border-radius: 5px; background: #fff; border: 1px solid #000; padding-left: 10px;}
		textarea { border-radius: 5px; background: #fff; border: 1px solid #000; padding: 10px}
		button[type="submit"], button[type="reset"] {font-family: helvetica-neue-lt-pro-cond; border-radius: 5px; font-weight: 700; margin: 0 0 0 auto}
		button[type="submit"].button-blue { background: var(--col-primary)}
		div.button-set { display: flex; justify-content: flex-end; gap: 20px; width: 100%;}
		div.button-set button { margin: 0}

		div.checkbox label {min-height: 30px; padding-left: 36px; font-size: 15px; padding-top: 5px}
		div.checkbox label {min-height: 30px; }
		div.checkbox label:before { height: 30px; width: 30px; border-radius: 5px; border: 1px solid #9EACAA; background: #FFF;}

		div.radio label { padding-left: 40px; padding-top: 6px; text-transform: none; min-height: 30px}
		div.radio label:before  { height: 30px; width: 30px; border-radius: 30px; border: 1px solid #9EACAA; background: #FFF;}
		div.radio input:checked  + label:after  { background: #9EACAA; width: 18px; height: 18px; top: 6px; left: 6px;}

		.select2-container--default .select2-selection--single {border-color: #000; border-radius: 5px;}

		div.reveal-response , div.reveal-response p { text-align: left;}
}

/* ANIMATIONS */
section.js-animate { opacity: 0; transform: translateY(40px); transition: opacity .75s ease, transform .75s ease; }
section.js-animate.in-view, section.js-animate.in-better-view { opacity: 1; transform: translateY(0); }


/* DESKTOP INTERACTIONS AND MOTION */
a.btn, button[type="submit"], button[type="reset"] { transition: background-color .3s ease, border-color .3s ease, color .3s ease, box-shadow .3s ease, transform .3s ease; }
a.btn:hover, button[type="submit"]:hover, button[type="reset"]:hover { box-shadow: 0 7px 16px rgba(0, 0, 0, .12); transform: translateY(-2px); }
a.btn:active, button[type="submit"]:active, button[type="reset"]:active { box-shadow: 0 3px 8px rgba(0, 0, 0, .1); transform: translateY(0); }
a.btn.btn-blue:hover, a.btn.btn-gray:hover { border-color: var(--col-primary); background-color: var(--col-primary); color: #fff; }
a.btn.btn-blue2:hover { border-color: var(--col-accent); background-color: var(--col-accent); }
a.btn.btn-arrow:after { transition: transform .3s ease; }
a.btn.btn-arrow:hover:after { transform: translateX(4px); }
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible { outline: 2px solid var(--col-primary); outline-offset: 3px; }
header div.header-locations a, header div.header-icons a, header nav div.level-1 > div > a { transition: color .3s ease, background-color .3s ease, opacity .3s ease, transform .3s ease; }
header div.header-locations a:hover { background-color: rgba(0, 0, 0, .05); }
header div.header-icons a:hover { color: var(--col-primary); transform: translateY(-2px); }
header div.header-icons a img { transition: transform .3s ease; }
header div.header-icons a:hover img { transform: scale(1.08); }
header nav div.level-1 > div:not(.catalog) > a:hover { color: #4E5453; transform: translateY(-2px); }
header nav div.level-1 > div.sub.catalog > a { transition: background-color .3s ease, box-shadow .3s ease; }
header nav div.level-1 > div.sub.catalog > a:hover { background-color: var(--col-primary); box-shadow: 0 6px 14px rgba(0, 0, 0, .12); }
header nav div.level-1 div.level-2 > div.subnav > div, header nav div.level-1 div.level-3 > a { transition: background-color .27s ease, padding-left .27s ease; }
header nav div.level-1 div.level-2 > div.subnav > div:hover > a { padding-left: 64px; }
header nav div.level-1 .sub.standard div.level-2 > div.subnav > div:hover > a { padding-left: 24px; }
footer div.footer-nav p a, footer div.social a { transition: color .3s ease, opacity .3s ease, transform .3s ease; }
footer div.footer-nav p a:hover { color: var(--col-primary); transform: translateX(3px); }
footer div.social a:hover { color: var(--col-primary); transform: translateY(-2px) scale(1.08); }
div.flyer-cards-alt > div, div.flyer-cards > div, div.grid-1 > a, div.blog-home a.card, div.subcategories > div, div.grid-subcategory div.product-list > div, div.related-products > div, div.grid-locations > div, div.grid-locations-about > div, div.address-block { transition: border-color .375s ease, box-shadow .375s ease, transform .375s ease; }
div.flyer-cards-alt > div:hover, div.flyer-cards > div:hover, div.grid-1 > a:hover, div.blog-home a.card:hover, div.subcategories > div:hover, 
div.grid-locations > div:hover, div.grid-locations-about > div:hover, div.address-block:hover { border-color: rgba(60, 180, 229, .65); box-shadow: 0 10px 24px rgba(0, 0, 0, .09); transform: translateY(-4px); }
div.flyer-cards > div { border-radius: 10px; }
div.flyer-cards > div img { transition: transform .45s ease; }
div.flyer-cards-alt > div img, div.photo-gallery > div img { transition: transform .45s ease; }
div.flyer-cards > div:hover img { transform: translateY(-50%) scale(1.04); }
div.flyer-cards-alt > div:hover img, div.photo-gallery > div:hover img { transform: scale(1.04); }

a.category-slide { transition: background-color .375s ease, box-shadow .375s ease, transform .375s ease; }
a.category-slide:hover { border-color: #D9D9D9; box-shadow: 0 8px 18px rgba(0, 0, 0, .07); transform: translateY(-4px); }
div.slider-categories .slick-list { padding-top: 8px; }
a.category-slide img, div.grid-1 div.thumb img, div.blog-home a.card > div:first-child img, div.subcategories div.thumbnail img, div.grid-subcategory div.thumbnail img, div.related-products div.thumbnail img { transition: transform .45s ease; }
a.category-slide:hover img, div.grid-1 > a:hover div.thumb img, div.blog-home a.card:hover > div:first-child img, div.subcategories > div:hover div.thumbnail img, div.grid-subcategory div.product-list > div:hover div.thumbnail img, div.related-products > div:hover div.thumbnail img { transform: scale(1.035); }
/*div.related-products  > div:hover div.info h6 { padding-left: 10px; padding-right: 10px; padding-bottom: 10px}*/
div.slider-categories .slick-arrow { transition: filter .3s ease, transform .3s ease; }
div.slider-categories .slick-arrow.slick-prev:hover { filter: brightness(.88); transform: scale(1.08); }
div.slider-categories .slick-arrow.slick-next:hover { filter: brightness(.88); transform: rotate(180deg) scale(1.08); }
div.slider-categories ul.slick-dots li button { transition: background-color .3s ease, transform .3s ease; }
div.slider-categories ul.slick-dots li button:hover { background-color: var(--col-primary); transform: scale(1.15); }
div.grid-vendors > div, div.grid-vendors > a { transition: box-shadow .375s ease, transform .375s ease; }
div.grid-vendors > div:hover, div.grid-vendors > a:hover { box-shadow: 0 8px 18px rgba(0, 0, 0, .08); transform: translateY(-3px); }
div.grid-vendors img { transition: transform .45s ease; }
div.grid-vendors > div:hover img, div.grid-vendors > a:hover img { transform: scale(1.04); }
div.grid-suppliers .slick-slide a { transition: transform .375s ease; }
div.grid-suppliers .slick-slide img { filter: grayscale(15%); opacity: .72; transform: scale(.95); transition: filter .45s ease, opacity .45s ease, transform .45s ease; }
div.grid-suppliers .slick-slide.slick-active img { filter: grayscale(0); opacity: .9; transform: scale(1); }
div.grid-suppliers .slick-slide a:hover { transform: translateY(-3px); }
div.grid-suppliers .slick-slide a:hover img { filter: grayscale(0); opacity: 1; transform: scale(1.03); }
ul.account-icons li div.thumbnail { transition: transform .375s ease; }
ul.account-icons li:hover div.thumbnail { transform: scale(1.035); }
div.cart-product .product-image, div.order-item div.product-image { transition: border-color .375s ease, box-shadow .375s ease; }
div.cart-product .product-image:hover, div.order-item div.product-image:hover { border-color: var(--col-primary); box-shadow: 0 7px 16px rgba(0, 0, 0, .08); }
div.cart-product .product-image img, div.order-item div.product-image img { transition: transform .45s ease; }
div.cart-product .product-image:hover img, div.order-item div.product-image:hover img { transform: scale(1.04); }
input[type="text"], input[type="search"], input[type="tel"], input[type="number"], input[type="email"], input[type="password"], textarea, .select2-container--default .select2-selection--single { transition: border-color .3s ease, box-shadow .3s ease, background-color .3s ease; }
input[type="text"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="number"]:focus, input[type="email"]:focus, input[type="password"]:focus, textarea:focus { border-color: var(--col-primary); box-shadow: 0 0 0 3px rgba(60, 180, 229, .14); }
div.checkbox label:before, div.radio label:before, div.radio input:checked + label:after { transition: background-color .3s ease, border-color .3s ease, transform .3s ease; }
div.checkbox label:hover:before, div.radio label:hover:before { border-color: var(--col-primary); }
div.radio input:checked + label:after { transform: scale(1); }
.btn-toggle-support { transition: filter .3s ease, transform .375s ease; transform-origin: right bottom; }
.btn-toggle-support:hover { filter: brightness(1.04); transform: scale(1.035); }
#close-support-popup { transition: opacity .3s ease, transform .3s ease; }
#close-support-popup:hover { opacity: .7; transform: rotate(90deg); }
.masthead .mask-1 img { animation: mw-hero-settle 1.5s ease-out both; }
.caption-home > * { animation: mw-fade-up .975s ease-out both; }
.caption-home > :nth-child(2) { animation-delay: .12s; }
.caption-home > :nth-child(3) { animation-delay: .24s; }
.caption-home > :nth-child(4) { animation-delay: .36s; }
@keyframes mw-fade-up {
	from { opacity: 0; transform: translateY(18px); }
	to { opacity: 1; transform: translateY(0); }
}
@keyframes mw-hero-settle {
	from { opacity: .92; transform: scale(1.018); }
	to { opacity: 1; transform: scale(1); }
}
@media (prefers-reduced-motion: reduce) {
	*, *:before, *:after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}

/* COMPACT SCROLL-UP NAVIGATION */
body.fully-scrolled header.attached { position: fixed; top: 0; left: 50%; z-index: 100; display: flex; width: 100%; max-width: 1440px; height: 64px; padding: 0 100px; align-items: center; background: #fff; box-shadow: 0 8px 22px rgba(0, 0, 0, 0); opacity: 0; pointer-events: none; transform: translate(-50%, -400px); will-change: transform; }
body.fully-scrolled header.attached.visible { box-shadow: 0 8px 22px rgba(0, 0, 0, .1); opacity: 1; pointer-events: auto; transform: translate(-50%, 0);  transition: transform .45s ease, opacity .35s ease, box-shadow .45s ease; }
body.fully-scrolled header.attached div.header-locations, body.fully-scrolled header.attached div.header-tools div.js-search-input, body.fully-scrolled header.attached div.header-icons, body.fully-scrolled header.attached div.burger, body.fully-scrolled header.attached a.nav-support-link { display: none; }
body.fully-scrolled header.attached div.header-tools { flex: 0 0 210px; width: 210px; margin: 0 35px 0 0; }
body.fully-scrolled header.attached div.header-tools a.logo { display: block; width: 210px; }
body.fully-scrolled header.attached div.nav { flex: 1; width: auto; max-width: none; margin: 0; gap: 0; }
body.fully-scrolled header.attached nav { height: 64px; }
body.fully-scrolled header.attached nav div.level-1 { height: 64px; align-items: center; gap: 30px; }
body.fully-scrolled header.attached nav div.level-1 > div > a { line-height: 64px; }
body.fully-scrolled header.attached nav div.level-1 > div.sub.catalog > a { border-radius: 5px; line-height: 44px; }
body.fully-scrolled header.attached nav div.level-1 > div.sub.catalog > a:after { top: 18px; }
body.fully-scrolled header.attached nav div.level-1 > div.sub.standard:hover div.level-2 { top: 64px; }
body.fully-scrolled header.attached:before { content: ""; position: absolute; top: 0; bottom: 0; left: 50%; z-index: -1; width: 100vw; background: #fff; box-shadow: 0 8px 22px rgba(0, 0, 0, .1); transform: translateX(-50%); }
body.fully-scrolled header.attached.visible, body.fully-scrolled[scroll-direction="up"] header.attached { box-shadow: none; }


@media only screen and (max-width: 1280px) {
	section.max > div.container, section.max > div.container2, section:not(.max):not(.masthead) { padding-left: 30px; padding-right: 30px;}
	div.grid-create-account { padding-left: 30px; padding-right: 30px;}
	div.grid-header2 {max-width: calc(100% - 80px); margin-left: 0; margin-right: auto; left: 30px; }
	
	
	body.fully-scrolled header.attached, header div.nav, div.header-tools{ padding-left: 30px; padding-right: 30px;}
	header nav div.level-1 { gap: 20px;}
	div.header-locations > div a.active { padding-left: 50px}

	body.fully-scrolled header.attached {justify-content: space-between;}
	body.fully-scrolled header.attached div.nav { padding: 0; justify-content: flex-end;}
	body.fully-scrolled header.attached nav div.level-1 { gap: 20px; justify-content: flex-end;}
	body.fully-scrolled header.attached div.header-tools { margin: 0; flex: inherit;}
	body.fully-scrolled header.attached div.header-tools { margin: 0; flex: inherit;}
	

	footer {padding: 50px 30px 0; }
	footer div.footer-row {padding-bottom: 40px; margin: 0 auto 30px; }
	footer div.logo { width: 240px; margin: 0 auto 20px 0;}

	div.footer-grid { gap: 40px;}
	footer div.footer-nav { gap: 40px;}

	footer div.disclaimer { gap: 40px; }
	footer div.disclaimer div.fdo { width: 410px; max-width: 33%; }

	.btn-toggle-support { width: 120px}

	div.grid-subcategory aside { width: 240px}
	div.grid-cart { gap: 20px}

	ul.account-icons, div.grid-locations-about, div.grid-locations, div.blog-home, div.grid-1 { gap: 12px;}
	div.grid-3 { padding-right: 40px}

	div.blog { gap: 50px 12px}

	div.support-page, div.grid-location { gap:40px}
	div.locations-about { gap: 12px}

	div.caption { width: 100%}
	div.caption-home p { margin-bottom: 20px;}
	div.mask-1 { height: 560px;}
	div.mask-1 img { display: block; width: 100%; height: 100%; object-fit: cover;}

	div.flyer-cards {gap: 10px } 
	div.flyer-cards > div > a { padding-right: 15vw;}
	div.flyer-cards > div img { width: 13vw; height: 7.5vw; }
	div.flyer-cards strong { font-size: 48px;margin-bottom: 20px}
	div.flyer-cards p.msg { font-size: 14px; }

	div.slider-categories div.slick-slide { padding: 0 6px;} 

	div.video { margin: 20px auto}

	div.grid-locations-about > div, div.grid-locations > div { padding: 20px 15px 15px; }
	div.grid-locations-about div.directions a , div.grid-locations div.directions a { padding: 0 12px}
	div.grid-locations-about div.hours span:nth-child(odd), div.grid-locations div.hours span:nth-child(odd) { letter-spacing: 0}
	div.grid-locations-about div.hours span:nth-child(even), div.grid-locations div.hours span:nth-child(even) { font-size: 13px}
	div.grid-locations-about a.phone, div.grid-locations a.phone { padding: 12px 0; font-size: 18px}

	div.grid-vendors .active div.vendor-categories { gap: 5px}

	a.contact-call { font-size: 24px}

	div.caption-about { width: 40vw; right: 30px; bottom: -30vw;}

	ul.account-icons { grid-template-columns: repeat(3, 210px);}

	div.product-header, div.category-header { gap: 40px}
	div.subcategories { gap: 40px 12px}
	div.product-list { grid-template-columns: 1fr 1fr;} 
	div.product-list div.thumbnail, div.subcategories div.thumbnail {padding: 20px}
	div.product-list { gap: 40px 12px}

	
}


@media only screen and (max-width: 980px) {

	:root {
		  --default-font-size: 15px;
		  --default-line-height: 1.5;
		  --default-input-font-size: 14px;
		  --dim-input-height: 50px;
		  --button-font-size: 14px;
		  --button-height: 36px;
		  --dim-default-space: 50px;
	}

	h1 { font-size: 48px;margin-bottom: 20px}
	h2 { font-size: 28px; margin-bottom: 10px}
	h2.spaced {margin-bottom: 30px}
	h2.small {font-size: 18px}
	h2.large {font-size: 48px}
	h3 { font-size: 20px;margin-bottom: 15px}
	h4 {font-size: 17px; margin-bottom: 15px}

	a.btn { padding: 0 15px; }

	body.fully-scrolled header.attached {justify-content: center; }
	body.fully-scrolled header.attached nav div.level-1 { justify-content: center; }
	body.fully-scrolled header.attached div.header-tools { display: none;}

	div.footer-grid { flex-direction: column;}
	footer div.social { justify-content: flex-start;}

	div.caption-home h1 { font-size: 72px}
	div.caption-home p { font-size: 18px}
	div.caption-home { padding: 0 30px}

	div.grid-header { gap: 40px}
	div.page-header p.eyebrow { margin-bottom: 30px}

	div.grid-1 { display: grid; grid-template-columns: 1fr 1fr; gap: 12px}
	div.grid-2 { flex-direction: column-reverse; gap: 20px}

	div.container2 { padding-top: 40px; padding-bottom: 40px}

	div.header-tools div.js-search-input input { width: 100%}
	header a.nav-support-link { display: none !important;}

	div.grid-locations {display: grid; gap: 12px; grid-template-columns: 1fr 1fr;}
	div.blog-home a.card p { display: none}

	div.grid-suppliers .slick-slide a { padding: 0 12px}

/*	table.product-skus tr.sku-table-row [data-label] { display: none;}*/

	#skulist {overflow: auto}
	div.related-products {display: grid; gap: 12px; grid-template-columns: 1fr 1fr;}

	div.grid-header2 { left: 20px;}
	div.grid-header2 > div:first-child { flex: 1}
	div.grid-header2 > div:last-child { width: 280px; flex: inherit}

	div.custom-metal-steps { gap: 12px;}
	div.custom-metal-steps > div { padding: 80px 20px 20px;; background-position: 20px 20px; background-size: 120px auto}
	div.custom-metal-steps div.title { padding-left: 66px; font-size: 24px;}
	div.custom-metal-steps div.title span { font-size: 13px; }
	div.custom-metal-steps div.info {font-size: 14px;}

	.custom-form { margin-top: 60px}
	.custom-form h3 { font-size: 24px; }
	.custom-order-nav { }
	.custom-order-nav:before { height: 6px; margin-top: -3px;}
	.custom-order-nav > div { width: 60px; height: 60px; line-height: 60px; font-size: 32px; }
	.custom-order-nav > div.active:after { width: 130px; left: 60px; margin-top: -3px; height: 6px; }

	a.btn.btn-call  { font-size: 24px; padding-left: 50px; line-height: 50px}
	a.btn.btn-call:after {width: 24px; left: 16px;  }

	div.grid-content-holder { gap: 40px}
	div.grid-content div.copy { padding: 0}

	div.grid-vendors { grid-template-columns: 1fr 1fr 1fr;}
	div.grid-vendors .active div.vendor-categories { top: 0; height: 100%; padding: 20px; background: rgba(255, 255, 255, .95)}

	div.contact-directions a { font-size: 16px; line-height: 40px}
	a.contact-call { font-size: 18px; padding: 10px 15px; min-height: 50px} 

	div.caption-about {position: relative; bottom: 0; width: 100%; right: 0; padding: 20px 0 20px; }
	div.locations-about {flex-direction: column-reverse;}
	div.grid-locations-about { margin-top: 0}
	div.locations-about > div { width: 100%; }

	div.grid-4 { gap: 40px}
	div.grid-4> div:first-child { padding: 0}
	
	div.team { grid-template-columns: 1fr 1fr 1fr; gap: 12px;} 

	div.blog div.info div p { display: none;}

	div.photo-gallery { grid-template-columns: 1fr 1fr 1fr 1fr;gap: 5px;}

	div.grid-cart { flex-direction: column;}

/*	    ul.account-icons { grid-template-columns: 1fr 1fr 1fr }*/
/*		ul.account-icons li { width: 100%; height: 20vw;}*/
/*		ul.account-icons li div.thumbnail { height: 100%; background-size: contain; background-position: center;}*/
/*		ul.account-icons li > a {display: flex; justify-content: space-between; gap: 0; flex-direction: column; padding: 30px 30px 55px; position: relative;}*/
/*		ul.account-icons li p {position: absolute; bottom: 0; left: 0}*/

	    ul.account-icons { grid-template-columns: repeat(2, 210px); }

		div.order-item { display: flex; justify-content: space-between; gap: 10px; flex-direction: column; align-items: flex-start;}
		div.order-header { gap: 10px; flex-direction: column; align-items: flex-start; background: var(--col-border); padding: 20px}
		div.order-item div.order-tools { display: flex; justify-content: space-between; gap: 0;}
		div.order-buttons { justify-content: flex-start; padding-top: 20px}

		div.order-filters div.field.x1, div.order-filters div.field.x2, div.order-filters div.field.x3, div.order-filters div.field.x4, div.order-filters div.field.x5, div.order-filters div.field.x6  { grid-column: span 6 !important;}
		div.order-filters div.field.x7, div.order-filters div.field.x8, div.order-filters div.field.x9, div.order-filters div.field.x10, div.order-filters div.field.x11, div.order-filters div.field.x12   { grid-column: span 12 !important;}
		div.order-filters button[type="submit"] { margin: 0 auto 0 0}
		div.order-filters div.form-row div.field.right { text-align: left !important}

		div.support-page h6 {font-size: 20px; margin-bottom: 5px}
}


@media only screen and (max-width: 760px) {

	:root {
		  --default-font-size: 15px;
		  --default-line-height: 1.5;
		  --default-input-font-size: 14px;
		  --dim-input-height: 50px;
		  --button-font-size: 14px;
		  --button-height: 36px;
		  --dim-default-space: 50px;
	}

	h1 { font-size: 32px;margin-bottom: 20px}
	h2 { font-size: 22px; margin-bottom: 10px}
	h2.spaced {margin-bottom: 30px}
	h2.small {font-size: 18px}
	h2.large {font-size: 32px}
	h3 { font-size: 20px;margin-bottom: 15px}
	h4 {font-size: 17px; margin-bottom: 15px}

article { padding-top: 160px}

		div.header-locations { position: relative; z-index: 100; }
		div.header-locations > div a { font-size: 0; line-height: 1; padding: 5px 0}
		div.header-locations > div a.active { font-size: 8px; padding: 5px 0; background: var(--col-primary); color: #fff;}
		div.header-locations > div a span { font-size: 10px; display: block;}
		div.header-locations > div a.active:before, div.header-locations > div a.active:after { display: none;}

		div.header-tools { display: flex !important; flex-direction: column; position: relative; z-index: 97; width: 100% !important}
		div.js-search-input { width: 100%;}
		div.header-icons { position: absolute; top: 0; right: 30px;}
		div.header-tools a.logo { width: 200px; padding-left: 30px;}
		div.header-tools a.logo img { margin: 0 auto 0 0}
		header div.burger { display: block !important; }
/*		header div.burger ul { position: relative;}*/
/*		header div.burger ul li { width: 100%}*/
		div.header-icons { gap: 10px; height: auto; padding-top: 4px}
		header div.header-icons a:nth-child(1),header div.header-icons a:nth-child(2),header div.header-icons a:nth-child(3) { display: none}
		header div.header-icons a img { height: 20px}

		header {left: 0 !important; transform: none !important; height: auto !important;padding: 0 !important; height: auto !important; position: fixed !important; background: #fff; opacity: 1 !important; display: block !important; box-shadow: none !important }
		body.fully-scrolled header.attached:before { display: none !important}
		body.fully-scrolled header.attached { height: 60px !important; z-index: 98!important; pointer-events: all}
		body.fully-scrolled header.attached div.burger { top: 0}
		body.fully-scrolled header.attached div.header-tools a.logo { width: 200px; padding-top: 20px;}
		header div.nav {}
		header nav {width: 100vw !important; left: -200vw !important; opacity: 0 !important; position: fixed; top: 0; background: #fff; height: calc(100 * var(--vh))  !important; padding: 100px 0 20px  !important; z-index: 97  !important; }
		header.active nav {left: 0 !important; opacity: 1 !important}
		header.active .js-search-input {display: none !important}
		header nav div.level-1 { flex-direction: column !important; align-items: center !important; justify-content: flex-start !important; gap: 0 !important; height: auto !important}
		header nav div.level-1 > div { width: 100%; padding: 0px; text-align: left;}
		header nav div.level-1 > div > a { padding-left: 20px !important; padding-right: 20px !important}
		header nav div.level-1 div.level-2 { width: 100% !important; transition: none !important; position: relative !important}
		header nav div.level-1 div.level-2 > div.subnav { padding-left: 20px}
		header nav div.level-1 div.level-2 > div.subnav > div { width: 100%;}
		header nav div.level-1 > div.sub.catalog > a { background: #fff; color: #000; padding: 0}
		header nav div.level-1 > div.sub.catalog > a:after { display: none;}
		header nav div.level-1 div.level-2 { left: -200vw !important; top: 0 !important; opacity: 0 !important; position: absolute !important;}
		header nav div.level-1 .open div.level-2 { left: 0 !important; opacity: 1 !important; position: relative !important; width: 100vw !important;}
		header nav div.level-1 div.level-3, header nav div.level-1 .sub.catalog a.close-nav, header nav div.nav-logo { display: none !important;}
		header nav div.level-1 div.level-2 > div.subnav div a {  width: 100% !important;}
		header nav div.level-1 > div.sub.open { max-height: 80vh; overflow-y: auto; overflow-x: hidden}
		header nav div.level-1 div.level-2 > div.subnav div.nav-flyer { background: #fff; }
		header nav div.level-1 div.level-2 > div.subnav div a span {left: 0; top: 0}
		header nav div.level-1 > div.sub.catalog > a:hover { background: #fff; color: var(--col-primary); box-shadow: none}
		header nav div.level-1 div.level-2 > div.subnav div a {padding-top: 10px; padding-bottom: 10px;}
		header nav div.level-1 .sub.standard div.level-2 > div.subnav. div a {padding-left: 20px !important;}
		header nav div.level-1 div.level-2 > div.subnav div.nav-flyer a span { background: #eee}
		header nav div.level-1 div.level-2 > div.subnav div.nav-flyer a {color: #000}
		

		footer div.footer-nav { display: grid; gap: 30px; grid-template-columns: 1fr 1fr;}
		/*div.footer-nav > div:nth-child(1),*/
		/*div.footer-nav > div:nth-child(2),*/
		/*div.footer-nav > div:nth-child(3) { display: none}*/
		footer div.disclaimer { flex-direction: column; gap: 0}
		footer div.disclaimer div.fdo { width: 100%; max-width: 100%}


		div.caption-home p.eyebrow { font-size: 14px; letter-spacing: 1px}
		p.eyebrow { font-size: 13px; letter-spacing: 1px}
		div.caption-home h1 { font-size: 40px; margin-bottom: 20px}
		div.buttons { flex-direction: column; align-items: flex-start;} 
		div.slider-categories .slick-arrow { display: none !important}
		div.slider-categories .slick-list { padding-bottom: 40px}

		div.subcategories, 
		div.product-list, 
		div.grid-locations, 
		div.grid-locations-about, 
		div.related-products, 
		div.grid-1 { grid-template-columns: 1fr;}

		div.suppliers-heading {flex-direction: column; align-items: flex-start; gap: 15px;}
		div.suppliers-heading a { margin: 0 auto 0 0}

		div.subcategories, 
		div.related-products, 
		div.product-list { gap: 20px}

		div.cta-custom-metal, div.talk-to-human {flex-direction: column; align-items: flex-start; gap: 10px}
		div.talk-to-human a, div.cta-custom-metal a { margin: 0 auto 0 0}


		div.blog-home a.card:not(:first-child) {display: none;}

		div.directions { justify-content: flex-start !important; gap: 10px !important  }

		#popup-support {padding: 0px 0px}
		#popup-support > div { max-height: 100vh; overflow: auto; padding: 40px 20px}
		#popup-support img.logo { max-width: 200px; margin-bottom: 20px}
		#popup-support form > p { font-size: 16px}
		#popup-support div.title { font-size: 24px}
		
		div.category-header,
		div.product-header { flex-direction: column-reverse; gap: 10px}
		div.breadcrumb { padding: 20px 0}


		div.subcategory-header div.breadcrumb a:last-child,
		div.product-header div.breadcrumb a:last-child { display: none;}

		div.grid-subcategory aside { position: fixed; bottom: 0; height: 30px; left: 0; z-index: 90; background: #fff; width: 100vw;; padding-top: 30px; display: none}
		div.grid-subcategory aside.open { height: calc(100 * var(--vh))}

		div.product-header > div { width: 100% !important}
		div.product-header h1 { font-size: 22px}

		div.grid-header2 { flex-direction: column; padding: 0; margin-top: 20px; padding-bottom: 20px; align-items: stretch; gap: 20px; left: 0}
		div.caption-header { padding: 0}
		div.grid-header2 div.buttons.stacked { align-items: flex-start; width: 100%; max-width: 100%;}

		div.custom-metal-steps { flex-direction: column}

/*		.custom-order-nav { }*/
		.custom-order-nav:before { height: 2px; margin-top: -1px;}
		.custom-order-nav > div { width: 30px; height: 30px; border-radius: 30px; line-height: 30px; font-size: 14px; }
		.custom-order-nav > div.active:after { width: 50px; left: 30px; margin-top: -1px; height: 2px; }

		div.field.x1, div.field.x2, div.field.x3, div.field.x4, div.field.x5, div.field.x6  { grid-column: span 12 !important;}
		div.field.x7, div.field.x8, div.field.x9, div.field.x10, div.field.x11, div.field.x12   { grid-column: span 12 !important;}

		a.btn.btn-call  { font-size: 18px; padding-left: 34px; line-height: 40px}
		a.btn.btn-call:after {width: 18px; left: 8px;  }
		
		div.grid-content-holder {gap: 20px}
		div.grid-content {flex-direction: column; gap: 20px;}
		div.grid-content-holder div.grid-content:nth-child(even) {flex-direction: column; }

		div.grid-header { grid-template-columns: 1fr;  gap: 20px}

		div.grid-vendors { grid-template-columns: 1fr 1fr; }
		div.grid-vendors .active div.vendor-categories { overflow-y: auto;}

		div.grid-location {display: flex; justify-content: space-between; gap: 20px; flex-direction: column-reverse; align-items: stretch}
		a.contact-call { font-size: 16px; letter-spacing: 0; text-align: center; width: 100%; justify-content: center;}

		div.about-intro, div.grid-4 { display: flex; justify-content: space-between; gap: 20px ;flex-direction: column-reverse; }

	    div.team { grid-template-columns: 1fr; gap: 20px; }
	    div.blog { grid-template-columns: 1fr; gap: 50px; }
		div.blog div.info div p { display: block; font-size: 14px}
		div.more-news-2025 div.blog div.article > div { display: none}

	    div.photo-gallery { grid-template-columns: 1fr 1fr 1fr;gap: 5px;}

		div.support-page { flex-direction: column; gap: 20px}
		div.account-user-name { margin-bottom: 0}
		div.support-page div.inner-menu { display: none;}
		div.support-page div.need-help { margin-top: 20px; display: none; }
		div.support-page a.account-support-link { width: 120px; display: block; float: right}

	    ul.account-icons { grid-template-columns: 1fr 1fr;}
		ul.account-icons li { width: 100%}

		div.addresses { grid-template-columns: 1fr }

		div.cart-actions { flex-direction: column; gap: 30px}
		div.cart-actions > div:last-child { display: flex; justify-content: space-between; gap: 10px; flex-direction: column; align-items: flex-start;}
		div.cart-actions .btn { margin: 0}

		div.flyer-cards-alt { display: grid; gap: 10px; grid-template-columns: 1fr 1fr;}
		div.flyer-cards-alt > div > a { height: 100px;}
		div.flyer-cards-alt > div { background: #fff;  flex: 1;border-radius: 10px; display: flex; justify-content: space-between; gap: 10px; flex-direction: column; padding: 20px; }
/*		div.flyer-cards-alt > div img { display: block; width: 100%; height: 100%; object-fit: contain;}*/
		div.flyer-cards-alt p { font-size: 13px; letter-spacing: 0;}

		div.masterclass-list { grid-template-columns: 1fr 3fr;}
		div.masterclass-list div.location { display: none;}
		div.masterclass-list div.name { padding-left: 20px; padding-right: 0}


		div.info-box { margin-bottom: 30px; padding-bottom: 30px; flex-direction: column; gap: 10px}
		div.info-box div.list { grid-template-columns: 1fr;}
		div.info-box div.list span { font-size: 14px}
		div.wrp-confirmation-block {flex-direction: column}
		div.confirmation-block { grid-template-columns: 2fr 3fr; gap: 10px}
		div.confirmation-block button { margin: 0 0 0 auto}
		div.confirmation-block label { font-size: 15px;}
		p.checkout-severe {font-size: 12px; margin-top: 0;  padding: 0 0 0 20px; background-size: 14px auto; background-position: left top}
		div.button-group {flex-direction: column; align-items: flex-start;}

		div.product-gallery div.slick-slide { padding: 10px;}
		div.additional-photos > div { padding: 5px}
		div.additional-photos { gap: 5px; margin-top: 5px;}
		div.product-header div.brand { padding-top: 20px}

		table.product-skus tr.sku-table-row td { padding: 10px 5px; font-size: 14px}

		div.sku-cart-tools a.button.add-to-cart { background-position: 8px 12px; background-size: 14px 14px;}
		div.sku-cart-tools a.button { line-height: 40px; padding-right: 10px; padding-left: 30px; font-size: 14px;}
		div.sku-cart-tools div.qty input { line-height: 40px; min-height: 40px}

		div.product-list div.thumbnail, div.subcategories div.thumbnail {height: auto; padding: 10px}
		div.product-list div.info p:empty { display: none}

		h2.icon-flyer { padding-left: 30px;}

		div.grid-create-account { flex-direction: column-reverse; padding: 0}
		div.grid-create-account > div img { display: block; width: 100%; margin: 0}
		div.grid-create-account > div:first-child { background: #fff; padding: 30px;}
		div.grid-create-account > div:first-child p, div.grid-create-account > div:first-child h2 { color: #000 !important}
		div.grid-create-account > div:first-child p.eyebrow { color: var(--col-primary) !important}

		/* collapse product skus table */
		div#skulist { overflow: hidden}
		table.product-skus { display: block}
		table.product-skus tbody { display: flex; justify-content: space-between; gap: 40px; flex-direction: column; width: 100%;}
		table.product-skus tr { display: flex; justify-content: flex-start; flex-wrap: wrap; gap: 10px; padding-bottom: 40px; border-bottom: 1px solid var(--col-border)}
		table.product-skus tr.sku-table-head { display: none}
		table.product-skus tr.sku-table-row td { padding: 0 !important; border: 0}
		table.product-skus tr.sku-table-row td:first-child { width: 20px;}
		table.product-skus tr.sku-table-row td[data-label] { width: 100%; text-align: left; display: flex; font-size: 12px; gap:10px}
		table.product-skus tr.sku-table-row td[data-label]:before { content: attr(data-label); font-family: helvetica-neue-lt-pro-cond; }
		table.product-skus tr.sku-table-row td[data-label="Price"] { padding-top: 10px !important; width: 100%; text-align: left; display: flex; justify-content: flex-end; gap: 5px; flex-direction: row-reverse; align-items: flex-end; font-size: 18px;}
		table.product-skus tr.sku-table-row.on-sale td[data-label="Price"]:before { top: -5px}
		table.product-skus tr.sku-table-row.on-sale td[data-label="Price"]:before { position: relative; display: block;}
		table.product-skus tr.sku-table-row td:last-child div.sku-cart-tools { text-align: left; padding-top: 20px}
		table.product-skus tr.sku-table-row td.sku-label { width: calc(100% - 30px); font-size: 17px;}

		a.js-toggle-sound { bottom: 10px; right: 10px; width: 60px; height: 20px; }
		a.js-toggle-sound.toggle-top { top: auto; bottom: 10px }

/*		div.info-box.active { display: flex; }*/
/*		div.info-title { font-family: helvetica-neue-lt-pro-cond; font-weight: 700;font-size: 20px;letter-spacing: 0%;text-transform: uppercase; display: block; color: #4E5453}*/
/*		div.info-box div.list { flex: 1; display: grid; gap: 10px 80px; grid-template-columns: 1fr 1fr 1fr;}*/
/*		div.info-box div.list span { font-family: helvetica-neue-lt-pro-cond; font-weight: 700;font-size: 20px;text-transform: uppercase; color: #4E5453}*/
 }