/* ./your-css-folder/styles.css */

/* ! tailwindcss v2.2.19 | MIT License | https://tailwindcss.com */

/*! modern-normalize v1.1.0 | MIT License | https://github.com/sindresorhus/modern-normalize */

/*
Document
========
*/

/**
Use a better box model (opinionated).
*/

*,
::before,
::after {
  box-sizing: border-box;
}

/**
Use a more readable tab size (opinionated).
*/

html {
  -moz-tab-size: 4;
  -o-tab-size: 4;
     tab-size: 4;
}

/**
1. Correct the line height in all browsers.
2. Prevent adjustments of font size after orientation changes in iOS.
*/

html {
  line-height: 1.15; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
}

/*
Sections
========
*/

/**
Remove the margin in all browsers.
*/

body {
  margin: 0;
}

/**
Improve consistency of default fonts in all browsers. (https://github.com/sindresorhus/modern-normalize/issues/3)
*/

body {
  font-family:
		system-ui,
		-apple-system, /* Firefox supports this but not yet `system-ui` */
		'Segoe UI',
		Roboto,
		Helvetica,
		Arial,
		sans-serif,
		'Apple Color Emoji',
		'Segoe UI Emoji';
}

/*
Grouping content
================
*/

/**
1. Add the correct height in Firefox.
2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
*/

/*
Text-level semantics
====================
*/

/**
Add the correct text decoration in Chrome, Edge, and Safari.
*/

/**
Add the correct font weight in Edge and Safari.
*/

b,
strong {
  font-weight: bolder;
}

/**
1. Improve consistency of default fonts in all browsers. (https://github.com/sindresorhus/modern-normalize/issues/3)
2. Correct the odd 'em' font sizing in all browsers.
*/

code {
  font-family:
		ui-monospace,
		SFMono-Regular,
		Consolas,
		'Liberation Mono',
		Menlo,
		monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/**
Add the correct font size in all browsers.
*/

/**
Prevent 'sub' and 'sup' elements from affecting the line height in all browsers.
*/

/*
Tabular data
============
*/

/**
1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)
2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)
*/

table {
  text-indent: 0; /* 1 */
  border-color: inherit; /* 2 */
}

/*
Forms
=====
*/

/**
1. Change the font styles in all browsers.
2. Remove the margin in Firefox and Safari.
*/

button,
input,
select {
  font-family: inherit; /* 1 */
  font-size: 100%; /* 1 */
  line-height: 1.15; /* 1 */
  margin: 0; /* 2 */
}

/**
Remove the inheritance of text transform in Edge and Firefox.
1. Remove the inheritance of text transform in Firefox.
*/

button,
select { /* 1 */
  text-transform: none;
}

/**
Correct the inability to style clickable types in iOS and Safari.
*/

button,
[type='button'],
[type='submit'] {
  -webkit-appearance: button;
}

/**
Remove the inner border and padding in Firefox.
*/

::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

/**
Restore the focus styles unset by the previous rule.
*/

/**
Remove the additional ':invalid' styles in Firefox.
See: https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737
*/

/**
Remove the padding so developers are not caught out when they zero out 'fieldset' elements in all browsers.
*/

/**
Add the correct vertical alignment in Chrome and Firefox.
*/

progress {
  vertical-align: baseline;
}

/**
Correct the cursor style of increment and decrement buttons in Safari.
*/

::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
  height: auto;
}

/**
1. Correct the odd appearance in Chrome and Safari.
2. Correct the outline style in Safari.
*/

[type='search'] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}

/**
Remove the inner padding in Chrome and Safari on macOS.
*/

::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
1. Correct the inability to style clickable types in iOS and Safari.
2. Change font properties to 'inherit' in Safari.
*/

::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}

/*
Interactive
===========
*/

/*
Add the correct display in Chrome and Safari.
*/

/**
 * Manually forked from SUIT CSS Base: https://github.com/suitcss/base
 * A thin layer on top of normalize.css that provides a starting point more
 * suitable for web applications.
 */

/**
 * Removes the default spacing and border for appropriate elements.
 */

blockquote,
dl,
h1,
h2,
h3,
h4,
h5,
figure,
p {
  margin: 0;
}

button {
  background-color: transparent;
  background-image: none;
}


ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

/**
 * Tailwind custom reset styles
 */

/**
 * 1. Use the user's configured `sans` font-family (with Tailwind's default
 *    sans-serif font stack as a fallback) as a sane default.
 * 2. Use Tailwind's default "normal" line-height so the user isn't forced
 *    to override it to ensure consistency even when using the default theme.
 */

html {
  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; /* 1 */
  line-height: 1.5; /* 2 */
}

/**
 * Inherit font-family and line-height from `html` so users can set them as
 * a class directly on the `html` element.
 */

body {
  font-family: inherit;
  line-height: inherit;
}

/**
 * 1. Prevent padding and border from affecting element width.
 *
 *    We used to set this in the html element and inherit from
 *    the parent element for everything else. This caused issues
 *    in shadow-dom-enhanced elements like <details> where the content
 *    is wrapped by a div with box-sizing set to `content-box`.
 *
 *    https://github.com/mozdevs/cssremedy/issues/4
 *
 *
 * 2. Allow adding a border to an element by just adding a border-width.
 *
 *    By default, the way the browser specifies that an element should have no
 *    border is by setting it's border-style to `none` in the user-agent
 *    stylesheet.
 *
 *    In order to easily add borders to elements by just setting the `border-width`
 *    property, we change the default border-style for all elements to `solid`, and
 *    use border-width to hide them instead. This way our `border` utilities only
 *    need to set the `border-width` property instead of the entire `border`
 *    shorthand, making our border utilities much more straightforward to compose.
 *
 *    https://github.com/tailwindcss/tailwindcss/pull/116
 */

*,
::before,
::after {
  box-sizing: border-box; /* 1 */
  border-width: 0; /* 2 */
  border-style: solid; /* 2 */
  border-color: currentColor; /* 2 */
}

/*
 * Ensure horizontal rules are visible by default
 */

/**
 * Undo the `border-style: none` reset that Normalize applies to images so that
 * our `border-{width}` utilities have the expected effect.
 *
 * The Normalize reset is unnecessary for us since we default the border-width
 * to 0 on all elements.
 *
 * https://github.com/tailwindcss/tailwindcss/issues/362
 */

img {
  border-style: solid;
}

input::-moz-placeholder {
  opacity: 1;
  color: #9ca3af;
}

input:-ms-input-placeholder {
  opacity: 1;
  color: #9ca3af;
}

input::placeholder {
  opacity: 1;
  color: #9ca3af;
}

button,
[role="button"] {
  cursor: pointer;
}

/**
 * Override legacy focus reset from Normalize with modern Firefox focus styles.
 *
 * This is actually an improvement over the new defaults in Firefox in our testing,
 * as it triggers the better focus styles even for links, which still use a dotted
 * outline in Firefox by default.
 */

table {
  border-collapse: collapse;
}

h1,
h2,
h3,
h4,
h5 {
  font-size: inherit;
  font-weight: inherit;
}

/**
 * Reset links to optimize for opt-in styling instead of
 * opt-out.
 */

a {
  color: inherit;
  text-decoration: inherit;
}

/**
 * Reset form element properties that are easy to forget to
 * style explicitly so you don't inadvertently introduce
 * styles that deviate from your design system. These styles
 * supplement a partial reset that is already applied by
 * normalize.css.
 */

button,
input,
select {
  padding: 0;
  line-height: inherit;
  color: inherit;
}

/**
 * Use the configured 'mono' font family for elements that
 * are expected to be rendered with a monospace font, falling
 * back to the system monospace stack if there is no configured
 * 'mono' font family.
 */


code {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}

/**
 * 1. Make replaced elements `display: block` by default as that's
 *    the behavior you want almost all of the time. Inspired by
 *    CSS Remedy, with `svg` added as well.
 *
 *    https://github.com/mozdevs/cssremedy/issues/14
 * 
 * 2. Add `vertical-align: middle` to align replaced elements more
 *    sensibly by default when overriding `display` by adding a
 *    utility like `inline`.
 *
 *    This can trigger a poorly considered linting error in some
 *    tools but is included by design.
 * 
 *    https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210
 */

img,
svg,
video,
iframe {
  display: block; /* 1 */
  vertical-align: middle; /* 2 */
}

/**
 * Constrain images and videos to the parent width and preserve
 * their intrinsic aspect ratio.
 *
 * https://github.com/mozdevs/cssremedy/issues/14
 */

img,
video {
  max-width: 100%;
  height: auto;
}

/**
 * Ensure the default browser behavior of the `hidden` attribute.
 */

[hidden] {
  display: none;
}

*, ::before, ::after {
  --tw-border-opacity: 1;
  border-color: rgba(229, 231, 235, var(--tw-border-opacity));
}

.static {
  position: static !important;
}

.fixed {
  position: fixed !important;
}

.absolute {
  position: absolute !important;
}

.sticky {
  position: -webkit-sticky !important;
  position: sticky !important;
}

.top-14 {
  top: 3.5rem !important;
}

.top-52 {
  top: 13rem !important;
}

.my-1 {
  margin-top: 0.25rem !important;
  margin-bottom: 0.25rem !important;
}

.mt-0 {
  margin-top: 0px !important;
}

.mt-2 {
  margin-top: 0.5rem !important;
}

.mt-3 {
  margin-top: 0.75rem !important;
}

.mt-4 {
  margin-top: 1rem !important;
}

.mt-10 {
  margin-top: 2.5rem !important;
}

.-mt-1 {
  margin-top: -0.25rem !important;
}

.-mt-7 {
  margin-top: -1.75rem !important;
}

.mb-3 {
  margin-bottom: 0.75rem !important;
}

.ml-3 {
  margin-left: 0.75rem !important;
}

.inline-block {
  display: inline-block !important;
}

.inline {
  display: inline !important;
}

.flex {
  display: flex !important;
}

.table {
  display: table !important;
}

.hidden {
  display: none !important;
}

.h-6 {
  height: 1.5rem !important;
}

.h-7 {
  height: 1.75rem !important;
}

.h-11 {
  height: 2.75rem !important;
}

.h-14 {
  height: 3.5rem !important;
}

.h-auto {
  height: auto !important;
}

.w-0 {
  width: 0px !important;
}

.w-6 {
  width: 1.5rem !important;
}

.w-full {
  width: 100% !important;
}

@-webkit-keyframes spin {
  to {
    transform: rotate(360deg);
  }
}

@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}

@-webkit-keyframes ping {
  75%, 100% {
    transform: scale(2);
    opacity: 0;
  }
}

@keyframes ping {
  75%, 100% {
    transform: scale(2);
    opacity: 0;
  }
}

@-webkit-keyframes pulse {
  50% {
    opacity: .5;
  }
}

@keyframes pulse {
  50% {
    opacity: .5;
  }
}

@-webkit-keyframes bounce {
  0%, 100% {
    transform: translateY(-25%);
    -webkit-animation-timing-function: cubic-bezier(0.8,0,1,1);
            animation-timing-function: cubic-bezier(0.8,0,1,1);
  }

  50% {
    transform: none;
    -webkit-animation-timing-function: cubic-bezier(0,0,0.2,1);
            animation-timing-function: cubic-bezier(0,0,0.2,1);
  }
}

@keyframes bounce {
  0%, 100% {
    transform: translateY(-25%);
    -webkit-animation-timing-function: cubic-bezier(0.8,0,1,1);
            animation-timing-function: cubic-bezier(0.8,0,1,1);
  }

  50% {
    transform: none;
    -webkit-animation-timing-function: cubic-bezier(0,0,0.2,1);
            animation-timing-function: cubic-bezier(0,0,0.2,1);
  }
}

.overflow-hidden {
  overflow: hidden !important;
}

.border-t-2 {
  border-top-width: 2px !important;
}

.border-primary {
  --tw-border-opacity: 1 !important;
  border-color: rgba(156, 15, 22, var(--tw-border-opacity)) !important;
}

.bg-white {
  --tw-bg-opacity: 1 !important;
  background-color: rgba(255, 255, 255, var(--tw-bg-opacity)) !important;
}

.bg-secondary-100 {
  --tw-bg-opacity: 1 !important;
  background-color: rgba(238, 238, 238, var(--tw-bg-opacity)) !important;
}

.bg-litdarkgruen {
  --tw-bg-opacity: 1 !important;
  background-color: rgba(36, 66, 30, var(--tw-bg-opacity)) !important;
}

.bg-litlightgruen {
  --tw-bg-opacity: 1 !important;
  background-color: rgba(65, 138, 29, var(--tw-bg-opacity)) !important;
}

.bg-litdarkrot {
  --tw-bg-opacity: 1 !important;
  background-color: rgba(59, 16, 3, var(--tw-bg-opacity)) !important;
}

.bg-litlightrot {
  --tw-bg-opacity: 1 !important;
  background-color: rgba(156, 15, 22, var(--tw-bg-opacity)) !important;
}

.bg-litdarkviolett {
  --tw-bg-opacity: 1 !important;
  background-color: rgba(57, 14, 106, var(--tw-bg-opacity)) !important;
}

.bg-litlightviolett {
  --tw-bg-opacity: 1 !important;
  background-color: rgba(77, 33, 135, var(--tw-bg-opacity)) !important;
}

.bg-litdarkweiss {
  --tw-bg-opacity: 1 !important;
  background-color: rgba(233, 200, 86, var(--tw-bg-opacity)) !important;
}

.bg-litlightweiss {
  --tw-bg-opacity: 1 !important;
  background-color: rgba(252, 232, 137, var(--tw-bg-opacity)) !important;
}

.bg-litdarknone {
  --tw-bg-opacity: 1 !important;
  background-color: rgba(102, 102, 102, var(--tw-bg-opacity)) !important;
}

.bg-litlightnone {
  --tw-bg-opacity: 1 !important;
  background-color: rgba(136, 136, 136, var(--tw-bg-opacity)) !important;
}

.hover\:bg-secondary-50:hover {
  --tw-bg-opacity: 1 !important;
  background-color: rgba(247, 247, 247, var(--tw-bg-opacity)) !important;
}

.bg-left-top {
  background-position: left top !important;
}

.bg-no-repeat {
  background-repeat: no-repeat !important;
}

.px-4 {
  padding-left: 1rem !important;
  padding-right: 1rem !important;
}

.px-5 {
  padding-left: 1.25rem !important;
  padding-right: 1.25rem !important;
}

.py-2 {
  padding-top: 0.5rem !important;
  padding-bottom: 0.5rem !important;
}

.py-5 {
  padding-top: 1.25rem !important;
  padding-bottom: 1.25rem !important;
}

.pt-1 {
  padding-top: 0.25rem !important;
}

.pt-2 {
  padding-top: 0.5rem !important;
}

.pt-3 {
  padding-top: 0.75rem !important;
}

.pt-32 {
  padding-top: 8rem !important;
}

.pr-2 {
  padding-right: 0.5rem !important;
}

.pb-1 {
  padding-bottom: 0.25rem !important;
}

.pb-3 {
  padding-bottom: 0.75rem !important;
}

.pb-5 {
  padding-bottom: 1.25rem !important;
}

.pl-2 {
  padding-left: 0.5rem !important;
}

.text-right {
  text-align: right !important;
}

.text-sm {
  font-size: 0.875rem !important;
  line-height: 1.25rem !important;
}

.text-base {
  font-size: 1rem !important;
  line-height: 1.5rem !important;
}

.text-3xl {
  font-size: 1.875rem !important;
  line-height: 2.25rem !important;
}

.font-light {
  font-weight: 300 !important;
}

.font-semibold {
  font-weight: 600 !important;
}

.italic {
  font-style: italic !important;
}

.leading-4 {
  line-height: 1rem !important;
}

.leading-5 {
  line-height: 1.25rem !important;
}

.text-black {
  --tw-text-opacity: 1 !important;
  color: rgba(0, 0, 0, var(--tw-text-opacity)) !important;
}

.text-primary {
  --tw-text-opacity: 1 !important;
  color: rgba(156, 15, 22, var(--tw-text-opacity)) !important;
}

.text-secondary-800 {
  --tw-text-opacity: 1 !important;
  color: rgba(52, 52, 52, var(--tw-text-opacity)) !important;
}

.text-secondary-900 {
  --tw-text-opacity: 1 !important;
  color: rgba(38, 38, 38, var(--tw-text-opacity)) !important;
}

.text-litlightgruen {
  --tw-text-opacity: 1 !important;
  color: rgba(65, 138, 29, var(--tw-text-opacity)) !important;
}

.text-litlightrot {
  --tw-text-opacity: 1 !important;
  color: rgba(156, 15, 22, var(--tw-text-opacity)) !important;
}

.text-litdarkviolett {
  --tw-text-opacity: 1 !important;
  color: rgba(57, 14, 106, var(--tw-text-opacity)) !important;
}

.text-litlightviolett {
  --tw-text-opacity: 1 !important;
  color: rgba(77, 33, 135, var(--tw-text-opacity)) !important;
}

.text-litlightweiss {
  --tw-text-opacity: 1 !important;
  color: rgba(252, 232, 137, var(--tw-text-opacity)) !important;
}

.hover\:text-secondary-900:hover {
  --tw-text-opacity: 1 !important;
  color: rgba(38, 38, 38, var(--tw-text-opacity)) !important;
}

.text-opacity-40 {
  --tw-text-opacity: 0.4 !important;
}

.hover\:text-opacity-70:hover {
  --tw-text-opacity: 0.7 !important;
}

.underline {
  text-decoration: underline !important;
}

.opacity-70 {
  opacity: 0.7 !important;
}

.hover\:opacity-100:hover {
  opacity: 1 !important;
}

*, ::before, ::after {
  --tw-shadow: 0 0 #0000;
}

.shadow-md {
  --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06) !important;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important;
}

*, ::before, ::after {
  --tw-ring-inset: var(--tw-empty,/*!*/ /*!*/);
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgba(59, 130, 246, 0.5);
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
}

/* Allgemein */

.br::after {
  content: "\a";
  white-space: pre;
}

.anchor {
  scroll-margin-top: 60px;
}

/* Header */

#header {
  top: 0px;
  margin-top: 0px;
  width: 100%;
  --tw-bg-opacity: 1;
  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
  z-index: 300;
}

#headergrid {
  margin-left: 0.75rem;
  margin-right: 0.75rem;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}

@media (min-width: 1536px) {
  #headergrid {
    width: 100%;
  }

  @media (min-width: 640px) {
    #headergrid {
      max-width: 640px;
    }
  }

  @media (min-width: 768px) {
    #headergrid {
      max-width: 768px;
    }
  }

  @media (min-width: 1024px) {
    #headergrid {
      max-width: 1024px;
    }
  }

  @media (min-width: 1280px) {
    #headergrid {
      max-width: 1280px;
    }
  }

  @media (min-width: 1536px) {
    #headergrid {
      max-width: 1536px;
    }
  }

  #headergrid {
    margin-left: auto;
    margin-right: auto;
  }
}

#siteinfo {
  position: relative;
  grid-column: span 2 / span 2;
  display: flex;
  flex-wrap: wrap;
  align-content: center;
  justify-content: center;
}

@media (min-width: 768px) {
  #siteinfo {
    grid-column: span 4 / span 4;
  }
}

@media (min-width: 1280px) {
  #siteinfo {
    grid-column: span 5 / span 5;
  }
}

#siteinfo #burger {
  position: absolute;
  top: 1px;
  left: 0px;
  cursor: pointer;
}

#siteinfo #burger svg {
  margin-top: 0.5rem;
  height: 1.5rem;
  width: 1.5rem;
  --tw-text-opacity: 1;
  color: rgba(156, 15, 22, var(--tw-text-opacity));
}

#siteinfo .mm {
  position: absolute;
  top: 0.5rem;
  left: 2rem;
  margin-top: 1px;
  display: block;
  padding-top: 1px;
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 700;
  text-transform: uppercase;
  --tw-text-opacity: 1;
  color: rgba(156, 15, 22, var(--tw-text-opacity));
}

@media screen and (min-width: 952px) {
  #siteinfo .mm {
    display: none;
  }
}

@media screen and (max-width: 369.98px) {
  #siteinfo .mm {
    display: none;
  }
}

#siteinfo #beads.claim {
  overflow: hidden;
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
  font-weight: 100;
  line-height: 1.25rem;
  letter-spacing: 0.025em;
}

@media (min-width: 1280px) {
  #siteinfo #beads.claim {
    height: auto;
  }
}

#siteinfo #beads.claim {
  --tw-text-opacity: 1;
  color: rgba(136, 136, 136, var(--tw-text-opacity));
}

#sitelogo {
  grid-column: span 8 / span 8;
  flex-direction: row;
}

@media (min-width: 640px) {
  #sitelogo {
    margin-top: 0px;
  }
}

@media (min-width: 768px) {
  #sitelogo {
    grid-column: span 4 / span 4;
  }
}

@media (min-width: 1280px) {
  #sitelogo {
    grid-column: span 2 / span 2;
  }
}

#sitelogo #bildlogo {
  margin-left: auto;
  margin-right: auto;
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
}

#sitelogo #textlogo {
  margin-left: auto;
  margin-right: auto;
}

@media (min-width: 640px) {
  #sitelogo #textlogo {
    height: 1.75rem;
  }
}

@media screen and (max-width: 639.98px) and (min-width: 300px) {
  #sitelogo #textlogo {
    height: 30px;
  }
}

@media screen and (max-width: 299.98px) and (min-width: 216px) {
  #sitelogo #textlogo {
    height: 24px;
  }
}

@media screen and (max-width: 299.98px) {
  #sitelogo #textlogo {
    margin-top: 5px;
  }
}

#sitesearch {
  grid-column: span 2 / span 2;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
}

@media (min-width: 768px) {
  #sitesearch {
    grid-column: span 4 / span 4;
  }
}

@media (min-width: 1280px) {
  #sitesearch {
    grid-column: span 5 / span 5;
    align-content: center;
  }
}

#sitesearch { /* */
}

#sitesearch #searchform {
  margin-top: 0.25rem;
  display: flex;
  height: 2rem;
  width: auto;
  overflow: visible;
}

#sitesearch #searchform #searchinput {
  height: 100%;
  --tw-bg-opacity: 1;
  background-color: rgba(247, 247, 247, var(--tw-bg-opacity));
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
  font-weight: 300;
}

#sitesearch #searchform #searchbtn svg {
  margin-left: 0.5rem;
  height: 1.25rem;
  width: 1.25rem;
}

/* Nav */

#nav {
  grid-column: 1 / -1;
  border-top-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgba(221, 221, 221, var(--tw-border-opacity));
  --tw-bg-opacity: 1;
  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
}

#nav ul {
  justify-content: center;
}

@media (min-width: 768px) {
  #nav ul {
    display: flex;
    flex: 1 1 0%;
  }
}

@media (min-width: 1280px) {
  #nav ul {
    width: 100%;
  }

  @media (min-width: 640px) {
    #nav ul {
      max-width: 640px;
    }
  }

  @media (min-width: 768px) {
    #nav ul {
      max-width: 768px;
    }
  }

  @media (min-width: 1024px) {
    #nav ul {
      max-width: 1024px;
    }
  }

  @media (min-width: 1280px) {
    #nav ul {
      max-width: 1280px;
    }
  }

  @media (min-width: 1536px) {
    #nav ul {
      max-width: 1536px;
    }
  }

  #nav ul {
    margin-left: auto;
    margin-right: auto;
    padding-left: 8rem;
    padding-right: 8rem;
  }
}

@media (min-width: 1536px) {
  #nav ul {
    padding-left: 12rem;
    padding-right: 12rem;
  }
}

#nav ul li {
  width: 100%;
  border-bottom-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgba(238, 238, 238, var(--tw-border-opacity));
  text-align: center;
}

@media (min-width: 768px) {
  #nav ul li {
    margin-top: 0.25rem;
    margin-bottom: 0.5rem;
    width: 16.666667%;
    border-bottom-width: 0px;
  }
}

@media (min-width: 1024px) {
  #nav ul li {
    margin-left: auto;
    margin-right: auto;
    width: auto;
  }
}

@media (min-width: 768px) {
  #nav ul li.meta {
    display: none;
  }
}

@media screen and (max-width: 951.98px) and (min-width: 768px) {
  #nav ul {
    justify-content: center;
  }

  @media (min-width: 768px) {
    #nav ul {
      flex-wrap: wrap;
    }
  }

  #nav ul li {
    margin-top: 0px;
    margin-bottom: 0px;
    width: 100%;
    border-bottom-width: 1px;
    --tw-border-opacity: 1;
    border-color: rgba(238, 238, 238, var(--tw-border-opacity));
    text-align: center;
  }

  #nav ul li.meta {
    display: inline-block;
  }
}

#nav ul li a {
  display: inline-block;
  border-bottom-width: 2px;
  --tw-border-opacity: 1;
  border-color: rgba(255, 255, 255, var(--tw-border-opacity));
  padding-left: 1rem;
  padding-right: 1rem;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  font-weight: 600;
}

@media (min-width: 1280px) {
  #nav ul li a {
    letter-spacing: 0.025em;
  }
}

#nav ul li.glaube a {
  --tw-text-opacity: 1;
  color: rgba(156, 15, 22, var(--tw-text-opacity));
}

#nav ul li.ueberuns a {
  font-weight: 300;
  --tw-text-opacity: 1;
  color: rgba(156, 15, 22, var(--tw-text-opacity));
}

#nav ul li.ueberuns a .uns {
  display: none;
}

@media (min-width: 768px) {
  #nav ul li.ueberuns a .uns {
    display: inline;
  }
}

@media (min-width: 1024px) {
  #nav ul li.ueberuns a .uns {
    display: none;
  }
}

#nav ul li.ueberuns a .katholisch {
  display: inline;
}

@media (min-width: 768px) {
  #nav ul li.ueberuns a .katholisch {
    display: none;
  }
}

@media (min-width: 1024px) {
  #nav ul li.ueberuns a .katholisch {
    display: inline;
  }
}

#nav ul li.meta a {
  font-weight: 300;
}

@media (min-width: 768px) {
  #nav ul li a:hover, #nav ul li a:active, #nav ul li a.active {
    --tw-border-opacity: 1;
    border-color: rgba(156, 15, 22, var(--tw-border-opacity));
  }
}

/* Fortschrittsanzeige */

#progressbar {
  position: -webkit-sticky;
  position: sticky;
  top: 3.5rem;
  height: 0.25rem;
  width: 100%;
  --tw-bg-opacity: 1;
  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
  z-index: 200;
}

#progressbar #progress {
  height: 0.25rem;
  width: 100%;
  --tw-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
  background: linear-gradient(to right, #dddddd var(--scroll), transparent 0);
  --scroll: 0%;
}

/* Page-Body */

#main {
  margin-top: 0px;
}

@media screen and (max-width: 951.98px) {
  #main {
    margin-top: 0px;
    padding-top: 0px;
  }
}

#main.rubrik, #main.dossier, #main.thema, #main.themenhub, #main.dossiershub, #main.contenthub, #main.artikel, #main.heilige, #main.heiligenportrait, #main.termine, #main.suchergebnisse {
  --tw-bg-opacity: 1;
  background-color: rgba(238, 238, 238, var(--tw-bg-opacity));
  --tw-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, 0.06);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

#main.videoshub, #main.videoserie, #main.video {
  --tw-bg-opacity: 1;
  background-color: rgba(52, 52, 52, var(--tw-bg-opacity));
  --tw-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, 0.06);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

#main.stundenbuch {
  --tw-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, 0.06);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

#main.podcasts, #main.podcast-show, #main.podcast-episode, #main.bibel, #main.lexikon, #main.lexikoneintrag {
  --tw-bg-opacity: 1;
  background-color: rgba(221, 221, 221, var(--tw-bg-opacity));
  --tw-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, 0.06);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

#main.themenhub, #main.dossiershub, #main.videoshub, #main.podcasts, #main.suchergebnisse {
  padding-top: 0px;
}

@media (min-width: 1536px) {
  #main.themenhub, #main.dossiershub, #main.videoshub, #main.podcasts, #main.suchergebnisse {
    padding-top: 1.25rem;
  }
}

#main.bibel {
  padding-top: 1.25rem;
}

#main.contenthub {
  padding-top: 1.25rem;
  padding-bottom: 1.25rem;
}

