#logo {
  width: 36px;
  height: 35px;
  background-color: rgba(30, 30, 30, 0.92);
  border-bottom: 1px solid #0d0d0d;
  position: absolute;
  top: 10px;
  left: 20px;
}
#logo > div {
  position: absolute;
  top: 4px;
}
#logo > div.red {
  background-color: #e03f4a;
}
#logo > div.yellow {
  background-color: #f1cf2e;
}
#logo > div.blue {
  background-color: #3fb2e0;
}
#logo #left-bar,
#logo #right-bar {
  width: 8px;
  height: 28px;
}
#logo #middle-bar {
  width: 8px;
  height: 10px;
  left: 16px;
}
#logo #left-bar {
  left: 4px;
}
#logo #right-bar {
  right: 0px;
}
.ellipsis-overflow {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  -moz-text-overflow: ellipsis;
  -webkit-text-overflow: ellipsis;
}
.maven-pro {
  font-family: Maven Pro, 'Maven Pro';
}
@font-face {
  font-family: 'Maven Pro';
  font-style: normal;
  font-weight: 400;
  src: local('Maven Pro Light'), local('Maven-Pro-Light'), url(/assets/fonts/maven-pro.400.woff) format('woff');
}
@font-face {
  font-family: 'Maven Pro';
  font-style: normal;
  font-weight: 500;
  src: local('Maven Pro Medium'), local('Maven-Pro-Medium'), url(/assets/fonts/maven-pro.500.woff) format('woff');
}
@font-face {
  font-family: 'Maven Pro';
  font-style: normal;
  font-weight: 700;
  src: local('Maven Pro Dark'), local('Maven-Pro-Dark'), url(/assets/fonts/maven-pro.700.woff) format('woff');
}
.utility-window-colors {
  background-color: rgba(234, 234, 234, 0.92);
  border-bottom: 1px solid rgba(220, 220, 220, 0.92);
  cursor: url('/assets/images/cursors/cursor.png') 1 1, default !important;
}
.no-select {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
html,
body,
input,
textarea,
select,
button {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}
body {
  font-family: Maven Pro, 'Maven Pro';
  font-size: 14px;
  margin: 0;
  height: 100%;
  overflow: hidden;
  background: #f7f7f7;
}
body[tool="cursor"],
body[tool="cursor"] svg,
body[tool="cursor"] svg * {
  cursor: url('/assets/images/cursors/cursor.png') 1 1, default !important;
}
body[tool="pen"],
body[tool="pen"] svg,
body[tool="pen"] svg * {
  cursor: url('/assets/images/cursors/type-a.png') 5 0, default !important;
}
body[tool="crayon"],
body[tool="crayon"] svg,
body[tool="crayon"] svg * {
  cursor: url('/assets/images/cursors/crayon.png') 5 0, default !important;
}
body[tool="crosshair"],
body[tool="crosshair"] svg,
body[tool="crosshair"] svg * {
  cursor: url('/assets/images/cursors/crosshair.png') 7 7, default !important;
}
body[tool="type"],
body[tool="type"] svg,
body[tool="type"] svg * {
  cursor: text!important;
}
body[tool="zoom"],
body[tool="zoom"] svg,
body[tool="zoom"] svg * {
  cursor: url('/assets/images/cursors/loupe.png') 5 5, default !important;
}
body[tool="eyedropper"],
body[tool="eyedropper"] svg,
body[tool="eyedropper"] svg * {
  cursor: url('/assets/images/cursors/eyedropper.png') 1 15, default !important;
}
body[tool="paw"],
body[tool="paw"] svg,
body[tool="paw"] svg * {
  cursor: url('/assets/images/cursors/none.png') 1 1, default !important;
}
body[tool="paw-clutch"],
body[tool="paw-clutch"] svg,
body[tool="paw-clutch"] svg * {
  cursor: none!important;
}
body .⌘:after {
  content: '⌘';
}
body[os="windows"] .⌘:after {
  content: 'ctrl';
  margin: auto 2px;
  letter-spacing: -0.01em;
}
div#canvas {
  position: absolute;
  background: white;
  top: 0px;
  left: 0px;
  border: 1px solid rgba(0, 0, 0, 0.1);
}
div#typography {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  pointer-events: none;
}
div#typography .text {
  position: absolute;
  outline: none;
  pointer-events: auto;
  margin: 0;
  display: none;
  border-bottom: 1px solid rgba(115, 160, 235, 0.3);
  min-width: 5px;
}
div#tool-cursor-placeholder {
  position: absolute;
  width: 20px;
  height: 20px;
  background-position: top-left;
  background-repeat: no-repeat;
  z-index: 10000;
}
div#tool-cursor-placeholder[tool="cursor"] {
  background-image: url('/assets/images/cursors/cursor.png') !important;
}
div#tool-cursor-placeholder[tool="pen"] {
  background-image: url('/assets/images/cursors/type-a.png') !important;
}
div#tool-cursor-placeholder[tool="crayon"] {
  background-image: url('/assets/images/cursors/crayon.png') !important;
}
div#tool-cursor-placeholder[tool="crosshair"] {
  background-image: url('/assets/images/cursors/crosshair.png') !important;
}
div#tool-cursor-placeholder[tool="zoom"] {
  background-image: url('/assets/images/cursors/loupe.png') !important;
}
div#tool-cursor-placeholder[tool="eyedropper"] {
  background-image: url('/assets/images/cursors/eyedropper.png') !important;
}
div#tool-cursor-placeholder[tool="paw"] {
  background-image: url('/assets/images/cursors/paw.png') !important;
}
div#tool-cursor-placeholder[tool="paw-clutch"] {
  background-image: url('/assets/images/cursors/paw-clutch.png') !important;
}
#dialog-title {
  position: absolute;
  top: 20px;
  left: 87px;
  font-family: Maven Pro, 'Maven Pro';
  font-weight: 400;
  font-size: 14px;
}
div#tool-palette {
  position: fixed;
  left: 0;
  top: 100px;
  z-index: 9990;
}
div#tool-palette div.tool-button {
  width: 36px;
  height: 35px;
  background-repeat: no-repeat;
  border-bottom-width: 1px;
  border-bottom-style: solid;
  border-bottom-color: rgba(220, 220, 220, 0.92);
  cursor: url('/assets/images/cursors/cursor.png') 1 1, default !important;
  margin-left: 20px;
  margin-bottom: 5px;
  position: relative;
}
div#tool-palette div.tool-button[tool="cursor"] {
  background-image: url('/assets/images/cursors/cursor.png') !important;
  background-position: 14px 10px;
}
div#tool-palette div.tool-button[tool="pen"] {
  background-image: url('/assets/images/cursors/type-a.png') !important;
  background-position: 13px 8px;
}
div#tool-palette div.tool-button[tool="crayon"] {
  background-image: url('/assets/images/cursors/crayon.png') !important;
  background-position: 12px 8px;
}
div#tool-palette div.tool-button[tool="ellipse"] {
  background-image: url('/assets/images/cursors/ellipse.png') !important;
  background-position: 10px 9px;
}
div#tool-palette div.tool-button[tool="rectangle"] {
  background-image: url('/assets/images/cursors/rectangle.png') !important;
  background-position: 10px 9px;
}
div#tool-palette div.tool-button[tool="line"] {
  background-image: url('/assets/images/cursors/line.png') !important;
  background-position: 10px 9px;
}
div#tool-palette div.tool-button[tool="rotate"] {
  background-image: url('/assets/images/cursors/rotate.png') !important;
  background-position: 10px 9px;
}
div#tool-palette div.tool-button[tool="type"] {
  background-image: url('/assets/images/cursors/olivetti.png') !important;
  background-position: 8px 9px;
}
div#tool-palette div.tool-button[tool="eyedropper"] {
  background-image: url('/assets/images/cursors/eyedropper.png') !important;
  background-position: 10px 9px;
}
div#tool-palette div.tool-button[tool="zoom"] {
  background-image: url('/assets/images/cursors/loupe.png') !important;
  background-position: 10px 9px;
}
div#tool-palette div.tool-button[tool="eyedropper"] {
  background-image: url('/assets/images/cursors/eyedropper.png') !important;
  background-position: 10px 9px;
}
div#tool-palette div.tool-button .tool-info {
  display: none;
  position: absolute;
  white-space: nowrap;
  top: 0;
  left: 50px;
  padding: 9px;
  padding-right: 45px;
  border-bottom: 1px solid rgba(220, 220, 220, 0.92);
}
div#tool-palette div.tool-button .tool-info.disabled {
  color: #818181;
}
div#tool-palette div.tool-button .tool-info .shortcut {
  position: absolute;
  top: 9px;
  right: 9px;
  margin-left: 10px;
  opacity: 0.5;
}
div#tool-palette div.tool-button .tool-info .shortcut:before {
  display: block;
  width: 20px;
  height: 1px;
}
div#tool-palette div.tool-button .tool-info .shortcut span.modifier {
  font-size: 12px;
}
div#menu-bar,
div#login-bar,
div#register-bar,
div#current-service {
  font-family: Maven Pro, 'Maven Pro';
  font-size: 14px;
  font-weight: 400;
  position: absolute;
  top: 10px;
  z-index: 9990;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
