diff --git a/frontend/src/app/bisq/bisq-address/bisq-address.component.html b/frontend/src/app/bisq/bisq-address/bisq-address.component.html
index f0033dce0..e741452fb 100644
--- a/frontend/src/app/bisq/bisq-address/bisq-address.component.html
+++ b/frontend/src/app/bisq/bisq-address/bisq-address.component.html
@@ -59,7 +59,7 @@
           <span style="float: left;" class="d-none d-md-block">{{ tx.id }}</span>
         </a>
         <div class="float-right">
-          {{ tx.time | date:'yyyy-MM-dd HH:mm' }}
+          &lrm;{{ tx.time | date:'yyyy-MM-dd HH:mm' }}
         </div>
         <div class="clearfix"></div>
       </div>
diff --git a/frontend/src/app/bisq/bisq-block/bisq-block.component.html b/frontend/src/app/bisq/bisq-block/bisq-block.component.html
index 9a78d47af..e22df257d 100644
--- a/frontend/src/app/bisq/bisq-block/bisq-block.component.html
+++ b/frontend/src/app/bisq/bisq-block/bisq-block.component.html
@@ -20,7 +20,7 @@
               <tr>
                 <td i18n="transaction.timestamp|Transaction Timestamp">Timestamp</td>
                 <td>
-                  {{ block.time | date:'yyyy-MM-dd HH:mm' }}
+                  &lrm;{{ block.time | date:'yyyy-MM-dd HH:mm' }}
                   <div class="lg-inline">
                     <i class="symbol">(<app-time-since [time]="block.time / 1000" [fastRender]="true"></app-time-since>)</i>
                   </div>
@@ -58,7 +58,7 @@
           <span style="float: left;" class="d-none d-md-block">{{ tx.id }}</span>
         </a>
         <div class="float-right">
-          {{ tx.time | date:'yyyy-MM-dd HH:mm' }}
+          &lrm;{{ tx.time | date:'yyyy-MM-dd HH:mm' }}
         </div>
         <div class="clearfix"></div>
       </div>
diff --git a/frontend/src/app/bisq/bisq-trades/bisq-trades.component.html b/frontend/src/app/bisq/bisq-trades/bisq-trades.component.html
index 4ffffddc8..d64fc1ac5 100644
--- a/frontend/src/app/bisq/bisq-trades/bisq-trades.component.html
+++ b/frontend/src/app/bisq/bisq-trades/bisq-trades.component.html
@@ -12,7 +12,7 @@
     <tbody *ngIf="(trades$ | async) as trades; else loadingTmpl">
       <tr *ngFor="let trade of trades;">
         <td>
-          {{ trade.trade_date | date:'yyyy-MM-dd HH:mm' }}
+          &lrm;{{ trade.trade_date | date:'yyyy-MM-dd HH:mm' }}
         </td>
         <td *ngIf="view === 'all'">
           <ng-container *ngIf="(trade._market || market).rtype === 'fiat'; else priceCrypto"><span class="green-color">{{ trade.price | currency: (trade._market || market).rsymbol }}</span></ng-container>
diff --git a/frontend/src/app/bisq/bisq-transaction/bisq-transaction.component.html b/frontend/src/app/bisq/bisq-transaction/bisq-transaction.component.html
index 064a2ef9f..0386b1106 100644
--- a/frontend/src/app/bisq/bisq-transaction/bisq-transaction.component.html
+++ b/frontend/src/app/bisq/bisq-transaction/bisq-transaction.component.html
@@ -32,7 +32,7 @@
                 <tr>
                   <td i18n="transaction.timestamp|Transaction Timestamp">Timestamp</td>
                   <td>
-                    {{ bisqTx.time | date:'yyyy-MM-dd HH:mm' }}
+                    &lrm;{{ bisqTx.time | date:'yyyy-MM-dd HH:mm' }}
                     <div class="lg-inline">
                       <i class="symbol">(<app-time-since [time]="bisqTx.time / 1000" [fastRender]="true"></app-time-since>)</i>
                     </div>
