@font-face {
  font-family: FrutigerNext;
  src: url("../font/FrutigerNextLT-Regular.otf") format("opentype");
}

@font-face {
  font-family: FrutigerNext;
  font-weight: bold;
  src: url("../font/FrutigerNextLT-Bold.otf") format("opentype");
}

@font-face {
  font-family: "DejaVu Sans";
  src: url("../font/FrutigerNextLT-RegularItalic.otf");
  font-style: italic;
}

@font-face {
  font-family: "DejaVu Sans";
  src: url("../font/FrutigerNextLT-BoldItalic.otf");
  font-weight: bold;
  font-style: italic;
}

body {
  font-size: 14px;
  font-family: FrutigerNext;
  color: rgb(255,255,255);
}

rect {
  fill: none;
  pointer-events: all;
}

pre {
  font-size: 18px;
}

line {
  stroke: #000;
  stroke-width: 1.5px;
}

.string, .regexp {
  color: #f39;
}

.keyword {
  color: #00c;
}

.comment {
  color: #777;
  font-style: oblique;
}

.number {
  color: #369;
}

.class, .special {
  color: #1181B8;
}

a:link, a:visited {
  color: #666;
  text-decoration: none;
}

a:hover {
  color: #666;
}

path.arc {
  cursor: move;
}

.node circle {
}

.node {
  font-size: 12px;
  fill: #bbb;
}

.unit {
  fill: rgb(230, 34, 57);
}

.material {
  fill: rgb(20, 82, 89);
}

.theme {
  fill: rgb(39, 161, 161);
}

.partner {
  fill: rgb(173, 158, 128);
}

.tour {
  fill: rgb(204, 204, 204);
}

.node:hover {
  fill: #fff;
}

.link {
  stroke: steelblue;
  stroke-opacity: .4;
  fill: none;
  pointer-events: none;
  stroke-width: 1px;
}

.node text {

}

.node:hover,
.node--source,
.node--target {
  font-weight: 500;
}

.link--fadeout {
  stroke-opacity: 0.09;
  stroke-width: 1px;
}

.node--fadeout {
  fill: rgba(187, 187, 187, 0.1);
}

.node--fadeout .unit {
  fill: rgba(230, 34, 57, 0.1);
}

.node--fadeout .material {
  fill: rgba(20, 82, 89, 0.1);
}

.node--fadeout .theme {
  fill: rgba(39, 161, 161, 0.1);
}

.node--fadeout .partner {
  fill: rgba(173, 158, 128, 0.1);
}

.node--fadeout .tour {
  fill: rgba(204, 204, 204, 0.1);
}

.node--source {

}

.node--target {

}

.link--source,
.link--target {
  stroke-opacity: 0.6;
  stroke-width: 2px;
}

.link--source {
  stroke: rgb(255,255,255);
}

.link--target {
  stroke: rgb(255,255,255);
}

#nodeContainer {
  min-width: 100%;
  font-size: 20px;
  color: #f5f5f5;
  margin-top: 900px;
}

.navigationContainer {
  background-color: black;
}

.nodeItem {
  float: left;
  min-width: 20%;
  text-align: center;
}

.nodeHeader {
  min-height: 40px;
  padding-top: 10px;
}

.nodeItem li{
  border-top: thin solid #ffffff;
}

.nodeUnit .nodeHeader {
  background-color: rgb(230, 34, 57);
}

.nodeUnit li {
  background-color: rgba(230, 34, 57, 0.5);
}

.nodeTheme .nodeHeader {
  background-color: rgb(39, 161, 161);
}

.nodeTheme li {
  background-color: rgba(39, 161, 161, 0.5);
}


.nodeMaterial .nodeHeader {
  background-color: rgb(20, 82, 89);
}

.nodeMaterial li {
  background-color: rgba(20, 82, 89, 0.5);
}


.nodePartner .nodeHeader {
  background-color: rgb(173, 158, 128);
}

.nodePartner li {
  background-color: rgba(173, 158, 128, 0.5);
}

.nodeTour .nodeHeader {
  background-color: rgb(204, 204, 204);
}

.nodeTour li {
  background-color: rgba(204, 204, 204, 0.5);
}

#nodeContainer {
  display: none;
}

.nodeItem li {
}

.nodeItem ul {
  list-style-type: none;
  padding: 0px;
  margin: 0px;
}

.nodeObject {
  cursor: pointer;
}

#back {
  cursor: pointer;
}

#bundleContainer {
  position: absolute;
  top: 0;
  left: 25%;
}

.objectInformation {
  position: absolute;
  font-size: 10px;
  font-family: FrutigerNext;
  color: rgb(255,255,255);
  width: 200px;
  top: 45px;
  left: 45px;
}

#nodeSelect {
  position: absolute;
  top: 800px;
  left: 45px;
}

.objectInformation h3 {
  border-bottom: 1px solid #fff;
  padding-bottom: 4px;
  margin-bottom: 7px;
  font-size: 11px;
  display: inline-block;
}

.objectInformation .name {
  font-size: 23px;
  border-bottom: 1px solid #fff;
  padding-bottom: 3px;
  margin-bottom: 5px;
  display: inline-block;
  font-weight: lighter;
}

.objectInformation .container {
  margin-top: 5px;
}

.dayliLog {
  position: absolute;
  color: rgb(255,255,255);
  width: 400px;
  top: 45px;
  right: 45px;
}

.dayliText {
  font-style: italic;
  font-weight: bold;
  font-size: 40px;
}

.dailyInfo {
  border-bottom: 1px solid #fff;
  padding-bottom: 4px;
  margin-bottom: 7px;
  font-size: 11px;
  display: inline-block;
}