diff --git a/src/EventHub.IdentityServer/Pages/Account/Manage.cshtml b/src/EventHub.IdentityServer/Pages/Account/Manage.cshtml
index 2835b21..69e3f71 100644
--- a/src/EventHub.IdentityServer/Pages/Account/Manage.cshtml
+++ b/src/EventHub.IdentityServer/Pages/Account/Manage.cshtml
@@ -18,7 +18,7 @@
         <abp-row class="mb-2">
             <abp-column>
                 <a class="btn btn-primary" href="@Model.ReturnUrl">
-                    <i class="fa fa-chevron-left mr-2"></i>@L["ReturnToApplication"]
+                    <i class="fa fa-chevron-left me-2"></i>@L["ReturnToApplication"]
                 </a>
             </abp-column>
         </abp-row>
diff --git a/src/EventHub.Web.Theme/Themes/EventHub/Components/MainNavbar/Default.cshtml b/src/EventHub.Web.Theme/Themes/EventHub/Components/MainNavbar/Default.cshtml
index e91ce22..6ba5752 100644
--- a/src/EventHub.Web.Theme/Themes/EventHub/Components/MainNavbar/Default.cshtml
+++ b/src/EventHub.Web.Theme/Themes/EventHub/Components/MainNavbar/Default.cshtml
@@ -22,7 +22,7 @@
         <a class="navbar-brand font-weight-bold" href="@Url.Page("/index")">
             <img src="/assets/eventhub-logo.svg" class="logo"/>
         </a>
-        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
+        <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
             <span class="navbar-toggler-icon"></span>
         </button>
         <div class="collapse navbar-collapse" id="navbarResponsive">
@@ -44,10 +44,10 @@
                 <ul class="navbar-nav">
                     <li class="nav-item">
                         <div class="dropdown">
-                            <a class="nav-link event-link" type="button" id="createDropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+                            <a class="nav-link event-link" type="button" id="createDropdownMenuButton" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                 + Create
                             </a>
-                            <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
+                            <div class="dropdown-menu m-2" aria-labelledby="dropdownMenuButton">
                                 <a class="dropdown-item" href="@UrlOptions.Value.Www@Url.Page("/organizations/new")">Organization</a>
                                 <div class="dropdown-divider"></div>
                                 <a class="dropdown-item" href="@UrlOptions.Value.Www@Url.Page("/events/new")">Event</a>
@@ -61,11 +61,11 @@
                 @if (CurrentUser.IsAuthenticated)
                 {
                     <li class="nav-item dropdown">
-                        <a class="nav-link dropdown-toggle" href="#" id="navbarDropdownMenuLink" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+                        <a class="nav-link dropdown-toggle" href="#" id="navbarDropdownMenuLink" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                             <span class="user-avatar">
                                 <img gravatar-email="@CurrentUser.Email" default-image="Wavatar" gravatar-size="40" width="40" height="40" class="nav-avatar avatar rounded-circle"/>
                             </span>
-                            <span class="ml-2">
+                            <span class="ms-2">
                                 @if (!string.IsNullOrWhiteSpace(CurrentUser.Name) && !string.IsNullOrWhiteSpace(CurrentUser.SurName))
                                 {
                                     @(CurrentUser.Name + " " + CurrentUser.SurName)
@@ -78,7 +78,7 @@
                                 }
                             </span>
                         </a>
-                        <div class="dropdown-menu dropdown-menu-right">
+                        <div class="dropdown-menu dropdown-menu-right m-2">
                             <a class="dropdown-item" href="@(UrlOptions.Value.Account.EnsureEndsWith('/') + "account/manage")" title="@L["Account"]">
                                 <i class="fas fa-cog"></i> @L["Account"]
                             </a>
@@ -97,7 +97,7 @@
                         <a class="nav-link" href="/account/login?returnUrl=@returnUrl">Log In</a>
                     </li>
                     <li class="nav-item">
-                        <a class="btn btn-primary ml-lg-2" href="@UrlOptions.Value.Account/account/register?returnUrl=@returnUrl">Sign Up</a>
+                        <a class="btn btn-primary ms-lg-2" href="@UrlOptions.Value.Account/account/register?returnUrl=@returnUrl">Sign Up</a>
                     </li>
                 }
             </ul>
