@coopdigital/shared-component--hero
Version:
Co-op Shared Component: Hero
177 lines (171 loc) • 20.2 kB
HTML
<div class="coop-c-hero coop-c-hero--squircle">
<div class="coop-c-hero__inner coop-u-clearfix">
<h1 class="coop-c-hero__title">Supporting communities</h1>
<div class="coop-c-hero__body">
<p>Find out what community and the power of local people means to Co-op. You'll discover the great things we can achieve when we work together to create a better society.</p>
</div>
</div>
</div>
<div class="coop-c-hero coop-c-hero--squircle">
<div class="coop-c-hero__inner coop-u-clearfix">
<h1 class="coop-c-hero__title">Supporting communities</h1>
<div class="coop-c-hero__body">
<p>Find out what community and the power of local people means to Co-op. You'll discover the great things we can achieve when we work together to create a better society.</p>
</div>
<div class="coop-c-hero__squircle" aria-hidden="true">
<div class="coop-c-hero__squircle__inner">
<svg class="coop-c-hero__squircle__svg" viewBox="0 0 1802 1726">
<path class="coop-c-hero__squircle__path" d="M1743 446.3c-49.7-167.6-173.7-299.6-339.6-362C1079.6-28.2 724.1-28.2 397 84.9 232.6 146.7 109.2 278.6 58.5 446.8 19.7 581.6 0 721.4 0 862.8s19.7 281.2 58.5 416.5c50.8 167.6 174.2 299.6 339.6 362 162.2 56.2 331.5 84.7 502.9 84.7 172 0 341.3-28.4 504-85.2 164.9-62.4 288.3-193.8 338-362 39.4-135.8 59-275.6 59-416s-19.7-280.6-59-416.5z" />
</svg>
</div>
</div>
</div>
</div>
<div class="coop-c-hero coop-c-hero--squircle coop-c-hero--media coop-u-white">
<div class="coop-c-hero__inner coop-u-clearfix">
<h1 class="coop-c-hero__title">Supporting communities</h1>
<div class="coop-c-hero__media">
<picture class="coop-c-hero__image">
<!-- if browser supports webp image format, serve the webp format-->
<source media="(min-width: 60em)" srcset="//images.ctfassets.net/bffxiku554r1/7XDwxNP8ioupeMdJZxNS8/d23d2b802d6be0ecbcb7abd1ff33b159/coop-supporting-local-communities.png?fm=webp&q=60&w=600&h=338 1x,
//images.ctfassets.net/bffxiku554r1/7XDwxNP8ioupeMdJZxNS8/d23d2b802d6be0ecbcb7abd1ff33b159/coop-supporting-local-communities.png?fm=webp&q=60&w=1200&h=676 2x" type="image/webp">
<source srcset="//images.ctfassets.net/bffxiku554r1/7XDwxNP8ioupeMdJZxNS8/d23d2b802d6be0ecbcb7abd1ff33b159/coop-supporting-local-communities.png?fm=webp&q=60&w=600&h=338 1x,
//images.ctfassets.net/bffxiku554r1/7XDwxNP8ioupeMdJZxNS8/d23d2b802d6be0ecbcb7abd1ff33b159/coop-supporting-local-communities.png?fm=webp&q=60&w=1200&h=676 2x" type="image/webp">
<!-- if no webp supported then default to serve progressive jpeg -->
<source media="(min-width: 60em)" srcset="//images.ctfassets.net/bffxiku554r1/7XDwxNP8ioupeMdJZxNS8/d23d2b802d6be0ecbcb7abd1ff33b159/coop-supporting-local-communities.png?fm=png&q=60&w=600&h=338 1x,
//images.ctfassets.net/bffxiku554r1/7XDwxNP8ioupeMdJZxNS8/d23d2b802d6be0ecbcb7abd1ff33b159/coop-supporting-local-communities.png?fm=png&q=60&w=1200&h=676 2x" type="image/jpeg">
<source srcset="//images.ctfassets.net/bffxiku554r1/7XDwxNP8ioupeMdJZxNS8/d23d2b802d6be0ecbcb7abd1ff33b159/coop-supporting-local-communities.png?fm=png&q=60&w=600&h=338 1x,
//images.ctfassets.net/bffxiku554r1/7XDwxNP8ioupeMdJZxNS8/d23d2b802d6be0ecbcb7abd1ff33b159/coop-supporting-local-communities.png?fm=png&q=60&w=1200&h=676 2x" type="image/jpeg">
<!-- fallback -->
<img src="//images.ctfassets.net/bffxiku554r1/7XDwxNP8ioupeMdJZxNS8/d23d2b802d6be0ecbcb7abd1ff33b159/coop-supporting-local-communities.png?fm=png&q=60&w=600&h=338" width="600" height="338" alt="How Co-op is supporting local communities">
</picture>
</div>
<div class="coop-c-hero__body">
<p>Find out what community and the power of local people means to Co-op. You'll discover the great things we can achieve when we work together to create a better society.</p>
<div class="coop-c-hero__link">
<a href="https://coop.co.uk" class="coop-t-link-white">More about how Co-op is supporting communities</a>
</div>
</div>
<div class="coop-c-hero__squircle" aria-hidden="true">
<div class="coop-c-hero__squircle__inner">
<svg class="coop-c-hero__squircle__svg coop-u-magenta-dark-3-fill" viewBox="0 0 1802 1726">
<path class="coop-c-hero__squircle__path" d="M1743 446.3c-49.7-167.6-173.7-299.6-339.6-362C1079.6-28.2 724.1-28.2 397 84.9 232.6 146.7 109.2 278.6 58.5 446.8 19.7 581.6 0 721.4 0 862.8s19.7 281.2 58.5 416.5c50.8 167.6 174.2 299.6 339.6 362 162.2 56.2 331.5 84.7 502.9 84.7 172 0 341.3-28.4 504-85.2 164.9-62.4 288.3-193.8 338-362 39.4-135.8 59-275.6 59-416s-19.7-280.6-59-416.5z" />
</svg>
</div>
</div>
</div>
</div>
<div class="coop-c-hero coop-c-hero--squircle coop-c-hero--media">
<div class="coop-c-hero__inner coop-u-clearfix">
<h1 class="coop-c-hero__title">Supporting communities</h1>
<div class="coop-c-hero__media">
<picture class="coop-c-hero__image">
<!-- if browser supports webp image format, serve the webp format-->
<source media="(min-width: 60em)" srcset="//images.ctfassets.net/bffxiku554r1/7XDwxNP8ioupeMdJZxNS8/d23d2b802d6be0ecbcb7abd1ff33b159/coop-supporting-local-communities.png?fm=webp&q=60&w=600&h=338 1x,
//images.ctfassets.net/bffxiku554r1/7XDwxNP8ioupeMdJZxNS8/d23d2b802d6be0ecbcb7abd1ff33b159/coop-supporting-local-communities.png?fm=webp&q=60&w=1200&h=676 2x" type="image/webp">
<source srcset="//images.ctfassets.net/bffxiku554r1/7XDwxNP8ioupeMdJZxNS8/d23d2b802d6be0ecbcb7abd1ff33b159/coop-supporting-local-communities.png?fm=webp&q=60&w=600&h=338 1x,
//images.ctfassets.net/bffxiku554r1/7XDwxNP8ioupeMdJZxNS8/d23d2b802d6be0ecbcb7abd1ff33b159/coop-supporting-local-communities.png?fm=webp&q=60&w=1200&h=676 2x" type="image/webp">
<!-- if no webp supported then default to serve progressive jpeg -->
<source media="(min-width: 60em)" srcset="//images.ctfassets.net/bffxiku554r1/7XDwxNP8ioupeMdJZxNS8/d23d2b802d6be0ecbcb7abd1ff33b159/coop-supporting-local-communities.png?fm=png&q=60&w=600&h=338 1x,
//images.ctfassets.net/bffxiku554r1/7XDwxNP8ioupeMdJZxNS8/d23d2b802d6be0ecbcb7abd1ff33b159/coop-supporting-local-communities.png?fm=png&q=60&w=1200&h=676 2x" type="image/jpeg">
<source srcset="//images.ctfassets.net/bffxiku554r1/7XDwxNP8ioupeMdJZxNS8/d23d2b802d6be0ecbcb7abd1ff33b159/coop-supporting-local-communities.png?fm=png&q=60&w=600&h=338 1x,
//images.ctfassets.net/bffxiku554r1/7XDwxNP8ioupeMdJZxNS8/d23d2b802d6be0ecbcb7abd1ff33b159/coop-supporting-local-communities.png?fm=png&q=60&w=1200&h=676 2x" type="image/jpeg">
<!-- fallback -->
<img src="//images.ctfassets.net/bffxiku554r1/7XDwxNP8ioupeMdJZxNS8/d23d2b802d6be0ecbcb7abd1ff33b159/coop-supporting-local-communities.png?fm=png&q=60&w=600&h=338" width="600" height="338" alt="How Co-op is supporting local communities">
</picture>
</div>
<div class="coop-c-hero__body">
<p>Find out what community and the power of local people means to Co-op. You'll discover the great things we can achieve when we work together to create a better society.</p>
<div class="coop-c-hero__link">
<a href="https://coop.co.uk" class="coop-btn coop-btn--primary">Find out how you can help</a>
</div>
</div>
<div class="coop-c-hero__squircle" aria-hidden="true">
<div class="coop-c-hero__squircle__inner">
<svg class="coop-c-hero__squircle__svg" viewBox="0 0 1802 1726">
<path class="coop-c-hero__squircle__path" d="M1743 446.3c-49.7-167.6-173.7-299.6-339.6-362C1079.6-28.2 724.1-28.2 397 84.9 232.6 146.7 109.2 278.6 58.5 446.8 19.7 581.6 0 721.4 0 862.8s19.7 281.2 58.5 416.5c50.8 167.6 174.2 299.6 339.6 362 162.2 56.2 331.5 84.7 502.9 84.7 172 0 341.3-28.4 504-85.2 164.9-62.4 288.3-193.8 338-362 39.4-135.8 59-275.6 59-416s-19.7-280.6-59-416.5z" />
</svg>
</div>
</div>
</div>
</div>
<div class="coop-c-hero coop-c-hero--squircle coop-c-hero--media coop-c-hero--pull">
<div class="coop-c-hero__inner coop-u-clearfix">
<h1 class="coop-c-hero__title">Supporting communities</h1>
<div class="coop-c-hero__media">
<picture class="coop-c-hero__image">
<!-- if browser supports webp image format, serve the webp format-->
<source media="(min-width: 60em)" srcset="//images.ctfassets.net/bffxiku554r1/7XDwxNP8ioupeMdJZxNS8/d23d2b802d6be0ecbcb7abd1ff33b159/coop-supporting-local-communities.png?fm=webp&q=60&w=600&h=338 1x,
//images.ctfassets.net/bffxiku554r1/7XDwxNP8ioupeMdJZxNS8/d23d2b802d6be0ecbcb7abd1ff33b159/coop-supporting-local-communities.png?fm=webp&q=60&w=1200&h=676 2x" type="image/webp">
<source srcset="//images.ctfassets.net/bffxiku554r1/7XDwxNP8ioupeMdJZxNS8/d23d2b802d6be0ecbcb7abd1ff33b159/coop-supporting-local-communities.png?fm=webp&q=60&w=600&h=338 1x,
//images.ctfassets.net/bffxiku554r1/7XDwxNP8ioupeMdJZxNS8/d23d2b802d6be0ecbcb7abd1ff33b159/coop-supporting-local-communities.png?fm=webp&q=60&w=1200&h=676 2x" type="image/webp">
<!-- if no webp supported then default to serve progressive jpeg -->
<source media="(min-width: 60em)" srcset="//images.ctfassets.net/bffxiku554r1/7XDwxNP8ioupeMdJZxNS8/d23d2b802d6be0ecbcb7abd1ff33b159/coop-supporting-local-communities.png?fm=png&q=60&w=600&h=338 1x,
//images.ctfassets.net/bffxiku554r1/7XDwxNP8ioupeMdJZxNS8/d23d2b802d6be0ecbcb7abd1ff33b159/coop-supporting-local-communities.png?fm=png&q=60&w=1200&h=676 2x" type="image/jpeg">
<source srcset="//images.ctfassets.net/bffxiku554r1/7XDwxNP8ioupeMdJZxNS8/d23d2b802d6be0ecbcb7abd1ff33b159/coop-supporting-local-communities.png?fm=png&q=60&w=600&h=338 1x,
//images.ctfassets.net/bffxiku554r1/7XDwxNP8ioupeMdJZxNS8/d23d2b802d6be0ecbcb7abd1ff33b159/coop-supporting-local-communities.png?fm=png&q=60&w=1200&h=676 2x" type="image/jpeg">
<!-- fallback -->
<img src="//images.ctfassets.net/bffxiku554r1/7XDwxNP8ioupeMdJZxNS8/d23d2b802d6be0ecbcb7abd1ff33b159/coop-supporting-local-communities.png?fm=png&q=60&w=600&h=338" width="600" height="338" alt="How Co-op is supporting local communities">
</picture>
</div>
<div class="coop-c-hero__body">
<p>Find out what community and the power of local people means to Co-op. You'll discover the great things we can achieve when we work together to create a better society.</p>
<div class="coop-c-hero__link">
<a href="https://coop.co.uk" class="coop-btn coop-btn--primary">Find out how you can help</a>
</div>
</div>
<div class="coop-c-hero__squircle" aria-hidden="true">
<div class="coop-c-hero__squircle__inner">
<svg class="coop-c-hero__squircle__svg" viewBox="0 0 1802 1726">
<path class="coop-c-hero__squircle__path" d="M1743 446.3c-49.7-167.6-173.7-299.6-339.6-362C1079.6-28.2 724.1-28.2 397 84.9 232.6 146.7 109.2 278.6 58.5 446.8 19.7 581.6 0 721.4 0 862.8s19.7 281.2 58.5 416.5c50.8 167.6 174.2 299.6 339.6 362 162.2 56.2 331.5 84.7 502.9 84.7 172 0 341.3-28.4 504-85.2 164.9-62.4 288.3-193.8 338-362 39.4-135.8 59-275.6 59-416s-19.7-280.6-59-416.5z" />
</svg>
</div>
</div>
</div>
</div>
<div class="coop-l-container">
<div class="coop-l-grid">
<div class="coop-l-grid__item coop-l-grid__item--large-4 coop-l-grid__item--medium-6 coop-u-margin-t-64">
{% include pattern-library/components/shared-component--featurecard/dist/featureCard.html %}
</div>
<div class="coop-l-grid__item coop-l-grid__item--large-4 coop-l-grid__item--medium-6 coop-u-margin-t-64">
{% include pattern-library/components/shared-component--featurecard/dist/featureCard.html %}
</div>
<div class="coop-l-grid__item coop-l-grid__item--large-4 coop-l-grid__item--medium-6 coop-u-margin-t-64">
{% include pattern-library/components/shared-component--featurecard/dist/featureCard.html %}
</div>
</div>
</div>
<div class="coop-c-hero coop-c-hero--squircle coop-c-hero--media coop-u-white">
<div class="coop-c-hero__inner coop-u-clearfix">
<h1 class="coop-c-hero__title">Spicy dinner deals</h1>
<div class="coop-c-hero__media">
<picture class="coop-c-hero__image"><source media="(min-width: 60em)" srcset="//images.ctfassets.net/6jpeaipefazr/2IlXqo2uT7VPCK2uOndSsj/baa75ac66f835a2a87f16c3e4633894c/P14-Indian-1200x676.png?fm=webp&q=60&w=600&h=338 1x,
//images.ctfassets.net/6jpeaipefazr/2IlXqo2uT7VPCK2uOndSsj/baa75ac66f835a2a87f16c3e4633894c/P14-Indian-1200x676.png?fm=webp&q=60&w=1200&h=676 2x" type="image/webp">
<source srcset="//images.ctfassets.net/6jpeaipefazr/2IlXqo2uT7VPCK2uOndSsj/baa75ac66f835a2a87f16c3e4633894c/P14-Indian-1200x676.png?fm=webp&q=60&w=600&h=338 1x,
//images.ctfassets.net/6jpeaipefazr/2IlXqo2uT7VPCK2uOndSsj/baa75ac66f835a2a87f16c3e4633894c/P14-Indian-1200x676.png?fm=webp&q=60&w=1200&h=676 2x" type="image/webp">
<source media="(min-width: 60em)" srcset="//images.ctfassets.net/6jpeaipefazr/2IlXqo2uT7VPCK2uOndSsj/baa75ac66f835a2a87f16c3e4633894c/P14-Indian-1200x676.png?fm=png&q=60&w=600&h=338 1x,
//images.ctfassets.net/6jpeaipefazr/2IlXqo2uT7VPCK2uOndSsj/baa75ac66f835a2a87f16c3e4633894c/P14-Indian-1200x676.png?fm=png&q=60&w=1200&h=676 2x" type="image/jpeg">
<source srcset="//images.ctfassets.net/6jpeaipefazr/2IlXqo2uT7VPCK2uOndSsj/baa75ac66f835a2a87f16c3e4633894c/P14-Indian-1200x676.png?fm=png&q=60&w=600&h=338 1x,
//images.ctfassets.net/6jpeaipefazr/2IlXqo2uT7VPCK2uOndSsj/baa75ac66f835a2a87f16c3e4633894c/P14-Indian-1200x676.png?fm=png&q=60&w=1200&h=676 2x" type="image/jpeg">
<img src="//images.ctfassets.net/6jpeaipefazr/2IlXqo2uT7VPCK2uOndSsj/baa75ac66f835a2a87f16c3e4633894c/P14-Indian-1200x676.png?fm=png&q=60&w=600&h=338" width="600" height="338" alt="P14-Indian-1200x676">
</picture>
</div>
<div class="coop-c-hero__body">
<p>Treat everyone to a flavour packed Indian meal tonight with our great offers on takeaway favourites you can easily make at home. Choose your rice, sauce and delicious naan or chutney and get ready to spice things up for a low price.</p>
<p class="coop-c-hero__end-date">
<svg width="20" height="21" xmlns="http://www.w3.org/2000/svg">
<mask id="a" maskUnits="userSpaceOnUse" x="0" y="0" width="20" height="21">
<path d="M10 .25c1.3802 0 2.6758.26041 3.8867.78125 1.211.52084 2.2689 1.23372 3.1738 2.13867.905.90495 1.6211 1.96289 2.1485 3.17383C19.7363 7.55469 20 8.85676 20 10.25c0 1.3932-.2604 2.6953-.7812 3.9062-.5209 1.211-1.2338 2.2689-2.1387 3.1739-.905.9049-1.9629 1.6178-3.1739 2.1387-1.2109.5208-2.513.7812-3.9062.7812-1.39324 0-2.69856-.2604-3.91602-.7812-1.21745-.5209-2.27538-1.2338-3.17382-2.1387-.89845-.905-1.60807-1.9629-2.12891-3.1739C.26041 12.9453 0 11.6432 0 10.25c0-1.39324.26041-2.69856.78125-3.91602.52084-1.21745 1.23372-2.27538 2.13867-3.17382.90495-.89845 1.96289-1.60807 3.17383-2.12891C7.30469.51041 8.60676.25 10 .25zM10 19c1.1979 0 2.3307-.2311 3.3984-.6934 1.0678-.4622 1.9955-1.0904 2.7832-1.8847.7878-.7943 1.4128-1.722 1.875-2.7832.4623-1.0612.6934-2.1908.6934-3.3887 0-1.19792-.2311-2.33072-.6934-3.39844-.4622-1.06771-1.0904-1.99544-1.8847-2.7832-.7943-.78776-1.722-1.41276-2.7832-1.875S11.1979 1.5 10 1.5c-1.19792 0-2.33072.23112-3.39844.69336-1.06771.46224-1.99544 1.09049-2.7832 1.88476-.78776.79428-1.41276 1.72201-1.875 2.78321S1.25 9.05208 1.25 10.25c0 1.1979.23112 2.3275.69336 3.3887s1.09049 1.9889 1.88476 2.7832c.79428.7943 1.72201 1.4225 2.78321 1.8847C7.67253 18.7689 8.80208 19 10 19zm5.3125-6.0547c.1563.0912.2474.2181.2734.3809.0261.1627-.026.3222-.1562.4785-.0261.1042-.0912.1823-.1953.2344-.1042.052-.2018.0781-.293.0781-.0391 0-.0846-.013-.1367-.0391-.0521-.026-.1107-.0521-.1758-.0781l-4.0625-2.5586c-.0911.0651-.1888.1107-.293.1367-.1041.0261-.2148.0391-.33199.0391-.37761 0-.69011-.1237-.9375-.3711-.2474-.2474-.3711-.5599-.3711-.9375 0-.2474.0586-.4655.17578-.6543.11719-.18881.28646-.3418.50782-.45899v-5c0-.19531.05533-.3483.16601-.45898s.26367-.16602.45899-.16602c.18229 0 .33199.05534.44919.16602.1172.11068.1758.26367.1758.45898v5c.2214.09115.3906.23763.5078.43946.1172.20182.1758.42643.1758.67383v.0586l4.0625 2.5781z" fill="#fff"></path></mask><g mask="url(#a)"><path d="M10 .25c1.3802 0 2.6758.26041 3.8867.78125 1.211.52084 2.2689 1.23372 3.1738 2.13867.905.90495 1.6211 1.96289 2.1485 3.17383C19.7363 7.55469 20 8.85676 20 10.25c0 1.3932-.2604 2.6953-.7812 3.9062-.5209 1.211-1.2338 2.2689-2.1387 3.1739-.905.9049-1.9629 1.6178-3.1739 2.1387-1.2109.5208-2.513.7812-3.9062.7812-1.39324 0-2.69856-.2604-3.91602-.7812-1.21745-.5209-2.27538-1.2338-3.17382-2.1387-.89845-.905-1.60807-1.9629-2.12891-3.1739C.26041 12.9453 0 11.6432 0 10.25c0-1.39324.26041-2.69856.78125-3.91602.52084-1.21745 1.23372-2.27538 2.13867-3.17382.90495-.89845 1.96289-1.60807 3.17383-2.12891C7.30469.51041 8.60676.25 10 .25zM10 19c1.1979 0 2.3307-.2311 3.3984-.6934 1.0678-.4622 1.9955-1.0904 2.7832-1.8847.7878-.7943 1.4128-1.722 1.875-2.7832.4623-1.0612.6934-2.1908.6934-3.3887 0-1.19792-.2311-2.33072-.6934-3.39844-.4622-1.06771-1.0904-1.99544-1.8847-2.7832-.7943-.78776-1.722-1.41276-2.7832-1.875S11.1979 1.5 10 1.5c-1.19792 0-2.33072.23112-3.39844.69336-1.06771.46224-1.99544 1.09049-2.7832 1.88476-.78776.79428-1.41276 1.72201-1.875 2.78321S1.25 9.05208 1.25 10.25c0 1.1979.23112 2.3275.69336 3.3887s1.09049 1.9889 1.88476 2.7832c.79428.7943 1.72201 1.4225 2.78321 1.8847C7.67253 18.7689 8.80208 19 10 19zm5.3125-6.0547c.1563.0912.2474.2181.2734.3809.0261.1627-.026.3222-.1562.4785-.0261.1042-.0912.1823-.1953.2344-.1042.052-.2018.0781-.293.0781-.0391 0-.0846-.013-.1367-.0391-.0521-.026-.1107-.0521-.1758-.0781l-4.0625-2.5586c-.0911.0651-.1888.1107-.293.1367-.1041.0261-.2148.0391-.33199.0391-.37761 0-.69011-.1237-.9375-.3711-.2474-.2474-.3711-.5599-.3711-.9375 0-.2474.0586-.4655.17578-.6543.11719-.18881.28646-.3418.50782-.45899v-5c0-.19531.05533-.3483.16601-.45898s.26367-.16602.45899-.16602c.18229 0 .33199.05534.44919.16602.1172.11068.1758.26367.1758.45898v5c.2214.09115.3906.23763.5078.43946.1172.20182.1758.42643.1758.67383v.0586l4.0625 2.5781z" class="coop-u-white-fill"></path>
<path d="M22 22H-2V-2h24v24z" class="coop-u-white-fill"></path></g></svg>
<span>Until 20 October 2020</span>
</p></div>
<div class="coop-c-hero__squircle" aria-hidden="true">
<div class="coop-c-hero__squircle__inner ">
<svg class="coop-c-hero__squircle__svg coop-u-blue-dark-3-fill" viewBox="0 0 1802 1726">
<path class="coop-c-hero__squircle__path" d="M1743 446.3c-49.7-167.6-173.7-299.6-339.6-362C1079.6-28.2 724.1-28.2 397 84.9 232.6 146.7 109.2 278.6 58.5 446.8 19.7 581.6 0 721.4 0 862.8s19.7 281.2 58.5 416.5c50.8 167.6 174.2 299.6 339.6 362 162.2 56.2 331.5 84.7 502.9 84.7 172 0 341.3-28.4 504-85.2 164.9-62.4 288.3-193.8 338-362 39.4-135.8 59-275.6 59-416s-19.7-280.6-59-416.5z"></path>
</svg>
</div>
</div>
</div>
</div>