/* ----------------------------------------------------------------
CSS: Tischlerei T�pker
Version: 1.0
Date: 06.03.2026
Florian Diederich
www.florian-diederich.de
---------------------------------------------------------------- */

@font-face {
font-family: 'Dax-Italic';
font-style: normal;
font-weight: normal;
src: local('Dax-Italic'), url('fonts/dax-italic-5872e0c289d8d.woff') format('woff');
}


@font-face {
font-family: 'Dax-Light';
font-style: normal;
font-weight: normal;
src: local('Dax-Light'), url('fonts/dax-light-5872dfb3692b0.woff') format('woff');
}


@font-face {
font-family: 'Dax-Medium';
font-style: normal;
font-weight: normal;
src: local('Dax-Medium'), url('fonts/dax-medium-5872e00270bc1.woff') format('woff');
}


@font-face {
font-family: 'Dax-MediumItalic';
font-style: normal;
font-weight: normal;
src: local('Dax-MediumItalic'), url('fonts/dax-mediumitalic-5872e0e8d95e8.woff') format('woff');
}


@font-face {
font-family: 'Dax-Bold';
font-style: normal;
font-weight: normal;
src: local('Dax-Bold'), url('fonts/dax-bold-5872e03df1718.woff') format('woff');
}


@font-face {
font-family: 'Dax-ExtraBold';
font-style: normal;
font-weight: normal;
src: local('Dax-ExtraBold'), url('fonts/dax-extrabold-5872df5c91c89.woff') format('woff');
}


body {
	color:#fff;
	font-family: Arial, Helvetica, sans-serif; 
	font-size:1rem;
	font-size:14px;
  background:#666 !important
}


.slick-prev::before, .slick-next::before {

}

.slickdefault .slick-prev {
    height: 60px;
    width: 60px;
    background: transparent url('images/prev.png') !important;
}

.slick-prev::before {
    content: "";
}

.slickdefault .slick-next {
    margin-right: 0px;
    height: 60px;
    width: 60px;
    background: transparent url('images/next.png') !important;
}

.slick-next::before {
    content: "";
}


.nav-link:hover,
.nav-link {
  color: #fff;
font-family: 'Dax-Light';
}

h1, h2, h3 ,h4, h5, h6 {
font-family: 'Dax-Light';
font-style: normal;
font-weight: normal;
}

.frame a[class=""]:hover,
.frame a:not([class]):hover,
.frame a[class=""], .frame a:not([class]),
a:link, a, a:hover {
	color:#ffda00 ;
	text-decoration:none;
}

.navbar-nav .nav-link.active, .navbar-nav .nav-link.show {
  color: #ffda00;
}

.navbar-nav .nav-link.active .nav-link-text:after, 
.navbar-nav .nav-link.show .nav-link-text:after {
	content: '';
  	border-bottom: 1px solid #fff;
 	margin-top: 5px;
  	width: 100%;
  	display: block;
}



#page-content .sidebars {
  padding: 30px;
  box-sizing: border-box;
  background: #666;
}

#page-content .sidebars h1:after {
content: ' ';
  display: block;
  border: 1px solid #fff;
  width: 10%;
  margin-top: 15px;
}

#page-content .sidebars ul {
  padding-left: 14px;
}

.bg-white, .navbar-default, .navbar-default-transition, .navbar-default-transition.navbar-transition {
  background-color: #666 !important;
}


#page-content .headerimage .ce-image img {
	width: auto;
  	height: auto;
}

#page-content .headerimage.referenzen .ce-image img {
	width: auto;
  	height: auto;
}


#page-content .headerimage .carousel .carousel-content-inner {
  display: flex;
  height: 100%;
  align-items: flex-start;
}



#page-footer {
	position: fixed;
  	bottom: 0;
  	width: 100vW;
  	z-index: 12;
	height:30px;
	background:#666;
}

.footer-section-meta,
.footer-section-content {
	display:none;
}


