/** Shopify CDN: Minification failed

Line 2375:4 Expected identifier but found "clamp("
Line 2773:11 Expected ":"
Line 2774:4 Expected identifier but found "9999"
Line 3145:4 Expected identifier but found ")"
Line 3984:4 Expected identifier but found ")"
Line 3996:11 Unexpected "\".cta\""

**/
@charset "UTF-8";
@import"https://use.typekit.net/qmk2kzf.css";

@font-face {
    font-family: ProspectusM;
    src: url(//bencomicgraphics.com/fonts/ProspectusM-Italic.woff2) format("woff2"), url(//bencomicgraphics.com/fonts/ProspectusM-Italic.woff) format("woff");
    font-weight: 400;
    font-style: italic;
    font-display: swap
}

@font-face {
    font-family: ProspectusM;
    src: url(//bencomicgraphics.com/fonts/ProspectusM-Bld.woff2) format("woff2"), url(//bencomicgraphics.com/fonts/ProspectusM-Bld.woff) format("woff");
    font-weight: 700;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: ProspectusM;
    src: url(//bencomicgraphics.com/fonts/ProspectusM-Reg.woff2) format("woff2"), url(//bencomicgraphics.com/fonts/ProspectusM-Reg.woff) format("woff");
    font-weight: 400;
    font-style: normal;
    font-display: swap
}

:root {
    --grid-width: clamp(875px, 85.417vw, 1640px);
    --grid-gutter: clamp(10px, .938vw, 18px);
    --alertbar-height: clamp(18px, 1.719vw, 33px);
    --header-height: clamp(56px, 5.469vw, 105px);
    --logo-width: clamp(114px, 11.094vw, 213px);
    --logo-height: clamp(23px, 2.292vw, 44px);
    --footer-height: clamp(155px, 15.104vw, 290px);
    --legal-height: clamp(18px, 1.771vw, 34px);
    --footer-logo-width: clamp(47px, 8vw, 120px);
    --footer-logo-height: clamp(47px, 8vw, 120px);
    --primary-color: #3E3C3C;
    --secondary-color:rgb(250, 249, 245);
    --tertiary-color: #FFFFFF;
    --gray-color: #747474;
    --trans-color: rgba(250,249,245, .8);
    --light-color: rgba(62,60,60,.55);
    --cream-color: #FAF9F5;
    --primary-font: brother-1816, sans-serif;
    --secondary-font: "prospectusm", serif;
    --standard-font-size: 1rem;
    --line-height: 1.6
}

details > summary {
    list-style: none
}

details > summary::-webkit-details-marker {
    display: none
}

body {
    font-family: var(--primary-font);
    color: var(--primary-color)
}

#page-head container,
#page-foot container,
div container,
section container {
    max-width: var(--grid-width);
}
main container:after, 
div container:after, 
#page-head container:after, 
.equal-heights:after, 
.centerbox:after, 
.listed:after, 
.halves:after, 
.row:after, 
main>div:after, 
.blocks:after, 
#page-foot container:after {
    display: none;
    content: none;
}

.halves > .half > container {
    max-width: calc(var(--grid-width) / 2)
}

.halves > .half > container,
.listed li,
[class^=box-],
[class*=" box-"] {
    padding: var(--grid-gutter)
}

figure .hoverimg {
    opacity: 0;
    transition: all .25s
}

#SiteContainer {
    width: 100vw !important;
    overflow: hidden
}

figure:hover .hoverimg {
    opacity: 1
}

.cta {
    min-width: clamp(189px, 18.438vw, 354px);
    height: clamp(36px, 3.49vw, 67px);
    border-radius: clamp(18px, 1.771vw, 34px);
    border: 1px solid var(--primary-color);
    overflow: hidden;
    position: relative
}

.cta:before {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    border-radius: clamp(18px, 1.771vw, 34px);
    background: var(--primary-color);
    left: 0px;
    top: 0px;
    border: 1px solid var(--primary-color);
    transform: translate(-105%);
    transition: all .25s
}

.cta:hover:before {
    transform: translate(0)
}

.cta > * {
    font-family: var(--primary-font);
    font-size: clamp(7px, .677vw, 13px);
    letter-spacing: .1em;
    font-weight: 700;
    text-transform: uppercase;
    background: none;
    border: none;
    color: var(--primary-color);
    text-decoration: none;
    transition: all .25s
}
.cta > .dark-bg {
    background: var(--primary-color);
    color: var(--tertiary-color);
}

.cta:hover > * {
    color: var(--tertiary-color)
}
.cta:hover > .dark-bg {
    color: var(--primary-color);
    background: var(--tertiary-color);
}

.cta > .light-bg {
    background: var(--secondary-color);
    color: var(--primary-color);
}


main *:not(.cta) > a {
    position: relative;
    color: var(--primary-color);
    text-decoration: none
}

main *:not(.cta) > a:after {
    position: absolute;
    content: "";
    bottom: calc(-1*clamp(3px, .26vw, 5px));
    left: 0px;
    width: 0px;
    height: 1px;
    transition: all .5s;
    background: var(--primary-color)
}

main *:not(.cta) > a:hover:after {
    width: 100%
}

figure.bg > a {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    display: block;
    z-index: 2
}

figure.bg .desktopbg.hover {
    transition: all .25;
    opacity: 0;
    z-index: 1
}

figure.bg:hover .desktopbg.hover {
    opacity: 1
}

article p,
.p,
article ul {
    font-family: var(--primary-font);
    font-size: var(--standard-font-size);
    margin-bottom: var(--standard-font-size);
    line-height: var(--line-height);
    color: var(--gray-color);
}

h1, article h1,
.h1 {
    font-family: var(--secondary-font);
    font-size: clamp(32px, 3.125vw, 60px);
    font-weight: 300;
    letter-spacing: 0;
    line-height: 1.4;
    margin-bottom: 0;
    font-style: normal
}

h2, article h2,
.h2 {
    font-family: var(--secondary-font);
    font-size: clamp(29px, 2.813vw, 54px);
    font-weight: 300;
    letter-spacing: 0;
    line-height: 1.4;
    margin-bottom: 0;
}

h3, article h3,
.h3 {
    font-family: var(--secondary-font);
    font-size: clamp(25px, 2.448vw, 47px);
    font-weight: 300;
    line-height: 1;
    letter-spacing: 0em
}

h4, article h4,
.h4 {
    font-family: var(--secondary-font);
    line-height: var(--line-height);
    margin-bottom: var(--standard-font-size)
}

h5, article h5
.h5 {
    font-family: var(--secondary-font);
    line-height: var(--line-height);
    margin-bottom: var(--standard-font-size)
}

h6, article h6,
.h6 {
    font-family: var(--secondary-font);
    line-height: var(--line-height);
    margin-bottom: var(--standard-font-size)
}

article blockquote,
.blockquote {
    font-family: var(--secondary-font);
    line-height: var(--line-height);
    margin-bottom: var(--standard-font-size)
}

article blockquote cite,
.blockquote cite {
    font-family: var(--primary-font);
    line-height: var(--line-height)
}

article .eyebrows,
.eyebrows {
    opacity: .42;
    font-size: clamp(7px, .677vw, 13px);
    letter-spacing: .24em;
    text-transform: uppercase;
    display: block;
    font-family: var(--secondary-font) !important
}

article .subheader,
.subheader {
    font-family: var(--secondary-font) !important;
    font-size: clamp(13px, 1.302vw, 25px);
    font-weight: 400;
    letter-spacing: 0;
    line-height: 1.4;
    margin-bottom: 0;
    display: block;
    font-style: italic;
    margin-bottom: clamp(20px, 1.979vw, 38px)
}

.subheader:last-child {
    margin-bottom: 0
}

article ul,
article ol {
    padding-left: var(--standard-font-size)
}

article ul {
    list-style-type: disc
}

article ol {
    list-style-type: decimal
}

details {
    font-family: var(--primary-font);
    font-size: var(--standard-font-size);
    margin-bottom: var(--standard-font-size);
    line-height: var(--line-height)
}

details summary {
    font-family: var(--primary-font);
    font-size: var(--standard-font-size);
    padding-bottom: var(--standard-font-size);
    line-height: var(--line-height);
    border-bottom: 1px solid var(--primary-color);
}

.inertia {
    transition: all .75s ease-out
}

.dk-bg {
    background: var(--primary-color)
}

.tan-bg {
    background: var(--secondary-color)
}

.white-bg {
    background: var(--tertiary-color)
}
.cream-bg {
    background: var(--cream-color);
}

.dk-bg * {
    color: var(--tertiary-color)
}

.dk-bg .cta {
    border-color: var(--tertiary-color)
}

.dk-bg .cta:before {
    background: #333
}

.dk-bg .cta * {
    color: var(--tertiary-color)
}

.dk-bg .cta:hover > * {
    color: var(--tertiary-color)
}

main .dk-bg *:not(.cta) > a {
    color: var(--tertiary-color)
}

main .dk-bg *:not(.cta) > a:after {
    background: var(--tertiary-color)
}

#alertbar {
    height: var(--alertbar-height);
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100vw;
    z-index: 999
}

#alertbar p {
    margin-bottom: 0;
    text-align: center
}

#page-head {
    height: var(--header-height);
    position: fixed !important;
    left: 0px;
    top: 0px;
    width: 100vw;
    z-index: 999
}

#page-head container {
    height: var(--header-height);
    max-width: 100%
}

#page-head container .logo {
    width: var(--logo-width);
    display: block;
    height: var(--logo-height);
}

#page-head container .logo svg {
    width: 100%
}

#page-head container .logo svg * {
    fill: var(--primary-color)
}

#page-head container nav {
    max-width: clamp(199px, 19.479vw, 374px);
    width: 100%;
    height: var(--header-height);
    padding-left: clamp(25px, 2.448vw, 47px);
    padding-right: clamp(25px, 2.448vw, 47px)
}

#page-head container nav * {
    font-size: clamp(8px, .781vw, 15px);
    text-decoration: none
}
#page-head container nav#nav {
  padding-right: clamp(16px,1.563vw,30px);
  border-right: 1px solid #000;
  max-width: 22%;
  align-items: center;
}

#page-head container nav#nav .gm-item.gm-level-0 > a {
    padding: 0 10px !important;
}
#page-head container nav#nav a:hover {
    text-decoration: none;
}
#page-head container nav {
    display: flex !important
}

#page-head container nav > ul {
    font-size: 0px
}

#page-head container nav > ul > li {
    margin: 0px clamp(4px,0.417vw,8px);
    position: static
}

#page-head container nav > ul > li > a {
    font-weight: 500
}

#page-head container nav.left > ul > li > ul {
    border-bottom: 1px solid var(--primary-color)
}

#page-head container nav.left > ul > li:first-child {
    margin-left: 0
}

#page-head container nav.right > ul > li:last-child {
    margin-right: 0
}
#page-head container nav.right > ul > li:last-child {
  position: relative;
}
#page-head container nav.right > ul > li input { display: none; }
#page-head container nav.right > ul > li .search {
  height: 0px; overflow: hidden; background: var(--secondary-color); 
 transition: all .25s;
  position: absolute;
  top: 193%;
  right: 0px; width: clamp(187px,18.229vw,350px); z-index: 99
}
#page-head container nav.right > ul > li input:checked ~ .search { height: clamp(39px,3.854vw,74px); }

#page-head container nav.right > ul > li .search form {
  padding: clamp(8px,0.781vw,15px) clamp(13px,1.302vw,25px);
   border: 1px solid var(--primary-color); 
  display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-content: stretch;
    align-items: center;
}
#page-head container nav.right > ul > li .search input {
  height: clamp(22px,2.188vw,42px);
    background: none;
    border: none;
    font-family: var(--secondary-font);
    font-size: clamp(7px,.677vw,13px);
    letter-spacing: .24em;
    text-transform: uppercase;
    width: 100%; display: block; 
    position: relative;
}

#page-head container nav.right > ul > li .search  button {
border: none; background: none;
  
}

#page-head container nav.right > ul > li label svg { border: none; width: clamp(6px,0.625vw,12px); }

#page-head container nav > ul > li > ul {
    width: 100vw;
    height: 280px;
    overflow: hidden;
    position: absolute;
    top: -280px;
    left: 0px;
    transition: all .5s;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-content: stretch;
    align-items: stretch
}

#page-head container nav > ul > li > ul.expand {
    top: calc(100% - 1px);
}

#page-head container nav > ul > li > ul:before {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    content: "";
    background: var(--secondary-color);
    opacity: .91;
    display: block;
    z-index: 10;
}

#page-head container nav > ul > li > ul > li {
    padding: clamp(18px, 1.719vw, 33px) clamp(25px, 2.396vw, 46px);
    width: clamp(252px, 24.635vw, 473px);
    height: clamp(149px, 14.583vw, 280px);
    border-right: 1px solid var(--primary-color);
    z-index: 10;
}

#page-head container nav > ul > li > ul > li > a {
    display: block;
    margin-bottom: clamp(13px, 1.302vw, 25px);
    font-weight: 600;
    pointer-events: none
}

#page-head container nav > ul > li > ul > li > ul {
    column-count: 2;
    width: 100%
}

#page-head container nav > ul > li > ul > li > ul > li {
    padding-bottom: clamp(3px, .26vw, 5px);
    display: block;
    break-inside: avoid-column
}

#page-head container nav > ul li a {
    position: relative
}

#page-head container nav #CartButton span {
    display: inline-block;
    position: relative
}

#page-head container nav #CartButton span:after,
#page-head container nav li a:after {
    position: absolute;
    content: "";
    bottom: calc(-1*clamp(3px, .26vw, 5px));
    left: 0px;
    width: 0px;
    height: 1px;
    transition: all .5s;
    background: var(--primary-color)
}
#page-head container nav#nav li a:after {
    bottom: 6px;
    left: 10px;
}
#page-head container nav#nav .gm-submenu li a:after {
    bottom: -1px;
    left: 0;
}
#page-head container nav#nav .gm-submenu {
    top: 4.75rem; 
}
#page-head .gm-links>.gm-heading {
    border-bottom: none !important;
    margin-bottom: 4px !important;
    padding-bottom: 0;

}

@media screen and (max-width: 1023px) {
    #page-head container nav#nav .gm-submenu {
        top: auto; 
        border-bottom: 1px solid var(--primary-color);
    }
}

#page-head container nav #CartButton span:hover:after,
#page-head container nav li a:hover:after {
    width: 100%
}
#page-head container nav#nav li a:hover:after {
    width: calc(100% - 20px);
}

#page-head container nav#account li a {
    text-transform: uppercase;
    color: var(--primary-color);
}

#page-head container nav .cart-count-bubble {
    margin-left: clamp(9px, .885vw, 17px);
    display: inline-flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-content: stretch;
    align-items: center;
    width: clamp(12px, 1.198vw, 23px);
    height: clamp(12px, 1.198vw, 23px);
    border-radius: 50%;
    border: 1px solid var(--primary-color);
    position: relative
}

#page-head container nav .addedtocart {
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translate(-35%) translateY(100%);
    width: clamp(80px, 7.813vw, 150px);
    z-index: 99;
    opacity: 0;
    transition: all .25s;
  pointer-events: none;
}

#page-head container nav .addedtocart.visible {
    opacity: 1;
    transform: translate(-35%) translateY(0)
}

#page-head container nav #CartButton:after {
    display: none
}

#page-head container nav > ul .current-menu-item a,
#page-head container #nav > ul .active a,
#page-head container nav > ul a:hover {
    opacity: 1
}

#page-head.toggle-menu container > .toggle:before,
#page-head.toggle-menu container > .toggle:after,
#page-head.toggle-menu container > .toggle em:before,
#page-head.toggle-menu container > .toggle em:after {
    background: #000
}

#nav.addtoggle #main .menu-item-has-children span.toggler {
    position: absolute;
    top: 0%;
    right: 0px;
    transform: translateY(50%)
}

#page-head.dk-bg {
    border-top: 1px solid var(--tertiary-color)
}

#page-head.dk-bg container nav *:hover,
#page-head.dk-bg container nav * {
    color: var(--tertiary-color)
}

#page-head.dk-bg container .logo svg * {
    fill: var(--tertiary-color) !important
}

#page-head.dk-bg container nav *:hover:after {
    background: var(--tertiary-color)
}
#page-head.dk-bg container nav label svg * { fill: #FFF; }
#alertbar ~ #page-head {
    top: var(--alertbar-height) !important
}

#page-loader {
    width: 100vw;
    position: fixed;
    top: 0px;
    left: 0px;
    opacity: 1 !important;
    z-index: 9999999;
    transition: all 1.5s;
    overflow: hidden
}

#page-loader.loaded {
    transform: translateY(-150%)
}

#page-loader figure {
    width: clamp(126px, 12.292vw, 236px);
    height: clamp(126px, 12.292vw, 236px)
}

#page-loader figure svg {
    width: clamp(126px, 12.292vw, 236px);
    height: clamp(126px, 12.292vw, 236px)
}

#page-loader figure svg .meatspin {
    animation: meatspin 10s infinite linear;
    transform-origin: center
}

#page-loader h1 {
    position: absolute;
    bottom: 0px;
    left: 0px;
    font-family: var(--secondary-font);
    line-height: .5;
    margin-bottom: clamp(8px, .781vw, 15px);
    font-size: clamp(77px, 7.552vw, 145px);
    text-align: center;
    word-spacing: .44em;
    width: 100%
}

#page-loader h1 span {
    display: inline-block
}

#page-loader h1 span:nth-child(1) {
    animation: riseup .25s 1 linear
}

#page-loader h1 span:nth-child(2) {
    animation: riseup .5s 1 linear
}

#page-loader h1 span:nth-child(3) {
    animation: riseup .75s 1 linear
}

@keyframes riseup {
    0% {
        transform: translateY(200%);
        opacity: 0
    }

    to {
        transform: translateY(0);
        opacity: 1
    }
}

@keyframes meatspin {
    0% {
        transform: rotate(0)
    }

    to {
        transform: rotate(359deg)
    }
}

.home-header {
    height: 100vh;
    position: relative;
}
#alertbar ~ #SiteContainer main .home-header {
    height: calc(100vh - var(--header-height) - var(--alertbar-height) )
}

#alertbar ~ #SiteContainer main .home-header .top-part,
#alertbar ~ #SiteContainer main .home-header .top-part .headerswiper {
  height: calc(calc(100vh - var(--header-height) - var(--alertbar-height)) - clamp(85px, 8.333vw, 160px))
  
}


.home-header .top-part,
.home-header .top-part .headerswiper {
    width: 100%;
    position: relative;
    height: calc(100vh - clamp(85px, 8.333vw, 160px));
}

.home-header .top-part .headerswiper .desktopbg img {
    position: absolute;
    top: 0px;
    left: 50%;
    transform: translateX(-50%);
  
}

.home-header .lower-part {
    height: clamp(85px, 8.333vw, 160px);
  border-top: 1px solid var(--primary-color);
  border-bottom: 1px solid var(--primary-color);
}
.home-header .lower-part > .line { display: none }

.home-header container {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: stretch;
    align-items: center
}

.home-header container .left {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: stretch;
    align-items: center;
    height: clamp(85px, 8.333vw, 160px);
    width: 100%;
    max-width: clamp(643px, 62.76vw, 1205px);
    padding-right: clamp(45px, 4.427vw, 85px)
}

.home-header .right {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: stretch;
    align-items: center;
    height: clamp(85px, 8.333vw, 160px);
    padding: clamp(32px, 3.125vw, 60px);
    width: clamp(299px,29.167vw,560px);
  position: absolute;
  bottom: 0px;
  right: 0px;
      z-index: 9;
    background-color: var(--secondary-color); 
  border-top: 1px solid var(--primary-color);
  border-bottom: 1px solid var(--primary-color);
}

