From 818c164a609a8b361229bee50a1a646735769caa Mon Sep 17 00:00:00 2001
From: Jim Bumgardner <jbum@jbum.com>
Date: Thu, 21 Dec 2023 12:55:03 -0800
Subject: [PATCH] Corrected styling on blockquotes on be-concise page.

---
 .../content-design/principles/be-concise.md    | 18 ++++++++++++------
 docs/src/css/sass/ds-site-overrides.scss       | 17 +++++++++++++++++
 2 files changed, 29 insertions(+), 6 deletions(-)

diff --git a/docs/pages/content-design/principles/be-concise.md b/docs/pages/content-design/principles/be-concise.md
index af2eb45c..855e8c58 100644
--- a/docs/pages/content-design/principles/be-concise.md
+++ b/docs/pages/content-design/principles/be-concise.md
@@ -35,13 +35,19 @@ When there is less to read, it’s easier for people to complete their task.
 
 Here’s an example of how to make content more concise:
 
-**Complicated**
-
-> If an individual has a payment to submit to the Treasurer’s Office of Department of Weights and Measures that accompanies their license renewal, this payment must be submitted through the online portal at the same time of the submission of their application to the Department.
-
-**Concise**
+<div class="blockquote-container">
+  <div class="blockquote-body">
+    <div class="blockquote-header"><strong>Complicated</strong></div>
+    <div class="blockquote-content">If an individual has a payment to submit to the Treasurer’s Office of Department of Weights and Measures that accompanies their license renewal, this payment must be submitted through the online portal at the same time of the submission of their application to the Department.</div>
+  </div>
+</div>
 
-> You must pay your license fee when you renew your license. Use the Department of Weights and Measures online portal to renew and pay.
+<div class="blockquote-container">
+  <div class="blockquote-body">
+    <div class="blockquote-header"><strong>Concise</strong></div>
+    <div class="blockquote-content">You must pay your license fee when you renew your license. Use the Department of Weights and Measures online portal to renew and pay.</div>
+  </div>
+</div>
 
 Plainlanguage.gov has more tips for [writing concise content](https://www.plainlanguage.gov/guidelines/concise/). You can also see examples of how to improve government writing.
 
diff --git a/docs/src/css/sass/ds-site-overrides.scss b/docs/src/css/sass/ds-site-overrides.scss
index 5d3f5064..5dbc23d0 100644
--- a/docs/src/css/sass/ds-site-overrides.scss
+++ b/docs/src/css/sass/ds-site-overrides.scss
@@ -79,3 +79,20 @@ cagov-page-feedback {
 }
 
 
+main.cagov-main {
+    div.blockquote-container {
+        background-color: white;
+        padding: 16px 16px;
+        margin: 16px 0px;
+        div.blockquote-body {
+            border-left: 3px solid #E3881B;
+            padding: 8px 16px;
+            div.blockquote-header {
+                margin-bottom: 16px;
+            }
+            div.blockquote-content {
+                font-size: 14px;
+            }
+        }
+    }
+}
\ No newline at end of file