html,body {
    height:100%;
}

.svgholder {
    height:95%;
}

#placercircles7 circle,
#placercircles5 circle,
#placercircles6 circle,
#placercircles1 circle,
#placercircles2 circle,
#placercircles3 circle,
#placercircles4 circle {
    fill:none;
    stroke:#cecece;
}

.parent > circle {
    cursor:pointer;
}

tspan {
    pointer-events: none
}

#NDE text {
    stroke:#ffffff;
    stroke-width:0;
    fill:#ffffff;
    font-weight:bold;
    font-family:Arial;
    font-size:15px;
    text-anchor:middle;
    pointer-events: none;
}

#leader_learner{
    font-size: .90em;
}

#NDE text.small {
    font-size: .90em;
}
#NDE text.smaller {
    font-size: .80em;
}
#NDE text.smallest {
    font-size: .70em;
}
#NDE text.tiny {
    font-size: .60em;
}
#NDE text.tinier {
    font-size: .50em;
}
#NDE text.tiniest {
    font-size: .40em;
}


text.light tspan,  tspan.light, .children tspan {
    stroke-width:0;
    font-weight:lighter;
}

.path {
//stroke-dasharray: 1000;
//stroke-dashoffset: 1000;
    animation: dash 5s linear forwards;
}

@keyframes dash {
    from {
        stroke-dashoffset:1000
    }
    to {
        stroke-dashoffset: 0;
    }
}

@keyframes pulse {
    from {
        stroke-width:1;
    }
    to {
        stroke-width:8;
    }
}

#nsboe circle,.leadership circle {
    fill:#001689;
}

.section > circle, circle.section {
    fill: #f15a29;
}
.section > path, path.section {
    fill: #cb4c21;
}

.process > circle, circle.process {
    fill:#8cc34a;
}
.process > path, path.process {
    fill:#82a45e;
}

.division > circle, circle.division {
    fill:#27aae1;
}
.division > path, path.division {
    fill: #1490bc;
}

#areas li button.division {
    background-color:#27aae1;
    color:white;
}

#areas li button.section {
    background-color:#f15a29;
    color:white;
}

#areas li button.process {
    background-color:#82a45e;
    color:white;
}

#areas li button.program {
    background-color:#c479b2;
    color:white;
}

#areas li button.office {
    background-color:#00a79d;
    color:white;
}

#areas li button {
    height: 66px;
    width:95%;
}

#employeeHolder {
    border-top:1px solid #ccc;
    max-height:250px;
    overflow:auto;
}

#filterAreas {
    width: 90%;
    padding: 10px;
    margin: 10px auto;
    display: block;
    top: 10px;
    position: relative;
}

#employees {
    padding:0;
    line-height:100%;
}

#employees li > div {
    text-align:left;
    mi-height: 50px;
    width:95%;
    border:none;
    cursor:pointer;

}

#employees li .empName {
    font-weight:bold;
}

#employees li .empTitle,#employees li .empTeam {
    font-size:.9em;
}

#employees li {
    display:inline-block;
    list-style:none;
    margin-bottom:10px;
    text-align:center;
    width:45%;
    margin: 10px 2.5%;
    vertical-align:top;
}

#areas li {
    display:inline-block;
    list-style:none;
    margin-bottom:10px;
    text-align:center;
    width:45%;
    margin: 10px 2.5%;
}

.office > circle, circle.office {
    fill:#00a79d;

}
.office > path, path.office {
    fill:#008980;
}

.program > circle, circle.program {
    fill:#c479b2;
}
.program > path, path.program {
    fill:#8b5d7e;
}

#lines path {
    fill:none;
    stroke-width:1.75;
    stroke-miterlimit:10;
}

path.program {
    stroke:#c479b2;
}

path.section {
    stroke:#f15a29;
}

path.office {
    stroke: #00a79d;
}

#lines path.division {
    stroke-width:5;
    stroke: #27aae1;
}

#lines path.process {
    stroke-width:5;
    stroke: #8cc34a;
}

#lines path.dashed {
    stroke-dasharray:6, 4;
    stroke-width: 5;

}

#lines path.sboe {
    stroke: #001689;
    stroke-width: 3.5;
}

.find {
    /*stroke-width:100;*/
}

.find > circle:first-child, .find > use:first-child {
    stroke: yellow!important;
    stroke-width:1;
    animation: pulse 1s linear alternate infinite;
}

#lines .find {
    stroke: yellow!important;
    stroke-width:1;
    animation: pulse 1s linear alternate infinite;
}

/*
.marked > circle:first-child, .marked > use:first-child {
    stroke: red!important;
    stroke-width:1;
    animation: pulse 1s linear alternate infinite;
}

#lines .marked {
    stroke: red!important;
    stroke-width:1;
    animation: pulse 1s linear alternate infinite;
} */

