/* CSS Document */
/* FARBEN 
BLAU
color: rgb(140,149,163); 50
color: rgb(186,191,200); 30
*/

@font-face {
    font-family: 'JetBrainsMono-Regular';
    src: url('../fonts/JetBrainsMono-Regular.eot');
    src: local('JetBrains Mono Regular'), local('JetBrainsMono-Regular'),
        url('../fonts/JetBrainsMono-Regular.eot?#iefix') format('embedded-opentype'),
        url('../fonts/JetBrainsMono-Regular.woff2') format('woff2'),
        url('../fonts/JetBrainsMono-Regular.woff') format('woff'),
        url('../fonts/JetBrainsMono-Regular.ttf') format('truetype'),
        url('../fonts/JetBrainsMono-Regular.svg#JetBrainsMono-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
  font-family: 'Alegreya Sans';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/alegreya-sans-v10-latin-regular.eot'); /* IE9 Compat Modes */
  src: /* local('Alegreya Sans'), local('Alegreya-Sans'), */
       url('../fonts/alegreya-sans-v10-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/alegreya-sans-v10-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/alegreya-sans-v10-latin-regular.woff') format('woff'),  /* Modern Browsers */
       url('../fonts/alegreya-sans-v10-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/alegreya-sans-v10-latin-regular.svg#AlegreyaSans') format('svg'); /* Legacy iOS */
}
@font-face {
  font-family: 'Font Awesome 5 Brands';
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: url('../fonts/fa-brands-400.eot'); /* IE9 Compat Modes */
  src: /* local('Font Awesome 5 Free'), local('FontAwesome5Free-Regular'), */
       url('../fonts/fa-brands-400.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/fa-brands-400.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/fa-brands-400.woff') format('woff'), /* Modern Browsers */
       url('../fonts/fa-brands-400.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/fa-brands-400.svg#fontawesome') format('svg'); /* Legacy iOS */
}

@font-face {
  font-family: 'Font Awesome 5 Free';
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: url('../fonts/fa-regular-400.eot'); /* IE9 Compat Modes */
  src: /* local('Font Awesome 5 Free'), local('FontAwesome5Free-Regular'), */
       url('../fonts/fa-regular-400.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/fa-regular-400.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/fa-regular-400.woff') format('woff'), /* Modern Browsers */
       url('../fonts/fa-regular-400.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/fa-regular-400.svg#fontawesome') format('svg'); /* Legacy iOS */
}

#top, footer {
position: relative;
}
#top a {
display: block;
position: absolute;
top: -200px;
}
#ende {
display: block;
position: absolute;

  visibility: hidden;
}
.clearfix {
clear: both;
margin:0;

}

#logo img {
width: 170px;
padding-bottom: 0.5rem;
}
#logo p {
margin: 0;;
}

/* NAVIGATION NEU */

#navigation {
display: flex;
margin: 0 0 0 -1rem;
}
ul.nav  {
display: flex;
  }
.nav li {
  position: relative;
  }
.nav li a, .nav li ul li a {
  display: inline-block;
  width: 100%;
  padding: 0.5rem 1rem;
  white-space: pre;
  }
.nav li ul {
  position: absolute;
  z-index: 99;
  text-align: left;
  background: rgba(255,255,255,0.9);
  top: 100%;
  left: 0;
  transform: scale(1, 0);
  transform-origin: top;
  transition: transform 400ms ease-in-out;
}
.nav li ul li {
  display: block;
  }

nav li a ~ ul a {
  opacity: 0;
  transition: opacity 150ms ease-in-out;
}

nav li:hover a ~ ul {
  transform: scale(1,1);
}
nav li:hover a ~ ul a {
  opacity: 1;
  transition: opacity 250ms ease-in-out 250ms;
}


/* SLIDESHOW */

.camera_caption {
/*padding: 1em 0%;*/
clear: both;
}
.camera_caption > div {
/**/
padding: 4rem 0; 
background: none;
}
.camera_caption_title, .camera_caption_desc {
display: inline-block;
padding: 0rem 0em;
}
#camera_wrap_103 .camera_caption_desc {
padding-top: 0em;
margin-bottom: 2rem;
}
#camera_wrap_103 .camera_caption_title, #camera_wrap_103 .camera_caption_desc {
float: left;
clear: both;
background: rgba(24,43,72,0.6) !important;
padding: 0.25rem 1rem 0.125rem 1rem;
}
#camera_wrap_103 .camera_caption_desc {
padding-top: 0em;
margin-bottom: 2rem;
}


/* OBERHALB CONTENT */

#oben .custom p {
margin: 0;
}

