@import url("http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700|Raleway:400,800,900");
@font-face {
    font-family: coolvetica;
    src: url(../fonts/coolvetica%20rg.ttf);
}


 body {
	width: 100%;
	height: 100%;
	text-align: center;
	background-color: #2F1847; /*#525564;*/
	font-family: 'coolvetica', "Raleway", Helvetica, 游ゴシック体, 'Yu Gothic', YuGothic, 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
	/*font-family: Tahoma,Verdana,Segoe,sans-serif; */
	color: #FEF6EB;
	letter-spacing: 1.15px;
}

.background-container {
	background-repeat: no-repeat;
	background-size: contain;
}

.hover-photo {
	border-radius: 9px;
	max-height: 275px;
	max-width: 275px;
}

path {
	fill: none;
  stroke: lightgrey;
  stroke-width: 1px;
	transition: stroke 0.1s ease-in-out, stroke-width 0.1s ease-in-out;
}

path.cast {
	opacity: 0.3;
}

path.chronology {
	stroke: #a3bcf9; /*gold;*/
	stroke-width: 8;
	opacity: 0.8;
}

path.active {
	stroke: #fb3640; /* salmon; /* #C25B56; */
	stroke-width: 3px;
	opacity: 1;
}

path.active.chronology {
	stroke-width: 10px;
}

circle {
	stroke: #96C0CE;
	stroke-width: 2px;
	fill: #624763; /*darkolivegreen; /* #74828F; */
	r: 8px;
	cursor: pointer;
	transition: stroke 0.1s ease-in-out, stroke-width 0.1s ease-in-out;
}

circle.movie {
	stroke: #BEB9B5;
	r: 15px;
}

circle.short {
	r: 10px;
	stroke: #BEB9B5;
}

circle.cast {
	stroke: antiquewhite;
	fill: peru; /* #c25b56; */
}

circle:hover,
circle.active {
	stroke-width: 4px;
}

text {
	font-family: "Raleway", Helvetica, 游ゴシック体, 'Yu Gothic', YuGothic, 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
	fill: #F7F8FD;
	text-shadow: 1px 1px 2px #000000;
}

.hidden {
	visibility: hidden;
}

.viz-party {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	z-index: 4;
	background-repeat: no-repeat;
	background-size: contain;
}


.info-block {
	position: absolute;
	top: 0;
	left: 0;
	width: 200px;
  height: 300px;
  overflow: visible;
	text-align: left;
	border-radius: 6px;
	padding: 15px;
  text-shadow: 1px 1px 2px #000000;
  z-index: 9001;
}

.info-block a {
  color: gold;
}

.block {
	/*display: inline-block;
	width: 45%;*/
	vertical-align: top;
}

.right-block {
	padding-top: 4px;
}