Austin Jones
Reputation: 709
SVG hover won't work in Firefox
I have a fairly large SVG and there are specific paths that change when hovered on. This works in Chrome but not Firefox. Each section that is to be animated is nested in a link tag, the hover effect is to make it look like the section is expanding. Any assistance as to why this does not work in Firefox is appreciated. Also not that looking through the debugger it appears Firefox recognize the hover event but is ignore the new path.
#matrice1:hover #sec1 {
d: path("M480.03,200.899l68.21-175.566C509.431,10.447,450.037,0,405.989,0 l-0.106,187.383C431.991,187.383,456.979,192.173,480.03,200.899");
}<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"
viewBox="0 0 808 798" enable-background="new 0 0 800 798">
<a href="#" class="matrixSection matrixNav" onclick="animateMatrix(1)" id="matrice1">
<path clip-path="url(#SVGID_4_)" id="sec1" fill="#E7223B" d="M480.03,200.899l50.842-130.106c-38.81-14.886-80.941-23.066-124.989-23.066
v139.656C431.991,187.383,456.979,192.173,480.03,200.899"/>
<path clip-path="url(#SVGID_4_)" fill="none" stroke="#FFFFFF" stroke-width="0.5" stroke-miterlimit="10" d="M480.03,200.899
l50.842-130.106c-38.81-14.886-80.941-23.066-124.989-23.066v139.656C431.991,187.383,456.979,192.173,480.03,200.899z"/>
<path clip-path="url(#SVGID_4_)" fill="#932826" d="M475.407,212.728l4.623-11.829c-23.051-8.727-48.039-13.517-74.147-13.517
v12.695C430.36,200.078,453.789,204.56,475.407,212.728"/>
<path clip-path="url(#SVGID_4_)" fill="none" stroke="#FFFFFF" stroke-miterlimit="10" d="M475.407,212.728l4.623-11.829
c-23.051-8.727-48.039-13.517-74.147-13.517v12.695C430.36,200.078,453.789,204.56,475.407,212.728z"/>
<path clip-path="url(#SVGID_4_)" fill="#932826" d="M450.935,275.354l24.473-62.626c-21.618-8.166-45.047-12.649-69.524-12.649
v67.277C421.72,267.354,436.894,270.184,450.935,275.354"/>
<path clip-path="url(#SVGID_4_)" fill="none" stroke="#FFFFFF" stroke-miterlimit="10" d="M450.935,275.354l24.473-62.626
c-21.618-8.166-45.047-12.649-69.524-12.649v67.277C421.72,267.354,436.894,270.184,450.935,275.354z"/>
<path clip-path="url(#SVGID_4_)" fill="#E7223B" d="M447.761,283.476l3.174-8.122c-14.041-5.17-29.215-7.999-45.052-7.999v8.723
C420.599,276.078,434.704,278.69,447.761,283.476"/>
<path clip-path="url(#SVGID_4_)" fill="none" stroke="#FFFFFF" stroke-width="0.5" stroke-miterlimit="10" d="M447.761,283.476
l3.174-8.122c-14.041-5.17-29.215-7.999-45.052-7.999v8.723C420.599,276.078,434.704,278.69,447.761,283.476z"/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M455.612,229.054c0.185-0.848,1.027-1.384,1.874-1.198
c0.85,0.186,1.386,1.024,1.198,1.875c-0.187,0.849-1.024,1.386-1.873,1.199C455.963,230.743,455.424,229.904,455.612,229.054"/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M458.478,231.918c1.02,0.324,1.645,1.38,1.41,2.45l-0.113,0.51l-0.049,0.224
l-0.777,3.525c-0.07,0.327-0.397,0.536-0.727,0.463c-0.328-0.072-0.535-0.397-0.464-0.725l0.806-3.658
c0.03-0.138,0.031-0.332-0.22-0.389c-0.175-0.039-0.251,0.137-0.282,0.255l-2.412,10.964c-0.104,0.473-0.568,0.771-1.044,0.668
c-0.474-0.105-0.772-0.572-0.669-1.044l1.39-6.319c0.012-0.07,0.027-0.257-0.188-0.305h-0.003
c-0.218-0.048-0.282,0.127-0.301,0.198l-1.389,6.319c-0.104,0.471-0.57,0.772-1.045,0.667c-0.474-0.104-0.771-0.573-0.666-1.043
l2.411-10.967c0.021-0.118,0.021-0.311-0.149-0.35c-0.252-0.054-0.331,0.124-0.362,0.261l-0.803,3.659
c-0.073,0.326-0.4,0.537-0.729,0.464c-0.328-0.072-0.534-0.399-0.463-0.726l0.775-3.527l0.05-0.222l0.112-0.512
c0.234-1.07,1.245-1.767,2.312-1.632c0.033,0.004,0.073,0.007,0.111,0.016l1.686,0.371l1.676,0.368
C458.404,231.891,458.438,231.905,458.478,231.918"/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M446.297,227.854c0.176-0.805-0.327-1.601-1.134-1.777
c-0.805-0.177-1.602,0.333-1.776,1.137c-0.177,0.802,0.33,1.597,1.136,1.775C445.326,229.166,446.12,228.657,446.297,227.854"/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M441.185,230.184l-2.075,3.672c0,0-0.374,0.674,0.198,0.989
c0.568,0.315,0.909-0.351,0.909-0.351l1.699-3.072c0,0,0.106-0.241,0.287-0.144c0.178,0.097,0.047,0.351,0.047,0.351l-3.053,5.788
l1.577,0.347l-0.969,4.41c-0.092,0.419,0.174,0.832,0.592,0.924c0.42,0.092,0.833-0.173,0.924-0.591l0.971-4.41l0.217,0.046
l0.214,0.045l-0.972,4.413c-0.091,0.419,0.173,0.832,0.593,0.923c0.422,0.095,0.835-0.173,0.926-0.59l0.971-4.411l1.578,0.348
l-0.341-6.533c0,0-0.014-0.285,0.188-0.3c0.202-0.012,0.2,0.252,0.2,0.252l0.252,3.502c0,0,0.031,0.745,0.678,0.699
c0.655-0.045,0.596-0.815,0.596-0.815l-0.342-4.206c0,0-0.181-1.23-1.139-1.442l-1.543-0.339l-1.542-0.34
C441.868,229.142,441.185,230.184,441.185,230.184"/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M437.58,225.936c0.176-0.804-0.328-1.601-1.133-1.777
c-0.805-0.177-1.601,0.333-1.778,1.137c-0.177,0.803,0.332,1.599,1.136,1.775C436.608,227.249,437.402,226.741,437.58,225.936"/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M432.469,228.268l-2.075,3.671c0,0-0.376,0.675,0.198,0.99
c0.568,0.316,0.908-0.348,0.908-0.348l1.699-3.072c0,0,0.107-0.243,0.286-0.146c0.18,0.097,0.047,0.351,0.047,0.351l-3.052,5.787
l1.578,0.347l-0.971,4.412c-0.091,0.417,0.178,0.831,0.595,0.923c0.417,0.092,0.831-0.174,0.924-0.592l0.969-4.41l0.219,0.047
l0.214,0.048l-0.973,4.411c-0.09,0.417,0.173,0.832,0.594,0.924c0.418,0.093,0.833-0.173,0.924-0.59l0.972-4.412l1.577,0.348
l-0.34-6.533c0,0-0.016-0.286,0.187-0.3c0.203-0.014,0.201,0.253,0.201,0.253l0.252,3.5c0,0,0.03,0.746,0.677,0.7
c0.654-0.046,0.595-0.816,0.595-0.816l-0.341-4.205c0,0-0.179-1.231-1.14-1.442l-1.54-0.339l-1.544-0.339
C433.151,227.225,432.469,228.268,432.469,228.268"/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M449.394,237.072c0.669,0.146,1.327-0.277,1.476-0.947
c0.148-0.669-0.274-1.329-0.944-1.477c-0.669-0.146-1.331,0.274-1.477,0.945C448.299,236.263,448.722,236.926,449.394,237.072"/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M445.659,240.196c-0.088,0.129-0.204,0.417,0.053,0.612
c0.298,0.228,0.556-0.054,0.556-0.054l1.118-1.954c0,0,0.144-0.117,0.116,0.029l-1.088,4.944h0.004
c-0.077,0.343,0.139,0.681,0.483,0.758c0.342,0.074,0.682-0.142,0.757-0.485l0.43-1.951c0,0,0.023-0.284,0.249-0.235
c0.221,0.049,0.126,0.318,0.126,0.318l-0.429,1.949c-0.076,0.345,0.143,0.684,0.486,0.758c0.343,0.076,0.684-0.14,0.759-0.483
l1.088-4.945c0.028-0.144,0.085-0.024,0.085-0.024l0.2,1.55c0,0,0.082,0.693,0.145,0.737c0.212,0.149,0.505,0.098,0.657-0.117
c0.097-0.137,0.108-0.308,0.044-0.454l0.008-0.002c-0.008-0.049-0.354-2.074-0.385-2.351c-0.099-0.857-0.595-0.96-1.072-1.079
c-0.478-0.118-0.766-0.169-0.766-0.169s-0.303-0.079-0.942-0.201c-0.635-0.118-0.903,0.163-1.992,1.799
c-0.158,0.236-0.677,0.997-0.692,1.047L445.659,240.196z"/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M424.761,222.271c0.188-0.849-0.35-1.688-1.2-1.876
c-0.847-0.187-1.686,0.351-1.871,1.201c-0.188,0.847,0.346,1.689,1.195,1.874C423.732,223.656,424.574,223.119,424.761,222.271"/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M420.961,223.667c-1.065-0.135-2.075,0.563-2.311,1.632l-0.112,0.509
l-0.048,0.224l-0.777,3.526c-0.07,0.33,0.137,0.654,0.467,0.728c0.329,0.071,0.655-0.135,0.727-0.464l0.805-3.658
c0.029-0.139,0.11-0.315,0.361-0.258c0.174,0.038,0.167,0.229,0.15,0.347l-2.411,10.966c-0.104,0.473,0.191,0.941,0.667,1.045
c0.474,0.104,0.939-0.197,1.044-0.668l1.391-6.32c0.018-0.069,0.08-0.243,0.299-0.196c0.218,0.048,0.204,0.234,0.193,0.305
l-1.392,6.318c-0.103,0.472,0.195,0.942,0.667,1.047c0.473,0.103,0.939-0.199,1.046-0.669l2.411-10.967
c0.031-0.116,0.109-0.29,0.282-0.254c0.25,0.056,0.248,0.25,0.219,0.389l-0.805,3.658c-0.072,0.326,0.137,0.653,0.465,0.726
c0.329,0.073,0.654-0.137,0.727-0.465l0.775-3.524l0.049-0.225l0.111-0.51c0.236-1.07-0.388-2.127-1.412-2.45
c-0.033-0.012-0.068-0.023-0.11-0.035l-1.682-0.371l-1.679-0.368C421.037,223.673,420.996,223.671,420.961,223.667"/>
<line clip-path="url(#SVGID_4_)" fill="none" stroke="#FFFFFF" stroke-width="1.307" stroke-linecap="round" stroke-miterlimit="10" x1="418.099" y1="230.292" x2="415.143" y2="237.227"/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M425.78,231.214c-0.054-0.143-0.172-0.256-0.328-0.289
c-0.244-0.053-0.484,0.101-0.538,0.344c-0.016,0.071,0,0.202,0,0.202l0.735,2.477c0,0,0.04,0.17,0.01,0.309l-1.044,4.745h0.005
c-0.074,0.333,0.133,0.656,0.465,0.728c0.33,0.074,0.652-0.134,0.726-0.464l0.412-1.875c0,0,0.025-0.27,0.238-0.225
c0.213,0.048,0.121,0.305,0.121,0.305l-0.411,1.875c-0.074,0.33,0.137,0.654,0.467,0.727c0.329,0.071,0.656-0.135,0.729-0.465
l1.045-4.747c0.029-0.14,0.137-0.275,0.137-0.275l1.578-1.792c0,0,0.202-0.262,0.218-0.332c0.054-0.242-0.101-0.484-0.344-0.538
c-0.162-0.036-0.315,0.02-0.42,0.125l-0.005-0.003c-0.042,0.022-0.829,0.906-1.055,1.049c-0.243,0.158-0.413,0.096-0.413,0.096
l-0.737-0.163l-0.732-0.161c0,0-0.183-0.016-0.335-0.259c-0.148-0.229-0.488-1.358-0.518-1.397L425.78,231.214z"/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M427.538,232.267c0.671,0.146,1.33-0.276,1.479-0.947
c0.147-0.669-0.274-1.329-0.944-1.477c-0.67-0.146-1.329,0.274-1.477,0.945C426.445,231.457,426.87,232.12,427.538,232.267"/>
<polygon clip-path="url(#SVGID_4_)" fill="#FFFFFF" points="427.168,233.967 428.316,235.267 428.438,237.805 426.421,237.361
424.399,236.917 425.577,234.664 "/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M455.612,229.054c0.185-0.848,1.027-1.384,1.874-1.198
c0.85,0.186,1.386,1.024,1.198,1.875c-0.187,0.849-1.024,1.386-1.873,1.199C455.963,230.743,455.424,229.904,455.612,229.054"/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M458.478,231.918c1.02,0.324,1.645,1.38,1.41,2.45l-0.113,0.51l-0.049,0.224
l-0.777,3.525c-0.07,0.327-0.397,0.536-0.727,0.463c-0.328-0.072-0.535-0.397-0.464-0.725l0.806-3.658
c0.03-0.138,0.031-0.332-0.22-0.389c-0.175-0.039-0.251,0.137-0.282,0.255l-2.412,10.964c-0.104,0.473-0.568,0.771-1.044,0.668
c-0.474-0.105-0.772-0.572-0.669-1.044l1.39-6.319c0.012-0.07,0.027-0.257-0.188-0.305h-0.003
c-0.218-0.048-0.282,0.127-0.301,0.198l-1.389,6.319c-0.104,0.471-0.57,0.772-1.045,0.667c-0.474-0.104-0.771-0.573-0.666-1.043
l2.411-10.967c0.021-0.118,0.021-0.311-0.149-0.35c-0.252-0.054-0.331,0.124-0.362,0.261l-0.803,3.659
c-0.073,0.326-0.4,0.537-0.729,0.464c-0.328-0.072-0.534-0.399-0.463-0.726l0.775-3.527l0.05-0.222l0.112-0.512
c0.234-1.07,1.245-1.767,2.312-1.632c0.033,0.004,0.073,0.007,0.111,0.016l1.686,0.371l1.676,0.368
C458.404,231.891,458.438,231.905,458.478,231.918"/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M446.297,227.854c0.176-0.805-0.327-1.601-1.134-1.777
c-0.805-0.177-1.602,0.333-1.776,1.137c-0.177,0.802,0.33,1.597,1.136,1.775C445.326,229.166,446.12,228.657,446.297,227.854"/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M441.185,230.184l-2.075,3.672c0,0-0.374,0.674,0.198,0.989
c0.568,0.315,0.909-0.351,0.909-0.351l1.699-3.072c0,0,0.106-0.241,0.287-0.144c0.178,0.097,0.047,0.351,0.047,0.351l-3.053,5.788
l1.577,0.347l-0.969,4.41c-0.092,0.419,0.174,0.832,0.592,0.924c0.42,0.092,0.833-0.173,0.924-0.591l0.971-4.41l0.217,0.046
l0.214,0.045l-0.972,4.413c-0.091,0.419,0.173,0.832,0.593,0.923c0.422,0.095,0.835-0.173,0.926-0.59l0.971-4.411l1.578,0.348
l-0.341-6.533c0,0-0.014-0.285,0.188-0.3c0.202-0.012,0.2,0.252,0.2,0.252l0.252,3.502c0,0,0.031,0.745,0.678,0.699
c0.655-0.045,0.596-0.815,0.596-0.815l-0.342-4.206c0,0-0.181-1.23-1.139-1.442l-1.543-0.339l-1.542-0.34
C441.868,229.142,441.185,230.184,441.185,230.184"/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M437.58,225.936c0.176-0.804-0.328-1.601-1.133-1.777
c-0.805-0.177-1.601,0.333-1.778,1.137c-0.177,0.803,0.332,1.599,1.136,1.775C436.608,227.249,437.402,226.741,437.58,225.936"/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M432.469,228.268l-2.075,3.671c0,0-0.376,0.675,0.198,0.99
c0.568,0.316,0.908-0.348,0.908-0.348l1.699-3.072c0,0,0.107-0.243,0.286-0.146c0.18,0.097,0.047,0.351,0.047,0.351l-3.052,5.787
l1.578,0.347l-0.971,4.412c-0.091,0.417,0.178,0.831,0.595,0.923c0.417,0.092,0.831-0.174,0.924-0.592l0.969-4.41l0.219,0.047
l0.214,0.048l-0.973,4.411c-0.09,0.417,0.173,0.832,0.594,0.924c0.418,0.093,0.833-0.173,0.924-0.59l0.972-4.412l1.577,0.348
l-0.34-6.533c0,0-0.016-0.286,0.187-0.3c0.203-0.014,0.201,0.253,0.201,0.253l0.252,3.5c0,0,0.03,0.746,0.677,0.7
c0.654-0.046,0.595-0.816,0.595-0.816l-0.341-4.205c0,0-0.179-1.231-1.14-1.442l-1.54-0.339l-1.544-0.339
C433.151,227.225,432.469,228.268,432.469,228.268"/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M449.394,237.072c0.669,0.146,1.327-0.277,1.476-0.947
c0.148-0.669-0.274-1.329-0.944-1.477c-0.669-0.146-1.331,0.274-1.477,0.945C448.299,236.263,448.722,236.926,449.394,237.072"/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M445.659,240.196c-0.088,0.129-0.204,0.417,0.053,0.612
c0.298,0.228,0.556-0.054,0.556-0.054l1.118-1.954c0,0,0.144-0.117,0.116,0.029l-1.088,4.944h0.004
c-0.077,0.343,0.139,0.681,0.483,0.758c0.342,0.074,0.682-0.142,0.757-0.485l0.43-1.951c0,0,0.023-0.284,0.249-0.235
c0.221,0.049,0.126,0.318,0.126,0.318l-0.429,1.949c-0.076,0.345,0.143,0.684,0.486,0.758c0.343,0.076,0.684-0.14,0.759-0.483
l1.088-4.945c0.028-0.144,0.085-0.024,0.085-0.024l0.2,1.55c0,0,0.082,0.693,0.145,0.737c0.212,0.149,0.505,0.098,0.657-0.117
c0.097-0.137,0.108-0.308,0.044-0.454l0.008-0.002c-0.008-0.049-0.354-2.074-0.385-2.351c-0.099-0.857-0.595-0.96-1.072-1.079
c-0.478-0.118-0.766-0.169-0.766-0.169s-0.303-0.079-0.942-0.201c-0.635-0.118-0.903,0.163-1.992,1.799
c-0.158,0.236-0.677,0.997-0.692,1.047L445.659,240.196z"/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M424.761,222.271c0.188-0.849-0.35-1.688-1.2-1.876
c-0.847-0.187-1.686,0.351-1.871,1.201c-0.188,0.847,0.346,1.689,1.195,1.874C423.732,223.656,424.574,223.119,424.761,222.271"/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M420.961,223.667c-1.065-0.135-2.075,0.563-2.311,1.632l-0.112,0.509
l-0.048,0.224l-0.777,3.526c-0.07,0.33,0.137,0.654,0.467,0.728c0.329,0.071,0.655-0.135,0.727-0.464l0.805-3.658
c0.029-0.139,0.11-0.315,0.361-0.258c0.174,0.038,0.167,0.229,0.15,0.347l-2.411,10.966c-0.104,0.473,0.191,0.941,0.667,1.045
c0.474,0.104,0.939-0.197,1.044-0.668l1.391-6.32c0.018-0.069,0.08-0.243,0.299-0.196c0.218,0.048,0.204,0.234,0.193,0.305
l-1.392,6.318c-0.103,0.472,0.195,0.942,0.667,1.047c0.473,0.103,0.939-0.199,1.046-0.669l2.411-10.967
c0.031-0.116,0.109-0.29,0.282-0.254c0.25,0.056,0.248,0.25,0.219,0.389l-0.805,3.658c-0.072,0.326,0.137,0.653,0.465,0.726
c0.329,0.073,0.654-0.137,0.727-0.465l0.775-3.524l0.049-0.225l0.111-0.51c0.236-1.07-0.388-2.127-1.412-2.45
c-0.033-0.012-0.068-0.023-0.11-0.035l-1.682-0.371l-1.679-0.368C421.037,223.673,420.996,223.671,420.961,223.667"/>
<line clip-path="url(#SVGID_4_)" fill="none" stroke="#FFFFFF" stroke-width="1.307" stroke-linecap="round" stroke-miterlimit="10" x1="418.099" y1="230.292" x2="415.143" y2="237.227"/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M425.78,231.214c-0.054-0.143-0.172-0.256-0.328-0.289
c-0.244-0.053-0.484,0.101-0.538,0.344c-0.016,0.071,0,0.202,0,0.202l0.735,2.477c0,0,0.04,0.17,0.01,0.309l-1.044,4.745h0.005
c-0.074,0.333,0.133,0.656,0.465,0.728c0.33,0.074,0.652-0.134,0.726-0.464l0.412-1.875c0,0,0.025-0.27,0.238-0.225
c0.213,0.048,0.121,0.305,0.121,0.305l-0.411,1.875c-0.074,0.33,0.137,0.654,0.467,0.727c0.329,0.071,0.656-0.135,0.729-0.465
l1.045-4.747c0.029-0.14,0.137-0.275,0.137-0.275l1.578-1.792c0,0,0.202-0.262,0.218-0.332c0.054-0.242-0.101-0.484-0.344-0.538
c-0.162-0.036-0.315,0.02-0.42,0.125l-0.005-0.003c-0.042,0.022-0.829,0.906-1.055,1.049c-0.243,0.158-0.413,0.096-0.413,0.096
l-0.737-0.163l-0.732-0.161c0,0-0.183-0.016-0.335-0.259c-0.148-0.229-0.488-1.358-0.518-1.397L425.78,231.214z"/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M427.538,232.267c0.671,0.146,1.33-0.276,1.479-0.947
c0.147-0.669-0.274-1.329-0.944-1.477c-0.67-0.146-1.329,0.274-1.477,0.945C426.445,231.457,426.87,232.12,427.538,232.267"/>
<polygon clip-path="url(#SVGID_4_)" fill="#FFFFFF" points="427.168,233.967 428.316,235.267 428.438,237.805 426.421,237.361
424.399,236.917 425.577,234.664 "/>
<polygon clip-path="url(#SVGID_4_)" fill="#FFFFFF" points="456.941,77.504 456.98,77.504 456.98,99.654 461.847,99.654
461.847,70.718 457.963,70.718 453.481,75.967 453.481,81.045 453.524,81.045 "/>
<polygon clip-path="url(#SVGID_4_)" fill="#FFFFFF" points="436.893,124.923 436.893,130.997 435.522,130.997 435.522,121.33
437.118,121.33 438.872,126.875 438.872,121.33 440.227,121.33 440.227,130.997 438.801,130.997 "/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M441.151,128.501v-4.675c0-1.512,0.741-2.61,2.45-2.61
c1.728,0,2.468,1.098,2.468,2.61v4.675c0,1.498-0.74,2.611-2.468,2.611C441.893,131.112,441.151,130,441.151,128.501
M444.445,128.759v-5.189c0-0.583-0.259-0.998-0.844-0.998c-0.568,0-0.824,0.415-0.824,0.998v5.189
c0,0.585,0.256,0.997,0.824,0.997C444.187,129.756,444.445,129.344,444.445,128.759"/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M435.522,134.873h2.409c1.64,0,2.238,0.813,2.238,2.167v2.038
c0,1.354-0.599,2.181-2.238,2.181h-0.785v3.28h-1.624V134.873z M437.146,136.198v3.807h0.602c0.555,0,0.795-0.271,0.795-0.799
v-2.224c0-0.527-0.24-0.784-0.795-0.784H437.146z"/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M441.01,142.043v-4.675c0-1.512,0.741-2.609,2.451-2.609
c1.726,0,2.467,1.098,2.467,2.609v4.675c0,1.499-0.741,2.608-2.467,2.608C441.751,144.651,441.01,143.542,441.01,142.043
M444.304,142.301v-5.19c0-0.585-0.259-0.998-0.843-0.998c-0.569,0-0.826,0.413-0.826,0.998v5.19c0,0.585,0.257,0.997,0.826,0.997
C444.045,143.298,444.304,142.886,444.304,142.301"/>
<polygon clip-path="url(#SVGID_4_)" fill="#FFFFFF" points="451.772,134.872 449.933,144.538 448.165,144.538 446.324,134.872
447.98,134.872 449.091,141.617 449.104,141.617 450.246,134.872 "/>
<polygon clip-path="url(#SVGID_4_)" fill="#FFFFFF" points="452.44,134.872 456.319,134.872 456.319,136.197 454.067,136.197
454.067,138.964 455.678,138.964 455.678,140.274 454.067,140.274 454.067,143.213 456.319,143.213 456.319,144.538
452.44,144.538 "/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M458.813,140.105v4.434h-1.627v-9.667h2.369c1.638,0,2.237,0.813,2.237,2.167
v1.239c0,1.042-0.372,1.655-1.299,1.869l1.555,4.392h-1.711L458.813,140.105z M458.813,136.198v3.008h0.542
c0.555,0,0.798-0.285,0.798-0.798v-1.426c0-0.527-0.243-0.784-0.798-0.784H458.813z"/>
<polygon clip-path="url(#SVGID_4_)" fill="#FFFFFF" points="462.347,134.872 466.669,134.872 466.669,136.197 465.327,136.197
465.327,144.538 463.688,144.538 463.688,136.197 462.347,136.197 "/>
<polygon clip-path="url(#SVGID_4_)" fill="#FFFFFF" points="470.586,140.86 470.586,144.538 468.963,144.538 468.963,140.86
467.151,134.872 468.85,134.872 469.832,138.535 469.844,138.535 470.83,134.872 472.383,134.872 "/>
</a>
</svg>Upvotes: 2
Views: 304
Answers (1)
Paul LeBeau
Reputation: 101956
Styling the d attribute with CSS is a new SVG2 thing that Chrome has implemented, but Firefox has not, yet.
Update
You can achieve the same effect using SVGs built-in SMIL animation features. This will work on most browsers - except IE and Edge. If you need to support those browsers also, you will need to switch the path using Javascript (in a mouse event handler).
<path clip-path="url(#SVGID_4_)" id="sec1" fill="#E7223B" d="...initial path...">
<set attributeName="d" to="...new path..."
begin="matrice1.mouseover" end="matrice1.mouseout"/>
</path>
Demo:
<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"
viewBox="0 0 808 798" enable-background="new 0 0 800 798">
<a href="#" class="matrixSection matrixNav" onclick="animateMatrix(1)" id="matrice1">
<path clip-path="url(#SVGID_4_)" id="sec1" fill="#E7223B" d="M480.03,200.899l50.842-130.106c-38.81-14.886-80.941-23.066-124.989-23.066
v139.656C431.991,187.383,456.979,192.173,480.03,200.899">
<set attributeName="d" to="M480.03,200.899l68.21-175.566C509.431,10.447,450.037,0,405.989,0 l-0.106,187.383C431.991,187.383,456.979,192.173,480.03,200.899"
begin="matrice1.mouseover" end="matrice1.mouseout"/>
</path>
<path clip-path="url(#SVGID_4_)" fill="none" stroke="#FFFFFF" stroke-width="0.5" stroke-miterlimit="10" d="M480.03,200.899
l50.842-130.106c-38.81-14.886-80.941-23.066-124.989-23.066v139.656C431.991,187.383,456.979,192.173,480.03,200.899z"/>
<path clip-path="url(#SVGID_4_)" fill="#932826" d="M475.407,212.728l4.623-11.829c-23.051-8.727-48.039-13.517-74.147-13.517
v12.695C430.36,200.078,453.789,204.56,475.407,212.728"/>
<path clip-path="url(#SVGID_4_)" fill="none" stroke="#FFFFFF" stroke-miterlimit="10" d="M475.407,212.728l4.623-11.829
c-23.051-8.727-48.039-13.517-74.147-13.517v12.695C430.36,200.078,453.789,204.56,475.407,212.728z"/>
<path clip-path="url(#SVGID_4_)" fill="#932826" d="M450.935,275.354l24.473-62.626c-21.618-8.166-45.047-12.649-69.524-12.649
v67.277C421.72,267.354,436.894,270.184,450.935,275.354"/>
<path clip-path="url(#SVGID_4_)" fill="none" stroke="#FFFFFF" stroke-miterlimit="10" d="M450.935,275.354l24.473-62.626
c-21.618-8.166-45.047-12.649-69.524-12.649v67.277C421.72,267.354,436.894,270.184,450.935,275.354z"/>
<path clip-path="url(#SVGID_4_)" fill="#E7223B" d="M447.761,283.476l3.174-8.122c-14.041-5.17-29.215-7.999-45.052-7.999v8.723
C420.599,276.078,434.704,278.69,447.761,283.476"/>
<path clip-path="url(#SVGID_4_)" fill="none" stroke="#FFFFFF" stroke-width="0.5" stroke-miterlimit="10" d="M447.761,283.476
l3.174-8.122c-14.041-5.17-29.215-7.999-45.052-7.999v8.723C420.599,276.078,434.704,278.69,447.761,283.476z"/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M455.612,229.054c0.185-0.848,1.027-1.384,1.874-1.198
c0.85,0.186,1.386,1.024,1.198,1.875c-0.187,0.849-1.024,1.386-1.873,1.199C455.963,230.743,455.424,229.904,455.612,229.054"/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M458.478,231.918c1.02,0.324,1.645,1.38,1.41,2.45l-0.113,0.51l-0.049,0.224
l-0.777,3.525c-0.07,0.327-0.397,0.536-0.727,0.463c-0.328-0.072-0.535-0.397-0.464-0.725l0.806-3.658
c0.03-0.138,0.031-0.332-0.22-0.389c-0.175-0.039-0.251,0.137-0.282,0.255l-2.412,10.964c-0.104,0.473-0.568,0.771-1.044,0.668
c-0.474-0.105-0.772-0.572-0.669-1.044l1.39-6.319c0.012-0.07,0.027-0.257-0.188-0.305h-0.003
c-0.218-0.048-0.282,0.127-0.301,0.198l-1.389,6.319c-0.104,0.471-0.57,0.772-1.045,0.667c-0.474-0.104-0.771-0.573-0.666-1.043
l2.411-10.967c0.021-0.118,0.021-0.311-0.149-0.35c-0.252-0.054-0.331,0.124-0.362,0.261l-0.803,3.659
c-0.073,0.326-0.4,0.537-0.729,0.464c-0.328-0.072-0.534-0.399-0.463-0.726l0.775-3.527l0.05-0.222l0.112-0.512
c0.234-1.07,1.245-1.767,2.312-1.632c0.033,0.004,0.073,0.007,0.111,0.016l1.686,0.371l1.676,0.368
C458.404,231.891,458.438,231.905,458.478,231.918"/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M446.297,227.854c0.176-0.805-0.327-1.601-1.134-1.777
c-0.805-0.177-1.602,0.333-1.776,1.137c-0.177,0.802,0.33,1.597,1.136,1.775C445.326,229.166,446.12,228.657,446.297,227.854"/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M441.185,230.184l-2.075,3.672c0,0-0.374,0.674,0.198,0.989
c0.568,0.315,0.909-0.351,0.909-0.351l1.699-3.072c0,0,0.106-0.241,0.287-0.144c0.178,0.097,0.047,0.351,0.047,0.351l-3.053,5.788
l1.577,0.347l-0.969,4.41c-0.092,0.419,0.174,0.832,0.592,0.924c0.42,0.092,0.833-0.173,0.924-0.591l0.971-4.41l0.217,0.046
l0.214,0.045l-0.972,4.413c-0.091,0.419,0.173,0.832,0.593,0.923c0.422,0.095,0.835-0.173,0.926-0.59l0.971-4.411l1.578,0.348
l-0.341-6.533c0,0-0.014-0.285,0.188-0.3c0.202-0.012,0.2,0.252,0.2,0.252l0.252,3.502c0,0,0.031,0.745,0.678,0.699
c0.655-0.045,0.596-0.815,0.596-0.815l-0.342-4.206c0,0-0.181-1.23-1.139-1.442l-1.543-0.339l-1.542-0.34
C441.868,229.142,441.185,230.184,441.185,230.184"/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M437.58,225.936c0.176-0.804-0.328-1.601-1.133-1.777
c-0.805-0.177-1.601,0.333-1.778,1.137c-0.177,0.803,0.332,1.599,1.136,1.775C436.608,227.249,437.402,226.741,437.58,225.936"/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M432.469,228.268l-2.075,3.671c0,0-0.376,0.675,0.198,0.99
c0.568,0.316,0.908-0.348,0.908-0.348l1.699-3.072c0,0,0.107-0.243,0.286-0.146c0.18,0.097,0.047,0.351,0.047,0.351l-3.052,5.787
l1.578,0.347l-0.971,4.412c-0.091,0.417,0.178,0.831,0.595,0.923c0.417,0.092,0.831-0.174,0.924-0.592l0.969-4.41l0.219,0.047
l0.214,0.048l-0.973,4.411c-0.09,0.417,0.173,0.832,0.594,0.924c0.418,0.093,0.833-0.173,0.924-0.59l0.972-4.412l1.577,0.348
l-0.34-6.533c0,0-0.016-0.286,0.187-0.3c0.203-0.014,0.201,0.253,0.201,0.253l0.252,3.5c0,0,0.03,0.746,0.677,0.7
c0.654-0.046,0.595-0.816,0.595-0.816l-0.341-4.205c0,0-0.179-1.231-1.14-1.442l-1.54-0.339l-1.544-0.339
C433.151,227.225,432.469,228.268,432.469,228.268"/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M449.394,237.072c0.669,0.146,1.327-0.277,1.476-0.947
c0.148-0.669-0.274-1.329-0.944-1.477c-0.669-0.146-1.331,0.274-1.477,0.945C448.299,236.263,448.722,236.926,449.394,237.072"/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M445.659,240.196c-0.088,0.129-0.204,0.417,0.053,0.612
c0.298,0.228,0.556-0.054,0.556-0.054l1.118-1.954c0,0,0.144-0.117,0.116,0.029l-1.088,4.944h0.004
c-0.077,0.343,0.139,0.681,0.483,0.758c0.342,0.074,0.682-0.142,0.757-0.485l0.43-1.951c0,0,0.023-0.284,0.249-0.235
c0.221,0.049,0.126,0.318,0.126,0.318l-0.429,1.949c-0.076,0.345,0.143,0.684,0.486,0.758c0.343,0.076,0.684-0.14,0.759-0.483
l1.088-4.945c0.028-0.144,0.085-0.024,0.085-0.024l0.2,1.55c0,0,0.082,0.693,0.145,0.737c0.212,0.149,0.505,0.098,0.657-0.117
c0.097-0.137,0.108-0.308,0.044-0.454l0.008-0.002c-0.008-0.049-0.354-2.074-0.385-2.351c-0.099-0.857-0.595-0.96-1.072-1.079
c-0.478-0.118-0.766-0.169-0.766-0.169s-0.303-0.079-0.942-0.201c-0.635-0.118-0.903,0.163-1.992,1.799
c-0.158,0.236-0.677,0.997-0.692,1.047L445.659,240.196z"/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M424.761,222.271c0.188-0.849-0.35-1.688-1.2-1.876
c-0.847-0.187-1.686,0.351-1.871,1.201c-0.188,0.847,0.346,1.689,1.195,1.874C423.732,223.656,424.574,223.119,424.761,222.271"/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M420.961,223.667c-1.065-0.135-2.075,0.563-2.311,1.632l-0.112,0.509
l-0.048,0.224l-0.777,3.526c-0.07,0.33,0.137,0.654,0.467,0.728c0.329,0.071,0.655-0.135,0.727-0.464l0.805-3.658
c0.029-0.139,0.11-0.315,0.361-0.258c0.174,0.038,0.167,0.229,0.15,0.347l-2.411,10.966c-0.104,0.473,0.191,0.941,0.667,1.045
c0.474,0.104,0.939-0.197,1.044-0.668l1.391-6.32c0.018-0.069,0.08-0.243,0.299-0.196c0.218,0.048,0.204,0.234,0.193,0.305
l-1.392,6.318c-0.103,0.472,0.195,0.942,0.667,1.047c0.473,0.103,0.939-0.199,1.046-0.669l2.411-10.967
c0.031-0.116,0.109-0.29,0.282-0.254c0.25,0.056,0.248,0.25,0.219,0.389l-0.805,3.658c-0.072,0.326,0.137,0.653,0.465,0.726
c0.329,0.073,0.654-0.137,0.727-0.465l0.775-3.524l0.049-0.225l0.111-0.51c0.236-1.07-0.388-2.127-1.412-2.45
c-0.033-0.012-0.068-0.023-0.11-0.035l-1.682-0.371l-1.679-0.368C421.037,223.673,420.996,223.671,420.961,223.667"/>
<line clip-path="url(#SVGID_4_)" fill="none" stroke="#FFFFFF" stroke-width="1.307" stroke-linecap="round" stroke-miterlimit="10" x1="418.099" y1="230.292" x2="415.143" y2="237.227"/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M425.78,231.214c-0.054-0.143-0.172-0.256-0.328-0.289
c-0.244-0.053-0.484,0.101-0.538,0.344c-0.016,0.071,0,0.202,0,0.202l0.735,2.477c0,0,0.04,0.17,0.01,0.309l-1.044,4.745h0.005
c-0.074,0.333,0.133,0.656,0.465,0.728c0.33,0.074,0.652-0.134,0.726-0.464l0.412-1.875c0,0,0.025-0.27,0.238-0.225
c0.213,0.048,0.121,0.305,0.121,0.305l-0.411,1.875c-0.074,0.33,0.137,0.654,0.467,0.727c0.329,0.071,0.656-0.135,0.729-0.465
l1.045-4.747c0.029-0.14,0.137-0.275,0.137-0.275l1.578-1.792c0,0,0.202-0.262,0.218-0.332c0.054-0.242-0.101-0.484-0.344-0.538
c-0.162-0.036-0.315,0.02-0.42,0.125l-0.005-0.003c-0.042,0.022-0.829,0.906-1.055,1.049c-0.243,0.158-0.413,0.096-0.413,0.096
l-0.737-0.163l-0.732-0.161c0,0-0.183-0.016-0.335-0.259c-0.148-0.229-0.488-1.358-0.518-1.397L425.78,231.214z"/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M427.538,232.267c0.671,0.146,1.33-0.276,1.479-0.947
c0.147-0.669-0.274-1.329-0.944-1.477c-0.67-0.146-1.329,0.274-1.477,0.945C426.445,231.457,426.87,232.12,427.538,232.267"/>
<polygon clip-path="url(#SVGID_4_)" fill="#FFFFFF" points="427.168,233.967 428.316,235.267 428.438,237.805 426.421,237.361
424.399,236.917 425.577,234.664 "/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M455.612,229.054c0.185-0.848,1.027-1.384,1.874-1.198
c0.85,0.186,1.386,1.024,1.198,1.875c-0.187,0.849-1.024,1.386-1.873,1.199C455.963,230.743,455.424,229.904,455.612,229.054"/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M458.478,231.918c1.02,0.324,1.645,1.38,1.41,2.45l-0.113,0.51l-0.049,0.224
l-0.777,3.525c-0.07,0.327-0.397,0.536-0.727,0.463c-0.328-0.072-0.535-0.397-0.464-0.725l0.806-3.658
c0.03-0.138,0.031-0.332-0.22-0.389c-0.175-0.039-0.251,0.137-0.282,0.255l-2.412,10.964c-0.104,0.473-0.568,0.771-1.044,0.668
c-0.474-0.105-0.772-0.572-0.669-1.044l1.39-6.319c0.012-0.07,0.027-0.257-0.188-0.305h-0.003
c-0.218-0.048-0.282,0.127-0.301,0.198l-1.389,6.319c-0.104,0.471-0.57,0.772-1.045,0.667c-0.474-0.104-0.771-0.573-0.666-1.043
l2.411-10.967c0.021-0.118,0.021-0.311-0.149-0.35c-0.252-0.054-0.331,0.124-0.362,0.261l-0.803,3.659
c-0.073,0.326-0.4,0.537-0.729,0.464c-0.328-0.072-0.534-0.399-0.463-0.726l0.775-3.527l0.05-0.222l0.112-0.512
c0.234-1.07,1.245-1.767,2.312-1.632c0.033,0.004,0.073,0.007,0.111,0.016l1.686,0.371l1.676,0.368
C458.404,231.891,458.438,231.905,458.478,231.918"/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M446.297,227.854c0.176-0.805-0.327-1.601-1.134-1.777
c-0.805-0.177-1.602,0.333-1.776,1.137c-0.177,0.802,0.33,1.597,1.136,1.775C445.326,229.166,446.12,228.657,446.297,227.854"/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M441.185,230.184l-2.075,3.672c0,0-0.374,0.674,0.198,0.989
c0.568,0.315,0.909-0.351,0.909-0.351l1.699-3.072c0,0,0.106-0.241,0.287-0.144c0.178,0.097,0.047,0.351,0.047,0.351l-3.053,5.788
l1.577,0.347l-0.969,4.41c-0.092,0.419,0.174,0.832,0.592,0.924c0.42,0.092,0.833-0.173,0.924-0.591l0.971-4.41l0.217,0.046
l0.214,0.045l-0.972,4.413c-0.091,0.419,0.173,0.832,0.593,0.923c0.422,0.095,0.835-0.173,0.926-0.59l0.971-4.411l1.578,0.348
l-0.341-6.533c0,0-0.014-0.285,0.188-0.3c0.202-0.012,0.2,0.252,0.2,0.252l0.252,3.502c0,0,0.031,0.745,0.678,0.699
c0.655-0.045,0.596-0.815,0.596-0.815l-0.342-4.206c0,0-0.181-1.23-1.139-1.442l-1.543-0.339l-1.542-0.34
C441.868,229.142,441.185,230.184,441.185,230.184"/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M437.58,225.936c0.176-0.804-0.328-1.601-1.133-1.777
c-0.805-0.177-1.601,0.333-1.778,1.137c-0.177,0.803,0.332,1.599,1.136,1.775C436.608,227.249,437.402,226.741,437.58,225.936"/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M432.469,228.268l-2.075,3.671c0,0-0.376,0.675,0.198,0.99
c0.568,0.316,0.908-0.348,0.908-0.348l1.699-3.072c0,0,0.107-0.243,0.286-0.146c0.18,0.097,0.047,0.351,0.047,0.351l-3.052,5.787
l1.578,0.347l-0.971,4.412c-0.091,0.417,0.178,0.831,0.595,0.923c0.417,0.092,0.831-0.174,0.924-0.592l0.969-4.41l0.219,0.047
l0.214,0.048l-0.973,4.411c-0.09,0.417,0.173,0.832,0.594,0.924c0.418,0.093,0.833-0.173,0.924-0.59l0.972-4.412l1.577,0.348
l-0.34-6.533c0,0-0.016-0.286,0.187-0.3c0.203-0.014,0.201,0.253,0.201,0.253l0.252,3.5c0,0,0.03,0.746,0.677,0.7
c0.654-0.046,0.595-0.816,0.595-0.816l-0.341-4.205c0,0-0.179-1.231-1.14-1.442l-1.54-0.339l-1.544-0.339
C433.151,227.225,432.469,228.268,432.469,228.268"/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M449.394,237.072c0.669,0.146,1.327-0.277,1.476-0.947
c0.148-0.669-0.274-1.329-0.944-1.477c-0.669-0.146-1.331,0.274-1.477,0.945C448.299,236.263,448.722,236.926,449.394,237.072"/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M445.659,240.196c-0.088,0.129-0.204,0.417,0.053,0.612
c0.298,0.228,0.556-0.054,0.556-0.054l1.118-1.954c0,0,0.144-0.117,0.116,0.029l-1.088,4.944h0.004
c-0.077,0.343,0.139,0.681,0.483,0.758c0.342,0.074,0.682-0.142,0.757-0.485l0.43-1.951c0,0,0.023-0.284,0.249-0.235
c0.221,0.049,0.126,0.318,0.126,0.318l-0.429,1.949c-0.076,0.345,0.143,0.684,0.486,0.758c0.343,0.076,0.684-0.14,0.759-0.483
l1.088-4.945c0.028-0.144,0.085-0.024,0.085-0.024l0.2,1.55c0,0,0.082,0.693,0.145,0.737c0.212,0.149,0.505,0.098,0.657-0.117
c0.097-0.137,0.108-0.308,0.044-0.454l0.008-0.002c-0.008-0.049-0.354-2.074-0.385-2.351c-0.099-0.857-0.595-0.96-1.072-1.079
c-0.478-0.118-0.766-0.169-0.766-0.169s-0.303-0.079-0.942-0.201c-0.635-0.118-0.903,0.163-1.992,1.799
c-0.158,0.236-0.677,0.997-0.692,1.047L445.659,240.196z"/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M424.761,222.271c0.188-0.849-0.35-1.688-1.2-1.876
c-0.847-0.187-1.686,0.351-1.871,1.201c-0.188,0.847,0.346,1.689,1.195,1.874C423.732,223.656,424.574,223.119,424.761,222.271"/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M420.961,223.667c-1.065-0.135-2.075,0.563-2.311,1.632l-0.112,0.509
l-0.048,0.224l-0.777,3.526c-0.07,0.33,0.137,0.654,0.467,0.728c0.329,0.071,0.655-0.135,0.727-0.464l0.805-3.658
c0.029-0.139,0.11-0.315,0.361-0.258c0.174,0.038,0.167,0.229,0.15,0.347l-2.411,10.966c-0.104,0.473,0.191,0.941,0.667,1.045
c0.474,0.104,0.939-0.197,1.044-0.668l1.391-6.32c0.018-0.069,0.08-0.243,0.299-0.196c0.218,0.048,0.204,0.234,0.193,0.305
l-1.392,6.318c-0.103,0.472,0.195,0.942,0.667,1.047c0.473,0.103,0.939-0.199,1.046-0.669l2.411-10.967
c0.031-0.116,0.109-0.29,0.282-0.254c0.25,0.056,0.248,0.25,0.219,0.389l-0.805,3.658c-0.072,0.326,0.137,0.653,0.465,0.726
c0.329,0.073,0.654-0.137,0.727-0.465l0.775-3.524l0.049-0.225l0.111-0.51c0.236-1.07-0.388-2.127-1.412-2.45
c-0.033-0.012-0.068-0.023-0.11-0.035l-1.682-0.371l-1.679-0.368C421.037,223.673,420.996,223.671,420.961,223.667"/>
<line clip-path="url(#SVGID_4_)" fill="none" stroke="#FFFFFF" stroke-width="1.307" stroke-linecap="round" stroke-miterlimit="10" x1="418.099" y1="230.292" x2="415.143" y2="237.227"/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M425.78,231.214c-0.054-0.143-0.172-0.256-0.328-0.289
c-0.244-0.053-0.484,0.101-0.538,0.344c-0.016,0.071,0,0.202,0,0.202l0.735,2.477c0,0,0.04,0.17,0.01,0.309l-1.044,4.745h0.005
c-0.074,0.333,0.133,0.656,0.465,0.728c0.33,0.074,0.652-0.134,0.726-0.464l0.412-1.875c0,0,0.025-0.27,0.238-0.225
c0.213,0.048,0.121,0.305,0.121,0.305l-0.411,1.875c-0.074,0.33,0.137,0.654,0.467,0.727c0.329,0.071,0.656-0.135,0.729-0.465
l1.045-4.747c0.029-0.14,0.137-0.275,0.137-0.275l1.578-1.792c0,0,0.202-0.262,0.218-0.332c0.054-0.242-0.101-0.484-0.344-0.538
c-0.162-0.036-0.315,0.02-0.42,0.125l-0.005-0.003c-0.042,0.022-0.829,0.906-1.055,1.049c-0.243,0.158-0.413,0.096-0.413,0.096
l-0.737-0.163l-0.732-0.161c0,0-0.183-0.016-0.335-0.259c-0.148-0.229-0.488-1.358-0.518-1.397L425.78,231.214z"/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M427.538,232.267c0.671,0.146,1.33-0.276,1.479-0.947
c0.147-0.669-0.274-1.329-0.944-1.477c-0.67-0.146-1.329,0.274-1.477,0.945C426.445,231.457,426.87,232.12,427.538,232.267"/>
<polygon clip-path="url(#SVGID_4_)" fill="#FFFFFF" points="427.168,233.967 428.316,235.267 428.438,237.805 426.421,237.361
424.399,236.917 425.577,234.664 "/>
<polygon clip-path="url(#SVGID_4_)" fill="#FFFFFF" points="456.941,77.504 456.98,77.504 456.98,99.654 461.847,99.654
461.847,70.718 457.963,70.718 453.481,75.967 453.481,81.045 453.524,81.045 "/>
<polygon clip-path="url(#SVGID_4_)" fill="#FFFFFF" points="436.893,124.923 436.893,130.997 435.522,130.997 435.522,121.33
437.118,121.33 438.872,126.875 438.872,121.33 440.227,121.33 440.227,130.997 438.801,130.997 "/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M441.151,128.501v-4.675c0-1.512,0.741-2.61,2.45-2.61
c1.728,0,2.468,1.098,2.468,2.61v4.675c0,1.498-0.74,2.611-2.468,2.611C441.893,131.112,441.151,130,441.151,128.501
M444.445,128.759v-5.189c0-0.583-0.259-0.998-0.844-0.998c-0.568,0-0.824,0.415-0.824,0.998v5.189
c0,0.585,0.256,0.997,0.824,0.997C444.187,129.756,444.445,129.344,444.445,128.759"/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M435.522,134.873h2.409c1.64,0,2.238,0.813,2.238,2.167v2.038
c0,1.354-0.599,2.181-2.238,2.181h-0.785v3.28h-1.624V134.873z M437.146,136.198v3.807h0.602c0.555,0,0.795-0.271,0.795-0.799
v-2.224c0-0.527-0.24-0.784-0.795-0.784H437.146z"/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M441.01,142.043v-4.675c0-1.512,0.741-2.609,2.451-2.609
c1.726,0,2.467,1.098,2.467,2.609v4.675c0,1.499-0.741,2.608-2.467,2.608C441.751,144.651,441.01,143.542,441.01,142.043
M444.304,142.301v-5.19c0-0.585-0.259-0.998-0.843-0.998c-0.569,0-0.826,0.413-0.826,0.998v5.19c0,0.585,0.257,0.997,0.826,0.997
C444.045,143.298,444.304,142.886,444.304,142.301"/>
<polygon clip-path="url(#SVGID_4_)" fill="#FFFFFF" points="451.772,134.872 449.933,144.538 448.165,144.538 446.324,134.872
447.98,134.872 449.091,141.617 449.104,141.617 450.246,134.872 "/>
<polygon clip-path="url(#SVGID_4_)" fill="#FFFFFF" points="452.44,134.872 456.319,134.872 456.319,136.197 454.067,136.197
454.067,138.964 455.678,138.964 455.678,140.274 454.067,140.274 454.067,143.213 456.319,143.213 456.319,144.538
452.44,144.538 "/>
<path clip-path="url(#SVGID_4_)" fill="#FFFFFF" d="M458.813,140.105v4.434h-1.627v-9.667h2.369c1.638,0,2.237,0.813,2.237,2.167
v1.239c0,1.042-0.372,1.655-1.299,1.869l1.555,4.392h-1.711L458.813,140.105z M458.813,136.198v3.008h0.542
c0.555,0,0.798-0.285,0.798-0.798v-1.426c0-0.527-0.243-0.784-0.798-0.784H458.813z"/>
<polygon clip-path="url(#SVGID_4_)" fill="#FFFFFF" points="462.347,134.872 466.669,134.872 466.669,136.197 465.327,136.197
465.327,144.538 463.688,144.538 463.688,136.197 462.347,136.197 "/>
<polygon clip-path="url(#SVGID_4_)" fill="#FFFFFF" points="470.586,140.86 470.586,144.538 468.963,144.538 468.963,140.86
467.151,134.872 468.85,134.872 469.832,138.535 469.844,138.535 470.83,134.872 472.383,134.872 "/>
</a>
</svg>Upvotes: 1
Related Questions
- SVG – :hover and links are not working in combination with clip-path and Firefox
- Css hover sometimes doesn't work on svg paths
- SVG not working in Firefox
- Mouse Hover not working as expected on SVG
- :hover works in firebug but not in firefox
- SVG hover fill doesn't work in FireFox
- SVG hover works on Firefox for more than one, not in Chrome, mobile
- Hover css on svg
- div background-image goes blank on hover in Firefox?
- SVG weird behaviour on hover only in firefox - svg-jquery.