diff --git a/frontend/src/app/components/api-docs/api-docs.component.html b/frontend/src/app/components/api-docs/api-docs.component.html
index 70e80bfc7..441ce1838 100644
--- a/frontend/src/app/components/api-docs/api-docs.component.html
+++ b/frontend/src/app/components/api-docs/api-docs.component.html
@@ -1,5 +1,5 @@
 <ng-container *ngIf="{ val: network$ | async } as network">
-  <div class="container-xl">
+  <div class="container-xl text-left">
     <div class="text-center">
       <h2>{{ network.val === '' ? 'Bitcoin' : network.val.charAt(0).toUpperCase() + network.val.slice(1) }} <ng-container i18n="api-docs.title">API Service</ng-container></h2>
     </div>
diff --git a/frontend/src/app/components/block/block.component.html b/frontend/src/app/components/block/block.component.html
index 0c391f9e2..1ef8c6709 100644
--- a/frontend/src/app/components/block/block.component.html
+++ b/frontend/src/app/components/block/block.component.html
@@ -53,7 +53,7 @@
               <tr>
                 <td i18n="block.timestamp">Timestamp</td>
                 <td>
-                  {{ block.timestamp * 1000 | date:'yyyy-MM-dd HH:mm' }}
+                  &lrm;{{ block.timestamp * 1000 | date:'yyyy-MM-dd HH:mm' }}
                   <div class="lg-inline">
                     <i class="symbol">(<app-time-since [time]="block.timestamp" [fastRender]="true"></app-time-since>)</i>
                   </div>
@@ -61,11 +61,11 @@
               </tr>
               <tr>
                 <td i18n="block.size">Size</td>
-                <td [innerHTML]="block.size | bytes: 2"></td>
+                <td [innerHTML]="'&lrm;' + (block.size | bytes: 2)"></td>
               </tr>
               <tr>
                 <td i18n="block.weight">Weight</td>
-                <td [innerHTML]="block.weight | wuBytes: 2"></td>
+                <td [innerHTML]="'&lrm;' + (block.weight | wuBytes: 2)"></td>
               </tr>
             </tbody>
           </table>
@@ -162,13 +162,13 @@
     </div>
 
     <div #blockTxTitle id="block-tx-title" class="block-tx-title">
-      <h2>
+      <h2 class="float-left">
         <ng-container *ngTemplateOutlet="block.tx_count === 1 ? transactionsSingular : transactionsPlural; context: {$implicit: block.tx_count | number}"></ng-container>
         <ng-template #transactionsSingular let-i i18n="shared.transaction-count.singular">{{ i }} transaction</ng-template>
         <ng-template #transactionsPlural let-i i18n="shared.transaction-count.plural">{{ i }} transactions</ng-template>
       </h2>
 
-      <ngb-pagination class="pagination-container" [collectionSize]="block.tx_count" [rotate]="true" [pageSize]="itemsPerPage" [(page)]="page" (pageChange)="pageChange(page, blockTxTitle)" [maxSize]="paginationMaxSize" [boundaryLinks]="true" [ellipses]="false"></ngb-pagination>
+      <ngb-pagination class="pagination-container float-right" [collectionSize]="block.tx_count" [rotate]="true" [pageSize]="itemsPerPage" [(page)]="page" (pageChange)="pageChange(page, blockTxTitle)" [maxSize]="paginationMaxSize" [boundaryLinks]="true" [ellipses]="false"></ngb-pagination>
     </div>
     <div class="clearfix"></div>
 
