/*
 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: 'ssp_r';
		src: url('fonts/SourceSansPro-Regular.ttf');
		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: 'ssp_l';	
background: var(--bg-color);;
color:var(--text-color);
font-size: var(--base-font-size);
padding: 0 !important;
}


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


header {
	box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
}

.schrift {
	font-size: calc(var(--base-font-size) + 1em);
	color: #166534;
	font-weight: 800;
}

header nav a {
	font-size: calc(var(--base-font-size) + 0.2em);
	color: white !important;
	background-color: #166534;
	border-radius: 10px;
	padding: 0.2em 0.5em;
	border: 1px solid #166534;
	transition: all 0.5s ease;
}

header nav a:hover {
	text-decoration: none;
	background-color: #ffffff;
	border: 1px solid #166534;
	color: #166534 !important;
}

.covertext {background-color: rgb(22, 101, 52, 0.7); border-radius: 10px;}
.covertext h1 {border-bottom:1px solid #94bea5; color: #ffffff; font-size: calc(var(--base-font-size) + 1.5em); padding: 0.2em; }

.covertext .wp-block-button__link {background-color: white; color: #166534; border-radius: 10px; font-weight: bold; transition: all 0.5s ease; border: 1px solid white;}
.covertext .wp-block-button__link:hover {background-color:#166534; color: white; border: 1px solid white;}
.covertext p {font-size: calc(var(--base-font-size) + 0.2em);}


h2 {font-size: calc(var(--base-font-size) + 1.5em); color:#166534; position: relative;}

h2::before {
	font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f52e";
	color: #166534;
	position: absolute;
	left: -2em;}


.subheadline {font-size: calc(var(--base-font-size) + 0.3em); margin-top: 0;}

.lightgreen {background-color: rgb(22, 101, 52, 0.1);}
.lightgreen img {border-radius: 10px; box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;}


.arrowlist li {
	list-style: none;
	display: block;
	position: relative;
	padding-top: 0.2em;
}

.arrowlist li::before {
	font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f061";
	color: #166534;
	position: absolute;
	left: -35px;}


.froglist li {
	list-style: none;
	display: block;
	position: relative;
	padding-top: 0.2em;
}

.froglist li::before {
	font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f52e";
	color: #166534;
	position: absolute;
	left: -35px;}


.link {color: #166534;}







/* Footer */

footer {
	background-color: #166534;
	color: #ffffff;
	padding: 2em;
}

footer .bottom {border-top: 1px solid #437a59;}

footer h3 {font-size: calc(var(--base-font-size) + 0.5em); position: relative;}

footer a {
	text-decoration: none;
	color: white;
}



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

	.schrift {line-height:1em;}

}




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

header nav a {
  font-size: calc(var(--base-font-size) + 0em);
  color: white !important;
}


}







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


	header nav a  {padding:1em !important; text-decoration: none !important;}

#modal-1-content ul li.has-child{border:1px solid white; padding:1em; background-color: rgba(255,255,255,0.8) !important;}




  .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://pension-am-froschradweg.de/wp-content/uploads/2026/04/froschradweg-bautzen-cover.jpg');
		background-size: cover;
		background-position: center;
		width:100%;
		height:120%;
		content:'';
		z-index:-1;
		position: absolute;
		left:0;
		top:0;
		opacity:0.3;
		filter:brightness(1)
		

	}

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


	.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 a { font-size: calc(var(--base-font-size) + 0.3em);}


}



@media screen AND (max-width: 800px) {
	
	
	h2 {font-size: calc(var(--base-font-size) + 1em);}

}


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

.pic_left {flex-direction: column-reverse;}
}