div.ImageEditor {
  display: none;
  height: 668px;
  position: relative;
  background-color: #999;
}
div.ImageEditor.HasImage:not(.Error) {
  background: none;
}
div.ImageEditor.HasImage:not(.Error) div.Bar {
  background-color: black;
}
div.ImageEditor.HasImage:not(.Error) div.Background {
  background-color: black;
}
div.ImageEditor.HasImage:not(.Error) div.Background div.ImageBackground {
  background-color: black;
}
div.ImageEditor.HasImage:not(.Error) div.Controls.noUi-target {
  background: black !important;
}
div.ImageEditor div.Error {
  display: none;
  color: red;
  background: none;
  position: relative;
  width: 80%;
  margin: auto;
  text-align: center;
  z-index: 2;
}
div.ImageEditor div.Bar {
  background-color: #999;
  display: none;
  width: 100%;
  height: 10px;
  margin: auto;
  margin-bottom: 10px;
}
div.ImageEditor div.Bar div.Progress {
  width: 0;
  height: 100%;
  background-color: white;
}
div.ImageEditor div.Background {
  width: 612px;
  height: 600px;
  margin: auto;
  position: relative;
  background-color: #999;
}
div.ImageEditor div.Background div.ImageBackground {
  margin: auto;
  max-width: 100%;
  overflow: hidden;
  position: relative;
  background-color: #999;
}
div.ImageEditor div.Background div.ImageBackground div.ImageEdit {
  cursor: move;
  position: absolute;
  background-size: contain !important;
}
div.ImageEditor div.Controls.noUi-target.noUi-horizontal {
  border-radius: 0;
  height: 7px;
  box-shadow: none;
}
div.ImageEditor div.Controls.noUi-target.noUi-horizontal div.noUi-handle {
  background: white !important;
  height: 13px !important;
  width: 10px !important;
  right: -6px;
  top: -4px;
  box-shadow: none;
  cursor: pointer;
}
div.ImageEditor div.Controls.noUi-target.noUi-horizontal div.noUi-handle::after, div.ImageEditor div.Controls.noUi-target.noUi-horizontal div.noUi-handle::before {
  width: 0;
}
div.ImageEditor div.Controls.noUi-target.noUi-horizontal div.noUi-handle:focus {
  outline: none;
}
div.ImageEditor div.Zoom {
  display: none;
  margin: auto;
  margin-top: 15px;
}
div.ImageEditor div.Zoom div {
  height: 30px;
  display: inline-block;
  color: #ccc;
  line-height: 30px;
  text-align: center;
  font-weight: bold;
  font-size: 20px;
}
div.ImageEditor div.Zoom div.Side:first-child {
  text-align: left;
}
div.ImageEditor div.Zoom div.Side:last-child {
  text-align: right;
}
div.ImageEditor div.Zoom div.Side {
  width: 30px;
}
div.ImageEditor div.Zoom div.Central {
  width: 542px;
}

div.Overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 9999;
  background: rgba(255, 255, 255, 0.95);
  display: none;
}
div.Overlay .Container {
  position: relative;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
div.Overlay#Camera {
  background: rgba(0, 0, 0, 0.95);
}
div.Overlay#Camera .Container {
  text-align: center;
}
div.Overlay#Camera .Container video {
  display: block;
  margin: auto;
  margin-bottom: 20px;
}
div.Overlay#Camera .Container .Buttons {
  display: inline-flex;
  margin: auto;
  gap: 40px;
}
div.Overlay#Camera .Container .Buttons div:first-child {
  margin-left: 0;
}
div.Overlay#Editor div.EditorContainer {
  position: relative;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 622px;
}
div.Overlay#Editor div.EditorContainer div#ImageControls {
  position: absolute;
  display: none;
  z-index: 3;
  top: 20px;
  left: 0;
  right: 0;
}
div.Overlay#Editor div.EditorContainer div#ImageControls div.ImageControls__Container {
  display: flex !important;
  justify-content: center;
  gap: 40px;
}
div.Overlay#Editor div.EditorContainer div#ImageEditor {
  margin: auto;
}
div.Overlay:not(.Error) div.EditorContainer div#ImageControls div.Camera {
  position: fixed;
  top: 270px;
  font-size: 60px;
  height: 120px;
  width: 120px;
  line-height: 120px;
}
div.Overlay .Buttons div.Upload, div.Overlay .Buttons div.Close, div.Overlay .Buttons div.RotateLeft, div.Overlay .Buttons div.RotateRight, div.Overlay .Buttons div.Camera, div.Overlay .Buttons div.Reset {
  position: relative;
  float: left;
  width: 70px;
  height: 70px;
  text-align: center;
  line-height: 70px;
  cursor: pointer;
  font-size: 30px;
  border: solid 2px white;
  border-radius: 50%;
}
div.Overlay .Buttons div.Upload i, div.Overlay .Buttons div.Close i, div.Overlay .Buttons div.RotateLeft i, div.Overlay .Buttons div.RotateRight i, div.Overlay .Buttons div.Camera i, div.Overlay .Buttons div.Reset i {
  color: white;
}
div.Overlay .Buttons div.Upload:hover i, div.Overlay .Buttons div.Close:hover i, div.Overlay .Buttons div.RotateLeft:hover i, div.Overlay .Buttons div.RotateRight:hover i, div.Overlay .Buttons div.Camera:hover i, div.Overlay .Buttons div.Reset:hover i {
  color: white;
}
div.Overlay .Buttons div.Upload:after, div.Overlay .Buttons div.Close:after, div.Overlay .Buttons div.RotateLeft:after, div.Overlay .Buttons div.RotateRight:after, div.Overlay .Buttons div.Camera:after, div.Overlay .Buttons div.Reset:after {
  display: block;
  content: attr(data-label);
  position: absolute;
  top: calc(100% + 10px);
  left: -10px;
  width: calc(100% + 20px);
  text-align: center;
  font-size: 10px;
  line-height: 16px;
  color: white;
}

