diff --git a/assets/css/compiled/main.css b/assets/css/compiled/main.css
index 118e9a78..e55a6985 100644
--- a/assets/css/compiled/main.css
+++ b/assets/css/compiled/main.css
@@ -3698,6 +3698,42 @@ pre {
   height: 0px;
   visibility: hidden;
 }
+.center-relative-left {
+  left: calc(max(-50vw,-800px) + 50%);
+}
+.margin-0 {
+  margin: 0;
+}
+.margin-top-\[-15px\] {
+  margin-top: -15px;
+}
+.margin-top-\[0\.5rem\] {
+  margin-top: 0.5rem;
+}
+.margin-right-\[10px\] {
+  margin-right: 10px;
+}
+.margin-left-\[0px\] {
+  margin-left: 0px;
+}
+.padding-main-menu {
+  padding: 2px 0 3px 0;
+}
+.padding-top-\[5px\] {
+  padding-top: 5px;
+}
+.z-index-\[-10\] {
+  z-index: -10;
+}
+.z-index-80 {
+  z-index: 80;
+}
+.z-index-100 {
+  z-index: 100;
+}
+.z-index-500 {
+  z-index: 500;
+}
 [id^="fn"], [id^="fnref"] {
   scroll-margin-top: 145px;
 }
diff --git a/assets/css/main.css b/assets/css/main.css
index 4efb1790..8361d1c9 100644
--- a/assets/css/main.css
+++ b/assets/css/main.css
@@ -451,6 +451,46 @@ pre {
   visibility: hidden;
 }
 
