body {
    background-color:white; font-size:90%;
    /*background-image:url(../img/dynamicAnchorBg.jpg); */
    font-family:Helvetica;
}
/* docs */
.code { background-color:#e4e5ef;
    border:1px solid black; margin:1em; padding:0.8em;
    overflow:auto;
    font-family:courier;
    font-size:8pt;
}
.section { border-bottom: 1px dotted black; padding:1em;font-family:helvetica;background-color:white;color:#333;}

.window, .label {
    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;
}

#explanation {
    cursor:drag;
    background-color:white;
    color:black;
    border:0.25em solid #ddd;
    position:absolute;
    right:1em;
    top:4em;
    width:32em;
    font-size:90%;
    -moz-border-radius:1em;
    border-radius:1em;
    padding:1em;
    z-index:1000;
    opacity:0.9;
    filter:alpha(opacity=90);
    font-family:helvetica;
    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;
}

.selected {
    color:rgb(189,11,11);
}


/*  these styles are what jsPlumb attaches to the various elements it creates.
._jsPlumb_connector {
border:1px solid blue;
}
._jsPlumb_endpoint {
border:1px solid green;
}
._jsPlumb_overlay {
border:1px solid yellow;
}
*/


.section li {
    list-style-type:none;
}

li.bullet {
    list-style-type:circle;
}


.section {
    padding-left:2em;
    font-size:10pt;
}
.index.section {
    padding-left:0;
}

.index {
    width:20em;
    font-size:9pt;
    float:left;
    background-color:#e4eeee;
    overflow:auto;
    padding-left:0.5em;
}

.index li {
    list-style-type:none;
}

.index ul, .index h3 {
    padding-left:1.5em;

}

#dasplan {
    width:80%;
    height:50em;
    left: 0;
    top: 0;
    margin-left: 220px;
    position:absolute;
    border: 1px solid gray;
}

.sub {
    margin-left:1em;
}

.table td {
    text-align:center;
}

path, ._jsPlumb_endpoint { cursor:pointer; }

.hover {
    box-shadow: 2px 2px 19px red;
    -o-box-shadow: 2px 2px 19px red;
    -webkit-box-shadow: 2px 2px 19px red;
    -moz-box-shadow: 2px 2px 19px red;
}

.window { border:1px solid #346789;
    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;
    -moz-border-radius:0.5em;
    border-radius:0.5em;
    opacity:0.8;
    filter:alpha(opacity=80);
    width:5em; height:5em;
    line-height:5em;
    text-align:center;
    z-index:20; position:absolute;
    background-color:#eeeeef;
    color:black;
    font-family:helvetica;padding:0.5em;
    font-size:0.9em;}
.window:hover {

    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 #444;
    opacity:0.6;
    filter:alpha(opacity=60);

}

.window.copy {
    position: relative;
}

.active {
    border:1px dotted green;
}
.hover {
    border:1px dotted red;
}

#mainInput { top:1em;left:1em;}

#window1 { top:30em;left:10em;}
#window2 { top:-2em; left:36em;}
#window3 { top:20em;left:45em; }
#window4 { top:17em; left:22em;}
._jsPlumb_connector { z-index:4; }
._jsPlumb_endpoint, .endpointTargetLabel, .endpointSourceLabel{ z-index:21;cursor:pointer; }
.hl { border:3px solid red; }
#debug { position:absolute; background-color:black; color:red; z-index:5000 }

.aLabel {
    background-color:white;
    padding:0.4em;
    font:12px sans-serif;
    color:#444;
    z-index:21;
    border:1px dotted gray;
    opacity:0.8;
    filter:alpha(opacity=80);
}