/**** Animation formulaire de contact ************/

#ild_contact_anim {
  width: 100%;
}
#ild_contact_anim .ild_contact_anim_svg {
  display: block;
  width: 100%;
  height: auto;
}
#ild_contact_anim .ild_line,
#ild_contact_anim .ild_icon,
#ild_contact_anim .ild_node,
#ild_contact_anim .ild_pulse,
#ild_contact_anim .ild_dot,
#ild_contact_anim .ild_check {
  stroke: #ffffff;
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
}
#ild_contact_anim .ild_line {
  stroke-width: 2.5;
  opacity: 0.9;
  stroke-dasharray: 220;
  stroke-dashoffset: 220;
  animation: ild_draw 3s linear infinite;
}
#ild_contact_anim .ild_line2 {
  animation-delay: 0.35s;
}
#ild_contact_anim .ild_line3 {
  animation-delay: 0.7s;
}
#ild_contact_anim .ild_line_static {
  stroke-dasharray: none;
  stroke-dashoffset: 0;
}
#ild_contact_anim .ild_node {
  stroke-width: 2.5;
  fill: rgba(255, 255, 255, 0.03);
  opacity: 0;
  animation: ild_nodeIn 3s linear infinite;
}
#ild_contact_anim .ild_n1 {
  animation-delay: 0.05s;
}
#ild_contact_anim .ild_n2 {
  animation-delay: 0.35s;
}
#ild_contact_anim .ild_n3 {
  animation-delay: 0.7s;
}
#ild_contact_anim .ild_n4 {
  animation-delay: 1.05s;
}
#ild_contact_anim .ild_icon {
  stroke-width: 2.3;
  opacity: 0;
  animation: ild_iconIn 3s linear infinite;
}
#ild_contact_anim .ild_i1 {
  animation-delay: 0.1s;
}
#ild_contact_anim .ild_i2 {
  animation-delay: 0.4s;
}
#ild_contact_anim .ild_i3 {
  animation-delay: 0.75s;
}
#ild_contact_anim .ild_i4 {
  animation-delay: 1.1s;
}
#ild_contact_anim .ild_pulse {
  stroke-width: 2;
  opacity: 0;
  transform-box: fill-box;
  transform-origin: center;
  animation: ild_pulseAnim 3s linear infinite;
}
#ild_contact_anim .ild_p1 {
  animation-delay: 0.15s;
}
#ild_contact_anim .ild_p2 {
  animation-delay: 0.5s;
}