/* Page Header */

#main.rubrik header {
  margin-bottom: 0px;
  display: flex;
  align-items: center;
  background-image: linear-gradient(to right, var(--tw-gradient-stops));
  --tw-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, 0.06);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

@media (min-width: 768px) {
  #main.rubrik header {
    margin-bottom: 0.25rem;
  }
}

@media (min-width: 1024px) {
  #main.rubrik header {
    margin-bottom: 0.5rem;
  }
}

@media (min-width: 1280px) {
  #main.rubrik header {
    margin-bottom: 0.75rem;
  }
}

#main.rubrik header {
  --tw-gradient-from: #cdcdcd;
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(205, 205, 205, 0));
  --tw-gradient-to: #eeeeee;
}

@media (min-width: 1024px) {
  #main.rubrik header {
    --tw-gradient-from: #888888;
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(136, 136, 136, 0));
    --tw-gradient-to: #dddddd;
  }
}

#main.videoserie header {
  --tw-gradient-from: #000;
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(0, 0, 0, 0));
  --tw-gradient-to: #616161;
}

#main.rubrik header img.aufmacher {
  display: none;
  width: 0px;
  border-right-width: 2px;
  --tw-border-opacity: 1;
  border-color: rgba(156, 15, 22, var(--tw-border-opacity));
}

@media (min-width: 768px) {
  #main.rubrik header img.aufmacher {
    display: block;
    width: 50%;
  }
}

@media (min-width: 1024px) {
  #main.rubrik header img.aufmacher {
    border-style: none;
  }
}

#main.videoserie header.aufmacher img {
  display: none;
  width: 0px;
}

@media (min-width: 768px) {
  #main.videoserie header.aufmacher img {
    display: block;
    width: 40%;
  }
}

#main.rubrik header article {
  margin-bottom: 0px;
  margin-left: 0px;
  display: flex;
  width: 100%;
  align-items: center;
  border-left-width: 2px;
  --tw-border-opacity: 1;
  border-color: rgba(156, 15, 22, var(--tw-border-opacity));
  background-image: none;
  font-size: 1rem;
  line-height: 1.5rem;
  --tw-shadow: 0 0 #0000;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

@media (min-width: 768px) {
  #main.rubrik header article {
    width: 50%;
    border-left-width: 0px;
  }
}

@media (min-width: 1024px) {
  #main.rubrik header article {
    margin-left: -1.75rem;
    border-top-width: 2px;
    --tw-border-opacity: 1;
    border-color: rgba(156, 15, 22, var(--tw-border-opacity));
    --tw-bg-opacity: 1;
    background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
    --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
  }
}

@media (min-width: 1280px) {
  #main.rubrik header article {
    margin-bottom: -3.5rem;
    width: 40%;
  }
}

@media (min-width: 1536px) {
  #main.rubrik header article {
    width: 33.333333%;
  }
}

#main.dossier header.aufmacher, #main.videoserie header.aufmacher {
  position: relative;
  margin-top: 0px;
  margin-bottom: 0px;
  display: flex;
  align-items: center;
}

@media (min-width: 768px) {
  #main.dossier header.aufmacher, #main.videoserie header.aufmacher {
    margin-bottom: 0.25rem;
  }
}

@media (min-width: 1024px) {
  #main.dossier header.aufmacher, #main.videoserie header.aufmacher {
    margin-bottom: 0.5rem;
  }
}

@media (min-width: 1280px) {
  #main.dossier header.aufmacher, #main.videoserie header.aufmacher {
    margin-bottom: 0.75rem;
  }
}

#main.dossier header.aufmacher {
  justify-content: center;
  --tw-bg-opacity: 1;
  background-color: rgba(221, 221, 221, var(--tw-bg-opacity));
  background-size: cover;
  background-attachment: scroll;
  background-position: center;
  background-repeat: no-repeat;
}

@media (min-width: 1536px) {
  #main.dossier header.aufmacher {
    background-attachment: fixed;
  }
}

#main.dossier header article, #main.videoserie header article {
  display: flex;
  width: 100%;
  flex-direction: column;
  font-size: 1rem;
  line-height: 1.5rem;
  --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

@media (min-width: 768px) {
  #main.dossier header article, #main.videoserie header article {
    width: 50%;
  }
}

@media (min-width: 1280px) {
  #main.dossier header article, #main.videoserie header article {
    width: 40%;
  }
}

@media (min-width: 1536px) {
  #main.dossier header article, #main.videoserie header article {
    width: 33.333333%;
  }
}

#main.dossier header article {
  margin-left: 0.75rem;
  margin-right: 0.75rem;
  margin-top: 2.5rem;
  margin-bottom: 0.75rem;
  --tw-bg-opacity: 1;
  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
}

@media (min-width: 640px) {
  #main.dossier header article {
    margin-left: 0px;
    margin-right: 0px;
    margin-top: 10rem;
    margin-bottom: 2.5rem;
  }
}

@media (min-width: 1024px) {
  #main.dossier header article {
    margin-top: 15rem;
    margin-bottom: 5rem;
  }
}

@media (min-width: 1536px) {
  #main.dossier header article {
    margin-top: 18rem;
    margin-bottom: 8rem;
  }
}

#main.videoserie header article {
  margin-bottom: 0px;
  margin-left: 0px;
  --tw-bg-opacity: 1;
  background-color: rgba(38, 38, 38, var(--tw-bg-opacity));
}

@media (min-width: 1024px) {
  #main.videoserie header article {
    margin-left: -1.75rem;
  }
}

@media (min-width: 1280px) {
  #main.videoserie header article {
    margin-bottom: -3.5rem;
  }
}

#main.themenhub header.aufmacher, #main.dossiershub header.aufmacher, #main.videoshub header.aufmacher, #main.podcasts header.aufmacher, #main.suchergebnisse header.aufmacher {
  margin-bottom: 1.25rem;
  background-image: linear-gradient(to right, var(--tw-gradient-stops));
  padding: 1.25rem;
  --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

@media (min-width: 1536px) {
  #main.themenhub header.aufmacher, #main.dossiershub header.aufmacher, #main.videoshub header.aufmacher, #main.podcasts header.aufmacher, #main.suchergebnisse header.aufmacher {
    width: 100%;
  }

  @media (min-width: 640px) {
    #main.themenhub header.aufmacher, #main.dossiershub header.aufmacher, #main.videoshub header.aufmacher, #main.podcasts header.aufmacher, #main.suchergebnisse header.aufmacher {
      max-width: 640px;
    }
  }

  @media (min-width: 768px) {
    #main.themenhub header.aufmacher, #main.dossiershub header.aufmacher, #main.videoshub header.aufmacher, #main.podcasts header.aufmacher, #main.suchergebnisse header.aufmacher {
      max-width: 768px;
    }
  }

  @media (min-width: 1024px) {
    #main.themenhub header.aufmacher, #main.dossiershub header.aufmacher, #main.videoshub header.aufmacher, #main.podcasts header.aufmacher, #main.suchergebnisse header.aufmacher {
      max-width: 1024px;
    }
  }

  @media (min-width: 1280px) {
    #main.themenhub header.aufmacher, #main.dossiershub header.aufmacher, #main.videoshub header.aufmacher, #main.podcasts header.aufmacher, #main.suchergebnisse header.aufmacher {
      max-width: 1280px;
    }
  }

  @media (min-width: 1536px) {
    #main.themenhub header.aufmacher, #main.dossiershub header.aufmacher, #main.videoshub header.aufmacher, #main.podcasts header.aufmacher, #main.suchergebnisse header.aufmacher {
      max-width: 1536px;
    }
  }

  #main.themenhub header.aufmacher, #main.dossiershub header.aufmacher, #main.videoshub header.aufmacher, #main.podcasts header.aufmacher, #main.suchergebnisse header.aufmacher {
    margin-left: auto;
    margin-right: auto;
  }
}

#main.bibel header.widget {
  margin-bottom: 1.75rem;
  --tw-bg-opacity: 1;
  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
  padding: 1.25rem;
  --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

@media (min-width: 1024px) {
  #main.bibel header.widget {
    margin-bottom: 0.5rem;
  }
}

@media (min-width: 1536px) {
  #main.bibel header.widget {
    width: 100%;
  }

  @media (min-width: 640px) {
    #main.bibel header.widget {
      max-width: 640px;
    }
  }

  @media (min-width: 768px) {
    #main.bibel header.widget {
      max-width: 768px;
    }
  }

  @media (min-width: 1024px) {
    #main.bibel header.widget {
      max-width: 1024px;
    }
  }

  @media (min-width: 1280px) {
    #main.bibel header.widget {
      max-width: 1280px;
    }
  }

  @media (min-width: 1536px) {
    #main.bibel header.widget {
      max-width: 1536px;
    }
  }

  #main.bibel header.widget {
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 2.25rem;
  }
}

#main.podcast-show header.aufmacher article.aufmacher {
  z-index: 10;
  grid-column: span 12 / span 12;
  display: flex;
  flex-wrap: wrap;
  background-image: linear-gradient(to right, var(--tw-gradient-stops));
  --tw-gradient-from: #343434;
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(52, 52, 52, 0));
  --tw-gradient-to: #616161;
  padding: 0.75rem;
  --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

@media (min-width: 640px) {
  #main.podcast-show header.aufmacher article.aufmacher {
    flex-wrap: nowrap;
  }
}

@media (min-width: 1280px) {
  #main.podcast-show header.aufmacher article.aufmacher {
    grid-column: span 6 / span 6;
  }
}

#main.podcast-show header.aufmacher article.aufmacher img {
  width: 66.666667%;
  border-width: 2px;
  --tw-border-opacity: 1;
  border-color: rgba(255, 255, 255, var(--tw-border-opacity));
  --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

@media (min-width: 640px) {
  #main.podcast-show header.aufmacher article.aufmacher img {
    width: 40%;
  }
}

@media screen and (max-width: 439.98px) {
  #main.podcast-show header.aufmacher article.aufmacher img {
    width: 100%;
  }
}

#main.podcast-show header.aufmacher article.aufmacher .cardbody {
  width: 100%;
  padding-left: 0px;
  padding-right: 0px;
  padding-bottom: 0.75rem;
  font-size: 1.125rem;
  line-height: 1.75rem;
  font-weight: 500;
  line-height: 1.375;
  --tw-text-opacity: 1;
  color: rgba(255, 255, 255, var(--tw-text-opacity));
}

@media (min-width: 640px) {
  #main.podcast-show header.aufmacher article.aufmacher .cardbody {
    width: 60%;
    padding-left: 1.25rem;
    padding-right: 1.25rem;
  }
}

#main.podcast-show header.aufmacher article.aufmacher .cardbody h1 {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  font-size: 2.25rem;
  line-height: 2.5rem;
  font-weight: 600;
  line-height: 1.25;
}

@media (min-width: 640px) {
  #main.podcast-show header.aufmacher article.aufmacher .cardbody h1 {
    padding-top: 0px;
  }
}

#main.podcast-show header.aufmacher #aktuellste-episode {
  grid-column: span 12 / span 12;
  margin-bottom: 0px;
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
}

@media (min-width: 1280px) {
  #main.podcast-show header.aufmacher #aktuellste-episode {
    grid-column: span 6 / span 6;
  }
}

#main.podcast-show header.aufmacher #aktuellste-episode .card {
  margin-bottom: 0px;
}

#main.podcast-show header.aufmacher #aktuellste-episode .card.news a.cardurl {
  height: 100%;
}

#main.podcast-show header.aufmacher #aktuellste-episode .card.news footer {
  margin-right: 0px;
  border-top-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgba(221, 221, 221, var(--tw-border-opacity));
  --tw-bg-opacity: 1;
  background-color: rgba(247, 247, 247, var(--tw-bg-opacity));
}

#main.podcast-show header.aufmacher #aktuellste-episode .card.news footer:hover {
  --tw-bg-opacity: 1;
  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
}

#main.podcast-show header.aufmacher #aktuellste-episode .card.news footer {
  padding: 0.5rem;
  --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

@media (min-width: 1280px) {
  #main.podcast-show header.aufmacher #aktuellste-episode .card.news footer {
    margin-right: 1.25rem;
  }
}

#main.themenhub header.aufmacher {
  --tw-gradient-from: #9c0f16;
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(156, 15, 22, 0));
  --tw-gradient-to: #eeeeee;
}

#main.dossiershub header.aufmacher {
  --tw-gradient-from: #262626;
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(38, 38, 38, 0));
  --tw-gradient-to: #9c0f16;
}

#main.videoshub header.aufmacher {
  --tw-gradient-from: #000;
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(0, 0, 0, 0));
  --tw-gradient-to: #262626;
}

#main.podcasts header.aufmacher {
  --tw-gradient-from: #343434;
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(52, 52, 52, 0));
  --tw-gradient-to: #616161;
}

#main.suchergebnisse header.aufmacher {
  border-left-width: 2px;
  --tw-border-opacity: 1;
  border-color: rgba(156, 15, 22, var(--tw-border-opacity));
  --tw-gradient-from: #fff;
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(255, 255, 255, 0));
  --tw-gradient-to: #cdcdcd;
}

#main.suchergebnisse header.aufmacher article {
  display: flex;
}

#main.themenhub header.aufmacher article, #main.dossiershub header.aufmacher article, #main.videoshub header.aufmacher article, #main.podcasts header.aufmacher article {
  display: flex;
  width: 80%;
  align-items: center;
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 300;
  --tw-text-opacity: 1;
  color: rgba(255, 255, 255, var(--tw-text-opacity));
}

@media (min-width: 768px) {
  #main.themenhub header.aufmacher article, #main.dossiershub header.aufmacher article, #main.videoshub header.aufmacher article, #main.podcasts header.aufmacher article {
    width: 60%;
  }
}

@media (min-width: 1280px) {
  #main.themenhub header.aufmacher article, #main.dossiershub header.aufmacher article, #main.videoshub header.aufmacher article, #main.podcasts header.aufmacher article {
    width: 40%;
  }
}

#main.suchergebnisse header.aufmacher article .cardbody {
  display: none;
  width: 0px;
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 300;
}

@media (min-width: 768px) {
  #main.suchergebnisse header.aufmacher article .cardbody {
    display: block;
    width: 50%;
  }
}

@media (min-width: 1280px) {
  #main.suchergebnisse header.aufmacher article .cardbody {
    width: 41.666667%;
  }
}

@media (min-width: 1536px) {
  #main.suchergebnisse header.aufmacher article .cardbody {
    width: 33.333333%;
  }
}

#main.suchergebnisse header.aufmacher article form {
  margin-top: auto;
  margin-bottom: auto;
  width: 100%;
  padding-left: 1.25rem;
  padding-right: 1.25rem;
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}

@media (min-width: 768px) {
  #main.suchergebnisse header.aufmacher article form {
    width: 50%;
  }
}

@media (min-width: 1280px) {
  #main.suchergebnisse header.aufmacher article form {
    width: 58.333333%;
  }
}

@media (min-width: 1536px) {
  #main.suchergebnisse header.aufmacher article form {
    width: 50%;
  }
}

#main.suchergebnisse header.aufmacher article form label {
  font-size: 1.25rem;
  line-height: 1.75rem;
  font-weight: 600;
  --tw-text-opacity: 1;
  color: rgba(156, 15, 22, var(--tw-text-opacity));
}

#main.suchergebnisse header.aufmacher article form div {
  margin-top: 0.75rem;
  margin-bottom: 0.75rem;
  display: flex;
  width: 100%;
  flex-wrap: wrap;
}

#main.suchergebnisse header.aufmacher article form div input {
  height: 2.25rem;
  width: 100%;
  border-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgba(221, 221, 221, var(--tw-border-opacity));
  padding-right: 2rem;
  padding-left: 0.5rem;
}

#main.suchergebnisse header.aufmacher article form div button {
  margin-top: auto;
  margin-bottom: auto;
  margin-left: -1.75rem;
  width: 1.25rem;
}

#main.suchergebnisse header.aufmacher article form div button svg {
  height: 1.25rem;
  width: 1.25rem;
}

/* Sections */

section {
  margin-left: 0px;
  margin-right: 0px;
  row-gap: 0px;
}

@media (min-width: 640px) {
  section {
    margin-left: 0.5rem;
    margin-right: 0.5rem;
    -moz-column-gap: 0.5rem;
         column-gap: 0.5rem;
  }
}

@media (min-width: 1024px) {
  section {
    margin-left: 0.75rem;
    margin-right: 0.75rem;
    -moz-column-gap: 0.25rem;
         column-gap: 0.25rem;
  }
}

@media (min-width: 1280px) {
  section {
    -moz-column-gap: 0.5rem;
         column-gap: 0.5rem;
  }
}

@media (min-width: 1536px) {
  section {
    margin-left: 0px;
    margin-right: 0px;
    -moz-column-gap: 1rem;
         column-gap: 1rem;
  }
}

section header, section footer {
  grid-column: 1 / -1;
  text-align: center;
}

section header h2 {
  margin-top: 0.25rem;
  margin-bottom: 1.75rem;
  font-size: 1.25rem;
  line-height: 1.75rem;
  font-weight: 300;
  --tw-text-opacity: 1;
  color: rgba(38, 38, 38, var(--tw-text-opacity));
}

section footer button, #footer section #netzwerk footer button {
  margin-top: 0.75rem;
  margin-bottom: 2.5rem;
  --tw-bg-opacity: 1;
  background-color: rgba(38, 38, 38, var(--tw-bg-opacity));
  padding: 1.25rem;
  font-weight: 600;
  text-transform: uppercase;
  --tw-text-opacity: 1;
  color: rgba(255, 255, 255, var(--tw-text-opacity));
}

#top {
  position: relative;
  margin-left: 0px;
  margin-right: 0px;
  margin-bottom: 1.75rem;
  display: grid;
  row-gap: 0px;
  padding-bottom: 2.5rem;
}

@media (min-width: 640px) {
  #top {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    -moz-column-gap: 0.75rem;
         column-gap: 0.75rem;
    padding-bottom: 5rem;
  }
}

@media (min-width: 1024px) {
  #top {
    margin-left: 0.75rem;
    margin-right: 0.75rem;
    margin-bottom: 0px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    -moz-column-gap: 0.25rem;
         column-gap: 0.25rem;
    padding-bottom: 0px;
  }
}

@media (min-width: 1280px) {
  #top {
    -moz-column-gap: 0.5rem;
         column-gap: 0.5rem;
  }
}

@media (min-width: 1536px) {
  #top {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    -moz-column-gap: 1rem;
         column-gap: 1rem;
  }
}

@media (min-width: 1536px) {
  #top, #news, #hintergrund, #glaube, #video, #themen, #rubrik, #dossier, #themenhub, #dossiershub, #videoshub, #videoserie, #podcasts, #podcast-show, #main.podcast-show header.aufmacher, #lexikon, #termine, .termineheader, #suchergebnisse, #footer section {
    width: 100%;
  }

  @media (min-width: 640px) {
    #top, #news, #hintergrund, #glaube, #video, #themen, #rubrik, #dossier, #themenhub, #dossiershub, #videoshub, #videoserie, #podcasts, #podcast-show, #main.podcast-show header.aufmacher, #lexikon, #termine, .termineheader, #suchergebnisse, #footer section {
      max-width: 640px;
    }
  }

  @media (min-width: 768px) {
    #top, #news, #hintergrund, #glaube, #video, #themen, #rubrik, #dossier, #themenhub, #dossiershub, #videoshub, #videoserie, #podcasts, #podcast-show, #main.podcast-show header.aufmacher, #lexikon, #termine, .termineheader, #suchergebnisse, #footer section {
      max-width: 768px;
    }
  }

  @media (min-width: 1024px) {
    #top, #news, #hintergrund, #glaube, #video, #themen, #rubrik, #dossier, #themenhub, #dossiershub, #videoshub, #videoserie, #podcasts, #podcast-show, #main.podcast-show header.aufmacher, #lexikon, #termine, .termineheader, #suchergebnisse, #footer section {
      max-width: 1024px;
    }
  }

  @media (min-width: 1280px) {
    #top, #news, #hintergrund, #glaube, #video, #themen, #rubrik, #dossier, #themenhub, #dossiershub, #videoshub, #videoserie, #podcasts, #podcast-show, #main.podcast-show header.aufmacher, #lexikon, #termine, .termineheader, #suchergebnisse, #footer section {
      max-width: 1280px;
    }
  }

  @media (min-width: 1536px) {
    #top, #news, #hintergrund, #glaube, #video, #themen, #rubrik, #dossier, #themenhub, #dossiershub, #videoshub, #videoserie, #podcasts, #podcast-show, #main.podcast-show header.aufmacher, #lexikon, #termine, .termineheader, #suchergebnisse, #footer section {
      max-width: 1536px;
    }
  }

  #top, #news, #hintergrund, #glaube, #video, #themen, #rubrik, #dossier, #themenhub, #dossiershub, #videoshub, #videoserie, #podcasts, #podcast-show, #main.podcast-show header.aufmacher, #lexikon, #termine, .termineheader, #suchergebnisse, #footer section {
    margin-left: auto;
    margin-right: auto;
  }
}

#top .top1 {
  order: 1;
  grid-column: span 1 / span 1;
}

@media (min-width: 640px) {
  #top .top1 {
    grid-column: span 2 / span 2;
  }
}

@media (min-width: 1024px) {
  #top .top1 {
    order: 2;
  }
}

@media (min-width: 1536px) {
  #top .top1 {
    grid-column: span 3 / span 3;
  }
}

#top .top23 {
  order: 2;
  grid-column: span 1 / span 1;
  margin-left: 0px;
  margin-right: 0px;
  display: block;
  -moz-column-gap: 0px;
       column-gap: 0px;
  row-gap: 0px;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}

@media (min-width: 640px) {
  #top .top23 {
    grid-column: span 2 / span 2;
    margin-left: 0.5rem;
    margin-right: 0.5rem;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    -moz-column-gap: 0.5rem;
         column-gap: 0.5rem;
    padding-left: 0px;
    padding-right: 0px;
  }
}

@media (min-width: 1024px) {
  #top .top23 {
    order: 1;
    grid-column: span 1 / span 1;
    margin-left: 0px;
    display: block;
    -moz-column-gap: 0px;
         column-gap: 0px;
  }
}

#top aside {
  order: 3;
  grid-column: span 1 / span 1;
  margin-right: 0px;
  display: block;
  -moz-column-gap: 0px;
       column-gap: 0px;
  row-gap: 0px;
  --tw-bg-opacity: 1;
  background-color: rgba(238, 238, 238, var(--tw-bg-opacity));
  padding-left: 1.25rem;
  padding-right: 1.25rem;
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}

@media (min-width: 640px) {
  #top aside {
    grid-column: span 2 / span 2;
    margin-left: 0.5rem;
    margin-right: 0.5rem;
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    padding-left: 0px;
    padding-right: 0px;
  }
}

@media (min-width: 768px) {
  #top aside {
    -moz-column-gap: 0.75rem;
         column-gap: 0.75rem;
  }
}

@media (min-width: 1024px) {
  #top aside {
    grid-column: span 1 / span 1;
    margin-right: 0px;
    display: block;
    -moz-column-gap: 0px;
         column-gap: 0px;
    --tw-bg-opacity: 1;
    background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
    padding-top: 0px;
    padding-bottom: 0px;
  }
}

#top aside > .card, #top aside > h2 {
  grid-column: span 1 / span 1;
  grid-column-start: 1;
}

@media (min-width: 640px) {
  #top aside > .card, #top aside > h2 {
    grid-column: span 3 / span 3;
    grid-column-start: 2;
  }
}

@media (min-width: 1024px) {
  #top aside > .card, #top aside > h2 {
    grid-column: span 1 / span 1;
    grid-column-start: 1;
  }
}

#top aside h2 {
  padding-top: 1.25rem;
  padding-bottom: 1.25rem;
  text-align: center;
  font-size: 1.25rem;
  line-height: 1.75rem;
  font-weight: 600;
  --tw-text-opacity: 1;
  color: rgba(156, 15, 22, var(--tw-text-opacity));
}

@media (min-width: 640px) {
  #top aside h2 {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
  }
}

@media (min-width: 1024px) {
  #top aside h2 {
    text-align: left;
    font-size: 1.5rem;
    line-height: 2rem;
    --tw-text-opacity: 1;
    color: rgba(38, 38, 38, var(--tw-text-opacity));
  }
}

#top aside .card.events {
  margin-bottom: 5rem;
}

@media (min-width: 640px) {
  #top aside .card.events {
    margin-bottom: 1.75rem;
  }
}

@media (min-width: 1024px) {
  #top aside .card.events {
    margin-bottom: 0.5rem;
  }
}

#allestandbunkte {
  display: block;
}

@media (min-width: 1024px) {
  #allestandbunkte {
    display: none;
  }
}

#allestandbunkte button {
  margin-bottom: 1.25rem;
}

#news, #rubrik, #dossier, #lexikon, #suchergebnisse {
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}

@media (min-width: 640px) {
  #news, #rubrik, #dossier, #lexikon, #suchergebnisse {
    padding-left: 0px;
    padding-right: 0px;
  }
}

@media (min-width: 768px) {
  #news, #rubrik, #dossier, #lexikon, #suchergebnisse {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (min-width: 1024px) {
  #news, #rubrik, #dossier, #lexikon, #suchergebnisse {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
}

#thema {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  padding-top: 0.75rem;
}

@media (min-width: 640px) {
  #thema {
    padding-left: 0px;
    padding-right: 0px;
  }
}

@media (min-width: 1024px) {
  #thema {
    grid-template-columns: repeat(10, minmax(0, 1fr));
  }
}

.termineheader {
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  gap: 0.75rem;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  padding-top: 1.25rem;
  padding-bottom: 1.25rem;
}

@media (min-width: 640px) {
  .termineheader {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding-left: 0px;
    padding-right: 0px;
  }
}

@media (min-width: 1024px) {
  .termineheader {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (min-width: 1280px) {
  .termineheader {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 1.25rem;
  }
}

.termineheader h2 {
  margin-top: -0.25rem;
  padding-bottom: 0.5rem;
  font-size: 1.5rem;
  line-height: 2rem;
  font-weight: 300;
  line-height: 1.75rem;
  --tw-text-opacity: 1;
  color: rgba(72, 72, 72, var(--tw-text-opacity));
}

#termine {
  position: relative;
  margin-top: 3.5rem;
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  --tw-bg-opacity: 1;
  background-color: rgba(247, 247, 247, var(--tw-bg-opacity));
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

@media (min-width: 640px) {
  #termine {
    padding-left: 0px;
    padding-right: 0px;
  }
}

@media (min-width: 768px) {
  #termine {
    padding-left: 12rem;
    padding-right: 12rem;
  }
}

@media (min-width: 1024px) {
  #termine {
    margin-top: 1.75rem;
  }
}

@media (min-width: 1280px) {
  #termine {
    margin-top: 0.5rem;
    grid-template-columns: repeat(10, minmax(0, 1fr));
    padding-left: 0px;
    padding-right: 0px;
  }
}

#termine ul.veranstaltungsreiter {
  position: absolute;
  top: -2.5rem;
  left: 0px;
  z-index: 0;
  display: flex;
  font-size: 1rem;
  line-height: 1.5rem;
}

#termine ul.veranstaltungsreiter li.active {
  margin-right: 1px;
  border-top-left-radius: 0.5rem;
  border-top-right-radius: 0.5rem;
  --tw-bg-opacity: 1;
  background-color: rgba(247, 247, 247, var(--tw-bg-opacity));
  padding-left: 1.5rem;
  padding-right: 1.5rem;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  --tw-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

#termine ul.veranstaltungsreiter li {
  margin-right: 1px;
  border-top-left-radius: 0.5rem;
  border-top-right-radius: 0.5rem;
  --tw-bg-opacity: 1;
  background-color: rgba(72, 72, 72, var(--tw-bg-opacity));
  --tw-bg-opacity: 0.1;
  padding-left: 1.5rem;
  padding-right: 1.5rem;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  --tw-text-opacity: 1;
  color: rgba(136, 136, 136, var(--tw-text-opacity));
  --tw-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, 0.06);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

#termine ul.veranstaltungsreiter li svg {
  margin-top: -0.25rem;
  display: inline;
  height: 1.25rem;
  width: 1.25rem;
}

