diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index a0c5db3..1222883 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -20,6 +20,9 @@ let chyron_text_02 = ''
 let chyron_text_03 = ''
 let chyron_text_04 = ''
 
+export let chyron_font_size = 2.75;
+export let chyron_font_weight = 600;
+
 </script>
 
 <div class="main">
@@ -37,17 +40,25 @@ let chyron_text_04 = ''
 		<input bind:value={chyron_text_03} placeholder="{chyron_text_03}">
 		<input bind:value={chyron_text_04} placeholder="{chyron_text_04}">
 		</p>
+		<input type=range bind:value={chyron_font_size}>
+		<input type=range bind:value={chyron_font_weight}>
+
 	</div>
 </div>
 <p></p>
 <div class="horizontal">
 	<!-- delay affects text starting point offset-->
    <Ticker pausing=false duration=60 delay=-10>
-	   {chyron_text_01}
-	   {chyron_text_02}
-	   {chyron_text_03}
-	   {chyron_text_04}
-   </Ticker>
+		<span
+			style="font-size: {chyron_font_size}em;
+			font-weight: {chyron_font_weight}
+			">
+			{chyron_text_01}
+			{chyron_text_02}
+		    {chyron_text_03}
+	   		{chyron_text_04}
+		</span>
+	      </Ticker>
 </div>
 
 
@@ -61,10 +72,8 @@ let chyron_text_04 = ''
 		margin:30px 5px;
 	}
     .horizontal{
-        padding:424px;
+        /* padding:426px;*/
 		font-family: Verdana, sans-serif;
-		font-weight: 600;
-		font-size: 2.75em;
 		background: rgba(30, 24, 150, 0.4);
         @keyframes horizontal {
 		100% { transform: translateX(-50%); }