@charset "UTF-8";
body {
  height: 100vh;
  overflow: hidden; }

#left {
  height: 100vh;
  overflow: scroll;
  background: #ccc;
  display: inline-block;
  text-align: center; }
  #left img {
    width: 150px;
    margin: 10px; }

#main {
  background: #edf0f2;
  text-align: center;
  height: 100vh; }

.edited #editor .template {
  pointer-events: none;
  z-index: 85; }

#top {
  height: 50px;
  z-index: 101;
  border-bottom: 1px solid #999;
  background: #fff;
  overflow: hidden;
  position: relative; }
  #top #controls, #top #pannel {
    background: #fff;
    width: 100%;
    padding: 8px 0; }
  #top #controls {
    position: absolute;
    top: 0;
    left: 0;
    padding: 4px 0; }
  #top i {
    color: #999; }

#editor {
  min-width: 1px;
  min-height: 1px;
  display: inline-block;
  position: relative;
  max-height: calc(100vh - 90px);
  margin: 20px 0; }
  #editor .template {
    z-index: 10;
    position: relative;
    top: 0;
    left: 0;
    max-height: calc(100vh - 90px);
    background-repeat: no-repeat; }
  #editor .over {
    position: absolute;
    top: 0;
    left: 0;
    pointer-events: none;
    z-index: 99;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    max-height: 100%; }
  #editor .pole {
    /*
    active - právě se edituje - 80
    full - je již vypněná - 1
    lock - edituje se jiné pole - 94
    */
    z-index: 1;
    position: absolute;
    width: 100px;
    height: 100px; }
    #editor .pole.lock {
      pointer-events: none;
      z-index: 94; }
    #editor .pole .preview {
      position: absolute;
      top: 0;
      left: 0;
      z-index: 0;
      display: none;
      pointer-events: none;
      transform-origin: 0 0; }
    #editor .pole .canvas-container {
      display: none;
      transform-origin: 0 0; }
    #editor .pole.full .preview {
      display: block; }
    #editor .pole.active {
      z-index: 80; }
      #editor .pole.active .canvas-container {
        display: block; }
      #editor .pole.active .preview {
        display: none; }

#map {
  z-index: 9; }
  #map area {
    background: #eee;
    z-index: 8; }
    #map area.removed {
      pointer-events: none; }

.cil {
  height: 200px;
  width: 200px;
  margin-top: 100px;
  background-color: #fff;
  box-shadow: 0 2px 8px rgba(14, 19, 24, 0.07);
  position: relative; }
  .cil.active {
    border: 1px solid #F90; }
  .cil .main {
    position: absolute;
    overflow: hidden;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%; }
  .cil .background img {
    opacity: 0.2; }
  .cil img {
    position: relative;
    left: -10px;
    top: -10px;
    transform-origin: left top 0px; }

/*# sourceMappingURL=index.css.map */