diff --git a/public/index.html b/public/index.html
index 76d9481..55046db 100644
--- a/public/index.html
+++ b/public/index.html
@@ -12,6 +12,8 @@
   <!--  Fonts and icons     -->
   <link href="https://fonts.googleapis.com/css?family=Poppins:200,300,400,600,700,800" rel="stylesheet" />
   <link href="https://use.fontawesome.com/releases/v5.0.6/css/all.css" rel="stylesheet">
+  <link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-rtl/3.4.0/css/bootstrap-rtl.css" rel="stylesheet" />
+
 </head>
 <body>
 <div class="wrapper" id="app">
diff --git a/src/components/Cards/Card.vue b/src/components/Cards/Card.vue
index 39c8d17..bdb7c3f 100644
--- a/src/components/Cards/Card.vue
+++ b/src/components/Cards/Card.vue
@@ -3,7 +3,7 @@
     <div class="card-image" v-if="$slots.image">
       <slot name="image"></slot>
     </div>
-    <div class="card-header" :class="{'text-right': isRTL}" v-if="$slots.header || title">
+    <div class="card-header" v-if="$slots.header || title">
       <slot name="header">
         <h4 class="card-title">{{title}}</h4>
         <p class="card-category" v-if="subTitle">{{subTitle}}</p>
@@ -24,12 +24,8 @@ export default {
   props: {
     title: String,
     subTitle: String,
-    type: String
-  },
-  computed: {
-    isRTL() {
-      return this.$rtl.isRTL;
-    }
+    type: String,
+    cardHeaderClasses: [String, Object]
   }
 };
 </script>
diff --git a/src/components/NotificationPlugin/Notification.vue b/src/components/NotificationPlugin/Notification.vue
index edd6e4f..674f4b8 100644
--- a/src/components/NotificationPlugin/Notification.vue
+++ b/src/components/NotificationPlugin/Notification.vue
@@ -17,11 +17,11 @@
     </button>
 
     <span v-if="icon" data-notify="icon" :class="['alert-icon', icon]"></span>
-    <span data-notify="message">
-      <span v-if="title" class="title"><b>{{title}}<br/></b></span>
-      <span v-if="message" v-html="message"></span>
+    <div data-notify="message">
+      <div v-if="title" class="title"><b>{{title}}<br/></b></div>
+      <div v-if="message" v-html="message"></div>
       <content-render v-if="!message && component" :component="component"></content-render>
-    </span>
+    </div>
   </div>
 </template>
 <script>
diff --git a/src/layout/dashboard/TopNavbar.vue b/src/layout/dashboard/TopNavbar.vue
index 4a44d4a..d59194a 100644
--- a/src/layout/dashboard/TopNavbar.vue
+++ b/src/layout/dashboard/TopNavbar.vue
@@ -24,7 +24,7 @@
       </button>
 
       <div class="collapse navbar-collapse">
-        <ul class="navbar-nav ml-auto ">
+        <ul class="navbar-nav" :class="$rtl.isRTL ? 'mr-auto' : 'ml-auto'">
           <div class="search-bar input-group">
             <!-- <input type="text" class="form-control" placeholder="Search...">
             <div class="input-group-addon"><i class="tim-icons icon-zoom-split"></i></div> -->
diff --git a/src/pages/Notifications.vue b/src/pages/Notifications.vue
index db10a54..9282c8a 100644
--- a/src/pages/Notifications.vue
+++ b/src/pages/Notifications.vue
@@ -109,7 +109,8 @@
           icon: "tim-icons icon-bell-55",
           horizontalAlign: horizontalAlign,
           verticalAlign: verticalAlign,
-          type: this.type[color]
+          type: this.type[color],
+          timeout: 0
         });
       }
     }
diff --git a/src/pages/Notifications/NotificationTemplate.vue b/src/pages/Notifications/NotificationTemplate.vue
index d992df2..b5a1bbf 100644
--- a/src/pages/Notifications/NotificationTemplate.vue
+++ b/src/pages/Notifications/NotificationTemplate.vue
@@ -1,5 +1,5 @@
 <template>
-  <span>Welcome to <b>Black Dashboard</b> - a beautiful freebie for every web developer.</span>
+  <div>Welcome to <b>Black Dashboard</b> - a beautiful freebie for every web developer.</div>
 </template>
 
 <script>
diff --git a/src/pages/RTLSupport.vue b/src/pages/RTLSupport.vue
index 09514f2..291c5cf 100644
--- a/src/pages/RTLSupport.vue
+++ b/src/pages/RTLSupport.vue
@@ -1,16 +1,17 @@
 <template>
   <div>
+
     <div class="row">
       <div class="col-12">
-        <card type="chart">
+        <card type="chart" card-header-classes="text-left">
           <template slot="header">
             <div class="row">
