body {
  margin: 0px;
  padding: 0px;
  font-family: Arial, sans-serif;
}

#iframed-message {
  background: white;
  color: black;
}

.css-changes-for-example-only [class^='g-caption'] + [class^='g-heading'],
.css-changes-for-example-only [class^='g-heading']:first-child {
  margin-top: 0 !important;
}

.css-changes-for-example-only {
  padding: 2.5rem 2rem;
}

.css-changes-for-example-only.example-no-padding {
  padding: 0px;
}

.css-changes-for-example-only .example__section {
  margin-bottom: 1.5rem;
}

.css-changes-for-example-only > .g-flex-container > .g-flex-row > .g-flex-col {
  background: #eeeeee;
  outline: solid 1px black;
  text-align: center;
  font-size: small;
  font-weight: bold;
  padding-top: 3px;
  padding-bottom: 4px;
}

.css-changes-for-example-only .g-button {
  margin-right: 2rem;
}

.css-changes-for-example-only .g-ol li,
.css-changes-for-example-only .g-ul li {
  margin-bottom: 0.25rem;
}

.css-changes-for-example-only .example-agency-logo {
  margin: 3px;
  display: inline-block;
}

.css-changes-for-example-only .example-agency-logo__image {
  fill: white;
  color: white;
  margin: 10px 10px 10px 0;
}

.css-changes-for-example-only
  .example-agency-logo__image
  .css-changes-for-example-only
  .example-hidden {
  display: none;
}

.css-changes-for-example-only .example-subfooter-copyright {
  font-size: 14px;
}

.css-changes-for-example-only .example-subfooter-row {
  min-height: 146px;
  justify-content: space-evenly;
}

@media only screen and (min-width: 48em) {
  .css-changes-for-example-only .example-subfooter-row {
    min-height: 104px;
  }
}

.theme-main {
  padding-top: 2em;
}

.example-invert-logo {
  display: block;
  margin: 15px 0px;
}

/* THEMES */

body.theme-default {
  --g-theme-font-family: Arial, sans-serif;
  --g-theme-background-color: #ffffff;
  --g-theme-color: #2a2a2a;
  --g-theme-print-color: #000000;
  --g-theme-error-color: #b10e1e;
  --g-theme-hint-color: #595959;
  --g-theme-focus-ring-color: #b53cde;
  --g-theme-heading-font-family: Arial, sans-serif;
  --g-theme-heading-color: #2a2a2a;
  --g-theme-inverted-color: #ffffff;
  --g-theme-inverted-background-color: #363636;
  --g-theme-inverted-variant-background-color: #2a2a2a;
  --g-theme-inverted-link-color: #d3d3d3;
  --g-theme-inverted-nav-active-color: #24a882;
  --g-theme-button-active-box-shadow: #003418;
  --g-theme-button-background-color: #00823b;
  --g-theme-button-hover-background-color: #00692f;
  --g-theme-button-disabled-background-color: #078766;
  --g-theme-button-secondary-background-color: #b2b2b2;
  --g-theme-button-warning-background-color: #900815;
  --g-theme-link-color: #005ea5;
  --g-theme-link-focus-color: #0b0c0c;
  --g-theme-link-hover-color: #2b8cc4;
  --g-theme-link-visited-color: #4c2c92;
  --g-theme-link-muted-color: #6f777b;
  --g-theme-alert-color: #6f777b;
  --g-theme-alert-background-color: #f4f4f4;
  --g-theme-alert-success-border-color: #088a20;
  --g-theme-alert-warning-border-color: #d47500;
  --g-theme-alert-error-border-color: #b10e1e;
  --g-theme-alert-info-border-color: #1f1bfb;
  --g-theme-alert-border-color: #d3d3d3;
  --g-theme-inset-border-color: #23cba5;
  --g-theme-caption-color: #6f777c;
}

