<?xml version="1.0" encoding="UTF-8"?>
<svg width="27px" height="36px" viewBox="0 0 27 36" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g id="Templates" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="12---Shop-index---Desktop-HD" transform="translate(-479.000000, -7326.000000)">
<g id="elements/blocks/block-shop-search" transform="translate(0.000000, 7106.000000)">
<g id="block-shop-search">
<g transform="translate(342.000000, 102.000000)">
<g>
<g id="icons/icon-map-atoms/icons/icon-map" transform="translate(137.000000, 118.000000)">
<g id="map-marker-alt" fill-rule="nonzero">
<path d="M13.5,2.25 C16.5050156,2.25 19.3301016,3.42021094 21.4549453,5.54505469 C23.5797891,7.66989843 24.75,10.4949844 24.75,13.5 C24.75,18.0344531 23.2950937,19.1580469 13.5,33.3232734 C3.70582031,19.1593125 2.25,18.0347344 2.25,13.5 C2.25,10.4949844 3.42021094,7.66989843 5.54505469,5.54505469 C7.66989844,3.42021094 10.4949844,2.25 13.5,2.25 Z M13.5,9 C11.0186719,9 9,11.0186719 9,13.5 C9,15.9813281 11.0186719,18 13.5,18 C15.9813281,18 18,15.9813281 18,13.5 C18,11.0186719 15.9813281,9 13.5,9 Z" id="Combined-Shape" fill="#F05D61"></path>
<path d="M10.9335938,31.5 L22.1132812,15.75 C22.9170617,14.5814744 23.4561242,13.2338182 23.7304687,11.7070312 C24.0048133,10.1802443 24.0048133,8.5279006 23.7304688,6.75 L25.9101562,11.7070312 L25.9101562,16.171875 L22.1132812,23.4140625 L13.5,35.0859375 L10.9335938,31.5 Z" id="Path-2" fill="#D4484C"></path>
<path d="M13.5,6.75 C9.77800781,6.75 6.75,9.77800781 6.75,13.5 C6.75,17.2219922 9.77800781,20.25 13.5,20.25 C17.2219922,20.25 20.25,17.2219922 20.25,13.5 C20.25,9.77800781 17.2219922,6.75 13.5,6.75 Z M13.5,18 C11.0186719,18 9,15.9813281 9,13.5 C9,11.0186719 11.0186719,9 13.5,9 C15.9813281,9 18,11.0186719 18,13.5 C18,15.9813281 15.9813281,18 13.5,18 Z M13.5,0 C6.04413281,0 0,6.04413288 0,13.5 C0,18.9431018 1.89632813,20.4631174 12.1125938,35.2736723 C12.7829531,36.242016 14.2169766,36.2421567 14.8874766,35.2736723 C25.1036719,20.4631174 27,18.9431018 27,13.5 C27,6.04413288 20.9558672,0 13.5,0 Z M13.5,33.3232734 C3.70582031,19.1593125 2.25,18.0347344 2.25,13.5 C2.25,10.4949844 3.42021094,7.66989843 5.54505469,5.54505469 C7.66989844,3.42021094 10.4949844,2.25 13.5,2.25 C16.5050156,2.25 19.3301016,3.42021094 21.4549453,5.54505469 C23.5797891,7.66989843 24.75,10.4949844 24.75,13.5 C24.75,18.0344531 23.2950937,19.1580469 13.5,33.3232734 Z" id="Shape" fill="#4C4636"></path>
</g>
<path d="M6.49992344,8.96756592 C8.7910422,8.96756592 10.6483609,8.55832621 10.6483609,8.05350344 C10.6483609,7.54868067 8.8213067,6.57644337 6.53018794,6.57644337 C4.23906917,6.57644337 2.35148594,7.54868067 2.35148594,8.05350344 C2.35148594,8.55832621 4.20880467,8.96756592 6.49992344,8.96756592 Z" id="Oval" fill="#FFC6C6" transform="translate(6.499923, 7.772005) rotate(-51.000000) translate(-6.499923, -7.772005) "></path>
</g>
</g>
</g>
</g>
</g>
</g>
</g>
</svg>
<?xml version="1.0" encoding="UTF-8"?>
<svg width="27px" height="36px" viewBox="0 0 27 36" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g id="Templates" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="12---Shop-index---Desktop-HD" transform="translate(-479.000000, -7326.000000)">
<g id="elements/blocks/block-shop-search" transform="translate(0.000000, 7106.000000)">
<g id="block-shop-search">
<g transform="translate(342.000000, 102.000000)">
<g>
<g id="icons/icon-map-atoms/icons/icon-map" transform="translate(137.000000, 118.000000)">
<g id="map-marker-alt" fill-rule="nonzero">
<path d="M13.5,2.25 C16.5050156,2.25 19.3301016,3.42021094 21.4549453,5.54505469 C23.5797891,7.66989843 24.75,10.4949844 24.75,13.5 C24.75,18.0344531 23.2950937,19.1580469 13.5,33.3232734 C3.70582031,19.1593125 2.25,18.0347344 2.25,13.5 C2.25,10.4949844 3.42021094,7.66989843 5.54505469,5.54505469 C7.66989844,3.42021094 10.4949844,2.25 13.5,2.25 Z M13.5,9 C11.0186719,9 9,11.0186719 9,13.5 C9,15.9813281 11.0186719,18 13.5,18 C15.9813281,18 18,15.9813281 18,13.5 C18,11.0186719 15.9813281,9 13.5,9 Z" id="Combined-Shape" fill="#F05D61"></path>
<path d="M10.9335938,31.5 L22.1132812,15.75 C22.9170617,14.5814744 23.4561242,13.2338182 23.7304687,11.7070312 C24.0048133,10.1802443 24.0048133,8.5279006 23.7304688,6.75 L25.9101562,11.7070312 L25.9101562,16.171875 L22.1132812,23.4140625 L13.5,35.0859375 L10.9335938,31.5 Z" id="Path-2" fill="#D4484C"></path>
<path d="M13.5,6.75 C9.77800781,6.75 6.75,9.77800781 6.75,13.5 C6.75,17.2219922 9.77800781,20.25 13.5,20.25 C17.2219922,20.25 20.25,17.2219922 20.25,13.5 C20.25,9.77800781 17.2219922,6.75 13.5,6.75 Z M13.5,18 C11.0186719,18 9,15.9813281 9,13.5 C9,11.0186719 11.0186719,9 13.5,9 C15.9813281,9 18,11.0186719 18,13.5 C18,15.9813281 15.9813281,18 13.5,18 Z M13.5,0 C6.04413281,0 0,6.04413288 0,13.5 C0,18.9431018 1.89632813,20.4631174 12.1125938,35.2736723 C12.7829531,36.242016 14.2169766,36.2421567 14.8874766,35.2736723 C25.1036719,20.4631174 27,18.9431018 27,13.5 C27,6.04413288 20.9558672,0 13.5,0 Z M13.5,33.3232734 C3.70582031,19.1593125 2.25,18.0347344 2.25,13.5 C2.25,10.4949844 3.42021094,7.66989843 5.54505469,5.54505469 C7.66989844,3.42021094 10.4949844,2.25 13.5,2.25 C16.5050156,2.25 19.3301016,3.42021094 21.4549453,5.54505469 C23.5797891,7.66989843 24.75,10.4949844 24.75,13.5 C24.75,18.0344531 23.2950937,19.1580469 13.5,33.3232734 Z" id="Shape" fill="#4C4636"></path>
</g>
<path d="M6.49992344,8.96756592 C8.7910422,8.96756592 10.6483609,8.55832621 10.6483609,8.05350344 C10.6483609,7.54868067 8.8213067,6.57644337 6.53018794,6.57644337 C4.23906917,6.57644337 2.35148594,7.54868067 2.35148594,8.05350344 C2.35148594,8.55832621 4.20880467,8.96756592 6.49992344,8.96756592 Z" id="Oval" fill="#FFC6C6" transform="translate(6.499923, 7.772005) rotate(-51.000000) translate(-6.499923, -7.772005) "></path>
</g>
</g>
</g>
</g>
</g>
</g>
</g>
</svg>
{
"icons": [
"facebook",
"instagram",
"youtube",
"location",
"heart",
"user-with-animals",
"enveloppe",
"bars"
]
}
.icon {
position: relative;
display: inline-block;
vertical-align: middle;
}
.icon, .icon-after {
&::after {
content: '';
display: block;
min-width: 30px;
min-height: 30px;
background-repeat: no-repeat;
background-position: center;
background-size: contain;
}
&--enveloppe {
&::after {
min-width: 25px;
min-height: 25px;
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='29' height='21' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M25.594 0H2.648C1.185 0 0 1.175 0 2.625v15.75C0 19.825 1.185 21 2.648 21h22.946c1.462 0 2.647-1.175 2.647-2.625V2.625c0-1.45-1.185-2.625-2.647-2.625zm0 2.625v2.232c-1.237.998-3.209 2.55-7.424 5.823-.929.725-2.769 2.465-4.05 2.445-1.28.02-3.12-1.72-4.049-2.445-4.214-3.272-6.186-4.825-7.423-5.823V2.625h22.946zM2.648 18.375V8.225c1.264.998 3.056 2.399 5.788 4.52 1.206.94 3.317 3.018 5.685 3.005 2.356.013 4.44-2.034 5.684-3.005a935.942 935.942 0 0 0 5.789-4.52v10.15H2.648z' fill='%23000' fill-rule='nonzero'/%3E%3C/svg%3E");
}
&--gray {
&::after {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='29' height='21' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M25.594 0H2.648C1.185 0 0 1.175 0 2.625v15.75C0 19.825 1.185 21 2.648 21h22.946c1.462 0 2.647-1.175 2.647-2.625V2.625c0-1.45-1.185-2.625-2.647-2.625zm0 2.625v2.232c-1.237.998-3.209 2.55-7.424 5.823-.929.725-2.769 2.465-4.05 2.445-1.28.02-3.12-1.72-4.049-2.445-4.214-3.272-6.186-4.825-7.423-5.823V2.625h22.946zM2.648 18.375V8.225c1.264.998 3.056 2.399 5.788 4.52 1.206.94 3.317 3.018 5.685 3.005 2.356.013 4.44-2.034 5.684-3.005a935.942 935.942 0 0 0 5.789-4.52v10.15H2.648z' fill='%23908975' fill-rule='nonzero'/%3E%3C/svg%3E");
}
}
}
// This version is an illustration with only one color
&--location {
&::after {
min-width: 27px;
min-height: 36px;
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='27' height='36' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill-rule='nonzero'%3E%3Cpath d='M13.5 33.323C3.706 19.16 2.25 18.035 2.25 13.5c0-3.005 1.17-5.83 3.295-7.955A11.176 11.176 0 0 1 13.5 2.25c3.005 0 5.83 1.17 7.955 3.295A11.176 11.176 0 0 1 24.75 13.5c0 4.534-1.455 5.658-11.25 19.823zM13.5 18c2.481 0 4.5-2.019 4.5-4.5S15.981 9 13.5 9A4.505 4.505 0 0 0 9 13.5c0 2.481 2.019 4.5 4.5 4.5z' fill='%23F05D61'/%3E%3Cpath d='M10.934 31.5l11.18-15.75c.803-1.169 1.342-2.516 1.616-4.043.275-1.527.275-3.18 0-4.957l2.18 4.957v4.465l-3.797 7.242L13.5 35.086 10.934 31.5z' fill='%23D4484C'/%3E%3Cpath d='M13.5 6.75a6.758 6.758 0 0 0-6.75 6.75 6.758 6.758 0 0 0 6.75 6.75 6.758 6.758 0 0 0 6.75-6.75 6.758 6.758 0 0 0-6.75-6.75zm0 11.25A4.505 4.505 0 0 1 9 13.5C9 11.019 11.019 9 13.5 9s4.5 2.019 4.5 4.5-2.019 4.5-4.5 4.5zm0-18C6.044 0 0 6.044 0 13.5c0 5.443 1.896 6.963 12.113 21.774.67.968 2.104.968 2.774 0C25.104 20.464 27 18.944 27 13.5 27 6.044 20.956 0 13.5 0zm0 33.323C3.706 19.16 2.25 18.035 2.25 13.5c0-3.005 1.17-5.83 3.295-7.955A11.176 11.176 0 0 1 13.5 2.25c3.005 0 5.83 1.17 7.955 3.295A11.176 11.176 0 0 1 24.75 13.5c0 4.534-1.455 5.658-11.25 19.823z' fill='%234C4636'/%3E%3C/g%3E%3Cpath d='M7.429 8.524c1.442-1.78 2.293-3.481 1.9-3.799-.392-.317-2.297.49-3.74 2.271-1.441 1.78-1.873 3.86-1.481 4.177.392.318 1.88-.868 3.321-2.649z' fill='%23FFC6C6'/%3E%3C/g%3E%3C/svg%3E");
}
}
// This version is an illustration with only one color
&--facebook {
&::after {
min-width: 38px;
min-height: 38px;
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='38' height='38' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill-rule='nonzero' fill='none'%3E%3Cpath d='M36 3.9V34c0 1-.8 1.9-1.9 1.9h-8.6V22.8h4.4l.6-5.1h-5v-3.3c0-1.5.4-2.5 2.5-2.5h2.7V7.3l-4-.2c-3.9 0-6.6 2.4-6.6 6.8v3.8h-4.4v5.1h4.4V36H4c-1 0-1.9-.8-1.9-1.9V4C2 2.9 2.8 2 3.9 2H34c1 0 1.9.8 1.9 1.9z' fill='%230889F1'/%3E%3Cpath d='M16.9 21.7h4.4V37H3.9a3 3 0 01-3-3V4a3 3 0 013-3H34a3 3 0 013 3V34a3 3 0 01-3 3h-9.8V21.7H29l.3-2.9h-4.9v-4.4c0-2.3 1.1-3.6 3.7-3.6h1.6V8.4a41 41 0 00-2.9-.1c-3.4 0-5.4 2-5.4 5.6v5h-4.4v2.8zm9.7 13.2h7.5c.4 0 .8-.4.8-.8V4c0-.4-.4-.8-.8-.8H4c-.4 0-.8.4-.8.8V34c0 .4.4.8.8.8H19v-11h-4.4v-7.3H19v-2.7c0-4.9 3-8 7.7-8 1.6 0 3.3.2 4.2.3l1 .1v6.8h-4c-.6 0-1 0-1.1.3-.1.1-.2.4-.2 1v2.2h5.2l-1 7.4h-4.2v10.9z' fill='%2300335D'/%3E%3C/g%3E%3C/svg%3E");
}
}
// This version is an illustration with only one color
&--instagram {
&::after {
min-width: 38px;
min-height: 38px;
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='38' height='38' xmlns='http://www.w3.org/2000/svg'%3E%3Cdefs%3E%3ClinearGradient x1='84.3%25' y1='14.7%25' x2='19.1%25' y2='82.7%25' id='a'%3E%3Cstop stop-color='%23FFDC80' offset='0%25'/%3E%3Cstop stop-color='%23FCAF45' offset='37.1%25'/%3E%3Cstop stop-color='%23F56040' offset='68.2%25'/%3E%3Cstop stop-color='%23E1306C' offset='100%25'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cpath d='M26 1a12 12 0 0112 12v13a12 12 0 01-12 12H12A12 12 0 010 26V13A12 12 0 0112 1h14zm-7.5 10a7.5 7.5 0 100 15 7.5 7.5 0 000-15z' fill='url(%23a)'/%3E%3Cpath d='M19 10.3a8.7 8.7 0 100 17.4 8.7 8.7 0 000-17.4zm0 15a6.3 6.3 0 110-12.7 6.3 6.3 0 010 12.7zM31.4 9a2.3 2.3 0 11-4.5 0 2.3 2.3 0 114.5 0zm6.5 2.3c-.2-3-.9-5.8-3.1-8s-5-3-8-3a230 230 0 00-15.6 0c-3 0-5.8.8-8 3s-3 5-3 8c-.2 3-.2 12.5 0 15.6 0 3 .8 5.8 3 8s5 3 8 3c3.1.2 12.5.2 15.6 0 3 0 5.8-.8 8-3s3-5 3-8c.2-3.1.2-12.5 0-15.6zm-3.1 19.7c-.7 1.8-2.1 3.2-3.9 3.9-2.6 1-9 .8-11.9.8-3 0-9.3.2-12-.8-1.7-.7-3-2.1-3.8-3.9-1-2.6-.8-9-.8-11.9 0-3-.2-9.3.8-12C4 5.4 5.3 4 7.1 3.3c2.6-1 9-.8 11.9-.8 3 0 9.3-.2 12 .8 1.7.7 3 2.1 3.8 3.9 1 2.6.8 9 .8 11.9 0 3 .2 9.3-.8 12z' fill='%2333243D' fill-rule='nonzero'/%3E%3C/g%3E%3C/svg%3E");
}
}
// This version is an illustration with only one color
&--youtube {
&::after {
min-width: 54px;
min-height: 40px;
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='56' height='40' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill-rule='nonzero' fill='none'%3E%3Cpath d='M53.9 7A6.8 6.8 0 0049 2C44.9 1 28 1 28 1S11.1 1 6.9 2.1A6.8 6.8 0 002.1 7C1 11.2 1 20 1 20S1 29 2.1 33.1A6.7 6.7 0 007 38C11.1 39 28 39 28 39s16.9 0 21.1-1.1a6.7 6.7 0 004.8-4.8c1.1-4.2 1.1-13 1.1-13s0-9-1.1-13.2zM22.5 28V12l14 8-14 8z' fill='red'/%3E%3Cpath d='M53.9 7A6.8 6.8 0 0049 2C44.9 1 28 1 28 1S11.1 1 6.9 2.1A6.8 6.8 0 002.1 7C1 11.2 1 20 1 20S1 29 2.1 33.1A6.7 6.7 0 007 38C11.1 39 28 39 28 39s16.9 0 21.1-1.1a6.7 6.7 0 004.8-4.8c1.1-4.2 1.1-13 1.1-13s0-9-1.1-13.2zM22.5 28V12l14 8-14 8z' stroke='%234B110A' stroke-width='2'/%3E%3C/g%3E%3C/svg%3E");
}
}
// This version is an illustration with only one color
&--user-with-animals {
&::after {
min-width: 44px;
min-height: 34px;
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='44' height='34' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg stroke='%234C4636'%3E%3Cpath d='M30.466 17.848c-.03-2.079.108-2.8.943-3.115.89-.336 1.607.218 2.908 1.783a6.488 6.488 0 0 1 2.315.393 6.48 6.48 0 0 1 2.31 1.447c1.899-.186 2.982.006 3.423.95.443.953-.111 1.888-1.477 3.168a6.5 6.5 0 1 1-10.421-4.626z' stroke-width='2' fill='%23FFF'/%3E%3Cpath d='M32.5 20.5l.5-1M36.5 22.77l.5-1.27' stroke-linecap='round'/%3E%3C/g%3E%3Cg stroke='%234C4636'%3E%3Cpath d='M3.958 22.225a40.525 40.525 0 0 1-.97-1.561 2.712 2.712 0 0 1-.32.203 1.268 1.268 0 0 1-.496.163 1.05 1.05 0 0 1-1.1-.656c-.479-1.188.718-3.887 1.48-4.268 1.156-.578 2.271.123 3.58 1.848.338-.258.738-.5 1.237-.766.13-.069.262-.133.395-.193a1.024 1.024 0 0 1-.723-.712C6.631 14.894 8.222 12.5 9.5 12.5c1.539 0 2.714 1.499 3.823 4.351.996.723 2.363 2.134 2.837 3.025a6.5 6.5 0 0 1-2.688 8.79l-.163.088a35.98 35.98 0 0 1-1.848.94c-2.7 1.26-4.717 1.487-6.174.008-.436-.443-.482-.83-.546-2.397l-.003-.084c-.032-.808-.07-1.266-.057-1.242a6.474 6.474 0 0 1-.723-3.754z' stroke-width='2' fill='%23E5A462'/%3E%3Cpath d='M7 22l1.5 2M10 20l1.5 2' stroke-linecap='round'/%3E%3C/g%3E%3Cpath d='M34.857 30.813a1.07 1.07 0 0 1-1.071 1.062H10.214a1.07 1.07 0 0 1-1.071-1.063V28.05c0-3.752 3.074-6.8 6.857-6.8 1.312 0 2.618 1.063 6 1.063 3.375 0 4.687-1.063 6-1.063 3.783 0 6.857 3.048 6.857 6.8v2.762z' fill='%23B9EF62' fill-rule='nonzero'/%3E%3Cpath d='M13.429 21.25c2.793 1.837 5.65 2.756 8.571 2.756 2.92 0 5.778-.919 8.571-2.756l-2.142-.996L22 21.25l-6.027-.996-2.544.996z' fill='%2398C551'/%3E%3Cpath d='M22 2.125c3.542 0 6.429 2.862 6.429 6.375S25.542 14.875 22 14.875c-3.542 0-6.429-2.862-6.429-6.375S18.458 2.125 22 2.125z' fill='%23F4D1D2' fill-rule='nonzero'/%3E%3Cpath d='M19.254 7.404v1.76c0 .367.3.664.67.664.37 0 .67-.297.67-.664v-1.76c0-.366-.3-.664-.67-.664-.37 0-.67.298-.67.664zM23.272 7.404v1.76c0 .367.3.664.67.664.37 0 .67-.297.67-.664v-1.76c0-.366-.3-.664-.67-.664-.37 0-.67.298-.67.664z' fill='%234C4636' fill-rule='nonzero'/%3E%3Cpath d='M15.973 3.719c1.853 1.55 4.465 2.324 7.835 2.324s4.91-.564 4.62-1.693l-4.62-2.922H19.79l-3.817 2.29z' fill='%23FF9400'/%3E%3Cpath d='M17.982 4.383c1.51.535 2.648.867 3.415.996.767.129 1.694.206 2.78.232-.77-.372-1.697-.648-2.78-.83a35.922 35.922 0 0 0-3.415-.398z' fill='%23FFD133'/%3E%3Cpath d='M22 17c4.734 0 8.571-3.805 8.571-8.5S26.734 0 22 0s-8.571 3.805-8.571 8.5S17.266 17 22 17zm0-14.875c3.542 0 6.429 2.862 6.429 6.375S25.542 14.875 22 14.875c-3.542 0-6.429-2.862-6.429-6.375S18.458 2.125 22 2.125zM28 19.125c4.969 0 9 3.998 9 8.925v2.762C37 32.572 35.56 34 33.786 34H10.214C8.44 34 7 32.572 7 30.812V28.05c0-4.927 4.031-8.925 9-8.925 1.929 0 2.846 1.063 6 1.063s4.078-1.063 6-1.063zm6.857 11.688V28.05c0-3.752-3.074-6.8-6.857-6.8-1.313 0-2.625 1.063-6 1.063-3.382 0-4.688-1.063-6-1.063-3.783 0-6.857 3.048-6.857 6.8v2.762a1.07 1.07 0 0 0 1.071 1.063h23.572a1.07 1.07 0 0 0 1.071-1.063z' fill='%234C4636' fill-rule='nonzero'/%3E%3Cpath d='M15.571 31.875v-3.486a.267.267 0 0 0-.267-.266.267.267 0 0 0-.268.266v3.486c0 .147.12.266.268.266a.267.267 0 0 0 .267-.266zM28.964 31.875v-3.486a.267.267 0 0 0-.268-.266.267.267 0 0 0-.267.266v3.486c0 .147.12.266.267.266a.267.267 0 0 0 .268-.266z' fill='%234C4636' fill-rule='nonzero'/%3E%3C/g%3E%3C/svg%3E");
}
}
// This version is an illustration with only one color
&--heart {
&::after {
min-width: 32px;
min-height: 28px;
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='32' height='28' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cpath d='M28.083 13.519L16.056 26.006 3.98 13.52c-2.396-2.475-2.895-7.194.48-10.075 3.418-2.925 7.436-.807 8.908.718L16.03 6.92l2.664-2.757c1.447-1.5 5.501-3.625 8.907-.718 3.369 2.875 2.876 7.594.48 10.075z' fill='%23F05D61' fill-rule='nonzero'/%3E%3Cpath d='M13.567 24.563L25.887 12c1.169-1.19 2-2.524 2.495-4a8.948 8.948 0 0 0 .343-4.469l2.589 3.75-.718 3.907-2.214 4.156-11.696 11.625-3.119-2.407z' fill='%23D4484C'/%3E%3Cellipse fill='%23FFC6C6' transform='rotate(38 6.497 6.655)' cx='6.497' cy='6.655' rx='2.558' ry='4.344'/%3E%3Cpath d='M28.9 1.919c-3.4-2.9-8.484-2.419-11.64.844l-1.229 1.275-1.229-1.27c-2.545-2.637-7.678-4.224-11.64-.85-3.917 3.35-4.123 9.363-.617 12.988l12.07 12.488c.387.4.898.606 1.41.606.511 0 1.023-.2 1.41-.606l12.07-12.488c3.518-3.625 3.312-9.637-.605-12.987zm-.817 11.6L16.056 26.006 3.98 13.52c-2.396-2.475-2.895-7.194.48-10.075 3.418-2.925 7.436-.806 8.908.719l2.663 2.756 2.664-2.756c1.447-1.5 5.501-3.626 8.907-.72 3.369 2.876 2.876 7.595.48 10.076z' fill='%234C4636' fill-rule='nonzero'/%3E%3C/g%3E%3C/svg%3E");
}
}
&--bars {
&::after {
min-width: 25px;
min-height: 25px;
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg aria-hidden='true' data-prefix='fas' data-icon='bars' class='svg-inline--fa fa-bars fa-w-14' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath fill='%23000' d='M16 132h416c8.837 0 16-7.163 16-16V76c0-8.837-7.163-16-16-16H16C7.163 60 0 67.163 0 76v40c0 8.837 7.163 16 16 16zm0 160h416c8.837 0 16-7.163 16-16v-40c0-8.837-7.163-16-16-16H16c-8.837 0-16 7.163-16 16v40c0 8.837 7.163 16 16 16zm0 160h416c8.837 0 16-7.163 16-16v-40c0-8.837-7.163-16-16-16H16c-8.837 0-16 7.163-16 16v40c0 8.837 7.163 16 16 16z'/%3E%3C/svg%3E");
}
}
&--search {
&::after {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='27' height='27' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cpath d='M25.807 24.534l-6.547-6.571a.601.601 0 0 0-.431-.179h-.523a10.572 10.572 0 0 0 2.807-7.188C21.113 4.743 16.388 0 10.556 0 4.725 0 0 4.743 0 10.596c0 5.854 4.725 10.596 10.556 10.596 2.766 0 5.279-1.07 7.161-2.812v.52c0 .163.066.316.178.433l6.547 6.572c.239.24.624.24.863 0l.502-.505a.613.613 0 0 0 0-.866zm-15.25-4.972c-4.939 0-8.933-4.009-8.933-8.966 0-4.957 3.994-8.966 8.932-8.966 4.939 0 8.933 4.01 8.933 8.966 0 4.957-3.994 8.966-8.933 8.966z' fill='%234C4636' fill-rule='nonzero'/%3E%3Cpath d='M10.556 19.562c-4.938 0-8.932-4.009-8.932-8.966 0-4.957 3.994-8.966 8.932-8.966 4.939 0 8.933 4.01 8.933 8.966 0 4.957-3.994 8.966-8.933 8.966z' fill='%2350A8EF' fill-rule='nonzero'/%3E%3Cpath d='M6.205 18.43a8.963 8.963 0 0 1-4.58-7.834c0-4.957 3.993-8.966 8.931-8.966 2.275 0 4.349.85 5.925 2.253A8.875 8.875 0 0 0 12.13 2.75c-4.938 0-8.933 4.01-8.933 8.966a8.957 8.957 0 0 0 3.008 6.714z' fill='%23097BD7' fill-rule='nonzero'/%3E%3Cellipse fill='%23BFE1FC' transform='rotate(23 16.22 12.846)' cx='16.219' cy='12.846' rx='2.106' ry='3.158'/%3E%3Cellipse fill='%23BFE1FC' cx='13.5' cy='17.117' rx='1' ry='1'/%3E%3Crect fill='%23B89975' transform='rotate(-45 21.974 21.98)' x='19.741' y='17.141' width='4.466' height='9.679' rx='2.233'/%3E%3Crect fill='%238E7557' transform='rotate(-45 21.138 22.517)' x='20.301' y='18.289' width='1.675' height='8.457' rx='.837'/%3E%3Cpath d='M18.012 18.018a3 3 0 0 1 4.242.008l3.674 3.674a3 3 0 0 1 .008 4.243 3 3 0 0 1-4.242-.008l-3.674-3.674a3 3 0 0 1-.008-4.243zm1.08 1.08a1.475 1.475 0 0 0 .004 2.086l3.674 3.674c.577.577 1.511.58 2.086.004a1.475 1.475 0 0 0-.004-2.085l-3.674-3.674a1.475 1.475 0 0 0-2.086-.004z' fill='%234C4636' fill-rule='nonzero'/%3E%3C/g%3E%3C/svg%3E");
}
}
&--plus {
&::after {
min-width: 25px;
min-height: 25px;
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg aria-hidden='true' data-prefix='far' data-icon='plus' class='svg-inline--fa fa-plus fa-w-12' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 384 512'%3E%3Cpath fill='%23FFF' d='M368 224H224V80a16 16 0 00-16-16h-32a16 16 0 00-16 16v144H16a16 16 0 00-16 16v32a16 16 0 0016 16h144v144a16 16 0 0016 16h32a16 16 0 0016-16V288h144a16 16 0 0016-16v-32a16 16 0 00-16-16z'/%3E%3C/svg%3E");
}
}
&--chevron-left {
&::after {
min-width: 10px;
min-height: 15px;
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg aria-hidden='true' data-prefix='far' data-icon='chevron-left' class='svg-inline--fa fa-chevron-left fa-w-8' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 512'%3E%3Cpath fill='%23332D2D' d='M231.293 473.899l19.799-19.799c4.686-4.686 4.686-12.284 0-16.971L70.393 256 251.092 74.87c4.686-4.686 4.686-12.284 0-16.971L231.293 38.1c-4.686-4.686-12.284-4.686-16.971 0L4.908 247.515c-4.686 4.686-4.686 12.284 0 16.971L214.322 473.9c4.687 4.686 12.285 4.686 16.971-.001z'/%3E%3C/svg%3E");
}
&--yellow {
&::after {
min-width: 10px;
min-height: 15px;
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg aria-hidden='true' data-prefix='fas' data-icon='chevron-left' class='svg-inline--fa fa-chevron-left fa-w-10' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath fill='%23F5CF00' d='M34.5 239L229 44.7a24 24 0 0134 0l22.6 22.7a24 24 0 010 33.9L131.5 256l154 154.8a24 24 0 010 33.8l-22.7 22.7a24 24 0 01-34 0L34.6 273a24 24 0 010-34z'/%3E%3C/svg%3E");
}
}
}
&--chevron-down {
&::after {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg aria-hidden='true' data-prefix='far' data-icon='chevron-down' class='svg-inline--fa fa-chevron-down fa-w-14' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath fill='%23000' d='M441.9 167.3l-19.8-19.8a12 12 0 00-17 0L224 328.2 42.9 147.5a12 12 0 00-17 0L6.1 167.3a12 12 0 000 17l209.4 209.4a12 12 0 0017 0l209.4-209.4a12 12 0 000-17z'/%3E%3C/svg%3E");
}
}
&--chevron-right {
&::after {
min-width: 10px;
min-height: 15px;
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg aria-hidden='true' data-prefix='fas' data-icon='chevron-right' class='svg-inline--fa fa-chevron-right fa-w-10' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath fill='%23332D2D' d='M285.476 272.971L91.132 467.314c-9.373 9.373-24.569 9.373-33.941 0l-22.667-22.667c-9.357-9.357-9.375-24.522-.04-33.901L188.505 256 34.484 101.255c-9.335-9.379-9.317-24.544.04-33.901l22.667-22.667c9.373-9.373 24.569-9.373 33.941 0L285.475 239.03c9.373 9.372 9.373 24.568.001 33.941z'/%3E%3C/svg%3E");
}
&-red {
&::after {
min-width: 10px;
min-height: 15px;
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg aria-hidden='true' data-prefix='fas' data-icon='chevron-right' class='svg-inline--fa fa-chevron-right fa-w-10' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath fill='%23E42813' d='M285.476 272.971L91.132 467.314c-9.373 9.373-24.569 9.373-33.941 0l-22.667-22.667c-9.357-9.357-9.375-24.522-.04-33.901L188.505 256 34.484 101.255c-9.335-9.379-9.317-24.544.04-33.901l22.667-22.667c9.373-9.373 24.569-9.373 33.941 0L285.475 239.03c9.373 9.372 9.373 24.568.001 33.941z'/%3E%3C/svg%3E");
}
}
&--yellow {
&::after {
min-width: 10px;
min-height: 15px;
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg aria-hidden='true' data-prefix='fas' data-icon='chevron-right' class='svg-inline--fa fa-chevron-right fa-w-10' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath fill='%23F5CF00' d='M285.5 273L91 467.3a24 24 0 01-34 0l-22.6-22.7a24 24 0 010-33.9l154-154.7-154-154.7a24 24 0 010-34l22.7-22.6a24 24 0 0134 0L285.4 239a24 24 0 010 34z'/%3E%3C/svg%3E");
}
}
}
&--arrow-top {
&::after {
min-width: 12px;
min-height: 13px;
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='14' height='15' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='%234C4636' stroke-width='2' fill='none' fill-rule='evenodd' stroke-linecap='round'%3E%3Cpath stroke-linejoin='round' d='M1 7l6-6 6 6'/%3E%3Cpath d='M7 2.5v11'/%3E%3C/g%3E%3C/svg%3E");
}
}
&--arrow-down {
&::after {
min-width: 20px;
min-height: 19px;
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg aria-hidden='true' data-prefix='fas' data-icon='arrow-down' class='svg-inline--fa fa-arrow-down fa-w-14' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath fill='%23fff' d='M413.1 222.5l22.2 22.2a23.9 23.9 0 010 33.9L241 473a23.9 23.9 0 01-33.9 0L12.7 278.6a23.9 23.9 0 010-33.9l22.2-22.2a24 24 0 0134.3.4L184 343.4V56a24 24 0 0124-24h32a24 24 0 0124 24v287.4l114.8-120.5c9.3-9.8 24.8-10 34.3-.4z'/%3E%3C/svg%3E");
}
}
&--arrow-right {
z-index: 300;
&::after {
min-width: 15px;
min-height: 15px;
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='15' height='15' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='%234C4636' stroke-width='2' fill='none' fill-rule='evenodd' stroke-linecap='round'%3E%3Cpath stroke-linejoin='round' d='M7.5 13.5l6-6-6-6'/%3E%3Cpath d='M12 7.5H1'/%3E%3C/g%3E%3C/svg%3E");
}
}
&--more {
&::after {
min-width: 20px;
min-height: 20px;
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='19' height='19' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16.5 8.1a1.5 1.5 0 011.6 1.6 1.5 1.5 0 01-1.6 1.6h-5.6v5.6c0 .4-.2.8-.5 1.1-.3.3-.6.5-1.1.5-.5 0-.8-.2-1.1-.5-.3-.3-.5-.7-.5-1.1v-5.6H2.1A1.5 1.5 0 01.5 9.7a1.5 1.5 0 011.6-1.6h5.6V2.5A1.5 1.5 0 019.3.9a1.5 1.5 0 011.6 1.6v5.6h5.6z' fill='%23FFF' fill-rule='nonzero'/%3E%3C/svg%3E");
}
}
}
.icon--svg-heart {
max-width: 40px;
width: 40px;
height: auto;
& > g { transform: translate(4px, 6px) }
.svg-heart-body { fill: $c-white }
.svg-heart-shadow { fill: rgba($c-blue, .4) }
.svg-heart-light { opacity: 0 }
.svg-heart-border { fill: $c-blue }
path { transition: .3s ease }
}
There are no notes for this item.