diff --git a/src/components/toolbox/autoSuggest/autoSuggest.css b/src/components/toolbox/autoSuggest/autoSuggest.css
index 7c373efa4e..14d5b6dba3 100644
--- a/src/components/toolbox/autoSuggest/autoSuggest.css
+++ b/src/components/toolbox/autoSuggest/autoSuggest.css
@@ -1,6 +1,6 @@
 @import '../../app/variables.css';
 
-.recipientField {
+.inputWrapper {
   align-items: center;
   display: flex;
   position: relative;
@@ -14,12 +14,12 @@
     padding-left: 50px;
     padding-right: 30px;
 
-    & ~ .bookmarkContainer {
+    & ~ .listContainer {
       opacity: 0 !important;
       visibility: hidden !important;
     }
 
-    &:focus ~ .bookmarkContainer {
+    &:focus ~ .listContainer {
       opacity: 1 !important;
       visibility: visible !important;
     }
@@ -31,13 +31,16 @@
   left: 16px;
 }
 
-.bookmarkContainer {
+.listContainer {
   @mixin contentLargest;
 
   position: absolute;
   top: 52px;
   width: 100%;
   display: flex;
+  box-sizing: border-box;
+  border: 1px solid var(--dark-border-color);
+  border-radius: var(--border-radius-standard);
   background-color: var(--color-white);
   flex-direction: column;
   justify-content: center;
@@ -59,7 +62,7 @@
   right: 10px;
 }
 
-.bookmarkList {
+.itemList {
   align-items: center;
   box-sizing: border-box;
   display: flex;
diff --git a/src/components/toolbox/autoSuggest/index.js b/src/components/toolbox/autoSuggest/index.js
index 701aa3258d..dd84d016d4 100644
--- a/src/components/toolbox/autoSuggest/index.js
+++ b/src/components/toolbox/autoSuggest/index.js
@@ -134,7 +134,7 @@ class AutoSuggest extends React.Component {
 
     return (
       <Fragment>
-        <span className={`${styles.recipientField} ${className}`}>
+        <span className={`${styles.inputWrapper} ${className}`}>
           <span className={styles.icon}>
             {renderIcon(selectedItem)}
           </span>
@@ -152,9 +152,9 @@ class AutoSuggest extends React.Component {
             className={`${styles.status} ${!this.state.isLoading && selectedItem.value ? styles.show : styles.hide}`}
             name={selectedItem.error ? 'alertIcon' : 'okIcon'}
           />
-          <div className={`${styles.bookmarkContainer}`}>
+          <div className={`${styles.listContainer}`}>
             <div ref={(node) => { this.listContainerRef = node; }}>
-              <ul className={`${styles.bookmarkList} bookmark-list`}>
+              <ul className={`${styles.itemList} bookmark-list`}>
                 {
                 this.getFilterList()
                   .map((item, index) => (