/**
 * Theme Name: Blocksy Child
 * Description: Blocksy Child theme
 * Author: Creative Themes
 * Template: blocksy
 * Text Domain: blocksy
*/


	@media (max-width: 767px) { 		
		.wp-block-stackable-column { transform: none !important; }
	}
	
	@media (min-width: 768px) {}


body {   
    background-size: contain;
    background-repeat: repeat-y;
    background-image: url(https://www.eselskrug.de/wp-content/uploads/2022/04/2-scaled.jpg);
}




div[id*='slide06'].splide__slide { display: none !important;  }





/* lose und freie Klassen 
__________________________________________________________________________________*/

	h1 { margin-bottom: 0.75em !important; margin-top: 0 !important; }
	h1 strong { 
		font-weight: 400 !important;
		background-image: url("https://www.eselskrug.de/wp-content/uploads/2022/04/textwischer.svg"); 
		background-repeat: no-repeat;
		background-size: 100% auto;
		background-position: center 53px;
		overflow: visible;
		padding: 1em 0.25em;
		}
		@media (max-width: 767px) {	
			h1 strong { background-position: center 33px; }
		}
	h2 { margin-bottom: 0.75em !important; }
	h3 { margin-bottom: 1em !important; }
	h4 { margin-bottom: 1.3em;  }
	h5 { margin-bottom: 1em; }

	hr {	
			margin: 40px 0 !important; 
			height: 1px !important;
			width: 80%;
		}

	p a, b, strong { font-weight: 600 !important; }


	p { margin-bottom: 0.5em !important; }

	.blocksatz { text-align: justify; hyphens: auto }
	


    /* Schatten -> https://www.joshwcomeau.com/shadow-palette */
		:root {
			  --shadow-color: 25deg 28% 63%;
			  --shadow-elevation-low:
				0px 0.6px 0.8px hsl(var(--shadow-color) / 0.16),
				0px 1px 1.3px -0.6px hsl(var(--shadow-color) / 0.27),
				0px 2.3px 3px -1.2px hsl(var(--shadow-color) / 0.38);
			  --shadow-elevation-medium:
				0px 0.6px 0.8px hsl(var(--shadow-color) / 0.17),
				0px 2.3px 3px -0.4px hsl(var(--shadow-color) / 0.26),
				-0.1px 5.1px 6.7px -0.8px hsl(var(--shadow-color) / 0.35),
				-0.1px 11.4px 15px -1.2px hsl(var(--shadow-color) / 0.43);
			  --shadow-elevation-high:
				0px 0.6px 0.8px hsl(var(--shadow-color) / 0.18),
				-0.1px 5.2px 6.8px -0.2px hsl(var(--shadow-color) / 0.24),
				-0.1px 9.5px 12.5px -0.4px hsl(var(--shadow-color) / 0.29),
				-0.2px 15.3px 20.1px -0.6px hsl(var(--shadow-color) / 0.34),
				-0.3px 23.9px 31.4px -0.8px hsl(var(--shadow-color) / 0.39),
				-0.5px 36.9px 48.4px -1px hsl(var(--shadow-color) / 0.45),
				-0.7px 55.9px 73.4px -1.2px hsl(var(--shadow-color) / 0.5);
			}

			.schatten.small { box-shadow: var(--shadow-elevation-low); }
			.schatten 		{ box-shadow: var(--shadow-elevation-medium); }	
			.schatten.large { box-shadow: var(--shadow-elevation-high); }

     
    .kolumnen .stk-inner-blocks {
		column-width: 320px;
        column-count:  2;
        column-gap: 10em;
        column-rule: 1px solid rgba(0,0,0,0.5);
        margin-top: 2rem;
        display: block;
        text-align: justify;
        }
		@media (max-width: 768px) {	.kolumnen .stk-inner-blocks {margin-top: 0rem;} }

		.kolumnen.weiss {
				column-rule: 1px solid rgba(255,255,255,1.00);
				}
		.kolumnen h1 { margin-top: -20px !important; margin-bottom: 0; padding-bottom:0; }

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



	.wp-block-image img,
	.blocks-gallery-item img { border-radius: 3px !important; }

	.wp-block-image:hover a img {  
		--shadow-color: 0deg 0% 25%;
    	--shadow-elevation-high: 2px 10px 20px  hsl(var(--shadow-color) / 0.9);
		box-shadow: var(--shadow-elevation-high) !important; 
		
		transform: scale(1.1) rotate(-3deg);
		z-index: 99;
	}
	.rechts .wp-block-image:hover a img {
			transform: scale(1.1) rotate(3deg);
		}








/* Header 
__________________________________________________________________________________*/

	.hero-section .ct-image-container img, 
	.hero-section .ct-image-container picture, 
	.hero-section .ct-image-container video {
		object-position: var(--object-position, 50% 100%) !important;
			}

	@media (max-width: 767px) {	
		[data-header*="type-1"] .ct-header [data-transparent-row="yes"][data-row*="middle"] {
			background-position: 50% -80px;
			background-size: 150%;
		}
	}		
	@media (min-width: 768px) {	
		[data-header*="type-1"] .ct-header [data-transparent-row="yes"][data-row*="middle"] {
			background-position: 50% 0px;
			background-size: 80%;
			}					
		}

	header .ct-breadcrumbs { display: none; }



	
/* Anpassung für übergroße Breiten______________________________________________*/
	
@media (min-width: 2000px) {	
		
		[data-prefix="single_page"] .hero-section[data-type="type-2"] { min-height: 1400px !important; }
		.hero-section-startseite { height: 1400px !important; }
		[data-header*="type-1"] .ct-header [data-transparent-row="yes"][data-row*="middle"] { background-size: 50%; }
		#aufkleberbild-header { margin-top: -400px !important;	} /* Stickerbild */
		
		}

		.logo1, .logo2 {
			position: absolute;
			left: 40px;
			max-width: 450px;
			top: 40px;
			filter: drop-shadow(0px 5px 12px rgba(0, 0, 0, 0.5));
			z-index: 200;
			}
			@media (max-width: 768px) { .logo1, .logo2 { max-width: 40vw; top: 15px; left: 15px; }	}


		@keyframes cf3FadeInOut {
		  0% { opacity:1; }
		 45% { opacity:1; }
		 55% { opacity:0; }
		100% { opacity:0; }
		}

		#logoanimation img.logo2 {
			animation-name: cf3FadeInOut;
			animation-timing-function: ease-in-out;
			animation-iteration-count: infinite;
			animation-duration: 10s;
			animation-direction: alternate;
		}