@media screen and (max-width: 1876px) {
    #page-head container nav#nav {
        max-width: 28%;
    }
}

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

    #page-head container nav#nav {
        max-width: 30%;
    }
    #page-head container nav#nav .gm-submenu {
        top: 3.5rem; 
    }
    #page-head container nav#nav .gm-item.gm-level-0 > a {
        display: inline-block;
    }
    #page-head container nav#nav .gm-level-0 a span {
        font-size: clamp(8px, .781vw, 15px) !important;
    }
    #page-head container nav#nav .gm-submenu a span {
        font-size: clamp(12px, .781vw, 15px) !important;
    }
    #page-head container nav#nav .gm-submenu .gm-grid .gmcol-1{
        flex-basis: 10%;
        max-width: 10%;
    }
    #page-head container nav#nav .gm-submenu .gm-grid .gmcol-2 {
        flex-basis: 15%;
        flex-grow: 1;
    }
    
    
}
@media screen and (max-width: 1023px) {
    #page-head container nav#nav .gm-submenu {
        top: 3.5rem;
    }
    #page-head container nav#nav .gm-submenu .gm-grid {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
    }
    #page-head container nav#nav .gm-level-0 a span {
        font-size: clamp(12px, .781vw, 15px) !important;
    }
    #page-head container #toggle:checked~#nav {
        padding: 1rem 2rem;
    }
    #page-head container nav#nav .gm-submenu .gm-grid .gmcol-1,
    #page-head container nav#nav .gm-submenu .gm-grid .gmcol-2,
    #page-head container nav#nav .gm-submenu .gm-grid .gmcol-3,
    #page-head container nav#nav .gm-submenu .gm-grid .gmcol-4,
    #page-head container nav#nav .gm-submenu .gm-grid .gmcol-5
    #page-head container nav#nav .gm-submenu .gm-grid .gmcol-6 {
        max-width: 100%;
    }
}
@media screen and (max-width: 767px) {
    #page-head container nav#nav .gm-submenu .gm-grid {
        display: grid;
        grid-template-columns: 1fr;
    }
    #page-head container nav#nav .gm-submenu {
        top: auto;
    }
    li.gm-has-submenu > a span:after {
        content: "+";
        position: absolute;
        right: -2rem;
        width: 2rem;
        height: 2rem;
        transition: all .3s;
    }
    li.gm-has-submenu.gm-active > a span:after {
        content: "-";
    }
}

@media handheld, only screen and (max-width: 1023px) {
  .home-header .right.observe {
      bottom: auto;
      top: calc(100vh - var(--header-height) - var(--alertbar-height) - clamp(153px,47.897vw,490px) + 8vw);
      transform: translateY(-50%);
      height: auto;
  }

  .home-header .right.observe em {
    display:none !important;
  }

}

.home-header .right .header-swiper-pagination {
    counter-reset: section;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: stretch;
    align-items: flex-start;
    position: static
}

.home-header .right .header-swiper-pagination .swiper-pagination-bullet {
    background: none;
    margin: 0;
    width: clamp(29px, 2.865vw, 55px);
    height: auto;
    transition: all .5s;
    text-align: left;
    font-style: normal;
    font-weight: 400;
    font-size: clamp(8px, .781vw, 15px)
}

.home-header .right .header-swiper-pagination .swiper-pagination-bullet:before {
    width: 100%;
    height: 1px;
    content: " ";
    background: var(--primary-color);
    display: block;
    transition: all .5s
}

.home-header .right .header-swiper-pagination .swiper-pagination-bullet em {
    font-style: normal;
    display: block;
    font-family: var(--secondary-font);
    font-weight: 700;
    margin: clamp(5px, .521vw, 10px) 0px
}

.home-header .right .header-swiper-pagination .swiper-pagination-bullet strong {
    width: clamp(122px, 11.875vw, 228px);
    overflow: hidden;
    display: block;
    transition: all .25s;
    clip-path: polygon(0 0, 0 0, 0 100%, 0% 100%);
    font-style: normal;
    font-weight: 400;
    font-size: clamp(8px, .781vw, 15px)
}

.home-header .right .header-swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
    width: clamp(122px, 11.875vw, 228px)
}

.home-header .right .header-swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active strong {
    font-style: normal;
    font-weight: 400;
    font-size: clamp(8px, .781vw, 15px);
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%)
}

.home-header .top-part .swiper-slide a {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%
}

.right-trim {
    position: absolute;
    top: 0px;
    right: 0px;
    height: 100%;
    z-index: 8;
    width: clamp(96px, 9.375vw, 180px);
    overflow: hidden
}

.right-trim figure {
    width: clamp(60px, 5.885vw, 113px);
    height: clamp(60px, 5.885vw, 113px)
}

.right-trim figure svg {
    width: clamp(60px, 5.885vw, 113px);
    height: clamp(60px, 5.885vw, 113px);
    transition: all .25s;
    transform-origin: center
}
.right-trim figure svg path {

  fill: #F8F3E1!important;
}
.right-trim figure:before {
    bottom: 100%;
    left: 50%;
    width: 1px;
    height: 60vh;
    content: "";
    position: absolute;
    background: #F8F3E1;
    transition: all 2.5s;
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%)
}

.right-trim figure:after {
    top: 100%;
    left: 50%;
    width: 1px;
    height: 60vh;
    content: "";
    position: absolute;
    background: #F8F3E1;
    transition: all 2.5s;
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%)
}

.right-trim figure:not(.visible):before {
    clip-path: polygon(0 100%, 100% 100%, 100% 100%, 0% 100%)
}

.right-trim figure:not(.visible):after {
    clip-path: polygon(0 0, 100% 0, 100% 0, 0 0)
}

.hero.fullheight {
    min-height:100vh;
    position: relative;
    display: flex;
    align-items: center;
}
.hero.fullheight.text-light {
    color: var(--secondary-color);
}

.hero.fullheight img.bg {
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
}
.hero.fullheight img.bg.position-left {
    object-position: left center;
}
.hero.fullheight img.bg.position-right {
    object-position: right center;
}
.hero.fullheight container {
    height: 100%;
    position: relative;
    z-index: 10;
    display: flex;
    align-items: center;
    padding-top: 6rem;
}
.hero.fullheight .page-title {
    position: absolute;
    top: 0;
    text-transform: uppercase;
}
.hero.fullheight .text {
    
}
.hero.fullheight .text h1 {
    font-size: 4rem;
    line-height: .8;
    font-family: var(--secondary-font);
    font-weight: 300;
    margin-bottom: 1.5rem;
    width: 50%;
}
.hero.fullheight .text .offsettext p {
    margin-bottom: 1.5rem;
    position: relative;
    width: 40%;
}
.hero.fullheight .text .offsettext p:nth-child(2){
    left: 6rem;
}
.hero.fullheight .text .offsettext p:nth-child(3){
    left: 12rem;
}
.hero.fullheight .text .offsettext p:nth-child(4){
    left: 18rem;
}
@media screen and (max-width: 768px) {
    .hero.fullheight {
        display: flex;
        align-items: center;
    }
    .hero.fullheight img.bg.position-left {
        object-position: center;
    }
    .hero.fullheight container {
        padding: 4rem 2rem;
    }
    .hero.fullheight container .page-title {
        top: 2rem;
    }
    .hero.fullheight container .text h1 {
        width: 100%;
    }
    .hero.fullheight container .text .offsettext p {
        width: 60%;
    }
    .hero.fullheight container .text .offsettext p:nth-child(2) 
    {
        left: 2rem;
    }
    .hero.fullheight container .text .offsettext p:nth-child(3) {
        left: 4rem;
    }
}

.cta-block container {
    padding: 2rem 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.cta-block container:after {
    content: none;
}
.cta-block h2 {
    width: 35%;
    font-family: var(--secondary-font);
    font-weight: 300;
    font-size: 2.8rem;
    line-height: 1;
}
.cta-block .cta-wrap {
    width: 30%;
    text-align: right;
}
.cta-block .cta:before {
    content: none;
}

@media screen and (max-width: 768px) {
    .cta-block container {
        flex-direction: column;
        padding: 2rem;
    }
    .cta-block h2 {
        width: 100%;
    }
    .cta-block .cta-wrap {
        width: 100%;
        margin-top: 3rem;
    }
}

.image-carousel {
    /* width: 100%;
    overflow: hidden;
    display: flex;
    justify-content: center; */
}
.image-carousel .carousel {
    /* display: flex;
    justify-content: center;
    align-items: center; */
    padding: 5rem 0;
}
.image-carousel .carousel .swiper-wrapper {
    display: flex;
    align-items: center;
}
.image-carousel .carousel .swiper-slide {
    padding: 0 .5rem;
    transition: all .3s;
    transform: scale(1);
    border: 0rem solid #fff;
}
.image-carousel .carousel .swiper-slide-active, 
.image-carousel .carousel .swiper-slide-duplicate-active {
    transform: scale(1.2);
    z-index: 100;
    padding: 0;
    border: 1rem solid #fff;
}

.process-blocks {
    border-top: 1px solid #000;
    padding: 4rem 0;
}
.process-blocks h2 {
    font-size: 2.8rem;
}
.process-blocks .process-block {
    margin: 1rem 0;
    position: relative;
    min-height: 30rem;
    display: flex;
    flex-direction: column;
}
.process-blocks .process-block img.bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: -1;
}
.process-blocks .process-block .content {
    display: flex;
    flex-direction: column;
    width: 40%;
    /* padding: 2rem; */
    background: var(--trans-color);
    height: 100%;
    flex-grow: 1;
}
.process-blocks .process-block .content .head {
    display: grid;
    grid-template-columns: 1fr 3fr;
}
.process-blocks .process-block .head strong {
    font-size: 4rem;
    padding: 1rem;
    border-right: 1px solid #000;
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: 300;
}
.process-blocks .process-block .head h3 {
    display: flex;
    align-items: center;
    padding: 1rem;
}
.process-blocks .process-block .text {
    border-top: 1px solid #000;
    padding: 2rem;
}
@media screen and (max-width: 768px) {
    .process-blocks .process-block .content {
        width: 80%;
    }
}

.text-image-block {
    background: var(--primary-color);
    color: var(--secondary-color);
}
.text-image-block container {
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    padding: 1.5rem 0;
}
.text-image-block .text {
    display: flex;
    flex-direction: column;
    width: 55%;
    padding: 3rem;
}
.text-image-block .text h2 {
    font-size: 2.8rem;
    line-height: 1.1;
    margin-bottom: 1rem;
}
.text-image-block .image {
    width: 40%;
}
.text-image-block .image img {
    height: 100%;
    object-fit: cover;
}
.text-image-block.hero {
    background: var(--secondary-color);
    color: var(--primary-color);
}

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

    .text-image-block container {
        flex-direction: column;
    }
    .text-image-block .text {
        width: 100%
    }
    .text-image-block .image {
        width: 100%;
    }
}

.people {
    display: flex;
    overflow: hidden;
}
.people .image {
    width: 50%;
    position: relative;
    min-height: 55vh;
    background: var(--primary-color);
}
.people .image .content-wrap {
    position: absolute;
    top: -150%;
    left: 0;
    height: 100%;
    width: 100%;
    transition: all .8s;
}
.people .image .content-wrap.active {
    top: 0;
}
.people .image .content-wrap img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    object-position: top center;
}
.people .image .bio {
    background: rgba(0,0,0,.6);
    color: var(--secondary-color);
    padding: 3rem 4rem;
    position: absolute;
    bottom: 0;
    width: 100%;
}
.people .controls {
    width: 50%;
    background: var(--secondary-color);
    display: flex;
    flex-direction: column;
    padding: 3rem;
}
.people .controls .person {
    padding-bottom: 1rem;
    padding-top: 1.5rem;
    border-bottom: 1px solid var(--primary-color);
    cursor: pointer;
}
.people .controls h3 {
    font-size: 3.5rem;
    position: relative;
}
.people .controls .person h3:before {
    content:url(/cdn/shop/files/chevron-right-sharp-light-full.svg?v=1756327497);
    position: absolute;
    top: 0;
    left: -4rem;
    transition: all .5s;
    width: 2rem;
    opacity: 0;
}
.people .controls .person.active h3:before {
    left: -2rem;
    opacity: .4;
}
@media screen and (max-width: 768px) {
    .people {
        flex-direction: column;
    }
    .people .image {
        width: 100%;
    }
    .people .controls {
        width: 100%;
    }
}

.location {
    background: #fff;
    padding: 6rem 4rem;
}
.location container {
    background-color: var(--primary-color);
    color: var(--secondary-color);
    padding: 3rem 0;
}
.location container p {
    margin-bottom: 1.5rem;
}
.location container .image {
    padding-right: 3rem;
}

@media screen and (max-width: 768px) {
    .location {
        padding: 4rem 2rem;
    }
    .location container .image {
        padding-right: 0;
    }
}

.image-gallery-block {
    padding: 4rem 0;
}
.image-gallery-block container {
    display: grid;
    grid-gap: 1.5rem;
    grid-template-columns: 1fr 1fr;
}


.home-spotlight {
    overflow: hidden;
    position: relative;
    min-height: 65vh;
    display: flex;
    align-items: center;
}
.home-spotlight img.bg {
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.home-spotlight container {
    padding-top: clamp(24px, 1.385vw, 65px);
    padding-bottom: clamp(24px, 1.385vw, 65px);
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: stretch;
    align-items: center;
    margin-left: 0;
    padding-left: 5%;
    background: var(--trans-color);
    width: 40%;
}

.home-spotlight container article {
    width: 100%;
    max-width: clamp(259px, 25.313vw, 486px);
    padding: clamp(21px, 2.083vw, 40px) clamp(11px, 1.042vw, 20px);
    margin-left: calc(-1*clamp(11px, 1.042vw, 20px))
}
.home-spotlight container article:not(.visible) .line:before {
  clip-path: polygon(50% 0, 50% 0, 50% 100%, 50% 100%);
  
}

.home-spotlight container article:not(.visible) .line:after {
  clip-path: polygon(0 50%, 100% 50%, 100% 50%, 0 50%);
}

.home-spotlight container article .line:before,
.home-spotlight container article .line:after {
  transition-delay: .5s;
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
}

.home-spotlight container article h3 {
    line-height: 1;
    margin-bottom: clamp(13px, 1.302vw, 25px)
}
.home-spotlight container article a {
    text-transform: uppercase;
}

.home-spotlight container > figure {
    width: 100%;
    max-width: clamp(544px, 53.125vw, 1020px);
    height: clamp(299px, 29.167vw, 560px);
    z-index: 2
}

.value-block {
    padding: 4rem 0;
}
.value-block > container.grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    padding: 1rem 3rem;
}
.value-block .item {
    padding: 3rem;
}
.value-block .item .icon {
    width: 100%;
    height: 3rem;
    padding-bottom: 1rem;
    display:flex;
    justify-content: center;
}
.value-block .item h3 {
    font-family: var(--primary-font);
    text-transform: uppercase;
    text-align: center;
    font-size: 1.1rem;
    font-weight: bold;
}
.value-block .item p {
    text-align: center;
    font-size: 1rem;
    margin-bottom: 1rem;
}


.home-collections  {
position: relative; z-index: 2;
padding-bottom: 3rem;
border-bottom: 1px solid var(--primary-color);
  
}
.home-collections .headline {
    text-align: center;
    padding: clamp(21px, 2.083vw, 40px) 0px
}

.home-collections .home-collection {
    padding: 0;
    list-style-type: none;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-content: stretch;
    align-items: flex-start;
    max-width: 90%;
    margin: 0 auto;
}

.home-collections .home-collection .box-1-3 {
    padding: 0;
    padding-bottom: 0;
    margin: 0 .5rem;
    position: relative;
}

.home-collections .home-collection .box-1-3 figure {
    width: 100%;
    height: clamp(209px, 30.417vw, 492px);
    
    z-index: 1
}

.home-collections .home-collection .box-1-3 .bottom-collection-bar {
    width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-content: stretch;
    align-items: center;
    width: 100%;
    padding:.5rem 1rem;
    font-size: .8rem;
    font-weight: 600;
    text-transform: uppercase;
}
.home-collections .home-collection .box-1-3 .bottom-collection-bar.inset {
    position: absolute;
    bottom: 0;
    justify-content: flex-start;
    z-index: 10;
    background-color: var(--trans-color);
}

.home-collections .home-collection .box-1-3 .bottom-collection-bar a {
    text-decoration: none
}

.home-collections .home-collection .box-1-3 .bottom-collection-bar a:after {
    display: none
}

.home-collections .home-collection .box-1-3 .bottom-collection-bar .eyebrows {
    display: block;
    height: clamp(21px, 2.083vw, 40px);
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-content: stretch;
    align-items: center;
    padding-right: clamp(13px, 1.302vw, 25px);
    font-family: var(--secondary-font);
    text-decoration: none !important;
    color: var(--primary-color)opacity: 1;
    margin-right: clamp(13px, 1.302vw, 25px);
    color: var(--primary-color);
    opacity: 1
}

.home-featured-callouts.halves {
    padding-top: clamp(53px, 5.208vw, 100px);
    padding-bottom: clamp(96px, 9.375vw, 180px)
}

.home-featured-callouts.halves .half container {
    max-width: calc(clamp(877px, 85.677vw, 1645px)/2);
    display: block;
    position: relative
}

.home-featured-callouts.halves .half container article {
    max-width: clamp(389px, 38.021vw, 730px)
}

.home-featured-callouts.halves .half:nth-child(1) container {
    padding-right: clamp(16px, 1.563vw, 30px);
    padding-left: 0
}

.home-featured-callouts.halves .half:nth-child(2) container {
    padding-left: clamp(16px, 1.563vw, 30px);
    padding-right: 0;
    padding-top: clamp(152px, 14.844vw, 285px)
}

figure.feature-box.bg {
    width: 100%;
    height: clamp(281px, 27.448vw, 527px);
    margin-top: clamp(19px, 1.823vw, 35px)
}

figure.feature-box figcaption {
    position: absolute;
    bottom: 0px;
    left: 0px;
    width: 100%;
    height: clamp(43px, 4.167vw, 80px);
    padding: 0px clamp(21px, 2.083vw, 40px);
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: stretch;
    align-items: center;
    background: rgba(248, 243, 225, .75);
    transition: all .25s
}

figure.feature-box:hover figcaption {
    background: rgba(248, 243, 225, 1)
}

figure.feature-box figcaption span {
    position: relative;
    height: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: stretch;
    align-items: center;
    padding-right: clamp(21px, 2.083vw, 40px);
    transition: all .25s
}

figure.feature-box figcaption span:after {
    position: absolute;
    top: 0px;
    left: 100%;
    height: 100%;
    content: " DISCOVER MORE";
    font-family: var(--primary-font);
    font-size: clamp(10px, .938vw, 18px);
    font-style: normal;
    white-space: nowrap;
    margin-left: clamp(13px, 1.302vw, 25px);
    padding-left: clamp(13px, 1.302vw, 25px);
    font-weight: 700;
    width: 0px;
    overflow: hidden;
    transition: all .25s;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: stretch;
    align-items: center
}

figure.feature-box:hover figcaption span:after {
    width: 200px
}

figure.feature-box:hover figcaption span {
    transform: translate(calc(-100% - 40px))
}

.home-featured-callouts.halves .half:first-child container figure + .detail {
    position: absolute;
    right: 50%;
    bottom: calc(-1*clamp(56px, 5.469vw, 105px));
    height: clamp(360px, 35.156vw, 675px);
    width: 50vw;
    z-index: -2
}

.home-featured-callouts.halves .half:first-child container figure + .detail:after {
    top: 100%;
    right: 0px;
    width: clamp(9px, .833vw, 16px);
    height: clamp(3px, .26vw, 5px);
    content: " ";
    position: absolute;
    border-top: 1px solid var(--primary-color);
    border-bottom: 1px solid var(--primary-color);
    transform: translate(50%)
}

