diff --git a/site/content/docs/5.0/examples/album-rtl/index.html b/site/content/docs/5.0/examples/album-rtl/index.html
index 5142c4cec3..ff84f122b8 100644
--- a/site/content/docs/5.0/examples/album-rtl/index.html
+++ b/site/content/docs/5.0/examples/album-rtl/index.html
@@ -41,7 +41,7 @@ direction: rtl
   <section class="py-5 text-center container">
     <div class="row py-lg-5">
       <div class="col-lg-6 col-md-8 mx-auto">
-        <h1 class="font-weight-light">مثال الألبوم</h1>
+        <h1 class="fw-light">مثال الألبوم</h1>
         <p class="lead text-muted">شيء قصير وقائد حول المجموعة أدناه - محتوياتها ، ومنشئها ، وما إلى ذلك. اجعلها قصيرة ولطيفة ، ولكن ليست قصيرة جدًا حتى لا يتخطى الناس ببساطة هذه المجموعة تمامًا.</p>
         <p>
           <a href="#" class="btn btn-primary my-2">الدعوة الرئيسية للعمل</a>
diff --git a/site/content/docs/5.0/examples/blog-rtl/index.html b/site/content/docs/5.0/examples/blog-rtl/index.html
index 883ef7b445..c72171770e 100644
--- a/site/content/docs/5.0/examples/blog-rtl/index.html
+++ b/site/content/docs/5.0/examples/blog-rtl/index.html
@@ -47,9 +47,9 @@ include_js: false
 <main class="container">
   <div class="p-4 p-md-5 mb-4 text-white rounded bg-dark">
     <div class="col-md-6 px-0">
-      <h1 class="display-4 font-italic">عنوان مشاركة مدونة مميزة أطول</h1>
+      <h1 class="display-4 fst-italic">عنوان مشاركة مدونة مميزة أطول</h1>
       <p class="lead my-3">أسطر نصية متعددة تشكل الجزء الأمامي ، لإعلام القراء الجدد بسرعة وكفاءة حول أكثر الأشياء إثارة للاهتمام في محتويات هذه المشاركة.</p>
-      <p class="lead mb-0"><a href="#" class="text-white font-weight-bold">أكمل القراءة...</a></p>
+      <p class="lead mb-0"><a href="#" class="text-white fw-bold">أكمل القراءة...</a></p>
     </div>
   </div>
 
@@ -86,7 +86,7 @@ include_js: false
 
   <div class="row">
     <div class="col-md-8">
-      <h3 class="pb-4 mb-4 font-italic border-bottom">
+      <h3 class="pb-4 mb-4 fst-italic border-bottom">
         من Firehose
       </h3>
 
@@ -158,12 +158,12 @@ include_js: false
 
     <div class="col-md-4">
       <div class="p-4 mb-3 bg-light rounded">
-        <h4 class="font-italic">حول</h4>
+        <h4 class="fst-italic">حول</h4>
         <p class="mb-0">بل مدن وإعلان بتخصيص إيطاليا. حيث عقبت أساسي وتنامت و, وباءت وايرلندا وقد بـ, مرمى سقطت إحكام يكن و. كل ومن تصفح بالرّغم الاندونيسية. ٣٠ انتباه والروسية كلّ, الوراء ولكسمبورغ عن لكل. الخاصّة والإتحاد لان بل, وقد الهجوم وتنامت و.</p>
       </div>
 
       <div class="p-4">
-        <h4 class="font-italic">أرشيف</h4>
+        <h4 class="fst-italic">أرشيف</h4>
         <ol class="list-unstyled mb-0">
           <li><a href="#">مارس 2014</a></li>
           <li><a href="#">شباط 2014</a></li>
@@ -181,7 +181,7 @@ include_js: false
       </div>
 
       <div class="p-4">
-        <h4 class="font-italic">في مكان آخر</h4>
+        <h4 class="fst-italic">في مكان آخر</h4>
         <ol class="list-unstyled">
           <li><a href="#">GitHub</a></li>
           <li><a href="#">Twitter</a></li>
diff --git a/site/content/docs/5.0/examples/blog/index.html b/site/content/docs/5.0/examples/blog/index.html
index 3d1373f36d..e25d740b90 100644
--- a/site/content/docs/5.0/examples/blog/index.html
+++ b/site/content/docs/5.0/examples/blog/index.html
@@ -46,7 +46,7 @@ include_js: false
 <main class="container">
   <div class="p-4 p-md-5 mb-4 text-white rounded bg-dark">
     <div class="col-md-6 px-0">
-      <h1 class="display-4 font-italic">Title of a longer featured blog post</h1>
+      <h1 class="display-4 fst-italic">Title of a longer featured blog post</h1>
       <p class="lead my-3">Multiple lines of text that form the lede, informing new readers quickly and efficiently about what’s most interesting in this post’s contents.</p>
       <p class="lead mb-0"><a href="#" class="text-white fw-bold">Continue reading...</a></p>
     </div>
@@ -85,7 +85,7 @@ include_js: false
 
   <div class="row">
     <div class="col-md-8">
-      <h3 class="pb-4 mb-4 font-italic border-bottom">
+      <h3 class="pb-4 mb-4 fst-italic border-bottom">
         From the Firehose
       </h3>
 
@@ -156,12 +156,12 @@ include_js: false
 
     <div class="col-md-4">
       <div class="p-4 mb-3 bg-light rounded">
-        <h4 class="font-italic">About</h4>
+        <h4 class="fst-italic">About</h4>
         <p class="mb-0">Saw you downtown singing the Blues. Watch you circle the drain. Why don't you let me stop by? Heavy is the head that <em>wears the crown</em>. Yes, we make angels cry, raining down on earth from up above.</p>
       </div>
 
       <div class="p-4">
-        <h4 class="font-italic">Archives</h4>
+        <h4 class="fst-italic">Archives</h4>
         <ol class="list-unstyled mb-0">
           <li><a href="#">March 2014</a></li>
           <li><a href="#">February 2014</a></li>
@@ -179,7 +179,7 @@ include_js: false
       </div>
 
       <div class="p-4">
-        <h4 class="font-italic">Elsewhere</h4>
+        <h4 class="fst-italic">Elsewhere</h4>
         <ol class="list-unstyled">
           <li><a href="#">GitHub</a></li>
           <li><a href="#">Twitter</a></li>