<div id="pageWrap">
<div class="header">
<svg id='kyDemocratsLogo' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.1' viewBox='0 0 980 80' x='0px' y='0px' preserveAspectRatio='xMidYMid meet' xml:space='preserve'>
<path fill='#2952a5' d='M35.45 69.84 26.4 45.2l-4.93 9V69.84H10V10.16H21.47v29l13.8-29H47.18L34.73 35.52c1 2.6 2.24 5.91 3.76 9.77s3 7.7 4.3 11.29 2.51 6.72 3.5 9.31 1.43 4 1.43 4Z' />
<path fill='#2952a5' d='M58.62 10.16H90v10.4H69.82V34.44H85.5v10H69.82v15H90.07v10.4H58.62Z' />
<path fill='#2952a5' d='M101.71 10.16h11.38l16.13 38h.18l-.18-38h10V69.84h-11.2L111.75 31.49h-.18l.18 38.35h-10Z' />
<path fill='#2952a5' d='M150.59 10.16h36.29V20.74H174.51v49.1H163V20.74H150.59Z' />
<path fill='#2952a5' d='M198 10.16h11.47V52.54c0 5.47 2.42 8.52 7.08 8.52s7.08-3.05 7.08-8.52V10.16h10.84V51.47c0 12.27-5.82 19.62-18.28 19.62S198 63.92 198 51.47Z' />
<path fill='#2952a5' d='M284.16 27.55v4H273.23V28.17c0-6.45-2.87-9.23-7.26-9.23s-7.52 3.5-7.52 9.59V51.38c0 6.18 3.13 9.68 7.52 9.68s7.26-2.78 7.26-9.23V48.42h10.93v4c0 12.1-6.54 18.64-18.37 18.64s-19-7.44-19-20.07V29c0-12.63 7.62-20.07 19.35-20.07S284.16 15.09 284.16 27.55Z' />
<path fill='#2952a5' d='M321.67 69.84 312.62 45.2l-4.93 9V69.84H296.22V10.16h11.47v29l13.8-29h11.92L321 35.52c1 2.6 2.24 5.91 3.76 9.77s3 7.7 4.31 11.29 2.5 6.72 3.49 9.31 1.43 4 1.43 4Z' />
<path fill='#2952a5' d='M342.56 10.16h12l8.78 25.36 8.78-25.36h11.56L368.73 47V69.84H357.26V47Z' />
<path fill='#2952a5' d='M538 10.16h18.28c12.18 0 19.17 7.08 19.17 19V50.93c0 11.92-7 18.91-19.26 18.91H538Zm11.47 9.68V60.16h6.27c5.64 0 8.06-3.67 8.06-9V28.89c0-5.47-2.51-9-8.15-9Z' />
<path fill='#2952a5' d='M588 10.16h31.36v10.4H599.21V34.44h15.68v10H599.21v15h20.25v10.4H588Z' />
<path fill='#2952a5' d='M631.11 10.16H647l9.86 41.49H657l9.49-41.49h15.86V69.84h-10.3V24.59h-.18L661.13 69.84H651.9L641.15 24.59H641V69.84h-9.86Z' />
<path fill='#2952a5' d='M733.74 29.25v21.5c0 13.17-7.8 20.34-19.36 20.34S695 63.92 695 50.75V29.25c0-13.17 7.8-20.34 19.35-20.34S733.74 16.08 733.74 29.25Zm-27.06-.36V51.11c0 6.45 2.78 10 7.7 10s7.71-3.5 7.71-10V28.89c0-6.45-2.78-9.95-7.71-9.95S706.68 22.44 706.68 28.89Z' />
<path fill='#2952a5' d='M782.92 27.55v4H772V28.17c0-6.45-2.87-9.23-7.26-9.23s-7.53 3.5-7.53 9.59V51.38c0 6.18 3.14 9.68 7.53 9.68S772 58.28 772 51.83V48.42h10.93v4c0 12.1-6.54 18.64-18.37 18.64s-19-7.44-19-20.07V29c0-12.63 7.62-20.07 19.36-20.07S782.92 15.09 782.92 27.55Z' />
<path fill='#2952a5' d='M806.45 47.44v22.4H795V10.16h19.17c10.39 0 16.31 6.1 16.31 15.41v6.55c0 6.45-3 11.28-8.07 13.7l9.5 24H820l-8.7-22.4Zm0-28V38.21h5.37c5 0 7.17-2.6 7.17-6.9V26.38c0-4.39-2.15-7-7.17-7Z' />
<path fill='#2952a5' d='M872.09 69.84l-2.5-11.65H854.71L852.2 69.84H841.45l14.34-60h13.44l14.24 60Zm-10-45.61-5.29 24.64h10.76l-5.29-24.64Z' />
<path fill='#2952a5' d='M886.93 10.16h36.29V20.74H910.86v49.1H899.39V20.74H886.93Z' />
<path fill='#2952a5' d='M969.46 25.57v3.32H958.62V26c0-4.3-1.79-7.34-6.9-7.34-4.39 0-6.63 2.5-6.63 6.54a6.46 6.46 0 0 0 2.42 5.46 50.63 50.63 0 0 0 8.87 5.2q7.26 3.63 10.48 7.52C968.93 46 970 49.68 970 54.25c0 10.39-6.72 16.66-18.46 16.66-12.81 0-18.19-6.63-18.19-16.39V50.3H944.2v3.14c0 5.11 2.41 7.88 7.52 7.88 4.66 0 7.08-2.32 7.08-6.54 0-5-1.88-6.63-11.65-11.2a29.19 29.19 0 0 1-9.85-7.07c-2.24-2.6-3.41-6.28-3.41-11.2 0-9.32 6.18-16.22 17.92-16.22C964.27 9.09 969.46 15.9 969.46 25.57Z' />
<path fill='#81b8ea' d='M526.87 44.57a1.44 1.44 0 0 0-1.49-.75l-.51.1-.41.07-.11-.07a1.54 1.54 0 0 0-.81-.26 5.21 5.21 0 0 0-1-1.18l0 0-.07-.07a5.67 5.67 0 0 0-1.58-1l-.42-.21a6.18 6.18 0 0 1 0-.86 1.42 1.42 0 0 0-.61-1.2c-.2-.14-.4-.28-.61-.4s-.4-.44-.6-.65-.31-.33-.39-.42a5 5 0 0 1-1-1.65 1.43 1.43 0 0 0-.92-2.13 3.42 3.42 0 0 1-.26-.46 4.44 4.44 0 0 0-.85-1.26c-.28-.26-.55-.48-.78-.67h0l.08-.15a3.54 3.54 0 0 0 .29-1.36c0-.07 0-.24 0-.32a4 4 0 0 0 0-3.08 1.59 1.59 0 0 1-.08-.22c-.06-2.12-.42-3-1.46-3.74l-.12-.09a2.65 2.65 0 0 1-.14-.23 2.72 2.72 0 0 0-1.73-1.48c-.3-.09-.57-.15-.82-.21-.8-.18-.85-.21-1-.5a4.42 4.42 0 0 1 0-.52 3.12 3.12 0 0 0-.65-2.36c-2-2.23-4.56-.13-5.63.77-.24.2-.47.39-.65.52-1.52 1.1-1.59 1.06-3.5.21l-.48-.22c-2.67-1.17-4.55-1-5.61.4a1.92 1.92 0 0 0-.18.31 6.64 6.64 0 0 1-.9-.89 6.33 6.33 0 0 0-2.64-2 12.66 12.66 0 0 0-2.46-.46c-1.36-.15-2.43-.27-3-1.1a6.26 6.26 0 0 1-.63-1.42 6.83 6.83 0 0 0-1.53-2.72l-.23-.26c-1.12-1.21-2.14-2.22-3.27-2.23a3.2 3.2 0 0 0-1.93.76 2.58 2.58 0 0 1-.37.24c-.07 0-.11 0-.32-.22a3.11 3.11 0 0 0-1.67-.85 3.42 3.42 0 0 0-2.83.7 5 5 0 0 0-1.31 3.85 1.48 1.48 0 0 0 0 .21c0 .27.12 1.37.13 1.63a1.54 1.54 0 0 0 .11.55v0a2.32 2.32 0 0 0 .89 1l-.5.12h0l-.52.13a16.76 16.76 0 0 0-2 .64 6.19 6.19 0 0 1-2.89.58c-.38 0-.76-.08-1.12-.13-1.51-.21-4-.56-4.76 3a6.18 6.18 0 0 0-.07 1.64c0 .69 0 1-.13 1.25a2.39 2.39 0 0 1-.79.53 4.59 4.59 0 0 0-1.86 1.49 6.51 6.51 0 0 0-.82 1.73 1.29 1.29 0 0 1-.74.93 2.54 2.54 0 0 1-.62.23 4 4 0 0 0-2 1.06 5 5 0 0 0-1.2 3.45 4.74 4.74 0 0 1-.18 1.25c-.14.34-.31.45-.74.72l-.36.23a3 3 0 0 0-1.05-.29c-.23 0-.26 0-.34-.09a1.57 1.57 0 0 1-.69-.79 5.54 5.54 0 0 0-1.05-1.47 3.38 3.38 0 0 0-4.92-.44 2 2 0 0 0-.9 1.57 4.63 4.63 0 0 0-1.23 1 4.59 4.59 0 0 0-.73 2.51l0 .31a9.51 9.51 0 0 0-4.29-2.11 7.93 7.93 0 0 0-4.12 1.76 6 6 0 0 0-1.1 1.51L428.5 38c-.28-.2-.49-.34-.66-.44-.58-.33-.93-.57-1.24-.77a9.81 9.81 0 0 0-2.1-1.11 2.33 2.33 0 0 0-2.17.24 1.56 1.56 0 0 0-1.06-.68 1.7 1.7 0 0 0-1.52.56 3.3 3.3 0 0 0-.6 1 2.31 2.31 0 0 0-2.12.17l-.19.1-.19-.26c-.65-.93-1.39-1.22-2.2-.88a3.44 3.44 0 0 0-1.72 1.86 1.92 1.92 0 0 0-.05.92 1.63 1.63 0 0 0-.82.15 2.08 2.08 0 0 0-1.13 1.64l-.1.07a3.81 3.81 0 0 0-2.16 2.73 4.91 4.91 0 0 0 .86 3l.17.24-.28 0-.51 0a4.88 4.88 0 0 0-3.12 1 2 2 0 0 0-2.49.58A6.68 6.68 0 0 0 401.63 52a3.84 3.84 0 0 0 .9 2.1 5.06 5.06 0 0 1 .45.74 1.44 1.44 0 0 1 0 .76 1.87 1.87 0 0 1-.49-.24l-.79-.52a20.78 20.78 0 0 0-5.62-3c-1.91-.53-4.06-.6-5.63 2.8l-.27.25a3.09 3.09 0 0 0-1.32 2.48 3.57 3.57 0 0 0 .79 1.79 3.67 3.67 0 0 1 .46.78 1.94 1.94 0 0 1-.11.51h0a2 2 0 0 0-1.24 2.25 1.59 1.59 0 0 0 .06.3 2.1 2.1 0 0 0-.59 1.54 2.15 2.15 0 0 0 .41 1.17 2.26 2.26 0 0 0-.32.64h0a3.82 3.82 0 0 0-3.15-.53 5.65 5.65 0 0 0-3.54 3.64 1.43 1.43 0 0 0 1.29 2c3.69.09 6.21.09 8.29.09h.06c1.75 0 3.41 0 5.45 0 1.72 0 9.84.26 12.65.35h.54a3.11 3.11 0 0 0 2.55-.9c.64-.78.6-1.75.34-3.07a4.83 4.83 0 0 1 1.19.26 1.45 1.45 0 0 0 1.22.67c17.19-.07 33.4.33 41.2.73 2.93.15 6.17.07 8.54 0H465c1.15 0 2.23-.06 2.63 0 8.59.55 25.69.58 26.46.44a1.37 1.37 0 0 0 .83-.47 2 2 0 0 1 1-.74 7.74 7.74 0 0 0 1.19-.62.9.9 0 0 1 .79-.17 3.36 3.36 0 0 0 1.6-.18 3.63 3.63 0 0 0 .84-.5 1.64 1.64 0 0 1 .19-.13c.14-.06.31-.11.49-.17h0a17.45 17.45 0 0 0 2.05-.78 2 2 0 0 1 .39 0 2.56 2.56 0 0 0 1.51-.4 1.91 1.91 0 0 0 .86-1.69 4 4 0 0 0 .21-.52c0-.08 0-.14.07-.18a3.76 3.76 0 0 1 .51-.06 4.37 4.37 0 0 0 3.9-2.38 2.49 2.49 0 0 0 .28-1.27v0l.07 0a3.4 3.4 0 0 0 1.41-.81 2.61 2.61 0 0 0 1-2.48l.52-.32c.4-.24.81-.48 1.19-.76a10.78 10.78 0 0 1 1.73-.92 11.77 11.77 0 0 0 2.69-1.52 69.11 69.11 0 0 0 7.24-6.72A1.43 1.43 0 0 0 526.87 44.57Z' />
<path fill='#2952a5' d='M477.73 13.51l.1.1a2.86 2.86 0 0 0 .28.3 2.93 2.93 0 0 1 .47 1 11.21 11.21 0 0 0 1.13 2.43c1.77 2.73 4.7 3.06 6.45 3.26a10.12 10.12 0 0 1 1.43.22 9 9 0 0 1 .68.69 11.06 11.06 0 0 0 1.61 1.53 4.83 4.83 0 0 0 2.83.92 5 5 0 0 0 1.21-.15A4.85 4.85 0 0 0 496 22.65l.52.21.47.21a8.8 8.8 0 0 0 3.79 1.05 7.3 7.3 0 0 0 4.42-1.7 5.58 5.58 0 0 0 3.92 2.79l.07.09a5.17 5.17 0 0 0 .42.51l.23.23c0 .12 0 .26 0 .44a5.23 5.23 0 0 0 .3 1.56h0a5.27 5.27 0 0 0-.23 1c0 .17 0 .34-.05.56a4.82 4.82 0 0 0 1.41 5.63h0l.3.24.06.13a7.78 7.78 0 0 0 .72 1.2l.06.3a9.23 9.23 0 0 0 1.92 3.53 9.44 9.44 0 0 0 .7.78h0l.33.36.24.27A4.79 4.79 0 0 0 518 45.28a9 9 0 0 0 .8.42l.34.17.15.14 0 0 .22.2.12.18c-1 .87-2 1.74-3.28 2.82a10.07 10.07 0 0 1-1.62.86 14 14 0 0 0-2.58 1.4c-.19.14-.48.32-.8.51l-.63.38a4.87 4.87 0 0 0-2.14 3.12 4.85 4.85 0 0 0-2.45 3.17 9.24 9.24 0 0 0-1 .14 4.81 4.81 0 0 0-3.5 2.94 2.19 2.19 0 0 0-.33.12L501 62a12.77 12.77 0 0 1-1.47.55h0l-.59.2a5.28 5.28 0 0 0-.73.33l-.31.19h-.24a5.73 5.73 0 0 0-3.08.92 2.86 2.86 0 0 1-.55.28 6.46 6.46 0 0 0-1.52.88h-3c-6.59 0-16.14-.16-21.54-.5-.22 0-.46 0-.79 0-.59 0-1.41 0-2.27 0h-.06c-1.33 0-3 .08-4.67.08-1.33 0-2.47 0-3.5-.08-7.23-.37-21.64-.75-37.54-.75h-2.69a4.25 4.25 0 0 0-.6-.31 10 10 0 0 0-2.36-.58 5 5 0 0 0-.67 0 4.79 4.79 0 0 0-3.48 1.49 4.84 4.84 0 0 0-1.24 2.43l-11.25-.31c-1.28 0-2.41 0-3.5 0a4.77 4.77 0 0 0 0-2.06 4.79 4.79 0 0 0 .25-1 5 5 0 0 0 .84-1.28 6.47 6.47 0 0 0 .48-1.87 4.76 4.76 0 0 0 0-1.41 5.43 5.43 0 0 0-.56-1.59 5.22 5.22 0 0 0 .52-.88c0-.06.06-.11.08-.16A17.64 17.64 0 0 1 399 58.85l.85.57a6.38 6.38 0 0 0 2 .87 4.92 4.92 0 0 0 1.13.14 4.81 4.81 0 0 0 4.55-3.28 6.24 6.24 0 0 0 .13-3.33c0-.06 0-.12-.05-.18a5.28 5.28 0 0 0-.61-1.41 4.77 4.77 0 0 0 1.5-.78l.65-.07.47 0 .3 0a4.8 4.8 0 0 0 3.78-7.09A5 5 0 0 0 414.83 43a4.64 4.64 0 0 0 1.43-1.11l.05-.05a4.89 4.89 0 0 0 .54 0 4.71 4.71 0 0 0 1.68-.31 4.3 4.3 0 0 0 .62 0 4.87 4.87 0 0 0 1.59-.27 5.25 5.25 0 0 0 1.13-.58l.47 0a4.82 4.82 0 0 0 1.25-.16l.37.23c.32.22.77.52 1.46.91l.33.23 0 0 .59.4a4.8 4.8 0 0 0 2.68.82A5.11 5.11 0 0 0 430.2 43a4.8 4.8 0 0 0 3.07-2.39l.15-.25a6.06 6.06 0 0 1 .67-.36 6.82 6.82 0 0 1 1.34.83A4.85 4.85 0 0 0 438.55 42a4.94 4.94 0 0 0 1.81-.35 4.8 4.8 0 0 0 3-4 2.64 2.64 0 0 0 0-.38v0a3.89 3.89 0 0 0 .39-.32 6.2 6.2 0 0 0 1.69 1.57 5.26 5.26 0 0 0 2.24.83 4.83 4.83 0 0 0 4.51-.48l.19-.13a6 6 0 0 0 2.68-3.07 9.05 9.05 0 0 0 .49-2.68c0-.08 0-.17 0-.27a6.1 6.1 0 0 0 1.61-.71 6 6 0 0 0 2.71-3.46l.14-.38.19-.09a6.6 6.6 0 0 0 2.44-1.94 6 6 0 0 0 1.09-3.95l.8.08.72 0a11.22 11.22 0 0 0 4.2-.9 14.3 14.3 0 0 1 1.44-.48l.47-.11h0l.6-.15a4.8 4.8 0 0 0 3.11-6.73 4.74 4.74 0 0 0 .55 0h.1a4.84 4.84 0 0 0 2-.41M473.11 8a3.18 3.18 0 0 0-2.15.75 5 5 0 0 0-1.31 3.85 1.48 1.48 0 0 0 0 .21c0 .27.12 1.37.13 1.63a1.54 1.54 0 0 0 .11.55v0a2.32 2.32 0 0 0 .89 1l-.5.12h0l-.52.13a16.76 16.76 0 0 0-2 .64 6.62 6.62 0 0 1-2.51.59h-.38c-.38 0-.76-.08-1.12-.13a10.59 10.59 0 0 0-1.35-.12c-1.37 0-2.88.51-3.41 3.16a6.18 6.18 0 0 0-.07 1.64c0 .69 0 1-.13 1.25a2.39 2.39 0 0 1-.79.53 4.67 4.67 0 0 0-1.86 1.49 6.51 6.51 0 0 0-.82 1.73 1.29 1.29 0 0 1-.74.93 2.48 2.48 0 0 1-.63.23 4 4 0 0 0-2 1.06 5 5 0 0 0-1.2 3.45 4.74 4.74 0 0 1-.18 1.25c-.14.34-.31.45-.74.72l-.36.23a3 3 0 0 0-1.05-.29c-.23 0-.26 0-.34-.09a1.57 1.57 0 0 1-.69-.79 5.54 5.54 0 0 0-1.05-1.47 3.74 3.74 0 0 0-2.6-1.3 4 4 0 0 0-2.32.86 2 2 0 0 0-.9 1.57 4.63 4.63 0 0 0-1.23 1 4.59 4.59 0 0 0-.73 2.51l0 .31a9.51 9.51 0 0 0-4.29-2.11h0a7.93 7.93 0 0 0-4.12 1.76 6 6 0 0 0-1.1 1.51L428.5 38c-.28-.2-.49-.34-.66-.44-.58-.33-.93-.57-1.24-.77a9.81 9.81 0 0 0-2.1-1.11 2.34 2.34 0 0 0-.86-.17 2.45 2.45 0 0 0-1.31.41 1.56 1.56 0 0 0-1.06-.68l-.26 0a1.76 1.76 0 0 0-1.26.58 3.3 3.3 0 0 0-.6 1 1.77 1.77 0 0 0-.83-.2 2.92 2.92 0 0 0-1.29.37l-.19.1-.19-.26a2 2 0 0 0-1.56-1 1.68 1.68 0 0 0-.64.14 3.44 3.44 0 0 0-1.72 1.86 1.92 1.92 0 0 0-.05.92h-.13a1.65 1.65 0 0 0-.69.16 2.08 2.08 0 0 0-1.13 1.65l-.1.06a3.81 3.81 0 0 0-2.16 2.73 4.91 4.91 0 0 0 .86 3l.17.24-.28 0-.51 0a4.88 4.88 0 0 0-3.12 1 2.76 2.76 0 0 0-1-.2 1.87 1.87 0 0 0-1.52.78A6.68 6.68 0 0 0 401.63 52a3.84 3.84 0 0 0 .9 2.1 5.06 5.06 0 0 1 .45.74 1.44 1.44 0 0 1 0 .76 1.87 1.87 0 0 1-.49-.24l-.79-.52a20.78 20.78 0 0 0-5.62-3 6.3 6.3 0 0 0-1.72-.27c-1.4 0-2.8.67-3.91 3.07l-.27.25a3.09 3.09 0 0 0-1.32 2.48 3.57 3.57 0 0 0 .79 1.79 3.67 3.67 0 0 1 .46.78 1.94 1.94 0 0 1-.11.51h0a2 2 0 0 0-1.24 2.25 1.59 1.59 0 0 0 .06.3 2.1 2.1 0 0 0-.59 1.54 2.15 2.15 0 0 0 .41 1.17 2.26 2.26 0 0 0-.32.64h0a4 4 0 0 0-2.16-.67 3.38 3.38 0 0 0-1 .14 5.65 5.65 0 0 0-3.54 3.64 1.43 1.43 0 0 0 1.29 2c3.1.08 5.38.09 7.26.09h1.09c1.75 0 3.41 0 5.45 0 1.72 0 9.84.26 12.65.35h.54a3.11 3.11 0 0 0 2.55-.9c.64-.78.6-1.75.34-3.07a4.83 4.83 0 0 1 1.19.26 1.45 1.45 0 0 0 1.22.67h3.91c15.7 0 30.09.37 37.29.74 1.22.07 2.5.09 3.75.09 1.74 0 3.41 0 4.79-.08H465l2.15 0h.48c5.95.38 16 .51 21.85.51 2.6 0 4.37 0 4.61-.07a1.37 1.37 0 0 0 .83-.47 2 2 0 0 1 1-.74 7.74 7.74 0 0 0 1.19-.62.9.9 0 0 1 .53-.19l.26 0 .5 0a3 3 0 0 0 1.1-.2 3.63 3.63 0 0 0 .84-.5l.18-.13.5-.17h0a17.45 17.45 0 0 0 2.05-.78 2 2 0 0 1 .39 0 2.56 2.56 0 0 0 1.51-.4 1.91 1.91 0 0 0 .86-1.69 4 4 0 0 0 .21-.52c0-.08 0-.14.07-.18a3.76 3.76 0 0 1 .51-.06 4.37 4.37 0 0 0 3.9-2.38 2.49 2.49 0 0 0 .28-1.27v0l.07 0a3.4 3.4 0 0 0 1.41-.81 2.61 2.61 0 0 0 1-2.48l.52-.32c.4-.24.81-.48 1.19-.76a10.78 10.78 0 0 1 1.73-.92 11.77 11.77 0 0 0 2.69-1.52 69.11 69.11 0 0 0 7.24-6.72 1.43 1.43 0 0 0-1-2.41l-.23 0-.51.1a2.83 2.83 0 0 1-.4.07h0l-.11-.07a1.54 1.54 0 0 0-.81-.26 5.21 5.21 0 0 0-1-1.18l0 0-.07-.07a5.67 5.67 0 0 0-1.58-1l-.42-.21a6.18 6.18 0 0 1 0-.86 1.42 1.42 0 0 0-.61-1.2c-.2-.14-.4-.28-.61-.4s-.4-.44-.6-.65-.31-.33-.39-.42a5 5 0 0 1-1-1.65 1.42 1.42 0 0 0 .11-1.22 1.43 1.43 0 0 0-1-.91 3.42 3.42 0 0 1-.26-.46 4.44 4.44 0 0 0-.85-1.26c-.28-.26-.55-.48-.78-.67h0l.08-.15a3.54 3.54 0 0 0 .29-1.36c0-.07 0-.24 0-.32a4 4 0 0 0 0-3.08 1.59 1.59 0 0 1-.08-.22c-.06-2.12-.42-3-1.46-3.74l-.12-.09a2.65 2.65 0 0 1-.14-.23 2.72 2.72 0 0 0-1.73-1.48c-.3-.09-.57-.15-.82-.21-.8-.18-.85-.21-1-.5a4.42 4.42 0 0 1 0-.52 3.12 3.12 0 0 0-.65-2.36 2.72 2.72 0 0 0-2.07-1c-1.45 0-2.83 1.15-3.56 1.76-.24.2-.47.39-.65.52-.8.58-1.2.84-1.67.84a5.16 5.16 0 0 1-1.83-.63l-.48-.22a7.93 7.93 0 0 0-3.12-.79 2.93 2.93 0 0 0-2.49 1.19 1.92 1.92 0 0 0-.18.31 6.64 6.64 0 0 1-.9-.89 6.33 6.33 0 0 0-2.64-2 12.66 12.66 0 0 0-2.46-.46c-1.36-.15-2.43-.27-3-1.1a6.26 6.26 0 0 1-.63-1.42 6.83 6.83 0 0 0-1.53-2.72l-.23-.26c-1.12-1.21-2.14-2.22-3.27-2.23h0a3.26 3.26 0 0 0-1.9.76 2.58 2.58 0 0 1-.37.24c-.07 0-.11 0-.32-.22a3.11 3.11 0 0 0-1.67-.85 5.31 5.31 0 0 0-.68-.05Z' />
</svg>
</div>
<canvas id="canvas"></canvas>
<div id="content"></div>
</div>
html,
body {
margin: 0;
padding: 0;
width: 100%;
height: 100%;
}
*,
*:before,
*:after {
margin: 0;
padding: 0;
box-sizing: border-box;
}
#pageWrap {
width: 100%;
height: 1600px;
background-color: #e1f0ff;
}
.header {
height: 110px;
max-height: 110px;
width: 100%;
position: fixed;
top: 0;
padding: 15px;
text-align: center;
z-index: 100;
}
.header svg {
margin: 0 auto;
display: inline-block;
position: relative;
width: 80%;
height: auto;
max-width: 980px;
}
#canvas {
position: fixed;
width: 100%;
left: 0;
top: 0;
background: -moz-linear-gradient(
top,
rgba(225, 240, 255, 0) 0%,
rgba(225, 240, 255, 0) 19%,
rgba(195, 222, 248, 0) 35%,
rgba(129, 184, 234, 0.5) 70%,
rgba(129, 184, 234, 1) 100%
); /* FF3.6-15 */
background: -webkit-linear-gradient(
top,
rgba(225, 240, 255, 0) 0%,
rgba(225, 240, 255, 0) 19%,
rgba(195, 222, 248, 0) 35%,
rgba(129, 184, 234, 0.5) 70%,
rgba(129, 184, 234, 1) 100%
); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(
to bottom,
rgba(225, 240, 255, 0) 0%,
rgba(225, 240, 255, 0) 19%,
rgba(195, 222, 248, 0) 35%,
rgba(129, 184, 234, 0.5) 70%,
rgba(129, 184, 234, 1) 100%
); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00e1f0ff', endColorstr='#81b8ea',GradientType=0 ); /* IE6-9 */
z-index: 1;
}
#content {
width: 100%;
height: 100%;
margin: 0;
margin-top: -4px;
padding: 0;
}
var canvas = document.getElementById("canvas");
var context = canvas.getContext("2d");
var resolution = window.devicePixelRatio || 1;
var waves = [];
var resized = false;
var vw, vh;
resizeCanvas();
var getRandomVal = function (min, max) {
return Math.round((Math.random() * (max - min) + min) * 100) / 100;
};
var wave1 = createWave(context, {
amplitude: vw / 18,
duration: 5.75,
fillStyle: "rgba(129,184,234,0.5)",
frequency: 1.5,
width: vw,
height: vh,
segments: 100,
waveHeight: vh * 0.15
});
var wave2 = createWave(context, {
amplitude: vw / 20,
duration: 5,
fillStyle: "rgba(129,184,234,0.4)",
frequency: 2,
width: vw,
height: vh,
segments: 100,
waveHeight: vh * 0.2
});
var wave3 = createWave(context, {
amplitude: vw / 22,
duration: 4.25,
fillStyle: "rgba(129,184,234,0.3)",
frequency: 2.5,
width: vw,
height: vh,
segments: 100,
waveHeight: vh * 0.235
});
waves.push(wave1, wave2, wave3);
TweenMax.to(waves, 4, {
waveHeight: vh * 0.15,
amplitude: getRandomVal(vw / 16, vw / 23),
ease: Sine.easeInOut,
repeat: -1,
repeatDelay: 1,
yoyo: true
});
TweenMax.fromTo(
wave1,
3,
{
duration: 4.25,
frequency: 1.25
},
{
duration: getRandomVal(4, 0.15),
frequency: getRandomVal(2.5, 0.2),
ease: SlowMo.ease.config(0.3, 0.7, false),
repeat: -1,
yoyo: true
}
);
TweenMax.fromTo(
wave2,
2,
{
duration: 3.75,
frequency: 1.5
},
{
duration: getRandomVal(4, 0.15),
frequency: getRandomVal(2.5, 0.2),
ease: SlowMo.ease.config(0.3, 0.7, false),
repeat: -1,
yoyo: true
}
);
TweenMax.fromTo(
wave3,
2.5,
{
duration: 3.25,
frequency: 1.5
},
{
duration: getRandomVal(4, 0.15),
frequency: getRandomVal(2.5, 0.2),
ease: SlowMo.ease.config(0.3, 0.7, false),
repeat: -1,
yoyo: true
}
);
window.addEventListener("resize", function () {
resized = true;
});
TweenLite.ticker.addEventListener("tick", update);
function update() {
var len = waves.length;
if (resized) {
resizeCanvas();
for (var i = 0; i < len; i++) {
waves[i].resize(vw, vh);
}
resized = false;
}
context.clearRect(0, 0, vw, vh);
context.globalCompositeOperation = "sourceIn";
for (var i = 0; i < len; i++) {
waves[i].draw();
}
}
function createWave(context, options) {
options = options || {};
// API
var wave = {
// Properties
amplitude: options.amplitude || 100,
context: context,
curviness: options.curviness || 0.75,
duration: options.duration || 2,
fillStyle: options.fillStyle || "rgba(129,184,234,1)",
frequency: options.frequency || 4,
height: options.height || 600,
points: [],
segments: options.segments || 100,
tweens: [],
waveHeight: options.waveHeight || 300,
width: options.width || 800,
x: options.x || 0,
y: options.y || 0,
// Methods
init: init,
resize: resize,
draw: draw,
kill: kill
};
init();
function kill() {
var tweens = wave.tweens;
var len = tweens.length;
for (var i = 0; i < len; i++) {
tweens[i].kill();
}
tweens.length = 0;
wave.points.length = 0;
}
function init() {
kill();
var segments = wave.segments;
var interval = wave.width / segments;
for (var i = 0; i <= segments; i++) {
var norm = i / segments;
var point = {
x: wave.x + i * interval,
y: 1
};
var tween = TweenMax.to(point, wave.duration, {
y: -1,
repeat: -1,
yoyo: true,
ease: Sine.easeInOut
}).progress(norm * wave.frequency);
wave.tweens.push(tween);
wave.points.push(point);
}
}
function draw() {
var points = wave.points;
var len = points.length;
var startY = wave.waveHeight;
var height = wave.amplitude / 2;
context.beginPath();
context.moveTo(points[0].x, startY + points[0].y * height);
for (var i = 1; i < len; i++) {
var point = points[i];
context.lineTo(point.x, startY + point.y * height);
}
context.lineTo(wave.x + wave.width, wave.y + wave.height);
context.lineTo(wave.x, wave.y + wave.height);
context.closePath();
context.fillStyle = wave.fillStyle;
context.fill();
}
function resize(width, height) {
wave.width = width;
wave.height = height;
var points = wave.points;
var len = points.length;
var interval = wave.width / wave.segments;
for (var i = 0; i < len; i++) {
var point = points[i];
point.x = wave.x + i * interval;
}
}
return wave;
}
function resizeCanvas() {
vw = window.innerWidth;
vh = window.innerHeight;
canvas.width = vw * resolution;
canvas.height = vh * resolution;
canvas.style.width = vw + "px";
canvas.style.height = vh + "px";
context.scale(resolution, resolution);
}
This Pen doesn't use any external CSS resources.