.svgholder {

    background-repeat:no-repeat;
    background-size: 93%;
    background-position-x: 50%;
    background-position-y: 50%;
}
.svgholder.bg {
    background-image: url('Capture.PNG');
}

.parent > circle:first-child:hover {
    stroke: yellow;
    stroke-width:2;
}

.active > circle, .active > path {
//stroke: yellow;
//stroke-width:1;


}

#ndeorgchartlegend {
    background-color: #ffffff;
    background-color: rgba(255, 255, 255, 0.75);
}

#legend text {
    stroke:black;
    stroke-width:0;
    font-weight:lighter;
    font-family:Arial;
    font-size:18px;
    text-anchor:start;
}

#ndeorgchartlegend {
    height:200px;
    padding-left:10px;
    position:absolute;
}

#NDE text.person {
    font-style:italic;
    pointer-events: all;
}

#NDE text.person tspan {
    pointer-events:all;
    cursor:pointer;
}

#ndeorgchartlegend tspan {
    pointer-events:all;
}

.person .position {
    font-size:0.8em;
}

#modal {
    background-color:#000000;
    background-color:#0000006e;
    background-color: rgba(0, 0, 0, 0.5);
    width:100%;
    height:100%;
    position: absolute;
    top:0;
    left:0;
    z-index:999;
}


#ownerInformation,#picker {
    position:absolute;
    top: 10px;
    right:10px;
    width: 100%;
    max-width:750px;
    border:2px solid #001689;
    border-radius:20px;
    overflow:hidden;

    font-size: 18px;
    background-color:white;
    z-index:1000;
}

#picker {text-align:center;}

#picker button {
    border:none;
    background-color:#001689;
    color:white;
    border-radius:5px;
    padding: 10px 20px;
    margin: 5px 0;
    width:75%;
    font-size:1.4em;
}

#ownerInformation h3 {
    display:inline-block;
    padding:0;
    margin:0;
    margin-right:2px;
}

#ownerInformation .title {
    color: white;
    background-color:#001689;
    font-weight:bold;
    padding: 5px 5px 5px 20px;;
    font-size:22px;

}

#ownerInformation .ownerPhoto {
    width:25%;
    display:block;
    float:left;
    font-size:0;
    line-height:0;

}

#ownerInformation .ownerPhoto img {
    width:100%;
    height:auto;
}

#ownerInformation .ownerDetails {
    width:70%;
    vertical-align:top;
    display:inline-block;
    padding-left:1%;
    padding-right:1%;
    line-height:175%;
}
.closeOwner {
    float: right;
    font-family: Arial;
    display: inline-block;
    border: 1px solid white;
    border-radius: 20px;
    width: 30px;
    text-align: center;
    cursor: pointer;
}

use {
    cursor:pointer;
}

#entryForm input, #entryForm select {
    width:100%;
}

#entryForm > div {
    margin-bottom: 10px;
}


#areaHolder {
    max-height:550px;
    overflow:auto;
}

.form-group {
    margin-top: 20px;
}


.form-group.required label:after {
    content: "*";
    color:#a94442;
}

#searchResults {
    padding:10px;
    border:1px solid black;
    position:relative;
}

#searchResults .entry {
    padding:5px;
    cursor:pointer;
}

#searchResults .entry:nth-child(even) {
    background-color:#f1f1f1;
}

#searchResults .entry:hover {
    background-color:#b7b7b7!important;
}

button.closeSearch {
    position: absolute;
    top: 0;
    right: 0;
}


button.copyClipboard {
    background-color: #93358d;
    position: absolute;
    bottom: 0;
    right: 0;
    padding: 6px 14px;
}

.copyClipboardSample[disabled] {
    background-color: #93358d;
    color:white;
    padding: 6px 14px;
}

.form-group .invalidMessage {
    display:none;
    font-size:14px;
    font-weight:bold;
}

.form-group.invalid .invalidMessage {
    display:block;
}

#instructions,#instructionstext,#instructionsmac {
    background-color: #93358d

}

#instructions a,#instructionstext a,#instructionsmac a {
    color:#ffffff;
}

#sigtablespyholder.instructionsopen {
    position:relative!important;
}

input.invalid {
    background-color:pink;
}

.label {
    border-radius: 25px;
    padding: 10px 15px;

}

.label-danger {
    color: white;
    background-color: red;
}

.text-danger {
    color: red;
}

.label-success {
    color: white;
    background-color: mediumseagreen;
}

#sigtablespyholder {
    margin-bottom: 50px;
}

ol.list-group {
    list-style:none;
}

#sigtableholder table,
#sigtableholder table td,
#sigtableholder table tr,
#replytableholder table,
#replytableholder table td,
#replytableholder table tr{
    border: none;
}