/* CONTENT */

.item-page .category-name, .item-page .tags, .category-name2 {
display: flex;
flex-direction: row;
}
.block-legend {
color: rgba(24,43,72,1);
font-weight: 600;
display: block;
width: 8rem;
padding: 0;
}

.block-item {
display: inline-block;
width: calc(100% - 9rem);
}
ul.tags {
padding: 0;
}

div.tags {
margin: 0 0 2em 0;
}

.tags li, .tag {
display: inline-block;
padding: 0 0.75em 0 0;
}

#links, #links2 { -ms-hyphens: auto; -moz-hyphens: auto; -webkit-hyphens: auto; hyphens: auto; } 
h1 {
font-family:'JetBrainsMono-Regular', monospace;color:rgb(164,4,21);
color:rgb(164,4,21);
/*color: rgba(24,43,72,1);*/
font-weight: 500;
font-size: 1.5rem;
line-height: 125%;
margin: 4rem 0 2rem 0;
-ms-hyphens: none; -moz-hyphens: none; -webkit-hyphens: none; hyphens: none;
}
h2 {
font-family:'JetBrainsMono-Regular', monospace;
/*color: rgba(24,43,72,1);*/
  font-weight: 300;
  font-size: 1.25rem;
line-height: 125%;
-ms-hyphens: none; -moz-hyphens: none; -webkit-hyphens: none; hyphens: none;
margin: 1em 0 1.5rem 0;
/**/color:rgb(164,4,21);
grid-column: 1 / -1;
}
h3 {
/*font-family:'JetBrainsMono-Regular', monospace;color:rgb(164,4,21);*/

color: rgba(24,43,72,1);
  font-weight: 600;
  font-size: 1.25rem;
-ms-hyphens: none; -moz-hyphens: none; -webkit-hyphens: none; hyphens: none;
}

.container p {
letter-spacing: 0.01em;
}
.pull-left {
float: left;
margin: 0 1rem 1.5rem 0;
width: 100%
}

.pull-right {
float: right;
margin: 0 0 1.5rem 10%;
width: 100%
}

/* EDITOR */

.wf-columns {
gap: 0em;
}
.wf-columns {
    display: block;
    width: 100%;
    margin: 0rem 0;
}
.wf-columns-layout-1-2 > .wf-column:last-child, .wf-columns-layout-2-1 > .wf-column:first-child {
    display: block;
    width: 100%;
    margin: 0;
    flex: none;
}
.wf-columns-layout-1-2 > .wf-column:first-child, .wf-columns-layout-2-1 > .wf-column:last-child {
    display: block;
    width: 100%;
    margin: 0;
    flex: none;
}
.wf-columns {
}
.wf-column:last-child {
margin-right: 0;
}
.wf-column img, .wfpopup img {
width: 100%;
object-fit: cover;
transition: all 0.5s ease-in-out;
}
.wfpopup {
display: inline-block;
overflow: hidden;
border: 1px solid rgba(24,43,72,0.3);
  background: #fff;
}
.wf-column .wfpopup, .pull-right .wfpopup, .pull-left .wfpopup {
width: 100%;
}
.wfpopup img:hover {
scale: 1.05;
}

.wf-mediabox-numbers *, [class^="wf-mediabox"] {
font-family: inherit;
}

/* BLOG */

.blog-items, .tag-category, .com-content-categories__items, .portfolio-beitrag {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
column-gap: 2rem;
}
.com-content-categories__items {
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}
.blog-item, .com-content-categories__item {
overflow: hidden;
width: 100%;
 display: flex;
 align-items: center;
justify-content: center;
-webkit-align-items: center;
 padding:40% 50%;
position: relative;
transition: all 1s ease-in-out;
background: #fff;
  margin: 0 0% 2rem 0;
}
.blog-items h1, .tag-category h1 {
width: 100%;
  grid-column: 1 / -1;
}
.com-content-categories__item {
background: none;
}
.blog-item img, .com-content-categories__item img {
transition: all 0.5s ease-in-out;
width: 100%;
height: 100%;
object-fit:cover;
position:absolute;
border: 1px solid rgba(24,43,72,0.3);
top:0;
left:0;
bottom:0;
right:0;
}
.com-content-categories__item img {
border: none;
}
.com-content-categories__item {
border: none;
}
/* KUNDEN */
.com-content-categories__item .item-image {
border: none;
background: none;
}
.com-content-categories__item .item-image img, .com-content-categories__item .com-content-categories__item-title {
object-fit:contain;
filter: grayscale(1);
}
.com-content-categories__item-title, .item-image {
transition: all 0.5s ease-in-out;
position:absolute;
top:0;
left:0;
bottom:0;
right:0;
 display: flex;
 align-items: center;
justify-content: center;
-webkit-align-items: center;
width: 100%;
aspect-ratio: 85 / 68;
}
.item-image img {
}
.item-image:hover img, .item-image:hover .item-name {
scale: 1.05;
filter: blur(0.08em);
}
.item-image:hover img {
filter: none;
}
.item-image:before, .item-name:before {
 content:'';
 }

