/*
Theme Name: duiswebtheme
Author: Marc Hendricks
Author URI: https://www.duisweb.de
Description: Duisweb Vorlage Testversion
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: duiswebtheme
Template: astra
*/

/* lato-700 - latin-ext_latin */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 700;
  src: url('./fonts/lato-v20-latin-ext_latin-700.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('./fonts/lato-v20-latin-ext_latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('./fonts/lato-v20-latin-ext_latin-700.woff2') format('woff2'), /* Super Modern Browsers */
       url('./fonts/lato-v20-latin-ext_latin-700.woff') format('woff'), /* Modern Browsers */
       url('./fonts/lato-v20-latin-ext_latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
       url('./fonts/lato-v20-latin-ext_latin-700.svg#Lato') format('svg'); /* Legacy iOS */
}




/* open-sans-300 - latin-ext_latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 300;
  src: url('./fonts/open-sans-v27-latin-ext_latin-300.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('./fonts/open-sans-v27-latin-ext_latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('./fonts/open-sans-v27-latin-ext_latin-300.woff2') format('woff2'), /* Super Modern Browsers */
       url('./fonts/open-sans-v27-latin-ext_latin-300.woff') format('woff'), /* Modern Browsers */
       url('./fonts/open-sans-v27-latin-ext_latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
       url('./fonts/open-sans-v27-latin-ext_latin-300.svg#OpenSans') format('svg'); /* Legacy iOS */
}

/* open-sans-regular - latin-ext_latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: url('./fonts/open-sans-v27-latin-ext_latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('./fonts/open-sans-v27-latin-ext_latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('./fonts/open-sans-v27-latin-ext_latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('./fonts/open-sans-v27-latin-ext_latin-regular.woff') format('woff'), /* Modern Browsers */
       url('./fonts/open-sans-v27-latin-ext_latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('./fonts/open-sans-v27-latin-ext_latin-regular.svg#OpenSans') format('svg'); /* Legacy iOS */
}

/* open-sans-700 - latin-ext_latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 700;
  src: url('./fonts/open-sans-v27-latin-ext_latin-700.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('./fonts/open-sans-v27-latin-ext_latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('./fonts/open-sans-v27-latin-ext_latin-700.woff2') format('woff2'), /* Super Modern Browsers */
       url('./fonts/open-sans-v27-latin-ext_latin-700.woff') format('woff'), /* Modern Browsers */
       url('./fonts/open-sans-v27-latin-ext_latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
       url('./fonts/open-sans-v27-latin-ext_latin-700.svg#OpenSans') format('svg'); /* Legacy iOS */
}

/* open-sans-italic - latin-ext_latin */
@font-face {
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 400;
  src: url('./fonts/open-sans-v27-latin-ext_latin-italic.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('./fonts/open-sans-v27-latin-ext_latin-italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('./fonts/open-sans-v27-latin-ext_latin-italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('./fonts/open-sans-v27-latin-ext_latin-italic.woff') format('woff'), /* Modern Browsers */
       url('./fonts/open-sans-v27-latin-ext_latin-italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('./fonts/open-sans-v27-latin-ext_latin-italic.svg#OpenSans') format('svg'); /* Legacy iOS */
}



/* Schriftarten selbst definiert, nur Größe über Astra, sonst alles auf inherit */

body, button, input, select, textarea, .ast-button, .ast-custom-button {
    font-family: "Open Sans", sans-serif;
	font-weight: 400;
}

#ast-hf-menu-2, #ast-hf-menu-1 {
	
	font-family: "Lato", sans-serif;
font-weight: 700;
font-size: 18px;
text-transform: uppercase;

}

/* Änderungen Innovazept an Astra Voreinstellungen Anfang */




/* Intersection Observer Animationen 2 für Listen */

.item {
  opacity: 0;
  transform: translateY(135%);
  transition: opacity 2.7s, transform 1.7s;
}
.item.animate {
  opacity: 1;
  transform: translateY(0);
  transition: opacity 2.7s, transform 1.7s;
}

/* Intersection Observer Animationen 3 für diverse Bilder zB der Koch */

.koch-zoom {
	
	transition: transform 10s ease;
	transform: scale(0.9);
}


.koch-zoom.image-scaling {
	transform: scale(1.05);
}


/* Brotgalerie Hochklapp Technik */
/*--------------------------------------------------------------
    Team section css
--------------------------------------------------------------*/



.team-block {
	overflow: hidden;
	position: relative;
	border-radius: 4px;
}

.team-img-wrapper {
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
	
}

.team-name {
  margin-block-start: 0px !important;	
  background: var(--ast-global-color-0) none repeat scroll 0 0;
  font-weight: 700;
  letter-spacing: 1px;
  padding: 15px 0;
  text-align: center;
  text-transform: uppercase;
}

.team-desc-wrapper {
	margin-block-start: 0px !important;
	-webkit-transform: translateY(0);
	-moz-transform: translateY(0);
	-ms-transform: translateY(0);
	-o-transform: translateY(0);
	transform: translateY(0);
	left: 0;
	opacity: 1;
	position: absolute;
	visibility: visible;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
	background: var(--ast-global-color-0);
	padding: 20px 39px 0;
	height: 100%;
	width: 100%;
	border-radius: 4px;
}

.team-block:hover .team-desc-wrapper {
	-webkit-transform: translateY(-100%);
	-moz-transform: translateY(-100%);
	-ms-transform: translateY(-100%);
	-o-transform: translateY(-100%);
	transform: translateY(-100%);
	opacity: 1;
	visibility: visible;
}

.team-block:hover .team-img-wrapper {
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
}

.team-deg {
	color: #ffffff;
	font-weight: 300;
	position: relative;
	text-align: center;
	margin-bottom: 40px;
	margin-top: 10px;
	text-transform: none;
}

.team-deg:after {
	background: #ffffff none repeat scroll 0 0;
	content: "";
	height: 2px;
	left: 50%;
	margin-left: -12px;
	position: absolute;
	top: 32px;
	width: 25px;
}

.team-content {
	color: #ffffff;
	font-weight: 300;
	margin: 35px 0;
	text-align: center;
}

.team-content p {
	margin: 0;
}

.team-social {
	border-top: 1px solid rgba(255, 255, 255, 0.7);
	text-align: center;
}

.team-social a {
	color: #ffffff;
	display: inline-block;
	font-size: 30px;
	margin: 23px 0 0 12px;
}

.team-social a:first-child {
	margin-left: 0;
}

.team-desc-wrapper .team-name {
	background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
	color: #ffffff;
	display: block;
	margin: 16px 0 17px;
	padding: 0;
	text-align: center;
}






.ast-plain-container.ast-no-sidebar #primary {
  margin-top: 0px;
  margin-bottom: 0px;
}


.heading-title-kasten div.uagb-ifb-content div.uagb-ifb-button-wrapper.wp-block-button {
	margin-bottom:3em;
}

.heading-title-kasten div.uagb-ifb-content div.uagb-ifb-title-wrap h1.uagb-ifb-title mark {
	padding: 5px 15px 5px 15px;
	line-height: 1.5;
}



/* Änderungen Impulsschweissberatung an Astra Voreinstellungen Ende */



/* Engebettete SVG Formatierungen */

 ol.has-text-color li {
	display: block;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath style='fill: %23ffbf00;' d='M256 8c137 0 248 111 248 248S393 504 256 504 8 393 8 256 119 8 256 8zm-28.9 143.6l75.5 72.4H120c-13.3 0-24 10.7-24 24v16c0 13.3 10.7 24 24 24h182.6l-75.5 72.4c-9.7 9.3-9.9 24.8-.4 34.3l11 10.9c9.4 9.4 24.6 9.4 33.9 0L404.3 273c9.4-9.4 9.4-24.6 0-33.9L271.6 106.3c-9.4-9.4-24.6-9.4-33.9 0l-11 10.9c-9.5 9.6-9.3 25.1.4 34.4z'%3E%3C/path%3E%3C/svg%3E");
  background-size: 15px 57px;
  background-repeat: no-repeat; 
  background-position: left top;
  padding-left: 25px;
  padding-top: 15px;
  line-height: 1.4;
  margin-left: -20px;
}




.prg-1 {
	margin: 0 !important;
	padding:0;
 
}

.prg-2 {
	margin: 0 !important;
	padding:0;

}

.prg-3{
	margin: 0 !important;
	padding:0;
}

.card > .card-front > div:nth-child(1) > p {
	margin-bottom:10px;
}

.svg-star {
	width:100px !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 576 512'%3E%3Cpath d='M259.3 17.8L194 150.2 47.9 171.5c-26.2 3.8-36.7 36.1-17.7 54.6l105.7 103-25 145.5c-4.5 26.3 23.2 46 46.4 33.7L288 439.6l130.7 68.7c23.2 12.2 50.9-7.4 46.4-33.7l-25-145.5 105.7-103c19-18.5 8.5-50.8-17.7-54.6L382 150.2 316.7 17.8c-11.7-23.6-45.6-23.9-57.4 0z'%3E%3C/path%3E%3C/svg%3E");
background-size: 35px 35px;
  background-repeat: no-repeat;
  background-position: center center;
  padding: 0 0 50px 0 !important;
  margin-bottom: 0px;
}

.SEOkartenGruppe {
	
	padding: 1em !important;
}

.SEOsubHead {
	
	margin-bottom: 0 !important;
}

.SEOkartenText {
	line-height: 1.4;
	
}



.SEOkartenGruppe .wp-block-group__inner-container:hover {
background: rgba(255, 172, 4,.29);
border-color: #ffd38a;
border-radius: 2px;

}




/* Adresse Telefonnummer über dem Sticky Header - nicht sticky */

.ast-above-header-bar {
    padding: 0px 0;
   /* background-color: #1F1F1F !important;*/
/*    border-bottom: 0 solid rgba(255, 255, 255, 0.5);*/
    transition: all 0.35s;
}
section#block-11.widget.widget_block ul {
    list-style-type: none;
    padding: 0;
    margin: 0;
}

section#block-11.widget.widget_block ul li {
    display: inline-block;
    margin-right: 24px;
	color: #b3891c;
}

