Do not work svg css animation in internet explorer (10 and 11)

Please tell me where a bug in my code.
Animation does not work in internet explorer (10 and 11). =(

SVG:

<?xml version="1.0" encoding="UTF-8" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN""http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd"><?xml version="1.0" encoding="utf-8"?><!-- Generator: Adobe Illustrator 17.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  --><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><div>Кликните на логотипе, чтобы повторить анимацию.</div><svg id="MStrike-logo" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
	 viewBox="0 0 361 123"
    enable-background="new 0 0 361 123"
    xml:space="preserve"><filter id='inner-shadow'>
...</filter><path id="logo" filter="url(#inner-shadow)" fill-rule="evenodd" clip-rule="evenodd" fill="#D3003D" d="..."/><path id="media" filter="url(#inner-shadow)" fill-rule="evenodd" clip-rule="evenodd" fill="#4F565F" d="..."/><path id="strike" fill="#D3003D" filter="url(#inner-shadow)" d="..."/><path id="inf-kons-centr" filter="url(#inner-shadow)" fill="#4F565F" d="..."/></svg>

CSS (SASS) :

  svg {
  max-width: 95%;
  max-height: 95%;
  ;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;

  #logo{
    stroke-dasharray: 1000;
    stroke-dashoffset: 1000;

    fill-opacity: 0;

    stroke: #D3003D;
    stroke-width: 0;
    stroke-opacity: 0;
    animation-name: draw-logo;
    animation-duration: 10s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
    animation-timing-function: ease-in;
  }

  #media{
    stroke-dasharray: 500;
    stroke-dashoffset: 500;

    fill-opacity: 0;

    stroke: #4F565F;
    stroke-width: 0;
    stroke-opacity: 0;
    animation-name: draw-logo;
    animation-duration: 6s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
    animation-timing-function: ease-in;
    animation-delay: 3s;
  }


  #strike{
    stroke-dasharray: 500;
    stroke-dashoffset: 500;

    fill-opacity: 0;

    stroke: #D3003D;
    stroke-width: 0;
    stroke-opacity: 0;
    animation-name: draw-logo;
    animation-duration: 7s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
    animation-timing-function: ease-in;
    animation-delay: 2s;
  }


  #inf-kons-centr{
    stroke-dasharray: 100;
    stroke-dashoffset: 100;

    fill-opacity: 0;

    stroke: #4F565F;
    stroke-width: 0;
    stroke-opacity: 0;
    animation-name: inf-kons-centr-anim;
    animation-duration: 2s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
    animation-timing-function: ease-in;
    animation-delay: 7s;
  }

}

@keyframes draw-logo{
  0%{

     fill-opacity: 0;
     stroke-opacity: 0;

  }
  10%{

    stroke-width: 0.3;

  }
  50%{

     fill-opacity: 0;
     stroke-opacity: 1;
     stroke-width: 0.3;

  }
  90%{

     stroke-opacity: 0;
     stroke-width: 0;
     stroke-dashoffset: 0;

  }
  to {
    fill-opacity: 1;
    stroke-opacity: 0;
    stroke-dashoffset: 0;
    }
}

@keyframes inf-kons-centr-anim{
  to {
       fill-opacity: 1;
  }
}