/* CSS Breakpoints */

@media screen and (max-width: 600px) , screen and (max-device-width: 480px) {
	/* iOS/WinMobile font size Aenderungen deaktivieren */
	html {
		-ms-text-size-adjust: none;
		-webkit-text-size-adjust: none;
	}

	/* End media - - - - - - - - - - - - - - - - - - - - - */
}

@media screen and (min-width: 520px) {
	/* TouchNavigation anpassen*/

	.navigationOpen .navigation {
		margin-top: -0.5em !important;
		padding-top: 10.5em !important;
	}
	.navigationOpen .navigation li, .navigationOpen .navigation li a {
		line-height: 2em !important;
		height: auto !important;
	}
	#nav-mobile {
		width: 32px;
	}

}

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

	/* Seitliche Abstaende der Navigationsleiste anpassen */
	#header .margin-a {
		margin: 0 20% !important;
	}

	.margin-a .navigation {
		margin: 0 10% !important;
	}
	#fix {
		width: 1024px;
		margin: 0 auto;
	}

	/* End media - - - - - - - - - - - - - - - - - - - - - */
}

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

	.site {
		width: 1200px;
		margin: 0 auto;
		-webkit-box-shadow: 0px 0px 9px 0px rgba(0, 0, 0, 0.2);
		-moz-box-shadow: 0px 0px 9px 0px rgba(0, 0, 0, 0.2);
		box-shadow: 0px 0px 9px 0px rgba(0, 0, 0, 0.2);
	}

	#fix {
		width: 1024px;
		margin: 0 auto;
	}
	#header .margin-a {
		margin: 0 28% !important;
	}

	.margin-a .navigation {
		margin: 0 5% !important;
	}
	/* End media - - - - - - - - - - - - - - - - - - - - - */
}

/*
 @media screen and (min-width: 1600px) {
 #header .margin-a {
 margin: 0 29% !important;
 }
 .margin-a .navigation {
 margin: 0 2.5% !important;
 }
 }
 */

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

	#page {
		max-width: 1024px;
		margin: 0 auto;
	}
	/* SliderQuadrate nach rechts */

	/* Seitliche Abstaende  gleichsetzen*/
	.margin-a, #header .margin-a {
		margin: 0 10% !important;
	}

	/* Seitliche Abstaende  der Navigationsleiste  verringern*/
	.margin-a .navigation {
		margin: 0 5% !important;
	}

	/* End media - - - - - - - - - - - - - - - - - - - - - */
}

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



	/* Hohere Links, damit nicht immer die Adressleiste aufspringt*/ 
	.navigation a {padding-bottom:30px; }
	.tablist-left {

		width: 99% !important;
	}

	/* Header 100% Breite, keinen Abstand u. nicht ueberlappend */
	#navigation, #header, #header .margin-a {
		width: 100%;
		margin: 0 auto !important;
	}
	#slider {
		margin-top: 40px;
	}
	/* Schatten Header ganze Breite*/
	#header {
		-webkit-box-shadow: 0px 0px 9px 0px rgba(0, 0, 0, 0.24);
		-moz-box-shadow: 0px 0px 9px 0px rgba(0, 0, 0, 0.24);
		box-shadow: 0px 0px 9px 0px rgba(0, 0, 0, 0.24);
	}
	#navigation {
		-webkit-box-shadow: none;
		-moz-box-shadow: none;
		box-shadow: none;
	}

	/* Punkte in Kontakt ausblenden u. Zeilenumbruch erzwingen */
	.bulletGo, .bullet {
		opacity: 0;
		width: 40px;
		clear: right;
		display: inline-block;
	}

	#slider-1-sq {

		text-align: left !important;
	}
		/* Groesse des Logos anpassen */
	#logo-link {
		position: relative;
		z-index: 701;
		margin-top: -81px;
		width: 160px;
		margin-left: -15px;
		height: 124px;

	}

	/* End media - - - - - - - - - - - - - - - - - - - - - */
}

@media screen and (max-width: 520px) {
	#slider-1-sq {

		text-align: right !important;
	}

	.swipe .nav {

		top: 30%;
		font-size: 3em;
	}
	.tablist-left {
		margin-top: 0;
	}

	/* Punkte in Kontakt einblenden */
	.bulletGo, .bullet {
		opacity: 1;
		display: inline;
	}
	/* Wechsel zu Mobiledevices */
	#header {
		position: absolute;
	}

	/* Groesse des Logos anpassen */
	#logo-link {
		position: relative;
		z-index: 701;
		margin-top: -81px;
		width: 160px;
		margin-left: -15px;
		height: 124px;

	}

	/* Navigationspunkte ausblenden */
	ul.navigation {
		display: none;
	}

	/* Link zum mobilMenu einblenden  */
	#nav-mobile {
		display: block;
		position: fixed;
	}

	/* Wechsel zur Einspaltigenansicht,  Logo und sliderQuadrate bleiben zweispaltig da nicht .responsive */
	.responsive .col-a, .responsive .col-b, form .responsive .col-b, form .responsive .col-a, .responsive, .kForm {
		width: 100% !important;
		float: none !important;
		clear: both !important;
		padding: 0 !important;
	}

	/* 1ste Spalte ausblenden */
	#content-cell-1 {
		display: none;
	}

	/* 1ste Spalte bei Jobs nicht ausblenden */
	.invert, .show, .show div {
		display: block !important;
	}

	/* JobsMenu fuer die Anzeige unter der Jobbeschreibung anpassen */
	.tablist-left {
		width: 99% !important;
	}

	/* JobKategorien zweispaltig anordnen */
	.tablist-left {
		margin-top: 0em !important;
	}
	.tablist-left li, .tablist-left li a {
		display: inline-block;
		float: left;
		clear: none !important;
		width: 49.9% !important;
		padding: 0;
		white-space: nowrap;
	}

	.tablist-left li a {
		width: 100%;
	}

	/* Groessen u. Abstände der FormFelder anpassen */
	.kForm {
		margin: 0 !important;
		margin-bottom: 0.25em !important;
		padding-left: 0.5em !important;
	}

	/* SliderQuadrate verkleinern*/
.swiper-pagination a {
		height: 0.5em;
		width: 0.5em;
		margin-right: 0em;
		margin-top: 8px;
	}

	/* Groessere Bilder bei Hochformat*/
	.swipe-wrap img {
		width: 133%;
		max-width: 133%;
	}
	.navigationOpen .navigation {
		margin-top: 1.5em !important;
	}

	/* End media - - - - - - - - - - - - - - - - - - - - - */
}
@media screen and (max-width: 380px) {
	/* Punkte in Kontakt ausblenden u. Zeilenumbruch erzwingen */
	.bulletGo, .bullet {
		opacity: 0;
		float: none;
		clear: right;
		width: 40px;
		display: inline-block;
	}

}