/* CSS Document
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
audio:not([controls]) { display: none; }
[hidden] { display: none; }

html { font-size: 100%; overflow-y: scroll; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; 
height: 100%;
}
 */
/* overpass-mono-regular - latin */
@font-face {
  font-family: 'Overpass Mono';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/overpass-mono-v15-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/overpass-mono-v15-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/overpass-mono-v15-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/overpass-mono-v15-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/overpass-mono-v15-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/overpass-mono-v15-latin-regular.svg#OverpassMono') format('svg'); /* Legacy iOS */
}
/* overpass-regular - latin */
@font-face {
  font-family: 'Overpass';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/overpass-v12-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/overpass-v12-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/overpass-v12-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/overpass-v12-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/overpass-v12-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/overpass-v12-latin-regular.svg#Overpass') format('svg'); /* Legacy iOS */
}

* { margin: 0; padding: 0; box-sizing: border-box;}

img, object, embed, video {
    max-width: 100%;
}
img {
    border: 0;
    -ms-interpolation-mode: bicubic;
    vertical-align: middle;
}

body, button, input, select, textarea { font-family: 'Overpass', sans-serif; }
body {
background: rgb(78,95,106);
font-size: 1rem;
line-height: 1.5rem;
color: rgb(95,103,108);
letter-spacing: 0.1rem;
}

.gridContainer {
}

a { text-decoration: none; color: rgb(154,171,41); font-family: "Overpass Mono";}
a:visited { color: rgb(154,171,41); }
a:hover { color: rgb(78,95,106); }
a:focus { text-decoration: none; }

/* Verbessert in allen Browsern die Lesbarkeit von Hyperlinks, die über die Tabulatortaste fokussiert werden (focus) und von Hyperlinks, auf die der Mauszeiger gerichtet ist (hover): h5bp.com/h */
a:hover, a:active { outline: 0; }


/* =============================================================================
   Typografie
   ========================================================================== */

p, ul {
margin-bottom: 1.5rem;
}

main { 
-ms-hyphens: auto; 
-moz-hyphens: auto; 
-webkit-hyphens: auto; 
hyphens: auto; 
} 

h1 {
color: rgb(154,171,41);
font-family: "Overpass Mono";
font-weight: 400;
font-size: 1.5rem;
line-height: 1.25rem;
margin:0em 0 0.5rem 0;
letter-spacing: 0.1rem;
-ms-hyphens: none; 
-moz-hyphens: none; 
-webkit-hyphens: none; 
hyphens: none; 
}

h2 {
font-family: "Overpass Mono";
color: rgb(154,171,41);
  font-weight: 500;
  font-size: 1.25rem;
margin-bottom: 1rem;
text-transform: uppercase;
-ms-hyphens: none; 
-moz-hyphens: none; 
-webkit-hyphens: none; 
hyphens: none; 
}
.gallery h2:before {
display: inline-block;
content: '';
background: url(../grafik/pfeil-unten.gif) bottom no-repeat;
background-size: contain;
width: 1rem;
height: 1.25rem;
margin: 0 0.75rem 0 0;
}
.jg_pathway  {
margin: 2rem 0 0 0;
}

.jg_pathway h2:before {
display: none;
}

h3 {
  font-weight: 600;
  font-size: 1.125rem;
margin-bottom: 0.5rem;
-ms-hyphens: none; 
-moz-hyphens: none; 
-webkit-hyphens: none; 
hyphens: none; 
}

address {
  font-style: normal;
}
button {
margin: 0.5rem 0 0 0;
}

input, textarea {
width:100%;
max-width: 600px;
margin: 0 0 0.5rem 0;
}

/* HEAD */
header {
position: fixed;
z-index: 9999;
background: #fff;
display:flex;
gap: 3rem;
}

header, footer, .item-page, .contact {
width: 100%;
padding: 1rem 10% 1rem 10%;
}