.home-featured-callouts.halves .half:nth-child(2) container figure + .detail {
    position: absolute;
    left: calc(100% - 1px);
    bottom: clamp(136px, 13.281vw, 255px);
    height: 85vh;
    width: clamp(285px, 27.865vw, 535px);
    z-index: -2
}

.hover-stretch.smoothenter {
    transition: all .25s
}

.home-signup container {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-content: stretch;
    align-items: center;
    min-height: clamp(136px, 13.281vw, 255px)
}

.home-signup container article {
    height: clamp(136px, 13.281vw, 255px);
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-content: stretch;
    align-items: center;
    min-height: clamp(136px, 13.281vw, 255px);
    padding-right: clamp(29px, 2.865vw, 55px);
    padding-left: clamp(29px, 2.865vw, 55px)
}

.home-signup container article:nth-child(1) {
    text-align: right
}

.home-signup container article.form-holder {
    width: 100%;
    max-width: clamp(286px, 27.917vw, 536px)
}

.home-signup container article.form-holder form {
    width: 100%;
    position: relative
}

.home-signup container article.form-holder form .thank-you ~ * {
  display: none!important;
}
.home-signup container article.form-holder form .thank-you {
height: clamp(24px,2.344vw,45px);
    background: none;
    border: none;
    font-family: var(--secondary-font);
    font-size: clamp(7px,.677vw,13px);
    letter-spacing: .24em;
    text-transform: uppercase;
    width: 100%;
    position: relative;
  display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-content: stretch;
    align-items: center;
}
.home-signup container article.form-holder form button {
    border: none;
    background: none;
    position: absolute;
    bottom: clamp(17px, 1.667vw, 32px);
    right: 0px
}

.page-top container {
    /* max-width: 1100px; */
    padding: 4rem 1rem;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: stretch;
    align-items: flex-start
}

.page-top container h1.page-title {
    font-family: var(--secondary-font);
    font-weight: 300;
    margin-bottom: 0;
    font-size: clamp(32px, 3.125vw, 60px);
    line-height: 1
}

.page-top container h1.page-title svg {
    width: clamp(20px, 1.979vw, 38px);
    top: calc(-1*clamp(4px, .365vw, 7px));
    position: relative
}

.page-top container.slim {
    height: clamp(23px, 2.292vw, 44px)
}

.page-top container.slim ul {
    padding: 0;
    list-style-type: none
}

.page-top container.slim ul li {
    display: inline-block
}

.page-top container.slim ul li:after {
    content: " > "
}

.page-top container.slim ul li a {
    color: var(--primary-color);
    text-decoration: none;
    text-transform: capitalize;
    font-size: clamp(8px, .781vw, 15px);
    font-weight: 500
}

.page-top container.slim ul li:last-child:after {
    display: none
}

.page-top container.slim ul li:last-child a:after {
    width: 100%
}

.page-top.dk-bg {
    background: #3e3c3c !important
}

#page-head.dk-bg container nav > ul > li > ul:before {
    background: var(--primary-color)
}

#page-head.dk-bg container nav li a:hover {
    color: var(--tertiary-color) !important
}

.curated-header {
    height: clamp(645px, 63.021vw, 1210px);
    position: relative;
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
    overflow: hidden;
    margin-bottom: -1px
}

.curated-header h2.giant {
    font-style: normal !important;
    font-size: clamp(189px, 18.49vw, 355px);
    text-align: center;
    line-height: .85;
    margin-bottom: 0
}

.curated-header h2.giant span {
    position: relative;
    z-index: 2
}

.curated-header .picholder {
    position: relative;
    z-index: 1;
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    pointer-events: none
}

.curated-header figure {
    position: absolute;
    z-index: 1;
    width: clamp(533px, 52.083vw, 1000px);
    height: clamp(326px, 31.875vw, 612px);
    top: 50%;
    left: 50%;
    transform: translate(-50%) translateY(-50%)
}

.curated-conversation {
    margin-top: 0
}

.curated-conversation container {
    max-width: clamp(970px, 94.688vw, 1818px);
    height: clamp(267px, 26.042vw, 500px);
    text-align: center;
    padding-top: clamp(46px, 4.479vw, 86px)
}

.curated-conversation container article p {
    font-size: clamp(10px, .99vw, 19px)
}

.curated-conversation container .equal {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    pointer-events: none
}

.curated-conversation container .equal:before {
    bottom: 100%;
    left: 0px;
    width: clamp(14px, 1.354vw, 26px);
    height: clamp(5px, .469vw, 9px);
    content: " ";
    position: absolute;
    border-top: 1px solid var(--tertiary-color);
    border-bottom: 1px solid var(--tertiary-color);
    transform: translate(-50%)
}

.curated-conversation container .equal:after {
    bottom: 100%;
    right: 0px;
    width: clamp(14px, 1.354vw, 26px);
    height: clamp(5px, .469vw, 9px);
    content: " ";
    position: absolute;
    border-top: 1px solid var(--tertiary-color);
    border-bottom: 1px solid var(--tertiary-color);
    transform: translate(50%)
}

.curated-collections container {
    max-width: clamp(970px, 94.688vw, 1816px)
}

.curated-collections container ul.collection-archive {
    max-width: clamp(875px, 85.417vw, 1640px);
    padding: 0;
    list-style-type: none;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: stretch;
    align-items: flex-start;
    margin: auto;
    margin-top: calc(-1*clamp(125px, 12.24vw, 235px));
    position: relative;
    z-index: 2
}

.curated-collections container ul.collection-archive li.box-1-2 {
    padding: 0;
    margin-bottom: clamp(83px, 8.073vw, 155px);
    max-width: clamp(377px, 36.771vw, 706px)
}

.curated-collections container ul.collection-archive li.box-1-2:nth-child(even) {
    margin-top: clamp(56px, 5.469vw, 105px)
}

.collection-holder {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-content: stretch;
    align-items: stretch
}

.collection-holder aside {
    width: 100%;
    max-width: clamp(198px, 19.375vw, 372px);
    height: auto
}

.collection-holder aside nav {
    max-width: clamp(144px, 14.063vw, 270px);
    margin: auto;
    margin-top: clamp(18px, 1.719vw, 33px) !important
}

.collection-holder aside .new-dropdown {
    position: relative;
    width: 100%;
    height: clamp(18px, 1.719vw, 33px);
    border-bottom: 1px solid var(--primary-color);
    background: url(down.svg) right no-repeat;
    background-size: clamp(10px, .938vw, 18px);
  margin-bottom: 14px;
}
.collection-holder aside .new-dropdown.open {
  z-index: 5;
}
.collection-holder aside .new-dropdown span {
    padding-left: 15px;
    padding-right: 15px;
    font-size: clamp(8px, .781vw, 15px)
}

.collection-holder aside .filter-tag ul li a {
    font-size: clamp(8px, .781vw, 15px);
  bottom: 0px;
}
.collection-holder aside .filter-tag ul li a:after {
bottom: 0px!important;
  
}
.collection-holder aside .filter-tag ul {
    padding: 0;
    list-style-type: none;
    position: absolute;
    max-height: 0px;
    overflow: hidden;
    left: 0px;
    top: calc(100% + 1px);
    background: #FFF;
    width: 100%
}

.collection-holder aside .new-dropdown.open ul {
    max-height: 500px;
    overflow-y: scroll
}

.collection-holder aside .filter-tag ul li {
    position: relative;
    padding-left: 15px;
    padding-right: 15px;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: center;
    align-content: stretch;
    align-items: stretch
}

.collection-holder container {
    margin: 0 auto;
    /* margin: 0 !important;
    max-width: calc(100% - clamp(198px, 19.375vw, 372px) - clamp(22px, 2.188vw, 42px)) */
}

.collection-holder container .collection-archive-list {
    padding: 0;
    list-style-type: none;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    border-left: 1px solid #000;
    margin-bottom: 3rem;
}
.collection-holder container .collection-archive-list.fourcol {
    grid-template-columns: repeat(4, 1fr);
}
@media screen and (max-width:768px) {
    .collection-holder container .collection-archive-list.fourcol {
        grid-template-columns: 1fr;
    }
}

.collection-holder container .collection-archive-list li {
    padding: 0;
    transition: all .25s;
    border-right: 1px solid #000;
    border-bottom: 1px solid #000;
}

.collection-holder container .collection-archive-list li {
    width: 100% !important;
}
.collection-holder container .collection-archive-list li .single-collection-item figure {
    margin: auto;
}

.collection-holder container .collection-archive-list.fourcol li .single-collection-item figure {
    width: clamp(184px, 17.969vw, 345px);
    height: clamp(184px, 17.969vw, 345px);
}

.collection-holder container .collection-archive-list.fourcol li .single-collection-item .product-details * {
    /* font-size: clamp(6px, .625vw, 12px) */
}

.collection-holder container .collection-archive-list li .single-collection-item figure {
    height: clamp(373px, 36.458vw, 700px);
    width: clamp(373px, 36.458vw, 700px);
    z-index: 1;
    transition: all .25s
}

.collection-holder container .collection-archive-list li .single-collection-item figure picture {
    transition: all .25s
}

.collection-holder container .collection-archive-list li .single-collection-item .product-details {
    transition: all .25s;
    /* height: clamp(38px, 3.75vw, 72px); */
    padding: clamp(13px, 1.25vw, 24px);
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: stretch;
    align-items: center
}

.collection-holder container .collection-archive-list li .single-collection-item .product-details * {
    transition: all .25s;
    color: var(--primary-color);
    text-decoration: none;
    font-size: clamp(10px, .938vw, 18px)
}

.collection-holder container .collection-archive-list li .single-collection-item:hover figure picture {
    transform: scale(1.1);
    transform-origin: center
}

.collection-holder .sorter {
    position: relative;
    z-index: 2;
    border-top: 1px solid #000;
    border-bottom: 1px solid #000;
}
.collection-holder .sorter container {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-content: stretch;
    margin: none;
}
.collection-holder .sorter container:after {
    content: none;
}
.collection-holder .sorter container nav {
    border-right: 1px solid #000;
    border-left: 1px solid #000;
    padding: 1rem;
    display: flex;
}
.collection-holder .sorter container .column-options {
    display: flex;
    justify-content: flex-end;
    padding: 1rem;
    border-left: 1px solid #000;
    border-right: 1px solid #000;
}
@media screen and (max-width: 768px) {
    .collection-holder .sorter container .column-options {
        display: none;
    }
    .collection-holder .sorter container nav {
        width: 100%;
    }
}
.collection-holder .sorter > * {
    display: inline-block
}

.collection-holder .sorter button {
    border: none;
    background: transparent;
    margin-left: 15px
}

.collection-holder .sorter button svg {
    height: clamp(13px, 1.302vw, 25px)
}

.sorter .js-dropdown {
    padding: 1rem;
}

.sorter .js-dropdown__label {
    border-bottom: 0px;
    padding: 1rem;
}
.sorter .js-dropdown__label:after {
    right: 0;
    top: 52%;
}

.sorter .js-dropdown__list {
    background: #FFF !important;
    font-size: clamp(6px, .625vw, 12px);
    color: var(--primary-color);
    margin-top: calc(-1*clamp(4px, .365vw, 6px));
    -ms-overflow-style: none;
    scrollbar-width: none;
    width: 21rem;
    left: calc(-1.5rem + 7px);
    top: calc(100% + 1.4rem);
    border-left: 1px solid #000;
    border-right: 1px solid #000;
    
}

.sorter .js-dropdown__list.visible {
    border-bottom: 1px solid #000;
    padding: 3rem 2rem;
}
.sorter .js-dropdown__list.visible .filter-label {
    position: relative;
    display: block;
}
.sorter .js-dropdown__list.visible .filter-label > span {
    font-size: .8rem;
    border: 1px solid var(--primary-color);
    height: 1rem;
    width: 1rem;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    padding: .6rem;
    border-radius: 100%;
}
.sorter .js-dropdown__list.visible .filter-label i {
    position: absolute;
    right: 0;
    top: 4px;
}
.sorter .js-dropdown__list.visible details[open] .filter-label i {
    transform: rotate(180deg);
}
.sorter .js-dropdown__list.visible input[type="submit"] {
    background: var(--primary-color);
    color: var(--secondary-color);
    text-transform: uppercase;
    padding: .2rem 1rem;
    border-radius: 1rem;
}

.sorter .js-dropdown__list.visible div[classname="filter-group-display__price-range"] {
    display: flex;
    padding: 1rem 0;
}
.sorter .js-dropdown__list.visible div[classname="filter-group-display__price-range"] input[type="number"] {
    padding: .4rem .8rem;
    border: 1px solid var(--primary-color);
    border-radius: .5rem;
}
.sorter .js-dropdown__list.visible div[classname="filter-group-display__price-range"] .separator {
    text-transform: uppercase;
    padding: 0 .5rem;
    font-size: .8rem;
    display: flex;
    align-items: center;
}
.sorter .js-dropdown__list::-webkit-scrollbar {
    display: none
}
.sorter .js-dropdown__list ul {
    padding: 0;
}
.sorter .js-dropdown__list li {
    padding: 0 0;
    border: none;
}
.sorter .js-dropdown__list li label span[classname="visual-display__child"] i {
    opacity: 0;
}
.sorter .js-dropdown__list li label:has(input[checked]) span[classname="visual-display__child"] i {
    opacity: 1;
}

.sorter .js-dropdown__list li:hover,
.sorter .js-dropdown__list li {
    color: var(--primary-color);
    font-size: clamp(6px, 1.625vw, 18px);
    line-height: 2.5;
    border: none;
    /* border-left: 1px solid #000; */
    /* border-right: 1px solid #000 */
}

.sorter .js-dropdown__list li:first-child {
    padding-top: 1rem;
}
.sorter .js-dropdown__list li:last-child {
    /* border-bottom: 1px solid #000 */
    padding-bottom: 1rem;
}

.sorter .js-dropdown__list li a {
    clamp(8px, .781vw, 15px)
}

.sorter .js-dropdown__label {
    font-size: clamp(8px, .781vw, 15px)
}

@media screen and (max-width: 768px) {
    .sorter .js-dropdown {
        padding: 0 1rem !important;
    }
    .sorter .js-dropdown__label {
        padding: 0 1rem !important;
    }
}

.js-dropdown {
    padding: 0;
    text-align: left;
    min-height: 0;
    border: 0;
    position: relative;
    overflow: visible;
    display: block
}

.js-dropdown__label {
    display: block;
    padding: 15px;
    cursor: pointer;
    position: relative;
    text-transform: capitalize;
    border-bottom: 1px solid #000
}

.js-dropdown__label:after {
    font-family: Icons;
    content: "\e02d";
    position: absolute;
    right: 15px;
    font-size: 75%;
    top: 50%;
    z-index: 10;
    transform: translateY(-50%)
}

.js-dropdown__list {
    padding: 0;
    position: absolute;
    z-index: 99;
    background: #000;
    top: 100%;
    left: 0;
    right: 0;
    max-height: 0;
    overflow: hidden;
    transition: max-height .5s ease-in
}

.js-dropdown__list.visible {
    max-height: 800px;
    overflow-y: scroll
}

.js-dropdown__list li {
    display: block;
    border-top: 1px solid #000;
    padding: 15px;
    cursor: pointer
}

.js-dropdown__list li:hover {
    color: #000;
    background: #FFF
}

.js-dropdown__list li.active a {
    box-shadow: none
}

#template-product .page-top container {
    max-width: var(--grid-width);
}

.single-product-body container {
    /* max-width: 100vw; */
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: stretch;
    align-items: stretch
}

.single-product-body container .product-photo ul.thumbnails {
    list-style-type: none;
    height: auto;
    width: clamp(120px, 11.719vw, 225px);
    padding-left: clamp(27px, 2.604vw, 50px);
    padding-top: clamp(12px, 1.146vw, 22px)
}

.single-product-body container .product-photo ul.thumbnails li {
    margin-bottom: clamp(7px, .677vw, 13px)
}

.single-product-body container .product-photo ul.thumbnails li figure {
    width: clamp(84px, 8.229vw, 158px);
    height: clamp(84px, 8.229vw, 158px);
    border: 1px solid var(--primary-color);
    z-index: 1;
    cursor: pointer
}

.single-product-body container .product-photos {
    height: auto;
    width: 70%;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-auto-rows: max-content;
    column-gap: 1rem;
    row-gap: 1rem;
    align-items: start;
    padding: 0 4rem 6rem 0 ;
}

.single-product-body container .product-photos img {
    object-fit: cover;
    margin: auto;
    z-index: 1;
    border: 1px solid #000;
}

.single-product-body container .product-details {
    max-width: calc(100% - clamp(512px, 50vw, 960px));
    width: 30%;
    padding-right:4%;
    height: 100%
}

.single-product-body container .product-details form {
    max-width: clamp(363px, 35.417vw, 680px)
}
.single-product-body container .product-details h1 {
    font-size: clamp(32px, 3.125vw, 45px);
    line-height: 1.1;
    border-bottom: 1px solid #000;
    padding-bottom: .5rem;
}
.single-product-body container .product-details h4 {
    font-family: var(--primary-font);
    margin-bottom: 0;
    line-height: 1.1;
    font-size: 1rem;
    text-transform:uppercase;
}

.single-product-body container .product-details .product__price {
    font-size: 1rem;
    padding: 1rem 0 2rem;
}

.single-product-body container .product-details .description {
    padding: 1rem 0;
    font-size: var(--standard-font-size);
}

.js-qty {
    position: relative;
    width: clamp(59px, 5.729vw, 110px);
    height: clamp(20px, 1.979vw, 38px);
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: stretch;
    align-items: center;
    border-top: 1px solid var(--primary-color);
    border-bottom: 1px solid var(--primary-color);
    margin: clamp(20px, 1.979vw, 38px) 0px
}

.js-qty input {
    border: none;
    background: none;
    width: clamp(27px, 2.604vw, 50px);
    height: clamp(20px, 1.979vw, 38px);
    text-align: center;
    font-size: clamp(8px, .781vw, 15px);
    font-family: var(--primary-font)
}

.js-qty span {
    width: clamp(13px, 1.302vw, 25px);
    height: clamp(19px, 1.875vw, 36px);
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-content: stretch;
    align-items: center;
    font-size: clamp(14px, 1.406vw, 27px);
    line-height: .5;
    cursor: pointer
}

.single-product-body container .product-details .cta {
    width: 100%
}

.single-product-body container .product-details .cta * {
    font-weight: 600
}

.single-product-body container .product-details select {
    border: none;
    background: none;
    min-width: clamp(27px, 2.604vw, 50px);
    height: clamp(20px, 1.979vw, 38px);
    font-size: clamp(8px, .781vw, 15px);
    font-family: var(--primary-font);
    padding-left: clamp(8px, .781vw, 15px);
    padding-right: clamp(16px, 1.563vw, 30px);
    background: url(down.svg) right no-repeat;
    background-size: clamp(8px, .781vw, 15px) !important
}

.single-product-body .product-details-info {
    max-width: clamp(363px, 35.417vw, 680px);
    padding-top: clamp(24px, 2.344vw, 45px)
}

.single-product-body .product-details-info details {
    border-bottom: 1px solid var(--primary-color)
}

.single-product-body .product-details-info details summary {
    font-size: clamp(8px, .781vw, 15px);
    font-weight: 700;
    position: relative
}

.single-product-body .product-details-info details summary:after {
    content: "";
    position: absolute;
    top: 50%;
    right: 0px;
    background: url(details.svg) center no-repeat;
    background-size: clamp(5px, .521vw, 10px);
    width: clamp(5px, .521vw, 10px);
    height: 100%;
    transform: translateY(-50%)
}

