.chart {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr;
  grid-template-columns: 1fr;
  grid-gap: 3em 0em; }
  @media (min-width: 600px) {
    .chart {
      -ms-grid-columns: 1fr 1fr;
      grid-template-columns: 1fr 1fr; } }
  @media (min-width: 600px) {
    .chart .item:first-child {
      -ms-grid-column-span: 2;
      grid-column: span 2; } }
  .chart .item .chartdiv {
    height: 200px; }
  .chart .title {
    text-align: center;
    margin: 0;
    color: #4F4F4F; }
  .chart .card {
    -webkit-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.08);
            box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.08);
    border-radius: 4px;
    margin: 1rem; }
    .chart .card:hover {
      -webkit-box-shadow: 0px 8px 30px rgba(0, 0, 0, 0.08);
              box-shadow: 0px 8px 30px rgba(0, 0, 0, 0.08); }
  .chart .chartdiv {
    width: 100%; }