diff --git a/frontend/src/app/components/blockchain-blocks/blockchain-blocks.component.html b/frontend/src/app/components/blockchain-blocks/blockchain-blocks.component.html
index b52185a7c..d04d55b8d 100644
--- a/frontend/src/app/components/blockchain-blocks/blockchain-blocks.component.html
+++ b/frontend/src/app/components/blockchain-blocks/blockchain-blocks.component.html
@@ -12,7 +12,7 @@
         <div class="fee-span">
           {{ block.feeRange[1] | number:feeRounding }} - {{ block.feeRange[block.feeRange.length - 1] | number:feeRounding }} <ng-container i18n="shared.sat-vbyte|sat/vB">sat/vB</ng-container>
         </div>
-        <div class="block-size" [innerHTML]="block.size | bytes: 2">&lrm;</div>
+        <div class="block-size" [innerHTML]="'&lrm;' + (block.size | bytes: 2)"></div>
         <div class="transaction-count">
           <ng-container *ngTemplateOutlet="block.tx_count === 1 ? transactionsSingular : transactionsPlural; context: {$implicit: block.tx_count | number}"></ng-container>
           <ng-template #transactionsSingular let-i i18n="shared.transaction-count.singular">{{ i }} transaction</ng-template>
diff --git a/frontend/src/app/components/latest-blocks/latest-blocks.component.html b/frontend/src/app/components/latest-blocks/latest-blocks.component.html
index fa0bd72b8..ade251a5f 100644
--- a/frontend/src/app/components/latest-blocks/latest-blocks.component.html
+++ b/frontend/src/app/components/latest-blocks/latest-blocks.component.html
@@ -15,7 +15,7 @@
     <tbody>
       <tr *ngFor="let block of blocks; let i= index; trackBy: trackByBlock">
         <td><a [routerLink]="['/block' | relativeUrl, block.id]" [state]="{ data: { block: block } }">{{ block.height }}</a></td>
-        <td class="d-none d-md-block">{{ block.timestamp * 1000 | date:'yyyy-MM-dd HH:mm' }}</td>
+        <td class="d-none d-md-block">&lrm;{{ block.timestamp * 1000 | date:'yyyy-MM-dd HH:mm' }}</td>
         <td><app-time-since [time]="block.timestamp" [fastRender]="true"></app-time-since></td>
         <td class="d-none d-lg-block">{{ block.tx_count | number }}</td>
         <td>
diff --git a/frontend/src/app/components/mempool-blocks/mempool-blocks.component.html b/frontend/src/app/components/mempool-blocks/mempool-blocks.component.html
index c3c06e7aa..3c2f599df 100644
--- a/frontend/src/app/components/mempool-blocks/mempool-blocks.component.html
+++ b/frontend/src/app/components/mempool-blocks/mempool-blocks.component.html
@@ -11,7 +11,7 @@
             <div class="fee-span">
               {{ projectedBlock.feeRange[0] | number:feeRounding }} - {{ projectedBlock.feeRange[projectedBlock.feeRange.length - 1] | number:feeRounding }} <span i18n="shared.sat-vbyte|sat/vB">sat/vB</span>
             </div>
-            <div class="block-size" [innerHTML]="projectedBlock.blockSize | bytes: 2">&lrm;</div>
+            <div class="block-size" [innerHTML]="'&lrm;' + (projectedBlock.blockSize | bytes: 2)"></div>
             <div class="transaction-count">
               <ng-container *ngTemplateOutlet="projectedBlock.nTx === 1 ? transactionsSingular : transactionsPlural; context: {$implicit: projectedBlock.nTx | number}"></ng-container>
               <ng-template #transactionsSingular let-i i18n="shared.transaction-count.singular">{{ i }} transaction</ng-template>
diff --git a/frontend/src/app/components/transaction/transaction.component.html b/frontend/src/app/components/transaction/transaction.component.html
index c4d8522a2..a684ab847 100644
--- a/frontend/src/app/components/transaction/transaction.component.html
+++ b/frontend/src/app/components/transaction/transaction.component.html
@@ -10,11 +10,11 @@
     </div>
   
     <div>
