diff --git a/packages/Webkul/Velocity/src/Resources/assets/js/UI/components/sidebar.vue b/packages/Webkul/Velocity/src/Resources/assets/js/UI/components/sidebar.vue
index 812935e32..89b22be56 100644
--- a/packages/Webkul/Velocity/src/Resources/assets/js/UI/components/sidebar.vue
+++ b/packages/Webkul/Velocity/src/Resources/assets/js/UI/components/sidebar.vue
@@ -33,7 +33,7 @@
                     <span class="category-title">{{ category['name'] }}</span>
 
                     <i
-                        class="rango-arrow-right pr15 pull-right"
+                        class="rango-arrow-right pr15 float-right"
                         @mouseout="toggleSidebar(id, $event, 'mouseout')"
                         @mouseover="toggleSidebar(id, $event, 'mouseover')"
                         v-if="category.children.length && category.children.length > 0">
diff --git a/packages/Webkul/Velocity/src/Resources/assets/sass/app.scss b/packages/Webkul/Velocity/src/Resources/assets/sass/app.scss
index 4f0190cce..17fbc2f89 100755
--- a/packages/Webkul/Velocity/src/Resources/assets/sass/app.scss
+++ b/packages/Webkul/Velocity/src/Resources/assets/sass/app.scss
@@ -12,7 +12,6 @@
 @import "components/rtl";
 
 @import "static/material-icons";