@media screen and (max-width: 529.98px) {
  #termine ul.veranstaltungsreiter li.active {
    width: 4rem;
    --tw-shadow: 0 0 #0000;
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
  }

  #termine ul.veranstaltungsreiter li {
    width: 4rem;
    color: transparent;
  }

  #termine ul.veranstaltungsreiter li svg {
    --tw-text-opacity: 1;
    color: rgba(136, 136, 136, var(--tw-text-opacity));
  }
}

#termine ul.veranstaltungsreiter a.prev svg {
  margin-top: 0.5rem;
  margin-left: 0.5rem;
  height: 1.5rem;
  width: 1.5rem;
  --tw-text-opacity: 1;
  color: rgba(156, 15, 22, var(--tw-text-opacity));
}

#termine div.next {
  position: absolute;
  top: -2rem;
  right: 0px;
  z-index: 0;
  display: flex;
  font-size: 1rem;
  line-height: 1.5rem;
}

#termine div.next a svg {
  height: 1.5rem;
  width: 1.5rem;
  --tw-text-opacity: 1;
  color: rgba(156, 15, 22, var(--tw-text-opacity));
}

#termine .terminkalender {
  position: relative;
  z-index: 10;
  --tw-bg-opacity: 1;
  background-color: rgba(247, 247, 247, var(--tw-bg-opacity));
}

#termine .terminkalender h2 {
  margin-top: 1.75rem;
  padding-bottom: 0.5rem;
  font-size: 1.5rem;
  line-height: 2rem;
  font-weight: 300;
  line-height: 1.75rem;
  --tw-text-opacity: 1;
  color: rgba(72, 72, 72, var(--tw-text-opacity));
}

#termine .tag1, #termine .tag2, #termine .tag3, #termine .tag4, #termine .tag5 {
  grid-column: span 2 / span 2;
  display: flex;
  flex-direction: column;
  border-right-width: 0px;
  border-left-width: 0px;
  --tw-border-opacity: 1;
  border-color: rgba(221, 221, 221, var(--tw-border-opacity));
  padding-left: 1.25rem;
  padding-right: 1.25rem;
  padding-bottom: 1.75rem;
  font-size: 1rem;
  line-height: 1.5rem;
}

@media (min-width: 640px) {
  #termine .tag1, #termine .tag2, #termine .tag3, #termine .tag4, #termine .tag5 {
    border-right-width: 1px;
    border-left-width: 1px;
  }
}

@media (min-width: 1280px) {
  #termine .tag1, #termine .tag2, #termine .tag3, #termine .tag4, #termine .tag5 {
    border-left-width: 0px;
  }
}

#termine .tag2, #termine .tag4 {
  --tw-bg-opacity: 1;
  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
}

#videoserie {
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}

@media (min-width: 640px) {
  #videoserie {
    padding-left: 0px;
    padding-right: 0px;
  }
}

@media (min-width: 768px) {
  #videoserie {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

#themenhub, #dossiershub, #videoshub, #podcasts {
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}

@media (min-width: 640px) {
  #themenhub, #dossiershub, #videoshub, #podcasts {
    padding-left: 0px;
    padding-right: 0px;
  }
}

@media (min-width: 768px) {
  #themenhub, #dossiershub, #videoshub, #podcasts {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (min-width: 1024px) {
  #themenhub, #dossiershub, #videoshub, #podcasts {
    grid-template-columns: repeat(8, minmax(0, 1fr));
  }
}

#podcast-show, #main.podcast-show header.aufmacher {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  padding-top: 1.25rem;
}

@media (min-width: 640px) {
  #podcast-show, #main.podcast-show header.aufmacher {
    padding-left: 0px;
    padding-right: 0px;
  }
}

#podcasts {
  margin-top: -1.25rem;
}

@media (min-width: 1536px) {
  #podcasts {
    margin-top: -1rem;
  }
}

#hubtext {
  order: 2;
  grid-column: span 1 / span 1;
  margin-bottom: 1.75rem;
  padding-right: 0px;
}

@media (min-width: 768px) {
  #hubtext {
    order: 1;
    grid-column: span 2 / span 2;
    padding-right: 0.5rem;
  }
}

@media (min-width: 1280px) {
  #hubtext {
    padding-right: 0px;
  }
}

#hubtext h2 {
  padding-top: 0.5rem;
  padding-bottom: 0.25rem;
  font-size: 1.5rem;
  line-height: 2rem;
  font-weight: 600;
  line-height: 1.75rem;
}

#hubtext p {
  margin-top: 0.75rem;
  margin-bottom: 0.75rem;
}

#hubtext a {
  --tw-text-opacity: 1;
  color: rgba(156, 15, 22, var(--tw-text-opacity));
  text-decoration: underline;
}

@media (min-width: 1024px) {
  #themenhub #hubtext, #dossiershub #hubtext, #videoshub #hubtext, #podcasts #hubtext {
    grid-column: span 4 / span 4;
  }
}

@media (min-width: 1280px) {
  #themenhub #hubtext, #dossiershub #hubtext, #videoshub #hubtext, #podcasts #hubtext {
    grid-column: span 2 / span 2;
  }
}

#podcast-show #hubtext {
  order: 2;
  grid-column: span 12 / span 12;
  margin-top: -1.25rem;
}

@media (min-width: 1280px) {
  #podcast-show #hubtext {
    order: 1;
    grid-column: span 6 / span 6;
  }
}

#thema #hubtext {
  grid-column: span 12 / span 12;
  grid-column-start: 1;
  padding-left: 1.25rem;
  padding-right: 1.25rem;
}

@media (min-width: 768px) {
  #thema #hubtext {
    grid-column: span 5 / span 5;
  }
}

@media (min-width: 1024px) {
  #thema #hubtext {
    grid-column: span 4 / span 4;
  }
}

@media (min-width: 1536px) {
  #thema #hubtext {
    grid-column: span 3 / span 3;
    grid-column-start: 2;
  }
}

#videoshub #hubtext {
  --tw-text-opacity: 1;
  color: rgba(255, 255, 255, var(--tw-text-opacity));
}

#podcasts #hubtext {
  margin-top: 0px;
  --tw-bg-opacity: 1;
  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
  padding-top: 0.5rem;
  padding-right: 0.75rem;
  padding-left: 0.75rem;
}

@media (min-width: 768px) {
  #podcasts #hubtext {
    margin-left: -0.75rem;
    padding-left: 1rem;
  }
}

@media (min-width: 1024px) {
  #podcasts #hubtext {
    margin-left: -1rem;
  }
}

@media (min-width: 1536px) {
  #podcasts #hubtext {
    margin-top: -0.25rem;
    margin-left: 0px;
    padding-top: 1rem;
    padding-left: 0.75rem;
  }
}

#podcast-show #hubtext {
  --tw-bg-opacity: 1;
  background-color: rgba(238, 238, 238, var(--tw-bg-opacity));
  padding-top: 0.5rem;
  padding-right: 0.75rem;
  padding-left: 0.75rem;
}

@media (min-width: 768px) {
  #podcast-show #hubtext {
    padding-left: 1rem;
  }
}

@media (min-width: 1280px) {
  #podcast-show #hubtext {
    --tw-bg-opacity: 1;
    background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
  }
}

@media (min-width: 1536px) {
  #podcast-show #hubtext {
    padding-top: 1rem;
    padding-left: 0.75rem;
  }
}

#teaserlist {
  order: 1;
  grid-column: span 1 / span 1;
  margin-top: 0.75rem;
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  row-gap: 0px;
}

@media (min-width: 640px) {
  #teaserlist {
    -moz-column-gap: 0.5rem;
         column-gap: 0.5rem;
  }
}

@media (min-width: 768px) {
  #teaserlist {
    order: 2;
    grid-column: span 2 / span 2;
  }
}

@media (min-width: 1024px) {
  #teaserlist {
    grid-column: span 3 / span 3;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    -moz-column-gap: 0.25rem;
         column-gap: 0.25rem;
  }
}

@media (min-width: 1280px) {
  #teaserlist {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    -moz-column-gap: 0.5rem;
         column-gap: 0.5rem;
  }
}

@media (min-width: 1536px) {
  #teaserlist {
    -moz-column-gap: 1rem;
         column-gap: 1rem;
  }
}

#thema #teaserlist {
  grid-column: span 12 / span 12;
}

@media (min-width: 640px) {
  #thema #teaserlist {
    display: grid;
  }
}

@media (min-width: 768px) {
  #thema #teaserlist {
    grid-column: span 7 / span 7;
    display: block;
  }
}

@media (min-width: 1024px) {
  #thema #teaserlist {
    grid-column: span 6 / span 6;
  }
}

@media (min-width: 1536px) {
  #thema #teaserlist {
    grid-column: span 5 / span 5;
  }
}

@media (min-width: 1024px) {
  #themenhub #teaserlist, #dossiershub #teaserlist, #videoshub #teaserlist, #podcasts #teaserlist {
    grid-column: span 4 / span 4;
  }
}

@media (min-width: 1280px) {
  #themenhub #teaserlist, #dossiershub #teaserlist, #videoshub #teaserlist, #podcasts #teaserlist {
    grid-column: span 6 / span 6;
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

#podcast-show #teaserlist {
  order: 1;
  grid-column: span 12 / span 12;
  margin-top: -1px;
  grid-template-columns: repeat(1, minmax(0, 1fr));
}

@media (min-width: 1280px) {
  #podcast-show #teaserlist {
    order: 2;
    grid-column: span 6 / span 6;
  }
}

#lexikon #teaserlist {
  grid-column: span 1 / span 1;
  margin-top: 2.5rem;
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}

@media (min-width: 640px) {
  #lexikon #teaserlist {
    margin-top: 0px;
    padding-left: 0px;
    padding-right: 0px;
  }
}

@media (min-width: 768px) {
  #lexikon #teaserlist {
    grid-column: span 4 / span 4;
  }
}

@media (min-width: 1024px) {
  #lexikon #teaserlist {
    grid-column: span 5 / span 5;
    margin-top: 1.25rem;
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (min-width: 1280px) {
  #lexikon #teaserlist {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
}

#podcasts #teaserlist {
  padding-left: 2.5rem;
  padding-right: 2.5rem;
}

@media (min-width: 768px) {
  #podcasts #teaserlist {
    padding-left: 0px;
    padding-right: 0px;
  }
}

#hintergrund, #video {
  display: grid;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}

@media (min-width: 640px) {
  #hintergrund, #video {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding-left: 0px;
    padding-right: 0px;
  }
}

@media (min-width: 1024px) {
  #hintergrund, #video {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

#kampagne {
  margin-left: 0px;
  margin-right: 0px;
  margin-bottom: 2.5rem;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  row-gap: 0px;
  --tw-bg-opacity: 1;
  background-color: rgba(238, 238, 238, var(--tw-bg-opacity));
  padding-top: 2.5rem;
  padding-bottom: 0.75rem;
  --tw-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, 0.06);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

@media (min-width: 640px) {
  #kampagne {
    margin-left: 0px;
    margin-right: 0px;
    flex-wrap: nowrap;
    -moz-column-gap: 0.5rem;
         column-gap: 0.5rem;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
  }
}

@media (min-width: 1024px) {
  #kampagne {
    margin-left: 0px;
    margin-right: 0px;
    -moz-column-gap: 0.25rem;
         column-gap: 0.25rem;
    padding-left: 0.75rem;
    padding-right: 0.75rem;
  }
}

@media (min-width: 1280px) {
  #kampagne {
    -moz-column-gap: 0.5rem;
         column-gap: 0.5rem;
  }
}

@media (min-width: 1536px) {
  #kampagne {
    margin-left: 0px;
    margin-right: 0px;
    -moz-column-gap: 1rem;
         column-gap: 1rem;
    padding-left: 0px;
    padding-right: 0px;
  }
}

#kampagne .card {
  width: 80%;
}

@media (min-width: 640px) {
  #kampagne .card {
    width: 50%;
  }
}

@media (min-width: 1024px) {
  #kampagne .card {
    width: 40%;
  }
}

@media (min-width: 1536px) {
  #kampagne .card {
    width: 33.333333%;
  }
}

#footer section #kampagne {
  grid-column: span 12 / span 12;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  padding-left: 1rem;
  padding-right: 1rem;
  --tw-shadow: 0 0 #0000;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

@media (min-width: 768px) {
  #footer section #kampagne {
    grid-column: span 7 / span 7;
    padding-left: 0px;
    padding-right: 0px;
  }
}

@media (min-width: 1024px) {
  #footer section #kampagne {
    grid-column: span 8 / span 8;
    flex-wrap: nowrap;
  }
}

@media (min-width: 1536px) {
  #footer section #kampagne {
    padding-left: 5rem;
    padding-right: 5rem;
  }
}

#footer section #kampagne .card {
  width: 80%;
}

@media (min-width: 640px) {
  #footer section #kampagne .card {
    width: 50%;
  }
}

@media (min-width: 768px) {
  #footer section #kampagne .card {
    width: 66.666667%;
  }
}

@media (min-width: 1024px) {
  #footer section #kampagne .card {
    width: 40%;
  }
}

@media (min-width: 1536px) {
  #footer section #kampagne .card {
    width: 33.333333%;
  }
}

#glaube {
  display: grid;
  row-gap: 0px;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}

@media (min-width: 640px) {
  #glaube {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    -moz-column-gap: 0.75rem;
         column-gap: 0.75rem;
    padding-left: 0px;
    padding-right: 0px;
  }
}

@media (min-width: 768px) {
  #glaube {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (min-width: 1024px) {
  #glaube {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    -moz-column-gap: 0.25rem;
         column-gap: 0.25rem;
  }
}

@media (min-width: 1280px) {
  #glaube {
    -moz-column-gap: 0.5rem;
         column-gap: 0.5rem;
  }
}

@media (min-width: 1536px) {
  #glaube {
    -moz-column-gap: 1rem;
         column-gap: 1rem;
  }
}

#glaube #tagesliturgie {
  grid-column: 1 / -1;
  margin-left: -0.5rem;
  margin-right: -0.5rem;
  margin-bottom: 1.75rem;
  display: grid;
  row-gap: 0px;
  --tw-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, 0.06);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

@media (min-width: 640px) {
  #glaube #tagesliturgie {
    margin-left: 0px;
    margin-right: 0px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    -moz-column-gap: 0.75rem;
         column-gap: 0.75rem;
    padding-left: 0.75rem;
    padding-right: 0.75rem;
    padding-top: 0.75rem;
  }
}

@media (min-width: 1024px) {
  #glaube #tagesliturgie {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    -moz-column-gap: 0.25rem;
         column-gap: 0.25rem;
    padding-left: 0.25rem;
    padding-right: 0.25rem;
    padding-top: 0.25rem;
  }
}

@media (min-width: 1280px) {
  #glaube #tagesliturgie {
    -moz-column-gap: 0.5rem;
         column-gap: 0.5rem;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
    padding-top: 0.5rem;
  }
}

@media (min-width: 1536px) {
  #glaube #tagesliturgie {
    -moz-column-gap: 1rem;
         column-gap: 1rem;
    padding-left: 1rem;
    padding-right: 1rem;
    padding-top: 1rem;
  }
}

#glaube #tagesliturgie #stundenbuch {
  order: 2;
  grid-column: span 1 / span 1;
  margin-top: -0.5rem;
  display: flex;
  flex-wrap: wrap;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  padding-bottom: 0.5rem;
}

@media (min-width: 640px) {
  #glaube #tagesliturgie #stundenbuch {
    margin-top: 0px;
    padding-left: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
  }
}

@media (min-width: 1024px) {
  #glaube #tagesliturgie #stundenbuch {
    order: 1;
  }
}

@media (min-width: 1280px) {
  #glaube #tagesliturgie #stundenbuch {
    padding-bottom: 1.75rem;
  }
}

#glaube #tagesliturgie #tagesheilige {
  order: 3;
  grid-column: span 1 / span 1;
  margin-top: -0.5rem;
  display: flex;
  flex-wrap: wrap;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  padding-bottom: 0.5rem;
}

@media (min-width: 640px) {
  #glaube #tagesliturgie #tagesheilige {
    margin-top: 0px;
    padding-left: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
  }
}

@media (min-width: 1280px) {
  #glaube #tagesliturgie #tagesheilige {
    padding-bottom: 1.75rem;
  }
}

#glaube #bibel {
  order: 3;
}

@media (min-width: 768px) {
  #glaube #bibel {
    order: 2;
  }
}

#glaube #heilige {
  order: 4;
}

#themen {
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}

@media (min-width: 640px) {
  #themen {
    padding-left: 5rem;
    padding-right: 5rem;
  }
}

@media (min-width: 768px) {
  #themen {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    padding-left: 0px;
    padding-right: 0px;
  }
}

/* Artikel- und Detail-Aufmacher */

#artikel {
  padding-top: 0.75rem;
  font-size: 1.25rem;
  line-height: 1.75rem;
}

header.artikel.opener {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 1.25rem;
}

@media (min-width: 1536px) {
  header.artikel.opener {
    width: 100%;
  }

  @media (min-width: 640px) {
    header.artikel.opener {
      max-width: 640px;
    }
  }

  @media (min-width: 768px) {
    header.artikel.opener {
      max-width: 768px;
    }
  }

  @media (min-width: 1024px) {
    header.artikel.opener {
      max-width: 1024px;
    }
  }

  @media (min-width: 1280px) {
    header.artikel.opener {
      max-width: 1280px;
    }
  }

  @media (min-width: 1536px) {
    header.artikel.opener {
      max-width: 1536px;
    }
  }

  header.artikel.opener {
    margin-left: auto;
    margin-right: auto;
    grid-template-columns: repeat(9, minmax(0, 1fr));
  }
}

header.artikel.opener div, header.opener div {
  grid-column: span 12 / span 12;
  margin-top: 1.25rem;
  margin-left: 0px;
  border-left-width: 2px;
  --tw-border-opacity: 1;
  border-color: rgba(156, 15, 22, var(--tw-border-opacity));
  padding-left: 0.75rem;
  padding-right: 0.75rem;
  padding-top: 0px;
  padding-bottom: 0px;
}

@media (min-width: 640px) {
  header.artikel.opener div, header.opener div {
    margin-left: 0.5rem;
  }
}

@media (min-width: 1024px) {
  header.artikel.opener div, header.opener div {
    grid-column: span 10 / span 10;
    margin-left: 0.75rem;
  }
}

@media (min-width: 1280px) {
  header.artikel.opener div, header.opener div {
    grid-column: span 8 / span 8;
    grid-column-start: 2;
  }
}

@media (min-width: 1536px) {
  header.artikel.opener div, header.opener div {
    grid-column: span 5 / span 5;
    grid-column-start: 2;
    margin-left: 0px;
  }
}

header.opener div {
  margin-top: -1.25rem;
  margin-left: 0px;
}

@media (min-width: 640px) {
  header.opener div {
    margin-left: 0px;
  }
}

@media (min-width: 1024px) {
  header.opener div {
    margin-left: 0px;
  }
}

@media (min-width: 1536px) {
  header.opener div {
    margin-left: 0px;
  }
}

header.video.opener div, header.stundenbuch.opener div {
  --tw-border-opacity: 1;
  border-color: rgba(255, 255, 255, var(--tw-border-opacity));
}

.bg-litlightweiss header.stundenbuch.opener div {
  --tw-border-opacity: 1;
  border-color: rgba(0, 0, 0, var(--tw-border-opacity));
}

header.termin.opener div {
  padding-bottom: 1.25rem;
}

header.artikel.opener.kapitel div {
  margin-top: 2.5rem;
  margin-bottom: 1.25rem;
}

header.artikel.opener div span, header.opener div span {
  display: block;
  padding-bottom: 1px;
  text-align: left;
  font-size: 0.875rem;
  line-height: 1.25rem;
  text-transform: uppercase;
  line-height: 1;
  --tw-text-opacity: 1;
  color: rgba(156, 15, 22, var(--tw-text-opacity));
}

@media (min-width: 768px) {
  header.artikel.opener div span, header.opener div span {
    font-size: 1rem;
    line-height: 1.5rem;
  }
}

header.video.opener div span, header.podcast-episode.opener div span, header.lexikon.opener div h1 i {
  font-weight: 600;
  font-style: normal;
}

header.video.opener div span, header.stundenbuch.opener div span {
  --tw-text-opacity: 1;
  color: rgba(255, 255, 255, var(--tw-text-opacity));
}

.bg-litlightweiss header.stundenbuch.opener div span {
  --tw-text-opacity: 1;
  color: rgba(0, 0, 0, var(--tw-text-opacity));
}

header.video.opener div span i, header.podcast-episode.opener div span i {
  font-weight: 400;
  font-style: normal;
}

header.artikel.opener div h1, header.opener div h1 {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  text-align: left;
  font-size: 1.875rem;
  line-height: 2.25rem;
  font-weight: 300;
  --tw-text-opacity: 1;
  color: rgba(38, 38, 38, var(--tw-text-opacity));
}

header.artikel.opener div h1:hover, header.opener div h1:hover {
  --tw-text-opacity: 1;
  color: rgba(0, 0, 0, var(--tw-text-opacity));
}

@media (min-width: 768px) {
  header.artikel.opener div h1, header.opener div h1 {
    font-size: 2.25rem;
    line-height: 2.5rem;
  }
}

header.artikel.opener div h1, header.opener div h1 {
  line-height: 1.175;
}

header.video.opener div h1, header.stundenbuch.opener div h1 {
  --tw-text-opacity: 1;
  color: rgba(255, 255, 255, var(--tw-text-opacity));
}

.bg-litlightweiss header.stundenbuch.opener div h1 {
  --tw-text-opacity: 1;
  color: rgba(0, 0, 0, var(--tw-text-opacity));
}

header.bibel.opener div {
  margin-top: -2.5rem;
}

header.bibel.opener div {
  margin-bottom: 2.5rem;
}

header.bibel.opener div h1 {
  text-transform: uppercase;
}

header.artikel.opener div.info {
  margin-top: 0px;
  margin-bottom: 1rem;
  border-left-width: 0px;
  padding-right: 0px;
  padding-left: 1rem;
  font-size: 0.75rem;
  line-height: 1rem;
  font-weight: 300;
  text-transform: uppercase;
}

@media (min-width: 640px) {
  header.artikel.opener div.info {
    padding-left: 0px;
  }
}

@media (min-width: 768px) {
  header.artikel.opener div.info {
    font-size: 0.875rem;
    line-height: 1.25rem;
  }
}

header.artikel.opener div.info i {
  font-weight: 500;
  font-style: normal;
}

div.openerbild {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 0px;
}

@media (min-width: 1536px) {
  div.openerbild {
    width: 100%;
  }

  @media (min-width: 640px) {
    div.openerbild {
      max-width: 640px;
    }
  }

  @media (min-width: 768px) {
    div.openerbild {
      max-width: 768px;
    }
  }

  @media (min-width: 1024px) {
    div.openerbild {
      max-width: 1024px;
    }
  }

  @media (min-width: 1280px) {
    div.openerbild {
      max-width: 1280px;
    }
  }

  @media (min-width: 1536px) {
    div.openerbild {
      max-width: 1536px;
    }
  }

  div.openerbild {
    margin-left: auto;
    margin-right: auto;
  }
}

div.openerbild .zoom {
  grid-column: span 12 / span 12;
}

@media (min-width: 1536px) {
  div.openerbild .zoom {
    grid-column: span 10 / span 10;
    grid-column-start: 2;
  }
}

div.openerbild .quelle {
  grid-column: span 9 / span 9;
  grid-column-start: 4;
  padding: 1px;
  padding-top: 0.25rem;
  padding-right: 0.25rem;
  text-align: right;
  font-size: 0.875rem;
  line-height: 1.25rem;
  line-height: 1rem;
  --tw-text-opacity: 1;
  color: rgba(0, 0, 0, var(--tw-text-opacity));
  --tw-text-opacity: 0.4;
}

div.openerbild .quelle:hover {
  --tw-text-opacity: 0.7;
}

@media (min-width: 1024px) {
  div.openerbild .quelle {
    grid-column: span 4 / span 4;
    grid-column-end: 13;
  }
}

@media (min-width: 1536px) {
  div.openerbild .quelle {
    grid-column: span 3 / span 3;
    grid-column-end: 12;
    padding-right: 0px;
  }
}

div.artikel.einstieg {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 1.25rem;
}

@media (min-width: 1536px) {
  div.artikel.einstieg {
    width: 100%;
  }

  @media (min-width: 640px) {
    div.artikel.einstieg {
      max-width: 640px;
    }
  }

  @media (min-width: 768px) {
    div.artikel.einstieg {
      max-width: 768px;
    }
  }

  @media (min-width: 1024px) {
    div.artikel.einstieg {
      max-width: 1024px;
    }
  }

  @media (min-width: 1280px) {
    div.artikel.einstieg {
      max-width: 1280px;
    }
  }

  @media (min-width: 1536px) {
    div.artikel.einstieg {
      max-width: 1536px;
    }
  }

  div.artikel.einstieg {
    margin-left: auto;
    margin-right: auto;
    grid-template-columns: repeat(9, minmax(0, 1fr));
  }
}

div.video.einstieg, div.stundenbuch.einstieg, div.podcast-episode.einstieg, div.bibel.einstieg, div.heilige.einstieg, div.heiligenportrait.einstieg, div.lexikon.einstieg, div.lexikoneintrag.einstieg, div.termin.einstieg {
  margin-bottom: -1.25rem;
}

div.einstieg .teaser {
  position: relative;
  z-index: 10;
  grid-column: 1 / -1;
  margin-top: 0px;
  margin-bottom: 2.5rem;
  border-left-width: 2px;
  --tw-border-opacity: 1;
  border-color: rgba(156, 15, 22, var(--tw-border-opacity));
  background-color: transparent;
  padding-left: 1.75rem;
  padding-right: 1.75rem;
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
  --tw-shadow: 0 0 #0000;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

@media (min-width: 1024px) {
  div.einstieg .teaser {
    grid-column: span 8 / span 8;
  }
}

@media (min-width: 1280px) {
  div.einstieg .teaser {
    grid-column: span 7 / span 7;
    grid-column-start: 2;
  }
}

@media (min-width: 1536px) {
  div.einstieg .teaser {
    grid-column: span 5 / span 5;
    grid-column-start: 2;
  }
}

div.artikel.einstieg .teaser {
  margin-top: 0.25rem;
  margin-right: 0px;
  margin-bottom: 0px;
  margin-left: 0px;
  --tw-bg-opacity: 1;
  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
  --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

@media (min-width: 640px) {
  div.artikel.einstieg .teaser {
    margin-right: 0.5rem;
    margin-left: 0.5rem;
  }
}

@media (min-width: 1024px) {
  div.artikel.einstieg .teaser {
    margin-top: -3rem;
    margin-right: 0px;
    margin-left: 0.75rem;
  }
}

@media (min-width: 1536px) {
  div.artikel.einstieg .teaser {
    margin-left: 0px;
  }
}

div.heiligenportrait.einstieg .teaser {
  padding-top: 2.5rem;
}

div.termin.einstieg .teaser {
  margin-top: 0px;
  --tw-bg-opacity: 1;
  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
  padding-top: 1.25rem;
  padding-bottom: 0.75rem;
  --tw-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

div.video.einstieg .teaser, div.stundenbuch.einstieg .teaser {
  z-index: 10;
  margin-right: 0px;
  margin-left: 0px;
  --tw-border-opacity: 1;
  border-color: rgba(255, 255, 255, var(--tw-border-opacity));
}

@media (min-width: 640px) {
  div.video.einstieg .teaser, div.stundenbuch.einstieg .teaser {
    margin-right: 0px;
    margin-left: 0px;
  }
}

@media (min-width: 1024px) {
  div.video.einstieg .teaser, div.stundenbuch.einstieg .teaser {
    margin-right: 0px;
    margin-left: 0px;
  }
}

@media (min-width: 1536px) {
  div.video.einstieg .teaser, div.stundenbuch.einstieg .teaser {
    margin-left: 0px;
  }
}

.bg-litlightweiss div.stundenbuch.einstieg .teaser {
  --tw-border-opacity: 1;
  border-color: rgba(0, 0, 0, var(--tw-border-opacity));
}

div.artikel.einstieg .teaser span {
  top: -1.25rem;
  left: -0.5rem;
  display: block;
  --tw-bg-opacity: 1;
  background-color: rgba(156, 15, 22, var(--tw-bg-opacity));
}

div.heiligenportrait.einstieg .teaser span {
  top: 0.5rem;
  left: 0px;
  display: block;
  --tw-bg-opacity: 1;
  background-color: rgba(156, 15, 22, var(--tw-bg-opacity));
}

div.termin.einstieg .teaser span {
  top: -0.5rem;
  left: 0px;
  display: block;
  --tw-bg-opacity: 1;
  background-color: rgba(156, 15, 22, var(--tw-bg-opacity));
}

div.termin.einstieg .teaser .termin-info {
  margin-top: 0.75rem;
  display: flex;
  flex-wrap: wrap;
  border-top-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgba(205, 205, 205, var(--tw-border-opacity));
  padding-top: 0.25rem;
  font-size: 1.125rem;
  line-height: 1.75rem;
  font-weight: 300;
  --tw-text-opacity: 1;
  color: rgba(38, 38, 38, var(--tw-text-opacity));
}

div.termin.einstieg .teaser .termin-info div {
  width: 66.666667%;
  text-align: left;
}

div.termin.einstieg .teaser .termin-info div:last-of-type {
  width: 33.333333%;
  text-align: right;
}

div.termin.einstieg .teaser .termin-info div time {
  font-weight: 600;
}

div.termin.einstieg .teaser .termin-info div:last-of-type i {
  font-style: normal;
}

div.artikel.einstieg .teaser p, div.einstieg .teaser p {
  padding-bottom: 0.5rem;
  --tw-text-opacity: 1;
  color: rgba(156, 15, 22, var(--tw-text-opacity));
}

div.video.einstieg .teaser p, div.stundenbuch.einstieg .teaser p {
  --tw-text-opacity: 1;
  color: rgba(255, 255, 255, var(--tw-text-opacity));
}

#main.stundenbuch article div.stundenbuch.einstieg .teaser p a:hover {
  background-color: transparent;
}

#main.stundenbuch article div.stundenbuch.einstieg .teaser p a {
  --tw-text-opacity: 1;
  color: rgba(255, 255, 255, var(--tw-text-opacity));
  --tw-text-opacity: 0.7;
}

#main.stundenbuch article div.stundenbuch.einstieg .teaser p a:hover {
  --tw-text-opacity: 1;
}