#p1 {
	background:#666 url("images/start.jpg") no-repeat !important;
	background-size:cover !important;
}

#p1 #c2 img {
	display:none
}

#p1 #page-content;
#p1 #c2 {
	padding:0;
}
#p1 #page-footer {display:none}


#p1 {
 opacity: 1;
  transition: max-height 0.5s ease, opacity 0.5s ease;
}
#p1 #page-header.hidden {
/*	display:none */
	opacity: 0;
}
#p1 #toggle-btn {
	position: fixed;
  	top: 30px;
  	right: 30px;
	background: #666;
  	color: #fff;
  	border: 0;
  	z-index: 14;
	font-size: 20px;
}

#p1 h1::before {
  content: ' ';
  display: block;
  border: 1px solid #fff;
  width: 10%;
  margin-bottom: 15px;
}

.carousel .carousel-control-icon {
  display: none;
}

#page-content .headerimage .carousel .carousel-indicators {
  position: absolute;
  right: 0;
  bottom: 7%;
  left: 0;
  z-index: 2;
  display: flex;
  justify-content: center;
  padding: 0;
  margin-right: 15%;
  margin-bottom: 1rem;
  margin-left: 15%;
  z-index: 100;
}

#page-content .headerimage .carousel-indicators [data-bs-target] {
  width: 11px !important;
  height: 11px !important;
  padding: 0;
  margin-right: 5px;
  margin-left: 5px;
  text-indent: -999px;
  background-color: transparent;
  opacity: 1;
  transition: opacity 0.6s ease;
  border-radius: 100% !important;
  border: 1px solid aliceblue;
  border: 1px solid #ffda00 !important;
}

#page-content .headerimage .carousel-indicators .active[data-bs-target] {
  background-color: #ffda00 !important;
}


.startseite {
background: #666 url(images/logo.png) no-repeat right top;
background-position-y: 30px;
width:60%;
  max-width: 800px;
  margin: 0 anchor-size;
  margin: 0 auto;
  display: block;
  position: absolute;
  z-index: 1;
 top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
padding: 50px 30px;
    opacity: 0.95;
-webkit-box-shadow: 0px 0px 15px 5px rgba(0,0,0,0.42); 
box-shadow: 0px 0px 15px 5px rgba(0,0,0,0.42);
background-size: 210px auto;
}

#page-content .headerimage iframe {
	height: 100vH;
  	width: 100vW;
	opacity:0.8
}

.slick-dots li button {
  font-size: 0;
  line-height: 0;
  display: block;
  width: 15px;
  height: 15px;
  padding: 5px;
  cursor: pointer;
  color: transparent;
  border: 0;
  outline: 0;
  background: transparent;
  border: 2px solid #ffda00;
  border-radius: 100%;
}

.slick-dots li button::before {
	color:transparent;
} 
.slick-dots li.slick-active button::before {
	width: 15px;
  	height: 15px;
  	line-height:15px;  
	opacity: 1;
  	color: #ffda00;
  	background: #ffda00;
  	border-radius: 100%;
}

.slick-prev, .slick-next {
  z-index: 10;
}

#page-content .slick-prev, 
#page-content .slick-next {
  z-index: 11;
filter:invert(0)
}



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

#p1 {
	background:#666 url("images/start.jpg") no-repeat !important;
	background-size:cover !important;
}

#p1 #c2 img {
	display:none
}


#p1 #page-content {
	padding:0
}

#p1 #c2 {
	padding:0;
}
#p1 #page-footer {display:none}


.navbar-mainnavigation .nav-style-simple .dropdown-menu {
/*    display: block !important; */

  }

.navbar-mainnavigation .nav-link-toggle {

}

 #page-content .slick-initialized .slick-slide {
  display: block;
   max-height:60vH;
 } 

.frame-150 .gallery-item picture {
  width: 100%;
  height: auto;
  overflow:hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0;
} 

