diff --git a/Views/Home/Index.cshtml b/Views/Home/Index.cshtml
index 17a0ef4..a511be5 100644
--- a/Views/Home/Index.cshtml
+++ b/Views/Home/Index.cshtml
@@ -2,100 +2,31 @@
     ViewData["Title"] = "Home Page";
 
     string user_name = Environment.GetEnvironmentVariable("APPSETTING_name");
-
+    string badge_color = Environment.GetEnvironmentVariable("APPSETTING_color");
+    string font_size = Environment.GetEnvironmentVariable("APPSETTING_size");
     string user_message1 = "";
     string user_message2 = "";
 
-    if(string.IsNullOrEmpty(user_name))
-    {
+    if(string.IsNullOrEmpty(user_name)) {
         user_name = "HELLO USER!";
-        user_message1 = @"You have successfully compled the task!";
+        user_message1 = @"You have successfully completed the task!";
         user_message2 = @"Your app is up, running and connected to source control.";
     }
-    else
-    {
-        user_message1 = @"Hello " + user_name + " nice to meet you.";
-        user_message2 = @"Thanks for adding the app setting!";
+    else {
+        user_message1 = @"Hola " + user_name + " un gusto conocerlos en la officina de MS.";
+        user_message2 = @"Gracias por venir a mi platica";
     }
+
+    badge_color = string.IsNullOrEmpty(badge_color)?"#00a4ef":badge_color;
+    font_size =  string.IsNullOrEmpty(font_size)? "1em":font_size;
 }
 
 <div style="display: inline-flex;">
 
-    <section id="Badge">
-        <div style="
-            background: #00a4ef;
-            margin: 10px;
-            margin-left:auto;
-            margin-right:auto;
-            border-radius: 10px;
-            width: 200px;
-            height: 310px;
-            overflow: hidden;
-            box-shadow: 10px 10px 5px #888;
-            border-width: .75px;
-            border-color: #00a4ef;
-            border-style: solid;
-        ">
-            <div id="punch-hole" style="
-            width: 50px;
-            height: 11px;
-            background: white;
-            border-radius: 5px;
-            margin-left: auto;
-            margin-right: auto;
-            margin-top: 17px;
-            margin-bottom: 10px;
-            box-shadow: inset 0 0 5px #000000;
-            ">
-            </div>
-
-            <div id="circle" style="
-            width: 120px;
-            height: 120px;
-            background: white;
-            border-radius: 50%;
-            margin-left: auto;
-            margin-right: auto;
-            margin-bottom: 20px;
-            ">
-                <img src="/images/alien.svg">
-            </div>
-
-            <div id="bottom" style="
-            background-color: #fff;
-            width: 100%;
-            height: 130px; ">
-
-
-                <div title="@user_name" style="
-                    padding: 10px;
-                    width: 190px;
-                    height: 100px;
-                    overflow: hidden;
-                    font-weight: 500;
-                    font-size: 25px;
-                    text-overflow: ellipsis;
-                    white-space: nowrap;
-                    ">@user_name</div>
+    <div style="padding: 25px; width: 70%; 
+                margin-left: 25px; margin-top: auto; margin-bottom: auto; ">
             
-                    <img style="
-                    top: -25px;
-                    position: relative;"
-                    src="/images/ms-logo.svg" >
-            
-        </div>
-    </section>
-
-    <div style="
-        padding: 25px;
-        width: 70%;
-        margin-left: 25px;
-        margin-top: auto;
-        margin-bottom: auto;
-        ">
-            <div style="
-                font-size: 16px;
-                font-weight: bold; ">
+            <div style="font-size: @font_size; font-weight: bold; ">
                 <p>
                     @user_message1
                 </p>
@@ -104,7 +35,43 @@
                 </p>
             </div>
     </div>
+    
+    <section id="Badge">
+        <div style="background: @badge_color; margin: 10px;
+                    margin-left:auto; margin-right:auto;
+                    border-radius: 10px; width: 200px;
+                    height: 310px; overflow: hidden;
+                    box-shadow: 10px 10px 5px #888; border-width: .75px;
+                    border-color: @badge_color; border-style: solid; ">
+            
+            <div id="punch-hole" 
+                style="width: 50px; height: 11px;
+                       background: white; border-radius: 5px;
+                       margin-left: auto; margin-right: auto;
+                       margin-top: 17px; margin-bottom: 10px;
+                       box-shadow: inset 0 0 5px #000000; ">
+            </div>
 
-</div>
+            <div id="circle" 
+                style="width: 120px; height: 120px;
+                        background: white; border-radius: 50%;
+                        margin-left: auto; margin-right: auto; margin-bottom: 20px;">
+                <img src="/images/Alien.svg">
+            </div>
 
+            <div id="bottom" 
+                style="background-color: #fff; width: 100%; height: 130px; ">
 
+                <div title="@user_name" 
+                    style="padding: 10px; width: 190px;
+                           height: 100px; overflow: hidden;
+                           font-weight: 500;  font-size: 25px;
+                           text-overflow: ellipsis; white-space: nowrap;">@user_name
+                </div>
+            
+                <img style=" top: -25px; position: relative;"
+                        src="/images/ms-logo.svg" >
+            </div>
+        </div>
+    </section>
+</div>