#main.stundenbuch article div.stundenbuch.einstieg .teaser p a {
  text-decoration: underline;
}

.bg-litlightweiss div.stundenbuch.einstieg .teaser p, #main.stundenbuch.bg-litlightweiss article div.stundenbuch.einstieg .teaser p a {
  --tw-text-opacity: 1;
  color: rgba(0, 0, 0, var(--tw-text-opacity));
}

div.einstieg .teaser p {
  margin-bottom: -1.25rem;
}

#artikel div.artikel.einstieg #share {
  grid-column: span 12 / span 12;
  display: flex;
  justify-content: center;
  padding-top: 0px;
}

@media (min-width: 640px) {
  #artikel div.artikel.einstieg #share {
    grid-column: span 8 / span 8;
    grid-column-start: 3;
  }
}

@media (min-width: 768px) {
  #artikel div.artikel.einstieg #share {
    grid-column: span 6 / span 6;
    grid-column-start: 4;
  }
}

@media (min-width: 1024px) {
  #artikel div.artikel.einstieg #share {
    grid-column: span 4 / span 4;
    padding-top: 1.25rem;
  }
}

@media (min-width: 1280px) {
  #artikel div.artikel.einstieg #share {
    grid-column: span 3 / span 3;
  }
}

@media (min-width: 1536px) {
  #artikel div.artikel.einstieg #share {
    grid-column: span 2 / span 2;
  }
}

div.artikel.einstieg #share li {
  flex: 1 1 0%;
}

/* Rubriken und Sonderseiten */

/* Absatz-Elemente */

section.absaetze, #articlefooter {
  position: relative;
  margin-top: 2.5rem;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 1.25rem;
}

@media (min-width: 1536px) {
  section.absaetze, #articlefooter {
    width: 100%;
  }

  @media (min-width: 640px) {
    section.absaetze, #articlefooter {
      max-width: 640px;
    }
  }

  @media (min-width: 768px) {
    section.absaetze, #articlefooter {
      max-width: 768px;
    }
  }

  @media (min-width: 1024px) {
    section.absaetze, #articlefooter {
      max-width: 1024px;
    }
  }

  @media (min-width: 1280px) {
    section.absaetze, #articlefooter {
      max-width: 1280px;
    }
  }

  @media (min-width: 1536px) {
    section.absaetze, #articlefooter {
      max-width: 1536px;
    }
  }

  section.absaetze, #articlefooter {
    margin-left: auto;
    margin-right: auto;
    grid-template-columns: repeat(9, minmax(0, 1fr));
  }
}

#main.video section.absaetze, #main.video #articlefooter, #main.stundenbuch section.absaetze, #main.stundenbuch #articlefooter, #main.podcast-episode section.absaetze, #main.podcast-episode #articlefooter, #main.bibel section.absaetze, #main.bibel #articlefooter, #main.heilige section.absaetze, #main.heilige #articlefooter, #main.heiligenportrait section.absaetze, #main.heiligenportrait #articlefooter, #main.lexikoneintrag section.absaetze, #main.lexikoneintrag #articlefooter {
  position: relative;
  margin-top: 2.5rem;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 1.25rem;
}

@media (min-width: 1536px) {
  #main.video section.absaetze, #main.video #articlefooter, #main.stundenbuch section.absaetze, #main.stundenbuch #articlefooter, #main.podcast-episode section.absaetze, #main.podcast-episode #articlefooter, #main.bibel section.absaetze, #main.bibel #articlefooter, #main.heilige section.absaetze, #main.heilige #articlefooter, #main.heiligenportrait section.absaetze, #main.heiligenportrait #articlefooter, #main.lexikoneintrag section.absaetze, #main.lexikoneintrag #articlefooter {
    width: 100%;
  }

  @media (min-width: 640px) {
    #main.video section.absaetze, #main.video #articlefooter, #main.stundenbuch section.absaetze, #main.stundenbuch #articlefooter, #main.podcast-episode section.absaetze, #main.podcast-episode #articlefooter, #main.bibel section.absaetze, #main.bibel #articlefooter, #main.heilige section.absaetze, #main.heilige #articlefooter, #main.heiligenportrait section.absaetze, #main.heiligenportrait #articlefooter, #main.lexikoneintrag section.absaetze, #main.lexikoneintrag #articlefooter {
      max-width: 640px;
    }
  }

  @media (min-width: 768px) {
    #main.video section.absaetze, #main.video #articlefooter, #main.stundenbuch section.absaetze, #main.stundenbuch #articlefooter, #main.podcast-episode section.absaetze, #main.podcast-episode #articlefooter, #main.bibel section.absaetze, #main.bibel #articlefooter, #main.heilige section.absaetze, #main.heilige #articlefooter, #main.heiligenportrait section.absaetze, #main.heiligenportrait #articlefooter, #main.lexikoneintrag section.absaetze, #main.lexikoneintrag #articlefooter {
      max-width: 768px;
    }
  }

  @media (min-width: 1024px) {
    #main.video section.absaetze, #main.video #articlefooter, #main.stundenbuch section.absaetze, #main.stundenbuch #articlefooter, #main.podcast-episode section.absaetze, #main.podcast-episode #articlefooter, #main.bibel section.absaetze, #main.bibel #articlefooter, #main.heilige section.absaetze, #main.heilige #articlefooter, #main.heiligenportrait section.absaetze, #main.heiligenportrait #articlefooter, #main.lexikoneintrag section.absaetze, #main.lexikoneintrag #articlefooter {
      max-width: 1024px;
    }
  }

  @media (min-width: 1280px) {
    #main.video section.absaetze, #main.video #articlefooter, #main.stundenbuch section.absaetze, #main.stundenbuch #articlefooter, #main.podcast-episode section.absaetze, #main.podcast-episode #articlefooter, #main.bibel section.absaetze, #main.bibel #articlefooter, #main.heilige section.absaetze, #main.heilige #articlefooter, #main.heiligenportrait section.absaetze, #main.heiligenportrait #articlefooter, #main.lexikoneintrag section.absaetze, #main.lexikoneintrag #articlefooter {
      max-width: 1280px;
    }
  }

  @media (min-width: 1536px) {
    #main.video section.absaetze, #main.video #articlefooter, #main.stundenbuch section.absaetze, #main.stundenbuch #articlefooter, #main.podcast-episode section.absaetze, #main.podcast-episode #articlefooter, #main.bibel section.absaetze, #main.bibel #articlefooter, #main.heilige section.absaetze, #main.heilige #articlefooter, #main.heiligenportrait section.absaetze, #main.heiligenportrait #articlefooter, #main.lexikoneintrag section.absaetze, #main.lexikoneintrag #articlefooter {
      max-width: 1536px;
    }
  }

  #main.video section.absaetze, #main.video #articlefooter, #main.stundenbuch section.absaetze, #main.stundenbuch #articlefooter, #main.podcast-episode section.absaetze, #main.podcast-episode #articlefooter, #main.bibel section.absaetze, #main.bibel #articlefooter, #main.heilige section.absaetze, #main.heilige #articlefooter, #main.heiligenportrait section.absaetze, #main.heiligenportrait #articlefooter, #main.lexikoneintrag section.absaetze, #main.lexikoneintrag #articlefooter {
    margin-left: auto;
    margin-right: auto;
  }
}

#main.lexikon section.absaetze, #main.lexikon #articlefooter, #main.termine section.absaetze, #main.termine #articlefooter {
  position: relative;
  margin-top: 2.25rem;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 1.25rem;
}

@media (min-width: 1280px) {
  #main.lexikon section.absaetze, #main.lexikon #articlefooter, #main.termine section.absaetze, #main.termine #articlefooter {
    grid-template-columns: repeat(10, minmax(0, 1fr));
  }
}

@media (min-width: 1536px) {
  #main.lexikon section.absaetze, #main.lexikon #articlefooter, #main.termine section.absaetze, #main.termine #articlefooter {
    width: 100%;
  }

  @media (min-width: 640px) {
    #main.lexikon section.absaetze, #main.lexikon #articlefooter, #main.termine section.absaetze, #main.termine #articlefooter {
      max-width: 640px;
    }
  }

  @media (min-width: 768px) {
    #main.lexikon section.absaetze, #main.lexikon #articlefooter, #main.termine section.absaetze, #main.termine #articlefooter {
      max-width: 768px;
    }
  }

  @media (min-width: 1024px) {
    #main.lexikon section.absaetze, #main.lexikon #articlefooter, #main.termine section.absaetze, #main.termine #articlefooter {
      max-width: 1024px;
    }
  }

  @media (min-width: 1280px) {
    #main.lexikon section.absaetze, #main.lexikon #articlefooter, #main.termine section.absaetze, #main.termine #articlefooter {
      max-width: 1280px;
    }
  }

  @media (min-width: 1536px) {
    #main.lexikon section.absaetze, #main.lexikon #articlefooter, #main.termine section.absaetze, #main.termine #articlefooter {
      max-width: 1536px;
    }
  }

  #main.lexikon section.absaetze, #main.lexikon #articlefooter, #main.termine section.absaetze, #main.termine #articlefooter {
    margin-left: auto;
    margin-right: auto;
  }
}

#main.termine #articlefooter {
  margin-top: 0px;
}

.absatz.html img {
  display: inline;
}

#artikel section.absaetze .content-main {
  grid-column: span 12 / span 12;
  margin-top: -1.25rem;
}

@media (min-width: 1024px) {
  #artikel section.absaetze .content-main {
    grid-column: span 8 / span 8;
    margin-top: 0px;
  }
}

@media (min-width: 1280px) {
  #artikel section.absaetze .content-main {
    grid-column: span 7 / span 7;
    grid-column-start: 2;
  }
}

@media (min-width: 1536px) {
  #artikel section.absaetze .content-main {
    grid-column: span 5 / span 5;
    grid-column-start: 2;
  }
}

#main.video #artikel section.absaetze .content-main, #main.stundenbuch #artikel section.absaetze .content-main {
  grid-column: span 12 / span 12;
  margin-top: -1.25rem;
}

@media (min-width: 1024px) {
  #main.video #artikel section.absaetze .content-main, #main.stundenbuch #artikel section.absaetze .content-main {
    grid-column: span 8 / span 8;
    margin-top: 0px;
  }
}

@media (min-width: 1280px) {
  #main.video #artikel section.absaetze .content-main, #main.stundenbuch #artikel section.absaetze .content-main {
    grid-column: span 7 / span 7;
    grid-column-start: 2;
  }
}

#main.heiligenportrait #artikel section.absaetze .content-main {
  grid-column: span 12 / span 12;
  margin-top: -1.25rem;
}

@media (min-width: 1024px) {
  #main.heiligenportrait #artikel section.absaetze .content-main {
    grid-column: span 8 / span 8;
    grid-column-start: 3;
    margin-top: 0px;
  }
}

@media (min-width: 1280px) {
  #main.heiligenportrait #artikel section.absaetze .content-main {
    grid-column: span 6 / span 6;
    grid-column-start: 1;
  }
}

@media (min-width: 1536px) {
  #main.heiligenportrait #artikel section.absaetze .content-main {
    grid-column: span 5 / span 5;
    grid-column-start: 2;
  }
}

@media (min-width: 1024px) {
  #main.heiligenportrait #artikel section.absaetze {
    margin-top: 3rem;
  }
}

#main.bibel #artikel section.absaetze .content-main, #main.heilige #artikel section.absaetze .content-main {
  grid-column: span 12 / span 12;
  margin-top: -1.25rem;
}

@media (min-width: 1024px) {
  #main.bibel #artikel section.absaetze .content-main, #main.heilige #artikel section.absaetze .content-main {
    grid-column: span 12 / span 12;
    grid-column-start: 1;
    margin-top: 0px;
  }
}

@media (min-width: 1280px) {
  #main.bibel #artikel section.absaetze .content-main, #main.heilige #artikel section.absaetze .content-main {
    grid-column: span 7 / span 7;
    grid-column-start: 1;
  }
}

@media (min-width: 1536px) {
  #main.bibel #artikel section.absaetze .content-main {
    margin-top: -1.75rem;
  }
}

#main.lexikon #artikel section.absaetze .content-main {
  grid-column: span 12 / span 12;
  margin-top: 0px;
}

@media (min-width: 1024px) {
  #main.lexikon #artikel section.absaetze .content-main {
    grid-column: span 10 / span 10;
    grid-column-start: 2;
  }
}

@media (min-width: 1280px) {
  #main.lexikon #artikel section.absaetze .content-main {
    grid-column: span 6 / span 6;
    grid-column-start: 1;
  }
}

@media (min-width: 1536px) {
  #main.lexikon #artikel section.absaetze .content-main {
    grid-column: span 6 / span 6;
    grid-column-start: 1;
  }
}

#main.lexikoneintrag #artikel section.absaetze .content-main {
  grid-column: span 12 / span 12;
  margin-top: 0px;
}

@media (min-width: 1024px) {
  #main.lexikoneintrag #artikel section.absaetze .content-main {
    grid-column: span 10 / span 10;
    grid-column-start: 2;
  }
}

@media (min-width: 1280px) {
  #main.lexikoneintrag #artikel section.absaetze .content-main {
    grid-column: span 6 / span 6;
    grid-column-start: 1;
  }
}

@media (min-width: 1536px) {
  #main.lexikoneintrag #artikel section.absaetze .content-main {
    grid-column: span 6 / span 6;
    grid-column-start: 1;
  }
}

#main.termine #artikel section.absaetze .content-main {
  grid-column: span 12 / span 12;
  margin-top: -1.25rem;
  margin-bottom: -2.5rem;
}

@media (min-width: 1024px) {
  #main.termine #artikel section.absaetze .content-main {
    grid-column: span 8 / span 8;
    grid-column-start: 3;
    margin-top: 0px;
    margin-bottom: 0px;
  }
}

@media (min-width: 1280px) {
  #main.termine #artikel section.absaetze .content-main {
    grid-column: span 5 / span 5;
    grid-column-start: 2;
  }
}

@media (min-width: 1536px) {
  #main.termine #artikel section.absaetze .content-main {
    grid-column: span 4 / span 4;
    grid-column-start: 3;
  }
}

#main.podcast-episode #artikel section.absaetze .content-main {
  grid-column: span 12 / span 12;
  margin-top: -1.25rem;
}

@media (min-width: 1024px) {
  #main.podcast-episode #artikel section.absaetze .content-main {
    grid-column: span 10 / span 10;
    grid-column-start: 2;
    margin-top: 0px;
  }
}

@media (min-width: 1280px) {
  #main.podcast-episode #artikel section.absaetze .content-main {
    grid-column: span 7 / span 7;
    grid-column-start: 1;
  }
}

#artikel h2 {
  padding-bottom: 1.25rem;
  font-size: 1.5rem;
  line-height: 2rem;
  font-weight: 500;
  --tw-text-opacity: 1;
  color: rgba(0, 0, 0, var(--tw-text-opacity));
}

#artikel p, #artikel .content-main ul {
  padding-bottom: 1.25rem;
}

#artikel .content-main ul {
  margin-top: -1rem;
  padding-left: 1.75rem;
}

#artikel .content-main ul {
  list-style-type: disc;
}

#artikel .content-main ul li {
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
}

#artikel p a, #artikel .content-main ul a {
  --tw-text-opacity: 1;
  color: rgba(156, 15, 22, var(--tw-text-opacity));
  text-decoration: underline;
}

#artikel p a:hover, #artikel .content-main ul a:hover {
  --tw-bg-opacity: 1;
  background-color: rgba(238, 238, 238, var(--tw-bg-opacity));
  text-decoration: none;
}

#artikel section.absaetze .content-sidebar {
  grid-column: span 12 / span 12;
  margin-top: 0px;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  align-content: flex-start;
  gap: 0px;
}

@media (min-width: 768px) {
  #artikel section.absaetze .content-sidebar {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
  }
}

@media (min-width: 1024px) {
  #artikel section.absaetze .content-sidebar {
    grid-column: span 4 / span 4;
    margin-top: -1.25rem;
    display: block;
    gap: 0px;
  }
}

@media (min-width: 1280px) {
  #artikel section.absaetze .content-sidebar {
    grid-column: span 3 / span 3;
  }
}

@media (min-width: 1536px) {
  #artikel section.absaetze .content-sidebar {
    grid-column: span 2 / span 2;
  }
}

#artikel section.absaetze .content-sidebar article:last-of-type {
  margin-bottom: 1.25rem;
}

@media (min-width: 1024px) {
  #artikel section.absaetze .content-sidebar article:last-of-type {
    margin-bottom: 0px;
  }
}

#main.bibel #artikel section.absaetze .content-sidebar article:last-of-type, #main.heilige #artikel section.absaetze .content-sidebar article:last-of-type, #main.heiligenportrait #artikel section.absaetze .content-sidebar article:last-of-type, #main.lexikoneintrag #artikel section.absaetze .content-sidebar article:last-of-type {
  margin-bottom: 1.25rem;
}

@media (min-width: 1280px) {
  #main.bibel #artikel section.absaetze .content-sidebar article:last-of-type, #main.heilige #artikel section.absaetze .content-sidebar article:last-of-type, #main.heiligenportrait #artikel section.absaetze .content-sidebar article:last-of-type, #main.lexikoneintrag #artikel section.absaetze .content-sidebar article:last-of-type {
    margin-bottom: 1.75rem;
  }
}

#main.video #artikel section.absaetze .content-sidebar, #main.stundenbuch #artikel section.absaetze .content-sidebar {
  grid-column: span 12 / span 12;
  margin-top: 1.25rem;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  gap: 0px;
}

@media (min-width: 768px) {
  #main.video #artikel section.absaetze .content-sidebar, #main.stundenbuch #artikel section.absaetze .content-sidebar {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
  }
}

@media (min-width: 1024px) {
  #main.video #artikel section.absaetze .content-sidebar, #main.stundenbuch #artikel section.absaetze .content-sidebar {
    grid-column: span 4 / span 4;
    margin-top: -1.25rem;
    display: block;
    gap: 0px;
  }
}

@media (min-width: 1280px) {
  #main.video #artikel section.absaetze .content-sidebar, #main.stundenbuch #artikel section.absaetze .content-sidebar {
    grid-column: span 3 / span 3;
  }
}

@media (min-width: 1536px) {
  #main.video #artikel section.absaetze .content-sidebar, #main.stundenbuch #artikel section.absaetze .content-sidebar {
    grid-column: span 3 / span 3;
  }
}

#main.podcast-episode #artikel section.absaetze .content-sidebar {
  grid-column: span 12 / span 12;
  margin-top: 1.25rem;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  gap: 0px;
}

@media (min-width: 768px) {
  #main.podcast-episode #artikel section.absaetze .content-sidebar {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
  }
}

@media (min-width: 1024px) {
  #main.podcast-episode #artikel section.absaetze .content-sidebar {
    grid-column: span 8 / span 8;
    grid-column-end: 11;
    display: block;
    gap: 0px;
  }
}

@media (min-width: 1280px) {
  #main.podcast-episode #artikel section.absaetze .content-sidebar {
    grid-column: span 5 / span 5;
    grid-column-end: 13;
    margin-top: -1.25rem;
  }
}

#main.bibel #artikel section.absaetze .content-sidebar, #main.heilige #artikel section.absaetze .content-sidebar {
  grid-column: span 12 / span 12;
  margin-top: 1.75rem;
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  gap: 0px;
}

@media (min-width: 768px) {
  #main.bibel #artikel section.absaetze .content-sidebar, #main.heilige #artikel section.absaetze .content-sidebar {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
  }
}

@media (min-width: 1024px) {
  #main.bibel #artikel section.absaetze .content-sidebar, #main.heilige #artikel section.absaetze .content-sidebar {
    grid-column: span 8 / span 8;
    grid-column-end: 11;
  }
}

@media (min-width: 1280px) {
  #main.bibel #artikel section.absaetze .content-sidebar, #main.heilige #artikel section.absaetze .content-sidebar {
    grid-column: span 5 / span 5;
    grid-column-end: 13;
    margin-top: -1.25rem;
  }
}

@media (min-width: 1536px) {
  #main.bibel #artikel section.absaetze .content-sidebar {
    margin-top: -3.5rem;
  }
}

#main.heiligenportrait #artikel section.absaetze .content-sidebar {
  grid-column: span 12 / span 12;
  margin-top: -1.25rem;
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  gap: 0px;
}

@media (min-width: 768px) {
  #main.heiligenportrait #artikel section.absaetze .content-sidebar {
    margin-top: 1.25rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
  }
}

@media (min-width: 1024px) {
  #main.heiligenportrait #artikel section.absaetze .content-sidebar {
    grid-column: span 8 / span 8;
    grid-column-end: 11;
  }
}

@media (min-width: 1280px) {
  #main.heiligenportrait #artikel section.absaetze .content-sidebar {
    grid-column: span 6 / span 6;
    grid-column-end: 13;
    margin-top: -1.25rem;
  }
}

@media (min-width: 1536px) {
  #main.heiligenportrait #artikel section.absaetze .content-sidebar {
    grid-column: span 5 / span 5;
    grid-column-end: 12;
  }
}

#main.lexikon #artikel section.absaetze .content-sidebar {
  grid-column: span 12 / span 12;
  margin-top: 2.5rem;
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  gap: 0px;
}

@media (min-width: 768px) {
  #main.lexikon #artikel section.absaetze .content-sidebar {
    margin-top: 0px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
  }
}

@media (min-width: 1024px) {
  #main.lexikon #artikel section.absaetze .content-sidebar {
    grid-column: span 8 / span 8;
    grid-column-end: 11;
    margin-top: -1.25rem;
  }
}

@media (min-width: 1280px) {
  #main.lexikon #artikel section.absaetze .content-sidebar {
    grid-column: span 4 / span 4;
    grid-column-end: 11;
  }
}

#main.lexikoneintrag #artikel section.absaetze .content-sidebar {
  grid-column: span 12 / span 12;
  margin-top: -1.75rem;
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  gap: 0px;
}

@media (min-width: 768px) {
  #main.lexikoneintrag #artikel section.absaetze .content-sidebar {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
  }
}

@media (min-width: 1024px) {
  #main.lexikoneintrag #artikel section.absaetze .content-sidebar {
    grid-column: span 8 / span 8;
    grid-column-end: 11;
  }
}

@media (min-width: 1280px) {
  #main.lexikoneintrag #artikel section.absaetze .content-sidebar {
    grid-column: span 6 / span 6;
    grid-column-end: 13;
    margin-top: -1.25rem;
  }
}

#main.termine #artikel section.absaetze .content-sidebar {
  grid-column: span 12 / span 12;
  margin-top: 1.25rem;
  margin-bottom: 1.25rem;
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  gap: 0px;
}

@media (min-width: 640px) {
  #main.termine #artikel section.absaetze .content-sidebar {
    grid-column: span 10 / span 10;
    grid-column-end: 12;
  }
}

@media (min-width: 768px) {
  #main.termine #artikel section.absaetze .content-sidebar {
    grid-column: span 6 / span 6;
    grid-column-end: 10;
    grid-template-columns: repeat(1, minmax(0, 1fr));
    gap: 0.75rem;
  }
}

@media (min-width: 1024px) {
  #main.termine #artikel section.absaetze .content-sidebar {
    grid-column: span 4 / span 4;
    grid-column-end: 9;
    margin-top: -1.25rem;
  }
}

@media (min-width: 1280px) {
  #main.termine #artikel section.absaetze .content-sidebar {
    grid-column: span 3 / span 3;
    grid-column-end: 10;
    margin-bottom: 0.5rem;
  }
}

@media (min-width: 1536px) {
  #main.termine #artikel section.absaetze .content-sidebar {
    grid-column: span 2 / span 2;
    grid-column-end: 9;
  }
}

#artikel section.absaetze .content-sidebar h2 {
  margin-top: -0.5rem;
  display: none;
  padding-bottom: 0.5rem;
  font-size: 1.5rem;
  line-height: 2rem;
  font-weight: 300;
  line-height: 1.75rem;
  --tw-text-opacity: 1;
  color: rgba(72, 72, 72, var(--tw-text-opacity));
}

@media (min-width: 1024px) {
  #artikel section.absaetze .content-sidebar h2 {
    display: inline-block;
  }
}

#main.bibel #artikel section.absaetze .content-sidebar h2, #main.stundenbuch #artikel section.absaetze .content-sidebar h2, #main.heilige #artikel section.absaetze .content-sidebar h2, #main.heiligenportrait #artikel section.absaetze .content-sidebar h2, #main.lexikon #artikel section.absaetze .content-sidebar h2, #main.lexikoneintrag #artikel section.absaetze .content-sidebar h2, #main.termine #artikel section.absaetze .content-sidebar h2 {
  display: inline-block;
}

@media (min-width: 1024px) {
  #main.bibel #artikel section.absaetze .content-sidebar h2, #main.stundenbuch #artikel section.absaetze .content-sidebar h2, #main.heilige #artikel section.absaetze .content-sidebar h2, #main.heiligenportrait #artikel section.absaetze .content-sidebar h2, #main.lexikon #artikel section.absaetze .content-sidebar h2, #main.lexikoneintrag #artikel section.absaetze .content-sidebar h2, #main.termine #artikel section.absaetze .content-sidebar h2 {
    display: inline-block;
  }
}

#main.bibel #artikel section.absaetze .content-sidebar h2 {
  margin-top: 0px;
}

#main.video #artikel section.absaetze .content-sidebar h2 {
  --tw-text-opacity: 1;
  color: rgba(221, 221, 221, var(--tw-text-opacity));
}

#main.stundenbuch #artikel section.absaetze .content-sidebar h2 {
  --tw-text-opacity: 1;
  color: rgba(255, 255, 255, var(--tw-text-opacity));
  --tw-text-opacity: 0.7;
}

#main.stundenbuch.bg-litlightweiss #artikel section.absaetze .content-sidebar h2 {
  --tw-text-opacity: 1;
  color: rgba(0, 0, 0, var(--tw-text-opacity));
}

