/*
Theme Name: Schreinerei Heinz Egger
Theme URI: https://thoeni.design
Author: Thöni Design - Christian Thöni
Author URI: https://thoeni.design
Description: Benutzerdefiniertes Template auf Basis von TwentyTwentyThree für die Schreinerei Heinz Egger von Thöni Design.
Requires at least: 6.0
Tested up to: 6.3.2
Requires PHP: 5.7
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: schreinereiheinzegger
Tags: one-column, wide-blocks, custom-colors, custom-menu, custom-logo, editor-style, featured-images, full-site-editing, block-patterns, rtl-language-support, sticky-post, threaded-comments, translation-ready, block-styles, style-variations, accessibility-ready, blog, portfolio, news
*/

.main-intro .wp-block-cover__inner-container,
.filter-multiply,
.filter-multiply img {
	mix-blend-mode: multiply;
}

body {
	border-color: white !important;
}

.main-header {
	position: fixed;
	display: flex;
	align-items: center;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	border-color: white; 
	background: white;
	height: 60px;
	z-index: 999999;
	width: 100%;
	box-sizing: border-box;
	transition: all 0.6s ease-in-out;
}
.main-header > div {
	width: 100%;
}
body.admin-bar .main-header {
	top: 32px;
}
.main-header .wp-block-site-title,
.main-header nav a {
	transition: all 0.6s ease-in-out;
}
.main-header:not(.is-sticky) .wp-block-site-title {
	 font-size: clamp(1.562rem, 1.562rem + ((1vw - 0.2rem) * 0.548), 2rem) !important;
}
.main-header:not(.is-sticky) nav a {
	 font-size: clamp(1.25rem, 1.25rem + ((1vw - 0.2rem) * 0.548), 1.5rem) !important;
}

.logo img {
	transition: all 0.5s ease-in-out;
}
.logo a {
		border: 0px !important;
	}
@media (max-width: 779px) {
	.wp-site-blocks {
		padding-top: 0px !important;
	}
	body,
	.main-header {
		border-left: solid white 2rem !important;
		border-right: solid white 2rem !important;
	}
	.she-bg {
	padding-top: 61.8vh !important;
	}
	.she-bg .wp-block-cover__image-background,
	.she-bg .wp-block-cover__background{
		height: 61.8vh !important;
		object-fit: center !important;
	}
	
	iframe {
		height: 100vh;
	}
	.logo  img {
		width: 120px;
		height: auto;
	}
	
	h1 {
		font-size: 28px !important;
    line-height: 1.2 !important;
	}
	.comic {
		width: 60px;
		height: auto;
	}
	
	/* nav */
	.main-header {
		align-items: flex-start !important;
	}
	#mainnav {
		padding-top: 1rem !important;
	}
	.has-modal-open .main-header {
		height: 50vh;
	}
	.has-modal-open .wp-block-navigation__responsive-container-open  {
		display: none !important;
	}
	.wp-block-navigation__responsive-close {
		margin: 0 !important;
	}
	.wp-block-navigation__responsive-container {
		display: flex;
		justify-content: flex-start;
		align-items: flex-end;
		padding-right: 0 !important;
		background-color: transparent !important
	}
	.main-intro .wp-block-spacer {
		display: none;
	}
	.wp-block-cover__inner-container {
		padding-top: 1rem;
	}
	
}




@media (min-width: 780px) {
	
	.she-left {
		padding-left: 66.8% !important;
	}
	.she-bg .wp-block-cover__image-background,
	.she-bg .wp-block-cover__background {
		width: 61.8% !important;
		
	}
	.she-right {
		padding-right: 55% !important;
	}
	.she-right .wp-block-cover__inner-container > * {
		margin-left: 0 !important;
		margin-right: 0 !important;
		max-width: 100% !important;
	}
	.she-right .wp-block-cover__image-background,
	.she-right .wp-block-cover__background {
		width: 50% !important;
		
	}
	.she-right .wp-block-cover__image-background,
	.she-right .wp-block-cover__background{
		margin-left: 50% !important;
	}
	
iframe {
	height: 61.8vh;
}
	
	
/* prevent super oversize on super wide screens */
body > .wp-site-blocks,
.main-header {
	max-width: 2560px;
	margin: 0 auto;
}
	
	.main-header {
		height: min(8vw, 8rem) !important;
	}
	.main-header .logo img {
		width: 210px;
	}
	.main-header.is-sticky {
		height: min(5vw, 5rem) !important;
		
	}
	.main-header.is-sticky .logo img {
		width: 140px;
	}
	
	body,
	.main-header {
		border-left: solid white max(3vw, 1.5rem) !important;
		border-right: solid white max(3vw, 1.5rem) !important;
	}
	body {
		border-bottom: solid white max(3vw, 1.5rem) !important;
	}
	.tel-nr {
		font-size: calc(5.5vw);
	}
	
}
@media (min-width: 2560px) {
.main-header {
	border-left: 0px !important;
	border-right: 0px !important;
	}
}
/* misc */

.arrow-main,
.arrow-info {
	position: absolute;
	bottom: 2rem;
	opacity: 0.95;
	left: 50%;
	transform: translatex(-50%);
}
.arrow-main {
	left: 5%;
	transform: translatex(-50%) rotate(-2deg);
}

.arrow-info {
	left: 5%;
}
.arrow-contact {
	margin-top: 10vh;
	margin-bottom: 0vh;
	transform: translate(0%, calc(1rem + 5vh));
	position: relative;
	z-index: 10;
}
.arrow-main img {
	height: max(5vh, 125px) !important;
	width: auto !important;
	animation: moveDown 4s infinite ease-in-out;
}
.arrow-info img {
	height: max(4vh, 100px) !important;
	width: auto !important;
	animation: moveDown 8s infinite ease-in-out;
}
.arrow-contact img {
	height: 20vh !important;
	width: auto !important;
	animation: moveContact 3s infinite ease-in-out;
	
}
footer nav a {
	font-weight: bold;
}

@keyframes moveDown {
	from {
		transform: translatey(0vh) rotate(-2deg);
	}
	80% {
		transform: translatey(0vh) rotate(-2deg);
	}
	90% {
		transform: translatey(1vh) rotate(-6deg);
	}
	to {
		transform: translatey(0vh) rotate(-2deg);
	}
}
@keyframes moveContact {
	from {
		transform: translate(0, 0);
	}
	50% {
		transform: translate(0, 33%);
	}
	to {
		transform: translate(0, 0%);
	}
}