.frame-110 {
  height: 90vh !important;
  overflow-y: auto;

  /* Custom Scrollbar */
  scrollbar-width: thin;
  scrollbar-color: rgba(255,255,255,0.2) transparent;
}
.frame-110::-webkit-scrollbar { width: 4px; }
.frame-110::-webkit-scrollbar-track { background: transparent; }
.frame-110::-webkit-scrollbar-thumb {
  background: rgba(255,255,255,0.2);
  border-radius: 4px;
}

.sidebar-scroll-hint {
  position: absolute; /* relativ zu .sidebars */
  bottom: 30px;
  left: 0;
  right: 0;
  height: 48px;
  pointer-events: none;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  padding-bottom: 20px;
  background: linear-gradient(to bottom, transparent, rgba(0,0,0,0.3));
  transition: opacity 0.3s ease;
}
.sidebar-scroll-hint.is-hidden {
  opacity: 0;
}
.sidebar-scroll-hint::after {
  content: '';
  width: 10px;
  height: 10px;
  border-right: 2px solid rgba(255,255,255,0.6);
  border-bottom: 2px solid rgba(255,255,255,0.6);
  transform: rotate(45deg);
  animation: hint-bounce 1.2s ease-in-out infinite;
}
@keyframes hint-bounce {
  0%, 100% { transform: rotate(45deg) translateY(0); }
  50%       { transform: rotate(45deg) translateY(4px); }
} 


#p1 .navbar-mainnavigation .navbar-brand-image {opacity:0;pointer-events:none}


#nav-item-19 {
	position:fixed;
	bottom:65px;
}

#nav-item-20 {
	position:fixed;
	bottom:30px;
}

/* ============================================================
   Sidebar-Navigation: Untermen�s inline aufklappen
   Bootstrap Package / TYPO3 13.4
   ============================================================ */

/* 1. Dropdown aus dem normalen Dokumentfluss nehmen */
.navbar-nav .dropdown-menu {
    position: static !important;
    float: none;
    transform: none !important; /* Popper.js-Offsets neutralisieren */
    box-shadow: none;
    border: none;
    border-left: 0px solid #dee2e6; /* optisch: Einr�ckungslinie */
    border-radius: 0;
    padding: 0;
    margin: 0;
    /* Bootstrap blendet es per display:none aus, das bleibt so */
}

/* 2. Einr�ckung der Unterpunkte */
.navbar-nav .dropdown-menu .nav-link,
.navbar-nav .dropdown-menu .dropdown-item {
    padding-left: 1.5rem;
}

/* 3. Dritte Ebene noch weiter einr�cken */
.navbar-nav .dropdown-menu .dropdown-menu .nav-link,
.navbar-nav .dropdown-menu .dropdown-menu .dropdown-item {
    padding-left: 2.5rem;
}

/* 4. Popper.js komplett deaktivieren (verhindert position:absolute per JS) */
.navbar-nav .dropdown-menu[data-bs-popper] {
    top: auto !important;
    left: auto !important;
    right: auto !important;
}

/* 5. Animiertes Aufklappen (optional) */
.navbar-nav .dropdown-menu.show {
    display: block;
    animation: slideDown 0.2s ease-out;
}

@keyframes slideDown {
    from { opacity: 0; }
    to   { opacity: 1; }
}


#mainnavigation {
	top: 30px;
  	position: relative;
}

.navbar-mainnavigation .navbar-brand-image img {
  position: relative;
  top: 0;
  transform: translate(0, 0%);
}

.navbar-mainnavigation .navbar-brand-image img {
    max-height: calc(var(--mainnavigation-nav-height) * .99);
}

.navbar-mainnavigation > .container, .navbar-mainnavigation > .container-fluid, .navbar-mainnavigation > .container-sm, .navbar-mainnavigation > .container-md, .navbar-mainnavigation > .container-lg, .navbar-mainnavigation > .container-xl, .navbar-mainnavigation > .container-xxl {
    flex-wrap: wrap;
	display:block;
}

