.bpmn-panel,
.bpmn-panel > div {
  width: 100%;
  height: 100%;
  
  xxxxoverflow: hidden;
 
}

.bpmn-panel > .message {
  text-align: center;
  display: table;

  font-size: 16px;
  color: #111;
}

.bpmn-panel > .message .note {
  vertical-align: middle;
  text-align: center;
  display: table-cell;
}

.bpmn-panel .error .details {
  max-width: 1000px;
  font-size: 12px;
  margin: 20px auto;
  text-align: left;
}

.bpmn-panel .error pre {
  border: solid 1px #CCC;
  background: #EEE;
  padding: 10px;
  overflow: auto;
}

.bpmn-panel:not(.with-error) .error,
.bpmn-panel.with-error .intro,
.bpmn-panel.with-diagram .intro {
  display: none;
}


.bpmn-panel .canvas,
.bpmn-panel.with-error .canvas {
  visibility: hidden;
}

.bpmn-panel.with-diagram .canvas {
  visibility: visible;
}


#bpmn-canvas {
 	background-size: 20px 20px;
  	background-image:
    	linear-gradient(to right, #F0F0F0 1px, transparent 1px),
    	linear-gradient(to bottom, #F0F0F0 1px, transparent 1px);
}