/**
 * (en) Page layout
 * (de) Seitenlayout
 *
 * @copyright			Copyright 2020, crossbase mediasolution GmbH
 * @version				1.0
 */

@media all {

	/*------------------------------------------------------------------------------------------------------*/
	/* (en) Basic layout elements */
	/* (de) Basis-Layout Elemente */
	/*------------------------------------------------------------------------------------------------------*/

	* {
		margin: 0;
		padding: 0;
	}

	/* (en) Bugfix for Chrome to expand background color if content is smaller than viewport	 */
	/* (de) Bugfix für Chrome, um die Hintergrundfarbe auszudehnen wenn Inhalt kleiner als der Viewport ist	*/
	/*------------------------------------------------------------------------------------------------------*/

	html {
		height: 100%
	}

	/* (en) Marginal areas & page background */
	/* (de) Randbereiche & Seitenhintergrund */
	/*------------------------------------------------------------------------------------------------------*/

	body {
		background: #fff;
		padding: 0;
	}

	body * {
		-webkit-tap-highlight-color: rgba(255, 255, 255, 0);
	}

	body.viewport-width {
		padding: 0;
	}

	/* (en) Stickem content behavior */
	/* (de) Verhalten der Stickem-Inhalte */
	/*------------------------------------------------------------------------------------------------------*/

	.stickem-container {
		position: relative;
		text-align: left;
	}

	.shift-wrapper {
		margin: 0 auto;
		padding: 0;
		max-width: 1200px;
		position: relative;
	}

	.viewport-width .shift-wrapper {
		max-width: none;
		margin: 0;
	}

	/* (en) Header elements */
	/* (de) Header Elemente */
	/*------------------------------------------------------------------------------------------------------*/

	.header {
		background: transparent;
	}

	.viewport-width .header {
		margin: 0;
	}

	.nav-top {
		background: transparent;
		display: block;
		position: absolute;
		top: 12px;
		right: 24px;
		z-index: 1;
		overflow: hidden;
		font-size: 0;
	}

	.half-padding .nav-top {
		right: 12px;
	}

	.header-height-spacer {
		padding: 22px 0;
		position: relative;
	}

	.nav-top-closed {
		display: block;
	}

	.nav-top-toggle {
		display: none;
	}

	.viewport-width .no-nav+div .nav-global {
		min-height: auto;
	}

	a.logo {
		position: absolute;
		display: block;
		left: 0;
		top: -24px;
		z-index: 1;
		-webkit-transition: all 0.3s ease;
		-o-transition: all 0.3s ease;
		transition: all 0.3s ease;
	}

	a.logo>img {
		height: 52px;
		-webkit-transition: all 0.3s ease;
		-o-transition: all 0.3s ease;
		transition: all 0.3s ease;
	}

	.make-nav-sticky a.logo {
		top: 6px;
	}

	.make-nav-sticky a.logo img {
		height: 36px;
    width: 120px;
	}

	.shift-wrapper>a.logo {
		margin-left: 24px;
	}

	/* (en) Footer elements */
	/* (de) Footer Elemente */
	/*------------------------------------------------------------------------------------------------------*/

	.footer {}

}

/*------------------------------------------------------------------------------------------------------*/

/* (en) Media Query 1200 */

/* (de) Media Query 1200 */

/*------------------------------------------------------------------------------------------------------*/

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

	.header {
		margin-top: 0;
	}

}

/*------------------------------------------------------------------------------------------------------*/

/* (en) Media Query 980 */

/* (de) Media Query 980 */

/*------------------------------------------------------------------------------------------------------*/

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

	body {
		padding: 0;
	}

	.nav-top {
		position: relative;
		top: 0;
		left: 0;
		overflow: hidden;
		background: #fff;
		padding: 12px 12px 0 12px;
		display: none;
		text-align: center;
		box-shadow: 0 0 6px rgba(0, 0, 0, 0.2);
	}

	.nav-top-toggle {
		display: block;
		position: absolute;
		right: 52px;
		top: 0;
		z-index: 901;
	}

	.header-height-spacer {
		padding: 60px 0;
	}

	.viewport-width .no-nav .header-height-spacer {
		padding: 32px 0;
	}

	.viewport-width .no-nav+div a.logo {
		top: -4px;
	}

	.no-nav .header-height-spacer {
		padding: 36px 0;
	}

	.no-nav+div a.logo {
		top: -12px;
	}

	a.logo {
		bottom: auto;
		top: -62px;
		left: 24px;
	}

}

/*------------------------------------------------------------------------------------------------------*/

/* (en) Media Query 850 */

/* (de) Media Query 850 */

/*------------------------------------------------------------------------------------------------------*/

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

	.nav-top-closed {
		display: none;
	}

}

/*------------------------------------------------------------------------------------------------------*/

/* (en) Media Query 560 */

/* (de) Media Query 560 */

/*------------------------------------------------------------------------------------------------------*/

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

	a.logo {
		left: 12px;
	}

	.footer * {
		text-align: center;
	}

}