html {
	font-size: 62.5%;
}
html,body,#formDesign{
	height: 100%;
}
canvas {
    border: 1px solid #CFCFCF;
}

ul,ol,dl,li{
	list-style:none;
	margin:0;
	padding:0;
}
p{
	margin: 0;
}
.d-none{
	display: none;
}
.d-block{
	display:block;
}
.d-inline{
	display:inline;
}
.d-flex{
	display:flex;
}
.widthAuto{
	width: auto;
}
.iconfont:hover {
	cursor: pointer;
}

#diagramFlow {
	float: left;
	width:50%;
	height:100%;
	overflow: scroll;
	border:1px solid #CFCFCF;
	background-color: #FAFAFA;
	z-index:1;
}

.inspector {
	float: left;
	width:25%;
	height:100%;
	overflow: scroll;
	border:1px solid #CFCFCF;
	overflow: auto;
}

.board {
	float: left;
	width:25%;
	height:100%;
	overflow: scroll;
	border:1px solid #CFCFCF;
	overflow:hidden;
}

.block {
	display: block;
}

.selected {
	background-color: #1E90FF;
}

.text-left:hover {
	cursor:pointer;
}

.component-board {
	height:40%;
	width:inherit;
}
#component{
	height: calc(100% - 41px);
	overflow-y: scroll;
}
.prop-board {
	height:60%;
	width:inherit;
	overflow: scroll;
}
#formContainer{
	width:80%;
	height:100%;
	margin:10px auto;
}
#formBoard{
	overflow: scroll;
	background: #fff;
	border:1px solid #CFCFCF;
	box-shadow: 10px 10px 5px #888888;
	width: 100%;
	height: 100%;
	position: relative;
	// background: url('../images/bg.png');
}
/* #formBoard>*{
	 position: absolute; 
} */
input{
	outline: none;
	
}
.panel-default{
	border: none;
}
.tablelayout{
	
	display: grid;
	grid-template-rows: repeat(3, 33.33%);
	grid-template-columns: repeat(3, 33.33%);
}
.tablelayout-base{
	width:300px;
	height: 200px;
	box-sizing: border-box;
	border: 1px solid #ccc;
	border-collapse:collapse;
}

.tablelayout-td{
	border-right: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	overflow: hidden;
	/* position: relative; */
	background: #fff;
}

.tablelayout-td:nth-of-type(3n){
	border-right: none;
	
}
.tablelayout-td:nth-of-type(7){
	border-bottom: none;
	
}
.tablelayout-td:nth-of-type(8){
	border-bottom: none;
	
}
.tablelayout-td:nth-of-type(9){
	border-bottom: none;
	
}

#formBoard input{
	display: block;
    width: 100%;
    height: 100%;
}
.inlineBlock{
	/* position: absolute; */
	display: inline-block;
	
	background: #fff;
	vertical-align: top;
	/* width: 100%; */
}
.tipStyle{
	font-size: 12px;
	color: green;
}
.width100{
	width: 100%;
}


.componenetIcon:before,.glyphicon:before{
	content: "";
	display: inline-block;
	width: 16px;
	height: 16px;
	vertical-align: middle;
	background-repeat: no-repeat;
	// background-image:url('../images/fck_strip.gif');
}
#Input:before,.glyphicon-asterisk:before{
	background-image:url('../images/fck_strip.gif');

	background-position: 0px -800px;
}
#Textarea:before,.glyphicon-plus:before{
	background-image:url('../images/fck_strip.gif');

	background-position: 0px -816px;
}
#Radio:before,.glyphicon-minus:before{
	background-image:url('../images/fck_strip.gif');

	background-position: 0px -784px;
}
#Checkbox:before,.glyphicon-euro:before{
	background-image:url('../images/fck_strip.gif');

	background-position: 0px -768px;
}
#Button:before,.glyphicon-cloud:before{
	background-image:url('../images/fck_strip.gif');

	background-position: 0px -848px;
}
#Select:before,.glyphicon-envelope:before{
	background-image:url('../images/fck_strip.gif');

	background-position: 0px -832px;
}


#Data:before,.glyphicon-pencil:before{
	background-image: url(../images/datefield.gif)
}

#Dept:before,.glyphicon-glass:before{
	background-image: url(../images/departmentfield.gif)
}
#Selectaboutfield:before,.glyphicon-music:before{
	background-image: url(../images/selectaboutfield.gif)
}
#Treedepartmentfield:before,.glyphicon-search:before{
	background-image: url(../images/treedepartmentfield.gif)
}
#Userfield:before,.glyphicon-heart:before{
	background-image: url(../images/userfield.gif)
}
#Suggestfield:before,.glyphicon-star:before{
	background-image: url(../images/suggestfield.gif)
}


#Viewdialogfield:before,.glyphicon-star-empty:before{
	background-image: url(../images/viewdialogfield.gif)
}
#Tabfield:before,.glyphicon-user:before{
	background-image: url(../images/tabfield.gif)
}
#Calctextfield:before,.glyphicon-film:before{
	background-image: url(../images/calctextfield.gif)

}
#Includefield:before,.glyphicon-th-large:before{
	background-image: url(../images/includefield.gif)
}
#Surveyfield:before,.glyphicon-th:before{
	background-image: url(../images/surveyfield.png)
}
#Attachment:before,.glyphicon-th-list:before{
	background-image: url(../images/attachment.gif)
}
#Imageuploadfield:before,.glyphicon-ok:before{
	background-image: url(../images/imageuploadfield.gif)
}
#Onlinetakephotofield:before,.glyphicon-zoom-in:before{
	background-image: url(../images/onlinetakephotofield.png)
}
#Weixingpsfield:before,.glyphicon-zoom-out:before{
	background-image: url(../images/weixingpsfield.png)
}
#Weixinrecordfield:before,.glyphicon-off::before{
	background-image: url(../images/weixinrecordfield.png)
}
#Qrcodefield:before,.glyphicon-signal:before{
	background-image: url(../images/qrcodefield.png)
}
#Mapfield:before,.glyphicon-cog:before{
	background-image: url(../images/mapfield.png)
}
#Genericwordfield:before,.glyphicon-trash:before{
	background-image: url(../images/genericwordfield.gif)
}
#Htmleditorfield:before,.glyphicon-home:before{
	background-image: url(../images/htmleditorfield.gif)
}
#Flowhistoryfield:before,.glyphicon-file:before{
	background-image: url(../images/flowhistoryfield.png)
}
#Flowreminderhistoryfield:before,.glyphicon-time:before{
	background-image: url(../images/flowreminderhistoryfield.png)
}
#Informationfeedbackfield:before,.glyphicon-road:before{
	background-image: url(../images/informationfeedbackfield.png)
}