diff --git a/enterprise/src/web/enterprise/ExtendedSearchPage.css b/enterprise/src/web/enterprise/ExtendedSearchPage.css
index 3050f5eed50a..1da3d8a28b1a 100644
--- a/enterprise/src/web/enterprise/ExtendedSearchPage.css
+++ b/enterprise/src/web/enterprise/ExtendedSearchPage.css
@@ -55,19 +55,3 @@ dl.message-details-fields {
 dl.message-details-fields dd {
     font-family: monospace;
 }
-
-/* the !important can go away when we removed the old search page and its stylesheet */
-table.messages thead th, table.messages thead  {
-    background-color: #eee !important;
-    color: #333;
-    border-bottom: 1px solid
-}
-
-/* the !important can go away when we removed the old search page and its stylesheet */
-table.messages {
-    margin-top: 0 !important;
-}
-
-#message-table-paginator-top {
-    margin-bottom: 12px;
-}
\ No newline at end of file
diff --git a/enterprise/src/web/enterprise/components/widgets/MessageList.css b/enterprise/src/web/enterprise/components/widgets/MessageList.css
new file mode 100644
index 000000000000..6b6cdbe42df0
--- /dev/null
+++ b/enterprise/src/web/enterprise/components/widgets/MessageList.css
@@ -0,0 +1,7 @@
+:local(.messageListTableHeader) table.messages thead th, :local(.messageListTableHeader) table.messages thead {
+    background-color: #eee;
+    color: #333;
+}
+:local(.messageListPaginator) #message-table-paginator-top {
+    margin-bottom: 12px;
+}
\ No newline at end of file
diff --git a/enterprise/src/web/enterprise/components/widgets/MessageList.jsx b/enterprise/src/web/enterprise/components/widgets/MessageList.jsx
index 99faefdf7d43..7950a6811c0e 100644
--- a/enterprise/src/web/enterprise/components/widgets/MessageList.jsx
+++ b/enterprise/src/web/enterprise/components/widgets/MessageList.jsx
@@ -16,6 +16,8 @@ import { SearchConfigStore } from 'enterprise/stores/SearchConfigStore';
 import FieldType from '../../logic/fieldtypes/FieldType';
 import { StreamsStore } from 'enterprise/stores/StreamsStore';
 
+import styles from './MessageList.css';
+
 const { InputsActions, InputsStore } = CombinedProvider.get('Inputs');
 const { NodesStore } = CombinedProvider.get('Nodes');
 const { RefreshActions } = CombinedProvider.get('Refresh');
@@ -130,23 +132,25 @@ const MessageList = createReactClass({
     const allStreams = Immutable.List(streams);
     return (
       <span>
-        <MessageTablePaginator currentPage={Number(this.state.currentPage)}
-          onPageChange={newPage => this.setState({ currentPage: newPage })}
-          pageSize={pageSize}
-          position="top"
-          resultCount={messages.length} />
+        <div className={styles.messageListPaginator}>
+          <MessageTablePaginator currentPage={Number(this.state.currentPage)}
+            onPageChange={newPage => this.setState({ currentPage: newPage })}
+            pageSize={pageSize}
+            position="top"
+            resultCount={messages.length} />
+        </div>
 
         <div className="search-results-table" style={{ overflow: 'auto', height: '100%' }}>
           <div className="table-responsive">
-            <div className="messages-container">
-              <table className="table table-condensed messages">
+            <div className={`messages-container ${styles.messageListTableHeader}`}>
+              <table className="table table-condensed messages" style={{ marginTop: 0 }}>
                 <thead>
                   <tr>
                     <th style={{ width: 180 }}><Field interactive name="Timestamp" queryId={activeQuery} type={this._fieldTypeFor('timestamp', fields)} /></th>
                     {selectedColumns.toSeq().map((selectedFieldName) => {
                       return (
                         <th key={selectedFieldName}
-                          style={this._columnStyle(selectedFieldName)}>
+                            style={this._columnStyle(selectedFieldName)}>
                           <Field interactive
                                  type={this._fieldTypeFor(selectedFieldName, fields)}
                                  name={selectedFieldName}