.single-product-body .product-details-info details[open] summary:after {
    transform: rotate(180deg) translateY(50%)
}

.single-product-body .product-details-info details div {
    padding-bottom: clamp(11px, 1.042vw, 20px)
}

.single-product-body .product-details-info details div p a {
    color: var(--primary-color);
    margin-bottom: 0
}

.single-product-body .sharing {
    max-width: clamp(363px, 35.417vw, 680px);
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: stretch;
    align-items: center;
    padding-bottom: clamp(71px, 6.927vw, 133px)
}

.single-product-body .sharing svg {
    width: clamp(13px, 1.25vw, 24px);
    height: clamp(13px, 1.25vw, 24px)
}

.single-product-body .sharing a {
    color: var(--primary-color);
    text-decoration: none
}

.single-product-body .sharing a span {
    top: -5px;
    position: relative
}

.visually-hidden {
    display: none
}

.related-products container {
    /* max-width: 100%; */
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: stretch;
    align-items: stretch
}

.related-products container > article {
    padding-top: clamp(27px, 2.604vw, 50px);
    padding-bottom: clamp(27px, 2.604vw, 50px);
    width: 100%;
    height: auto;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: stretch;
    align-items: stretch;
    /* margin-left: clamp(75px, 7.292vw, 140px) */
}

.related-products container > article h3 {
    width: 100%;
    border-bottom: 1px solid #000;
    padding-bottom: 1rem;
}

.related-products container > article .bottom {
    width: clamp(75px, 7.292vw, 140px);
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: stretch;
    align-items: flex-start
}

.related-products container > article .bottom div {
    cursor: pointer;
    width: 45%
}

.related-products container > article .bottom div svg {
    width: 100%
}

.related-products container > article .bottom div:hover svg rect {
    fill: #000
}

.related-products container > article .bottom div:hover svg path {
    stroke: #fff
}

.related-products container > article .bottom span.eyebrows {
    width: 100%;
    display: block;
    margin-bottom: 20px;
    font-family: var(--secondary-font)
}

.related-products .home-collection {
    padding: 0 0 6rem 0;
    list-style-type: none;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1rem;
    margin: 0;
}

.related-products .home-collection li a img {
    border: 1px solid #000;
}

.related-products .home-collection li a:after {
    content: none;
}

.related-products .home-collection li .bottom-collection-bar {
    text-transform: uppercase;
    text-align: center;
    padding: 1rem 0;
}

.related-products container .swiper {
    width: 100%;
    max-width: clamp(656px, 64.063vw, 1230px);
    padding-left: clamp(13px, 1.25vw, 24px)
}

.related-products container .swiper:before {
    width: clamp(13px, 1.25vw, 24px);
    height: calc(100% - 2px);
    left: 0px;
    top: 1px;
    content: "";
    position: absolute;
    background: #FFF;
    z-index;
    9999
}

.tan-bg.related-products container .swiper:before {
    background: var(--secondary-color)
}

.related-products container .swiper .swiper-slide {
    width: clamp(265px, 25.833vw, 496px);
    padding: clamp(21px, 2.083vw, 40px) clamp(5px, .469vw, 9px);
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: flex-end;
    align-content: stretch;
    align-items: stretch
}

.related-products container .swiper .related-product {
    width: clamp(256px, 25vw, 480px)
}

.related-products container .swiper .related-product a {
    color: var(--primary-color);
    text-decoration: none;
    padding-bottom: clamp(5px, .521vw, 10px);
    display: block
}

.related-products container .swiper .related-product a:after {
    display: none
}

.related-products container .swiper .related-product a .eyebrows {
    font-family: var(--secondary-font)
}

.related-products container .swiper .related-product figure {
    border: 1px solid var(--primary-color);
    width: 100%;
    height: clamp(176px, 17.188vw, 330px)
}

#shopify-section-page-thankyou + #shopify-section-related-products .related-products container .swiper:before,
.tan-bg.related-products container > * {
    background: var(--seconday-color)
}

.designers-top container {
    padding-top: clamp(32px, 3.125vw, 60px);
    padding-bottom: clamp(32px, 3.125vw, 60px);
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: stretch;
    align-items: center
}

.designers-top container > article {
    width: 100%;
    max-width: clamp(347px, 33.854vw, 650px)
}

.designers-top container > article * {
    margin-bottom: 0
}



.page-top ul.breadcrumbs {
    display: flex;
    list-style-type: none;
    flex-wrap: wrap;
    padding: 0;
    text-transform: uppercase !important;
}

@media screen and (max-width: 768px) {
    .page-top ul.breadcrumbs {
        font-size: .8rem;
        justify-content: center;
        margin-bottom: .5rem;
    }
}
.page-top ul.breadcrumbs li:not(:last-child):after {
    content: "/";
    margin: 0 .5rem;
}
.page-top ul.breadcrumbs li a {
    text-transform: uppercase !important;
}

.page-top .default {
    width: 100%;
}

.page-top .default .text {
    text-align: center;
    margin: 0 auto;
    width: 46%;
}
@media screen and (max-width: 768px) {
    .page-top .default .text {
        width: 90%;
    }
}
.page-top .default .text h1 {
    margin-bottom: 2rem;
}

.page-top .text-and-image {
    display: flex;
    flex-direction: row;
    align-items: center;
    width: 100%;
}
.page-top .text-and-image .text {
    display: flex;
    flex-direction: column;
    width: 45%;
    padding: 3rem 3rem 0;
}
.page-top .text-and-image .text h1 {
    font-weight: 300;
    font-family: var(--secondary-font);
    font-size: 3.5rem;
}
.page-top .text-and-image .image {
    width: 55%;
    height: 40vh;
    position: relative;
}
.page-top .text-and-image .image img {
    object-fit: cover;
    object-position: center right;
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
}
.page-top .text-and-image .image.designer img {
    object-fit: contain;
}
.page-top.hero p {
    margin-bottom: 1.5rem;
}

@media screen and (max-width: 768px) {
    .page-top .text-and-image {
        flex-direction: column-reverse;
    }
    .page-top .text-and-image .text {
        width: 100%;
        padding-bottom: 3rem;
    }
    .page-top .text-and-image .text h1 {
        line-height: 1.1;
        margin-bottom: 1rem;
    }
    .page-top .text-and-image .image {
        width: 100%;
    }
}

.page-top .text-and-image.collection .image {
    padding: 3rem 0 3rem 0;
    display: flex;
    align-items: center;
}
.page-top .text-and-image.collection .image img {
    position: relative;
    top: auto;
    left: auto;
}

.designers-list {
    overflow: hidden;
    padding: 6rem 0;
}

.designers-list container {
    display: grid;
    grid-template-columns: 1fr 1fr;
}

.designers-list .list {
   
}
.designers-list .images {
    
    position: relative;
}


.designers-list p {
    padding: 1rem;
    font-size: 1.5rem;
    border-bottom: 1px solid var(--primary-color);
    height: auto;
    transition: all .25s; 
    position: relative;
    overflow: hidden;
    padding-right: 3rem;
}
.designers-list p .chevron {
    height: 1rem;
    width: 1rem;
    position: absolute;
    top: 1.5rem;
    right: 100%;
    opacity: 0;
    transition: all .4s;
}
.designers-list p .chevron svg {
    width: 1em;
    height: 1em;
    vertical-align: 4.25em;
}

.designers-list p:hover { background-color: var(--secondary-color); }
.designers-list p:hover .chevron {
    right: 1.5rem;
    opacity: 1;
}
.designers-list p a:hover:after {
    content: none;
}

.designers-list .images img {
    width: 50%;
    position: absolute;
}
.designers-list .images img:nth-child(1) {
    left: 4rem;
    top: 0;
}
.designers-list .images img:nth-child(2) {
    left: 45%;
    top: 20rem;
}
.designers-list .images img:nth-child(3) {
    left: 4rem;
    top: 20%;
}
.designers-list .images img:nth-child(4) {
    width: 35%;
    left: 55%;
    top: calc(20% + 20rem);
}

@media screen and (max-width: 768px) {
    .designers-list {
        padding: 2rem 0;
    }
    .designers-list p {
        font-size: 1rem;
        padding-right: 1rem;
    }
    .designers-list .images .img:nth-child(1) {
        left: 4rem;
        top: 0;
    }
    .designers-list .images img:nth-child(2) {
        left: 45%;
        top: 5rem;
    }
    .designers-list .images img:nth-child(3) {
        left: 4rem;
        top: 6%;
    }
    .designers-list .images img:nth-child(4) {
        width: 35%;
        left: 55%;
        top: calc(4% + 8rem);
    }
}

.blog-archive h3 {
    padding-top: clamp(19px, 1.823vw, 35px);
    padding-bottom: 0
}

.blog-archive .filter {
    height: clamp(21px, 2.083vw, 40px);
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-content: stretch;
    align-items: center
}

.blog-archive .filter a {
    color: var(--primary-color)
}

.blog-archive .grid {
    list-style-type: none;
    padding: 6rem 0;
    display: grid;
    grid-gap: 2rem;
    grid-template-columns: 1fr 1fr 1fr;
}

.blog-archive .grid li {
    position: relative;
}

.blog-archive .grid li .single-post {
    padding: clamp(16px, 1.563vw, 30px);
}

.blog-archive .grid li .single-post a.img-wrap {
    position: absolute;
    left: 0;
    bottom: 0;
    height: 0;
    width: 100%;
    transition: all .5s;
    z-index: -1;
    overflow: hidden;
}

.blog-archive .grid li .single-post img {
    position: absolute;
    left: 0;
    top: 0;
}
.blog-archive .grid li .single-post:hover a.img-wrap {
    height: 100%;
    width: 100%;
    z-index: 10;
    transition: all .5s;
}
.blog-archive .grid li .single-post a:after {
    content: none;
    display: none;
}
.blog-archive .grid li .single-post:hover a.more {
    z-index: 100;
    padding: 1rem 2rem;
    background: var(--secondary-color);
}

container.pagination {
    font-size: 1.1rem;
    padding: 3rem 0;
    text-align: center;
    color: var(--light-color);
}


.meta {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: stretch;
    align-items: center;
    padding-bottom: 20px
}

.blog-archive .grid li .single-post h3 {
    font-size: clamp(19px, 1.823vw, 35px)
}

.blog-archive .grid li .single-post h3 a {
    color: var(--primary-color);
    text-decoration: none;
    )
}

.blog-archive .grid li:nth-child(2) figure {
    height: clamp(332px, 32.396vw, 622px)
}


.morebutton div {
    width: clamp(155px, 15.104vw, 290px);
    height: clamp(51px, 4.948vw, 95px);
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-content: stretch;
    align-items: center;
    padding-left: 50px
}

.single-blog-post > container {
    padding: clamp(25px, 2.396vw, 46px);
    max-width: clamp(777px, 75.833vw, 900px);
    margin: 4rem auto;
}

.single-blog-post > container figure {
    /* width: 100%;
    height: clamp(286px, 27.969vw, 537px);
    border: 1px solid var(--primary-color);
    z-index: 2 */
}
.single-blog-post container .meta {
    color: var(--light-color);
    text-transform: uppercase;
    justify-content: flex-start;
    grid-gap: .5rem;
}

.single-blog-post container h1 {
    margin: 1rem 0 1.5rem;
}
.single-blog-post container h3 {
    font-size: 1.4rem;
    margin: 0 0 1rem;
}
.single-blog-post container p {
    font-size: 1rem;
    margin: 0 0 2.5rem;
}
.single-blog-post container ul {
    margin-left: 4rem;
    margin-bottom: 2.5rem;
}

.single-blog-post .tags a {
    display: inline-flex;
    justify-content: center;
    padding: .4rem .8rem;
    text-transform: uppercase;
    font-size: .8rem;
    color: var(--light-color);
    border: 1px solid var(--light-color);
    background: var(--trans-color);
    border-radius: 1.5rem;
    margin-right: .8rem;
    min-width: 8rem;
}

.single-blog-post .featured-image {
    margin: 2.5rem 0;
}

.single-blog-post > container article {
    /* max-width: clamp(433px, 42.292vw, 900px);
    margin: auto */
}

.single-blog-post > container .meta {
    margin: 20px 0
}

.single-blog-post > container hr {
    border: none;
    margin: 30px 0;
    border-top: 1px solid var(--primary-color)
}

.single-blog-post > container article blockquote {
    font-family: var(--secondary-font);
    font-style: italic;
    font-size: clamp(20px, 1.927vw, 37px);
    line-height: 1
}

.single-blog-post > container article blockquote cite {
    float: right;
    font-size: clamp(8px, .781vw, 15px);
    font-weight: 700
}

.single-blog-post > container article blockquote:after {
    content: "";
    clear: both;
    display: block
}

.single-blog-post .prev-next {
    position: relative;
    padding-left: clamp(48px, 4.688vw, 90px);
    padding-right: clamp(48px, 4.688vw, 90px)
}

.single-blog-post .prev-next .blog-prev {
    position: absolute;
    left: 0px;
    top: 50%;
    transform: translateY(-50%)
}

.single-blog-post .prev-next .blog-next {
    position: absolute;
    right: 0px;
    top: 50%;
    transform: translateY(-50%)
}

.single-blog-post .swiper-slide {
    width: clamp(171px, 16.667vw, 320px)
}

.single-blog-post .swiper-slide a {
    text-decoration: none
}

.single-blog-post .swiper-slide h4 {
    color: var(--primary-color);
    text-decoration: none;
    font-size: clamp(19px, 1.823vw, 35px);
    line-height:
}

.event-single {
    padding-top: clamp(35px, 3.385vw, 65px);
    padding-bottom: clamp(35px, 3.385vw, 65px)
}

.event-single container {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: stretch;
    align-items: flex-start
}

.event-single figure {
    width: 100%;
    max-width: clamp(432px, 42.188vw, 810px);
    height: clamp(299px, 29.167vw, 560px);
    border: 1px solid var(--primary-color);
    z-index: 2
}

.event-single article {
    width: 100%;
    max-width: clamp(285px, 27.865vw, 535px);
    margin-top: clamp(33px, 3.229vw, 62px)
}

.event-single article h1 {
    margin-bottom: 20px;
   margin-top: 10px;
}

.event-single article .details {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: stretch;
    align-items: flex-start;
    padding-top: clamp(11px, 1.042vw, 20px);
    padding-bottom: clamp(11px, 1.042vw, 20px);
    margin-bottom: 30px
}

.event-single article .details dl {
    width: 50%
}

.event-single article .details dd {
    font-weight: 700;
    font-size: clamp(12px, 1.146vw, 22px);
  text-transform: uppercase;
}

.event-single article .eyebrows {
    color: var(--primary-color);
    opacity: 1;
    margin-bottom: 10px
}

.believe container {
    max-width: 100%;
    padding: 0px 0px clamp(43px, 4.167vw, 80px);
    position: relative;
    overflow: hidden
}

.believe container article h1 {
    font-size: clamp(162px, 15.833vw, 304px);
    text-transform: uppercase;
    line-height: .85
}

.believe container article h1 span {
    display: block;
    position: relative
}

.believe container article h1 span:nth-child(2) {
    text-align: right;
    z-index: 1
}

.believe container article h1 span:nth-child(3) {
    text-align: right;
    z-index: 5
}

.believe container article h1 span:nth-child(4) {
    text-align: left;
    padding-left: clamp(37px, 3.646vw, 70px);
    z-index: 1 !important;
    padding-top: clamp(152px, 14.844vw, 285px)
}

.believe container article h1 span:nth-child(5) {
    text-align: left;
    z-index: 7;
    padding-left: clamp(224px, 21.875vw, 420px)
}

.believe container article h1 span:nth-child(6) {
    text-align: right;
    z-index: 1;
    padding-right: clamp(283px, 27.604vw, 530px)
}

.believe container article h1 span:nth-child(7) {
    text-align: center;
    z-index: 7
}

.believe figure.top {
    position: absolute;
    z-index: 2;
    top: clamp(200px, 19.531vw, 375px);
    left: clamp(189px, 18.49vw, 355px);
    width: clamp(280px, 27.344vw, 525px);
    height: clamp(352px, 34.375vw, 660px)
}

.believe figure.bottom {
    position: absolute;
    z-index: 6;
    bottom: clamp(152px, 14.844vw, 285px);
    right: clamp(53px, 5.208vw, 100px);
    width: clamp(280px, 27.344vw, 525px);
    height: clamp(352px, 34.375vw, 660px)
}

.about-text .half container {
    max-width: clamp(436px, 42.604vw, 818px);
    padding: 0
}

.about-text .half container article {
    padding: clamp(45px, 4.427vw, 85px) clamp(72px, 7.031vw, 135px)
}

.about-text-bottom container {
    max-width: clamp(873px, 85.208vw, 1636px);
    text-align: center;
    padding: clamp(21px, 2.083vw, 40px)
}

.about-mosaic container {
    max-width: 100%;
    position: relative;
    height: clamp(1455px, 142.083vw, 2728px)
}

.about-mosaic container ul.mosaic-holder {
    padding: 0;
    list-style-type: none
}

.about-mosaic container ul.mosaic-holder li {
    position: absolute;
    z-index: 1
}

.about-mosaic container ul.mosaic-holder li figure {
    z-index: 1
}

.about-mosaic container ul.mosaic-holder li figcaption {
    margin-top: 10px
}

.about-mosaic container ul.mosaic-holder li:nth-child(1) {
    left: 0px;
    top: clamp(67px, 6.51vw, 125px)
}

.about-mosaic container ul.mosaic-holder li:nth-child(2) {
    right: 0px;
    top: 0px;
    z-index: 2
}

.about-mosaic container ul.mosaic-holder li:nth-child(3) {
    right: clamp(195px, 19.063vw, 366px);
    top: clamp(381px, 37.24vw, 715px)
}

.about-mosaic container ul.mosaic-holder li:nth-child(4) {
    right: clamp(80px, 7.813vw, 150px);
    top: clamp(667px,65.104vw,1250px);
}

.about-mosaic container ul.mosaic-holder li:nth-child(5) {
    left: clamp(21px, 2.083vw, 40px);
    top: clamp(752px, 73.438vw, 1410px)
}

.about-mosaic container ul.mosaic-holder li:nth-child(6) {
    left: clamp(365px, 35.677vw, 685px);
    top: clamp(944px, 92.188vw, 1770px)
}

.about-mosaic container ul.mosaic-holder li:nth-child(7) {
    right: 0px;
    top: clamp(1200px, 117.188vw, 2250px)
}

.about-mosaic container ul.mosaic-holder li:nth-child(1) figure {
    width: clamp(435px, 42.448vw, 815px);
    height: clamp(445px, 43.49vw, 835px)
}

.about-mosaic container ul.mosaic-holder li:nth-child(2) figure {
    width: clamp(361px, 35.208vw, 676px);
    height: clamp(366px, 35.729vw, 686px)
}

.about-mosaic container ul.mosaic-holder li:nth-child(3) figure {
    width: clamp(312px, 30.469vw, 585px);
    height: clamp(195px, 19.01vw, 365px)
}

.about-mosaic container ul.mosaic-holder li:nth-child(4) figure {
    width: clamp(581px, 56.771vw, 1090px);
    height: clamp(325px, 31.771vw, 610px)
}

.about-mosaic container ul.mosaic-holder li:nth-child(5) figure {
    width: clamp(288px, 28.125vw, 540px);
    height: clamp(360px, 35.156vw, 675px)
}

.about-mosaic container ul.mosaic-holder li:nth-child(6) figure {
    width: clamp(312px, 30.469vw, 585px);
    height: clamp(195px, 19.01vw, 365px)
}

.about-mosaic container ul.mosaic-holder li:nth-child(7) figure {
    width: clamp(435px, 42.448vw, 815px);
    height: clamp(195px, 19.01vw, 365px)
}

