starting to get things in order

app/assets/stylesheets/application.css

@@ -13,7 +13,8 @@
  *= require_tree .
  *= require_self
  */
-@import url('https://fonts.googleapis.com/css2?family=Fleur+De+Leah&display=swap');
+@import url('https://fonts.googleapis.com/css2?family=Euphoria+Script&family=Fleur+De+Leah&family=Rouge+Script&display=swap');
+
 html, body {
     margin: 0;
     padding: 0;
@@ -21,8 +22,14 @@ html, body {
 
 
 .hero-bg {
-    background-image: url("assets/hero.jpg");
+    background-size: contain;
+    background-color:  #FDFEFE;
+}
+
+.lavender-wisp {
+    background-image: url("assets/lavender-wisp.png");
     background-size: cover;
+    height: 4rem;
 }
 
 /* #container { */
@@ -66,3 +73,9 @@ html, body {
   font-weight: 400;
   font-style: normal;
 }
+
+.rogue-script {
+  font-family: "Rouge Script", cursive;
+  font-weight: 400;
+  font-style: normal;
+}