/** Spezielles CSS für das Theme evangwien **/
/** Allgemein **/
@font-face {
  font-family: 'Proxima Nova';
  src: url('../fonts/Proxima Nova Regular.ttf') format('truetype');
}

html {
	font-size: 14px;	
}

body {
	color: #9F2AA4;
	font-family: "Proxima Nova";
}

@media (min-width: 992px) {
	html {
		font-size: 16px;
	}
}

#bg-wrapper {
	background: url('../images/rechts_oben_width_50.png') top right no-repeat, url('../images/links_unten_width_50.png') bottom left no-repeat;
	background-size: 50%;
}

h1 {
	font-size: 2.75rem;
	line-height: 3.375rem;
	font-weight: bold;
	text-transform: uppercase;
	margin: 0;
	
	@media (min-width: 992px) {
		font-size: 3rem;
		line-height: 3.625rem;
		margin-bottom: 2.5rem;
	}
}

a {
	text-decoration: none;
	color: #9f2aa4;
}

/** Header **/
.region-header {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
}

#block-evangwien-site-branding img {
	width: 90%;
	height: auto;
}

@media (min-width: 992px) {
	.region-header {
		padding: 2.625rem;
	}
	
	#block-evangwien-site-branding img {
		width: 17.875rem;
		height: 14.313rem;
	}
}

/*** Header-Menu ***/
/**** For mobile devices *****/
#block-evwheadermenu {
	background-color: transparent;
	width: 100%;
	text-align: right;
	@media (min-width: 992px) {
		text-align: left;
	}
	padding: 0.625rem 0.625rem 0 0;
		
	> ul.menu {
		display: none;
		padding: 0.625rem 1.3rem 0.625rem 0;
		z-index: 99;
		position: absolute;
		right: 0;
		width: 100%;
		text-align: right;
		@media (min-width: 992px) {
			text-align: left;
		}
		background-color: #fff;
		
		> li {
			font-size: 1.8rem;
			list-style: none;
			background-color: #fff;
			color: #707070;
			padding-bottom: 0.3rem;
			cursor: pointer;
			
			@media (max-width: 992px) {
				margin: 0.625rem 0;
				border-bottom: 1px dotted #707070;
			}
			
			> a {
				color: #707070;
			}
		}
		
		> li > ul {
			display: none;
			
			li {
				@media (max-width: 992px) {
					font-size: 1.5rem;
					padding: 0.313rem;
					margin-bottom: 0.313rem;
				}
				
				font-size: 1.2rem;
			}
		}
		
		> li > ul.open {
			display: block;
			text-align: right;
			@media(min-width: 992px) {
				text-align: left;
			}
		}
	}
	
	> ul.menu.open {
		display: block;
		@media (max-width: 992px) {
			width: 100vw;
		}
	}
	
	.contextual {
		display: none;
	}
			
	> a.hmenuicon {
		position: relative;
		right: 0;
		font-size: 2rem;
	}
}

/**** For Laptops and bigger screens ****/
@media (min-width: 992px) {
	#block-evwheadermenu {
		color: #707070;
		font-size: 1.875rem;
		font-weight: 200;
		line-height: 2.313rem;
		
		> a.hmenuicon {
			display: none;
		}
		
		> ul.menu {
			display: flex;
			flex-direction: row;
			justify-content: end;
			
			@media (max-width: 1920px) {
				column-gap: 1.75rem;
			}
			
			@media (min-width: 1920px) {
				column-gap: 3.75rem;
			}
			
			margin-left: -0.625rem;
			background-color: transparent;
			padding: 0.6rem;
			
			> a.is-active {
				color: #707070;
			}
			
			> li {
				padding: 0 0.625rem;
				text-transform: uppercase;
				background-color: transparent;
				
				> a {
					color: #707070;
				}
				
				> a:hover {
					color: #9f2aa4;
				}
				
				> ul {
					display: none;
					padding: 0.6rem;
					
					> li {
						padding: 0 0.625rem;
						font-size: 1.3rem;
						line-height: 1.813rem;
						color: #707070;
						
						> a {
							color: #707070;
						}
						
						> a:hover {
							color: #9f2aa4;
						}
					}
				}
				
				> ul > li:not(:last-child) {
					margin-bottom: 0.313rem;
					border-bottom: 0.1px dotted #707070;
					padding-bottom: 0.313rem;
				}
			}
			
			> li:hover {
				background-color: #fff;
				box-shadow: 0.19rem 0.19rem 0.4rem #00000029, -0.19rem 0.13rem 0.4rem #00000029;
				
				> a:hover {
					color: #9f2aa4 !important;
				}
				
				> ul {
					display: block;
					margin-left: -0.625rem;
					position: fixed;
					background-color: #fff;
					padding: 0.313rem 0;
					z-index: 99;
					box-shadow: 0.19rem 0.19rem 0.4rem #00000029, -0.19rem 0.19rem 0.4rem #00000029;
				}
			}
			
			> li:hover:last-child {
				position: relative;
			}
			
			> li.menu-item--expanded,
			> li.menu-item--collapsed	{
				list-style: none;
			}
			
			> li:nth-last-child(-n+2) ul {
				position: absolute;
				right: 0;
				width: max-content;
			}
		}	
	} 
}