+.center-relative-left {
+    left: calc(max(-50vw,-800px) + 50%);
+}
+
+.margin-0 {
+    margin: 0;
+}
+.margin-top-\[-15px\] {
+    margin-top: -15px;
+}
+.margin-top-\[0\.5rem\]{
+    margin-top: 0.5rem;
+}
+.margin-right-\[10px\] {
+    margin-right: 10px;
+}
+.margin-left-\[0px\] {
+    margin-left: 0px;
+}
+
+.padding-main-menu {
+    padding: 2px 0 3px 0
+}
+.padding-top-\[5px\] {
+    padding-top: 5px;
+}
+
+.z-index-\[-10\] {
+    z-index: -10;
+}
+.z-index-80 {
+    z-index: 80;
+}
+.z-index-100 {
+    z-index: 100;
+}
+.z-index-500 {
+    z-index: 500;
+}
+
 /* Offset scroll position to avoid header overlap */
 [id^="fn"], [id^="fnref"] {
   scroll-margin-top: 145px;
diff --git a/layouts/_default/_markup/render-heading.html b/layouts/_default/_markup/render-heading.html
index b4ab6314..308f4239 100644
--- a/layouts/_default/_markup/render-heading.html
+++ b/layouts/_default/_markup/render-heading.html
@@ -4,8 +4,7 @@
     {{ if .Page.Params.showHeadingAnchors | default (.Page.Site.Params.article.showHeadingAnchors | default true) }}
     <span
         class="absolute top-0 w-6 transition-opacity opacity-0 ltr:-left-6 rtl:-right-6 not-prose group-hover:opacity-100">
-        <a class="group-hover:text-primary-300 dark:group-hover:text-neutral-700"
-            style="text-decoration-line: none !important;" href="#{{ $anchor }}" aria-label="{{ i18n "article.anchor_label" }}">#</a>
+        <a class="group-hover:text-primary-300 dark:group-hover:text-neutral-700 !no-underline" href="#{{ $anchor }}" aria-label="{{ i18n "article.anchor_label" }}">#</a>
     </span>        
     {{ end }}
 </h{{ .Level }}>
diff --git a/layouts/_default/list.html b/layouts/_default/list.html
index 6533b347..03974e1f 100644
--- a/layouts/_default/list.html
+++ b/layouts/_default/list.html
@@ -87,7 +87,7 @@
 
       {{ range (.Paginate (.Pages.GroupByDate "2006")).PageGroups }}
         {{ if $cardViewScreenWidth }}
-        <div class="relative w-screen max-w-[1600px] px-[30px]" style="left: calc(max(-50vw,-800px) + 50%);">
+        <div class="relative w-screen max-w-[1600px] px-[30px] center-relative-left">
         {{ end }}
           <h2 class="mt-12 mb-3 text-2xl font-bold text-neutral-700 first:mt-8 dark:text-neutral-300">
             {{ .Key }}
@@ -103,7 +103,7 @@
       {{ else }}
 
         {{ if $cardViewScreenWidth }}
-        <div class="relative w-screen max-w-[1600px] px-[30px]" style="left: calc(max(-50vw,-800px) + 50%);">
+        <div class="relative w-screen max-w-[1600px] px-[30px] center-relative-left">
         <section class="w-full grid gap-4 sm:grid-cols-2 md:grid-cols-3 xl:grid-cols-4 2xl:grid-cols-5">
         {{ else }}
         <section class="w-full grid gap-4 sm:grid-cols-2 md:grid-cols-3">
diff --git a/layouts/_default/term.html b/layouts/_default/term.html
index 40c8cd04..0d099b2f 100644
--- a/layouts/_default/term.html
+++ b/layouts/_default/term.html
@@ -86,7 +86,7 @@
   {{ if $groupByYear }}
 
   {{ range (.Paginate (.Pages.GroupByDate "2006")).PageGroups }}
-  <div class="relative w-screen max-w-[1600px] px-[30px]" style="left: calc(max(-50vw,-800px) + 50%);">
+  <div class="relative w-screen max-w-[1600px] px-[30px] center-relative-left">
     <h2 class="mt-12 mb-3 text-2xl font-bold text-neutral-700 first:mt-8 dark:text-neutral-300">
       {{ .Key }}
     </h2>
@@ -100,7 +100,7 @@
 
   {{ else }}
 
-  <div class="relative w-screen max-w-[1600px] px-[30px]" style="left: calc(max(-50vw,-800px) + 50%);">
+  <div class="relative w-screen max-w-[1600px] px-[30px] center-relative-left">
     <section class="w-full grid gap-4 sm:grid-cols-2 md:grid-cols-3 xl:grid-cols-4 2xl:grid-cols-5">
       {{ range (.Paginate (.Pages.GroupByDate "2006")).PageGroups }}
       {{ range .Pages }}
diff --git a/layouts/partials/article-meta/basic.html b/layouts/partials/article-meta/basic.html
index 624d8386..043c40d8 100644
--- a/layouts/partials/article-meta/basic.html
+++ b/layouts/partials/article-meta/basic.html
@@ -81,7 +81,7 @@
   {{ if (eq $taxonomy "authors")}}
   {{ if (gt (len ($context.GetTerms $taxonomy)) 0) }}
   {{ range $i, $a := $context.GetTerms $taxonomy }}
-    {{ if not (eq $i 0) }} ,&nbsp; {{ end }} <div style="cursor: pointer;" onclick="window.open({{ $a.RelPermalink }},'_self');return false;">{{ $a.LinkTitle }}</div>
+    {{ if not (eq $i 0) }} ,&nbsp; {{ end }} <div class="cursor-pointer" onclick="window.open({{ $a.RelPermalink }},'_self');return false;">{{ $a.LinkTitle }}</div>
   {{ end }}
   {{ end }}
   {{ end }}
@@ -96,7 +96,7 @@
   {{ if and (not (eq $taxonomy "authors")) (not (eq $taxonomy "series"))}}
   {{ if (gt (len ($context.GetTerms $taxonomy)) 0) }}
   {{ range $context.GetTerms $taxonomy }}
-  <span style="margin-top:0.5rem" class="mr-2" onclick="window.open({{ .RelPermalink }},'_self');return false;">
+  <span class="mr-2 margin-top-[0.5rem]" onclick="window.open({{ .RelPermalink }},'_self');return false;">
     {{ partial "badge.html" .LinkTitle }}
   </span>
   {{ end }}
@@ -110,7 +110,7 @@
 {{ if .Params.showCategoryOnly | default (.Site.Params.article.showCategoryOnly | default false) }}
 <div class="flex flex-row flex-wrap items-center">
   {{ range (.GetTerms "categories") }}
-  <span style="margin-top:0.5rem" class="mr-2" onclick="window.open({{ .RelPermalink }},'_self');return false;">
+  <span class="mr-2 margin-top-[0.5rem]" onclick="window.open({{ .RelPermalink }},'_self');return false;">
     {{ partial "badge.html" .LinkTitle }}
   </span>
 {{ end }}
diff --git a/layouts/partials/badge.html b/layouts/partials/badge.html
index af7501b5..520b6307 100644
--- a/layouts/partials/badge.html
+++ b/layouts/partials/badge.html
@@ -1,4 +1,4 @@
-<span class="flex" style="cursor: pointer;">
+<span class="flex cursor-pointer">
   <span class="rounded-md border border-primary-400 px-1 py-[1px] text-xs font-normal text-primary-700 dark:border-primary-600 dark:text-primary-400">
     {{ . }}
   </span>
diff --git a/layouts/partials/header/basic.html b/layouts/partials/header/basic.html
index 53357f0c..4572d3dc 100644
--- a/layouts/partials/header/basic.html
+++ b/layouts/partials/header/basic.html
@@ -1,5 +1,4 @@
-<div style="padding-left:0;padding-right:0;padding-top:2px;padding-bottom:3px"
-    class="main-menu flex items-center justify-between px-4 py-6 sm:px-6 md:justify-start gap-x-3">
+<div class="main-menu flex items-center justify-between px-4 py-6 sm:px-6 md:justify-start gap-x-3 padding-main-menu">
     {{ if .Site.Params.Logo }}
     {{ $logo := resources.Get .Site.Params.Logo }}
     {{ if $logo }}
@@ -98,8 +97,7 @@
             <div class="cursor-pointer hover:text-primary-600 dark:hover:text-primary-400">
                 {{ partial "icon.html" "bars" }}
             </div>
-            <div id="menu-wrapper" style="padding-top:5px;"
-                class="fixed inset-0 z-30 invisible w-screen h-screen m-0 overflow-auto transition-opacity opacity-0 cursor-default bg-neutral-100/50 backdrop-blur-sm dark:bg-neutral-900/50">
+            <div id="menu-wrapper" class="fixed inset-0 z-30 invisible w-screen h-screen m-0 overflow-auto transition-opacity opacity-0 cursor-default bg-neutral-100/50 backdrop-blur-sm dark:bg-neutral-900/50 padding-top-[5px]">
                 <ul
                     class="flex space-y-2 mt-3 flex-col items-end w-full px-6 py-6 mx-auto overflow-visible list-none ltr:text-right rtl:text-left max-w-7xl">
 
@@ -150,8 +148,7 @@
 </div>
 
 {{ if .Site.Menus.subnavigation }}
-<div class="main-menu flex pb-3 flex-col items-end justify-between md:justify-start space-x-3" {{ if .Site.Params.Logo
-    }} style="margin-top:-15px" {{ end }}>
+<div class="main-menu flex pb-3 flex-col items-end justify-between md:justify-start space-x-3{{ if .Site.Params.Logo }} margin-top-[-15px]{{ end }}">
     <div class="hidden md:flex items-center space-x-5">
         {{ range .Site.Menus.subnavigation }}
         <a href="{{ .URL }}" {{ if or (strings.HasPrefix .URL "http:" ) (strings.HasPrefix .URL "https:" ) }}
diff --git a/layouts/partials/header/fixed-fill-blur.html b/layouts/partials/header/fixed-fill-blur.html
index 1a0ceb01..b685a045 100644
--- a/layouts/partials/header/fixed-fill-blur.html
+++ b/layouts/partials/header/fixed-fill-blur.html
@@ -1,5 +1,5 @@
 <div class="min-h-[148px]"></div>
-<div class="fixed inset-x-0 pl-[24px] pr-[24px]" style="z-index:100">
+<div class="fixed inset-x-0 pl-[24px] pr-[24px] z-index-100">
   <div id="menu-blur" class="absolute opacity-0 inset-x-0 top-0 h-full single_hero_background nozoom bg-neutral dark:bg-neutral-800"></div>
   <div class="relative max-w-[64rem] ml-auto mr-auto">
     {{ partial "header/basic.html" . }}
diff --git a/layouts/partials/header/fixed-fill.html b/layouts/partials/header/fixed-fill.html
index 2cad3db5..aef20ea0 100644
--- a/layouts/partials/header/fixed-fill.html
+++ b/layouts/partials/header/fixed-fill.html
@@ -1,5 +1,5 @@
 <div class="min-h-[148px]"></div>
-<div class="fixed inset-x-0 pl-[24px] pr-[24px] bg-neutral dark:bg-neutral-800" style="z-index:100">
+<div class="fixed inset-x-0 pl-[24px] pr-[24px] bg-neutral dark:bg-neutral-800 z-index-100">
   <div class="relative max-w-[64rem] ml-auto mr-auto">
     {{ partial "header/basic.html" . }}
   </div>
diff --git a/layouts/partials/header/fixed-gradient.html b/layouts/partials/header/fixed-gradient.html
index 6d8b95ee..054af970 100644
--- a/layouts/partials/header/fixed-gradient.html
+++ b/layouts/partials/header/fixed-gradient.html
@@ -1,6 +1,6 @@
 <div class="min-h-[148px]"></div>
-<div class="fixed inset-x-0 min-h-[130px] opacity-65 pl-[24px] pr-[24px] bg-gradient-to-b from-neutral from-60% dark:from-neutral-800 to-transparent mix-blend-normal" style="z-index:80"></div>
-<div class="fixed inset-x-0 pl-[24px] pr-[24px]" style="z-index:100">
+<div class="fixed inset-x-0 min-h-[130px] opacity-65 pl-[24px] pr-[24px] bg-gradient-to-b from-neutral from-60% dark:from-neutral-800 to-transparent mix-blend-normal z-index-80"></div>
+<div class="fixed inset-x-0 pl-[24px] pr-[24px] z-index-100">
   <div id="menu-blur" class="absolute opacity-0 inset-x-0 top-0 h-full single_hero_background nozoom backdrop-blur-2xl shadow-2xl"></div>
   <div class="relative max-w-[64rem] ml-auto mr-auto">
     {{ partial "header/basic.html" . }}
diff --git a/layouts/partials/header/fixed.html b/layouts/partials/header/fixed.html
index 7f1d8c4b..116d6245 100644
--- a/layouts/partials/header/fixed.html
+++ b/layouts/partials/header/fixed.html
@@ -1,5 +1,5 @@
 <div class="min-h-[148px]"></div>
-<div class="fixed inset-x-0 pl-[24px] pr-[24px]" style="z-index:100">
+<div class="fixed inset-x-0 pl-[24px] pr-[24px] z-index-100">
   <div id="menu-blur" class="absolute opacity-0 inset-x-0 top-0 h-full single_hero_background nozoom backdrop-blur-2xl shadow-2xl"></div>
   <div class="relative max-w-[64rem] ml-auto mr-auto">
     {{ partial "header/basic.html" . }}
diff --git a/layouts/partials/hero/big.html b/layouts/partials/hero/big.html
index 60e59772..d4489d41 100644
--- a/layouts/partials/hero/big.html
+++ b/layouts/partials/hero/big.html
@@ -34,7 +34,7 @@
         <figure>
             <img class="w-full rounded-lg single_hero_round nozoom" alt="{{ $alt }}" src="{{ .RelPermalink }}">
             {{ if $caption }}
-                <figcaption class="text-sm text-neutral-700 dark:text-neutral-400 hover:underline" style="text-align: center;"> {{ $caption | markdownify }} </figcaption>
+                <figcaption class="text-sm text-neutral-700 dark:text-neutral-400 hover:underline text-center"> {{ $caption | markdownify }} </figcaption>
             {{end}}
         </figure>
         {{ end }}
@@ -43,7 +43,7 @@
         <figure>
             <img class="w-full rounded-lg single_hero_round nozoom" alt="{{ $alt }}" width="{{ .Width }}" height="{{ .Height }}" src="{{ .RelPermalink }}">
             {{ if $caption }}
-                <figcaption class="text-sm text-neutral-700 dark:text-neutral-400 hover:underline" style="text-align: center;"> {{ $caption | markdownify }} </figcaption>
+                <figcaption class="text-sm text-neutral-700 dark:text-neutral-400 hover:underline text-center"> {{ $caption | markdownify }} </figcaption>
             {{end}}
         </figure>
         {{ end }}
@@ -52,7 +52,7 @@
         <figure>
             <img class="w-full rounded-lg single_hero_round nozoom" alt="{{ $alt }}" width="{{ .Width }}" height="{{ .Height }}" src="{{ .RelPermalink }}">
             {{ if $caption }}
-                <figcaption class="text-sm text-neutral-700 dark:text-neutral-400 hover:underline" style="text-align: center;"> {{ $caption | markdownify }} </figcaption>
+                <figcaption class="text-sm text-neutral-700 dark:text-neutral-400 hover:underline text-center"> {{ $caption | markdownify }} </figcaption>
             {{end}}
         </figure>
         {{ end }}
diff --git a/layouts/partials/home/background.html b/layouts/partials/home/background.html
index c011d816..66feca3a 100644
--- a/layouts/partials/home/background.html
+++ b/layouts/partials/home/background.html
@@ -4,7 +4,7 @@
         <div class="absolute inset-x-0 bottom-0 h-1/2 bg-gray-100"></div>
         <div class="mx-auto max-w-7xl p-0">
             <div class="relative sm:overflow-hidden">
-                <div class="fixed inset-x-0 top-0" style="z-index:-10">
+                <div class="fixed inset-x-0 top-0 z-index-[-10]">
                     {{ $homepageImage := "" }}
                     {{ with .Site.Params.defaultBackgroundImage }}
                         {{ if or (strings.HasPrefix . "http:") (strings.HasPrefix . "https:") }}
@@ -21,7 +21,7 @@
                         {{ end }}
                     {{ end }}
                     {{ if $homepageImage }}
-                    <img class="w-full h-[1000px] object-cover m-0 nozoom" src="{{ $homepageImage.RelPermalink }}" role="presentation" style="margin: 0">
+                    <img class="w-full h-[1000px] object-cover m-0 nozoom margin-0" src="{{ $homepageImage.RelPermalink }}" role="presentation">
                     <div
                         class="absolute inset-0 h-[1000px] bg-gradient-to-t from-neutral dark:from-neutral-800 to-transparent mix-blend-normal">
                     </div>
diff --git a/layouts/partials/home/card.html b/layouts/partials/home/card.html
index 8e854552..9a6c7f2b 100644
--- a/layouts/partials/home/card.html
+++ b/layouts/partials/home/card.html
@@ -13,7 +13,7 @@
                   </article>
             </div>
             <div class="mt-6 sm:mt-16 lg:mt-0 mx-auto max-w-xl px-4 sm:px-6 lg:mx-0 lg:max-w-none lg:py-16 lg:px-0">
-                <div class="-mr-48 md:-mr-16 lg:relative lg:m-0 lg:h-full lg:px-0" style="width:100%">
+                <div class="-mr-48 md:-mr-16 lg:relative lg:m-0 lg:h-full lg:px-0 w-full">
                     {{ $homepageImage := "" }}
                     {{ with .Site.Params.defaultBackgroundImage }}
                         {{ if or (strings.HasPrefix . "http:") (strings.HasPrefix . "https:") }}
diff --git a/layouts/partials/home/hero.html b/layouts/partials/home/hero.html
index 735f8196..aadea0b2 100644
--- a/layouts/partials/home/hero.html
+++ b/layouts/partials/home/hero.html
@@ -22,7 +22,7 @@
                         {{ end }}
                     {{ end }}
                     {{ if $homepageImage }}
-                    <img class="h-full w-full object-cover m-0 nozoom" src="{{ $homepageImage.RelPermalink }}" style="margin: 0">
+                    <img class="h-full w-full object-cover m-0 nozoom margin-0" src="{{ $homepageImage.RelPermalink }}">
                     {{ if not $disableHeroImageFilter }}
                         <div
                             class="absolute inset-0 bg-gradient-to-r from-primary-500 to-secondary-600 dark:from-primary-600 dark:to-secondary-800 mix-blend-multiply">
diff --git a/layouts/partials/meta/likes_button.html b/layouts/partials/meta/likes_button.html
index 09c3c159..164d5c81 100644
--- a/layouts/partials/meta/likes_button.html
+++ b/layouts/partials/meta/likes_button.html
@@ -2,7 +2,7 @@
     <button id="button_likes"
         class="rounded-md border border-primary-400 px-1 py-[1px] text-xs font-normal text-primary-700 dark:border-primary-600 dark:text-primary-400"
         onclick="process_article()">
-        <span id="button_likes_heart" style="display:none" class="inline-block align-text-bottom">{{ partial "icon.html" "heart" }} </span>
+        <span id="button_likes_heart" class="inline-block align-text-bottom hidden">{{ partial "icon.html" "heart" }} </span>
         <span id="button_likes_emtpty_heart" class="inline-block align-text-bottom">{{ partial "icon.html" "heart-empty" }}</span>
         <span id="button_likes_text">&nbsp;Like</span>
     </button>
diff --git a/layouts/partials/recent-articles/cardview-fullwidth.html b/layouts/partials/recent-articles/cardview-fullwidth.html
index 7551e171..97e41b42 100644
--- a/layouts/partials/recent-articles/cardview-fullwidth.html
+++ b/layouts/partials/recent-articles/cardview-fullwidth.html
@@ -1,7 +1,7 @@
 {{ $recentArticles := 5 }}
 {{ $recentArticles = .Site.Params.homepage.showRecentItems }}
 
-<div class="relative w-screen max-w-[1600px] px-[30px]" style="left: calc(max(-50vw,-800px) + 50%);">
+<div class="relative w-screen max-w-[1600px] px-[30px] center-relative-left">
   <section
     class="w-full grid gap-4 sm:grid-cols-2 md:grid-cols-3 xl:grid-cols-4 2xl:grid-cols-5">
     {{ range first $recentArticles (.Paginate (where .Site.RegularPages "Type" "in"
diff --git a/layouts/partials/search.html b/layouts/partials/search.html
index 78ae5234..519144b8 100644
--- a/layouts/partials/search.html
+++ b/layouts/partials/search.html
@@ -1,8 +1,7 @@
 <div
   id="search-wrapper"
-  class="invisible fixed inset-0 flex h-screen w-screen cursor-default flex-col bg-neutral-500/50 p-4 backdrop-blur-sm dark:bg-neutral-900/50 sm:p-6 md:p-[10vh] lg:p-[12vh]"
+  class="invisible fixed inset-0 flex h-screen w-screen cursor-default flex-col bg-neutral-500/50 p-4 backdrop-blur-sm dark:bg-neutral-900/50 sm:p-6 md:p-[10vh] lg:p-[12vh] z-index-500"
   data-url="{{ "" | absLangURL }}"
-  style="z-index:500"
 >
   <div
     id="search-modal"
diff --git a/layouts/partials/series/series-closed.html b/layouts/partials/series/series-closed.html
index ecab0ccb..e8172801 100644
--- a/layouts/partials/series/series-closed.html
+++ b/layouts/partials/series/series-closed.html
@@ -1,5 +1,5 @@
 {{ if .Params.series }}
-<details style="margin-left:0px" class="mt-2 mb-5 overflow-hidden rounded-lg ltr:-ml-5 ltr:pl-5 rtl:-mr-5 rtl:pr-5">
+<details class="mt-2 mb-5 overflow-hidden rounded-lg ltr:-ml-5 ltr:pl-5 rtl:-mr-5 rtl:pr-5 margin-left-[0px]">
     {{ partial "series/series_base.html" . }}
 </details>
 {{end}}
\ No newline at end of file
diff --git a/layouts/partials/series/series.html b/layouts/partials/series/series.html
index 8d7f7044..b498de3b 100644
--- a/layouts/partials/series/series.html
+++ b/layouts/partials/series/series.html
@@ -1,5 +1,5 @@
 {{ if .Params.series }}
-<details style="margin-left:0px" class="mt-2 mb-5 overflow-hidden rounded-lg ltr:-ml-5 ltr:pl-5 rtl:-mr-5 rtl:pr-5" {{
+<details class="mt-2 mb-5 overflow-hidden rounded-lg ltr:-ml-5 ltr:pl-5 rtl:-mr-5 rtl:pr-5 margin-left-[0px]" {{
     if .Params.seriesOpened | default (.Site.Params.article.seriesOpened | default false) }} open {{ end }}>
     {{ partial "series/series_base.html" . }}
 </details>
diff --git a/layouts/shortcodes/codeberg.html b/layouts/shortcodes/codeberg.html
index 4f9a251c..f769db16 100644
--- a/layouts/shortcodes/codeberg.html
+++ b/layouts/shortcodes/codeberg.html
@@ -10,7 +10,7 @@
     class="w-full md:w-auto pt-3 p-5 border border-neutral-200 dark:border-neutral-700 border rounded-md shadow-2xl">
 
     <div class="flex items-center">
-      <span class="text-2xl text-neutral-800 dark:text-neutral" style="margin-right:10px;">
+      <span class="text-2xl text-neutral-800 dark:text-neutral margin-right-[10px]">
         {{ partial "icon.html" "codeberg" }}
       </span>
       <div
diff --git a/layouts/shortcodes/forgejo.html b/layouts/shortcodes/forgejo.html
index 2424fd9a..e9e88382 100644
--- a/layouts/shortcodes/forgejo.html
+++ b/layouts/shortcodes/forgejo.html
@@ -10,7 +10,7 @@
     class="w-full md:w-auto pt-3 p-5 border border-neutral-200 dark:border-neutral-700 border rounded-md shadow-2xl">
 
     <div class="flex items-center">
-      <span class="text-2xl text-neutral-800 dark:text-neutral" style="margin-right:10px;">
+      <span class="text-2xl text-neutral-800 dark:text-neutral margin-right-[10px]">
         {{ partial "icon.html" "forgejo" }}
       </span>
       <div
diff --git a/layouts/shortcodes/gitea.html b/layouts/shortcodes/gitea.html
index 79418776..8137bb97 100644
--- a/layouts/shortcodes/gitea.html
+++ b/layouts/shortcodes/gitea.html
@@ -10,7 +10,7 @@
     class="w-full md:w-auto pt-3 p-5 border border-neutral-200 dark:border-neutral-700 border rounded-md shadow-2xl">
 
     <div class="flex items-center">
-      <span class="text-2xl text-neutral-800 dark:text-neutral" style="margin-right:10px;">
+      <span class="text-2xl text-neutral-800 dark:text-neutral margin-right-[10px]">
         {{ partial "icon.html" "gitea" }}
       </span>
       <div
diff --git a/layouts/shortcodes/github.html b/layouts/shortcodes/github.html
index 0d471898..2b0ca31c 100644
--- a/layouts/shortcodes/github.html
+++ b/layouts/shortcodes/github.html
@@ -27,7 +27,7 @@
         class="w-full md:w-auto pt-3 p-5">
 
         <div class="flex items-center">
-          <span class="text-2xl text-neutral-800 dark:text-neutral" style="margin-right:10px;">
+          <span class="text-2xl text-neutral-800 dark:text-neutral margin-right-[10px]">
             {{ partial "icon.html" "github" }}
           </span>
           <div id="{{ $id }}-full_name"
diff --git a/layouts/shortcodes/gitlab.html b/layouts/shortcodes/gitlab.html
index e7b9d9fe..ec6fbdfc 100644
--- a/layouts/shortcodes/gitlab.html
+++ b/layouts/shortcodes/gitlab.html
@@ -9,7 +9,7 @@
   <div class="w-full md:w-auto pt-3 p-5 border border-neutral-200 dark:border-neutral-700 border rounded-md shadow-2xl">
 
     <div class="flex items-center">
-      <span class="text-2xl text-neutral-800 dark:text-neutral" style="margin-right:10px;">
+      <span class="text-2xl text-neutral-800 dark:text-neutral margin-right-[10px]">
         {{ partial "icon.html" "gitlab" }}
       </span>
       <div id="{{ $id }}-name_with_namespace" class="m-0 font-bold text-xl text-neutral-800 decoration-primary-500 hover:underline hover:underline-offset-2 dark:text-neutral">