.jg_row, .item-page, .contact {
margin: 0em 0% 2em 0%;
padding: 3rem 10% 1rem 10%;
}

header .custom {
display: inline-block;
flex: 2;
vertical-align: top;
}

header .custom img {
min-width: 160px;
width: 30%;
max-width: 200px;
margin: 1rem 0 0rem 0;
}

#navigation {
flex:1;
margin: 0rem 0 0em 0;
text-transform: uppercase;
}
#navigation ul, footer ul {
list-style: none;
padding: 0;
margin: 1rem 0 0em 0;
}
#oben {
width: 100%;
display: flex;
flex-direction: row;
gap: 3rem;
background:  rgb(236, 238, 240);
padding: 7.5rem 10% 0rem 10%;
}
#platzhalter {
width: 100%;
background:  rgb(255, 255, 255);
padding: 7.5rem 10% 0rem 10%;
}
#oben .slideshowck {
    flex: 3;
}
#oben .moduletable-spruch {
    flex: 0;
    display: none;
}
main .moduletable {
margin: 0em 0 2rem 0;
}

main {
margin: auto;
padding: 0rem 0% 2rem 0%;
background: #fff;
}


/* JOOMGALLERY */

#jg-gallery-header {
width: 100%;
padding: 3rem 10% 0rem 10%;    
}
#jg-gallery-header h1 {
margin-bottom: -1rem;
}
#jg-gallery-header h1::before {
display: inline-block;
  content: '';
  background: url(../grafik/pfeil-unten.gif) bottom no-repeat;
    background-size: auto;
  background-size: contain;
  width: 1rem;
  height: 1.25rem;
  margin: 0 0.75rem 0 0;
}
.jg-gallery, .jg-gallery-text {
    margin: 0;
    padding: 0em 10%;
}
.jg-gallery {
    display:flex;
    gap: 3rem;
}
.jg-gallery.columns {
background:  rgb(236, 238, 240);
}
.jg-images {
flex:2;
}
.jg-subcategories {
flex:3;
display: grid;
gap: 3rem;
grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr));
padding-top: 3rem;
}
.jg-image {
  position: relative;
  transition: all 1s ease;
}
.jg-image-thumb {
width: 100%;
height: inherit;
aspect-ratio: 867 / 621;
object-fit: cover;
}
.jg-image, .jg-slide-thumb{
      filter: grayscale(1);
      aspect-ratio: initial;

}
.jg-slide {
      filter: grayscale(0);
}
.jg-image:hover, .jg-slide-thumb:hover {
      filter: grayscale(0);
}
.jg-image-caption {
  opacity: 1;
  color: rgb(255, 255, 255);
  position: absolute;
  display: block;
  bottom: 0em;
  font-weight: 300;
  font-size: 1.0rem;
  margin-bottom: 0em;
  background: rgba(51,50,49,0.50);
  padding: 0.5em 0.75em !important;
  width: 100%;
  transition: all 1s ease;
}
.jg-image-caption a {
  color: rgb(255, 255, 255);
}
a.jg-link:not(.btn) {
  word-break: normal !important;
  font-family: 'Overpass', sans-serif;
}
a.jg-link:not(.btn):hover {
text-decoration: none;
}
.jg-gallery-placeholder {
flex:1;
display: grid;
padding: 1rem 0 0 0;
gap: 1rem;
grid-template-columns: repeat(auto-fill, minmax(2rem, 1fr));
grid-template-rows: max-content max-content max-content;
}
.jg-gallery-text {
    margin-top: 2rem;
}
/* JOOMGALLERY Slideshow FS*/
.jg-gallery:not(.justified) .jg-category .jg-image {
    visibility: visible;
}
.jg-category {
}
.jg-category #raum {
    position: relative;
aspect-ratio: 867 / 621;

}
#raum img {
  aspect-ratio: 867 / 621;
  width: 100%;
  height: inherit;
  object-fit: cover;
}
.jg-category .jg-image {
position: absolute;
opacity: 0;
top: 0;
}
.fade {
  transition: all 2s ease;
}
  .jg-images[class*=" columns-"], .jg-images[class*=" masonry-"] {
    grid-template-columns: 1fr;
  }
