/*
 Theme Name:   2023 child
 Description:  Child Theme
 Author:       
 Template:     twentytwentythree
 Version:      1.0
 Text Domain:  2023-child2
*/

@viewport {
	width: device-width;	
	zoom: 1;	
	}


	:root {
		--base-font-size: 16px;
	}


	@font-face {
		font-family: 'os_l';
		src: url('fonts/OpenSans-Light-webfont.woff');
		font-weight: normal;
		font-style: normal;
		font-display: swap;
	
	}
	
	
	
	@font-face {
		font-family: 'ssp_b';
		src: url('fonts/SourceSansPro-Bold.ttf');
		font-weight: normal;
		font-style: normal;
		font-display: swap;
	
	}
	
	
	@font-face {
		font-family: 'ssp_l';
		src: url('fonts/SourceSansPro-Light.ttf');
		font-weight: normal;
		font-style: normal;
		font-display: swap;
	
	}


	@font-face {
		font-family: 'os';
		src: url('fonts/OpenSans-VariableFont_wdth,wght.ttf');
		font-weight: normal;
		font-style: normal;
		font-display: swap;
	
	}


	@media (prefers-color-scheme: dark) {
		:root {
			--bg-color: #000000;
			--text-color: #ffffff;
		}
	}



	
	:root {
		
		--bg-color: #ffffff;
		--text-color:#242424;
		--base-font-size: 18px;
		

   }
	
	html {
		max-width: 100%;
		overflow-x: hidden;
		scroll-behavior: smooth;
	}


	

body {				
font-family: 'os_l';	
background: var(--bg-color);;
color:var(--text-color);
font-size: var(--base-font-size);
padding: 0 !important;
}


body > .wp-site-blocks {
	padding:0;
}



#sl-barriere-widget {display: none !important;}

.usernav {
	margin-top: 2em;
	background-color: rgb(253, 249, 235);

}

.usernav a {
	color:black;
	text-decoration: none;
	font-size: calc(var(--base-font-size)-0.1em);
}



.usernav .tel:before {
	font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f095";
	color: grey;
	margin-right:1em;
}


.usernav .mobil:before {
	font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f3cf";
	color: grey;
	margin-right:1em;
}

.usernav .mail:before {
	font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f0e0";
	color: grey;
	margin-right:1em;
}


header .menuleiste {
	max-width: 100% !important;
}



#modal-1-content ul li a {
	font-size: 22px;
	color: #de4f00;
	text-decoration: none;
}

header {
	position: sticky;
  top: 0em;
  z-index: 801;
  width: 100%;
  box-sizing: border-box;
  border-top: 1px solid rgba(209,209,209,0.2);
  z-index: 99999;
  background-color: #fff;
  box-shadow: rgba(0,0,0,0.25) 0px 54px 55px,rgba(0,0,0,0.12) 0px -12px 30px,rgba(0,0,0,0.12) 0px 4px 6px,rgba(0,0,0,0.17) 0px 12px 13px,rgba(0,0,0,0.09) 0px -3px 5px;
  transition: all 1s ease;
}