.about-mosaic container figure.circle-logo {
    position: absolute;
    top: clamp(128px, 12.5vw, 240px);
    right: clamp(299px, 29.167vw, 560px);
    width: clamp(283px, 27.604vw, 530px);
    height: clamp(283px, 27.604vw, 530px);
    z-index: 2
}

.about-mosaic container figure.lion-logo {
    position: absolute;
    bottom: clamp(165px, 16.146vw, 310px);
    left: clamp(136px, 13.281vw, 255px);
    z-index: 1;
    width: clamp(329px, 32.083vw, 616px);
    height: clamp(224px, 21.875vw, 420px)
}

.about-bottom {
    z-index: 2;
    position: relative
}

.about-bottom .half:first-child {
    padding-top: clamp(32px, 3.125vw, 60px)
}

.about-bottom .half:first-child article p {
    font-size: clamp(12px, 1.146vw, 22px);
    font-weight: 700
}

.about-bottom .half:last-child {
    padding-top: clamp(83px, 8.073vw, 155px);
    padding-bottom: clamp(75px, 7.292vw, 140px)
}

.about-bottom .half:last-child article {
    max-width: clamp(269px, 26.302vw, 505px);
    margin: auto
}

.about-bottom .about-pix {
    position: relative;
    width: 100%;
    z-index: 4
}

.about-bottom .about-pix:after {
    content: "";
    clear: both;
    display: block
}

.about-bottom .about-pix figure {
    width: clamp(360px, 35.156vw, 675px);
    height: clamp(200px, 19.531vw, 375px);
    z-index: 2;
    border: 1px solid var(--primary-color);
    float: right;
    top: clamp(32px, 3.125vw, 60px)
}

.about-bottom .about-pix svg {
    margin-top: clamp(32px, 3.125vw, 60px);
    z-index: 5;
    position: absolute;
    top: 50%;
    left: 0px;
    transform: TranslateY(-50%);
    width: clamp(104px, 10.156vw, 195px);
    height: clamp(104px, 10.156vw, 195px)
}

#shopify-section-page-about + #shopify-section-related-products .related-products,
.about-bottom + .related-products {
    position: relative;
    z-index: 0
}

.locations-top-section container {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-content: stretch;
    align-items: flex-start;
    padding-bottom: clamp(37px, 3.646vw, 70px)
}

.locations-locales container {
    padding-bottom: clamp(27px, 2.604vw, 50px)
}

.locations-locales container .single-location {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-content: stretch;
    align-items: flex-start;
    margin-bottom: clamp(27px, 2.604vw, 50px)
}

.locations-locales container .single-location figure {
    width: 100%;
    max-width: clamp(433px, 42.24vw, 811px);
    height: clamp(299px, 29.167vw, 560px);
    z-index: 1;
    border: 1px solid var(--primary-color)
}

.locations-locales container .single-location .single-location-details {
    margin-top: clamp(59px, 5.729vw, 110px);
    max-width: clamp(325px, 31.771vw, 610px);
    widtH: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-content: stretch;
    align-items: stretch
}

.locations-locales container .single-location .single-location-details .location-icon {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-content: stretch;
    align-items: center;
    width: clamp(56px, 5.469vw, 105px)
}

.locations-locales container .single-location .single-location-details .eyebrows {
    opacity: 1
}

.location-address {
    padding-top: clamp(11px, 1.042vw, 20px);
    padding-left: clamp(27px, 2.604vw, 50px);
    width: 100%;
    max-width: clamp(165px, 16.146vw, 310px);
    padding-bottom: 20px
}

.locations-locales container .single-location .single-location-details h5 {
    font-size: clamp(12px, 1.146vw, 22px);
    font-weight: 700
}

.locations-locales container .single-location .single-location-details h5,
.locations-locales container .single-location .single-location-details p {
    margin-bottom: var(--standard-font-size);
    font-size: var(--standard-font-size)
}

.location-hours {
    padding-top: clamp(11px, 1.042vw, 20px);
    padding-left: clamp(11px, 1.042vw, 20px)
}

.faq-section container {
    max-width: clamp(972px, 94.896vw, 1822px);
    width: 100%
}

.faq-section container .qanda {
    padding: clamp(32px, 3.125vw, 60px) clamp(43px, 4.167vw, 80px);
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: stretch;
    align-items: flex-start
}

.faq-section container .qanda h3 {
    width: 100%;
    max-width: clamp(347px, 33.854vw, 650px);
    font-size: clamp(20px, 1.927vw, 37px)
}

.faq-section container .qanda .answer {
    width: 100%;
    max-width: clamp(373px, 36.458vw, 700px);
    padding-top: clamp(8px, .781vw, 15px)
}

.faq-section {
    background-repeat: no-repeat;
    background-size: clamp(296px, 28.906vw, 555px);
    background-position: bottom right
}

.shipping-info .box-1-1 {
    text-align: center;
    padding: 20px
}

.shipping-info .box-1-1 svg {
    margin: auto
}

.shipping-info .shipping-section {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-content: stretch;
    align-items: flex-start;
    padding-top: clamp(16px, 1.563vw, 30px);
    padding-bottom: clamp(16px, 1.563vw, 30px)
}

.shipping-info .shipping-section article:nth-child(1) {
    width: 100%;
    max-width: clamp(336px, 32.813vw, 630px);
    text-align: right;
    padding-right: clamp(21px, 2.083vw, 40px)
}

.shipping-info .shipping-section article:nth-child(2) {
    width: 100%;
    max-width: clamp(405px, 39.583vw, 760px);
    padding-top: 10px
}

.shipping-bottom {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-content: stretch;
    align-items: stretch;
    height: clamp(64px, 6.25vw, 120px)
}

.shipping-bottom div {
    height: auto;
    display: inline-flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-content: stretch;
    align-items: center;
    padding: 30px;
    text-align: right
}

.contact-page container > article:first-child {
    text-align: center;
    position: relative;
    z-index: 3;
    padding-top: clamp(41px, 4.01vw, 77px);
    padding-bottom: clamp(41px, 4.01vw, 77px)
}

.contact-page container > article:first-child:after {
    content: "";
    top: 0px;
    left: -50vw;
    height: 100%;
    width: 200vw;
    display: block;
    position: absolute;
    z-index: -1;
    background: linear-gradient(to bottom, rgba(248, 243, 225, 1) 47%, rgba(248, 243, 225, 0) 100%)
}

.contact-page container > article h1 {
    font-size: clamp(85px, 8.333vw, 160px);
    line-height: 1;
    text-shadow: 0px 0px 13px rgba(248, 243, 225, .91)
}

.contact-page .gallery-elements {
    position: relative;
    top: calc(-1*clamp(179px, 17.448vw, 335px));
    height: clamp(688px, 67.188vw, 1290px);
    margin-bottom: calc(-1*clamp(261px, 25.521vw, 490px))
}

.contact-page .gallery-elements svg {
    position: absolute;
    bottom: clamp(224px, 21.875vw, 420px);
    left: clamp(16px, 1.563vw, 30px)
}

.contact-page container {
    max-width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-content: stretch;
    align-items: flex-start
}

.contact-page .gallery {
    width: clamp(683px, 66.667vw, 1280px);
    height: clamp(509px, 49.74vw, 955px)
}

.contact-page .gallery-container {
    width: clamp(683px, 66.667vw, 1280px);
    height: clamp(509px, 49.74vw, 955px);
    transform: rotate(90deg);
    transform-origin: center;
    left: clamp(-200px, -10.417vw, -107px);
    position: relative;
    margin-left:
}

.contact-page .gallery li {
    display: flex;
    height: clamp(509px, 49.74vw, 955px);
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-content: stretch;
    align-items: flex-start
}

.contact-page .gallery figure {
    transform: rotate(-90deg)
}

.contact-page .gallery figure.img1 {
    width: clamp(203px, 19.792vw, 380px);
    height: clamp(268px, 26.198vw, 503px);
    z-index: 1;
    top: clamp(213px, 20.833vw, 400px)
}

.contact-page .gallery figure.img2 {
    width: clamp(205px, 20.052vw, 385px);
    height: clamp(121px, 11.823vw, 227px);
    z-index: 1;
    top: clamp(27px, 2.604vw, 50px);
    right: clamp(27px, 2.604vw, 50px);
    z-index: 3
}

.contact-page .gallery figure.img3 {
    width: clamp(316px, 30.885vw, 593px);
    height: clamp(256px, 25vw, 480px);
    z-index: 1;
    top: clamp(213px, 20.833vw, 400px)
}

.contact-page article.box-1-2 {
    max-width: clamp(360px, 35.156vw, 675px)
}

.contact-page article.box-1-2 .eyebrows {
    opacity: 1;
    font-weight: 600
}

.contact-page article.box-1-2 a {
    color: var(--primary-color)
}

.contact-page .contact-info {
    font-size: var(--standard-font-size);
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: stretch;
    align-items: flex-start;
    padding-bottom: clamp(11px, 1.042vw, 20px)
}

.contact-page .locations-info-contact {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: stretch;
    align-items: flex-start;
    padding-bottom: clamp(11px, 1.042vw, 20px)
}

.contact-page .locations-info-contact .eyebrows {
    width: 100%
}

.contact-page .locations-info-contact h6 {
    font-family: var(--primary-font);
    font-size: clamp(8px, .781vw, 15px);
    font-weight: 700;
    margin-bottom: 0
}

.contact-page form label {
    display: none
}

.contact-page .form-container {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: stretch;
    align-items: flex-start
}

.contact-page .form-holder {
    max-width: clamp(238px, 23.229vw, 446px);
    width: 100%
}

.contact-page .form-holder + svg {
    max-width: clamp(91px, 8.854vw, 170px)
}

.thank-you container {
    max-width: clamp(730px, 71.25vw, 1368px);
    padding: clamp(40px, 3.906vw, 75px) 0px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: stretch;
    align-items: center
}

.thank-you container article {
    text-align: center;
    padding:
}

.thank-you container article h1 {
    font-size: clamp(85px, 8.333vw, 160px)
}

.thank-you container:after {
    content: none;
    display: none
}

#shopify-section-page-thankyou + #shopify-section-related-products .related-products {
    background: var(--secondary-color)
}

.shopify-policy__container {
    background: var(--secondary-color);
    max-width: 100% !important;
    padding: 80px
}

.shopify-policy__container > * {
    max-width: var(--grid-width);
    margin: auto;
    )
}

#alertbar ~ #SiteContainer main {
    padding-top: calc(var(--header-height) + var(--alertbar-height))
}

main {
    min-height: calc(100vh - var(--footer-height));
    padding-top: calc(var(--header-height))
}

main *:not(".cta") a {
    color: var(--primary-color);
    text-decoration: underline
}

main .content .boxcontainer div div {
    background: var(--secondary-color);
    color: #fff;
    padding: 10px;
    min-height: 40px;
    font-size: 10px
}

.more {
    color: var(--primary-color);
    text-decoration: none;
    font-weight: 700
}

form button {
    cursor: pointer
}

.form-holder input::-webkit-input-placeholder {
    color: var(--primary-color)
}

.form-holder input:-moz-placeholder {
    color: var(--primary-color)
}

.form-holder input::-moz-placeholder {
    color: var(--primary-color)
}

.form-holder input:-ms-input-placeholder {
    color: var(--primary-color)
}

.form-holder label {
    display: none
}

.form-holder textarea::-webkit-input-placeholder {
    color: var(--primary-color)
}

.form-holder textarea:-moz-placeholder {
    color: var(--primary-color)
}

.form-holder textarea::-moz-placeholder {
    color: var(--primary-color)
}

.form-holder textarea:-ms-input-placeholder a {
    color: var(--primary-color)
}

.form-holder .field-container {
    border-bottom: 1px solid #000;
}

.form-holder .field-container:after {
    display: block;
    content: none;
    width: 100%;
    height: clamp(3px, .313vw, 6px);
    border: 1px solid var(--primary-color);
    background: transparent;
    margin-bottom: clamp(12px, 1.146vw, 22px)
}
.form-holder input[ype=text],
.form-holder input[type=text],
.form-holder input[type=email],
.form-holder input[type=tel],
.form-holder input[type=phone],
.form-holder input[type=password],
.form-holder select,
.form-holder textarea {
    height: clamp(24px, 2.344vw, 45px);
    background: none;
    border: none;
    font-family: var(--secondary-font);
    font-size: clamp(7px, .677vw, 13px);
    letter-spacing: .24em;
    text-transform: uppercase;
    width: 100%;
    position: relative
}

.form-holder textarea {
    height: clamp(60px, 5.885vw, 113px);
    padding-top: 10px
}

.form-holder select {
    background: url(down.svg) right no-repeat;
    background-size: clamp(12px, 1.146vw, 22px)
}

.lines {
    position: relative
}

.lines > .line {
    pointer-events: none;
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    transition: all .75s;
    transition-delay: .25s;
    overflow: hidden;
    z-index: 3
}

.lines > .line.lt {
    border-left: 1px solid var(--primary-color)
}

.lines > .line.rt {
    border-right: 1px solid var(--primary-color)
}

.lines > .line.top {
    border-top: 1px solid var(--primary-color)
}

.lines > .line.btm {
    border-bottom: 1px solid var(--primary-color)
}

.lines.visible > .line {
    clip-path: polygon(-5% -5%, 105% -5%, 105% 105%, -5% 105%)
}

.lines:not(.visible) > .line.lt {
    clip-path: polygon(0 0, 100% 0, 100% 0, 0 0)
}

.lines:not(.visible) > .line.rt {
    clip-path: polygon(0 0, 100% 0, 100% 0, 0 0)
}

.lines:not(.visible) > .line.top {
    clip-path: polygon(50% 0, 50% 0, 50% 100%, 50% 100%)
}

.lines:not(.visible) > .line.btm {
    clip-path: polygon(50% 0, 50% 0, 50% 100%, 50% 100%)
}

.lines:not(.visible) > .line.top.lt {
    clip-path: polygon(0 0, 0 0, 0 0, 0 0)
}

.lines:not(.visible) > .line.top.rt {
    clip-path: polygon(100% 0, 100% 0, 100% 0, 100% 0)
}

.lines:not(.visible) > .line.btm.lt {
    clip-path: polygon(0 100%, 0 100%, 0 100%, 0% 100%)
}

.lines:not(.visible) > .line.btm.rt {
    clip-path: polygon(100% 100%, 100% 100%, 100% 100%, 100% 100%)
}

.lines:not(.visible) > .line.top.btm.lt {
    clip-path: polygon(0 0, 100% 0, 100% 0, 0 0)
}

.lines:not(.visible) > .line.top.btm.rt {
    clip-path: polygon(100% 0, 100% 0, 100% 0, 100% 0)
}

.lines > .line.overflow {
    clip-path: initial !important;
    overflow: visible
}

.lines > .line.overflow {
    border: 0px
}

.lines > .line.overflow:before {
    width: 200vw;
    height: 100%;
    content: "";
    display: block;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%) translateY(-50%);
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
    transition: all 1.75s;
    transition-delay: .25s;
    overflow: hidden
}

.lines > .line.overflow:after {
    width: 100%;
    height: 200vh;
    content: "";
    display: block;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%) translateY(-50%);
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
    transition: all 1.75s;
    transition-delay: .25s;
    overflow: hidden
}

.lines > .line.overflow.top:before {
    border-top: 1px solid var(--primary-color)
}

.lines > .line.overflow.btm:before {
    border-bottom: 1px solid var(--primary-color)
}

.lines > .line.overflow.lt:after {
    border-left: 1px solid var(--primary-color)
}

.lines > .line.overflow.rt:after {
    border-right: 1px solid var(--primary-color)
}

.lines:not(.visible) > .line.overflow.lt:after {
    clip-path: polygon(0 0, 100% 0, 100% 0, 0 0)
}

.lines:not(.visible) > .line.overflow.rt:after {
    clip-path: polygon(0 0, 100% 0, 100% 0, 0 0)
}

.lines:not(.visible) > .line.overflow.top:before {
    clip-path: polygon(50% 0, 50% 0, 50% 100%, 50% 100%)
}

.lines:not(.visible) > .line.overflow.btm:before {
    clip-path: polygon(50% 0, 50% 0, 50% 100%, 50% 100%)
}


.lines:not(.visible) > .line.overflow.top.lt:before,
.lines:not(.visible) > .line.overflow.top.lt:after {
    clip-path: polygon(0 0, 0 0, 0 0, 0 0)
}

.lines:not(.visible) > .line.overflow.top.rt:before,
.lines:not(.visible) > .line.overflow.top.rt:after {
    clip-path: polygon(100% 0, 100% 0, 100% 0, 100% 0)
}

.lines:not(.visible) > .line.overflow.btm.lt:before,
.lines:not(.visible) > .line.overflow.btm.lt:after {
    clip-path: polygon(0 100%, 0 100%, 0 100%, 0% 100%)
}

.lines:not(.visible) > .line.overflow.btm.rt:before,
.lines:not(.visible) > .line.overflow.btm.rt:after {
    clip-path: polygon(100% 100%, 100% 100%, 100% 100%, 100% 100%)
}

.lines:not(.visible) > .line.overflow.top.btm.lt:before,
.lines:not(.visible) > .line.overflow.top.btm.lt:after {
    clip-path: polygon(50% 50%, 50% 50%, 50% 50%, 50% 50%)
}

.lines:not(.visible) > .line.overflow.top.btm.rt:before,
.lines:not(.visible) > .line.overflow.top.btm.rt:after {
    clip-path: polygon(50% 50%, 50% 50%, 50% 50%, 50% 50%)
}


.home-spotlight .lines > .line.overflow:after {
    height: 0px;
    transition-delay: .5s;
    clip-path: polygon(0 0, 100% 0, 100% 0, 0 0) !important
}

.home-spotlight .lines > .line.overflow:before {
    width: 0px;
    transition-delay: .5s;
    clip-path: polygon(50% 0, 50% 0, 50% 100%, 50% 100%) !important
}

.home-spotlight .lines.visible > .line.overflow:after {
    height: 200vh;
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%) !important
}

.home-spotlight .lines.visible > .line.overflow:before {
    width: 200vw;
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%) !important
}

hr.observe.line {
    border: none;
    position: relative;
    overflow: visible;
    margin-bottom: 20px
}

hr.observe.line:before {
    position: absolute;
    left: 50%;
    transform: translate(-50%);
    top: 0px;
    width: 0px;
    height: 1px;
    background: var(--primary-color);
    transition: all .25s;
    content: ""
}

hr.observe.line.visible.overflow:before {
    width: 200vw
}

hr.observe.line.visible:before {
    width: 100%
}

.dk-bg .lines > .line.overflow:before,
.dk-bg.lines > .line.overflow:before,
.dk-bg .lines > .line.overflow:before,
.dk-bg.lines > .line.overflow:before,
.dk-bg .lines > .line,
.dk-bg.lines > .line {
    border-color: var(--secondary-color)
}

.dk-bg.bg {
    background: transparent
}

.bottom-bar,
.bottom-bar container {
    height: clamp(523px, 51.042vw, 980px)
}

.bottom-bar container {
    max-width: clamp(868px, 84.792vw, 1628px)
}

.bottom-bar container article {
    width: 100%;
    position: relative;
    z-index: 2;
    padding-top: clamp(120px, 11.719vw, 225px)
}

.bottom-bar hr {
    border: none;
    width: 100%;
    height: 1px;
    position: relative;
    margin-bottom: clamp(11px, 1.042vw, 20px);
    overflow: visible
}

.bottom-bar hr:not(.visible):before {
    width: 0%:
}

.bottom-bar hr:before {
    content: "";
    position: absolute;
    top: 0px;
    width: 100vw;
    height: 1px;
    background: #FFF;
    transition: all .25s
}

.bottom-bar container .left {
    padding-left: clamp(80px, 7.813vw, 150px);
    padding-right: clamp(37px, 3.646vw, 70px)
}