#artikel section.absaetze .content-sidebar .card.dossier footer {
  display: none;
}

@media (min-width: 1024px) {
  #artikel section.absaetze .content-sidebar .card.dossier footer {
    display: block;
  }
}

#artikel section.absaetze .content-sidebar .card.index {
  position: fixed;
  right: -0.25rem;
  bottom: 0px;
  margin-top: 0.5rem;
  display: block;
  height: auto;
  width: 3rem;
  --tw-bg-opacity: 1;
  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
  --tw-bg-opacity: 0;
  --tw-text-opacity: 1;
  color: rgba(0, 0, 0, var(--tw-text-opacity));
  --tw-shadow: 0 0 #0000;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

@media (min-width: 768px) {
  #artikel section.absaetze .content-sidebar .card.index {
    width: 5rem;
  }
}

@media (min-width: 1024px) {
  #artikel section.absaetze .content-sidebar .card.index {
    position: relative;
    right: 0px;
    margin-top: 0px;
    width: 100%;
    --tw-bg-opacity: 1;
    --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
  }

  #artikel section.absaetze .content-sidebar .card.index:hover {
    --tw-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
  }
}

#artikel section.absaetze .content-sidebar .card.index {
  z-index: 190;
}

#artikel section.absaetze .content-sidebar .card.index h3 {
  display: none;
  --tw-bg-opacity: 1;
  background-color: rgba(247, 247, 247, var(--tw-bg-opacity));
  padding-left: 0.75rem;
  padding-right: 0.75rem;
  padding-top: 0px;
  padding-bottom: 0.25rem;
  font-size: 1.25rem;
  line-height: 1.75rem;
  font-weight: 600;
  line-height: 1.75rem;
  --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

@media (min-width: 768px) {
  #artikel section.absaetze .content-sidebar .card.index h3 {
    display: inline-block;
  }
}

@media (min-width: 1024px) {
  #artikel section.absaetze .content-sidebar .card.index h3 {
    background-image: none;
    padding-top: 1rem;
    padding-bottom: 0.75rem;
    font-size: 1.5rem;
    line-height: 2rem;
    --tw-shadow: 0 0 #0000;
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
  }
}

#artikel section.absaetze .content-sidebar .card.index h3 i {
  display: none;
  font-style: normal;
}

@media (min-width: 1024px) {
  #artikel section.absaetze .content-sidebar .card.index h3 i {
    display: inline;
  }
}

#artikel section.absaetze .content-sidebar .card.index a {
  margin-left: 0px;
  width: 3rem;
  border-top-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgba(221, 221, 221, var(--tw-border-opacity));
  --tw-bg-opacity: 1;
  background-color: rgba(247, 247, 247, var(--tw-bg-opacity));
}

#artikel section.absaetze .content-sidebar .card.index a:hover {
  --tw-bg-opacity: 1;
  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
}

#artikel section.absaetze .content-sidebar .card.index a {
  padding-left: 0.25rem;
  padding-right: 0.25rem;
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
  text-align: left;
  font-size: 0.75rem;
  line-height: 1rem;
  font-weight: 700;
  line-height: 1rem;
  --tw-text-opacity: 1;
  color: rgba(38, 38, 38, var(--tw-text-opacity));
}

#artikel section.absaetze .content-sidebar .card.index a:hover {
  --tw-text-opacity: 1;
  color: rgba(156, 15, 22, var(--tw-text-opacity));
}

#artikel section.absaetze .content-sidebar .card.index a {
  opacity: 0.8;
}

@media (min-width: 640px) {
  #artikel section.absaetze .content-sidebar .card.index a {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    font-size: 0.875rem;
    line-height: 1.25rem;
    opacity: 0.9;
  }
}

@media (min-width: 768px) {
  #artikel section.absaetze .content-sidebar .card.index a {
    margin-left: 2rem;
    opacity: 1;
  }
}

@media (min-width: 1024px) {
  #artikel section.absaetze .content-sidebar .card.index a {
    margin-left: 0px;
    width: 100%;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
    font-weight: 600;
  }
}

#artikel section.absaetze .content-sidebar .card.index a span {
  display: none;
  font-weight: 400;
}

@media (min-width: 1024px) {
  #artikel section.absaetze .content-sidebar .card.index a span {
    display: inline;
  }
}

.ortsmarke {
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 600;
  text-transform: uppercase;
  font-style: normal;
  --tw-text-opacity: 1;
  color: rgba(0, 0, 0, var(--tw-text-opacity));
}

.absatz.text, .absatz.autor, .absatz.bibeltext {
  margin-top: -1.25rem;
  margin-bottom: -1.25rem;
  --tw-bg-opacity: 1;
  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
  padding-left: 1.75rem;
  padding-right: 1.75rem;
  padding-top: 1.25rem;
}

.absatz.bibeltext {
  font-family: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
}

#main.bibel #artikel section.absaetze .content-main .absatz.bibeltext h2 {
  padding-bottom: 1.25rem;
  font-size: 1.5rem;
  line-height: 2rem;
  font-style: italic;
  --tw-text-opacity: 1;
  color: rgba(156, 15, 22, var(--tw-text-opacity));
}

#main.bibel #artikel section.absaetze .content-main .absatz.bibeltext h2 span {
  --tw-text-opacity: 1;
  color: rgba(0, 0, 0, var(--tw-text-opacity));
}

#main.bibel #artikel section.absaetze .content-main .absatz.bibeltext .kapitel {
  float: left;
  margin-top: -1px;
  padding-right: 0.25rem;
  font-size: 6rem;
  line-height: 1;
  line-height: 2rem;
  --tw-text-opacity: 1;
  color: rgba(156, 15, 22, var(--tw-text-opacity));
}

#main.bibel #artikel section.absaetze .content-main .absatz.bibeltext p a {
  background-color: transparent;
}

#main.bibel #artikel section.absaetze .content-main .absatz.bibeltext p a:hover {
  --tw-bg-opacity: 1;
  background-color: rgba(221, 221, 221, var(--tw-bg-opacity));
}

#main.bibel #artikel section.absaetze .content-main .absatz.bibeltext p a {
  padding-right: 0.5rem;
  --tw-text-opacity: 1;
  color: rgba(0, 0, 0, var(--tw-text-opacity));
  text-decoration: none;
  --tw-shadow: 0 0 #0000;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

#main.bibel #artikel section.absaetze .content-main .absatz.bibeltext p a:hover {
  --tw-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, 0.06);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

#main.bibel #artikel section.absaetze .content-main .absatz.bibeltext p a .verse {
  font-size: 0.875rem;
  line-height: 1.25rem;
  --tw-text-opacity: 1;
  color: rgba(156, 15, 22, var(--tw-text-opacity));
}

.absatz.autor {
  padding-bottom: 1.75rem;
  font-size: 1.125rem;
  line-height: 1.75rem;
  font-weight: 600;
}

.absatz.textbox, .absatz.bild, .absatz.video, .absatz.galerie, .absatz.zitat, .absatz.lexikon, .absatz.dossier, .absatz.show {
  margin-top: 2.5rem;
  margin-bottom: 2.5rem;
}

.absatz.textbox article {
  display: block;
  border-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgba(205, 205, 205, var(--tw-border-opacity));
  --tw-bg-opacity: 1;
  background-color: rgba(247, 247, 247, var(--tw-bg-opacity));
  padding: 1.75rem;
}

.absatz.textbox article:hover {
  --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.absatz.textbox article {
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.absatz.textbox article h3, .absatz.textbox article p {
  padding-bottom: 0.75rem;
  font-weight: 300;
}

.absatz.textbox article h3 {
  font-size: 1.5rem;
  line-height: 2rem;
  --tw-text-opacity: 1;
  color: rgba(0, 0, 0, var(--tw-text-opacity));
}

.absatz.textbox article p {
  --tw-text-opacity: 1;
  color: rgba(38, 38, 38, var(--tw-text-opacity));
}

.absatz.textbox article footer.boxfooter a {
  display: block;
  width: 100%;
  text-align: right;
  font-size: 1.125rem;
  line-height: 1.75rem;
  font-weight: 500;
  line-height: 1.375;
  --tw-text-opacity: 1;
  color: rgba(156, 15, 22, var(--tw-text-opacity));
}

.absatz.textbox article footer.boxfooter a:hover {
  --tw-text-opacity: 0.9;
  text-decoration: underline;
}

figure.bild img, .absatz.galerie figure a img {
  position: relative;
  width: 100%;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  transform: translateX(var(--tw-translate-x)) translateY(var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
  transition-property: background-color, border-color, color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;
  transition-property: background-color, border-color, color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
  transition-property: background-color, border-color, color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
  transition-duration: 500ms;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

figure.bild.heiligenportrait img {
  margin-left: auto;
  margin-right: auto;
  width: 91.666667%;
}

@media (min-width: 640px) {
  figure.bild.heiligenportrait img {
    width: 83.333333%;
  }
}

@media (min-width: 1024px) {
  figure.bild.heiligenportrait img {
    width: 80%;
  }
}

@media (min-width: 1280px) {
  figure.bild.heiligenportrait img {
    width: 66.666667%;
  }
}

figure.bild.heiligenportrait img {
  outline: 1px solid white;
  outline-offset: -6px;
}

figure.bild img {
  z-index: 100;
}

figure.bild img:hover, .absatz.galerie figure a:hover img {
  --tw-scale-x: 1;
  --tw-scale-y: 1;
}

@media (min-width: 1024px) {
  figure.bild img:hover, .absatz.galerie figure a:hover img {
    --tw-scale-x: 1.1;
    --tw-scale-y: 1.1;
  }
}

figure.bild.stundenbuch img:hover, figure.bild.bibel img:hover, figure.bild.heiligenportrait img:hover, figure.bild.heilige img:hover, figure.bild.lexikoneintrag img:hover, figure.bild.termin img:hover {
  --tw-scale-x: 1;
  --tw-scale-y: 1;
}

@media (min-width: 1024px) {
  figure.bild.stundenbuch img:hover, figure.bild.bibel img:hover, figure.bild.heiligenportrait img:hover, figure.bild.heilige img:hover, figure.bild.lexikoneintrag img:hover, figure.bild.termin img:hover {
    --tw-scale-x: 1;
    --tw-scale-y: 1;
  }
}

figure.video .video-rframe {
  position: relative;
  height: 0px;
  width: 100%;
  --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
  padding-bottom: 56.25%;
}

figure.video .video-rframe iframe {
  position: absolute;
  top: 0px;
  left: 0px;
  height: 100%;
  width: 100%;
}

figure.bild figcaption p.bildbeschreibung, figure.video figcaption p.videoteaser {
  border-top-width: 2px;
  --tw-border-opacity: 1;
  border-color: rgba(156, 15, 22, var(--tw-border-opacity));
  --tw-bg-opacity: 1;
  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
  padding-left: 1.25rem;
  padding-right: 1.25rem;
  padding-top: 0.75rem;
  padding-bottom: 1.25rem;
  text-align: left;
  font-size: 1rem;
  line-height: 1.5rem;
  line-height: 1.25rem;
  --tw-text-opacity: 1;
  color: rgba(38, 38, 38, var(--tw-text-opacity));
  --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

figure.podcast-episode figcaption a.podcastinfo {
  display: block;
  border-top-width: 2px;
  --tw-border-opacity: 1;
  border-color: rgba(156, 15, 22, var(--tw-border-opacity));
  background-image: linear-gradient(to right, var(--tw-gradient-stops));
  --tw-gradient-from: #343434;
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(52, 52, 52, 0));
}

figure.podcast-episode figcaption a.podcastinfo:hover {
  --tw-gradient-from: #000;
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(0, 0, 0, 0));
}

figure.podcast-episode figcaption a.podcastinfo {
  --tw-gradient-to: #616161;
  padding-left: 0.75rem;
  padding-right: 0.75rem;
  padding-top: 0.75rem;
  padding-bottom: 0px;
  text-align: left;
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 500;
  line-height: 1.25rem;
  --tw-text-opacity: 1;
  color: rgba(247, 247, 247, var(--tw-text-opacity));
}

figure.podcast-episode figcaption a.podcastinfo:hover {
  --tw-text-opacity: 1;
  color: rgba(255, 255, 255, var(--tw-text-opacity));
}

figure.podcast-episode figcaption a.podcastinfo {
  --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

figure.podcast-episode figcaption a.podcastinfo h1 {
  margin-top: -0.5rem;
  padding-bottom: 0.25rem;
  font-size: 1.25rem;
  line-height: 1.75rem;
  font-weight: 600;
  line-height: 2rem;
}

figure.podcast-episode figcaption a.podcastinfo img {
  float: left;
  margin-right: 0.75rem;
  width: 8.333333%;
  border-width: 2px;
  --tw-border-opacity: 1;
  border-color: rgba(255, 255, 255, var(--tw-border-opacity));
  --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

figure.bild figcaption p.bildbeschreibung, figure.video figcaption p.videoteaser {
  margin-left: 1.75rem;
  margin-right: 1.75rem;
  margin-top: 0.5rem;
}

.absatz.podcast-episode {
  margin-top: 1.25rem;
  margin-bottom: 2rem;
}

.absatz.galerie {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

.absatz.galerie figure {
  width: 50%;
  overflow: hidden;
  border-width: 2px;
  border-color: transparent;
}

figure.bild figcaption, figure.video figcaption, figure.podcast-episode figcaption, .absatz.galerie div {
  margin-top: -1px;
  padding-top: 0.25rem;
  padding-right: 0.25rem;
  text-align: right;
  font-size: 0.875rem;
  line-height: 1.25rem;
  line-height: 1rem;
  --tw-text-opacity: 1;
  color: rgba(0, 0, 0, var(--tw-text-opacity));
  --tw-text-opacity: 0.4;
}

figure.bild figcaption:hover, figure.video figcaption:hover, figure.podcast-episode figcaption:hover, .absatz.galerie div:hover {
  --tw-text-opacity: 0.7;
}

@media (min-width: 640px) {
  figure.bild figcaption, figure.video figcaption, figure.podcast-episode figcaption, .absatz.galerie div {
    padding-right: 0px;
  }
}

figure.bild.heiligenportrait figcaption {
  margin-left: auto;
  margin-right: auto;
  width: 91.666667%;
}

@media (min-width: 640px) {
  figure.bild.heiligenportrait figcaption {
    width: 83.333333%;
  }
}

@media (min-width: 1024px) {
  figure.bild.heiligenportrait figcaption {
    width: 80%;
  }
}

@media (min-width: 1280px) {
  figure.bild.heiligenportrait figcaption {
    width: 66.666667%;
  }
}

#main.video figure.bild figcaption, #main.video figure.video figcaption, #main.video .absatz.galerie div, #main.stundenbuch figure.bild figcaption, #main.stundenbuch figure.video figcaption, #main.stundenbuch .absatz.galerie div {
  --tw-text-opacity: 1;
  color: rgba(255, 255, 255, var(--tw-text-opacity));
  --tw-text-opacity: 0.4;
}

#main.video figure.bild figcaption:hover, #main.video figure.video figcaption:hover, #main.video .absatz.galerie div:hover, #main.stundenbuch figure.bild figcaption:hover, #main.stundenbuch figure.video figcaption:hover, #main.stundenbuch .absatz.galerie div:hover {
  --tw-text-opacity: 0.7;
}

#main.stundenbuch.bg-litlightweiss figure.bild figcaption, #main.stundenbuch.bg-litlightweiss figure.video figcaption, #main.stundenbuch.bg-litlightweiss .absatz.galerie div {
  --tw-text-opacity: 1;
  color: rgba(0, 0, 0, var(--tw-text-opacity));
  --tw-text-opacity: 0.4;
}

#main.stundenbuch.bg-litlightweiss figure.bild figcaption:hover, #main.stundenbuch.bg-litlightweiss figure.video figcaption:hover, #main.stundenbuch.bg-litlightweiss .absatz.galerie div:hover {
  --tw-text-opacity: 0.7;
}

 figure.podcast-episode figcaption {
  padding-top: 0px;
}

.absatz.galerie div {
  width: 100%;
}

.absatz.zitat blockquote p {
  margin-bottom: -0.75rem;
  padding-left: 1.75rem;
  padding-right: 1.75rem;
  font-family: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
  font-size: 2.25rem;
  line-height: 2.5rem;
  font-style: italic;
}

.absatz.zitat blockquote footer {
  padding-left: 1.75rem;
  padding-right: 1.75rem;
  text-align: right;
  font-size: 1rem;
  line-height: 1.5rem;
  --tw-text-opacity: 1;
  color: rgba(136, 136, 136, var(--tw-text-opacity));
}

.absatz.lexikon, .absatz.dossier, .absatz.show {
  margin-left: auto;
  margin-right: auto;
  width: 50%;
}

/* Artikel-Footer */

#articlefooter article.tags {
  grid-column: span 12 / span 12;
  margin-bottom: 0px;
  border-top-width: 2px;
  --tw-border-opacity: 1;
  border-color: rgba(156, 15, 22, var(--tw-border-opacity));
  --tw-bg-opacity: 1;
  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
  padding-left: 1.75rem;
  padding-right: 1.75rem;
  padding-top: 1.25rem;
  padding-bottom: 1.75rem;
  --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

@media (min-width: 1280px) {
  #articlefooter article.tags {
    grid-column: span 10 / span 10;
    grid-column-start: 2;
    margin-bottom: 1.75rem;
  }
}

@media (min-width: 1536px) {
  #articlefooter article.tags {
    grid-column: span 7 / span 7;
    grid-column-start: 2;
  }
}

#main.video #articlefooter article.tags {
  grid-column: span 12 / span 12;
  margin-bottom: 0px;
  border-top-width: 2px;
  --tw-border-opacity: 1;
  border-color: rgba(156, 15, 22, var(--tw-border-opacity));
  --tw-bg-opacity: 1;
  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
  padding-left: 1.75rem;
  padding-right: 1.75rem;
  padding-top: 1.25rem;
  padding-bottom: 1.75rem;
  --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

@media (min-width: 1280px) {
  #main.video #articlefooter article.tags {
    grid-column: span 10 / span 10;
    grid-column-start: 2;
    margin-bottom: 1.75rem;
  }
}

@media (min-width: 1536px) {
  #main.video #articlefooter article.tags {
    grid-column: span 10 / span 10;
    grid-column-start: 2;
  }
}

#main.podcast-episode #articlefooter article.tags {
  grid-column: span 12 / span 12;
  margin-bottom: 0px;
  border-top-width: 2px;
  --tw-border-opacity: 1;
  border-color: rgba(156, 15, 22, var(--tw-border-opacity));
  --tw-bg-opacity: 1;
  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
  padding-left: 1.75rem;
  padding-right: 1.75rem;
  padding-top: 1.25rem;
  padding-bottom: 1.75rem;
  --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

@media (min-width: 1280px) {
  #main.podcast-episode #articlefooter article.tags {
    margin-bottom: 1.75rem;
  }
}

#main.heilige #articlefooter article.tags, #main.bibel #articlefooter article.tags {
  margin-bottom: 0px;
  border-top-width: 2px;
  --tw-border-opacity: 1;
  border-color: rgba(156, 15, 22, var(--tw-border-opacity));
  --tw-bg-opacity: 1;
  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
  padding-left: 1.75rem;
  padding-right: 1.75rem;
  padding-top: 1.25rem;
  padding-bottom: 1.75rem;
  --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

@media (min-width: 1280px) {
  #main.heilige #articlefooter article.tags, #main.bibel #articlefooter article.tags {
    grid-column: span 12 / span 12;
    grid-column-start: 1;
    margin-bottom: 1.75rem;
  }
}

@media (min-width: 1536px) {
  #main.heilige #articlefooter article.tags, #main.bibel #articlefooter article.tags {
    grid-column: span 12 / span 12;
    grid-column-start: 1;
  }
}

#main.heiligenportrait #articlefooter article.tags {
  margin-bottom: 0px;
  border-top-width: 2px;
  --tw-border-opacity: 1;
  border-color: rgba(156, 15, 22, var(--tw-border-opacity));
  --tw-bg-opacity: 1;
  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
  padding-left: 1.75rem;
  padding-right: 1.75rem;
  padding-top: 1.25rem;
  padding-bottom: 1.75rem;
  --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

@media (min-width: 1280px) {
  #main.heiligenportrait #articlefooter article.tags {
    grid-column: span 12 / span 12;
    grid-column-start: 1;
    margin-bottom: 1.75rem;
  }
}

@media (min-width: 1536px) {
  #main.heiligenportrait #articlefooter article.tags {
    grid-column: span 10 / span 10;
    grid-column-start: 2;
  }
}

#main.lexikoneintrag #articlefooter article.tags {
  grid-column: span 12 / span 12;
  grid-column-start: 1;
  margin-bottom: 0px;
  border-top-width: 2px;
  --tw-border-opacity: 1;
  border-color: rgba(156, 15, 22, var(--tw-border-opacity));
  --tw-bg-opacity: 1;
  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
  padding-left: 1.75rem;
  padding-right: 1.75rem;
  padding-top: 1.25rem;
  padding-bottom: 1.75rem;
  --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

@media (min-width: 1280px) {
  #main.lexikoneintrag #articlefooter article.tags {
    margin-bottom: 1.75rem;
  }
}

#main.termine #articlefooter article.tags {
  margin-bottom: 0px;
  border-top-width: 2px;
  --tw-border-opacity: 1;
  border-color: rgba(156, 15, 22, var(--tw-border-opacity));
  --tw-bg-opacity: 1;
  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
  padding-left: 1.75rem;
  padding-right: 1.75rem;
  padding-top: 1.25rem;
  padding-bottom: 1.75rem;
  --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

@media (min-width: 1280px) {
  #main.termine #articlefooter article.tags {
    grid-column: span 8 / span 8;
    grid-column-start: 2;
    margin-bottom: 1.75rem;
  }
}

@media (min-width: 1536px) {
  #main.termine #articlefooter article.tags {
    grid-column: span 6 / span 6;
    grid-column-start: 3;
  }
}

#articlefooter article.tags h3 {
  padding-bottom: 0.75rem;
  font-size: 1.25rem;
  line-height: 1.75rem;
  font-weight: 600;
}

#articlefooter article.tags ul {
  display: flex;
  flex-wrap: wrap;
  font-size: 0.875rem;
  line-height: 1.25rem;
  --tw-text-opacity: 1;
  color: rgba(72, 72, 72, var(--tw-text-opacity));
}

#articlefooter article.tags ul li {
  margin-right: 0.75rem;
}

#articlefooter article.tags ul li:hover {
  --tw-text-opacity: 1;
  color: rgba(0, 0, 0, var(--tw-text-opacity));
}

/* Galerie-Modals */

.g-modal {
  position: fixed;
  top: 0px;
  right: 0px;
  bottom: 0px;
  left: 0px;
  height: 100%;
  width: 100%;
  cursor: pointer;
  align-items: flex-start;
  overflow-y: auto;
  --tw-bg-opacity: 1;
  background-color: rgba(38, 38, 38, var(--tw-bg-opacity));
  --tw-bg-opacity: 1;
}

@media (min-width: 1024px) {
  .g-modal {
    align-items: center;
    --tw-bg-opacity: 0.8;
  }
}

.g-modal {
  z-index: 500;
}

.g-modal img {
  margin-top: 3.5rem;
  width: 100%;
}

@media (min-width: 1024px) {
  .g-modal img {
    margin-left: auto;
    margin-right: auto;
    margin-top: 0px;
    width: 91.666667%;
  }
}

@media (min-width: 1280px) {
  .g-modal img {
    width: 83.333333%;
  }
}

@media (min-width: 1536px) {
  .g-modal img {
    width: 80%;
  }
}

.g-modal figcaption {
  position: absolute;
  bottom: 5rem;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
}

@media (min-width: 1280px) {
  .g-modal figcaption {
    bottom: 2.5rem;
  }
}

@media (min-width: 1536px) {
  .g-modal figcaption {
    bottom: 1.25rem;
  }
}

.g-modal figcaption p {
  grid-column: span 12 / span 12;
  margin-top: 0.25rem;
  border-top-width: 2px;
  --tw-border-opacity: 1;
  border-color: rgba(156, 15, 22, var(--tw-border-opacity));
  --tw-bg-opacity: 1;
  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
}

.g-modal figcaption p:hover {
  --tw-bg-opacity: 1;
  background-color: rgba(247, 247, 247, var(--tw-bg-opacity));
}

.g-modal figcaption p {
  padding-left: 1.25rem;
  padding-right: 1.25rem;
  padding-top: 0.75rem;
  padding-bottom: 1.25rem;
  font-size: 1rem;
  line-height: 1.5rem;
  line-height: 1.25rem;
  --tw-text-opacity: 1;
  color: rgba(52, 52, 52, var(--tw-text-opacity));
}

.g-modal figcaption p:hover {
  --tw-text-opacity: 1;
  color: rgba(38, 38, 38, var(--tw-text-opacity));
}

.g-modal figcaption p {
  --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

@media (min-width: 1024px) {
  .g-modal figcaption p {
    grid-column: span 10 / span 10;
    grid-column-start: 2;
  }
}

@media (min-width: 1280px) {
  .g-modal figcaption p {
    grid-column: span 8 / span 8;
    grid-column-start: 3;
  }
}

@media (min-width: 1536px) {
  .g-modal figcaption p {
    grid-column: span 6 / span 6;
    grid-column-start: 4;
  }
}

.g-modal figcaption .bilderzaehler {
  grid-column: span 1 / span 1;
  padding-top: 0.25rem;
  padding-left: 0.5rem;
  text-align: left;
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 600;
  line-height: 1rem;
  --tw-text-opacity: 1;
  color: rgba(255, 255, 255, var(--tw-text-opacity));
}

@media (min-width: 1024px) {
  .g-modal figcaption .bilderzaehler {
    grid-column-start: 2;
    padding-left: 0px;
  }
}

@media (min-width: 1280px) {
  .g-modal figcaption .bilderzaehler {
    grid-column-start: 3;
  }
}

@media (min-width: 1536px) {
  .g-modal figcaption .bilderzaehler {
    grid-column-start: 4;
  }
}

.g-modal figcaption .bilderquelle {
  grid-column: span 11 / span 11;
  padding-top: 0.25rem;
  padding-right: 0.5rem;
  text-align: right;
  font-size: 0.875rem;
  line-height: 1.25rem;
  line-height: 1rem;
  --tw-text-opacity: 1;
  color: rgba(255, 255, 255, var(--tw-text-opacity));
  --tw-text-opacity: 0.8;
}

.g-modal figcaption .bilderquelle:hover {
  --tw-text-opacity: 1;
}

@media (min-width: 1024px) {
  .g-modal figcaption .bilderquelle {
    grid-column: span 9 / span 9;
    padding-right: 0px;
  }
}

@media (min-width: 1280px) {
  .g-modal figcaption .bilderquelle {
    grid-column: span 7 / span 7;
  }
}

@media (min-width: 1536px) {
  .g-modal figcaption .bilderquelle {
    grid-column: span 5 / span 5;
  }
}

.g-modal figcaption button.previous {
  position: fixed;
  right: 0px;
  bottom: 0px;
  display: flex;
  height: 4rem;
  width: 4rem;
  align-items: center;
  justify-content: center;
  --tw-bg-opacity: 1;
  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgba(0, 0, 0, var(--tw-text-opacity));
}

.g-modal figcaption button.next {
  position: fixed;
  right: 0px;
  bottom: 0px;
  margin-right: 4rem;
  display: flex;
  height: 4rem;
  width: 4rem;
  align-items: center;
  justify-content: center;
  border-right-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgba(170, 170, 170, var(--tw-border-opacity));
  --tw-bg-opacity: 1;
  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgba(0, 0, 0, var(--tw-text-opacity));
}

/* Laexikon-Navigation */

#lexikonnav {
  grid-column: span 12 / span 12;
  margin-top: -1.25rem;
  display: flex;
  height: 12rem;
  flex-wrap: wrap;
  justify-content: center;
  overflow: visible;
  border-bottom-width: 2px;
  border-color: transparent;
  --tw-bg-opacity: 1;
  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
  --tw-bg-opacity: 0.2;
  padding-top: 1rem;
  padding-bottom: 1rem;
}

@media (min-width: 640px) {
  #lexikonnav {
    height: 5rem;
    flex-wrap: nowrap;
  }
}