-@import "node_modules/bootstrap-sass/assets/stylesheets/bootstrap";
 
 * {
     margin: 0;
@@ -207,8 +206,6 @@ body {
         }
 
         + .account-modal {
-            @extend .modal-dialog;
-
             top: 40px;
             right: 10px;
             z-index: 101;
@@ -414,7 +411,7 @@ header {
                 width: 210px;
 
                 .select-icon {
-                    top: 9px;
+                    top: -30px;
                     right: 8px;
                     z-index: 10;
                     font-size: 18px;
diff --git a/packages/Webkul/Velocity/src/Resources/assets/sass/components/app.scss b/packages/Webkul/Velocity/src/Resources/assets/sass/components/app.scss
index cfd32a68d..451ad2605 100755
--- a/packages/Webkul/Velocity/src/Resources/assets/sass/components/app.scss
+++ b/packages/Webkul/Velocity/src/Resources/assets/sass/components/app.scss
@@ -1046,7 +1046,7 @@
                 }
 
                 .filter-left {
-                    @extend .pull-left;
+                    float: left;
                 }
 
                 .filter-right {
diff --git a/packages/Webkul/Velocity/src/Resources/views/shop/UI/header.blade.php b/packages/Webkul/Velocity/src/Resources/views/shop/UI/header.blade.php
index 5627a1ec9..50324e0bc 100644
--- a/packages/Webkul/Velocity/src/Resources/views/shop/UI/header.blade.php
+++ b/packages/Webkul/Velocity/src/Resources/views/shop/UI/header.blade.php
@@ -23,7 +23,7 @@
 
                                         <i
                                             @click="closeDrawer()"
-                                            class="material-icons pull-right text-dark">
+                                            class="material-icons float-right text-dark">
                                             cancel
                                         </i>
                                     </span>
@@ -195,7 +195,7 @@
 
                                     <h4 class="display-inbl">@{{ subCategory.name }}</h4>
 
-                                    <i class="material-icons pull-right text-dark" @click="closeDrawer()">
+                                    <i class="material-icons float-right text-dark" @click="closeDrawer()">
                                         cancel
                                     </i>
                                 </div>
@@ -248,7 +248,7 @@
                                 <div class="drawer-section">
                                     <i class="rango-arrow-left fs24 text-down-4" @click="toggleMetaInfo('languages')"></i>
                                     <h4 class="display-inbl">{{ __('velocity::app.responsive.header.languages') }}</h4>
-                                    <i class="material-icons pull-right text-dark" @click="closeDrawer()">cancel</i>
+                                    <i class="material-icons float-right text-dark" @click="closeDrawer()">cancel</i>
                                 </div>
 
                                 <ul type="none">
@@ -290,7 +290,7 @@
                                 <div class="drawer-section">
                                     <i class="rango-arrow-left fs24 text-down-4" @click="toggleMetaInfo('currencies')"></i>
                                     <h4 class="display-inbl">{{ __('velocity::app.shop.general.currencies') }}</h4>
-                                    <i class="material-icons pull-right text-dark" @click="closeDrawer()">cancel</i>
+                                    <i class="material-icons float-right text-dark" @click="closeDrawer()">cancel</i>
                                 </div>
 
                                 <ul type="none">
diff --git a/packages/Webkul/Velocity/src/Resources/views/shop/checkout/cart/index.blade.php b/packages/Webkul/Velocity/src/Resources/views/shop/checkout/cart/index.blade.php
index bf821db6b..92706845d 100644
--- a/packages/Webkul/Velocity/src/Resources/views/shop/checkout/cart/index.blade.php
+++ b/packages/Webkul/Velocity/src/Resources/views/shop/checkout/cart/index.blade.php
@@ -243,7 +243,7 @@
 
                                     <button
                                         type="submit"
-                                        class="theme-btn light mr15 pull-right unset">
+                                        class="theme-btn light mr15 float-right unset">
 
                                         {{ __('shop::app.checkout.cart.update-cart') }}
                                     </button>
diff --git a/packages/Webkul/Velocity/src/Resources/views/shop/checkout/cart/mini-cart.blade.php b/packages/Webkul/Velocity/src/Resources/views/shop/checkout/cart/mini-cart.blade.php
index 079dfd5c2..f3e72a0b5 100644
--- a/packages/Webkul/Velocity/src/Resources/views/shop/checkout/cart/mini-cart.blade.php
+++ b/packages/Webkul/Velocity/src/Resources/views/shop/checkout/cart/mini-cart.blade.php
@@ -1,4 +1,4 @@
-<div class="mini-cart-container pull-right">
+<div class="mini-cart-container float-right">
     <mini-cart
         view-cart="{{ route('shop.checkout.cart.index') }}"
         cart-text="{{ __('shop::app.minicart.view-cart') }}"
diff --git a/packages/Webkul/Velocity/src/Resources/views/shop/checkout/onepage/customer-info.blade.php b/packages/Webkul/Velocity/src/Resources/views/shop/checkout/onepage/customer-info.blade.php
index 5cfb4dbbc..aa3a3e50e 100644
--- a/packages/Webkul/Velocity/src/Resources/views/shop/checkout/onepage/customer-info.blade.php
+++ b/packages/Webkul/Velocity/src/Resources/views/shop/checkout/onepage/customer-info.blade.php
@@ -113,7 +113,7 @@
                 @auth('customer')
                     @if(count(auth('customer')->user()->addresses))
                         <a
-                            class="theme-btn light pull-right text-up-14"
+                            class="theme-btn light float-right text-up-14"
                             @click="backToSavedBillingAddress()">
 
                             {{ __('shop::app.checkout.onepage.back') }}
@@ -226,7 +226,7 @@
                     @auth('customer')
                         @if(count(auth('customer')->user()->addresses))
                             <a
-                                class="theme-btn light pull-right text-up-14"
+                                class="theme-btn light float-right text-up-14"
                                 @click="backToSavedShippingAddress()">
 
                                 {{ __('shop::app.checkout.onepage.back') }}
diff --git a/packages/Webkul/Velocity/src/Resources/views/shop/customers/account/address/index.blade.php b/packages/Webkul/Velocity/src/Resources/views/shop/customers/account/address/index.blade.php
index 0512bcad1..243272120 100644
--- a/packages/Webkul/Velocity/src/Resources/views/shop/customers/account/address/index.blade.php
+++ b/packages/Webkul/Velocity/src/Resources/views/shop/customers/account/address/index.blade.php
@@ -19,7 +19,7 @@
 
         @if (! $addresses->isEmpty())
             <span class="account-action">
-                <a href="{{ route('customer.address.create') }}" class="theme-btn light unset pull-right">
+                <a href="{{ route('customer.address.create') }}" class="theme-btn light unset float-right">
                     {{ __('shop::app.customer.account.address.index.add') }}
                 </a>
             </span>
diff --git a/packages/Webkul/Velocity/src/Resources/views/shop/customers/account/orders/view.blade.php b/packages/Webkul/Velocity/src/Resources/views/shop/customers/account/orders/view.blade.php
index 13882277c..fd64e3675 100644
--- a/packages/Webkul/Velocity/src/Resources/views/shop/customers/account/orders/view.blade.php
+++ b/packages/Webkul/Velocity/src/Resources/views/shop/customers/account/orders/view.blade.php
@@ -28,7 +28,7 @@
 
                 @if ($order->canCancel())
                     <span class="account-action">
-                        <a href="{{ route('customer.orders.cancel', $order->id) }}" class="theme-btn light unset pull-right" v-alert:message="'{{ __('shop::app.customer.account.order.view.cancel-confirm-msg') }}'" style="float: right">
+                        <a href="{{ route('customer.orders.cancel', $order->id) }}" class="theme-btn light unset float-right" v-alert:message="'{{ __('shop::app.customer.account.order.view.cancel-confirm-msg') }}'" style="float: right">
                             {{ __('shop::app.customer.account.order.view.cancel-btn-title') }}
                         </a>
                     </span>
@@ -208,7 +208,7 @@
                                                 <td>{{ __('shop::app.customer.account.order.view.total-due') }}
                                                     <span class="dash-icon">-</span>
                                                 </td>
-                                                
+
                                                 @if($order->status !== 'canceled')
                                                     <td>{{ core()->formatPrice($order->total_due, $order->order_currency_code) }}</td>
                                                 @else
@@ -231,7 +231,7 @@
                                     <div class="section-title">
                                         <span>{{ __('shop::app.customer.account.order.view.individual-invoice', ['invoice_id' => $invoice->id]) }}</span>
 
-                                        <a href="{{ route('customer.orders.print', $invoice->id) }}" class="pull-right">
+                                        <a href="{{ route('customer.orders.print', $invoice->id) }}" class="float-right">
                                             {{ __('shop::app.customer.account.order.view.print') }}
                                         </a>
                                     </div>
diff --git a/packages/Webkul/Velocity/src/Resources/views/shop/customers/account/partials/sidemenu.blade.php b/packages/Webkul/Velocity/src/Resources/views/shop/customers/account/partials/sidemenu.blade.php
index a2dbe7f67..d0bab2b38 100644
--- a/packages/Webkul/Velocity/src/Resources/views/shop/customers/account/partials/sidemenu.blade.php
+++ b/packages/Webkul/Velocity/src/Resources/views/shop/customers/account/partials/sidemenu.blade.php
@@ -56,7 +56,7 @@
                     <a class="unset fw6 full-width" href="{{ $subMenuItem['url'] }}">
                         <i class="icon {{ $index }} text-down-3"></i>
                         <span>{{ trans($subMenuItem['name']) }}<span>
-                        <i class="rango-arrow-right pull-right text-down-3"></i>
+                        <i class="rango-arrow-right float-right text-down-3"></i>
                     </a>
                 </li>
             @endforeach
diff --git a/packages/Webkul/Velocity/src/Resources/views/shop/customers/account/profile/index.blade.php b/packages/Webkul/Velocity/src/Resources/views/shop/customers/account/profile/index.blade.php
index 7c3ca3a93..10d9a2c1b 100644
--- a/packages/Webkul/Velocity/src/Resources/views/shop/customers/account/profile/index.blade.php
+++ b/packages/Webkul/Velocity/src/Resources/views/shop/customers/account/profile/index.blade.php
@@ -25,7 +25,7 @@
         </span>
 
         <span class="account-action">
-            <a href="{{ route('customer.profile.edit') }}" class="theme-btn light unset pull-right">
+            <a href="{{ route('customer.profile.edit') }}" class="theme-btn light unset float-right">
                 {{ __('shop::app.customer.account.profile.index.edit') }}
             </a>
         </span>
diff --git a/packages/Webkul/Velocity/src/Resources/views/shop/customers/account/reviews/index.blade.php b/packages/Webkul/Velocity/src/Resources/views/shop/customers/account/reviews/index.blade.php
index ceec7da1c..9317508e2 100644
--- a/packages/Webkul/Velocity/src/Resources/views/shop/customers/account/reviews/index.blade.php
+++ b/packages/Webkul/Velocity/src/Resources/views/shop/customers/account/reviews/index.blade.php
@@ -17,7 +17,7 @@
         <span class="account-heading">{{ __('shop::app.customer.account.review.index.title') }}</span>
 
         @if (count($reviews) > 1)
-            <div class="account-action pull-right">
+            <div class="account-action float-right">
                 <a href="{{ route('customer.review.deleteall') }}" class="theme-btn light unset">
                     {{ __('shop::app.customer.account.wishlist.deleteall') }}
                 </a>
diff --git a/packages/Webkul/Velocity/src/Resources/views/shop/customers/account/wishlist/wishlist.blade.php b/packages/Webkul/Velocity/src/Resources/views/shop/customers/account/wishlist/wishlist.blade.php
index 3b946cfb6..aa8bf2f6c 100644
--- a/packages/Webkul/Velocity/src/Resources/views/shop/customers/account/wishlist/wishlist.blade.php
+++ b/packages/Webkul/Velocity/src/Resources/views/shop/customers/account/wishlist/wishlist.blade.php
@@ -11,7 +11,7 @@
         <span class="account-heading">{{ __('shop::app.customer.account.wishlist.title') }}</span>
 
         @if (count($items))
-            <div class="account-action pull-right">
+            <div class="account-action float-right">
                 <a
                     class="remove-decoration theme-btn light"
                     href="{{ route('customer.wishlist.removeall') }}">
diff --git a/packages/Webkul/Velocity/src/Resources/views/shop/customers/session/index.blade.php b/packages/Webkul/Velocity/src/Resources/views/shop/customers/session/index.blade.php
index df997e40b..9242d3077 100644
--- a/packages/Webkul/Velocity/src/Resources/views/shop/customers/session/index.blade.php
+++ b/packages/Webkul/Velocity/src/Resources/views/shop/customers/session/index.blade.php
@@ -78,7 +78,7 @@
                                     @{{ errors.first('password') }}
                                 </span>
 
-                                <a href="{{ route('customer.forgot-password.create') }}" class="pull-right">
+                                <a href="{{ route('customer.forgot-password.create') }}" class="float-right">
                                     {{ __('shop::app.customer.login-form.forgot_pass') }}
                                 </a>
 
diff --git a/packages/Webkul/Velocity/src/Resources/views/shop/guest/compare/compare-products.blade.php b/packages/Webkul/Velocity/src/Resources/views/shop/guest/compare/compare-products.blade.php
index 7b661a71a..38beacfd5 100644
--- a/packages/Webkul/Velocity/src/Resources/views/shop/guest/compare/compare-products.blade.php
+++ b/packages/Webkul/Velocity/src/Resources/views/shop/guest/compare/compare-products.blade.php
@@ -16,7 +16,7 @@
 
             <div class="col-6" v-if="products.length > 0">
                 <button
-                    class="theme-btn light pull-right"
+                    class="theme-btn light float-right"
                     @click="removeProductCompare('all')">
                     {{ __('shop::app.customer.account.wishlist.deleteall') }}
                 </button>
diff --git a/packages/Webkul/Velocity/src/Resources/views/shop/layouts/master.blade.php b/packages/Webkul/Velocity/src/Resources/views/shop/layouts/master.blade.php
index 3d6c74e2d..343c5db0b 100644
--- a/packages/Webkul/Velocity/src/Resources/views/shop/layouts/master.blade.php
+++ b/packages/Webkul/Velocity/src/Resources/views/shop/layouts/master.blade.php
@@ -17,18 +17,7 @@
         <meta http-equiv="content-language" content="{{ app()->getLocale() }}">
         <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
 
-        <link rel="stylesheet" href="{{ asset('themes/velocity/assets/css/velocity.css') }}" />
-        <link rel="stylesheet" href="{{ asset('themes/velocity/assets/css/bootstrap.min.css') }}" />
-
-        @if (core()->getCurrentLocale() && core()->getCurrentLocale()->direction == 'rtl')
-            <link href="{{ asset('themes/velocity/assets/css/bootstrap-flipped.css') }}" rel="stylesheet">
-        @endif
-
-        @if ($favicon = core()->getCurrentChannel()->favicon_url)
-            <link rel="icon" sizes="16x16" href="{{ $favicon }}" />
-        @else
-            <link rel="icon" sizes="16x16" href="{{ asset('/themes/velocity/assets/images/static/v-icon.png') }}" />
-        @endif
+        {!! view_render_event('bagisto.shop.layout.head') !!}
 
         @yield('head')
 
@@ -36,13 +25,7 @@
             <meta name="description" content="{{ core()->getCurrentChannel()->description }}"/>
         @show
 
-        @stack('css')
-
-        {!! view_render_event('bagisto.shop.layout.head') !!}
-
-        <style>
-            {!! core()->getConfigData('general.content.custom_scripts.custom_css') !!}
-        </style>
+        @include('shop::layouts.styles')
     </head>
 
     <body @if (core()->getCurrentLocale() && core()->getCurrentLocale()->direction == 'rtl') class="rtl" @endif>
@@ -50,6 +33,7 @@
 
         @include('shop::UI.particals')
 
+        {{-- main app --}}
         <div id="app">
             <product-quick-view v-if="$root.quickView"></product-quick-view>
 
@@ -120,7 +104,7 @@
             </div>
         </div>
 
-        <!-- below footer -->
+        {{-- footer --}}
         @section('footer')
             {!! view_render_event('bagisto.shop.layout.footer.before') !!}
 
@@ -133,77 +117,7 @@
 
         <div id="alert-container"></div>
 
-        <script
-            type="text/javascript"
-            baseUrl="{{ url()->to('/') }}"
-            src="{{ asset('themes/velocity/assets/js/velocity.js') }}">
-        </script>
-
-        <script
-            type="text/javascript"
-            src="{{ asset('vendor/webkul/ui/assets/js/ui.js') }}">
-        </script>
-
-        <script
-            type="text/javascript"
-            src="{{ asset('themes/velocity/assets/js/jquery.ez-plus.js') }}">
-        </script>
-
-        <script type="text/javascript">
-            (() => {
-                window.showAlert = (messageType, messageLabel, message) => {
-                    if (messageType && message !== '') {
-                        let alertId = Math.floor(Math.random() * 1000);
-
-                        let html = `<div class="alert ${messageType} alert-dismissible" id="${alertId}">
-                            <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
-                            <strong>${messageLabel ? messageLabel + '!' : ''} </strong> ${message}.
-                        </div>`;
-
-                        $('#alert-container').append(html).ready(() => {
-                            window.setTimeout(() => {
-                                $(`#alert-container #${alertId}`).remove();
-                            }, 5000);
-                        });
-                    }
-                }
-
-                let messageType = '';
-                let messageLabel = '';
-
-                @if ($message = session('success'))
-                    messageType = 'alert-success';
-                    messageLabel = "{{ __('velocity::app.shop.general.alert.success') }}";
-                @elseif ($message = session('warning'))
-                    messageType = 'alert-warning';
-                    messageLabel = "{{ __('velocity::app.shop.general.alert.warning') }}";
-                @elseif ($message = session('error'))
-                    messageType = 'alert-danger';
-                    messageLabel = "{{ __('velocity::app.shop.general.alert.error') }}";
-                @elseif ($message = session('info'))
-                    messageType = 'alert-info';
-                    messageLabel = "{{ __('velocity::app.shop.general.alert.info') }}";
-                @endif
-
-                if (messageType && '{{ $message }}' !== '') {
-                    window.showAlert(messageType, messageLabel, '{{ $message }}');
-                }
-
-                window.serverErrors = [];
-                @if (isset($errors))
-                    @if (count($errors))
-                        window.serverErrors = @json($errors->getMessages());
-                    @endif
-                @endif
-
-                window._translations = @json(app('Webkul\Velocity\Helpers\Helper')->jsonTranslations());
-            })();
-        </script>
-
-        @stack('scripts')
-
-        <script>
-            {!! core()->getConfigData('general.content.custom_scripts.custom_javascript') !!}
-        </script>
+        {{-- all scripts --}}
+        @include('shop::layouts.scripts')
     </body>
 </html>
diff --git a/packages/Webkul/Velocity/src/Resources/views/shop/layouts/scripts.blade.php b/packages/Webkul/Velocity/src/Resources/views/shop/layouts/scripts.blade.php
new file mode 100644
index 000000000..56d645a15
--- /dev/null
+++ b/packages/Webkul/Velocity/src/Resources/views/shop/layouts/scripts.blade.php
@@ -0,0 +1,72 @@
+<script
+    type="text/javascript"
+    baseUrl="{{ url()->to('/') }}"
+    src="{{ asset('themes/velocity/assets/js/velocity.js') }}">
+</script>
+
+<script
+    type="text/javascript"
+    src="{{ asset('vendor/webkul/ui/assets/js/ui.js') }}">
+</script>
+
+<script
+    type="text/javascript"
+    src="{{ asset('themes/velocity/assets/js/jquery.ez-plus.js') }}">
+</script>
+
+<script type="text/javascript">
+    (() => {
+        window.showAlert = (messageType, messageLabel, message) => {
+            if (messageType && message !== '') {
+                let alertId = Math.floor(Math.random() * 1000);
+
+                let html = `<div class="alert ${messageType} alert-dismissible" id="${alertId}">
+                    <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
+                    <strong>${messageLabel ? messageLabel + '!' : ''} </strong> ${message}.
+                </div>`;
+
+                $('#alert-container').append(html).ready(() => {
+                    window.setTimeout(() => {
+                        $(`#alert-container #${alertId}`).remove();
+                    }, 5000);
+                });
+            }
+        }
+
+        let messageType = '';
+        let messageLabel = '';
+
+        @if ($message = session('success'))
+            messageType = 'alert-success';
+            messageLabel = "{{ __('velocity::app.shop.general.alert.success') }}";
+        @elseif ($message = session('warning'))
+            messageType = 'alert-warning';
+            messageLabel = "{{ __('velocity::app.shop.general.alert.warning') }}";
+        @elseif ($message = session('error'))
+            messageType = 'alert-danger';
+            messageLabel = "{{ __('velocity::app.shop.general.alert.error') }}";
+        @elseif ($message = session('info'))
+            messageType = 'alert-info';
+            messageLabel = "{{ __('velocity::app.shop.general.alert.info') }}";
+        @endif
+
+        if (messageType && '{{ $message }}' !== '') {
+            window.showAlert(messageType, messageLabel, '{{ $message }}');
+        }
+
+        window.serverErrors = [];
+        @if (isset($errors))
+            @if (count($errors))
+                window.serverErrors = @json($errors->getMessages());
+            @endif
+        @endif
+
+        window._translations = @json(app('Webkul\Velocity\Helpers\Helper')->jsonTranslations());
+    })();
+</script>
+
+@stack('scripts')
+
+<script>
+    {!! core()->getConfigData('general.content.custom_scripts.custom_javascript') !!}
+</script>
\ No newline at end of file
diff --git a/packages/Webkul/Velocity/src/Resources/views/shop/layouts/style.blade.php b/packages/Webkul/Velocity/src/Resources/views/shop/layouts/style.blade.php
deleted file mode 100644
index 4247d0f81..000000000
--- a/packages/Webkul/Velocity/src/Resources/views/shop/layouts/style.blade.php
+++ /dev/null
@@ -1 +0,0 @@
-<link rel="stylesheet" href="{{ asset('themes/velocity/assets/css/velocity.css') }}">
\ No newline at end of file
diff --git a/packages/Webkul/Velocity/src/Resources/views/shop/layouts/styles.blade.php b/packages/Webkul/Velocity/src/Resources/views/shop/layouts/styles.blade.php
new file mode 100644
index 000000000..19b95e536
--- /dev/null
+++ b/packages/Webkul/Velocity/src/Resources/views/shop/layouts/styles.blade.php
@@ -0,0 +1,18 @@
+<link rel="stylesheet" href="{{ asset('themes/velocity/assets/css/velocity.css') }}" />
+<link rel="stylesheet" href="{{ asset('themes/velocity/assets/css/bootstrap.min.css') }}" />
+
+@if (core()->getCurrentLocale() && core()->getCurrentLocale()->direction == 'rtl')
+    <link href="{{ asset('themes/velocity/assets/css/bootstrap-flipped.css') }}" rel="stylesheet">
+@endif
+
+@if ($favicon = core()->getCurrentChannel()->favicon_url)
+    <link rel="icon" sizes="16x16" href="{{ $favicon }}" />
+@else
+    <link rel="icon" sizes="16x16" href="{{ asset('/themes/velocity/assets/images/static/v-icon.png') }}" />
+@endif
+
+@stack('css')
+
+<style>
+    {!! core()->getConfigData('general.content.custom_scripts.custom_css') !!}
+</style>
\ No newline at end of file
diff --git a/packages/Webkul/Velocity/src/Resources/views/shop/layouts/top-nav/index.blade.php b/packages/Webkul/Velocity/src/Resources/views/shop/layouts/top-nav/index.blade.php
index 39313bca4..fcb3493a6 100644
--- a/packages/Webkul/Velocity/src/Resources/views/shop/layouts/top-nav/index.blade.php
+++ b/packages/Webkul/Velocity/src/Resources/views/shop/layouts/top-nav/index.blade.php
@@ -1,4 +1,4 @@
-<nav id="top">
+<nav class="row" id="top">
     <div class="col-sm-6">
         @include('velocity::layouts.top-nav.locale-currency')
     </div>
diff --git a/packages/Webkul/Velocity/src/Resources/views/shop/layouts/top-nav/locale-currency.blade.php b/packages/Webkul/Velocity/src/Resources/views/shop/layouts/top-nav/locale-currency.blade.php
index 9252d1040..ad71940b1 100644
--- a/packages/Webkul/Velocity/src/Resources/views/shop/layouts/top-nav/locale-currency.blade.php
+++ b/packages/Webkul/Velocity/src/Resources/views/shop/layouts/top-nav/locale-currency.blade.php
@@ -25,7 +25,7 @@
 @endphp
 
 {!! view_render_event('bagisto.shop.layout.header.locale.before') !!}
-    <div class="pull-left">
+    <div class="float-left">
         <div class="dropdown">
             @php
                 $localeImage = null;
@@ -79,7 +79,7 @@
 {!! view_render_event('bagisto.shop.layout.header.currency-item.before') !!}
 
     @if (core()->getCurrentChannel()->currencies->count() > 1)
-        <div class="pull-left">
+        <div class="float-left">
             <div class="dropdown">
                <select
                     class="btn btn-link dropdown-toggle control locale-switcher styled-select"
diff --git a/packages/Webkul/Velocity/src/Resources/views/shop/layouts/top-nav/login-section.blade.php b/packages/Webkul/Velocity/src/Resources/views/shop/layouts/top-nav/login-section.blade.php
index 6cd076a8e..91fd52f51 100644
--- a/packages/Webkul/Velocity/src/Resources/views/shop/layouts/top-nav/login-section.blade.php
+++ b/packages/Webkul/Velocity/src/Resources/views/shop/layouts/top-nav/login-section.blade.php
@@ -7,7 +7,7 @@
         <div class="dropdown">
             <div id="account">
 
-                <div class="welcome-content pull-right" @click="togglePopup">
+                <div class="welcome-content float-right" @click="togglePopup">
                     <i class="material-icons align-vertical-top">perm_identity</i>
                     <span class="text-center">
                         @guest('customer')
diff --git a/packages/Webkul/Velocity/src/Resources/views/shop/products/list/layered-navigation.blade.php b/packages/Webkul/Velocity/src/Resources/views/shop/products/list/layered-navigation.blade.php
index a3fd0cb71..c73649d61 100644
--- a/packages/Webkul/Velocity/src/Resources/views/shop/products/list/layered-navigation.blade.php
+++ b/packages/Webkul/Velocity/src/Resources/views/shop/products/list/layered-navigation.blade.php
@@ -12,7 +12,7 @@
         $filterAttributes = $productFlatRepository->getProductsRelatedFilterableAttributes($category);
 
         $maxPrice = core()->convertPrice($productFlatRepository->getCategoryProductMaximumPrice($category));
-    } 
+    }
 
     if (! count($filterAttributes) > 0) {
         $filterAttributes = $attributeRepository->getFilterAttributes();
@@ -70,7 +70,7 @@
             <div class="filter-attributes-title" @click="active = !active">
                 <h4 class="fw6 display-inbl">@{{ attribute.name ? attribute.name : attribute.admin_name }}</h4>
 
-                <div class="pull-right display-table">
+                <div class="float-right display-table">
                     <span class="link-color cursor-pointer" v-if="appliedFilters.length" @click.stop="clearFilters()">
                         {{ __('shop::app.products.remove-filter-link-title') }}
                     </span>
diff --git a/packages/Webkul/Velocity/src/Resources/views/shop/products/list/toolbar.blade.php b/packages/Webkul/Velocity/src/Resources/views/shop/products/list/toolbar.blade.php
index e739de29f..080c7007c 100644
--- a/packages/Webkul/Velocity/src/Resources/views/shop/products/list/toolbar.blade.php
+++ b/packages/Webkul/Velocity/src/Resources/views/shop/products/list/toolbar.blade.php
@@ -78,7 +78,7 @@
                     <span class="fs24 fw6">
                         {{ __('velocity::app.shop.general.filter') }}
                     </span>
-                    <span class="pull-right link-color" @click="toggleLayeredNavigation">
+                    <span class="float-right link-color" @click="toggleLayeredNavigation">
                         {{ __('velocity::app.responsive.header.done') }}
                     </span>
                 </div>