.bottom-bar container .left hr:before {
    right: 0px
}

.bottom-bar container .right {
    padding-left: clamp(37px, 3.646vw, 70px);
    padding-top: clamp(80px, 7.813vw, 150px)
}

.bottom-bar container .right hr:before {
    left: 0px
}

.bottom-bar container .box-1-1 {
    padding-top: clamp(80px, 7.813vw, 150px)
}

.bottom-bar h5 p {
    font-size: inherit;
    font-family: inherit;
    font-size: clamp(46px, 4.531vw, 87px);
    line-height: 1
}

.bottom-bar h5 {
    font-size: clamp(46px, 4.531vw, 87px);
    line-height: 1
}

.bottom-bar h5 em {
    display: block;
    padding-left: clamp(72px, 7.031vw, 135px)
}

.bottom-bar figure.bg {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%) translateY(-50%);
    width: clamp(227px, 22.135vw, 425px);
    height: clamp(307px, 29.948vw, 575px);
  overflow: visible;
}
.bottom-bar figure.bg picture {
  overflow: hidden;
  box-shadow: 0px 0px 0px clamp(1px,0.104vw,1px) var(--primary-color);
}
.bottom-bar container .cta {
    background: #FFF;
  border: none;
 box-shadow: inset 0px 0px 0px clamp(1px,0.104vw,1px) var(--primary-color);
}

.bottom-bar container .cta * {
    color: var(--primary-color)
}

.lion-logo {
    padding: 2rem;
    display: flex;
    justify-content: center;
}
.lion-logo svg {
    height: 8rem;
}

#page-foot {
    height: var(--footer-height);
    overflow: hidden;
    /* margin-bottom: 8rem; */
}

#page-foot container {
    max-width: clamp(727px, 71.042vw, 1364px)
}

@media screen and (max-width: 768px) {
    #page-foot container {
        flex-direction: column;
    }
    #page-foot container .footer-section {
        width: 100% !important;
        max-width: 100% !important;
    }
}

#page-foot .footer-logo,
#page-foot .footer-logo svg {
    width: var(--footer-logo-width);
    height: auto;
}

#page-foot container .footer-section {
    width: 100%;
    height: 100%
}
#page-foot container .footer-section .menu-heading {
    width: 30%;
}

#page-foot container .footer-section .eyebrows {
    width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-content: stretch;
    align-items: flex-end;
    height: clamp(29px, 2.865vw, 55px);
    font-family: var(--primary-font) !important;
    letter-spacing: normal;
    color: var(--light-color);
    padding-left: clamp(32px, 3.125vw, 60px);
    opacity: 1;
    padding-bottom: clamp(5px, .521vw, 10px)
}

#page-foot container .footer-section.newsletter .eyebrows {
    padding-left: 1rem;
}
@media screen and (max-width: 768px) {
    #page-foot container .footer-section .eyebrows {
        height: auto;
        padding-top: .5rem;
        padding-bottom: .5rem;
    }
}

#page-foot container .footer-section .footer-menus {
    display: flex;
    justify-content: flex-start;
    padding-left: clamp(32px, 3.125vw, 60px);
}

#page-foot container .footer-section .footer-menus ul {
    padding: 0;
    list-style-type: none;
    padding-top: clamp(12px, 1.146vw, 22px);
    width: 30%;
}

#page-foot container .footer-section ul li {
    padding-bottom: clamp(3px, .26vw, 5px);
    line-height: 1
}

#page-foot container .footer-section ul li a {
    font-size: clamp(6px, .625vw, 12px);
    color: var(--primary-color);
    text-decoration: none
}

#page-foot container .footer-section:nth-child(1) {
    width: 50%;
}

#page-foot container .footer-section:nth-child(2) {
    width: 30%;
}

#page-foot container .footer-section:nth-child(3) {
    width: 20%;
}


#page-foot container .footer-section form {
    position: relative
}
#page-foot container .footer-section form .input-group {
    position: relative;
}

#page-foot container .footer-section form input[type=text],
#page-foot container .footer-section form input[type=email] {
    width: 90%;
    margin: 1rem 5%;
    background: #fff;
    border: none;
    border-bottom: 1px solid var(--primary-color);
    height: clamp(23px, 2.24vw, 43px);
    padding: .5rem 4rem .5rem .5rem;
    font-family: var(--primary-font);
    font-size: clamp(6px, .625vw, 12px);
    color: var(--primary-color)
}

#page-foot container .footer-section form button {
    position: absolute;
    height: calc(100% - 2rem);
    bottom: 1rem;
    right: 1rem;
    padding: 0 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #000;
    border: none;
    /* width: clamp(16px, 1.563vw, 30px); */
    /* height: clamp(9px, .833vw, 16px); */
    z-index: 2;
}
#page-foot container .footer-section form .thank-you {     width: 100%;
    margin: 0;
    background: transparent;
    border: none;
    border-bottom: 1px solid var(--primary-color);
    height: clamp(23px,2.24vw,43px);
    padding-left: clamp(32px,3.125vw,60px);
    font-family: var(--primary-font);
    font-size: clamp(6px,.625vw,12px);
    color: var(--primary-color);
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-content: stretch;
    align-items: center;
                                                     }
#page-foot container .footer-section form  .thank-you ~ * { display: none; }
#page-foot container .footer-section form button svg {
    width: clamp(16px, 1.563vw, 30px);
    height: clamp(9px, .833vw, 16px)
}

#page-foot container .footer-section form p {
    font-size: .6rem;
    font-style: italic;
    padding: .5rem 1rem;
}

#page-foot container {
    height: calc(var(--footer-height) - var(--legal-height));
    max-width: clamp(727px, 71.042vw, 1364px)
}

#page-foot nav#legal {
    height: var(--legal-height);
    padding: 0;
    list-style-type: none;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-content: stretch;
    align-items: center;
    width: 100%;
    margin: auto;
    max-width: clamp(727px, 71.042vw, 1364px);
    border-right: 1px solid #000;
    border-left: 1px solid #000;
}

#page-foot nav#legal ul {
    display: flex;
    width: 50%;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-content: stretch;
    align-items: center;
    border-right: 1px solid #000;
    padding: 0 2.5rem;
}

#page-foot nav#legal li {
    display: inline-block;
    display: inline-flex;
    height: var(--legal-height);
    padding-left: .5rem;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-content: stretch;
    align-items: center
}

#page-foot nav#legal li a {
    font-size: clamp(6px, .625vw, 12px);
    color: var(--primary-color);
    text-decoration: underline;
}
    
#page-foot nav#legal .copyright {
    font-size: clamp(6px, .625vw, 12px);
}

#page-foot nav#legal .credit {
    width: 30%;
    border-right: 1px solid #000;
    font-size: clamp(6px, .625vw, 12px);
    display: flex;
    height: 100%;
    align-items: center;
    padding: 0 1rem;
}

#page-foot nav#legal .spacer {
    width: 20%;
    border-right: 1px solid #000;
    height: 100%;
}
@media screen and (max-width: 768px) {
    #page-foot {
        height: auto;
    }
    #page-foot container {
        height: auto;
    }
    #page-foot container .footer-section form button {
        height: calc(100% - 2rem) !important;
        top: 1rem;
        width: 15% !important;
    }
    #page-foot nav#legal {
        flex-direction: column;
        height: auto;
        margin-top: .5rem;
    }
    #page-foot nav#legal ul {
        flex-direction: column;
        width: 100%;
    }
    #page-foot nav#legal ul li, #page-foot nav#legal ul li:nth-child(2) {
        width: 100% !important;
        max-width: 100%;
        border-right: none !important;
    }
    #page-foot nav#legal ul li, #page-foot nav#legal ul li:first-child {
        width: 100%;
        max-width: 100%;
    }
}

#page-foot .social li a {
    color: var(--primary-color)
}

#page-foot ul li {
    break-inside: avoid-column
}

#page-foot ul li a {
    position: relative
}

#page-foot ul li a:after {
    position: absolute;
    content: "";
    bottom: calc(-1*clamp(2px, .156vw, 3px));
    left: 0px;
    width: 0px;
    height: 1px;
    transition: all .25s;
    background: var(--primary-color)
}

#page-foot ul li a:hover:after {
    width: 100%
}

#page-foot .footer-logo {
    max-width: 100%;
}

@media handheld,
only screen and (max-width: 1023px) {
    :root {
        --grid-width: clamp(875px, 85.417vw, 1640px);
        --grid-gutter: clamp(10px, .938vw, 18px);
        --alertbar-height: clamp(15px, 4.651vw, 48px);
        --header-height: clamp(34px, 10.748vw, 110px);
        --logo-width: clamp(73px,22.685vw,232px);
        --logo-height: clamp(15px,4.630vw,47px);
        --footer-height: clamp(445px, 139.019vw, 1422px);
        --legal-height: clamp(49px, 15.187vw, 155px);
        --footer-logo-width: clamp(47px, 4.583vw, 88px);
        --footer-logo-height: clamp(47px, 4.583vw, 88px)
    }

    .mobilebg + .desktopbg {
        display: none !important
    }

    .cta {
        min-width: clamp(253px, 31.07vw, 809px);
        height: clamp(46px, 6.252vw, 146px);
        border-radius: clamp(26px, 8.178vw, 84px);
        margin-left: auto;
        margin-right: auto
    }

    .gm-item.cta {
        min-width: auto;
        height: auto;
    }

    .cta * {
        font-size: clamp(9px, 1.804vw, 29px)
    }

    .collection-holder container .sorter .column-options {
        display: none
    }

    main *:not(.cta) > a:after {
        bottom: -1px
    }

    article p,
    .p {
        font-size: clamp(11px, 3.505vw, 36px)
    }

    article h1,
    .h1 {
        font-size: clamp(21px, 6.481vw, 66px)
    }

    article .subheader,
    .subheader {
        font-size: clamp(13px, 4.206vw, 43px)
    }

    article .eyebrows,
    .eyebrows {
        font-size: clamp(10px, 3.241vw, 33px)
    }

    .contact-page .contact-info {
        font-size: clamp(12px, 3.704vw, 38px)
    }

    #alertbar p {
        font-size: clamp(8px, 2.57vw, 26px);
        margin-top: -2px
    }

    a:hover:after {
        bottom: -2px !important
    }

    #page-head container .logo > * {
        max-height: var(--logo-height);
        width: var(--logo-width)
    }

    #page-head container:before {
        content: "";
        width: clamp(90px, 28.037vw, 287px);
        height: var(--header-height);
        border-right: 1px solid var(--primary-color)
    }

    #page-head container nav#account {
        width: clamp(90px, 28.037vw, 287px)
    }

    #page-head container nav#account ul li a {
        font-size: clamp(8px, 1.57vw, 26px)
    }

    #page-head container nav#account > ul > li:first-child {
        display: none
    }

    #page-head container #nav {
        min-width: 100vw;
        left: 0px;
        background: var(--secondary-color)
    }

    #page-head container nav .cart-count-bubble {
        width: clamp(17px, 2.374vw, 55px);
        height: clamp(17px, 2.374vw, 55px)
    }

    #page-head container .toggle {
        width: clamp(16px, 5.14vw, 53px);
        height: clamp(9px, 2.804vw, 29px);
        left: clamp(15px, 4.673vw, 48px);
        right: auto
    }

    #page-head container .toggle:before,
    #page-head container .toggle:after,
    #page-head container .toggle em:before,
    #page-head container .toggle em:after {
        background: #000;
        height: 1px
    }

    #page-head container #nav {
        position: absolute;
        top: calc(var(--header-height) + .00011px);
        width: 100vw;
        max-width: 100vw;
        background-blend-mode: multiply;
        padding: 0
    }

    #page-head container .mobileonly {
        font-size: clamp(8px, 2.57vw, 26px);
        color: var(--primary-color);
        text-decoration: none;
        position: absolute;
        left: clamp(37px, 11.628vw, 119px)
    }

    #page-head.dk-bg container .mobileonly {
        color: var(--tertiary-color)
    }

    #page-head container #nav > ul li a {
        font-size: clamp(8px, 2.57vw, 26px)
    }

    #page-head container #nav > ul {
        width: 100%;
        padding: 0
    }

    #page-head container #nav > ul li a {
        padding: 20px
    }

    #page-head container #nav > ul > li {
        display: block;
        margin: 0;
        padding: clamp(13px, 4.206vw, 43px);
        line-height: 1;
        border-bottom: 1px solid var(--primary-color);
        width: 100%
    }

    #page-head container #nav > ul > li > a {
        font-size: clamp(21px, 6.542vw, 67px);
        font-family: var(--secondary-font);
        line-height: 1;
        position: relative;
        width: 100%;
        min-width: 90vw;
        display: block;
        line-height: 0
    }

    #page-head container #nav > ul > li > a:after {
        content: "";
        width: clamp(22px, 7.009vw, 72px);
        height: clamp(7px, 2.336vw, 24px);
        background: url(arrow.svg) center no-repeat;
        transition: all .25s;
        background-size: contain;
        position: absolute;
        right: 0px;
        left: auto;
        top: 50%;
        transform: translateY(-50%)
    }

    #page-head container #nav > ul > li > a.open:after {
        transform: rotate(90deg)
    }

    #page-head container #nav > ul > li > ul {
        width: 100%;
        max-height: 0px !important;
        overflow: hidden;
        transition: all .25s;
        height: auto !important;
        top: 0px;
        left: 0px;
        position: static;
        padding: 0;
        display: block !important;
        border: none
    }

    #page-head container nav > ul > li > ul:before {
        display: none
    }

    #page-head container #nav > ul > li > ul > li {
        padding: 0;
        width: 100%;
        border: none;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: space-between;
        /*align-content: stretch;*/
        align-items: flex-start;
    }

    #page-head container #nav > ul > li > ul > li > a {
        font-size: clamp(11px, 3.505vw, 36px);
        width: 50%
    }

    #page-head container #nav > ul > li > ul > li > ul {
        width: 50%;
        padding-top: 1rem;
    }

    #page-head container #nav > ul > li > ul > li > ul li {
        margin-bottom: 10px;
        border: none
    }

    #page-head container #nav > ul > li > ul > li > ul li a {
        font-size: clamp(11px, 3.505vw, 36px);
        padding: 10px 0
    }

    #page-head container #nav > ul > li > ul.expand {
        max-height: 100% !important
    }
    #page-head container #nav > ul > li > ul.expand > li.parent {
      height: 100%;
    }

    .halves .half container,
    section container {
        padding-left: clamp(26px, 8.178vw, 84px) !important;
        padding-right: clamp(26px, 8.178vw, 84px) !important
    }

    #page-head.dk-bg container #nav {
        background: var(--primary-color)
    }

    #page-head container nav #CartButton span {
        font-size: clamp(8px, 1.57vw, 26px)
    }

  #page-head container nav.right>ul>li label svg {
    width: clamp(11px,3.472vw,36px);
    margin-bottom: calc( -1 * clamp(2px,0.694vw,7px) )
  }
#page-head container nav.right>ul>li .search form {
  padding-top: clamp(6px,1.852vw,19px);
  padding-bottom: clamp(6px,1.852vw,19px);
  
}
  #page-head container nav.right>ul>li .search input { font-size: 10px; }
    .nav-carat {
        display: none !important
    }

    #page-loader h1 {
        font-size: clamp(24px, 7.407vw, 76px)
    }

    .home-header .top-part,
    .home-header .top-part .headerswiper {
        height: calc(100vh - var(--header-height) - var(--alertbar-height) - clamp(153px, 47.897vw, 490px))
    }

    .right-trim {
        display: none
    }

    .home-header .right .header-swiper-pagination .swiper-pagination-bullet em {
        color: #fff
    }

    .home-header .lower-part {
        height: auto;
        min-height: clamp(153px, 47.897vw, 490px)
    }

    .home-header container .left {
        width: 100%;
        max-width: 100%;
        padding-right: 0;
        padding-top: 30px
    }

    .home-header container .left .subheader {
        margin-bottom: 20px
    }

    .home-header .right {
        position: absolute;
        bottom: clamp(135px, 42.056vw, 430px);
        font-size: 0px !important;
        padding: 0;
        width: calc(100% - clamp(26px, 8.178vw, 84px) - clamp(26px, 8.178vw, 84px));
      border: none;
      background: none; right: clamp(26px, 8.178vw, 84px)
    }

    .home-header .right .header-swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active strong {
        font-size: 0px
    }

    .home-header .right .line {
        display: none
    }

    .home-header .right .header-swiper-pagination .swiper-pagination-bullet {
        width: clamp(41px, 12.85vw, 131px)
    }

    .home-header .right .header-swiper-pagination .swiper-pagination-bullet:before {
        height: 2px;
        background: var(--secondary-color)
    }

    .home-header container .left {
        transform: none !important
    }

    .home-spotlight container {
        padding-bottom: 0
        width: 100%;
    }

    .home-spotlight container article {
        max-width: 100%;
        margin: 0
    }

    .home-spotlight container > figure {
        max-width: clamp(239px, 74.766vw, 765px);
        margin: auto;
        height: clamp(146px, 45.561vw, 466px)
    }

    .home-collections .home-collection .box-1-3 {
        padding: clamp(10px, 3.023vw, 31px);
        padding-bottom: 0 !important
    }

    .home-collections .home-collection .box-1-3 .single-collection {
        width: clamp(223px, 69.767vw, 714px) !important;
        position: relative;
    }

    .home-collections .home-collection .box-1-3 .bottom-collection-bar {
        height: clamp(20px, 6.308vw, 65px)
    }

    .home-collections .home-collection .box-1-3 .bottom-collection-bar .eyebrows {
        font-size: clamp(8px, 2.57vw, 26px)
    }

    figure.feature-box.bg {
        height: clamp(176px, 54.907vw, 562px)
    }

    .home-featured-callouts.halves .half:first-child container figure + .detail {
        display: none
    }

  .home-collections .home-collection .box-1-3 figure picture img { position: absolute; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%); }
