/**
 * rpd - RPD is a minimal framework for building Node-Based User Interfaces, powered by Reactive Programming
 * Built at Tue, 19 Jul 2016 01:21:29 GMT
 *
 * @version v2.0.0
 * @link http://shamansir.github.io/rpd
 * @author Ulric Wilfred <shaman.sir@gmail.com>
 * @license MIT
 * 
 * Selected Renderers: svg
 * Selected Styles: compact-v
 * Selected Toolkits: util
 *
 * User Styles: [None]
 * User Toolkits: [None]
 */

.rpd-network {
    margin: 0;
}

.rpd-full-page {
    margin: 0;
    padding: 0;
    overflow: hidden;
}

.rpd-node .rpd-drag-handle {
    cursor: pointer;
}

.rpd-node .rpd-remove-button {
    cursor: pointer;
}

.rpd-connector {
    cursor: pointer;
}

.rpd-link:hover {
    cursor: crosshair;
}

.rpd-link.rpd-disabled:hover {
    cursor: cell;
}

.rpd-node.rpd-patch-reference .rpd-process > text {
    cursor: pointer;
}

.rpd-patch {
    font-family: 'PT Mono', 'Andale Mono', 'Fira mono', 'Menlo', sans-serif;
    font-size: 9px;
}

.rpd-background {
    fill: #22222a;
}

.rpd-patch {
    fill: #3c464c;
}

.rpd-patch text {
    fill: #111;
}

.rpd-node .rpd-shadow {
    fill: #000;
    opacity: 0.4;
    /* -1px 5px 13px 1px rgba(30,30,30,0.8) */
}

.rpd-node.rpd-dragging .rpd-shadow {
    opacity: 0.3;
    /* 4px 8px 20px 0px rgba(30,30,30,0.8) */
}

.rpd-node .rpd-header {
    fill: rgba(33,33,99,0.5);
}

.rpd-node text.rpd-name,
.rpd-node text.rpd-fake-name {
    fill: rgba(250,250,250,0.9);
    dominant-baseline: central;
    /* vertical-align: bottom; */
    /* position: absolute; */
    /* bottom: 0; */
}

.rpd-node > .rpd-name-holder {
    writing-mode: rb;
    /* transform: rotate(-90deg); */
    /* transform-origin: 5px 5px; */
}

.rpd-node .rpd-content {
    fill: #50607e;
}

.rpd-node .rpd-body {
    stroke: rgba(255,255,255,0.4);
    stroke-width: 1;
    fill: transparent;
    /* -webkit-filter: drop-shadow(9px 9px 9px rgba(0,0,0,0.9)); */
}

.rpd-node .rpd-remove-button {
    display: none;
}

.rpd-node .rpd-remove-button path {
    fill: rgba(30,30,30,0.2);
}

.rpd-node .rpd-remove-button text {
    fill: rgba(250,250,250,0.8);
    dominant-baseline: hanging;
    font-size: 0.7em;
}

.rpd-node .rpd-remove-button:hover text {
    fill: #ff6666;
}

.rpd-node:hover .rpd-remove-button {
    display: inline;
}

.rpd-inlet .rpd-connector,
.rpd-outlet .rpd-connector {
    fill: white;
    stroke-width: 1px;
    stroke: black;
    cursor: pointer;
}

.rpd-node .rpd-inlet text.rpd-value,
.rpd-node .rpd-inlet text.rpd-name,
.rpd-node .rpd-outlet text.rpd-value,
.rpd-node .rpd-outlet text.rpd-name {
    dominant-baseline: central;
}

.rpd-node .rpd-inlet text.rpd-name,
.rpd-node .rpd-outlet text.rpd-name {
    font-size: 0.8em;
}

.rpd-inlet text.rpd-value,
.rpd-outlet text.rpd-value {
    fill: rgba(200,200,200,0.7);
    font-size: 0.7em;
}

.rpd-inlet text.rpd-name,
.rpd-inlet text.rpd-value {text-anchor: end;}

.rpd-outlet text.rpd-name,
.rpd-outlet text.rpd-value {
    /* text-anchor: middle; */
}

.rpd-link {
    stroke: rgba(250,250,250,0.8);
    stroke-width: 1;
    fill: transparent;
}

.rpd-link.rpd-disabled {
    stroke: rgba(250,250,250,0.3);
}

.rpd-connector:hover {
    transition: none;
}

.rpd-fresh .rpd-connector {
    stroke: #c00;
    fill: #ff0;
}

.rpd-fresh .rpd-connector:hover {
    stroke: #c66;
}

.rpd-stale .rpd-connector {
    stroke: #000;
    fill: #fff;
    transition: stroke .3s ease-out;
}

.rpd-stale .rpd-connector:hover {
    transition: none;
    /* stroke: #333; */
    stroke: #ccc;
    opacity: 0.6;
}

.rpd-cold .rpd-connector {
    stroke: #009;
}

.rpd-cold .rpd-connector:hover {
    stroke: #669;
}

.rpd-error .rpd-connector {
    stroke: #cc0;
    fill: #f00;
    transition: stroke .3s;
}

