/*Defining body style*/
html, body { 
  height: 100%;
  padding: 0; 
  margin: 0;
  background-color: #efffff;
}

#section1 { 
  width: 50%; 
  height: 100%;
}
#section2 { 
  width: 50%; 
  height: 100%; 
}



#h1
{
  font-size: 38px;
  margin: 10px 0px -3px 10px;
  font-family: 'Roboto', sans-serif;
  font-weight: 400;
  color: #444444
}

#h2
{
  font-size: 15px;
  margin: 0px 0px 0px 10px;
  font-family: 'Roboto', sans-serif;
  font-weight: 300;
  letter-spacing: 1px;
  color: #444444
}

#link
{
  font-family: sans-serif;
  font-size: 7px;
  margin: 5px 0px 15px 10px;
  color: #999999
}

a:link, a:visited, a:active
{
  text-decoration: none;
  color: #999999;
  border-bottom: 0.7px dotted #cccccc
}



/*Defining bar chart axis stylings*/

.y-axis path
{
  stroke-width: 0;	
}

  .y-axis line
{
  stroke-width: 0;
}

 .y-axis text
{
  font-family: sans-serif;
  font-size: 13px;
  font-weight: 300;
  fill: #444444;
}



/*Defining bar chart stylings*/

  .bar
{
  stroke-width: 1.75
}

  .bar:hover
{
  fill: #FF0000
}



/*Defining line chart axis stylings*/

.x-axis2 path, .y-axis2 path
{
  stroke-width: 0;	
}

  .x-axis2 line, .y-axis2 line
{
  stroke-width: 0;
}

.x-axis2 text, .y-axis2 text
{
  font-family: sans-serif;
  font-weight: 100;
  font-size: 10px;
  opacity:0.8;
  fill: #444444
}



/*Defining line chart stylings*/

.line
{
  fill: none;
  stroke: #7f7f7f;
  stroke-width: 0.4px;
  opacity:0.5;
  stroke-dasharray: 2
}


/*Defining tooltip stylings*/

  .toolTip_head
{
  font-family: 'Roboto', sans-serif;
  font-weight: 600;
  font-size: 20px;
  color: #444444;
  padding: 0px;
  display: none;
  text-align: center;
}

  .toolTip_subhead
{
  font-family: 'Roboto', sans-serif;
  font-weight: 300;
  font-size: 12px;
  color: #444444;
  display: none;
  text-align: center;
  margin-bottom: 12px;
}

  .toolTip_body_bold
{
  font-family: 'Roboto', sans-serif;
  font-weight: 500;
  font-size: 14px;
  color: #444444;
  display: none;
  width: 150px;
  text-align: left;
  line-height: 25px
}

  .toolTip_body
{
  font-family: sans-serif;
  font-weight: 300;
  font-size: 14px;
  color: #444444;
  display: none;
  width: 50px;
  text-align: right;
  line-height: 25px
}

.toolTip_caption
{
  font-family: sans-serif;
  font-weight: 300;
  font-size: 8px;
  color: #444444;
  display: none;
  width: 150px;
  text-align: left;
  line-height: 25px
}

header{
  text-align: center;
}

.top-nav{
  margin-top: 20px;
}


.section-wrapper{
  height: 100%;
  display: flex;
}

.tooltip-container{
  position: absolute;
  right: 15%;
  top: 20%;
}