diff --git a/force-app/main/default/classes/getRecommendations.cls b/force-app/main/default/classes/getRecommendations.cls
index 2d78d66f..8b94f25d 100644
--- a/force-app/main/default/classes/getRecommendations.cls
+++ b/force-app/main/default/classes/getRecommendations.cls
@@ -3,7 +3,7 @@ public with sharing class getRecommendations {
   public static list<ServiceRecommendation> getRecommendations(id contactId) {
     Client_Profile__c CP = getProfile(contactId);
     List<Service__c> services = getRecommendationsServiceQuery.primaryQuery(CP);
-
+    System.debug('services' + services);
     // convert to ServiceRecommendation
     list<ServiceRecommendation> output = servicesToRecommendations(services);
 
diff --git a/force-app/main/default/lwc/serviceRecommendation/serviceRecommendation.css b/force-app/main/default/lwc/serviceRecommendation/serviceRecommendation.css
index 1e3c6715..fc95e90b 100644
--- a/force-app/main/default/lwc/serviceRecommendation/serviceRecommendation.css
+++ b/force-app/main/default/lwc/serviceRecommendation/serviceRecommendation.css
@@ -1,10 +1,22 @@
-.hiddenRecsDiv .parentCard .slds-card .slds-card_narrow{
-    border: 1px solid grey !important;
+.parentCard {
+    margin-top:0.5em !important;
+    margin-bottom:0.5em !important;
+    border:1px solid grey !important;
     border-radius:5px !important;
+    width: 100%;
+}
+
+.headerdv {
+    display: flex;
+}
+
+
+.headerText label {
+    font-size:10px;
 }
 
 .relevanceHeader {
-    font-size:13px;
+    font-size:14px;
     color: #006dcc !important;
 }
 
@@ -50,9 +62,15 @@
 
 .relevanceDiv {
     padding: 5px;
-    margin-right: 20px;
-    margin-top: 25px;
     border-radius: 5px;
     color:rgb(91, 90, 90);
 }
 
+footer {
+    padding: 1em;
+}
+
+.bodyList li {
+    padding-top: 0.5em;
+}
+
diff --git a/force-app/main/default/lwc/serviceRecommendation/serviceRecommendation.html b/force-app/main/default/lwc/serviceRecommendation/serviceRecommendation.html
index 55c7ecd1..d4e5d2a6 100644
--- a/force-app/main/default/lwc/serviceRecommendation/serviceRecommendation.html
+++ b/force-app/main/default/lwc/serviceRecommendation/serviceRecommendation.html
@@ -1,228 +1,227 @@
 <template>
-  <lightning-card
-    variant="Narrow"
-    key={servicerecommendation.ServiceId}
-    class="parentCard"
-  >
-    <div slot="title">
-      <p>
-        <a
-          href="#"
-          if:false={showRelevancePopover}
-          class="relevanceHeader"
-          onclick={handleRelevancePopover}
-          ><lightning-icon
-            class="slds-current-color"
-            size="xx-small"
-            icon-name="utility:chevronright"
-          ></lightning-icon
-          >Relevance {servicerecommendation.Relevance} %</a
-        >
-      </p>
-      <p>
-        <a
-          href="#"
-          if:true={showRelevancePopover}
-          class="relevanceHeader"
-          onclick={handleRelevancePopover}
-          ><lightning-icon
-            class="slds-current-color"
-            size="xx-small"
-            icon-name="utility:chevrondown"
-          ></lightning-icon
-          >Relevance {servicerecommendation.Relevance} %</a
-        >
-      </p>
-      <div if:true={showRelevancePopover} class="relevanceDiv">
-        <header>
-          <p>
-            Matched based on <br /><span class="slds-text-title_bold"
-              >{indicatorCount} qualifying factors:</span
-            >
-            <br />
-          </p>
-        </header>
-        <div
-          class="slds-size_1-of-1 slds-grid slds-wrap slds-text-body_regular factorsDiv"
-        >
-          <ul>
-            <template for:each={servicerecommendation.Indicators} for:item='ind'>
-              <div key={ind.IndicatorType}>
-                <li>
-                  <span class='boldText'>{ind.IndicatorType}</span>
-                </li>
-                <li>
-                  {ind.IndicatorValue}
-                </li>
+  <article key={servicerecommendation.ServiceId} class="slds-card parentCard">
+      <div class="slds-card__header slds-clearfix">
+          <div class="slds-float_left" slot="title">
+              <div class='relevancePara'>
+                <a
+                  href="#"
+                  if:false={showRelevancePopover}
+                  class="relevanceHeader"
+                  onclick={handleRelevancePopover}
+                  ><lightning-icon
+                    class="slds-current-color relevanceIcon"
+                    size="xx-small"
+                    icon-name="utility:chevronright"
+                  ></lightning-icon
+                  >Relevance {servicerecommendation.Relevance} %</a
+                >
               </div>
-            </template>
-          </ul>
-        </div>
-      </div>
-      <ul class="slds-list_horizontal iconNameDiv">
-        <!-- types of icons based on program type? -->
-        <li>
-          <lightning-icon
-            if:true={programTypeFood}
-            icon-name="custom:custom51"
-            size="medium"
-            alternative-text="Food"
-          ></lightning-icon>
-          <lightning-icon
-            if:true={programTypeEducation}
-            icon-name="custom:custom33"
-            size="medium"
-            alternative-text="Education"
-          ></lightning-icon>
-          <lightning-icon
-            if:true={programTypeHousing}
-            icon-name="custom:custom107"
-            size="medium"
-            alternative-text="Education"
-          ></lightning-icon>
-          <lightning-icon
-            if:true={programTypeGoods}
-            icon-name="custom:custom93"
-            size="medium"
-            alternative-text="Education"
-          ></lightning-icon>
-          <lightning-icon
-            if:true={programTypeMoney}
-            icon-name="custom:custom17"
-            size="medium"
-            alternative-text="Education"
-          ></lightning-icon>
-          <lightning-icon
-            if:true={programTypeTransit}
-            icon-name="custom:custom36"
-            size="medium"
-            alternative-text="Education"
-          ></lightning-icon>
-          <lightning-icon
-            if:true={programTypeHealth}
-            icon-name="custom:custom86"
-            size="medium"
-            alternative-text="Education"
-          ></lightning-icon>
-          <lightning-icon
-            if:true={programTypeCare}
-            icon-name="custom:custom94"
-            size="medium"
-            alternative-text="Education"
-          ></lightning-icon>
-          <lightning-icon
-            if:true={programTypeWork}
-            icon-name="custom:custom24"
-            size="medium"
-            alternative-text="Education"
-          ></lightning-icon>
-          <lightning-icon
-            if:true={programTypeLegal}
-            icon-name="custom:custom16"
-            size="medium"
-            alternative-text="Education"
-          ></lightning-icon>
-        </li>
-        <li>
-          <p class="slds-p-left_xx-small">
-            {servicerecommendation.ProgramName}
-            ({servicerecommendation.ProgramType})
-          </p>
-        </li>
-      </ul>
-    </div>
-    <div slot="actions">
-      <lightning-button-group>
-        <lightning-button
-          label="Share"
-          onclick={handleSendReferral}
-        ></lightning-button>
-        <lightning-button-icon
-          icon-name="utility:print"
-          variant="border-filled"
-          value={serviceid}
-          alternative-text="Print"
-          onclick={handlePrintReferral}
-        ></lightning-button-icon>
-        <lightning-button-menu if:false={servicerecommendation.Hidden} alternative-text="Show More">
-          <lightning-menu-item
-            value="Hide for this Contact"
-            label="Hide for this Contact"
-            onclick={handleHideForThisContact}
-          ></lightning-menu-item>
-          <lightning-menu-item
-            value="Hide for all Contacts"
-            label="Hide for all Contacts"
-            onclick={handleHideForAllContacts}
-          ></lightning-menu-item>
-        </lightning-button-menu>
-        <!-- when to show hide/unhide? -->
-        <lightning-button-menu if:true={servicerecommendation.Hidden} alternative-text="Show More">
-          <lightning-menu-item value="unhide for this Contact" label="Unhide for this Contact" onclick={handleUnhideForThisContact}></lightning-menu-item>
-          <lightning-menu-item value="unhide for all Contacts" label="Unhide for all Contacts" onclick={handleUnhideForAllContacts}></lightning-menu-item>
-
-        </lightning-button-menu>
-      </lightning-button-group>
-    </div>
-    <div class="slds-m-around_small">
-      <ul>
-        <li>
-          <p>Provided by: <a href="#">Org Name</a></p>
-        </li>
-        <li><p>{servicerecommendation.ProgramDescription}</p></li>
-        <template if:true={servicerecommendation.TodaysHours}>
-          <li>
-            <span class="slds-text-title_bold"
-              >Open until  &nbsp;
-              <lightning-formatted-date-time
-                hour="2-digit"
-                minute="2-digit"
-                time-zone="UTC"
-                value={servicerecommendation.TodaysHours.End_Time__c}
-              ></lightning-formatted-date-time></span
-            >&nbsp;&nbsp;&nbsp;<span class="slds-text-title_bold"
-              >{servicerecommendation.MailingStreet},
-              {servicerecommendation.MailingCity}</span
-            >
-          </li>
-        </template>
-        <li>
-          <span
-            ><a href="#">{servicerecommendation.Service.Phone__c}</a> * &nbsp;
-            <a href={servicerecommendation.Website}>Website</a></span
-          >
-        </li>
-      </ul>
+              <div>
+                <a
+                  href="#"
+                  if:true={showRelevancePopover}
+                  class="relevanceHeader"
+                  onclick={handleRelevancePopover}
+                  ><lightning-icon
+                    class="slds-current-color"
+                    size="xx-small"
+                    icon-name="utility:chevrondown"
+                  ></lightning-icon
+                  >Relevance {servicerecommendation.Relevance} %</a
+                >
+              </div>
+              <div if:true={showRelevancePopover} class="relevanceDiv">
+                <header>
+                  <p>
+                    Matched based on <br /><span class="slds-text-title_bold"
+                      >{indicatorCount} qualifying factors:</span
+                    >
+                    <br />
+                  </p>
+                </header>
+                <div
+                  class="slds-size_1-of-1 slds-grid slds-wrap slds-text-body_regular factorsDiv"
+                >
+                  <ul>
+                    <template for:each={servicerecommendation.Indicators} for:item='ind'>
+                      <div key={ind.IndicatorType}>
+                        <li>
+                          <span class='boldText'>{ind.IndicatorType}</span>
+                        </li>
+                        <li>
+                          {ind.IndicatorValue}
+                        </li>
+                      </div>
+                    </template>
+                  </ul>
+                </div>
+              </div>
+              <div class="headerdv">
+                <div class='headerIconDiv slds-p-top_xx-small'>
+                  <lightning-icon
+                    if:true={programTypeFood}
+                    icon-name="custom:custom51"
+                    size="medium"
+                    alternative-text="Food"
+                  ></lightning-icon>
+                  <lightning-icon
+                    if:true={programTypeEducation}
+                    icon-name="custom:custom33"
+                    size="medium"
+                    alternative-text="Education"
+                  ></lightning-icon>
+                  <lightning-icon
+                    if:true={programTypeHousing}
+                    icon-name="custom:custom107"
+                    size="medium"
+                    alternative-text="Housing"
+                  ></lightning-icon>
+                  <lightning-icon
+                    if:true={programTypeGoods}
+                    icon-name="custom:custom93"
+                    size="medium"
+                    alternative-text="Goods"
+                  ></lightning-icon>
+                  <lightning-icon
+                    if:true={programTypeMoney}
+                    icon-name="custom:custom17"
+                    size="medium"
+                    alternative-text="Money"
+                  ></lightning-icon>
+                  <lightning-icon
+                    if:true={programTypeTransit}
+                    icon-name="custom:custom36"
+                    size="medium"
+                    alternative-text="Transit"
+                  ></lightning-icon>
+                  <lightning-icon
+                    if:true={programTypeHealth}
+                    icon-name="custom:custom86"
+                    size="medium"
+                    alternative-text="Health"
+                  ></lightning-icon>
+                  <lightning-icon
+                    if:true={programTypeCare}
+                    icon-name="custom:custom94"
+                    size="medium"
+                    alternative-text="Care"
+                  ></lightning-icon>
+                  <lightning-icon
+                    if:true={programTypeWork}
+                    icon-name="custom:custom24"
+                    size="medium"
+                    alternative-text="Work"
+                  ></lightning-icon>
+                  <lightning-icon
+                    if:true={programTypeLegal}
+                    icon-name="custom:custom16"
+                    size="medium"
+                    alternative-text="Legal"
+                  ></lightning-icon>
+                </div>
+                <div class='headerText slds-p-left_medium'>
+                  <label>{servicerecommendation.ProgramType}</label>
+                  <p>{servicerecommendation.ProgramName}</p>
+                </div>
+              </div>
+            </div>
+            <div class="slds-float_right" slot="actions">
+              <lightning-button-group>
+                <lightning-button
+                  label="Share"
+                  onclick={handleSendReferral}
+                ></lightning-button>
+                <lightning-button-icon
+                  icon-name="utility:print"
+                  variant="border-filled"
+                  value={serviceid}
+                  alternative-text="Print"
+                  onclick={handlePrintReferral}
+                ></lightning-button-icon>
+                <lightning-button-menu if:false={servicerecommendation.Hidden} alternative-text="Show More">
+                  <lightning-menu-item
+                    value="Hide for this Contact"
+                    label="Hide for this Contact"
+                    onclick={handleHideForThisContact}
+                  ></lightning-menu-item>
+                  <lightning-menu-item
+                    value="Hide for all Contacts"
+                    label="Hide for all Contacts"
+                    onclick={handleHideForAllContacts}
+                  ></lightning-menu-item>
+                </lightning-button-menu>
+                <!-- when to show hide/unhide? -->
+                <lightning-button-menu if:true={servicerecommendation.Hidden} alternative-text="Show More">
+                  <lightning-menu-item value="unhide for this Contact" label="Unhide for this Contact" onclick={handleUnhideForThisContact}></lightning-menu-item>
+                  <lightning-menu-item value="unhide for all Contacts" label="Unhide for all Contacts" onclick={handleUnhideForAllContacts}></lightning-menu-item>
+        
+                </lightning-button-menu>
+              </lightning-button-group>
+            </div>
     </div>
-    <div slot="footer">
-      <!-- likes and comments -->
-      <div class="slds-clearfix">
-        <div class="slds-float_left">
-          <c-star-rating rating={servicerecommendation.Rating}></c-star-rating>
-        </div>
-        <div class="slds-float_right slds-p-top_x-small">
-          <a>{commentCount} Comments</a> |&nbsp;
-          <a href="#" onclick={handleShowAddComment}>Add Comment</a>
-        </div>
-      </div>
-
-      <div if:true={showAddComment}>
-        <div class="slds-clearfix">
-          <lightning-textarea
-            class="commentInput"
-            label="Add Comment"
-            value={newComment}
-            onblur={handleCommentChange}
-          ></lightning-textarea>
-          <div class="slds-float_right slds-p-top_small slds-p-bottom_small">
-            <lightning-button
-              title="Comments"
-              label="Add Comment"
-              onclick={handleAddComment}
-            ></lightning-button>
+    <div class="slds-media__body">
+        <div class="slds-m-around_small">
+            <ul class="bodyList">
+              <li>
+                <p>Provided by: <a href="#" onclick={handleAccountRedirect}>Org Name</a></p>
+              </li>
+              <li><p>{servicerecommendation.ProgramDescription}</p></li>
+              <template if:true={servicerecommendation.TodaysHours}>
+                <li>
+                  <span class="slds-text-title_bold"
+                    >Open until  &nbsp;
+                    <lightning-formatted-date-time
+                      hour="2-digit"
+                      minute="2-digit"
+                      time-zone="UTC"
+                      value={servicerecommendation.TodaysHours.End_Time__c}
+                    ></lightning-formatted-date-time></span
+                  >&nbsp;&nbsp;&nbsp;<span class="slds-text-title_bold"
+                    >{servicerecommendation.MailingStreet},
+                    {servicerecommendation.MailingCity}</span
+                  >
+                </li>
+              </template>
+              <li>
+                <span
+                  ><a href="#">{servicerecommendation.Service.Phone__c}</a> * &nbsp;
+                  <a href={servicerecommendation.Website}>Website</a></span
+                >
+              </li>
+            </ul>
           </div>
-        </div>
-      </div>
     </div>
-  </lightning-card>
+    <footer>
+        <div slot="footer">
+            <!-- likes and comments -->
+            <div class="slds-clearfix">
+              <div class="slds-float_left">
+                <c-star-rating rating={servicerecommendation.Rating}></c-star-rating>
+              </div>
+              <div class="slds-float_right slds-p-top_x-small">
+                <a>{commentCount} Comments</a> |&nbsp;
+                <a href="#" onclick={handleShowAddComment}>Add Comment</a>
+              </div>
+            </div>
+      
+            <div if:true={showAddComment}>
+              <div class="slds-clearfix">
+                <lightning-textarea
+                  class="commentInput"
+                  label="Add Comment"
+                  value={newComment}
+                  onblur={handleCommentChange}
+                ></lightning-textarea>
+                <div class="slds-float_right slds-p-top_small slds-p-bottom_small">
+                  <lightning-button
+                    title="Comments"
+                    label="Add Comment"
+                    onclick={handleAddComment}
+                  ></lightning-button>
+                </div>
+              </div>
+            </div>
+          </div>
+    </footer>
+  </article>
 </template>
diff --git a/force-app/main/default/lwc/serviceRecommendation/serviceRecommendation.js b/force-app/main/default/lwc/serviceRecommendation/serviceRecommendation.js
index 4cd28f08..6c4a6c2f 100644
--- a/force-app/main/default/lwc/serviceRecommendation/serviceRecommendation.js
+++ b/force-app/main/default/lwc/serviceRecommendation/serviceRecommendation.js
@@ -145,6 +145,11 @@ export default class ServiceRecommendation extends LightningElement {
             });
     }
 
+    handleAccountRedirect(){
+        let url = '/'+this.servicerecommendation.AccountId;
+        window.open(url);
+    }
+
     handleShowAddComment(){
         window.console.log('add comment');
 
diff --git a/force-app/main/default/lwc/serviceRecommendations/serviceRecommendations.css b/force-app/main/default/lwc/serviceRecommendations/serviceRecommendations.css
index 1f27624e..20304c50 100644
--- a/force-app/main/default/lwc/serviceRecommendations/serviceRecommendations.css
+++ b/force-app/main/default/lwc/serviceRecommendations/serviceRecommendations.css
@@ -6,19 +6,15 @@
 }
 
 .innerRecDiv {
-    margin-top:0.5em;
-    border: 1px solid grey;
-    border-radius:5px;
-    width: 100%;
+    margin-top:0.5em;    
+    height:40em;
 }
 
 .innerRecModalDiv {
-    margin:0.5em;
-    border: 1px solid grey;
-    border-radius:5px;
-    width: 100%;
+    height:25em;
 }
 
+
 .iconNameDiv {
     height: 40px;
     line-height: 40px;       
diff --git a/force-app/main/default/lwc/serviceRecommendations/serviceRecommendations.html b/force-app/main/default/lwc/serviceRecommendations/serviceRecommendations.html
index 1684c34b..eca0df97 100644
--- a/force-app/main/default/lwc/serviceRecommendations/serviceRecommendations.html
+++ b/force-app/main/default/lwc/serviceRecommendations/serviceRecommendations.html
@@ -21,11 +21,295 @@
                 </ul>
             </div>
             <div if:false={showRecommendations} class="slds-size_1-of-1 slds-grid slds-wrap slds-align_absolute-center">
-                <div class="slds-size_1-of-1 slds-align_absolute-center">
+                <div class="slds-size_1-of-1 slds-illustration slds-illustration_small">
+                    <svg class="slds-illustration__svg" viewBox="0 0 466 297" aria-hidden="true" >
+                        <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+                            <g transform="translate(-69.000000, -68.000000)">
+                                <g>
+                                    <g
+                                        transform="translate(455.000000, 172.000000) scale(-1, 1) translate(-455.000000, -172.000000) translate(377.000000, 153.000000)">
+                                        <polyline vector-effect="non-scaling-stroke" class="slds-illustration__stroke-secondary"
+                                            stroke-width="3" stroke-linecap="round" stroke-linejoin="round"
+                                            points="26 36 72.5 0 105.5 27"></polyline>
+                                        <polyline vector-effect="non-scaling-stroke" class="slds-illustration__stroke-secondary"
+                                            stroke-width="3" stroke-linecap="round" stroke-linejoin="round"
+                                            points="96 17 105.5 9 138 36"></polyline>
+                                        <path vector-effect="non-scaling-stroke" d="M0,36.5 L156,36.5"
+                                            class="slds-illustration__stroke-secondary" stroke-width="3" stroke-linecap="round"></path>
+                                        <path vector-effect="non-scaling-stroke"
+                                            d="M34.202166,22.8278095 L37.207834,33.1133915 L30.8916038,28.4131636 L32.2719085,22.8668 C32.4052855,22.3308624 32.9478721,22.0045226 33.4838096,22.1378996 C33.8288998,22.223781 34.102419,22.486469 34.202166,22.8278095 Z"
+                                            class="slds-illustration__fill-secondary"
+                                            transform="translate(34.049719, 27.610728) scale(-1, 1) translate(-34.049719, -27.610728) ">
+                                        </path>
+                                        <path vector-effect="non-scaling-stroke"
+                                            d="M28.9755366,18.8278095 L34.0379951,36.1518555 L29.5001232,33.2627202 L24.2782891,29.9851658 L27.0452792,18.8668 C27.1786561,18.3308624 27.7212427,18.0045226 28.2571802,18.1378996 C28.6022704,18.223781 28.8757896,18.486469 28.9755366,18.8278095 Z"
+                                            class="slds-illustration__fill-secondary"
+                                            transform="translate(29.158142, 27.129960) scale(-1, 1) translate(-29.158142, -27.129960) ">
+                                        </path>
+                                        <path vector-effect="non-scaling-stroke"
+                                            d="M134.935531,21.7547479 L139.204202,37 L130.811328,29.6057303 L133.009603,21.7547479 C133.158515,21.2229175 133.710367,20.9125013 134.242197,21.0614138 C134.57853,21.1555869 134.841358,21.4184152 134.935531,21.7547479 Z"
+                                            class="slds-illustration__fill-secondary"></path>
+                                    </g>
+                                    <g transform="translate(71.000000, 128.000000)">
+                                        <g>
+                                            <path vector-effect="non-scaling-stroke" d="M237,61.5 L249,61.5"
+                                                class="slds-illustration__stroke-secondary" stroke-width="3" stroke-linecap="round">
+                                            </path>
+                                            <path vector-effect="non-scaling-stroke" d="M0,61.5 L230,61.5"
+                                                class="slds-illustration__stroke-secondary" stroke-width="3" stroke-linecap="round">
+                                            </path>
+                                            <path vector-effect="non-scaling-stroke"
+                                                d="M34.9102011,32.0436939 L38.3925781,48.4296875 L26.453125,58.6445313 L32.9606296,32.0141932 C33.0917307,31.4776944 33.6329274,31.1490548 34.1694262,31.2801559 C34.5424771,31.3713162 34.8303699,31.6680556 34.9102011,32.0436939 Z"
+                                                class="slds-illustration__fill-secondary"></path>
+                                            <path vector-effect="non-scaling-stroke"
+                                                d="M191.962964,27.4391572 L198,49 L186.770218,39.1063642 L190.037036,27.4391572 C190.185948,26.9073269 190.7378,26.5969106 191.26963,26.7458231 C191.605963,26.8399963 191.868791,27.1028246 191.962964,27.4391572 Z"
+                                                class="slds-illustration__fill-secondary"></path>
+                                            <path vector-effect="non-scaling-stroke"
+                                                d="M39.9662349,37.3583594 L42.6016149,47.2410342 L40.7070312,48.7349783 L35,48.7349783 L38.0337651,37.3583594 C38.1760682,36.8247225 38.7240258,36.5074839 39.2576627,36.6497871 C39.6036917,36.7420615 39.8739605,37.0123303 39.9662349,37.3583594 Z"
+                                                class="slds-illustration__fill-secondary"></path>
+                                            <polyline vector-effect="non-scaling-stroke" class="slds-illustration__stroke-secondary"
+                                                stroke-width="3" stroke-linecap="round" stroke-linejoin="round"
+                                                points="25 61 99.5 0 157.5 45"></polyline>
+                                            <polyline vector-effect="non-scaling-stroke" class="slds-illustration__stroke-secondary"
+                                                stroke-width="3" stroke-linecap="round" stroke-linejoin="round"
+                                                points="140 30.9433962 157.5 16 212 60"></polyline>
+                                        </g>
+                                    </g>
+                                    <g transform="translate(145.000000, 69.000000)" class="slds-illustration__stroke-secondary"
+                                        stroke-linecap="round" stroke-width="3">
+                                        <g>
+                                            <path vector-effect="non-scaling-stroke"
+                                                d="M44,17.5 L63,17.5 C62.2789714,12.0723971 64.081543,7.53186978 68.4077148,3.87841797 C73.3754883,-0.195556641 79.2734375,0.717773438 82.440918,2.12353516 C85.6083984,3.52929687 87.9606934,5.46069336 89.5913086,9.10524041 C90.2822266,10.6397351 90.7517904,11.9379883 91,13">
+                                            </path>
+                                            <path vector-effect="non-scaling-stroke"
+                                                d="M83,20.5 C84.0558268,16.8461914 86.2227376,14.4572754 89.5007324,13.333252 C94.4177246,11.6472168 99.0800781,13.8925781 100.942383,16.1518555 C102.804687,18.4111328 103.39502,20.2260742 103.746582,22.1201172 C103.980957,23.3828125 104.06543,24.8427734 104,26.5 C108.141764,26.3313802 110.918945,27.1647135 112.331543,29 C114.040039,31.1936035 114.215332,33.817627 113.593018,35.75 C112.970703,37.682373 110.894531,40.5 107,40.5 L28,40.5">
+                                            </path>
+                                            <path vector-effect="non-scaling-stroke" d="M18,27.5 L83.0004985,27.5"></path>
+                                            <path vector-effect="non-scaling-stroke" d="M0,27.5 L8,27.5"></path>
+                                        </g>
+                                    </g>
+                                    <g transform="translate(297.000000, 109.000000)" class="slds-illustration__stroke-secondary"
+                                        stroke-linecap="round" stroke-width="3">
+                                        <path vector-effect="non-scaling-stroke"
+                                            d="M44,17.5 L63,17.5 C62.2789714,12.0723971 64.081543,7.53186978 68.4077148,3.87841797 C73.3754883,-0.195556641 79.2734375,0.717773438 82.440918,2.12353516 C85.6083984,3.52929687 87.9606934,5.46069336 89.5913086,9.10524041 C90.2822266,10.6397351 90.7517904,11.9379883 91,13">
+                                        </path>
+                                        <path vector-effect="non-scaling-stroke"
+                                            d="M83,20.5 C84.0558268,16.8461914 86.2227376,14.4572754 89.5007324,13.333252 C94.4177246,11.6472168 99.0800781,13.8925781 100.942383,16.1518555 C102.804687,18.4111328 103.39502,20.2260742 103.746582,22.1201172 C103.980957,23.3828125 104.06543,24.8427734 104,26.5 C108.141764,26.3313802 110.918945,27.1647135 112.331543,29 C114.040039,31.1936035 114.215332,33.817627 113.593018,35.75 C112.970703,37.682373 110.894531,40.5 107,40.5 L28,40.5">
+                                        </path>
+                                        <path vector-effect="non-scaling-stroke" d="M18,27.5 L83.0004985,27.5"></path>
+                                        <path vector-effect="non-scaling-stroke" d="M0,27.5 L8,27.5"></path>
+                                    </g>
+                                    <g transform="translate(113.000000, 75.000000)">
+                                        <g transform="translate(217.000000, 0.000000)">
+                                            <path vector-effect="non-scaling-stroke" d="M20.5,162.789062 L20.5,174.839062"
+                                                class="slds-illustration__stroke-primary" stroke-width="3" stroke-linecap="round">
+                                            </path>
+                                            <path vector-effect="non-scaling-stroke" d="M20.5,150.789062 L20.5,153.839063"
+                                                class="slds-illustration__stroke-primary" stroke-width="3" stroke-linecap="round">
+                                            </path>
+                                            <path vector-effect="non-scaling-stroke" d="M20.5,0.772022494 L20.5,111.841169"
+                                                class="slds-illustration__stroke-primary" stroke-width="3" stroke-linecap="round">
+                                            </path>
+                                            <circle vector-effect="non-scaling-stroke" class="slds-illustration__stroke-primary"
+                                                stroke-width="3" cx="20.5" cy="181" r="6"></circle>
+                                            <path vector-effect="non-scaling-stroke"
+                                                d="M20.5,188 C20.5,200 20.5,209.666667 20.5,217 C20.5,228 0.5,228 0.5,217 C0.5,209.666667 0.5,205.282924 0.5,203.848771 L7,211"
+                                                class="slds-illustration__stroke-primary" stroke-width="3" stroke-linecap="round">
+                                            </path>
+                                            <path vector-effect="non-scaling-stroke"
+                                                d="M20.5,128 C27.127417,128 32.5,125.627417 32.5,123 C32.5,116.372583 27.127417,111 20.5,111 C13.872583,111 8.5,116.372583 8.5,123 C8.5,126.627417 13.872583,128 20.5,128 Z"
+                                                class="slds-illustration__fill-primary"></path>
+                                        </g>
+                                        <g transform="translate(0.000000, 134.000000)" class="slds-illustration__stroke-secondary"
+                                            stroke-linecap="round" stroke-linejoin="round" stroke-width="3">
+                                            <path vector-effect="non-scaling-stroke"
+                                                d="M66.5016961,5.72253485 C59.2581641,7.22907384 54.7616802,0 54.7616802,0 L54.7530053,0 C54.7530053,0 51.3235326,5.94519033 44.2795231,5.94519033 C37.5304598,5.94519033 33.8262823,0 33.8262823,0 L33.8147158,0 C33.8147158,0 30.3910264,5.94519033 23.3470169,5.94519033 C16.5950619,5.94519033 12.8937761,0 12.8937761,0 L12.8822096,0 C12.8822096,0 7.08738399,7.34763065 0,5.84109166">
+                                            </path>
+                                            <path vector-effect="non-scaling-stroke"
+                                                d="M129.501696,5.72253485 C122.258164,7.22907384 117.76168,0 117.76168,0 L117.753005,0 C117.753005,0 114.323533,5.94519033 107.279523,5.94519033 C100.53046,5.94519033 96.8262823,0 96.8262823,0 L96.8147158,0 C96.8147158,0 93.3910264,5.94519033 86.3470169,5.94519033 C79.5950619,5.94519033 75.8937761,0 75.8937761,0 L75.8822096,0 C75.8822096,0 70.087384,7.34763065 63,5.84109166">
+                                            </path>
+                                            <path vector-effect="non-scaling-stroke"
+                                                d="M192.501696,5.72253485 C185.258164,7.22907384 180.76168,0 180.76168,0 L180.753005,0 C180.753005,0 177.323533,5.94519033 170.279523,5.94519033 C163.53046,5.94519033 159.826282,0 159.826282,0 L159.814716,0 C159.814716,0 156.391026,5.94519033 149.347017,5.94519033 C142.595062,5.94519033 138.893776,0 138.893776,0 L138.88221,0 C138.88221,0 133.087384,7.34763065 126,5.84109166">
+                                            </path>
+                                            <path vector-effect="non-scaling-stroke"
+                                                d="M259.501696,5.72253485 C252.258164,7.22907384 247.76168,0 247.76168,0 L247.753005,0 C247.753005,0 244.323533,5.94519033 237.279523,5.94519033 C230.53046,5.94519033 226.826282,0 226.826282,0 L226.814716,0 C226.814716,0 223.391026,5.94519033 216.347017,5.94519033 C209.595062,5.94519033 205.893776,0 205.893776,0 L205.88221,0 C205.88221,0 200.087384,7.34763065 193,5.84109166">
+                                            </path>
+                                            <path vector-effect="non-scaling-stroke"
+                                                d="M322.501696,5.72253485 C315.258164,7.22907384 310.76168,0 310.76168,0 L310.753005,0 C310.753005,0 307.323533,5.94519033 300.279523,5.94519033 C293.53046,5.94519033 289.826282,0 289.826282,0 L289.814716,0 C289.814716,0 286.391026,5.94519033 279.347017,5.94519033 C272.595062,5.94519033 268.893776,0 268.893776,0 L268.88221,0 C268.88221,0 263.087384,7.34763065 256,5.84109166">
+                                            </path>
+                                            <path vector-effect="non-scaling-stroke"
+                                                d="M209.501696,25.7225349 C202.258164,27.2290738 197.76168,20 197.76168,20 L197.753005,20 C197.753005,20 194.323533,25.9451903 187.279523,25.9451903 C180.53046,25.9451903 176.826282,20 176.826282,20 L176.814716,20 C176.814716,20 173.391026,25.9451903 166.347017,25.9451903 C159.595062,25.9451903 155.893776,20 155.893776,20 L155.88221,20 C155.88221,20 150.087384,27.3476307 143,25.8410917">
+                                            </path>
+                                            <path vector-effect="non-scaling-stroke"
+                                                d="M405.501696,5.72253485 C398.258164,7.22907384 393.76168,0 393.76168,0 L393.753005,0 C393.753005,0 390.323533,5.94519033 383.279523,5.94519033 C376.53046,5.94519033 372.826282,0 372.826282,0 L372.814716,0 C372.814716,0 369.391026,5.94519033 362.347017,5.94519033 C355.595062,5.94519033 351.893776,0 351.893776,0 L351.88221,0 C351.88221,0 346.087384,7.34763065 339,5.84109166">
+                                            </path>
+                                            <path vector-effect="non-scaling-stroke"
+                                                d="M335.501696,25.7225349 C328.258164,27.2290738 323.76168,20 323.76168,20 L323.753005,20 C323.753005,20 320.323533,25.9451903 313.279523,25.9451903 C306.53046,25.9451903 302.826282,20 302.826282,20 L302.814716,20 C302.814716,20 299.391026,25.9451903 292.347017,25.9451903 C285.595062,25.9451903 281.893776,20 281.893776,20 L281.88221,20 C281.88221,20 276.087384,27.3476307 269,25.8410917">
+                                            </path>
+                                        </g>
+                                    </g>
+                                    <g transform="translate(373.000000, 263.000000)">
+                                        <g transform="translate(1.000000, 46.000000)" fill="#FFFFFF">
+                                            <polygon vector-effect="non-scaling-stroke"
+                                                points="0.950683594 0.737792969 111.447754 0.737792969 118.248047 5 0.272460938 5 0.272460938 2.88110352">
+                                            </polygon>
+                                        </g>
+                                        <g>
+                                            <circle vector-effect="non-scaling-stroke" class="slds-illustration__stroke-secondary"
+                                                stroke-width="3" cx="9" cy="28" r="5"></circle>
+                                            <circle vector-effect="non-scaling-stroke" class="slds-illustration__stroke-secondary"
+                                                stroke-width="3" cx="30" cy="9" r="9"></circle>
+                                            <polygon vector-effect="non-scaling-stroke" class="slds-illustration__fill-secondary"
+                                                points="0.562988281 51 119.302246 51 123.863281 55 126.056641 62.4726562 114.675781 75.40625 22.7675781 75.40625 13.2597656 70.8320312 7.12890625 65.2988281">
+                                            </polygon>
+                                        </g>
+                                        <g transform="translate(0.000000, 25.000000)">
+                                            <path vector-effect="non-scaling-stroke"
+                                                d="M3.63585436,21.5 L109.778306,21.5 C114.1037,21.5 118.186223,23.4993351 120.838196,26.9163632 L127.5,35.5 L120.800658,45.365147 C118.194742,49.2025017 113.857343,51.5 109.218799,51.5 L31.3324501,51.5 C22.8638438,50.9724099 16.3582376,48.8029983 11.8156315,44.9917652 C7.80246311,41.6247288 4.13067554,35.1206458 0.800268738,25.479516 L0.800270003,25.4795155 C0.259297765,23.9134656 1.09028748,22.2053865 2.65633747,21.6644143 C2.97143994,21.5555661 3.30248145,21.5 3.63585436,21.5 Z"
+                                                class="slds-illustration__stroke-primary" stroke-width="3"></path>
+                                            <path vector-effect="non-scaling-stroke"
+                                                d="M142.258276,22.7729944 C138.748717,19.2634357 134.125785,17.4119596 128.242641,17.2426407 C128.41196,23.1257854 130.263436,27.7487171 133.772994,31.2582757 C137.282553,34.7678344 141.905485,36.6193105 147.788629,36.7886294 C147.619311,30.9054847 145.767834,26.282553 142.258276,22.7729944 Z"
+                                                class="slds-illustration__fill-primary"
+                                                transform="translate(138.015635, 27.015635) scale(-1, 1) translate(-138.015635, -27.015635) ">
+                                            </path>
+                                            <path vector-effect="non-scaling-stroke"
+                                                d="M142.258276,40.7729944 C138.748717,37.2634357 134.125785,35.4119596 128.242641,35.2426407 C128.41196,41.1257854 130.263436,45.7487171 133.772994,49.2582757 C137.282553,52.7678344 141.905485,54.6193105 147.788629,54.7886294 C147.619311,48.9054847 145.767834,44.282553 142.258276,40.7729944 Z"
+                                                class="slds-illustration__fill-primary"
+                                                transform="translate(138.015635, 45.015635) scale(-1, -1) translate(-138.015635, -45.015635) ">
+                                            </path>
+                                            <path vector-effect="non-scaling-stroke"
+                                                d="M81,-0.442349499 L81,21 C81,22.1045695 80.1045695,23 79,23 L61.5679702,23 C60.4634007,23 59.5679702,22.1045695 59.5679702,21 C59.5679702,20.49722 59.7573376,20.0128843 60.0983633,19.6434398 L79.2651966,-1.1206296 C79.6398003,-1.52645034 80.2724594,-1.5517567 80.6782801,-1.17715294 C80.8833623,-0.987846292 81,-0.721447545 81,-0.442349499 Z"
+                                                class="slds-illustration__fill-primary"></path>
+                                            <path vector-effect="non-scaling-stroke"
+                                                d="M50,49.3234743 L50,62 C50,63.1045695 49.1045695,64 48,64 L38.0175677,64 C36.9129982,64 36.0175677,63.1045695 36.0175677,62 C36.0175677,61.4777575 36.2218416,60.9762301 36.5867303,60.602608 L48.2845813,48.6247784 C48.6704604,48.2296635 49.3035811,48.2221765 49.698696,48.6080556 C49.8913701,48.796226 50,49.0541578 50,49.3234743 Z"
+                                                class="slds-illustration__fill-primary"
+                                                transform="translate(43.000000, 57.000000) scale(1, -1) translate(-43.000000, -57.000000) ">
+                                            </path>
+                                            <path vector-effect="non-scaling-stroke"
+                                                d="M100,49.3234743 L100,62 C100,63.1045695 99.1045695,64 98,64 L88.0175677,64 C86.9129982,64 86.0175677,63.1045695 86.0175677,62 C86.0175677,61.4777575 86.2218416,60.9762301 86.5867303,60.602608 L98.2845813,48.6247784 C98.6704604,48.2296635 99.3035811,48.2221765 99.698696,48.6080556 C99.8913701,48.796226 100,49.0541578 100,49.3234743 Z"
+                                                class="slds-illustration__fill-primary"
+                                                transform="translate(93.000000, 57.000000) scale(1, -1) translate(-93.000000, -57.000000) ">
+                                            </path>
+                                            <path vector-effect="non-scaling-stroke"
+                                                d="M35,21.1948242 C37.6666667,25.7316081 39,30.6666667 39,36 C39,41.3333333 37.6666667,46.6666667 35,52"
+                                                class="slds-illustration__stroke-primary" stroke-width="3"></path>
+                                            <path vector-effect="non-scaling-stroke" d="M39,35.5 L126,35.5"
+                                                class="slds-illustration__stroke-primary" stroke-width="3" stroke-linecap="round">
+                                            </path>
+                                            <circle vector-effect="non-scaling-stroke" class="slds-illustration__fill-primary" cx="20"
+                                                cy="31" r="4"></circle>
+                                        </g>
+                                    </g>
+                                    <g
+                                        transform="translate(244.500000, 274.000000) scale(-1, 1) translate(-244.500000, -274.000000) translate(190.000000, 251.000000)">
+                                        <g transform="translate(0.000000, 14.000000)" fill="#FFFFFF">
+                                            <polygon vector-effect="non-scaling-stroke"
+                                                points="91.2460938 8.703125 83.0820312 0.9765625 0.1171875 0.9765625 3.26757813 11.6367188">
+                                            </polygon>
+                                        </g>
+                                        <g transform="translate(1.000000, 19.000000)" class="slds-illustration__fill-secondary">
+                                            <path vector-effect="non-scaling-stroke"
+                                                d="M91.2900009,4 C89.5899629,2.01216046 88.5351253,1.01216046 88.1254883,1 C87.7158512,0.98783954 58.7033187,0.98783954 1.08789063,1 L0.375825695,4 L5.47167969,13.8271484 L20.2802734,18.5742188 C45.4534802,18.6571158 64.3715303,18.8351757 77.0344238,19.1083984 L83.2062537,18.4651753 L88.984375,13.8271484 L91.2900009,4 Z">
+                                            </path>
+                                        </g>
+                                        <g>
+                                            <path vector-effect="non-scaling-stroke"
+                                                d="M0.0988502724,15.5 L79.1988702,15.5 C83.8798149,15.5 88.2510535,17.8394159 90.8475744,21.7341973 L94.0247762,26.5 L90.8475744,31.2658027 C88.2510535,35.1605841 83.8798149,37.5 79.1988702,37.5 L20.4692206,37.5 C14.9277254,37.0242117 10.6576403,35.3888654 7.65896553,32.5939611 C4.66029072,29.7990569 2.14025231,24.1010698 0.0988502724,15.5 Z"
+                                                class="slds-illustration__stroke-primary" stroke-width="3" stroke-linecap="round"
+                                                stroke-linejoin="round"></path>
+                                            <path vector-effect="non-scaling-stroke"
+                                                d="M104.678431,16.8215691 C102.1744,14.317538 98.8265543,13.0459654 94.527077,13.027077 C94.5459654,17.3265543 95.817538,20.6743997 98.3215691,23.1784309 C100.8256,25.682462 104.173446,26.9540346 108.472923,26.972923 C108.454035,22.6734457 107.182462,19.3256003 104.678431,16.8215691 Z"
+                                                class="slds-illustration__fill-primary"
+                                                transform="translate(101.500000, 20.000000) scale(-1, 1) translate(-101.500000, -20.000000) ">
+                                            </path>
+                                            <path vector-effect="non-scaling-stroke"
+                                                d="M104.678431,29.8215691 C102.1744,27.317538 98.8265543,26.0459654 94.527077,26.027077 C94.5459654,30.3265543 95.817538,33.6743997 98.3215691,36.1784309 C100.8256,38.682462 104.173446,39.9540346 108.472923,39.972923 C108.454035,35.6734457 107.182462,32.3256003 104.678431,29.8215691 Z"
+                                                class="slds-illustration__fill-primary"
+                                                transform="translate(101.500000, 33.000000) scale(-1, -1) translate(-101.500000, -33.000000) ">
+                                            </path>
+                                            <path vector-effect="non-scaling-stroke"
+                                                d="M59,0.234153768 L59,17 L41.0828917,17 L57.2668751,-0.445940303 C57.6424807,-0.850833981 58.2752004,-0.874576673 58.6800941,-0.498971089 C58.8840774,-0.309742913 59,-0.0440844709 59,0.234153768 Z"
+                                                class="slds-illustration__fill-primary"></path>
+                                            <path vector-effect="non-scaling-stroke"
+                                                d="M37,35.544829 L37,43.326584 C37,44.4311535 36.1045695,45.326584 35,45.326584 L29.7979244,45.326584 C28.6933549,45.326584 27.7979244,44.4311535 27.7979244,43.326584 C27.7979244,42.8043415 28.0021983,42.3028141 28.367087,41.929192 L35.2845813,34.846133 C35.6704604,34.4510182 36.3035811,34.4435312 36.698696,34.8294103 C36.8913701,35.0175807 37,35.2755125 37,35.544829 Z"
+                                                class="slds-illustration__fill-primary"
+                                                transform="translate(32.398962, 40.663292) scale(1, -1) translate(-32.398962, -40.663292) ">
+                                            </path>
+                                            <path vector-effect="non-scaling-stroke"
+                                                d="M75,35.544829 L75,43.326584 C75,44.4311535 74.1045695,45.326584 73,45.326584 L67.7979244,45.326584 C66.6933549,45.326584 65.7979244,44.4311535 65.7979244,43.326584 C65.7979244,42.8043415 66.0021983,42.3028141 66.367087,41.929192 L73.2845813,34.846133 C73.6704604,34.4510182 74.3035811,34.4435312 74.698696,34.8294103 C74.8913701,35.0175807 75,35.2755125 75,35.544829 Z"
+                                                class="slds-illustration__fill-primary"
+                                                transform="translate(70.398962, 40.663292) scale(1, -1) translate(-70.398962, -40.663292) ">
+                                            </path>
+                                            <path vector-effect="non-scaling-stroke"
+                                                d="M24,15 C26,18.8333333 27,22.6666667 27,26.5 C27,30.3333333 26,34.1666667 24,38"
+                                                class="slds-illustration__stroke-primary" stroke-width="3"></path>
+                                            <path vector-effect="non-scaling-stroke" d="M29,26.5 L92,26.5"
+                                                class="slds-illustration__stroke-primary" stroke-width="3" stroke-linecap="round">
+                                            </path>
+                                            <circle vector-effect="non-scaling-stroke" class="slds-illustration__fill-primary" cx="15.5"
+                                                cy="22.5" r="2.5"></circle>
+                                        </g>
+                                    </g>
+                                    <g
+                                        transform="translate(174.500000, 341.000000) scale(-1, 1) translate(-174.500000, -341.000000) translate(120.000000, 318.000000)">
+                                        <g transform="translate(0.000000, 14.000000)" fill="#FFFFFF">
+                                            <polygon vector-effect="non-scaling-stroke"
+                                                points="91.2460938 8.703125 83.0820312 0.9765625 0.1171875 0.9765625 3.26757813 11.6367188">
+                                            </polygon>
+                                        </g>
+                                        <g transform="translate(1.000000, 19.000000)" class="slds-illustration__fill-secondary">
+                                            <path vector-effect="non-scaling-stroke"
+                                                d="M91.2900009,4 C89.5899629,2.01216046 88.5351253,1.01216046 88.1254883,1 C87.7158512,0.98783954 58.7033187,0.98783954 1.08789063,1 L0.375825695,4 L5.47167969,13.8271484 L20.2802734,18.5742188 C45.4534802,18.6571158 64.3715303,18.8351757 77.0344238,19.1083984 L83.2062537,18.4651753 L88.984375,13.8271484 L91.2900009,4 Z">
+                                            </path>
+                                        </g>
+                                        <g>
+                                            <path vector-effect="non-scaling-stroke"
+                                                d="M0.0988502724,15.5 L79.1988702,15.5 C83.8798149,15.5 88.2510535,17.8394159 90.8475744,21.7341973 L94.0247762,26.5 L90.8475744,31.2658027 C88.2510535,35.1605841 83.8798149,37.5 79.1988702,37.5 L20.4692206,37.5 C14.9277254,37.0242117 10.6576403,35.3888654 7.65896553,32.5939611 C4.66029072,29.7990569 2.14025231,24.1010698 0.0988502724,15.5 Z"
+                                                class="slds-illustration__stroke-primary" stroke-width="3" stroke-linecap="round"
+                                                stroke-linejoin="round"></path>
+                                            <path vector-effect="non-scaling-stroke"
+                                                d="M104.678431,16.8215691 C102.1744,14.317538 98.8265543,13.0459654 94.527077,13.027077 C94.5459654,17.3265543 95.817538,20.6743997 98.3215691,23.1784309 C100.8256,25.682462 104.173446,26.9540346 108.472923,26.972923 C108.454035,22.6734457 107.182462,19.3256003 104.678431,16.8215691 Z"
+                                                class="slds-illustration__fill-primary"
+                                                transform="translate(101.500000, 20.000000) scale(-1, 1) translate(-101.500000, -20.000000) ">
+                                            </path>
+                                            <path vector-effect="non-scaling-stroke"
+                                                d="M104.678431,29.8215691 C102.1744,27.317538 98.8265543,26.0459654 94.527077,26.027077 C94.5459654,30.3265543 95.817538,33.6743997 98.3215691,36.1784309 C100.8256,38.682462 104.173446,39.9540346 108.472923,39.972923 C108.454035,35.6734457 107.182462,32.3256003 104.678431,29.8215691 Z"
+                                                class="slds-illustration__fill-primary"
+                                                transform="translate(101.500000, 33.000000) scale(-1, -1) translate(-101.500000, -33.000000) ">
+                                            </path>
+                                            <path vector-effect="non-scaling-stroke"
+                                                d="M59,0.234153768 L59,17 L41.0828917,17 L57.2668751,-0.445940303 C57.6424807,-0.850833981 58.2752004,-0.874576673 58.6800941,-0.498971089 C58.8840774,-0.309742913 59,-0.0440844709 59,0.234153768 Z"
+                                                class="slds-illustration__fill-primary"></path>
+                                            <path vector-effect="non-scaling-stroke"
+                                                d="M37,35.544829 L37,43.326584 C37,44.4311535 36.1045695,45.326584 35,45.326584 L29.7979244,45.326584 C28.6933549,45.326584 27.7979244,44.4311535 27.7979244,43.326584 C27.7979244,42.8043415 28.0021983,42.3028141 28.367087,41.929192 L35.2845813,34.846133 C35.6704604,34.4510182 36.3035811,34.4435312 36.698696,34.8294103 C36.8913701,35.0175807 37,35.2755125 37,35.544829 Z"
+                                                class="slds-illustration__fill-primary"
+                                                transform="translate(32.398962, 40.663292) scale(1, -1) translate(-32.398962, -40.663292) ">
+                                            </path>
+                                            <path vector-effect="non-scaling-stroke"
+                                                d="M75,35.544829 L75,43.326584 C75,44.4311535 74.1045695,45.326584 73,45.326584 L67.7979244,45.326584 C66.6933549,45.326584 65.7979244,44.4311535 65.7979244,43.326584 C65.7979244,42.8043415 66.0021983,42.3028141 66.367087,41.929192 L73.2845813,34.846133 C73.6704604,34.4510182 74.3035811,34.4435312 74.698696,34.8294103 C74.8913701,35.0175807 75,35.2755125 75,35.544829 Z"
+                                                class="slds-illustration__fill-primary"
+                                                transform="translate(70.398962, 40.663292) scale(1, -1) translate(-70.398962, -40.663292) ">
+                                            </path>
+                                            <path vector-effect="non-scaling-stroke"
+                                                d="M24,15 C26,18.8333333 27,22.6666667 27,26.5 C27,30.3333333 26,34.1666667 24,38"
+                                                class="slds-illustration__stroke-primary" stroke-width="3"></path>
+                                            <path vector-effect="non-scaling-stroke" d="M29,26.5 L92,26.5"
+                                                class="slds-illustration__stroke-primary" stroke-width="3" stroke-linecap="round">
+                                            </path>
+                                            <circle vector-effect="non-scaling-stroke" class="slds-illustration__fill-primary" cx="15.5"
+                                                cy="22.5" r="2.5"></circle>
+                                        </g>
+                                    </g>
+                                </g>
+                            </g>
+                        </g>
+                    </svg>
+                </div>
+                <div class="slds-size_1-of-1 slds-align_absolute-center slds-p-around_medium">
                     <h3>No Recommendations Yet</h3>
                 </div>
-                <div class="slds-size_1-of-1 slds-align_absolute-center">
-                    <lightning-button label="Get Recommended Services" title="Recommendations" onclick={handleRequestRecommendations}></lightning-button>
+                <div class="slds-size_1-of-1 slds-align_absolute-center slds-p-around_medium">
+                    <lightning-button label="Get Recommended Services" variant="brand" title="Recommendations" onclick={handleRequestRecommendations}></lightning-button>
                 </div>
             </div>
 
@@ -39,23 +323,22 @@ <h3>No Recommendations Yet</h3>
             </div>
             <!-- show me filter -->
             <div class="slds-float_right slds-p-top_large">
-                <lightning-button-group>
-                    <lightning-button-menu alternative-text="Show More" variant="border-filled" icon-name="utility:sort">
-                        <lightning-menu-item checked value="rating" label="Matching Rating(high to low)" onclick={handleSortMenu}></lightning-menu-item>
-                        <lightning-menu-item value="distance" label="Distance to Contact Address" onclick={handleSortMenu}></lightning-menu-item>
-                        <lightning-menu-item value="popular" label="Most Popular" onclick={handleSortMenu}></lightning-menu-item>
-                    </lightning-button-menu>
-                    <lightning-button-icon icon-name="utility:filterList" variant="border-filled" title="Filter List" onclick={handleFilterList}></lightning-button-icon>
-                </lightning-button-group>
+
+                <lightning-button-menu alternative-text="Show More" variant="border-filled" icon-name="utility:sort">
+                    <lightning-menu-item checked value="rating" label="Client Rating" onclick={handleSortMenu}></lightning-menu-item>
+                    <lightning-menu-item value="distance" label="Distance to Contact Address" onclick={handleSortMenu}></lightning-menu-item>
+                    <lightning-menu-item value="popular" label="Relevance" onclick={handleSortMenu}></lightning-menu-item>
+                </lightning-button-menu>
+
             </div>
         </div>
             
         <div if:true={returnRecommendations} class="mapDiv slds-size_1-of-1">
-            <lightning-map map-markers={mapMarkers} zoom-level='10'>
+            <lightning-map list-view="hidden" map-markers={mapMarkers} zoom-level='10'>
 
             </lightning-map>
         </div>
-        <div if:true={returnRecommendations} class="innerRecDiv">
+        <div if:true={returnRecommendations} class="innerRecDiv slds-scrollable_y">
             <template for:each={returnRecommendations} for:item='recommendation'>
                 <c-service-recommendation key={recommendation.ServiceId} onflowlaunch={handleShare} servicerecommendation={recommendation} serviceid={recommendation.ServiceId} contactid={recordId}></c-service-recommendation>
                 
@@ -63,7 +346,7 @@ <h3>No Recommendations Yet</h3>
         </div>
 
         <!-- show hidden -->
-        <div class="hiddenRecsDiv" if:true={returnHiddenRecommendations}>
+        <div if:true={returnHiddenRecommendations} class="hiddenRecsDiv slds-scrollable_y" >
             <a href="#" if:false={showHiddenRecsList} onclick={handleShowHidden}><lightning-icon class="slds-current-color" size="xx-small" icon-name="utility:chevronright"> </lightning-icon>Hidden Recommendations ({returnHiddenRecommendationsCount})</a> 
             <a href="#" if:true={showHiddenRecsList} onclick={handleShowHidden}><lightning-icon class="slds-current-color" size="xx-small" icon-name="utility:chevrondown"> </lightning-icon>Hidden Recommendations ({returnHiddenRecommendationsCount})</a> 
             
@@ -76,7 +359,7 @@ <h3>No Recommendations Yet</h3>
 
 
     <!-- show map section -->
-    <template if:true={showExpandedMap} >
+    <template if:true={showExpandedMap} class="slds-scrollable_y">
         <section role="dialog" tabindex="-1" aria-label="Expanded Map View" aria-modal="true" aria-describedby="modal-content-id-1" class="slds-modal slds-fade-in-open">
             <div class="slds-modal__container mapModal">
                 <header class="slds-modal__header slds-modal__header_empty">
@@ -126,19 +409,18 @@ <h3>No Recommendations Yet</h3>
                                         </div>
                                         <!-- show me filter -->
                                         <div class="slds-float_right slds-p-top_large">
-                                            <lightning-button-group>
-                                                <lightning-button-menu alternative-text="Show More" variant="border-filled" icon-name="utility:sort">
-                                                    <lightning-menu-item checked value="rating" label="Matching Rating(high to low)" onclick={handleSortMenu}></lightning-menu-item>
-                                                    <lightning-menu-item value="distance" label="Distance to Contact Address" onclick={handleSortMenu}></lightning-menu-item>
-                                                    <lightning-menu-item value="popular" label="Most Popular" onclick={handleSortMenu}></lightning-menu-item>
-                                                </lightning-button-menu>
-                                                <lightning-button-icon icon-name="utility:filterList" variant="border-filled" title="Filter List" onclick={handleFilterList}></lightning-button-icon>
-                                            </lightning-button-group>
+
+                                            <lightning-button-menu alternative-text="Show More" variant="border-filled" icon-name="utility:sort">
+                                                <lightning-menu-item checked value="rating" label="Client Rating" onclick={handleSortMenu}></lightning-menu-item>
+                                                <lightning-menu-item value="distance" label="Distance to Contact Address" onclick={handleSortMenu}></lightning-menu-item>
+                                                <lightning-menu-item value="popular" label="Relevance" onclick={handleSortMenu}></lightning-menu-item>
+                                            </lightning-button-menu>
+
                                         </div>
                                     </div>
                                 
                             
-                                <div if:true={returnRecommendations} class="innerRecModalDiv">
+                                <div if:true={returnRecommendations} class="innerRecModalDiv slds-scrollable_y">
                                     <template for:each={returnRecommendations} for:item='recommendation'>
                                         <c-service-recommendation key={recommendation.ServiceId} servicerecommendation={recommendation} serviceid={recommendation.ServiceId} contactid={recordId}></c-service-recommendation>
                                         
@@ -146,7 +428,7 @@ <h3>No Recommendations Yet</h3>
                                 </div>
 
                                 <!-- show hidden -->
-                                <div class="hiddenRecsDiv" if:true={returnHiddenRecommendations}>
+                                <div if:true={returnHiddenRecommendations} class="hiddenRecsDiv slds-scrollable_y" >
                                         <a href="#" if:false={showHiddenRecsList} onclick={handleShowHidden}><lightning-icon class="slds-current-color" size="xx-small" icon-name="utility:chevronright"> </lightning-icon>Hidden Recommendations ({returnHiddenRecommendationsCount})</a> 
                                         <a href="#" if:true={showHiddenRecsList} onclick={handleShowHidden}><lightning-icon class="slds-current-color" size="xx-small" icon-name="utility:chevrondown"> </lightning-icon>Hidden Recommendations ({returnHiddenRecommendationsCount})</a> 
                                     
@@ -158,107 +440,8 @@ <h3>No Recommendations Yet</h3>
                             </div>
                         </div>
                         <div class="slds-col mapModalDiv width67">
-                            <lightning-map map-markers={mapMarkers} zoom-level='10'>
-
+                            <lightning-map list-view="hidden" map-markers={mapMarkers} zoom-level='10'>
                             </lightning-map>
-                        
-                            
-                
-                        </div>
-                        <div class="slds-col filterDiv slds-hide">
-                            <header class='slds-clearfix'>
-                                <div class='slds-float_left slds-p-around_small'>
-                                    <h2>Filters</h2>
-                                </div>
-                                <div class='slds-float_right slds-p-around_small'>
-                                    <lightning-button-icon icon-name="utility:close" variant="bare" onclick={handleCloseFilters} title="Close">
-                                    </lightning-button-icon>
-                                </div>
-                            </header>
-                            <div class="slds-size_1-of-1">
-                                <!-- search -->
-                            </div>
-
-                            <div class="slds-size_1-of-1 slds-p-left_medium">
-                                <div class='slds-clearfix'>
-                                    <div class='slds-float_left'>
-                                        <h3>Matching all of these filters(2)</h3>
-                                    </div>
-                                    <div class='slds-float_right'>
-                                        <a href="#" onclick={removeFilters}>Remove All</a>
-                                    </div>
-                                </div>
-                            </div>
-                            
-                            <a href="#" data-filter='openhours' onclick={changeFilter}>
-                                <div class="slds-size_1-of-1 slds-clearfix pillFilterDiv">
-                                    <div class='slds-float_left'>
-                                        <p class="slds-p-bottom_x-small greyText">Open Hours</p>
-                                        <p class="blackText">2 pm to 5 pm</p>
-                                    </div>
-                                    <div class='slds-float_right'>
-                                        <lightning-button-icon icon-name="utility:close" variant="bare" onclick={handleRemoveFilter} title="Close">
-                                        </lightning-button-icon>
-                                    </div>
-                                </div>
-                                
-                            </a>
-                            <div if:true={showHoursFilterChangePopover} class="hoursPopover slds-align_absolute-center">
-                                <section aria-label="Dialog title" aria-describedby="popover-body-id" class="slds-popover slds-nubbin_top" role="dialog">
-                                    <header class='slds-popover__header slds-clearfix'>
-                                        <div class='slds-float_left slds-p-around_small'>
-                                            <h2>Edit Filter</h2>
-                                        </div>
-                                        <div class='slds-float_right slds-p-around_small'>
-                                            <lightning-button-icon icon-name="utility:close" variant="bare" data-filter='openhours' onclick={changeFilter} title="Close">
-                                            </lightning-button-icon>
-                                        </div>
-                                    </header>
-                                    <div id="popover-body-id0" class="slds-popover__body">
-                                        <span>Opening Times</span>
-                                        <lightning-input type="time" name="input1" label="Start Time"></lightning-input> to <lightning-input type="time" name="input2" label="End Time"></lightning-input>
-                                    
-                                    </div>
-                                </section>
-                            </div>
-                            
-                            <a href="#" data-filter='location' onclick={changeFilter}>
-                                <div class="slds-size_1-of-1 slds-clearfix pillFilterDiv">
-                                    <div class='slds-float_left'>
-                                        <p class="slds-p-bottom_x-small greyText">Location</p>
-                                        <p class="blackText">Within 25 Miles of Contact Address</p>
-                                    </div>
-                                    <div class='slds-float_right'>
-                                        <lightning-button-icon icon-name="utility:close" variant="bare" onclick={handleRemoveFilter} title="Close">
-                                        </lightning-button-icon>
-                                    </div>
-                                </div>
-                                
-                            </a>
-                            <div if:true={showLocationFilterChangePopover} class="locationPopover slds-align_absolute-center">
-                                <section aria-label="Dialog title" aria-describedby="popover-body-id" class="slds-popover slds-nubbin_top" role="dialog">
-                                    <header class='slds-popover__header slds-clearfix'>
-                                        <div class='slds-float_left slds-p-around_small'>
-                                            <h2>Edit Filter</h2>
-                                        </div>
-                                        <div class='slds-float_right slds-p-around_small'>
-                                            <lightning-button-icon icon-name="utility:close" variant="bare" data-filter='location' onclick={changeFilter} title="Close">
-                                            </lightning-button-icon>
-                                        </div>
-                                    </header>
-                                    <div id="popover-body-id1" class="slds-popover__body">
-                                        <!-- <lightning-combobox name="distanceFilterType"
-                                            label="Operator"
-                                            value={value}
-                                            placeholder=""
-                                            options={locationFilterOperatorOptions}
-                                            onchange={handleLocationOperatorChange}>
-                                        </lightning-combobox> -->
-                                        <lightning-slider label="Within (miles)" max="50" value={locationFilterVal}></lightning-slider>
-                                        <lightning-input type="text" label="Address, City, or ZIP"></lightning-input>
-                                    </div>
-                                </section>
-                            </div>
                         </div>
                     </div>
                 </div>
diff --git a/force-app/main/default/lwc/serviceRecommendations/serviceRecommendations.js b/force-app/main/default/lwc/serviceRecommendations/serviceRecommendations.js
index c4a0e4b2..13b906b1 100644
--- a/force-app/main/default/lwc/serviceRecommendations/serviceRecommendations.js
+++ b/force-app/main/default/lwc/serviceRecommendations/serviceRecommendations.js
@@ -22,19 +22,6 @@ export default class ServiceRecommendations extends LightningElement {
   @api typefilters;
   @track serviceId;
   mapMarkers = [];
-  // mapMarkers = [
-  //   {
-  //     location: {
-  //       Street: '415 Mission St',
-  //       City: 'San Francisco',
-  //       State: 'CA'
-  //     },
-
-  //     title: 'Salesforce Tower',
-  //     description: 'lorem ipsum'
-
-  //   }
-  // ];
 
   @track returnHiddenRecommendationsCount = 0;
 
@@ -67,13 +54,13 @@ export default class ServiceRecommendations extends LightningElement {
         ])
     }
 
-    
-
     handleRequestRecommendations(){
         getRecommendations({contactId: this.recordId })
             .then((result) => {
                 let showResult = [];
                 let hiddenResult = [];
+
+
                 let i;
                 for(i = 0; i < result.length; i++) {
                   let marker = {
@@ -103,6 +90,9 @@ export default class ServiceRecommendations extends LightningElement {
                     this.showRecommendations = !this.showRecommendations;
                 }
 
+                showResult.sort((a,b)=>{
+                  return (a.Rating > b.Rating) ? 1 : -1
+                })
                 this.unfilteredRecommendations = showResult;
                 this.returnRecommendations = showResult;
                 this.returnHiddenRecommendations = hiddenResult;
@@ -114,61 +104,14 @@ export default class ServiceRecommendations extends LightningElement {
             });
     }
 
-    handleGenerateMapMarkers(){
-      
-    }
-
     handleExpand(){
         this.showExpandedMap = !this.showExpandedMap;
     }
 
-    handleFilterList(){
-        window.console.log('show filter window'+ this.template.querySelector('.mapModalDiv').classList);
-        
-        this.template.querySelector('.mapModalDiv').classList.toggle('width67');
-        this.template.querySelector('.mapModalDiv').classList.toggle('mapDivNarrow');
-        this.template.querySelector('.recommendationsDiv').classList.toggle('recommendationsDivWide');
-        //this.template.querySelector('.innerRecModalDiv').classList.toggle('modalWidth100');
-        this.template.querySelector('.recommendationsDiv').classList.toggle('recommendationsDivNarrow');
-        this.template.querySelector('.filterDiv').classList.toggle('slds-hide');
-  }
-
-  
-
-  handleCloseFilters() {
-    window.console.log('close filters');
-    this.template.querySelector('.mapModalDiv').classList.toggle('width67');
-    this.template
-      .querySelector('.mapModalDiv')
-      .classList.toggle('mapDivNarrow');
-    //this.template.querySelector('.innerRecModalDiv').classList.toggle('modalWidth100');
-    this.template
-      .querySelector('.recommendationsDiv')
-      .classList.toggle('recommendationsDivWide');
-    this.template
-      .querySelector('.recommendationsDiv')
-      .classList.toggle('recommendationsDivNarrow');
-    this.template.querySelector('.filterDiv').classList.toggle('slds-hide');
-  }
-
   handleShowHidden() {
     this.showHiddenRecsList = !this.showHiddenRecsList;
   }
 
-  changeFilter(event) {
-    window.console.log(event);
-    let tgt = event.currentTarget;
-    let filterAttribute = tgt.getAttribute('data-filter');
-    window.console.log(filterAttribute);
-    if (filterAttribute === 'openhours') {
-      this.showHoursFilterChangePopover = !this.showHoursFilterChangePopover;
-    }
-    if (filterAttribute === 'location') {
-      this.showLocationFilterChangePopover = !this
-        .showLocationFilterChangePopover;
-    }
-  }
-
   handleSortMenu(event) {
     window.console.log('show sort menu');
     const menuItem = event.currentTarget;
@@ -191,7 +134,7 @@ export default class ServiceRecommendations extends LightningElement {
         })
     }else{
       this.returnRecommendations.sort((a,b)=>{
-        return (a.ReviewCount > b.ReviewCount) ? 1 : -1
+        return (a.Relevance > b.Relevance) ? 1 : -1
       })
     }
   }
@@ -251,7 +194,13 @@ export default class ServiceRecommendations extends LightningElement {
       }
       
     });
