svg#restructuring-piece-project-diagram text
{
  font-family: Helvetica;
  fill-opacity: 1;
  fill: black;
  stroke: none;
}

svg#restructuring-piece-project-diagram .node
{
}

svg#restructuring-piece-project-diagram circle
{
/*  fill: white;
  fill-opacity: 0.5;*/
  stroke: black;
  stroke-width: 3;
}

svg#restructuring-piece-project-diagram circle.Composition
{
  fill: #227cde;
  stroke: #227cde;
}

svg#restructuring-piece-project-diagram circle.Software
{
  fill: #fc069e;
  stroke: #fc069e;
}

svg#restructuring-piece-project-diagram circle.Framework
{
  fill: #29c008;
  stroke: #29c008;
}

svg#restructuring-piece-project-diagram circle.Concept
{
  fill: #f7c802;
  stroke: #f7c802;
}

svg#restructuring-piece-project-diagram circle.Group
{
  fill: #9cd7d5;
  stroke: #9cd7d5;
}


svg#restructuring-piece-project-diagram .link {
  fill: none;
  stroke: #7991a2;
  stroke-width: 3px;
}

button#conceptual,
button#temporal,
button#technological,
button#aesthetic,
button#draggable

{
  border: 1px solid black;
  padding: 3px;
  padding-left: 7px;
  padding-right: 7px;
  color: black;
  background-color: #7CAAAC;
  margin: 0.5em 1em 0 0 ;
  border-radius: 3px;
}

svg#restructuring-piece-project-diagram div.Composition
{
  background-color: #FF0066;
}

svg#restructuring-piece-project-diagram div.Software
{
  background-color: limegreen;
}

svg#restructuring-piece-project-diagram div.Framework
{
  background-color: darkgreen;
}

svg#restructuring-piece-project-diagram div.Concept
{
  background-color: blue;
}

div#metadata_container, div#connection_hover {
    width: 400px;
    display: none;
    position: absolute;
    background-color: rgba(255, 255, 255, 0.9);
    padding: 10px;
    border: 1px solid rgba(0, 0, 0, 1);
    border-radius: 3px;
}

div#metadata h2 {
    margin-top: 10px;
}

div#metadata img {
    padding: 5px;
    float: left;
}

div#metadata_connections {
    clear: both;
}