/*
 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;
	
	}



	@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 * {
	
	box-sizing: border-box !important;transition: font-size 0.3s ease, background-color 0.3s ease, color 0.3s ease;

}
	

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


}



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






.b_bar {
	background-color: #275169;
	padding:0.5rem;
	gap: 0.5rem;
}


.b_bar img { 
max-width:35px;
}

.b_bar figure:first-child {
	margin-right:3rem;
}






/* MENU */

#modal-1-content > ul > li > a {
	font-size: calc(var(--base-font-size) + 2px) !important;
	padding:0.5rem 0.1rem 0.5rem 1rem;
	transition: font-size 0.3s ease, background-color 0.3s ease, color 0.3s ease;
	font-weight: 300;
	
	
}




#modal-1-content a:hover {
	text-decoration: none;
	color: #275169;
}
#modal-1-content ul > li.current-menu-item > a {
	font-weight: bold;
}



#modal-1-content .wp-block-navigation__submenu-container li {
	background-color: #275169;
}


#modal-1-content .wp-block-navigation__submenu-container li:hover {
	background-color: #376b89;
}


#modal-1-content .wp-block-navigation__submenu-container a {
	color: white;
}


#modal-1-content .wp-block-navigation__submenu-container .wp-block-navigation__submenu-icon {
	color:white;
}



.wp-block-navigation .wp-block-navigation-item__label {
	white-space: nowrap;
}


.wp-block-navigation__responsive-container-close {
	position: sticky;	
	top:10px;
	right:10px;
}

.wp-block-navigation__responsive-container-close svg {
	fill: white;
	width: 30px !important;
	height: 30px;

}


/* MENÜ ENDE */

main.wp-block-group {margin-top: 1em;}