#ild_contact_anim .ild_p3 {
  animation-delay: 0.85s;
}
#ild_contact_anim .ild_p4 {
  animation-delay: 1.2s;
}
#ild_contact_anim .ild_dot {
  fill: #ffffff;
  stroke: none;
  opacity: 0;
}
#ild_contact_anim .ild_check {
  stroke-width: 2.5;
  opacity: 0;
  animation: ild_checkIn 3s linear infinite;
  animation-delay: 1.55s;
}
#ild_contact_anim .ild_finalGlow {
  opacity: 0;
  animation: ild_finalGlowAnim 3s linear infinite;
}
#ild_contact_anim .ild_icon_fill {
  fill: #ffffff;
  stroke: none;
}
@keyframes ild_draw {
  0% {
    stroke-dashoffset: 220;
    opacity: 0;
  }
  8% {
    opacity: 0.95;
  }
  28% {
    stroke-dashoffset: 0;
    opacity: 0.95;
  }
  100% {
    stroke-dashoffset: 0;
    opacity: 0.95;
  }
}
@keyframes ild_nodeIn {
  0% {
    opacity: 0;
    transform: scale(0.92);
  }
  10% {
    opacity: 0;
    transform: scale(0.92);
  }
  18% {
    opacity: 1;
    transform: scale(1);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}
@keyframes ild_iconIn {
  0% {
    opacity: 0;
  }
  14% {
    opacity: 0;
  }
  22% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}
@keyframes ild_pulseAnim {
  0% {
    opacity: 0;
    transform: scale(0.7);
  }
  15% {
    opacity: 0;
    transform: scale(0.7);
  }
  28% {
    opacity: 0.55;
    transform: scale(1.08);
  }
  38% {
    opacity: 0;
    transform: scale(1.35);
  }
  100% {
    opacity: 0;
    transform: scale(1.35);
  }
}
@keyframes ild_checkIn {
  0% {
    opacity: 0;
  }
  56% {
    opacity: 0;
  }
  66% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}
@keyframes ild_finalGlowAnim {
  0% {
    opacity: 0;
  }
  72% {
    opacity: 0;
  }
  82% {
    opacity: 0.35;
  }
  92% {
    opacity: 0.1;
  }
  100% {
    opacity: 0;
  }
}

/*** Animation sécurité informatique *********/

#ild_security_anim {
  width: 100%;
}
#ild_security_anim .ild_security_svg {
  display: block;
  width: 100%;
  height: auto;
  overflow: visible;
}
#ild_security_anim .ild_security_line,
#ild_security_anim .ild_security_node,
#ild_security_anim .ild_security_shield,
#ild_security_anim .ild_security_server,
#ild_security_anim .ild_security_shield_pulse,
#ild_security_anim .ild_security_block,
#ild_security_anim .ild_security_check {
  fill: none;
  stroke: #ffffff;
  stroke-linecap: round;
  stroke-linejoin: round;
}
#ild_security_anim .ild_security_fill {
  fill: #ffffff;
  stroke: none;
}
#ild_security_anim .ild_security_line {
  stroke-width: 2;
  opacity: 0.45;
  stroke-dasharray: 8 10;
  animation:
    ild_security_network 3s linear infinite;
}
#ild_security_anim .ild_security_line_middle {
  animation-delay: 0.1s;
}
#ild_security_anim .ild_security_line_bottom {
  animation-delay: 0.2s;
}
#ild_security_anim .ild_security_line_server {
  opacity: 0;
  animation:
    ild_security_server_line 3s linear infinite;
}
#ild_security_anim .ild_security_node {
  stroke-width: 2;
  opacity: 0;
  transform-box: fill-box;
  transform-origin: center;
  animation:
    ild_security_node_in 3s ease infinite;
}
#ild_security_anim .ild_security_node_1 {
  animation-delay: 0s;
}
#ild_security_anim .ild_security_node_2 {
  animation-delay: 0.08s;
}
#ild_security_anim .ild_security_node_3 {
  animation-delay: 0.16s;
}
#ild_security_anim .ild_security_shield {
  stroke-width: 3;
  opacity: 0;
  transform-box: fill-box;
  transform-origin: center;
  animation:
    ild_security_shield_in 3s ease infinite;
}
#ild_security_anim .ild_security_shield_pulse {
  stroke-width: 2;
  opacity: 0;
  transform-box: fill-box;
  transform-origin: center;
  animation:
    ild_security_shield_pulse_anim 3s ease-out infinite;
}
#ild_security_anim .ild_security_server {
  stroke-width: 2;
  opacity: 0;
  transform-box: fill-box;
  transform-origin: center;
  animation:
    ild_security_server_in 3s ease infinite;
}
#ild_security_anim .ild_security_packet {
  fill: #ffffff;
  stroke: none;
  opacity: 0;
}
#ild_security_anim .ild_security_packet_good {
  animation:
    ild_security_good_packet 3s linear infinite;
}
#ild_security_anim .ild_security_packet_delay {
  animation-delay: 0.12s;
}
#ild_security_anim .ild_security_packet_bad {
  animation:
    ild_security_bad_packet 3s linear infinite;
}
#ild_security_anim .ild_security_packet_secure {
  filter: url(#ild_security_glow);
  animation:
    ild_security_secure_packet 3s linear infinite;
}
#ild_security_anim .ild_security_block {
  stroke-width: 2.5;
  opacity: 0;
  transform-box: fill-box;
  transform-origin: center;
  animation:
    ild_security_block_anim 3s ease infinite;
}
#ild_security_anim .ild_security_check {
  stroke-width: 3;
  opacity: 0;
  transform-box: fill-box;
  transform-origin: center;
  animation:
    ild_security_check_anim 3s ease infinite;
}
@keyframes ild_security_network {

  0% {
    stroke-dashoffset: 30;
    opacity: 0;
  }
  12% {
    opacity: 0.45;
  }
  80% {
    opacity: 0.45;
  }
  100% {
    stroke-dashoffset: 0;
    opacity: 0;
  }
}
@keyframes ild_security_node_in {
  0% {
    opacity: 0;
    transform: scale(0.8);
  }
  10% {
    opacity: 1;
    transform: scale(1);
  }
  88% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@keyframes ild_security_shield_in {
  0% {
    opacity: 0;
    transform: scale(0.75);
  }
  15% {
    opacity: 0;
  }
  27% {
    opacity: 1;
    transform: scale(1);
  }
  88% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@keyframes ild_security_shield_pulse_anim {
  0% {
    opacity: 0;
    transform: scale(0.7);
  }
  38% {
    opacity: 0;
    transform: scale(0.7);
  }
  46% {
    opacity: 0.65;
  }
  59% {
    opacity: 0;
    transform: scale(1.35);
  }
  100% {
    opacity: 0;
    transform: scale(1.35);
  }
}
@keyframes ild_security_server_in {
  0%,
  42% {
    opacity: 0;
    transform: scale(0.85);
  }
  55% {
    opacity: 1;
    transform: scale(1);
  }
  90% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@keyframes ild_security_server_line {
  0%,
  44% {
    opacity: 0;
  }
  56% {
    opacity: 0.5;
  }
  90% {
    opacity: 0.5;
  }
  100% {
    opacity: 0;
  }
}
@keyframes ild_security_good_packet {
  0% {
    opacity: 0;
  }
  7% {
    opacity: 1;
  }
  37% {
    opacity: 1;
  }
  42% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}
@keyframes ild_security_bad_packet {
  0% {
    opacity: 0;
  }
  12% {
    opacity: 1;
  }
  39% {
    opacity: 1;
  }
  44% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}
@keyframes ild_security_block_anim {
  0%,
  37% {
    opacity: 0;
    transform: scale(0.4);
  }
  44% {
    opacity: 1;
    transform: scale(1.15);
  }
  52% {
    opacity: 1;
    transform: scale(1);
  }
  62% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}
@keyframes ild_security_secure_packet {
  0%,
  51% {
    opacity: 0;
  }
  57% {
    opacity: 1;
  }
  77% {
    opacity: 1;
  }
  82% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}
@keyframes ild_security_check_anim {
  0%,
  72% {
    opacity: 0;
    transform: scale(0.75);
  }
  82% {
    opacity: 1;
    transform: scale(1.08);
  }
  88% {
    opacity: 1;
    transform: scale(1);
  }
  94% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

/**** Animation partenaires **********/

#ild_partners_anim {
  width: 100%;
}
#ild_partners_anim .ild_partners_svg {
  display: block;
  width: 100%;
  height: auto;
  overflow: visible;
}
#ild_partners_anim .ild_partners_line,
#ild_partners_anim .ild_partners_node,
#ild_partners_anim .ild_partners_center,
#ild_partners_anim .ild_partners_pulse,
#ild_partners_anim .ild_partners_icon,
#ild_partners_anim .ild_partners_ring {
  fill: none;
  stroke: #ffffff;
  stroke-linecap: round;
  stroke-linejoin: round;
}
#ild_partners_anim .ild_partners_fill {
  fill: #ffffff;
  stroke: none;
}
#ild_partners_anim .ild_partners_line {
  stroke-width: 2.2;
  opacity: 0;
  stroke-dasharray: 180;
  stroke-dashoffset: 180;
  animation:
    ild_partners_draw 3s ease-in-out infinite;
}
#ild_partners_anim .ild_partners_line_2 {
  animation-delay: 0.12s;
}
#ild_partners_anim .ild_partners_line_3 {
  animation-delay: 0.24s;
}
#ild_partners_anim .ild_partners_line_4 {
  animation-delay: 0.36s;
}
#ild_partners_anim .ild_partners_node {
  stroke-width: 2.2;
  opacity: 0;
  transform-box: fill-box;
  transform-origin: center;
  animation:
    ild_partners_node_in 3s ease infinite;
}
#ild_partners_anim .ild_partners_node_1 {
  animation-delay: 0s;
}
#ild_partners_anim .ild_partners_node_2 {
  animation-delay: 0.1s;
}
#ild_partners_anim .ild_partners_node_3 {
  animation-delay: 0.2s;
}
#ild_partners_anim .ild_partners_node_4 {
  animation-delay: 0.3s;
}
#ild_partners_anim .ild_partners_center {
  stroke-width: 2.8;
  opacity: 0;
  transform-box: fill-box;
  transform-origin: center;
  animation:
    ild_partners_center_in 3s ease infinite;
}
#ild_partners_anim .ild_partners_icon {
  stroke-width: 2.4;
}
#ild_partners_anim .ild_partners_pulse {
  stroke-width: 2;
  opacity: 0;
  transform-box: fill-box;
  transform-origin: center;
  animation:
    ild_partners_pulse_anim 3s ease-out infinite;
}
#ild_partners_anim .ild_partners_ring {
  stroke-width: 1.8;
  stroke-dasharray: 6 8;
  opacity: 0;
  transform-box: fill-box;
  transform-origin: center;
  animation:
    ild_partners_ring_anim 3s linear infinite;
}
#ild_partners_anim .ild_partners_packet {
  fill: #ffffff;
  stroke: none;
  opacity: 0;
}
#ild_partners_anim .ild_partners_packet_1 {
  animation:
    ild_partners_packet_1 3s linear infinite;
}
#ild_partners_anim .ild_partners_packet_2 {
  animation:
    ild_partners_packet_2 3s linear infinite;
}
#ild_partners_anim .ild_partners_packet_3 {
  animation:
    ild_partners_packet_3 3s linear infinite;
}
#ild_partners_anim .ild_partners_packet_4 {
  animation:
    ild_partners_packet_4 3s linear infinite;
}
@keyframes ild_partners_draw {
  0% {
    opacity: 0;
    stroke-dashoffset: 180;
  }
  12% {
    opacity: 0.15;
  }
  36% {
    opacity: 0.8;
    stroke-dashoffset: 0;
  }
  86% {
    opacity: 0.8;
  }
  100% {
    opacity: 0;
    stroke-dashoffset: 0;
  }
}
@keyframes ild_partners_node_in {
  0% {
    opacity: 0;
    transform: scale(0.72);
  }
  12% {
    opacity: 1;
    transform: scale(1);
  }
  86% {
    opacity: 1;
    transform: scale(1);
  }
  100% {
    opacity: 0;
    transform: scale(0.92);
  }
}
@keyframes ild_partners_center_in {
  0%,
  25% {
    opacity: 0;
    transform: scale(0.65);
  }
  42% {
    opacity: 1;
    transform: scale(1.08);
  }
  50% {
    opacity: 1;
    transform: scale(1);
  }
  90% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@keyframes ild_partners_pulse_anim {
  0%,
  42% {
    opacity: 0;
    transform: scale(0.75);
  }
  52% {
    opacity: 0.6;
  }
  68% {
    opacity: 0;
    transform: scale(1.45);
  }
  100% {
    opacity: 0;
    transform: scale(1.45);
  }
}
@keyframes ild_partners_ring_anim {
  0%,
  38% {
    opacity: 0;
    transform: rotate(0deg);
  }
  50% {
    opacity: 0.45;
  }
  88% {
    opacity: 0.45;
    transform: rotate(90deg);
  }
  100% {
    opacity: 0;
    transform: rotate(110deg);
  }
}
@keyframes ild_partners_packet_1 {
  0%,
  10% {
    opacity: 0;
  }
  18%,
  34% {
    opacity: 1;
  }
  40%,
  100% {
    opacity: 0;
  }
}
@keyframes ild_partners_packet_2 {
  0%,
  18% {
    opacity: 0;
  }
  26%,
  42% {
    opacity: 1;
  }
  48%,
  100% {
    opacity: 0;
  }
}
@keyframes ild_partners_packet_3 {
  0%,
  26% {
    opacity: 0;
  }
  34%,
  50% {
    opacity: 1;
  }
  56%,
  100% {
    opacity: 0;
  }
}
@keyframes ild_partners_packet_4 {
  0%,
  34% {
    opacity: 0;
  }
  42%,
  58% {
    opacity: 1;
  }
  64%,
  100% {
    opacity: 0;
  }
}

/*** Animation secteur médical ****/

#ild_medsec_anim {
  width: 100%;
}
#ild_medsec_anim .ild_medsec_svg {
  display: block;
  width: 100%;
  height: auto;
  overflow: visible;
}
#ild_medsec_anim .ild_medsec_line,
#ild_medsec_anim .ild_medsec_node,
#ild_medsec_anim .ild_medsec_shield,
#ild_medsec_anim .ild_medsec_server,
#ild_medsec_anim .ild_medsec_pulse,
#ild_medsec_anim .ild_medsec_block,
#ild_medsec_anim .ild_medsec_check,
#ild_medsec_anim .ild_medsec_medical_cross,
#ild_medsec_anim .ild_medsec_lock {
  fill: none;
  stroke: #ffffff;
  stroke-linecap: round;
  stroke-linejoin: round;
}
#ild_medsec_anim .ild_medsec_fill {
  fill: #ffffff;
  stroke: none;
}
#ild_medsec_anim .ild_medsec_line {
  stroke-width: 2.1;
  opacity: 0;
  stroke-dasharray: 10 10;
  animation: ild_medsec_line_anim 3s linear infinite;
}
#ild_medsec_anim .ild_medsec_line_2 {
  animation-delay: 0.1s;
}
#ild_medsec_anim .ild_medsec_line_3 {
  animation-delay: 0.2s;
}
#ild_medsec_anim .ild_medsec_line_secure {
  opacity: 0;
  animation: ild_medsec_secure_line 3s linear infinite;
}
#ild_medsec_anim .ild_medsec_node {
  stroke-width: 2.2;
  opacity: 0;
  transform-box: fill-box;
  transform-origin: center;
  animation: ild_medsec_node_in 3s ease infinite;
}
#ild_medsec_anim .ild_medsec_node_1 {
  animation-delay: 0s;
}
#ild_medsec_anim .ild_medsec_node_2 {
  animation-delay: 0.08s;
}
#ild_medsec_anim .ild_medsec_node_3 {
  animation-delay: 0.16s;
}
#ild_medsec_anim .ild_medsec_shield {
  stroke-width: 3;
  opacity: 0;
  transform-box: fill-box;
  transform-origin: center;
  animation: ild_medsec_shield_in 3s ease infinite;
}
#ild_medsec_anim .ild_medsec_pulse {
  stroke-width: 2;
  opacity: 0;
  transform-box: fill-box;
  transform-origin: center;
  animation: ild_medsec_pulse_anim 3s ease-out infinite;
}
#ild_medsec_anim .ild_medsec_server {
  stroke-width: 2.2;
  opacity: 0;
  transform-box: fill-box;
  transform-origin: center;
  animation: ild_medsec_server_in 3s ease infinite;
}
#ild_medsec_anim .ild_medsec_packet {
  fill: #ffffff;
  stroke: none;
  opacity: 0;
}
#ild_medsec_anim .ild_medsec_packet_1 {
  animation: ild_medsec_packet_1 3s linear infinite;
}
#ild_medsec_anim .ild_medsec_packet_2 {
  animation: ild_medsec_packet_2 3s linear infinite;
}
#ild_medsec_anim .ild_medsec_packet_3 {
  animation: ild_medsec_packet_3 3s linear infinite;
}
#ild_medsec_anim .ild_medsec_bad_packet {
  animation: ild_medsec_bad_packet 3s linear infinite;
}
#ild_medsec_anim .ild_medsec_secure_packet {
  filter: url(#ild_medsec_glow);
  animation: ild_medsec_secure_packet 3s linear infinite;
}
#ild_medsec_anim .ild_medsec_block {
  stroke-width: 2.5;
  opacity: 0;
  transform-box: fill-box;
  transform-origin: center;
  animation: ild_medsec_block_anim 3s ease infinite;
}
#ild_medsec_anim .ild_medsec_check {
  stroke-width: 3;
  opacity: 0;
  transform-box: fill-box;
  transform-origin: center;
  animation: ild_medsec_check_anim 3s ease infinite;
}
@keyframes ild_medsec_line_anim {
  0% {
    opacity: 0;
    stroke-dashoffset: 35;
  }
  10% {
    opacity: 0.15;
  }
  34% {
    opacity: 0.65;
    stroke-dashoffset: 0;
  }
  78% {
    opacity: 0.65;
  }
  100% {
    opacity: 0;
  }
}
@keyframes ild_medsec_secure_line {
  0%,
  48% {
    opacity: 0;
  }
  58% {
    opacity: 0.6;
  }
  88% {
    opacity: 0.6;
  }
  100% {
    opacity: 0;
  }
}
@keyframes ild_medsec_node_in {
  0% {
    opacity: 0;
    transform: scale(0.78);
  }
  12% {
    opacity: 1;
    transform: scale(1);
  }
  86% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    transform: scale(0.92);
  }
}
@keyframes ild_medsec_shield_in {
  0%,
  25% {
    opacity: 0;
    transform: scale(0.7);
  }
  40% {
    opacity: 1;
    transform: scale(1.08);
  }
  48% {
    opacity: 1;
    transform: scale(1);
  }
  90% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@keyframes ild_medsec_pulse_anim {
  0%,
  40% {
    opacity: 0;
    transform: scale(0.75);
  }
  50% {
    opacity: 0.65;
  }
  64% {
    opacity: 0;
    transform: scale(1.35);
  }
  100% {
    opacity: 0;
    transform: scale(1.35);
  }
}
@keyframes ild_medsec_server_in {
  0%,
  50% {
    opacity: 0;
    transform: scale(0.82);
  }
  62% {
    opacity: 1;
    transform: scale(1);
  }
  92% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@keyframes ild_medsec_packet_1 {
  0%,
  8% {
    opacity: 0;
  }
  16%,
  34% {
    opacity: 1;
  }
  40%,
  100% {
    opacity: 0;
  }
}
@keyframes ild_medsec_packet_2 {
  0%,
  16% {
    opacity: 0;
  }
  24%,
  42% {
    opacity: 1;
  }
  48%,
  100% {
    opacity: 0;
  }
}
@keyframes ild_medsec_packet_3 {
  0%,
  24% {
    opacity: 0;
  }
  32%,
  50% {
    opacity: 1;
  }
  56%,
  100% {
    opacity: 0;
  }
}
@keyframes ild_medsec_bad_packet {
  0%,
  20% {
    opacity: 0;
  }
  28%,
  43% {
    opacity: 1;
  }
  47%,
  100% {
    opacity: 0;
  }
}
@keyframes ild_medsec_block_anim {
  0%,
  40% {
    opacity: 0;
    transform: scale(0.45);
  }
  47% {
    opacity: 1;
    transform: scale(1.15);
  }
  55% {
    opacity: 1;
    transform: scale(1);
  }
  63%,
  100% {
    opacity: 0;
  }
}
@keyframes ild_medsec_secure_packet {
  0%,
  54% {
    opacity: 0;
  }
  62%,
  80% {
    opacity: 1;
  }
  86%,
  100% {
    opacity: 0;
  }
}
@keyframes ild_medsec_check_anim {
  0%,
  76% {
    opacity: 0;
    transform: scale(0.75);
  }
  84% {
    opacity: 1;
    transform: scale(1.08);
  }
  90% {
    opacity: 1;
    transform: scale(1);
  }
  96% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

/** Animation sécurité postes de travail */

/* ================================
   CONTENEUR
   ================================ */

#ild_detect_anim {
  width: 100%;
}

#ild_detect_anim .ild_detect_svg {
  display: block;
  width: 100%;
  height: auto;
  overflow: visible;
}

/* ================================
   STYLE GLOBAL
   ================================ */

#ild_detect_anim .ild_detect_line,
#ild_detect_anim .ild_detect_node,
#ild_detect_anim .ild_detect_center,
#ild_detect_anim .ild_detect_scan_ring,
#ild_detect_anim .ild_detect_scan_pulse,
#ild_detect_anim .ild_detect_alert,
#ild_detect_anim .ild_detect_response,
#ild_detect_anim .ild_detect_response_pulse,
#ild_detect_anim .ild_detect_check {
  fill: none;
  stroke: #ffffff;
  stroke-linecap: round;
  stroke-linejoin: round;
}

