Solve conflicts

src/assets/css/palmpay.css

@@ -406,4 +406,9 @@ header .col-md-10, header .col-md-10 > div {
 }
 .uppercase-text {
   text-transform: uppercase;
+}
+
+.row {
+  margin-right: 0 !important;
+  margin-left: 0 !important;
 }

src/components/EnhancedSearch.js

@@ -49,12 +49,9 @@ class EnhancedSearch extends Component {
 			<div className="search-books">
 				<div className="search-books-bar">
 					<div className="search-books-input-wrapper" style={{ textAlign: 'left', marginLeft: 20}}>
-            <table>
-              <tbody>
-                <tr>
-                  <td>
-                    <TextField
-        							style={{ textAlign: 'left', width: 350,borderColor: "#139657" }}
+<div className="row">
+                   <div className="col-md-4"> <TextField
+        							style={{ textAlign: 'left', width: '100%',borderColor: "#139657" }}
         							id="outlined-adornment-weight"
         							className={classNames(classes.margin, classes.textField)}
         		          variant="outlined"
@@ -65,12 +62,10 @@ class EnhancedSearch extends Component {
         		          InputProps={{
         		            startAdornment: <InputAdornment position="start"><Search /></InputAdornment>,
         		          }}
-        		        />
-                  </td>
-                  <td>{textComponent}</td>
-                </tr>
-              </tbody>
-            </table>
+        		        /> </div>
+
+                 <div className="col-md-8"> {textComponent}</div>
+             </div>
 						<br />
             {this.props.showSearchColumns && this.props.columns.map(column => (
               <FormControlLabel