a {
  color: var(--pdc-color-14);
  text-decoration: underline;
  text-underline-offset: 2px;
}

a:visited,
a:active {
  color: var(--pdc-color-14);
  text-decoration: underline;
}

a:hover,
a:focus-visible {
  text-decoration: none;
  color: var(--pdc-color-5);
}

a:focus {
  outline-offset: 3px;
}

/**
 * Inverted typography styles.
 *
 * Most elements are covered by the body text color change. Special cases for
 * <a> and <hX> since they have direct styles applied above that need to be
 * overridden.
 */
.pdc-inverted {
  color: #fff;
  text-decoration: none;
  border-bottom: 0;
}

.pdc-inverted h1,
.pdc-inverted h2,
.pdc-inverted h3,
.pdc-inverted h4,
.pdc-inverted h5,
.pdc-inverted h6 {
  color: #fff;
}

.pdc-inverted a {
  color: #fff;
  text-decoration: none;
  border-bottom: 0;
}

.pdc-inverted a:visited {
  color: #fff;
  text-decoration: none;
  border-bottom: 0;
}

.pdc-inverted a:hover,
.pdc-inverted a:focus-visible {
  color: #F9F9A5;
  text-decoration: underline;
}

.pdc-inverted a:active {
  color: var(--pdc-link-active-color-inverted);
}

.pdc-inverted :focus-visible,
.pdc-inverted button:focus-visible,
.pdc-inverted [type="button"]:focus-visible,
.pdc-inverted [type="reset"]:focus-visible,
.pww-inverted [type="submit"]:focus-visible {
  outline-color: #fff;
}

.pdc-btn-inverted {
  color: #016702 !important;
  background: #fff;
  padding: 10px 15px;
  border-radius: 5px;
  text-decoration: none !important;
  white-space: nowrap;
}

.pdc-btn-inverted:hover {
 color: #016702 !important;
}

.field--label {
  overflow-wrap: break-word;
  word-break: break-word; /* for older browsers */
  white-space: normal;
}