.rpd-error .rpd-connector:hover {
    stroke: #aa0;
}

.rpd-inlet .rpd-value-holder .rpd-value-editor {
    display: none;
}

.rpd-inlet .rpd-value-holder.rpd-editor-enabled .rpd-value {
    display: none;
}

.rpd-inlet .rpd-value-holder.rpd-editor-enabled .rpd-value-editor {
    display: block;
    z-index: 1000;
}

.rpd-node.rpd-patch-reference .rpd-process:hover > text {
    fill: #ccc;
}

.rpd-node .rpd-process text {
    dominant-baseline: central;
    /* text-anchor: middle; */
}

.rpd-drag-handle, .rpd-remove-button {
    cursor: pointer;
}

.rpd-util-comment .rpd-process text {
    fill: lightgray;
}

.rpd-inlet.rpd-util-number input[type=number],
.rpd-outlet.rpd-util-number input[type=number] {
    width: 30px;
}

.rpd-node.rpd-util-palette .rpd-process .rpd-util-palette-variant * {
    cursor: pointer;
    pointer-events: all;
}

.rpd-util-palette-variant.rpd-util-palette-active-variant {
    stroke: white;
}

.rpd-util-nodelist .rpd-nodelist-search {
    cursor: pointer;
}

.rpd-util-nodelist .rpd-nodelist-search rect {
    fill: slategray;
    transition: fill 0.2s ease-in;
}

.rpd-util-nodelist .rpd-nodelist-search text {
    /* font-size: 1.5em; */
    fill: darkred;
    pointer-events: all;
    transition: fill 0.2s ease-in;
    /* background-color: lightgray; */
}

.rpd-util-nodelist .rpd-nodelist-search:hover rect {
    fill: aliceblue;
}

.rpd-util-nodelist .rpd-nodelist-search:hover text {
    fill: red;
}

.rpd-util-nodelist .rpd-nodelist-list text {
    text-anchor: start;
    dominant-baseline: hanging;
}

.rpd-util-nodelist .rpd-nodelist-list text.rpd-nodelist-icon {
    text-anchor: middle;
    dominant-baseline: middle;
}

.rpd-util-nodelist .rpd-nodelist-list text.rpd-nodelist-toolkit-name {
    font-weight: bold;
}

.rpd-util-nodelist .rpd-nodelist-list text.rpd-nodelist-description {
    font-size: 0.8em;
}

.rpd-util-nodelist .rpd-nodelist-list .rpd-nodelist-selected .rpd-nodelist-fulltypename {
    fill: red;
}

.rpd-util-nodelist .rpd-nodelist-list .rpd-nodelist-nodetype rect {
    fill: rgba(96,141,104,0.4);
    transition: fill 0.1s ease-in;
}

.rpd-util-nodelist .rpd-nodelist-list .rpd-nodelist-nodetype:hover rect {
    fill: rgba(0, 0, 0, 0.15);
}

.rpd-util-nodelist .rpd-nodelist-list .rpd-nodelist-nodetype.rpd-nodelist-selected rect {
    fill: rgba(0, 0, 0, 0.3);
}

.rpd-util-nodelist .rpd-nodelist-list .rpd-nodelist-nodetype.rpd-nodelist-add-effect rect {
    fill: red;
}

.rpd-util-nodelist .rpd-nodelist-list .rpd-nodelist-nodetype:hover {
    cursor: pointer;
}

.rpd-util-comment .rpd-header {
    display: none;
}

.rpd-util-comment .rpd-header, .rpd-util-comment .rpd-name, .rpd-util-comment .rpd-body,
.rpd-util-comment .rpd-remove-button, .rpd-util-comment:hover .rpd-remove-button,
.rpd-util-comment .rpd-inlets, .rpd-util-comment .rpd-outlets,
.rpd-util-comment .rpd-content, .rpd-util-comment .rpd-shadow {
    display: none;
}

.rpd-util-log .rpd-process text,
.rpd-util-sum-of-three .rpd-process text,
.rpd-util-letter .rpd-process text {
    text-anchor: middle;
}

.rpd-util-bang circle,
.rpd-util-metro circle {
    transition: fill 0.1s ease-in;
    -webkit-transition: fill 0.1s ease-in;
}

.rpd-util-bang circle.rpd-util-bang-fresh,
.rpd-util-metro circle.rpd-util-metro-fresh {
    fill: red;
    transition: fill 0.1s ease-out;
    -webkit-transition: fill 0.1s ease-out;
}

.rpd-util-mouse-pos .rpd-process line,
.rpd-util-mouse-pos-by-bang .rpd-process line {
    stroke: teal;
    stroke-width: 2;
}

.rpd-util-mouse-pos .rpd-process circle,
.rpd-util-mouse-pos-by-bang .rpd-process circle {
    fill: #36464c;
}

.rpd-util-mouse-pos .rpd-process text,
.rpd-util-mouse-pos-by-bang .rpd-process text {
    fill: rgba(255, 255, 255, 0.7);
    font-size: 0.7em;
    text-anchor: middle;
}