body.dragging,
body.dragging.drag-enabled,
body.dragging *,
body.dragging.drag-enabled *,
.inner-dom {
  -webkit-user-select: none !important;
  /* Chrome all / Safari all */
  -moz-user-select: none !important;
  /* Firefox all */
  -ms-user-select: none !important;
  /* IE 10+ */
  /* No support for these yet, use at own risk */
  -o-user-select: none !important;
  user-select: none !important;
  cursor: -webkit-grabbing; }
  body.dragging .frame,
  body.dragging.drag-enabled .frame,
  body.dragging * .frame,
  body.dragging.drag-enabled * .frame,
  .inner-dom .frame {
    cursor: -webkit-grabbing; }

body.drag-enabled {
  cursor: -webkit-grab; }

.sb.container {
  position: relative;
  overflow: hidden;
  z-index: 1000;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0; }
  .sb.container * {
    letter-spacing: 0; }

.sb.wrapper {
  position: relative;
  -webkit-transition: left 350ms cubic-bezier(0.075, 0.82, 0.165, 1);
  -moz-transition: left 350ms cubic-bezier(0.075, 0.82, 0.165, 1);
  transition: left 350ms cubic-bezier(0.075, 0.82, 0.165, 1); }

.connection {
  cursor: pointer !important; }

.connection.agent, .glow, .fo, foreignobject, foreignObject {
  pointer-events: none; }

.context-menu,
.context-label {
  position: absolute;
  top: -1000px;
  left: -1000px;
  width: 150px;
  font-family: "Lucida Grande", sans-serif;
  font-style: normal;
  font-size: 10px;
  letter-spacing: 0;
  color: #333;
  line-height: 20px;
  background: white;
  box-shadow: 0 0 20px black;
  border: 2px solid white;
  z-index: 9999; }
  .context-menu ul li,
  .context-label ul li {
    list-style: none;
    padding-left: 15px;
    cursor: pointer; }
    .context-menu ul li:hover,
    .context-label ul li:hover {
      background: rgba(0, 0, 0, 0.1); }
  .context-menu .nub,
  .context-label .nub {
    position: absolute;
    bottom: -13px;
    left: 50%;
    margin-left: -6px;
    height: 0;
    width: 0;
    border-color: transparent;
    border-style: solid;
    border-width: 6px;
    border-top-color: white; }

.tool-tip {
  pointer-events: none;
  position: absolute;
  top: -10000px;
  left: -10000px;
  font-family: "Lucida Grande", sans-serif;
  font-style: normal;
  font-size: 10px;
  letter-spacing: 0;
  color: #333;
  line-height: 20px;
  background: white;
  box-shadow: 0 0 20px black;
  border: 2px solid white;
  z-index: 9999;
  padding: 0 15px; }
  .tool-tip:after {
    position: absolute;
    top: 50%;
    right: -13px;
    margin-top: -6px;
    height: 0;
    width: 0;
    border-color: transparent;
    border-style: solid;
    border-width: 6px;
    border-left-color: white;
    content: ""; }

.context-label {
  content: " ";
  width: auto;
  padding: 0 12.5px;
  text-transform: capitalize;
  min-width: 50px;
  text-align: center; }