/* Menü 
__________________________________________________________________________________*/



/*	#header [data-column='end'] {
		margin-left: 150px;
    	margin-right: 150px;
		overflow: hidden;
		
}*/


		[class*="header-menu"] {
			height: 40px !important;
			margin-top: 120px !important;
			border-radius: 3px;
			z-index: 200 !important;
		}
		[class*="header-menu"] .menu {
			border-bottom: 5px double #000000;
		}

		[class*="header-menu"] .menu a:hover {
			transform: translateY(-2px);
		}

		[data-header*="type-1"] .ct-header [data-transparent-row="yes"] [data-id="menu"] .sub-menu {
			backdrop-filter: blur(4px);
		}




/* Footer 
__________________________________________________________________________________*/

	footer.ct-footer h4 {
		font-size: 1.2em;
		color: #fff;
	}
   
	footer.ct-footer table {
		width: auto;
		border: none !important;
		}
	footer.ct-footer th, 
	footer.ct-footer td {		
		border-left: none !important;
		border-right: none !important;
		border-top: none !important;
		padding: 0.25em 0.5em 0.25em 0.5em  !important;
		border-bottom: 1px solid rgba(255,255,255,0.50) !important; 
	}
		footer.ct-footer tr:last-child { border: none !important; }
		footer.ct-footer tbody tr:nth-child(even) {  background-color: transparent !important; }

	.ct-shortcuts-container {
		z-index: 9999 !important;
	}


	[data-footer*="type-1"] footer.ct-footer {
		padding-top: 160px;
		mix-blend-mode: multiply;
	}


	[data-footer*="type-1"] .ct-footer [data-row*="middle"] {		
		position: relative;
		}

	[data-footer*="type-1"] .ct-footer [data-row*="middle"]:after {		
		content: url("https://cdn.eselskrug.de/m:0/a:https://www.eselskrug.de/wp-content/uploads/2022/04/esel_weiss_footer.svg");
		position: absolute;
		right: 4%;
		bottom: -8px;
		width: 80px;
		height: auto;
	}


	#post-2239 figcaption { text-align: left !important; }



	

/* Startseite
__________________________________________________________________________________*/