@media (min-width: 1024px) {
  #lexikonnav {
    margin-top: 0px;
    --tw-border-opacity: 1;
    border-color: rgba(238, 238, 238, var(--tw-border-opacity));
    background-color: transparent;
    padding-top: 0px;
  }
}

@media (min-width: 1280px) {
  #lexikonnav {
    margin-top: 1.25rem;
  }
}

@media (min-width: 1536px) {
  #lexikonnav {
    width: 100%;
  }

  @media (min-width: 640px) {
    #lexikonnav {
      max-width: 640px;
    }
  }

  @media (min-width: 768px) {
    #lexikonnav {
      max-width: 768px;
    }
  }

  @media (min-width: 1024px) {
    #lexikonnav {
      max-width: 1024px;
    }
  }

  @media (min-width: 1280px) {
    #lexikonnav {
      max-width: 1280px;
    }
  }

  @media (min-width: 1536px) {
    #lexikonnav {
      max-width: 1536px;
    }
  }

  #lexikonnav {
    margin-left: auto;
    margin-right: auto;
  }
}

@media screen and (max-width: 383.98px) {
  #lexikonnav {
    display: none;
  }
}

#main.lexikon #lexikonnav {
  display: none;
}

@media (min-width: 640px) {
  #main.lexikon #lexikonnav {
    display: flex;
  }
}

#lexikonnav a {
  display: flex;
  width: 4rem;
  flex: 0 1 auto;
  align-items: center;
  justify-content: center;
  font-size: 1.875rem;
  line-height: 2.25rem;
}

@media (min-width: 640px) {
  #lexikonnav a {
    width: 100%;
    flex: 1 1 0%;
    font-size: 1.5rem;
    line-height: 2rem;
  }
}

@media (min-width: 1024px) {
  #lexikonnav a {
    font-size: 1.25rem;
    line-height: 1.75rem;
  }
}

#lexikonnav a.active, #lexikonnav a.active:hover {
  font-size: 1.875rem;
  line-height: 2.25rem;
  font-weight: 700;
}

@media (min-width: 640px) {
  #lexikonnav a.active, #lexikonnav a.active:hover {
    font-size: 2.25rem;
    line-height: 2.5rem;
    font-weight: 600;
  }
}

@media (min-width: 768px) {
  #lexikonnav a.active, #lexikonnav a.active:hover {
    font-size: 3rem;
    line-height: 1;
    font-weight: 400;
  }
}

@media (min-width: 1024px) {
  #lexikonnav a.active, #lexikonnav a.active:hover {
    font-size: 4.5rem;
    line-height: 1;
  }
}

@media (min-width: 1280px) {
  #lexikonnav a.active, #lexikonnav a.active:hover {
    font-size: 8rem;
    line-height: 1;
  }
}

#lexikonnav a:hover {
  font-size: 1.875rem;
  line-height: 2.25rem;
  font-weight: 600;
}

@media (min-width: 640px) {
  #lexikonnav a:hover {
    font-size: 1.875rem;
    line-height: 2.25rem;
  }
}

@media (min-width: 768px) {
  #lexikonnav a:hover {
    font-size: 2.25rem;
    line-height: 2.5rem;
    font-weight: 400;
  }
}

@media (min-width: 1024px) {
  #lexikonnav a:hover {
    font-size: 3.75rem;
    line-height: 1;
  }
}

@media (min-width: 1280px) {
  #lexikonnav a:hover {
    font-size: 6rem;
    line-height: 1;
  }
}

/* Widgets */

.widget {
  grid-column: span 1 / span 1;
  margin-bottom: 1.25rem;
  height: auto;
  width: 100%;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  font-size: 1rem;
  line-height: 1.5rem;
}

@media (min-width: 640px) {
  .widget {
    padding-left: 0px;
    padding-right: 0px;
  }
}

.widget.direktsuche, .widget.bibelstelle, .widget.buchverzeichnis {
  grid-column: span 1 / span 1;
  height: auto;
}

@media (min-width: 768px) {
  .widget.direktsuche, .widget.bibelstelle, .widget.buchverzeichnis {
    grid-column: span 2 / span 2;
  }
}

.widget.bibelstelle {
  margin-bottom: 0.75rem;
}

.widget.bibelstelle nav {
  grid-column: span 6 / span 6;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
  border-top-width: 2px;
  --tw-border-opacity: 1;
  border-color: rgba(156, 15, 22, var(--tw-border-opacity));
  --tw-bg-opacity: 1;
  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
  padding: 0.75rem;
  --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

@media (min-width: 640px) {
  .widget.bibelstelle nav {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
}

.widget.bibelstelle nav form {
  grid-column: span 2 / span 2;
  display: flex;
  flex-direction: column;
  font-size: 1rem;
  line-height: 1.5rem;
}

.widget.bibelstelle nav form label {
  padding-bottom: 0.75rem;
  font-weight: 600;
  --tw-text-opacity: 1;
  color: rgba(156, 15, 22, var(--tw-text-opacity));
}

.widget.bibelstelle nav form select {
  border-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgba(205, 205, 205, var(--tw-border-opacity));
  padding: 0.5rem;
}

#main.bibel header.widget.bibelstelle nav {
  margin-top: 1rem;
  border-style: none;
  --tw-bg-opacity: 1;
  background-color: rgba(221, 221, 221, var(--tw-bg-opacity));
  --tw-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, 0.06);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

#main.bibel header.widget.bibelstelle nav form label {
  padding-bottom: 0.75rem;
  font-size: 1.5rem;
  line-height: 2rem;
  font-weight: 300;
  line-height: 1.75rem;
  --tw-text-opacity: 1;
  color: rgba(72, 72, 72, var(--tw-text-opacity));
}

.widget.veranstaltungstypen {
  grid-column: span 1 / span 1;
  height: auto;
}

@media (min-width: 640px) {
  .widget.veranstaltungstypen {
    grid-column: span 2 / span 2;
  }
}

@media (min-width: 1024px) {
  .widget.veranstaltungstypen {
    grid-column: span 1 / span 1;
  }
}

@media (min-width: 1280px) {
  .widget.veranstaltungstypen {
    grid-column: span 2 / span 2;
  }
}

.widget.veranstaltungstypen h1 {
  margin-top: -0.25rem;
  padding-bottom: 0.75rem;
  font-size: 1.875rem;
  line-height: 2.25rem;
  font-weight: 600;
}

.widget.veranstaltungstypen #terminenav > :not([hidden]) ~ :not([hidden]) {
  --tw-space-x-reverse: 0;
  margin-right: calc(0.25rem * var(--tw-space-x-reverse));
  margin-left: calc(0.25rem * calc(1 - var(--tw-space-x-reverse)));
  --tw-space-y-reverse: 0;
  margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));
}

.widget.veranstaltungstypen #terminenav {
  padding-left: 1.75rem;
  padding-right: 1.75rem;
  padding-top: 1.25rem;
  padding-bottom: 1.25rem;
  text-align: center;
}

@media (min-width: 1280px) {
  .widget.veranstaltungstypen #terminenav {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
  }
}

.widget.veranstaltungstypen #terminenav button {
  border-radius: 9999px;
  border-width: 2px;
  --tw-border-opacity: 1;
  border-color: rgba(255, 255, 255, var(--tw-border-opacity));
}

.widget.veranstaltungstypen #terminenav button:hover {
  --tw-border-opacity: 1;
  border-color: rgba(205, 205, 205, var(--tw-border-opacity));
}

.widget.veranstaltungstypen #terminenav button {
  --tw-bg-opacity: 1;
  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
}

.widget.veranstaltungstypen #terminenav button:hover {
  --tw-bg-opacity: 1;
  background-color: rgba(247, 247, 247, var(--tw-bg-opacity));
}

.widget.veranstaltungstypen #terminenav button {
  padding-left: 1rem;
  padding-right: 1rem;
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
  font-size: 0.875rem;
  line-height: 1.25rem;
  --tw-text-opacity: 1;
  color: rgba(72, 72, 72, var(--tw-text-opacity));
  --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.widget.veranstaltungstypen #terminenav button:hover {
  --tw-shadow: 0 0 #0000;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.widget.veranstaltungstypen #terminenav button.active {
  --tw-border-opacity: 1;
  border-color: rgba(156, 15, 22, var(--tw-border-opacity));
}

.widget.veranstaltungstypen #terminenav button.active:hover {
  --tw-border-opacity: 1;
  border-color: rgba(136, 136, 136, var(--tw-border-opacity));
}

.widget.veranstaltungstypen #terminenav button.active {
  --tw-text-opacity: 1;
  color: rgba(156, 15, 22, var(--tw-text-opacity));
}

.widget.veranstaltungstypen #terminenav button.active:hover {
  --tw-text-opacity: 1;
  color: rgba(72, 72, 72, var(--tw-text-opacity));
  --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.widget.festkreis div {
  margin-top: 0.75rem;
  margin-bottom: 1.25rem;
  border-left-width: 2px;
  --tw-border-opacity: 1;
  border-color: rgba(247, 247, 247, var(--tw-border-opacity));
  padding-left: 0.75rem;
  --tw-text-opacity: 1;
  color: rgba(255, 255, 255, var(--tw-text-opacity));
}

.bg-litlightweiss .widget.festkreis div {
  --tw-border-opacity: 1;
  border-color: rgba(0, 0, 0, var(--tw-border-opacity));
  --tw-text-opacity: 1;
  color: rgba(0, 0, 0, var(--tw-text-opacity));
}

.widget.festkreis div h3 {
  padding-bottom: 0.25rem;
  font-size: 1.5rem;
  line-height: 2rem;
  font-weight: 500;
}

.widget.festkreis div h4 {
  padding-bottom: 0.5rem;
  font-style: italic;
  --tw-text-opacity: 1;
  color: rgba(255, 255, 255, var(--tw-text-opacity));
  --tw-text-opacity: 0.7;
}

.widget.festkreis div h4:hover {
  --tw-text-opacity: 0.5;
}

.widget.festkreis div h4 {
  text-decoration: underline;
}

.bg-litlightweiss .widget.festkreis div h4 {
  --tw-text-opacity: 1;
  color: rgba(0, 0, 0, var(--tw-text-opacity));
}

.widget.festkreis div span {
  font-style: italic;
  --tw-text-opacity: 1;
  color: rgba(255, 255, 255, var(--tw-text-opacity));
  --tw-text-opacity: 0.7;
}

.bg-litlightweiss .widget.festkreis div span {
  --tw-text-opacity: 1;
  color: rgba(0, 0, 0, var(--tw-text-opacity));
}

.widget.tagesliturgie {
  margin-top: 2rem;
  display: none;
  padding-top: 1px;
}

@media (min-width: 1024px) {
  .widget.tagesliturgie {
    display: block;
  }
}

.widget.tagesliturgie h2 {
  margin-bottom: 0.75rem;
}

.widget.tagesliturgie div {
  margin-top: 1px;
  height: 100%;
  border-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgba(255, 255, 255, var(--tw-border-opacity));
  padding-left: 1.5rem;
  padding-right: 1.5rem;
  padding-top: 1.25rem;
  padding-bottom: 1.75rem;
  font-size: 1.25rem;
  line-height: 1.75rem;
  font-weight: 600;
  line-height: 1.5rem;
  --tw-text-opacity: 1;
  color: rgba(255, 255, 255, var(--tw-text-opacity));
}

.widget.tagesliturgie div a:hover {
  opacity: 0.8;
}

.widget.tagesliturgie div a.lesung, .widget.tagesliturgie div a.antwortpsalm, .widget.tagesliturgie div a.evangelium {
  margin-right: 1px;
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 300;
  font-style: italic;
}

.widget.tagesliturgie div ul {
  margin-top: 1rem;
  margin-bottom: 0.75rem;
  font-size: 1.25rem;
  line-height: 1.75rem;
  font-weight: 600;
  line-height: 1rem;
}

.widget.tagesliturgie div ul li {
  margin-bottom: 2rem
}

.widget.tagesliturgie div ul li:last-of-type {
  margin-bottom: 0px
}

.widget.bibelquelle {
  grid-column: span 1 / span 1;
  margin-bottom: -1rem;
  text-align: right;
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 300;
}

@media (min-width: 768px) {
  .widget.bibelquelle {
    grid-column: span 2 / span 2;
  }
}

.widget.bibelquelle a {
  --tw-text-opacity: 1;
  color: rgba(156, 15, 22, var(--tw-text-opacity));
}

.widget.buchverzeichnis {
  margin-bottom: 0px;
}

.widget.buchverzeichnis article {
  position: relative;
  margin-top: 0.75rem;
  cursor: pointer;
  --tw-bg-opacity: 1;
  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
  padding: 0.75rem;
  --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.widget.buchverzeichnis article svg {
  position: absolute;
  top: 0.75rem;
  right: 0.75rem;
  --tw-text-opacity: 1;
  color: rgba(156, 15, 22, var(--tw-text-opacity));
}

.widget.buchverzeichnis article svg:hover {
  --tw-text-opacity: 1;
  color: rgba(0, 0, 0, var(--tw-text-opacity));
}

.widget.buchverzeichnis article h4 {
  padding-bottom: 0.75rem;
  font-size: 1.25rem;
  line-height: 1.75rem;
  font-weight: 600;
  line-height: 1.25rem;
  --tw-text-opacity: 1;
  color: rgba(52, 52, 52, var(--tw-text-opacity));
}

.widget.buchverzeichnis article h4:hover {
  --tw-text-opacity: 1;
  color: rgba(0, 0, 0, var(--tw-text-opacity));
}

.widget.buchverzeichnis article ul {
  width: 100%;
  font-family: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
  line-height: 1.75rem;
}

.widget.buchverzeichnis article ul li {
  width: 100%;
  background-color: transparent;
}

.widget.buchverzeichnis article ul li:hover {
  --tw-bg-opacity: 1;
  background-color: rgba(221, 221, 221, var(--tw-bg-opacity));
}

.widget.buchverzeichnis article ul li {
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  --tw-text-opacity: 1;
  color: rgba(156, 15, 22, var(--tw-text-opacity));
  --tw-shadow: 0 0 #0000;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.widget.buchverzeichnis article ul li:hover {
  --tw-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, 0.06);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.widget.buchverzeichnis article ul li span {
  --tw-text-opacity: 1;
  color: rgba(0, 0, 0, var(--tw-text-opacity));
}

.widget.previousundnext {
  grid-column: span 1 / span 1;
  display: flex;
  flex-direction: row;
}

@media (min-width: 768px) {
  .widget.previousundnext {
    grid-column: span 2 / span 2;
  }
}

.widget.previousundnext a {
  width: 33.333333%;
  flex: 1 1 0%;
  text-align: justify;
  font-size: 3.75rem;
  line-height: 1;
  --tw-text-opacity: 1;
  color: rgba(97, 97, 97, var(--tw-text-opacity));
}

.widget.previousundnext a:hover {
  --tw-text-opacity: 1;
  color: rgba(0, 0, 0, var(--tw-text-opacity));
}

.widget.previousundnext a span {
  font-size: 2.25rem;
  line-height: 2.5rem;
  --tw-text-opacity: 1;
  color: rgba(156, 15, 22, var(--tw-text-opacity));
}

.widget.previousundnext a:hover span {
  --tw-text-opacity: 1;
  color: rgba(0, 0, 0, var(--tw-text-opacity));
}

.widget.previousundnext a.active {
  text-align: center;
  --tw-text-opacity: 1;
  color: rgba(170, 170, 170, var(--tw-text-opacity));
}

.widget.previousundnext a:last-of-type {
  text-align: right;
}

.widget h2 {
  padding-top: 0.75rem;
}

@media (min-width: 768px) {
  .widget h2 {
    padding-top: 0px;
  }
}

.widget p {
  font-size: 1rem;
  line-height: 1.5rem;
  line-height: 1.375;
}

.widget.direktsuche form {
  display: flex;
  flex-wrap: wrap;
  border-top-width: 2px;
  --tw-border-opacity: 1;
  border-color: rgba(156, 15, 22, var(--tw-border-opacity));
  --tw-bg-opacity: 1;
  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
  padding-left: 1.25rem;
  padding-right: 1.25rem;
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
  --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.widget.direktsuche form label {
  margin-top: auto;
  margin-bottom: auto;
  margin-right: auto;
  font-weight: 600;
  --tw-text-opacity: 1;
  color: rgba(156, 15, 22, var(--tw-text-opacity));
}

.widget.direktsuche form input {
  margin-top: auto;
  margin-bottom: auto;
  height: 2rem;
  width: 75%;
  border-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgba(221, 221, 221, var(--tw-border-opacity));
  padding-left: 0.25rem;
}

.widget.direktsuche form button {
  margin-top: auto;
  margin-bottom: auto;
  margin-left: auto;
}

.widget.direktsuche form button svg {
  height: 1.25rem;
  width: 1.25rem;
}

#artikel .widget.absatz.tagesheilige {
  margin-top: -0.75rem;
  margin-bottom: -0.75rem;
  display: none;
}

@media (min-width: 768px) {
  #artikel .widget.absatz.tagesheilige {
    display: block;
  }
}

@media (min-width: 1024px) {
  #artikel .widget.absatz.tagesheilige {
    margin-top: -0.5rem;
    margin-bottom: -0.5rem;
  }
}

@media (min-width: 1280px) {
  #artikel .widget.absatz.tagesheilige {
    margin-top: 0px;
    margin-bottom: 0px;
  }
}

#artikel .widget.absatz.tagesheilige h2 {
  margin-top: 3rem;
  padding-bottom: 0.25rem;
  font-size: 1.5rem;
  line-height: 2rem;
  font-weight: 300;
  line-height: 1.75rem;
  --tw-text-opacity: 1;
  color: rgba(72, 72, 72, var(--tw-text-opacity));
}

#artikel .widget.absatz.tagesheilige ul {
  margin-top: 0px;
  list-style-type: none;
  padding-bottom: 0.75rem;
  padding-left: 0px;
}

#artikel .widget.absatz.tagesheilige ul li {
  padding-top: 0px;
  padding-bottom: 0px;
}

#artikel .widget.absatz.tagesheilige ul a {
  --tw-text-opacity: 1;
  color: rgba(72, 72, 72, var(--tw-text-opacity));
  text-decoration: none;
}

#artikel .widget.absatz.tagesheilige ul a:hover {
  --tw-bg-opacity: 1;
  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgba(0, 0, 0, var(--tw-text-opacity));
  text-decoration: none;
}

.widget.previousentries h2 {
  text-align: center;
}

@media (min-width: 768px) {
  .widget.previousentries h2 {
    text-align: left;
  }
}

.widget.nextentries h2 {
  text-align: center;
}

@media (min-width: 768px) {
  .widget.nextentries h2 {
    text-align: right;
  }
}

.widget.tagesheilige h2 time, .widget.previousentries h2 span, .widget.nextentries h2 span {
  font-weight: 600;
  --tw-text-opacity: 1;
  color: rgba(156, 15, 22, var(--tw-text-opacity));
}

.widget.tagesheilige ul .cardbody, .widget.previousentries ul .cardbody, .widget.nextentries ul .cardbody {
  position: relative;
  margin-top: 0.75rem;
  display: block;
  height: auto;
  width: auto;
  --tw-bg-opacity: 1;
  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
  padding-top: 2rem;
  padding-bottom: 1rem;
  --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.widget.tagesheilige ul .cardbody:hover, .widget.previousentries ul .cardbody:hover, .widget.nextentries ul .cardbody:hover {
  --tw-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.widget.tagesheilige ul .cardbody time, .widget.previousentries ul .cardbody span, .widget.nextentries ul .cardbody span {
  position: absolute;
  top: 0.5rem;
  left: 0px;
  z-index: 10;
  display: block;
  height: 1.25rem;
  --tw-bg-opacity: 1;
  background-color: rgba(156, 15, 22, var(--tw-bg-opacity));
  padding-left: 0.75rem;
  padding-right: 0.75rem;
  padding-top: 1px;
  padding-bottom: 1px;
  font-size: 0.75rem;
  line-height: 1rem;
  font-weight: 700;
  text-transform: uppercase;
  --tw-text-opacity: 1;
  color: rgba(255, 255, 255, var(--tw-text-opacity));
}

.widget.tagesheilige ul .cardbody h4, .widget.previousentries ul .cardbody h4, .widget.nextentries ul .cardbody h4 {
  padding-left: 0.75rem;
  padding-right: 0.75rem;
  font-size: 1.125rem;
  line-height: 1.75rem;
  font-weight: 600;
  line-height: 1;
  --tw-text-opacity: 1;
  color: rgba(52, 52, 52, var(--tw-text-opacity));
}

@media (min-width: 1024px) {
  .widget.tagesheilige ul .cardbody h4, .widget.previousentries ul .cardbody h4, .widget.nextentries ul .cardbody h4 {
    font-size: 1.25rem;
    line-height: 1.75rem;
    line-height: 1.25rem;
  }
}

.widget.tagesheilige ul .cardbody:hover h4, .widget.previousentries ul .cardbody:hover h4, .widget.nextentries ul .cardbody:hover h4 {
  --tw-text-opacity: 1;
  color: rgba(0, 0, 0, var(--tw-text-opacity));
}

/* Cards */

.card {
  grid-column: span 1 / span 1;
  margin-bottom: 1.25rem;
  display: flex;
  flex-direction: column;
  font-size: 1rem;
  line-height: 1.5rem;
}

@media (min-width: 1280px) {
  .card {
    margin-bottom: 1.75rem;
  }
}

.card.standpunkt, .card.events {
  margin-bottom: 0.5rem;
}

.card.termin {
  margin-bottom: 1rem;
}

#glaube #tagesliturgie #stundenbuch .card, #glaube #tagesliturgie #tagesheilige .card {
  position: relative;
  z-index: 10;
  margin-top: -1.25rem;
  margin-bottom: 0.5rem;
  height: auto;
  width: 100%;
  padding-left: 0.25rem;
  padding-right: 0.25rem;
  line-height: 1.25rem;
  --tw-text-opacity: 1;
  color: rgba(255, 255, 255, var(--tw-text-opacity));
}

@media (min-width: 640px) {
  #glaube #tagesliturgie #stundenbuch .card, #glaube #tagesliturgie #tagesheilige .card {
    margin-bottom: 1.25rem;
  }
}

@media (min-width: 1024px) {
  #glaube #tagesliturgie #stundenbuch .card, #glaube #tagesliturgie #tagesheilige .card {
    margin-top: 0px;
  }
}

@media (min-width: 1280px) {
  #glaube #tagesliturgie #stundenbuch .card, #glaube #tagesliturgie #tagesheilige .card {
    margin-bottom: 1.75rem;
    height: 100%;
    border-width: 1px;
    --tw-border-opacity: 1;
    border-color: rgba(255, 255, 255, var(--tw-border-opacity));
    --tw-bg-opacity: 1;
    background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
    --tw-bg-opacity: 0.1;
    padding-left: 0.75rem;
    padding-right: 0.75rem;
    --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
  }
}

#glaube #tagesliturgie.bg-litlightweiss #stundenbuch .card, #glaube #tagesliturgie.bg-litlightweiss #tagesheilige .card {
  --tw-border-opacity: 1;
  border-color: rgba(97, 97, 97, var(--tw-border-opacity));
}

.card.kalenderblatt {
  order: 1;
  grid-column: span 1 / span 1;
  padding: 0.75rem;
}

@media (min-width: 640px) {
  .card.kalenderblatt {
    grid-column: span 2 / span 2;
    padding: 0px;
  }
}

@media (min-width: 1024px) {
  .card.kalenderblatt {
    order: 2;
  }
}

.card a {
  position: relative;
  display: block;
  --tw-text-opacity: 1;
  color: rgba(52, 52, 52, var(--tw-text-opacity));
}

.card a:hover {
  --tw-text-opacity: 1;
  color: rgba(0, 0, 0, var(--tw-text-opacity));
}

.card a {
  --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.card a:hover {
  --tw-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.card a.cardurl {
  z-index: 40;
  height: 100%;
  --tw-bg-opacity: 1;
  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
  text-decoration: none !important;
}

.card.news a.cardurl {
  margin-right: 0px;
  height: auto;
}

@media (min-width: 1024px) {
  .card.news a.cardurl {
    margin-right: 1.25rem;
  }
}

#main.podcast-show .card.news a.cardurl {
  margin-right: 0px;
}

@media (min-width: 1024px) {
  #main.podcast-show .card.news a.cardurl {
    margin-right: 0px;
  }
}

@media (min-width: 1280px) {
  #main.podcast-show .card.news a.cardurl {
    margin-right: 1.25rem;
  }
}

#top .top1 .card a.cardurl, .card.kalenderblatt a.cardurl {
  z-index: 40;
  height: 100%;
  background-color: transparent;
  --tw-shadow: 0 0 #0000;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

#glaube #tagesliturgie #stundenbuch .card a.cardurl, #glaube #tagesliturgie #tagesheilige .card a.cardurl {
  z-index: 40;
  height: auto;
  background-color: transparent;
  --tw-shadow: 0 0 #0000;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.card.standpunkt a.cardurl {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

.card.dossier a.cardurl, .card.thema a.cardurl, .card.rubrik a.cardurl, .card.lexikon a.cardurl, .card.video a.cardurl, .card.video.serie a.cardurl, .card.index {
  border-top-width: 2px;
}

#thema #hubtext .card.thema a.cardurl {
  margin-left: -1.25rem;
  margin-right: -1.25rem;
  margin-top: 0.75rem;
  margin-bottom: -0.75rem;
  border-bottom-width: 1px;
  --tw-text-opacity: 1;
  color: rgba(0, 0, 0, var(--tw-text-opacity));
}

#thema #hubtext .card.thema a.cardurl:hover {
  --tw-text-opacity: 1;
  color: rgba(0, 0, 0, var(--tw-text-opacity));
}

#thema #hubtext .card.thema a.cardurl {
  --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

#thema #hubtext .card.thema a.cardurl:hover {
  --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.card.lexikon a.cardurl, .card.dossier a.cardurl, .card.thema a.cardurl, .card.rubrik a.cardurl, .card.index {
  --tw-border-opacity: 1;
  border-color: rgba(156, 15, 22, var(--tw-border-opacity));
}

.card.video a.cardurl {
  --tw-border-opacity: 1;
  border-color: rgba(38, 38, 38, var(--tw-border-opacity));
}

.card.serie a.cardurl {
  --tw-bg-opacity: 1;
  background-color: rgba(38, 38, 38, var(--tw-bg-opacity));
}

.card.serie a.cardurl:hover {
  --tw-bg-opacity: 1;
  background-color: rgba(0, 0, 0, var(--tw-bg-opacity));
}

.card.lexikon a.cardurl {
  --tw-bg-opacity: 1;
  background-color: rgba(238, 238, 238, var(--tw-bg-opacity));
}

.card.lexikon a.cardurl:hover {
  --tw-bg-opacity: 1;
  background-color: rgba(247, 247, 247, var(--tw-bg-opacity));
}

/* Cards Header */

.card a.cardurl header, #main.dossier header article header, #main.videoserie header article header {
  position: relative;
  height: auto;
  width: auto;
}

.card.standpunkt a.cardurl header {
  margin-left: auto;
  margin-right: auto;
  display: none;
  width: 0px;
  padding: 0px;
}

@media (min-width: 640px) {
  .card.standpunkt a.cardurl header {
    margin-left: 0px;
    margin-right: 0px;
    display: block;
    width: 16.666667%;
  }
}

@media (min-width: 1024px) {
  .card.standpunkt a.cardurl header {
    width: 25%;
  }
}

.card.news a.cardurl header {
  position: absolute;
  top: 0.75rem;
  right: 0px;
  z-index: 20;
  display: none;
  height: auto;
  width: 33.333333%;
  --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

@media (min-width: 1024px) {
  .card.news a.cardurl header {
    right: -1.25rem;
    display: block;
  }
}

#main.podcast-show .card.news a.cardurl header {
  display: none;
}

@media (min-width: 1024px) {
  #main.podcast-show .card.news a.cardurl header {
    display: none;
  }
}

@media (min-width: 1280px) {
  #main.podcast-show .card.news a.cardurl header {
    display: block;
  }
}

