152 lines
19 KiB
HTML
152 lines
19 KiB
HTML
|
<!DOCTYPE html>
|
||
|
|
<html lang="en" >
|
||
|
|
<head>
|
||
|
|
<meta charset="UTF-8">
|
||
|
|
<title>CodePen - Phone Reflection</title>
|
||
|
|
<link rel="stylesheet" href="./style.css">
|
||
|
|
|
||
|
|
</head>
|
||
|
|
<body>
|
||
|
|
<!-- partial:index.partial.html -->
|
||
|
|
<div class="hint">click safari</div>
|
||
|
|
<div class="socials-container">
|
||
|
|
<!-- codepen -->
|
||
|
|
<a class="social-link" target="_blank" href="https://codepen.io/lukes611">
|
||
|
|
<div class="social-wrapper codepen">
|
||
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 78.95 78.95">
|
||
|
|
<title>codepen</title>
|
||
|
|
<g id="codepen">
|
||
|
|
<path id="code-pen-3" d="M12.66,30.35l26.5-17.51a.82.82,0,0,1,.9,0L66.41,30.48a.16.16,0,0,1,0,.26l-27,17.71L12.66,30.87A.31.31,0,0,1,12.66,30.35Z" style="fill:none;stroke:#c1272d;stroke-miterlimit:10;stroke-width:2px" />
|
||
|
|
<path id="code-pen-2" d="M12.26,48.26V30.91a.56.56,0,0,1,.25-.46L39.25,12.78a.23.23,0,0,1,.36.19l-.18,17.52L66.57,48.42a0,0,0,0,0,0,0V30.94a.17.17,0,0,0-.27-.15L39.43,48.45V66a.22.22,0,0,1-.34.19L12.42,48.55A.34.34,0,0,1,12.26,48.26Z" style="fill:none;stroke:#c1272d;stroke-miterlimit:10;stroke-width:2px" />
|
||
|
|
<path id="code-pen-1" d="M12.58,48.14,39.29,30.65a.38.38,0,0,1,.41,0L66.52,48.24a.36.36,0,0,1,0,.61L39.57,66.18a.36.36,0,0,1-.4,0L12.58,48.76A.37.37,0,0,1,12.58,48.14Z" style="fill:none;stroke:#c1272d;stroke-miterlimit:10;stroke-width:2px" />
|
||
|
|
</g>
|
||
|
|
</svg>
|
||
|
|
</div>
|
||
|
|
</a>
|
||
|
|
|
||
|
|
<!-- twitter -->
|
||
|
|
<a class="social-link" target="_blank" href="https://twitter.com/Lukes611">
|
||
|
|
<div class="social-wrapper twit">
|
||
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 78.95 78.95">
|
||
|
|
<title>twitter</title>
|
||
|
|
<g id="twitter">
|
||
|
|
<path id="twitter-icon" d="M39.66,28.54a.52.52,0,0,0,.51-.57c-.17-2.24-.31-10.75,7.29-14.3a14.25,14.25,0,0,1,16.22,2.5.51.51,0,0,0,.48.16,41.73,41.73,0,0,0,6.67-2.18.72.72,0,0,1,.93,1,14.81,14.81,0,0,1-3.23,4.19.52.52,0,0,0,.44.91c1.08-.21,2.39-.5,3.47-.81a.58.58,0,0,1,.6.94c-1.48,1.8-3.75,4.34-5.13,5.06a.49.49,0,0,0-.29.43c-.1,2.39-.81,18.35-9.29,26.94-8.91,9-24.37,20.73-49.2,9a.52.52,0,0,1,.19-1c3.67-.21,11.33-1.06,16.45-4.52A.75.75,0,0,0,25.51,55c-2.86-.7-8.55-3-10.64-8.8a.53.53,0,0,1,.55-.69c.65.06,1.62.12,2.55.13a.71.71,0,0,0,.36-1.32c-3.12-1.71-8.41-5.65-8.72-12a.52.52,0,0,1,.7-.51,32.7,32.7,0,0,0,3.19,1,.64.64,0,0,0,.59-1.08c-2.44-2.35-6.44-7.83-2.87-16.42a.54.54,0,0,1,.9-.13C14.47,18,24.45,28.89,39.66,28.54Z" style="fill:none;stroke:#c1272d;stroke-miterlimit:10;stroke-width:2px" />
|
||
|
|
</g>
|
||
|
|
</svg>
|
||
|
|
</div>
|
||
|
|
</a>
|
||
|
|
|
||
|
|
<!-- instagram -->
|
||
|
|
<a class="social-link" target="_blank" href="https://www.instagram.com/sip.wave/">
|
||
|
|
<div class="social-wrapper insta">
|
||
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 78.95 78.95">
|
||
|
|
<title>insta</title>
|
||
|
|
<g id="insta">
|
||
|
|
<rect id="insta-rect" x="10.03" y="10.66" width="58.89" height="57.64" rx="14.16" style="fill:none;stroke:#c1272d;stroke-miterlimit:10;stroke-width:2px" />
|
||
|
|
<circle id="insta-circ" cx="39.47" cy="41.08" r="12.93" style="fill:none;stroke:#c1272d;stroke-miterlimit:10;stroke-width:2px" />
|
||
|
|
<circle id="insta-circ-2" cx="57.2" cy="22.78" r="3.38" style="fill:none;stroke:#c1272d;stroke-miterlimit:10;stroke-width:2px" />
|
||
|
|
</g>
|
||
|
|
</svg>
|
||
|
|
</div>
|
||
|
|
</a>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<svg id="woman" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 505.12 1304.22">
|
||
|
|
<defs>
|
||
|
|
<clipPath id="clip-path">
|
||
|
|
<polygon points="81.08 481.05 78.65 348.32 135.46 352.49 137.88 485.22 81.08 481.05" style="fill:none" />
|
||
|
|
</clipPath>
|
||
|
|
</defs>
|
||
|
|
<g id="body">
|
||
|
|
<path id="left-leg" d="M20.93,973.44s-76.29,62.22-92.59,90.37-25.92,47.4-45.92,96.29-96.52,199.13-96.52,199.13,47.64,23.93,66.69,12c1.19-3.57,132.17-222.67,131-226.24s196.48-64.31,215.53-97.65S20.93,973.44,20.93,973.44Z" style="stroke:#f2ff7f;stroke-miterlimit:10" />
|
||
|
|
<path id="right-leg" d="M-44.13,939.49s216.22,161.08,325.51,140.76,178-58.15,158.33-185c-7-35-51.3-84-51.3-84L210.17,815,154,886.43l-169.58-62s-77.23-42-111.56,45.77-127.21,254.08-136.36,258c0,1.31,20.91,36.46,57.51,26.73,0,.72,129.46-94.18,158.84-213Z" style="stroke:#f2ff7f;stroke-miterlimit:10" />
|
||
|
|
<g id="leg-crease">
|
||
|
|
<path d="M154.1,886.21c14.92,4.17,29.65,8.93,44.33,13.88s29.24,10.18,43.68,15.77q10.83,4.21,21.52,8.74t21.15,9.62c7,3.38,13.81,7,20.43,11,.83.51,1.66,1,2.48,1.52l2.43,1.6c.8.53,1.62,1,2.41,1.61l2.35,1.71a61.11,61.11,0,0,1,8.73,7.65h0a101.6,101.6,0,0,0-18.54-13.84c-6.62-4-13.48-7.6-20.44-11s-14-6.51-21.16-9.54-14.31-5.88-21.53-8.66c-14.45-5.54-29-10.71-43.72-15.62q-11-3.68-22.08-7.16c-7.37-2.36-14.77-4.61-22.16-6.91Z" style="fill:#f2ff7f" />
|
||
|
|
</g>
|
||
|
|
<path id="left-arm" d="M87,450.64l20,21.29-17.31,22.4c-16,91.25,24.3,137.84,24.3,137.84A539.58,539.58,0,0,1,149,559.05l20.52-11.53,53.94,5.16s-26.34,44.77-33.64,77.09-55.48,79.85-62.3,87.1-32,9.38-61.39-10.66S45.62,568.49,46.47,563.38,51.38,496.1,58.24,472V460.35Z" style="stroke:#f2ff7f;stroke-miterlimit:10" />
|
||
|
|
<path id="dark-top" d="M273,434.3l-3.94,16.06c-.09.39-1.29.77-1.65.91-5.75,2.17-52.37,19.52-59.65,35.09a1.22,1.22,0,0,0-.05.84c1.51,4.85,13.78,51.55,13.14,52.83s-24.52,51.2-25.58,53.41a1,1,0,0,1-.08.14c-.78,1.17-11.56,18.78-1.74,87.53,10.19,71.29,15.28,64.74,16.73,133.85,0,.73,91.85,36.17,177.47-3.28a1.19,1.19,0,0,0,.69-1.2c-.87-9.17-8.44-90.35,15-113.77,24-24,1.05-124.55-.29-130.29a1.23,1.23,0,0,1,0-.54c.63-2.62,6.26-22,33.26-11.2.73,2.18,1.62-40.4-33.3-55.68-34.68-15.18-28.07-29.26-43.49-68.95a1.19,1.19,0,0,0-1.17-.76l-85.39,4C272.4,433.27,273.11,433.78,273,434.3Z" style="stroke:#f2ff7f;stroke-miterlimit:10" />
|
||
|
|
<path id="highlighted-pink-top" d="M267.4,576.7l46.77-8.47c-3.22-29,88.78-2.06,88.78-2.06s-20.91-32.69,8-21.08c.73,2.18,42.92-50.22,8-65.5s-44-10-59.79-50.34l-87.14,4-4.1,17.15s-50.54,11.13-85.73,54.07c-10.13,12.36-16.25,25.1-33.37,54.54,0,0,38.68-11.11,56.71,13.72l-9.34,20C211.23,582.35,267.4,576.7,267.4,576.7Z" style="fill:#ff3fa6" />
|
||
|
|
<path id="highlighted-yellow-top" d="M455.86,511.72c-36.59-51.66-77.11-33-96.69-82.47L333,430.46s-15.29,9.9-17.76,15.19c1.7,45-26.34,90.8-47.79,131.05,42.83-3.51,94.89,38.44,144.86,44.07,0,0,39.26,5.29,43.6-4.78C469.81,583.54,482.26,555.89,455.86,511.72Z" style="fill:#f2ff7f" />
|
||
|
|
<g id="arm-crease">
|
||
|
|
<path d="M114.33,632c2.13,3.27,4.27,6.55,6.5,9.76q1.69,2.4,3.51,4.69a21.26,21.26,0,0,0,4.13,4.13h0A19.92,19.92,0,0,1,124,646.7c-1.32-1.46-2.54-3-3.74-4.56a105.07,105.07,0,0,1-6.59-9.77Z" style="fill:#f2ff7f" />
|
||
|
|
</g>
|
||
|
|
<path id="right-under-arm" d="M374.83,611.11s-4.66-4.43,30.15-51.22c-1.62,3.39-1.84,3.75-1.84,3.75-2.65,13.7-18.89,43-18.89,43l-3.34,7.09Z" style="opacity:0.49" />
|
||
|
|
<path id="left-sleeve-outline" d="M205.3,572.46s-13.77-23.3-56.47-13.38" style="fill:none;stroke:#f2ff7f;stroke-miterlimit:10" />
|
||
|
|
<path id="arm-pit" d="M205.82,572.24l9.79-18.17-6.43-6.55s-3.26,12.8-5.22,22.42A14,14,0,0,1,205.82,572.24Z" style="opacity:0.49" />
|
||
|
|
</g>
|
||
|
|
<g id="hair-wrapper">
|
||
|
|
<path id="black-hair-bg" d="M171.3,426.34c2.57,2.06,12.44-4.36,12.44-4.36s3.35,15,16.55,23.67c.33.23,1.69-13.14,9.47-14.41.34-.24,9.33,14,18.19,14.51.41.47,5.82-15.77,13.94-11.37,1,.68,14.14,11.27,14.14,11.27l12-14.41,23.63-13.45s43.37-23.15,56.16-4.31,47.12,14.13,47.12,14.13c-12.95-4.68-10.77-24.23-10.77-24.23l19.51,5.39-4-20.19c11.44,12.11,33.65,8.75,33.65,8.75l-9.42-12.79c12-3.16,23.55,5.38,23.55,5.38L442,369.06l26.25,11.44c7.05-5.56-.68-25.57-.68-25.57,10.09-2.73,31,10.76,31.64,10.76-23.5-95.48-65.93-160.7-134.51-191.14-47.27-17.65-76.39-18.55-104-15.63C133,177.68,90,345.94,171.3,426.34Z" style="fill:#ff3fa6" />
|
||
|
|
<path id="black-hair" d="M166.76,426.34c2.57,2.06,12.45-4.36,12.45-4.36s3.34,15,16.54,23.67c.33.23,1.69-13.14,9.47-14.41.34-.24,9.33,14,18.2,14.51.4.47,5.82-15.77,13.93-11.37,1,.68,14.14,11.27,14.14,11.27l12-14.41,23.62-13.45s43.38-23.15,56.16-4.31,47.12,14.13,47.12,14.13c-12.95-4.68-10.77-24.23-10.77-24.23l19.52,5.39-4-20.19c11.44,12.11,33.65,8.75,33.65,8.75l-9.42-12.79c12-3.16,23.55,5.38,23.55,5.38l-5.38-20.86,26.25,11.44c7.06-5.56-.68-25.57-.68-25.57,10.1-2.73,31,10.76,31.64,10.76C471.2,270.21,428.78,205,360.19,174.55c-47.27-17.65-76.39-18.55-104-15.63C128.47,177.68,85.48,345.94,166.76,426.34Z" style="stroke:#f2ff7f;stroke-miterlimit:10" />
|
||
|
|
<path id="bottom-right-yellow-hair" d="M430.51,271.39a33,33,0,0,0-25.94-8.81s4.26,15-2.86,20.4c-11.86-6.12-25.25-5.37-25.25-5.37s9.7,13.69,6.92,17.48c-8.38-6.71-19.57-.35-20.06,11.45-4.48-19.84-24.51-10.17-24.51-10.17s-4.57-33.36-24.23-50c0,0,17.05-4,29.83,5.1,2.55-7-6.33-15.9-6.33-15.9s13.63-2.17,18.33,3.46c6.9-5.72-.35-19.37-.35-19.37s13.92.61,15.16,6.39c4.34-.23,5.1-14.5,2-24.71C418.88,216.66,430.33,254,430.51,271.39Z" style="fill:#f2ff7f" />
|
||
|
|
<path id="bottom-right-pink-hair" d="M479.86,339.76s-15.66,2.15-21.46-5.36c-15.39,4.05-7.08,21.29-7.08,21.29s-22.76-8.57-28.32-4.41l2.48,21.41s-16.66-.36-28-9.38c-5.71,6.45,5.31,13.62,5.31,13.62a29.13,29.13,0,0,1-20.53,0c-2.57,2.57,0,14.52,0,14.52l-12.75-3.9c-5.81,6-5.39,27.21-5.39,27.21s-16.57-33.56-19.74-63.48c4.73-9.37,16.78-.37,19.82-4.44,2.61-3.47-1.06-17.34-1.06-17.34s16.29,5.69,20.18,2.43c-3.8-6.23,1.06-19.31,1.06-19.31s19.92,8.45,23.37,3.64c-9.26-4.95-9.92-19-9.92-19s17.71,6.61,21.6,2.8c-11.3-4.47-2.83-25.81-2.83-25.81s11.54,16.75,19.87,7.91c4.72-4.28,2.53-26.48,2.53-26.48S465.52,282.75,479.86,339.76Z" style="fill:#ff3fa6" />
|
||
|
|
<path id="right-center-hair-line" d="M244.63,226.09s35.18-25,52.09-5.89l-8.91-12.47s31.6-1.33,35.16,14.69C323,222.42,304.8,161,244.63,226.09Z" style="fill:#f2ff7f" />
|
||
|
|
<path id="pink-top-hair-line" d="M237.35,189.66s3.28-25.11,23-23.91c0,0-14.24,9.42-8.61,11.93,0,0,7.45-.86,11.09,0A39.09,39.09,0,0,0,237.35,189.66Z" style="fill:#ff3fa6" />
|
||
|
|
<path id="left-hair-line-top" d="M202.29,207.23s-19.34,4.3-20.87,15.34c0,0-7.37-5.21,0-16.87-.31,0-6.1-3.51-8.88,4.38" style="fill:none;stroke:#f2ff7f;stroke-miterlimit:10" />
|
||
|
|
<path id="medium-left-pink" d="M131.38,296.47l14.5-8.07,5.23,5.19,9-5.19,5.08,5.94,1.58-12.62-5.21,2.18-8.7-11.32L151.69,282l-15.34-9.43C132.29,281.74,131.38,296.47,131.38,296.47Z" style="fill:#ff3fa6" />
|
||
|
|
<path id="bottom-left-yellow" d="M151,352.81c1.89,3.21,2.32,7.26,13.95,5,0,0,.36,12.92,16.3,26.55,0,0-14.77-.78-17.8-4-.2-.1,1.21,15.79,4.45,16.6.1-.1-9.41-1.41-11.13-3.54,0,.2-2.63,9.72,0,12.25.1.3-22.77-30.06-22.07-56.78.11.3,7.06,18,12.17,14.87C144.87,362.26,149.37,358.92,151,352.81Z" style="fill:#f2ff7f" />
|
||
|
|
</g>
|
||
|
|
<g id="face-wrapper">
|
||
|
|
<path id="pink-face" d="M173.41,263.37s8.56-45.94,40.48-35.82,21.81,9.34,35.82,4.67,37.37-3,48.27,12.51,25.7,56,25.7,64.58l7.51,1.72s8.56-14.51,17.49-13,15.62,17.49,8.55,29.4-14.88,14.88-24.55,13c.37.37,27.51,92.28,27.51,92.28s-45.74,27.53-88.53,2.6c.37,0,3.34-27.16,3.34-27.16s-27.9,13.39-38.69,13.76-16-.74-21.58-3.34-39.81-48.75-39.81-48.75-10.13-9.69-7.82-45.76C172.31,287.22,166.69,300.16,173.41,263.37Z" style="fill:#ff3fa6" />
|
||
|
|
<path id="neck-shadow" d="M275,408.15s37.68-15,39.43-22.77c0,.15,4.83,24.89-41.44,40.45Z" style="opacity:0.3" />
|
||
|
|
<path id="face-shadow" d="M228.35,403.07c-5.65-8.32-7.18-10.69-8.37-17.69s-1.8-22.07-1.8-22.07l-5.52-3.62.54-2.39,5-5S226.35,305,223.42,272c-2.44-27.39,1-35,4.39-39.87-3.46-1.18-7.95-2.69-13.92-4.58-31.92-10.12-40.48,35.82-40.48,35.82-6.72,36.79-1.1,23.85-6.31,60.69-2.31,36.07,7.82,45.76,7.82,45.76s34.23,46.14,39.81,48.75c4.72,2.2,9.19,3.33,17,3.41l.74-.55S234,411.4,228.35,403.07Z" style="fill:#f2ff7f" />
|
||
|
|
<g id="nose">
|
||
|
|
<path d="M218.24,351.3a7.05,7.05,0,0,1-1.28,4.5,7.93,7.93,0,0,1-1.6,1.91,4.06,4.06,0,0,1-2.63,1.07l.84-1.38h0c.26.54.57,1.14.87,1.69a18.38,18.38,0,0,0,1,1.61,6.15,6.15,0,0,0,1.23,1.35,13.28,13.28,0,0,0,1.49,1v.52a2.6,2.6,0,0,1-2.3-.32,7.44,7.44,0,0,1-1.75-1.43,12.88,12.88,0,0,1-2.37-3.64h0l-.55-1,1.39-.39a3.39,3.39,0,0,0,1.33-.78,9.55,9.55,0,0,0,1.34-1.41,19.86,19.86,0,0,1,2.86-3.35Z" />
|
||
|
|
</g>
|
||
|
|
<path id="mouth" d="M212.66,382.86l20.62-2s11.95.31,13.52,4.47-8.89,2.19-14.91,3.28a124.09,124.09,0,0,1-15,1.31Z" />
|
||
|
|
<path id="right-ear-section" d="M315.18,445.67c26.93-.9,45-13,45-13s-27.14-91.91-27.51-92.28c9.67,1.86,17.49-1.12,24.55-13s.38-27.91-8.55-29.4-17.49,13-17.49,13l-7.51-1.72c0-8.57-14.79-49.06-25.7-64.58a30.1,30.1,0,0,0-6.31-6.57C297.64,264,319.31,364.46,315.18,445.67Z" style="fill:#f2ff7f" />
|
||
|
|
<path d="M271,431.64s27.78,29.28,95.07-.91l.62,1.8s-66.49,31-96.16.48Z" style="opacity:0.24" />
|
||
|
|
</g>
|
||
|
|
<g id="eyes">
|
||
|
|
<g id="left-arch">
|
||
|
|
<path d="M212.34,313a95.44,95.44,0,0,0-9.43-4.95,44.79,44.79,0,0,0-9.76-3.31,23.31,23.31,0,0,0-9.73-.07,21.5,21.5,0,0,0-4.57,1.67,37.1,37.1,0,0,0-4.39,2.81l-.77-.63a15.35,15.35,0,0,1,3.52-4.54,16,16,0,0,1,5.13-3,20.91,20.91,0,0,1,11.7-.22,36.28,36.28,0,0,1,10.37,4.48,41.37,41.37,0,0,1,8.58,7Z" />
|
||
|
|
</g>
|
||
|
|
<g id="right-arch">
|
||
|
|
<path d="M251.1,312.83a16.93,16.93,0,0,1,4.27-5.1,21.4,21.4,0,0,1,5.84-3.44,25.07,25.07,0,0,1,13.46-1.23A36.36,36.36,0,0,1,287,307.74a45.71,45.71,0,0,1,10,8.13l-.61.79c-3.76-1.94-7.4-3.88-11.14-5.43a48.54,48.54,0,0,0-11.36-3.33,28.7,28.7,0,0,0-22,5.54Z" />
|
||
|
|
</g>
|
||
|
|
<ellipse id="left-ball" cx="191.3" cy="319.64" rx="8.74" ry="12.29" />
|
||
|
|
<ellipse id="riight-ball" cx="262.19" cy="323.82" rx="8.74" ry="13.14" />
|
||
|
|
</g>
|
||
|
|
<g id="brows">
|
||
|
|
<path id="left" d="M171.39,291.92s31-8.81,40.34-4.54c4.61-.53,9.39-8.26-.72-9.45s-38.16.93-38.22,6.33S166.41,291.65,171.39,291.92Z" />
|
||
|
|
<path id="right" d="M296.57,293.59S266,283.29,256.5,287.1c-4.58-.75-9-8.7,1.17-9.4s38.07,2.77,37.87,8.17S301.56,293.56,296.57,293.59Z" />
|
||
|
|
</g>
|
||
|
|
<g id="phone">
|
||
|
|
<path id="front" d="M83.11,328.88l54.47.48A10.3,10.3,0,0,1,147.77,339L158,505.5a10.3,10.3,0,0,1-12.28,10.73L91.06,505.4A10.3,10.3,0,0,1,82.78,496l-10-156.12A10.31,10.31,0,0,1,83.11,328.88Z" style="stroke:#f2ff7f;stroke-miterlimit:10" />
|
||
|
|
<path id="back" d="M78.2,329.05l54.47.47a10.3,10.3,0,0,1,10.19,9.67l10.21,166.47a10.29,10.29,0,0,1-12.28,10.73L86.15,505.56a10.3,10.3,0,0,1-8.28-9.44L67.84,340A10.28,10.28,0,0,1,78.2,329.05Z" style="stroke:#f2ff7f;stroke-miterlimit:10" />
|
||
|
|
<polygon id="phone-p1" points="145.68 360.15 146.66 373.3 149.26 373.01 148.45 359.75 145.68 360.15" style="stroke:#a2ab55;stroke-miterlimit:10;stroke-width:0.75px" />
|
||
|
|
<polygon id="phone-p2" points="146.9 375.16 147.88 388.31 150.48 388.02 149.67 374.76 146.9 375.16" style="stroke:#a2ab55;stroke-miterlimit:10;stroke-width:0.75px" />
|
||
|
|
</g>
|
||
|
|
<g id="safari-log">
|
||
|
|
<g style="isolation:isolate">
|
||
|
|
<g style="clip-path:url(#clip-path)">
|
||
|
|
<path d="M115.67,406.66l-8.43,6.12-5.78,9,8.43-6.12,5.78-9m-6.91,19.94c-6.12-.45-11.18-6.36-11.31-13.21s4.73-12,10.86-11.57,11.2,6.36,11.32,13.2-4.74,12-10.87,11.58m-.47-25.67c-6.53-.48-11.74,5.07-11.6,12.38s5.55,13.63,12.09,14.11,11.75-5.05,11.61-12.37-5.55-13.64-12.1-14.12" id="safari-clip" style="fill:#323232" />
|
||
|
|
<path d="M101.46,421.82l5.78-9,8.43-6.12-5.78,9-8.43,6.12m6.85-20c-6.13-.45-11,4.73-10.86,11.57s5.19,12.76,11.31,13.21,11-4.73,10.87-11.58-5.19-12.75-11.32-13.2" />
|
||
|
|
<path d="M108.78,427.42c-6.54-.48-12-6.79-12.09-14.11s5.07-12.86,11.6-12.38,12,6.81,12.1,14.12-5.07,12.85-11.61,12.37m22.37-75.25L78.7,350.78l7.64,130.65,51.54,3.79-6.73-133" />
|
||
|
|
</g>
|
||
|
|
</g>
|
||
|
|
</g>
|
||
|
|
<g id="arms-1">
|
||
|
|
<path id="right-arm" d="M455.86,616c-26.71-22.21-69.62-9.76-69.62-9.76L403,566.16s-25.51,70.35-64.26,108.08c0,.34-64.58-78.84-78.51-108.08s-42.83-75.46-46.91-78.86-23.58-44.18-23.58-44.18-9.15-8.82-20.71-12.56-25.77-7.68-25.77-7.68-8.16-1.63-11.11,3.92S120.68,439.22,122,444.12,132.11,448,132.11,448s-6.81,4.9-6.34,9.15-.52,14.71,3.4,17l14.23,10.93c7.18,3.92,37.74,22.52,41,27.42s10,9,15.3,23,63.71,143,89.37,176.77S325,746,325,746s22,9.53,44-10.27,57.18-57.91,66.71-78.43c4.91-10.58,12.67-23.83,20.17-41.3" style="stroke:#f2ff7f;stroke-miterlimit:10" />
|
||
|
|
<path id="left-hand" d="M55.64,483.94s-6.26-34.29,2.6-50.37c4.69-8.53,15.15-16.11,22.08-15.8,3.72.16,25.09-3,29.66,6.16,3.94,7.92-1,20.28-1.42,23-1,5.9-9.66,11.55-19.14,14.86-7.35,2.55-15.43,11.07-14.11,19.14" style="stroke:#f2ff7f;stroke-miterlimit:10" />
|
||
|
|
</g>
|
||
|
|
<g id="Layer_12" data-name="Layer 12">
|
||
|
|
<polygon id="pink-face-box" points="207.55 219.31 212.66 464.38 337.18 460.37 325.93 219.31 207.55 219.31" style="fill:#7ff6ff;opacity:0.41000000000000003" />
|
||
|
|
<polygon id="right-ear-section-box" points="266.88 235.42 310.23 461.24 400.48 438.6 353.58 216.05 266.88 235.42" style="fill:#7ff6ff;opacity:0.41000000000000003" />
|
||
|
|
<polygon id="shirt-box" points="199.71 373.3 128.47 579.85 446.93 668.95 515.88 461.24 199.71 373.3" style="fill:#ff3fa6;opacity:0.25" />
|
||
|
|
<polygon id="face-shadow-box" points="143.53 210.41 173.2 439.35 257.78 427.56 229.81 196.19 143.53 210.41" style="fill:#ff3fa6;opacity:0.25" />
|
||
|
|
<polygon id="bottom-right-pink-hair-box" points="306.26 340.28 366.66 429.29 505.12 326.84 441.81 238.16 306.26 340.28" style="fill:#ff3fa6;opacity:0.25" />
|
||
|
|
<polygon id="bottom-right-yellow-hair-box" points="293.06 242.52 361.35 340.28 459.21 262.54 382.71 178.93 293.06 242.52" style="fill:#ff3fa6;opacity:0.25" />
|
||
|
|
<polygon id="right-center-hair-line-box" points="237.34 238.16 330.98 224.35 325.93 180.58 233.4 196.19 237.34 238.16" style="fill:#ff3fa6;opacity:0.25" />
|
||
|
|
<polygon id="pink-top-haiir-line-box" points="239.78 198.94 272.99 179.64 260.73 158.92 225.56 177.68 239.78 198.94" style="fill:#ff3fa6;opacity:0.25" />
|
||
|
|
<polygon id="medium-left-pink-box" points="174.08 272.58 125.38 267.02 120.9 301.7 166.76 305.1 174.08 272.58" style="fill:#ff3fa6;opacity:0.25" />
|
||
|
|
<polygon id="bottom-left-yellow-box" points="118.52 363.31 154.07 411.78 191.3 385.38 154.91 340.28 118.52 363.31" style="fill:#ff3fa6;opacity:0.25" />
|
||
|
|
<polygon onclick="togglePattern()" id="safari-box" points="83.78 417.6 111.58 439.96 132.88 411.85 104.76 390.77 83.78 417.6" style="fill:#ff3fa6;opacity:0.25" />
|
||
|
|
<polyline id="safari-pointer" points="100.43 422.41 110.14 415.56 107.19 412.8" style="fill:#262626;opacity:0.38" />
|
||
|
|
</g>
|
||
|
|
</svg>
|
||
|
|
<!-- partial -->
|
||
|
|
<script src="./script.js"></script>
|
||
|
|
|
||
|
|
</body>
|
||
|
|
</html>
|