/* Source Sans 3 Regular */
@font-face {
  font-family: "Source Sans 3";
  font-style: normal;
  font-weight: 400;
  src: url("https://cdn.jsdelivr.net/npm/@infineon/design-system-tokens@7.0.0/dist/fonts/source-sans-3/SourceSans3-Regular.ttf.woff2") format("woff2"), url("https://cdn.jsdelivr.net/npm/@infineon/design-system-tokens@7.0.0/dist/fonts/source-sans-3/SourceSans3-Regular.ttf.woff") format("woff");
}
/* Source Sans 3 Semibold */
@font-face {
  font-family: "Source Sans 3";
  font-style: normal;
  font-weight: 600;
  src: url("https://cdn.jsdelivr.net/npm/@infineon/design-system-tokens@7.0.0/dist/fonts/source-sans-3/SourceSans3-Semibold.ttf.woff2") format("woff2"), url("https://cdn.jsdelivr.net/npm/@infineon/design-system-tokens@7.0.0/dist/fonts/source-sans-3/SourceSans3-Semibold.ttf.woff") format("woff");
}
/* Source Sans 3 Italic */
@font-face {
  font-family: "Source Sans 3";
  font-style: italic;
  font-weight: 400;
  src: url("https://cdn.jsdelivr.net/npm/@infineon/design-system-tokens@7.0.0/dist/fonts/source-sans-3/SourceSans3-It.ttf.woff2") format("woff2"), url("https://cdn.jsdelivr.net/npm/@infineon/design-system-tokens@7.0.0/dist/fonts/source-sans-3/SourceSans3-It.ttf.woff") format("woff");
}
:root {
  --ifx-font-family: "Source Sans 3", "Arial, sans-serif";
}

ifx-icon:empty {
  display: none;
}

.error-page {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 145px;
  width: 100%;
  height: 100%;
}
.error-page,
.error-page * {
  box-sizing: border-box;
}
@media (max-width: 768px) {
  .error-page {
    flex-direction: column;
    gap: unset;
  }
}
.error-page__image {
  display: flex;
  flex: 1;
  justify-content: center;
  max-width: 422px;
}
@media (max-width: 768px) {
  .error-page__image {
    width: 100%;
    min-width: 263px;
    margin-bottom: 1.5rem;
    padding: 2rem 3.5rem 0 3.5rem;
  }
}
.error-page__image img {
  width: 100%;
}
.error-page__description {
  display: flex;
  flex-direction: column;
  flex: 1;
  max-width: 644px;
  overflow-wrap: anywhere;
}
@media (max-width: 768px) {
  .error-page__description {
    width: 100%;
    max-width: 100%;
    padding: 1rem;
  }
}
.error-page__type {
  font: 600 1rem/1.5rem "Source Sans 3";
  margin-bottom: 2rem;
  letter-spacing: 3.2px;
  text-transform: uppercase;
}
@media (max-width: 768px) {
  .error-page__type {
    margin-bottom: 1.5rem;
  }
}
.error-page__headline {
  font: 600 3rem/3.75rem "Source Sans 3";
  margin: 0 0 1rem 0;
}
@media (max-width: 768px) {
  .error-page__headline {
    margin-bottom: 0.5rem;
  }
}
.error-page__body {
  font: 400 1.375rem/1.875rem "Source Sans 3";
  margin: 0 0 2rem 0;
}
@media (max-width: 768px) {
  .error-page__body {
    margin-bottom: 1.5rem;
  }
}
.error-page__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  max-width: 100%;
}
@media (max-width: 768px) {
  .error-page__actions ::slotted(*) {
    flex: 1 1 calc(50% - 0.5rem);
  }
}