@media (max-width: 992px) {
	main {
		margin: auto;
		padding: 0.625rem;
	}
}

@media (min-width: 992px) and (max-width: 1920px) {
	main {
		margin-left: 7%;
		margin-right: 0;
		text-align: left;
	}
	
	body.path-frontpage main {
		margin-right: 7%;
	}
}

@media (min-width: 1920px) {
	main {
		margin-left: 7%;
		margin-right: 7%;
		text-align: left;
	}
}

/** Alle Elemente der Startseite **/
.field--name-field-startseiteelemente > div:not(:last-child) {
	margin: 3rem 0;
}

/** Block "Lesen und Hören" auf der Startseite **/
#block-lesen-und-hoeren {
	display: flex;
	flex-direction: column;
	flex-wrap: wrap;
	gap: 0.9rem;
	
	@media (min-width: 992px) {
		flex-direction: row;
		margin: 0 -7%;
	}
	
	 > div {
		@media (min-width: 992px) {
			flex-basis: 48%;
		}
		
		box-shadow: 0px 0.19rem 0.4rem #00000029;
	}
	
	.field--name-field-startseite-l-u-h-titel {
		text-transform: uppercase;
		margin-top: 20px;
		
		@media (max-width: 992px) {
			font-size: 2.3rem;
			margin-top: 0;
		}
	}
	
	> div.LUH-block:first-of-type {
		display: flex;
		background-color: #f5e05a;
		flex-direction: column;
		padding-top: 1.3rem;
		padding-right: 1.3rem;
		padding-bottom: 1.3rem;
		padding-left: 1.3rem;
		
		@media (min-width: 992px) {
			text-align: right;
			padding-left: 0;
			flex-direction: row;
			justify-content: flex-end;
		}
		
		.LUH-block-body {			
			@media (min-width: 992px) {
				margin-right: 1.6rem;
			}
			
			display: flex;
			flex-direction: column;
			row-gap: 1.875rem;
			font-size: 1.125rem;
			font-weight: bold;
			line-height: 1.375rem;
			
			.LUH-block-ueberschrift {
				font-size: 3rem;
				font-weight: bold;
				line-height: 2.75rem;
			}

			.LUH-block-title {
				font-size: 2.25rem;
				font-weight: bold;
				line-height: 2.75rem;
				
				a {
					color: #9f2aa4;
					text-decoration: none;
				}
			}

			.LUH-block-text ul li {
				list-style: none;
			}
		}
		
		@media (max-width: 992px) {
			.LUH-block-cover {
				text-align: center;
				margin-top: 2rem;
			}
		}

		.LUH-block-cover {
			
			img {
				width: auto;
				height: 23.188rem;
			}
		}
	}
	
	> div.LUH-block:nth-of-type(2) {
		display: flex;
		background-color: #f5e05a;
		text-align: left;
		flex-direction: column;
		padding-top: 20px;
		padding-left: 20px;
		padding-bottom: 20px;
		
		@media (min-width: 992px) {
			flex-direction: row;
		}

		.LUH-block-cover {	
			order: 2;
			
			@media (max-width: 992px) {
				text-align: center;
				margin-top: 2rem;
			}
			
			@media (min-width: 992px) {
				order: 1;
			}
			
			img {
				width: auto;
				height: 371px;
			}
		}

		.LUH-block-body {
			order: 1;
			
			@media(min-width: 992px) {
				order: 2;
			}
			
			margin-left: 25px;
			display: flex;
			flex-direction: column;
			row-gap: 30px;
			font-size: 18px;
			font-weight: bold;
			line-height: 22px;
			
			.LUH-block-ueberschrift {
				font-size: 3rem;
				font-weight: bold;
				line-height: 2.75rem;
			}

			.LUH-block-title {
				font-size: 2.25rem;
				font-weight: bold;
				line-height: 2.75rem;
				
				a {
					color: #9f2aa4;
					text-decoration: none;
				}
			}

			.LUH-block-text ul li {
				list-style: none;
			}
		}
	}
}