/* Plugins 
__________________________________________________________________________________*/



		/* Blocksy
		______________________________________*/

		.main-container {
			overflow-x: hidden;
		}


		.ct-back-to-top[data-alignment="right"] {
			z-index: 999;
		}


			[data-link='type-2'] .entry-content p>a {
				text-decoration-color: var(--theme-palette-color-6);
				text-decoration-thickness: 3px;				
			}
		[data-link='type-2'] .entry-content p>a:hover {
				background-color: var(--theme-palette-color-6);		
			}


		.ct-shortcuts-container{
					backdrop-filter: blur(4px);
				}


		/* Stackable Blocks 
		______________________________________*/
      



		/* The Plus Blocks
        -------------------------------------*/


		/* HappyFiles
        -------------------------------------*/
		.happyfiles-gallery li.item {
			margin-bottom: 0; 
		}
	

		/* Complianz
        -------------------------------------*/

			#cmplz-cookies-overview .cmplz-dropdown p, 
			#cmplz-document .cmplz-dropdown p, 
			#cmplz-document li, 
			#cmplz-document p, 
			#cmplz-document td {
				font-size: 1rem;
			}

			#cmplz-document.impressum h2, 
			#cmplz-document.impressum h3 {
				font-size: 1.5rem;
				margin-top: 1.5em;
				margin-bottom: 0 !important;			
				color: var(--theme-palette-color-3) !important;
				opacity: 1;
			}

			#cmplz-document a {				
				text-decoration: none;
			}

			#cmplz-document b {
				font-weight: 700;
			}

		


		/* Shariff
        -------------------------------------*/
			.ShariffHeadline {	
				display: inline-block;
				float: left;
				margin: 0.25em 1em 0 0;
				}




		/* Kali Forms
        -------------------------------------*/

			.kaliforms-form-container div.col-12 { 
				margin-bottom: 6px !important;
				}


			@media (min-width: 768px) {

					.kaliforms-form-container .col-md-3:first-child,
					.kaliforms-form-container .col-md-4:first-child,
					.kaliforms-form-container .col-md-5:first-child,
					.kaliforms-form-container .col-md-6:first-child,
					.kaliforms-form-container .col-md-7:first-child,
					.kaliforms-form-container .col-md-8:first-child { 
						padding-left: 15px !important;
						}
					.kaliforms-form-container .col-md-3,
					.kaliforms-form-container .col-md-4,
					.kaliforms-form-container .col-md-5,
					.kaliforms-form-container .col-md-6,
					.kaliforms-form-container .col-md-7,
					.kaliforms-form-container .col-md-8 { 
					   padding-right: 3px !important;
					   padding-left: 3px !important;
					   }
						.kaliforms-form-container .col-md-3:not(:first-child) label,
						.kaliforms-form-container .col-md-4:not(:first-child) label,
						.kaliforms-form-container .col-md-5:not(:first-child) label,
						.kaliforms-form-container .col-md-6:not(:first-child) label,
						.kaliforms-form-container .col-md-7:not(:first-child) label,
						.kaliforms-form-container .col-md-8:not(:first-child) label { 
							margin-left: -10px !important;
							}
					.kaliforms-form-container .col-md-3:last-child,
					.kaliforms-form-container .col-md-4:last-child,
					.kaliforms-form-container .col-md-5:last-child,
					.kaliforms-form-container .col-md-6:last-child,
					.kaliforms-form-container .col-md-7:last-child,
					.kaliforms-form-container .col-md-8:last-child{ 
						padding-right: 15px !important;
						}	
			}
			.kaliforms-form-container .row div[class^="col-"], 
			.kaliforms-form-container .row div[class*=" col-"] {
				margin-bottom: 0px;
			}



			.kaliforms-form-container hr {	
				height: 5px;
				background-color: transparent;
				margin: 0.5em 0 !important;
				}

			.kaliforms-form-container label:not(.checkbox-label) {
				position: absolute;
				z-index: 2;
				font-size: 14px !important;
				top: 4px;
				left: 25px;
				}

				.filepond--drop-label.filepond--drop-label label {    
					position: relative;
					top: inherit;
					left: inherit;
				}

			.kaliforms-form-container label {
				color: var(--theme-palette-color-3) !important;
			}

			.kaliforms-form-container .col-12:focus-within label:not(.checkbox-label) {
				transform: translateY(-2px) translateX(0px);
				transform-origin: top left;
				color: rgb(0 0 0 / 0.5) !important;
				font-size: 0.7em !important;
			}
			.kaliforms-form-container .col-12:focus-within label[for=message]{
				   color: rgb(0 0 0 / 0.0) !important;
			}


			.kaliforms-form-container [type='freeText'] {
				color: var(--theme-palette-color-3);
				}


			.kaliforms-form-container textarea { min-height: 250px;} 
			.kaliforms-form-container textarea:focus { position: relative; }

			.kaliforms-form-container [type='text'], 
			.kaliforms-form-container [type='password'], 
			.kaliforms-form-container [type='date'], 
			.kaliforms-form-container [type='datetime'], 
			.kaliforms-form-container [type='datetime-local'], 
			.kaliforms-form-container [type='month'], 
			.kaliforms-form-container [type='week'], 
			.kaliforms-form-container [type='email'], 
			/*.kaliforms-form-container [type='number'], */
			.kaliforms-form-container [type='search'], 
			.kaliforms-form-container [type='tel'], 
			.kaliforms-form-container [type='time'], 
			.kaliforms-form-container [type='url'], 
			.kaliforms-form-container [type='color'], 
			.kaliforms-form-container textarea, 
			.kaliforms-form-container #kali-stripe-iban-element, 
			.kaliforms-form-container #kali-stripe-card-element {
				margin-bottom: 0 !important;
				padding-top: 35px !important;
				padding-bottom: 15px !important;
				padding-left: 9px !important;
				border-radius: 3px !important;
				background-color: rgb(154 188 144 / 10%) !important;
				box-shadow: 0 0 0 !important;
				border: 1px solid rgba(227,231,227,0.0) !important;
				}
			.kaliforms-form-container [type='number'] { padding-top: 5px !important; }


			.kaliforms-form-container input[required],
			.kaliforms-form-container textarea[required],
			.kaliforms-form-container select[required] {
				border: 1px solid rgba(0,0,0,0.00) !important;
				background-color: rgb(154 188 144 / 30%) !important;
			}  

					.kaliforms-form-container input:focus,
					.kaliforms-form-container textarea:focus { 
						background-color: rgba(255,255,255,0.50) !important;
						color: #000;
						border: 1px solid var(--theme-palette-color-1) !important;
						box-shadow: var(--shadow-elevation-medium) !important;
						transform: scale(1.01);
						}

			.kaliforms-form-container #optionale-angaben { font-size: 0.875em; }



			.kaliforms-form-container .checkbox-label input { display: inline-block ; }
			.kaliforms-form-container .checkbox-label span { overflow-y: visible !important; }
			.kaliforms-form-container .checkbox-label span:nth-of-type(2){ margin-left: 33px; margin-bottom: 25px; }

			.kaliforms-form-container [type='submit'], 
			.kaliforms-form-container [type='button'] {
				float: right !important;
			}

			

				.filepond--root { margin-top: 14px; }

				.filepond--root .filepond--drop-label {
					background-color: #4d6674;
					border-radius: 3px;
					box-shadow: inset 4px 4px 15px rgb(0 0 0 / 25%);
				}
				.filepond--root .filepond--drop-label label {
					color: #fff !important;
				}
				/*.kaliforms-form-container small {
					margin-top: -18px !important;
    				margin-left: 32px;
					position: absolute !important;
					}*/	

				.filepond--drip {
					box-shadow: inset 0 0px 10px rgb( 0 0 0 / 50% );
					opacity: 0.5 !important;
				}
				.filepond--credits { display: none; }


		div[id^="kaliforms-thank-you"] {
			background-color: rgba(219,229,191,1.00);
			border-radius: 3px;
			padding: 2em;
			margin-top: 2em;
			}
		
		div[id^="kaliforms-thank-you"] h2 {			
			font-size: 1.6em;
			font-weight: 600;
			}


		.kaliforms-form-container small {    
			margin: -10px 0 10px 0;
			display: block;
		}