.card.dossier a.cardurl header, .card.thema a.cardurl header, .card.rubrik a.cardurl header, .card.video a.cardurl header {
  padding-bottom: 1rem;
}

.card a.cardurl header span, #main.dossier header article header span, #main.videoserie header article header span, #artikel div.einstieg .teaser span {
  position: absolute;
  z-index: 10;
  height: 1.25rem;
  padding-left: 0.75rem;
  padding-right: 0.75rem;
  padding-top: 1px;
  padding-bottom: 1px;
  font-size: 0.75rem;
  line-height: 1rem;
  font-weight: 700;
  text-transform: uppercase;
  --tw-text-opacity: 1;
  color: rgba(255, 255, 255, var(--tw-text-opacity));
}

#top .top1 .card a.cardurl header span, .card.kalenderblatt a.cardurl header span {
  bottom: 0px;
  left: 0px;
}

@media (min-width: 1024px) {
  #top .top1 .card a.cardurl header span, .card.kalenderblatt a.cardurl header span {
    bottom: 0.5rem;
    left: 1rem;
  }
}

@media (min-width: 1280px) {
  #top .top1 .card a.cardurl header span, .card.kalenderblatt a.cardurl header span {
    bottom: 1.25rem;
    left: 2.5rem;
  }
}

@media (min-width: 1536px) {
  #top .top1 .card a.cardurl header span, .card.kalenderblatt a.cardurl header span {
    bottom: 1.75rem;
    left: 4rem;
  }
}

.card a.cardurl header span svg, #main.dossier header article header span svg, #main.videoserie header article header span svg {
  margin-right: 0.25rem;
  display: inline;
  height: 1rem;
  width: 1rem;
}

.card.artikel a.cardurl header span, .card.news a.cardurl header span, .card.podcastcover a.cardurl header span {
  bottom: 0px;
  left: 0px;
  display: block;
  --tw-bg-opacity: 1;
  background-color: rgba(156, 15, 22, var(--tw-bg-opacity));
}

.card.dossier a.cardurl header span, #main.dossier header article header span, #main.videoserie header article header span {
  bottom: 0px;
  left: 0px;
  display: flex;
  width: 100%;
  flex-wrap: wrap;
  background-image: linear-gradient(to right, var(--tw-gradient-stops));
  --tw-gradient-from: #262626;
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(38, 38, 38, 0));
  --tw-gradient-to: #9c0f16;
}

.card.dossier a.cardurl header span i, .card.video a.cardurl header span i, #main.dossier header article header span i, #main.videoserie header article header span i {
  margin-left: auto;
  font-weight: 300;
  font-style: normal;
}

.card.termin a.cardurl header time {
  position: absolute;
  top: 0.5rem;
  left: 0px;
  z-index: 10;
  display: block;
  height: 1.25rem;
  --tw-bg-opacity: 1;
  background-color: rgba(156, 15, 22, var(--tw-bg-opacity));
  padding-left: 0.75rem;
  padding-right: 0.75rem;
  padding-top: 1px;
  padding-bottom: 1px;
  font-size: 0.75rem;
  line-height: 1rem;
  font-weight: 700;
  text-transform: uppercase;
  --tw-text-opacity: 1;
  color: rgba(255, 255, 255, var(--tw-text-opacity));
}

.card.termin a.cardurl header h3 {
  position: relative;
  padding-left: 0.75rem;
  padding-right: 0.75rem;
  padding-top: 2.25rem;
  text-align: left;
  font-size: 1.25rem;
  line-height: 1.75rem;
  font-weight: 600;
  line-height: 1.25rem;
}

.card.thema a.cardurl header span {
  bottom: 0px;
  left: 0px;
  display: flex;
  width: 100%;
  flex-wrap: wrap;
  background-image: linear-gradient(to right, var(--tw-gradient-stops));
  --tw-gradient-from: #9c0f16;
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(156, 15, 22, 0));
  --tw-gradient-to: #eeeeee;
}

.card.rubrik a.cardurl header span {
  bottom: 0px;
  left: 0px;
  display: block;
  width: 100%;
  --tw-bg-opacity: 1;
  background-color: rgba(156, 15, 22, var(--tw-bg-opacity));
  text-align: center;
}

.card.video a.cardurl header span {
  bottom: 0px;
  left: 0px;
  display: flex;
  width: 100%;
  flex-wrap: wrap;
  background-image: linear-gradient(to right, var(--tw-gradient-stops));
  --tw-gradient-from: #262626;
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(38, 38, 38, 0));
  --tw-gradient-to: #484848;
}

.card.video.serie a.cardurl header span, #main.videoserie header article header span {
  --tw-gradient-from: #000;
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(0, 0, 0, 0));
  --tw-gradient-to: #262626;
}

.card.podcastcover a.cardurl header span {
  --tw-bg-opacity: 1;
  background-color: rgba(52, 52, 52, var(--tw-bg-opacity));
}

.card.lexikon a.cardurl header span {
  top: 0.75rem;
  left: 0px;
  display: block;
  --tw-bg-opacity: 1;
  background-color: rgba(156, 15, 22, var(--tw-bg-opacity));
}

.card.show a.cardurl header span {
  position: relative;
  display: block;
  width: 100%;
  --tw-bg-opacity: 1;
  background-color: rgba(156, 15, 22, var(--tw-bg-opacity));
}

.card a.cardurl header .zoom, #artikel div.openerbild .zoom {
  height: 100%;
  overflow: hidden;
}

.card.podcast-episode a.cardurl header .zoom {
  border-width: 2px;
  --tw-border-opacity: 1;
  border-color: rgba(255, 255, 255, var(--tw-border-opacity));
}

.card a.cardurl header .zoom img, #artikel div.openerbild .zoom img {
  width: 100%;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  transform: translateX(var(--tw-translate-x)) translateY(var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  transition-property: background-color, border-color, color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;
  transition-property: background-color, border-color, color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
  transition-property: background-color, border-color, color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
  transition-duration: 500ms;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

.card a.cardurl:hover header .zoom img, #artikel div.openerbild .zoom:hover img {
  --tw-scale-x: 1.1;
  --tw-scale-y: 1.1;
}

.card.podcast-episode a.cardurl:hover header .zoom img {
  --tw-scale-x: 1;
  --tw-scale-y: 1;
}

 #glaube #bibel a.cardurl header .zoom, #glaube #heilige a.cardurl header .zoom {
  display: none;
}

@media (min-width: 768px) {
   #glaube #bibel a.cardurl header .zoom, #glaube #heilige a.cardurl header .zoom {
    display: block;
  }
}

.card.standpunkt a.cardurl header .standpunkt-autor {
  display: inline-block;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.card.standpunkt a.cardurl header .standpunkt-autor img {
  display: inline;
}

#glaube #tagesliturgie #stundenbuch .card header h3, #glaube #tagesliturgie #tagesheilige .card header h3 {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  text-align: left;
  font-size: 1.5rem;
  line-height: 2rem;
  font-weight: 600;
  line-height: 1.75rem;
  --tw-text-opacity: 1;
  color: rgba(255, 255, 255, var(--tw-text-opacity));
}

#glaube #tagesliturgie.bg-litlightweiss .card.kalenderblatt a.cardurl header span, #glaube #tagesliturgie.bg-litlightweiss #stundenbuch .card header h3, #glaube #tagesliturgie.bg-litlightweiss #tagesheilige .card header h3, #glaube #tagesliturgie.bg-litlightweiss #tagesheilige .card ul .cardbody time {
  --tw-text-opacity: 1;
  color: rgba(38, 38, 38, var(--tw-text-opacity));
}

#glaube #tagesliturgie #tagesheilige .card ul .cardbody {
  position: relative;
  height: auto;
  width: auto;
  padding-top: 0px;
  padding-bottom: 0.5rem;
}

@media (min-width: 1024px) {
  #glaube #tagesliturgie #tagesheilige .card ul .cardbody {
    padding-top: 2.5rem;
    padding-bottom: 1rem;
  }
}

#glaube #tagesliturgie #tagesheilige .card ul .cardbody time {
  position: absolute;
  top: 0.75rem;
  left: 0px;
  z-index: 10;
  display: none;
  height: 1.25rem;
  padding-left: 0.75rem;
  padding-right: 0.75rem;
  padding-top: 1px;
  padding-bottom: 1px;
  font-size: 0.75rem;
  line-height: 1rem;
  font-weight: 700;
  text-transform: uppercase;
  --tw-text-opacity: 1;
  color: rgba(255, 255, 255, var(--tw-text-opacity));
}

@media (min-width: 1024px) {
  #glaube #tagesliturgie #tagesheilige .card ul .cardbody time {
    display: block;
  }
}

#glaube #tagesliturgie #tagesheilige .card ul .cardbody h4 {
  font-size: 1.125rem;
  line-height: 1.75rem;
  font-weight: 600;
  line-height: 1;
  --tw-text-opacity: 1;
  color: rgba(255, 255, 255, var(--tw-text-opacity));
}

@media (min-width: 1024px) {
  #glaube #tagesliturgie #tagesheilige .card ul .cardbody h4 {
    font-size: 1.25rem;
    line-height: 1.75rem;
    line-height: 1.25rem;
  }
}

/* Cards Body */

.card a.cardurl .cardbody, #main.rubrik header article {
  position: relative;
  padding-left: 0.75rem;
  padding-right: 0.75rem;
  padding-top: 0.5rem;
  padding-bottom: 0.75rem;
}

#thema #hubtext .card.thema a.cardurl .cardbody {
  position: relative;
  padding-left: 1.25rem;
  padding-right: 1.25rem;
  padding-top: 0.75rem;
  padding-bottom: 1rem;
}

#main.dossier header article {
  position: relative;
  padding: 0px;
}

#top .top1 .card a.cardurl .cardbody, .card.kalenderblatt a.cardurl .cardbody {
  --tw-bg-opacity: 1;
  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
  padding-left: 1.25rem;
  padding-right: 1.25rem;
  --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

#top .top1 .card a.cardurl .cardbody:hover, .card.kalenderblatt a.cardurl .cardbody:hover {
  --tw-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

@media (min-width: 1024px) {
  #top .top1 .card a.cardurl .cardbody, .card.kalenderblatt a.cardurl .cardbody {
    margin-left: 1rem;
    margin-right: 1rem;
    margin-top: -0.5rem;
  }
}

@media (min-width: 1280px) {
  #top .top1 .card a.cardurl .cardbody, .card.kalenderblatt a.cardurl .cardbody {
    margin-left: 2.5rem;
    margin-right: 2.5rem;
    margin-top: -1.25rem;
  }
}

@media (min-width: 1536px) {
  #top .top1 .card a.cardurl .cardbody, .card.kalenderblatt a.cardurl .cardbody {
    margin-left: 4rem;
    margin-right: 4rem;
    margin-top: -1.75rem;
  }
}

.card.standpunkt a.cardurl .cardbody {
  width: 100%;
  padding-left: 0px;
  padding-right: 0px;
  padding-top: 0px;
  padding-bottom: 0px;
  text-align: center;
}

@media (min-width: 640px) {
  .card.standpunkt a.cardurl .cardbody {
    width: 83.333333%;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
    text-align: left;
  }
}

@media (min-width: 1024px) {
  .card.standpunkt a.cardurl .cardbody {
    width: 75%;
  }
}

@media (min-width: 1536px) {
  .card.standpunkt a.cardurl .cardbody {
    padding-left: 0px;
    padding-right: 0px;
  }
}

.card.news a.cardurl .cardbody {
  width: 100%;
}

@media (min-width: 1024px) {
  .card.news a.cardurl .cardbody {
    width: 66.666667%;
  }
}

.card.termin a.cardurl .cardbody address {
  font-weight: 300;
  --tw-text-opacity: 1;
  color: rgba(38, 38, 38, var(--tw-text-opacity));
}

#glaube #tagesliturgie #stundenbuch .card .cardbody, #glaube #tagesliturgie #tagesheilige .card .cardbody {
  margin-top: 1px;
  border-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgba(255, 255, 255, var(--tw-border-opacity));
  --tw-border-opacity: 0.4;
  --tw-bg-opacity: 1;
  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
  --tw-bg-opacity: 0.2;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  padding-bottom: 0.5rem;
  --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

@media (min-width: 1024px) {
  #glaube #tagesliturgie #stundenbuch .card .cardbody, #glaube #tagesliturgie #tagesheilige .card .cardbody {
    margin-top: 0.75rem;
  }
}

@media (min-width: 1280px) {
  #glaube #tagesliturgie #stundenbuch .card .cardbody, #glaube #tagesliturgie #tagesheilige .card .cardbody {
    padding-left: 0.75rem;
    padding-right: 0.75rem;
  }
}

#glaube #tagesliturgie.bg-litlightweiss #stundenbuch .card .cardbody {
  --tw-border-opacity: 1;
  border-color: rgba(233, 200, 86, var(--tw-border-opacity));
  --tw-bg-opacity: 1;
  background-color: rgba(233, 200, 86, var(--tw-bg-opacity));
  --tw-bg-opacity: 1;
}

#glaube #tagesliturgie.bg-litlightweiss #tagesheilige .card .cardbody {
  --tw-border-opacity: 1;
  border-color: rgba(97, 97, 97, var(--tw-border-opacity));
}

.card a.cardurl .cardbody span, #main.rubrik header article span, #main.dossier header article span, #main.videoserie header article span {
  margin-top: 0.25rem;
  display: inline-block;
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 600;
  line-height: 1.25;
  --tw-text-opacity: 1;
  color: rgba(156, 15, 22, var(--tw-text-opacity));
}

.card.podcast-episode a.cardurl .cardbody span {
  font-weight: 700;
}

.card.podcast-episode a.cardurl .cardbody span i {
  font-weight: 400;
  font-style: normal;
}

#main.dossier header article span, #main.videoserie header article span {
  padding-top: 0.25rem;
}

#main.dossier header article span, #main.dossier header article h1, #main.dossier header article div, #main.videoserie header article span, #main.videoserie header article h1, #main.videoserie header article div {
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}

#top .top1 .card a.cardurl .cardbody span, .card.kalenderblatt a.cardurl .cardbody span {
  padding-top: 0.75rem;
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 500;
}

.card a.cardurl .cardbody h3, #main.rubrik header article h1, #main.dossier header article h1, #main.videoserie header article h1 {
  padding-top: 0.5rem;
  padding-bottom: 0.25rem;
  font-size: 1.5rem;
  line-height: 2rem;
  font-weight: 600;
  line-height: 1.75rem;
}

@media (min-width: 768px) {
  .card a.cardurl .cardbody h3, #main.rubrik header article h1, #main.dossier header article h1, #main.videoserie header article h1 {
    font-size: 1.25rem;
    line-height: 1.75rem;
    line-height: 1.5rem;
  }
}

@media (min-width: 1280px) {
  .card a.cardurl .cardbody h3, #main.rubrik header article h1, #main.dossier header article h1, #main.videoserie header article h1 {
    font-size: 1.5rem;
    line-height: 2rem;
    line-height: 1.75rem;
  }
}

#thema #hubtext .card.thema a.cardurl .cardbody h1, #main.themenhub header article h1, #main.dossiershub header article h1, #main.videoshub header article h1, #main.podcasts header article h1, #main.suchergebnisse header article h1 {
  font-size: 1.875rem;
  line-height: 2.25rem;
  font-weight: 600;
}

#main.suchergebnisse header article h1 {
  --tw-text-opacity: 1;
  color: rgba(156, 15, 22, var(--tw-text-opacity));
}

#top .top1 .card a.cardurl .cardbody h3, .card.kalenderblatt a.cardurl .cardbody h3 {
  padding-bottom: 0.5rem;
  font-size: 1.875rem;
  line-height: 2.25rem;
  line-height: 2.25rem;
}

.card.standpunkt a.cardurl .cardbody h3 {
  padding-left: 1.25rem;
  padding-right: 1.25rem;
  padding-top: 0.25rem;
  padding-bottom: 0.5rem;
  text-align: center;
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 500;
  font-style: italic;
  line-height: 1.25;
}

@media (min-width: 640px) {
  .card.standpunkt a.cardurl .cardbody h3 {
    padding-left: 0px;
    padding-right: 0px;
    padding-top: 0px;
    text-align: left;
  }
}

@media (min-width: 768px) {
  .card.standpunkt a.cardurl .cardbody h3 {
    padding-top: 0.25rem;
    padding-bottom: 0.75rem;
  }
}

@media (min-width: 1024px) {
  .card.standpunkt a.cardurl .cardbody h3 {
    padding-top: 0px;
    padding-bottom: 0.5rem;
  }
}

#glaube #tagesliturgie #stundenbuch .card .cardbody time, #glaube #tagesliturgie #tagesheilige .card .cardbody h4 {
  padding-top: 0.25rem;
  font-size: 1.125rem;
  line-height: 1.75rem;
  font-weight: 300;
  font-style: italic;
  line-height: 1.375;
  --tw-text-opacity: 1;
  color: rgba(255, 255, 255, var(--tw-text-opacity));
}

@media (min-width: 1024px) {
  #glaube #tagesliturgie #stundenbuch .card .cardbody time, #glaube #tagesliturgie #tagesheilige .card .cardbody h4 {
    font-size: 1rem;
    line-height: 1.5rem;
  }
}

@media (min-width: 1280px) {
  #glaube #tagesliturgie #stundenbuch .card .cardbody time, #glaube #tagesliturgie #tagesheilige .card .cardbody h4 {
    font-size: 1.125rem;
    line-height: 1.75rem;
  }
}

#glaube #tagesliturgie #stundenbuch .card .cardbody time, #glaube #tagesliturgie #tagesheilige .card .cardbody h4 {
  text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);
}

#glaube #tagesliturgie #stundenbuch .card .cardbody div {
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 300;
  font-style: italic;
  --tw-text-opacity: 1;
  color: rgba(255, 255, 255, var(--tw-text-opacity));
  text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);
}

#glaube #tagesliturgie.bg-litlightweiss #stundenbuch .card .cardbody time, #glaube #tagesliturgie.bg-litlightweiss #tagesheilige .card .cardbody h4, #glaube #tagesliturgie.bg-litlightweiss #stundenbuch .card .cardbody div {
  --tw-text-opacity: 1;
  color: rgba(38, 38, 38, var(--tw-text-opacity));
  text-shadow: 0 0 0 rgba(0, 0, 0, 0);
}

#glaube #tagesliturgie #stundenbuch .card .cardbody time i, #glaube #tagesliturgie #stundenbuch .card .cardbody div i {
  font-weight: 600;
  font-style: normal;
}

.card.serie a.cardurl .cardbody h3, .card.serie a.cardurl .cardbody div, #main.videoserie header article {
  --tw-text-opacity: 1;
  color: rgba(255, 255, 255, var(--tw-text-opacity));
}

.card.lexikon a.cardurl .cardbody h3 {
  padding-top: 2.5rem;
  padding-bottom: 0.5rem;
}

.card a.cardurl .cardbody div, #main.rubrik header article div, #main.dossier header article div, #main.videoserie header article div {
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
  font-weight: 300;
  line-height: 1.25rem;
}

#main.dossier header article div, #main.videoserie header article div {
  margin-bottom: 0.25rem;
}

#main.themenhub header.aufmacher article div, #main.dossiershub header.aufmacher article div, #main.videoshub header.aufmacher article div, #main.podcasts header.aufmacher article div, #main.suchergebnisse header.aufmacher article div {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}

#main.themenhub header.aufmacher article span, #main.dossiershub header.aufmacher article span, #main.videoshub header.aufmacher article span, #main.podcasts header.aufmacher article span, #main.suchergebnisse header.aufmacher article span {
  font-weight: 700;
}

#main.themenhub header.aufmacher article span::before, #main.dossiershub header.aufmacher article span::before, #main.videoshub header.aufmacher article span::before, #main.podcasts header.aufmacher article span::before, #main.suchergebnisse header.aufmacher article span::before {
  content: "\a";
  white-space: pre;
}

#top .top1 .card a.cardurl .cardbody div, .card.kalenderblatt a.cardurl .cardbody div {
  font-size: 1.125rem;
  line-height: 1.75rem;
  line-height: 1.5rem;
}

.card a.cardurl .cardbody div p {
  padding-bottom: 0.75rem;
}

#thema #hubtext .card.thema a.cardurl .cardbody div {
  padding-top: 0.75rem;
  font-size: 1.125rem;
  line-height: 1.75rem;
  font-weight: 500;
  line-height: 1.75rem;
}

#video .card.video {
  display: none;
}

@media (min-width: 768px) {
  #video .card.video {
    display: flex;
  }
}

#video .card.video:first-of-type {
  grid-column: span 1 / span 1;
  display: flex;
}

@media (min-width: 640px) {
  #video .card.video:first-of-type {
    grid-column: span 2 / span 2;
  }
}

@media (min-width: 768px) {
  #video .card.video:first-of-type {
    grid-column: span 1 / span 1;
    display: flex;
  }
}

#video .card.video .cardbody div {
  display: none;
}

@media (min-width: 768px) {
  #video .card.video .cardbody div {
    display: block;
  }
}

 #glaube #bibel a.cardurl .cardbody div, #glaube #heilige a.cardurl .cardbody div, #video .card.video a.cardurl .cardbody div, #themen .card.thema a.cardurl .cardbody div {
  display: none;
}

@media (min-width: 768px) {
   #glaube #bibel a.cardurl .cardbody div, #glaube #heilige a.cardurl .cardbody div, #video .card.video a.cardurl .cardbody div, #themen .card.thema a.cardurl .cardbody div {
    display: block;
  }
}

/* Cards Footer & Events */

.card footer a, .card.events a {
  border-top-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgba(221, 221, 221, var(--tw-border-opacity));
  --tw-bg-opacity: 1;
  background-color: rgba(247, 247, 247, var(--tw-bg-opacity));
}

.card footer a:hover, .card.events a:hover {
  --tw-bg-opacity: 1;
  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
}

.card footer a, .card.events a {
  padding: 0.5rem;
  text-align: left;
  font-size: 0.875rem;
  line-height: 1.25rem;
  line-height: 1rem;
  --tw-text-opacity: 1;
  color: rgba(72, 72, 72, var(--tw-text-opacity));
}

.card.news footer a {
  margin-right: 0px;
}

@media (min-width: 1024px) {
  .card.news footer a {
    margin-right: 1.25rem;
  }
}

.card.termin footer {
  --tw-bg-opacity: 1;
  background-color: rgba(247, 247, 247, var(--tw-bg-opacity));
  padding-left: 0.75rem;
  padding-right: 0.75rem;
  text-align: left;
  --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.card.termin footer a {
  margin-right: 0.25rem;
  display: inline-block;
  height: 1.25rem;
  border-style: none;
  background-color: transparent;
}

.card.termin footer a:hover {
  background-color: transparent;
}

.card.termin footer a {
  padding: 0px;
  text-align: left;
  font-size: 0.75rem;
  line-height: 1rem;
  --tw-text-opacity: 1;
  color: rgba(170, 170, 170, var(--tw-text-opacity));
}

.card.termin footer a:hover {
  --tw-text-opacity: 1;
  color: rgba(156, 15, 22, var(--tw-text-opacity));
}

.card.termin footer a {
  --tw-shadow: 0 0 #0000;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.card footer a.active {
  cursor: text;
  --tw-bg-opacity: 1;
  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
  font-weight: 600;
  --tw-text-opacity: 1;
  color: rgba(156, 15, 22, var(--tw-text-opacity));
}

.card.events a {
  font-weight: 500;
}

.card.events a.event-1 {
  z-index: 30;
}

.card.events a .date, .card.events a .time {
  font-size: 0.75rem;
  line-height: 1rem;
  font-weight: 700;
  --tw-text-opacity: 1;
  color: rgba(156, 15, 22, var(--tw-text-opacity));
}

.card.events a .time {
  --tw-text-opacity: 1;
  color: rgba(0, 0, 0, var(--tw-text-opacity));
}

#top .top1 .card footer a {
  padding-left: 1.25rem;
  padding-right: 1.25rem;
}

@media (min-width: 1024px) {
  #top .top1 .card footer a {
    margin-left: 1rem;
    margin-right: 1rem;
  }
}

@media (min-width: 1280px) {
  #top .top1 .card footer a {
    margin-left: 2.5rem;
    margin-right: 2.5rem;
  }
}

@media (min-width: 1536px) {
  #top .top1 .card footer a {
    margin-left: 4rem;
    margin-right: 4rem;
  }
}

.card footer a.artikel {
  z-index: 30;
  font-weight: 500;
}

.card footer a.dossier {
  z-index: 20;
  font-weight: 600;
}

.card footer a.thema {
  z-index: 10;
  font-weight: 600;
  font-style: italic;
}

.card footer a svg {
  margin-top: -0.25rem;
  display: inline;
  height: 1rem;
  width: 1rem;
  --tw-text-opacity: 1;
  color: rgba(156, 15, 22, var(--tw-text-opacity));
}

.card footer a i, .card.index a i {
  margin-top: -0.25rem;
  display: inline-block;
  height: 1rem;
  width: 1rem;
  text-align: center;
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 700;
  --tw-text-opacity: 1;
  color: rgba(156, 15, 22, var(--tw-text-opacity));
}

.card footer a.serie svg {
  --tw-text-opacity: 1;
  color: rgba(0, 0, 0, var(--tw-text-opacity));
}

#glaube #tagesliturgie #stundenbuch .card ul.stundenbuch-index {
  margin-top: 1rem;
  font-size: 1.25rem;
  line-height: 1.75rem;
  font-weight: 600;
  line-height: 1.5rem;
}

#glaube #tagesliturgie #stundenbuch .card ul.stundenbuch-index a {
  --tw-text-opacity: 1;
  color: rgba(255, 255, 255, var(--tw-text-opacity));
}

#glaube #tagesliturgie #stundenbuch .card ul.stundenbuch-index a:hover {
  opacity: 0.8;
}

#glaube #tagesliturgie #stundenbuch .card ul.stundenbuch-index a {
  --tw-shadow: 0 0 #0000;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

#glaube #tagesliturgie.bg-litlightweiss #stundenbuch .card ul.stundenbuch-index a {
  --tw-text-opacity: 1;
  color: rgba(0, 0, 0, var(--tw-text-opacity));
}

#glaube #tagesliturgie.bg-litlightweiss #stundenbuch .card ul.stundenbuch-index a:hover {
  opacity: 0.8;
}

#glaube #tagesliturgie.bg-litlightweiss #stundenbuch .card ul.stundenbuch-index a {
  --tw-shadow: 0 0 #0000;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

#glaube #tagesliturgie #stundenbuch .card ul.stundenbuch-index li {
  display: none;
  padding-bottom: 0.75rem;
}

@media (min-width: 1024px) {
  #glaube #tagesliturgie #stundenbuch .card ul.stundenbuch-index li {
    display: block;
    padding-left: 0.75rem;
  }
}

@media (min-width: 1280px) {
  #glaube #tagesliturgie #stundenbuch .card ul.stundenbuch-index li {
    padding-bottom: 1.25rem;
    padding-left: 0px;
  }
}

#glaube #tagesliturgie #stundenbuch .card ul.stundenbuch-index li ul {
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 300;
  font-style: italic;
}

@media (min-width: 1536px) {
  #glaube #tagesliturgie #stundenbuch .card ul.stundenbuch-index li ul {
    display: flex;
  }
}

#glaube #tagesliturgie #stundenbuch .card ul.stundenbuch-index li ul li {
  display: block;
  width: 100%;
  padding-top: 0px;
  padding-bottom: 0px;
}

@media (min-width: 1024px) {
  #glaube #tagesliturgie #stundenbuch .card ul.stundenbuch-index li ul li {
    padding-left: 0px;
  }
}

@media (min-width: 1280px) {
  #glaube #tagesliturgie #stundenbuch .card ul.stundenbuch-index li ul li {
    padding-top: 0.25rem;
  }
}

@media (min-width: 1536px) {
  #glaube #tagesliturgie #stundenbuch .card ul.stundenbuch-index li ul li {
    margin-bottom: -0.5rem;
    width: 33.333333%;
    flex: 1 1 0%;
    text-align: center;
  }
}

.card.thema ul {
  display: none;
  height: 100%;
  border-top-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgba(156, 15, 22, var(--tw-border-opacity));
}

@media (min-width: 1024px) {
  .card.thema ul {
    display: block;
  }
}

