@charset "UTF-8";

/* COLORS NORD / DRACULA / CATPPUCCIN 10 as Standard Colors
in Subfolders parallel to global with extra colors / extra CSS */


/* Nord10, Dracula10, ... deep blueish is standard */


/* Headings follow primary color */
h1,
h2,
h3,
h4 {
    color: var(--cassiopeia-color-primary);
}

.breadcrumb {
  background: none;
}

/* Heading 3 in tabs / accordions dark */
h3[data-rlta-element="heading"] {
    color: var(--black);
}


figcaption {
  padding-top: 0.5em;
  text-align: center;
}

div.com-content-article.jbfullsite div.com-content-article__body h3 {
  border-bottom: 1px solid #333;
  border-image: linear-gradient(to right, #000 50%, transparent 50%) 100% 1;
  padding: 0.5rem 0rem 0.5rem 0rem;
  margin-bottom: 1.5rem;
}

/* manual grid - TODO: override with 2 column output! */
div.com-content-article.jbfullsite div.com-content-article__body figure[data-wf-figure].image,
div.com-content-article.jbfullsite div.com-content-article__body p,
div.com-content-article.jbfullsite div.com-content-article__body ul,
div.com-content-article.jbfullsite div.com-content-article__body table,
div.com-content-article.jbfullsite div.com-content-article__body pre
{
  width: 75%;
}


div.com-content-article.jbfullsite div.card.article-index {
  width: 23%;
}

div.com-content-article.jbfullsite div.card.article-index ul li:first-child a,
div.com-content-article.jbfullsite div.card.article-index ul li:last-child a{
  font-weight: bold;
}

div.com-content-article.jbfullsite div.card.article-index ul li a.active {
  font-weight: bold;
}

div.pagenavcounter {
  padding: 0.5rem 0rem;
  margin: 0.5rem 0rem 0.5rem 0rem;
  font-weight: bold;
}

a.toclink {
  text-decoration: none;
}

div.com-content-article.jbfullsite div.article-index div.card-body {
  background-color: #00000008;
}

/* More COLORS NORD in Subfolder global with extra colors / extra CSS */

/* Bootstrap classes added - following classes for color test purposes */

.text-bg-blue {
    background-color: var(--blue) !important;
    color: var(--white) !important;
}

.text-bg-indigo {
    background-color: var(--indigo) !important;
    color: var(--white) !important;
}

.text-bg-purple {
    background-color: var(--purple) !important;
    color: var(--white) !important;
}

.text-bg-pink {
    background-color: var(--pink) !important;
    color: var(--white) !important;
}

.text-bg-red {
    background-color: var(--red) !important;
    color: var(--white) !important;
}

.text-bg-orange {
    background-color: var(--orange) !important;
    color: var(--black) !important;
}

.text-bg-yellow {
    background-color: var(--yellow) !important;
    color: var(--black) !important;
}

.text-bg-green {
    background-color: var(--green) !important;
    color: var(--white) !important;
}

.text-bg-teal {
    background-color: var(--teal) !important;
    color: var(--black) !important;
}

.text-bg-cyan {
    background-color: var(--cyan) !important;
    color: var(--black) !important;
}

.text-bg-gray-500 {
    background-color: var(--gray-500) !important;
    color: var(--black) !important;
}

.text-bg-black {
    background-color: var(--black) !important;
    color: var(--white) !important;
}


/* make Headline in Banner not lighter - just normal
.container-banner .banner-overlay .overlay .text-thin {
  font-weight: normal;
}
 */

/* do not underline a in Headings */
a:not([class]) {
    text-decoration: none;
}

/* Blog Items */
.blog-item {
    margin-bottom: 1.5rem;
}

/* Quotes in Articles */
blockquote {
    padding: 10.5px 21px;
    margin: 0 0 21px;
    font-size: 18.75px;
    border-left: 5px solid #e6e6e6;
}

blockquote>p {
    margin-top: 0;
    margin-bottom: 0.2rem;
    font-size: 1.0rem;
}

/* Read-More button bit darker */
.btn-secondary {
    --btn-bg: var(--gray-200);
}

/* use BS class for full width in articles
   img-thumbnail from Bootstrap */
.img-thumbnail {
    width: 100%;
    background-color: #f9f9f9;
    padding: 0.2rem;
}

/* Margin for JEvents stuff in main columns */
div#jevents {
    margin-bottom: 10rem;
}

div#jevents_body .weekdaytopclr, 
div#jevents_body .previousmonth,
div#jevents_body .currentmonth,
div#jevents_body .nextmonth,
div#jevents_body .today,
div#jevents_body .caldaydigits, 
div#jevents_body .tablev1,
div#jevents_body .eventstyle {
  font-size: 1.2em;
}

div#jevents_body .buttontext {
  width: 10em;
}

div#jevents_body .buttontext a {
  font-size: 1.1em;
}


/* Image/FIGURE specifications */
figure[data-wf-figure].image {
    margin-bottom: 15px;
}

figure[data-wf-figure].float-end {
    margin: 5px 0px 5px 10px;
}

figure[data-wf-figure].image {
    width: 100%;
}

/* BANNER - Slim Down the Top Banner height */
.container-banner .banner-overlay {
    height: 45vh;
}

.container-banner .banner-overlay .overlay {
    background-color: rgba(0, 0, 0, .7);
}

/* Margin top of Article Info */
dl.article-info {
    margin-top: 0;
}


/* Ricing the Nav Modul */