#ild_detect_anim .ild_detect_fill {
  fill: #ffffff;
  stroke: none;
}

/* ================================
   LIGNES
   ================================ */

#ild_detect_anim .ild_detect_line {
  stroke-width: 2.1;
  opacity: 0;
  stroke-dasharray: 10 10;
  animation: ild_detect_line_anim 3s linear infinite;
}

#ild_detect_anim .ild_detect_line_2 {
  animation-delay: 0.1s;
}

#ild_detect_anim .ild_detect_line_3 {
  animation-delay: 0.45s;
}

/* ================================
   NŒUDS
   ================================ */

#ild_detect_anim .ild_detect_node {
  stroke-width: 2.2;
  opacity: 0;
  transform-box: fill-box;
  transform-origin: center;
  animation: ild_detect_node_in 3s ease infinite;
}

#ild_detect_anim .ild_detect_node_1 {
  animation-delay: 0s;
}

#ild_detect_anim .ild_detect_node_2 {
  animation-delay: 0.1s;
}

/* ================================
   CENTRE D'ANALYSE
   ================================ */

#ild_detect_anim .ild_detect_center {
  stroke-width: 2.5;
  opacity: 0;
  transform-box: fill-box;
  transform-origin: center;
  animation: ild_detect_center_in 3s ease infinite;
}

#ild_detect_anim .ild_detect_scan_ring {
  stroke-width: 1.8;
  stroke-dasharray: 7 8;
  opacity: 0;
  transform-box: fill-box;
  transform-origin: center;
  animation: ild_detect_ring_anim 3s linear infinite;
}

#ild_detect_anim .ild_detect_scan_pulse {
  stroke-width: 2;
  opacity: 0;
  transform-box: fill-box;
  transform-origin: center;
  animation: ild_detect_scan_pulse_anim 3s ease-out infinite;
}

/* ================================
   ALERTE
   ================================ */

#ild_detect_anim .ild_detect_alert {
  stroke-width: 2.2;
  opacity: 0;
  transform-box: fill-box;
  transform-origin: center;
  animation: ild_detect_alert_anim 3s ease infinite;
}

/* ================================
   RÉACTION
   ================================ */

#ild_detect_anim .ild_detect_response {
  stroke-width: 3;
  opacity: 0;
  transform-box: fill-box;
  transform-origin: center;
  animation: ild_detect_response_in 3s ease infinite;
}

#ild_detect_anim .ild_detect_response_pulse {
  stroke-width: 2;
  opacity: 0;
  transform-box: fill-box;
  transform-origin: center;
  animation: ild_detect_response_pulse_anim 3s ease-out infinite;
}

#ild_detect_anim .ild_detect_check {
  stroke-width: 3;
  opacity: 0;
  transform-box: fill-box;
  transform-origin: center;
  animation: ild_detect_check_anim 3s ease infinite;
}

/* ================================
   PAQUETS
   ================================ */

#ild_detect_anim .ild_detect_packet {
  fill: #ffffff;
  stroke: none;
  opacity: 0;
}

#ild_detect_anim .ild_detect_packet_1 {
  animation: ild_detect_packet_1 3s linear infinite;
}

#ild_detect_anim .ild_detect_packet_2 {
  animation: ild_detect_packet_2 3s linear infinite;
}

#ild_detect_anim .ild_detect_packet_3 {
  filter: url(#ild_detect_glow);
  animation: ild_detect_packet_3 3s linear infinite;
}

/* ================================
   ANIMATIONS
   ================================ */

@keyframes ild_detect_line_anim {
  0% {
    opacity: 0;
    stroke-dashoffset: 35;
  }
  10% {
    opacity: 0.15;
  }
  34% {
    opacity: 0.7;
    stroke-dashoffset: 0;
  }
  84% {
    opacity: 0.7;
  }
  100% {
    opacity: 0;
  }
}

@keyframes ild_detect_node_in {
  0% {
    opacity: 0;
    transform: scale(0.78);
  }
  12% {
    opacity: 1;
    transform: scale(1);
  }
  86% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    transform: scale(0.92);
  }
}

@keyframes ild_detect_center_in {
  0%,
  22% {
    opacity: 0;
    transform: scale(0.72);
  }
  38% {
    opacity: 1;
    transform: scale(1.08);
  }
  46% {
    opacity: 1;
    transform: scale(1);
  }
  90% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes ild_detect_ring_anim {
  0%,
  24% {
    opacity: 0;
    transform: rotate(0deg);
  }
  40% {
    opacity: 0.45;
  }
  84% {
    opacity: 0.45;
    transform: rotate(90deg);
  }
  100% {
    opacity: 0;
    transform: rotate(110deg);
  }
}

@keyframes ild_detect_scan_pulse_anim {
  0%,
  34% {
    opacity: 0;
    transform: scale(0.8);
  }
  46% {
    opacity: 0.6;
  }
  60% {
    opacity: 0;
    transform: scale(1.35);
  }
  100% {
    opacity: 0;
    transform: scale(1.35);
  }
}

@keyframes ild_detect_alert_anim {
  0%,
  42% {
    opacity: 0;
    transform: scale(0.55);
  }
  50% {
    opacity: 1;
    transform: scale(1.15);
  }
  58% {
    opacity: 1;
    transform: scale(1);
  }
  70% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}

@keyframes ild_detect_response_in {
  0%,
  52% {
    opacity: 0;
    transform: scale(0.8);
  }
  64% {
    opacity: 1;
    transform: scale(1.06);
  }
  72% {
    opacity: 1;
    transform: scale(1);
  }
  92% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes ild_detect_response_pulse_anim {
  0%,
  60% {
    opacity: 0;
    transform: scale(0.75);
  }
  70% {
    opacity: 0.6;
  }
  84% {
    opacity: 0;
    transform: scale(1.35);
  }
  100% {
    opacity: 0;
    transform: scale(1.35);
  }
}

@keyframes ild_detect_check_anim {
  0%,
  76% {
    opacity: 0;
    transform: scale(0.72);
  }
  86% {
    opacity: 1;
    transform: scale(1.08);
  }
  92% {
    opacity: 1;
    transform: scale(1);
  }
  97% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes ild_detect_packet_1 {
  0%,
  8% {
    opacity: 0;
  }
  16%,
  34% {
    opacity: 1;
  }
  40%,
  100% {
    opacity: 0;
  }
}

@keyframes ild_detect_packet_2 {
  0%,
  18% {
    opacity: 0;
  }
  26%,
  44% {
    opacity: 1;
  }
  50%,
  100% {
    opacity: 0;
  }
}

@keyframes ild_detect_packet_3 {
  0%,
  54% {
    opacity: 0;
  }
  62%,
  80% {
    opacity: 1;
  }
  86%,
  100% {
    opacity: 0;
  }
}

/** Animation mail et messagerie **/

/* ================================
   CONTENEUR
   ================================ */

#ild_mail_anim {
  width: 100%;
}

#ild_mail_anim .ild_mail_svg {
  display: block;
  width: 100%;
  height: auto;
  overflow: visible;
}


/* ================================
   STYLE GLOBAL
   ================================ */

#ild_mail_anim .ild_mail_line,
#ild_mail_anim .ild_mail_source,
#ild_mail_anim .ild_mail_center,
#ild_mail_anim .ild_mail_center_ring,
#ild_mail_anim .ild_mail_center_pulse,
#ild_mail_anim .ild_mail_security,
#ild_mail_anim .ild_mail_server,
#ild_mail_anim .ild_mail_check {
  fill: none;
  stroke: #ffffff;
  stroke-linecap: round;
  stroke-linejoin: round;
}

#ild_mail_anim .ild_mail_fill {
  fill: #ffffff;
  stroke: none;
}


/* ================================
   LIGNES
   ================================ */

