#svgroot {
  -moz-user-select: none;
  -webkit-user-select: none;
  display: block;
}

#svg_editor {
  background: var(--z1);
}

#svgcanvas {
  background-color: var(--z2);
  display: block;
}

#workarea {
  display: block;
  position:absolute;
  top: var(--x8);
  left: var(--x12);
  bottom: var(--x10);
  right: calc(var(--panel-width) + var(--x4));
  background-color: #c1c1c1;
  /*background-color: var(--z2);*/
  overflow: auto;
  align-items: center;
  justify-content: center;
  transition: transform 500ms cubic-bezier(0.13,0.66,0.24,0.92);
  border-radius: var(--x2);
  box-shadow: var(--shadow-bg);
}

.inverted #svgcanvas,
.inverted #workarea {
  background:  var(--z1);
}

#workarea.rect, #workarea.line, #workarea.ellipse, #workarea.path, #workarea.shapelib {
  cursor: crosshair;
}

#workarea.text {
  cursor: text;
}

#workarea.eyedropper {
  cursor: url(../images/eyedropper.svg) 0 16, crosshair;
}

#workarea.fhpath {
  cursor: url(../images/pencil_cursor.png) 0 16, crosshair;
}

#workarea.rotate * {
  cursor: url(../images/rotate.png) 12 12, auto;
}

#workarea.select text, #workarea.multiselect text {
  cursor: default;
}

#workarea.n-resize * {cursor: n-resize !important;}
#workarea.e-resize * {cursor: e-resize !important;}
#workarea.w-resize * {cursor: w-resize !important;}
#workarea.s-resize * {cursor: s-resize !important;}

#workarea.ne-resize * {cursor: ne-resize !important;}
#workarea.se-resize * {cursor: se-resize !important;}
#workarea.nw-resize * {cursor: nw-resize !important;}
#workarea.sw-resize * {cursor: sw-resize !important;}

#workspace.dragging *,
body.dragging * {
  cursor: url(../images/dragging.png), move;
  cursor: -webkit-grabbing;
  cursor: -moz-grabbing;
}

#workspace.drag * {
  cursor: url(../images/dragging.png), move;
  cursor: -webkit-grabbing;
  cursor: -moz-grabbing;
}

#workarea.copy {
  cursor: copy;
}

#workarea.zoom {
  cursor: crosshair;
  cursor:-moz-zoom-in;
  cursor:-webkit-zoom-in;
}
#workarea.zoom.out {
  cursor: crosshair;
  cursor:-moz-zoom-out;
  cursor:-webkit-zoom-out;
}

#selectorRubberBand {
  shape-rendering: crispEdges;
}
.scaleInputs, .custSize, .setDegree{width: 92%;}
#submitScale, #createCustRect, #setDegreeBtn{
  margin-top: 10px;
  padding: 5px 10px;
  display: block;
  font-size: 12px;
  width: auto;
}
#scaleMsg, #setDegreeMsg{color: white;}
.menu_list.transitions .menu_item {
  display: flex;
  align-items: center;
}
.menu_list.transitions .menu_item b {
  width: 20px;
  height: 20px;
  margin-left: auto;
  background: #ccc;
  box-sizing: border-box;
  position: absolute;
  right: 15px;
}
.menu_list.transitions .menu_item:hover {}
#dialog_content{padding: 26px !important;}
#dialog_buttons input[type=button] {
    margin: 1em !important;
}
sub{color: red;}
g#pathpointgrip_container {
    pointer-events: none;
}
text[class*="_roomName"]{
/*  pointer-events: none !important;*/
  text-anchor: middle;
  dominant-baseline: middle;
  fill: red;
  font-family: Verdana;
  font-size: 75px;
}
#svgcontent path #svgcontent path:not([class^="wallBase_"]){
  stroke-width: 1 !important;
}
[class^="wallBase_"], [data-class*="wallBase_"], [data-id*="wallBase_"]{
  stroke-width: 4 !important;
}
[data-class*="_roomName"], [class*="_length"] {
    pointer-events: none !important;
}
.wallBaseMenu{
  display: block !important;
}
path{
  stroke-width: 1 !important;
}
.zooming-controls {
  right: 204px;
  bottom: 65px;
  z-index: 99;
  display: flex;
  position: absolute;
  flex-direction: column;
}
.zooming-controls button {
  color: #FFF;
  border-radius: 0;
  margin: 2px 0;
  font-size: 14px;
  padding: 5px 4px;
  font-weight: 500;
  background-color: #8b8b8b;
}
.zooming-controls button:first-child {
  border-radius: 5px 5px 0 0;
  margin: 0;
}
.zooming-controls button:last-child {
  margin: 0;
  border-radius: 0 0 5px 5px;
}
[class^=doorway_]{
  fill:  #F5AB00;
  opacity: 0.7;
  stroke: black;
}
[room-option="Allowed-Seam-Zone"]{
  fill: #CBFFEB;
  opacity: 0.5;
}
path.transition{
  stroke-width: 5px !important;
}
path.transition_addon{
  stroke-width: 8px !important;
}