ul.mod-menu li ul li.nav-item {
    padding-left: 20px;
}

ul.mod-menu li ul li.current {
    background: var(--card-cap-bg);
}

/* my personal MegaMenu - all Core Joomla and Bootstrap5 */

.metismenu.mod-menu .metismenu-item:not(.level-2)>ul {
    margin-top: 21px;
}

.metismenu.mod-menu .metismenu-item {
    padding: 0.25em 0.25em;
}

nav .list-group-item {
    border: none;
}

h5 + p.card-text {
    font-variant: small-caps;
}

@media (width >=576px) {
    .card-group {
        height: 30em;
    }
}

@media (width >=992px) {
    .container-header .metismenu>li.level-1>ul {
        min-width: 32em;
    }
}

@media (width >=1400px) {
    .container-header .metismenu>li.level-1>ul {
        min-width: 50em;
    }
}

@media (width <=992px) {
    .card-group>.card {
        flex: auto;
    }

    img.card-img-top {
        display: none;
    }

    div.overlay p.lead {
        font-size: 0.9em;
    }
  
    div.overlay p a {
        display: none;
    }
  
    .metismenu.mod-menu .metismenu-item:not(.level-2)>ul {
        margin-top: 0px;
    }
}

/* ??? deactive with list-group try for my mega menu
span.mod-menu__heading {
  border-bottom: 1px solid var(--cassiopeia-color-primary);
} 
*/

li.divider {
    margin-top: 1em;
}

span.mod-menu__separator {
    margin-left: 0.4em;
}


/* Code Blocks per pre-Tag 
pre {
    background: rgba(0, 0, 0, .03);
    padding: 10px;
}
*/

.bgfa {
    padding-left: 32px;
    position: relative;
}

.bgfa:before {
    position: absolute;
    font-family: 'FontAwesome';
    top: 5px;
    right: 10px;
    content: "\f121";
    font-size: 2rem;
}


/* color for JCE mediabox icon */
.wf-icon-zoom-image>svg {
    fill: #000 !important;
}


/* Change Orange style of tabs to Orange of Confiniti Akademie */
[data-rlta-element="container"][data-rlta-state="ready"][data-rlta-theme="neutral"][data-rlta-type="accordions"]>[data-rlta-element="button"][data-rlta-color="orange"]:not([data-rlta-state="closed"]),
[data-rlta-element="container"][data-rlta-state="ready"][data-rlta-theme="neutral"][data-rlta-type="accordions"]>[data-rlta-element="button"][data-rlta-color="orange"]:not([data-rlta-state="closed"]):hover,
[data-rlta-element="container"][data-rlta-state="ready"][data-rlta-theme="neutral"][data-rlta-type="tabs"]>[data-rlta-element="button-list"]>[data-rlta-element="button"][data-rlta-color="orange"]:not([data-rlta-state="closed"]),
[data-rlta-element="container"][data-rlta-state="ready"][data-rlta-theme="neutral"][data-rlta-type="tabs"]>[data-rlta-element="button-list"]>[data-rlta-element="button"][data-rlta-color="orange"]:not([data-rlta-state="closed"]):hover {
    background-color: #ff850d;
    border-color: #ff850d;
}


@media print {

    .logo,
    nav,
    aside,
    header,
    footer,
    .container-banner,
    .pager,
    .container-sidebar-right,
    .container-bottom-b,
    #back-top {
        display: none;
    }

    /* Font auf 16px/13pt setzen, Background auf Weiß und Schrift auf Schwarz setzen.*/
    /* Das spart Tinte */
    body {
        margin: .8cm .3cm;
        overflow: auto;
        font-size: 11pt;
        line-height: 1.4;
        color: #000;
        background: #fff !important;
    }

    h1 {
        font-size: 24pt;
        color: #000;
    }

    h2,
    h3,
    h4 {
        margin-top: 25px;
        font-size: 14pt;
        color: #000;
    }

    /* Alle Seitenumbrüche definieren */
    a {
        page-break-inside: avoid;
    }

    blockquote {
        page-break-inside: avoid;
    }

    h1,
    h2,
    h3,
    h4,
    h5,
    h6 {
        page-break-after: avoid;
        page-break-inside: avoid;
    }

    img {
        page-break-inside: avoid;
        page-break-after: avoid;
    }

    table,
    pre {
        page-break-inside: avoid;
    }

    ul,
    ol,
    dl {
        page-break-before: avoid;
    }

    /* Linkfarbe und Linkverhalten darstellen */
    a:link,
    a:visited,
    a {
        color: #0069a0;
        text-align: left;
        text-decoration: underline;
        background: transparent;
    }

    a[href^=http]:after {
        content: "";
    }

    article a[href^="#"]:after {
        content: "";
    }

    a:not(:local-link):after {
        content: " <" attr(href) "> ";
    }

    .wrapper,
    .main-content,
    .main-content>*,
    .main-content>*>* {
        display: block;
        width: 100%;
        max-width: 100%;
        padding: 0;
        overflow: auto;
    }

    .full-width {
        margin: 0 var(--s2);
    }

    article {
        padding: 10pt;
    }

    main {
        background-color: #fff;
    }

    /**
    * Eingebundene Videos verschwinden lassen und den Whitespace der iframes auf null reduzieren.
    */
    iframe {
        display: none;
        width: 0 !important;
        height: 0 !important;
        overflow: hidden !important;
        line-height: 0pt !important;
        white-space: nowrap;
    }
}