--- a/css/taggingtext.css	Thu Sep 28 17:48:35 2017 +0200
+++ b/css/taggingtext.css	Thu Sep 28 17:51:53 2017 +0200
@@ -36,11 +36,8 @@
 
 
 .info-board{
-	margin:10 30 10 30;
-	width: 100%;
-	max-width:1270px;
-	min-width: 680px;
 	border: 2px solid #A1A1A1;
+	margin-bottom:10px;
     border-radius: 4px;
 	max-height:70px;
 	overflow:scroll;
@@ -49,12 +46,16 @@
 
 
 #follow-scroll {
-	position:absolute; 
-	height:680px; 
-	overflow:scroll; 
-	margin:5 0 15 0; 
-	padding: 0 0 30 0;
-	max-width:270px; 
+	height:90vh;
+    width: 90%;
+	overflow:auto;
+    padding-top: 10px;
+    float: left;
+}
+
+#follow-scroll #accordion .panel-body {
+
+    height: 55vh;
 }
 
 .tool-frame{
@@ -71,20 +72,26 @@
 
 .popup-frame {
 	position: absolute;
-	display: none; 
+	display: none;
 	background-color: white;
 	border: 2px solid #A1A1A1;
 	border-radius: 4px;
-	padding: 5px;	
+	padding: 5px;
 }
 
 #smartRegexPopUpDiv{
-	left: -450px;
 	width: 450px;
-	height: 300px;
+	height: 320px;
 	top: 120px;
 	z-index: 2;
+}
 
+#right-tool-bar-area #smartRegexPopUpDiv{
+	left: -450px;
+}
+
+#left-tool-bar-area #smartRegexPopUpDiv{
+	left: 350px;
 }
 
 #regex_generator {
@@ -96,23 +103,59 @@
 
 }
 
-
 .popup-loadregex{
-	left: -300px;
 	width: 300px;
-	height: 85px;
+	height: 110px;
 	top: 100px;
 	z-index: 3;
+}
 
+#right-tool-bar-area #load_regex_div {
+	left: -300px;
+}
+
+#left-tool-bar-area #load_regex_div {
+	left: 350px;
 }
 
 .popup-topic {
-	left: -250px;
 	width: 250px;
 	height: 80px;
 	top: 20px;
 	z-index: 2;
 }
+
+.popup-topic .close-btn,
+.popup-loadregex .close-btn,
+#smartRegexPopUpDiv .close-btn {
+	float: right;
+	margin-bottom: 15px;
+}
+
+
+.popup-loadregex .emptyRow {
+    height: 30px;
+    text-align: right;
+    padding-top: 10px;
+}
+
+.popup-loadregex #loadRegexSelect {
+    margin-right: 10px;
+    width: 100%;
+}
+
+#right-tool-bar-area #load_topic_div{
+   left: -250px;
+}
+
+#left-tool-bar-area #load_topic_div{
+   left: 350px;
+}
+
+#loadTopiclist {
+   width: 235px;
+}
+
 .popup-newtopic {
 	left: -360px;
 	width: 360px;
@@ -120,23 +163,23 @@
 	top: 100px;
 	z-index: 2;
 	overflow:scroll;
-	overflow-x:hidden; 
+	overflow-x:hidden;
 }
 .tagItemDivClass {
-	position:absolute; 
-	background-color: white; 
+	position:absolute;
+	background-color: white;
 	border: 2px solid #A1A1A1;
-	border-radius: 4px;	
-	padding: 5px; 
+	border-radius: 4px;
+	padding: 5px;
 	z-index:5;
 }
 
 .questionMarkClass {
-	position:absolute; 
-	background-color: white; 
+	position:absolute;
+	background-color: white;
 	border: 2px solid #A1A1A1;
-	border-radius: 4px;	
-	padding: 5px; 
+	border-radius: 4px;
+	padding: 5px;
 	z-index:4;
 }
 
@@ -158,3 +201,80 @@
 	font-size:20px;
 	line-height:20px;
 }
+
+.sub-group-area {
+	border: 1px solid #ddd;
+  border-radius: 4px;
+	padding: 5px;
+  margin: 10px 0px;
+}
+
+#smartRegexShowDiv {
+	border: 1px solid #EEE;
+	min-height: 30px;
+	padding: 5px;
+	margin-bottom: 5px;
+}
+
+#smartRegexShowDiv span{
+    cursor: hand;
+}
+
+.EditingMode {
+    background-color: #fff !important;
+    box-shadow: inset 3px 3px 5px rgba(0,0,0,.125);
+    border-color: red !important;
+}
+
+.content-col,
+.tool-col {
+    border:1px solid #A1A1A1;
+}
+
+.tool-col {
+    padding: 0px !important;
+}
+
+#toLeft {
+   width: 15px;
+   float: left;
+    height: 20px;
+    top: 17px;
+    position: relative;
+}
+
+#toRight {
+    width: 15px;
+    float: right;
+    height: 20px;
+    top: 17px;
+    position: relative;
+}
+
+.tagBtns-area {
+    margin-top: 5px;
+    max-height: 220px;
+}
+
+.tagBtns-area td{
+   padding: 2px 2px 4px;
+}
+
+.tagBtns-area button {
+   padding: 3px 8px;
+}
+
+.questionMarkClass button  {
+   padding: 3px 8px;
+   margin-right: 3px;
+   margin-top: 3px;
+}
+
+.questionMarkClass .removeTagText,
+.tagItemDivClass .bg-info {
+   max-width: 600px;
+   text-overflow: ellipsis;
+   white-space: nowrap;
+   overflow: hidden;
+   display:block;
+}