h2 { color: #de4f00 !important; font-size: 36px !important; font-weight: bold;}
h3 { color: #de4f00; font-size: 30px !important;}


.covertext {
		text-shadow: 2px 1px 2px #de4f00;
		color: #FFFFFF;
		background-color: rgba(0, 0, 0, 0.5);
		border-radius: 20px;
		width: fit-content;
		text-align: center;
}

.covertext * {text-align: center;}




.creme {
	background-color: #fdf9eb;
	line-height:180%;
	position: relative;
}

.creme::before {
    content: '';
    mask-image: url(https://fewo-isabella.de/wp-content/uploads/2025/03/sectionbogen03.svg);
    background-color: #fdf9eb;
    width: 100%;
    height: 2rem;
    position: absolute;
    z-index: 5;
    left: 0;
    top: -1.96rem;
    mask-size: 100% 100%;
    mask-position: center;
    mask-repeat: no-repeat;
}




.white {
	background-color: #fff;
	position: relative;
	line-height:180%;

}

.white::before {
    content: '';
    mask-image: url(https://fewo-isabella.de/wp-content/uploads/2025/03/sectionbogen.svg);
    background-color: white;
    width: 100%;
    height: 50px;
    position: absolute;
    z-index: 3;
    left: 0;
    top: -50px;
    mask-size: 100% 100%;
    mask-position: center;
    mask-repeat: no-repeat;
}




.yellow {
	background-color: #fff1c0;
	line-height:180%;
	position: relative;
}

.yellow::before {
    content: '';
    mask-image: url(https://fewo-isabella.de/wp-content/uploads/2025/03/sectionbogen03.svg);
    background-color: #fff1c0;
    width: 100%;
    height: 2rem;
    position: absolute;
    z-index: 5;
    left: 0;
    top: -1.96rem;
    mask-size: 100% 100%;
    mask-position: center;
    mask-repeat: no-repeat;
}


.yellow .check:before {
	font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f00c";
	color: #dd8500;
	margin-right:1em;
}

.yellow .mobil:before {
	font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f3cf";
	color: #dd8500;
	margin-right:1em;
}
.yellow .tel:before {
	font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f095";
	color: #dd8500;
	margin-right:1em;
}
.yellow .mail:before {
	font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f0e0";
	color: #dd8500;
	margin-right:1em;
}





.berge {
    position: relative;
    overflow: hidden;
}

.berge::before {
    content: '';
    mask-image: url(https://fewo-isabella.de/wp-content/uploads/2025/03/sectionbogen.svg);
    background-color: #fff1c0;
    width: 100%;
    height: 2rem;
    position: absolute;
    z-index: 3;
    left: -13px;
    top: -5px;
    mask-size: 100% 100%;
    mask-position: center;
    mask-repeat: no-repeat;
    transform: rotate(180deg) translate(-0.8rem, -0.25rem);
}

footer {
	background-color: #fcca5d;
	margin-top:0;
}



@media screen AND (max-width: 1150px) {
	.usernav {justify-content: center;}
.menuleiste {flex-direction: column; justify-content: center; gap:10px;}
#modal-1-content {margin-bottom:10px;}
footer > div > div {flex-direction: column-reverse;}
}

@media screen AND (max-width: 790px) {

	 .wp-block-navigation__responsive-container-open,
  .wp-block-navigation__responsive-container {
    display: block !important;
  }

  
  .wp-block-navigation__responsive-container:not(.is-menu-open) {
    display: none !important;
  }

  .wp-block-navigation__responsive-container.is-menu-open {
    display: block !important;
  }

  /* Optional: Desktop-Menü ausblenden */
  .wp-block-navigation__container {
    flex-direction: column;
  }


	#modal-1::after {
		background-image: url('https://fewo-isabella.de/wp-content/uploads/2025/03/radsport.jpg');
		background-size: cover;
		background-position: center;
		width:100%;
		height:100%;
		content:'';
		z-index:-1;
		position: absolute;
		left:0;
		top:0;
		opacity:1;
		filter:brightness(1)
		

	}


		#modal-1::before {
		background-color: #ffffff;
		width:100%;
		height:120%;
		content:'';
		z-index:-1;
		position: absolute;
		left:0;
		top:0;
		opacity:0.6;
		z-index:0;
		

	}

	#modal-1-content {width:100%;
		justify-content: center;
		align-items: center;
		align-content: center;
		flex-direction: column;
	}

.wp-block-navigation__responsive-container-open {margin-bottom: 1em !important;}
	.wp-block-navigation__responsive-container-close svg {fill: white;}


#modal-1-content ul {justify-content: center !important; align-items: center;}
	#modal-1-content li {text-align: center; align-items: center !important; justify-content: center;}
	#modal-1-content ul li a {color:black !important; font-weight:bold; font-size: 1.5em;}


	.wp-block-navigation__responsive-container-close svg, .wp-block-navigation__responsive-container-open {fill: black; transform: scale(1.2);}


}



@media screen AND (max-width: 620px) {
.usernav {flex-direction: column; gap:0;}

}