:root {
  --animate-duration: 1s;
}

sl-skeleton-typography .skeleton-d1,
sl-skeleton-typography .skeleton-h1 {
  margin-bottom: var(--sdx-baseline-3);
}
@media (min-width: 1024px) {
  sl-skeleton-typography .skeleton-d1,
  sl-skeleton-typography .skeleton-h1 {
    margin-bottom: var(--sdx-baseline-4);
  }
}
sl-skeleton-typography .skeleton-d2,
sl-skeleton-typography .skeleton-h2 {
  margin-bottom: 20px;
}
@media (min-width: 1024px) {
  sl-skeleton-typography .skeleton-d2,
  sl-skeleton-typography .skeleton-h2 {
    margin-bottom: var(--sdx-baseline-3);
  }
}
sl-skeleton-typography .skeleton-d3,
sl-skeleton-typography .skeleton-h3,
sl-skeleton-typography .skeleton-h4 {
  margin-bottom: var(--sdx-baseline-2);
}
@media (min-width: 1024px) {
  sl-skeleton-typography .skeleton-d3,
  sl-skeleton-typography .skeleton-h3,
  sl-skeleton-typography .skeleton-h4 {
    margin-bottom: 20px;
  }
}
sl-skeleton-typography .skeleton-h5,
sl-skeleton-typography .skeleton-h6 {
  margin-bottom: var(--sdx-baseline);
}
sl-skeleton-typography .skeleton-hero {
  padding-top: 5px;
  padding-bottom: 5px;
  height: 70px !important;
}
@media (min-width: 1024px) {
  sl-skeleton-typography .skeleton-hero {
    padding-top: 4px;
    padding-bottom: 4px;
    height: 96px !important;
  }
}
sl-skeleton-typography .skeleton-d1 {
  padding-top: 5px;
  padding-bottom: 5px;
  height: 54px !important;
}
@media (min-width: 1024px) {
  sl-skeleton-typography .skeleton-d1 {
    padding-top: 5px;
    padding-bottom: 5px;
    height: 70px !important;
  }
}
sl-skeleton-typography .skeleton-d2 {
  padding-top: 4px;
  padding-bottom: 4px;
  height: 48px !important;
}
@media (min-width: 1024px) {
  sl-skeleton-typography .skeleton-d2 {
    padding-top: 5px;
    padding-bottom: 5px;
    height: 54px !important;
  }
}
sl-skeleton-typography .skeleton-d3 {
  padding-top: 4px;
  padding-bottom: 4px;
  height: 40px !important;
}
@media (min-width: 1024px) {
  sl-skeleton-typography .skeleton-d3 {
    padding-top: 4px;
    padding-bottom: 4px;
    height: 48px !important;
  }
}
sl-skeleton-typography .skeleton-text-standard {
  height: 18px !important;
  padding-top: 2px;
  padding-bottom: 2px;
}
sl-skeleton-typography .skeleton-text-small {
  height: 16px !important;
  padding-top: 2.5px;
  padding-bottom: 2.5px;
}
sl-skeleton-typography .skeleton-text-smaller {
  padding-top: 2px;
  padding-bottom: 2px;
  height: 14px !important;
}
sl-skeleton-typography .skeleton-h1 {
  padding-top: 4px;
  padding-bottom: 4px;
  height: 24px !important;
}
@media (min-width: 1024px) {
  sl-skeleton-typography .skeleton-h1 {
    padding-top: 2px;
    padding-bottom: 2px;
    height: 28px !important;
  }
}
sl-skeleton-typography .skeleton-h2 {
  padding-top: 4px;
  padding-bottom: 4px;
  height: 24px !important;
}
@media (min-width: 1024px) {
  sl-skeleton-typography .skeleton-h2 {
    padding-top: 2px;
    padding-bottom: 2px;
    height: 28px !important;
  }
}
sl-skeleton-typography .skeleton-h3 {
  padding-top: 4px;
  padding-bottom: 4px;
  height: 24px !important;
}
@media (min-width: 1024px) {
  sl-skeleton-typography .skeleton-h3 {
    padding-top: 2px;
    padding-bottom: 2px;
    height: 28px !important;
  }
}
sl-skeleton-typography .skeleton-h4 {
  padding-top: 2px;
  padding-bottom: 2px;
  height: 20px !important;
}
@media (min-width: 1024px) {
  sl-skeleton-typography .skeleton-h4 {
    padding-top: 4px;
    padding-bottom: 4px;
    height: 24px !important;
  }
}
sl-skeleton-typography .skeleton-h5 {
  padding-top: 3px;
  padding-bottom: 3px;
  height: 18px !important;
}
sl-skeleton-typography .skeleton-h6 {
  padding-top: 4px;
  padding-bottom: 4px;
  height: 16px !important;
}