@media screen and (max-height: 800px) {
	.arrow {
		padding: 0.5em 0.75em;
	}
	
	.padding.buttons {
    height: 5em;
	}
	
	#header .logos {
		height: 5em;
	}
	
	#header .navigation-table {
		height: 3em;
	}
	
	#content {
		top: 8em;
	}
	
	.headerless #content {
		top: 3em;
	}
	
	.bottommid {
		padding-bottom: 0;
	}
}

@media screen and (max-width: 700px) {
	.desktop {
		display: none;
	}
	
	.mobile {
		display: block;
	}
	
	#footer {
		display: table;
	}
	
	#mainarrows, .bottommid {
		z-index: 10;
		bottom: 5em;
	}
	
	.arrow .text {
		display: none;
	}
	
	.arrow .point.right {
		margin: 0 0.1em 0 0.15em;
	}
	
	.arrow .point.left {
		margin: 0 0.15em 0 0.1em;
	}
	
	#content, .headerless #content {
		top: 0;
		bottom: 4em;
	}
	
	.split, .split:first-child, .split:last-child {
		width: 100%;
		padding: 0;
	}
	
	.split:last-child {
		padding-top: 2em;
	}
	
	.split.hpadding5{
		padding: 0 0.5em;
	}
	
	.split.hpadding8{
		padding: 0 0.8em;
	}
	
	/* Manual */
	/* PV */
	
	#pvconf, #pvconf > div, #pvconf > div > div {
		display: block;
	}
	
	#compasscell {
		margin-top: 1em;
		width: 100%;
	}
	
	#manualmodcount {
		padding: 0.5em;
	}
	
	#steps .step {
		top: 0;
		left: 0;
		right: 0;
		opacity: 1;
		max-width: 100%;
		transition: all 1s;
	}
	
	/*#steps .step.enabled.centered {
		top: 50%;
		left: 0;
		-ms-transform: translate(0%, -50%);
		-webkit-transform: translate(0%, -50%);
		transform: translate(0%, -50%);
		cursor: default;
		transition: all 0s;
	}*/
	
	#steps .step.enabled.centered {
		pointer-events: auto;
		left: 0;
		top: 0;
		-ms-transform: none;
		-webkit-transform: none;
		transform: none;
	}
	
	#steps .step .expand {
		padding: 0.5em
	}
	
	#steps .headline h2{
		line-height: 2em;
		text-align: center;
	}
	
	#steps .step.active .close {
		display: block;
	}
	
	/* Map */
	
	#map {
		top: 5.5em;
	}
	
	#maparrows .arrow {
		bottom: 7em;
	}
	
	/* Results */
	
	.box {
		border-width: 0 4px;
	}
	
	/* Contact */
	#leadcontactform .flex > * {
		width: 100%;
	}
}

@media screen and (max-width: 500px) {
	#choose > div {
		margin: 0.5em 0.5em 0.5em 1em;
	}
	
	#choose .block {
		width: 7em;
		height: 7em;
	}
	
	.slidergroup h2 {
		font-size: 130%;
		padding-top: 0.2em;
	}
	.slidergroup input {
		font-size: 95%;
		height: auto;
		width: 7em;
	}
	
}

@media screen and (max-width: 400px) {
	#footer .navigation .item {
		height: 3em;
		padding: 0.25em;
	}
	
	.tab.map {
		max-height: calc(100vh - 3rem);
	}
	
	#content, .headerless #content {
		bottom: 3em;
	}
	
	#mainarrows, .bottommid {
    bottom: 4em;
		padding-bottom: 0;
	}
	
	.arrow {
		padding: 0.5em 0.75em;
	}
	
	#maparrows .arrow {
		bottom: 6em;
	}
	
	#choose > div:first-child {
		margin-bottom: 2rem;
	}
}
	
@media screen and (max-height: 600px) and (max-width: 700px) {
	#steps .headline h2 {
    line-height: 1em;
	}
	
	#mainarrows, .bottommid {
    bottom: 4em;
	}
	
	#footer .navigation .item {
		height: 3em;
		padding: 0.25em;
	}
	
	#content, .headerless #content {
    bottom: 3em;
	}
	
	#map {
		top: 3em;
	}
	
	#maparrows .arrow {
		bottom: 5em;
	}
}