figure:hover .hoverimg { opacity: 0!important; }
    .home-featured-callouts.halves .half:nth-child(2) container {
        padding-top: 0
    }

    .home-signup container {
        padding-top: clamp(15px, 4.673vw, 48px);
        padding-bottom: clamp(15px, 4.673vw, 48px)
    }

    .home-signup container article:nth-child(1),
    .home-signup container article {
        padding: 0;
        text-align: left
    }

    .home-signup container article .line {
        display: none
    }

    .form-holder input[type=text],
    .form-holder input[type=email],
    .form-holder input[type=tel],
    .form-holder input[type=phone],
    .form-holder textarea {
        height: clamp(26px, 8.178vw, 84px);
        font-size: clamp(10px, 3.037vw, 31px)
    }

    .form-holder .field-container:after {
        height: clamp(4px, 1.402vw, 14px)
    }

    .sorter .js-dropdown__label {
        font-size: clamp(13px, 1.5vw, 43px)
    }

    .curated-header h2.giant {
        font-size: clamp(57px, 17.824vw, 182px);
        line-height: 1;
        position: relative;
        z-index: 2
    }

    .curated-header figure {
        width: clamp(264px, 82.477vw, 844px);
        height: clamp(299px, 93.458vw, 956px);
        top: 200px;
        margin: 0 !important;
        border: 1px solid var(--tertiary-color)
    }

    .curated-header .picholder {
        transform: none !important;
        position: fixed;
        top: 150px
    }

    .curated-header container {
        margin-bottom: 0;
        height: clamp(486px, 151.869vw, 1554px);
        padding-top: clamp(299px, 93.458vw, 956px)
    }

    .curated-header {
        height: clamp(486px, 151.869vw, 1554px);
        display: flex;
        flex-direction: column;
        flex-wrap: wrap;
        justify-content: flex-end;
        align-content: stretch;
        align-items: center
    }

    figure.feature-box:hover figcaption span {
        transform: none
    }

    figure.feature-box:hover figcaption span:after {
        width: 200px
    }

    .curated-conversation container {
        padding-left: 80px !important;
        padding-right: 80px !important
    }

    .curated-conversation container article p {
        font-size: clamp(11px, 3.505vw, 36px)
    }

    .curated-conversation container .line,
    .curated-conversation container .equal {
        display: none
    }

    .curated-collections container ul.collection-archive {
        margin-top: calc(-1*clamp(64px, 19.86vw, 203px));
        padding-bottom: 20px
    }

    .curated-collections container ul.collection-archive li.box-1-2 {
        margin-bottom: 0
    }

    .curated-collections container ul.collection-archive li.box-1-2:nth-child(even) {
        margin-top: 0
    }

    .page-top container.slim ul li a {
        font-size: clamp(11px, 3.505vw, 36px)
    }

    .page-top container {
        min-height: clamp(35px, 10.981vw, 112px);
        /* max-width: clamp(290px, 90.654vw, 927px); */
        /* padding-left: 0 !important;
        padding-right: 0 !important; */
      padding-top: 2rem;
      padding-bottom: 2rem;
      height: auto;
    }

    .page-top container h1.page-title {
        font-size: clamp(21px, 6.542vw, 67px)
    }

    .page-top container.slim {
        min-height: clamp(25px, 7.71vw, 79px)
    }

    .collection-holder aside {
        display: none
    }

    .collection-holder container {
        max-width: 100%;
        background: var(--secondary-color);
        padding-left: 10px !important;
        padding-right: 10px !important;
        margin: 0;
    }

    .collection-holder container .sorter {
        top: 0px;
        margin-top: 0;
        transform: none;
        margin-bottom: 0;
        height: clamp(25px, 7.71vw, 79px);
        border-bottom: 1px solid var(--primary-color);
      z-index: 4;
    }

    .collection-holder container .collection-archive-list {
        background: #FFF;
        border-left: 1px solid var(--primary-color);
        grid-template-columns: 1fr 1fr;
    }

    .collection-holder container .collection-archive-list li .single-collection-item .product-details {
        /* height: clamp(37px, 11.682vw, 120px); */
        margin-bottom: 20px
    }

    .collection-holder container .collection-archive-list li .single-collection-item .product-details * {
        /* font-size: clamp(9px, 1.804vw, 29px); */
        width: 100%
    }

    .collection-holder container .sorter > * {
        font-size: clamp(9px, 2.804vw, 29px)
    }

    .collection-holder container .collection-archive-list li .single-collection-item figure {
        width: 100% !important;
        height: clamp(191px, 18.907vw, 971px) !important;
    }

    .collection-holder container .collection-archive-list li .single-collection-item figure.bg picture img {
        max-height: 100%;
        object-fit: contain;
    }
    .sorter .js-dropdown__list li:hover,
    .sorter .js-dropdown__list li {
        font-size: clamp(9px, 2.778vw, 28px)
    }

    .single-product-body container {
        padding: 0 !important
    }

    .single-product-body container .product-photo ul.thumbnails {
        display: none
    }

    .single-product-body container .product-photo .largepix {
        max-width: 100%;
        border: none;
      border-bottom: 1px solid #000;
    }

    .single-product-body container .product-photo .largepix figure {
        border: none;
    }

    .single-product-body container .product-details {
        width: 100%;
        max-width: 100%;
        padding-right: clamp(35px, 10.981vw, 112px)
    }

    .single-product-body container .product-details .price {
        font-size: clamp(12px, 3.738vw, 38px)
    }

    .js-qty {
        height: clamp(26px, 8.178vw, 84px);
        width: clamp(82px, 25.701vw, 263px)
    }

    .js-qty input {
        font-size: clamp(11px, 3.505vw, 36px)
    }

    .single-product-body container .product-details select,
    .js-qty span {
        font-size: clamp(11px, 3.505vw, 36px)
    }

    .single-product-body .product-details-info details summary {
        font-size: clamp(11px, 3.505vw, 36px)
    }

    .single-product-body .product-details-info details div {
        font-size: clamp(11px, 3.505vw, 36px)
    }

    .related-products container {
        padding-left: 0 !important;
        padding-right: 0 !important
    }

    .related-products container > article {
        padding-left: clamp(34px, 10.514vw, 108px);
        height: auto;
        margin: 0;
        max-width: calc(100% - clamp(35px, 10.981vw, 112px))
    }

    .related-products container > article .bottom,
    .related-products container > article .line {
        display: none
    }

    .related-products container .swiper {
        padding-left: clamp(35px, 10.981vw, 112px)
    }

    .related-products container .swiper .related-product a .eyebrows {
        font-size: clamp(8px, 2.57vw, 26px);
        opacity: 1
    }

    .designers-list ul.designers-archive li {
        width: 50% !important
    }

    .designers-list ul.designers-archive li .detail-bar .more {
        font-size: 0px
    }

    .designers-list ul.designers-details {
        display: none
    }

    .blog-archive .grid {
        margin-top: 40px;
        border-top: 1px solid var(--primary-color)
    }

    .blog-archive .grid li {
        widtH: 100% !important;
        position: static !important;
        height: auto !important
    }

    .blog-archive .grid li .single-post {
        padding-bottom: 20px !important;
        height: auto !important
    }

    .blog-archive .grid li .single-post figure {
        height: clamp(215px, 67.29vw, 688px) !important
    }

    .blog-archive .grid li .single-post h3 {
        font-size: clamp(26px, 8.178vw, 84px)
    }

    .morebutton container {
        width: 100%;
        margin: 10px 0 30px
    }

    .morebutton container div {
        width: 100%
    }

    .locations-top-section container {
        flex-wrap: wrap
    }

    .locations-locales container .single-location {
        flex-wrap: wrap
    }

    .locations-locales container .single-location .single-location-details {
        display: flex;
        flex-direction: column;
        flex-wrap: wrap;
        justify-content: flex-start;
        align-content: stretch;
        align-items: stretch
    }

    .locations-locales container .single-location figure {
        height: clamp(189px, 59.112vw, 605px)
    }

    .locations-locales container .single-location .single-location-details > * {
        width: 100% !important;
        max-width: 100%;
        border-bottom: 1px solid var(--primary-color);
        padding: 20px 0 !important
    }

    .locations-locales container .single-location .single-location-details .location-icon,
    .locations-locales container .single-location .single-location-details .line {
        display: none
    }

    .locations-locales container .single-location .single-location-details .eyebrows {
        display: none
    }

    .locations-locales container .single-location .single-location-details h5 {
        font-size: clamp(16px, 5.14vw, 53px)
    }

    figure.feature-box figcaption span:after {
        width: 200px !important
    }

    .locations-locales container .single-location .single-location-details h5,
    .locations-locales container .single-location .single-location-details p {
        font-size: 14px
    }

    .page-top.faq-title container {
        height: auto;
        padding-top: 20px;
        padding-bottom: 20px
    }

    .faq-section container {
        padding-left: 0 !important;
        padding-right: 0 !important
    }

    .shipping-info .shipping-section article:nth-child(1),
    .shipping-info .shipping-section article:nth-child(2) {
        text-align: left;
        padding-left: clamp(35px, 10.981vw, 112px);
        padding-right: clamp(35px, 10.981vw, 112px);
        margin: 0;
        max-width: 100%;
        padding-top: 20px
    }

    .shipping-bottom {
        height: clamp(138px, 43.224vw, 442px)
    }

    .shipping-bottom div:nth-child(1) {
        width: 100%
    }

    .shipping-bottom div {
        padding-left: 10px !important;
        padding-right: 10px !important;
        height: calc(clamp(138px, 43.224vw, 442px)/2);
        border: none !important
    }

    .contact-page container .gallery-elements {
        height: 1px
    }

    .contact-page container .gallery-container,
    .contact-page container > article:first-child {
        display: none
    }

    .contact-page .gallery-elements svg {
        bottom: auto;
        top: clamp(224px, 70.093vw, 717px);
        left: clamp(150px, 46.729vw, 478px);
        width: clamp(224px, 70.093vw, 717px);
        height: clamp(224px, 70.093vw, 717px)
    }

    .contact-page .form-holder {
        max-width: 100%
    }

    .contact-page .form-holder svg {
        margin: 20px auto;
        display: block
    }

    .form-holder textarea {
        height: clamp(75px, 23.364vw, 239px)
    }

    .contact-page .contact-info dl {
        width: 100%;
        margin-bottom: clamp(12px, 3.704vw, 38px)
    }

    .contact-page .locations-info-contact h6 {
        font-size: clamp(12px, 3.704vw, 38px);
        margin-top: clamp(12px, 3.704vw, 38px)
    }

    .thank-you container {
        justify-content: center
    }

    .thank-you container article + svg {
        display: none
    }

    .thank-you container article h1 {
        font-size: clamp(25px, 7.71vw, 79px)
    }

    #page-head.dk-bg container .toggle:before,
    #page-head.dk-bg container .toggle:after,
    #page-head.dk-bg container .toggle em:before,
    #page-head.dk-bg container .toggle em:after {
        background: #FFF
    }

    .page-top.dk-bg {
        display: none
    }

    .believe container {
        padding-top: clamp(19px, 1.823vw, 35px)
    }

    .believe container article h1 {
        font-size: clamp(43px, 13.426vw, 137px);
        text-align: center
    }

    .believe container article h1 span {
        display: inline-block
    }

    .believe container article h1 span:nth-child(2) {
        text-align: center
    }

    .believe container article h1 span:nth-child(3) {
        padding: 0;
        text-align: center;
        margin-top: 400px
    }

    .believe container article h1 span:nth-child(4) {
        text-align: right;
        padding-right: clamp(317px, 30.99vw, 595px);
        z-index: 5;
        display: inline;
        text-align: center;
        padding: 0
    }

    .believe container article h1 span:nth-child(5) {
        padding: 0 !important;
        display: inline-block
    }

    .believe container article h1 span:nth-child(6) {
        padding: 0 !important;
        display: inline-block
    }

    .believe container article h1 span:nth-child(7) {
        padding: 0 !important;
        display: inline-block
    }

    .believe figure.top {
        transform: none !important;
        left: 50px !important;
        width: calc(100vw - 100px);
        top: clamp(119px, 37.209vw, 381px)
    }

    .believe figure.bottom {
        position: static;
        width: calc(100vw - 100px);
        margin: 0 auto 50px
    }

    .about-text .half container article {
        padding: 30px 0 0
    }

    .about-text .half .line {
        display: none
    }

    .about-text-bottom container {
        max-width: clamp(873px, 85.208vw, 1636px);
        text-align: center;
        padding: clamp(21px, 2.083vw, 40px)
    }

    .about-mosaic container {
        max-width: 100%;
        position: relative;
        height: clamp(506px, 158.14vw, 1618px)
    }

    .about-mosaic container ul.mosaic-holder {
        padding: 0;
        list-style-type: none
    }

    .about-mosaic container ul.mosaic-holder li {
        position: absolute;
        z-index: 1
    }

    .about-mosaic container ul.mosaic-holder li figure {
        z-index: 1
    }

    .about-mosaic container ul.mosaic-holder li figcaption {
        margin-top: 0;
        font-size: clamp(4px, 1.163vw, 12px);
        display: none
    }

    .about-mosaic container ul.mosaic-holder li:nth-child(1) {
        left: 0px;
        top: clamp(26px, 8.14vw, 83px)
    }

    .about-mosaic container ul.mosaic-holder li:nth-child(2) {
        right: 0px;
        top: clamp(7px, 2.326vw, 24px);
        z-index: 2
    }

    .about-mosaic container ul.mosaic-holder li:nth-child(3) {
        right: clamp(63px, 19.767vw, 202px);
        top: clamp(123px, 38.372vw, 393px)
    }

    .about-mosaic container ul.mosaic-holder li:nth-child(4) {
        right: clamp(26px, 8.14vw, 83px);
        top: clamp(197px, 61.628vw, 630px)
    }

    .about-mosaic container ul.mosaic-holder li:nth-child(5) {
        left: clamp(7px, 2.326vw, 24px);
        top: clamp(253px, 79.07vw, 809px)
    }

    .about-mosaic container ul.mosaic-holder li:nth-child(6) {
        left: clamp(112px, 34.884vw, 357px);
        top: clamp(305px, 95.349vw, 975px)
    }

    .about-mosaic container ul.mosaic-holder li:nth-child(7) {
        right: 0px;
        top: clamp(380px, 118.605vw, 1213px)
    }

    .about-mosaic container ul.mosaic-holder li:nth-child(1) figure {
        width: clamp(134px, 41.86vw, 428px);
        height: clamp(138px, 43.023vw, 440px)
    }

    .about-mosaic container ul.mosaic-holder li:nth-child(2) figure {
        width: clamp(112px, 34.884vw, 357px);
        height: clamp(112px, 34.884vw, 357px)
    }

    .about-mosaic container ul.mosaic-holder li:nth-child(3) figure {
        width: clamp(97px, 30.233vw, 309px);
        height: clamp(60px, 18.605vw, 190px)
    }

    .about-mosaic container ul.mosaic-holder li:nth-child(4) figure {
        width: clamp(179px, 55.814vw, 571px);
        height: clamp(100px, 31.395vw, 321px)
    }

    .about-mosaic container ul.mosaic-holder li:nth-child(5) figure {
        width: clamp(89px, 27.907vw, 285px);
        height: clamp(104px, 32.558vw, 333px)
    }

    .about-mosaic container ul.mosaic-holder li:nth-child(6) figure {
        width: clamp(97px, 30.233vw, 309px);
        height: clamp(60px, 18.605vw, 190px)
    }

    .about-mosaic container ul.mosaic-holder li:nth-child(7) figure {
        width: clamp(134px, 41.86vw, 428px);
        height: clamp(60px, 18.605vw, 190px)
    }

    .about-mosaic container figure.circle-logo {
        position: absolute;
        top: clamp(48px, 15.116vw, 155px);
        right: clamp(93px, 29.07vw, 297px);
        width: clamp(88px, 27.442vw, 281px);
        height: clamp(88px, 27.442vw, 281px);
        z-index: 2
    }

    .about-mosaic container figure.lion-logo {
        position: absolute;
        bottom: clamp(100px, 31.395vw, 321px);
        left: clamp(45px, 13.953vw, 143px);
        z-index: 1;
        width: clamp(104px, 32.558vw, 333px);
        height: clamp(71px, 22.093vw, 226px)
    }

    .about-bottom .half:first-child article p {
        font-size: clamp(11px, 3.488vw, 36px)
    }

    .about-bottom .half:last-child article {
        max-width: 100%
    }

    .contact-page .form-holder + svg {
        max-widtH: 100%;
        margin: 40px auto
    }

    .blog-archive .filter {
        height: clamp(30px, 9.259vw, 95px);
        margin-top: 10px
    }

    .single-blog-post .swiper-slide {
        padding-left: clamp(30px, 9.259vw, 95px);
        padding-right: clamp(30px, 9.259vw, 95px)
    }

    main table tr td:before {
        display: none
    }

  .js-dropdown__list.visible {
margin-top: calc( -1 * clamp(7px,2.315vw,24px) );
    
  }

    .cart-info-container {
        
    }

    .mobile-small {
        display: block !important;
        font-size: clamp(15px, 4.63vw, 47px) !important;
        line-height: 1
    }

    .cart {
        margin-top: 0 !important
    }

    .info__subtotal {
        font-size: clamp(10px, 3.241vw, 33px) !important;
        margin-bottom: 40px
    }

    .bottom-bar,
    .bottom-bar container {
        height: clamp(688px, 214.953vw, 2199px)
    }

    .bottom-bar container article {
        padding-top: 0
    }

    .bottom-bar container .right,
    .bottom-bar container .left {
        padding-left: 0;
        padding-right: 0
    }

    .bottom-bar container .right {
        width: calc(100% + 200px);
        margin-left: -20px;
        white-space: nowrap;
        padding-top: clamp(224px, 70.093vw, 717px)
    }

    .bottom-bar figure.bg {
        width: clamp(262px, 81.776vw, 837px);
        height: clamp(351px, 109.813vw, 1123px)
    }


    .collection-holder container .collection-archive-list.fourcol li .single-collection-item .product-details * 
    { 
    font-size: clamp(12px,1.704vw,38px)!important; 
    }

    #page-foot {
        height: auto;
    }

    #page-foot container {
        max-width: 100%;
        height: auto;
    }

    #page-foot container .footer-section {
        height: initial
    }

    #page-foot container .footer-section > .line {
        display: none
    }

    #page-foot container .footer-section:nth-child(1),
    #page-foot container .footer-section:nth-child(2) {
        width: 50%;
        max-width: 100%
    }

    #page-foot container .footer-section:nth-child(3)
    {
        width: 100%;
    }

    #page-foot .footer-logo-holder {
        width: 100%;
    }

    #page-foot container .footer-section .eyebrows {
        font-size: clamp(11px, .57vw, 26px)
    }

    #page-foot container .footer-section ul li {
        padding-bottom: 10px
    }

    #page-foot nav#legal {
        margin: 0;
        max-width: 100%;
    }
    #page-foot nav#legal .spacer {
        display: none;
    }
    #page-foot nav#legal .credit {
        width: 50%;
        border-right: none;
        font-size: .8rem;
    }
    #page-foot nav#legal ul {
        flex-direction: column;
        align-items: flex-start;
        border-right: none;
    }
    #page-foot nav#legal ul li {
        height: auto;
    }

    #page-foot nav#legal li a,
    #page-foot container .footer-section ul li a {
        font-size: clamp(11px, 1.505vw, 36px);
        
    }


    #page-foot container .footer-section form {
        margin: auto
    }

    #page-foot container .footer-section form input[type=text],
    #page-foot container .footer-section form input[type=email] {
        font-size: clamp(11px, 1.505vw, 36px);
        padding-left: 0;
        padding: 1rem 0;
        margin-left: .75rem;
    }

    #page-foot container .footer-section form button,
    #page-foot container .footer-section form button svg {
        width: clamp(22px, 7.009vw, 72px);
        
    }

    #page-foot container .footer-section form button {
       
    }

    #page-foot container .footer-section:nth-child(5) {
        display: none
    }

    #page-foot nav#legal li {
       
    }

    #page-foot nav#legal li:last-child {
        border-right: 0px
    }

    #page-foot nav#legal .copyright
    {
        border-bottom: none;
        font-size: .8rem;
    }

    #page-foot nav#legal li:last-child {
        
    }

    #page-foot nav#legal li .line {
        
    }
    .event-single article { max-width: 100%; margin-top: 10px; }

    .event-single article > .line { display: none; }
    .event-single article .details dd { font-size: clamp(11px,3.472vw,36px); }

    .template-cart container {
        /* padding: 0 !important; */
    }
    .cart-info-container {
        width: 29%;
    }
    #CartOuter .mobile-small {
        display: none;
    }
    .cart .item__price--final, .cart a, td.details {
        font-size: .8rem !important;
    }
  
}