h1, h2, h3:not(.wp-block-post-title), .news h2.wp-block-post-title a {color: #aa3545; font-family: "ssp_b"; text-align: center;}
h1 {font-size: calc(var(--base-font-size) + 24px) }
h2 {font-size: calc(var(--base-font-size) + 20px) !important;}
h3 {font-size: calc(var(--base-font-size) + 14px) !important;}
h4 {font-size: calc(var(--base-font-size) + 10px) !important;}

.news time {font-size:0.8em;}
.news h2 {margin-bottom:0;}
.news .wp-block-query h2 {margin-bottom: 0;}
.news .wp-block-query ul li {position: relative; padding-bottom:40px;}
.news .wp-block-query ul li .wp-block-post-excerpt__more-text {position: absolute; width:calc(100% - 60px); bottom:0;}
.news .wp-block-query ul li .wp-block-post-excerpt__more-text a {background-color: #8ca138; color:white; padding:0.5em 1em; font-weight: bold; border-radius: 2px; text-decoration: none;}
.subheadline {margin-top:-0.5em; }

.wp-block-post-content a {color:#376b89; text-decoration: none; border-bottom: 1px dotted #376b89;}

.wp-block-post-date {
	margin-top: 0;
}


.decals figure img {
	box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
	
	
}

.decals > div > div > figure {width: fit-content;}
.decals figure {
	text-align: center;
	margin: auto;
}


.decals figure:hover {
	transform: scale3d(0.9,0.9,0.9);
	transition: all 1s ease;
}


.parents {position: relative;}

.parents {position: relative;}
.parents::after {
	position: absolute;
	right:-40px;
	bottom:0%;
	background:url('https://www.andert-oberschule.de/wp-content/uploads/2024/08/mouse.png');
	content:'';
	width:80px;
	height:120px;

}








.wp-element-button, .wp-block-button__link {
	background-color: #8ca138;
	color:white;
	font-size: calc(var(--base-font-size) + 5px);
	padding:1em 2em;
	font-weight: bold;
	border-radius: 2px;
}


.wp-block-button__link:hover {
	background-color: #376b89;
}


.wp-element-button:visited, .wp-block-button__link:visited {color:white;}


.cover {box-shadow: rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px, rgba(10, 37, 64, 0.35) 0px -2px 6px 0px inset;border-top:4px solid #376b89; border-bottom:4px solid #376b89;}
.cover h1 {font-size: calc(var(--base-font-size) + 20px);}
.cover h2 {text-align: left;}

/* NEWS LOOP */


.news_loop {right: -562px; position: relative; transition: all 1s ease;}
.news_loop h1 {
	color: #242424;
	font-size: calc(var(--base-font-size) + 20px);
	font-weight: bold;
	margin-bottom:3rem;
}

.news_loop .date {width:25%; min-width: 80px !important;}
.news_loop .wp-block-post-date {
	font-size: calc(var(--base-font-size) + 8px);
	color:#376b89;
	font-weight: bold;
	margin-top:-5px;
	white-space: nowrap;	
}

.news_loop h2 {
	font-size: calc(var(--base-font-size) + 8px) !important;
	color:#376b89;
	font-weight: bold;
	margin:0;
	font-family: 'ssp_r';
	
}

.news_loop .wp-block-post-excerpt {
	margin:0.5em 0;
}

.news_loop a:not(.wp-block-button__link) {
	color:#376b89;
	margin:0;
}



.news_loop p {
	color:#242424;
	font-size: var(--base-font-size);
}

.sorsmc {
	max-width:400px;
	position: absolute;
	padding:1em;
	bottom:0;
	left:0;
	opacity:0.8;
	
}



/* Blue */
.blue h2, .blue p, .blue a {
	color:white;
}

.blue {position: relative; z-index:1; box-shadow: rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px, rgba(10, 37, 64, 0.35) 0px -2px 6px 0px inset;}
.blue::after {
	position: absolute;
	top:0;
	left:0;
	width:100%;height:100%;
	background: url('https://www.andert-oberschule.de/wp-content/uploads/2024/08/board.png');
	z-index:-1;
	content:'';
	background-size: cover;
	background-position: center;
	opacity: 0.1;
}


.link_buttons a {
	color:white;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#2f527c+0,235a87+100 */
background: linear-gradient(135deg,  #2f527c 0%,#235a87 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */


}


.coop {
	margin-bottom:1em;
	border:1px solid #376b89;
	padding:2em;
	box-shadow: rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px;
}

.coop div {padding:0.5em;}


.school .wp-element-button, .wp-block-button__link { padding:0.5em 1em; font-size: calc(var(--base-font-size) + 2px) !important; font-weight: 200; }
.school > div {border:#2f527c 2px solid; padding:1em; position: relative; padding-bottom:3em; box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px; margin-bottom:1em;}
.school .wp-element-button {position: absolute; bottom:5px; width:70%; left:15%;}

.wp-block-post-excerpt, .wp-block-post-date {font-size: var(--base-font-size);}

/* FOOTER */


footer {
	padding:2rem;
	position: relative;
	
}


footer::after {
position: absolute;
width:100%;
height:100%;
left:0;
top:0;
content:'';
background-image: url('https://www.andert-oberschule.de/wp-content/uploads/2024/08/bg_skyline_free.png');
background-size:cover;
z-index:-1;
opacity: 0.3;


}




footer .wp-block-table table {
	width: fit-content;
	border:0;
} 


footer .wp-block-table table td {
	border:0;
	padding:0;
}


footer .wp-block-table table tr td:first-child {
	padding-right:1em;
}

footer .footer_bar {
	border-top:0px solid #275169;
}


footer .footer_bar ul {
	display: flex;
	list-style: none;
}

footer .footer_bar ul li {
	margin:0 1rem;
}


footer .footer_bar ul li a {
	text-decoration: none;
}


footer .footer_bar ul li a:hover {
	border-bottom: 1px dotted #242424;
}





      /* SOCIAL BAR */

	  #social_bar {
		position:fixed;
		top:25%;
		right:-60px !important;
		width:50px;
		border-top-left-radius: 20px;
		border-bottom-left-radius: 20px;
		background-color: rgb(255, 255, 255);
		padding:0.5em 0em;
		box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
		z-index:999;
		transition: all 1s ease;
		
	  }
	  
	  #social_bar div {
		padding:10px;
		font-size:1.3em;
		text-align: center;
	  }

	  #social_bar div img 
		{width:30px;}
	  
	  #social_bar div a {
		color: #235a87;
	  }
	  


.hidden {
display:none !important;
}



/* DARK */

.dark .news_loop {background-color: rgba(0,0,0,0.4) !important;}
.dark .news_loop p { color:white; }
.dark .news_loop h2 a, .dark .news_loop .wp-block-post-date  { color:white !important; }

.dark h1, .dark h2, .dark h3:not(.wp-block-post-title), .dark .news h2.wp-block-post-title a {
	color: #ededed;
}

body.dark {
	background-color: rgb(65, 65, 65);
	color:white;
}

.dark ul li a, .dark a {
	color:white;
}

.dark footer ul li a {
	color:white;
}



.dark .logo img {
	content:url('https://www.andert-oberschule.de/wp-content/uploads/2024/08/logo_dark.png');
	width:180px;
}




.dark footer::after {
	opacity:0.12;
}


.dark img:not(.logo a img, .decals img) {
	filter: brightness(70%);
}







.has-global-padding > .alignfull {padding:0;}














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

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

   }

.news_loop {
	flex-basis: 70% !important;
	
}

h2 {
	font-size: calc(var(--base-font-size) + 6px) !important;
}

.news_loop h2, .news_loop .wp-block-post-date { 
	font-size: calc(var(--base-font-size) + 4px) !important;
}

.sorsmc {max-width: 200px;}
}




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

	.blue div p {text-align: center;}
	.news_loop .date, .news_loop h2, .news_loop p {width:100%; text-align: center;}
	.news_loop .wp-block-post-date {font-size: calc(var(--base-font-size) + 0px) !important;;}
	.news_loop div {gap: 0rem;}
	.news_loop .wp-block-buttons > .wp-block-button {margin:auto;}
	.sorsmc {
		position: relative;
		margin: auto;
	}

	header .nav_bar { text-align: center;}
#modal-1-content ul.wp-block-navigation__container {justify-content: center !important;}

}


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


	.dark header .b_bar, .dark header > .nav_bar {
		justify-content:center !important;
		text-align: center;
		
		}

	.sorsmc {
		position: relative;
		margin: auto;
	}

	.wp-block-navigation__responsive-dialog {
		text-align: right;
	}

	header .b_bar img {
		max-width:25px;
	}
	header .b_bar, header > .nav_bar  {
		justify-content:center;
		text-align: center;
	}

	.wp-container-core-navigation-is-layout-1.wp-container-core-navigation-is-layout-1 {justify-content: center;}

	#modal-1-content.wp-block-navigation__responsive-container-content
	{padding:0;max-width: 100vw; box-sizing: border-box;}
	
	
	#modal-1{
		background-color: rgba(39, 81, 105, 0.99);
		padding:0;
		max-width:100vw;
		
	}
	
	
	
	
	#modal-1-content.wp-block-navigation__responsive-container-content ul, 
	#modal-1-content.wp-block-navigation__responsive-container-content ul li {
		align-items: center !important;
		background-color: rgba(39, 81, 105, 0.8);
		width:100vw;
		padding:0;
		gap:0;
		border-radius:5px;
		

	}


	#modal-1-content.wp-block-navigation__responsive-container-content > ul > li {
		border:0px solid black;
		padding:10px;
		margin-bottom:10px;
		background-color: rgba(255,255,255,0.1) !important;
		margin-bottom:10px;
		width:80%;
		margin: auto;
		margin-bottom:4px;
	}


	#modal-1-content.wp-block-navigation__responsive-container-content > ul > li > ul > li {
		background-color: rgba(255,255,255,0.05) !important;
		margin-bottom:10px;
		width:77%;
		margin: auto;
		margin-bottom:2px;
	}

	#modal-1-content.wp-block-navigation__responsive-container-content > ul > li > ul > li > ul > li {
		background-color: rgba(255,255,255,0.05)  !important;
		width:75%;
		margin:auto;
		padding:10px;
		margin-bottom:2px;
	}

	#modal-1-content.wp-block-navigation__responsive-container-content > ul > li > a {
		font-size:22px;
		color:white;
		text-decoration: none;
		margin-bottom:5px;
	}


	#modal-1-content.wp-block-navigation__responsive-container-content > ul > li > ul > li > a {
		font-size:18px;
		color:white;
		margin-bottom:5px;
		
	}


	#modal-1-content.wp-block-navigation__responsive-container-content > ul > li > ul > li > ul > li > a {
		font-size:16px;
		color:white;
		
	}


	#modal-1-content.wp-block-navigation__responsive-container-content > ul > li > ul > li > ul > li > ul > li > a {
		font-size:14px;
		color:white;
		
	}



	


	
	.wp-block-navigation.items-justified-right {--navigation-layout-justification-setting: center; }
	


.news_loop .wp-block-button {margin: auto;}
.news_loop h1 {text-align: center;}



	footer {
		text-align: center;
		margin: auto
	}

	footer table {
		margin: auto;
	}

	footer .wp-block-image.alignright {
		display: block;
		margin:auto;
		float: unset !important;
  margin-inline-start: unset !important;
  margin-inline-end: unset !important;
	}

	footer > div {
		flex-direction: column-reverse;
	}

footer ul {padding:0;}
footer .copyright {
	font-size: calc(var(--base-font-size) + -4px);
}
}