diff --git a/layouts/shortcodes/expand.html b/layouts/shortcodes/expand.html
index 0e7ddb18679..744954c9302 100644
--- a/layouts/shortcodes/expand.html
+++ b/layouts/shortcodes/expand.html
@@ -1,14 +1,16 @@
 {{ $_hugo_config := `{ "version": 1 }` }}
 <div class="expand">
-    <div class="expand-label" style="cursor: pointer;" onclick="$h = $(this);$h.next('div').slideToggle(100,function () {$h.children('i').attr('class',function () {return $h.next('div').is(':visible') ? 'fas fa-chevron-down' : 'fas fa-chevron-right';});});">
-        <i style="font-size:x-small;" class="fas fa-chevron-right"></i>
+    <div class="expand-label" style="cursor: pointer;" onclick="$h = $(this);$h.next('div').slideToggle(100,function () {$h.children('i').attr('class',function () {return $h.next('div').is(':visible') ? 'fas fa-angle-double-down' : 'fas fa-angle-double-right';});});">
+        <i style="font-size:xx-large;" class="fas fa-angle-double-right"></i>
         <span>
+        <b>
         {{$expandMessage := T "Expand-title"}}
     	{{ if .IsNamedParams }}
     	{{.Get "default" | default $expandMessage}}
     	{{else}}
     	{{.Get 0 | default $expandMessage}}
-    	{{end}}
+        {{end}}
+        </b>
     	</span>
     </div>
     <div class="expand-content" style="display: none;">
diff --git a/static/css/theme.css b/static/css/theme.css
index 5ce91cd3f5f..040eb1e7080 100644
--- a/static/css/theme.css
+++ b/static/css/theme.css
@@ -55,6 +55,12 @@ body #chapter h1 {
         font-size: 2rem;
     }
 }
+.expand-content {
+    padding-left: 30px;
+}
+.expand-label:hover {
+    color: #00bdf3;
+}
 a {
     color: #00bdf3;
 }