Some more styling for inline <code> tag

styles/style.css

@@ -1,7 +1,13 @@
+:root {
+    --default-font: 'Open Sans', sans-serif;
+    --font-monospace: 'Source Code Pro', monospace;
+}
+
 a {
     color: var(--text-accent);
     outline: none;
 }
+
 a:hover {
     color: var(--text-accent-hover);
 }
@@ -14,6 +20,7 @@ a:hover {
     position: relative;
     flex-direction: row;
 }
+
 /* Foooter section BEGIN */
 .note-footer {
     display: block;
@@ -78,9 +85,11 @@ a:hover {
     line-height: 16px;
     overflow: hidden;
 }
+
 .backlink-container p {
     margin: 12px 0px;
 }
+
 /* Foooter section END */
 
 .markdown-rendered {
@@ -93,6 +102,15 @@ a:hover {
     padding: 15px 30px;
 }
 
+.markdown-rendered code {
+    color: #a20000c9;
+    font-family: var(--font-monospace);
+    background-color: #f5f2f0;
+    border-radius: 4px;
+    font-size: 0.85em;
+    padding: 4px 8px;
+}
+
 .nav-bar {
     width: 300px;
     flex: 0 0 300px;
@@ -107,9 +125,7 @@ a:hover {
     padding-top: 20px;
     flex-direction: column;
 }
-:root {
-    --default-font: 'Open Sans', sans-serif;
-}
+
 
 .theme-light {
     --background-primary: white;
@@ -165,30 +181,37 @@ a:hover {
 .markdown-rendered h6 {
     margin: 15px 0;
 }
+
 .markdown-rendered h1 {
     font-size: 2.0em;
     font-weight: 800;
 }
+
 .markdown-rendered h2 {
     font-size: 1.6em;
     font-weight: 800;
 }
+
 .markdown-rendered h3 {
     font-size: 1.4em;
     font-weight: 700;
 }
+
 .markdown-rendered h4 {
     font-size: 1.2em;
     font-weight: 600;
 }
+
 .markdown-rendered h5,
 .markdown-rendered h6 {
     font-size: 1em;
     font-weight: 500;
 }
+
 .markdown-rendered h6 {
     color: var(--text-muted);
 }
+
 .right-bar-container {
     display: block;
     padding: 0em 1em;
@@ -233,6 +256,7 @@ hr {
         display: none;
     }
 }
+
 @media screen and (max-width: 800px) {
     .nav-bar {
         display: none;