.navbar-mainnavigation .nav-link.nav-link-main::before {
    height: 0px;
  }

.navbar {
  background-image: none;
}

header#page-header {
width: calc(15% - 15px);
  border-left: 1px solid #fff;
  height: 100vH;
  position: fixed;
  right: 0;
  top: 0;
  z-index: 11;
}

.navbar-mainnavigation {
    flex-flow: column;
    justify-content: flex-start;
}

.navbar-mainnavigation .navbar-nav {
    flex-direction: column;
}

#page-content {
	padding: 30px;
}


#page-content .headerimage {
  margin-top: -10px;
  width: 85%;
  height: auto;
  overflow: hidden;
  box-sizing: border-box;
  overflow: hidden;
  background: #666;
  padding-top: 0px;
  position: fixed;
  top: 0px;
  top: 0px;
  z-index: 0;
  padding: 0px;
}

#page-content .headerimage .frame-header {
	position: absolute;
  	z-index: 11;
  	top: 10%;
  	left: 10%;
	width:100%;
    	opacity: 0.9;
  }

#page-content .headerimage .frame-header span {
}

#page-content .headerimage .frame-header h1 {
	font-size: 3rem;
  -webkit-box-decoration-break: clone;  
  box-decoration-break: clone;
background: #666;
    display: inline;
    padding: 10px 10px;
}


#page-content .headerimage.referenzen {
  	padding-right: 60px;
	position:absolute;
	overflow:scroll;
}

:root {
  --gallery-gap: 30px; 
}

#page-content .headerimage.referenzen  .gallery-row {
}

#page-content .headerimage.referenzen .gallery-item {
  width: calc((100% / var(--gallery-columns)) - (var(--gallery-gap) * (var(--gallery-columns) - 1)) / var(--gallery-columns));
position: relative;
}


#page-content .refcat  {}

#page-content .refcat  .gallery-item figure {
	position:relative
}

#page-content .refcat  .gallery-item figure .caption,
#page-content .headerimage.referenzen .gallery-item figure .caption {
  	padding-top: 0.25rem;
  	font-size: 1.5rem;
 	 word-wrap: break-word;
  	opacity: 1;
  	display: flex;
  	justify-content: center;
  	align-items: center;
  	position: absolute;
  	top: 0;
  	width: 100%;
  	height: 100%;
	width: auto;
    height: auto;
	font-family: 'Dax-Light';
	font-weight:400;
	left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
	text-align:center;
}

#page-content .refcat  .gallery-item .image a,
#page-content .headerimage.referenzen .gallery-item .image a {
	position: relative;
  	width: 100%;
  	height: 100%;
  	z-index: 2;
}

#page-content .refcat   .gallery-item:hover figure .caption,
#page-content .headerimage.referenzen .gallery-item:hover figure .caption {
	z-index:10
}
#page-content .refcat  .gallery-item .image:hover a img ,
#page-content .headerimage.referenzen .gallery-item .image:hover a img {
    height: auto;
    max-width: 100%;
    opacity: 0.3; 
}

#page-content .refcat  .gallery-item {
}

#page-content .refcat  .gallery-item,
#page-content .headerimage.referenzen .gallery-item {
	background:#000;
}


#page-content .headerimage img {
	height: 100%;
    	max-width: unset;
    	width: auto;
}

#page-content .headerimage.referenzen img {
    height: auto;
    max-width: 100%;
 width: 100% !important;
  height: 100% !important;
  max-width: unset;
  object-fit: contain; /* oder cover */
  object-fit: cover !important; /* oder cover */
  margin: 0 !important;
}

#page-content .headerimage  .frame-container-default {
    max-width: 100% !important;
	padding:0  
}

#page-content .headerimage .carousel .carousel-content-inner {
    max-width: 100% !important;
  }


#page-content .refdetail {
	padding-top:0px;
	height: calc(100% - 30px);
    max-width: 85%;
}

#page-content .slick-prev, .slick-next {
  z-index: 11;
}

