/* Alles ab 399px */

@media screen and (min-width:399px) {
	.mobile-small {
		display: none;
	}
}

/* Mobile und Tablet ab 370px bis 799px */

@media screen and (min-width:370px) and (max-width:799px) {

	#sidebar-buttons {
		float: right;
		flex-direction: column;
	}

	#facebook {
		margin-right: 0;
		margin-bottom: 24px;
		margin-top: 0;
	}

	#eu-label  {
		clear: both;
	}
}

/* Mobile 370px bis 599px */

@media screen and (min-width:370px) and (max-width:599px) {

	#sidebar-buttons {
		/* margin-top: 50px; ohne facebook-Button */
		margin-top: 66px; /* mit facebook-Button */
	}

}

/* Alles ab Mobile 600px */

@media screen and (min-width:600px) {

	#facebook {
		width: 50px;
	}

}

/* Mobile ab 600px und Tablet bis 1279px  */

@media screen and (min-width:600px) and (max-width:1279px) {

	#sidebar-buttons {
		margin-top: 29px;
	}

}


/* Nur Mobile bis 399px */

@media screen and (max-width:399px) {

	#zitat {
		padding: 8px 4%;
		font-size: 0.8125rem;
	}

	#left {
		font-size: 0.875rem;
	}
}

/* Nur Mobile bis 599px */

@media screen and (max-width:599px) {

	#main figure, 
	#main .bild50 .media--left figure,
	#main .bild50 .media--right figure,
	#main .bild40 .media--left figure,
	#main .bild40 .media--right figure, 
	#main .bild30 .media--left figure,
	#main .bild30 .media--right figure {
		width: 100%;
	}

	#main figure, 
	#main .bild50 .media--left figure, 
	#main .bild40 .media--left figure, 
	#main .bild30 .media--left figure {
		margin-right: 0;
	}
	
	#main figure, 
	#main .bild50 .media--right figure, 
	#main .bild40 .media--right figure, 
	#main .bild30 .media--right figure {
		margin-left: 0;
	}
	
	#diakoniesiegel {
  	width: 130px;
	}
	
}



/* Nur Mobile bis 767px */

@media screen and (max-width:767px) {
	
	img, .media--right {
		float: none;
	}

	th, td {
		padding: 10px;
	}

	.table-wrapper {
		overflow: scroll;
		overflow-y: hidden;
		-webkit-overflow-scrolling: touch;
	}

	#nach-oben-button {
		right: 3%;
		bottom: 24px;
	}

	footer {
		text-align: center;
		padding-bottom: 1rem;
	}
	
	#footer .inside {
	  justify-content: center;
	}
	
	
	#footernav ul {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		gap: 14px 28px;
	}

	#footernav li {
		margin: 0px 0px 20px 0px;
	}

	footer .trenner_desktop {
		display: none;
	}
	
	.mitarbeiter:nth-child(odd), .mitarbeiter:nth-child(even) {
		flex-direction: column;
	}
	
	.mitarbeiter:nth-child(odd) p {
		text-align: left;
		}
}

/*  Mobile und Tablet bis 1279px */

@media screen and (max-width:1279px) {
	
	.only_desktop {
		display: none;
	}

	#container {
		padding-left: 0;
		padding-right: 0;
	}

	#logo-wappen, #logotext {
		float: left;
	}

	#logo-wappen {
		width: 41px;
		margin-top: 5px;
		margin-left: 20px;
	}

	#logo-schrift {
		width: 153px;
		margin-bottom: 14px;
		margin-left: 7px;
	}

	#mobilemenu-button {
		position: absolute;
		top: 19px;
		right: 8%;
	}

	#mobilemenu-button .buttontext {
		font-size: 0.75rem;
		font-weight: bold;
		line-height: 0.625rem;
	}

	#mobilemenu-button .fa {
		font-size: 2.5rem;
	}

	#unternav, 
	#navigationsleiste, 
	#zitat_transpbg, 
	.mod_zad_switcher {
		display: none;
	}

	#main {
		float: none;
		width: 100%;
	}

	#left {
		float: none;
		width: 100%;
		margin-left: auto;
		position: static;
	}

	#left .inside {
		padding: 20px 4% 20px 4%;
	}
	
	#left a.bewerbungs-button {
		display: none;
	}
	
