diff --git a/pages/widgets.html b/pages/widgets.html
index 5e12b305a..ac594da17 100644
--- a/pages/widgets.html
+++ b/pages/widgets.html
@@ -1829,7 +1829,7 @@
         <div class="row">
           <div class="col-md-3">
             <!-- DIRECT CHAT PRIMARY -->
-            <div class="card card-prirary cardutline direct-chat direct-chat-primary">
+            <div class="card card-primary card-outline direct-chat direct-chat-primary">
               <div class="card-header">
                 <h3 class="card-title">Direct Chat</h3>
 
@@ -1926,7 +1926,7 @@
 
           <div class="col-md-3">
             <!-- DIRECT CHAT SUCCESS -->
-            <div class="card card-sucress cardutline direct-chat direct-chat-success">
+            <div class="card card-success card-outline direct-chat direct-chat-success">
               <div class="card-header">
                 <h3 class="card-title">Direct Chat</h3>
 
@@ -2222,7 +2222,7 @@
         <div class="row">
           <div class="col-md-3">
             <!-- DIRECT CHAT PRIMARY -->
-            <div class="card card-prirary cardutline direct-chat direct-chat-primary shadow-none">
+            <div class="card card-primary card-outline direct-chat direct-chat-primary shadow-none">
               <div class="card-header">
                 <h3 class="card-title">Shadow - None</h3>
 
@@ -2319,7 +2319,7 @@
 
           <div class="col-md-3">
             <!-- DIRECT CHAT SUCCESS -->
-            <div class="card card-sucress cardutline direct-chat direct-chat-success shadow-sm">
+            <div class="card card-success card-outline direct-chat direct-chat-success shadow-sm">
               <div class="card-header">
                 <h3 class="card-title">Shadow - Small</h3>