diff --git a/jam-ui/cypress/e2e/friends/friends-page.cy.js b/jam-ui/cypress/e2e/friends/friends-page.cy.js
index a80657f00..c322f70d7 100644
--- a/jam-ui/cypress/e2e/friends/friends-page.cy.js
+++ b/jam-ui/cypress/e2e/friends/friends-page.cy.js
@@ -127,7 +127,7 @@ describe('Friends page with data', () => {
         cy.get('[data-testid=paginate-next-page]').should('not.exist');
       });
 
-      it('show profiles', () => {
+      it.only('show profiles', () => {
         cy.contains('Find New Friends').should('exist');
         cy.contains('Update Search').should('exist');
         cy.contains('Reset Filters').should('exist');
diff --git a/jam-ui/src/components/profile/JKInstrumentIcon.js b/jam-ui/src/components/profile/JKInstrumentIcon.js
index e38427187..3703105a1 100644
--- a/jam-ui/src/components/profile/JKInstrumentIcon.js
+++ b/jam-ui/src/components/profile/JKInstrumentIcon.js
@@ -6,7 +6,7 @@ function JKInstrumentIcon({instrumentId, instrumentName}) {
     () => {
       try {
         const file = require(`../../icons/instruments/icon_instrument_${instrumentId.replace(/\s+/g, '_')}.svg`);
-        return <img width="25" src={file} alt={instrumentName} />
+        return <img width={25} height={25} src={file} alt={instrumentName} />
       } catch (error) {
         return <FontAwesomeIcon icon="music" size="sm" />
       }
diff --git a/jam-ui/src/components/profile/JKProfileInstrumentsList.js b/jam-ui/src/components/profile/JKProfileInstrumentsList.js
index 6103136c6..65909b039 100644
--- a/jam-ui/src/components/profile/JKProfileInstrumentsList.js
+++ b/jam-ui/src/components/profile/JKProfileInstrumentsList.js
@@ -1,6 +1,6 @@
 import React, { useEffect, useState } from 'react';
 import PropTypes from 'prop-types';
-import { useResponsive, useIsMobile } from '@farfetch/react-context-responsive';
+import { useResponsive } from '@farfetch/react-context-responsive';
 import JKInstrumentIcon from './JKInstrumentIcon';
 
 const JKPersonInstrumentsList = ({ instruments, showIcons, showAll, toggleMoreDetails }) => {
@@ -15,7 +15,6 @@ const JKPersonInstrumentsList = ({ instruments, showIcons, showAll, toggleMoreDe
   const [instrumentsToShow, setInstrumentsToShow] = useState([]);
 
   const { greaterThan } = useResponsive();
-  const { isMobile } = useIsMobile();
 
   useEffect(() => {
     showAll || !greaterThan.xs ? setInstrumentsToShow(instruments) : setInstrumentsToShow(instruments.slice(0, LIMIT));
@@ -25,13 +24,13 @@ const JKPersonInstrumentsList = ({ instruments, showIcons, showAll, toggleMoreDe
     <div data-testid="instrumentList">
       {instrumentsToShow &&
         instrumentsToShow.map(instrument => (
-          <div key={instrument.instrument_id} className="text-nowrap mb-1">
-            {showIcons && (
-              <span className="mr-1">
-                <JKInstrumentIcon instrumentId={instrument.instrument_id} instrumentName={instrument.description} />
-              </span>
-            )}
-            <strong>{instrument.description}:</strong> {proficiencies[instrument.proficiency_level]}
+          <div key={instrument.instrument_id} className="text-nowrap mb-1 d-flex  align-items-center">
+            <div className="mr-1" style={{ width: "15%"}}>
+              <JKInstrumentIcon instrumentId={instrument.instrument_id} instrumentName={instrument.description} />
+            </div>
+            <div>
+              <strong>{instrument.description}:</strong> {proficiencies[instrument.proficiency_level]}
+            </div>
           </div>
         ))}
       {((!showAll && greaterThan.xs) || (showAll && !greaterThan.xs)) && instruments.length > LIMIT && (