@font-face {
    font-family: 'futura';
    src: url('../font/futura-sc-t-ot-book-webfont.eot');
    src: url('../font/futura-sc-t-ot-book-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/futura-sc-t-ot-book-webfont.woff2') format('woff2'),
         url('../font/futura-sc-t-ot-book-webfont.woff') format('woff'),
         url('../font/futura-sc-t-ot-book-webfont.ttf') format('truetype'),
         url('../font/futura-sc-t-ot-book-webfont.svg#futura_sc_t_otbook') format('svg');
    font-weight: normal;
    font-style: normal;

}
		
body {
   background-image: url('../img/bg.jpg');
   background-repeat: no-repeat;
   background-attachment: fixed;
   background-position: center;
   background-size: cover;
	color: white;
	shape-rendering: crispEdges;
	font-family: futura;
	text-align: center;
}

#page{
	display:inline-block;
	padding-top:50px;
}

#container{
	display: flex;
	width: 100%;
    margin: 0 auto;
}

#shareBtns{
   display:inline-block;
   font-size: 1.2em;
}

#shareBtns a{font-size: 1.5em;
}

.fa{
	padding:20px;
	margin:20px 0;
	
}

#footer{	 

	width:600px;
	display:inline-block;
	margin-bottom: 40px;
}

#viz1, #viz2, #viz3{
	height:600px;
	position: relative;

		border-color: white;
	border-width: 0px;
	border-style: solid;
	cursor:default;
	
}

#viz1{  width:200px;}
#viz2{	width:420px;}
#viz3{	width:360px;}


#viz1 #text{
left:-90px;
top:180px;
width:200px;
}

#viz2 #text{
left:80px;
top:280px;
width:220px;
}

#viz3 #text{
left:32px;
top:140px;
width:220px;
}

#bars1, #bars2, #bars3{
	position: absolute;
}

#title{	
position: absolute;
text-align: center;
bottom:-20px;
width:200px;
}

#viz1 #title{
left:15px;
}

#viz2 #title{
left:120px;
}

#viz3 #title{
left:90px;
}
.selectedLines{
	stroke-width: 3px;
	stroke: #ffffff !important;
	opacity: 1 !important;
	}


.bar{
	stroke-width: 3px;
	opacity: 0.3;}

.barh{
	stroke-width: 1px;
	opacity: 0.3;}

.preNomline{	stroke: #DCAF5C;}
.postNomline{	stroke: #C75A00; }
.postAwline{	stroke: #D18F26;}

.inner {  position: absolute;}

.title {
	font-size: 36px;				
	text-transform: uppercase;
	line-height: 1em;
	}

#text{	
position: absolute;
text-align: right;
}


.legend{
	fill: #fff;
	font-size: 13px;	
	position: absolute;
	text-transform: uppercase;
	opacity: 0.8;
}

.groupTitle{
	font-size: 18px;
	color: #B59130;
	text-transform: uppercase;
}



.nonvisible{display: none;}



#intro{
	text-transform: uppercase;
	font-size: 24px;

}

.introimg{
margin-top:-30px;
margin-bottom:-30px;
width:350px;
	}

#help{  
	color:#B59130;
	width: 80px;
	height:20px;
	padding:10px;
	float:left;
	position: static;
	margin-top:-40px;
	margin-right: -20px;
	border-width: 1px;
	border-style: solid;
	border-color: #B59130;
	cursor: pointer;

}


#descr{
width:700px;
margin: 0 auto;
	font-size: 14px;
	font-family: 'Open Sans', sans-serif;
	text-transform: none;
		opacity: 0.8;
}

.activeHelp{
		background-color: #B59130;
		color:#fff !important;
}

#help:hover{
		background-color: #B59130;
		color:#fff !important;
}

#buttons{
	margin-bottom: 20px;
}

label{
	color:#B59130;
}





.vizBy{
	font-size:13px;
	text-transform: uppercase;
	opacity: 0.9;
}

.titleDescr{
	font-size: 16px;
	opacity: 0.6;
	padding-top: 30px;
	text-transform: uppercase;

}

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

a:hover{
color:#DCAF5C;
text-decoration: none;
}

.separator{
	height:17px;
	width:614px;
	background-image: url("../img/line-01.svg");
	background-position: center center;
    background-repeat: no-repeat;
    text-align: center;
    margin-bottom: 40px;
    margin-top: 40px;
    display:inline-block;
}