-      <div class="title">
+      <div class="title float-left">
         <h1 i18n="shared.transaction">Transaction</h1>
       </div>
 
-      <div class="tx-link">
+      <div class="tx-link float-left">
         <a [routerLink]="['/tx/' | relativeUrl, txId]">
           <span class="d-inline d-lg-none">{{ txId | shortenString : 24 }}</span>
           <span class="d-none d-lg-inline">{{ txId }}</span>
@@ -22,7 +22,7 @@
         <app-clipboard [text]="txId"></app-clipboard>
       </div>
 
-      <div class="container-buttons">
+      <div class="container-buttons float-right">
         <ng-template [ngIf]="tx?.status?.confirmed">
           <button *ngIf="latestBlock" type="button" class="btn btn-sm btn-success">
             <ng-container *ngTemplateOutlet="latestBlock.height - tx.status.block_height + 1 == 1 ? confirmationSingular : confirmationPlural; context: {$implicit: latestBlock.height - tx.status.block_height + 1}"></ng-container>
@@ -50,7 +50,7 @@
                 <tr>
                   <td i18n="transaction.timestamp|Transaction Timestamp">Timestamp</td>
                   <td>
-                    {{ tx.status.block_time * 1000 | date:'yyyy-MM-dd HH:mm' }}
+                    &lrm;{{ tx.status.block_time * 1000 | date:'yyyy-MM-dd HH:mm' }}
                     <div class="lg-inline">
                       <i class="symbol">(<app-time-since [time]="tx.status.block_time" [fastRender]="true"></app-time-since>)</i>
                     </div>
@@ -206,15 +206,15 @@
         <tbody>
           <tr>
             <td i18n="transaction.size|Transaction Size">Size</td>
-            <td [innerHTML]="tx.size | bytes: 2"></td>
+            <td [innerHTML]="'&lrm;' + (tx.size | bytes: 2)"></td>
           </tr>
           <tr>
             <td i18n="transaction.vsize|Transaction Virtual Size">Virtual size</td>
-            <td [innerHTML]="tx.weight / 4 | vbytes: 2"></td>
+            <td [innerHTML]="'&lrm;' + (tx.weight / 4 | vbytes: 2)"></td>
           </tr>
           <tr>
             <td i18n="transaction.weight|Transaction Weight">Weight</td>
-            <td [innerHTML]="tx.weight | wuBytes: 2"></td>
+            <td [innerHTML]="'&lrm;' + (tx.weight | wuBytes: 2)"></td>
           </tr>
           <tr>
             <td i18n="transaction.hex">Transaction Hex</td>
diff --git a/frontend/src/app/components/transactions-list/transactions-list.component.html b/frontend/src/app/components/transactions-list/transactions-list.component.html
index 2581107fe..6207531dc 100644
--- a/frontend/src/app/components/transactions-list/transactions-list.component.html
+++ b/frontend/src/app/components/transactions-list/transactions-list.component.html
@@ -5,7 +5,7 @@
       <span style="float: left;" class="d-none d-md-block">{{ tx.txid }}</span>
     </a>
     <div class="float-right">
-      <ng-template [ngIf]="tx.status.confirmed">{{ tx.status.block_time * 1000 | date:'yyyy-MM-dd HH:mm' }}</ng-template>
+      <ng-template [ngIf]="tx.status.confirmed">&lrm;{{ tx.status.block_time * 1000 | date:'yyyy-MM-dd HH:mm' }}</ng-template>
       <ng-template [ngIf]="!tx.status.confirmed && tx.firstSeen">
         <i><app-time-since [time]="tx.firstSeen" [fastRender]="true"></app-time-since></i>
       </ng-template>
