How can I make this svg stay within the bounds of the container element?
Here without any CSS, when the viewport is made wide the svg overflows in the y dimension.
.container {
height: 200px;
background-color: gray;
}
<div class="container">
<svg version="1.1" id="Livello_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="588px" height="588px" viewBox="20.267 102.757 588 588" enable-background="new 20.267 102.757 588 588" xml:space="preserve">
<g>
<path fill="#FFFFFF" stroke="#F1F2F2" stroke-width="3" stroke-miterlimit="10" d="M314.267,104.257h-0.006H314.267z"/>
<path fill="#FFFFFF" stroke="#F1F2F2" stroke-width="3" stroke-miterlimit="10" d="M593.641,309.856
c7.779,25.038,12.282,51.518,13.015,78.938C606.627,360.895,602.006,334.259,593.641,309.856z"/>
<path fill="#FFFFFF" stroke="#F1F2F2" stroke-width="3" stroke-miterlimit="10" d="M320.269,689.182
c-1.997,0.04-3.995,0.076-6.002,0.076C316.274,689.258,318.274,689.229,320.269,689.182z"/>
<path fill="#FFFFFF" stroke="#F1F2F2" stroke-width="3" stroke-miterlimit="10" d="M314.267,689.258
c-2.007,0-4.005-0.036-6.002-0.076C310.259,689.229,312.259,689.258,314.267,689.258z"/>
<path fill="#FFFFFF" stroke="#F1F2F2" stroke-width="3" stroke-miterlimit="10" d="M308.266,104.333
c1.995-0.04,3.991-0.076,5.995-0.076C312.256,104.257,310.258,104.286,308.266,104.333z"/>
<path fill="#FFFFFF" stroke="#F1F2F2" stroke-width="3" stroke-miterlimit="10" d="M314.268,104.257
C314.268,104.257,314.268,104.257,314.268,104.257c2.007,0,4.005,0.036,6.003,0.076
C318.275,104.286,316.275,104.257,314.268,104.257z"/>
<linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="241.3174" y1="737.666" x2="389.318" y2="5.6631" gradientTransform="matrix(1 0 0 -1 -6 797)">
<stop offset="0.1" style="stop-color:#E62725"/>
<stop offset="0.3093" style="stop-color:#ED1C24"/>
<stop offset="1" style="stop-color:#1C1B1C"/>
</linearGradient>
<path fill="url(#SVGID_1_)" stroke="#F1F2F2" stroke-width="3" stroke-miterlimit="10" d="M497.885,194.197
c-35.951-52.42-101.821-88.07-177.614-89.864c-1.998-0.041-3.996-0.076-6.004-0.076c-0.002,0-0.004,0-0.006,0
c-2.004,0-4,0.036-5.995,0.076c-127.188,2.562-234.438,86.301-272.078,201.532c18.136-49.932,52.107-90.06,94.523-111.756
c22.219-11.365,46.75-17.683,72.544-17.683c41.792,0,80.278,16.559,110.958,44.369c31.15,28.237,54.245,68.078,64.56,113.999
c3.892,17.322,5.973,35.505,5.973,54.259c0,24.827-3.645,48.653-10.319,70.803c43.404-10.909,81.033-33.316,108.05-63.098
c27.84-30.689,44.418-69.196,44.418-111.013C526.894,252.353,516.317,221.074,497.885,194.197z"/>
<path fill="#FFF200" stroke="#F1F2F2" stroke-width="3" stroke-miterlimit="10" d="M606.655,388.794
c-0.732-27.42-5.235-53.9-13.015-78.938c-36.443-117.287-144.715-202.931-273.37-205.523
c75.793,1.793,141.663,37.444,177.614,89.864c18.433,26.877,29.009,58.156,29.009,91.548c0,41.817-16.578,80.324-44.418,111.013
c-27.017,29.781-64.646,52.188-108.05,63.098c-19.077,4.795-39.263,7.38-60.159,7.38c-20.939,0-41.165-2.596-60.276-7.41
c11.732,38.949,32.869,72.69,60.221,97.485c30.68,27.81,69.165,44.369,110.956,44.369c31.125,0,60.417-9.186,86.018-25.359
c56.843-35.912,95.473-106.302,95.473-187.267C606.658,388.967,606.655,388.881,606.655,388.794z"/>
<g>
<linearGradient id="SVGID_2_" gradientUnits="userSpaceOnUse" x1="309.9668" y1="107.8887" x2="314.2646" y2="107.8887" gradientTransform="matrix(1 0 0 -1 -6 797)">
<stop offset="0" style="stop-color:#0090C7"/>
<stop offset="0.8326" style="stop-color:#2E3192"/>
</linearGradient>
<path fill="url(#SVGID_2_)" stroke="#F1F2F2" stroke-width="3" stroke-miterlimit="10" d="M303.966,689.041
c1.429,0.059,2.862,0.106,4.298,0.141C306.828,689.152,305.398,689.091,303.966,689.041z"/>
<linearGradient id="SVGID_3_" gradientUnits="userSpaceOnUse" x1="27.7671" y1="364.2666" x2="384.7725" y2="364.2666" gradientTransform="matrix(1 0 0 -1 -6 797)">
<stop offset="0" style="stop-color:#0090C7"/>
<stop offset="0.8326" style="stop-color:#2E3192"/>
</linearGradient>
<path fill="url(#SVGID_3_)" stroke="#F1F2F2" stroke-width="3" stroke-miterlimit="10" d="M249.646,334.825
c20.38-5.543,42.089-8.545,64.622-8.545c22.49,0,44.159,2.99,64.505,8.513c-10.314-45.92-33.409-85.761-64.56-113.999
c-30.68-27.81-69.166-44.369-110.958-44.369c-25.794,0-50.325,6.318-72.544,17.683c-42.417,21.696-76.387,61.824-94.523,111.756
c-8.998,27.543-14.013,56.882-14.375,87.344c-0.014,1.183-0.045,2.361-0.045,3.547c0,158.094,125.431,286.855,282.199,292.285
c-84.513-3.441-156.088-48.998-186.572-112.624c-10.147-21.179-15.754-44.354-15.754-68.649c0-41.816,16.579-80.322,44.418-111.01
C172.146,368.001,208.125,346.119,249.646,334.825z"/>
</g>
<linearGradient id="SVGID_4_" gradientUnits="userSpaceOnUse" x1="282.7324" y1="647.4258" x2="404.7324" y2="161.4258" gradientTransform="matrix(1 0 0 -1 -6 797)">
<stop offset="0.6047" style="stop-color:#006838"/>
<stop offset="1" style="stop-color:#538B2E"/>
</linearGradient>
<path fill="url(#SVGID_4_)" stroke="#F1F2F2" stroke-width="3" stroke-miterlimit="10" d="M606.767,396.756
c0-2.662-0.04-5.315-0.111-7.961c0,0.086,0.003,0.172,0.003,0.259c0,80.965-38.63,151.355-95.473,187.267
c-25.601,16.174-54.893,25.359-86.018,25.359c-41.791,0-80.276-16.56-110.956-44.369c-27.353-24.795-48.489-58.536-60.221-97.485
c-6.669-22.141-10.311-45.956-10.311-70.772c0-18.743,2.079-36.915,5.965-54.228c-41.521,11.294-77.5,33.176-103.587,61.933
c-27.84,30.688-44.418,69.193-44.418,111.01c0,24.296,5.607,47.471,15.754,68.649c31,64.702,104.491,110.721,190.87,112.765
c1.997,0.04,3.995,0.076,6.002,0.076s4.005-0.036,6.002-0.076c1.438-0.034,2.87-0.082,4.301-0.141
C481.337,683.61,606.767,554.849,606.767,396.756z"/>
<linearGradient id="SVGID_5_" gradientUnits="userSpaceOnUse" x1="249.6802" y1="400.2422" x2="390.7451" y2="400.2422" gradientTransform="matrix(1 0 0 -1 -6 797)">
<stop offset="0" style="stop-color:#FFFFFF"/>
<stop offset="1" style="stop-color:#000000"/>
</linearGradient>
<path fill="url(#SVGID_5_)" fill-opacity="0" d="M378.772,334.793c-20.346-5.523-42.015-8.513-64.505-8.513
c-22.533,0-44.242,3.002-64.622,8.545c-3.887,17.313-5.965,35.485-5.965,54.228c0,24.816,3.641,48.631,10.311,70.772
c19.111,4.814,39.337,7.41,60.276,7.41c20.896,0,41.082-2.585,60.159-7.38c6.675-22.15,10.319-45.977,10.319-70.803
C384.745,370.298,382.664,352.115,378.772,334.793z"/>
</g>
</svg>
</div>
Here I have tried some positioning magic, but that doesn't work either. I have tried some different things but am out of ideas.
.container {
height: 200px;
background-color: gray;
position: relative;
}
svg {
position: absolute;
left: 0;
top: 0;
right: 100%;
bottom: 100%;
}
<div class="container">
<svg version="1.1" id="Livello_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="588px" height="588px" viewBox="20.267 102.757 588 588" enable-background="new 20.267 102.757 588 588" xml:space="preserve">
<g>
<path fill="#FFFFFF" stroke="#F1F2F2" stroke-width="3" stroke-miterlimit="10" d="M314.267,104.257h-0.006H314.267z"/>
<path fill="#FFFFFF" stroke="#F1F2F2" stroke-width="3" stroke-miterlimit="10" d="M593.641,309.856
c7.779,25.038,12.282,51.518,13.015,78.938C606.627,360.895,602.006,334.259,593.641,309.856z"/>
<path fill="#FFFFFF" stroke="#F1F2F2" stroke-width="3" stroke-miterlimit="10" d="M320.269,689.182
c-1.997,0.04-3.995,0.076-6.002,0.076C316.274,689.258,318.274,689.229,320.269,689.182z"/>
<path fill="#FFFFFF" stroke="#F1F2F2" stroke-width="3" stroke-miterlimit="10" d="M314.267,689.258
c-2.007,0-4.005-0.036-6.002-0.076C310.259,689.229,312.259,689.258,314.267,689.258z"/>
<path fill="#FFFFFF" stroke="#F1F2F2" stroke-width="3" stroke-miterlimit="10" d="M308.266,104.333
c1.995-0.04,3.991-0.076,5.995-0.076C312.256,104.257,310.258,104.286,308.266,104.333z"/>
<path fill="#FFFFFF" stroke="#F1F2F2" stroke-width="3" stroke-miterlimit="10" d="M314.268,104.257
C314.268,104.257,314.268,104.257,314.268,104.257c2.007,0,4.005,0.036,6.003,0.076
C318.275,104.286,316.275,104.257,314.268,104.257z"/>
<linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="241.3174" y1="737.666" x2="389.318" y2="5.6631" gradientTransform="matrix(1 0 0 -1 -6 797)">
<stop offset="0.1" style="stop-color:#E62725"/>
<stop offset="0.3093" style="stop-color:#ED1C24"/>
<stop offset="1" style="stop-color:#1C1B1C"/>
</linearGradient>
<path fill="url(#SVGID_1_)" stroke="#F1F2F2" stroke-width="3" stroke-miterlimit="10" d="M497.885,194.197
c-35.951-52.42-101.821-88.07-177.614-89.864c-1.998-0.041-3.996-0.076-6.004-0.076c-0.002,0-0.004,0-0.006,0
c-2.004,0-4,0.036-5.995,0.076c-127.188,2.562-234.438,86.301-272.078,201.532c18.136-49.932,52.107-90.06,94.523-111.756
c22.219-11.365,46.75-17.683,72.544-17.683c41.792,0,80.278,16.559,110.958,44.369c31.15,28.237,54.245,68.078,64.56,113.999
c3.892,17.322,5.973,35.505,5.973,54.259c0,24.827-3.645,48.653-10.319,70.803c43.404-10.909,81.033-33.316,108.05-63.098
c27.84-30.689,44.418-69.196,44.418-111.013C526.894,252.353,516.317,221.074,497.885,194.197z"/>
<path fill="#FFF200" stroke="#F1F2F2" stroke-width="3" stroke-miterlimit="10" d="M606.655,388.794
c-0.732-27.42-5.235-53.9-13.015-78.938c-36.443-117.287-144.715-202.931-273.37-205.523
c75.793,1.793,141.663,37.444,177.614,89.864c18.433,26.877,29.009,58.156,29.009,91.548c0,41.817-16.578,80.324-44.418,111.013
c-27.017,29.781-64.646,52.188-108.05,63.098c-19.077,4.795-39.263,7.38-60.159,7.38c-20.939,0-41.165-2.596-60.276-7.41
c11.732,38.949,32.869,72.69,60.221,97.485c30.68,27.81,69.165,44.369,110.956,44.369c31.125,0,60.417-9.186,86.018-25.359
c56.843-35.912,95.473-106.302,95.473-187.267C606.658,388.967,606.655,388.881,606.655,388.794z"/>
<g>
<linearGradient id="SVGID_2_" gradientUnits="userSpaceOnUse" x1="309.9668" y1="107.8887" x2="314.2646" y2="107.8887" gradientTransform="matrix(1 0 0 -1 -6 797)">
<stop offset="0" style="stop-color:#0090C7"/>
<stop offset="0.8326" style="stop-color:#2E3192"/>
</linearGradient>
<path fill="url(#SVGID_2_)" stroke="#F1F2F2" stroke-width="3" stroke-miterlimit="10" d="M303.966,689.041
c1.429,0.059,2.862,0.106,4.298,0.141C306.828,689.152,305.398,689.091,303.966,689.041z"/>
<linearGradient id="SVGID_3_" gradientUnits="userSpaceOnUse" x1="27.7671" y1="364.2666" x2="384.7725" y2="364.2666" gradientTransform="matrix(1 0 0 -1 -6 797)">
<stop offset="0" style="stop-color:#0090C7"/>
<stop offset="0.8326" style="stop-color:#2E3192"/>
</linearGradient>
<path fill="url(#SVGID_3_)" stroke="#F1F2F2" stroke-width="3" stroke-miterlimit="10" d="M249.646,334.825
c20.38-5.543,42.089-8.545,64.622-8.545c22.49,0,44.159,2.99,64.505,8.513c-10.314-45.92-33.409-85.761-64.56-113.999
c-30.68-27.81-69.166-44.369-110.958-44.369c-25.794,0-50.325,6.318-72.544,17.683c-42.417,21.696-76.387,61.824-94.523,111.756
c-8.998,27.543-14.013,56.882-14.375,87.344c-0.014,1.183-0.045,2.361-0.045,3.547c0,158.094,125.431,286.855,282.199,292.285
c-84.513-3.441-156.088-48.998-186.572-112.624c-10.147-21.179-15.754-44.354-15.754-68.649c0-41.816,16.579-80.322,44.418-111.01
C172.146,368.001,208.125,346.119,249.646,334.825z"/>
</g>
<linearGradient id="SVGID_4_" gradientUnits="userSpaceOnUse" x1="282.7324" y1="647.4258" x2="404.7324" y2="161.4258" gradientTransform="matrix(1 0 0 -1 -6 797)">
<stop offset="0.6047" style="stop-color:#006838"/>
<stop offset="1" style="stop-color:#538B2E"/>
</linearGradient>
<path fill="url(#SVGID_4_)" stroke="#F1F2F2" stroke-width="3" stroke-miterlimit="10" d="M606.767,396.756
c0-2.662-0.04-5.315-0.111-7.961c0,0.086,0.003,0.172,0.003,0.259c0,80.965-38.63,151.355-95.473,187.267
c-25.601,16.174-54.893,25.359-86.018,25.359c-41.791,0-80.276-16.56-110.956-44.369c-27.353-24.795-48.489-58.536-60.221-97.485
c-6.669-22.141-10.311-45.956-10.311-70.772c0-18.743,2.079-36.915,5.965-54.228c-41.521,11.294-77.5,33.176-103.587,61.933
c-27.84,30.688-44.418,69.193-44.418,111.01c0,24.296,5.607,47.471,15.754,68.649c31,64.702,104.491,110.721,190.87,112.765
c1.997,0.04,3.995,0.076,6.002,0.076s4.005-0.036,6.002-0.076c1.438-0.034,2.87-0.082,4.301-0.141
C481.337,683.61,606.767,554.849,606.767,396.756z"/>
<linearGradient id="SVGID_5_" gradientUnits="userSpaceOnUse" x1="249.6802" y1="400.2422" x2="390.7451" y2="400.2422" gradientTransform="matrix(1 0 0 -1 -6 797)">
<stop offset="0" style="stop-color:#FFFFFF"/>
<stop offset="1" style="stop-color:#000000"/>
</linearGradient>
<path fill="url(#SVGID_5_)" fill-opacity="0" d="M378.772,334.793c-20.346-5.523-42.015-8.513-64.505-8.513
c-22.533,0-44.242,3.002-64.622,8.545c-3.887,17.313-5.965,35.485-5.965,54.228c0,24.816,3.641,48.631,10.311,70.772
c19.111,4.814,39.337,7.41,60.276,7.41c20.896,0,41.082-2.585,60.159-7.38c6.675-22.15,10.319-45.977,10.319-70.803
C384.745,370.298,382.664,352.115,378.772,334.793z"/>
</g>
</svg>
</div>
I know this is not what you asked for, but it could help, it's simple, and it will fit perfectly.
.container {
height:100px;
width:100px;
background-color:grey;
}
svg {
height:100px;
width:100px;
}
It depends on what you mean. If you want the SVG to be clipped off at the edges of the container, you can just add overflow: hidden to the container.
.container {
height: 200px;
background-color: gray;
position: relative;
overflow: hidden;
}
svg {
position: absolute;
left: 0;
top: 0;
right: 100%;
bottom: 100%;
}
<div class="container">
<svg version="1.1" id="Livello_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="588px" height="588px" viewBox="20.267 102.757 588 588" enable-background="new 20.267 102.757 588 588" xml:space="preserve">
<g>
<path fill="#FFFFFF" stroke="#F1F2F2" stroke-width="3" stroke-miterlimit="10" d="M314.267,104.257h-0.006H314.267z"/>
<path fill="#FFFFFF" stroke="#F1F2F2" stroke-width="3" stroke-miterlimit="10" d="M593.641,309.856
c7.779,25.038,12.282,51.518,13.015,78.938C606.627,360.895,602.006,334.259,593.641,309.856z"/>
<path fill="#FFFFFF" stroke="#F1F2F2" stroke-width="3" stroke-miterlimit="10" d="M320.269,689.182
c-1.997,0.04-3.995,0.076-6.002,0.076C316.274,689.258,318.274,689.229,320.269,689.182z"/>
<path fill="#FFFFFF" stroke="#F1F2F2" stroke-width="3" stroke-miterlimit="10" d="M314.267,689.258
c-2.007,0-4.005-0.036-6.002-0.076C310.259,689.229,312.259,689.258,314.267,689.258z"/>
<path fill="#FFFFFF" stroke="#F1F2F2" stroke-width="3" stroke-miterlimit="10" d="M308.266,104.333
c1.995-0.04,3.991-0.076,5.995-0.076C312.256,104.257,310.258,104.286,308.266,104.333z"/>
<path fill="#FFFFFF" stroke="#F1F2F2" stroke-width="3" stroke-miterlimit="10" d="M314.268,104.257
C314.268,104.257,314.268,104.257,314.268,104.257c2.007,0,4.005,0.036,6.003,0.076
C318.275,104.286,316.275,104.257,314.268,104.257z"/>
<linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="241.3174" y1="737.666" x2="389.318" y2="5.6631" gradientTransform="matrix(1 0 0 -1 -6 797)">
<stop offset="0.1" style="stop-color:#E62725"/>
<stop offset="0.3093" style="stop-color:#ED1C24"/>
<stop offset="1" style="stop-color:#1C1B1C"/>
</linearGradient>
<path fill="url(#SVGID_1_)" stroke="#F1F2F2" stroke-width="3" stroke-miterlimit="10" d="M497.885,194.197
c-35.951-52.42-101.821-88.07-177.614-89.864c-1.998-0.041-3.996-0.076-6.004-0.076c-0.002,0-0.004,0-0.006,0
c-2.004,0-4,0.036-5.995,0.076c-127.188,2.562-234.438,86.301-272.078,201.532c18.136-49.932,52.107-90.06,94.523-111.756
c22.219-11.365,46.75-17.683,72.544-17.683c41.792,0,80.278,16.559,110.958,44.369c31.15,28.237,54.245,68.078,64.56,113.999
c3.892,17.322,5.973,35.505,5.973,54.259c0,24.827-3.645,48.653-10.319,70.803c43.404-10.909,81.033-33.316,108.05-63.098
c27.84-30.689,44.418-69.196,44.418-111.013C526.894,252.353,516.317,221.074,497.885,194.197z"/>
<path fill="#FFF200" stroke="#F1F2F2" stroke-width="3" stroke-miterlimit="10" d="M606.655,388.794
c-0.732-27.42-5.235-53.9-13.015-78.938c-36.443-117.287-144.715-202.931-273.37-205.523
c75.793,1.793,141.663,37.444,177.614,89.864c18.433,26.877,29.009,58.156,29.009,91.548c0,41.817-16.578,80.324-44.418,111.013
c-27.017,29.781-64.646,52.188-108.05,63.098c-19.077,4.795-39.263,7.38-60.159,7.38c-20.939,0-41.165-2.596-60.276-7.41
c11.732,38.949,32.869,72.69,60.221,97.485c30.68,27.81,69.165,44.369,110.956,44.369c31.125,0,60.417-9.186,86.018-25.359
c56.843-35.912,95.473-106.302,95.473-187.267C606.658,388.967,606.655,388.881,606.655,388.794z"/>
<g>
<linearGradient id="SVGID_2_" gradientUnits="userSpaceOnUse" x1="309.9668" y1="107.8887" x2="314.2646" y2="107.8887" gradientTransform="matrix(1 0 0 -1 -6 797)">
<stop offset="0" style="stop-color:#0090C7"/>
<stop offset="0.8326" style="stop-color:#2E3192"/>
</linearGradient>
<path fill="url(#SVGID_2_)" stroke="#F1F2F2" stroke-width="3" stroke-miterlimit="10" d="M303.966,689.041
c1.429,0.059,2.862,0.106,4.298,0.141C306.828,689.152,305.398,689.091,303.966,689.041z"/>
<linearGradient id="SVGID_3_" gradientUnits="userSpaceOnUse" x1="27.7671" y1="364.2666" x2="384.7725" y2="364.2666" gradientTransform="matrix(1 0 0 -1 -6 797)">
<stop offset="0" style="stop-color:#0090C7"/>
<stop offset="0.8326" style="stop-color:#2E3192"/>
</linearGradient>
<path fill="url(#SVGID_3_)" stroke="#F1F2F2" stroke-width="3" stroke-miterlimit="10" d="M249.646,334.825
c20.38-5.543,42.089-8.545,64.622-8.545c22.49,0,44.159,2.99,64.505,8.513c-10.314-45.92-33.409-85.761-64.56-113.999
c-30.68-27.81-69.166-44.369-110.958-44.369c-25.794,0-50.325,6.318-72.544,17.683c-42.417,21.696-76.387,61.824-94.523,111.756
c-8.998,27.543-14.013,56.882-14.375,87.344c-0.014,1.183-0.045,2.361-0.045,3.547c0,158.094,125.431,286.855,282.199,292.285
c-84.513-3.441-156.088-48.998-186.572-112.624c-10.147-21.179-15.754-44.354-15.754-68.649c0-41.816,16.579-80.322,44.418-111.01
C172.146,368.001,208.125,346.119,249.646,334.825z"/>
</g>
<linearGradient id="SVGID_4_" gradientUnits="userSpaceOnUse" x1="282.7324" y1="647.4258" x2="404.7324" y2="161.4258" gradientTransform="matrix(1 0 0 -1 -6 797)">
<stop offset="0.6047" style="stop-color:#006838"/>
<stop offset="1" style="stop-color:#538B2E"/>
</linearGradient>
<path fill="url(#SVGID_4_)" stroke="#F1F2F2" stroke-width="3" stroke-miterlimit="10" d="M606.767,396.756
c0-2.662-0.04-5.315-0.111-7.961c0,0.086,0.003,0.172,0.003,0.259c0,80.965-38.63,151.355-95.473,187.267
c-25.601,16.174-54.893,25.359-86.018,25.359c-41.791,0-80.276-16.56-110.956-44.369c-27.353-24.795-48.489-58.536-60.221-97.485
c-6.669-22.141-10.311-45.956-10.311-70.772c0-18.743,2.079-36.915,5.965-54.228c-41.521,11.294-77.5,33.176-103.587,61.933
c-27.84,30.688-44.418,69.193-44.418,111.01c0,24.296,5.607,47.471,15.754,68.649c31,64.702,104.491,110.721,190.87,112.765
c1.997,0.04,3.995,0.076,6.002,0.076s4.005-0.036,6.002-0.076c1.438-0.034,2.87-0.082,4.301-0.141
C481.337,683.61,606.767,554.849,606.767,396.756z"/>
<linearGradient id="SVGID_5_" gradientUnits="userSpaceOnUse" x1="249.6802" y1="400.2422" x2="390.7451" y2="400.2422" gradientTransform="matrix(1 0 0 -1 -6 797)">
<stop offset="0" style="stop-color:#FFFFFF"/>
<stop offset="1" style="stop-color:#000000"/>
</linearGradient>
<path fill="url(#SVGID_5_)" fill-opacity="0" d="M378.772,334.793c-20.346-5.523-42.015-8.513-64.505-8.513
c-22.533,0-44.242,3.002-64.622,8.545c-3.887,17.313-5.965,35.485-5.965,54.228c0,24.816,3.641,48.631,10.311,70.772
c19.111,4.814,39.337,7.41,60.276,7.41c20.896,0,41.082-2.585,60.159-7.38c6.675-22.15,10.319-45.977,10.319-70.803
C384.745,370.298,382.664,352.115,378.772,334.793z"/>
</g>
</svg>
</div>
If, instead, you want the SVG to resize to fit the container, you can add height: 100% to the SVG.
.container {
height: 200px;
background-color: gray;
position: relative;
}
svg {
position: absolute;
left: 0;
top: 0;
right: 100%;
bottom: 100%;
height: 100%;
}
<div class="container">
<svg version="1.1" id="Livello_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="588px" height="588px" viewBox="20.267 102.757 588 588" enable-background="new 20.267 102.757 588 588" xml:space="preserve">
<g>
<path fill="#FFFFFF" stroke="#F1F2F2" stroke-width="3" stroke-miterlimit="10" d="M314.267,104.257h-0.006H314.267z"/>
<path fill="#FFFFFF" stroke="#F1F2F2" stroke-width="3" stroke-miterlimit="10" d="M593.641,309.856
c7.779,25.038,12.282,51.518,13.015,78.938C606.627,360.895,602.006,334.259,593.641,309.856z"/>
<path fill="#FFFFFF" stroke="#F1F2F2" stroke-width="3" stroke-miterlimit="10" d="M320.269,689.182
c-1.997,0.04-3.995,0.076-6.002,0.076C316.274,689.258,318.274,689.229,320.269,689.182z"/>
<path fill="#FFFFFF" stroke="#F1F2F2" stroke-width="3" stroke-miterlimit="10" d="M314.267,689.258
c-2.007,0-4.005-0.036-6.002-0.076C310.259,689.229,312.259,689.258,314.267,689.258z"/>
<path fill="#FFFFFF" stroke="#F1F2F2" stroke-width="3" stroke-miterlimit="10" d="M308.266,104.333
c1.995-0.04,3.991-0.076,5.995-0.076C312.256,104.257,310.258,104.286,308.266,104.333z"/>
<path fill="#FFFFFF" stroke="#F1F2F2" stroke-width="3" stroke-miterlimit="10" d="M314.268,104.257
C314.268,104.257,314.268,104.257,314.268,104.257c2.007,0,4.005,0.036,6.003,0.076
C318.275,104.286,316.275,104.257,314.268,104.257z"/>
<linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="241.3174" y1="737.666" x2="389.318" y2="5.6631" gradientTransform="matrix(1 0 0 -1 -6 797)">
<stop offset="0.1" style="stop-color:#E62725"/>
<stop offset="0.3093" style="stop-color:#ED1C24"/>
<stop offset="1" style="stop-color:#1C1B1C"/>
</linearGradient>
<path fill="url(#SVGID_1_)" stroke="#F1F2F2" stroke-width="3" stroke-miterlimit="10" d="M497.885,194.197
c-35.951-52.42-101.821-88.07-177.614-89.864c-1.998-0.041-3.996-0.076-6.004-0.076c-0.002,0-0.004,0-0.006,0
c-2.004,0-4,0.036-5.995,0.076c-127.188,2.562-234.438,86.301-272.078,201.532c18.136-49.932,52.107-90.06,94.523-111.756
c22.219-11.365,46.75-17.683,72.544-17.683c41.792,0,80.278,16.559,110.958,44.369c31.15,28.237,54.245,68.078,64.56,113.999
c3.892,17.322,5.973,35.505,5.973,54.259c0,24.827-3.645,48.653-10.319,70.803c43.404-10.909,81.033-33.316,108.05-63.098
c27.84-30.689,44.418-69.196,44.418-111.013C526.894,252.353,516.317,221.074,497.885,194.197z"/>
<path fill="#FFF200" stroke="#F1F2F2" stroke-width="3" stroke-miterlimit="10" d="M606.655,388.794
c-0.732-27.42-5.235-53.9-13.015-78.938c-36.443-117.287-144.715-202.931-273.37-205.523
c75.793,1.793,141.663,37.444,177.614,89.864c18.433,26.877,29.009,58.156,29.009,91.548c0,41.817-16.578,80.324-44.418,111.013
c-27.017,29.781-64.646,52.188-108.05,63.098c-19.077,4.795-39.263,7.38-60.159,7.38c-20.939,0-41.165-2.596-60.276-7.41
c11.732,38.949,32.869,72.69,60.221,97.485c30.68,27.81,69.165,44.369,110.956,44.369c31.125,0,60.417-9.186,86.018-25.359
c56.843-35.912,95.473-106.302,95.473-187.267C606.658,388.967,606.655,388.881,606.655,388.794z"/>
<g>
<linearGradient id="SVGID_2_" gradientUnits="userSpaceOnUse" x1="309.9668" y1="107.8887" x2="314.2646" y2="107.8887" gradientTransform="matrix(1 0 0 -1 -6 797)">
<stop offset="0" style="stop-color:#0090C7"/>
<stop offset="0.8326" style="stop-color:#2E3192"/>
</linearGradient>
<path fill="url(#SVGID_2_)" stroke="#F1F2F2" stroke-width="3" stroke-miterlimit="10" d="M303.966,689.041
c1.429,0.059,2.862,0.106,4.298,0.141C306.828,689.152,305.398,689.091,303.966,689.041z"/>
<linearGradient id="SVGID_3_" gradientUnits="userSpaceOnUse" x1="27.7671" y1="364.2666" x2="384.7725" y2="364.2666" gradientTransform="matrix(1 0 0 -1 -6 797)">
<stop offset="0" style="stop-color:#0090C7"/>
<stop offset="0.8326" style="stop-color:#2E3192"/>
</linearGradient>
<path fill="url(#SVGID_3_)" stroke="#F1F2F2" stroke-width="3" stroke-miterlimit="10" d="M249.646,334.825
c20.38-5.543,42.089-8.545,64.622-8.545c22.49,0,44.159,2.99,64.505,8.513c-10.314-45.92-33.409-85.761-64.56-113.999
c-30.68-27.81-69.166-44.369-110.958-44.369c-25.794,0-50.325,6.318-72.544,17.683c-42.417,21.696-76.387,61.824-94.523,111.756
c-8.998,27.543-14.013,56.882-14.375,87.344c-0.014,1.183-0.045,2.361-0.045,3.547c0,158.094,125.431,286.855,282.199,292.285
c-84.513-3.441-156.088-48.998-186.572-112.624c-10.147-21.179-15.754-44.354-15.754-68.649c0-41.816,16.579-80.322,44.418-111.01
C172.146,368.001,208.125,346.119,249.646,334.825z"/>
</g>
<linearGradient id="SVGID_4_" gradientUnits="userSpaceOnUse" x1="282.7324" y1="647.4258" x2="404.7324" y2="161.4258" gradientTransform="matrix(1 0 0 -1 -6 797)">
<stop offset="0.6047" style="stop-color:#006838"/>
<stop offset="1" style="stop-color:#538B2E"/>
</linearGradient>
<path fill="url(#SVGID_4_)" stroke="#F1F2F2" stroke-width="3" stroke-miterlimit="10" d="M606.767,396.756
c0-2.662-0.04-5.315-0.111-7.961c0,0.086,0.003,0.172,0.003,0.259c0,80.965-38.63,151.355-95.473,187.267
c-25.601,16.174-54.893,25.359-86.018,25.359c-41.791,0-80.276-16.56-110.956-44.369c-27.353-24.795-48.489-58.536-60.221-97.485
c-6.669-22.141-10.311-45.956-10.311-70.772c0-18.743,2.079-36.915,5.965-54.228c-41.521,11.294-77.5,33.176-103.587,61.933
c-27.84,30.688-44.418,69.193-44.418,111.01c0,24.296,5.607,47.471,15.754,68.649c31,64.702,104.491,110.721,190.87,112.765
c1.997,0.04,3.995,0.076,6.002,0.076s4.005-0.036,6.002-0.076c1.438-0.034,2.87-0.082,4.301-0.141
C481.337,683.61,606.767,554.849,606.767,396.756z"/>
<linearGradient id="SVGID_5_" gradientUnits="userSpaceOnUse" x1="249.6802" y1="400.2422" x2="390.7451" y2="400.2422" gradientTransform="matrix(1 0 0 -1 -6 797)">
<stop offset="0" style="stop-color:#FFFFFF"/>
<stop offset="1" style="stop-color:#000000"/>
</linearGradient>
<path fill="url(#SVGID_5_)" fill-opacity="0" d="M378.772,334.793c-20.346-5.523-42.015-8.513-64.505-8.513
c-22.533,0-44.242,3.002-64.622,8.545c-3.887,17.313-5.965,35.485-5.965,54.228c0,24.816,3.641,48.631,10.311,70.772
c19.111,4.814,39.337,7.41,60.276,7.41c20.896,0,41.082-2.585,60.159-7.38c6.675-22.15,10.319-45.977,10.319-70.803
C384.745,370.298,382.664,352.115,378.772,334.793z"/>
</g>
</svg>
</div>
I am using an svg spritesheet with symbols and inject it inline with SVGInjector. I reference it this way:
<svg role="img" width="134px" height="89px">
<use xlink:href="path/to/sprite.symbol.svg#theid"></use>
</svg>
The gradients are declared inside the defs tag of the spritesheet, but they are not showing in Chrome.
I noticed, that it works, if the SVG is not injected. That means, I just placed the whole thing inline into my HTML and the gradients showed as expected. The Spritesheet was exactly the same. The difference is just if it is loaded by JavaScript or not. But the symbol itself is showing. The problem is only the gradient.
This is a simplified version of my spritesheet, with one of the broken icons. In that case, the group called "quadri" is not displayed:
<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<defs>
<linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="20.0664" y1="12.1807" x2="20.0664" y2="19.5099">
<stop offset="0" style="stop-color:#00774A"/>
<stop offset="0.6" style="stop-color:#8CCAAE"/>
<stop offset="1" style="stop-color:#00975F"/>
</linearGradient>
<linearGradient id="SVGID_2_" gradientUnits="userSpaceOnUse" x1="20.0513" y1="10.627" x2="20.0513" y2="18.8625">
<stop offset="0" style="stop-color:#00975F"/>
<stop offset="0.3" style="stop-color:#8CCAAE"/>
<stop offset="0.55" style="stop-color:#00975F"/>
<stop offset="0.8352" style="stop-color:#00774A"/>
<stop offset="0.8691" style="stop-color:#007C4E"/>
<stop offset="0.9244" style="stop-color:#00895A"/>
<stop offset="0.9938" style="stop-color:#009E6E"/>
<stop offset="1" style="stop-color:#00A070"/>
</linearGradient>
<linearGradient id="SVGID_3_" gradientUnits="userSpaceOnUse" x1="21.3755" y1="18.4082" x2="21.3755" y2="13.0789">
<stop offset="0" style="stop-color:#00A97C"/>
<stop offset="1" style="stop-color:#00975F"/>
</linearGradient>
<linearGradient id="SVGID_4_" gradientUnits="userSpaceOnUse" x1="18.0532" y1="18.4072" x2="18.0532" y2="13.0789">
<stop offset="0" style="stop-color:#00A97C"/>
<stop offset="1" style="stop-color:#00975F"/>
</linearGradient>
<linearGradient id="SVGID_5_" gradientUnits="userSpaceOnUse" x1="19.1021" y1="18.4072" x2="19.1021" y2="13.0799">
<stop offset="0" style="stop-color:#00A97C"/>
<stop offset="1" style="stop-color:#00975F"/>
</linearGradient>
<linearGradient id="SVGID_6_" gradientUnits="userSpaceOnUse" x1="19.9897" y1="18.4082" x2="19.9897" y2="13.079">
<stop offset="0" style="stop-color:#00A97C"/>
<stop offset="1" style="stop-color:#00975F"/>
</linearGradient>
</defs>
<symbol viewBox="0 0 66 33" id="theid">
<g id="Quadri">
<polygon fill="url(#SVGID_1_)" points="23.541,19.298 16.592,19.298 16.592,12.348 23.541,12.348 "/>
<path fill="url(#SVGID_2_)" d="M23.327,15.869c0,1.455,0.062,2.939,0.062,2.939c0,0.168-0.107,0.275-0.245,0.275h-6.016
c-0.138,0-0.229-0.122-0.245-0.275c0,0-0.168-1.271-0.168-3.199s0.168-2.847,0.168-2.847c0.016-0.153,0.107-0.275,0.245-0.275
h6.016c0.138,0,0.245,0.123,0.245,0.275C23.388,12.746,23.327,14.415,23.327,15.869z"/>
<g>
<g>
<path fill="url(#SVGID_3_)" d="M21.98,14.231c-0.429,0.245-0.551,0.26-1.026,0.551l0.031-0.061
c0.245-0.26,0.352-0.383,0.505-0.612c-0.428,0.031-1.056,0.077-1.5,0.168l0,0l0,0l0,0l0.031-0.046
c0.398-0.199,1.163-0.398,1.546-0.444c-0.092-0.138-0.857-0.551-1.041-0.628l0,0l0,0l0,0l0.016-0.046
c0.582,0.062,1.347,0.337,1.668,0.536c0.138-0.046,0.291-0.046,0.551-0.076c0,0-0.046,0.153-0.322,0.352l0,0l0,0l0,0
c0.077,0.184-0.092,1.24-0.245,1.515l0,0l0,0l0,0C22.194,15.012,22.148,14.46,21.98,14.231z"/>
<path fill="url(#SVGID_4_)" d="M18.842,17.981l0.015-0.046c-0.229-0.092-0.459-0.153-0.643-0.337l0,0l0,0l0,0l0,0l0,0l0,0l0,0
l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0
c0.061-0.169,0.123-0.291,0.229-0.444l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0
l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0.015-0.046c-0.199,0.03-0.367,0.107-0.536,0.138l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0
l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0c-0.138-0.229-0.184-0.551-0.26-0.857
l-0.015,0.046l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0c-0.031,0.352-0.046,0.597,0,0.873l0,0l0,0l0,0l0,0
l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0
c-0.138,0.046-0.26,0.046-0.383,0.092l-0.015,0.046l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0
l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0c0.184,0.107,0.321,0.199,0.536,0.291l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0
l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0c0.107,0.229,0.229,0.397,0.413,0.581
l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0
l0.016-0.046c-0.031-0.138-0.077-0.244-0.062-0.397l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0
l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0C18.398,17.936,18.597,17.966,18.842,17.981z"/>
<path fill="url(#SVGID_5_)" d="M19.485,14.491c0,0-0.092,0.168-0.168,0.382h-0.015l0,0l0,0c0.536,0.077,1.041,0.291,1.163,0.368
l-0.015,0.046l0,0l0,0l0,0l0,0l0,0l0,0l0,0c-0.566-0.107-0.857-0.092-1.056-0.077l0,0l0,0l0,0
c-0.214,0.031-0.245,0.046-0.245,0.046l0,0l0,0l0,0l0,0l0,0l0,0l0,0c-0.123,0.26-0.199,0.689-0.229,0.842l-0.016,0.046l0,0l0,0
l0,0l0,0l0,0l0,0l0,0c-0.107-0.245-0.245-0.735-0.245-0.735l0,0l0,0l0,0l0,0l0,0l0,0l0,0c-0.275,0.153-0.918,0.75-0.918,0.75l0,0
l0,0l0,0l0,0l0,0l0,0l0,0c0.352-0.705,0.719-1.026,0.719-1.026l0,0l0,0l0,0l0,0l0,0l0,0l0,0
c-0.122-0.122-0.444-0.184-0.688-0.199l0,0l0,0l0,0l0.015-0.046c0.153-0.046,0.459-0.062,0.658-0.077l0,0l0,0l0,0l0,0l0,0l0,0
l0,0c0.245,0,0.383,0,0.383,0l0,0l0,0l0,0C19.041,14.66,19.362,14.506,19.485,14.491z"/>
<path fill="url(#SVGID_6_)" d="M20.158,17.537c-0.107,0.153-0.214,0.275-0.337,0.413l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0
l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0c-0.184,0.046-0.398,0.031-0.566,0.031
l-0.016,0.046l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0
l0,0l0,0l0,0l0,0c0.123,0.061,0.245,0.106,0.383,0.138l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0
l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0c-0.107,0.092-0.245,0.168-0.352,0.245l-0.015,0.046l0,0l0,0l0,0l0,0l0,0
l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0
c0.214-0.046,0.505-0.139,0.719-0.276l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0
l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0c0.107,0,0.214,0,0.291-0.015l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0
l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0.016-0.046c-0.016-0.046-0.062-0.077-0.077-0.153l0,0l0,0
l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0
c0.199-0.153,0.337-0.291,0.505-0.459l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0
l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0.03-0.046c-0.168,0.106-0.367,0.275-0.551,0.367l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0
l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0
C20.174,17.721,20.174,17.645,20.158,17.537z"/>
</g>
<g>
<path fill="#FFFFFF" d="M22.01,14.185c-0.428,0.245-0.566,0.26-1.025,0.551c0.275-0.291,0.367-0.413,0.536-0.673
c-0.429,0.015-1.056,0.077-1.5,0.168l0,0l0,0l0,0c0.383-0.214,1.163-0.444,1.562-0.49c-0.092-0.123-0.857-0.536-1.041-0.628l0,0
l0,0l0,0c0.597,0.046,1.347,0.275,1.699,0.49c0.138-0.046,0.291-0.046,0.551-0.076l0,0l0,0l0,0
c-0.061,0.107-0.077,0.184-0.321,0.352l0,0l0,0l0,0c0.077,0.184-0.092,1.24-0.245,1.515l0,0l0,0l0,0
C22.209,14.966,22.179,14.415,22.01,14.185z"/>
<path fill="#FFFFFF" d="M18.873,17.936c-0.245-0.092-0.429-0.199-0.612-0.383l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0
l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0c0.061-0.169,0.123-0.291,0.229-0.444l0,0l0,0l0,0
l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0
c-0.199,0.03-0.352,0.046-0.521,0.092l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0
l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0c-0.138-0.245-0.199-0.49-0.275-0.811l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0
l0,0l0,0c-0.031,0.352-0.046,0.597,0,0.873l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0
l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0c-0.153,0.046-0.275,0.076-0.398,0.138l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0
l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0c0.184,0.107,0.336,0.199,0.536,0.291l0,0
l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0
c0.107,0.229,0.229,0.397,0.413,0.581l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0
l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0c-0.046-0.152-0.061-0.275-0.03-0.443l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0
l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0C18.413,17.89,18.612,17.92,18.873,17.936z"/>
<path fill="#FFFFFF" d="M19.515,14.445L19.515,14.445L19.515,14.445L19.515,14.445L19.515,14.445
c-0.076,0.107-0.168,0.291-0.184,0.367l0,0l0,0l0,0c0.627,0.092,1.133,0.429,1.133,0.429l0,0l0,0l0,0l0,0l0,0l0,0l0,0
c-0.551-0.107-0.842-0.092-1.056-0.077l0,0l0,0l0,0c-0.199,0.015-0.245,0.046-0.245,0.046l0,0l0,0l0,0l0,0l0,0l0,0l0,0
c-0.153,0.321-0.245,0.888-0.245,0.888l0,0l0,0l0,0l0,0l0,0l0,0l0,0c-0.092-0.245-0.245-0.734-0.245-0.734l0,0l0,0l0,0l0,0l0,0
l0,0l0,0c-0.275,0.153-0.918,0.75-0.918,0.75l0,0l0,0l0,0l0,0l0,0l0,0l0,0c0.352-0.705,0.72-1.026,0.72-1.026l0,0l0,0l0,0l0,0
l0,0l0,0l0,0c-0.123-0.122-0.444-0.184-0.689-0.199l0,0l0,0l0,0c0.123-0.046,0.444-0.107,0.689-0.123l0,0l0,0l0,0l0,0l0,0l0,0
l0,0c0.245,0,0.382,0,0.382,0l0,0l0,0l0,0C19.071,14.613,19.393,14.46,19.515,14.445z"/>
<path fill="#FFFFFF" d="M20.189,17.491c-0.107,0.153-0.214,0.275-0.337,0.413l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0
l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0c-0.214,0.062-0.383,0.077-0.597,0.077l0,0l0,0
l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0
c0.122,0.061,0.245,0.106,0.382,0.138l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0
l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0c-0.138,0.122-0.245,0.198-0.382,0.291l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0
l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0c0.214-0.047,0.505-0.139,0.719-0.276l0,0l0,0l0,0
l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0
c0.107,0,0.214,0,0.291-0.015l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0
l0,0l0,0l0,0l0,0l0,0l0,0l0,0c-0.015-0.062-0.03-0.107-0.046-0.199l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0
l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0c0.199-0.153,0.352-0.291,0.505-0.459l0,0l0,0l0,0l0,0l0,0l0,0
l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0
c-0.184,0.122-0.337,0.214-0.536,0.306l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0
l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0l0,0C20.189,17.675,20.189,17.599,20.189,17.491z"/>
</g>
</g>
</g>
<path d="M25.278,12.936c0.022,0.253,0.033,0.891,0.033,1.122c0,0.209,0,0.935-0.033,1.243v0.022H26.4c0.55,0,1.133-0.176,1.133-0.66
c0-0.308-0.22-0.539-0.638-0.66c0.308-0.077,0.517-0.297,0.517-0.539c0-0.396-0.462-0.55-0.891-0.561h-1.243V12.936z M26.147,13.189
c0.473,0,0.649,0.099,0.649,0.352c0,0.066-0.022,0.132-0.066,0.176c-0.088,0.11-0.264,0.165-0.495,0.154h-0.011l-0.132,0.341h0.132
c0.264-0.011,0.484,0.077,0.594,0.22c0.055,0.066,0.077,0.143,0.077,0.22c0,0.264-0.231,0.407-0.693,0.407c-0.077,0-0.209,0-0.286,0
c-0.022-0.352-0.022-0.836-0.022-0.979c0-0.165,0.011-0.55,0.022-0.869C25.982,13.189,26.07,13.189,26.147,13.189z"/>
<path d="M30.129,12.914h-0.55l0.022,0.605c0.011,0.308,0.022,0.616,0.044,0.913l0,0l0,0c-0.033-0.088-0.066-0.143-0.231-0.385
c0-0.011-0.572-0.88-0.77-1.133v-0.011h-0.638v0.022c0.022,0.253,0.033,0.891,0.033,1.122c0,0.209,0,0.935-0.033,1.243v0.022h0.561
V15.29c-0.033-0.594-0.033-1.188-0.033-1.76l0,0c0.022,0.066,0.044,0.132,0.132,0.264c0.011,0.011,0.979,1.43,1.034,1.518
l0.011,0.011h0.451v-0.022c-0.033-0.308-0.033-1.034-0.033-1.243c0-0.231,0.011-0.869,0.033-1.122v-0.022H30.129z"/>
<path d="M30.789,12.936c0.022,0.253,0.033,0.891,0.033,1.122c0,0.209,0,0.935-0.033,1.243v0.022h0.671v-0.022
c-0.022-0.22-0.033-0.649-0.033-0.979c0.033,0,0.121,0.011,0.121,0.011h0.099c0.891,0,1.32-0.242,1.32-0.726
c0-0.561-0.605-0.693-1.111-0.704H30.8L30.789,12.936z M31.614,13.211c0.319,0,0.539,0.055,0.638,0.187
c0.044,0.066,0.077,0.132,0.077,0.22c0,0.352-0.396,0.429-0.726,0.429h-0.132c0,0-0.033,0-0.055-0.011c0-0.077,0-0.187,0-0.308
c0-0.154,0-0.33,0.011-0.495C31.46,13.211,31.537,13.211,31.614,13.211z"/>
<path d="M34.243,12.936c0.022,0.253,0.032,0.891,0.032,1.122c0,0.209,0,0.935-0.032,1.243v0.022h0.671v-0.022
c-0.021-0.22-0.033-0.649-0.033-0.979c0.033,0,0.121,0.011,0.121,0.011h0.1c0.891,0,1.319-0.242,1.319-0.726
c0-0.561-0.604-0.693-1.11-0.704h-1.057L34.243,12.936z M35.068,13.211c0.318,0,0.539,0.055,0.648,0.187
c0.045,0.066,0.077,0.132,0.077,0.22c0,0.352-0.396,0.429-0.726,0.429h-0.133c0,0-0.033,0-0.055-0.011c0-0.077,0-0.187,0-0.308
c0-0.154,0-0.33,0.012-0.495C34.914,13.211,34.991,13.211,35.068,13.211z"/>
<path d="M37.313,12.914L37.313,12.914l-0.012,0.011c-0.121,0.341-0.935,2.101-1.056,2.376l-0.011,0.033h0.582v-0.011
c0.056-0.165,0.111-0.352,0.188-0.55c0.021,0,0.473-0.011,0.473-0.011h0.396c0,0,0.066,0,0.088,0
c0.109,0.264,0.188,0.462,0.221,0.561v0.011h0.67l-1.078-2.42h-0.01H37.313z M37.477,13.629c0.056,0.11,0.188,0.44,0.353,0.825
c-0.022,0-0.056,0-0.056,0h-0.297c0,0-0.308,0-0.352-0.011C37.246,14.146,37.367,13.86,37.477,13.629z"/>
<path d="M39.105,12.936c0.021,0.253,0.033,0.891,0.033,1.122c0,0.209,0,0.935-0.033,1.243v0.022h0.67v-0.022
c-0.032-0.308-0.032-1.034-0.032-1.243c0-0.165,0.011-0.55,0.022-0.847C39.82,13.2,39.896,13.2,39.952,13.2
c0.319-0.011,0.539,0.055,0.638,0.187c0.044,0.055,0.077,0.132,0.077,0.22c0,0.275-0.265,0.418-0.506,0.429
c-0.077,0-0.144-0.011-0.144-0.011l-0.043-0.011l0.032,0.044c0.231,0.352,0.595,0.957,0.748,1.243v0.011h0.726l-0.021-0.033
c-0.021-0.044-0.495-0.737-0.693-1.034c0,0-0.011-0.011-0.011-0.022c0.363-0.11,0.55-0.319,0.55-0.638
c0-0.561-0.604-0.693-1.111-0.704h-1.055L39.105,12.936z"/>
<path d="M42.416,12.914h-0.648v0.022c0.021,0.253,0.032,0.891,0.032,1.122c0,0.209,0,0.935-0.032,1.243v0.022h0.67v-0.022
c-0.033-0.308-0.033-1.034-0.033-1.243c0-0.231,0.012-0.869,0.033-1.122v-0.022H42.416z"/>
<path d="M43.043,12.936c0.021,0.253,0.033,0.891,0.033,1.122c0,0.209,0,0.935-0.033,1.243v0.022h1.122
c0.55,0,1.133-0.176,1.133-0.66c0-0.308-0.22-0.539-0.638-0.66c0.308-0.077,0.518-0.297,0.518-0.539c0-0.396-0.463-0.55-0.892-0.561
h-1.243V12.936z M43.912,13.189L43.912,13.189c0.473,0,0.648,0.099,0.648,0.352c0,0.066-0.021,0.132-0.065,0.176
c-0.088,0.11-0.265,0.165-0.495,0.154h-0.012l-0.131,0.341h0.131c0.265-0.011,0.484,0.077,0.595,0.22
c0.056,0.066,0.077,0.143,0.077,0.22c0,0.264-0.23,0.407-0.693,0.407c-0.076,0-0.209,0-0.285,0
c-0.012-0.352-0.022-0.836-0.022-0.979c0-0.165,0.011-0.55,0.022-0.869C43.747,13.189,43.835,13.189,43.912,13.189z"/>
<path d="M46.959,12.914h-0.451v0.011c-0.132,0.363-0.99,2.222-1.056,2.376l-0.011,0.033h0.582v-0.011
c0.056-0.165,0.11-0.352,0.188-0.55c0.021,0,0.473-0.011,0.473-0.011l0.396,0.011c0,0,0.066,0,0.088,0
c0.1,0.264,0.176,0.462,0.221,0.561v0.011h0.67L46.959,12.914L46.959,12.914z M46.684,13.629c0.055,0.11,0.188,0.44,0.353,0.814
c-0.022,0-0.056,0-0.056,0h-0.297c0,0-0.308-0.011-0.352-0.011C46.453,14.135,46.574,13.86,46.684,13.629z"/>
<path d="M48.234,13.541c0,0.429,0.43,0.594,0.804,0.748c0.297,0.121,0.594,0.242,0.594,0.44c0,0.066-0.011,0.11-0.044,0.154
c-0.066,0.088-0.209,0.121-0.439,0.11c-0.221-0.011-0.474-0.088-0.76-0.209l-0.121-0.055v0.099v0.44l0.078,0.022l0.043,0.011
c0.143,0.033,0.407,0.099,0.682,0.099c0.716,0,1.134-0.286,1.134-0.748c0-0.44-0.44-0.616-0.825-0.77
c-0.286-0.11-0.583-0.231-0.583-0.418c0-0.055,0-0.22,0.363-0.22c0.274,0,0.538,0.11,0.682,0.176l0.144,0.055v-0.088v-0.44
l-0.133-0.022c-0.131-0.022-0.363-0.066-0.604-0.066C48.643,12.826,48.234,13.112,48.234,13.541z"/>
<path d="M26.323,16.379c0.506,0,1.1,0.143,1.1,0.693c0,0.308-0.176,0.517-0.539,0.627c0.055,0.099,0.627,0.979,0.726,1.066h-0.715
c-0.154-0.297-0.517-0.902-0.77-1.287c0.044,0.012,0.11,0.012,0.187,0.012c0.209,0,0.506-0.154,0.506-0.43
c0-0.34-0.418-0.407-0.627-0.407c-0.11,0-0.209,0.011-0.264,0.011c-0.011,0.297-0.022,0.671-0.022,0.836
c0,0.209,0,0.913,0.033,1.254h-0.66c0.033-0.33,0.044-0.759,0.044-1.254c0-0.418,0-0.913-0.033-1.133h1.034V16.379z"/>
<path d="M29.766,16.379v0.352c-0.33-0.033-0.66-0.033-1.001-0.033c-0.088,0-0.165,0-0.286,0.011
c-0.011,0.22-0.011,0.495-0.011,0.682l0.869-0.021v0.363l-0.88-0.022c0,0.209,0.011,0.506,0.022,0.759
c0.451-0.011,0.902-0.011,1.342-0.033v0.342H27.83c0.033-0.33,0.033-1.045,0.033-1.254c0-0.231-0.011-0.87-0.033-1.145H29.766z"/>
<path d="M31.548,16.379c0.088,0.242,0.88,1.991,1.067,2.387h-0.66c-0.033-0.109-0.121-0.308-0.22-0.561
c-0.132,0-0.275-0.012-0.473-0.012c-0.176,0-0.319,0-0.473,0.012c-0.077,0.197-0.132,0.385-0.187,0.561H30.03
c0.132-0.297,0.935-2.035,1.067-2.387H31.548z M31.603,17.887c-0.154-0.375-0.297-0.693-0.341-0.814
c-0.11,0.23-0.231,0.506-0.352,0.814c0.099,0,0.242,0.01,0.352,0.01C31.372,17.896,31.482,17.896,31.603,17.887z"/>
<path d="M34.684,18.766h-1.871c0.033-0.33,0.033-1.045,0.033-1.254c0-0.23-0.011-0.869-0.033-1.144h0.66
c-0.022,0.275-0.033,0.901-0.033,1.144c0,0.154,0,0.605,0.011,0.946h0.352c0.363,0,0.627-0.022,0.881-0.044V18.766z"/>
<path d="M37.73,16.379v0.352c-0.33-0.033-0.66-0.033-1.002-0.033c-0.088,0-0.164,0-0.285,0.011c-0.012,0.22-0.012,0.495-0.012,0.682
l0.869-0.021v0.363l-0.88-0.022c0,0.209,0.011,0.506,0.022,0.759c0.451-0.011,0.902-0.011,1.342-0.033v0.342h-1.991
c0.033-0.33,0.033-1.045,0.033-1.254c0-0.231-0.011-0.87-0.033-1.145H37.73z"/>
<path d="M39.139,16.335c0.297,0,0.561,0.044,0.736,0.088v0.528c-0.209-0.121-0.43-0.22-0.814-0.22c-0.34,0-0.363,0.121-0.363,0.22
c0,0.429,1.387,0.374,1.387,1.133c0,0.473-0.418,0.748-1.122,0.748c-0.319,0-0.604-0.055-0.792-0.121v-0.518
c0.43,0.199,0.693,0.275,0.936,0.275c0.274,0,0.406-0.076,0.406-0.253c0-0.473-1.386-0.396-1.386-1.198
C38.137,16.566,38.533,16.335,39.139,16.335z"/>
<path d="M42.383,16.379v0.352c-0.318-0.033-0.418-0.044-0.781-0.044c-0.011,0.286-0.011,0.67-0.011,0.836
c0,0.209,0,0.924,0.033,1.254h-0.671c0.033-0.33,0.044-1.045,0.044-1.254c0-0.166-0.011-0.55-0.022-0.836
c-0.363,0.011-0.461,0.011-0.781,0.044v-0.352H42.383z"/>
<path d="M43.67,16.379c0.088,0.242,0.88,1.991,1.066,2.387h-0.659c-0.033-0.109-0.121-0.308-0.22-0.561
c-0.133,0-0.275-0.012-0.474-0.012c-0.176,0-0.319,0-0.473,0.012c-0.077,0.197-0.132,0.385-0.187,0.561h-0.572
c0.132-0.297,0.935-2.035,1.066-2.387H43.67z M43.725,17.887c-0.154-0.375-0.297-0.693-0.341-0.814
c-0.11,0.23-0.231,0.506-0.353,0.814c0.1,0,0.242,0.01,0.353,0.01S43.615,17.896,43.725,17.887z"/>
<path d="M46.673,16.379v0.352c-0.319-0.033-0.418-0.044-0.78-0.044c-0.012,0.286-0.012,0.67-0.012,0.836
c0,0.209,0,0.924,0.033,1.254h-0.671c0.032-0.33,0.044-1.045,0.044-1.254c0-0.166-0.012-0.55-0.021-0.836
c-0.363,0.011-0.463,0.011-0.781,0.044v-0.352H46.673z"/>
<path d="M48.961,16.379v0.352c-0.33-0.033-0.66-0.033-1.001-0.033c-0.088,0-0.165,0-0.286,0.011
c-0.011,0.22-0.011,0.495-0.011,0.682l0.868-0.021v0.363l-0.879-0.022c0,0.209,0.011,0.506,0.021,0.759
c0.451-0.011,0.902-0.011,1.342-0.033v0.342h-1.99c0.033-0.33,0.033-1.045,0.033-1.254c0-0.231-0.012-0.87-0.033-1.145H48.961z"/>
</symbol>
</svg>
Edit: Clearified my question and updated it to my knowledge.