#ild_mail_anim .ild_mail_line {
  stroke-width: 2.1;
  opacity: 0;

  stroke-dasharray: 10 10;

  animation:
    ild_mail_line_anim 3s linear infinite;
}

#ild_mail_anim .ild_mail_line_2 {
  animation-delay: 0.35s;
}


/* ================================
   ENVELOPPE
   ================================ */

#ild_mail_anim .ild_mail_source {
  stroke-width: 2.3;

  opacity: 0;

  transform-box: fill-box;
  transform-origin: center;

  animation:
    ild_mail_source_in 3s ease infinite;
}


/* ================================
   COLLABORATION
   ================================ */

#ild_mail_anim .ild_mail_center {
  stroke-width: 2.4;

  opacity: 0;

  transform-box: fill-box;
  transform-origin: center;

  animation:
    ild_mail_center_in 3s ease infinite;
}

#ild_mail_anim .ild_mail_center_ring {
  stroke-width: 1.8;

  stroke-dasharray: 7 8;

  opacity: 0;

  transform-box: fill-box;
  transform-origin: center;

  animation:
    ild_mail_ring_anim 3s linear infinite;
}

#ild_mail_anim .ild_mail_center_pulse {
  stroke-width: 2;

  opacity: 0;

  transform-box: fill-box;
  transform-origin: center;

  animation:
    ild_mail_center_pulse_anim 3s ease-out infinite;
}


/* ================================
   SÉCURITÉ
   ================================ */

#ild_mail_anim .ild_mail_security {
  stroke-width: 2.4;

  opacity: 0;

  transform-box: fill-box;
  transform-origin: center;

  animation:
    ild_mail_security_in 3s ease infinite;
}


/* ================================
   SERVEUR
   ================================ */

#ild_mail_anim .ild_mail_server {
  stroke-width: 2.2;

  opacity: 0;

  transform-box: fill-box;
  transform-origin: center;

  animation:
    ild_mail_server_in 3s ease infinite;
}


/* ================================
   PAQUETS
   ================================ */

#ild_mail_anim .ild_mail_packet {
  fill: #ffffff;
  stroke: none;
  opacity: 0;
}

#ild_mail_anim .ild_mail_packet_1 {
  animation:
    ild_mail_packet_1 3s linear infinite;
}

#ild_mail_anim .ild_mail_packet_2 {
  filter: url(#ild_mail_glow);

  animation:
    ild_mail_packet_2 3s linear infinite;
}


/* ================================
   VALIDATION
   ================================ */

#ild_mail_anim .ild_mail_check {
  stroke-width: 3;

  opacity: 0;

  transform-box: fill-box;
  transform-origin: center;

  animation:
    ild_mail_check_anim 3s ease infinite;
}


/* ================================
   ANIMATIONS
   ================================ */

@keyframes ild_mail_line_anim {

  0% {
    opacity: 0;
    stroke-dashoffset: 35;
  }

  12% {
    opacity: 0.15;
  }

  36% {
    opacity: 0.65;
    stroke-dashoffset: 0;
  }

  86% {
    opacity: 0.65;
  }

  100% {
    opacity: 0;
  }

}


/* enveloppe */

@keyframes ild_mail_source_in {

  0% {
    opacity: 0;
    transform: scale(0.78);
  }

  12% {
    opacity: 1;
    transform: scale(1);
  }

  86% {
    opacity: 1;
  }

  100% {
    opacity: 0;
    transform: scale(0.92);
  }

}


/* centre */

@keyframes ild_mail_center_in {

  0%,
  22% {
    opacity: 0;
    transform: scale(0.72);
  }

  38% {
    opacity: 1;
    transform: scale(1.08);
  }

  46% {
    opacity: 1;
    transform: scale(1);
  }

  90% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }

}


/* anneau */

@keyframes ild_mail_ring_anim {

  0%,
  26% {
    opacity: 0;
    transform: rotate(0deg);
  }

  40% {
    opacity: 0.45;
  }

  86% {
    opacity: 0.45;
    transform: rotate(90deg);
  }

  100% {
    opacity: 0;
    transform: rotate(110deg);
  }

}


/* pulsation */

@keyframes ild_mail_center_pulse_anim {

  0%,
  34% {
    opacity: 0;
    transform: scale(0.8);
  }

  46% {
    opacity: 0.6;
  }

  60% {
    opacity: 0;
    transform: scale(1.35);
  }

  100% {
    opacity: 0;
    transform: scale(1.35);
  }

}


/* sécurité */

@keyframes ild_mail_security_in {

  0%,
  42% {
    opacity: 0;
    transform: scale(0.65);
  }

  54% {
    opacity: 1;
    transform: scale(1.1);
  }

  62% {
    opacity: 1;
    transform: scale(1);
  }

  78% {
    opacity: 1;
  }

  88%,
  100% {
    opacity: 0;
  }

}


/* serveur */

@keyframes ild_mail_server_in {

  0%,
  48% {
    opacity: 0;
    transform: scale(0.8);
  }

  62% {
    opacity: 1;
    transform: scale(1);
  }

  92% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }

}


/* paquet 1 */

@keyframes ild_mail_packet_1 {

  0%,
  8% {
    opacity: 0;
  }

  16%,
  36% {
    opacity: 1;
  }

  42%,
  100% {
    opacity: 0;
  }

}


/* paquet 2 */

@keyframes ild_mail_packet_2 {

  0%,
  48% {
    opacity: 0;
  }

  56%,
  78% {
    opacity: 1;
  }

  84%,
  100% {
    opacity: 0;
  }

}


/* validation */

@keyframes ild_mail_check_anim {

  0%,
  76% {
    opacity: 0;
    transform: scale(0.72);
  }

  86% {
    opacity: 1;
    transform: scale(1.08);
  }

  92% {
    opacity: 1;
    transform: scale(1);
  }

  97% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }

}

/** Animation des sauvegardes en ligne **/

/* ================================
   CONTENEUR
   ================================ */

#ild_backup_anim {
  width: 100%;
}

#ild_backup_anim .ild_backup_svg {
  display: block;
  width: 100%;
  height: auto;
  overflow: visible;
}


/* ================================
   STYLE GLOBAL
   ================================ */

#ild_backup_anim .ild_backup_line,
#ild_backup_anim .ild_backup_source,
#ild_backup_anim .ild_backup_security,
#ild_backup_anim .ild_backup_security_pulse,
#ild_backup_anim .ild_backup_cloud,
#ild_backup_anim .ild_backup_cloud_pulse,
#ild_backup_anim .ild_backup_copy,
#ild_backup_anim .ild_backup_check {
  fill: none;
  stroke: #ffffff;
  stroke-linecap: round;
  stroke-linejoin: round;
}

#ild_backup_anim .ild_backup_fill {
  fill: #ffffff;
  stroke: none;
}


/* ================================
   LIGNES
   ================================ */

#ild_backup_anim .ild_backup_line {
  stroke-width: 2.1;
  opacity: 0;

  stroke-dasharray: 10 10;

  animation:
    ild_backup_line_anim 3s linear infinite;
}

#ild_backup_anim .ild_backup_line_2 {
  animation-delay: 0.3s;
}

#ild_backup_anim .ild_backup_copy_line {
  animation-delay: 0.55s;
}


/* ================================
   SOURCE
   ================================ */

#ild_backup_anim .ild_backup_source {
  stroke-width: 2.3;

  opacity: 0;

  transform-box: fill-box;
  transform-origin: center;

  animation:
    ild_backup_source_in 3s ease infinite;
}


/* ================================
   SÉCURITÉ
   ================================ */

#ild_backup_anim .ild_backup_security {
  stroke-width: 2.8;

  opacity: 0;

  transform-box: fill-box;
  transform-origin: center;

  animation:
    ild_backup_security_in 3s ease infinite;
}

#ild_backup_anim .ild_backup_security_pulse {
  stroke-width: 2;

  opacity: 0;

  transform-box: fill-box;
  transform-origin: center;

  animation:
    ild_backup_security_pulse_anim 3s ease-out infinite;
}


/* ================================
   CLOUD
   ================================ */

#ild_backup_anim .ild_backup_cloud {
  stroke-width: 2.4;

  opacity: 0;

  transform-box: fill-box;
  transform-origin: center;

  animation:
    ild_backup_cloud_in 3s ease infinite;
}

#ild_backup_anim .ild_backup_cloud_pulse {
  stroke-width: 2;

  opacity: 0;

  transform-box: fill-box;
  transform-origin: center;

  animation:
    ild_backup_cloud_pulse_anim 3s ease-out infinite;
}


/* ================================
   COPIES
   ================================ */

#ild_backup_anim .ild_backup_copy {
  stroke-width: 2;

  opacity: 0;

  transform-box: fill-box;
  transform-origin: center;

  animation:
    ild_backup_copy_in 3s ease infinite;
}

#ild_backup_anim .ild_backup_copy_2 {
  animation-delay: 0.08s;
}


/* ================================
   PAQUETS
   ================================ */

#ild_backup_anim .ild_backup_packet {
  fill: #ffffff;
  stroke: none;
  opacity: 0;
}

#ild_backup_anim .ild_backup_packet_1 {
  animation:
    ild_backup_packet_1 3s linear infinite;
}

#ild_backup_anim .ild_backup_packet_2 {
  filter: url(#ild_backup_glow);

  animation:
    ild_backup_packet_2 3s linear infinite;
}

#ild_backup_anim .ild_backup_packet_copy_1 {
  animation:
    ild_backup_packet_copy_1 3s linear infinite;
}

#ild_backup_anim .ild_backup_packet_copy_2 {
  animation:
    ild_backup_packet_copy_2 3s linear infinite;
}


/* ================================
   VALIDATION
   ================================ */

#ild_backup_anim .ild_backup_check {
  stroke-width: 3;

  opacity: 0;

  transform-box: fill-box;
  transform-origin: center;

  animation:
    ild_backup_check_anim 3s ease infinite;
}


/* ================================
   ANIMATIONS
   ================================ */

@keyframes ild_backup_line_anim {

  0% {
    opacity: 0;
    stroke-dashoffset: 35;
  }

  12% {
    opacity: 0.15;
  }

  36% {
    opacity: 0.65;
    stroke-dashoffset: 0;
  }

  86% {
    opacity: 0.65;
  }

  100% {
    opacity: 0;
  }

}


/* données locales */

@keyframes ild_backup_source_in {

  0% {
    opacity: 0;
    transform: scale(0.78);
  }

  12% {
    opacity: 1;
    transform: scale(1);
  }

  88% {
    opacity: 1;
  }

  100% {
    opacity: 0;
    transform: scale(0.92);
  }

}


/* bouclier */

