diff --git a/css/style.css b/css/style.css
index e7d4e93..2252404 100644
--- a/css/style.css
+++ b/css/style.css
@@ -245,9 +245,13 @@ ul {
 region.wavesurfer-region:before {
     content: attr(data-region-label);
     position: absolute;
-    color: beige;
-    top: 10px;
-    padding-left: 5px;
+    color: beige;    
+    background-color: rgba(0, 0, 0, 0.3); /* Semi-transparent black background */
+    border-radius: 0.5rem; /* Optional: Rounds corners for a cleaner look */
+    padding: 0.1rem 0.5rem; /* Adds padding around the label text */
+    top: 0.75rem;
+    left: 0.5rem;
+    padding-left: 0.5rem;
 }
 
 region.wavesurfer-region[data-region-highlight] {
diff --git a/package.json b/package.json
index f6d37bd..7eee90b 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "chirpity",
-  "version": "2.4.4",
+  "version": "2.4.5",
   "description": "Chirpity Nocmig",
   "main": "main.js",
   "scripts": {
diff --git a/test/menu.spec.ts b/test/menu.spec.ts
index f162f89..913cde8 100644
--- a/test/menu.spec.ts
+++ b/test/menu.spec.ts
@@ -19,14 +19,14 @@ let electronApp: ElectronApplication;
 let page: Page;
 let worker: Page;
 let example_file: any
-
+// find the latest build in the out directory
+const latestBuild = findLatestBuild('./dist')
+// parse the directory and find paths and other info
+const appInfo = parseElectronApp(latestBuild)
+// set the CI environment variable to true
+process.env.CI = 'e2e';
 test.beforeAll(async () => {
-  // find the latest build in the out directory
-  const latestBuild = findLatestBuild('./dist')
-  // parse the directory and find paths and other info
-  const appInfo = parseElectronApp(latestBuild)
-  // set the CI environment variable to true
-  process.env.CI = 'e2e';
+
   electronApp = await electron.launch({
     args: [appInfo.main],
     executablePath: appInfo.executable,
diff --git a/test/record.creation.spec.ts b/test/record.creation.spec.ts
index 4ef2bff..1f83000 100644
--- a/test/record.creation.spec.ts
+++ b/test/record.creation.spec.ts
@@ -19,14 +19,15 @@ let electronApp: ElectronApplication;
 let page: Page;
 let worker: Page;
 let example_file: any
+// find the latest build in the out directory
+const latestBuild = findLatestBuild('./dist')
+// parse the directory and find paths and other info
+const appInfo = parseElectronApp(latestBuild)
+// set the CI environment variable to true
+process.env.CI = 'e2e';
 
 test.beforeAll(async () => {
-  // find the latest build in the out directory
-  const latestBuild = findLatestBuild('./dist')
-  // parse the directory and find paths and other info
-  const appInfo = parseElectronApp(latestBuild)
-  // set the CI environment variable to true
-  process.env.CI = 'e2e';
+
   electronApp = await electron.launch({
     args: [appInfo.main],
     executablePath: appInfo.executable,
@@ -36,7 +37,6 @@ test.beforeAll(async () => {
     }
 
   })
-
   // Get the path for the example file we want to load
   example_file = await ipcMainInvokeHandler(electronApp, 'getAudio')
   await stubMultipleDialogs(electronApp, [
@@ -134,13 +134,16 @@ test('Can create/edit a manual record', async () => {
   console.log('record creation test: before 4th expect')
   expect(callCount).toBe('3');
   await page.keyboard.press('ControlOrMeta+s');
-  await page.waitForTimeout(1000);
-  const filename = await page.locator('#filename span.filename');
-  // File name is blue - saved
-  const hasClass = await filename.evaluate(el => el.classList.contains('text-info'));
-  
-  console.log('record creation test: before final expect', hasClass)
-  expect(hasClass).toBe(true)
+  await page.waitForFunction(
+    ({selector, className}) => {
+      const element = document.querySelector(selector);
+      return element && element.classList.contains(className);
+    },
+    { timeout: 5000, // Adjust timeout as needed
+    selector: '#filename span.filename', // Selector
+    className: 'text-info'} // Class to wait for
+  );
+
   console.log('record creation test: complete')
 })