main.consumer .network-status-form {
	width: 100%;
	max-width: 420px;
}

main.consumer .network-status-form .magenta-form .border {
	border: 1px solid #c5c5c5;
	padding: 30px 20px;
}

main.consumer .network-status-form label input {
    border: 1px solid #c5c5c5;
}

main.consumer .network-status-form label.checkbox .icon-confirm {
    border: 1px solid #c5c5c5;
}

main.consumer .network-status-form .recaptcha-error {
	display: none;
}

main.consumer .network-status-form .result {
	position: relative;
}

main.consumer .network-status-form .result .icon {
	position: absolute;
	left: 0;
	top: 0;
	width: 96px;
	height: 96px;
}

main.consumer .network-status-form .result .icon.positive {
	background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2aWV3Qm94PSIwIDAgNjQgNjQiPjxkZWZzPjxwYXRoIGlkPSJhIiBkPSJNMzIgNEMxNi41MzMgNCA0IDE2LjUzNCA0IDMyLjAwMSA0IDQ3LjQ2NSAxNi41MzMgNjAgMzIgNjBjMTUuNDY0IDAgMjgtMTIuNTM0IDI4LTI3Ljk5OUM2MCAxNi41MzQgNDcuNDY0IDQgMzIgNHptMCA1M0MxOC4yMTUgNTcgNyA0NS43ODYgNyAzMi4wMDEgNyAxOC4yMTUgMTguMjE1IDcgMzIgN3MyNSAxMS4yMTYgMjUgMjUuMDAxQzU3IDQ1Ljc4NSA0NS43ODUgNTcgMzIgNTd6bTE4LjQ2Ny0yMC44ODNhMS4wMTkgMS4wMTkgMCAwIDAtMS4zNi40MDVjLTEuMjE3IDIuMjMyLTYuMDEzIDkuNTE0LTE2LjYxIDkuNTE0LTEwLjYgMC0xNS4zOS03LjI4MS0xNi42MDUtOS41MTRhMS4wMTUgMS4wMTUgMCAwIDAtMS4zNi0uNDA2Ljk3MS45NzEgMCAwIDAtLjQxNCAxLjMyOUMxNS40NjcgMzkuOTIgMjAuNzc4IDQ4IDMyLjQ5OCA0OGMxMS43MTYgMCAxNy4wMzQtOC4wNzkgMTguMzgzLTEwLjU1NGEuOTcuOTcgMCAwIDAtLjQxNC0xLjMyOXpNMTkuMDAxIDMxYTQgNCAwIDEgMC0uMDAyLTggNCA0IDAgMCAwIC4wMDIgOHpNNDUgMzFhNCA0IDAgMSAwIDAtOCA0IDQgMCAwIDAgMCA4eiIvPjwvZGVmcz48ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPjxtYXNrIGlkPSJiIiBmaWxsPSIjZmZmIj48dXNlIHhsaW5rOmhyZWY9IiNhIi8+PC9tYXNrPjx1c2UgZmlsbD0iIzZiYjMyNCIgZmlsbC1ydWxlPSJub256ZXJvIiB4bGluazpocmVmPSIjYSIvPjxnIGZpbGw9IiM2YmIzMjQiIG1hc2s9InVybCgjYikiPjxwYXRoIGQ9Ik0wIDBoNjR2NjRIMHoiLz48L2c+PC9nPjwvc3ZnPg==);
}

main.consumer .network-status-form .result .icon.negative {
	background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2aWV3Qm94PSIwIDAgNjQgNjQiPjxkZWZzPjxwYXRoIGlkPSJhIiBkPSJNMzIuMDAxIDRDMTYuNTM0IDQgNCAxNi41MzQgNCAzMi4wMDEgNCA0Ny40NjYgMTYuNTM0IDYwIDMyLjAwMSA2MCA0Ny40NjUgNjAgNjAgNDcuNDY2IDYwIDMyLjAwMSA2MCAxNi41MzQgNDcuNDY1IDQgMzIuMDAxIDR6bTAgNTNDMTguMjE1IDU3IDcgNDUuNzg2IDcgMzIuMDAxIDcgMTguMjE1IDE4LjIxNSA3IDMyLjAwMSA3IDQ1Ljc4NiA3IDU3IDE4LjIxNSA1NyAzMi4wMDEgNTcgNDUuNzg1IDQ1Ljc4NiA1NyAzMi4wMDEgNTd6bS0uNS0yMWMtNC4wMzUgMC03LjU0MyAyLjA3NC05LjM4NSA1LjU0NmEuOTkxLjk5MSAwIDAgMCAuNDA1IDEuMzM4Ljk4My45ODMgMCAwIDAgMS4zMzItLjQwN2MuNTYtMS4wNTYgMi43NjYtNC41IDcuNjQ5LTQuNXM3LjA4NSAzLjQ0MyA3LjY0NCA0LjQ5OWEuOTgzLjk4MyAwIDAgMCAxLjMzMi40MDguOTkxLjk5MSAwIDAgMCAuNDA3LTEuMzM3QzM5LjA0NCAzOC4wNzQgMzUuNTM2IDM2IDMxLjUwMiAzNnptLTEyLjUtMTJhNCA0IDAgMSAwIDAgOCA0IDQgMCAwIDAgMC04em0yNiAwQTQuMDAyIDQuMDAyIDAgMCAwIDQxIDI4YTMuOTk5IDMuOTk5IDAgMSAwIDggMGMwLTIuMjEtMS43OS00LTMuOTk5LTR6bS0yMy4xMS01LjQyOGMtLjI0OC0uNTE1LS44NDItLjcyLTEuMzI4LS40NThsLTkuMDI1IDQuOTAzYy0uNDg1LjI2NC0uNjc4Ljg5NS0uNDMgMS40MTFhLjk4Mi45ODIgMCAwIDAgLjg4LjU3Mi45MzguOTM4IDAgMCAwIC40NDktLjExNGw5LjAyNi00LjkwM2MuNDg0LS4yNjUuNjc3LS44OTUuNDI5LTEuNDExem0yOS41NyA0LjQ0NWwtOS4wMjUtNC45MDJjLS40ODYtLjI2My0xLjA4LS4wNTktMS4zMjguNDU3cy0uMDU1IDEuMTQ3LjQzIDEuNDEybDkuMDI2IDQuOTAyYS45MzguOTM4IDAgMCAwIC40NDguMTE0Yy4zNTkgMCAuNzA0LS4yMDkuODgtLjU3Mi4yNDgtLjUxNy4wNTUtMS4xNDctLjQzLTEuNDExeiIvPjwvZGVmcz48ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPjxtYXNrIGlkPSJiIiBmaWxsPSIjZmZmIj48dXNlIHhsaW5rOmhyZWY9IiNhIi8+PC9tYXNrPjx1c2UgZmlsbD0iI2Q5MDAwMCIgZmlsbC1ydWxlPSJub256ZXJvIiB4bGluazpocmVmPSIjYSIvPjxnIGZpbGw9IiNkOTAwMDAiIG1hc2s9InVybCgjYikiPjxwYXRoIGQ9Ik0wIDBoNjR2NjRIMHoiLz48L2c+PC9nPjwvc3ZnPg==);
}