@keyframes ild_backup_security_in {

  0%,
  22% {
    opacity: 0;
    transform: scale(0.72);
  }

  38% {
    opacity: 1;
    transform: scale(1.08);
  }

  46% {
    opacity: 1;
    transform: scale(1);
  }

  88% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }

}


/* pulsation sécurité */

@keyframes ild_backup_security_pulse_anim {

  0%,
  34% {
    opacity: 0;
    transform: scale(0.8);
  }

  46% {
    opacity: 0.6;
  }

  60% {
    opacity: 0;
    transform: scale(1.35);
  }

  100% {
    opacity: 0;
    transform: scale(1.35);
  }

}


/* cloud */

@keyframes ild_backup_cloud_in {

  0%,
  42% {
    opacity: 0;
    transform: scale(0.78);
  }

  58% {
    opacity: 1;
    transform: scale(1.06);
  }

  66% {
    opacity: 1;
    transform: scale(1);
  }

  92% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }

}


/* pulsation cloud */

@keyframes ild_backup_cloud_pulse_anim {

  0%,
  56% {
    opacity: 0;
    transform: scale(0.8);
  }

  68% {
    opacity: 0.6;
  }

  82% {
    opacity: 0;
    transform: scale(1.35);
  }

  100% {
    opacity: 0;
    transform: scale(1.35);
  }

}


/* copies */

@keyframes ild_backup_copy_in {

  0%,
  62% {
    opacity: 0;
    transform: scale(0.7);
  }

  74% {
    opacity: 1;
    transform: scale(1.08);
  }

  82% {
    opacity: 1;
    transform: scale(1);
  }

  94% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }

}


/* paquet 1 */

@keyframes ild_backup_packet_1 {

  0%,
  8% {
    opacity: 0;
  }

  16%,
  36% {
    opacity: 1;
  }

  42%,
  100% {
    opacity: 0;
  }

}


/* paquet 2 */

@keyframes ild_backup_packet_2 {

  0%,
  42% {
    opacity: 0;
  }

  50%,
  68% {
    opacity: 1;
  }

  74%,
  100% {
    opacity: 0;
  }

}


/* copie haute */

@keyframes ild_backup_packet_copy_1 {

  0%,
  62% {
    opacity: 0;
  }

  70%,
  82% {
    opacity: 1;
  }

  88%,
  100% {
    opacity: 0;
  }

}


/* copie basse */

@keyframes ild_backup_packet_copy_2 {

  0%,
  66% {
    opacity: 0;
  }

  74%,
  86% {
    opacity: 1;
  }

  92%,
  100% {
    opacity: 0;
  }

}


/* validation */

@keyframes ild_backup_check_anim {

  0%,
  80% {
    opacity: 0;
    transform: scale(0.72);
  }

  88% {
    opacity: 1;
    transform: scale(1.08);
  }

  93% {
    opacity: 1;
    transform: scale(1);
  }

  97% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }

}

/** Animation Infogérance **/

/* ================================
   CONTENEUR
   ================================ */

#ild_managed_anim {
  width: 100%;
}

#ild_managed_anim .ild_managed_svg {
  display: block;
  width: 100%;
  height: auto;
  overflow: visible;
}


/* ================================
   STYLE GLOBAL
   ================================ */

#ild_managed_anim .ild_managed_line,
#ild_managed_anim .ild_managed_node,
#ild_managed_anim .ild_managed_center,
#ild_managed_anim .ild_managed_center_ring,
#ild_managed_anim .ild_managed_center_pulse,
#ild_managed_anim .ild_managed_tool,
#ild_managed_anim .ild_managed_result,
#ild_managed_anim .ild_managed_result_pulse,
#ild_managed_anim .ild_managed_check {
  fill: none;
  stroke: #ffffff;
  stroke-linecap: round;
  stroke-linejoin: round;
}

#ild_managed_anim .ild_managed_fill {
  fill: #ffffff;
  stroke: none;
}


/* ================================
   LIGNES
   ================================ */

#ild_managed_anim .ild_managed_line {
  stroke-width: 2.1;
  opacity: 0;

  stroke-dasharray: 10 10;

  animation:
    ild_managed_line_anim 3s linear infinite;
}

#ild_managed_anim .ild_managed_line_2 {
  animation-delay: 0.1s;
}

#ild_managed_anim .ild_managed_line_3 {
  animation-delay: 0.2s;
}

#ild_managed_anim .ild_managed_line_action {
  animation-delay: 0.45s;
}


/* ================================
   ÉLÉMENTS DU PARC
   ================================ */

#ild_managed_anim .ild_managed_node {
  stroke-width: 2.2;

  opacity: 0;

  transform-box: fill-box;
  transform-origin: center;

  animation:
    ild_managed_node_in 3s ease infinite;
}

#ild_managed_anim .ild_managed_node_1 {
  animation-delay: 0s;
}

#ild_managed_anim .ild_managed_node_2 {
  animation-delay: 0.08s;
}

#ild_managed_anim .ild_managed_node_3 {
  animation-delay: 0.16s;
}


/* ================================
   SUPERVISION
   ================================ */

#ild_managed_anim .ild_managed_center {
  stroke-width: 2.5;

  opacity: 0;

  transform-box: fill-box;
  transform-origin: center;

  animation:
    ild_managed_center_in 3s ease infinite;
}

#ild_managed_anim .ild_managed_center_ring {
  stroke-width: 1.8;

  stroke-dasharray: 7 8;

  opacity: 0;

  transform-box: fill-box;
  transform-origin: center;

  animation:
    ild_managed_ring_anim 3s linear infinite;
}

#ild_managed_anim .ild_managed_center_pulse {
  stroke-width: 2;

  opacity: 0;

  transform-box: fill-box;
  transform-origin: center;

  animation:
    ild_managed_center_pulse_anim 3s ease-out infinite;
}


/* ================================
   MAINTENANCE
   ================================ */

#ild_managed_anim .ild_managed_tool {
  stroke-width: 2.2;

  opacity: 0;

  transform-box: fill-box;
  transform-origin: center;

  animation:
    ild_managed_tool_anim 3s ease infinite;
}


/* ================================
   PARC FINAL
   ================================ */

#ild_managed_anim .ild_managed_result {
  stroke-width: 2.3;

  opacity: 0;

  transform-box: fill-box;
  transform-origin: center;

  animation:
    ild_managed_result_in 3s ease infinite;
}

#ild_managed_anim .ild_managed_result_pulse {
  stroke-width: 2;

  opacity: 0;

  transform-box: fill-box;
  transform-origin: center;

  animation:
    ild_managed_result_pulse_anim 3s ease-out infinite;
}


/* ================================
   FLUX
   ================================ */

#ild_managed_anim .ild_managed_packet {
  fill: #ffffff;
  stroke: none;
  opacity: 0;
}

#ild_managed_anim .ild_managed_packet_1 {
  animation:
    ild_managed_packet_1 3s linear infinite;
}

#ild_managed_anim .ild_managed_packet_2 {
  animation:
    ild_managed_packet_2 3s linear infinite;
}

#ild_managed_anim .ild_managed_packet_3 {
  animation:
    ild_managed_packet_3 3s linear infinite;
}

#ild_managed_anim .ild_managed_packet_action {
  filter: url(#ild_managed_glow);

  animation:
    ild_managed_packet_action 3s linear infinite;
}


/* ================================
   VALIDATION
   ================================ */

#ild_managed_anim .ild_managed_check {
  stroke-width: 3;

  opacity: 0;

  transform-box: fill-box;
  transform-origin: center;

  animation:
    ild_managed_check_anim 3s ease infinite;
}


/* ================================
   ANIMATIONS
   ================================ */

@keyframes ild_managed_line_anim {

  0% {
    opacity: 0;
    stroke-dashoffset: 35;
  }

  10% {
    opacity: 0.15;
  }

  34% {
    opacity: 0.65;
    stroke-dashoffset: 0;
  }

  84% {
    opacity: 0.65;
  }

  100% {
    opacity: 0;
  }

}


/* parc */

@keyframes ild_managed_node_in {

  0% {
    opacity: 0;
    transform: scale(0.78);
  }

  12% {
    opacity: 1;
    transform: scale(1);
  }

  86% {
    opacity: 1;
  }

  100% {
    opacity: 0;
    transform: scale(0.92);
  }

}


/* supervision centrale */

@keyframes ild_managed_center_in {

  0%,
  24% {
    opacity: 0;
    transform: scale(0.72);
  }

  40% {
    opacity: 1;
    transform: scale(1.08);
  }

  48% {
    opacity: 1;
    transform: scale(1);
  }

  90% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }

}


/* anneau */

@keyframes ild_managed_ring_anim {

  0%,
  28% {
    opacity: 0;
    transform: rotate(0deg);
  }

  42% {
    opacity: 0.45;
  }

  86% {
    opacity: 0.45;
    transform: rotate(90deg);
  }

  100% {
    opacity: 0;
    transform: rotate(110deg);
  }

}


/* scan */

@keyframes ild_managed_center_pulse_anim {

  0%,
  36% {
    opacity: 0;
    transform: scale(0.8);
  }

  48% {
    opacity: 0.6;
  }

  62% {
    opacity: 0;
    transform: scale(1.35);
  }

  100% {
    opacity: 0;
    transform: scale(1.35);
  }

}


/* clé de maintenance */

@keyframes ild_managed_tool_anim {

  0%,
  42% {
    opacity: 0;
    transform: scale(0.6) rotate(-25deg);
  }

  52% {
    opacity: 1;
    transform: scale(1.1) rotate(8deg);
  }

  62% {
    opacity: 1;
    transform: scale(1) rotate(0deg);
  }

  72% {
    opacity: 1;
  }

  82%,
  100% {
    opacity: 0;
  }

}


/* résultat */

@keyframes ild_managed_result_in {

  0%,
  52% {
    opacity: 0;
    transform: scale(0.78);
  }

  65% {
    opacity: 1;
    transform: scale(1.06);
  }

  73% {
    opacity: 1;
    transform: scale(1);
  }

  94% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }

}


/* pulsation résultat */

@keyframes ild_managed_result_pulse_anim {

  0%,
  64% {
    opacity: 0;
    transform: scale(0.75);
  }

  74% {
    opacity: 0.6;
  }

  88% {
    opacity: 0;
    transform: scale(1.35);
  }

  100% {
    opacity: 0;
    transform: scale(1.35);
  }

}


/* paquet 1 */

@keyframes ild_managed_packet_1 {

  0%,
  8% {
    opacity: 0;
  }

  16%,
  34% {
    opacity: 1;
  }

  40%,
  100% {
    opacity: 0;
  }

}


/* paquet 2 */

@keyframes ild_managed_packet_2 {

  0%,
  16% {
    opacity: 0;
  }

  24%,
  42% {
    opacity: 1;
  }

  48%,
  100% {
    opacity: 0;
  }

}


/* paquet 3 */

