.shade-finder{padding-top:0}.shade-finder .filter-container{align-items:center;display:flex;justify-content:flex-end;padding-bottom:0}@media only screen and (max-width:519px){.shade-finder .filter-container{flex-direction:column}}.shade-finder .select-container{display:flex}.shade-finder .select-container .filter{--select-padding:16px;display:block;margin-left:16px;min-width:160px;outline:1px solid var(--border);position:relative}.shade-finder .shade-variant-card{background-image:var(--image1);background-repeat:no-repeat;background-size:cover;box-sizing:border-box;flex-basis:20%;position:relative}@media only screen and (max-width:519px){.shade-finder .shade-variant-card{flex-basis:50%}}.shade-finder .shade-variant-card .card-content{display:none}.shade-finder .shade-variant-card:before{content:"";display:block;padding-top:100%}.shade-finder .shade-variant-card:focus,.shade-finder .shade-variant-card:focus-within,.shade-finder .shade-variant-card:hover{background-color:var(--variant-hex);background-image:var(--hover-image)}.shade-finder .shade-variant-card:focus .card-content,.shade-finder .shade-variant-card:focus-within .card-content,.shade-finder .shade-variant-card:hover .card-content{--font-color:var(--black);align-items:center;display:flex;flex-direction:column;height:100%;justify-content:center;left:0;padding:8px;position:absolute;top:0;width:100%}.shade-finder .shade-variant-card:focus .card-content .shade-button,.shade-finder .shade-variant-card:focus-within .card-content .shade-button,.shade-finder .shade-variant-card:hover .card-content .shade-button{background-color:transparent;border:none;text-decoration:underline;visibility:inherit}.shade-finder .shade-variant-card:focus .card-content .shade-button:hover,.shade-finder .shade-variant-card:focus-within .card-content .shade-button:hover,.shade-finder .shade-variant-card:hover .card-content .shade-button:hover{color:var(--link)}.shade-finder .shade-variant-card:focus .card-content .heading,.shade-finder .shade-variant-card:focus-within .card-content .heading,.shade-finder .shade-variant-card:hover .card-content .heading{margin:0}.shade-finder .shade-variant-card:focus .card-content .variant-shade,.shade-finder .shade-variant-card:focus-within .card-content .variant-shade,.shade-finder .shade-variant-card:hover .card-content .variant-shade{margin:8px 0}@media only screen and (max-width:519px){.shade-finder .shade-variant-card:focus .card-content .variant-shade,.shade-finder .shade-variant-card:focus-within .card-content .variant-shade,.shade-finder .shade-variant-card:hover .card-content .variant-shade{margin:5px 0}}@media only screen and (min-width:992px){.shade-finder .filter:focus,.shade-finder .shade-button:focus,.shade-finder .shade-variant-card:focus{outline:2px solid var(--brand-dark)}}.shade-finder .selected-border{outline:1px solid var(--brand-dark)}.shades-header{padding-bottom:0}.shades-container{display:flex;flex-wrap:wrap;padding-top:0}.filter-count{color:var(--brand-dark)}