diff --git a/frontend/src/app/dashboard/dashboard.component.html b/frontend/src/app/dashboard/dashboard.component.html
index cbda3076a..b42956b30 100644
--- a/frontend/src/app/dashboard/dashboard.component.html
+++ b/frontend/src/app/dashboard/dashboard.component.html
@@ -185,7 +185,7 @@
       <div class="card-text" *ngIf="(isLoadingWebSocket$ | async) === false && mempoolInfoData.value; else loadingbig">
         <div class="progress">
           <div class="progress-bar {{ mempoolInfoData.value.mempoolSizeProgress }}" role="progressbar" [ngStyle]="{'width': (mempoolInfoData.value.memPoolInfo.usage / mempoolInfoData.value.memPoolInfo.maxmempool * 100) + '%' }">&nbsp;</div>
-          <div class="progress-text"><span [innerHTML]="mempoolInfoData.value.memPoolInfo.usage | bytes"></span> / <span [innerHTML]="mempoolInfoData.value.memPoolInfo.maxmempool | bytes"></span></div>
+          <div class="progress-text">&lrm;<span [innerHTML]="mempoolInfoData.value.memPoolInfo.usage | bytes"></span> / <span [innerHTML]="mempoolInfoData.value.memPoolInfo.maxmempool | bytes"></span></div>
         </div>
       </div>
     </div>
@@ -201,7 +201,7 @@
     <ng-template #inSync>
       <div class="progress inc-tx-progress-bar">
         <div class="progress-bar" role="progressbar" [ngStyle]="{'width': mempoolInfoData.value.progressWidth, 'background-color': mempoolInfoData.value.progressColor}">&nbsp;</div>
-        <div class="progress-text">{{ mempoolInfoData.value.vBytesPerSecond | ceil | number }} <ng-container i18n="shared.vbytes-per-second|vB/s">vB/s</ng-container></div>
+        <div class="progress-text">&lrm;{{ mempoolInfoData.value.vBytesPerSecond | ceil | number }} <ng-container i18n="shared.vbytes-per-second|vB/s">vB/s</ng-container></div>
       </div>
     </ng-template>
   </ng-template>
diff --git a/frontend/src/styles.scss b/frontend/src/styles.scss
index 4722feabb..871d6d598 100644
--- a/frontend/src/styles.scss
+++ b/frontend/src/styles.scss
@@ -669,14 +669,19 @@ th {
 .reserved { color: #ff8c00 }
 
 .rtl-layout {
-    .arrow {
-        @extend .arrow;
+    .fa-arrow-alt-circle-right {
+        @extend .fa-arrow-alt-circle-right;
         -webkit-transform: scaleX(-1);
         transform: scaleX(-1);
     }
 
     .table td {
         text-align: right;
+        .fiat {
+          @extend .fiat;
+          margin-left: 0px !important;
+          margin-right: 15px;
+        }
     }
 
     .table th {
@@ -715,6 +720,56 @@ th {
     .bitcoin-block {
         direction: rtl;
     }
+
+    .next-previous-blocks {
+      @extend .next-previous-blocks;
+      direction: ltr;
+    }
+
+    .tx-link {
+      @extend .tx-link;
+      margin-left: 0px;
+      margin-right: 10px;
+    }
+
+    .pagination-container {
+      @extend .pagination-container;
+      ul {
+        @extend ul;
+        padding-left: 0px;
+        padding-right: 5px;
+      }
+    }
+
+    .search-box-container {
+      @extend .search-box-container;
+      margin-right: 0 !important;
+      margin-left: 0.5rem !important;
+    }
+
+    .code {
+      @extend .code;
+      text-align: left !important;
+      direction: ltr;
+      .subtitle {
+        @extend .subtitle;
+        direction: rtl;
+        text-align: right !important;
+      }
+    }
+
+    .container-graph {
+      @extend .container-graph;
+      .formRadioGroup {
+        @extend .formRadioGroup;
+        direction: ltr;
+      }
+    }
+
+    .mempool-graph {
+      @extend .mempool-graph;
+      direction: ltr;
+    }
 }