diff --git a/lib/core/directives/tooltip-card/tooltip-card.component.ts b/lib/core/directives/tooltip-card/tooltip-card.component.ts
index 225780094d..9112b019ff 100644
--- a/lib/core/directives/tooltip-card/tooltip-card.component.ts
+++ b/lib/core/directives/tooltip-card/tooltip-card.component.ts
@@ -26,10 +26,10 @@ import { DomSanitizer } from '@angular/platform-browser';
         trigger('tooltip', [
             transition(':enter', [
                 style({ opacity: 0 }),
-                animate(500, style({ opacity: 1 }))
+                animate(200, style({ opacity: 1 }))
             ]),
             transition(':leave', [
-                animate(500, style({ opacity: 0 }))
+                animate(200, style({ opacity: 0 }))
 
             ])
         ])
diff --git a/lib/core/directives/tooltip-card/tooltip-card.directive.spec.ts b/lib/core/directives/tooltip-card/tooltip-card.directive.spec.ts
index e1001b456b..522dab7e59 100644
--- a/lib/core/directives/tooltip-card/tooltip-card.directive.spec.ts
+++ b/lib/core/directives/tooltip-card/tooltip-card.directive.spec.ts
@@ -91,7 +91,7 @@ describe('TooltipCardDirective', () => {
         let tooltipCard = overlay.querySelector<HTMLElement>('div.adf-tooltip-card');
         expect(tooltipCard).not.toBeNull();
 
-        span.triggerEventHandler('mouseout', {});
+        span.triggerEventHandler('mouseleave', {});
         fixture.detectChanges();
         tooltipCard = overlay.querySelector<HTMLElement>('div.adf-tooltip-card');
         expect(tooltipCard).toBeNull();
diff --git a/lib/core/directives/tooltip-card/tooltip-card.directive.ts b/lib/core/directives/tooltip-card/tooltip-card.directive.ts
index 884d7e414a..4e9ead4f5a 100644
--- a/lib/core/directives/tooltip-card/tooltip-card.directive.ts
+++ b/lib/core/directives/tooltip-card/tooltip-card.directive.ts
@@ -70,7 +70,7 @@ export class TooltipCardDirective implements OnInit, OnDestroy {
         tooltipRef.instance.htmlContent = this.htmlContent;
     }
 
-    @HostListener('mouseout')
+    @HostListener('mouseleave')
     hide() {
         this.overlayRef.detach();
     }