/* Mobile Navigation */
	
	.mobile_menu #obere-reihe {
		display: flex;
    	align-items: center;
	}

	.mobile_menu ul.level_1 {
		margin-bottom: 100px;
	}

	.mobile_menu a {
		font-weight: 400;
		color: #000000;
	}
	
	.mobile_menu .level_1 > li {
		display: block;
		padding: 20px 12px 20px 8px;
		background-color: #e6e6e6;
		color: #000000;
		border-top: solid 1px #ffffff;
	}
	
	/*.mobile_menu .level_1 > li > a, .mobile_menu .level_1 > li > strong.active {
		display: block;
		padding: 20px 12px 20px 8px;
		background-color: #e6e6e6;
		color: #000000;
		border-top: solid 1px #ffffff;
	}*/

	.mobile_menu .level_1 > li.last > a, .mobile_menu .level_1 > li.last > strong.active {
		border-bottom: solid 1px #ffffff;
	}

	.mobile_menu ul.level_2 {
		padding-top: 9px;
		padding-left: 32px;
		background-color: #e6e6e6;
	}
	
	.mobile_menu .level_1 > li.trail,
	.mobile_menu .level_1 > li.active,
	.mobile_menu .level_1 > li.active > strong.active, 
	.mobile_menu .level_1 > li.active > ul, 
	.mobile_menu .level_1 > li.trail > a, 
	.mobile_menu .level_1 > li.trail > ul {
		background-color: #ffffff;
	}
	
	.mobile_menu li {
		margin-bottom: 16px;
	}
	
	.mobile_menu .level_1 > li {
		margin-bottom: 0;
	}
	
	.mobile_menu ul.level_2 {
		padding-top: 9px;
		padding-left: 32px;
		background-color: #e6e6e6;
		line-height: 1.75rem;
	}
	
	.mobile_menu ul.level_2 {
		margin-bottom: 0;
		padding-bottom: 12px;
	}
	
	.mobile_menu .level_1 > li > a:before, 
	.mobile_menu .level_1 > li > strong:before, 
	.mobile_menu .submenu_hide > a:before,
	.mobile_menu .submenu_hide > strong:before {
		content:url("../img/arrow_right.gif");
		margin-right: 6px;
		display: inline-block;
	}
	
	.mobile_menu .level_1 > li.submenu_show > a:before,
	.mobile_menu .level_1 > li.submenu_show > strong:before {
		content:url("../img/arrow_down.gif");
		margin-right: 6px;
		display: inline-block;   
	}


/* Suche in der Mobilenavigation */

	.mobile_menu .suche {
		display: block;
		position: relative;
		width: 100%;
		height: 50px;
		padding: 3px 0px 3px 0px;
		margin-top: 8px;
	}

	.mobile_menu #mobile-suchfeld input {
		width: 70%;
		max-width: 350px;
		margin-left: 7px;
	}


	.mobile_menu .closebtn {
			display: none;
		}

	.mobile_menu .suche form {
		margin-bottom:7px
	}


/* Ende Suche in der Mobilenavigation */

	.mobile_menu .mod_zad_switcher {
    	display: block;
    	padding: 0px 6px;
    	margin-bottom: 1px;
	}

/* Bewerbungs-Button in der Mobilenavigation */

	.mobile_menu a.bewerbungs-button {
		color: #ffffff;
		font-weight: bold;
		padding: 10px;
	}

}

/*  Mobile ab und Tablet ab 350px bis 1279px */

@media screen and (min-width:350px) and (max-width:1279px) {

	.mobile_menu #mobile-suchfeld input {
		width: 80%;
	}

}


/*  Mobile ab und Tablet ab 370px bis 1279px */

@media screen and (min-width:370px) and (max-width:1279px) {

	#kontaktdaten {
		float: left;
	}

	#sidebar-buttons {
		justify-content: flex-end;
	}

}

/* Mobile ab 624px und Tablet bis 1279px  */

@media screen and (min-width:624px) and (max-width:1279px) {

	.mobile_menu a.bewerbungs-button {
		left: 198px;
	}

}