@font-face {
    font-family: Icons;
    src: url(open-iconic.eot);
    src: url(open-iconic.eot?#iconic-sm) format("embedded-opentype"), url(open-iconic.woff) format("woff"), url(open-iconic.ttf) format("truetype"), url(open-iconic.otf) format("opentype"), url(open-iconic.svg#iconic-sm) format("svg");
    font-weight: 400;
    font-style: normal
}

.js-dropdown__label {
    padding-right: 30px
}

#CartPopoverCont,
.buynow,
.no-js,
.variant--soldout .cta.buynow,
.label-hidden,
.pins-banner,
.nav-carat-small {
    display: none !important
}

.cart table th,
.cart table tbody td {
    font-size: 1rem;
    font-weight: 400;
    line-height: 2;
    margin: 0 0 .5em
}

small,
.small,
.btn.sml,
.shopify-payment-button .sml.shopify-payment-button__button--unbranded,
.sml.spr-summary-actions-newreview,
.buttom.sml,
.modal__overlay--newsletter .modal__description,
.cart table tbody td a.remove-from-cart,
.cart-info-container small,
.cart-info-container h3 span,
.item__price p,
.account .forgot-password a,
.address-actions {
    font-size: .875em;
    line-height: 1.5
}

.oi.small,
.oi.btn.sml,
.shopify-payment-button .oi.sml.shopify-payment-button__button--unbranded,
.oi.sml.spr-summary-actions-newreview,
.oi.buttom.sml,
.modal__overlay--newsletter .oi.modal__description,
.cart table tbody td a.oi.remove-from-cart,
.cart-info-container small.oi,
.cart-info-container h3 span.oi,
.item__price p.oi,
.account .forgot-password a.oi,
.oi.address-actions {
    font-size: .7em;
    margin-left: 8px
}

.cart-form-errors {
    padding: .9375rem 1.25rem;
    border: 1px solid #f5c6cb;
    border-radius: 0;
    margin: 2em 0;
    background-color: #f8d7da;
    color: #721c24
}

.cart-form-errors ul {
    list-style-type: none;
    margin: 10px 20px;
    padding: 0;
    color: inherit
}

.cart {
    width: auto;
    padding: 20px;
    position: relative;
    margin: 0 auto;
    overflow: visible;
    display: block;
    text-align: left;
    max-width: 1100px
}

.cart .theme {
    text-align: left
}

.cart .empty .theme {
    text-align: center
}

.cart a {
    text-decoration: none
}

.cart .empty {
    text-align: center
}

.cart #CartForm {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
}

.cart table {
    margin: 0;
    width: 100%;
    border: 0;
    table-layout: fixed;
    border-collapse: collapse;
}

.cart table th {
    font-size: 1em;
    border-right: 0;
    color: #000;
    height: 0;
    line-height: 0;
}

.cart table thead th:last-child {
    text-align: right
}

.cart table tbody td {
    font-size: clamp(10px, .938vw, 18px);
    border-top: 1px solid #aaa;
    border-left: none;
    border-right: none;
    padding: 2rem 1rem;
    vertical-align: top;
    font-weight: 400;
    line-height: 1.2;
}
.cart table tbody td.img {
    padding: 2rem 0;
}

@media (max-width: 480px) {
    .cart table tbody td {
        padding: 20px 0
    }
}

.cart table tbody td.desc {
    word-break: break-word;
    line-height: 1.1;
}

.cart table tbody td.desc small {
    display: block;
    font-size: .875em;
    opacity: .7
}

.cart table tbody td:last-child {
    text-align: right
}

.cart td.properties {
    padding-top: 0 !important
}

.cart table tbody td input:focus {
    outline: none
}

.cart table tbody td a.remove-from-cart {
    font-size: .8em;
    text-transform: uppercase;
    opacity: .7
}

.cart table tbody td a.remove_from_cart:hover {
    color: #fff
}

.cart table tbody td img {
    width: 10rem;
    height: 10rem;
    object-fit: contain;
    border: 1px solid #000;
}

@media only screen and (max-width: 749px) {
    .cart table {
        table-layout: auto
    }

    .cart table tbody td.item td.quantity {
        text-align: right
    }

    .cart table tbody td.quantity {
        padding-right: 10px
    }

    .cart table tbody td.item td.img {
        padding-right: 25px
    }

    .cart table tbody td.item td.img img {
        margin-bottom: 5px
    }
}

.cart table tr.item.with-props td {
    border-bottom: 0
}

.cart table input {
    font-size: 1em
}

.cart table tbody tr.props .__props {
    display: block;
    position: relative;
    border-left: 2px solid #135461;
    padding: 4px 0 4px 15px !important
}

.cart table tbody tr.props td {
    border-bottom: 0;
    padding: 5px 0 10px !important;
    text-align: left
}

.cart table tbody tr.props + tr.item td {
    border-top: 1px solid #f0f0f0
}

.cart__foot {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap
}

@media only screen and (max-width: 749px) {
    .cart__foot {
        display: none
    }
}

#CartOuter {
    width: 70%;
    display: flex;
}

.cart-info-container {
    text-align: left;
    width: 25%;
    margin: 0;
    
    display: flex;
    flex-direction: column;
}
.cart-info-container .box {
    padding: 2rem;
    border: 1px solid #000;
}
.cart-info-container .box.faq {
    margin-top: 2rem;
}
.cart-info-container h2 {
    font-family: var(--secondary-font);
    margin-bottom: 1rem;
}
.cart-info-container p {
    display: flex;
    justify-content: space-around;
}
.cart-info-container .box p {
    display: block;
}

.cart-info-container small.additional-checkout {
    display: block;
    line-height: 1;
    margin-bottom: 20px;
    margin-top: 15px
}

.cart-info-container .cta {
    min-width: 100%;
    width: 100%;
    margin-top: 3rem;
}

.additional-checkout-button {
    width: 100%;
    margin-left: 0 !important
}

.cart-info-container h3 span {
    font-weight: 700;
    margin-right: 10px
}

.additional-checkout-buttons {
    text-align: center;
    margin-top: 0
}

.additional-checkout-buttons .additional-checkout-button {
    min-width: 100% !important
}

.cart-info-container input[type=image] {
    clear: both;
    background: transparent
}

.cart-info-container textarea {
    width: 100%;
    height: 100px;
    outline: none
}

.cart input.quantity {
    text-align: center
}

.cart .quantity-selector.qty--disabled:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: transparent;
    z-index: 2
}

.proceed .large-btn {
    width: 100%;
    margin-top: 15px;
    font-weight: 700;
    padding: 15px
}

.cart-extra {
    margin: 20px 0
}

.cart-extra small a {
    display: inline-block;
    line-height: 1.2
}

#NoteForSeller,
#ShippingCalculator {
    display: none
}

#NoteForSeller {
    margin: 0 0 20px
}

.show-note:before,
.show-calculator:before {
    content: "+";
    display: inline-block;
    width: 16px
}

.show-note.open:before,
.show-calculator.open:before {
    content: "\2013";
    display: inline-block;
    width: 16px
}

#ShippingCalculator {
    border: 1px solid #f0f0f0;
    padding: 20px
}

#ShippingCalculator p {
    margin-bottom: 1em
}

#ShippingCalculator label {
    display: block;
    margin-bottom: 5px;
    font-size: .875em;
    line-height: 1.2
}

#ShippingCalculator input,
#ShippingCalculator select {
    margin: 0;
    width: 100% !important
}

#ShippingCalculator .btn,
#ShippingCalculator .shopify-payment-button .shopify-payment-button__button--unbranded,
.shopify-payment-button #ShippingCalculator .shopify-payment-button__button--unbranded,
#ShippingCalculator .spr-summary-actions-newreview {
    margin: 15px 0 0;
    white-space: normal
}

#ShippingCalculator p#shipping-rates-feedback {
    font-style: italic
}

#ShippingCalculator #wrapper-response {
    margin-top: 20px
}

.error,
p.error,
label.error {
    color: #b00
}

#shipping-rates {
    list-style-type: none;
    margin: 0;
    padding: 0;
    border-top: 1px solid whitesmoke
}

#shipping-rates li {
    border-bottom: 1px solid whitesmoke;
    padding: 15px 0
}

.template-cart .home-collection {
    padding-top: 3rem;
    border-top: 1px solid #000;
}
@media screen and (max-width: 768px) {
    .template-cart .home-collection {
        display: flex;
        flex-direction: column;
    }
    .home-collections .home-collection .box-1-3 .bottom-collection-bar {
        height: auto;
    }
}

.template-cart img.cart-related {
    height: 20rem;
    width: 20rem;
    display: block;
    object-fit: contain;
}
.template-cart .single-collection a.image-link {
    display: block;
    padding: 1.5rem;
    border: 1px solid #000;
}
.template-cart .single-collection a.image-link:after {
    content: none;
}
.template-cart .bottom-collection-bar {
    text-align: center;
}

@media screen and (max-width: 768px) {
    .cart table tbody td img {
        max-width: 75px
    }
}

@media screen and (max-width: 767px) {
    .cart #CartForm {
        flex-direction: column;
    }
    .cart table tbody td img {
        max-width: 75px;
        height: auto;
        border: none;
    }

    #CartOuter,
    .cart-info-container {
        width: 100% !important;
    }

    .cart-info-container {
        text-align: left
    }

    .cart-info-container .proceed,
    .cart-info-container .cart-section-options {
        display: inline-block;
        width: 48%;
        vertical-align: top
    }

    .cart-info-container .cart-extra {
        margin: 10px 0 0
    }

    .cart-info-container .btn,
    .cart-info-container .shopify-payment-button .shopify-payment-button__button--unbranded,
    .shopify-payment-button .cart-info-container .shopify-payment-button__button--unbranded,
    .cart-info-container .spr-summary-actions-newreview {
        max-width: 262px
    }

    .cart-info-container small.additional-checkout,
    .additional-checkout-buttons {
        width: 262px
    }

    .additional-checkout-buttons [data-shopify-buttoncontainer] > div {
        height: auto !important
    }
}

@media screen and (max-width: 639px) {
    .cart {
        margin: 20px auto
    }

    .cart .remove {
        display: none
    }

    .info__subtotal {
        text-align: right
    }

    .info__tax {
        text-align: center;
        margin-bottom: 10px
    }

    .cart-info-container .proceed,
    .cart-info-container .cart-section-options {
        width: 100%;
        text-align: center
    }

    .cart-info-container small.additional-checkout {
        width: 100%
    }

    .additional-checkout-buttons {
        margin-left: auto;
        margin-right: auto
    }
}

@media screen and (max-width: 480px) {
    .cart table {
        margin-top: 0
    }


    .cart .update {
        padding: 10px 0
    }

    .cart .update .btn,
    .cart .update .shopify-payment-button .shopify-payment-button__button--unbranded,
    .shopify-payment-button .cart .update .shopify-payment-button__button--unbranded,
    .cart .update .spr-summary-actions-newreview {
        margin: 0
    }

    .cart table tbody tr:first-child > td {
        border-top: 1px solid #f0f0f0
    }

    .cart-info-container .proceed,
    .cart-info-container .cart-section-options {
        margin: 0 0 20px
    }
}

.cart .quantity-selector {
    float: right;
    padding-right: 0
}

.item__price--sale {
    color: #1f1f1f80;
    text-decoration: line-through
}

.line--sale .item__price--aftersale {
    margin-left: 6px
}

.line--discounted .item__price {
    color: #000
}

.line__discounts {
    color: #135461
}

.mobile-small {
    display: none
}

.cart__discounts svg {
    width: .9em;
    height: .9em;
    position: relative
}

.cart__discounts svg path {
    stroke: #1f1f1f66 !important;
    fill: none !important
}

.item__total__savings {
    background-color: #1354610d;
    color: #135461;
    padding: 3px 6px;
    border-radius: 3px;
    font-size: 12px
}

.cart__icon--tags svg {
    width: .9em;
    height: .9em;
    position: relative
}

.cart__icon--tags svg path {
    stroke: #135461cc !important;
    fill: none !important
}

.cart .item__price--final,
.cart a, td.details {
    font-size: clamp(10px, .938vw, 18px);
    color: var(--primary-color)
}

.account-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    border-bottom: 1px solid #f0f0f0;
    padding-bottom: .9375rem;
    margin-bottom: 1.875rem
}

.account-header h1 {
    margin-bottom: 0
}

.account-header button,
.account-header .btn,
.account-header .shopify-payment-button .shopify-payment-button__button--unbranded,
.shopify-payment-button .account-header .shopify-payment-button__button--unbranded,
.account-header .spr-summary-actions-newreview {
    margin-bottom: 10px
}

#Login.just {
    text-align: justify
}

#Login.just h2.theme {
    text-align: left
}

#Login {
    text-align: center
}

.account {
    padding: 30px;
    max-width: 960px;
    margin: 0 auto
}

.account .col {
    display: inline-block;
    width: 45%
}

.account form {
    padding: 20px 0
}

.account.form-holder {
    padding-top: 6rem;
}

.account .forgot-password {
    display: inline-block;
    width: 100%;
    padding: 20px 0;
    text-align: right
}

.account .forgot-password a {
    text-decoration: none
}

.account-wrap {
    display: flex;
    justify-content: space-between;
    margin-top: 3rem;
}

.account.form-holder h1 {
    font-family: var(--secondary-font);
    font-size: 3rem;
    font-weight: 300;
}

.errors ul {
    text-align: left;
    color: #b00
}

.account .action-bottom {
    margin-top: 2rem;
}

.action-bottom .note {
    display: block;
    margin: 2rem 10px
}

.note > a {
    margin-left: 5px
}

.align-left .form-field {
    margin: 0 0 15px
}

.account table {
    width: 100%
}

.account table th {
    background: #f7f7f7;
    color: #1f1f1f;
    border: 1px solid #f7f7f7;
    -webkit-backface-visibility: visible
}

.account-sidebar {
    width: 22%
}

.account-sidebar ul {
    list-style: none;
    margin: 3rem 0 0;
    padding-left: 0;
}

.account-sidebar li {
    margin: 8px 0;
    text-transform: uppercase;
}
.account-sidebar li a:active {
    font-weight: 900;
}

.account-main {
    width: 74%
}

.account-main h2.theme,
.account h4.theme {
    text-align: left
}
.account-main h2 {
    font-style: normal;
    font-size: 2rem;
    font-family: var(--secondary-font);
}

.account table.customer-address-table,
.account table.customer-address-table th,
.account table.customer-address-table td {
    border: 0;
    padding: 15px 0 0
}

.account table.customer-address-table input[type=text] {
    width: 100%
}

.address-tables {
    padding-top: 10px
}

.account .edit-address table,
.account .edit-address form {
    margin: 0;
    padding: 0
}

.account .edit-address table td {
    padding: 0 0 15px
}

.account .edit-address select {
    max-width: 150px
}

.account .edit-address label {
    padding: 0 15px 0 0
}

.account table a {
    text-decoration: underline
}

#OrderAddress .col {
    width: auto;
    margin-right: 40px
}

#OrderInfo {
    width: 100%;
    margin-bottom: 30px
}

#OrderInfo p {
    line-height: 1
}

#OrderInfo span.status {
    font-style: italic
}

.account-sidebar--mobile {
    display: none
}

/* Experiences */
#stephanie-anders-piercing-event-amarillo #MainContent, 
#stephanie-anders-piercing-event-fort-worth #MainContent, 
#stephanie-anders-piercing-event #MainContent, #stephanie-anders-december-piercing-party #MainContent, #stephanie-anders-january-piercing-event #MainContent {
    padding:0;
    padding-top: calc(var(--header-height)); 
}
.bookings__details {
    max-width: clamp(363px, 35.417vw, 680px);
    padding: 20px 0 40px;
}

.event-title__text {
  width:100%;
}

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

    .account-sidebar,
    .account-main {
        width: 100%;
        margin: 0 0 20px
    }

    .address-table,
    #AddAddress {
        width: 100%
    }

    .account {
        padding: 15px;
        margin: 0 auto
    }

    .account-sidebar {
        margin: 0 0 20px;
        padding: 0;
        text-align: left;
        min-height: 0;
        position: relative;
        background: #f7f7f7
    }

    .account-sidebar--mobile {
        display: block;
        padding: 15px;
        cursor: pointer;
        position: relative
    }

    .account-sidebar--mobile:after {
        font-family: Icons;
        content: "\e02d";
        position: absolute;
        right: 15px;
        font-size: 75%;
        top: 50%;
        z-index: 10;
        -webkit-transform: translateY(-50%);
        -moz-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        -o-transform: translateY(-50%);
        transform: translateY(-50%)
    }

    .account-sidebar ul {
        position: absolute;
        z-index: 999;
        background: #f7f7f7;
        top: 100%;
        left: 0;
        right: 0;
        max-height: 0;
        overflow: hidden;
        -webkit-transition: max-height .5s ease-in;
        -moz-transition: max-height .5s ease-in;
        -ms-transition: max-height .5s ease-in;
        -o-transition: max-height .5s ease-in;
        transition: max-height .5s ease-in
    }

    .account-sidebar ul.visible {
        max-height: 640px
    }

    .account-sidebar li {
        margin: 0;
        display: block;
        border-top: 1px solid #f0f0f0
    }

    .account-sidebar a {
        display: block;
        padding: 15px
    }
}

@media screen and (max-width: 480px) {
    .account .col {
        width: 100%
    }

    .account .edit-address table td {
        display: block;
        padding: 0 0 10px
    }

    .account table .payment-status,
    .account table .total {
        display: none
    }

    #OrderAddress .col {
        width: 100%;
        margin: 0 0 15px
    }

    #OrderDetailsM,
    #OrderDetailsM td {
        border: 0;
        vertical-align: top
    }

    #OrderDetailsM p {
        margin: 0
    }
}

.order__item__savings {
    margin-top: 10px
}

.order__item--original {
    color: #1f1f1f80;
    text-decoration: line-through
}

.account a {
    color: var(--primary-color)
}

.selector-wrapper {
    margin-top: 40px
}

.selector-wrapper label {
    display: block;
    font-weight: 700
}

.cart table th {
    font-weight: 700;
    font-size: clamp(12px, 1.146vw, 22px);
    border-bottom: 1px solid var(--primary-color)
}
 
.info__subtotal {
    font-weight: 700;
    font-size: clamp(19px, 1.875vw, 36px);
    margin-bottom: clamp(19px, 1.875vw, 36px)
}

.cart-info-container {
    width: 25%;
}
.copilot-banner-widget { display: none!important; }
body#addresses,
body#account,
section.account { background: #fff; }

body#addresses .cta{ max-width: clamp(107px,10.417vw,200px); min-width: clamp(107px,10.417vw,200px); margin-bottom: clamp(67px,6.510vw,125px); }
.old-price{ text-decoration: line-through!important; }


section.instagram-section{ position: relative }
section.instagram-section:before { content: ''; 
                                  top: clamp(13px,1.302vw,25px); 
                                  left: 0px; 
                                  width: 0px; 
                                  transition: all .25s;
                                  pointer-events: none; 
                                  height: calc( 100% - clamp(13px,1.302vw,25px) - clamp(13px,1.302vw,25px) );
                                  border-top: 1px solid var(--secondary-color); border-bottom: 1px solid var(--secondary-color); position: absolute;
                                 }
section.instagram-section.visible:before {
  width: 100%;
}

section.instagram-section container { padding-top: clamp(47px,4.583vw,88px); padding-bottom: clamp(288px,28.125vw,540px); display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: stretch;
    align-items: flex-start; }   
  section.instagram-section container:after{ display: none; }
section.instagram-section container article * { color: var(--secondary-color)!important; }
section.instagram-section container article h2.h1 svg { position: relative; bottom: clamp(3px,0.260vw,5px); }
section.instagram-section container article h2.h1 svg * { fill: var(--secondary-color)!important;  }
section.instagram-section container article em   { font-style: italic; font-family: var(--secondary-font); font-size: clamp(13px,1.302vw,25px); }
section.instagram-section + #insta-feed { top: calc( -1 * clamp(272px,26.563vw,510px) ); margin-bottom: calc( -1 * clamp(221px,21.563vw,414px) );  }

  .instafeed-container img { border: 1px solid var(--secondary-color); }


@media handheld,
only screen and (max-width: 1023px) {
    section.instagram-section+#insta-feed { top: calc( -1 * clamp(304px,94.907vw,971px) ) }
    section.instagram-section container    { padding-bottom: clamp(304px,94.907vw,971px); }
    section.instagram-section container article  { width: 100%; margin-bottom: 40px; }
}