Как сделать эффект диагонального линейного градиента внутри файла SVG при наведении курсора

Рейтинг: 0Ответов: 0Опубликовано: 19.07.2023

При наведении на SVG сторона .front заменяется стороной .back Нужно, чтобы после переворота по стороне .back проходил диагональный линейный градиент

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>LOGO</title>
</head>
<body>
<svg id="_logo_" class="logo" data-name=" logo " aria-labelledby="logo" focusable="false" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 100 100" width="100px" height="100px" x="0px" y="0px">

      <g class="flipper" id="_flipper_" data-name=" flipper ">
        <g class="front" id="_front_" data-name=" front ">
          <path id="_blue-shield-big_" data-name=" blue-shield-big " d="m78.98,18.52v13.91c0,13.91-14.49,34.79-28.98,45.22-14.49-10.44-28.98-31.31-28.98-45.22v-13.91c9.66,0,24.15-6.96,28.98-10.44,4.83,3.48,19.32,10.44,28.98,10.44Z" style="fill: #1f3047;"/>
          <path id="_white-shield-front_" data-name=" white-shield-front " d="m77.26,19.97v13.09c0,13.09-13.63,32.72-27.26,42.54-13.63-9.82-27.26-29.45-27.26-42.54v-13.09c9.09,0,22.72-6.54,27.26-9.82,4.54,3.27,18.17,9.82,27.26,9.82Z" style="fill: #fff;"/>
          <path id="_blue-shield-small_" data-name=" blue-shield-small " d="m75.46,21.52v12.23c0,12.23-12.73,30.57-25.46,39.73-12.73-9.17-25.47-27.51-25.47-39.73v-12.23c8.49,0,21.22-6.11,25.47-9.17,4.24,3.06,16.98,9.17,25.46,9.17h0Z" style="fill: #1f3047;"/>
          <g id="text-up" style="isolation: isolate;">
            <text transform="translate(31.56 40.21)" style="fill: #fff; font-family: ArialMT, Arial; font-size: 28px; isolation: isolate;"><tspan x="0" y="0">A</tspan><tspan x="18.68" y="0" style="letter-spacing: -.06em;">A</tspan></text>
          </g>
          <g id="text-down" style="isolation: isolate;">
            <text transform="translate(59.45 41.8) rotate(-180)" style="fill: #fff; font-family: ArialMT, Arial; font-size: 28px; isolation: isolate; letter-spacing: -.43em;"><tspan x="0" y="0">V</tspan></text>
          </g>
        </g>
        <g class="back" id="_back_" data-name=" back " fill="url(#linear-gradient)" fill="url(#linear-gradient)">
          <path id="_blue-shield_" data-name=" blue-shield " d="m78.98,18.52v13.91c0,13.91-14.49,34.79-28.98,45.22-14.49-10.44-28.98-31.31-28.98-45.22v-13.91c9.66,0,24.15-6.96,28.98-10.44,4.83,3.48,19.32,10.44,28.98,10.44Z" style="fill: #1f3047;"/>
          <path id="_white-shield-back_" data-name=" white-shield-back " d="m77.26,19.97v13.09c0,13.09-13.63,32.72-27.26,42.54-13.63-9.82-27.26-29.45-27.26-42.54v-13.09c9.09,0,22.72-6.54,27.26-9.82,4.54,3.27,18.17,9.82,27.26,9.82Z" style="fill: #fff;"/>
          <path id="_red-shield_" data-name=" red-shield " d="m75.46,21.52v12.23c0,12.23-12.73,30.57-25.46,39.73-12.73-9.17-25.47-27.51-25.47-39.73v-12.23c8.49,0,21.22-6.11,25.47-9.17,4.24,3.06,16.98,9.17,25.46,9.17h0Z" style="fill: #b22222;"/>
          <path id="_arrow-scale_" data-name=" arrow-scale " d="m70.78,38.15c.79,1.59,1.48,3.22,2.35,4.77-1.14,1.09-2.45,2.03-3.92,2.64-1.21.51-2.51.79-3.82.89-1.15,0-2.32.02-3.44-.27-1.3-.26-2.52-.81-3.65-1.48-.85-.51-1.62-1.14-2.3-1.87.13-.08.27-.16.35-.29.27-.4.43-.86.66-1.29,1.36-2.87,2.63-5.79,3.97-8.67.45-.96.84-1.95,1.3-2.91.47-1.04.94-2.07,1.41-3.11.15-.36.35-.71.45-1.1-1.33.27-2.65.55-3.98.79-1.54.33-3.09.62-4.58,1.12-1.06.35-2.1.79-3.02,1.44-.76.5-1.4,1.19-1.83,2-.06.09-.06.2-.06.31v8.51c-.05,5.2-.03,10.41-.04,15.61,0,.13,0,.26.07.38.55-.3,1.09-.62,1.67-.86-.52,1.33-1.15,2.61-1.72,3.92-.24.47-.38.98-.7,1.41-.24-.3-.38-.67-.54-1.02-.63-1.43-1.32-2.84-1.88-4.29.58.24,1.11.58,1.68.85.04-2.24,0-4.47.06-6.71v-5.3c-.07-4.14,0-8.28-.05-12.41.02-.39-.22-.71-.42-1.02-.38-.52-.85-.98-1.38-1.35-2.09-1.36-4.56-1.95-6.97-2.45-1.57-.29-3.13-.6-4.69-.93.02.09.03.19.07.27,2.02,4.52,4.1,9.02,6.13,13.55.46,1,.89,2.01,1.38,2.99.11.23.26.43.45.61-.12.25-.35.4-.54.59-1.48,1.37-3.35,2.28-5.31,2.73-.81.23-1.67.27-2.51.25-.6.02-1.19-.03-1.79-.07-2.55-.37-5-1.57-6.77-3.46,0-.22.17-.4.25-.59,1.54-3.17,2.98-6.39,4.44-9.6.4-.96.85-1.91,1.28-2.86.7-1.56,1.4-3.12,2.1-4.68-.51-.29-1.06-.64-1.22-1.24-.24-.73.36-1.53,1.1-1.59.41-.03.82.13,1.12.4.2.22.23.54.36.8.31.66.93,1.11,1.58,1.42,1.53.73,3.24,1,4.92,1.08-.19.02-.38.04-.57.06,1.22-.07,2.45.06,3.67.17.57.05,1.12.19,1.65.38.61.25,1.16.63,1.67,1.05,0-.42.06-.84.04-1.26.02-.11-.05-.2-.11-.29-.59-.82-1.2-1.63-1.81-2.45,0-2.49-.02-4.99,0-7.48,0-.26.02-.52.05-.78.63.76,1.21,1.57,1.82,2.35.03-1.06.04-2.12.06-3.17.43-.12.89-.04,1.33-.04.02,1.07.03,2.15.06,3.22.64-.76,1.18-1.6,1.83-2.35.05.96.03,1.93.04,2.89,0,1.69.02,3.38,0,5.08,0,.18-.06.34-.16.48-.48.71-1,1.39-1.51,2.08-.12.17-.28.33-.25.56,0,.39-.03.79.05,1.17.81-.68,1.79-1.17,2.83-1.33,1.26-.2,2.55-.2,3.82-.31,1-.1,2.01-.21,2.99-.46.95-.22,1.88-.58,2.64-1.2.32-.26.59-.6.71-1,.09-.24.12-.52.32-.69.38-.35.93-.41,1.42-.3.29.09.52.32.66.58.24.49.14,1.1-.18,1.54-.26.29-.63.45-.94.67,1.21,2.87,2.52,5.69,3.79,8.53.67,1.48,1.35,2.96,2.03,4.44l.02-.05s.01,0,.01,0Zm1.49,4.55c-.39-1.11-.92-2.17-1.38-3.25-2.08-4.58-4.14-9.17-6.28-13.73-.58,1.16-1.08,2.35-1.63,3.53-1.41,3.09-2.8,6.19-4.22,9.29-.6,1.39-1.26,2.75-1.83,4.15,1.31.07,2.63.04,3.95.05,2.37,0,4.73.02,7.1-.02,1.43,0,2.86.02,4.29-.02Zm-20.45-19.15c.15-.21.14-.48.13-.72-.21.08-.32.29-.46.46-.27.38-.58.74-.81,1.15-.11.17-.1.37-.05.55.1.03.15-.09.22-.15.34-.42.67-.85.96-1.29h0Zm.02-3.65c.16-.21.1-.49.09-.74-.45.51-.83,1.07-1.22,1.63-.18.22-.11.51-.1.76.42-.55.84-1.09,1.23-1.66h0Zm0,1.86c.18-.24.13-.56.09-.84-.41.48-.75,1.02-1.12,1.53-.18.23-.2.53-.11.8.42-.46.78-.98,1.15-1.49h-.01Zm-.1-3.45c.25-.28.24-.67.17-1.01-.41.46-.77.96-1.11,1.47-.19.26-.23.58-.19.9.47-.36.75-.91,1.13-1.36Zm-1.67-1.48c.16-.49.07-1.01.09-1.51-.13.01-.27.04-.39.09-.02.42-.04.84,0,1.25,0,.15.19.15.3.17Zm-.8,2.81c0-.33,0-.69-.2-.97-.35-.5-.71-1-1.12-1.45,0,.34-.07.72.14,1.01.27.41.61.75.87,1.16.08.1.14.26.3.25h.01Zm0,3.52c0-.2.04-.42-.03-.61-.18-.28-.39-.53-.59-.8-.23-.27-.41-.57-.68-.8-.02.27-.08.59.1.82.24.33.49.66.73.99.13.16.24.37.47.39h0Zm0,1.94c.02-.31,0-.64-.18-.9-.34-.48-.69-.97-1.1-1.39-.09.24-.12.52.05.72.39.53.74,1.12,1.23,1.57Zm-.03-3.58c0-.27.07-.57-.1-.81-.35-.54-.76-1.04-1.17-1.54-.02.23-.06.48.07.69.33.6.82,1.09,1.2,1.66Zm-6.31,21.18c-.05-.17-.11-.34-.18-.51-1.82-4.15-3.7-8.27-5.59-12.39-.62-1.33-1.21-2.68-1.88-3.99-.69,1.36-1.31,2.75-1.94,4.14-1.61,3.54-3.22,7.08-4.84,10.61-.27.61-.57,1.21-.8,1.83-.03.09-.03.19-.04.29,3.04.05,6.07.03,9.11.04,2.05,0,4.1.02,6.16-.02Z" style="fill: #fff;"/>
        </g>
      </g>

    <g id="laurell">
      <path d="m13.4,22.83c.49.53.69,1.25.86,1.94.46,2.01.35,4.1.32,6.15.59-.5,1.01-1.26,1.76-1.52.5.9.54,1.99.48,3-.2,1.91-.96,3.74-2.1,5.24-.16.19-.3.46-.57.49-.22-.76.03-1.53.2-2.27-.49.29-.44,1.08-.99,1.32-.17-2.28-.2-4.57-.38-6.85-.23.26-.17.64-.2.96,0,.85-.03,1.76-.5,2.49h-.22c-.54-1.64-.65-3.4-.65-5.13,0-1.35.22-2.73.86-3.92.35-.64.73-1.27,1.1-1.9h.03Z" style="fill: #032e38;"/>
      <path d="m85.27,24.35c.15-.57.39-1.12.74-1.59.69,1.13,1.47,2.25,1.76,3.58.33,1.49.28,3.04.14,4.56-.07.79-.2,1.57-.39,2.33-.05.22-.16.42-.31.59-.81-1.14-.4-2.63-.73-3.92-.12,1.16-.13,2.33-.2,3.49-.11,1.26-.06,2.54-.24,3.8-.4-.33-.45-.93-.88-1.22.13.72.32,1.46.1,2.18-.54-.47-.93-1.1-1.3-1.71-1.01-1.79-1.63-3.93-1.26-6.01.09-.38.16-.82.46-1.1.7.35,1.18,1.02,1.71,1.59-.03-2.19-.17-4.43.41-6.57h-.01Z" style="fill: #032e38;"/>
      <path d="m10.31,32.84c1.34,1.13,2.15,2.81,2.73,4.47.58,1.81.72,3.81.26,5.67-.65-.11-.44-1.08-.94-1.4.05.7.2,1.4.07,2.1-.2.06-.32-.13-.43-.26-.38-.47-.65-1.01-.91-1.56-.5-1.06-1-2.12-1.27-3.27-.5-1.91-.15-3.94.5-5.76h-.01Z" style="fill: #032e38;"/>
      <path d="m88.87,32.96c.09-.08.21-.1.32-.14.35,1.26.71,2.55.67,3.88.05,1.26-.38,2.46-.82,3.61-.4.95-.83,1.89-1.38,2.76-.16.26-.38.48-.64.62-.13-.7-.01-1.4.04-2.1-.13.08-.24.18-.27.34-.14.4-.27.82-.58,1.11-.54-1.73-.4-3.61.06-5.34.51-1.76,1.34-3.45,2.61-4.74h-.01Z" style="fill: #032e38;"/>
      <path d="m16.82,36.86c.11-.06.23.04.23.17.33,1.39.52,2.86.19,4.27-.32,1.27-.92,2.45-1.66,3.5-.23.32-.53.58-.85.8-.19-.64-.06-1.3.05-1.93-.3.29-.48.68-.76.99-.22-.33-.21-.75-.26-1.13-.25-1.91.45-3.86,1.59-5.34.42-.51.87-1.04,1.46-1.32h.01Z" style="fill: #032e38;"/>
      <path d="m82.47,36.83c.29-.06.53.19.75.36,1.29,1.15,2.17,2.81,2.43,4.56.08.95.11,1.94-.19,2.85-.34-.29-.47-.77-.83-1.04.11.62.28,1.25.14,1.87-.16.08-.31-.08-.42-.17-.61-.59-1.03-1.36-1.43-2.11-.7-1.32-1.04-2.87-.85-4.38.08-.65.15-1.33.4-1.93h0Z" style="fill: #032e38;"/>
      <path d="m10.03,43.26c.39,0,.71.29,1.02.51,1.61,1.31,2.91,3.04,3.77,4.97.23-.3.35-.66.44-1.03.21-.87.56-1.69.96-2.48.21-.41.44-.81.77-1.13.38.25.55.73.76,1.13,1.01,2.17.88,4.7.34,6.98,1.36.61,2.33,1.92,2.84,3.35.69,1.91.88,3.98.79,6.01-.04.21.02.52-.21.62-.69-.55-.83-1.5-1.15-2.29-.06-.04-.17-.11-.23-.15.09.83.37,1.62.39,2.46-.93-.38-1.56-1.28-1.93-2.22-.57-1.41-.67-2.97-.7-4.48-.02-.87.08-1.73.04-2.6-.37.58-.48,1.36-1.07,1.77-.45-1.25-.13-2.59-.16-3.88-.26.28-.23.7-.32,1.05-.15.7-.22,1.42-.46,2.09-.61-.87-1.13-1.81-1.69-2.72-.1-.18-.25-.32-.43-.4.3,1.09.94,2.12.83,3.3-.41-.25-.73-.63-1.06-.98-.99-1.09-1.93-2.26-2.55-3.63-.8-1.65-1.12-3.52-1.07-5.35.01-.3,0-.61.09-.91h-.01Z" style="fill: #032e38;"/>
      <path d="m87.91,44.1c.42-.35.84-.73,1.36-.9.24.03.16.35.21.53.12,2.07-.25,4.19-1.19,6.02-.57,1.08-1.29,2.08-2.1,2.98-.44.48-.86.97-1.37,1.36-.15-1.25.6-2.33.9-3.48-.31.14-.46.46-.63.75-.37.66-.78,1.31-1.18,1.96-.12.2-.28.37-.46.51-.17-.75-.29-1.51-.44-2.26-.02-.18-.1-.32-.25-.4,0,.86.08,1.73.02,2.6-.02.31-.12.6-.25.87-.51-.36-.56-1.09-1.02-1.49-.05,1.57.11,3.16-.14,4.72-.18,1.15-.49,2.33-1.19,3.26-.34.45-.77.85-1.3,1.04.04-.97.41-1.88.47-2.84-.31.16-.3.56-.42.85-.22.66-.42,1.38-.93,1.87-.29.24-.28-.26-.3-.45-.1-2.27.11-4.63,1.05-6.71.53-1.18,1.44-2.16,2.55-2.74-.27-1.35-.51-2.72-.37-4.11.13-1.36.49-2.75,1.3-3.84.13-.22.36,0,.45.14.53.71.87,1.54,1.18,2.37.24.67.32,1.42.71,2.02.77-1.77,1.92-3.34,3.3-4.63h.04Z" style="fill: #032e38;"/>
      <path d="m11.15,53.03c.51.07.99.27,1.45.49,2.21,1.02,4.12,2.86,5.09,5.2.28.74.55,1.51.52,2.31-1.21-.52-1.77-1.88-2.85-2.59.14.55.62.88.94,1.31.62.79,1.42,1.6,1.37,2.71-1.67-.62-3.09-1.84-4.22-3.26-1.35-1.74-2.22-3.92-2.31-6.17h0Z" style="fill: #032e38;"/>
      <path d="m87,53.38c.41-.19.83-.37,1.29-.38-.18,3.89-2.62,7.48-5.94,9.16-.19.1-.39.14-.6.18.02-.52.16-1.03.46-1.45.45-.65.94-1.28,1.49-1.85.14-.13.19-.31.24-.49-.41.15-.66.55-.95.87-.53.57-1.02,1.27-1.78,1.5.05-1.42.65-2.75,1.4-3.9,1.11-1.6,2.64-2.89,4.39-3.64Z" style="fill: #032e38;"/>
      <path d="m74.17,59.98c.52-.63,1.12-1.24,1.89-1.52.26.62.31,1.31.39,1.97.13,1.48.13,2.99-.15,4.46-.09.57-.27,1.13-.39,1.69.29-.11.43-.4.61-.64.97-1.33,2.35-2.29,3.83-2.88,1.53-.59,3.2-.85,4.81-.51-.07.31-.19.59-.33.87-.34.7-.64,1.43-1.1,2.06-1.1,1.57-2.77,2.6-4.53,3.16-1.09.34-2.22.62-3.36.69.1-.37.19-.78.46-1.06.45-.49,1.08-.7,1.61-1.06.15-.06.18-.23.24-.37-.86.22-1.62.72-2.47,1-.01-.09-.03-.28-.05-.38-.17.16-.3.36-.41.57-.39.7-.88,1.35-1.51,1.84-.14.13-.33.16-.51.18.15-1.01.41-2,.49-3.02-.32.08-.34.45-.44.72-.19.54-.27,1.12-.54,1.62-.18.27-.41.54-.73.64-.15-.68-.1-1.37-.11-2.06.04-1.73.18-3.48.71-5.12.34-1.05.91-2,1.58-2.85h.01Z" style="fill: #032e38;"/>
      <path d="m23.33,58.57c.32.06.62.18.87.4.83.68,1.48,1.57,2.02,2.52.92,1.58,1.13,3.46,1.3,5.26.02,1.12.08,2.24-.06,3.35-.44-.2-.8-.59-.94-1.07-.13-.46-.24-.92-.39-1.37-.1-.27-.14-.6-.42-.74.03,1.1.4,2.16.48,3.26-.66-.26-1.14-.82-1.57-1.39-.32-.42-.5-.94-.85-1.33,0,.11-.02.34-.03.46-.89-.31-1.71-.83-2.62-1.07.23.49.79.63,1.2.91.63.29,1.16.87,1.22,1.6-.41.08-.82-.05-1.23-.11-2.09-.39-4.22-1.13-5.78-2.7-1.1-1.04-1.72-2.5-2.31-3.9.82-.22,1.69-.15,2.53-.11,2.27.29,4.48,1.4,5.97,3.23.26.31.42.72.77.94-.05-.55-.26-1.07-.35-1.62-.4-2.15-.37-4.4.17-6.52h.02Z" style="fill: #032e38;"/>
      <path d="m27.88,66.39c1.56-.03,3.01.84,4.07,1.98,1.74,1.9,2.79,4.39,3.3,6.94-.37.05-.87.08-1.1-.3-.35-.59-.76-1.13-1.18-1.65-.09-.11-.21-.19-.33-.28.22,1.05,1.01,1.85,1.29,2.88-1.34-.16-2.51-1.02-3.35-2.08-1.24-1.56-1.95-3.5-2.39-5.45-.14-.67-.27-1.34-.31-2.03h0Z" style="fill: #032e38;"/>
      <path d="m67.77,68.01c.97-.92,2.2-1.62,3.52-1.7.34-.07.25.33.23.54-.27,1.81-.74,3.61-1.56,5.23-.71,1.37-1.69,2.68-3.06,3.37-.43.24-.91.39-1.4.4.26-.86.92-1.55,1.07-2.45-.57.29-.86.94-1.22,1.45-.2.44-.72.41-1.11.44.02-.64.23-1.25.41-1.86.64-2.02,1.63-3.96,3.12-5.43h0Z" style="fill: #032e38;"/>
      <path d="m19.71,71.03c1.24-.32,2.53-.32,3.8-.28,1.72.14,3.48.57,4.9,1.65.55.44,1.05.96,1.41,1.58.17.29.35.6.35.95-1.13-.2-2.22-.62-3.35-.8.11.36.51.4.8.52.68.25,1.42.42,1.97.91.29.26.47.63.53,1.03-1.96.03-3.98-.08-5.84-.78-1.41-.53-2.6-1.55-3.55-2.74-.46-.61-.9-1.26-1.04-2.04h.02Z" style="fill: #032e38;"/>
      <path d="m71.81,71.83c1.83-1.02,3.95-1.25,5.99-1.15.66.04,1.32.1,1.96.31-.53,1.62-1.7,2.93-3.02,3.9-1.66,1.17-3.7,1.52-5.66,1.61-.6.03-1.2.09-1.79,0,.12-.37.28-.75.57-1,.66-.59,1.54-.73,2.33-1.05.17-.03.24-.19.29-.33-1.1.16-2.15.59-3.26.74.38-1.35,1.43-2.38,2.59-3.02h0Z" style="fill: #032e38;"/>
      <path d="m34.91,71.11c1.79.12,3.51,1.08,4.6,2.58.67.92,1.12,1.99,1.59,3.03.29.72.63,1.43.71,2.21-.28-.03-.6.02-.82-.19-.38-.34-.63-.81-1-1.17-.1-.13-.27-.12-.41-.17.13.46.42.84.67,1.23.2.29.39.61.68.82.38.2.81.21,1.23.28.94.13,1.74.7,2.5,1.25-.72.68-1.79.54-2.65.86-.03.05-.09.14-.13.19.96,0,1.93-.17,2.88.05.03-1.15-.08-2.32.13-3.46.02-.16.1-.3.26-.34.34-.05.69,0,1.02.07.16.62.15,1.26.2,1.89.06,1.52.02,3.05-.09,4.57,0,.15-.05.31-.13.44-.39.05-.8.06-1.19.01-.24-.72-.04-1.51-.21-2.25-.29.06-.58.16-.84.3-1.27.62-2.56,1.28-3.97,1.42-1.86.22-3.74-.59-5.07-1.91-.17-.1-.06-.29.04-.41.41-.47.93-.81,1.44-1.15.17-.1.29-.26.38-.44-.21.03-.42.08-.62.15-2.01.75-4.27.77-6.27.01-1.04-.39-1.96-1.12-2.59-2.06-.13-.2-.2-.43-.26-.65.9-.42,1.79-.86,2.71-1.21,1.7-.61,3.64-.73,5.31.03.74.33,1.46.81,1.88,1.54.04.07.1.27-.04.25-.94.17-1.91.06-2.85.24l.13.17c.62.24,1.3.13,1.95.22.44.05.88.31,1.06.76-.03.12-.1.35-.13.47.25-.05.49-.13.73-.24.67-.3,1.37-.5,2.04-.79,0-.36-.36-.45-.61-.61-.89-.48-1.61-1.25-2.2-2.08-1.04-1.53-1.59-3.36-1.96-5.18-.05-.25-.06-.5-.06-.75l-.04.02Z" style="fill: #032e38;"/>
      <path d="m60.18,73.3c.94-1.12,2.24-1.88,3.64-2.17.25-.05.51-.05.77-.04-.28,1.86-.79,3.73-1.73,5.35-.63,1.06-1.47,2.01-2.53,2.61-.25.16-.6.25-.66.6.59.25,1.21.44,1.8.69.4.16.78.41,1.23.42-.11-.16-.27-.29-.34-.48.09-.45.53-.75.94-.79.65-.12,1.32-.06,1.97-.19.15,0,.21-.14.27-.26-.86-.03-1.72-.13-2.58-.15-.14-.02-.33.02-.42-.13.12-.45.47-.76.8-1.05.95-.75,2.13-1.13,3.31-1.21,1.2-.05,2.41.2,3.53.67.79.33,1.59.67,2.34,1.1-.52,1.26-1.62,2.16-2.83,2.63-1.46.61-3.07.69-4.62.47-.73-.09-1.42-.38-2.13-.54.05.13.05.32.2.39.56.41,1.21.76,1.58,1.39-.82.92-1.93,1.56-3.08,1.9-1.51.45-3.11.1-4.53-.51-.82-.31-1.55-.85-2.41-1.06-.13.76-.04,1.53-.16,2.29-.42,0-.86.06-1.27-.05-.09-.28-.08-.57-.11-.86-.12-1.7-.12-3.41,0-5.11.02-.32.07-.63.14-.94.39-.03.79-.04,1.18,0,.22.86.21,1.75.22,2.63.6-.23,1.09-.7,1.69-.95.55-.24,1.15-.31,1.74-.39.37-.06.66-.35.86-.66.31-.47.66-.93.85-1.47-.15.04-.33.03-.43.16-.35.36-.6.81-.99,1.13-.22.19-.53.17-.8.14.18-1.03.64-1.98,1.06-2.93.45-.9.84-1.85,1.5-2.6m-5.5,7.62c0,.36,0,.71,0,1.07,1.07-.12,2.14-.08,3.21,0-.05-.04-.15-.13-.2-.17-1-.3-2.11-.27-3-.9Z" style="fill: #032e38;"/>
      <path d="m49.01,78.96c.04-.23.22-.49.47-.45.29.04.65,0,.89.2.35,1.07.17,2.22.21,3.33.03,1-.1,1.99-.1,2.98,0,.24-.07.46-.12.69-.36.13-.75.13-1.13.11-.06-.06-.13-.13-.19-.19-.17-1.01-.25-2.03-.19-3.06.03-1.21-.06-2.44.16-3.64v.03Z" style="fill: #032e38;"/>
      <path d="m51.16,78.62c.37-.07.76-.08,1.14-.03.14.3.13.65.17.98.04,1.27.15,2.53.05,3.8-.05.7,0,1.42-.2,2.11-.04.09-.05.24-.17.25-.33.12-.67.03-1-.01-.3-1.24-.17-2.52-.22-3.79.06-1.1-.15-2.26.23-3.31Z" style="fill: #032e38;"/>
      <path d="m47.14,78.66c.38-.1.78-.03,1.16.01.24.66.2,1.37.19,2.06.02.99,0,1.97,0,2.96.02.72.03,1.46-.24,2.14-.32,0-.65.04-.97-.02-.2-.18-.18-.49-.23-.73-.17-1.59-.18-3.19-.08-4.79.02-.55.05-1.1.18-1.63h0Z" style="fill: #032e38;"/>
    </g>
 
