/* Demos */
#svg-logo_whole {
  margin-left: auto;
  margin-right: auto;
  width: 400px;
  height: 280px;
}
#svg-logo_mail_1 {
  fill: #ffffff;
  -webkit-animation-name: glow-blue;
  -webkit-animation-delay: .5s;
  -webkit-animation-duration: .7s;
  -webkit-animation-iteration-count: 1;
  -webkit-animation-timing-function: ease-in;
  -webkit-animation-direction: normal;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-name: glow-blue;
  -moz-animation-delay: .5s;
  -moz-animation-duration: .7s;
  -moz-animation-iteration-count: 1;
  -moz-animation-timing-function: ease-in;
  -moz-animation-direction: normal;
  -moz-animation-fill-mode: forwards;
  animation-name: glow-blue;
  animation-delay: .5s;
  animation-duration: .7s;
  animation-iteration-count: 1;
  animation-timing-function: ease-in;
  animation-direction: normal;
  animation-fill-mode: forwards;
}
#svg-logo_mail_2 {
  fill: #ffffff;
  -webkit-animation-name: glow-red;
  -webkit-animation-delay: 1s;
  -webkit-animation-duration: .7s;
  -webkit-animation-iteration-count: 1;
  -webkit-animation-timing-function: ease-in;
  -webkit-animation-direction: normal;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-name: glow-red;
  -moz-animation-delay: 1s;
  -moz-animation-duration: .7s;
  -moz-animation-iteration-count: 1;
  -moz-animation-timing-function: ease-in;
  -moz-animation-direction: normal;
  -moz-animation-fill-mode: forwards;
  animation-name: glow-red;
  animation-delay: 1s;
  animation-duration: .7s;
  animation-iteration-count: 1;
  animation-timing-function: ease-in;
  animation-direction: normal;
  animation-fill-mode: forwards;
}
#svg-logo_mail_3 {
  fill: #ffffff;
  -webkit-animation-name: glow-green;
  -webkit-animation-delay: 1.5s;
  -webkit-animation-duration: .7s;
  -webkit-animation-iteration-count: 1;
  -webkit-animation-timing-function: ease-in;
  -webkit-animation-direction: normal;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-name: glow-green;
  -moz-animation-delay: 1.5s;
  -moz-animation-duration: .7s;
  -moz-animation-iteration-count: 1;
  -moz-animation-timing-function: ease-in;
  -moz-animation-direction: normal;
  -moz-animation-fill-mode: forwards;
  animation-name: glow-green;
  animation-delay: 1.5s;
  animation-duration: .7s;
  animation-iteration-count: 1;
  animation-timing-function: ease-in;
  animation-direction: normal;
  animation-fill-mode: forwards;
}
@-webkit-keyframes glow-blue {
  0% {
    fill: #ffffff;
  }
  100% {
    fill: #56b6dc;
  }
}
@-moz-keyframes glow-blue {
  0% {
    fill: #ffffff;
  }
  100% {
    fill: #56b6dc;
  }
}
@keyframes glow-blue {
  0% {
    fill: #ffffff;
  }
  100% {
    fill: #56b6dc;
  }
}
@-webkit-keyframes glow-red {
  0% {
    fill: #ffffff;
  }
  100% {
    fill: #ed545c;
  }
}
@-moz-keyframes glow-red {
  0% {
    fill: #ffffff;
  }
  100% {
    fill: #ed545c;
  }
}
@keyframes glow-red {
  0% {
    fill: #ffffff;
  }
  100% {
    fill: #ed545c;
  }
}
@-webkit-keyframes glow-green {
  0% {
    fill: #ffffff;
  }
  100% {
    fill: #53aa46;
  }
}
@-moz-keyframes glow-green {
  0% {
    fill: #ffffff;
  }
  100% {
    fill: #53aa46;
  }
}
@keyframes glow-green {
  0% {
    fill: #ffffff;
  }
  100% {
    fill: #53aa46;
  }
}