/*** Block "Zum Nachlesen" auf der Startseite **/
.LUH-lesen {
	display: flex;
	background-color: #f5e05a;
	flex-direction: column;
	padding-top: 1.3rem;
	padding-right: 1.3rem;
	padding-bottom: 1.3rem;
	padding-left: 1.3rem;
	
	@media (min-width: 992px) {
		text-align: right;
		padding-left: 0;
		flex-direction: row;
	}
}

.LUH-lesen-body {
	@media (min-width: 992px) {
		margin-right: 1.6rem;
	}
	
	display: flex;
    flex-direction: column;
    row-gap: 1.875rem;
	font-size: 1.125rem;
	font-weight: bold;
	line-height: 1.375rem;
}

.LUH-lesen-ueberschrift {
	font-size: 3rem;
	font-weight: bold;
	line-height: 2.75rem;
}

.LUH-lesen-title {
	font-size: 2.25rem;
	font-weight: bold;
	line-height: 2.75rem;
}

.LUH-lesen-title a {
	color: #9f2aa4;
	text-decoration: none;
}

.LUH-lesen-text ul li {
	list-style: none;
}

.LUH-lesen-ausgabe {
	text-align: left;
	margin-left: 1.875rem;
}

@media (max-width: 992px) {
	.LUH-lesen-cover {
		text-align: center;
		margin-top: 2rem;
	}
}

.LUH-lesen-cover img {
	width: auto;
	height: 23.188rem;
}

/*** Block "Zum Nachhören" auf der Startseite ***/
.LUH-hoeren {
	display: flex;
	background-color: #f5e05a;
	text-align: left;
	flex-direction: column;
	padding-top: 20px;
	padding-left: 20px;
	padding-bottom: 20px;
	
	@media (min-width: 992px) {
		flex-direction: row;
	}

	.LUH-hoeren-cover {	
		order: 2;
		
		@media (max-width: 992px) {
			text-align: center;
			margin-top: 2rem;
		}
		
		@media (min-width: 992px) {
			order: 1;
		}
		
		img {
			width: auto;
			height: 371px;
		}
	}

	.LUH-hoeren-body {
		order: 1;
		
		@media(min-width: 992px) {
			order: 2;
		}
		
		margin-left: 25px;
		display: flex;
		flex-direction: column;
		row-gap: 30px;
		font-size: 18px;
		font-weight: bold;
		line-height: 22px;
		
		.LUH-hoeren-ueberschrift {
			font-size: 48px;
			font-weight: bold;
			line-height: 44px;
		}

		.LUH-hoeren-title,
		.LUH-hoeren-thema {
			font-size: 36px;
			font-weight: bold;
			line-height: 44px;
		}

		.LUH-hoeren-gast {
			font-size: 24px;
			font-weight: bold;
			line-height: 29px;
		}

		.LUH-hoeren-folge {
			text-align: right;
			margin-right: 30px;
		}
	}
}


/** Veranstaltungsübersicht **/
body.path-veranstaltungsuebersicht main {
	display: flex;
	flex-direction: row;
	
	@media (min-width: 992px) {
		column-gap: 20px;
	}
	
	.layout-content {
		flex-basis: 74%;
	}
	
	.layout-sidebar-second {
		flex-basis: 24%;
		
		.region-sidebar-second {
			height: 100%;
		}
	}
}