div.ImagePreview {
  position: relative;
  overflow: hidden;
  vertical-align: top;
  border: solid 2px #999;
  padding: 10px;
  background-color: #999;
  display: inline-block;
  cursor: pointer;
  color: #ccc;
  font-family: "Futura", Arial, Freesans;
  font-size: 20px;
  text-transform: uppercase;
  text-align: center;
  width: 110px;
  height: 110px;
  margin-top: 24px;
}
div.ImagePreview input[type=file] {
  pointer-events: none;
}
div.ImagePreview input[type=file], div.ImagePreview div.Opacity {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  opacity: 0;
  cursor: pointer;
}
div.ImagePreview div.Opacity {
  z-index: 0;
  background-color: black;
}
div.ImagePreview i {
  display: block;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  z-index: 1;
  width: 100%;
  text-align: center;
  cursor: pointer;
  pointer-events: none;
  margin: 0;
  font-size: 40px;
}
div.ImagePreview:hover {
  color: white;
  border: solid 2px white;
}
div.ImagePreview:hover div.Circle {
  background-color: white;
}
div.ImagePreview.Uploaded i {
  display: none;
}
div.ImagePreview.Uploaded:hover div.Opacity {
  opacity: 0.6;
}

/*# sourceMappingURL=data:application/json;charset=utf-8,%7B%22version%22:3,%22sourceRoot%22:%22%22,%22sources%22:%5B%22file:///C:/Progetti/Lux/Lux/Content/Theme/ImageEditor.scss%22,%22file:///C:/Progetti/Lux/Lux/Content/Theme/_Library.scss%22%5D,%22names%22:%5B%5D,%22mappings%22:%22AAKA;EACI;EACA;EACA;EACA;;AAEA;EACI;;AAEA;EACI;;AAGJ;EACI;;AAEA;EACI;;AAIR;EACI;;AAIR;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGJ;EACI,kBClCK;EDmCL;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA,kBAlDK;;AAsDb;EACI;EACA;EACA;EACA;EACA,kBCrDK;;ADuDL;EACI;EACA;EACA;EACA;EACA,kBC5DC;;AD8DD;EACI;EACA;EACA;;AAKZ;EACI;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;;AAKZ;EACI;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;;AAGJ;EACI;;AAGJ;EACI;;;AAMhB;EACI;EACA;EACA;EACA;EACA;EACA,SCzFY;ED0FZ;EACA;;AAEA;EACI;EACA;EACA;EACA;;AAGJ;EACI;;AAEA;EACI;;AAEA;EACI;EACA;EACA;;AAGJ;EACI;EACA;EACA;;AAGI;EACI;;AAQhB;EACI;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;;AAIR;EACI;;AAQA;EACI;EACA;EACA;EACA;EACA;EACA;;AAOZ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI,OA1OC;;AA6OL;EACI,OA9OC;;AAiPL;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAMhB;EACI;EACA;EACA;EACA;EACA;EACA,kBCjQS;EDkQT;EACA;EACA,OCrQc;EDsQd;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;AAGJ;EACI;EACA;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGJ;EACI;EACA;;AAEA;EACI;;AAMJ;EACI;;AAIA;EACI%22%7D */