body, .containers-dashboard {
    background-color: #F5F5F5
}
.heatmap-container rect {
    cursor: pointer;
}

/* TODO (gs) -- remove this when https://patternfly.atlassian.net/browse/PTNFLY-1579 is fixed */
.card-pf-aggregate-status-notification .pficon-warning-triangle-o {
    position: relative;
    top: 2px;
}

.global-dashboard-update-column {
  display: flex;
  flex-flow: row;
  justify-content: flex-start;
  align-items: center;
  margin: 10px -10px;
}

/* these are small tweaks to try to make the dashboard squeeze into a 1920x1080
   window without vertical scrolling. It fits great on Chrome, needs work on FF.
*/
.utilization-chart-pf h3 {
    margin-top: 7px;
}
.card-pf-title {
    margin: 12px 0;
}
.card-pf-heading {
    margin: 0 -20px 10px;
}
.card-pf-body {
    margin: 10px 0;
}
.heatmap-chart-title {
    margin-top: 5px;
}
.card-pf {
    margin-bottom: 5px;
}
.card-pf-aggregate-status-notifications {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
}
.card-pf-aggregate-status-notification {
    white-space: nowrap;
}

/* Following media queries are required to split a row into seven equal columns
   in bootstrap grid system. This is based on the reference implementation at
   https://gist.github.com/kanakiyajay/15e4fc98248956614643
*/
@media (min-width: 768px) {
  .seven-cols .col-md-1,
  .seven-cols .col-sm-1,
  .seven-cols .col-lg-1  {
    width: 100%;
  }
}

@media (min-width: 992px) {
  .seven-cols .col-md-1,
  .seven-cols .col-sm-1,
  .seven-cols .col-lg-1 {
    width: 14.285714285714285714285714285714%;
  }
}

@media (min-width: 1200px) {
  .seven-cols .col-md-1,
  .seven-cols .col-sm-1,
  .seven-cols .col-lg-1 {
    width: 14.285714285714285714285714285714%;
  }
}
