Question posted in 
I’m having real trouble getting the sequence of animations below to run infinitely.
To put you fully in the picture: I have a monitor image as the background and three separate images in faded overlay via the opacity attribute.
The problem is, when I set the iteration value to be greater than 1, on the second run, the image stays on the ‘screen’, it doesn’t fade out to make way for the next image. I’ve experimented with ‘alternate’, ‘infinite’ and so on to no avail.
I think the problem might lie with the end opacity state being 0 but my brain can’t reason it out. Grateful for any pointers. Perhaps JS would be needed?
/*#development-layer, #SEO-layer, #data-layer {
display: none;
} */
#development-layer{
opacity: 0;
animation: dev 4s ease forwards;
}
#SEO-layer{
opacity: 0;
animation: seo 4s 4s ease forwards;
}
#data-layer{
opacity: 0;
animation: data 4s 8s ease forwards;
}
@keyframes dev {
0% {opacity: 0;}
33% {opacity: 0.5;}
66% {opacity: 1; }
100% {opacity: 0}
}
@keyframes seo {
0% {opacity: 0;}
33% {opacity: 0.5;}
66% {opacity: 1; }
100% {opacity: 0}
}
@keyframes data {
0% {opacity: 0;}
33% {opacity: 0.5;}
66% {opacity: 1; }
100% {opacity: 0}
}<svg
height="500"
width="550"
id="services-page-monitor-graphic"
viewBox="0 0 550.00002 500">
<g
transform="translate(0,-552.36223)"
id="layer1">
<g
style="fill:#ff00ff;fill-opacity:0"
id="g7-0"
transform="translate(15.428072,547.79077)">
</g>
<!--MONITOR TEMPLATE (CANVAS) -->
<g
transform="matrix(1.6666666,0,0,1.6666666,10.000831,-712.24854)"
id="monitor-template">
<path
style="fill:#333a56;fill-opacity:1"
d="m 308.99892,944.97327 -299.9994145,0 0,-157.7581 c 0,-9.99842 8.1052565,-18.10367 18.1036755,-18.10367 l 263.792649,0 c 9.99842,0 18.10368,8.10525 18.10368,18.10367 l 0,157.7581 z"
id="path5-94" />
<path
style="fill:#ebebeb;fill-opacity:1"
d="m 221.06804,1048.4215 -124.137647,0 c 0,-11.4258 9.263657,-20.6894 20.689417,-20.6894 l 82.75823,0 c 11.42635,0 20.69,9.2636 20.69,20.6894"
id="path19-1" />
<polygon
transform="matrix(0.58593635,0,0,0.58593635,8.9995055,758.76679)"
style="fill:#b0b6bb"
points="300.138,388.414 317.793,459.034 194.207,459.034 211.862,388.414 "
id="polygon21-0" />
<path
id="path25-8"
d="m 290.89525,986.35268 -263.792069,0 c -9.998419,0 -18.1036755,-8.10526 -18.1036755,-18.10368 l 0,-23.27573 299.9994145,0 0,23.27573 c 0,9.99842 -8.10526,18.10368 -18.10367,18.10368"
style="fill:#e8e8e8;fill-opacity:1" />
</g>
<!-- DATA LAYER !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!-->
<g
transform="matrix(1.6666666,0,0,1.6666666,19.988863,-720.19009)"
id="data-layer">
<path
id="path27-5"
d="m 79.107381,895.55247 c -1.324216,0 -2.648432,-0.50684 -3.656829,-1.51524 -2.022658,-2.02265 -2.022658,-5.29627 0,-7.31365 l 14.958369,-14.95369 c 2.017379,-2.01737 5.291592,-2.01737 7.313658,0 2.017379,2.02266 2.017379,5.29628 0,7.31366 L 82.76421,894.03723 c -1.008397,1.0084 -2.332613,1.51524 -3.656829,1.51524"
style="fill:#e8edee" />
<path
id="path29-8"
d="m 135.44282,895.55247 c -1.32422,0 -2.64843,-0.50684 -3.65683,-1.51524 l -14.95837,-14.95368 c -2.01738,-2.01738 -2.01738,-5.29159 0,-7.31366 2.01738,-2.01737 5.29628,-2.01737 7.31366,0 l 14.95837,14.95369 c 2.02265,2.01738 2.02265,5.29159 0,7.31365 -1.0084,1.0084 -2.33262,1.51524 -3.65683,1.51524"
style="fill:#e8edee" />
<path
id="path31-6"
d="m 154.45294,897.79543 c -1.32422,0 -2.64844,-0.50684 -3.65683,-1.51582 -2.02265,-2.02265 -2.02265,-5.29159 0,-7.31366 l 43.06046,-43.05518 c 2.01738,-2.02266 5.29159,-2.02266 7.31366,0 2.01738,2.01737 2.01738,5.29159 0,7.31365 l -43.06046,43.05519 c -1.0084,1.00898 -2.33262,1.51582 -3.65683,1.51582"
style="fill:#e8e8e8" />
<path
id="path33-7"
d="m 254.4084,885.20776 c -1.32421,0 -2.64843,-0.50684 -3.65682,-1.51523 l -30.47573,-30.47045 c -2.01737,-2.01738 -2.01737,-5.29159 0,-7.31366 2.02266,-2.01738 5.29628,-2.01738 7.31366,0 l 30.47572,30.47045 c 2.02266,2.01738 2.02266,5.29159 0,7.31366 -1.00839,1.00839 -2.33261,1.51523 -3.65683,1.51523"
style="fill:#e8edee" />
<path
id="path37-7"
class="blue-dots"
d="m 122.79245,867.38709 c 0,8.57049 -6.94627,15.51735 -15.51735,15.51735 -8.571078,0 -15.517353,-6.94627 -15.517353,-15.51735 0,-8.57049 6.946275,-15.51735 15.517353,-15.51735 8.57108,0 15.51735,6.94686 15.51735,15.51735"
style="fill:#52658f" />
<path
class="green-dots"
id="path39-4"
d="m 226.24069,841.52503 c 0,8.57049 -6.94628,15.51735 -15.51736,15.51735 -8.57049,0 -15.51735,-6.94627 -15.51735,-15.51735 0,-8.57107 6.94628,-15.51736 15.51735,-15.51736 8.57049,5.8e-4 15.51736,6.94687 15.51736,15.51736"
style="fill:#25ae88" />
<path
id="path41-8"
d="m 277.96422,893.24915 c 0,8.57049 -6.94628,15.51735 -15.51736,15.51735 -8.57107,0 -15.51735,-6.94627 -15.51735,-15.51735 0,-8.57108 6.94628,-15.51735 15.51735,-15.51735 8.57108,0 15.51736,6.94686 15.51736,15.51735"
style="fill:#52658f" />
<path
id="green-dot-2"
d="m 158.99922,903.59386 c 0,8.57049 -6.94628,15.51735 -15.51736,15.51735 -8.57107,0 -15.51735,-6.94628 -15.51735,-15.51735 0,-8.57108 6.94628,-15.51736 15.51735,-15.51736 8.57108,0 15.51736,6.94686 15.51736,15.51736"
style="fill:#25ae88" />
<path
id="green-dot-1"
d="m 86.585687,903.59386 c 0,8.57049 -6.946276,15.51735 -15.517359,15.51735 -8.571077,0 -15.517351,-6.94628 -15.517351,-15.51735 0,-8.57108 6.946274,-15.51736 15.517351,-15.51736 8.571083,0 15.517359,6.94686 15.517359,15.51736"
style="fill:#25ae88" />
<path
id="path9-7"
d="m 90.117986,807.89693 -56.896183,0 c -2.855268,0 -5.172646,-2.31738 -5.172646,-5.17264 0,-2.85527 2.317378,-5.17265 5.172646,-5.17265 l 56.896183,0 c 2.855268,0 5.172646,2.31738 5.172646,5.17265 0,2.85526 -2.317378,5.17264 -5.172646,5.17264"
style="fill:#aaccff" />
<path
id="path11-0"
d="m 157.35946,807.89693 -46.55148,0 c -2.85526,0 -5.17264,-2.31738 -5.17264,-5.17264 0,-2.85527 2.31738,-5.17265 5.17264,-5.17265 l 46.55148,0 c 2.85526,0 5.17264,2.31738 5.17264,5.17265 0,2.85526 -2.31738,5.17264 -5.17264,5.17264"
style="fill:#aaccff" />
<path
id="path13-6"
d="m 64.255922,828.58634 -31.034119,0 c -2.855268,0 -5.172646,-2.31737 -5.172646,-5.17264 0,-2.85527 2.317378,-5.17265 5.172646,-5.17265 l 31.034705,0 c 2.855268,0 5.172646,2.31738 5.172646,5.17265 0,2.85527 -2.317964,5.17264 -5.173232,5.17264"
style="fill:#aaccff" />
<path
id="path15-7"
d="m 131.4974,828.58634 -46.551474,0 c -2.855268,0 -5.172646,-2.31737 -5.172646,-5.17264 0,-2.85527 2.317378,-5.17265 5.172646,-5.17265 l 46.551474,0 c 2.85527,0 5.17264,2.31738 5.17264,5.17265 0,2.85527 -2.31737,5.17264 -5.17264,5.17264"
style="fill:#aaccff" />
<path
id="path17-1"
d="m 157.35946,828.58634 -5.17265,0 c -2.85527,0 -5.17265,-2.31737 -5.17265,-5.17264 0,-2.85527 2.31738,-5.17265 5.17265,-5.17265 l 5.17265,0 c 2.85526,0 5.17264,2.31738 5.17264,5.17265 0,2.85527 -2.31738,5.17264 -5.17264,5.17264"
style="fill:#aaccff" />
</g>
<!--DEVELOPMENT LAYER!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!--->
<g
transform="translate(26.730937,-464.82367)"
id="development-layer">
<path
style="fill:#ff8980"
d="m 41.805398,1091.2515 -0.480608,0 c -4.337077,0 -7.851999,-3.8742 -7.851999,-8.6492 0,-4.7749 3.514922,-8.6492 7.851999,-8.6492 l 0.480608,0 c 4.34098,0 7.855902,3.8743 7.855902,8.6492 0,4.775 -3.514922,8.6492 -7.855902,8.6492 z m 0,0"
/>
<path
style="fill:#ff8980"
d="m 95.684731,1091.2515 -29.330602,0 c -4.337077,0 -7.851999,-3.8742 -7.851999,-8.6492 0,-4.7749 3.514922,-8.6492 7.851999,-8.6492 l 29.330602,0 c 4.337069,0 7.855999,3.8743 7.855999,8.6492 0,4.775 -3.51893,8.6492 -7.855999,8.6492 z m 0,0"
/>
<path
style="fill:#8dffa2"
d="m 41.805287,1119.7745 -0.480571,0 c -4.337042,0 -7.851955,-3.8698 -7.851955,-8.6492 0,-4.7749 3.514913,-8.6491 7.851955,-8.6491 l 0.480571,0 c 4.341015,0 7.855926,3.8742 7.855926,8.6491 0,4.7794 -3.514911,8.6492 -7.855926,8.6492 z m 0,0" />
<path
style="fill:#8dffa2"
d="m 131.99355,1119.7745 -65.639485,0 c -4.337044,0 -7.851955,-3.8698 -7.851955,-8.6492 0,-4.7749 3.514911,-8.6491 7.851955,-8.6491 l 65.639485,0 c 4.34101,0 7.85593,3.8742 7.85593,8.6491 0,4.7794 -3.51492,8.6492 -7.85593,8.6492 z m 0,0" />
<path
style="fill:#8dffa2"
d="m 41.805287,1148.302 -0.480571,0 c -4.337042,0 -7.851955,-3.8743 -7.851955,-8.6492 0,-4.7794 3.514913,-8.6492 7.851955,-8.6492 l 0.480571,0 c 4.341015,0 7.855926,3.8698 7.855926,8.6492 0,4.7749 -3.514911,8.6492 -7.855926,8.6492 z m 0,0" />
<path
style="fill:#8dffa2"
d="m 113.83914,1148.302 -47.485075,0 c -4.337044,0 -7.851955,-3.8743 -7.851955,-8.6492 0,-4.7794 3.514911,-8.6492 7.851955,-8.6492 l 47.485075,0 c 4.34101,0 7.85592,3.8698 7.85592,8.6492 0,4.7749 -3.51491,8.6492 -7.85592,8.6492 z m 0,0" />
<path
style="fill:#8dffa2"
d="m 41.805287,1176.825 -0.480571,0 c -4.337042,0 -7.851955,-3.8742 -7.851955,-8.6492 0,-4.775 3.514913,-8.6492 7.851955,-8.6492 l 0.480571,0 c 4.341015,0 7.855926,3.8742 7.855926,8.6492 0,4.775 -3.514911,8.6492 -7.855926,8.6492 z m 0,0" />
<path
style="fill:#8dffa2"
d="m 186.46078,1176.825 -76.11273,0 c -4.34102,0 -7.85593,-3.8742 -7.85593,-8.6492 0,-4.775 3.51889,-8.6492 7.85593,-8.6492 l 76.11273,0 c 4.34102,0 7.85593,3.8742 7.85593,8.6492 0,4.775 -3.51491,8.6492 -7.85593,8.6492 z m 0,0" />
<path
style="fill:#8dffa2"
d="m 88.702549,1176.825 -22.348484,0 c -4.337044,0 -7.851955,-3.8742 -7.851955,-8.6492 0,-4.775 3.514911,-8.6492 7.851955,-8.6492 l 22.348484,0 c 4.337043,0 7.85196,3.8742 7.85196,8.6492 0,4.775 -3.514917,8.6492 -7.85196,8.6492 z m 0,0" />
<path
style="fill:#aaccff;fill-opacity:1"
d="m 41.805398,1205.3481 -0.480608,0 c -4.337077,0 -7.851999,-3.8698 -7.851999,-8.6491 0,-4.7751 3.514922,-8.6492 7.851999,-8.6492 l 0.480608,0 c 4.34098,0 7.855902,3.8741 7.855902,8.6492 0,4.7793 -3.514922,8.6491 -7.855902,8.6491 z m 0,0"
/>
<path
style="fill:#aaccff"
d="m 131.99365,1205.3481 -65.639521,0 c -4.337077,0 -7.851999,-3.8698 -7.851999,-8.6491 0,-4.7751 3.514922,-8.6492 7.851999,-8.6492 l 65.639521,0 c 4.34098,0 7.8559,3.8741 7.8559,8.6492 0,4.7793 -3.51492,8.6491 -7.8559,8.6491 z m 0,0"
/>
<path
style="fill:#aaccff"
d="m 41.805398,1233.8712 -0.480608,0 c -4.337077,0 -7.851999,-3.8698 -7.851999,-8.6449 0,-4.7793 3.514922,-8.6491 7.851999,-8.6491 l 0.480608,0 c 4.34098,0 7.855902,3.8698 7.855902,8.6491 0,4.7751 -3.514922,8.6449 -7.855902,8.6449 z m 0,0"
/>
<path
style="fill:#aaccff"
d="m 131.99365,1233.8712 -65.639521,0 c -4.337077,0 -7.851999,-3.8698 -7.851999,-8.6449 0,-4.7793 3.514922,-8.6491 7.851999,-8.6491 l 65.639521,0 c 4.34098,0 7.8559,3.8698 7.8559,8.6491 0,4.7751 -3.51492,8.6449 -7.8559,8.6449 z m 0,0"
/>
<path
style="fill:#ff8980"
d="m 41.805398,1262.3986 -0.480608,0 c -4.337077,0 -7.851999,-3.8742 -7.851999,-8.6492 0,-4.7749 3.514922,-8.6492 7.851999,-8.6492 l 0.480608,0 c 4.34098,0 7.855902,3.8743 7.855902,8.6492 0,4.775 -3.514922,8.6492 -7.855902,8.6492 z m 0,0"
/>
<path
style="fill:#ff8980"
d="m 192.29116,1262.3986 -25.38279,0 c -4.34098,0 -7.8559,-3.8742 -7.8559,-8.6492 0,-4.7749 3.51892,-8.6492 7.8559,-8.6492 l 25.38279,0 c 4.34108,0 7.856,3.8743 7.856,8.6492 0,4.775 -3.51492,8.6492 -7.856,8.6492 z m 0,0"
/>
<path
style="fill:#ff8980"
d="m 143.86489,1262.3986 -77.510761,0 c -4.337077,0 -7.851999,-3.8742 -7.851999,-8.6492 0,-4.7749 3.514922,-8.6492 7.851999,-8.6492 l 77.510761,0 c 4.34098,0 7.8559,3.8743 7.8559,8.6492 0,4.775 -3.51492,8.6492 -7.8559,8.6492 z m 0,0"
/>
<path
style="fill:#ff8980"
d="m 41.805398,1290.9217 -0.480608,0 c -4.337077,0 -7.851999,-3.8699 -7.851999,-8.6492 0,-4.7749 3.514922,-8.6448 7.851999,-8.6448 l 0.480608,0 c 4.34098,0 7.855902,3.8698 7.855902,8.6448 0,4.7793 -3.514922,8.6492 -7.855902,8.6492 z m 0,0"
/>
<path
style="fill:#ff8980"
d="m 131.99365,1290.9217 -65.639521,0 c -4.337077,0 -7.851999,-3.8699 -7.851999,-8.6492 0,-4.7749 3.514922,-8.6448 7.851999,-8.6448 l 65.639521,0 c 4.34098,0 7.8559,3.8698 7.8559,8.6448 0,4.7793 -3.51492,8.6492 -7.8559,8.6492 z m 0,0"
/>
<path
style="fill:#ff8980"
d="m 157.02299,1290.9217 -0.48062,0 c -4.33706,0 -7.852,-3.8699 -7.852,-8.6492 0,-4.7749 3.51494,-8.6448 7.852,-8.6448 l 0.48062,0 c 4.34098,0 7.8559,3.8698 7.8559,8.6448 0,4.7793 -3.51492,8.6492 -7.8559,8.6492 z m 0,0"
/>
<path
style="fill:#ff8980"
d="m 120.60292,1091.2515 -0.48051,0 c -4.33718,0 -7.856,-3.8742 -7.856,-8.6492 0,-4.7749 3.51882,-8.6492 7.856,-8.6492 l 0.48051,0 c 4.34098,0 7.8559,3.8743 7.8559,8.6492 0,4.775 -3.51492,8.6492 -7.8559,8.6492 z m 0,0"
/>
<path
style="fill:#ff8980"
d="m 178.02107,1290.9217 -0.4805,0 c -4.34108,0 -7.856,-3.8699 -7.856,-8.6492 0,-4.7749 3.51882,-8.6448 7.856,-8.6448 l 0.4805,0 c 4.34099,0 7.8559,3.8698 7.8559,8.6448 0,4.7793 -3.51491,8.6492 -7.8559,8.6492 z m 0,0"
/>
<path
style="fill:#ff8980"
d="m 219.24682,1262.3986 -0.4805,0 c -4.34108,0 -7.856,-3.8742 -7.856,-8.6492 0,-4.7749 3.51882,-8.6492 7.856,-8.6492 l 0.4805,0 c 4.34099,0 7.8559,3.8743 7.8559,8.6492 0,4.775 -3.51491,8.6492 -7.8559,8.6492 z m 0,0"
/>
<path
style="fill:#aaccff"
d="m 156.78469,1234.2866 -0.48062,0 c -4.34098,0 -7.8559,-3.8699 -7.8559,-8.6449 0,-4.7793 3.51884,-8.6491 7.8559,-8.6491 l 0.48062,0 c 4.33697,0 7.8559,3.8698 7.8559,8.6491 0,4.775 -3.51893,8.6449 -7.8559,8.6449 z m 0,0"
/>
<path
style="fill:#aaccff"
d="m 156.78469,1205.3481 -0.48062,0 c -4.34098,0 -7.8559,-3.8698 -7.8559,-8.6491 0,-4.7751 3.51884,-8.6492 7.8559,-8.6492 l 0.48062,0 c 4.33697,0 7.8559,3.8741 7.8559,8.6492 0,4.7793 -3.51893,8.6491 -7.8559,8.6491 z m 0,0"
/>
<path
style="fill:#aaccff"
d="m 178.02107,1234.2866 -0.4805,0 c -4.34108,0 -7.856,-3.8699 -7.856,-8.6449 0,-4.7793 3.51882,-8.6491 7.856,-8.6491 l 0.4805,0 c 4.34099,0 7.8559,3.8698 7.8559,8.6491 0,4.775 -3.51491,8.6449 -7.8559,8.6449 z m 0,0"
/>
<path
style="fill:#aaccff"
d="m 199.25747,1234.2866 -0.48051,0 c -4.33707,0 -7.8559,-3.8699 -7.8559,-8.6449 0,-4.7793 3.51883,-8.6491 7.8559,-8.6491 l 0.48051,0 c 4.34109,0 7.856,3.8698 7.856,8.6491 0,4.775 -3.51491,8.6449 -7.856,8.6449 z m 0,0"
/>
<path
style="fill:#aaccff"
d="m 220.49787,1234.2866 -0.48051,0 c -4.34107,0 -7.8559,-3.8699 -7.8559,-8.6449 0,-4.7793 3.51483,-8.6491 7.8559,-8.6491 l 0.48051,0 c 4.33707,0 7.852,3.8698 7.852,8.6491 0,4.775 -3.51493,8.6449 -7.852,8.6449 z m 0,0"
id="path84-9-1" />
<g
style="fill:#aaccff"
id="g5-4"
transform="matrix(0.40569882,0,0,0.43786134,255.34757,1071.0934)">
<path
style="fill:#aaccff"
id="path7-1"
d="M 503.83,0 8.17,0 C 3.657,0 0,3.657 0,8.17 l 0,495.66 c 0,4.513 3.657,8.17 8.17,8.17 l 495.66,0 c 4.513,0 8.17,-3.657 8.17,-8.17 L 512,8.17 C 512,3.657 508.343,0 503.83,0 Z m -8.17,495.66 -479.32,0 0,-479.32 479.32,0 0,479.32 z" />
</g>
<path
d="m 446.49216,1085.4031 -174.57139,0 c -1.83092,0 -3.31456,1.6013 -3.31456,3.5774 l 0,14.3097 c 0,1.9761 1.48364,3.5773 3.31456,3.5773 l 174.57139,0 c 1.83092,0 3.31456,-1.6012 3.31456,-3.5773 l 0,-14.3097 c 0,-1.9761 -1.48364,-3.5774 -3.31456,-3.5774 z m -3.31456,14.3098 -167.94227,0 0,-7.1547 167.94187,0 0,7.1547 z"
id="path13-8-1"
style="fill:#aaccff" />
<g
style="fill:#aaccff"
id="g17-8"
transform="matrix(0.40569882,0,0,0.43786134,255.34757,1071.0934)">
<path
style="fill:#aaccff"
id="path19-3-3"
d="m 471.149,350.412 -430.298,0 c -4.513,0 -8.17,3.657 -8.17,8.17 l 0,112.567 c 0,4.513 3.657,8.17 8.17,8.17 l 430.298,0 c 4.513,0 8.17,-3.657 8.17,-8.17 l 0,-112.567 c 0,-4.513 -3.657,-8.17 -8.17,-8.17 z m -8.17,112.567 -413.958,0 0,-96.227 413.957,0 0,96.227 z" />
</g>
<g
style="fill:#aaccff"
id="g23-0-3"
transform="matrix(0.40569882,0,0,0.43786134,255.34757,1071.0934)">
<path
style="fill:#aaccff"
id="path25-1-2"
d="m 316.822,98.043 -121.644,0 c -4.513,0 -8.17,3.657 -8.17,8.17 l 0,121.646 c 0,4.513 3.657,8.17 8.17,8.17 l 121.645,0 c 4.513,0 8.17,-3.657 8.17,-8.17 l 0,-121.646 c 0,-4.513 -3.657,-8.17 -8.171,-8.17 z m -19.726,16.34 -41.096,41.097 -41.097,-41.097 82.193,0 z m -93.748,11.555 41.097,41.097 -41.097,41.097 0,-82.194 z m 11.556,93.75 41.096,-41.097 41.097,41.097 -82.193,0 z m 93.748,-11.556 -41.097,-41.097 41.097,-41.097 0,82.194 z" />
</g>
<g
style="fill:#aaccff"
id="g29-4"
transform="matrix(0.40569882,0,0,0.43786134,255.34757,1071.0934)">
<path
style="fill:#aaccff"
id="path31-2-5"
d="m 471.149,98.043 -121.646,0 c -4.513,0 -8.17,3.657 -8.17,8.17 l 0,121.646 c 0,4.513 3.657,8.17 8.17,8.17 l 121.646,0 c 4.513,0 8.17,-3.657 8.17,-8.17 l 0,-121.646 c 0,-4.513 -3.657,-8.17 -8.17,-8.17 z m -19.726,16.34 -41.097,41.097 -41.097,-41.097 82.194,0 z m -93.75,11.555 41.097,41.097 -41.097,41.097 0,-82.194 z m 11.555,93.75 41.098,-41.097 41.097,41.097 -82.195,0 z m 93.751,-11.556 -41.097,-41.097 41.097,-41.097 0,82.194 z" />
</g>
<g
style="fill:#aaccff;"
id="g35-6-4"
transform="matrix(0.40569882,0,0,0.43786134,255.34757,1071.0934)">
<path
style="fill:#aaccff;fill-opacity:1"
id="path37-3-6"
d="m 316.822,252.369 -121.644,0 c -4.513,0 -8.17,3.657 -8.17,8.17 0,4.513 3.657,8.17 8.17,8.17 l 121.645,0 c 4.513,0 8.17,-3.657 8.17,-8.17 0,-4.513 -3.657,-8.17 -8.171,-8.17 z" />
</g>
<g
style="fill:#aaccff"
id="g41-4"
transform="matrix(0.40569882,0,0,0.43786134,255.34757,1071.0934)">
<path
style="fill:#aaccff"
id="path43-2-6"
d="m 471.149,252.369 -121.646,0 c -4.513,0 -8.17,3.657 -8.17,8.17 0,4.513 3.657,8.17 8.17,8.17 l 121.646,0 c 4.513,0 8.17,-3.657 8.17,-8.17 0,-4.513 -3.657,-8.17 -8.17,-8.17 z" />
</g>
<g
style="fill:#aaccff"
id="g47-2-4"
transform="matrix(0.40569882,0,0,0.43786134,255.34757,1071.0934)">
<path
style="fill:#aaccff"
id="path49-7"
d="m 162.497,252.369 -121.646,0 c -4.513,0 -8.17,3.657 -8.17,8.17 0,4.513 3.657,8.17 8.17,8.17 l 121.646,0 c 4.513,0 8.17,-3.657 8.17,-8.17 0,-4.513 -3.657,-8.17 -8.17,-8.17 z" />
</g>
<g
style="fill:#aaccff"
id="g53-5-2"
transform="matrix(0.40569882,0,0,0.43786134,255.34757,1071.0934)">
<path
style="fill:#aaccff"
id="path55-2"
d="m 316.822,285.05 -121.644,0 c -4.513,0 -8.17,3.657 -8.17,8.17 0,4.513 3.657,8.17 8.17,8.17 l 121.645,0 c 4.513,0 8.17,-3.657 8.17,-8.17 0,-4.513 -3.657,-8.17 -8.171,-8.17 z" />
</g>
<g
style="fill:#aaccff"
id="g59-1-0"
transform="matrix(0.40569882,0,0,0.43786134,255.34757,1071.0934)">
<path
style="fill:#aaccff"
id="path61-3"
d="m 471.149,285.05 -121.646,0 c -4.513,0 -8.17,3.657 -8.17,8.17 0,4.513 3.657,8.17 8.17,8.17 l 121.646,0 c 4.513,0 8.17,-3.657 8.17,-8.17 0,-4.513 -3.657,-8.17 -8.17,-8.17 z" />
</g>
<g
style="fill:#aaccff"
id="g65-8-3"
transform="matrix(0.40569882,0,0,0.43786134,255.34757,1071.0934)">
<path
style="fill:#aaccff"
id="path67-2"
d="m 162.497,285.05 -121.646,0 c -4.513,0 -8.17,3.657 -8.17,8.17 0,4.513 3.657,8.17 8.17,8.17 l 121.646,0 c 4.513,0 8.17,-3.657 8.17,-8.17 0,-4.513 -3.657,-8.17 -8.17,-8.17 z" />
</g>
<g
style="fill:#aaccff"
id="g71-3-4"
transform="matrix(0.40569882,0,0,0.43786134,255.34757,1071.0934)">
<path
style="fill:#aaccff"
id="path73-2"
d="m 256.182,317.731 -61.004,0 c -4.513,0 -8.17,3.657 -8.17,8.17 0,4.513 3.657,8.17 8.17,8.17 l 61.004,0 c 4.513,0 8.17,-3.657 8.17,-8.17 0,-4.513 -3.657,-8.17 -8.17,-8.17 z" />
</g>
<g
style="fill:#aaccff"
id="g77-4"
transform="matrix(0.40569882,0,0,0.43786134,255.34757,1071.0934)">
<path
style="fill:#aaccff"
id="path79-7"
d="m 410.507,317.731 -61.004,0 c -4.513,0 -8.17,3.657 -8.17,8.17 0,4.513 3.657,8.17 8.17,8.17 l 61.004,0 c 4.513,0 8.17,-3.657 8.17,-8.17 0,-4.513 -3.656,-8.17 -8.17,-8.17 z" />
</g>
<g
style="fill:#aaccff"
id="g83-1"
transform="matrix(0.40569882,0,0,0.43786134,255.34757,1071.0934)">
<path
style="fill:#aaccff"
id="path85-1"
d="m 101.855,317.731 -61.004,0 c -4.513,0 -8.17,3.657 -8.17,8.17 0,4.513 3.657,8.17 8.17,8.17 l 61.004,0 c 4.513,0 8.17,-3.657 8.17,-8.17 0,-4.513 -3.656,-8.17 -8.17,-8.17 z" />
</g>
<path
d="m 321.27241,1114.0226 -49.35164,0 c -1.83092,0 -3.31456,1.6013 -3.31456,3.5774 l 0,53.264 c 0,1.9761 1.48364,3.5774 3.31456,3.5774 l 49.35164,0 c 1.83092,0 3.31456,-1.6013 3.31456,-3.5774 l 0,-53.264 c 0,-1.9761 -1.48364,-3.5774 -3.31456,-3.5774 z m -8.00281,7.1547 -16.67301,17.9948 -16.673,-17.9948 33.34601,0 z m -38.03427,5.0599 16.67301,17.9944 -16.67301,17.9952 0,-35.9896 z m 4.68785,41.0491 16.67301,-17.9948 16.67341,17.9948 -33.34642,0 z m 38.03467,-5.0599 -16.673,-17.9948 16.673,-17.9948 0,35.9896 z"
id="path91-1"
style="fill:#aaccff" />
</g>
<!--SEO LAYER !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!-->
<g
transform="translate(145.07545,-712.16257)"
id="SEO-layer">
<path
style="fill:#f4f1ee"
d="m 303.49441,1391.1432 -266.74301,0 c -5.75998,0 -10.42966,4.3035 -10.42966,9.6119 l 0,55.7585 c 0,5.3084 4.66968,9.612 10.42966,9.612 l 266.74301,0 c 5.76006,0 10.42971,-4.3036 10.42971,-9.612 l 0,-55.7585 c 7.9e-4,-5.3098 -4.66886,-9.6119 -10.42971,-9.6119 z"
id="path17-2-3-1" />
<path
style="fill:#ebebeb"
d="m 304.19194,1391.1432 -160.52677,0 -60.91747,74.9814 221.44424,0 c 7.1286,0 12.9078,-4.3035 12.9078,-9.612 l 0,-55.7582 c 0,-5.3091 -5.77822,-9.6112 -12.9078,-9.6112 z"
id="path19-2-9-2" />
<path
style="fill:#52658f"
d="m 39.30602,1390.3948 0,76.26 -83.823737,0 c -7.03199,0 -12.732917,-4.3768 -12.732917,-9.7756 l 0,-56.7087 c 0,-5.3989 5.700927,-9.7757 12.732917,-9.7757 l 83.823737,0 z"
id="path21-1-2" />
<path
style="fill:#aaccff"
d="m 16.05853,1440.6508 -6.79193,-6.7919 c 4.27228,-8.6099 2.84558,-19.3521 -4.31717,-26.5148 -8.97589,-8.9749 -23.57464,-8.9739 -32.54857,0 -8.972964,8.9729 -8.972964,23.5746 0,32.5485 4.48794,4.487 10.38111,6.7305 16.27428,6.7305 3.516,0 7.02419,-0.8168 10.24157,-2.4133 l 6.79095,6.7909 c 1.42963,1.4287 3.30326,2.144 5.17592,2.144 1.87266,0 3.7463,-0.7144 5.17592,-2.144 2.85632,-2.8563 2.85632,-7.4906 -9.7e-4,-10.3499 z m -33.30681,-11.1091 c -3.26715,-3.2661 -3.26715,-8.5806 0,-11.8478 1.6326,-1.6326 3.77752,-2.4494 5.92342,-2.4494 2.14492,0 4.28985,0.8168 5.92245,2.4494 3.26715,3.2662 3.26715,8.5807 0,11.8478 -3.2652,3.2662 -8.58067,3.2682 -11.84587,0 z"
id="path23-5-8" />
</g>
</g>
</svg>
2
Answers
You can adjust the animation like below:
Just use the infinite value in your CSS: