<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="500" height="350" viewBox="0 0 184 118" enable-background="new 0 0 184 118" xml:space="preserve">
<g id="big-fish" >
<path fill="#89BD40" d="M92.909,50.337c0,0,31.716-39.319,61.991,3.669c0,0,13.631-15.072,14.811-14.155
c0,0-0.787,4.194-2.098,5.505l-12.451,10.091l11.403-7.732l-0.524,3.146l-10.354,5.634l9.697-4.063l-0.262,2.752l-9.174,2.359
l8.912-1.441l0.131,2.228l-9.174,0.655l9.043,0.394l0.262,1.704l-9.043-0.918l9.043,1.705l0.655,2.227l-10.222-2.359l10.615,3.803
l1.572,3.014l-10.746-5.243l11.533,6.815l3.67,6.029c0,0-7.602-1.836-15.597-11.534c-0.146,1.183-2.818,20.188-19.266,27.785
c-14.181,6.55-32.404,1.755-43.12-12.319l30.668-15.072L92.909,50.337z"/>
<path d="M120.785,50.085c-0.305,0.126-0.454,0.304-0.706,0.519c-0.495,0.424-1.073,0.743-1.69,0.947
c-1.051,0.349-2.213,0.366-3.258-0.016c-2.844-1.037-2.789-3.765-2.736-6.3c0.003-0.178-0.292-0.231-0.32-0.045
c-0.396,2.602-0.057,5.487,2.642,6.657c1.106,0.479,2.366,0.529,3.523,0.209c0.891-0.247,2.405-0.872,2.651-1.863
C120.904,50.135,120.85,50.059,120.785,50.085z"/>
<polygon fill="#FFFFFF" points="92.909,50.337 92.843,53.548 95.727,51.844 95.53,55.121 98.414,53.154 98.348,56.3
101.034,54.334 100.642,57.414 103.263,55.415 103.066,58.594 105.72,56.563 105.49,59.643 107.948,57.545 108.111,60.56
110.307,58.691 110.209,61.871 112.634,59.839 112.83,63.115 115.287,61.019 115.255,63.901 118.007,61.871 "/>
<path fill="#FFFFFF" d="M94.285,80.088c0.066-0.263-0.852-4.85-0.852-4.653s3.047,3.244,3.047,3.244l0.164-3.112l2.622,1.802
l0.065-2.916l2.523,1.704l0.033-2.818l2.457,1.639l0.361-3.015l2.392,1.54l0.36-2.851l2.622,1.441l0.262-2.751l2.229,1.474
l0.393-2.654l2.425,1.572l0.262-3.079l2.491,1.9L94.285,80.088z"/>
<ellipse fill="#C2DB6E" cx="140.336" cy="66.211" rx="5.586" ry="9.552"/>
<ellipse fill="#C2DB6E" cx="128.771" cy="77.057" rx="2.539" ry="2.572"/>
<ellipse fill="#C2DB6E" cx="132.423" cy="88.312" rx="1.834" ry="1.933"/>
<ellipse fill="#C2DB6E" cx="134.127" cy="49.157" rx="1.9" ry="2.064"/>
</g>
<animateTransform
xlink:href="#big-fish"
attributeName="transform"
attributeType="XML"
type="translate"
from="-20"
to="00"
values="-20; 00; -20"
keyTimes="0; 0.5; 1"
dur="5s"
begin="0s"
repeatCount="indefinite"
fill="freeze"
/>
<g id="small-fish">
<ellipse fill="#DC7E28" cx="41.057" cy="66.129" rx="7.274" ry="3.883"/>
<path fill="#DC7E28" d="M48.43,65.639c0.246-0.098,5.504-3.244,5.554-3.097c0.049,0.147,0.197,6.487,0.197,6.487L48.43,65.639z"/>
<ellipse fill="#FFFFFF" cx="37.347" cy="66.056" rx="1.892" ry="1.745"/>
<ellipse id="eye" cx="38.355" cy="65.859" rx="0.983" ry="0.958"/>
</g>
<animateTransform
xlink:href="#small-fish"
attributeName="transform"
attributeType="XML"
type="translate"
from="0"
to="50"
values="0; 50; 0"
keyTimes="0; 0.5; 1"
dur="5s"
begin="0s"
repeatCount="indefinite"
fill="freeze"
/>
<animateTransform
xlink:href="#eye"
attributeName="transform"
attributeType="XML"
type="translate"
from="-2"
to="0"
values="-2; 0; -2"
keyTimes="0; 0.5; 1"
dur="2s"
begin="0s"
repeatCount="indefinite"
fill="freeze"
/>
</svg>