body.theme-light {
  --g-theme-font-family: Arial, sans-serif;
  --g-theme-background-color: #edede2;
  --g-theme-color: #27283a;
  --g-theme-print-color: #000000;
  --g-theme-error-color: #b10e1e;
  --g-theme-hint-color: #595959;
  --g-theme-focus-ring-color: #b53cde;
  --g-theme-heading-color: #27283a;
  --g-theme-heading-font-family: Arial, sans-serif;
  --g-theme-inverted-color: #ffffff;
  --g-theme-inverted-background-color: #27283a;
  --g-theme-inverted-variant-background-color: #181822;
  --g-theme-inverted-link-color: #d3d3d3;
  --g-theme-inverted-nav-active-color: #0466ff;
  --g-theme-inverted-nav-active-border-color: #0466ff;
  --g-theme-button-active-box-shadow: #003418;
  --g-theme-button-background-color: #0256ef;
  --g-theme-button-hover-background-color: #0550c4;
  --g-theme-button-disabled-background-color: #0256ef;
  --g-theme-button-secondary-background-color: #b2b2b2;
  --g-theme-button-warning-background-color: #900815;
  --g-theme-link-color: #005ea5;
  --g-theme-link-focus-color: #0b0c0c;
  --g-theme-link-hover-color: #2b8cc4;
  --g-theme-link-visited-color: #4c2c92;
  --g-theme-link-muted-color: #6f777b;
  --g-theme-alert-color: #6f777b;
  --g-theme-alert-background-color: #f4f4f4;
  --g-theme-alert-success-border-color: #088a20;
  --g-theme-alert-warning-border-color: #d47500;
  --g-theme-alert-error-border-color: #b10e1e;
  --g-theme-alert-info-border-color: #1f1bfb;
  --g-theme-alert-border-color: #d3d3d3;
  --g-theme-inset-border-color: #23cba5;
  --g-theme-caption-color: #6f777c;
}

body.theme-dark {
  --g-theme-font-family: Arial, sans-serif;
  --g-theme-background-color: #2a2a2a;
  --g-theme-color: #ffffff;
  --g-theme-print-color: #000000;
  --g-theme-error-color: #b10e1e;
  --g-theme-hint-color: #595959;
  --g-theme-focus-ring-color: #ffffff;
  --g-theme-heading-font-family: Arial, sans-serif;
  --g-theme-heading-color: #ffffff;
  --g-theme-inverted-color: #ffffff;
  --g-theme-inverted-background-color: #078766;
  --g-theme-inverted-variant-background-color: #0e5f4a;
  --g-theme-inverted-link-color: #ffffff;
  --g-theme-inverted-menu-button-color: #ffffff;
  --g-theme-inverted-nav-active-border-color: #000000;
  --g-theme-inverted-nav-active-color: #000000;
  --g-theme-select-background-color: #363636;
  --g-theme-select-color: #ffffff;
  --g-theme-form-background-color: #363636;
  --g-theme-form-border-color: #737373;
  --g-theme-form-color: #ffffff;
  --g-theme-legend-color: #ffffff;
  --g-theme-button-active-box-shadow: #000000;
  --g-theme-button-color: #000000;
  --g-theme-button-background-color: #d3d3d3;
  --g-theme-button-hover-background-color: #bbbbbb;
  --g-theme-button-disabled-background-color: #d3d3d3;
  --g-theme-button-secondary-background-color: #b2b2b2;
  --g-theme-button-warning-background-color: #900815;
  --g-theme-link-color: #005ea5;
  --g-theme-link-focus-color: #0b0c0c;
  --g-theme-link-hover-color: #2b8cc4;
  --g-theme-link-visited-color: #4c2c92;
  --g-theme-link-muted-color: #6f777b;
  --g-theme-alert-color: #6f777b;
  --g-theme-alert-background-color: #f4f4f4;
  --g-theme-alert-success-border-color: #088a20;
  --g-theme-alert-warning-border-color: #d47500;
  --g-theme-alert-error-border-color: #b10e1e;
  --g-theme-alert-info-border-color: #1f1bfb;
  --g-theme-alert-border-color: #d3d3d3;
  --g-theme-inset-border-color: #23cba5;
  --g-theme-caption-color: #6f777c;
  --g-theme-radio-border: solid 1px #737373;
}

body {
  background-color: var(--g-theme-background-color, #ffffff);
  color: var(--g-theme-color, #2a2a2a);
}

a:focus {
  outline: #b53cde;
  outline: 3px solid var(--g-theme-focus-ring-color, #b53cde);
}

.css-changes-for-example-only .example-invert-logo {
  color: white;
  color: var(--g-theme-inverted-color, white);
}