Modify Settings page's 3rd pane grid markup for Job Profile Details when 4th pane opens

Purpose: To change the format of the job profiles results list in the 3rd pane, when the details for a particular job profile are displayed in a fourth pane .

As a staff person
I want to be able to select a particular job profile in the 3rd pane results and display its details in a new 4th pane
So that I can understand the scope of the particular profile

Live prototype:
https://xd.adobe.com/view/0bb2d8ab-aabd-4ff6-4d5a-faa59a93368e-7d83/

Brief video walk-through
https://www.dropbox.com/s/3slcv4v49qm92rv/2018-11-06-data-import-19.mp4?dl=0

Scenarios

1. Scenario 1
   • Given the Data Import Settings/Job Profile result list 20-Settings Job profiles.png
   • When a User clicks on a particular job profile in the results list
   • Then that job profile should turn dark grey
   • And a fourth pane should open showing the details of the particular job profile, as shown in the attached 29a-Settings Job profiles Job profile details-Partial.png
   • And the 3rd pane should have a horizontal scroll bar at the bottom, so that the user can see all of the columns of the 3rd pane. As an example, see the horizontal scroll bar in the 2nd pane of Users or Inventory when a detail record is displayed in the 3rd pane.

NOTE To allow room for the fourth pane, the third pane results list table format will have less space horizontally on the screen. Ideal solution is that the third pane will change to a static card format or change to the resizable, responsive card format. Based on results of UIDATIMP-161, we will not implement this responsive card design right now, but instead wait for a solution for the central component.