From bba2f28bcf896d983f52e111581ce2a65da9bc7c Mon Sep 17 00:00:00 2001
From: RDeck <rdeck@keymotive.net>
Date: Thu, 29 May 2025 12:18:47 -0400
Subject: [PATCH] !

---
 .vs/SummerBestWebForm2/v17/.suo               | Bin 65536 -> 65024 bytes
 .../v17/DocumentLayout.backup.json            |   2 +-
 .../v17/DocumentLayout.json                   |   2 +-
 Components/Pages/Home.razor                   | 634 +++++++++---------
 4 files changed, 327 insertions(+), 311 deletions(-)

diff --git a/.vs/SummerBestWebForm2/v17/.suo b/.vs/SummerBestWebForm2/v17/.suo
index f4be0fc499a9f2cb9f84e2746674daabdfdf2acb..24838c2700021343b6d2e63feee5f8dd94335c99 100644
GIT binary patch
delta 110
zcmZo@U}^ZnJi$Pgi2(`(7#K`|OlBbd_y7NYkSOy;UwJ0hgiH3}TQ?Un{bptrNc|lF
fWU^JP6r8~bQUL-o2lj#3n}4l;FN#h0D4PWU0Nota

delta 108
zcmZqp!`#roGQnW7K{}_100V<G0|Nsy5dZuC|38poVBF{{&&0Z6%fEjsHWxDeW@eqx
lrw(GWRjd?T%Lq~d0x}1V0@;e2f31HnicR<^o5i9(OaMa&A@l$M

diff --git a/.vs/SummerBestWebForm2/v17/DocumentLayout.backup.json b/.vs/SummerBestWebForm2/v17/DocumentLayout.backup.json
index 15bff8d..882bfef 100644
--- a/.vs/SummerBestWebForm2/v17/DocumentLayout.backup.json
+++ b/.vs/SummerBestWebForm2/v17/DocumentLayout.backup.json
@@ -72,7 +72,7 @@
               "RelativeDocumentMoniker": "Components\\Pages\\Home.razor",
               "ToolTip": "C:\\Repos\\SummerBestWebForm2\\Components\\Pages\\Home.razor",
               "RelativeToolTip": "Components\\Pages\\Home.razor",
-              "ViewState": "AgIAAK0BAAAAAAAAAAAcwMUBAAAhAAAAAAAAAA==",
+              "ViewState": "AgIAAJgBAAAAAAAAAAAcwL4BAAAAAAAAAAAAAA==",
               "Icon": "ae27a6b0-e345-4288-96df-5eaf394ee369.000759|",
               "WhenOpened": "2025-05-29T13:04:23.98Z",
               "EditorCaption": ""
diff --git a/.vs/SummerBestWebForm2/v17/DocumentLayout.json b/.vs/SummerBestWebForm2/v17/DocumentLayout.json
index 15bff8d..882bfef 100644
--- a/.vs/SummerBestWebForm2/v17/DocumentLayout.json
+++ b/.vs/SummerBestWebForm2/v17/DocumentLayout.json
@@ -72,7 +72,7 @@
               "RelativeDocumentMoniker": "Components\\Pages\\Home.razor",
               "ToolTip": "C:\\Repos\\SummerBestWebForm2\\Components\\Pages\\Home.razor",
               "RelativeToolTip": "Components\\Pages\\Home.razor",
-              "ViewState": "AgIAAK0BAAAAAAAAAAAcwMUBAAAhAAAAAAAAAA==",
+              "ViewState": "AgIAAJgBAAAAAAAAAAAcwL4BAAAAAAAAAAAAAA==",
               "Icon": "ae27a6b0-e345-4288-96df-5eaf394ee369.000759|",
               "WhenOpened": "2025-05-29T13:04:23.98Z",
               "EditorCaption": ""
diff --git a/Components/Pages/Home.razor b/Components/Pages/Home.razor
index c3a9aa0..3f21d8a 100644
--- a/Components/Pages/Home.razor
+++ b/Components/Pages/Home.razor
@@ -8,173 +8,173 @@
 
 @if (ShowWizard)
 {
-  <div class="container">
-    <div class="row">
-      <div class="col-12">
-        <TelerikWizard @bind-Value="@Value" OnFinish="OnFinishHandler" Width="100%" Height="95vh" Class="sbWizard" StepperPosition=WizardStepperPosition.Top>
-          <WizardSteps>
-            <WizardStep Label="Introduction" Icon="@SvgIcon.Globe" OnChange="@OnAudienceChoiceStepChange" Valid="@IsAudienceChoiceValid">
-              <Content>
-                <TelerikForm Model="@cardType" @ref="@IntroForm">
-                  <FormItems>
-                    <FormItem>
-                      <Template>
-                        <div class="container">
-                          <div class="row">
-                            <div class="col-12 px-sm-5 mb-2">
-                              <h1>KeyMotive's Summer Growth Program</h1>
-                              <div class="px-sm-5 mb-2">
-                                <p>It's time for our Summer Growth Program!<br />If you're looking to kick off your summer season with a wildly successful campgaign, then you've come to the right place!</p>
-                                <p>
-                                  Using this wizard, choose your target audience, decide what media you'd like to mail, choose from a few suggested designs (or request a custom design from our
-                                  creative team), and that's it!
-                                </p>
-                                <p>Let us handle the rest!</p>
-                              </div>
-                              <div>
-                                <img src="/img/7ccdfcc7-f91b-497e-8c19-ebb3a4021ea3.png" class="img-fluid" />
-                              </div>
-                              <div class="px-sm-5 mb-2 text-start">
-                                Your audience choices are:
-                                <ul>
-                                  <li>A list of your <strong class="text-primary">Very Best Customers</strong> (always a heavy-hitting campaign!)</li>
-                                  <li>
-                                    A list composed of <strong class="text-primary">Great Prospects</strong> near your shop, as well as a mix of formerly-Great Customers that you
-                                    <strong class="text-primary">haven't seen during the past 8 months</strong>.
-                                  </li>
-                                </ul>
-                              </div>
-                              <div class="px-sm-5 text-start">
-                                <strong>Please Select:</strong>
-                                <TelerikRadioGroup Data="@audiences"
-                                @bind-Value="@audienceType"
-                                ValueField="@nameof(AudienceType.AudienceDescription)"
-                                TextField="@nameof(AudienceType.AudienceDescription)">
-                                </TelerikRadioGroup>
+      <div class="container">
+        <div class="row">
+          <div class="col-12">
+            <TelerikWizard @bind-Value="@Value" OnFinish="OnFinishHandler" Width="100%" Height="95vh" Class="sbWizard" StepperPosition=WizardStepperPosition.Top>
+              <WizardSteps>
+                <WizardStep Label="Introduction" Icon="@SvgIcon.Globe" OnChange="@OnAudienceChoiceStepChange" Valid="@IsAudienceChoiceValid">
+                  <Content>
+                    <TelerikForm Model="@cardType" @ref="@IntroForm">
+                      <FormItems>
+                        <FormItem>
+                          <Template>
+                            <div class="container">
+                              <div class="row">
+                                <div class="col-12 px-sm-5 mb-2">
+                                  <h1>KeyMotive's Summer Growth Program</h1>
+                                  <div class="px-sm-5 mb-2">
+                                    <p>It's time for our Summer Growth Program!<br />If you're looking to kick off your summer season with a wildly successful campgaign, then you've come to the right place!</p>
+                                    <p>
+                                      Using this wizard, choose your target audience, decide what media you'd like to mail, choose from a few suggested designs (or request a custom design from our
+                                      creative team), and that's it!
+                                    </p>
+                                    <p>Let us handle the rest!</p>
+                                  </div>
+                                  <div>
+                                    <img src="/img/7ccdfcc7-f91b-497e-8c19-ebb3a4021ea3.png" class="img-fluid" />
+                                  </div>
+                                  <div class="px-sm-5 mb-2 text-start">
+                                    Your audience choices are:
+                                    <ul>
+                                      <li>A list of your <strong class="text-primary">Very Best Customers</strong> (always a heavy-hitting campaign!)</li>
+                                      <li>
+                                        A list composed of <strong class="text-primary">Great Prospects</strong> near your shop, as well as a mix of formerly-Great Customers that you
+                                        <strong class="text-primary">haven't seen during the past 8 months</strong>.
+                                      </li>
+                                    </ul>
+                                  </div>
+                                  <div class="px-sm-5 text-start">
+                                    <strong>Please Select:</strong>
+                                    <TelerikRadioGroup Data="@audiences"
+                                    @bind-Value="@audienceType"
+                                    ValueField="@nameof(AudienceType.AudienceDescription)"
+                                    TextField="@nameof(AudienceType.AudienceDescription)">
+                                    </TelerikRadioGroup>
+                                  </div>
+                                </div>
                               </div>
                             </div>
-                          </div>
-                        </div>
-                      </Template>
-                    </FormItem>
-                  </FormItems>
-                  <FormButtons>
+                          </Template>
+                        </FormItem>
+                      </FormItems>
+                      <FormButtons>
                     @* Need this here to avoid addition of random submit button *@
-                  </FormButtons>
-                </TelerikForm>
-              </Content>
-            </WizardStep>
+                      </FormButtons>
+                    </TelerikForm>
+                  </Content>
+                </WizardStep>
             @*                                   *@
             @* Step 1 - plastic card vs postcard *@
             @*                                   *@
-            <WizardStep Label="Card Type" Icon="@SvgIcon.EnvelopeBox" OnChange="@OnCardChoiceStepChange" Valid="@IsCardChoiceValid">
-              <Content>
-                <TelerikForm Model="@cardType" @ref="@cardTypeForm">
-                  <FormItems>
-                    <FormItem>
-                      <Template>
-                        <div class="container">
-                          <div class="row">
-                            <div class="col-12">
-                              <h1 class="text-center">Step 1 - Choose a Card Type</h1>
-                            </div>
-                            <div class="col-12 text-center mb-3">
-                              <TelerikButtonGroup SelectionMode="@ButtonGroupSelectionMode.Single">
-                                <ButtonGroupToggleButton @bind-Selected="@isPlasticCard">Plastic Card</ButtonGroupToggleButton>
-                                <ButtonGroupToggleButton @bind-Selected="@isPostcard">Postcard</ButtonGroupToggleButton>
-                              </TelerikButtonGroup>
-                            </div>
+                <WizardStep Label="Card Type" Icon="@SvgIcon.EnvelopeBox" OnChange="@OnCardChoiceStepChange" Valid="@IsCardChoiceValid">
+                  <Content>
+                    <TelerikForm Model="@cardType" @ref="@cardTypeForm">
+                      <FormItems>
+                        <FormItem>
+                          <Template>
+                            <div class="container">
+                              <div class="row">
+                                <div class="col-12">
+                                  <h1 class="text-center">Step 1 - Choose a Card Type</h1>
+                                </div>
+                                <div class="col-12 text-center mb-3">
+                                  <TelerikButtonGroup SelectionMode="@ButtonGroupSelectionMode.Single">
+                                    <ButtonGroupToggleButton @bind-Selected="@isPlasticCard">Plastic Card</ButtonGroupToggleButton>
+                                    <ButtonGroupToggleButton @bind-Selected="@isPostcard">Postcard</ButtonGroupToggleButton>
+                                  </TelerikButtonGroup>
+                                </div>
                             @* Preview information about the selected card type*@
                             @if (isPlasticCard)
                             {
-                              <div class="col-sm-4 mb-3 text-start">
-                                <h4>Very Popular Plastic Card Mailer!</h4>
-                                <ul>
-                                  <li>As thick as a typical credit card!</li>
-                                  <li>Large size piece (8&frac14; x 4 inches)</li>
-                                  <li>Coupons pop out, offering great convenience for your customers!</li>
-                                  <li>Leave it to us - we select, print, sort and mail for just <strong class="text-primary text-nowrap">$1.02 each</strong></li>
-                                </ul>
-                              </div>
-                              <div class="col-sm-8 text-center mb-3">
-                                <img class="img-fluid" src="/img/1181c4aa-4f3f-4eb4-8d5d-7eff0131d5f2.png" />
-                              </div>
+                                      <div class="col-sm-4 mb-3 text-start">
+                                        <h4>Very Popular Plastic Card Mailer!</h4>
+                                        <ul>
+                                          <li>As thick as a typical credit card!</li>
+                                          <li>Large size piece (8&frac14; x 4 inches)</li>
+                                          <li>Coupons pop out, offering great convenience for your customers!</li>
+                                          <li>Leave it to us - we select, print, sort and mail for just <strong class="text-primary text-nowrap">$1.02 each</strong></li>
+                                        </ul>
+                                      </div>
+                                      <div class="col-sm-8 text-center mb-3">
+                                        <img class="img-fluid" src="/img/1181c4aa-4f3f-4eb4-8d5d-7eff0131d5f2.png" />
+                                      </div>
                             }
                             else
                             {
-                              <div class="col-sm-4 mb-3 text-start">
-                                <h4>Premium Postcard Really Stands Out in the Mailbox</h4>
-                                <ul>
-                                  <li>Premium paper, Jumbo-Sized (8&frac12; x 6 inches)</li>
-                                  <li>UV gloss-coated</li>
-                                  <li>Choose from our selection, or ask for a custom design!</li>
-                                  <li>Full service - select, print, sort, mail for just <strong class="text-primary text-nowrap">79&#162; each</strong></li>
-                                </ul>
-                              </div>
-                              <div class="col-sm-8 text-center mb-3">
-                                <img class="img-fluid" src="/img/ad5a2b69-a493-429b-9edd-8320ec1e9c33.png" />
-                              </div>
+                                      <div class="col-sm-4 mb-3 text-start">
+                                        <h4>Premium Postcard Really Stands Out in the Mailbox</h4>
+                                        <ul>
+                                          <li>Premium paper, Jumbo-Sized (8&frac12; x 6 inches)</li>
+                                          <li>UV gloss-coated</li>
+                                          <li>Choose from our selection, or ask for a custom design!</li>
+                                          <li>Full service - select, print, sort, mail for just <strong class="text-primary text-nowrap">79&#162; each</strong></li>
+                                        </ul>
+                                      </div>
+                                      <div class="col-sm-8 text-center mb-3">
+                                        <img class="img-fluid" src="/img/ad5a2b69-a493-429b-9edd-8320ec1e9c33.png" />
+                                      </div>
                             }
-                          </div>
-                        </div>
-                      </Template>
-                    </FormItem>
-                  </FormItems>
-                  <FormButtons>
+                              </div>
+                            </div>
+                          </Template>
+                        </FormItem>
+                      </FormItems>
+                      <FormButtons>
                     @* Need this here to avoid addition of random submit button *@
-                  </FormButtons>
-                </TelerikForm>
-              </Content>
-            </WizardStep>
+                      </FormButtons>
+                    </TelerikForm>
+                  </Content>
+                </WizardStep>
             @*                                *@
             @* Step 2 - selecting card design *@
             @*                                *@
-            <WizardStep Label="Card Design" Icon="@SvgIcon.MapMarkerTarget" OnChange="@OnDesignStepChange" Valid="@IsDesignChoiceValid">
-              <Content>
-                <TelerikForm Model="@custOptions" @ref="@customizationForm">
-                  <FormValidation>
-                    <DataAnnotationsValidator></DataAnnotationsValidator>
-                  </FormValidation>
-                  <FormItems>
-                    <FormItem>
-                      <Template>
-                        <div class="container">
-                          <div class="row">
-                            <div class="col-12">
-                              <h1 class="text-center">Choose a Design</h1>
-                            </div>
-                            <div class="col-12 text-center mb-3">
+                <WizardStep Label="Card Design" Icon="@SvgIcon.MapMarkerTarget" OnChange="@OnDesignStepChange" Valid="@IsDesignChoiceValid">
+                  <Content>
+                    <TelerikForm Model="@custOptions" @ref="@customizationForm">
+                      <FormValidation>
+                        <DataAnnotationsValidator></DataAnnotationsValidator>
+                      </FormValidation>
+                      <FormItems>
+                        <FormItem>
+                          <Template>
+                            <div class="container">
+                              <div class="row">
+                                <div class="col-12">
+                                  <h1 class="text-center">Choose a Design</h1>
+                                </div>
+                                <div class="col-12 text-center mb-3">
                               @* Button logic *@
-                              <div class="text-center">
-                                <TelerikButtonGroup SelectionMode="@ButtonGroupSelectionMode.Single">
+                                  <div class="text-center">
+                                    <TelerikButtonGroup SelectionMode="@ButtonGroupSelectionMode.Single">
                                   @if (isPlasticCard)
                                   {
-                                    <ButtonGroupToggleButton @bind-Selected="@designOne">Plastic Card 1</ButtonGroupToggleButton>
-                                    <ButtonGroupToggleButton @bind-Selected="@designTwo">Plastic Card 2</ButtonGroupToggleButton>
-                                    <ButtonGroupToggleButton @bind-Selected="@designThree">Plastic Card 3</ButtonGroupToggleButton>
-                                    <ButtonGroupToggleButton @bind-Selected="@designCustom">Custom Design</ButtonGroupToggleButton>
+                                            <ButtonGroupToggleButton @bind-Selected="@designOne">Plastic Card 1</ButtonGroupToggleButton>
+                                            <ButtonGroupToggleButton @bind-Selected="@designTwo">Plastic Card 2</ButtonGroupToggleButton>
+                                            <ButtonGroupToggleButton @bind-Selected="@designThree">Plastic Card 3</ButtonGroupToggleButton>
+                                            <ButtonGroupToggleButton @bind-Selected="@designCustom">Custom Design</ButtonGroupToggleButton>
                                   }
                                   else
                                   {
-                                    <ButtonGroupToggleButton @bind-Selected="@designOne">Postcard 1</ButtonGroupToggleButton>
-                                    <ButtonGroupToggleButton @bind-Selected="@designTwo">Postcard 2</ButtonGroupToggleButton>
-                                    <ButtonGroupToggleButton @bind-Selected="@designThree">Postcard 3</ButtonGroupToggleButton>
-                                    <ButtonGroupToggleButton @bind-Selected="@designCustom">Custom Design</ButtonGroupToggleButton>
+                                            <ButtonGroupToggleButton @bind-Selected="@designOne">Postcard 1</ButtonGroupToggleButton>
+                                            <ButtonGroupToggleButton @bind-Selected="@designTwo">Postcard 2</ButtonGroupToggleButton>
+                                            <ButtonGroupToggleButton @bind-Selected="@designThree">Postcard 3</ButtonGroupToggleButton>
+                                            <ButtonGroupToggleButton @bind-Selected="@designCustom">Custom Design</ButtonGroupToggleButton>
                                   }
-                                </TelerikButtonGroup>
-                                <br /><br />
+                                    </TelerikButtonGroup>
+                                    <br /><br />
                                 @* Card preview logic *@
                                 @if (designOne)
                                 {
                                   @if (isPostcard)
                                   {
-                                    <img src="/img/Postcard1_Front.png" class="img-fluid" alt="Back" />
-                                    <img src="/img/Postcard1_Back.png" class="img-fluid" alt="Front" />
+                                                <img src="/img/Postcard1_Front.png" class="img-fluid" alt="Back" />
+                                                <img src="/img/Postcard1_Back.png" class="img-fluid" alt="Front" />
                                   }
                                   else
                                   {
-                                    <img src="/img/Plastic1_Back.png" class="img-fluid" alt="Back" />
-                                    <img src="/img/Plastic1_Front.png" class="img-fluid" alt="Front" />
+                                                <img src="/img/Plastic1_Back.png" class="img-fluid" alt="Back" />
+                                                <img src="/img/Plastic1_Front.png" class="img-fluid" alt="Front" />
 
                                   }
                                 }
@@ -182,184 +182,186 @@
                                 {
                                   @if (isPostcard)
                                   {
-                                    <img src="/img/Postcard2_Front.png" class="img-fluid" alt="Back" />
-                                    <img src="/img/Postcard2_Back.png" class="img-fluid" alt="Front" />
+                                                <img src="/img/Postcard2_Front.png" class="img-fluid" alt="Back" />
+                                                <img src="/img/Postcard2_Back.png" class="img-fluid" alt="Front" />
                                   }
                                   else
                                   {
-                                    <img src="/img/Plastic2_Back.png" class="img-fluid" alt="Back" />
-                                    <img src="/img/Plastic2_Front.png" class="img-fluid" alt="Front" />
+                                                <img src="/img/Plastic2_Back.png" class="img-fluid" alt="Back" />
+                                                <img src="/img/Plastic2_Front.png" class="img-fluid" alt="Front" />
                                   }
                                 }
                                 else if (designThree)
                                 {
                                   @if (isPostcard)
                                   {
-                                    <img src="/img/Postcard3_Front.png" class="img-fluid" alt="Back" />
-                                    <img src="/img/Postcard3_Back.png" class="img-fluid" alt="Front" />
+                                                <img src="/img/Postcard3_Front.png" class="img-fluid" alt="Back" />
+                                                <img src="/img/Postcard3_Back.png" class="img-fluid" alt="Front" />
                                   }
                                   else
                                   {
-                                    <img src="/img/Plastic3_Back.png" class="img-fluid" alt="Back" />
-                                    <img src="/img/Plastic3_Front.png" class="img-fluid" alt="Front" />
+                                                <img src="/img/Plastic3_Back.png" class="img-fluid" alt="Back" />
+                                                <img src="/img/Plastic3_Front.png" class="img-fluid" alt="Front" />
                                   }
                                 }
                                 else if (designCustom)
                                 {
-                                  <div class="d-sm-flex justify-content-around">
-                                    <div class="px-5">
-                                      <h4 class="mb-5">If you have your own idea in mind, or you would like to try another design, our creative design team will make it happen!</h4>
-                                    </div>
-                                    <div class="px-5">
-                                      <p class="fst-italic">When you're asked for "additional comments," just give us an idea of what you have in mind and our customer care team will have some ideas
-                                        ready when we call you!
-                                      </p>
-                                    </div>
-                                  </div>
-                                  <div>
+                                          <div class="d-sm-flex justify-content-around">
+                                            <div class="px-5">
+                                              <h4 class="mb-5">If you have your own idea in mind, or you would like to try another design, our creative design team will make it happen!</h4>
+                                            </div>
+                                            <div class="px-5">
+                                              <p class="fst-italic">When you're asked for "additional comments," just give us an idea of what you have in mind and our customer care team will have some ideas
+                                                ready when we call you!
+                                              </p>
+                                            </div>
+                                          </div>
+                                          <div>
                                     @if (isPostcard)
                                     {
-                                      <img src="/img/cfeb51c5-5373-44b5-be19-dadea452cc41.png" class="img-fluid" />
+                                                  <img src="/img/cfeb51c5-5373-44b5-be19-dadea452cc41.png" class="img-fluid" />
                                     }
                                     else
                                     {
-                                      <img src="/img/a41f648d-6b39-41f1-bbe5-084fb8a71a30.png" class="img-fluid" />
+                                                  <img src="/img/a41f648d-6b39-41f1-bbe5-084fb8a71a30.png" class="img-fluid" />
                                     }
-                                  </div>
+                                          </div>
                                 }
+                                  </div>
+                                </div>
                               </div>
                             </div>
-                          </div>
-                        </div>
-                      </Template>
-                    </FormItem>
-                  </FormItems>
-                  <FormButtons />
-                </TelerikForm>
-              </Content>
-            </WizardStep>
+                          </Template>
+                        </FormItem>
+                      </FormItems>
+                      <FormButtons />
+                    </TelerikForm>
+                  </Content>
+                </WizardStep>
             @*                                                        *@
             @* Step 3 - For postcards, choose a verse and a signature *@
             @*                                                        *@            
-            <WizardStep Label="Customization" OnChange="@OnMessagingStepChange" Valid="@isMessagingValid">
-              <Content>
-                <TelerikForm Model="@messagingOptions" @ref="@messagingForm">
-                  <FormItems>
-                    <FormItem>
-                      <Template>
-                        <div class="container">
-                          <div class="row">
+                <WizardStep Label="Customization" OnChange="@OnMessagingStepChange" Valid="@isMessagingValid">
+                  <Content>
+                    <TelerikForm Model="@messagingOptions" @ref="@messagingForm">
+                      <FormItems>
+                        <FormItem>
+                          <Template>
+                            <div class="container">
+                              <div class="row">
                             @if (isPlasticCard)
                             {
-                              <div class="col-12">
-                                <h4>No customization needed. Please proceed to logo selection.</h4>
-                              </div>
+                                      <div class="col-12">
+                                        <h4>No customization needed. Please proceed to logo selection.</h4>
+                                      </div>
                             }
                             else
                             {
-                              <div class="col-12">
-                                <h4 class="mb-3">Please Select a Verse</h4>
-                                <TelerikButtonGroup SelectionMode="@ButtonGroupSelectionMode.Single" Class="vertical-buttons block-buttons mb-5">
-                                  <ButtonGroupToggleButton @bind-Selected="@verseOne">Option 1</ButtonGroupToggleButton>
-                                  <ButtonGroupToggleButton @bind-Selected="@verseTwo">Option 2</ButtonGroupToggleButton>
-                                  <ButtonGroupToggleButton @bind-Selected="@verseThree">Option 3</ButtonGroupToggleButton>
-                                </TelerikButtonGroup>
+                                      <div class="col-12">
+                                        <h4 class="mb-3">Please Select a Verse</h4>
+                                        <TelerikButtonGroup SelectionMode="@ButtonGroupSelectionMode.Single" Class="vertical-buttons block-buttons mb-5">
+                                          <ButtonGroupToggleButton @bind-Selected="@verseOne">Option 1</ButtonGroupToggleButton>
+                                          <ButtonGroupToggleButton @bind-Selected="@verseTwo">Option 2</ButtonGroupToggleButton>
+                                          <ButtonGroupToggleButton @bind-Selected="@verseThree">Option 3</ButtonGroupToggleButton>
+                                        </TelerikButtonGroup>
                                 @if (verseOne)
                                 {
-                                  <p class="fst-italic">Thank you for making our success possible.</p>
-                                  <p class="fst-italic">We appreciate loyal customers like you and look forward to continuing to be your complete auto repair, service and tire center!</p>
+                                              <p class="fst-italic">Thank you for making our success possible.</p>
+                                              <p class="fst-italic">We appreciate loyal customers like you and look forward to continuing to be your complete auto repair, service and tire center!</p>
                                 }
                                 else if (verseTwo)
                                 {
-                                  <p class="fst-italic">We appreciate the trust you have shown in us and look forward to working with you in the future!</p>
+                                              <p class="fst-italic">We appreciate the trust you have shown in us and look forward to working with you in the future!</p>
                                 }
                                 else if (verseThree)
                                 {
-                                  <p class="fst-italic">We want you to know that we truly appreciate your business and will make every effort possible to continue to provide you with excellent car care.</p>
+                                              <p class="fst-italic">We want you to know that we truly appreciate your business and will make every effort possible to continue to provide you with excellent car care.</p>
                                 }
-                              </div>
-                              <div class="col-12">
-                                <hr class="m-5" />
-                                <h4 class="mb-3">Please Select a Signature</h4>
-                                <TelerikButtonGroup SelectionMode="@ButtonGroupSelectionMode.Single" Class="mb-5">
-                                  <ButtonGroupToggleButton @bind-Selected="@sigOne">From Your Friends</ButtonGroupToggleButton>
-                                  <ButtonGroupToggleButton @bind-Selected="@sigTwo">Name, Title, Phone Number</ButtonGroupToggleButton>
-                                  <ButtonGroupToggleButton @bind-Selected="@sigThree">Custom</ButtonGroupToggleButton>
-                                </TelerikButtonGroup>
+                                      </div>
+                                      <div class="col-12">
+                                        <hr class="m-5" />
+                                        <h4 class="mb-3">Please Select a Signature</h4>
+                                        <TelerikButtonGroup SelectionMode="@ButtonGroupSelectionMode.Single" Class="mb-5">
+                                          <ButtonGroupToggleButton @bind-Selected="@sigOne">From Your Friends</ButtonGroupToggleButton>
+                                          <ButtonGroupToggleButton @bind-Selected="@sigTwo">Name, Title, Phone Number</ButtonGroupToggleButton>
+                                          <ButtonGroupToggleButton @bind-Selected="@sigThree">Custom</ButtonGroupToggleButton>
+                                        </TelerikButtonGroup>
                                 @if (sigOne)
                                 {
-                                  <p>From your friends at <strong>TopSpeed Tire</strong><br /><i>(your location name)</i></p>
-                                  <p><strong>(888) 555-3712</strong><br /><i>(your location phone number)</i></p>
+                                              <p>From your friends at <strong>TopSpeed Tire</strong><br /><i>(your location name)</i></p>
+                                              <p><strong>(888) 555-3712</strong><br /><i>(your location phone number)</i></p>
                                 }
                                 else if (sigTwo)
                                 {
-                                  <label style="display:block" for="CustomName" class="k-label k-form-label text-center">Name:</label>
-                                  <TelerikTextBox Class="mb-3" Id="CustomName" @bind-Value="@customName" MaxLength="50" Width="25rem"></TelerikTextBox>
-                                  <label style="display:block" for="CustomTitle" class="k-label k-form-label text-center">Title:</label>
-                                  <TelerikTextBox Class="mb-3" Id="CustomTitle" @bind-Value="@customTitle" MaxLength="50" Width="25rem"></TelerikTextBox>
-                                  <label style="display:block" for="CustomPhone" class="k-label k-form-label text-center">Phone:</label>
-                                  <TelerikTextBox Class="mb-3" Id="CustomPhone" @bind-Value="@customPhone" MaxLength="15" Width="20rem"></TelerikTextBox>
+                                              <label style="display:block" for="CustomName" class="k-label k-form-label text-center">Name:</label>
+                                              <TelerikTextBox Class="mb-3" Id="CustomName" @bind-Value="@customName" MaxLength="50" Width="25rem"></TelerikTextBox>
+                                              <label style="display:block" for="CustomTitle" class="k-label k-form-label text-center">Title:</label>
+                                              <TelerikTextBox Class="mb-3" Id="CustomTitle" @bind-Value="@customTitle" MaxLength="50" Width="25rem"></TelerikTextBox>
+                                              <label style="display:block" for="CustomPhone" class="k-label k-form-label text-center">Phone:</label>
+                                              <TelerikTextBox Class="mb-3" Id="CustomPhone" @bind-Value="@customPhone" MaxLength="15" Width="20rem"></TelerikTextBox>
                                 }
                                 else if (sigThree)
                                 {
-                                  <br />
-                                  <label style="display:block" for="CustomSignature" class="text-center">Custom Message (max 30 character/line up to 4 lines)</label><br />
-                                  <TelerikTextArea Id="CustomSignature" @bind-Value="@customSignature" Rows="4" Cols="35" MaxLength="120"></TelerikTextArea>
+                                              <br />
+                                              <label style="display:block" for="CustomSignature" class="text-center">Custom Message (max 30 character/line up to 4 lines)</label>
+
+                                        <br />
+                                              <TelerikTextArea Id="CustomSignature" @bind-Value="@customSignature" Rows="4" Cols="35" MaxLength="120"></TelerikTextArea>
                                 }
-                              </div>
+                                      </div>
                             }
-                            <div class="col-12 text-center mb-3">
+                                <div class="col-12 text-center mb-3">
+                                </div>
+                              </div>
                             </div>
-                          </div>
-                        </div>
-                      </Template>
-                    </FormItem>
-                  </FormItems>
-                  <FormButtons />
-                </TelerikForm>
-              </Content>
-            </WizardStep>
+                          </Template>
+                        </FormItem>
+                      </FormItems>
+                      <FormButtons />
+                    </TelerikForm>
+                  </Content>
+                </WizardStep>
             @*                         *@
             @* Step 4 - Logo Selection *@
             @*                         *@
-            <WizardStep Label="Logos" OnChange="@OnLogoStepChange" Valid="@isLogoValid">
-              <Content>
-                <TelerikForm Model="@logoOptions"
-                @ref="@logoForm">
-                  <FormItems>
-                    <FormItem>
-                      <Template>
-                        <div class="container">
-                          <div class="row">
-                            <div class="col-12">
-                            <TelerikCheckBox Id="goodyearBox" @bind-Value="@goodyear" />
-                            <label for="goodyearBox">Goodyear Logo</label>
-                            <TelerikCheckBox Id="michelinBox" @bind-Value="@michelin" />
-                            <label for="michelinBox">Michelin Logo</label>
-                            <TelerikCheckBox Id="customBox" @bind-Value="@custom" />
-                            <label for="customBox">Custom Logo</label>
-                            </div>
-                            <div class="col-12 mt-5">
-                            @if (goodyear)
-                            {
-                              <div class="p-5">
-                                <img src="/img/goodyear.png" class="img-fluid" />
+                <WizardStep Label="Logos" OnChange="@OnLogoStepChange" Valid="@isLogoValid">
+                  <Content>
+                    <TelerikForm Model="@logoOptions"
+                    @ref="@logoForm">
+                      <FormItems>
+                        <FormItem>
+                          <Template>
+                            <div class="container">
+                              <div class="row">
+                                <div class="col-12">
+                                  <TelerikCheckBox Id="goodyearBox" @bind-Value="@goodyear" />
+                                  <label for="goodyearBox">Goodyear Logo</label>
+                                  <TelerikCheckBox Id="michelinBox" @bind-Value="@michelin" />
+                                  <label for="michelinBox">Michelin Logo</label>
+                                  <TelerikCheckBox Id="customBox" @bind-Value="@custom" />
+                                  <label for="customBox">Custom Logo</label>
+                                </div>
+                                <div class="col-12 mt-5">
+                              @if (goodyear)
+                              {
+                                        <div class="p-5">
+                                          <img src="/img/goodyear.png" class="img-fluid" />
+                                        </div>
+                              }
+                              @if (michelin)
+                              {
+                                        <div class="p-5">
+                                          <img src="/img/michelin.png" class="img-fluid" />
+                                        </div>
+                              }
+                              @if (custom)
+                              {
+                                        <div class="p-5">
+                                          <img src="/img/6784cef1-9ed9-4c91-94bc-5e7a267b5a4f.png" class="img-fluid" />
+                                        </div>
+                              }
+                                </div>
                               </div>
-                            }
-                            @if (michelin)
-                            {
-                              <div class="p-5">
-                                <img src="/img/michelin.png" class="img-fluid" />
-                              </div>
-                            }
-                            @if (custom)
-                            {
-                              <div class="p-5">
-                                <img src="/img/6784cef1-9ed9-4c91-94bc-5e7a267b5a4f.png" class="img-fluid" />
-                              </div>
-                            }
-                            </div>
-                            </div>
                             </div>
                           </Template>
                         </FormItem>
@@ -378,50 +380,50 @@
                       <FormItems>
                         <FormItem>
                           <Template>
-                        <div class="container">
-                          <div class="row">
-                        @if (isPlasticCard)
-                        {
-                                <div class="col-12">
-                                  <h4 class="my-3">Please select two (2) full size offers:</h4>
-                                  <TelerikButtonGroup SelectionMode="@ButtonGroupSelectionMode.Multiple">
-                                    <ButtonGroupToggleButton @bind-Selected="@bigOffers[0]"><img src="/img/A1.png" /></ButtonGroupToggleButton>
-                                    <ButtonGroupToggleButton @bind-Selected="@bigOffers[1]"><img src="/img/A2.png" /></ButtonGroupToggleButton>
-                                    <ButtonGroupToggleButton @bind-Selected="@bigOffers[2]"><img src="/img/A3.png" /></ButtonGroupToggleButton>
-                                    <ButtonGroupToggleButton @bind-Selected="@bigOffers[3]"><img src="/img/A4.png" /></ButtonGroupToggleButton>
-                                    <ButtonGroupToggleButton @bind-Selected="@bigOffers[4]"><img src="/img/A5.png" /></ButtonGroupToggleButton>
-                                    <ButtonGroupToggleButton @bind-Selected="@bigOffers[5]"><img src="/img/A6.png" /></ButtonGroupToggleButton>
-                                  </TelerikButtonGroup>
-                                </div>
-                                <div class="col-12">
-                                  <h4 class="my-3">And four (4) half-sized offers:</h4>
-                                  <TelerikButtonGroup SelectionMode="@ButtonGroupSelectionMode.Multiple">
-                                    <ButtonGroupToggleButton @bind-Selected="@smallOffers[0]"><img src="/img/B1.png" /></ButtonGroupToggleButton>
-                                    <ButtonGroupToggleButton @bind-Selected="@smallOffers[1]"><img src="/img/B2.png" /></ButtonGroupToggleButton>
-                                    <ButtonGroupToggleButton @bind-Selected="@smallOffers[2]"><img src="/img/B3.png" /></ButtonGroupToggleButton>
-                                    <ButtonGroupToggleButton @bind-Selected="@smallOffers[3]"><img src="/img/B4.png" /></ButtonGroupToggleButton>
-                                    <ButtonGroupToggleButton @bind-Selected="@smallOffers[4]"><img src="/img/B5.png" /></ButtonGroupToggleButton>
-                                    <ButtonGroupToggleButton @bind-Selected="@smallOffers[5]"><img src="/img/B6.png" /></ButtonGroupToggleButton>
-                                  </TelerikButtonGroup>
-                                  <br />
-                                  <TelerikButtonGroup SelectionMode="@ButtonGroupSelectionMode.Multiple">
-                                    <ButtonGroupToggleButton @bind-Selected="@smallOffers[6]"><img src="/img/B7.png" /></ButtonGroupToggleButton>
-                                    <ButtonGroupToggleButton @bind-Selected="@smallOffers[7]"><img src="/img/B8.png" /></ButtonGroupToggleButton>
-                                    <ButtonGroupToggleButton @bind-Selected="@smallOffers[8]"><img src="/img/B9.png" /></ButtonGroupToggleButton>
-                                    <ButtonGroupToggleButton @bind-Selected="@smallOffers[9]"><img src="/img/B10.png" /></ButtonGroupToggleButton>
-                                    <ButtonGroupToggleButton @bind-Selected="@smallOffers[10]"><img src="/img/B11.png" /></ButtonGroupToggleButton>
-                                    <ButtonGroupToggleButton @bind-Selected="@smallOffers[11]"><img src="/img/B12.png" /></ButtonGroupToggleButton>
-                                  </TelerikButtonGroup>
-                          </div>
-                        }
-                        else
-                        {
-                            <div class="col-12 m-5">
-                              <h4>No offers needed! Please proceed to the next step!</h4>
+                            <div class="container">
+                              <div class="row">
+                            @if (isPlasticCard)
+                            {
+                                      <div class="col-12">
+                                        <h4 class="my-3">Please select two (2) full size offers:</h4>
+                                        <TelerikButtonGroup SelectionMode="@ButtonGroupSelectionMode.Multiple">
+                                          <ButtonGroupToggleButton @bind-Selected="@bigOffers[0]"><img src="/img/A1.png" /></ButtonGroupToggleButton>
+                                          <ButtonGroupToggleButton @bind-Selected="@bigOffers[1]"><img src="/img/A2.png" /></ButtonGroupToggleButton>
+                                          <ButtonGroupToggleButton @bind-Selected="@bigOffers[2]"><img src="/img/A3.png" /></ButtonGroupToggleButton>
+                                          <ButtonGroupToggleButton @bind-Selected="@bigOffers[3]"><img src="/img/A4.png" /></ButtonGroupToggleButton>
+                                          <ButtonGroupToggleButton @bind-Selected="@bigOffers[4]"><img src="/img/A5.png" /></ButtonGroupToggleButton>
+                                          <ButtonGroupToggleButton @bind-Selected="@bigOffers[5]"><img src="/img/A6.png" /></ButtonGroupToggleButton>
+                                        </TelerikButtonGroup>
+                                      </div>
+                                      <div class="col-12">
+                                        <h4 class="my-3">And four (4) half-sized offers:</h4>
+                                        <TelerikButtonGroup SelectionMode="@ButtonGroupSelectionMode.Multiple">
+                                          <ButtonGroupToggleButton @bind-Selected="@smallOffers[0]"><img src="/img/B1.png" /></ButtonGroupToggleButton>
+                                          <ButtonGroupToggleButton @bind-Selected="@smallOffers[1]"><img src="/img/B2.png" /></ButtonGroupToggleButton>
+                                          <ButtonGroupToggleButton @bind-Selected="@smallOffers[2]"><img src="/img/B3.png" /></ButtonGroupToggleButton>
+                                          <ButtonGroupToggleButton @bind-Selected="@smallOffers[3]"><img src="/img/B4.png" /></ButtonGroupToggleButton>
+                                          <ButtonGroupToggleButton @bind-Selected="@smallOffers[4]"><img src="/img/B5.png" /></ButtonGroupToggleButton>
+                                          <ButtonGroupToggleButton @bind-Selected="@smallOffers[5]"><img src="/img/B6.png" /></ButtonGroupToggleButton>
+                                        </TelerikButtonGroup>
+                                        <br />
+                                        <TelerikButtonGroup SelectionMode="@ButtonGroupSelectionMode.Multiple">
+                                          <ButtonGroupToggleButton @bind-Selected="@smallOffers[6]"><img src="/img/B7.png" /></ButtonGroupToggleButton>
+                                          <ButtonGroupToggleButton @bind-Selected="@smallOffers[7]"><img src="/img/B8.png" /></ButtonGroupToggleButton>
+                                          <ButtonGroupToggleButton @bind-Selected="@smallOffers[8]"><img src="/img/B9.png" /></ButtonGroupToggleButton>
+                                          <ButtonGroupToggleButton @bind-Selected="@smallOffers[9]"><img src="/img/B10.png" /></ButtonGroupToggleButton>
+                                          <ButtonGroupToggleButton @bind-Selected="@smallOffers[10]"><img src="/img/B11.png" /></ButtonGroupToggleButton>
+                                          <ButtonGroupToggleButton @bind-Selected="@smallOffers[11]"><img src="/img/B12.png" /></ButtonGroupToggleButton>
+                                        </TelerikButtonGroup>
+                                      </div>
+                            }
+                            else
+                            {
+                                      <div class="col-12 m-5">
+                                        <h4>No offers needed! Please proceed to the next step!</h4>
+                                      </div>
+                            }
+                              </div>
                             </div>
-                        }
-                        </div>
-                        </div>
                           </Template>
                         </FormItem>
                       </FormItems>
@@ -434,15 +436,18 @@
             @*                                          *@
                 <WizardStep Label="Location Info" OnChange="@OnLocationStepChange" Valid="@isLocationInfoValid">
                   <Content>
-                        <div class="container">
-                          <div class="row">
-                            <div class="col-12">
-                              <TelerikForm Model="@locationInfo" @ref="@locationForm" Columns="2" ColumnSpacing="25px">
-                                <FormButtons />
-                              </TelerikForm>
-                            </div>
-                          </div>
+                    <div class="container">
+                      <div class="row">
+                        <div class="col-12">
+                          <TelerikForm Model="@locationInfo" @ref="@locationForm" Columns="2" ColumnSpacing="25px">
+                            <FormButtons />
+                          </TelerikForm>
                         </div>
+                        <div class="col-12">
+
+                        </div>
+                      </div>
+                    </div>
                   </Content>
                 </WizardStep>
             @*                         *@
@@ -468,10 +473,10 @@
                                   <TelerikTextBox class="mb-3" Id="RequestedQuantity" @bind-Value="@requestedQuantity" MaxLength="6" Width="15rem"></TelerikTextBox>
                                   <label style="display:block" for="AdditionalComments" class="text-center mb-3">Additional Notes</label>
                                   <TelerikTextArea class="mb-3" Id="CustomSignature" @bind-Value="@additionalComments" Rows="8" Cols="100" MaxLength="2500"></TelerikTextArea>
-                                  </div>
                                 </div>
                               </div>
-                            </Template>
+                            </div>
+                          </Template>
                         </FormItem>
                       </FormItems>
                       <FormButtons />
@@ -484,3 +489,14 @@
         </div>
       </div>
 }
+else
+{
+                              <div class="container">
+                              <div class="row">
+                                <div class="col-12">
+                                  Thank you!
+                            </div>
+                            </div>
+                              </div>
+
+}
\ No newline at end of file