/** Footer **/
.region-footer {
	background-color: #9f2aa4;
	display: flex;
	flex-direction: column;
	
	@media (min-width: 992px) {
		flex-direction: row;
		justify-content: space-between;
		padding: 61px 7%;
	}
}

#block-evangwien-footer {
	color: #fff;
	font-weight: bold;
	
	font-size: 1.25rem;
	line-height: 1.563rem;
	
	@media (min-width: 992px) {
		font-size: 1.5rem;
		line-height: 1.8131rem;
	}
	
	> .field--name-body {
		padding: 0.625rem;
	}
}

/*** Footer-Menu ***/
/*
#block-evangwien-evwfootermenu {
	margin-top: 10px;
}

#block-evangwien-evwfootermenu .tb-megamenu .nav li.dropdown.active > .dropdown-toggle, 
#block-evangwien-evwfootermenu .tb-megamenu .nav li.dropdown.open.active > .dropdown-toggle, 
#block-evangwien-evwfootermenu .tb-megamenu .nav > li.dropdown.open.active > a:hover,
#block-evangwien-evwfootermenu .tb-megamenu .nav > li.dropdown.open.active > span.tb-megamenu-no-link:hover,
#block-evangwien-evwfootermenu .tb-megamenu .nav > .active > a, 
#block-evangwien-evwfootermenu .tb-megamenu .nav > .active > a:hover, 
#block-evangwien-evwfootermenu .tb-megamenu .nav > .active > a:focus, 
#block-evangwien-evwfootermenu .tb-megamenu .nav > .active > span.tb-megamenu-no-link, 
#block-evangwien-evwfootermenu .tb-megamenu .nav > .active > span.tb-megamenu-no-link:hover, 
#block-evangwien-evwfootermenu .tb-megamenu .nav > .active > span.tb-megamenu-no-link:focus,
#block-evangwien-evwfootermenu .tb-megamenu .nav > li > a, 
#block-evangwien-evwfootermenu .tb-megamenu .nav > li > a:focus, 
#block-evangwien-evwfootermenu .tb-megamenu .nav > li > a:hover, 
#block-evangwien-evwfootermenu .tb-megamenu .nav > li > span.tb-megamenu-no-link, 
#block-evangwien-evwfootermenu .tb-megamenu .nav > li > span.tb-megamenu-no-link:focus, 
#block-evangwien-evwfootermenu .tb-megamenu .nav > li > span.tb-megamenu-no-link:hover {
	background-color: #9f2aa4;
	border: none;
	color: #fff;
	text-decoration: none;
	font-size: 24px;
	line-height: 29px;
	font-weight: bold;
}

#block-evangwien-evwfootermenu .tb-megamenu .nav > li.dropdown.open.active > a:hover,
#block-evangwien-evwfootermenu .tb-megamenu .nav > .active > a:hover, 
#block-evangwien-evwfootermenu .tb-megamenu .nav > .active > span.tb-megamenu-no-link:hover,
#block-evangwien-evwfootermenu .tb-megamenu .nav > li > a:hover,
#block-evangwien-evwfootermenu .tb-megamenu .nav > li > span.tb-megamenu-no-link:hover {
	text-decoration: underline;
}

#block-evangwien-evwfootermenu .tb-megamenu .nav > .active > a:not(:last-child) {
	box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
	border-right: 2px solid #fff;
}*/

#block-evangwien-evwfootermenu-2 {
	color: #fff;
	font-weight: bold;
	
	font-size: 1rem;
	line-height: 1.25rem;
	
	@media (min-weight: 992px) {
		font-size: 1.5rem;
		line-height: 1.813rem;
	}
	
	a {
		color: #fff;
	}
	
	ul.menu {
		display: flex;
		
		flex-direction: column;
		
		@media (min-width: 992px) {
			flex-direction: row;
			flex-wrap: wrap;
			column-gap: 1.25rem;
		}
		
		@media (max-width: 992px) {
			> li {
				flex-basis: 50%;
			}
		}
		
		li:not(:last-child) {
			@media (min-width: 992px) {
				padding-right: 1.563rem;
				margin-right: 0.313rem;
				border-right: 1px solid #fff;
			}
		}
	}
}