html, body {
  margin:0;
  padding:0;
  text-align: center;
  color: #555;
  font: 1em Tahoma, Verdana, Arial;
}

a:link, a:visited {
  color: #23A4FF;
}

a:hover, a:active {
  color: #6EC3FF;
}

a.selected:link, a.selected:visited {
  color: #222;
  text-decoration: none;
}

#content {
  width: 1000px;
  margin:auto;
}

#footer {
  margin: 15px 0 35px 0;
  font-size: 11px;
}

.main-title {
  color: #FF0084;
  font-size: 35px;
  margin: 5px auto 0 auto;
}

.main-text {
  color: #111;
  font-size: 26px;
  margin: 15px auto 2px auto;
}

.use {
  margin: 15px auto 12px auto;
  font-size: 12px;
}

.shadowed {
  -webkit-text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);
  -moz-text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);
  text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);
}

.visualization-group {
  -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 1);
  -moz-box-shadow: 0 0 5px rgba(0, 0, 0, 1);
  -o-box-shadow: 0 0 5px rgba(0, 0, 0, 1);
  box-shadow: 0 0 5px rgba(0, 0, 0, 1);
}

.tm-application {
  position: relative;
  height: 500px;
}

#infovis, #accordion-wrapper {
  position: absolute;
  top: 0;
  left: 0;
  width: 800px;
  height: 500px;
}

#infovis {
  background-color: #1a1a1a;
}

#infovis .node {
  color: #000;
  overflow: hidden;
}

#infovis .node .stories {
  display:none;
}

#infovis .node.selected .stories {
  display:block;
  font-size: 15px;
  width: 500px;
  margin: 30px auto;
  line-height: 30px;
}


#accordion-wrapper {
  left: 800px;
  width: 200px;
  background-color: #ccc;
}

#accordion-wrapper .title {
	background: #888 url(../img/gradient.png) repeat-x 0% 0%;
	border-right: 1px solid #999;
	border-top: 1px solid #999;
	color: white;
	font-size: 0.9em;
	font-weight: bold;
	margin: 0px;
	padding: 5px;
	text-indent: 5px;
	text-shadow: #555 3px 3px 5px;
}

#accordion-wrapper .toggler {
	background: #AAA url(../img/gradient.png) repeat-x 0% 0%;
	border-bottom: 1px solid #999;
	border-right: 1px solid #999;
	border-top: 1px solid #999;
	color: white;
	cursor: pointer;
	font-weight: bold;
	margin: 0px;
	padding: 5px;
	position: relative;
	text-shadow: #555 1px 1px 1px;
}

#accordion-wrapper .content {
  background-color: #f5f5f5;
  background: -webkit-gradient(linear, 0 50%, 100% 50%, from(#f5f5f5), color-stop(0.5, #f5f5f5), to(#eee));
  background: -moz-linear-gradient(center left, #f5f5f5, #f5f5f5, #eee);
}

#accordion-wrapper .content .element {
	padding: 12px;
	font-size: 0.8em;
	text-align: left;
	max-height: 400px;
	overflow:auto;
}

#accordion-wrapper .content .element ul {
  padding:0;
  margin:0;
}

#accordion-wrapper .content .element ul li{
  list-style-type: none;
  margin-top: 3px;
}

.tip {
  color: #111;
  width: auto;
  max-width: 300px;
  background-color: white;
  border:1px solid #ccc;
  -moz-box-shadow:#555 2px 2px 8px;
  -webkit-box-shadow:#555 2px 2px 8px;
  -o-box-shadow:#555 2px 2px 8px;
  box-shadow:#555 2px 2px 8px;
  opacity:0.9;
  filter:alpha(opacity=90);
  font-size:10px;
  font-family:Verdana, Geneva, Arial, Helvetica, sans-serif;
  padding:7px;
}

.tip-title {
  text-align: center;
  font-size: 11px;
  font-weight: bold;
}


.tip-text {
  margin-top:4px;
  text-align: left;
}

.tip ul {
  margin:0 0 7px 0;
  padding-right: 10px;
}