-              <div class="col-sm-6 text-left">
+              <div class="col-sm-6 text-right">
                 <h5 class="card-category">Total Shipments</h5>
                 <h2 class="card-title">Performance</h2>
               </div>
               <div class="col-sm-6">
-                <div class="btn-group btn-group-toggle float-right" data-toggle="buttons">
+                <div class="btn-group btn-group-toggle" data-toggle="buttons">
                   <label v-for="(option, index) in bigLineChart.categories"
                          :key="option"
                          class="btn btn-sm btn-primary btn-simple"
@@ -39,10 +40,10 @@
     </div>
     <div class="row">
       <div class="col-lg-4">
-        <card type="chart">
+        <card type="chart" class="text-right">
           <template slot="header">
             <h5 class="card-category">Total Shipments</h5>
-            <h3 class="card-title"><i class="tim-icons icon-bell-55 text-primary "></i> 763,215</h3>
+            <h3 class="card-title"><i class="tim-icons icon-bell-55 text-primary"></i> 763,215</h3>
           </template>
           <div class="chart-area">
             <line-chart style="height: 100%"
@@ -55,7 +56,7 @@
         </card>
       </div>
       <div class="col-lg-4">
-        <card type="chart">
+        <card type="chart" class="text-right">
           <template slot="header">
             <h5 class="card-category">Daily Sales</h5>
             <h3 class="card-title"><i class="tim-icons icon-delivery-fast text-info "></i> 3,500€</h3>
@@ -71,7 +72,7 @@
         </card>
       </div>
       <div class="col-lg-4">
-        <card type="chart">
+        <card type="chart" class="text-right">
           <template slot="header">
             <h5 class="card-category">Completed Tasks</h5>
             <h3 class="card-title"><i class="tim-icons icon-send text-success "></i> 12,100K</h3>
@@ -89,11 +90,11 @@
     </div>
     <div class="row">
       <div class="col-lg-6 col-md-12">
-        <card type="tasks">
+        <card type="tasks" class="text-right">
           <template slot="header">
             <h6 class="title d-inline">Tasks(5)</h6>
             <p class="card-category d-inline">today</p>
-            <div class="dropdown">
+            <div class="dropdown float-left">
               <button type="button" class="btn btn-link dropdown-toggle btn-icon" data-toggle="dropdown">
                 <i class="tim-icons icon-settings-gear-63"></i>
               </button>
@@ -110,16 +111,12 @@
         </card>
       </div>
       <div class="col-lg-6 col-md-12">
-        <div class="card ">
-          <div class="card-header">
-            <h4 class="card-title"> Simple Table</h4>
+        <card class="text-right">
+          <h4 slot="header" class="card-title"> Simple Table</h4>
+          <div class="table-responsive">
+            <user-table></user-table>
           </div>
-          <div class="card-body">
-            <div class="table-responsive">
-              <user-table></user-table>
-            </div>
-          </div>
-        </div>
+        </card>
       </div>
     </div>
   </div>
@@ -247,6 +244,9 @@
     mounted() {
       this.$rtl.enableRTL();
       this.initBigChart(0);
+    },
+    beforeDestroy() {
+      this.$rtl.disableRTL();
     }
   };
 </script>
diff --git a/src/plugins/RTLPlugin.js b/src/plugins/RTLPlugin.js
index 600ab65..c5c958e 100644
--- a/src/plugins/RTLPlugin.js
+++ b/src/plugins/RTLPlugin.js
@@ -17,8 +17,8 @@ export default {
         },
         disableRTL() {
           this.isRTL = false;
-          this.getDocClasses().add('rtl');
-          this.getDocClasses().add('menu-on-right');
+          this.getDocClasses().remove('rtl');
+          this.getDocClasses().remove('menu-on-right');
         }
       }
     });
diff --git a/yarn.lock b/yarn.lock
index 4e3044f..76ac636 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1393,6 +1393,16 @@ boom@5.x.x:
   dependencies:
     hoek "4.x.x"
 
+bootstrap-rtl@^3.3.4:
+  version "3.3.4"
+  resolved "https://registry.yarnpkg.com/bootstrap-rtl/-/bootstrap-rtl-3.3.4.tgz#4f813e6fce91aa9f47ad47f48172355af61c1b11"
+  dependencies:
+    bootstrap "^3.3.4"
+
+bootstrap@^3.3.4:
+  version "3.3.7"
+  resolved "https://registry.yarnpkg.com/bootstrap/-/bootstrap-3.3.7.tgz#5a389394549f23330875a3b150656574f8a9eb71"
+
 bootstrap@^4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/bootstrap/-/bootstrap-4.0.0.tgz#ceb03842c145fcc1b9b4e15da2a05656ba68469a"
