.social-banner{overflow:hidden}.social-banner__title{max-width:700px;margin:0 auto}.social-banner__buttons .btn{background-color:var(--color-sage-green);vertical-align:middle;padding:14px 30px;display:inline-block;transition:color .35s ease-in-out,background-color .35s ease-in-out}.social-banner__buttons .btn:hover,.social-banner__buttons .btn:active{background-color:var(--color-black);color:var(--color-white);transition:color .35s ease-in-out,background-color .35s ease-in-out}.social-banner__buttons svg{display:inline-block}.social-banner__buttons svg .fill{fill:var(--color-black);transition:fill .35s ease-in-out}.social-banner__buttons svg .stroke{stroke:var(--color-black);transition:stroke .35s ease-in-out}.social-banner__buttons .btn:hover svg .fill,.social-banner__buttons .btn:active svg .fill{fill:var(--color-white);transition:fill .35s ease-in-out}.social-banner__buttons .btn:hover svg .stroke,.social-banner__buttons .btn:active svg .stroke{stroke:var(--color-white);transition:stroke .35s ease-in-out}.social-banner__images{position:relative}.social-banner__images--inner{white-space:nowrap;will-change:auto;font-size:0}.social-banner__images .social-image{display:inline-block;position:relative;border-radius:var(--border-radius);margin:0 10px;cursor:pointer;-webkit-tap-highlight-color:rgba(255,255,255,0)}.social-banner__images .social-image img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;transform:scale(1.02);border-radius:var(--border-radius)}.social-banner__images .social-image.odd{width:25%;height:0;padding-bottom:25%}.social-banner__images .social-image.even{width:25%;height:0;padding-bottom:34%}.social-banner__images .social-image.third{width:25%;height:0;padding-bottom:15%}.social-banner__images .social-link{position:absolute;color:var(--color-white);background:#d7d7c9bd;border-radius:100px;z-index:1;font-size:12px;text-transform:uppercase;font-weight:400;padding:6px 10px;font-family:ppsupply;opacity:0;visibility:hidden;transition:opacity .3s ease-in-out,visibility .3s ease-in-out;pointer-events:none}.social-banner__images .social-link.active{opacity:1;visibility:visible;transition:opacity .3s ease-in-out,visibility .3s ease-in-out}.social-banner__images .social-link svg{width:13px;height:13px}.social-banner__images .social-link svg .fill{fill:var(--color-white)}.social-banner__images .social-link svg .stroke{stroke:var(--color-white)}@media only screen and (max-width: 768px){.social-banner__images .social-link{top:50%;left:50%;transform:translate(-50%,-50%)}.social-banner__buttons .btn{padding:14px 20px;margin:0;width:45%}.social-banner__buttons .btn:first-of-type{margin-right:16px}.social-banner__images .social-image.odd{width:45%;padding-bottom:45%}.social-banner__images .social-image.even{width:45%;padding-bottom:64%}.social-banner__images .social-image.third{width:45%;padding-bottom:30%}.social-banner__title{max-width:290px}}.social-banner.homepage .social-banner__buttons .btn{background-color:transparent;vertical-align:middle;color:var(--color-blue);padding:14px 30px;display:inline-block;transition:color .35s ease-in-out,background-color .35s ease-in-out}@media only screen and (max-width: 768px){.social-banner__buttons{display:flex;justify-content:space-between}.social-banner__buttons .btn{padding:14px 16px;margin:0;width:48%}.social-banner__buttons .btn:first-of-type{margin-right:0}.social-banner.homepage .social-banner__buttons .btn{padding:12px 10px}}.social-banner.homepage .social-banner__buttons .btn:hover,.social-banner.homepage .social-banner__buttons .btn:active{background-color:transparent;transition:color .35s ease-in-out,background-color .35s ease-in-out}.social-banner.homepage .social-banner__buttons svg{display:inline-block}.social-banner.homepage .social-banner__buttons svg .fill{fill:var(--color-blue);transition:fill .35s ease-in-out}.social-banner.homepage .social-banner__buttons svg .stroke{stroke:var(--color-blue);transition:stroke .35s ease-in-out}.social-banner.homepage .social-banner__buttons .btn:hover svg .fill,.social-banner.homepage .social-banner__buttons .btn:active svg .fill{fill:var(--color-blue);transition:fill .35s ease-in-out}.social-banner.homepage .social-banner__buttons .btn:hover svg .stroke,.social-banner.homepage .social-banner__buttons .btn:active svg .stroke{stroke:var(--color-blue);transition:stroke .35s ease-in-out}
/*# sourceMappingURL=/cdn/shop/t/22/assets/section-social-banner.css.map */