/* Schrift aus Google importieren - Gehe auf fonts.google.com, wähle eine Schrift aus und suche dort den Import Befehl */

@import url('https://fonts.googleapis.com/css2?family=Georama:wght@100&display=swap');

/* Schrift auf der Seite nutzen: Auf Google findest du auch die CSS Anweisung für die Nutzung der Schrift. Wenn du diese in das body element einfügst dann wird die Schrift auf der ganzen Webseite genutzt. */
/* Der Seitenkopf von Cassiopeia hat die Klasse "header" du steuerst diese also mit .header an */

:root {
  --cassiopeia-color-primary: #000;
  --cassiopeia-color-link: #000;
  --cassiopeia-color-hover: gray;
}

/* Zurück - Such Button usw... ---------- */
.btn-primary {
  border : 0;
  background-color: black; 
  color: white;
  box-shadow: 5px 5px 9px -1px rgba(255,255,255,0.79);
  -webkit-box-shadow: 5px 5px 9px -1px rgba(255,255,255,0.79);
  -moz-box-shadow: 5px 5px 9px -1px rgba(255,255,255,0.79);
}

.btn-primary:hover {
  background: #202020;
  color: white; 
  box-shadow: 5px 5px 9px -1px rgba(255,255,255,0.79);
  -webkit-box-shadow: 5px 5px 9px -1px rgba(255,255,255,0.79);
  -moz-box-shadow: 5px 5px 9px -1px rgba(255,255,255,0.79);
}

/* Header ----------------------------------------*/
.header {
  background-image: none; 
  
  text-shadow: 2px 2px 8px rgba(150, 150, 150, 1);
  
  background: rgb(0,0,0);
  background: -moz-linear-gradient(90deg, rgba(0,0,0,1) 0%, rgba(255,158,0,1) 50%, rgba(29,253,251,1) 100%);
  background: -webkit-linear-gradient(90deg, rgba(0,0,0,1) 0%, rgba(255,158,0,1) 50%, rgba(29,253,251,1) 100%);
  background: linear-gradient(90deg, rgba(0,0,0,1) 0%, rgba(255,158,0,1) 50%, rgba(29,253,251,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#1dfdfb",GradientType=1); 
}

/*Topmenu---------------------------------------------*/
.mymenu_top{
  /*position: fixed;
  width: 100%;
  z-index: 1;
  background-color: rgba(255,255,255,0.5);
  background-image: none;
  text-shadow: 2px 2px 8px rgba(150, 150, 150, 1);
  background: rgb(0,0,0);
  background: -moz-linear-gradient(90deg, rgba(0,0,0,1) 0%, rgba(255,158,0,1) 50%, rgba(29,253,251,1) 100%);
  background: -webkit-linear-gradient(90deg, rgba(0,0,0,1) 0%, rgba(255,158,0,1) 50%, rgba(29,253,251,1) 100%);
  background: linear-gradient(90deg, rgba(0,0,0,1) 0%, rgba(255,158,0,1) 50%, rgba(29,253,251,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#1dfdfb",GradientType=1);*/
}

.metismenu.mod-menu .metismenu-item:not(.level-1) > ul, .metismenu.mod-menu .metismenu-item:not(.level-2) > ul {
  background-color:rgba(255,255,255,0.5);
}

/*Banner---------------------------------------------*/
.container-banner img{
  /*margin-top: 50px;*/
}

/*Body---------------------------------------------*/
body {
  text-shadow: 2px 2px 8px rgba(150, 150, 150, 1);
  
  background: rgb(0,0,0);
  background: -moz-linear-gradient(90deg, rgba(0,0,0,1) 0%, rgba(255,158,0,1) 50%, rgba(29,253,251,1) 100%);
  background: -webkit-linear-gradient(90deg, rgba(0,0,0,1) 0%, rgba(255,158,0,1) 50%, rgba(29,253,251,1) 100%);
  background: linear-gradient(90deg, rgba(0,0,0,1) 0%, rgba(255,158,0,1) 50%, rgba(29,253,251,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#1dfdfb",GradientType=1);
}

/*Kontaktformular---------------------------------------------*/
.com-contact__container {
  /*Titel ausblenden*/
  display:none;
}
div.contact h3 {
  /*Titel ausblenden*/
  display:none;
}


.page-header{
  /*Titel ausblenden*/
  display:none;
}

/*Kontainer über Inhalt mittig (Aktuelle Seite) ---------------------------------------------*/
.mod-breadcrumbs__wrapper {
  border: 1px;
  border-style:dashed;
  border-color: black; 
  background-color:rgba(255,255,255,0.2);
  
}

/*Kontainer Inhalt mittig ---------------------------------------------*/
main {
  padding: 20px;
  border: 1px;
  border-style:dashed;
  border-color: black; 
  background-color:rgba(255,255,255,0.2);
}

/* Module ---------------------------------------------*/
/*Modul ganz*/
.mymodul{
  border: 1px;
  border-style:dashed;
  border-color: black; 
  background-color: transparent;
}

/*Modul Titel (oben)*/
.mymodul .card-header{
  background-color:rgba(255,255,255,0.4);
  color: black;
  text-shadow: -1px -1px 1px rgba(255,255,255,.1), 1px 1px 10px rgba(255,255,255,1);
}

/*Modul unten (Inhalt)*/
.mymodul .card-body{
  background-color:rgba(255,255,255,0.2); 
}

/* Menu links ---------------------------------------------*/
.mymenu_left{
  border: 0px;
}

.mod-list li{
   font-size: 16px;  
}

/*Tutorials*/
.list-unstyled .list-unstyled{
  list-style-type: disc;
}

/*Datenschutz*/
.mod-menu__sub .list-unstyled .small li{
  list-style-type: disc;
}

/* unbesuchte link */
.mymenu_left a:link {
  color: black;
}
/* visited link */
.mymenu_left a:visited {
  color: black;
}
/* mouse over link */
.mymenu_left a:hover {
  color: grey;
}
/* selected link */
.mymenu_left a:active {
  color: white;
}

/* Nach oben Button ---------------------------------------------*/
.back-to-top-link{
  color: black;  
}
.back-to-top-link:focus, .back-to-top-link:hover {
  background-color: grey;
  border-color: var(--white,#fff);
  color: var(--white,#fff);
}

/* footer ---------------------------------------------*/
.myfooter{
  border: 1px;
  border-style:dashed;
  border-color: black;
  
  text-align: center;
  text-shadow: 2px 2px 8px rgba(150, 150, 150, 1);
  
  background-color:rgba(255,255,255,0.2);
}

/* Phoca Download ---------------------------------------------*/
.pd-categories-view .col .card{
  background-color:transparent;
}

.pd-categories-view .col .card .card-body{
  background-color:rgba(255,255,255,0.2);
}
.pd-categories-view .col .card .card-footer{
  background-color:rgba(255,255,255,0.4);
}

/*-------------------------------------------------------------*/

/* Nur das Seitenmenü dauerhaft ausgeklappt anzeigen */
.sidebar-left .mod-menu__sub {
    display: block !important;       /* Untermenüs sichtbar machen */
    height: auto !important;         /* Höhe automatisch */
    visibility: visible !important;  /* Sichtbarkeit erzwingen */
    aria-hidden: false !important;   /* Optional, für Accessibility */
}

/* Optional: Toggle-Button verstecken, da nicht mehr nötig */
.sidebar-left .mod-menu__toggle-sub {
    display: none !important;
}