diff --git a/src/EventHub.Web.Theme/Themes/EventHub/Components/Menu/Default.cshtml b/src/EventHub.Web.Theme/Themes/EventHub/Components/Menu/Default.cshtml
index 6a7c16d..ef8152c 100644
--- a/src/EventHub.Web.Theme/Themes/EventHub/Components/Menu/Default.cshtml
+++ b/src/EventHub.Web.Theme/Themes/EventHub/Components/Menu/Default.cshtml
@@ -28,7 +28,7 @@
     {
         <li class="nav-item">
             <div class="dropdown">
-                <a class="nav-link dropdown-toggle" href="#" id="Menu_@(menuItem.Name)" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+                <a class="nav-link dropdown-toggle" href="#" id="Menu_@(menuItem.Name)" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                     @if (menuItem.Icon != null)
                     {
                         if (menuItem.Icon.StartsWith("fa"))
diff --git a/src/EventHub.Web.Theme/Themes/EventHub/Components/Menu/_MenuItem.cshtml b/src/EventHub.Web.Theme/Themes/EventHub/Components/Menu/_MenuItem.cshtml
index b226366..8dc2911 100644
--- a/src/EventHub.Web.Theme/Themes/EventHub/Components/Menu/_MenuItem.cshtml
+++ b/src/EventHub.Web.Theme/Themes/EventHub/Components/Menu/_MenuItem.cshtml
@@ -25,7 +25,7 @@
 else
 {
     <div class="dropdown-submenu">
-        <a role="button" class="btn dropdown-toggle" data-toggle="dropdown"
+        <a role="button" class="btn dropdown-toggle" data-bs-toggle="dropdown"
                 aria-haspopup="true" aria-expanded="false">
             <span class="lp-icon">
                 <i class="@(Model.Icon ?? "")"></i>
diff --git a/src/EventHub.Web.Theme/Themes/EventHub/Components/Toolbar/LanguageSwitch/Default.cshtml b/src/EventHub.Web.Theme/Themes/EventHub/Components/Toolbar/LanguageSwitch/Default.cshtml
index 2697ee6..525c7ac 100644
--- a/src/EventHub.Web.Theme/Themes/EventHub/Components/Toolbar/LanguageSwitch/Default.cshtml
+++ b/src/EventHub.Web.Theme/Themes/EventHub/Components/Toolbar/LanguageSwitch/Default.cshtml
@@ -4,7 +4,7 @@
 @if (Model.OtherLanguages.Any())
 {
     <div class="dropdown">
-        <a class="nav-link dropdown-toggle" href="#" role="button" id="dropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+        <a class="nav-link dropdown-toggle" href="#" role="button" id="dropdownMenuLink" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
             @Model.CurrentLanguage.DisplayName
         </a>
 
diff --git a/src/EventHub.Web.Theme/Themes/EventHub/Components/Toolbar/UserMenu/Default.cshtml b/src/EventHub.Web.Theme/Themes/EventHub/Components/Toolbar/UserMenu/Default.cshtml
index 06a96ed..b93a81c 100644
--- a/src/EventHub.Web.Theme/Themes/EventHub/Components/Toolbar/UserMenu/Default.cshtml
+++ b/src/EventHub.Web.Theme/Themes/EventHub/Components/Toolbar/UserMenu/Default.cshtml
@@ -8,7 +8,7 @@
 @inject IHtmlLocalizer<AbpUiResource> L
 @model ApplicationMenu
 <div class="dropdown">
-    <a class="nav-link dropdown-toggle" href="#" role="button" id="dropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+    <a class="nav-link dropdown-toggle" href="#" role="button" id="dropdownMenuLink" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
         @if (CurrentUser.TenantId != null)
         {
             <small><i>@CurrentTenant.Name</i>\</small>@CurrentUser.UserName
diff --git a/src/EventHub.Web.Theme/wwwroot/themes/eventhub/style.css b/src/EventHub.Web.Theme/wwwroot/themes/eventhub/style.css
index 4bedcc9..0205464 100644
--- a/src/EventHub.Web.Theme/wwwroot/themes/eventhub/style.css
+++ b/src/EventHub.Web.Theme/wwwroot/themes/eventhub/style.css
@@ -40,6 +40,10 @@ body {
     font-weight: 600;
 }
 
+a:link, a:visited, a:hover, a:focus, a:active {
+    text-decoration: none;
+}
+
 p.lead {
     font-size: 14px;
     font-weight: 500;
diff --git a/src/EventHub.Web/Pages/Events/Components/AttendeesArea/Default.cshtml b/src/EventHub.Web/Pages/Events/Components/AttendeesArea/Default.cshtml
index aaf6b34..b80d6f4 100644
--- a/src/EventHub.Web/Pages/Events/Components/AttendeesArea/Default.cshtml
+++ b/src/EventHub.Web/Pages/Events/Components/AttendeesArea/Default.cshtml
@@ -6,7 +6,7 @@
         @foreach (var attendee in Model.Attendees)
         {
             <a href="/users/@attendee.UserName">
-                <img gravatar-email="@attendee.Email" default-image="Wavatar" gravatar-size="40" class="org-avatar rounded-circle"  data-toggle="tooltip" title="@attendee.UserName" />
+                <img gravatar-email="@attendee.Email" default-image="Wavatar" gravatar-size="40" class="org-avatar rounded-circle"  data-bs-toggle="tooltip" title="@attendee.UserName" />
             </a>
         }
     </div>
diff --git a/src/EventHub.Web/Pages/Events/Components/EventsArea/_eventListSection.cshtml b/src/EventHub.Web/Pages/Events/Components/EventsArea/_eventListSection.cshtml
index e8e5ba0..587f8c1 100644
--- a/src/EventHub.Web/Pages/Events/Components/EventsArea/_eventListSection.cshtml
+++ b/src/EventHub.Web/Pages/Events/Components/EventsArea/_eventListSection.cshtml
@@ -13,7 +13,7 @@
             </div>
             <div class="card-body">
                 <div class="event-container">
-                    <div class="form-row">
+                    <div class="row">
                         <div class="col-3">
                             <div class="event-date text-center">
                                 <small>@eventDto.StartTime.ToString("MMM")</small>
diff --git a/src/EventHub.Web/Pages/Events/Detail.cshtml b/src/EventHub.Web/Pages/Events/Detail.cshtml
index 67c825b..11faeaf 100644
--- a/src/EventHub.Web/Pages/Events/Detail.cshtml
+++ b/src/EventHub.Web/Pages/Events/Detail.cshtml
@@ -53,7 +53,7 @@
                 <h5 class="detail-head mt-4">Owner</h5>
                 <div>
                     <a href="/users/@Model.Event.OwnerUserName">
-                        <img gravatar-email="@Model.Event.OwnerEmail" default-image="Wavatar" gravatar-size="40" class="org-avatar avatar rounded-circle" data-toggle="tooltip" title="@Model.Event.OwnerUserName"/>
+                        <img gravatar-email="@Model.Event.OwnerEmail" default-image="Wavatar" gravatar-size="40" class="org-avatar avatar rounded-circle" data-bs-toggle="tooltip" title="@Model.Event.OwnerUserName"/>
                     </a>
                 </div>
                 @if (Model.IsEventOwner)
diff --git a/src/EventHub.Web/Pages/Events/Edit.cshtml b/src/EventHub.Web/Pages/Events/Edit.cshtml
index e70a951..42e6f56 100644
--- a/src/EventHub.Web/Pages/Events/Edit.cshtml
+++ b/src/EventHub.Web/Pages/Events/Edit.cshtml
@@ -120,7 +120,7 @@
                                 </div>
 
 
-                                <div class="col-md-12 text-right">
+                                <div class="col-md-12 text-end">
                                     <button type="submit" class="btn btn-primary btn-lg">
                                         @L["Submit"]
                                     </button>
diff --git a/src/EventHub.Web/Pages/Events/New.cshtml b/src/EventHub.Web/Pages/Events/New.cshtml
index 4d24a51..28d668e 100644
--- a/src/EventHub.Web/Pages/Events/New.cshtml
+++ b/src/EventHub.Web/Pages/Events/New.cshtml
@@ -129,7 +129,7 @@ else
                     </select>
                     <span asp-validation-for="Event.Language" class="text-danger"></span>
                   </div> 
-                  <div class="col-md-12 text-right">
+                  <div class="col-md-12 text-end">
                     <button type="submit" class="btn btn-primary btn-lg"> 
                       Publish New Event
                     </button>
diff --git a/src/EventHub.Web/Pages/Index.cshtml b/src/EventHub.Web/Pages/Index.cshtml
index 881f098..8f00d9a 100644
--- a/src/EventHub.Web/Pages/Index.cshtml
+++ b/src/EventHub.Web/Pages/Index.cshtml
@@ -51,7 +51,7 @@
 <div class="search-event container">
     <div class="card bg-primary mb-0">
         <div class="card-body">
-            <div class="form-row search-form">
+            <div class="row search-form">
                 <div class="col-md mb-3 mb-md-0">
                     <select id="LanguageSelect" class="form-select" aria-label="en">
                         <option value="" selected>Language</option>
@@ -78,8 +78,8 @@
                         <label for="inputWhen">When</label>
                     </div>
                 </div>
-                <div class="col-md-2">
-                    <button id="SearchButton" class="btn btn-primary btn-lg btn-block ">
+                <div class="col-md-2 d-grid gap-2">
+                    <button id="SearchButton" class="btn btn-primary btn-lg">
                         <img src="/assets/search.svg">
                         Search
                     </button>
@@ -162,28 +162,27 @@
         </div>
     </div>
 
-    <div class="container text-center py-5">
-        <h1 class="my-5 pb-5">How EventHub Works?</h1>
-        <div class="row my-4">
-            <div class="col-md-5 ml-auto">
-                <div class="px-5">
-                    <h3>Explore groups</h3>
-                    <p class="lead">
-                        List who is organizing local events
-                        with one click.
-                    </p>
-                    @if (!CurrentUser.IsAuthenticated)
-                    {
-                        <a href="@UrlOptions.Value.Account/Account/Register?returnUrl=@UrlOptions.Value.Www" class="btn btn-link btn-lg">Join EventHub</a>
-                    }
-                </div>
+<div class="container text-center py-5">
+    <h1 class="my-5 pb-5">How EventHub Works?</h1>
+    <div class="row my-4">
+        <div class="col-md-5 ms-auto">
+            <div class="px-5">
+                <h3>Explore groups</h3>
+                <p class="lead">
+                    List who is organizing local events
+                    with one click.
+                </p>
+                @if (!CurrentUser.IsAuthenticated)
+                {
+                    <a href="@UrlOptions.Value.Account/Account/Register?returnUrl=@UrlOptions.Value.Www" class="btn btn-link btn-lg">Join EventHub</a>
+                }
             </div>
-            <div class="col-md-5 mr-auto border-left">
-                <div class="px-5">
-                    <h3>Start an Event</h3>
-                    <p class="lead">Create your own Eventhub group and benefit from a community of millions.</p>
-                    <a href="@Url.Page("/Events/New")" class="btn btn-link btn-lg">Start</a>
-                </div>
+        </div>
+        <div class="col-md-5 me-auto border-left">
+            <div class="px-5">
+                <h3>Start an Event</h3>
+                <p class="lead">Create your own Eventhub group and benefit from a community of millions.</p>
+                <a href="@Url.Page("/Events/New")" class="btn btn-link btn-lg">Start</a>
             </div>
         </div>
     </div>
diff --git a/src/EventHub.Web/Pages/Organizations/Components/JoinArea/Default.cshtml b/src/EventHub.Web/Pages/Organizations/Components/JoinArea/Default.cshtml
index decd868..e009c6b 100644
--- a/src/EventHub.Web/Pages/Organizations/Components/JoinArea/Default.cshtml
+++ b/src/EventHub.Web/Pages/Organizations/Components/JoinArea/Default.cshtml
@@ -6,24 +6,24 @@
     <abp-card-body>
         @if (Model.IsLoggedIn)
         {
-            if (Model.IsJoined)
-            {
-                <abp-button id="OrganizationLeaveButton"
-                            button-type="Secondary"
-                            size="Block"
-                            icon="fas fa-times"
-                            text="@L["LeaveOrganization"].Value"
-                            data-url="@Url.Action("Leave","OrganizationMembership", new { organizationId = Model.OrganizationId })" />
-            }
-            else
-            {
-                <abp-button id="OrganizationJoinButton"
-                            button-type="Primary"
-                            size="Block"
-                            icon="fas fa-plus"
-                            text="@L["JoinOrganization"].Value"
-                            data-url="@Url.Action("Join","OrganizationMembership", new { organizationId = Model.OrganizationId })"/>
-            }
+            <div class="d-grid gap-2">
+                @if (Model.IsJoined)
+                {
+                    <abp-button id="OrganizationLeaveButton"
+                                button-type="Secondary"
+                                icon="fas fa-times"
+                                text="@L["LeaveOrganization"].Value"
+                                data-url="@Url.Action("Leave","OrganizationMembership", new { organizationId = Model.OrganizationId })" />
+                }
+                else
+                {
+                    <abp-button id="OrganizationJoinButton"
+                                button-type="Primary"
+                                icon="fas fa-plus"
+                                text="@L["JoinOrganization"].Value"
+                                data-url="@Url.Action("Join","OrganizationMembership", new { organizationId = Model.OrganizationId })"/>
+                }
+            </div>
         }
         else
         {
diff --git a/src/EventHub.Web/Pages/Organizations/Components/MembersArea/_memberListSection.cshtml b/src/EventHub.Web/Pages/Organizations/Components/MembersArea/_memberListSection.cshtml
index c3696fe..d244ecb 100644
--- a/src/EventHub.Web/Pages/Organizations/Components/MembersArea/_memberListSection.cshtml
+++ b/src/EventHub.Web/Pages/Organizations/Components/MembersArea/_memberListSection.cshtml
@@ -5,7 +5,7 @@
     <div>
         <div>
             <a href="/users/@member.UserName">
-                <img gravatar-email="@member.Email" default-image="Wavatar" gravatar-size="40" class="org-avatar avatar rounded-circle" data-toggle="tooltip" title="@member.UserName"/>
+                <img gravatar-email="@member.Email" default-image="Wavatar" gravatar-size="40" class="org-avatar avatar rounded-circle" data-bs-toggle="tooltip" title="@member.UserName"/>
             </a>
             <span class="member-name" style="display: none">
                 @if (!string.IsNullOrWhiteSpace(member.Name) && !string.IsNullOrWhiteSpace(member.Surname))
diff --git a/src/EventHub.Web/Pages/Organizations/Edit.cshtml b/src/EventHub.Web/Pages/Organizations/Edit.cshtml
index 1322eb5..095721d 100644
--- a/src/EventHub.Web/Pages/Organizations/Edit.cshtml
+++ b/src/EventHub.Web/Pages/Organizations/Edit.cshtml
@@ -102,7 +102,7 @@
                                         <span asp-validation-for="Organization.MediumUsername" class="text-danger"></span>
                                     </div>
                                 </div>
-                                <div class="col-md-12 text-right">
+                                <div class="col-md-12 text-end">
                                     <button type="submit" class="btn btn-primary btn-lg">
                                         @L["Submit"]
                                     </button>
diff --git a/src/EventHub.Web/Pages/Organizations/New.cshtml b/src/EventHub.Web/Pages/Organizations/New.cshtml
index 08e13c1..2786eb5 100644
--- a/src/EventHub.Web/Pages/Organizations/New.cshtml
+++ b/src/EventHub.Web/Pages/Organizations/New.cshtml
@@ -103,7 +103,7 @@
                                         <span asp-validation-for="Organization.MediumUsername" class="text-danger"></span>
                                     </div>
                                 </div>
-                                <div class="col-md-12 text-right">
+                                <div class="col-md-12 text-end">
                                     <button type="submit" class="btn btn-primary btn-lg">
                                         Create Organization
                                     </button>
diff --git a/src/EventHub.Web/Pages/Organizations/Profile.cshtml b/src/EventHub.Web/Pages/Organizations/Profile.cshtml
index b1a0622..f6b13f8 100644
--- a/src/EventHub.Web/Pages/Organizations/Profile.cshtml
+++ b/src/EventHub.Web/Pages/Organizations/Profile.cshtml
@@ -31,13 +31,13 @@
             <div class="col-12 mt-4">
                 <ul class="nav nav-tabs profile-nav" id="myTab">
                     <li class="nav-item">
-                        <a href="#about-organization-section" class="nav-link active" data-toggle="tab">About the Organization</a>
+                        <a href="#about-organization-section" class="nav-link active" data-bs-toggle="tab">About the Organization</a>
                     </li>
                     <li class="nav-item">
-                        <a href="#events-section" class="nav-link" data-toggle="tab">Events</a>
+                        <a href="#events-section" class="nav-link" data-bs-toggle="tab">Events</a>
                     </li>
                     <li class="nav-item">
-                        <a href="#members-section" class="nav-link" data-toggle="tab">Members</a>
+                        <a href="#members-section" class="nav-link" data-bs-toggle="tab">Members</a>
                     </li>
                 </ul>
 
@@ -60,7 +60,7 @@
                                 <h5 class="detail-head mt-3 font-weight-bold">Owners</h5>
                                 <div>
                                     <a href="/users/@Model.Organization.OwnerUserName">
-                                        <img gravatar-email="@Model.Organization.OwnerEmail" default-image="Wavatar" gravatar-size="40" class="org-avatar avatar rounded-circle" data-toggle="tooltip" title="@Model.Organization.OwnerUserName"/>
+                                        <img gravatar-email="@Model.Organization.OwnerEmail" default-image="Wavatar" gravatar-size="40" class="org-avatar avatar rounded-circle" data-bs-toggle="tooltip" title="@Model.Organization.OwnerUserName"/>
                                     </a>
                                 </div>
 
@@ -79,16 +79,20 @@
                                                     <span>Premium end date: @Model.Organization.PremiumEndDate!.Value.ToShortDateString()</span>
                                                     @if (PremiumPlanInfoOptionsSnapshot.Value.IsExtendable && Model.Organization.PremiumEndDate!.Value.IsBetween(DateTime.Now, DateTime.Now.AddMonths(PremiumPlanInfoOptionsSnapshot.Value.OnePremiumPeriodAsMonth - PremiumPlanInfoOptionsSnapshot.Value.CanBeExtendedAfterHowManyMonths)))
                                                     {
-                                                        <a href="@Url.Page("/Pricing", new { organizationName = Model.Organization.Name })" class="btn btn-primary btn-block mt-3">
-                                                            <i class="fas fa-handshake"></i> @L["ExtendNow"].Value
-                                                        </a>
+                                                        <div class="d-grid gap-2">
+                                                            <a href="@Url.Page("/Pricing", new { organizationName = Model.Organization.Name })" class="btn btn-primary mt-3">
+                                                                <i class="fas fa-handshake"></i> @L["ExtendNow"].Value
+                                                            </a>
+                                                        </div>
                                                     }
                                                 }
                                                 else
                                                 {
-                                                    <a href="@Url.Page("/Pricing", new { organizationName = Model.Organization.Name })" class="btn btn-primary btn-block">
-                                                        <i class="fas fa-handshake"></i> @L["UpgradeToPremium"]
-                                                    </a>
+                                                    <div class="d-grid gap-2">
+                                                        <a href="@Url.Page("/Pricing", new { organizationName = Model.Organization.Name })" class="btn btn-primary">
+                                                            <i class="fas fa-handshake"></i> @L["UpgradeToPremium"]
+                                                        </a>
+                                                    </div>
                                                 }
                                             </abp-card-body>
                                         </abp-card>   
@@ -167,10 +171,10 @@
                                 <div class="list-style">
                                     <ul class="nav nav-pills events" role="tablist">
                                         <li class="nav-item">
-                                            <a href="#PastEvent" class="selected" data-toggle="tab"><img src="/assets/past.svg"> Past</a>
+                                            <a href="#PastEvent" class="selected" data-bs-toggle="tab"><img src="/assets/past.svg"> Past</a>
                                         </li>
                                         <li class="nav-item">
-                                            <a href="#UpcomingEvent" data-toggle="tab"><img src="/assets/now.svg"> Upcoming</a>
+                                            <a href="#UpcomingEvent" data-bs-toggle="tab"><img src="/assets/now.svg"> Upcoming</a>
                                         </li>
                                     </ul>
                                 </div>
diff --git a/src/EventHub.Web/Pages/Payment/PreCheckout.cshtml b/src/EventHub.Web/Pages/Payment/PreCheckout.cshtml
index b621377..4a68285 100644
--- a/src/EventHub.Web/Pages/Payment/PreCheckout.cshtml
+++ b/src/EventHub.Web/Pages/Payment/PreCheckout.cshtml
@@ -56,7 +56,7 @@
                                         @if (!organizationPaymentRequestExtraParameterConfiguration.IsExtend)
                                         {
                                             <span class="text-muted">Target Plan: @OrganizationPlanType.Premium</span>
-                                            <span class="text-muted ml-1">End date: @DateTime.Now.AddMonths(planInfo.OnePremiumPeriodAsMonth).ToShortDateString()</span>
+                                            <span class="text-muted ms-1">End date: @DateTime.Now.AddMonths(planInfo.OnePremiumPeriodAsMonth).ToShortDateString()</span>
                                         }
                                         else
                                         {
@@ -75,9 +75,9 @@
 
             <div class="d-flex flex-wrap justify-content-between align-items-center pb-4">
                 <abp-container>
-                    <abp-row class="float-right">
+                    <abp-row class="float-end">
                         <abp-column>
-                            <div class="text-right mt-4">
+                            <div class="text-end mt-4">
                                 <label class="text-muted font-weight-normal m-0">Total price</label>
                                 <div class="text-large"><strong>@Model.PaymentRequest.Price @Model.PaymentRequest.Currency</strong></div>
                             </div>
@@ -86,9 +86,9 @@
                 </abp-container>
             </div>
 
-            <abp-container class="float-right">
+            <abp-container class="float-end">
                 <abp-row>
-                    <abp-column class="float-right">
+                    <abp-column class="float-end">
                         <form method="post">
                             @if (Model.PaymentRequest.State != PaymentRequestState.Waiting)
                             {
@@ -97,8 +97,8 @@
                             }
                             else
                             {
-                                <abp-button class="mt-2 float-right" offset="_10" size="Large" type="submit" button-type="Primary">@L["Checkout"]</abp-button>
-                                <a href="@Url.Page("/Pricing", new { organizationName = organizationName })" class="btn btn-lg btn-default md-btn-flat mt-2 mr-3 float-right">Back to pricing</a>
+                                <abp-button class="mt-2 float-end" offset="_10" size="Large" type="submit" button-type="Primary">@L["Checkout"]</abp-button>
+                                <a href="@Url.Page("/Pricing", new { organizationName = organizationName })" class="btn btn-lg btn-default md-btn-flat mt-2 me-3 float-end">Back to pricing</a>
                             }
                         </form>
                     </abp-column>
diff --git a/src/EventHub.Web/Pages/Pricing.cshtml b/src/EventHub.Web/Pages/Pricing.cshtml
index e7510d4..f96572d 100644
--- a/src/EventHub.Web/Pages/Pricing.cshtml
+++ b/src/EventHub.Web/Pages/Pricing.cshtml
@@ -22,10 +22,10 @@
 
       <div class="d-flex col-md flex-column py-4">
         <div class="display-1 text-primary my-4"><i class="lnr lnr-briefcase text-big"></i></div>
-        <h5 class="m-0 ml-2">Free account</h5>
+        <h5 class="m-0 ms-2">Free account</h5>
         <div class="flex-grow-1">
           <div class="py-4 my-2">
-            <span class="d-inline-block text-muted text-big align-middle mr-2">$</span>
+            <span class="d-inline-block text-muted text-big align-middle me-2">$</span>
             <span class="display-3 d-inline-block font-weight-bold align-middle">0</span>
           </div>
           <div class="pb-5">
@@ -50,7 +50,7 @@
           </h5>
           <div class="flex-grow-1">
             <div class="py-4 my-2">
-              <span class="d-inline-block text-muted text-big align-middle mr-2">$</span>
+              <span class="d-inline-block text-muted text-big align-middle me-2">$</span>
               <span class="display-3 d-inline-block font-weight-bold align-middle">@Model.PremiumPlanInfo.Price</span>
             </div>
             <div class="pb-5">
diff --git a/src/EventHub.Web/Pages/PrivacyPolicy.cshtml b/src/EventHub.Web/Pages/PrivacyPolicy.cshtml
index 5f2fd64..6446648 100644
--- a/src/EventHub.Web/Pages/PrivacyPolicy.cshtml
+++ b/src/EventHub.Web/Pages/PrivacyPolicy.cshtml
@@ -6,7 +6,7 @@
         <div class="d-print-none">
             <div class="container">
                 <div class="row">
-                    <div class="col-auto mr-auto"></div>
+                    <div class="col-auto me-auto"></div>
                     <div class="col-auto">
                         <abp-button icon="print" text="Print" onclick="javascript:window.print();"></abp-button>
                     </div>
@@ -548,7 +548,7 @@
         <div class="d-print-none">
             <div class="container">
                 <div class="row">
-                    <div class="col-auto mr-auto"></div>
+                    <div class="col-auto me-auto"></div>
                     <div class="col-auto">
                         <abp-button icon="print" text="Print" onclick="javascript:window.print();"></abp-button>
                     </div>
diff --git a/src/EventHub.Web/Pages/TermsService.cshtml b/src/EventHub.Web/Pages/TermsService.cshtml
index 3f5e18c..cad75fd 100644
--- a/src/EventHub.Web/Pages/TermsService.cshtml
+++ b/src/EventHub.Web/Pages/TermsService.cshtml
@@ -5,7 +5,7 @@
     <div class="d-print-none">
         <div class="container">
             <div class="row">
-                <div class="col-auto mr-auto"></div>
+                <div class="col-auto me-auto"></div>
                 <div class="col-auto">
                     <abp-button icon="print" text="Print" onclick="javascript:window.print();"></abp-button>
                 </div>
@@ -578,7 +578,7 @@
     <div class="d-print-none">
         <div class="container">
             <div class="row">
-                <div class="col-auto mr-auto"></div>
+                <div class="col-auto me-auto"></div>
                 <div class="col-auto">
                     <abp-button icon="print" text="Print" onclick="javascript:window.print();"></abp-button>
                 </div>
diff --git a/src/EventHub.Web/Pages/User.cshtml b/src/EventHub.Web/Pages/User.cshtml
index 1dec587..341c34c 100644
--- a/src/EventHub.Web/Pages/User.cshtml
+++ b/src/EventHub.Web/Pages/User.cshtml
@@ -52,13 +52,13 @@
                 <abp-column size="_8">
                     <ul class="nav nav-tabs profile-nav" id="profileTab">
                         <li class="nav-item">
-                            <a href="#UpcomingEvents" class="nav-link active" data-toggle="tab">Upcoming Events</a>
+                            <a href="#UpcomingEvents" class="nav-link active" data-bs-toggle="tab">Upcoming Events</a>
                         </li>
                         <li class="nav-item">
-                            <a href="#AttendedEvents" class="nav-link" data-toggle="tab">Attended Events</a>
+                            <a href="#AttendedEvents" class="nav-link" data-bs-toggle="tab">Attended Events</a>
                         </li>
                         <li class="nav-item">
-                            <a href="#Organizations" class="nav-link" data-toggle="tab">Organizations</a>
+                            <a href="#Organizations" class="nav-link" data-bs-toggle="tab">Organizations</a>
                         </li>
                     </ul>
                 </abp-column>