<defs>

    <linearGradient id="linear-gradient" x1="0" y1="0" x2="100%" y2="100%">
      <stop offset="0%" stop-color="#FE20A4" />
      <stop offset="43%" stop-color="#FE20A4" />
      <stop offset="50%" stop-color="white" />
      <stop offset="70%" stop-color="#FE20A4" />
      <stop offset="100%" stop-color="#FE20A4" />
      <animateTransform attributeName="gradientTransform"
        type="translate"
        values="-1 0;1 0"       
        fill="freeze"
        begin="_logo_.mouseover"
        dur="0.5s"
        repeatCount="1"
        restartWhenNotActive/>
    </linearGradient>

<style type="text/css"><![CDATA[
.logo {
  perspective: 70px;
}

svg:hover .flipper, .logo.hover .flipper {
  transform: rotateY(180deg);
}

svg:hover .back {
  transform: rotateY(0deg);
  backface-visibility: hidden;
}

.logo, .front, .back {
  width: 100px;
  height: 100px;
}

.flipper {
  transition: 0.9s;
  transform-style: preserve-3d;
  position: relative;
  transform-origin: center;
}

.back {
  transform: rotateY(90deg);
  transform-origin: 50% 50%;
}
]]>
</style>
</defs>

<a xmlns="http://www.w3.org/2000/svg" id="anchor" xlink:href="#" xmlns:xlink="http://www.w3.org/1999/xlink" target="_top">
      <rect x="0" y="0" width="100px" height="100px" fill-opacity="0"/>
</a>

</svg>
</body>
</html>

Ответы

Ответов пока нет.