Index: lams_monitoring/web/css/components-monitoring.css
===================================================================
diff -u -rbfa7dfb5557d54767b137652b34dd89c13fb1227 -r1837cd06ffdcf89f041b90ce3582951ff326ae4f
--- lams_monitoring/web/css/components-monitoring.css	(.../components-monitoring.css)	(revision bfa7dfb5557d54767b137652b34dd89c13fb1227)
+++ lams_monitoring/web/css/components-monitoring.css	(.../components-monitoring.css)	(revision 1837cd06ffdcf89f041b90ce3582951ff326ae4f)
@@ -824,7 +824,28 @@
 	background-color: #1AD9B2 !important;
 }
 
+.monitoring-page-wrapper #sequenceSearchPhraseContainer {
+	width: 20rem;
+}
 
+.monitoring-page-wrapper #sequenceSearchPhrase {
+	width: 15rem;
+} 
+
+.monitoring-page-wrapper #sequenceSearchPhraseClearIcon {
+	display: none;
+}
+
+body.component .ui-menu-item-wrapper.autocomplete-menu-item-with-portrait {
+	display: flex;
+	justify-content: space-between;
+	padding: 5px;
+}
+
+body.component .ui-menu-item-wrapper.autocomplete-menu-item-with-portrait > p {
+	padding-top: 10px;
+}
+
 .dialogContainer {
   display: none;
   -webkit-overflow-scrolling: touch !important;
@@ -906,6 +927,8 @@
 	height: calc(100% - 10px);
 }
 
+
+
 /********** CANVAS STYLES **********/
 
 #canvas-container {
@@ -1009,32 +1032,6 @@
 	display: none;
 }
 
-#canvas-container .topButtonsContainer #sequenceSearchPhrase {
-	float: right;
-	margin: 6px 5px 5px 0;
-}
-
-#canvas-container .topButtonsContainer #sequenceSearchPhraseIcon {
-	float: right;
-	margin: 9px 7px 5px 0;
-}
-
-#canvas-container .topButtonsContainer #sequenceSearchPhraseClear {
-	float: right;
-	cursor: pointer;
-	margin: 9px 25px 5px 0;
-	visibility: hidden;
-}
-
-#canvas-container .ui-menu-item-wrapper.autocomplete-menu-item-with-portrait {
-	display: flex;
-	justify-content: space-between;
-}
-
-#canvas-container .ui-menu-item-wrapper.autocomplete-menu-item-with-portrait>p {
-	padding-top: 10px;
-}
-
 #canvas-container img#sequenceSearchedLearnerHighlighter {
 	position: absolute;
 	display: none;