.line-charts{
  height:20rem;
  display:flex;
  position:relative;
  align-items:center;
  margin:-1rem -1rem 0;
}
.charts-scroller{
  width:100%;
}
.slick-slider .slick-list{
  margin:0;
  padding:1rem 0;
}
.charts-scroller .slick-prev,
.charts-scroller .slick-next{
  z-index:2;
  width:3rem;
  height:3rem;
  opacity:.75;
  border-radius:50%;
  text-align:center;
  padding-top:0.3rem;
  background-color:#36363640;
}
.charts-scroller .slick-slide{
  cursor:grab;
  height:18rem;
  padding:0 0.5rem;
}
.charts-scroller .slick-slide:active{
  cursor:grabbing;
}
.charts-scroller .slick-slide > div{
  height:100%;
}
.chart-wrap{
  border:none;
  height:100%;
  cursor:grab;
  position:relative;
  align-items:center;
  border-radius:0.25rem;
  justify-content:center;
  display:flex !important;
  background-color:#ffffff;
  transition:box-shadow 0.3s ease;
  box-shadow:0 4px 7px 0 rgba(0,0,0,0.1);
}
.chart-wrap:active{
  cursor:grabbing;
}
.charts-scroller .slide-nav{
  left:0;
  right:0;
  width:100%;
  top:0.5rem;
  z-index:999;
  height:45px;
  overflow:hidden;
  position:absolute;
}
.charts-scroller .slide-nav-prev{
  float:left;
  padding:0.85rem 1rem;
  background-color:#fff;
}
.charts-scroller .slide-nav-next{
  float:right;
  padding:0.85rem 1rem;
  background-color:#fff;
}
.charts-scroller .slick-prev{
  left:0.5rem;
}
.charts-scroller .slick-next{
  right:0.5rem;
}
.column-chart{
  float:left;
  width:100%;
  height:500px;
  padding:1rem 0;
  margin-bottom:2rem;
  position:relative;
  border-radius:0.25rem;
  background-color:#fff;
  box-shadow:0 4px 9px 0 rgba(0,0,0,0.1);
}
.dropdown.chart-dropdown{
  right:4rem;
  width:15rem;
  position:absolute;
}
.activity-button{
  right:1rem;
  position:absolute;
}
.activity-button i{
  padding:0.45rem;
  font-size:1.45rem;
}
.chart-canvas{
  display:flex;
  margin:0 -5rem;
  width:25rem !important;
  justify-content:center;
}
.no-chart{
  width:100%;
  text-align:center;
}
.chart-container{
  width:100%;
  display:flex;
  align-items:center;
  padding-bottom:3rem;
  justify-content:space-evenly;
}
.chart-legend{
  width:5rem;
  display:flex;
  align-items:center;
}
.chart-legend ul{
  margin:0;
  padding:0;
  width:100%;
}
.chart-legend ul li{
  display:flex;
  list-style:none;
  font-size:0.8rem;
  flex-direction:row;
  align-items:center;
  justify-content:left;
  margin-bottom:0.75rem;
}
.chart-legend ul li span{
  width:10px;
  height:10px;
  display:block;
  margin-top:0.1rem;
  border-radius:50%;
  margin-right:0.3rem;
  background-color:#ccc;
}
.chart-canvas img{
  opacity:0.1;
  width:12rem;
  height:12rem;
}
.no-chart-text {
  bottom:1rem;
  width:100%;
  font-size:1.5rem;
  text-align:center;
  position:absolute;
}
.chart-wrap:hover,
.column-chart:hover{
  box-shadow:0 4px 12px 0 rgba(0,0,0,0.2);
}