#page-content .refdetail .slick-next {
  right: calc(40% + 5px);
}

#page-content .refdetail .slick-prev {
  left: 5px;
}

#page-content .refdetail .slick-sync .slick-next {
  right: 55px;
}


#page-content .refdetail  .slick-slider figure picture,
#page-content .refdetail  .slick-slider figure img {
  margin: 0 0;
}

#page-content .refdetail  .slick-slider .slick-slide {
	position:relative;
}

#page-content .refdetail  .slick-slider .slick-slide figcaption {
  position: absolute;
  float: right;
  width: 40%;
  top: 0;
  right: 0;
    padding: 30px;
	font-family: 'Dax-Light';
}

#page-content .refdetail  .slick-slider .slick-slide figcaption::first-line {
  font-size: 1.5rem;
}

#page-content .refdetail .slick-dots {
  width: 60%;
}


#page-content .refdetail .slick-slider img {
/*    height: 50vH;
    max-width: unset;
    width: auto !important;
    margin: 0 auto !important;
  */
 
 width: 100% !important;
  height: 100% !important;
  max-width: unset;
  object-fit: contain; /* oder cover */
  object-fit: cover !important; /* oder cover */
  margin: 0 !important;
}


#page-content .refdetail .slick-slide figure {
  margin: 0;
  max-width: 60%;
  background: #fff;
height: 50vH;
    display: flex !important;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

  
#page-content .refdetail .slick-sync img {
    height: auto;
    max-width: unset;
    width: 100%;
padding-right: 30px;
}

#page-content .refdetail .slick-sync .slick-track {
  margin-left: 0; 
}

#page-content .refdetail .slick-sync .slick-track .slick-slide {
}

#page-content .refdetail .slick-sync .slick-track .slick-slide:hover figcaption { 
	display:block;
	width: calc(100% - 30px) !important;
  	height: 100%;
  	background: #000;
  	float: left !important;
  	left: 0;
color:transparent;
	text-align:center;
}

#page-content .refdetail .slick-sync .slick-track .slick-slide:hover figcaption:first-line {
	color:#fff;
}

#page-content .refcat {
	margin-top:30px;
	max-width: 85%;
}

#page-content .refcat .frame-150 {
	padding:0;
	margin:0
}
#page-content .refcat .frame-container-default {
	width:100%;
	margin:0;
    padding: 0;
max-width:100%;
}

#page-content .sidebars {
	width: 30%;
  	line-height: 1.55;
  	float: right;
  	padding: 30px;
  	box-sizing: border-box;
  	background: #666;
  	opacity: 0.9;
  	height: 100vH;
  	overflow: auto;
	position: fixed;
  	z-index: 10;
    right: calc(15% - 15px);
  	top: 0;
}


 .sidebars {
    padding: 28px 24px 28px 28px;
    box-shadow: 0 8px 40px rgba(0,0,0,0.25);

    transform: translateX(0);
    opacity: 1;
    transition:
      transform 0.4s cubic-bezier(0.4, 0, 0.2, 1),
      opacity   0.35s ease;
  }

  /* Ausgefahren / versteckt */
  .sidebars.is-hidden {
    transform: translateX(calc(100% + 15vw + 40px)); /* komplett rechts raus */
    opacity: 0;
    pointer-events: none;
  }

  .sidebar-close {
    position: absolute;
    top: 50%;
   left:auto;
    transform: translateY(-50%);

    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: #666;
    color: #fff;
    font-size: 16px;
    line-height: 1;
    cursor: pointer;
    box-shadow: 0 2px 10px rgba(0,0,0,0.3);
    transition: background 0.2s, transform 0.2s;
    display: flex;
    align-items: center;
    justify-content: center;
	right: calc(45% - 33px);
    z-index: 15;
	border: 2px solid #fff;
  }

 .sidebar-close:hover {
    background: #ffda00;
    transform: translateY(-50%) scale(1.1);
 }


   .sidebar-open {
    font-size: 16px;
    line-height: 1;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    position: fixed;
    top: calc(50% - 18px);
   transform: translateY(-50%);
    right:calc(15% - 33px);
    background: #666;
	border: 2px solid #fff;
    color: #fff;
    border: none;
    padding: 0;
    font-size: 20px;
    cursor: pointer;
    box-shadow: unset;
    transition: opacity 0.3s, transform 0.3s, background 0.2s;
    opacity: 0;
    pointer-events: none;
    transform: translateX(10px);
    z-index: 14;
	border: 2px solid #fff;
  }

  .sidebar-open.visible {
    opacity: 1;
    pointer-events: all;
    transform: translateX(0);
  }