@keyframes ild_managed_packet_3 {

  0%,
  24% {
    opacity: 0;
  }

  32%,
  50% {
    opacity: 1;
  }

  56%,
  100% {
    opacity: 0;
  }

}


/* action technique */

@keyframes ild_managed_packet_action {

  0%,
  55% {
    opacity: 0;
  }

  63%,
  82% {
    opacity: 1;
  }

  88%,
  100% {
    opacity: 0;
  }

}


/* validation */

@keyframes ild_managed_check_anim {

  0%,
  78% {
    opacity: 0;
    transform: scale(0.72);
  }

  87% {
    opacity: 1;
    transform: scale(1.08);
  }

  93% {
    opacity: 1;
    transform: scale(1);
  }

  97% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }

}

/** Animation page domaines **/

/* ================================
   CONTENEUR
   ================================ */

#ild_domain_anim {
  width: 100%;
}

#ild_domain_anim .ild_domain_svg {
  display: block;
  width: 100%;
  height: auto;
  overflow: visible;
}


/* ================================
   STYLE GLOBAL
   ================================ */

#ild_domain_anim .ild_domain_line,
#ild_domain_anim .ild_domain_source,
#ild_domain_anim .ild_domain_dns,
#ild_domain_anim .ild_domain_dns_ring,
#ild_domain_anim .ild_domain_dns_pulse,
#ild_domain_anim .ild_domain_dns_dot,
#ild_domain_anim .ild_domain_security,
#ild_domain_anim .ild_domain_identity,
#ild_domain_anim .ild_domain_identity_pulse,
#ild_domain_anim .ild_domain_check {
  fill: none;
  stroke: #ffffff;
  stroke-linecap: round;
  stroke-linejoin: round;
}

#ild_domain_anim .ild_domain_fill {
  fill: #ffffff;
  stroke: none;
}


/* ================================
   LIGNES
   ================================ */

#ild_domain_anim .ild_domain_line {
  stroke-width: 2.1;
  opacity: 0;

  stroke-dasharray: 10 10;

  animation:
    ild_domain_line_anim 3s linear infinite;
}

#ild_domain_anim .ild_domain_line_2 {
  animation-delay: 0.35s;
}


/* ================================
   NOM DE DOMAINE
   ================================ */

#ild_domain_anim .ild_domain_source {
  stroke-width: 2.3;

  opacity: 0;

  transform-box: fill-box;
  transform-origin: center;

  animation:
    ild_domain_source_in 3s ease infinite;
}


/* ================================
   DNS
   ================================ */

#ild_domain_anim .ild_domain_dns {
  stroke-width: 2.3;

  opacity: 0;

  transform-box: fill-box;
  transform-origin: center;

  animation:
    ild_domain_dns_in 3s ease infinite;
}

#ild_domain_anim .ild_domain_dns_ring {
  stroke-width: 1.8;

  stroke-dasharray: 7 9;

  opacity: 0;

  transform-box: fill-box;
  transform-origin: center;

  animation:
    ild_domain_dns_ring_anim 3s linear infinite;
}

#ild_domain_anim .ild_domain_dns_pulse {
  stroke-width: 2;

  opacity: 0;

  transform-box: fill-box;
  transform-origin: center;

  animation:
    ild_domain_dns_pulse_anim 3s ease-out infinite;
}


/* points DNS */

#ild_domain_anim .ild_domain_dns_dot {
  stroke-width: 2;

  opacity: 0;

  animation:
    ild_domain_dns_dot_anim 3s ease infinite;
}

#ild_domain_anim .ild_domain_dns_dot_2 {
  animation-delay: 0.08s;
}

#ild_domain_anim .ild_domain_dns_dot_3 {
  animation-delay: 0.16s;
}

#ild_domain_anim .ild_domain_dns_dot_4 {
  animation-delay: 0.24s;
}


/* ================================
   SÉCURITÉ
   ================================ */

#ild_domain_anim .ild_domain_security {
  stroke-width: 2.5;

  opacity: 0;

  transform-box: fill-box;
  transform-origin: center;

  animation:
    ild_domain_security_in 3s ease infinite;
}


/* ================================
   IDENTITÉ NUMÉRIQUE
   ================================ */

#ild_domain_anim .ild_domain_identity {
  stroke-width: 2.5;

  opacity: 0;

  transform-box: fill-box;
  transform-origin: center;

  animation:
    ild_domain_identity_in 3s ease infinite;
}

#ild_domain_anim .ild_domain_identity_pulse {
  stroke-width: 2;

  opacity: 0;

  transform-box: fill-box;
  transform-origin: center;

  animation:
    ild_domain_identity_pulse_anim 3s ease-out infinite;
}


/* ================================
   FLUX
   ================================ */

#ild_domain_anim .ild_domain_packet {
  fill: #ffffff;
  stroke: none;
  opacity: 0;
}

#ild_domain_anim .ild_domain_packet_1 {
  animation:
    ild_domain_packet_1 3s linear infinite;
}

#ild_domain_anim .ild_domain_packet_2 {
  filter: url(#ild_domain_glow);

  animation:
    ild_domain_packet_2 3s linear infinite;
}


/* ================================
   VALIDATION
   ================================ */

#ild_domain_anim .ild_domain_check {
  stroke-width: 3;

  opacity: 0;

  transform-box: fill-box;
  transform-origin: center;

  animation:
    ild_domain_check_anim 3s ease infinite;
}


/* ================================
   ANIMATIONS
   ================================ */


/* lignes */

@keyframes ild_domain_line_anim {

  0% {
    opacity: 0;
    stroke-dashoffset: 35;
  }

  12% {
    opacity: 0.15;
  }

  36% {
    opacity: 0.65;
    stroke-dashoffset: 0;
  }

  86% {
    opacity: 0.65;
  }

  100% {
    opacity: 0;
  }

}


/* domaine */

@keyframes ild_domain_source_in {

  0% {
    opacity: 0;
    transform: scale(0.78);
  }

  12% {
    opacity: 1;
    transform: scale(1);
  }

  88% {
    opacity: 1;
  }

  100% {
    opacity: 0;
    transform: scale(0.92);
  }

}


/* DNS */

@keyframes ild_domain_dns_in {

  0%,
  22% {
    opacity: 0;
    transform: scale(0.72);
  }

  38% {
    opacity: 1;
    transform: scale(1.08);
  }

  46% {
    opacity: 1;
    transform: scale(1);
  }

  90% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }

}


/* rotation réseau */

@keyframes ild_domain_dns_ring_anim {

  0%,
  25% {
    opacity: 0;
    transform: rotate(0deg);
  }

  40% {
    opacity: 0.45;
  }

  86% {
    opacity: 0.45;
    transform: rotate(90deg);
  }

  100% {
    opacity: 0;
    transform: rotate(110deg);
  }

}


/* pulsation DNS */

@keyframes ild_domain_dns_pulse_anim {

  0%,
  34% {
    opacity: 0;
    transform: scale(0.8);
  }

  46% {
    opacity: 0.6;
  }

  60% {
    opacity: 0;
    transform: scale(1.35);
  }

  100% {
    opacity: 0;
    transform: scale(1.35);
  }

}


/* points DNS */

@keyframes ild_domain_dns_dot_anim {

  0%,
  28% {
    opacity: 0;
    transform: scale(0.4);
  }

  42% {
    opacity: 1;
    transform: scale(1.25);
  }

  50% {
    opacity: 1;
    transform: scale(1);
  }

  78% {
    opacity: 1;
  }

  90%,
  100% {
    opacity: 0;
  }

}


/* protection */

@keyframes ild_domain_security_in {

  0%,
  42% {
    opacity: 0;
    transform: scale(0.65);
  }

  54% {
    opacity: 1;
    transform: scale(1.1);
  }

  62% {
    opacity: 1;
    transform: scale(1);
  }

  80% {
    opacity: 1;
  }

  90%,
  100% {
    opacity: 0;
  }

}


/* identité numérique */

@keyframes ild_domain_identity_in {

  0%,
  52% {
    opacity: 0;
    transform: scale(0.75);
  }

  66% {
    opacity: 1;
    transform: scale(1.06);
  }

  74% {
    opacity: 1;
    transform: scale(1);
  }

  94% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }

}


/* pulsation finale */

@keyframes ild_domain_identity_pulse_anim {

  0%,
  66% {
    opacity: 0;
    transform: scale(0.75);
  }

  76% {
    opacity: 0.6;
  }

  88% {
    opacity: 0;
    transform: scale(1.35);
  }

  100% {
    opacity: 0;
    transform: scale(1.35);
  }

}


/* paquet 1 */

@keyframes ild_domain_packet_1 {

  0%,
  8% {
    opacity: 0;
  }

  16%,
  36% {
    opacity: 1;
  }

  42%,
  100% {
    opacity: 0;
  }

}


/* paquet 2 */

@keyframes ild_domain_packet_2 {

  0%,
  48% {
    opacity: 0;
  }

  56%,
  78% {
    opacity: 1;
  }

  84%,
  100% {
    opacity: 0;
  }

}


/* validation finale */

@keyframes ild_domain_check_anim {

  0%,
  78% {
    opacity: 0;
    transform: scale(0.72);
  }

  87% {
    opacity: 1;
    transform: scale(1.08);
  }

  93% {
    opacity: 1;
    transform: scale(1);
  }

  97% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }

}

/** Animation PME et arisans **/

/* ================================
   CONTENEUR
   ================================ */

#ild_business_anim {
  width: 100%;
}

#ild_business_anim .ild_business_svg {
  display: block;
  width: 100%;
  height: auto;
  overflow: visible;
}


/* ================================
   STYLE GLOBAL
   ================================ */

#ild_business_anim .ild_business_line,
#ild_business_anim .ild_business_node,
#ild_business_anim .ild_business_center,
#ild_business_anim .ild_business_center_ring,
#ild_business_anim .ild_business_center_pulse,
#ild_business_anim .ild_business_result,
#ild_business_anim .ild_business_result_pulse,
#ild_business_anim .ild_business_check {
  fill: none;
  stroke: #ffffff;
  stroke-linecap: round;
  stroke-linejoin: round;
}

#ild_business_anim .ild_business_fill {
  fill: #ffffff;
  stroke: none;
}


/* ================================
   LIGNES
   ================================ */

#ild_business_anim .ild_business_line {
  stroke-width: 2.1;
  opacity: 0;

  stroke-dasharray: 10 10;

  animation:
    ild_business_line_anim 3s linear infinite;
}

#ild_business_anim .ild_business_line_2 {
  animation-delay: 0.1s;
}

#ild_business_anim .ild_business_line_3 {
  animation-delay: 0.4s;
}


/* ================================
   PME / ARTISAN
   ================================ */

