@gooddata/react-components/styles/css/headline.css

GoodData.UI - A powerful JavaScript library for building analytical applications

meta.foundation-version {
  font-family: "/5.5.3/"; }

meta.foundation-mq-small {
  font-family: "/only screen/";
  width: 0; }

meta.foundation-mq-small-only {
  font-family: "/only screen and (max-width: 40em)/";
  width: 0; }

meta.foundation-mq-medium {
  font-family: "/only screen and (min-width:40.0625em)/";
  width: 40.0625em; }

meta.foundation-mq-medium-only {
  font-family: "/only screen and (min-width:40.0625em) and (max-width:64em)/";
  width: 40.0625em; }

meta.foundation-mq-large {
  font-family: "/only screen and (min-width:64.0625em)/";
  width: 64.0625em; }

meta.foundation-mq-large-only {
  font-family: "/only screen and (min-width:64.0625em) and (max-width:90em)/";
  width: 64.0625em; }

meta.foundation-mq-xlarge {
  font-family: "/only screen and (min-width:90.0625em)/";
  width: 90.0625em; }

meta.foundation-mq-xlarge-only {
  font-family: "/only screen and (min-width:90.0625em) and (max-width:120em)/";
  width: 90.0625em; }

meta.foundation-mq-xxlarge {
  font-family: "/only screen and (min-width:120.0625em)/";
  width: 120.0625em; }

meta.foundation-data-attribute-namespace {
  font-family: false; }

.headline {
  text-align: center; }
  .headline .headline-primary-item {
    color: #000;
    font-family: avenir, "Helvetica Neue", arial, sans-serif;
    font-weight: 400;
    font-weight: 700;
    line-height: 30px;
    font-size: 24px;
    overflow: hidden;
    height: 60px;
    line-height: 60px;
    font-size: 50px;
    white-space: nowrap; }
    .headline .headline-primary-item .headline-value-wrapper {
      display: inline-block;
      -webkit-backface-visibility: hidden; }
    .headline .headline-primary-item.is-drillable .headline-value-wrapper {
      cursor: pointer;
      transition: opacity 0.4s; }
    .headline .headline-primary-item.is-drillable .headline-value-wrapper:hover {
      opacity: 0.6; }
  .headline .headline-secondary-item {
    flex-shrink: 1;
    padding-right: 0;
    border-left: 1px dashed rgba(176, 190, 202, 0.5); }
    .headline .headline-secondary-item.is-drillable {
      cursor: pointer; }
      .headline .headline-secondary-item.is-drillable .headline-value-wrapper,
      .headline .headline-secondary-item.is-drillable .headline-title-wrapper {
        transition: opacity 0.4s; }
      .headline .headline-secondary-item.is-drillable:hover .headline-value-wrapper,
      .headline .headline-secondary-item.is-drillable:hover .headline-title-wrapper {
        opacity: 0.6; }
  .headline .headline-primary-item .headline-value,
  .headline .headline-secondary-item .headline-value {
    position: relative;
    display: inline-block;
    line-height: 115%; }
  .headline .headline-value--empty {
    color: #b0beca; }
  .headline .headline-item-link .headline-value::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    display: block; }
  .headline .headline-item-link .headline-value:not(.headline-value--empty).headline-link-style-underline::after {
    border-bottom: 2px solid; }
  .headline .headline-secondary-item .headline-item-link .headline-value.headline-link-style-underline::after {
    border-bottom: 1px solid; }
  .headline .headline-secondary-item .headline-item-link .headline-value.headline-value--empty::after {
    border-bottom: none; }
  .headline .headline-compare-section {
    position: relative;
    justify-content: center;
    flex-wrap: nowrap;
    overflow: hidden;
    margin-top: 10px;
    margin-bottom: 15px;
    color: #94a1ad;
    font-family: avenir, "Helvetica Neue", arial, sans-serif;
    font-weight: 400; }
  .headline .headline-compare-section-item {
    overflow: hidden;
    margin: 0;
    padding: 0 15px;
    color: #94a1ad; }
    .headline .headline-compare-section-item .headline-title-wrapper,
    .headline .headline-compare-section-item .headline-value-wrapper {
      line-height: 14px; }
    .headline .headline-compare-section-item .headline-value-wrapper {
      overflow: hidden;
      height: 20px;
      margin-bottom: 0.25em;
      font-size: 17px;
      font-weight: bold;
      line-height: 20px;
      white-space: nowrap;
      text-overflow: ellipsis; }
    .headline .headline-compare-section-item .headline-title-wrapper {
      overflow: hidden;
      text-overflow: ellipsis;
      margin: 0;
      padding: 0;
      font-size: 12px;
      white-space: nowrap; }