sass-site/source/assets/css/components/_callouts.scss

.sl-c-callout {
  margin: sl-px-to-rem(24px) 0;
  padding: sl-px-to-rem(12px) sl-px-to-rem(16px);
  background: $nebula;

  &--warning,
  &--fun-fact {

    &,
    a,
    code { color: $white; }

    a { text-decoration: underline; }
  }

  &--warning { background: darken($hopbush, 10%); }

  &--fun-fact { background: darken($patina, 10%); }

  h3 { padding-top: sl-px-to-rem(12px); }

  .highlight {
    box-sizing: border-box;
    width: 100%;
  }

  h3,
  .highlight code,
  .ui-tabs .ui-tabs-nav .ui-tabs-active a,
  .ui-tabs .ui-tabs-nav li.css-tab a::before { color: inherit; }
}