section#block-11.widget.widget_block ul li img {
	
	padding-right: 5px;
	padding-bottom:2px;
}

section#block-11.widget.widget_block ul li span {
	font-family: "Open Sans";
  font-weight: 300;
	font-size:14px;
}


/* CSS-Code für Logowechsel für Javascript-Zusammenspiel */

.ast-logo-title-inline .ast-site-identity {
	padding-bottom: 0;
	
}
.custom-logo {
  transform: translateY(0);
  opacity: 1;
}
.site-logo-img.first .custom-logo {
    animation: logoIn .5s;
    // transform: translateY(0);
    // opacity: 1;
  }
.site-logo-img.second .custom-logo {
    animation: logoOut .3s;
    transform: translateY(-114px);
    opacity: 1;
  }


@keyframes logoIn {
  0% {
    opacity: 0;
    transform: translateY(-114px);
  }
  50% {
    transform: translateY(5px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes logoOut {
  0% {
    opacity: 1;
    transform: translateY(0);
  }
  80% {
    opacity: 0;
  }
  100% {
    transform: translateY(-114px);
  }
}

.custom-logo-second {
  transform: translateY(114px);
  opacity: 0;
	margin-top:-114px;
}
.site-logo-img.second .custom-logo-second{
    animation: wordIn .3s;
    opacity: 1;
    transform: translateY(0);
  }
.site-logo-img.first .custom-logo-second {
    animation: wordOut .5s;
    opacity: 0;
    transform: translateY(114px);
  }


@keyframes wordIn {
  0% {
    opacity: 0;
    transform: translateY(114px);
  }
  50% {
    transform: translateY(-4px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes wordOut {
  0% {
    opacity: 1;
    transform: translateY(0);
  }
  80% {
    opacity: 0;
  }
  100% {
    transform: translateY(114px);
  }
}













/*Slider Formatierungen */

#primary-slider {
 
  border-bottom-width: 2px;
border-bottom-color: var(--ast-global-color-0);
border-bottom-style: solid;
}

/* Bei Duisweb mit altem Astra habe ich nicht das Problem mit dem inline css mit height:10rem; */
/* Kommt aus dem duisweb.js */
#primary-slider-slide01 {
/*	height:30rem !important; */
}

figure.slider-featured-image {
	margin: 0;
}


.slide-content {
    position: absolute;
    bottom: 0;
   /* background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0.3))); */
   /*  background: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.3)); */
    padding-bottom: 1em; 
    padding-left: 19%;
    position: absolute;
    width: 100%;
    text-align: left;
	line-height: 2.7;
}

.slide-content a {
	
	color: #26337E;
	background-color: #FFFFFF9E;
	padding: 0.5em 0.5em;
	
}

span.desc-small {
color: #26337E;
	background-color: #FFFFFF9E;
	margin-top:1em;
	padding: 0.5em 0.5em;
}


#colormag_featured_posts_slider_widget-2 figure.slider-featured-image {
  margin: 0 0 0em;
}

.splide__arrow--next {
    right: 1em;
}
.splide__arrow {
    
    background: #B3891C !important;
}

.splide__arrow svg {
  fill: #26337E;
}

/* CSS für den Text auf dem Header Slider */



.splide__slide div.slide-content {
	
width: 1903px;
	
        text-align: left;
		margin-bottom:1em;
}

@media (max-width: 544px) {
	
	.splide__slide div.slide-content {
	
width: 1903px;
	
        text-align: left;
		margin-bottom:1em;
}

	.slide-content h3.entry-title{
		
		font-size:20px;
	
	}
	
	.slide-content span.desc-small {
		display:none;
	}
	
}

.slide-content div.below-entry-meta mark {
   font-size:2em;
  padding-left:10px;
  padding-right:10px;
	background-color: #B3891C;
line-height: 18pt;
}




/*
figure.wp-block-image.size-full.is-resized > img:nth-child(1) {
  clip-path: polygon(0 0, 10% 0, 100% 80%, 0 0%);
    transition: 0.5s ease-in;
}

figure.wp-block-image.size-full.is-resized > img:nth-child(1).is-visible {
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
}
*/

/* Animate Elements wit Intersection Observer */
/*
.item {
  opacity: 0;
  transition: opacity .2s;
}

.item.animate {
  animation-name: fadeIn;
    animation-duration: 2.5s;
    animation-fill-mode: both; 
}


/*
div.wp-block-group.timeline--entry.item.animate:before {
	animation-name: fadeLeft;
    animation-duration: 5.5s;
    animation-fill-mode: both; 
	
}
*/
/*
div.wp-block-group.timeline--entry.item.animate:before {
	animation-name: fadeInUp;
    animation-duration: 3.5s;
    animation-fill-mode: forward;
	
}


.timeline--entry.item.animate:nth-of-type(even)  {
	
	animation-name: fadeInLeft;
    animation-duration: 2.5s;
    animation-fill-mode: both;
 
}

.timeline--entry.item.animate:nth-of-type(odd) {
	animation-name: fadeInRight;
    animation-duration: 2.5s;
    animation-fill-mode: both;
}



@keyframes fadeIn {

    0% {
    opacity: 0;
    
    -webkit-transform: translate3d(0,40%,0);
    transform: translate3d(0,40%,0);
    }

    100% {
    opacity: 1;
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
    }
}



@-webkit-keyframes fadeInLeft {
  0% {
  opacity: 0;
  background-color: #ff6c00;
  -webkit-transform: translate3d(-100%, 100%, 0);
  transform: translate3d(-100%, 100%, 0);
  }
  100% {
  opacity: 1;
  -webkit-transform: none;
  transform: none;
  }
  }
  @keyframes fadeInLeft {
  0% {
  opacity: 0;
  background-color: #ff6c00;
  -webkit-transform: translate3d(-100%, 100%, 0);
  transform: translate3d(-100%, 100%, 0);
  }
  100% {
  opacity: 1;
  -webkit-transform: none;
  transform: none;
  }
  } 



@-webkit-keyframes fadeInRight {
  0% {
  opacity: 0;
  background-color: #ff6c00;
  -webkit-transform: translate3d(100%, 100%, 0);
  transform: translate3d(100%, 100%, 0);
  }
  100% {
  opacity: 1;
  -webkit-transform: none;
  transform: none;
  }
  }
  @keyframes fadeInRight {
  0% {
  opacity: 0;
  background-color: #ff6c00;
  -webkit-transform: translate3d(100%, 100%, 0);
  transform: translate3d(100%, 100%, 0);
  }
  100% {
  opacity: 1;
  -webkit-transform: none;
  transform: none;
  }
  } 
  
  
@-webkit-keyframes fadeInUp {
  0% {
  opacity: 0;
  background-color: #ff6c00;
  -webkit-transform: translate3d(0, 2000px, 0);
  transform: translate3d(0, 2000px, 0);
  }
  100% {
  opacity: 1;
  -webkit-transform: none;
  transform: none;
  }
  }
  @keyframes fadeInUp {
  0% {
  opacity: 0;
  background-color: #ff6c00;
  -webkit-transform: translate3d(0, 2000px, 0);
  transform: translate3d(0, 2000px, 0);
  }
  100% {
  opacity: 1;
  -webkit-transform: none;
  transform: none;
  }
  } 

*/




/* Crossfade Image Block Markup */



.intro {
  position: relative;
  margin: 2em;
  padding: 0.2em 0.6em;
  cursor: pointer;
  color: #fff;
  font-size: 2em;
  max-width: 26em;
}
.intro h1 {
  margin-bottom: 0.5em;
  line-height: 1;
  font-weight: 100;
}
.CrossFade {
  
  background: #ffbf00;
  display: flex;
  align-items: flex-end;
  /* height: 100vh; */
  max-width: 100%;
  overflow: hidden;
  position: relative;
  padding: 0;
 
}
.CrossFade figure {
  position: absolute;
  min-width: 100%;
  min-height: 100%;
  height: auto;
  background: #000;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  opacity: 0;
  transform: scale(1.4) rotate(12deg);
  -webkit-animation: CrossFade 24s infinite;
          animation: CrossFade 24s infinite;
}



.CrossFade figure:nth-child(3) {
	margin:0;
  -webkit-animation-delay: 6s;
          animation-delay: 6s;
}
.CrossFade figure:nth-child(2) {
	margin:0;
  -webkit-animation-delay: 12s;
          animation-delay: 12s;
}
.CrossFade figure:nth-child(1) {
	margin:0;
  -webkit-animation-delay: 18s;
          animation-delay: 18s;
}



@-webkit-keyframes CrossFade {
  25% {
    opacity: 1;
    transform: scale(1) rotate(0);
  }
  40% {
    opacity: 0;
  }
}
@keyframes CrossFade {
  25% {
    opacity: 1;
    transform: scale(1) rotate(0);
  }
  40% {
    opacity: 0;
  }
}





  
/* Hier Code für die Flip Card Animationen */  

div.wp-block-group.flip div.wp-block-cover__inner-container {
		margin-left: 0;
margin-right: 0;
	width:85% !important; /* Randproblem Überschrift front nicht centered */
	max-width:380px !important;
	position:absolute;
	z-index:1;
}


  .flip {
  position: relative;
  padding: 0 !important;
}
.flip .front,
.flip .back {
  display: block;
  transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275);
  transition-duration: 0.5s;
  transition-property: transform, opacity;
}
.flip .front {
  transform: rotateY(0deg);
}
.flip .back {
  position: absolute;
  opacity: 0;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  transform: rotateY(-180deg);
}
.flip:hover .front {
  transform: rotateY(180deg);
}
.flip:hover .back {
  opacity: 1;
  transform: rotateY(0deg);
}
.flip.flip-vertical .back {
  transform: rotateX(-180deg);
}
.flip.flip-vertical:hover .front {
  transform: rotateX(180deg);
}
.flip.flip-vertical:hover .back {
  transform: rotateX(0deg);
}

.flip {
  position: relative;
  display: inline-block;
  margin-right: 2px;
  margin-bottom: 1em;
  width: 380px;
}
.flip .front,
.flip .back {
  display: block;
  color: white;
  width: inherit;
  background-size: cover !important;
  background-position: center !important;
  height: 100%;
  padding: 1em 2em; 
  background: #313131;
  border-radius: 10px;
}
.flip .front p,
.flip .back p {
  font-size: 0.9125rem;
  line-height: 160%;
  color: #999;
}

.text-shadow {
  text-shadow: 1px 1px rgba(0, 0, 0, 0.04), 2px 2px rgba(0, 0, 0, 0.04), 3px 3px rgba(0, 0, 0, 0.04), 4px 4px rgba(0, 0, 0, 0.04), 0.125rem 0.125rem rgba(0, 0, 0, 0.04), 6px 6px rgba(0, 0, 0, 0.04), 7px 7px rgba(0, 0, 0, 0.04), 8px 8px rgba(0, 0, 0, 0.04), 9px 9px rgba(0, 0, 0, 0.04), 0.3125rem 0.3125rem rgba(0, 0, 0, 0.04), 11px 11px rgba(0, 0, 0, 0.04), 12px 12px rgba(0, 0, 0, 0.04), 13px 13px rgba(0, 0, 0, 0.04), 14px 14px rgba(0, 0, 0, 0.04), 0.625rem 0.625rem rgba(0, 0, 0, 0.04), 16px 16px rgba(0, 0, 0, 0.04), 17px 17px rgba(0, 0, 0, 0.04), 18px 18px rgba(0, 0, 0, 0.04), 19px 19px rgba(0, 0, 0, 0.04), 1.25rem 1.25rem rgba(0, 0, 0, 0.04);
}


/* Shape Dividers fuer Gutenberg Cover Block - muss eine Gruppe drumherum für oben und dann noch eine Gruppe drumherum für unten */

.shapedividers_com-4740{
overflow:hidden !important;
position:relative;
/* Padding top 0 sonst wird der Rand oben abgeschnitten */
padding-top:0;
}
.shapedividers_com-4740::before{
content:'';
font-family:'shape divider from ShapeDividers.com';
position: absolute;
bottom: -1px;
left: -1px;
right: -1px;
top: -1px;
z-index: 3;
pointer-events: none;
background-repeat: no-repeat; 
background-size: 129% 73px;
background-position: 50% 0%;    
transform: rotateY(180deg);
background-image: url('data:image/svg+xml;charset=utf8, <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 381 76.2" preserveAspectRatio="none"><g fill="%23fffae5"><path d="M381 76.2l-12.7-8.47c-12.7-8.46-38.1-25.4-63.5-28.23-25.4-2.72-50.8 8.39-76.2 5.66-25.4-2.83-50.8-19.76-76.2-18.36-25.4 1.51-50.8 21.09-76.2 28.23-25.4 7.15-50.8 1.33-63.5-1.4L0 50.8V0h381z"/><path d="M381 67.73l-12.7-4.23c-12.7-4.23-38.1-12.7-63.5-12.7s-50.8 8.47-76.2 7.06c-25.4-1.5-50.8-12.62-76.2-11.3-25.4 1.33-50.8 15.62-76.2 21.17-25.4 5.56-50.8 2.91-63.5 1.4L0 67.74V0h381z" opacity=".66"/></g></svg>'); 
}

@media (min-width:768px){
.shapedividers_com-4740::before{
background-size: 128% 105px;
background-position: 50% 0%;  
transform: rotateY(180deg); 
}  
}
 
@media (min-width:1025px){
.shapedividers_com-4740::before{ 
bottom: -0.1vw;
left: -0.1vw;
right: -0.1vw;
top: -0.1vw; 
background-size: 146% 133px;
background-position: 50% 0%; 
transform: rotateY(180deg); 
}
}
@media (min-width:2100px){
.shapedividers_com-4740::before{
background-size: 146% calc(2vw + 133px);
}
}

/* ab hier rand unten */

.shapedividers_com-6063{
overflow:hidden !important;
position:relative;
/* Padding top/bottom 0 sonst wird der Rand oben abgeschnitten */
padding-top:0;
padding-bottom:0;
}
}
.shapedividers_com-6063::before{
content:'';
font-family:'shape divider from ShapeDividers.com';
position: absolute;
bottom: -1px;
left: -1px;
right: -1px;
top: -1px;
z-index: 3;
pointer-events: none;
background-repeat: no-repeat; 
background-size: 100% 73px;
background-position: 50% 100%;    
background-image: url('data:image/svg+xml;charset=utf8, <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320" preserveAspectRatio="none"><path fill="%23fffae5" d="M0 32l48 32c48 32 144 96 240 106.7 96 10.3 192-31.7 288-21.4 96 10.7 192 74.7 288 69.4 96-5.7 192-79.7 288-106.7s192-5 240 5.3l48 10.7v192H0z"/><path fill="%23fffae5" opacity=".66" d="M0 64l48 16c48 16 144 48 240 48s192-32 288-26.7C672 107 768 149 864 144s192-59 288-80 192-11 240-5.3l48 5.3v256H0z"/></svg>'); 
}

@media (min-width:768px){
.shapedividers_com-6063::before{
background-size: 100% 100px;
background-position: 50% 100%;   
}  
}
 
@media (min-width:1025px){
	
	
.shapedividers_com-6063::before{ 
bottom: -0.1vw;
left: -0.1vw;
right: -0.1vw;
top: -0.1vw; 
background-size: 100% 102px;
background-position: 50% 100%; 
transform: rotateY(180deg); 
}
}
@media (min-width:2100px){
.shapedividers_com-6063::before{
background-size: 100% calc(2vw + 102px);
}
}
 
/* Box flip neu responsive */

	.card {
  
  height: 500px;
  width: 300px;
  
  transform-style: preserve-3d;
  perspective: 600px;
  transition: 0.5s;
}
.card:hover .card-front {
  transform: rotateX(-180deg);
}
.card:hover .card-back {
  transform: rotateX(0deg);
}

.card-front {
  height: 100%;
  width: 100%;
  /* background-image: url(); */
  background-position: 50% 50%;
  background-size: cover;
  position: absolute;
  
  top: 0;
  left: 0;
  background-color: none;
  backface-visibility: hidden;
  transform: rotateX(0deg);
  transition: 0.5s;
  color: #ffffff;
  padding: 1em !important;
  border-radius: 4px;
}



.card-back {
margin-block-start: 0px !important;
	border-radius: 4px;
  height: 100%;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-color: #000000;
  backface-visibility: hidden;
  transform: rotateX(180deg);
  transition: 0.5s;
  color: #ffffff;
  text-align: center;
	padding: 1em !important;
}
.card-back h2 {
  margin: 60% auto 35% auto;
  font-size: 26px;
}
.card-back h2 span {
  font-size: 20px;
}
.card-back a {
  height: 20px;
  width: 20px;
  padding: 5px 5px;
  border-radius: 4px;
  line-height: 20px;

}
.card-back a:hover {
  color: #ffffff;
  background-color: none;
	text-decoration:none;
}
.card-back p.has-text-align-center.has-ast-global-color-5-color.has-text-color a {
	text-decoration:none;
}


/*Test Testimonial Slider - CSS Slideshow mit Keyframes Mediaevent*/

.css-slides {
	/*max-width:initial !important; */
	/*width:initial !important; */
	/*margin:0 !important; */
	padding-top:0 !important;
	padding-left:0;
	padding-right:0;
	position:relative;
	height:0;
	
	padding-bottom: calc(480/850 * 100%) !important;
	overflow:hidden;
	display:block;
	
}



.css-slides img { 
    
    opacity:0; 
    animation-name: fade; 
    animation-duration: 9s; 
    animation-iteration-count: infinite; 
    position:absolute; 
    left:0; 
    right:0; 
	
}

@keyframes fade {
	0%      { opacity: 0; }  /** fadeIn beginnt            **/
	11.11%  { opacity: 1; }  /** Bild steht                **/
	33.33%  { opacity: 1; }  /** Bild bleibt zwei Sekunden **/
	44.44%  { opacity: 0; }  /** fadeOut beendet           **/
	100%    { opacity: 0; }
}

.css-slides > div:nth-child(1) > figure:nth-child(1) > img { animation-delay: 0s; }
.css-slides > div:nth-child(1) > figure:nth-child(2) > img { animation-delay: 3s; }
.css-slides > div:nth-child(1) > figure:nth-child(3) > img { animation-delay: 6s; } 



/*Test Testimonial Slider von testseite3*/

.slider {
  position: relative;
  padding-top:0px !important;
  margin-top: 0;
  margin-right: auto;
  margin-left: auto;
  overflow: hidden;
 width:450px;
  height: 450px;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.25);
}

