diff --git a/web/themes/custom/rorschach/css-compiled/styles.css b/web/themes/custom/rorschach/css-compiled/styles.css
index cd50f17..de61d0e 100644
--- a/web/themes/custom/rorschach/css-compiled/styles.css
+++ b/web/themes/custom/rorschach/css-compiled/styles.css
@@ -31,6 +31,18 @@ table {
 #paragraph-id--227 td {
   text-align: start; }
 
+.note {
+  display: block;
+  border: 1px solid #333;
+  text-align: center;
+  font-weight: bold;
+  padding: 1rem;
+  background-color: grey; }
+  .note .note-title {
+    background-color: white;
+    display: block;
+    padding: 1rem; }
+
 /*global*/
 @font-face {
   font-family: 'Font Awesome';
@@ -822,14 +834,6 @@ a {
 .field--name-field-subheading {
   font-size: 1rem; }
 
-.note {
-  display: table;
-  border: 1px solid #333;
-  text-align: center;
-  font-weight: bold;
-  padding: 1rem;
-  background-color: grey; }
-
 .node-book-edit-form {
   width: 80%;
   border-top-style: solid;
diff --git a/web/themes/custom/rorschach/scss/components/_notes.scss b/web/themes/custom/rorschach/scss/components/_notes.scss
new file mode 100644
index 0000000..8c4ddb3
--- /dev/null
+++ b/web/themes/custom/rorschach/scss/components/_notes.scss
@@ -0,0 +1,14 @@
+.note{
+    display: block;
+    border: 1px solid #333;
+    text-align: center;
+    font-weight: bold;
+    padding: 1rem;
+    background-color: grey;
+}
+  
+.note-title{
+    background-color: white;
+    display: block;
+    padding: 1rem;
+}
\ No newline at end of file
diff --git a/web/themes/custom/rorschach/scss/pages/_bookpage.scss b/web/themes/custom/rorschach/scss/pages/_bookpage.scss
index e15cb75..bfd8628 100644
--- a/web/themes/custom/rorschach/scss/pages/_bookpage.scss
+++ b/web/themes/custom/rorschach/scss/pages/_bookpage.scss
@@ -3,12 +3,4 @@
 }
 
 
-.note{
-    display: table;
-    border: 1px solid #333;
-    text-align: center;
-    font-weight: bold;
-    padding: 1rem;
-    background-color: grey;
-}
-    
\ No newline at end of file
+  
\ No newline at end of file
diff --git a/web/themes/custom/rorschach/scss/styles.scss b/web/themes/custom/rorschach/scss/styles.scss
index a5cd823..a559aff 100644
--- a/web/themes/custom/rorschach/scss/styles.scss
+++ b/web/themes/custom/rorschach/scss/styles.scss
@@ -3,6 +3,7 @@
 /*components*/
 @import "components/_quotes";
 @import "components/_tablefields";  
+@import "components/_notes";  
 
 /*global*/