diff --git a/productMods/js/menupage/browseByVClassPeople.js b/productMods/js/menupage/browseByVClassPeople.js
new file mode 100644
index 00000000..6289fa33
--- /dev/null
+++ b/productMods/js/menupage/browseByVClassPeople.js
@@ -0,0 +1,64 @@
+/* $This file is distributed under the terms of the license in /doc/license.txt$ */
+
+// This file extends and proxies the default behavior defined in vitro/webapp/web/js/menupage/browseByVClass.js
+
+// Saving the original getIndividuals function from browseByVClass
+var getPersonIndividuals = browseByVClass.getIndividuals;
+
+// Assigning the proxy function
+browseByVClass.getIndividuals = function(vclassUri, alpha) {
+    // alert("This is the mothership!");
+    url = this.dataServiceUrl + encodeURIComponent(vclassUri);
+    if ( alpha && alpha != "all") {
+        url = url + '&alpha=' + alpha;
+    }
+    
+    // First wipe currently displayed individuals
+    this.individualsInVClass.empty();
+    
+    $.getJSON(url, function(results) {
+        $.each(results.individuals, function(i, item) {
+            label = results.individuals[i].label;
+            firstName = results.individuals[i].firstName;
+            lastName = results.individuals[i].lastName;
+            if ( firstName && lastName ) {
+                fullName = firstName + ' ' + lastName;
+            } else {
+                fullName = label;
+            }
+            moniker = results.individuals[i].moniker;
+            vclassName = results.individuals[i].vclassName;
+            if ( results.individuals[i].preferredTitle == "") {
+               // Use the moniker only if it's not empty and not equal to the VClass name
+               if ( moniker != vclassName && moniker != "" ) {
+                   preferredTitle = moniker;
+               } else {
+                   preferredTitle = "";
+               }
+            } else {
+               preferredTitle = results.individuals[i].preferredTitle;
+            }
+            // preferredTitle = results.individuals[i].preferredTitle;
+            uri = results.individuals[i].URI;
+            profileUrl = results.individuals[i].profileUrl;
+            if ( !results.individuals[i].thumbUrl ) {
+                image = browseByVClass.baseUrl + '/images/placeholders/person.thumbnail.jpg';
+            } else {
+                image = browseByVClass.baseUrl + results.individuals[i].thumbUrl;
+            }
+            // Build the content of each list item, piecing together each component
+            listItem = '<li class="vcard individual-foaf-person" role="listitem" role="navigation">';
+            listItem += '<img src="'+ image +'" width="90" height="90" alt="'+ fullName +'" />';
+            listItem += '<h1 class="fn"><a href="'+ profileUrl +'" title="View the profile page for '+ fullName +'">'+ fullName +'</a></h1>';
+            // Include the calculated preferred title (see above) only if it's not empty
+            if ( preferredTitle != "" ) {
+                listItem += '<p>'+ preferredTitle +'</p>';
+            }
+            listItem += '</li>';
+            browseByVClass.individualsInVClass.append(listItem);
+        })
+        // set selected class and alpha
+        browseByVClass.selectedVClass(results.vclass.URI);
+        browseByVClass.selectedAlpha(alpha);
+    });
+};
\ No newline at end of file
diff --git a/productMods/templates/freemarker/body/menupage/menupage--classgroup-people.ftl b/productMods/templates/freemarker/body/menupage/menupage--classgroup-people.ftl
index d1e61c12..b1b2f973 100644
--- a/productMods/templates/freemarker/body/menupage/menupage--classgroup-people.ftl
+++ b/productMods/templates/freemarker/body/menupage/menupage--classgroup-people.ftl
@@ -40,4 +40,6 @@
 
 ${stylesheets.add("/css/menupage/menupage.css")}
 
-<#include "menupage-scripts.ftl">
\ No newline at end of file
+<#include "menupage-scripts.ftl">
+
+${scripts.add("/js/menupage/browseByVClassPeople.js")}
\ No newline at end of file
diff --git a/themes/wilma/css/wilma.css b/themes/wilma/css/wilma.css
index f3bb77c3..b7f6f136 100644
--- a/themes/wilma/css/wilma.css
+++ b/themes/wilma/css/wilma.css
@@ -1026,7 +1026,7 @@ ul#alpha-browse-childClass .count-classes {
     color: #2485ae;
 }
 #individuals-in-childClass li.individual-foaf-person {
-    width: 440px;
+    width: 90%;
     border-bottom: 1px solid #dde4e3;
     padding-bottom: 0;
 }