div#menu-bar#menu-bar,
div#login-bar#menu-bar,
div#register-bar#menu-bar,
div#current-service#menu-bar {
  left: 61px;
}
div#menu-bar#login-bar,
div#login-bar#login-bar,
div#register-bar#login-bar,
div#current-service#login-bar {
  right: 20px;
}
div#menu-bar #register-menu,
div#login-bar #register-menu,
div#register-bar #register-menu,
div#current-service #register-menu {
  font-size: 14px;
  text-align: center;
  font-weight: 500;
}
div#menu-bar #register-menu p,
div#login-bar #register-menu p,
div#register-bar #register-menu p,
div#current-service #register-menu p {
  color: black;
  white-space: normal;
  font-weight: 400;
  text-align: left;
  margin: 10px;
}
div#menu-bar #register-menu ul,
div#login-bar #register-menu ul,
div#register-bar #register-menu ul,
div#current-service #register-menu ul {
  color: black;
  text-align: left;
  padding: 0;
  margin: 0;
  border-left: 1px solid rgba(0, 0, 0, 0.2);
  margin-top: 10px;
  margin-left: 10px;
}
div#menu-bar #register-menu ul li,
div#login-bar #register-menu ul li,
div#register-bar #register-menu ul li,
div#current-service #register-menu ul li {
  list-style-type: none;
  font-weight: 300;
  padding: 5px 10px;
}
div#menu-bar #register-menu emph,
div#login-bar #register-menu emph,
div#register-bar #register-menu emph,
div#current-service #register-menu emph {
  font-weight: 700;
}
div#menu-bar #register-menu .terms,
div#login-bar #register-menu .terms,
div#register-bar #register-menu .terms,
div#current-service #register-menu .terms {
  white-space: normal;
  color: rgba(0, 0, 0, 0.7);
  margin: 10px;
  text-align: left;
}
div#menu-bar #register-menu .terms a,
div#login-bar #register-menu .terms a,
div#register-bar #register-menu .terms a,
div#current-service #register-menu .terms a {
  color: rgba(63, 142, 185, 0.92);
  text-decoration: underline;
}
div#menu-bar #about-menu ul,
div#login-bar #about-menu ul,
div#register-bar #about-menu ul,
div#current-service #about-menu ul {
  margin: 10px 0 0 0;
  padding: 0;
}
div#menu-bar #about-menu ul li,
div#login-bar #about-menu ul li,
div#register-bar #about-menu ul li,
div#current-service #about-menu ul li {
  list-style-type: none;
  font-weight: 300;
  padding: 3px 0 5px 10px;
  border-left: 1px solid rgba(0, 0, 0, 0.1);
}
div#menu-bar .menu-group,
div#login-bar .menu-group,
div#register-bar .menu-group,
div#current-service .menu-group {
  margin: 0px;
  float: left;
}
div#menu-bar .menu-group > .menu:first-child,
div#login-bar .menu-group > .menu:first-child,
div#register-bar .menu-group > .menu:first-child,
div#current-service .menu-group > .menu:first-child {
  margin-left: 15px;
}
div#menu-bar .menu-group > .menu.hidden,
div#login-bar .menu-group > .menu.hidden,
div#register-bar .menu-group > .menu.hidden,
div#current-service .menu-group > .menu.hidden {
  display: none;
  margin: 0;
}
div#menu-bar .menu-group > .menu,
div#login-bar .menu-group > .menu,
div#register-bar .menu-group > .menu,
div#current-service .menu-group > .menu,
div#menu-bar .menu-group > .menu-item,
div#login-bar .menu-group > .menu-item,
div#register-bar .menu-group > .menu-item,
div#current-service .menu-group > .menu-item {
  margin-left: 1px;
  display: inline-block;
  padding: 9px 10px;
  cursor: url('/assets/images/cursors/cursor.png') 1 1, default !important;
  position: relative;
  border-bottom-width: 1px;
  border-bottom-style: solid;
  border-bottom-color: rgba(220, 220, 220, 0.92);
  background: rgba(234, 234, 234, 0.92);
}
div#menu-bar .menu-group > .menu a,
div#login-bar .menu-group > .menu a,
div#register-bar .menu-group > .menu a,
div#current-service .menu-group > .menu a,
div#menu-bar .menu-group > .menu-item a,
div#login-bar .menu-group > .menu-item a,
div#register-bar .menu-group > .menu-item a,
div#current-service .menu-group > .menu-item a {
  color: black;
  text-decoration: none;
}
div#menu-bar .menu-group > .menu a:not(.normal-link),
div#login-bar .menu-group > .menu a:not(.normal-link),
div#register-bar .menu-group > .menu a:not(.normal-link),
div#current-service .menu-group > .menu a:not(.normal-link),
div#menu-bar .menu-group > .menu-item a:not(.normal-link),
div#login-bar .menu-group > .menu-item a:not(.normal-link),
div#register-bar .menu-group > .menu-item a:not(.normal-link),
div#current-service .menu-group > .menu-item a:not(.normal-link) {
  cursor: url('/assets/images/cursors/cursor.png') 1 1, default !important;
}
div#menu-bar .menu-group > .menu.with-input,
div#login-bar .menu-group > .menu.with-input,
div#register-bar .menu-group > .menu.with-input,
div#current-service .menu-group > .menu.with-input,
div#menu-bar .menu-group > .menu-item.with-input,
div#login-bar .menu-group > .menu-item.with-input,
div#register-bar .menu-group > .menu-item.with-input,
div#current-service .menu-group > .menu-item.with-input {
  padding: 6px;
  position: relative;
  top: -1px;
}
div#menu-bar .menu-group .menu-dropdown,
div#login-bar .menu-group .menu-dropdown,
div#register-bar .menu-group .menu-dropdown,
div#current-service .menu-group .menu-dropdown {
  display: none;
  position: absolute;
  white-space: nowrap;
  top: 41px;
  left: 0;
}
div#menu-bar .menu-group .menu-dropdown.right-align,
div#login-bar .menu-group .menu-dropdown.right-align,
div#register-bar .menu-group .menu-dropdown.right-align,
div#current-service .menu-group .menu-dropdown.right-align {
  left: auto;
  right: 0;
}
div#menu-bar .menu-group .menu-dropdown.with-shortcuts .menu-item,
div#login-bar .menu-group .menu-dropdown.with-shortcuts .menu-item,
div#register-bar .menu-group .menu-dropdown.with-shortcuts .menu-item,
div#current-service .menu-group .menu-dropdown.with-shortcuts .menu-item {
  padding-right: 45px;
}
div#menu-bar .menu-group .menu-dropdown .menu-item,
div#login-bar .menu-group .menu-dropdown .menu-item,
div#register-bar .menu-group .menu-dropdown .menu-item,
div#current-service .menu-group .menu-dropdown .menu-item {
  padding: 9px;
  position: relative;
  overflow: hidden;
}
div#menu-bar .menu-group .menu-dropdown .menu-item.disabled,
div#login-bar .menu-group .menu-dropdown .menu-item.disabled,
div#register-bar .menu-group .menu-dropdown .menu-item.disabled,
div#current-service .menu-group .menu-dropdown .menu-item.disabled {
  color: #818181;
}
div#menu-bar .menu-group .menu-dropdown .menu-item.bottom,
div#login-bar .menu-group .menu-dropdown .menu-item.bottom,
div#register-bar .menu-group .menu-dropdown .menu-item.bottom,
div#current-service .menu-group .menu-dropdown .menu-item.bottom {
  border-bottom: 1px solid rgba(220, 220, 220, 0.92);
}
div#menu-bar .menu-group .menu-dropdown .menu-item emph,
div#login-bar .menu-group .menu-dropdown .menu-item emph,
div#register-bar .menu-group .menu-dropdown .menu-item emph,
div#current-service .menu-group .menu-dropdown .menu-item emph {
  font-weight: 500;
}
div#menu-bar .menu-group .menu-dropdown .menu-item .shortcut,
div#login-bar .menu-group .menu-dropdown .menu-item .shortcut,
div#register-bar .menu-group .menu-dropdown .menu-item .shortcut,
div#current-service .menu-group .menu-dropdown .menu-item .shortcut {
  position: absolute;
  top: 9px;
  right: 9px;
  margin-left: 10px;
  opacity: 0.5;
}
div#menu-bar .menu-group .menu-dropdown .menu-item .shortcut:before,
div#login-bar .menu-group .menu-dropdown .menu-item .shortcut:before,
div#register-bar .menu-group .menu-dropdown .menu-item .shortcut:before,
div#current-service .menu-group .menu-dropdown .menu-item .shortcut:before {
  display: block;
  width: 20px;
  height: 1px;
}
div#menu-bar .menu-group .menu-dropdown .menu-item .shortcut span.modifier,
div#login-bar .menu-group .menu-dropdown .menu-item .shortcut span.modifier,
div#register-bar .menu-group .menu-dropdown .menu-item .shortcut span.modifier,
div#current-service .menu-group .menu-dropdown .menu-item .shortcut span.modifier {
  font-size: 12px;
}
div#menu-bar .menu-group .menu-dropdown .menu-item#open-from-hd-item input[type="file"],
div#login-bar .menu-group .menu-dropdown .menu-item#open-from-hd-item input[type="file"],
div#register-bar .menu-group .menu-dropdown .menu-item#open-from-hd-item input[type="file"],
div#current-service .menu-group .menu-dropdown .menu-item#open-from-hd-item input[type="file"] {
  position: absolute;
  top: -5px;
  left: -5px;
  width: 400px;
  height: 40px;
  opacity: 0;
}
div#menu-bar .menu-group .menu-dropdown .menu-item#open-from-url-item.input-mode,
div#login-bar .menu-group .menu-dropdown .menu-item#open-from-url-item.input-mode,
div#register-bar .menu-group .menu-dropdown .menu-item#open-from-url-item.input-mode,
div#current-service .menu-group .menu-dropdown .menu-item#open-from-url-item.input-mode {
  padding: 5px 9px 6px 9px;
}
div#menu-bar .menu-group .menu-dropdown .menu-item#open-from-url-item.input-mode input,
div#login-bar .menu-group .menu-dropdown .menu-item#open-from-url-item.input-mode input,
div#register-bar .menu-group .menu-dropdown .menu-item#open-from-url-item.input-mode input,
div#current-service .menu-group .menu-dropdown .menu-item#open-from-url-item.input-mode input {
  display: block;
}
div#menu-bar .menu-group .menu-dropdown .menu-item#open-from-url-item.input-mode span[buttontext],
div#login-bar .menu-group .menu-dropdown .menu-item#open-from-url-item.input-mode span[buttontext],
div#register-bar .menu-group .menu-dropdown .menu-item#open-from-url-item.input-mode span[buttontext],
div#current-service .menu-group .menu-dropdown .menu-item#open-from-url-item.input-mode span[buttontext] {
  display: none;
}
div#menu-bar .menu-group .menu-dropdown .menu-item#open-from-url-item input,
div#login-bar .menu-group .menu-dropdown .menu-item#open-from-url-item input,
div#register-bar .menu-group .menu-dropdown .menu-item#open-from-url-item input,
div#current-service .menu-group .menu-dropdown .menu-item#open-from-url-item input {
  display: none;
  width: 100%;
  text-align: left;
}
div#menu-bar .menu-group .menu-dropdown .separator,
div#login-bar .menu-group .menu-dropdown .separator,
div#register-bar .menu-group .menu-dropdown .separator,
div#current-service .menu-group .menu-dropdown .separator {
  width: 100%;
  display: block;
  height: 1px;
  padding: 5px 0;
  background: rgba(234, 234, 234, 0.92);
}
div#menu-bar .menu-group .menu-dropdown .separator .separator-line,
div#login-bar .menu-group .menu-dropdown .separator .separator-line,
div#register-bar .menu-group .menu-dropdown .separator .separator-line,
div#current-service .menu-group .menu-dropdown .separator .separator-line {
  height: 1px;
  width: 100%;
  background: rgba(200, 200, 200, 0.92);
}
div#menu-bar .menu-group input[type="text"],
div#login-bar .menu-group input[type="text"],
div#register-bar .menu-group input[type="text"],
div#current-service .menu-group input[type="text"],
div#menu-bar .menu-group input[type="password"],
div#login-bar .menu-group input[type="password"],
div#register-bar .menu-group input[type="password"],
div#current-service .menu-group input[type="password"] {
  font-family: Maven Pro, 'Maven Pro';
  outline: none;
}
div#menu-bar .menu-group input[type="text"]:not(.small),
div#login-bar .menu-group input[type="text"]:not(.small),
div#register-bar .menu-group input[type="text"]:not(.small),
div#current-service .menu-group input[type="text"]:not(.small),
div#menu-bar .menu-group input[type="password"]:not(.small),
div#login-bar .menu-group input[type="password"]:not(.small),
div#register-bar .menu-group input[type="password"]:not(.small),
div#current-service .menu-group input[type="password"]:not(.small) {
  font-size: 14px;
}
div#menu-bar .menu-group#logout-mg,
div#login-bar .menu-group#logout-mg,
div#register-bar .menu-group#logout-mg,
div#current-service .menu-group#logout-mg,
div#menu-bar .menu-group#account-mg,
div#login-bar .menu-group#account-mg,
div#register-bar .menu-group#account-mg,
div#current-service .menu-group#account-mg,
div#menu-bar .menu-group#filename-menu,
div#login-bar .menu-group#filename-menu,
div#register-bar .menu-group#filename-menu,
div#current-service .menu-group#filename-menu {
  display: none;
}
div#menu-bar #embed-menu-dropdown,
div#login-bar #embed-menu-dropdown,
div#register-bar #embed-menu-dropdown,
div#current-service #embed-menu-dropdown {
  padding: 10px;
}
div#menu-bar #embed-menu-dropdown textarea,
div#login-bar #embed-menu-dropdown textarea,
div#register-bar #embed-menu-dropdown textarea,
div#current-service #embed-menu-dropdown textarea {
  font-family: Consolas, monaco;
  width: 100%;
  height: 55px;
  margin-top: 10px;
}
div#menu-bar #embed-menu-dropdown input,
div#login-bar #embed-menu-dropdown input,
div#register-bar #embed-menu-dropdown input,
div#current-service #embed-menu-dropdown input {
  width: 50px;
  display: inline-block;
  margin-right: 0;
  margin-top: 0;
}
div#menu-bar .menu-modal,
div#login-bar .menu-modal,
div#register-bar .menu-modal,
div#current-service .menu-modal {
  width: 195px;
  background-color: rgba(234, 234, 234, 0.92);
  border-bottom: 1px solid rgba(220, 220, 220, 0.92);
  cursor: url('/assets/images/cursors/cursor.png') 1 1, default !important;
  display: none;
}
div#menu-bar .menu-modal button,
div#login-bar .menu-modal button,
div#register-bar .menu-modal button,
div#current-service .menu-modal button {
  display: block;
  position: static;
  margin: 10px;
  width: 175px;
  padding: 7px;
}
div#menu-bar .menu-modal input,
div#login-bar .menu-modal input,
div#register-bar .menu-modal input,
div#current-service .menu-modal input {
  text-align: left;
  width: 175px;
  display: block;
  border-bottom: 1px solid rgba(220, 220, 220, 0.92);
  margin: 10px 10px 0px 10px;
}
.menu-item,
.menu,
.tool-button,
button {
  background-color: rgba(234, 234, 234, 0.92);
}
.menu-item:not(.disabled):not(.pending).blue:hover,
.menu:not(.disabled):not(.pending).blue:hover,
.tool-button:not(.disabled):not(.pending).blue:hover,
button:not(.disabled):not(.pending).blue:hover,
.menu-item:not(.disabled):not(.pending).blue[selected],
.menu:not(.disabled):not(.pending).blue[selected],
.tool-button:not(.disabled):not(.pending).blue[selected],
button:not(.disabled):not(.pending).blue[selected],
.menu-item:not(.disabled):not(.pending).blue .tool-info,
.menu:not(.disabled):not(.pending).blue .tool-info,
.tool-button:not(.disabled):not(.pending).blue .tool-info,
button:not(.disabled):not(.pending).blue .tool-info {
  background-color: rgba(158, 217, 240, 0.92) !important;
  border-bottom-color: rgba(135, 196, 226, 0.92) !important;
}
.menu-item:not(.disabled):not(.pending).blue:active,
.menu:not(.disabled):not(.pending).blue:active,
.tool-button:not(.disabled):not(.pending).blue:active,
button:not(.disabled):not(.pending).blue:active,
.menu-item:not(.disabled):not(.pending).blue.down,
.menu:not(.disabled):not(.pending).blue.down,
.tool-button:not(.disabled):not(.pending).blue.down,
button:not(.disabled):not(.pending).blue.down {
  background-color: #9ad5ec !important;
}
.menu-item:not(.disabled):not(.pending).red:hover,
.menu:not(.disabled):not(.pending).red:hover,
.tool-button:not(.disabled):not(.pending).red:hover,
button:not(.disabled):not(.pending).red:hover,
.menu-item:not(.disabled):not(.pending).red[selected],
.menu:not(.disabled):not(.pending).red[selected],
.tool-button:not(.disabled):not(.pending).red[selected],
button:not(.disabled):not(.pending).red[selected],
.menu-item:not(.disabled):not(.pending).red .tool-info,
.menu:not(.disabled):not(.pending).red .tool-info,
.tool-button:not(.disabled):not(.pending).red .tool-info,
button:not(.disabled):not(.pending).red .tool-info {
  background-color: rgba(250, 176, 179, 0.92) !important;
  border-bottom-color: rgba(228, 146, 148, 0.92) !important;
}
.menu-item:not(.disabled):not(.pending).red:active,
.menu:not(.disabled):not(.pending).red:active,
.tool-button:not(.disabled):not(.pending).red:active,
button:not(.disabled):not(.pending).red:active,
.menu-item:not(.disabled):not(.pending).red.down,
.menu:not(.disabled):not(.pending).red.down,
.tool-button:not(.disabled):not(.pending).red.down,
button:not(.disabled):not(.pending).red.down {
  background-color: #f6acaf !important;
}
.menu-item:not(.disabled):not(.pending).yellow:hover,
.menu:not(.disabled):not(.pending).yellow:hover,
.tool-button:not(.disabled):not(.pending).yellow:hover,
button:not(.disabled):not(.pending).yellow:hover,
.menu-item:not(.disabled):not(.pending).yellow[selected],
.menu:not(.disabled):not(.pending).yellow[selected],
.tool-button:not(.disabled):not(.pending).yellow[selected],
button:not(.disabled):not(.pending).yellow[selected],
.menu-item:not(.disabled):not(.pending).yellow .tool-info,
.menu:not(.disabled):not(.pending).yellow .tool-info,
.tool-button:not(.disabled):not(.pending).yellow .tool-info,
button:not(.disabled):not(.pending).yellow .tool-info {
  background-color: rgba(250, 232, 149, 0.92) !important;
  border-bottom-color: rgba(240, 217, 88, 0.92) !important;
}
.menu-item:not(.disabled):not(.pending).yellow:active,
.menu:not(.disabled):not(.pending).yellow:active,
.tool-button:not(.disabled):not(.pending).yellow:active,
button:not(.disabled):not(.pending).yellow:active,
.menu-item:not(.disabled):not(.pending).yellow.down,
.menu:not(.disabled):not(.pending).yellow.down,
.tool-button:not(.disabled):not(.pending).yellow.down,
button:not(.disabled):not(.pending).yellow.down {
  background-color: #f6e491 !important;
}
.menu-item:not(.disabled):not(.pending).dark-blue,
.menu:not(.disabled):not(.pending).dark-blue,
.tool-button:not(.disabled):not(.pending).dark-blue,
button:not(.disabled):not(.pending).dark-blue {
  color: white;
  background-color: #3fb2e0 !important;
  border-bottom-color: rgba(63, 142, 185, 0.92) !important;
}
.menu-item:not(.disabled):not(.pending).dark-blue:hover,
.menu:not(.disabled):not(.pending).dark-blue:hover,
.tool-button:not(.disabled):not(.pending).dark-blue:hover,
button:not(.disabled):not(.pending).dark-blue:hover,
.menu-item:not(.disabled):not(.pending).dark-blue[selected],
.menu:not(.disabled):not(.pending).dark-blue[selected],
.tool-button:not(.disabled):not(.pending).dark-blue[selected],
button:not(.disabled):not(.pending).dark-blue[selected] {
  background-color: #55bbe4 !important;
  border-bottom-color: rgba(79, 154, 195, 0.92) !important;
}
.menu-item:not(.disabled):not(.pending).dark-blue:active:not([selected]),
.menu:not(.disabled):not(.pending).dark-blue:active:not([selected]),
.tool-button:not(.disabled):not(.pending).dark-blue:active:not([selected]),
button:not(.disabled):not(.pending).dark-blue:active:not([selected]) {
  background-color: #29a9dc !important;
  border-bottom-color: rgba(57, 127, 166, 0.92) !important;
}
.menu-item:not(.disabled):not(.pending).dark-red,
.menu:not(.disabled):not(.pending).dark-red,
.tool-button:not(.disabled):not(.pending).dark-red,
button:not(.disabled):not(.pending).dark-red {
  color: white;
  background-color: #e03f4a !important;
  border-bottom-color: rgba(185, 40, 50, 0.92) !important;
}
.menu-item:not(.disabled):not(.pending).dark-red:hover,
.menu:not(.disabled):not(.pending).dark-red:hover,
.tool-button:not(.disabled):not(.pending).dark-red:hover,
button:not(.disabled):not(.pending).dark-red:hover,
.menu-item:not(.disabled):not(.pending).dark-red[selected],
.menu:not(.disabled):not(.pending).dark-red[selected],
.tool-button:not(.disabled):not(.pending).dark-red[selected],
button:not(.disabled):not(.pending).dark-red[selected] {
  background-color: #e4555f !important;
  border-bottom-color: rgba(206, 45, 56, 0.92) !important;
}
.menu-item:not(.disabled):not(.pending).dark-red:active:not([selected]),
.menu:not(.disabled):not(.pending).dark-red:active:not([selected]),
.tool-button:not(.disabled):not(.pending).dark-red:active:not([selected]),
button:not(.disabled):not(.pending).dark-red:active:not([selected]) {
  background-color: #dc2935 !important;
  border-bottom-color: rgba(164, 35, 44, 0.92) !important;
}
.menu-item .pending,
.menu .pending,
.tool-button .pending,
button .pending {
  color: white;
  background: rgba(0, 0, 0, 0.4);
  border-bottom-color: rgba(0, 0, 0, 0.6);
}
.menu-item .secure:before,
.menu .secure:before,
.tool-button .secure:before,
button .secure:before {
  content: url("/assets/images/lock.png");
  display: inline-block;
  margin-right: 5px;
  position: relative;
  top: 2px;
}
#current-service {
  display: none;
}
#current-service #service-search {
  position: absolute;
  top: 0;
  left: 180px;
}
#current-service #service-search input {
  text-align: left;
  width: 240px;
}
.service-logo {
  width: 40px;
  height: 36px;
  position: absolute;
  left: 80px;
  top: 0;
  background-position: left;
}
.service-logo.dropbox {
  background-image: url("/assets/images/icons/dropbox.png");
}
#service-file-gallery {
  display: none;
  font-family: Maven Pro, 'Maven Pro';
  font-weight: 400;
  font-size: 14px;
  height: 100%;
  width: -webkit-calc(100% - 40px);
  width: -moz-calc(100% - 40px);
  width: calc(100% - 40px);
  margin: 60px 20px;
  position: absolute;
  top: 0;
  left: 0;
}
#service-file-gallery #service-file-gallery-thumbnails,
#service-file-gallery #service-file-gallery-dialog {
  height: 100%;
  display: inline-block;
}
#service-file-gallery #service-file-gallery-thumbnails {
  width: -webkit-calc(100% - 200px);
  width: -moz-calc(100% - 200px);
  width: calc(100% - 200px);
  overflow-y: scroll;
}
#service-file-gallery #service-file-gallery-thumbnails .file-listing {
  margin: 20px 20px 0 0;
  line-height: 1.3;
  display: inline-block;
}
#service-file-gallery #service-file-gallery-thumbnails .file-listing:hover {
  background: white;
  cursor: pointer;
}
#service-file-gallery #service-file-gallery-thumbnails .file-listing:hover .file-name {
  text-decoration: underline;
}
#service-file-gallery #service-file-gallery-thumbnails .file-listing:last-child {
  margin-bottom: 200px;
}
#service-file-gallery #service-file-gallery-thumbnails .file-listing .file-name {
  margin: 8px 4px 0 4px;
  color: #3fb2e0;
  max-width: 290px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  -moz-text-overflow: ellipsis;
  -webkit-text-overflow: ellipsis;
}
#service-file-gallery #service-file-gallery-thumbnails .file-listing .file-thumbnail {
  width: 300px;
  height: 300px;
  background: white;
  border-bottom: 1px solid rgba(220, 220, 220, 0.92);
}
#service-file-gallery #service-file-gallery-thumbnails .file-listing .file-thumbnail .file-thumbnail-img {
  width: 100%;
  height: 100%;
  text-align: center;
}
#service-file-gallery #service-file-gallery-thumbnails .file-listing .file-thumbnail .file-thumbnail-img img {
  border: 1px solid rgba(220, 220, 220, 0.92);
}
#service-file-gallery #service-file-gallery-thumbnails .file-listing .file-path {
  margin: 4px;
}
#service-file-gallery #service-file-gallery-dialog {
  width: 200px;
  position: fixed;
  top: 60px;
  right: 20px;
  border-left: 1px solid rgba(220, 220, 220, 0.92);
}
#service-file-gallery #service-file-gallery-dialog button {
  position: absolute;
  bottom: 100px;
  right: 10px;
}
#service-file-gallery #service-file-gallery-dialog #service-file-gallery-message {
  position: absolute;
  bottom: 160px;
  right: 20px;
  text-align: right;
  width: 180px;
}
#service-file-browser {
  display: none;
  position: relative;
  height: 100%;
  margin: 60px 20px;
}
#service-file-browser > div {
  height: 100%;
  position: absolute;
  top: 0;
}
#service-file-browser > div#current-file-saving-status {
  width: 350px;
  right: 0;
  padding-left: 20px;
  border-left: 1px solid rgba(220, 220, 220, 0.92);
}
#service-file-browser > div#current-file-saving-status #current-file-saving-thumbnail {
  width: 300px;
  height: 300px;
  background: white;
  margin: 20px auto;
  margin-bottom: 0;
  border-bottom: 1px solid rgba(220, 220, 220, 0.92);
}
#service-file-browser > div#current-file-saving-status #current-file-saving-thumbnail img {
  border: 1px solid rgba(220, 220, 220, 0.92);
}
#service-file-browser > div#current-file-saving-status #current-file-saving-name,
#service-file-browser > div#current-file-saving-status #current-file-saving-path {
  font-size: 14px;
  margin: 0px auto;
}
#service-file-browser > div#current-file-saving-status #current-file-saving-path {
  width: 280px;
  padding: 5px 10px;
}
#service-file-browser > div#current-file-saving-status #current-file-saving-path label {
  padding-left: 0;
}
#service-file-browser > div#current-file-saving-status #current-file-saving-path .service-logo-small {
  margin-left: 7px;
}
#service-file-browser > div#current-file-saving-status #current-file-saving-path #current-file #current-file-saving-directory-path {
  display: inline-block;
  width: 200px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  -moz-text-overflow: ellipsis;
  -webkit-text-overflow: ellipsis;
}
#service-file-browser > div#current-file-saving-status #current-file-saving-name {
  padding: 6px;
  width: 280px;
}
#service-file-browser > div#current-file-saving-status #current-file-saving-name input,
#service-file-browser > div#current-file-saving-status #current-file-saving-name label {
  width: 70px;
  font-family: Maven Pro, 'Maven Pro';
  font-size: 14px;
  border: none;
  background: white;
  border-bottom: 1px solid rgba(220, 220, 220, 0.92);
}
#service-file-browser > div#current-file-saving-status #current-file-saving-name input {
  margin: 0;
  padding: 7px 0 7px 7px;
  text-align: left;
}
#service-file-browser > div#current-file-saving-status #current-file-saving-name label {
  padding: 7px 7px 7px 0;
}
#service-file-browser > div#current-file-saving-status button {
  position: absolute;
  bottom: 100px;
}
#service-file-browser > div#current-file-saving-status button#confirm-save-file {
  right: 10px;
}
#service-file-browser > div#current-file-saving-status button#cancel-save-file {
  right: 70px;
}
#service-file-browser > div#browser-directory {
  width: -webkit-calc(100% - 370px);
  width: -moz-calc(100% - 370px);
  width: calc(100% - 370px);
  position: relative;
  overflow-x: scroll;
}
#service-file-browser > div#browser-directory .scrollbar-screen-directory-col {
  position: absolute;
  top: 0;
  overflow-y: scroll;
  height: 100%;
  border-right: 1px solid rgba(220, 220, 220, 0.92);
}
#service-file-browser > div#browser-directory .scrollbar-screen-directory-col .directory-col {
  width: 200px;
  height: auto;
}
#service-file-browser > div#browser-directory .scrollbar-screen-directory-col .directory-col.has-selection .directory-button:not(.selected),
#service-file-browser > div#browser-directory .scrollbar-screen-directory-col .directory-col.has-selection .file-button:not(.selected),
#service-file-browser > div#browser-directory .scrollbar-screen-directory-col .directory-col.has-selection .service-button:not(.selected) {
  opacity: 0.5;
}
#service-file-browser > div#browser-directory .scrollbar-screen-directory-col .directory-col.has-selection .directory-button:not(.selected):hover,
#service-file-browser > div#browser-directory .scrollbar-screen-directory-col .directory-col.has-selection .file-button:not(.selected):hover,
#service-file-browser > div#browser-directory .scrollbar-screen-directory-col .directory-col.has-selection .service-button:not(.selected):hover {
  opacity: 1.0;
}
#service-file-browser > div#browser-directory .scrollbar-screen-directory-col .directory-col > div:last-child div:last-child {
  margin-bottom: 100px;
}
#service-file-browser > div#browser-directory .scrollbar-screen-directory-col .directory-col .directory-button,
#service-file-browser > div#browser-directory .scrollbar-screen-directory-col .directory-col .file-button,
#service-file-browser > div#browser-directory .scrollbar-screen-directory-col .directory-col .service-button {
  cursor: pointer;
  display: block;
  width: 135px;
  text-align: left;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  -moz-text-overflow: ellipsis;
  -webkit-text-overflow: ellipsis;
  padding: 12px;
  border-bottom: 1px solid rgba(220, 220, 220, 0.92);
  background: white;
  padding-left: 45px;
  margin-bottom: 5px;
  background-repeat: no-repeat;
  background-position: left;
}
#service-file-browser > div#browser-directory .scrollbar-screen-directory-col .directory-col .directory-button.directory-button,
#service-file-browser > div#browser-directory .scrollbar-screen-directory-col .directory-col .file-button.directory-button,
#service-file-browser > div#browser-directory .scrollbar-screen-directory-col .directory-col .service-button.directory-button {
  background-image: url("/assets/images/icons/folder.png");
}
#service-file-browser > div#browser-directory .scrollbar-screen-directory-col .directory-col .directory-button.file-button,
#service-file-browser > div#browser-directory .scrollbar-screen-directory-col .directory-col .file-button.file-button,
#service-file-browser > div#browser-directory .scrollbar-screen-directory-col .directory-col .service-button.file-button {
  background-image: url("/assets/images/icons/file.png");
}
#service-file-browser > div#browser-directory .scrollbar-screen-directory-col .directory-col .directory-button.service-button.local,
#service-file-browser > div#browser-directory .scrollbar-screen-directory-col .directory-col .file-button.service-button.local,
#service-file-browser > div#browser-directory .scrollbar-screen-directory-col .directory-col .service-button.service-button.local {
  background-image: url("/assets/images/icons/local.service.png");
}
#service-file-browser > div#browser-directory .scrollbar-screen-directory-col .directory-col .directory-button.service-button.dropbox,
#service-file-browser > div#browser-directory .scrollbar-screen-directory-col .directory-col .file-button.service-button.dropbox,
#service-file-browser > div#browser-directory .scrollbar-screen-directory-col .directory-col .service-button.service-button.dropbox {
  background-image: url("/assets/images/icons/dropbox.service.png");
}
#service-file-browser > div#browser-directory .scrollbar-screen-directory-col .directory-col .directory-button:hover,
#service-file-browser > div#browser-directory .scrollbar-screen-directory-col .directory-col .file-button:hover,
#service-file-browser > div#browser-directory .scrollbar-screen-directory-col .directory-col .service-button:hover {
  text-decoration: underline;
}
.loading {
  width: 100%;
  height: 100%;
  color: #8a8a8a;
  text-align: center;
  margin-top: 25%;
}
.service-logo-small {
  display: inline-block;
  position: relative;
  top: 5px;
  height: 1px;
}
.service-logo-small div {
  position: absolute;
  bottom: 0;
  left: 0;
}
.service-logo-small.dropbox,
.service-logo-small.dropbox div {
  width: 20px;
}
.service-logo-small.dropbox div {
  background-image: url("/assets/images/icons/dropbox.20.png");
  height: 20px;
}
.service-logo-small.permalink,
.service-logo-small.permalink div {
  width: 21px;
}
.service-logo-small.permalink div {
  background-image: url("/assets/images/icons/permalink.20.png");
  height: 21px;
}
.service-logo-small.local,
.service-logo-small.local div {
  width: 0;
  height: 0;
}
#bg {
  width: 100%;
  height: 100%;
  cursor: default;
}
#ui {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 5000;
}
#main,
#main-petrified {
  position: absolute;
  top: 0;
  left: 0;
  cursor: default;
}
#main-petrified {
  pointer-events: none;
}
svg,
#typography {
  -webkit-transform-origin: 0 0;
  -moz-transform-origin: 0 0;
}
svg g,
#typography g {
  -webkit-transform-origin-x: 0px;
  -webkit-transform-origin-y: 0px;
  -moz-transform-origin-x: 0px;
  -moz-transform-origin-y: 0px;
}
svg#annotations {
  position: absolute;
  top: 0;
  left: 0;
  pointer-events: none;
}
svg#annotations circle:after {
  content: attr("label");
}
svg#grid {
  position: absolute;
  top: 0;
  left: 0;
  pointer-events: none;
}
svg#hover-targets {
  position: absolute;
  top: 0;
  left: 0;
  pointer-events: none;
}
svg#hover-targets * {
  pointer-events: auto;
}
#drag-selection {
  position: absolute;
  border: 1px solid rgba(0, 0, 0, 0.25);
  z-index: 1000;
  top: -1000px;
  left: -1000px;
}
#selection-box {
  display: none!important;
  position: absolute;
  top: 50;
  left: 50;
  width: 200px;
  height: 200px;
  display: none;
  z-index: 25;
  pointer-events: none;
}
#selection-box.group .outline {
  border-color: rgba(223, 90, 180, 0.3);
}
#selection-box.group .handle {
  background-position: bottom;
}
.slider {
  height: 20px;
}
.slider.knob {
  width: 15px;
  height: 20px;
  background: white;
  background-image: url("/assets/images/slider/knob.png");
  border-bottom: 1px solid rgba(220, 220, 220, 0.92);
  cursor: col-resize;
  position: absolute;
  left: 0px;
}
.slider.track {
  height: 1px;
  background: rgba(220, 220, 220, 0.92);
  position: absolute;
  left: 0px;
  top: 9px;
  width: 100%;
}
.slider.tip {
  background: white;
  color: rgba(0, 0, 0, 0.8);
  display: none;
  position: relative;
  padding: 3px;
  font-size: 14px;
  bottom: 20px;
}
.swatch {
  width: 36px;
  height: 36px;
  box-sizing: border-box;
  cursor: url('/assets/images/cursors/cursor.png') 1 1, default !important;
}
.swatch[empty] {
  background-image: url("/assets/images/swatches/empty-color.png");
}
.swatch-duo {
  display: inline-block;
}
.swatch-duo .swatch {
  height: 18px;
}
.swatch-duo .swatch:first-child {
  border-bottom: none!important;
}
.swatch-duo .swatch:first-child[empty] {
  background-image: url("/assets/images/swatches/empty-color-half-top.png");
}
.swatch-duo .swatch:last-child {
  border-top: none!important;
}
.swatch-duo .swatch:last-child[empty] {
  background-image: url("/assets/images/swatches/empty-color-half-bottom.png");
}
#current-swatches {
  position: absolute;
  top: 550px;
  left: 20px;
}
#current-swatches div {
  position: absolute;
}
#current-swatches #fill-color {
  top: 0;
  left: 0;
}
#current-swatches #stroke-color {
  top: 41px;
  left: 0;
}
#current-swatches-ut {
  position: absolute;
  left: 20px;
  top: 670px;
  width: 77px;
  height: 200px;
}
#current-swatches-ut .swatch-duo {
  margin-bottom: 5px;
}
#current-swatches-ut .swatch-duo:nth-child(odd) {
  margin-right: 5px;
}
#color-picker-ut {
  position: absolute;
  top: 10000px;
  z-index: 9990;
}
#color-picker-ut div {
  position: absolute;
  box-sizing: border-box;
}
#color-picker-ut div#pool-window {
  background-color: rgba(234, 234, 234, 0.92);
  border-bottom: 1px solid rgba(220, 220, 220, 0.92);
  cursor: url('/assets/images/cursors/cursor.png') 1 1, default !important;
  width: 280px;
  height: 350px;
  overflow: hidden;
}
#color-picker-ut div#pool-window #pool-scrollbar-hide {
  width: 260px;
  height: 260px;
  position: absolute;
  overflow: hidden;
  top: 10px;
  left: 10px;
  border-bottom: 1px solid rgba(220, 220, 220, 0.92);
  border-top: 1px solid rgba(220, 220, 220, 0.92);
}
#color-picker-ut div#pool-window #pool-scrollbar-hide #pool-container {
  width: 280px;
  height: 260px;
  position: relative;
  overflow-x: hidden;
  overflow-y: scroll;
}
#color-picker-ut div#pool-window #pool-scrollbar-hide #pool-container .indicator {
  width: 7px;
  height: 7px;
  position: absolute;
  top: 100px;
  left: 100px;
  margin-left: -4px;
  margin-top: -4px;
  pointer-events: none;
}
#color-picker-ut div#pool-window #pool-scrollbar-hide #pool-container .indicator.white {
  background-image: url("/assets/images/picker/indicator-white.png");
}
#color-picker-ut div#pool-window #pool-scrollbar-hide #pool-container .indicator.black {
  background-image: url("/assets/images/picker/indicator-black.png");
}
#color-picker-ut div#pool-window #pool-scrollbar-hide #pool-container #pool-canvas-div {
  width: 260px;
  height: 3060px;
}
#color-picker-ut div#pool-window #pool-scrollbar-hide #pool-container #pool-canvas-div canvas {
  width: 260px;
  height: 3060px;
  position: absolute;
  top: 0;
  left: 0;
  background: white;
}
#color-picker-ut div#pool-window #saturation-slider {
  width: 190px;
  height: 20px;
  position: absolute;
  top: 281px;
  left: 10px;
}
#color-picker-ut div#pool-window #saturation-slider #no-saturation,
#color-picker-ut div#pool-window #saturation-slider #full-saturation {
  width: 18px;
  height: 18px;
  position: absolute;
}
#color-picker-ut div#pool-window #saturation-slider #no-saturation {
  background-image: url("/assets/images/picker/saturation.0.png");
  left: 10px;
}
#color-picker-ut div#pool-window #saturation-slider #full-saturation {
  background-image: url("/assets/images/picker/saturation.100.png");
  right: 10px;
}
#color-picker-ut div#pool-window #saturation-slider #saturation-slider-track {
  width: 120px;
  height: 19px;
  position: absolute;
  top: 0;
  left: 35px;
  background: rgba(211, 211, 211, 0.92);
}
#color-picker-ut div#pool-window #transparent-permanent-swatch {
  position: absolute;
  bottom: 49px;
  right: 20px;
  width: 50px;
  height: 19px;
  border: 1px solid rgba(207, 207, 207, 0.92);
  background-color: rgba(255, 255, 255, 0.5);
  background-image: url("/assets/images/swatches/empty-color-line.png");
  background-position: center;
  background-repeat: no-repeat;
  box-sizing: border-box;
}
#color-picker-ut div#pool-window #color-inputs {
  position: absolute;
  top: 310px;
  left: 10px;
}
#color-picker-ut div#pool-window #color-inputs label.white:not(:first-child) {
  margin-left: 3px;
}
#color-picker-ut div#pool-window #color-inputs label.white:not(:first-child)[for="color-hex"] {
  margin-left: 10px;
}
#color-picker-ut div#pool-window #color-inputs input.white {
  margin-left: -6px;
  width: 35px;
  padding: 7px 7px 7px 3px;
}
#color-picker-ut div#pool-window #color-inputs input.white#color-hex {
  width: 55px;
  text-transform: uppercase;
}
.transform {
  position: absolute;
}
.transform.outline {
  border: 1px solid rgba(115, 160, 235, 0.3);
  width: 100%;
  height: 100%;
  position: absolute;
  left: -10000px;
  top: -10000px;
  box-sizing: border-box;
  pointer-events: none;
}
.transform.handle {
  z-index: 20;
  padding: 5px;
  background-repeat: no-repeat;
  background-position: top;
  pointer-events: auto;
}
.transform.handle.corner {
  width: 11px;
  height: 11px;
  left: -10000px;
  top: -10000px;
  margin-top: -10px;
  margin-left: -10px;
  z-index: 41;
  background-image: url("/assets/images/transformer/corner-handle.png");
}
.transform.handle.corner:hover {
  background-image: url("/assets/images/transformer/corner-handle-hover.png");
}
.transform.handle.point {
  width: 6px;
  height: 6px;
  background-image: url("/assets/images/transformer/point-handle.png");
  margin-left: -5px;
  margin-top: -3px;
  padding: 1px;
  opacity: 1;
  z-index: 40;
}
.transform.handle.point.bz-ctrl {
  z-index: 39;
}
.transform.handle.point:hover,
.transform.handle.point[hover] {
  background-image: url("/assets/images/transformer/point-handle-hover.png");
}
.transform.handle.point:active,
.transform.handle.point[selected] {
  background-image: url("/assets/images/transformer/point-handle-select.png");
}
.transform.handle.point[action] {
  width: 11px;
  height: 11px;
  margin-left: -7px;
  margin-top: -6px;
  background-image: url("/assets/images/transformer/point-handle-action.png");
}
.transform.handle.point[action]:active,
.transform.handle.point[action][active] {
  background-image: url("/assets/images/transformer/point-handle-action-active.png");
}
.transform.handle.side {
  width: 6px;
  height: 6px;
  margin-top: -8px;
  margin-left: -8px;
  left: -10000px;
  top: -10000px;
  z-index: 41;
  background-image: url("/assets/images/transformer/side-handle.png");
}
.transform.handle.side:hover {
  background-image: url("/assets/images/transformer/side-handle-hover.png");
}
.transform.handle.side:active {
  background-image: url("/assets/images/transformer/side-handle-select.png");
}
.transform.center {
  width: 5px;
  height: 5px;
  padding: 0;
  left: -10000px;
  top: -10000px;
  margin-top: -4px;
  margin-left: -4px;
  background-image: url("/assets/images/transformer/transformer-center.png");
}
#text-underline {
  position: absolute;
  top: -9999px;
  left: -9999px;
  height: 0px;
  border-bottom: 1px solid rgba(115, 160, 235, 0.3);
}
#r-nd-o {
  display: none;
  position: absolute;
  width: 11px;
  height: 11px;
  background-image: url("/assets/images/transformer/rotate-nondefault-origin.png");
}
#utilities {
  position: absolute;
  top: 100px;
  right: 0;
  padding: 10px;
}
#utilities .utilities-col {
  float: left;
  height: 100%;
}
#utilities .utilities-col#ut-col-right {
  margin-left: 10px;
}
#utilities .utility-window {
  position: relative;
  margin-bottom: 10px;
  background-color: rgba(234, 234, 234, 0.92);
  border-bottom: 1px solid rgba(220, 220, 220, 0.92);
  cursor: url('/assets/images/cursors/cursor.png') 1 1, default !important;
  z-index: 6000;
}
#utilities .utility-window div[inputholder] {
  position: absolute;
}
#utilities .utility-window div[inputholder] input {
  display: inline-block;
}
#utilities .utility-window#transform-ut {
  width: 245px;
  height: 225px;
}
#utilities .utility-window#transform-ut #element-origin {
  top: 10px;
  left: 10px;
}
#utilities .utility-window#transform-ut #element-width {
  bottom: -45px;
  width: 100%;
  text-align: center;
}
#utilities .utility-window#transform-ut #element-height {
  top: 0;
  right: -100px;
  height: 125px;
  text-align: center;
}
#utilities .utility-window#transform-ut #element-height div {
  display: table-cell;
  vertical-align: middle;
  height: 125px;
}
#utilities .utility-window#transform-ut #preview-pane {
  position: absolute;
  top: 50px;
  left: 10px;
  width: 125px;
  height: 125px;
  background: white;
  border-bottom: 1px solid rgba(220, 220, 220, 0.92);
}
#utilities .utility-window#transform-ut #preview-pane #origin-icon {
  width: 7px;
  height: 7px;
  background-image: url("/assets/images/transformer/transform.origin.png");
  position: absolute;
  top: 40px;
  left: 20px;
}
#utilities .utility-window#transform-ut #preview-pane #width-bracket,
#utilities .utility-window#transform-ut #preview-pane #height-bracket {
  border-color: #b4b4b4;
  border-style: solid;
  position: absolute;
}
#utilities .utility-window#transform-ut #preview-pane #width-bracket {
  border-width: 0px 1px 1px 1px;
  height: 5px;
  top: 128px;
}
#utilities .utility-window#transform-ut #preview-pane #height-bracket {
  border-width: 1px 1px 1px 0px;
  width: 5px;
  left: 128px;
}
#utilities .utility-window#transform-ut #preview-pane #subtle-blue-outline {
  border: 1px solid rgba(115, 160, 235, 0.3);
  position: absolute;
}
#utilities .utility-window#transform-ut #preview-pane canvas#preview-canvas {
  background: white;
  -webkit-transform-origin: 0 0;
  -moz-transform-origin: 0 0;
  position: absolute;
}
#utilities .utility-window#transform-ut input {
  font-size: 12px;
  padding: 7px;
}
#utilities .utility-window#typography-ut {
  width: 200px;
  height: 90px;
  padding: 10px;
  z-index: 6001;
  margin-left: 25px;
}
#utilities .utility-window#typography-ut [inputholder] {
  bottom: 30px;
}
#utilities .utility-window#typography-ut .dropdown {
  position: absolute;
  top: 4px;
  left: 70px;
}
#utilities .utility-window#archive-ut {
  width: 150px;
  padding: 10px;
  display: none;
}
#utilities .utility-window#archive-ut div[empty] {
  color: rgba(0, 0, 0, 0.6);
  margin: 230px auto;
  margin-right: 25px;
  text-align: center;
  width: 80%;
}
#utilities .utility-window#archive-ut #archive-thumbs-screen {
  width: 150px;
  overflow-x: hidden;
}
#utilities .utility-window#archive-ut #archive-thumbs-screen #archive-thumbs {
  width: 165px;
  height: 510px;
  overflow-x: hidden;
  overflow-y: scroll;
}
#utilities .utility-window#archive-ut #archive-thumbs-screen #archive-thumbs .archive-thumb {
  width: 150px;
  min-height: 20px;
  cursor: pointer;
  margin: 10px 0;
}
#utilities .utility-window#archive-ut #archive-thumbs-screen #archive-thumbs .archive-thumb img {
  background: white;
}
#utilities .utility-window#archive-ut #archive-thumbs-screen #archive-thumbs .archive-thumb:first-child {
  margin-top: 0;
}
#utilities .utility-window#archive-ut #archive-thumbs-screen #archive-thumbs .archive-thumb:last-child {
  margin-bottom: 0;
}
#utilities .utility-window#archive-ut #archive-thumbs-screen #archive-thumbs .archive-thumb.future {
  opacity: 0.5;
}
#utilities .utility-window#archive-ut #archive-thumbs-screen #archive-thumbs .archive-thumb.future:hover {
  opacity: 1.0;
}
#utilities .utility-window#archive-ut #archive-controls {
  height: 60px;
  position: relative;
}
#utilities .utility-window#archive-ut #archive-controls #archive-steps-slider {
  width: 250px;
  position: absolute;
  top: 35px;
  left: 0px;
}
#utilities .utility-window#archive-ut #archive-controls #archive-steps-slider #archive-steps-slider-track {
  position: absolute;
  width: 100px;
  left: 25px;
  top: 9px;
}
#utilities .utility-window#archive-ut #archive-controls #archive-slider-label {
  color: rgba(0, 0, 0, 0.75);
  width: 100%;
  text-align: center;
  position: absolute;
  top: 12px;
  left: 0;
}
#utilities .utility-window#stroke-width-ut {
  width: 205px;
  height: 60px;
  margin-left: 40px;
  display: none;
}
#utilities .utility-window#stroke-width-ut #stroke-width-preview {
  width: 105px;
  height: 1px;
  background: black;
  position: absolute;
  left: 10px;
  top: 30px;
}
#utilities .utility-window#stroke-width-ut #no-stroke-width-hint {
  width: 100px;
  height: 20px;
  position: absolute;
  top: 20px;
  left: 30px;
  opacity: 0.4;
}
#utilities .utility-window#stroke-width-ut #stroke-width {
  top: 14px;
  right: 10px;
}
#utilities .utility-window#stroke-width-ut #stroke-width input {
  width: 50px;
}
input,
textarea {
  outline: none;
  resize: noresize;
}
input.white,
textarea.white {
  width: 70px;
  background: white;
  padding: 7px;
  font-size: 12px;
  margin-left: -1px;
  font-family: Maven Pro, 'Maven Pro';
  border: none;
  border-bottom: 1px solid rgba(220, 220, 220, 0.92);
  text-align: right;
}
textarea.white {
  text-align: left;
}
label.white {
  background: white;
  padding: 7px 7px 7px 0px;
  margin-left: -7px;
  font-size: 12px;
  font-family: Maven Pro, 'Maven Pro';
  border: none;
  border-bottom: 1px solid rgba(220, 220, 220, 0.92);
  color: #949494;
}
label.white.left {
  margin-left: 0px;
  padding: 7px 0px 7px 7px;
}
.grey-input-container {
  background: rgba(234, 234, 234, 0.92);
  padding: 6px;
  border-bottom: 1px solid rgba(220, 220, 220, 0.92);
  display: inline-block;
}
input[type="text"][disabled],
input[type="password"][disabled],
textarea[disabled],
div[disabled] input {
  opacity: 0.7;
  cursor: default;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
button {
  border: none;
  border-bottom: 1px solid rgba(220, 220, 220, 0.92);
  font-family: Maven Pro, 'Maven Pro';
  font-size: 14px;
  padding: 9px 10px;
}
#temp-paste-area {
  position: absolute;
  top: 0;
  left: 0;
}
#png-download-sandbox,
.offscreen-throwaway {
  position: absolute;
  top: -999999px;
  left: -999999px;
}
#text-sandbox {
  position: absolute;
  top: -999999px;
  left: -999999px;
}
.deemph {
  color: rgba(0, 0, 0, 0.5);
}
#register-dialog {
  display: none;
  width: 800px;
  height: 400px;
  padding: 20px;
  margin: 150px auto;
  overflow-x: hidden;
  overflow-y: scroll;
  background-color: rgba(234, 234, 234, 0.92);
}
#register-dialog .field {
  margin: 5px 0;
}
#register-dialog .field input {
  width: 300px;
  text-align: left;
  font-weight: 300;
  font-size: 20px;
  padding: 6px 7px 7px 7px;
}
#ghost {
  display: inline-block;
  white-space: nowrap;
}
.error-display {
  display: none;
  color: white;
  background: #e03f4a;
  border-bottom: 1px solid #731319;
  white-space: normal;
  margin: 10px;
}
.error-display .msg {
  padding: 7px;
}
.error-display .msg:before {
  content: "Error: ";
}
.error-display .msg:after {
  content: ".";
}
.error-display .lifespan {
  width: 100%;
  height: 2px;
  background: #b51d28;
  -moz-transition: width 5s linear;
  -webkit-transition: width 5s linear;
  -o-transition: width 5s linear;
  transition: width 5s linear;
}
.error-display .lifespan.empty {
  width: 0;
}
.dropdown {
  position: relative;
  display: inline-block;
  padding: 3px;
  font-size: 14px;
}
.dropdown .dropdown-chosen {
  background-color: #ffffff;
}
.dropdown .dropdown-chosen .dropdown-item {
  background-position: right;
  background-repeat: no-repeat;
}
.dropdown .dropdown-chosen .dropdown-item:after {
  content: "▼";
  float: right;
  font-size: 12px;
}
.dropdown .dropdown-list {
  background: rgba(255, 255, 255, 0.92);
  position: absolute;
  top: 30px;
  padding: 0;
  margin: 0;
}
.dropdown .dropdown-item {
  font-size: 14px;
  padding: 0 5px;
  height: 26px;
  line-height: 26px;
  z-index: 10002;
  cursor: pointer;
  border-bottom: 1px solid rgba(220, 220, 220, 0.92);
  width: 110px;
}
.dropdown .dropdown-item:hover {
  background-color: rgba(158, 217, 240, 0.92);
  border-color: rgba(135, 196, 226, 0.92);
}
.dropdown.open .dropdown-list {
  display: block;
}
