/* Benutzerdefinitertes CSS*/

/*Gradient auf den Header*/
.container-header {
  height:90px;
  margin-top:5px;
  position: fixed;
  width:100%;
}

/*durchsichtigen HG faken*/
.container-header::after {
  background-image: linear-gradient(45deg, #58ab27 0%, #d4fc79 100%);
  content: "";
  opacity: 0.95;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  position: absolute;
  z-index: -1;   
}

/*hintergrundblau ausschalten*/
:root {
  --cassiopeia-color-primary: none;
}

/*Gallerie formatieren*/
.gallery-preview {
  position: relative;
  display: inline-block;
  border: 3px solid #444; /* Dunkelgrauer Rahmen */
  border-radius: 6px;
  overflow: hidden;
  max-width: 100%;
}

.gallery-preview img {
  display: block;
  width: 100%;
  height: auto;
}

/* Balken unten mit Text */
.gallery-preview::after {
  content: "Bildergalerie öffnen";
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background: #444; /* Dunkelgrau */
  color: #fff; /* Weißer Text */
  text-align: center;
  font-size: 0.95rem;
  padding: 15px 0;
  font-weight: bold;
}




/*Banner auf Startseite in Form bringen*/


html body.site.com_content.wrapper-static.view-article.no-layout.no-task.itemid-110 div.site-grid div.container-banner.full-width div.mod-randomimage.random-image img {
  width:100%;
  margin-top: 5px;
}

/*Kategorieanzeigen auf Startseite entfernen*/
html body.site.com_content.wrapper-static.view-category.layout-blog.no-task.itemid-107 div.site-grid div.grid-child.container-component main div.com-content-category-blog.blog div.com-content-category-blog__children.cat-children {
  display: none;
}

/*Vorwort auf Startseite in Form bringen*/
.card-header {
  background:none;
}
html body.site.com_content.wrapper-static.view-category.layout-blog.no-task.itemid-107 div.site-grid div.grid-child.container-top-b div.top-b.card {
  background-color:light-grey;
  padding:5px;
  box-shadow: 2px 5px 5px rgba(0,0,0,0.25)
}

/*3 Beiträge auf Startseite absetzen*/
html  div.com-content-category-blog__items.blog-items.columns-3 div.com-content-category-blog__item.blog-item {
  background-color:light-grey;
  padding:5px;
  box-shadow: 2px 5px 5px rgba(0,0,0,0.25)
}

/*Footer stylen*/

footer.container-footer.footer.full-width {
  background-image: linear-gradient(45deg, #58ab27 0%, #d4fc79 100%);
}

/*Vier Topcards erstellen*/
.top-a.card{
  margin-top:-260px;
  background-color: hsla(0, 0%, 25%, 0.65);
  color:white;
  height:210px;
  border:none;
}

/*Header auf Nebenseiten stylen*/

/*html body.site.com_content.wrapper-static.view-article.no-layout.no-task div.site-grid div.container-banner.full-width div.mod-randomimage.random-image img {*/
html body.site.com_content.wrapper-static.view-article.no-layout.no-task div.site-grid div.container-banner.full-width div.mod-randomimage.random-image img {
  max-height:250px;
  width:100%;
}

html body.site.com_content.wrapper-static.view-category.layout-blog.no-task.itemid-104.has-sidebar-right div.site-grid div.container-banner.full-width div.mod-randomimage.random-image img {
  max-height:250px;
  width:100%;
}
html body.site.com_jevents.wrapper-static.view-month.layout-calendar.no-task.itemid-105 div.site-grid div.container-banner.full-width div.mod-randomimage.random-image img {
  max-height:250px;
  width:100%;
}

html body.site.com_jevents.wrapper-static.view-list.layout-events.no-task.itemid-104.has-sidebar-right div.site-grid div.container-banner.full-width div.mod-randomimage.random-image img {
  max-height:250px;
  width:100%;  
}

html body.site.com_content.wrapper-static.view-form.layout-edit.no-task.itemid-195 div.site-grid div.container-banner.full-width div.mod-randomimage.random-image img {
  max-height:250px;
  width:100%;  
}

html body.site.com_jevents.wrapper-static div.site-grid div.container-banner.full-width div.mod-randomimage.random-image img {
  max-height:250px;
  width:100%; 
}

html body.site.com_jevents.wrapper-static.view-icalrepeat.layout-edit.task-icalrepeat.detail div.site-grid div.container-banner.full-width div.mod-randomimage.random-image img {
  max-height:250px;
  width:100%; 
}

html body.site.com_acym.wrapper-static.view-archive.layout-listing.task-listing.itemid-145.has-sidebar-left div.site-grid div.container-banner.full-width div.mod-randomimage.random-image img {
  max-height:250px;
  width:100%; 
}
/*html body.site.com_content.wrapper-static.view-article.no-layout.no-task.itemid-108.has-sidebar-right div.site-grid div.container-banner.full-width div.mod-randomimage.random-image img {
  max-height:250px;
  width:100%;
}
html body.site.com_content.wrapper-static.view-article.no-layout.no-task.itemid-103 div.site-grid div.container-banner.full-width div.mod-randomimage.random-image img {
  max-height:250px;
  width:100%
}*/

/*Artikel erstellen - Hintergrund unter den Knöpfen unten*/
html body.site.com_content.wrapper-static.view-form.layout-edit.no-task.itemid-195 div.site-grid div.grid-child.container-component main div.edit.item-page form#adminForm.form-validate.form-vertical div.mb-2 {
  background: linear-gradient(45deg, #58ab27 0%, #a5dd5a 100%);
  border-radius:4px;
  padding:5px;
}

/*Seitkarten stylen*/
.sidecard h3.card-header {  
  background: linear-gradient(45deg, #b3e568 0%, #c7f276 100%);
  border-radius:3px;
  color:white;

}

.sidecard {
  padding: 5px;
  box-shadow: 2px 5px 5px rgba(0,0,0,0.25);
}

/*
Buttons
*/

.btn-green {
  background: linear-gradient(45deg, #58ab27 0%, #a5dd5a 100%);
  border: #76d241;
  max-width: 90%;
  margin-left: auto;
  margin-right: auto;
}

.btn-green:hover {
  background: #76d241;
}

a.btn {
  background: linear-gradient(45deg, #58ab27 0%, #a5dd5a 100%);
  color: white;
  border: #76d241;
  word-break: break-word;
  white-space: normal;

}

a.btn:hover {
  background: #76d241;
  color: white
}


/*Newsletter Button*/

input.btn {
  background: linear-gradient(45deg, #58ab27 0%, #a5dd5a 100%);
  color: white;
  border: #76d241;
  word-break: break-word;
  white-space: normal;
}

input.btn:hover {
  background: #76d241;
  color: white
}

/*Menue stylen, Links schwarz färben*/
li.metismenu-item a {
  color:black;
}

/*CSS kleiner als 992px*/
@media (max-width: 992px) {

/*Toggler rechts halten*/
div.container-search nav.navbar.navbar-expand-md button.navbar-toggler.navbar-toggler-right {
  margin-left:auto;
  margin-right:15px;
}
/*  TopCard an mobile anpassen*/
  .top-a.card{
  margin-top:auto;
  border:none;
  }

/*  Header an mobile anpassen*/
  .container-header {
    height:unset;
  }
  


}