.openseadragon {
    border: 0;
    color: #333;
    overflow: hidden;
}

.adjacent_pane {
    background-color: transparent;
    border: 0;
    overflow: hidden;
    color: #333;
    position: absolute;
}

.stacked_pane {
    height: 100%;
    width: 100%;
    background-color: transparent;
    overflow: hidden;
    position: absolute;
    left: 0;
    top: 0;
    color: #333;
}

.label {
    font-family: "Times New Roman", Georgia, Serif;
    font-size: medium !important;
    pointer-events: none;
    position: absolute;
    color: white;
    z-index: 2;
    opacity: 1;
}

.instructions {
    position: absolute;
    pointer-events: none;
    z-index: 999;
}

.instructions > img {
    opacity: 0.33;
}

.umbrella {
    width:100%;
    height:100%;
    background-color: transparent;
    float: left;
    border: 0;
    overflow: hidden;
    position: absolute;
    top: 0;
}

.round_grad {
    background: #45484d; /* Old browsers */
    background: -moz-radial-gradient(center, circle cover,  #45484d 0%, #000000 100%); /* FF3.6+ */
    background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,#45484d), color-stop(100%,#000000)); /* Chrome,Safari4+ */
    background: -webkit-radial-gradient(center, circle cover,  #45484d 0%,#000000 100%); /* Chrome10+,Safari5.1+ */
    background: -o-radial-gradient(center, circle cover,  #45484d 0%,#000000 100%); /* Opera 12+ */
    background: -ms-radial-gradient(center, circle cover,  #45484d 0%,#000000 100%); /* IE10+ */
    background: radial-gradient(circle at center,  #45484d 0%,#000000 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#45484d', endColorstr='#000000',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}

.sync_container {
    top:0%;
    height: 100%;
    position: relative;
    overflow: hidden;
}

#mouseLock {
    position: absolute;
    z-index: 999;
    left: 10px;
    bottom:5%;
}

#mouseLockIcon {
    height: 48px;
    width: 48px;
}

.selected {
  stroke: yellow !important;
  stroke-width: 4 !important;
  pointer-events: all !important;
  color: yellow !important;
  opacity: 1 !important;
}

.static {
/**  stroke: white;
  stroke-width: 2;
  opacity:0.25; **/
  pointer-events:none !important;
}

.brush .extent {
  stroke: yellow;
  stroke-width: 2;
  fill: yellow;
  fill-opacity: 0.125;
  shape-rendering: crispEdges;}

.brush:hover .extent:hover {
  stroke-width: 4 !important;
}


/* STYLING FOR THE DELAUNAY TRIANGULATION*/

path {
    fill: yellow;
    stroke: #000;
}

circle {
    fill: #fff;
    stroke: #000;
    pointer-events: none;
}

.PiYG .q0-9{
    fill:rgb(197,27,125);
    opacity: 0.2;
}
.PiYG .q1-9{
    fill:rgb(222,119,174);
    opacity: 0.2;
}
.PiYG .q2-9{
    fill:rgb(241,182,218);
    opacity: 0.2;
}
.PiYG .q3-9{
    fill:rgb(253,224,239);
    opacity: 0.2;
}
.PiYG .q4-9{
    fill:rgb(247,247,247);
    opacity: 0.2;
}
.PiYG .q5-9{
    fill:rgb(230,245,208);
    opacity: 0.2;
}
.PiYG .q6-9{
    fill:rgb(184,225,134);
    opacity: 0.2;
}
.PiYG .q7-9{
    fill:rgb(127,188,65);
    opacity: 0.2;
}
.PiYG .q8-9{
    fill:rgb(77,146,33);
    opacity: 0.2;
}
.PiYg .active {opacity:1}

path {
    fill:none;
    stroke: yellow;
    opacity: 1;
}

.selector {
    position: absolute;
    z-index: 50;
}

.hidden {
    display: none;
}

.nointeract {
    pointer-events: none;
}