#ild_business_anim .ild_business_node {
  stroke-width: 2.2;

  opacity: 0;

  transform-box: fill-box;
  transform-origin: center;

  animation:
    ild_business_node_in 3s ease infinite;
}

#ild_business_anim .ild_business_node_1 {
  animation-delay: 0s;
}

#ild_business_anim .ild_business_node_2 {
  animation-delay: 0.1s;
}


/* ================================
   NOYAU INFORMATIQUE
   ================================ */

#ild_business_anim .ild_business_center {
  stroke-width: 2.5;

  opacity: 0;

  transform-box: fill-box;
  transform-origin: center;

  animation:
    ild_business_center_in 3s ease infinite;
}

#ild_business_anim .ild_business_center_ring {
  stroke-width: 1.8;

  stroke-dasharray: 7 8;

  opacity: 0;

  transform-box: fill-box;
  transform-origin: center;

  animation:
    ild_business_ring_anim 3s linear infinite;
}

#ild_business_anim .ild_business_center_pulse {
  stroke-width: 2;

  opacity: 0;

  transform-box: fill-box;
  transform-origin: center;

  animation:
    ild_business_center_pulse_anim 3s ease-out infinite;
}


/* ================================
   RÉSULTAT
   ================================ */

#ild_business_anim .ild_business_result {
  stroke-width: 2.3;

  opacity: 0;

  transform-box: fill-box;
  transform-origin: center;

  animation:
    ild_business_result_in 3s ease infinite;
}

#ild_business_anim .ild_business_result_pulse {
  stroke-width: 2;

  opacity: 0;

  transform-box: fill-box;
  transform-origin: center;

  animation:
    ild_business_result_pulse_anim 3s ease-out infinite;
}


/* ================================
   FLUX
   ================================ */

#ild_business_anim .ild_business_packet {
  fill: #ffffff;
  stroke: none;
  opacity: 0;
}

#ild_business_anim .ild_business_packet_1 {
  animation:
    ild_business_packet_1 3s linear infinite;
}

#ild_business_anim .ild_business_packet_2 {
  animation:
    ild_business_packet_2 3s linear infinite;
}

#ild_business_anim .ild_business_packet_3 {
  filter: url(#ild_business_glow);

  animation:
    ild_business_packet_3 3s linear infinite;
}


/* ================================
   VALIDATION
   ================================ */

#ild_business_anim .ild_business_check {
  stroke-width: 3;

  opacity: 0;

  transform-box: fill-box;
  transform-origin: center;

  animation:
    ild_business_check_anim 3s ease infinite;
}


/* ================================
   ANIMATIONS
   ================================ */

@keyframes ild_business_line_anim {

  0% {
    opacity: 0;
    stroke-dashoffset: 35;
  }

  10% {
    opacity: 0.15;
  }

  34% {
    opacity: 0.65;
    stroke-dashoffset: 0;
  }

  86% {
    opacity: 0.65;
  }

  100% {
    opacity: 0;
  }

}


/* profils professionnels */

@keyframes ild_business_node_in {

  0% {
    opacity: 0;
    transform: scale(0.78);
  }

  12% {
    opacity: 1;
    transform: scale(1);
  }

  88% {
    opacity: 1;
  }

  100% {
    opacity: 0;
    transform: scale(0.92);
  }

}


/* informatique centrale */

@keyframes ild_business_center_in {

  0%,
  22% {
    opacity: 0;
    transform: scale(0.72);
  }

  38% {
    opacity: 1;
    transform: scale(1.08);
  }

  46% {
    opacity: 1;
    transform: scale(1);
  }

  90% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }

}


/* anneau */

@keyframes ild_business_ring_anim {

  0%,
  26% {
    opacity: 0;
    transform: rotate(0deg);
  }

  40% {
    opacity: 0.45;
  }

  86% {
    opacity: 0.45;
    transform: rotate(90deg);
  }

  100% {
    opacity: 0;
    transform: rotate(110deg);
  }

}


/* pulsation centrale */

@keyframes ild_business_center_pulse_anim {

  0%,
  34% {
    opacity: 0;
    transform: scale(0.8);
  }

  46% {
    opacity: 0.6;
  }

  60% {
    opacity: 0;
    transform: scale(1.35);
  }

  100% {
    opacity: 0;
    transform: scale(1.35);
  }

}


/* outils professionnels */

@keyframes ild_business_result_in {

  0%,
  52% {
    opacity: 0;
    transform: scale(0.75);
  }

  66% {
    opacity: 1;
    transform: scale(1.06);
  }

  74% {
    opacity: 1;
    transform: scale(1);
  }

  94% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }

}


/* pulsation résultat */

@keyframes ild_business_result_pulse_anim {

  0%,
  66% {
    opacity: 0;
    transform: scale(0.75);
  }

  76% {
    opacity: 0.6;
  }

  88% {
    opacity: 0;
    transform: scale(1.35);
  }

  100% {
    opacity: 0;
    transform: scale(1.35);
  }

}


/* flux PME */

@keyframes ild_business_packet_1 {

  0%,
  8% {
    opacity: 0;
  }

  16%,
  34% {
    opacity: 1;
  }

  40%,
  100% {
    opacity: 0;
  }

}


/* flux artisan */

@keyframes ild_business_packet_2 {

  0%,
  18% {
    opacity: 0;
  }

  26%,
  44% {
    opacity: 1;
  }

  50%,
  100% {
    opacity: 0;
  }

}


/* flux informatique */

@keyframes ild_business_packet_3 {

  0%,
  52% {
    opacity: 0;
  }

  60%,
  80% {
    opacity: 1;
  }

  86%,
  100% {
    opacity: 0;
  }

}


/* validation */

@keyframes ild_business_check_anim {

  0%,
  78% {
    opacity: 0;
    transform: scale(0.72);
  }

  87% {
    opacity: 1;
    transform: scale(1.08);
  }

  93% {
    opacity: 1;
    transform: scale(1);
  }

  97% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }

}

/** Animation collectivités **/

/* ================================
   CONTENEUR
   ================================ */

#ild_public_anim {
  width: 100%;
}

#ild_public_anim .ild_public_svg {
  display: block;
  width: 100%;
  height: auto;
  overflow: visible;
}


/* ================================
   STYLE GLOBAL
   ================================ */

#ild_public_anim .ild_public_line,
#ild_public_anim .ild_public_node,
#ild_public_anim .ild_public_center,
#ild_public_anim .ild_public_center_ring,
#ild_public_anim .ild_public_center_pulse,
#ild_public_anim .ild_public_result,
#ild_public_anim .ild_public_result_pulse,
#ild_public_anim .ild_public_check {
  fill: none;
  stroke: #ffffff;
  stroke-linecap: round;
  stroke-linejoin: round;
}

#ild_public_anim .ild_public_fill {
  fill: #ffffff;
  stroke: none;
}


/* ================================
   LIGNES
   ================================ */

#ild_public_anim .ild_public_line {
  stroke-width: 2.1;
  opacity: 0;
  stroke-dasharray: 10 10;
  animation: ild_public_line_anim 3s linear infinite;
}

#ild_public_anim .ild_public_line_2 {
  animation-delay: 0.08s;
}

#ild_public_anim .ild_public_line_3 {
  animation-delay: 0.16s;
}

#ild_public_anim .ild_public_line_4 {
  animation-delay: 0.4s;
}


/* ================================
   BÂTIMENTS
   ================================ */

#ild_public_anim .ild_public_node {
  stroke-width: 2.2;
  opacity: 0;

  transform-box: fill-box;
  transform-origin: center;

  animation:
    ild_public_node_in 3s ease infinite;
}

#ild_public_anim .ild_public_node_2 {
  animation-delay: 0.08s;
}

#ild_public_anim .ild_public_node_3 {
  animation-delay: 0.16s;
}


/* ================================
   INFORMATIQUE CENTRALE
   ================================ */

#ild_public_anim .ild_public_center {
  stroke-width: 2.5;
  opacity: 0;

  transform-box: fill-box;
  transform-origin: center;

  animation:
    ild_public_center_in 3s ease infinite;
}

#ild_public_anim .ild_public_center_ring {
  stroke-width: 1.8;
  stroke-dasharray: 7 8;
  opacity: 0;

  transform-box: fill-box;
  transform-origin: center;

  animation:
    ild_public_ring_anim 3s linear infinite;
}

#ild_public_anim .ild_public_center_pulse {
  stroke-width: 2;
  opacity: 0;

  transform-box: fill-box;
  transform-origin: center;

  animation:
    ild_public_center_pulse_anim 3s ease-out infinite;
}


/* ================================
   RÉSULTAT
   ================================ */

#ild_public_anim .ild_public_result {
  stroke-width: 2.3;
  opacity: 0;

  transform-box: fill-box;
  transform-origin: center;

  animation:
    ild_public_result_in 3s ease infinite;
}

#ild_public_anim .ild_public_result_pulse {
  stroke-width: 2;
  opacity: 0;

  transform-box: fill-box;
  transform-origin: center;

  animation:
    ild_public_result_pulse_anim 3s ease-out infinite;
}


/* ================================
   FLUX
   ================================ */

#ild_public_anim .ild_public_packet {
  fill: #ffffff;
  stroke: none;
  opacity: 0;
}

#ild_public_anim .ild_public_packet_1 {
  animation:
    ild_public_packet_1 3s linear infinite;
}

#ild_public_anim .ild_public_packet_2 {
  animation:
    ild_public_packet_2 3s linear infinite;
}

#ild_public_anim .ild_public_packet_3 {
  animation:
    ild_public_packet_3 3s linear infinite;
}

#ild_public_anim .ild_public_packet_4 {
  filter: url(#ild_public_glow);

  animation:
    ild_public_packet_4 3s linear infinite;
}


/* ================================
   VALIDATION
   ================================ */

#ild_public_anim .ild_public_check {
  stroke-width: 3;
  opacity: 0;

  transform-box: fill-box;
  transform-origin: center;

  animation:
    ild_public_check_anim 3s ease infinite;
}


/* ================================
   ANIMATIONS
   ================================ */

@keyframes ild_public_line_anim {

  0% {
    opacity: 0;
    stroke-dashoffset: 35;
  }

  10% {
    opacity: 0.15;
  }

  34% {
    opacity: 0.65;
    stroke-dashoffset: 0;
  }

  86% {
    opacity: 0.65;
  }

  100% {
    opacity: 0;
  }

}


@keyframes ild_public_node_in {

  0% {
    opacity: 0;
    transform: scale(0.78);
  }

  12% {
    opacity: 1;
    transform: scale(1);
  }

  88% {
    opacity: 1;
  }

  100% {
    opacity: 0;
    transform: scale(0.92);
  }

}


@keyframes ild_public_center_in {

  0%,
  22% {
    opacity: 0;
    transform: scale(0.72);
  }

  38% {
    opacity: 1;
    transform: scale(1.08);
  }

  46% {
    opacity: 1;
    transform: scale(1);
  }

  90% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }

}


