.center {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 75%;
}

.row-eq-height > [class^=col]:first-of-type {
  display: flex;
}

.row-eq-height > [class^=col]:first-of-type .black {
  flex-grow: 1;
}


.clearfix:after {
 visibility: hidden;
 display: block;
 font-size: 0;
 content: " ";
 clear: both;
 height: 0;
 }

 @media (max-width:767px){.selection-form{ height:auto;}}

.svg-container {
    display: inline-block;
    position: relative;
    width: 100%;
    padding-bottom: 100%; /* aspect ratio */
    vertical-align: top;
    overflow: hidden;
}
.svg-content-responsive {
    display: inline-block;
    position: absolute;
    top: 10px;
    left: 0;
}

.carousel-inner > .item > img {
    margin: 0 auto;
}

.evocenter {
    display: block;
    margin-left: auto;
    margin-right: auto;
}
.collapse.in { min-height: 50px;border: 1px solid blue; }

.inner-wrapper {
    position: relative;
    padding-bottom: 72%;
    width: 100%;
}

.outer-box {
    position: absolute;
    top: 0; bottom: 0; left: 0; right: 0;
}

.inner-box {
    width: 100%;
    height: 100%;
}

p {
    font-size: 16px;
    margin-top:5px;
    margin-bottom: 40px;
}

.axis path,
.axis line {
    fill: none;
    stroke: #1F1F2E;
    stroke-opacity: 0.7;
    shape-rendering: crispEdges;

}
.axis path {
  stroke-width: 2px;
}

.line {
  fill: none;
  stroke: steelblue;
  stroke-width: 3px;
}

.legend  {
    width: 100%;
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    font-size: 18px;
    padding: 10px 35px;
}
.legend > div {
    margin: 0px 20px 0px 0px;
    flex-grow: 0;
}
.legend p {
    display:inline;
    font-size: 0.75em;
    font-family: sans-serif;
    font-weight: 600;
}
.legend .series-marker {
    height: 1em;
    width: 1em;
    border-radius: 35%;
    background-color: crimson;
    display: inline-block;
    margin-right: 4px;
    margin-bottom: -0.16rem;
}

.overlay {
  fill: none;
  pointer-events: all;
}

.focus circle {
  fill: crimson;
  stroke: crimson;
  stroke-width: 2px;
  fill-opacity: 15%;
}
.focus rect {
    fill: lightblue;
    opacity: 0.4;
    border-radius: 2px;
}

.focus text {
    font-family: arial;
    font-size: 12px;
}

.focus.line {
    stroke: steelblue;
    stroke-dasharray: 2,5;
    stroke-width: 2;
    opacity: 0.5;
}
@media (max-width:550px){
    .line {stroke-width: 2px;}
    .legend {font-size: 14px;}
}


.node {
  cursor: pointer;
}
.link {
  fill: none;
  stroke: #8b8b8b;
}
.ticks {
  font: 12px sans-serif;
  fill: black;
}


/* -------------------- Select Box Styles: bavotasan.com Method (with special adaptations by ericrasch.com) */
/* -------------------- Source: http://bavotasan.com/2011/style-select-box-using-only-css/ */
.selection-form{
  position:relative;
  top: 0px;
  margin: 5px;
  width: 100%; 
}

.styled-select {
   margin: 5px;
   display:inline-block;
   background: url(../images/dropdown.png) no-repeat 96% 55%;
   height: 30px;
   overflow: hidden;
   line-height: 50%; 
   width: 140px;
}

.styled-button {
   margin: 5px;
   display:inline-block;
   height: 30px;
   line-height: 15px; 
   overflow: hidden;
   width: 110px;
}

.styled-button button{
  background: transparent;
   border: none;
   font-size: 14px;
   height: 30px;
   padding: 0px; /* If you add too much padding here, the options won't show in IE */
   width: 110px;
}

.styled-select label {
   background: transparent;
   border: none;
   font-size: 14px;
   height: 30px;
   padding: 15px; /* If you add too much padding here, the options won't show in IE */
   width: 160px;
}