@-webkit-keyframes glow {
  from {
    box-shadow: 0 0 0 #ff3f3f; }

  to {
    box-shadow: 0 0 18px #ff3f3f; } }

@-moz-keyframes glow {
  from {
    box-shadow: 0 0 0 #ff3f3f; }

  to {
    box-shadow: 0 0 18px #ff3f3f; } }

@-o-keyframes glow {
  from {
    box-shadow: 0 0 0 #ff3f3f; }

  to {
    box-shadow: 0 0 18px #ff3f3f; } }

@keyframes glow {
  from {
    box-shadow: 0 0 0 #ff3f3f; }

  to {
    box-shadow: 0 0 18px #ff3f3f; } }

.inner-dom {
  cursor: -webkit-grab;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: #191919;
  line-height: 0; }
  .inner-dom .preview p {
    display: inline-block;
    vertical-align: baseline;
    zoom: 1;
    *display: inline;
    *vertical-align: auto;
    line-height: 25px;
    vertical-align: top; }
    .inner-dom .preview p:hover {
      color: #ff3f3f; }
      .inner-dom .preview p:hover:before {
        background-image: url(../images/hover/viewport.svg); }
    .inner-dom .preview p:before {
      display: inline-block;
      vertical-align: baseline;
      zoom: 1;
      *display: inline;
      *vertical-align: auto;
      width: 25px;
      height: 25px;
      background: url(../images/viewport.svg) center center no-repeat;
      content: ""; }
  .inner-dom .description {
    min-width: 128px;
    min-height: 210px;
    padding: 10px 0 0 10px;
    z-index: 9999;
    color: #fff;
    line-height: 25px; }
    .inner-dom .description span:hover {
      color: #ff3f3f; }
    .inner-dom .description.s-video {
      background: red !important; }
    .inner-dom .description.s-data {
      background: green !important; }
    .inner-dom .description.s-shader {
      background: blue !important; }
    .inner-dom .description i.info {
      margin-bottom: 20px;
      text-align: center;
      display: block;
      width: 12px;
      height: 12px;
      line-height: 18px;
      overflow: hidden;
      text-indent: -9999px;
      background: black;
      border-radius: 50%; }
      .inner-dom .description i.info:hover {
        background: #ff3f3f; }
      .inner-dom .description i.info.enabled {
        background: #ff3f3f;
        -webkit-animation-name: glow;
        -moz-animation-name: glow;
        animation-name: glow;
        -webkit-animation-duration: 750ms;
        -moz-animation-duration: 750ms;
        animation-duration: 750ms;
        -webkit-animation-timing-function: ease-out;
        -moz-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
        -webkit-animation-direction: alternate;
        -moz-animation-direction: alternate;
        animation-direction: alternate;
        -webkit-animation-iteration-count: infinite;
        -moz-animation-iteration-count: infinite;
        animation-iteration-count: infinite; }

g g g:hover .inner-dom .description {
  display: block; }
g g g:hover .inner-dom img, g g g:hover .inner-dom canvas, g g g:hover .inner-dom video {
  display: none; }

.sb.graph {
  position: relative;
  width: 100%;
  height: 100%;
  background-color: #191919; }
  .sb.graph .frame {
    cursor: -webkit-grab; }

.sb.viewport {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0; }
  .sb.viewport,
  .sb.viewport * {
    pointer-events: none; }

.sb.inspector {
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  width: 25px;
  overflow: visible;
  line-height: 18px; }
  .sb.inspector:not(.hide-drawer):hover .drawer,
  .sb.inspector:not(.hide-drawer) .drawer.enabled {
    left: -300px; }
  .sb.inspector .add, .sb.inspector .home, .sb.inspector .share, .sb.inspector .fullpage, .sb.inspector .fullscreen, .sb.inspector .switch {
    position: relative;
    overflow: visible;
    width: 25px;
    height: 18px;
    margin: 15px 0 32px 0; }
  .sb.inspector .add {
    height: 18px;
    background: url(../images/plus.svg) center center no-repeat; }
    .sb.inspector .add:hover, .sb.inspector .add.enabled {
      background-image: url(../images/hover/plus.svg); }
  .sb.inspector .home {
    height: 18px;
    background: url(../images/toggle.svg) center center no-repeat; }
    .sb.inspector .home:hover, .sb.inspector .home.enabled {
      background-image: url(../images/hover/toggle.svg); }
  .sb.inspector .share {
    margin-left: 2px;
    height: 18px;
    background: url(../images/link.svg) center center no-repeat; }
    .sb.inspector .share:hover, .sb.inspector .share.enabled {
      background-image: url(../images/hover/link.svg); }
  .sb.inspector .fullpage {
    height: 18px;
    background: url(../images/fullpage.svg) center center no-repeat; }
    .sb.inspector .fullpage:hover, .sb.inspector .fullpage.enabled {
      background-image: url(../images/hover/fullpage.svg); }
  .sb.inspector .fullscreen {
    height: 18px;
    background: url(../images/fullscreen.svg) center center no-repeat; }
    .sb.inspector .fullscreen:hover, .sb.inspector .fullscreen.enabled {
      background-image: url(../images/hover/fullscreen.svg); }
  .sb.inspector .fullscreen.set {
    background: url(../images/i-fullscreen.svg) center center no-repeat; }
    .sb.inspector .fullscreen.set:hover, .sb.inspector .fullscreen.set.enabled {
      background-image: url(../images/hover/i-fullscreen.svg); }
  .sb.inspector .switch {
    height: 18px;
    background: url(../images/viewport.svg) center center no-repeat; }
    .sb.inspector .switch:hover, .sb.inspector .switch.enabled {
      background-image: url(../images/hover/viewport.svg); }
  .sb.inspector .switch.viewport {
    height: 18px;
    background: url(../images/graph.svg) center center no-repeat; }
    .sb.inspector .switch.viewport:hover, .sb.inspector .switch.viewport.enabled {
      background-image: url(../images/hover/graph.svg); }
  .sb.inspector div.number {
    overflow: hidden; }
    .sb.inspector div.number div.slider {
      display: inline-block;
      vertical-align: baseline;
      zoom: 1;
      *display: inline;
      *vertical-align: auto;
      position: relative;
      line-height: 0;
      width: 60%;
      line-height: 15px;
      height: 18px;
      background: rgba(255, 255, 255, 0.1);
      vertical-align: top;
      cursor: ew-resize; }
      .sb.inspector div.number div.slider div.fg {
        background: rgba(255, 255, 255, 0.1);
        border-right: 1px solid rgba(255, 255, 255, 0.5);
        height: 100%;
        top: 0;
        left: 0;
        bottom: 0;
        width: 0; }
    .sb.inspector div.number input[type="text"] {
      margin-left: 12px;
      font-size: 85%;
      height: 16px;
      border: 0;
      background: transparent;
      border-bottom: 1px solid #bbbbbb;
      text-align: right;
      width: 20%;
      outline: none; }
  .sb.inspector .drawer {
    position: absolute;
    height: 100%;
    width: 300px;
    background: #0f0f0f;
    -webkit-transition: left 350ms cubic-bezier(0.075, 0.82, 0.165, 1);
    -moz-transition: left 350ms cubic-bezier(0.075, 0.82, 0.165, 1);
    transition: left 350ms cubic-bezier(0.075, 0.82, 0.165, 1); }
    .sb.inspector .drawer ul.params-listing,
    .sb.inspector .drawer ul.node-listing {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      overflow: auto; }
      .sb.inspector .drawer ul.params-listing li.shell,
      .sb.inspector .drawer ul.node-listing li.shell {
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important; }
        .sb.inspector .drawer ul.params-listing li.shell:hover,
        .sb.inspector .drawer ul.node-listing li.shell:hover {
          background: transparent; }
    .sb.inspector .drawer ul.params-listing li:not(:first-child) {
      cursor: default; }
    .sb.inspector .drawer ul.params-listing li.function {
      cursor: pointer; }
    .sb.inspector .drawer li h3 {
      letter-spacing: 1px;
      font-size: 100%;
      vertical-align: top;
      position: relative; }
      .sb.inspector .drawer li h3 div.delete {
        position: absolute;
        top: 3px;
        right: 30px;
        width: 10px;
        height: 10px;
        text-indent: -9999px;
        cursor: pointer;
        background: url(../images/x.svg) center center no-repeat;
        content: ""; }
        .sb.inspector .drawer li h3 div.delete:hover {
          background-image: url(../images/hover/x.svg); }
    .sb.inspector .drawer li.param {
      font-style: italic; }
    .sb.inspector .drawer .io-0-1 {
      padding-left: 60px;
      background: url(../images/nodes/0-1.svg) 25px center no-repeat; }
    .sb.inspector .drawer .io-1-1 {
      padding-left: 60px;
      background: url(../images/nodes/1-1.svg) 25px center no-repeat; }
    .sb.inspector .drawer .io-2-1 {
      padding-left: 60px;
      background: url(../images/nodes/2-1.svg) 25px center no-repeat; }
    .sb.inspector .drawer .io-3-1 {
      padding-left: 60px;
      background: url(../images/nodes/3-1.svg) 25px center no-repeat; }
    .sb.inspector .drawer label {
      cursor: pointer;
      width: 25%;
      text-transform: capitalize;
      text-overflow: ellipsis;
      letter-spacing: 1px;
      font-size: 15px; }
    .sb.inspector .drawer label,
    .sb.inspector .drawer label + * {
      display: inline-block;
      vertical-align: baseline;
      zoom: 1;
      *display: inline;
      *vertical-align: auto;
      overflow: hidden;
      height: 18px;
      vertical-align: top; }
    .sb.inspector .drawer label + * {
      width: 75%; }
    .sb.inspector .drawer ul {
      list-style: none; }
      .sb.inspector .drawer ul li {
        letter-spacing: 1px;
        padding: 15px 0 16px 25px;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1); }
        .sb.inspector .drawer ul li:not(:first-child) {
          cursor: pointer; }
          .sb.inspector .drawer ul li:not(:first-child):hover {
            background-color: rgba(255, 255, 255, 0.1); }
        .sb.inspector .drawer ul li:first-child {
          border-bottom-color: rgba(255, 255, 255, 0.2); }
  .sb.inspector .panel {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #191919;
    text-align: center;
    list-style: none;
    padding: 0 0 0 0;
    font-size: 12px; }
    .sb.inspector .panel li.enabled,
    .sb.inspector .panel li:hover {
      color: #ff3f3f; }
    .sb.inspector .panel li {
      cursor: pointer; }
    .sb.inspector .panel li.fullpage {
      position: absolute;
      margin: 0;
      bottom: 115px; }
    .sb.inspector .panel li.fullscreen {
      position: absolute;
      margin: 0;
      bottom: 65px; }
    .sb.inspector .panel li.switch {
      position: absolute;
      margin: 0;
      bottom: 15px; }

.url-context-menu {
  display: none;
  opacity: 0;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -webkit-transition: opacity 150ms ease-out;
  -moz-transition: opacity 150ms ease-out;
  transition: opacity 150ms ease-out; }
  .url-context-menu .backdrop {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.25); }
  .url-context-menu .loader {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; }
    .url-context-menu .loader .content {
      padding-top: 40px; }
  .url-context-menu .container {
    position: absolute;
    width: 500px;
    height: 165px;
    top: 50%;
    left: 50%;
    margin-left: -250px;
    margin-top: -82px;
    background: black;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.5);
    text-align: center;
    border: 1px solid #444444; }
    .url-context-menu .container > div {
      padding: 30px 25px 25px; }
    .url-context-menu .container div.divider {
      width: 25%;
      border-bottom: 1px solid #666666;
      content: "";
      height: 0;
      margin: 0 auto; }
    .url-context-menu .container p {
      letter-spacing: 1px;
      margin-bottom: 25px; }
    .url-context-menu .container input {
      display: inline-block;
      vertical-align: baseline;
      zoom: 1;
      *display: inline;
      *vertical-align: auto;
      margin-top: 25px;
      border: 0;
      border-bottom: 1px solid #bbbbbb;
      outline: none;
      letter-spacing: 1px;
      width: 60%; }

svg .preset {
  cursor: pointer;
  opacity: 0.9;
  -webkit-transition: opacity 0.35s ease-out;
  -moz-transition: opacity 0.35s ease-out;
  transition: opacity 0.35s ease-out; }
  svg .preset:hover {
    opacity: 1.0; }