.slider__list {
  position: absolute;
  left: 0;
  max-width:initial !important;
  width: 1350px !important;
}

ul.slider__list li {
	list-style:none;
}

ul.slider__list li img {
  float: left;
  padding: 10px;
}

ul.slider__list {
  -webkit-animation-name: autoplay;
  animation-name: autoplay;
  /* This will change the time it takes to move to next slide */
  -webkit-animation-duration: 10s;
  animation-duration: 10s;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}


@-webkit-keyframes 
autoplay {   /* position of the first slide */
  0% {
 left: 0;
}
  /* position of the second slide */
  50% {
 left: -450px;
}
  /* position of the third slide */
  100% {
 left: -900px;
}

}

@keyframes 
autoplay {   /* position of the first slide */
  0% {
 left: 0;
}
  /* position of the second slide */
  50% {
 left: -450px;
}
  /* position of the third slide */
  100% {
 left: -900px;
}

}

/*Accordion für die FAQ Section*/

/* The Magic */
.accordion:hover .accordion-item:hover .accordion-item-content,
.accordion .accordion-item--default .accordion-item-content {
    height: auto;
}

.accordion-item-content,
.accordion:hover .accordion-item-content {
    height: 0;
    overflow: hidden;
    transition: height .25s;
}

/* Aesthetic */

