body {
  background: white;
  width:1150px;
}
h1 {
  font-size: 220%;
  text-align: center;
  font-family: verdana;
  color: gray;
  margin-top:0px;
}
h2 {
  font-size: 130%;
  font-family: verdana;
  text-align: center;
  color: black;
}

h3 {
  font-size: 130%;
  font-family: verdana;
  text-align: center;
  color: gray;
  line-height: 100%;
}
h4 {
  font-size: 100%;
  font-family: verdana;
  text-align: justify;
  color: black;
}
h5 {
  font-size: 100%;
  font-family: verdana;
  text-align: center;
  color: black;
}
h6 {
  font-size: 100%;
  font-family: verdana;
  text-align: left;
  color: gray;
  margin-top:12px;
}
p {
  font-family: verdana; 
  font-size: 80%;
  text-align: center;
}
#chart_placeholder {
  text-align: center;
  float:right;
  color:#fff;
  width: 750px;
  height: 830px;
}
.details {
  float:right;
  width:350px;
}
/*
.dependencyWheel {
font: 10px sans-serif;
}*/
#circle circle {
  fill: none;
  pointer-events: all;
}
path.chord {
  stroke: #000;
  stroke-width: .10px;
  transition: opacity 0.3s;
}

#circle path.fade {
  opacity: 1;
}
#circle:hover path.fade {
  opacity: 0;
}

/*text is regions name only on chord diagram and scroll text*/
text {
  fill: black;
  font-family: Arial Narrow,Arial,sans-serif;
  text-align: center;
  font-size: 14px;
}
svg {
  font-size: 10px;
  color: green;
  min-height: 100%;
  min-width: 100%;
}

.yearbuttons{/*area*/
  float: left;
  margin-right: 50px;
  width: 400px;
}
button{/*this are the year buttons*/
  background-color: white;
  color: white;
  font-size : 20px;
  font-family: Arial Narrow,Arial,sans-serif;
  border-color: white;
  /*     border-radius: 2em; */
  border-style: solid;
  cursor:pointer;
}
.current{
  background-color: white;
  color: black;
  font-size : 20px;
  font-family: Arial Narrow,Arial,sans-serif;
  border-color: black;
  /*     border-radius: 2em; */
}

#legend {/*regions*/
  float:left;
  font-size: 14px;
  width: 215px;
} 
/*regions as well*/
table.table1{

}    

/*countries*/
table.table2 {
  position: absolute;
  top:180px;
  left:1050px;
  white-space: nowrap;
  border-collapse: collapse;
  display: none;
}
table.table2 td {
  font-family: verdana;
  font-size: 14px;
  float: left;
}
p {
  font-family: verdana; 
  font-size: 80%;
  text-align: center;
}
.link {
  margin-left: 30px;
  width:300px;
  height:50px;
  float: left;
}
.scroll {
  position:absolute; /*on top of vis*/
  top:0;
  left:0px;
}
.scroll2 {
  float:left;
}
/* unvisited link */
a.one:link {
  color:  #3CBCBC;
  text-decoration: none;
}

/* visited link */
a.one:visited {
  color: #54C571;
}

/* mouse over link */
a.one:hover {
  color: #2414ff;
}

/* selected link */
a.one:active {
  color: #3CBCBC;
}
/*this are the links to the table not to other pages*/
/* mouse over link */
/* a.two:hover + table {
display: table;
color: black;
} */

a.two:click + table {    
  display: table;
  color: black;
}

/* unvisited link */
a.two:link {
  font-family: verdana;
  color: black;
  text-decoration: none;
}
/* visited link */
a.two:visited {
  font-family: verdana;
  color: black;
}
/* mouse over link */
a.two:hover {
  font-family: verdana;
  color: gray;
}
/* selected link */
a.two:active {
  font-family: verdana;
  color: black;
}   


/*subframe*/

table.table2a {
  position: absolute;
  top:140px;
  left:1050px;
  white-space: nowrap;
  border-collapse: collapse;

}

table.table2a iframe {
  border: 0;	
}

table.table2a td {
  font-family: verdana;
  font-size: 14px;
  float: left;
}
p {
  font-family: verdana; 
  font-size: 80%;
  text-align: center;
}
.link {
  margin-left: 30px;
  width:300px;
  height:50px;
  float: left;
}
.scroll {
  position:absolute; /*on top of vis*/
  top:0;
  left:0px;
}
.scroll2 {
  float:left;
}
/* unvisited link */
a.one:link {
  color:  #3CBCBC;
  text-decoration: none;
}

/* visited link */
a.one:visited {
  color: #54C571;
}

/* mouse over link */
a.one:hover {
  color: #2414ff;
}

/* selected link */
a.one:active {
  color: #3CBCBC;
}
/*this are the links to the table not to other pages*/
/* mouse over link */
/* a.two:hover + table {
display: table;
color: black;
} */

/*noinspection CssInvalidPseudoSelector*/
a.two:click + table {
  display: table;
  color: black;
}

/* unvisited link */
a.two:link {
  font-family: verdana;
  color: black;
  text-decoration: none;
}
/* visited link */
a.two:visited {
  font-family: verdana;
  color: black;
}
/* mouse over link */
a.two:hover {
  font-family: verdana;
  color: gray;
}
/* selected link */
a.two:active {
  font-family: verdana;
  color: black;
}   

body {
}

.table_placeholder {

  position: absolute;
  top:180px;
  left:950px;
  white-space: nowrap;

  padding-top: 0px;
  padding-bottom: 0px;
  min-width: 500px;

}
.table_placeholder table{
  margin-top: 1px;
  margin-right: 1px;
  margin-left: 1px;
  margin-bottom: 1px;
}
.well {
  padding-top: 0px;
  padding-bottom: 0px;
  min-width: 500px;
}
.h3, h3 {
    text-align: left;
}


label {
  margin-bottom: 10px;
}

.table1 table {
  border-collapse: separate;
}

h3, .h3 { 
  text-align: left;
}