body {
	margin: 0px;
	padding: 0px;
}

header {
	width: 100%;
	height: 80px;
}
footer {
	width: 100%;
	height: 80px;
}

main {
	margin: 0px 80px;
	width: calc( 100% - 160px );
	height: calc( 100% - 160px );
}
#form-editor {
	width: 100%;
	height: 100%;
	background: rgba( 255, 255, 255, 0.85 );
	margin: 0px;
}

#form-editor div[id^="editor"] {
	width: 100%;
}
#form-editor div#editor-top {
	min-height: 40px;
	height: auto;
	max-height: 200px;
	font-size: 21px;
}
#form-editor div#editor-top #editor-top-status{
	float: left;
	width: 200px;
	height: auto;
	font-size: 16px;
}
#form-editor div#editor-top #editor-top-status label{
	width: 72px;
	height: 20px;
}
#form-editor div#editor-top #editor-top-status input{
	background: #fff;
	border: none;
	width: 128px;
	height: 20px;
	padding-left: 4px;
}
#form-editor div#editor-top #editor-top-control{
	float: left;
	width: calc( 100% - 200px );
	height: 40px;
}
#form-editor div#editor-top #editor-top-control span {
	display: inline-block;
	padding: 0px;
	margin: 0px;
}
#form-editor div#editor-top #editor-top-control span select {
	float: left;
	height: 40px;
	width: 250px;
	background:#000;
	color: #fff;
	border: none;
	overflow: hidden;
	text-align: center;
}
#form-editor div#editor-top #editor-top-control span label {
	float: left;
	display: block;
	/* height: 40px; */
	width: 120px;
	border: none;
	overflow: hidden;
	text-align: center;
	padding: 8px 0px;
}


#form-editor div#editor-middle {
	clear: both;
	height: calc( 100% - 80px );
}

#form-editor div#editor-bottom {
	height: 40px;
}
#form-editor div#editor-bottom button[type="submit"]{
	width: 70px;
	height: 40px;
	border: none;
	background: #000;
	color: #fff;
}
#form-editor div#editor-bottom button[type="submit"][value="download"] {
	width: 100px;
}
#form-editor div#editor-bottom button[type="submit"]:hover {
	background: #222;
}
#form-editor div#editor-bottom button[type="submit"]:active {
	background: #ddd;
	color: #111;
}

#form-editor div#editor-bottom #systemMSG{
	float: right;
	height: 40px;
	font-size: 18px;
}


@media screen and (max-width: 1106px) {
	#form-editor div#editor-top {
		height: 80px;
	}
	#form-editor div#editor-top #editor-top-control{
		height: 80px;
	}
	#form-editor div#editor-middle {
		height: calc( 100% - 120px );
	}
}
@media screen and (max-width: 729px) {
	#form-editor div#editor-top {
		height: 160px;
	}
	#form-editor div#editor-top #editor-top-control{
		height: 160px;
	}
	#form-editor div#editor-middle {
		height: calc( 100% - 200px );
	}
}
@media screen and (max-width: 609px) {
	#form-editor div#editor-top {
		height: 200px;
	}
	#form-editor div#editor-top #editor-top-control{
		height: 160px;
		margin-top: 40px;
	}
	#form-editor div#editor-middle {
		height: calc( 100% - 240px );
	}
}
@media screen and (max-width: 280px) {
	#form-editor {
		background: rgba( 0, 0, 0, 0.7 );
	}
	#form-editor div#editor-top {
		color: #fff;
	}
}
@media screen and (max-height: 400px) {
	header {
		height: 0px;
	}
	footer {
		height: 0px;
	}
	main {
		height: 100%;
	}
}
























cloud {
	display: block;
	position: fixed;
	width: 100%;
	height: 100%;
	
	top: 0px;
	left: 0px;
	
	background: rgba( 0, 0, 0, 0.6 );
	z-index: 999999999;
}

dialog {
	display: block;
	position: fixed;
	
	width: 300px;
	height: 120px;
	
	top: calc( 50% - 120px );
	/* left: calc( 50% - 150px - 3px ); */
	
	background: rgba( 230, 230, 230, 1 );
	
	border: 6px solid #fff;
	z-index: 9999999999;
}