@keyframes ild_public_ring_anim {

  0%,
  26% {
    opacity: 0;
    transform: rotate(0deg);
  }

  40% {
    opacity: 0.45;
  }

  86% {
    opacity: 0.45;
    transform: rotate(90deg);
  }

  100% {
    opacity: 0;
    transform: rotate(110deg);
  }

}


@keyframes ild_public_center_pulse_anim {

  0%,
  34% {
    opacity: 0;
    transform: scale(0.8);
  }

  46% {
    opacity: 0.6;
  }

  60% {
    opacity: 0;
    transform: scale(1.35);
  }

  100% {
    opacity: 0;
    transform: scale(1.35);
  }

}


@keyframes ild_public_result_in {

  0%,
  52% {
    opacity: 0;
    transform: scale(0.75);
  }

  66% {
    opacity: 1;
    transform: scale(1.06);
  }

  74% {
    opacity: 1;
    transform: scale(1);
  }

  94% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }

}


@keyframes ild_public_result_pulse_anim {

  0%,
  66% {
    opacity: 0;
    transform: scale(0.75);
  }

  76% {
    opacity: 0.6;
  }

  88% {
    opacity: 0;
    transform: scale(1.35);
  }

  100% {
    opacity: 0;
    transform: scale(1.35);
  }

}


@keyframes ild_public_packet_1 {

  0%,
  6% {
    opacity: 0;
  }

  14%,
  32% {
    opacity: 1;
  }

  38%,
  100% {
    opacity: 0;
  }

}


@keyframes ild_public_packet_2 {

  0%,
  14% {
    opacity: 0;
  }

  22%,
  40% {
    opacity: 1;
  }

  46%,
  100% {
    opacity: 0;
  }

}


@keyframes ild_public_packet_3 {

  0%,
  22% {
    opacity: 0;
  }

  30%,
  48% {
    opacity: 1;
  }

  54%,
  100% {
    opacity: 0;
  }

}


@keyframes ild_public_packet_4 {

  0%,
  52% {
    opacity: 0;
  }

  60%,
  80% {
    opacity: 1;
  }

  86%,
  100% {
    opacity: 0;
  }

}


@keyframes ild_public_check_anim {

  0%,
  78% {
    opacity: 0;
    transform: scale(0.72);
  }

  87% {
    opacity: 1;
    transform: scale(1.08);
  }

  93% {
    opacity: 1;
    transform: scale(1);
  }

  97% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }

}

/** Animation contact **/

/* ================================
   CONTENEUR
   ================================ */

#ild_cover_anim {
  width: 100%;
}

#ild_cover_anim .ild_cover_svg {
  display: block;
  width: 100%;
  height: auto;
  overflow: visible;
}


/* ================================
   STYLE GLOBAL
   ================================ */

#ild_cover_anim .ild_cover_range_ring,
#ild_cover_anim .ild_cover_range_pulse,
#ild_cover_anim .ild_cover_link,
#ild_cover_anim .ild_cover_center,
#ild_cover_anim .ild_cover_center_pulse,
#ild_cover_anim .ild_cover_ping,
#ild_cover_anim .ild_cover_point {
  fill: none;
  stroke: #ffffff;
  stroke-linecap: round;
  stroke-linejoin: round;
}

#ild_cover_anim .ild_cover_fill {
  fill: #ffffff;
  stroke: none;
}


/* ================================
   LABELS
   ================================ */

#ild_cover_anim .ild_cover_label {
  fill: #ffffff;
  opacity: 0;

  font-size: 26px;
  font-family: Arial, sans-serif;
  letter-spacing: 0.4px;

  animation:
    ild_cover_label_in 3s ease infinite;
}

#ild_cover_anim .ild_cover_label_2 {
  animation-delay: 0.1s;
}

#ild_cover_anim .ild_cover_label_3 {
  animation-delay: 0.2s;
}


/* ================================
   ANNEAU GLOBAL
   ================================ */

#ild_cover_anim .ild_cover_range_ring {
  stroke-width: 1.8;
  stroke-dasharray: 8 10;
  opacity: 0;

  transform-origin: center;
  transform-box: fill-box;

  animation:
    ild_cover_ring_anim 3s linear infinite;
}

#ild_cover_anim .ild_cover_range_pulse {
  stroke-width: 2;
  opacity: 0;

  transform-origin: center;
  transform-box: fill-box;

  animation:
    ild_cover_range_pulse_anim 3s ease-out infinite;
}


/* ================================
   LIAISONS
   ================================ */

#ild_cover_anim .ild_cover_link {
  stroke-width: 2.2;
  opacity: 0;

  stroke-dasharray: 170;
  stroke-dashoffset: 170;

  animation:
    ild_cover_link_anim 3s ease-in-out infinite;
}

#ild_cover_anim .ild_cover_link_2 {
  animation-delay: 0.12s;
}

#ild_cover_anim .ild_cover_link_3 {
  animation-delay: 0.24s;
}


/* ================================
   CENTRE INFORMATIQUE
   ================================ */

#ild_cover_anim .ild_cover_center {
  stroke-width: 2.4;
  opacity: 0;

  transform-origin: center;
  transform-box: fill-box;

  animation:
    ild_cover_center_in 3s ease infinite;
}

#ild_cover_anim .ild_cover_center_pulse {
  stroke-width: 2;
  opacity: 0;

  transform-origin: center;
  transform-box: fill-box;

  animation:
    ild_cover_center_pulse_anim 3s ease-out infinite;
}


/* ================================
   POINTS DES DÉPARTEMENTS
   ================================ */

#ild_cover_anim .ild_cover_point {
  fill: #ffffff;
  stroke: none;
  opacity: 0;

  animation:
    ild_cover_point_in 3s ease infinite;
}

#ild_cover_anim .ild_cover_point_2 {
  animation-delay: 0.12s;
}

#ild_cover_anim .ild_cover_point_3 {
  animation-delay: 0.24s;
}


/* ================================
   PULSATIONS DÉPARTEMENTS
   ================================ */

#ild_cover_anim .ild_cover_ping {
  stroke-width: 2;
  opacity: 0;

  transform-origin: center;
  transform-box: fill-box;

  animation:
    ild_cover_ping_anim 3s ease-out infinite;
}

#ild_cover_anim .ild_cover_ping_2 {
  animation-delay: 0.12s;
}

#ild_cover_anim .ild_cover_ping_3 {
  animation-delay: 0.24s;
}


/* ================================
   FLUX
   ================================ */

#ild_cover_anim .ild_cover_packet {
  fill: #ffffff;
  stroke: none;
  opacity: 0;

  filter: url(#ild_cover_glow);
}

#ild_cover_anim .ild_cover_packet_1 {
  animation:
    ild_cover_packet_1 3s linear infinite;
}

#ild_cover_anim .ild_cover_packet_2 {
  animation:
    ild_cover_packet_2 3s linear infinite;
}

#ild_cover_anim .ild_cover_packet_3 {
  animation:
    ild_cover_packet_3 3s linear infinite;
}


/* ================================
   ANIMATION CENTRE
   ================================ */

@keyframes ild_cover_center_in {

  0% {
    opacity: 0;
    transform: scale(0.78);
  }

  12% {
    opacity: 1;
    transform: scale(1);
  }

  88% {
    opacity: 1;
  }

  100% {
    opacity: 0;
    transform: scale(0.94);
  }

}


/* pulsation centrale */

@keyframes ild_cover_center_pulse_anim {

  0%,
  18% {
    opacity: 0;
    transform: scale(0.7);
  }

  30% {
    opacity: 0.65;
  }

  48% {
    opacity: 0;
    transform: scale(1.45);
  }

  100% {
    opacity: 0;
    transform: scale(1.45);
  }

}


/* ================================
   ANIMATION DES LIAISONS
   ================================ */

@keyframes ild_cover_link_anim {

  0% {
    opacity: 0;
    stroke-dashoffset: 170;
  }

  18% {
    opacity: 0.18;
  }

  38% {
    opacity: 0.78;
    stroke-dashoffset: 0;
  }

  86% {
    opacity: 0.78;
  }

  100% {
    opacity: 0;
    stroke-dashoffset: 0;
  }

}


/* ================================
   POINTS
   ================================ */

@keyframes ild_cover_point_in {

  0%,
  22% {
    opacity: 0;
    transform: scale(0.5);
  }

  34% {
    opacity: 1;
    transform: scale(1.25);
  }

  42% {
    opacity: 1;
    transform: scale(1);
  }

  88% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }

}


/* ================================
   PING DÉPARTEMENTS
   ================================ */

@keyframes ild_cover_ping_anim {

  0%,
  32% {
    opacity: 0;
    transform: scale(0.72);
  }

  44% {
    opacity: 0.6;
  }

  60% {
    opacity: 0;
    transform: scale(1.45);
  }

  100% {
    opacity: 0;
    transform: scale(1.45);
  }

}


/* ================================
   LABELS
   ================================ */

@keyframes ild_cover_label_in {

  0%,
  26% {
    opacity: 0;
  }

  40% {
    opacity: 1;
  }

  88% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }

}


/* ================================
   ANNEAU EXTÉRIEUR
   ================================ */

@keyframes ild_cover_ring_anim {

  0%,
  28% {
    opacity: 0;
    transform: rotate(0deg);
  }

  42% {
    opacity: 0.4;
  }

  88% {
    opacity: 0.4;
    transform: rotate(90deg);
  }

  100% {
    opacity: 0;
    transform: rotate(110deg);
  }

}


/* ================================
   ONDE DE COUVERTURE
   ================================ */

@keyframes ild_cover_range_pulse_anim {

  0%,
  40% {
    opacity: 0;
    transform: scale(0.75);
  }

  54% {
    opacity: 0.5;
  }

  72% {
    opacity: 0;
    transform: scale(1.25);
  }

  100% {
    opacity: 0;
    transform: scale(1.25);
  }

}


/* ================================
   FLUX LOZÈRE
   ================================ */

@keyframes ild_cover_packet_1 {

  0%,
  12% {
    opacity: 0;
  }

  20%,
  34% {
    opacity: 1;
  }

  40%,
  100% {
    opacity: 0;
  }

}


/* ================================
   FLUX HÉRAULT
   ================================ */

@keyframes ild_cover_packet_2 {

  0%,
  22% {
    opacity: 0;
  }

  30%,
  46% {
    opacity: 1;
  }

  52%,
  100% {
    opacity: 0;
  }

}


/* ================================
   FLUX GARD
   ================================ */

@keyframes ild_cover_packet_3 {

  0%,
  32% {
    opacity: 0;
  }

  40%,
  56% {
    opacity: 1;
  }

  62%,
  100% {
    opacity: 0;
  }

}