/* Animationen 
__________________________________________________________________________________*/
	
	input,
    textarea,
    input[type=submit],
    select,
	label,
	img,
    .linktext,
	.ugb-card__image,
	.ugb-card__description,
	.ugb-card .ugb-card__subtitle,
	.ugb-card .ugb-card__title,
	div[id="kaliforms-thank-you"] {
		transition: all 0.3s ease !important;
	    }




	/* Element muss ebenso die Klasse .animate enthalten, damit es erst beim Scrollen den Zusatz: scrolled erhält, siehe scripte.js 
		.animate:not(.scrolled) { display: none; }
		.animate.scrolled { display: visible; }	*/

		.animate:not(.scrolled) { display: none; xvisibility: hidden; }
		.animate.scrolled { display: inherit; xvisibility: visible; }	



		/* ----------------------------------------------
		 * Generated by Animista on 2020-2-16 11:26:0
		 * Licensed under FreeBSD License.
		 * See http://animista.net/license for more info. 
		 * w: http://animista.net, t: @cssanimista
		 * ---------------------------------------------- */

		.animate.scrolled ul li { animation: slide-in-blurred-bottom 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.1s both;	}
		.animate.scrolled ul li:nth-child(2) { animation: slide-in-blurred-bottom 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.2s both; }
		.animate.scrolled ul li:nth-child(3) { animation: slide-in-blurred-bottom 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.3s both; }
		.animate.scrolled ul li:nth-child(4) { animation: slide-in-blurred-bottom 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.4s both; }
		.animate.scrolled ul li:nth-child(5) { animation: slide-in-blurred-bottom 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.5s both; }
		.animate.scrolled ul li:nth-child(6) { animation: slide-in-blurred-bottom 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.6s both; }
		.animate.scrolled ul li:nth-child(7) { animation: slide-in-blurred-bottom 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.7s both; }
		.animate.scrolled ul li:nth-child(8) { animation: slide-in-blurred-bottom 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.8s both; }
		.animate.scrolled ul li:nth-child(9) { animation: slide-in-blurred-bottom 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.9s both; }
		.animate.scrolled ul li:nth-child(10) { animation: slide-in-blurred-bottom 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) 1.0s both; }
		.animate.scrolled ul li:nth-child(11) { animation: slide-in-blurred-bottom 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) 1.1s both; }
		.animate.scrolled ul li:nth-child(12) { animation: slide-in-blurred-bottom 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) 1.2s both; }
		.animate.scrolled ul li:nth-child(13) { animation: slide-in-blurred-bottom 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) 1.3s both; }



		.slide-in-blurred-bottom.scrolled {
					-webkit-animation: slide-in-blurred-bottom 1s cubic-bezier(0.230, 1.000, 0.320, 1.000) 0.2s both;
							animation: slide-in-blurred-bottom 1s cubic-bezier(0.230, 1.000, 0.320, 1.000) 0.2s both;
				}


				/* ----------------------------------------------
				 * Generated by Animista on 2022-3-20 11:38:56
				 * Licensed under FreeBSD License.
				 * See http://animista.net/license for more info. 
				 * w: http://animista.net, t: @cssanimista
				 * ---------------------------------------------- */

				/**
				 * ----------------------------------------
				 * animation slide-in-blurred-bottom
				 * ----------------------------------------
				 */
				@-webkit-keyframes slide-in-blurred-bottom {
				  0% {
					-webkit-transform: translateY(1000px) scaleY(2.5) scaleX(0.2);
							transform: translateY(1000px) scaleY(2.5) scaleX(0.2);
					-webkit-transform-origin: 50% 100%;
							transform-origin: 50% 100%;
					-webkit-filter: blur(40px);
							filter: blur(40px);
					opacity: 0;
				  }
				  100% {
					-webkit-transform: translateY(0) scaleY(1) scaleX(1);
							transform: translateY(0) scaleY(1) scaleX(1);
					-webkit-transform-origin: 50% 50%;
							transform-origin: 50% 50%;
					-webkit-filter: blur(0);
							filter: blur(0);
					opacity: 1;
				  }
				}
				@keyframes slide-in-blurred-bottom {
				  0% {
					-webkit-transform: translateY(1000px) scaleY(2.5) scaleX(0.2);
							transform: translateY(1000px) scaleY(2.5) scaleX(0.2);
					-webkit-transform-origin: 50% 100%;
							transform-origin: 50% 100%;
					-webkit-filter: blur(40px);
							filter: blur(40px);
					opacity: 0;
				  }
				  100% {
					-webkit-transform: translateY(0) scaleY(1) scaleX(1);
							transform: translateY(0) scaleY(1) scaleX(1);
					-webkit-transform-origin: 50% 50%;
							transform-origin: 50% 50%;
					-webkit-filter: blur(0);
							filter: blur(0);
					opacity: 1;
				  }
				}