.sidebar-open:hover {
    background: #ffda00;
  }

}

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

.frame-150 .gallery-item picture {
  width: 100%;
  height: auto;
/*  max-height: 300px; */
  overflow:hidden
	} 
}

@media screen and (max-width:1920px) {
  #page-content .refcat .gallery-item {
/*    height: 220px; */
    overflow: hidden;
  }
}

@media screen and (max-width:1680px) {
  #page-content .refcat .gallery-item {
/*    height: 190px; */
    overflow: hidden;
  }
}

@media screen and (max-width:1440px) {
  #page-content .refcat .gallery-item {
/*    height: 180px; */
    overflow: hidden;
  }
}


@media screen and (max-width:1366px) {
  #page-content .refcat .gallery-item {
/*    height: 160px; */
    overflow: hidden;
  }
}

@media screen and (max-width:1280px) {
  #page-content .refcat .gallery-item {
/*    height: 150px; */
    overflow: hidden;
  }
}

@media screen and (max-width:1100px) {
  #page-content .refcat .gallery-item {
/*    height: 130px; */
    overflow: hidden;
  }
}


@media screen and (max-width:1024px) {
  #page-content .refcat .gallery-item {
 /*   height: 120px; */
    overflow: hidden;
  }
}


@media screen and (max-width:991px) {

.bg-white, .navbar-default, .navbar-default-transition, .navbar-default-transition.navbar-transition {
  background-color: #666666de !important;
}  


#page-content .refdetail .slick-slider .slick-next {
  right: 0;
}
#page-content .refdetail .slick-slider .slick-prev {
  left: 0;
}

  #page-content .refdetail .slick-slider .slick-slide figcaption {
    position: absolute;
    font-family: "Dax-Light";
    z-index: 100000;
    background: #666;
    padding: 10px 15px;
    top: 20px;
    left: 20px;
    max-width: 40%;
    font-size: 1rem;
    -webkit-box-decoration-break: clone;
    box-decoration-break: clone;
    background: #666;
    display: inline;
    padding: 8px 12px;
  }




#p1 {
	background:#666 url("images/mobile-bg.png") !important;
	background-size:cover;
}

#p1 #c2 img {
	display:none
}

.dropdown-menu {
  --bs-dropdown-border-width: unset;
  --bs-dropdown-box-shadow: unset;
}

.refdetail .slick-dotted.slick-slider {
  margin-bottom: 30px;
  max-height: 450px;
  overflow: hidden;
}

.refdetail  .slick-slide figure picture {
  height: 450px;
}

.refdetail  .slick-slide img {
 width: 100% !important;
  height: 100% !important;
  max-width: unset;
  object-fit: cover; /* oder cover */
  margin: 0 !important;
}

#page-content .refcat  .gallery-item figure {
	position:relative;

}

#page-content .refcat  .gallery-item figure .caption {
  word-wrap: break-word;
  	opacity: 1.0;
  	display: flex;
  	justify-content: center;
  	align-items: center;
  	position: absolute;
  	top: 0;
  	width: 100%;
  	height: 100%;
	font-family: 'Dax-Light';
	font-size: 1.2rem;
    padding: 20px;
	 text-align:center
}