-    this.returnRecommendations = filteredRecs;
+
+    if(filteredRecs.length === 0 ){
+      this.returnRecommendations = this.unfilteredRecommendations;
+    }else{
+      this.returnRecommendations = filteredRecs;
+    }
+    
         
   }
 
diff --git a/force-app/main/default/lwc/starRating/starRating.css b/force-app/main/default/lwc/starRating/starRating.css
index 4a078d2a..06140e4f 100644
--- a/force-app/main/default/lwc/starRating/starRating.css
+++ b/force-app/main/default/lwc/starRating/starRating.css
@@ -3,7 +3,7 @@
     align-items: center;
     flex: 0 0 auto;
     justify-content: center;
-    margin: 0.5rem;
+    margin-top: 0.5rem;
     transition: all 0.3s ease;
     flex-wrap: wrap;
   }
diff --git a/force-app/main/default/lwc/starRating/starRating.html b/force-app/main/default/lwc/starRating/starRating.html
index d58c628f..4fa1e598 100644
--- a/force-app/main/default/lwc/starRating/starRating.html
+++ b/force-app/main/default/lwc/starRating/starRating.html
@@ -3,7 +3,7 @@
         <div class="star-container-wrapper" tabindex="0">
             <div class="star-container" tabindex="-1">
                 <div>
-                    Rating:
+                    Client Rating:
                 </div>
                 <template for:each={stars} for:item="star">
                     <div class={star.class} key={star.id} data-rating={star.value}>