.demo {
    /* for IE10+ touch devices */
    touch-action:none;
}

/** ELEMENTS **/
.dynamic-demo .window {
    width: 5em;
    height: 5em;
    display:flex;
    align-items: center;
    justify-content: center;
    padding: 0.5em;
}

/** ELEMENT POSITIONS **/
#dynamicWindow1 {
    top: 5em;
    left: 2em;
}

#dynamicWindow2 {
    top: 8em;
    left: 43em;
}

#dynamicWindow3 {
    top: 28em;
    left: 2em;
}

#dynamicWindow4 {
    top: 16em;
    left: 22em;
}

#dynamicWindow5 {
    top: 34em;
    left: 26em;
}

#dynamicWindow6 {
    top: 23em;
    left: 56em;
}

#dynamicWindow7 {
    top: 18em;
    left: 40em;
}

#dynamicWindow8 {
    left: 63em;
    top: 32em;
}

/** JSPLUMB ARTEFACTS **/
.jtk-connector {
    z-index: 4;
}

.jtk-endpoint {
    z-index: 5;
}

.window {
    z-index: 24;
    background-color: white;
    border: 1px solid #346789;
    border-radius: 0.5em;
    position: absolute;
    cursor: pointer;
    box-shadow: 2px 2px 19px #aaa;
    -o-box-shadow: 2px 2px 19px #aaa;
    -webkit-box-shadow: 2px 2px 19px #aaa;
    -moz-box-shadow: 2px 2px 19px #aaa;
    -webkit-transition: -webkit-box-shadow 0.15s ease-in;
    -moz-transition: -moz-box-shadow 0.15s ease-in;
    -o-transition: -o-box-shadow 0.15s ease-in;
    transition: box-shadow 0.15s ease-in;
}

.window:hover {
    border: 1px solid #123456;
    box-shadow: 2px 2px 19px #444;
    -o-box-shadow: 2px 2px 19px #444;
    -webkit-box-shadow: 2px 2px 19px #444;
    -moz-box-shadow: 2px 2px 19px #fff;
    opacity: 0.9;
}

.window a {
    font-family: helvetica, sans-serif;
}

path, .jtk-endpoint {
    cursor: pointer;
}