.jg-slide .jg-image-caption {
    display: none;
}

.pagination li {
    display: inline-block;
    padding: 1rem 0.5rem;
}

/* Seitenfuß */
footer {
width: 90%;
padding: 2em 0% 1em 10%;
color: #fff;
background: rgb(78,95,106);
}

footer a:hover { color: #fff; }

footer .moduletable {
display: inline-block;
width: 100%;
}
.moduletable h3 {
font-family: "Overpass Mono";
font-weight: 300;
text-transform: uppercase;
}
footer .moduletable div {
display: inline-block;
padding: 0em 0em 0em 0em;
}
footer .moduletable div.custom div:first-child {
padding: 0em 0.5em 0em 0em;
vertical-align: top;
}
footer .custom a:before {
display: inline-block;
content: '';
background: url(../grafik/pfeil-rechts.gif) bottom no-repeat;
background-size: contain;
width: 1rem;
height: 1rem;
margin: 0 0.75rem 0 0;
}

footer .moduletable_menu {
display: inline-block;
width: 100%;
margin: 1em 0 2em 0;
}
footer li {
display: inline-block;
}
footer li:after {
content:'|';
margin: 0em 1.5em 0em 1.5em;
}
footer li:last-child:after {
content:'';
margin:0;
}

@media only screen and (min-width: 641px) {

#oben .slideshowck {
    flex: 3;
}

header .custom {
display: inline-block;
flex: 3;
vertical-align: top;
}
main .moduletable-spruch {
font-size: 1rem;
line-height: 1.25em;
display: inline-block;
width: 20%;
padding: 1.5rem 0 0rem 0;
vertical-align: top;
}
.Person {
-ms-hyphens: none; 
-moz-hyphens: none; 
-webkit-hyphens: none; 
hyphens: none; 
}
.jg-images {
flex:3;
}
.jg-gallery-placeholder {
padding: 2rem 0 0 0;
}

} 



@media only screen and (min-width: 768px) {

#oben .moduletable-spruch {
    flex: 1;
    display: block;
}
#oben .moduletable-spruch {
font-size: 1rem;
line-height: 1.5em;
padding: 1.5rem 0 0rem 0;
vertical-align: top;
-ms-hyphens: none; 
-moz-hyphens: none; 
-webkit-hyphens: none; 
hyphens: none; 
}
.jg-images {
flex:3;
}

.jg-gallery-placeholder {
grid-template-columns: repeat(auto-fill, minmax(3.5rem, 1fr));
}


footer .custom {
display: flex;
justify-content: left;
gap: 1rem;
}
footer .custom div:last-child {
align-self: flex-end;
}
footer .custom a:before {
margin: 0rem 0.75rem 0 3rem;
}
footer .moduletable_menu {
width: 30%;
}
footer li {
display: block;
}
footer li:after {
content:'';
margin: 0em;
}
}
@media only screen and (min-width: 1024px) {
#oben .moduletable-spruch {
padding: 3rem 0rem 0 0rem;
font-size: 1.25rem;
line-height: 1.5em;
}

.jg-images {
flex:3;
}
.jg-gallery-placeholder {
grid-template-columns: repeat(auto-fill, minmax(5rem, 1fr));
}

footer {
display: flex;
justify-content: space-between;
align-items: last baseline;
}

footer .moduletable_menu {
width: 30%;
}
footer li {
display: inline-block;
}
footer li:after {
content:'|';
margin: 0em 1.5em 0em 1.5em;
}
footer li:last-child:after {
content:'';
margin:0;
}
}
@media only screen and (min-width: 1400px) {
  .jg-gallery-placeholder {
grid-template-columns: repeat(auto-fill, minmax(7.5rem, 1fr));
}
}