main.consumer .network-status-form .typeahead__cancel-button {
	position: absolute;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
	line-height: 42px;
	cursor: pointer;
	padding: 0 8px;
}

main.consumer section#result .image-container {
	min-height: 50px;
	background-repeat: no-repeat;
}

main.consumer section#result .image-container .spinner {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	text-align: center;
	display: none;
}

main.consumer section#result .image-container .spinner img {
	margin: 0 auto;
}

main.consumer section#result .image-container .spinner p {
	font-size: 26px;
	font-weight: 800;
	line-height: 1.23;
	margin: 16px auto 0;
	white-space: nowrap;
}

main.consumer section#result.loading .image-container {
	aspect-ratio: auto;
	background: linear-gradient(270deg, rgba(246, 246, 246, 1) 0%, rgba(246, 246, 246, 1) 40%, rgba(255, 255, 255, 1) 50%, rgba(246, 246, 246, 1) 60%, rgba(246, 246, 246, 1) 100%);
	background-size: 200%;
	animation: gradient 3s ease infinite;
	border: 1px solid #e9e9e9;
	position: relative;
}

main.consumer section#result.loading .image-container .spinner {
	display: block;
}

main.consumer section#result .image-container canvas#result-canvas {
	display: none;
}

main.consumer section#result.loading .image-container canvas#result-canvas,
main.consumer section#result.show-result .image-container canvas#result-canvas {
	width: 100%;
	aspect-ratio: 4/3;
	display: block;
}

main.consumer section#result .legend-container {
	display: none;
}

main.consumer section#result.loading .legend-container,
main.consumer section#result.show-result .legend-container{
	display: block;
}

main.consumer section#result ul.legend {
	display: flex;
}

main.consumer section#result ul.legend li {
	display: flex;
	align-items: center;
}

main.consumer section#result ul.legend li + li {
	margin-left: 32px;
}

main.consumer section#result ul.legend li:before {
	box-sizing: border-box;
	content: '';
	display: block;
	position: relative;
	width: 64px;
	height: 64px;
	border-radius: 8px;
	border: 3px solid rgba(255,255,255, 1);
	outline: 1px solid rgba(0,0,0, 1);
	background-size: cover;
}

main.consumer section#result ul.legend li.none:before {
	background-image: url(/images/120x120_mab_stoerungsabfrage_thumb_keine.png);
}

main.consumer section#result ul.legend li.landline:before {
	background-image: url(/images/120x120_mab_stoerungsabfrage_thumb_festnetz.png);
}

main.consumer section#result ul.legend li.mobile:before {
	background-image: url(/images/120x120_mab_stoerungsabfrage_thumb_mobil.png);
}

main.consumer section#result ul.legend li .description {
	display: block;
	margin-left: 16px;
	font-size: 16px;
	line-height: 1.25;
	font-weight: 800;
}

@media all and (max-width: 729px) {
	
	main.consumer section#result ul.legend {
		flex-direction: column;
	}
	
	main.consumer section#result ul.legend li + li {
		margin-left: 0;
		margin-top: 16px;
	}

}

@media all and (max-width: 639px) {
	
	main.consumer section#result .image-container .spinner p {
		font-size: 18px;
	}
	
}

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

	main.consumer .network-status-form .magenta-form .border {
		border: none;
		padding: 0;
	}

}


@keyframes gradient {
	from {
		background-position: 150% 50%;
	}
	to {
		background-position: -50% 50%;
	}
}