.item-content {
position: absolute;
top: 0;
left:0;
width: 100%;
height: 100%;
padding: 2rem;
opacity: 0;
transition: all 1s ease-in-out;
}
.item-content:hover {
opacity: 1;
background: rgba(164,4,21,0.80);
background-blend-mode: multiply;
}

.blog-item .page-header * {
color: #fff;
}
.blog-item .page-header h2 {
margin: 0 0 1rem 0;
font-size: 1.125rem;
font-weight: 300;
}
.blog-item ul, .blog-item .page-header, .blog-item .category-name, .com-content-categories__description {
margin: 0 0 1rem 0;
font-size: 1rem;
line-height: 1.5em;
font-weight: 300;
letter-spacing: 0.03em;
}
.blog-item, .blog-item a, .blog-item a:hover, .blog-item a:visited, .com-content-categories__description {
color: #fff;
}
.item .page-header .tags {
margin: 0;
}

.blog-item .category-name:before, .com-content-categories__description:before {
content: "";
font-size: 5em;
display: block;
border-top: 1px solid #fff;
margin: 0.75rem 0;
}


/* MARGINALIE */

#rechts h2 {
padding: 0;
margin: 0rem 0 1.5em 0;
  }
  #rechts .moduletable ul {
padding: 0;
margin: 0rem 0 1.5em 0;
  }
  
#rechts .moduletable li {
  list-style-type: none;
list-style-position: inside;
padding: 0;
margin: 0em 0 0em 0;
  }
  
#rechts .moduletable li:before {
	font: normal normal normal 1em/1 'Font Awesome 5 Free';
  content: "\f1c1";
  padding: 0 1em 0 0;
  }

/* UNTEN */

#buttons img {
opacity: 0.5;
transition: all 0.25s ease-in;
}
#buttons img:hover {
opacity: 1;
scale: 1.1;
}


/* FOOTER */

.separator {
visibility: hidden;
}
footer ul {
list-style: none;
padding: 0;
flex: 1
}
.custom-adresse {
grid-column:span 3;
}
.custom-copy {
grid-column:span 4;
font-size: 0.875rem;
}
footer ul.nav, footer .nav li {
display: block;
    }
footer .nav li a {
padding: 0;
    }

footer {
font-size: 1rem;
line-height: 1.5em;
color: rgb(186,191,200);
}
footer a {
color: rgb(186,191,200);
}
#footer a:visited, footer .nav a:visited {
color: rgb(186,191,200);
}
#footer a:hover { color: #fff; }



@media only screen and (min-width: 769px) {
.camera_caption {
/*padding: 1em 0%;*/
clear: both;
padding: 0 8%;
}
.camera_caption > div {
/**/
margin: auto !important; 
background: none;
max-width: var(--breite);
}
.wf-columns {
    display: flex;
}
.wf-column a {
	position: relative;
	box-sizing: border-box;
	width: 100%;
	height: 0;
	display: block;
	padding: 75% 0 0 0;
	overflow: hidden;
	}
	
.wf-column img {
position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border: 0;
	}
.wf-columns-layout-1-2 > .wf-column:last-child, .wf-columns-layout-2-1 > .wf-column:first-child {
    width: calc(100% * 2 / 3.001);
    flex: none;
}
.wf-columns-layout-1-2 > .wf-column:first-child, .wf-columns-layout-2-1 > .wf-column:last-child {
    width: calc(100% * 1 / 3.001);
    flex: none;

}
.wf-columns-layout-1-2 > .wf-column:first-child a, .wf-columns-layout-2-1 > .wf-column:last-child a {
    	padding-top: calc(150% - 1.5rem);
}

.wf-columns-layout-1-2 > .wf-column:last-child {
padding-left: 2rem;
}

.wf-columns-layout-2-1 > .wf-column:first-child {
padding-right: 2rem;
}

.pull-left {
float: left;
margin: 0 1rem 2rem 0%;
width: calc(50% - 1rem);
}
.pull-right {
float: right;
margin: 0 0 2rem 1rem;
width: calc(50% - 1rem);
}
}