.styled-select select {
   background: transparent;
   border: none;
   font-size: 14px;
   height: 30px;
   padding: 20px; /* If you add too much padding here, the options won't show in IE */
   width: 160px;
}

/* -------------------- Rounded Corners */
.rounded {
   -webkit-border-radius: 20px;
   -moz-border-radius: 20px;
   border-radius: 20px;
}

.semi-square {
   -webkit-border-radius: 5px;
   -moz-border-radius: 5px;
   border-radius: 5px;
}

/* -------------------- Colors: Background */
.mycolor   { background-color: #1f93b4; }
.mycolor select   { color: #fff; }
.mycolor label   { color: #fff; }


/* -------------------- Colors: Text */
.mycolor button   { color: #fff; }



.tooltip.right .tooltip-inner {
	max-width:400px;
	padding:3px 8px;
	color:#000;
	text-align:left;
	background-color:#C0C0C0;
	-webkit-border-radius:4px;
	-moz-border-radius:4px;
	border-radius:4px
}

.tooltip.bs-tooltip-auto[x-placement^=right] .arrow::before, .tooltip.bs-tooltip-right .arrow::before {
    margin-top: -3px;
    content: "";
    border-width: 5px 5px 5px 0;
    border-right-color: #000;
	background-color:#C0C0C0;
	text-align:left;
}

/*---------------- Tooltip/popper ----------------*/
.tooltipPopper{
  cursor: pointer;
  text-decoration: underline;
  color: #a0a0a0;
}
/*.tooltip-copyright{
  position: absolute;
  bottom: 0;
  right: 0;
  color: #fff;
  font-size: 0.7em;
  line-height: 1.4em;
}*/

.tooltipMy{
  z-index: 2;
}
.tooltip-inner{
  background-color: rgba(0,0,0,0.8);
  font-family: Montserrat, sans-serif;
}
.tooltipMy>.tooltip-inner{
  font-family: Montserrat, sans-serif;
  max-width: 400px;
  text-align: left;
  font-size: 0.8em;
  line-height: 1.4em;
  padding: 10px 8px ;
  color: 000px;
}
.tooltip-copyright{
  display: block;
  text-align: right;
  padding-top: 5px;
  color: #fff;
}
.tooltip-copyright:hover{
  color: #fff;
}

.tooltip-arrow{
    width: ;
    height: 0;
    border-style: solid;
    position: absolute;
    margin: 5px;
    border-color: rgba(0,0,0,0.8);
    background-color: transparent;
}
.tooltipMy[x-placement^="top"]{
  margin-bottom: 10px;
}
.tooltipMy[x-placement^="top"] .tooltip-arrow{
  border-width: 10px 10px 0 10px;
  border-left-color: transparent;
  border-right-color: transparent;
  border-bottom-color: transparent;
  bottom: -10px;
  left: calc(50% - 10px);
  margin-top: 0;
  margin-bottom: 0;
}
.tooltipMy[x-placement^="bottom"]{
  margin-top: 10px;
}
.tooltipMy[x-placement^="bottom"] .tooltip-arrow{
  border-width: 0 10px 10px 10px;
  border-left-color: transparent;
  border-right-color: transparent;
  border-top-color: transparent;
  top: -10px;
  left: calc(50% - 10px);
  margin-top: 0;
  margin-bottom: 0;
}
.tooltipMy[x-placement^="right"]{
  margin-left: 10px;
}
.tooltipMy[x-placement^="right"] .tooltip-arrow{
  border-width: 10px 10px 10px 0;
  border-left-color: transparent;
  border-top-color: transparent;
  border-bottom-color: transparent;
  left: -10px;
  top: calc(50% - 10px);
  margin-left: 0;
  margin-right: 0;
}
.tooltipMy[x-placement^="left"]{
  margin-right: 10px;
}
.tooltipMy[x-placement^="left"] .tooltip-arrow{
  border-width: 10px 0 10px 10px;
  border-top-color: transparent;
  border-right-color: transparent;
  border-bottom-color: transparent;
  right: -10px;
  top: calc(50% - 10px);
  margin-left: 0;
  margin-right: 0;
}