.accordion {
    padding: 0;
    margin: 0 auto;
    width: 100% !important;
	max-width:100% !important;
   
}

.accordion .accordion-item {
  background-image: linear-gradient(90deg, #eee, #f5f5f5, #eee);
  border: 1px solid #666;
padding: 1em;
color: #333;
max-width: 100% !important;
margin-bottom: 5px;
  
}

p.has-text-align-center.accordion-item-content a {
	color: #333;
}

p.has-text-align-center.accordion-item-content {
	color: #333;
	max-width:80% !important;
}

.accordion-item h3 {
	max-width:80% !important;
    color: #d00505;
}

.accordion h1 {
  margin: 0;
  
}

.accordion .accordion-item:nth-child(1) {
    background-color: #ddd;
  background-image: linear-gradient(to bottom, rgb(255, 255, 255) 0%,rgb(217, 217, 217) 100%);
}

.accordion .accordion-item:nth-child(2) {
      background-color: #ddd;
  background-image: linear-gradient(to bottom, rgb(255, 255, 255) 0%,rgb(217, 217, 217) 100%);
}

.accordion .accordion-item:nth-child(3) {
    background-color: #ddd;
  background-image: linear-gradient(to bottom, rgb(255, 255, 255) 0%,rgb(217, 217, 217) 100%);
}

.accordion .accordion-item:nth-child(4) {
   background-color: #ddd;
  background-image: linear-gradient(to bottom, rgb(255, 255, 255) 0%,rgb(217, 217, 217) 100%);
}

.accordion .accordion-item:nth-child(5) {
  background-color: #ddd;
  background-image: linear-gradient(to bottom, rgb(255, 255, 255) 0%,rgb(217, 217, 217) 100%);
}

.accordion .accordion-item:nth-child(6) {
   background-color: #ddd;
  background-image: linear-gradient(to bottom, rgb(255, 255, 255) 0%,rgb(217, 217, 217) 100%);
}

.accordion .accordion-item:nth-child(7) {
  background-color: #ddd;
  background-image: linear-gradient(to bottom, rgb(255, 255, 255) 0%,rgb(217, 217, 217) 100%);
}

.accordion .accordion-item:nth-child(8) {
   background-color: #ddd;
  background-image: linear-gradient(to bottom, rgb(255, 255, 255) 0%,rgb(217, 217, 217) 100%);
}

.accordion .accordion-item:nth-child(9) {
  background-color: #ddd;
  background-image: linear-gradient(to bottom, rgb(255, 255, 255) 0%,rgb(217, 217, 217) 100%);
}

.accordion .accordion-item:nth-child(10) {
   background-color: #ddd;
  background-image: linear-gradient(to bottom, rgb(255, 255, 255) 0%,rgb(217, 217, 217) 100%);
}

.accordion .accordion-item:nth-child(11) {
  background-color: #ddd;
  background-image: linear-gradient(to bottom, rgb(255, 255, 255) 0%,rgb(217, 217, 217) 100%);
}

.accordion .accordion-item:nth-child(12) {
   background-color: #ddd;
  background-image: linear-gradient(to bottom, rgb(255, 255, 255) 0%,rgb(217, 217, 217) 100%);
}


@media (max-width:810px) {
	
		.spaltefirst {
	
	padding-left:0px;
}

h6.has-text-align-center, h2.has-text-align-center {
	
	padding-right:0px;
}
	
div.wp-block-columns.alignwide.flex-container {
    flex-flow: row wrap;
  }
  
  .wp-block-column.card:first-child {
    flex-basis: 100%;
  }
  .wp-block-column.card:not(first-child) {
    flex-basis: 100%;
	margin-left:1em !important;
	margin-right:1em !important;
  }
  
.wp-block-group.card-back, .wp-block-group.card-back {
	padding:2em;
}
}