#page-content .refcat  .gallery-item .image a {
position: relative;
  width: 100%;
  height: 100%;
  z-index: 2;
}

#page-content .refcat   .gallery-item:hover figure .caption {
	z-index:1
}
#page-content .refcat  .gallery-item:hover .image a img  {
    height: auto;
    max-width: 100%;
    opacity: 0.3;
  }

#page-content .refcat  .gallery-item {
	background:#000
}

#page-content .refcat   .frame-container-default {
    max-width: 100% !important;
  }


#page-content .headerimage iframe {
	height: 50vH;
  	width: 100vW;
	opacity:0.8
}



 #page-content .headerimage .frame-header {
    position: absolute;
    z-index: 11;
    left: 5%;
    width: 100%;
    opacity: 0.9;
	bottom: auto;
    	top: 15%;
  }
#page-content .headerimage .frame-header h1 {
	-webkit-box-decoration-break: clone;
	box-decoration-break: clone;
	background: #666;
	display: inline;
	padding: 3px 10px;
}

.headerimage.referenzen .gallery-row  {
	padding:0px 20px;
}
.headerimage.referenzen .gallery-row .gallery-item-size-3 {
  --gallery-columns: 2;
}

#p1 #toggle-btn,
#btnClose,
#btnOpen {display:none}

  #p1 #page-header.hidden {
  	display: block;
	z-index: 10;
opacity:1
}

#p1 {
  height: 100vH;
}

#page-content .sidebars {
  padding: 0px;
}

.navbar-toggler {
  	color: #fff;
	border: 0 !important;
  	outline: 0 !important;
  	box-shadow: unset !important;
}

.navbar-mainnavigation {
  box-shadow: 0 1px 0 0 rgb(255, 255, 255);
}
.startseite {
  	background: #666 url(images/logo.png) no-repeat right top;
background-size:200px auto;
    	background-position-y: top;
  	background-position-y: 30px;
  	width: 90%;
	opacity: 0.9;
}
.navbar {
  background-image: unset;
}
.carousel-fullscreen .item {
  height: auto;
}

#page-content .headerimage .carousel .carousel-indicators {
  bottom: 0;
}

.headerimage .frame-120 {
    padding: 0;
}

.headerimage  .frame-container-default {
    max-width: 100%;
    padding: 0;
}

.headerimage  .carousel .carousel-content-inner {
    max-width: 100%;
}

.headerimage  .carousel .carousel-item {
  padding-left: 0;
  padding-right: 0;
}

}


@media screen and (max-width:810px) {
.startseite {
  	background: #666 url(images/logo.png) no-repeat center top;
    	background-position-y: 20px;
	background-size:80px auto;
	text-align: center;
	width:90%;
}

#p1 h1::before {
	content: ' ';
	margin: 0 auto;
	margin-bottom: 15px;
}

#p1 h1 br {display:none}

}

@media screen and (max-width:600px) {


  #page-content .refdetail .slick-slider .slick-slide figcaption {
    max-width: 60%;
  }



#page-content .refcat .gallery-item {
    height: auto;
    overflow: hidden;
max-height:auto;
  }

.gallery-item-size-4 {
  --gallery-columns: 1;
}

.refdetail .slick-dotted.slick-slider {
  margin-bottom: 30px;
  max-height: 350px;
  overflow: hidden;
}

.refdetail  .slick-slide figure picture {
  height: 350px;
}

figure .caption {
  	padding-top: 0.25rem;
  	font-size: 1.1rem;
    text-align: left;
}

.headerimage.referenzen .gallery-row  {
	padding:0px 20px;
}
.headerimage.referenzen .gallery-row .gallery-item-size-3 {
  --gallery-columns: 1;
	}
}


@media screen and (max-width:480px) {

.refdetail  .slick-slide figure picture {
  height: 300px;
}

.refdetail .slick-dotted.slick-slider {
  margin-bottom: 30px;
  max-height: 300px;
  overflow: hidden;
}
}