.bg-danger{
	background-color: #FFD1D1;
	margin: 5 5 5 5;
}

.bg-warning{
	background-color: #FFFF99;
	margin: 5 5 5 5;
}
.bg-success{
	background-color: #ADFAAA;
	margin: 5 5 5 5;
}
.bg-info{
	background-color: #E7F3FF;
	margin: 5 5 5 5;
}
.bg-default{
	background-color: #F4F4F4;
	margin: 5 5 5 5;
}
.bg-white{
	background-color: white;
	margin: 5 5 5 5;
}

.tool-frame .btn{
	background-color: #F4F4F4;
}

.btn:hover {
	border: 1px solid #A1A1A1;
    border-radius: 4px;

}


.info-board{
	border: 2px solid #A1A1A1;
	margin-bottom:10px;
    border-radius: 4px;
	max-height:70px;
	overflow:scroll;
	overflow-x:hidden;
}


#follow-scroll {
	height:90vh;
    width: 90%;
	overflow:auto;
    padding-top: 10px;
    float: left;
}

#follow-scroll #accordion .panel-body {

    height: 55vh;
}

.tool-frame{
	background-color: white;
	border: 2px solid #A1A1A1;
	border-radius: 3px;
	padding: 5px;
}
.tool-topic {
	background-color: #E7F3FF;
	border-radius: 3px;
	cursor: hand;
}

.popup-frame {
	position: absolute;
	display: none;
	background-color: white;
	border: 2px solid #A1A1A1;
	border-radius: 4px;
	padding: 5px;
}

#smartRegexPopUpDiv{
	width: 450px;
	height: 320px;
	top: 120px;
	z-index: 2;
}

#right-tool-bar-area #smartRegexPopUpDiv{
	left: -450px;
}

#left-tool-bar-area #smartRegexPopUpDiv{
	left: 350px;
}

#regex_generator {
	left: -450px;
	width: 450px;
	height: 300px;
	top: 280px;
	z-index: 2;

}

.popup-loadregex{
	width: 300px;
	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 {
	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;
	height: 340px;
	top: 100px;
	z-index: 2;
	overflow:scroll;
	overflow-x:hidden;
}
.tagItemDivClass {
	position:absolute;
	background-color: white;
	border: 2px solid #A1A1A1;
	border-radius: 4px;
	padding: 5px;
	z-index:5;
}

.questionMarkClass {
	position:absolute;
	background-color: white;
	border: 2px solid #A1A1A1;
	border-radius: 4px;
	padding: 5px;
	z-index:4;
}

.editable {
	cursor: hand;
}


#loading{
	position:fixed;
	z-index:2000;
	background:rgba(0,0,0,0.5);
	color:#fff;
	width:100vw;
	height:100vh;
	padding:300px 0;
	text-align:center;
	vertical-align:middle;
	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;
}