.card.thema ul li {
  border-bottom-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgba(221, 221, 221, var(--tw-border-opacity));
  --tw-bg-opacity: 1;
  background-color: rgba(247, 247, 247, var(--tw-bg-opacity));
}

.card.thema ul li:hover {
  --tw-bg-opacity: 1;
  background-color: rgba(238, 238, 238, var(--tw-bg-opacity));
}

.card.thema ul li {
  padding-left: 0.75rem;
  padding-right: 0.75rem;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 300;
  --tw-text-opacity: 1;
  color: rgba(97, 97, 97, var(--tw-text-opacity));
  --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.card.thema ul li a {
  --tw-shadow: 0 0 #0000;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.card.thema ul li a span {
  font-weight: 600;
  --tw-text-opacity: 1;
  color: rgba(156, 15, 22, var(--tw-text-opacity));
}

.card.thema ul li a h4 {
  padding-bottom: 0.25rem;
  font-size: 1.25rem;
  line-height: 1.75rem;
  font-weight: 600;
  line-height: 1.5rem;
  --tw-text-opacity: 1;
  color: rgba(38, 38, 38, var(--tw-text-opacity));
}

.card.thema ul li a h4:hover {
  --tw-text-opacity: 1;
  color: rgba(0, 0, 0, var(--tw-text-opacity));
}

/* Stundenbuch */

#lesung h2, #antwortpsalm h2, #evangelium h2, #laudes h2, #terz h2, #non h2, #vesper h2, #komplet h2, #festkreis-ende h2 {
  padding-bottom: 0.25rem;
  font-size: 1.5rem;
  line-height: 2rem;
  font-weight: 600;
}

#lesung h3, #antwortpsalm h3, #evangelium h3, #laudes h3, #terz h3, #non h3, #vesper h3, #komplet h3, #festkreis-ende h3 {
  padding-bottom: 0.25rem;
  font-size: 1.25rem;
  line-height: 1.75rem;
  font-weight: 600;
}

#lesung h4, #antwortpsalm h4, #evangelium h4, #laudes h4, #terz h4, #non h4, #vesper h4, #komplet h4, #festkreis-ende h4 {
  padding-top: 0.5rem;
  padding-bottom: 0.25rem;
  font-size: 1.25rem;
  line-height: 1.75rem;
  font-weight: 600;
}

.stundenbuchquelle {
  margin-left: -2.5rem;
  margin-right: -2.5rem;
  margin-bottom: 1.25rem;
  display: block;
  padding-left: 1.75rem;
  padding-right: 1.75rem;
  padding-top: 0.25rem;
  padding-bottom: 0.75rem;
  font-size: 1rem;
  line-height: 1.5rem;
  --tw-text-opacity: 1;
  color: rgba(255, 255, 255, var(--tw-text-opacity));
  --tw-text-opacity: 0.3;
}

.stundenbuchquelle:hover {
  --tw-text-opacity: 0.6;
}

@media (min-width: 1536px) {
  .stundenbuchquelle {
    margin-left: -1.75rem;
    margin-right: -1.75rem;
  }
}

.stundenbuchquelle.bg-litlightweiss {
  --tw-text-opacity: 1;
  color: rgba(0, 0, 0, var(--tw-text-opacity));
  --tw-text-opacity: 0.3;
}

.stundenbuchquelle.bg-litlightweiss:hover {
  --tw-text-opacity: 0.6;
}

.trenner {
  margin-left: -2.5rem;
  margin-right: -2.5rem;
  margin-bottom: 1.25rem;
  height: 1.25rem;
}

@media (min-width: 1536px) {
  .trenner {
    margin-left: -1.75rem;
    margin-right: -1.75rem;
  }
}

/* Podcasts */

/* SoMe-Icons */

.some {
  position: absolute;
  right: 0px;
  bottom: 0px;
  left: 0px;
  display: flex;
  width: 100%;
  flex-wrap: wrap;
  --tw-bg-opacity: 1;
  background-color: rgba(238, 238, 238, var(--tw-bg-opacity));
}

@media (min-width: 640px) {
  .some {
    bottom: -1rem;
    --tw-bg-opacity: 1;
    background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
  }
}

@media (min-width: 768px) {
  .some {
    padding-left: 18rem;
    padding-right: 18rem;
  }
}

@media (min-width: 1024px) {
  .some {
    position: relative;
    top: 0.5rem;
    width: auto;
    padding-left: 0px;
    padding-right: 0px;
  }
}

@media screen and (max-width: 951.98px) and (min-width: 850px) {
  .some {
    padding-left: 16rem;
    padding-right: 16rem;
  }
}

@media screen and (max-width: 849.98px) and (min-width: 800px) {
  .some {
    padding-left: 13rem;
    padding-right: 13rem;
  }
}

@media screen and (max-width: 799.98px) and (min-width: 700px) {
  .some {
    padding-left: 11rem;
    padding-right: 11rem;
  }
}

@media screen and (max-width: 699.98px) and (min-width: 640px) {
  .some {
    padding-left: 8rem;
    padding-right: 8rem;
  }
}

@media screen and (max-width: 639.98px) and (min-width: 600px) {
  .some {
    padding-left: 5rem;
    padding-right: 5rem;
  }
}

@media screen and (max-width: 599.98px) and (min-width: 540px) {
  .some {
    padding-left: 2.5rem;
    padding-right: 2.5rem;
  }
}

@media screen and (max-width: 539.98px) and (min-width: 430px) {
  .some {
    padding-left: 1.75rem;
    padding-right: 1.75rem;
  }
}

.some li {
  flex: 1 1 0%;
  flex-grow: 1;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  padding-bottom: 1.75rem;
}

@media (min-width: 1024px) {
  .some li {
    flex: 1 1 0%;
    padding-left: 1px;
    padding-right: 1px;
  }
}

@media screen and (max-width: 429.98px) and (min-width: 400px) {
  .some li {
    padding-left: 0.25rem;
    padding-right: 0.25rem;
  }
}

@media screen and (max-width: 399.98px) {
  .some li {
    padding-left: 1px;
    padding-right: 1px;
  }
}

.some li a img {
  height: 100%;
  width: 100%;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  transform: translateX(var(--tw-translate-x)) translateY(var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  --tw-scale-x: .95;
  --tw-scale-y: .95;
}

.some li a img:hover {
  --tw-scale-x: .9;
  --tw-scale-y: .9;
}

.some li a img {
  --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
  transition-property: background-color, border-color, color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;
  transition-property: background-color, border-color, color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
  transition-property: background-color, border-color, color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
  transition-duration: 200ms;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

/* Footer */

#footer section {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  -moz-column-gap: 1rem;
       column-gap: 1rem;
}

#footer .service-special {
  border-top-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgba(205, 205, 205, var(--tw-border-opacity));
  --tw-bg-opacity: 1;
  background-color: rgba(238, 238, 238, var(--tw-bg-opacity));
  --tw-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, 0.06);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

#footer section #share {
  grid-column: span 12 / span 12;
  display: flex;
  flex: none;
  justify-content: center;
  --tw-bg-opacity: 1;
  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
}

@media (min-width: 768px) {
  #footer section #share {
    grid-column: span 4 / span 4;
    flex: 1 1 0%;
    justify-content: flex-start;
  }
}

#footer section #follow {
  grid-column: span 12 / span 12;
  display: flex;
  flex-direction: row-reverse;
  justify-content: center;
  padding-top: 0.75rem;
}

@media (min-width: 768px) {
  #footer section #follow {
    grid-column: span 8 / span 8;
    justify-content: flex-start;
    padding-top: 0px;
  }
}

#footer section #share li, #artikel div.einstieg #share li, #footer section #follow li {
  margin-top: 0.25rem;
  margin-bottom: 0.5rem;
}

#footer section #share li span, #artikel div.einstieg #share li span {
  display: inline-block;
  padding-left: 1rem;
  padding-right: 1rem;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  font-weight: 600;
}

#footer section #follow li span {
  display: none;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  font-weight: 600;
}

@media (min-width: 640px) {
  #footer section #follow li span {
    display: inline-block;
  }
}

#footer section #follow li span a {
  --tw-text-opacity: 1;
  color: rgba(156, 15, 22, var(--tw-text-opacity));
}

#footer section #share li a svg, #artikel div.einstieg #share li a svg {
  margin-top: 0.5rem;
  display: inline;
  height: 1.5rem;
  width: 1.5rem;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  transform: translateX(var(--tw-translate-x)) translateY(var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  transition-property: background-color, border-color, color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;
  transition-property: background-color, border-color, color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
  transition-property: background-color, border-color, color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
  transition-duration: 300ms;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

#footer section #share li a svg:last-of-type, #artikel div.einstieg #share li a svg:last-of-type {
  margin-left: 0.5rem;
}

#footer section #share li a img, #artikel div.einstieg #share li a img, #footer section #follow li a img {
  margin-left: 0.5rem;
  margin-right: 0.5rem;
  margin-top: 0.5rem;
  height: 1.5rem;
  width: 1.5rem;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  transform: translateX(var(--tw-translate-x)) translateY(var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  transition-property: background-color, border-color, color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;
  transition-property: background-color, border-color, color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
  transition-property: background-color, border-color, color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
  transition-duration: 300ms;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

#footer section #share li a:hover svg, #footer section #share li a:hover img, #artikel div.einstieg #share li a:hover svg, #artikel div.einstieg #share li a:hover img, #footer section #follow li a:hover img {
  --tw-scale-x: .9;
  --tw-scale-y: .9;
}

#footer section #netzwerk {
  grid-column: span 12 / span 12;
  justify-content: center;
  padding-left: 1rem;
  padding-right: 1rem;
}

@media (min-width: 768px) {
  #footer section #netzwerk {
    grid-column: span 7 / span 7;
    padding-left: 0px;
    padding-right: 0px;
  }
}

@media (min-width: 1024px) {
  #footer section #netzwerk {
    grid-column: span 8 / span 8;
  }
}

@media (min-width: 1536px) {
  #footer section #netzwerk {
    padding-left: 5rem;
    padding-right: 5rem;
  }
}

#footer section #netzwerk header:first-of-type {
  margin-top: 1.25rem;
  margin-bottom: 1.25rem;
}

@media (min-width: 1536px) {
  #footer section #netzwerk header:first-of-type {
    margin-bottom: 0.5rem;
  }
}

#footer section #netzwerk header:last-of-type {
  margin-top: 1.25rem;
  margin-bottom: 1.25rem;
}

@media (min-width: 1280px) {
  #footer section #netzwerk header:last-of-type {
    margin-top: 0.5rem;
  }
}

@media (min-width: 1536px) {
  #footer section #netzwerk header:last-of-type {
    margin-bottom: 0px;
  }
}

@media screen and (max-width: 875.98px) {
  #footer section #netzwerk header:first-of-type {
    margin-top: -0.5rem;
    margin-bottom: 0.5rem;
  }

  @media (min-width: 768px) {
    #footer section #netzwerk header:first-of-type {
      margin-top: 1.25rem;
    }
  }

  #footer section #netzwerk header:last-of-type {
    margin-top: 1.25rem;
    margin-bottom: 0.5rem;
  }

  @media (min-width: 768px) {
    #footer section #netzwerk header:last-of-type {
      margin-top: 0.5rem;
    }
  }
}

#footer section #netzwerk section {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  padding-top: 0.5rem;
  text-align: center;
  font-weight: 600;
  line-height: 1;
}

@media screen and (max-width: 981.98px) {
  #footer section #netzwerk section {
    font-size: 0.875rem;
    line-height: 1.25rem;
    line-height: 1;
  }
}

@media screen and (max-width: 875.98px) {
  #footer section #netzwerk section {
    padding-top: 0px;
    line-height: 1.25;
  }

  #footer section #netzwerk section:last-of-type {
    margin-bottom: 1.75rem;
  }

  #footer section #netzwerk section, #footer section #netzwerk section a {
    display: block;
    flex: none;
    --tw-text-opacity: 1;
    color: rgba(156, 15, 22, var(--tw-text-opacity));
    text-decoration: underline;
  }

  #footer section #netzwerk section, #footer section #netzwerk section a:hover {
    text-decoration: none;
  }
}

#footer section #netzwerk section a {
  margin-top: 0.25rem;
  margin-bottom: 0.25rem;
  flex: 1 1 0%;
}

#footer section #netzwerk header h3 {
  text-align: center;
  font-size: 1.25rem;
  line-height: 1.75rem;
  font-weight: 300;
  --tw-text-opacity: 1;
  color: rgba(38, 38, 38, var(--tw-text-opacity));
}

#footer section #netzwerk section a img {
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 0.25rem;
  height: 2.5rem;
}

@media (min-width: 1536px) {
  #footer section #netzwerk section a img {
    height: 3.5rem;
  }
}

@media screen and (max-width: 981.98px) and (min-width: 876px) {
  #footer section #netzwerk section a img {
    height: 2rem;
  }
}

@media screen and (max-width: 875.98px) {
  #footer section #netzwerk section a img {
    display: none;
  }
}

#footer section #netzwerk footer {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  text-align: center;
}

#footer section #meta {
  grid-column: span 12 / span 12;
  display: flex;
  flex: none;
  justify-content: center;
  --tw-bg-opacity: 1;
  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
  padding-top: 0px;
}

@media (min-width: 768px) {
  #footer section #meta {
    grid-column: span 6 / span 6;
    flex: 1 1 0%;
    justify-content: flex-start;
  }
}

@media (min-width: 1024px) {
  #footer section #meta {
    grid-column: span 5 / span 5;
  }
}

#footer section #meta li {
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
  margin-right: 0.5rem;
  margin-left: 0.5rem;
  font-size: 1rem;
  line-height: 1.5rem;
  --tw-text-opacity: 1;
  color: rgba(72, 72, 72, var(--tw-text-opacity));
}

@media (min-width: 640px) {
  #footer section #meta li {
    margin-right: 1rem;
    margin-left: 0px;
  }
}

@media (min-width: 768px) {
  #footer section #meta li {
    font-size: 0.875rem;
    line-height: 1.25rem;
  }
}

@media screen and (max-width: 391.98px) {
  #footer section #meta {
    display: block;
    padding-top: 0.5rem;
  }

  #footer section #meta li {
    margin-top: 0.25rem;
    margin-bottom: 0.25rem;
    margin-right: 0px;
    margin-left: 0px;
    width: 100%;
    text-align: center;
  }
}

#footer section #backup {
  display: none;
  --tw-bg-opacity: 1;
  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
  text-align: center;
}

@media (min-width: 768px) {
  #footer section #backup {
    grid-column: span 2 / span 2;
    display: block;
  }
}

#footer section #backup svg {
  margin-top: 0.5rem;
  display: inline;
  height: 1rem;
  width: 1rem;
  --tw-text-opacity: 1;
  color: rgba(72, 72, 72, var(--tw-text-opacity));
}

#footer section #copy {
  grid-column: span 12 / span 12;
  display: flex;
  flex-direction: row-reverse;
  justify-content: center;
  --tw-bg-opacity: 1;
  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
}

@media (min-width: 768px) {
  #footer section #copy {
    grid-column: span 4 / span 4;
    justify-content: flex-start;
  }
}

@media (min-width: 1024px) {
  #footer section #copy {
    grid-column: span 5 / span 5;
  }
}

#footer section #copy span {
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
  margin-right: 1rem;
  padding-bottom: 1.25rem;
  font-size: 0.875rem;
  line-height: 1.25rem;
  --tw-text-opacity: 1;
  color: rgba(170, 170, 170, var(--tw-text-opacity));
}

@media (min-width: 768px) {
  #footer section #copy span {
    padding-bottom: 0px;
    --tw-text-opacity: 1;
    color: rgba(72, 72, 72, var(--tw-text-opacity));
  }
}

/* Newsletter */

.newsletter-signup-form {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 32rem;
  padding-left: 0.75rem;
  padding-right: 0.75rem;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  padding-bottom: 0.75rem;
}

@media (min-width: 640px) {
  .newsletter-signup-form {
    padding-left: 1.25rem;
    padding-right: 1.25rem;
  }
}

@media (min-width: 768px) {
  .newsletter-signup-form {
    padding-left: 0.75rem;
    padding-right: 0.75rem;
  }
}

/*
#footer section #newsletter {
    @apply 2xl:col-span-10 2xl:col-start-2 xl:col-span-12 lg:col-span-10 lg:col-start-2 col-span-12 md:px-0 sm:px-7 px-2;
}
    */

#newsletter form {
  position: relative;
  z-index: 10;
  margin-bottom: 1.75rem;
  width: 100%;
  --tw-bg-opacity: 1;
  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
}

#newsletter form:hover {
  --tw-bg-opacity: 1;
  background-color: rgba(247, 247, 247, var(--tw-bg-opacity));
}

#newsletter form {
  padding-left: 0.75rem;
  padding-right: 0.75rem;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  padding-bottom: 0.75rem;
  font-size: 0.875rem;
  line-height: 1.25rem;
  --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

@media (min-width: 640px) {
  #newsletter form {
    padding-left: 1.25rem;
    padding-right: 1.25rem;
    font-size: 1rem;
    line-height: 1.5rem;
  }
}

@media (min-width: 768px) {
  #newsletter form {
    padding-left: 0.75rem;
    padding-right: 0.75rem;
  }
}

#newsletter form div {
  margin-top: 0.75rem;
  margin-bottom: 0.75rem;
  display: flex;
  width: 100%;
  flex-wrap: wrap;
}

#newsletter form div.email {
  grid-column: span 12 / span 12;
}

@media (min-width: 768px) {
  #newsletter form div.email {
    grid-column: span 8 / span 8;
  }
}

@media (min-width: 1280px) {
  #newsletter form div.email {
    grid-column: span 3 / span 3;
  }
}

#newsletter form div.datenschutz {
  --tw-bg-opacity: 1;
  background-color: rgba(221, 221, 221, var(--tw-bg-opacity));
  padding: 0.5rem;
}

#newsletter form div.datenschutz {
  grid-column: span 12 / span 12;
}

@media (min-width: 1280px) {
  #newsletter form div.datenschutz {
    grid-column: span 4 / span 4;
  }
}

#newsletter form div.newslettertypen {
  margin-top: 0px;
  margin-bottom: 0px;
}

#newsletter form div.newslettertypen {
  grid-column: span 12 / span 12;
  margin-top: auto;
  margin-bottom: auto;
}

@media (min-width: 768px) {
  #newsletter form div.newslettertypen {
    grid-column: span 4 / span 4;
  }
}

@media (min-width: 1024px) {
  #newsletter form div.newslettertypen {
    padding-left: 0.75rem;
    padding-right: 0.75rem;
  }
}

@media (min-width: 1280px) {
  #newsletter form div.newslettertypen {
    grid-column: span 3 / span 3;
  }
}

#newsletter form div label {
  margin-top: auto;
  margin-bottom: auto;
  margin-right: auto;
}

#newsletter form div.datenschutz label {
  margin-top: 0px;
  margin-bottom: 0px;
  margin-right: 0px;
  width: 100%;
  text-align: center;
  font-style: italic;
}

#newsletter form div.datenschutz label a {
  --tw-text-opacity: 1;
  color: rgba(156, 15, 22, var(--tw-text-opacity));
  text-decoration: underline;
}

#newsletter form div.newslettertypen div {
  margin-top: 0px;
  margin-bottom: 0px;
  margin-left: auto;
  display: flex;
  height: 2rem;
  width: 75%;
  flex-wrap: wrap;
}

@media (min-width: 768px) {
  #newsletter form div.newslettertypen div {
    width: 66.666667%;
  }
}

@media (min-width: 1280px) {
  #newsletter form div.newslettertypen div {
    margin-top: -0.5rem;
    margin-bottom: -0.5rem;
    width: 75%;
  }
}

#newsletter form div.newslettertypen div label {
  width: 50%;
  font-size: 0.875rem;
  line-height: 1.25rem;
}

@media (min-width: 768px) {
  #newsletter form div.newslettertypen div label {
    width: 100%;
  }
}

@media (min-width: 1280px) {
  #newsletter form div.newslettertypen div label {
    width: 50%;
  }
}

#newsletter form div.newslettertypen div label:last-of-type {
  text-align: right;
}

@media (min-width: 768px) {
  #newsletter form div.newslettertypen div label:last-of-type {
    text-align: left;
  }
}

@media (min-width: 1280px) {
  #newsletter form div.newslettertypen div label:last-of-type {
    text-align: right;
  }
}

#newsletter form div.newslettertypen div {
  margin-top: -0.5rem;
  margin-bottom: -0.5rem;
  margin-left: auto;
  display: flex;
  height: 2rem;
  width: 75%;
  flex-wrap: wrap;
}

@media (min-width: 768px) {
  #newsletter form div.newslettertypen div {
    width: 100%;
  }
}

@media (min-width: 1280px) {
  #newsletter form div.newslettertypen div {
    width: 100%;
  }
}

#newsletter form div.newslettertypen div label {
  width: 50%;
  font-size: 0.875rem;
  line-height: 1.25rem;
}

@media (min-width: 768px) {
  #newsletter form div.newslettertypen div label {
    width: 50%;
  }
}

@media (min-width: 1280px) {
  #newsletter form div.newslettertypen div label {
    width: 50%;
  }
}

#newsletter form div.newslettertypen div label:last-of-type {
  text-align: right;
}

@media (min-width: 768px) {
  #newsletter form div.newslettertypen div label:last-of-type {
    text-align: right;
  }
}

@media (min-width: 1280px) {
  #newsletter form div.newslettertypen div label:last-of-type {
    text-align: right;
  }
}

#newsletter form div input.input, #newsletter form div select {
  height: 2rem;
  width: 75%;
  border-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgba(221, 221, 221, var(--tw-border-opacity));
  padding-left: 0.25rem;
}

@media (min-width: 768px) {
  #newsletter form div input.input, #newsletter form div select {
    width: 66.666667%;
  }
}

@media (min-width: 1280px) {
  #newsletter form div input.input, #newsletter form div select {
    width: 75%;
  }
}

#newsletter form span.field-validation-error {
  margin-right: 1rem;
  width: 100%;
  padding-left: 0.25rem;
  text-align: right;
  font-size: 0.875rem;
  line-height: 1.25rem;
  --tw-text-opacity: 1;
  color: rgba(156, 15, 22, var(--tw-text-opacity));
}

#newsletter form div input.input, #newsletter form div select {
  margin-right: 0px;
  width: 75%;
}

@media (min-width: 768px) {
  #newsletter form div input.input, #newsletter form div select {
    margin-right: 1rem;
    width: 80%;
  }
}

@media (min-width: 1280px) {
  #newsletter form div input.input, #newsletter form div select {
    width: 75%;
  }
}

#newsletter form div.abschicken {
  grid-column: span 12 / span 12;
  display: flex;
  text-align: center;
}

@media (min-width: 1280px) {
  #newsletter form div.abschicken {
    grid-column: span 2 / span 2;
  }
}

#newsletter form div button {
  margin-left: auto;
  margin-right: auto;
  --tw-bg-opacity: 1;
  background-color: rgba(38, 38, 38, var(--tw-bg-opacity));
  padding-left: 1rem;
  padding-right: 1rem;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  font-weight: 600;
  text-transform: uppercase;
  --tw-text-opacity: 1;
  color: rgba(255, 255, 255, var(--tw-text-opacity));
}

#newsletter header h3 {
  text-align: center;
  font-size: 1.25rem;
  line-height: 1.75rem;
  font-weight: 300;
  --tw-text-opacity: 1;
  color: rgba(38, 38, 38, var(--tw-text-opacity));
}

#newsletter header {
  margin-top: 1.25rem;
  margin-bottom: 0.75rem;
}

#footer #newsletter form {
  position: relative;
  z-index: 10;
  margin-bottom: 1.75rem;
  width: 100%;
  --tw-bg-opacity: 1;
  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
}

#footer #newsletter form:hover {
  --tw-bg-opacity: 1;
  background-color: rgba(247, 247, 247, var(--tw-bg-opacity));
}

#footer #newsletter form {
  padding-left: 0.75rem;
  padding-right: 0.75rem;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  padding-bottom: 0.75rem;
  font-size: 0.875rem;
  line-height: 1.25rem;
  --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

@media (min-width: 640px) {
  #footer #newsletter form {
    padding-left: 1.25rem;
    padding-right: 1.25rem;
    font-size: 1rem;
    line-height: 1.5rem;
  }
}

@media (min-width: 768px) {
  #footer #newsletter form {
    padding-left: 0.75rem;
    padding-right: 0.75rem;
  }
}

#footer section #newsletter {
  grid-column: span 12 / span 12;
  justify-content: center;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}

@media (min-width: 640px) {
  #footer section #newsletter {
    padding-left: 1.75rem;
    padding-right: 1.75rem;
  }
}

@media (min-width: 768px) {
  #footer section #newsletter {
    grid-column: span 5 / span 5;
    justify-content: flex-start;
    padding-left: 0px;
    padding-right: 0px;
  }
}

@media (min-width: 1024px) {
  #footer section #newsletter {
    grid-column: span 4 / span 4;
  }
}

/*
    #footer section #newsletter form {
        @apply grid grid-cols-12 gap-2;
    }
    */

#footer section #newsletter form div {
  margin-top: 0.75rem;
  margin-bottom: 0.75rem;
  display: flex;
  width: 100%;
  flex-wrap: wrap;
}

#footer section #newsletter form div.datenschutz {
  --tw-bg-opacity: 1;
  background-color: rgba(221, 221, 221, var(--tw-bg-opacity));
  padding: 0.5rem;
}

#footer .service-special section #newsletter {
  grid-column: span 12 / span 12;
  justify-content: center;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}

@media (min-width: 640px) {
  #footer .service-special section #newsletter {
    padding-left: 1.75rem;
    padding-right: 1.75rem;
  }
}

@media (min-width: 768px) {
  #footer .service-special section #newsletter {
    grid-column: span 5 / span 5;
    justify-content: flex-start;
    padding-left: 0px;
    padding-right: 0px;
  }
}

@media (min-width: 1024px) {
  #footer .service-special section #newsletter {
    grid-column: span 4 / span 4;
  }
}

#footer section #newsletter form div.newslettertypen {
  margin-top: 0px;
  margin-bottom: 0px;
}

#footer section #newsletter form div label {
  margin-top: auto;
  margin-bottom: auto;
  margin-right: auto;
}

#footer section #newsletter form div.datenschutz label {
  margin-top: 0px;
  margin-bottom: 0px;
  margin-right: 0px;
  width: 100%;
  text-align: center;
  font-style: italic;
}

#footer section #newsletter form div.datenschutz label a {
  --tw-text-opacity: 1;
  color: rgba(156, 15, 22, var(--tw-text-opacity));
  text-decoration: underline;
}

#footer section #newsletter form div.newslettertypen div {
  margin-top: 0px;
  margin-bottom: 0px;
  margin-left: auto;
  display: flex;
  height: 2rem;
  width: 75%;
  flex-wrap: wrap;
}

@media (min-width: 768px) {
  #footer section #newsletter form div.newslettertypen div {
    width: 66.666667%;
  }
}

@media (min-width: 1280px) {
  #footer section #newsletter form div.newslettertypen div {
    margin-top: -0.5rem;
    margin-bottom: -0.5rem;
    width: 75%;
  }
}

#footer section #newsletter form div.newslettertypen div label {
  width: 50%;
  font-size: 0.875rem;
  line-height: 1.25rem;
}

@media (min-width: 768px) {
  #footer section #newsletter form div.newslettertypen div label {
    width: 100%;
  }
}

@media (min-width: 1280px) {
  #footer section #newsletter form div.newslettertypen div label {
    width: 50%;
  }
}

#footer section #newsletter form div.newslettertypen div label:last-of-type {
  text-align: right;
}

@media (min-width: 768px) {
  #footer section #newsletter form div.newslettertypen div label:last-of-type {
    text-align: left;
  }
}

@media (min-width: 1280px) {
  #footer section #newsletter form div.newslettertypen div label:last-of-type {
    text-align: right;
  }
}

@media (min-width: 640px) {
}

@media (min-width: 768px) {
}

@media (min-width: 1024px) {
}

@media (min-width: 1280px) {
  .xl\:inline {
    display: inline !important;
  }
}

@media (min-width: 1536px) {
}