body {
	margin-top:10px;
}

/* element view canvas*/
element-view-frame {
	position: relative;
}

element-view-frame element {
	position: relative;
	overflow: hidden;
}

element-view-frame element .frame{
	border: solid 1px #333;
	margin : 5px;
	padding : 10px;
	cursor: pointer;
	position: relative;
}

element-view-frame element .text{
	margin : 0px;
}

element-view-frame element .edit{
	position: absolute;
	display:block;
	right: 10px;
	top:10px;
}


element-view-frame .selected {
	background: #CCC;
	cursor: move;
}

/* element view canvas*/
element-view-canvas {
	position: relative;
}

element-view-canvas element {
	position: relative;
	display:block;
}

element-view-canvas .template {

}

element-view-canvas .drag { 
	
}

element-view-canvas .panel-group .panel-element {
	overflow:visible;
}

element-view-canvas .drag-active  {
		background: #CCC;
}

element-view-canvas .drop-active {
	background:#EEE;
}

element-view-canvas .please {
	background:#EEE;
	border: dashed 2px #999;
	margin:10px auto;
	padding:20px;
	text-align:center;
}

element-view-canvas .drop{
	position:absolute;
}

element-view-canvas .drag{
	position:absolute;
	width:100%;
	height:100%;
	top:0;
	left:0;
}

element-view-canvas .click{
	position:absolute;
	width:100%;
	height:100%;
	top:0;
	left:0;
	cursor: pointer;
	z-index: 1002;
}

element-view-canvas .clicked{
	z-index: 1003;
	cursor: move;
}

element-view-canvas .drag-active .click{
	display: none;
}

element-view-canvas .border {
	position:absolute;
	width:100%;
	height:100%;
	top:0;
	left:0;
	border: dashed 2px #CCC;
	cursor: move;
	z-index: 1001;
}
	
element-view-canvas .plop{
	position:absolute;
	top:0px;
	right:0px;
	padding: 0px 5px;
	background-color:#999;
	color:#CCC;
	z-index: 1004;
}


/* Validation */
element-view-preview input.ng-valid{
	border: 1px solid #0F0;
}

element-view-preview input.ng-invalid{
	border: 1px solid #F00;
	background: #933;
}

.panel-group .panel-element{
	overflow: visible;
}

.panel-group .panel-element .new{
	z-index: 1005;
}