@charset "utf-8";

a,
abbr,
acronym,
address,
applet,
big,
blockquote,
body,
caption,
cite,
code,
dd,
del,
dfn,
div,
dl,
dt,
em,
fieldset,
font,
form,
h1,
h2,
h3,
h4,
h5,
h6,
html,
iframe,
img,
ins,
kbd,
label,
legend,
li,
object,
ol,
p,
pre,
q,
s,
samp,
small,
span,
strike,
strong,
sub,
sup,
table,
tbody,
td,
tfoot,
th,
thead,
tr,
tt,
ul,
var {
	border: 0;
	font: inherit;
	line-height: 1;
	margin: 0;
	padding: 0;
	vertical-align: baseline
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
	display: block
}

html {
	height: 100%;
	min-height: 100%
}

html>body {
	height: auto;
	min-height: 100%
}

body {
	background: #FFF;
	color: #333;
	font-family: Roboto, 'Work Sans', Arial, Helvetica, sans-serif;
	font-size: 16px;
	height: 100%;
	min-height: 100%;
	position: relative
}

ol,
ul {
	list-style: none
}

table {
	border-collapse: collapse;
	border-spacing: 0
}

button,
input,
select,
textarea {
	border: none;
	box-sizing: border-box;
	color: inherit;
	font-family: inherit;
	font-size: inherit;
	outline: 0
}

textarea {
	resize: vertical
}

button,
label {
	cursor: pointer
}

select {
	appearance: none;
	-moz-appearance: none;
	-webkit-appearance: none
}

.cf:after,
.cf:before {
	content: "";
	display: table
}

.cf:after {
	clear: both
}

a {
	color: inherit;
	text-decoration: none
}

.x {
	display: none
}

.c {
	clear: both
}

.wrap {
	position: relative
}

strong {
	font-weight: 700
}

sub,
sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline
}

sub {
	bottom: -.25em
}

sup {
	top: -.4em
}

@media screen and (min-width:65rem) {
	body {
		background: #fff
	}

	.wrap {
		xbackground: #0f0;
		margin: 0 auto;
		max-width: 1110px
	}
}

header .logo a {
	background: url(../img/logo.svg) center center no-repeat;
	display: block;
	height: 44px;
	overflow: hidden;
	padding: 10px;
	text-indent: -500px;
	width: 255px
}

@media screen and (max-width:65rem) {
	header {
		background: linear-gradient(to right, #3f4ba4 0, #19a2c3 100%);
		height: 64px;
		position: fixed;
		top: 0;
		width: 100%;
		z-index: 50
	}

	header .logo a {
		background: url(../img/logo-4.svg) 20px 18px no-repeat;
		background-size: 200px 33px;
		display: block;
		height: 64px;
		overflow: hidden;
		padding: 0 10px;
		text-indent: -500px;
		width: 200px
	}

	header .top {
		display: none
	}

	header .top.login {
		display: block
	}

	header form {
		padding: 20px;
		position: relative
	}

	header input {
		background: #eaeaea;
		border-radius: 4px;
		height: 40px;
		line-height: 40px;
		padding: 0 10px;
		width: 100%;
		-webkit-appearance: none
	}

	header button {
		background: url(../img/search.svg) center center/20px 20px no-repeat;
		position: absolute;
		top: 20px;
		right: 20px;
		height: 40px;
		overflow: hidden;
		text-indent: -200px;
		width: 40px
	}

	input.menu {
		cursor: pointer;
		height: 44px;
		margin: 0;
		position: absolute;
		right: 10px;
		top: 10px;
		width: 44px;
		opacity: 0;
		z-index: 3;
		-webkit-touch-callout: none
	}

	.burger {
		height: 44px;
		position: absolute;
		right: 10px;
		top: 10px;
		width: 44px;
		z-index: 2
	}

	input.menu~div .span {
		background: #FFF;
		border-radius: 10px;
		display: block;
		height: 2px;
		left: 11px;
		position: absolute;
		-webkit-transform: rotate(0deg);
		-moz-transform: rotate(0deg);
		-o-transform: rotate(0deg);
		transform: rotate(0deg);
		-webkit-transition: .25s ease-in-out;
		-moz-transition: .25s ease-in-out;
		-o-transition: .25s ease-in-out;
		transition: .25s ease-in-out;
		width: 22px;
		top: 13px
	}

	input.menu~div .span:nth-child(2),
	input.menu~div .span:nth-child(3) {
		top: 21px
	}

	input.menu~div .span:nth-child(4) {
		top: 29px
	}

	input.menu:checked~div .span {
		left: 50%;
		top: 21px;
		width: 0
	}

	input.menu:checked~div .span:nth-child(2) {
		left: 11px;
		top: 21px;
		-webkit-transform: rotate(45deg);
		-moz-transform: rotate(45deg);
		-o-transform: rotate(45deg);
		transform: rotate(45deg);
		width: 20px
	}

	input.menu:checked~div .span:nth-child(3) {
		left: 11px;
		top: 21px;
		-webkit-transform: rotate(-45deg);
		-moz-transform: rotate(-45deg);
		-o-transform: rotate(-45deg);
		transform: rotate(-45deg);
		width: 20px
	}

	input.menu:checked~div .span:nth-child(4) {
		left: 50%;
		top: 14px;
		width: 0
	}

	.login {
		text-align: center
	}

	.login li {
		display: inline-block
	}

	.login a {
		display: inline-block;
		margin: 0 10px 20px;
		text-decoration: underline
	}

	.outer-nav {
		background: #FFF;
		bottom: 0;
		display: none;
		left: 0;
		overflow: auto;
		position: fixed;
		right: 0;
		top: 74px;
		-webkit-overflow-scrolling: touch;
		-webkit-user-select: none;
		user-select: none;
		z-index: 1
	}

	.nav ul {
		border-bottom: 1px solid #f2f2f2
	}

	.nav ul input[type=checkbox],
	.nav ul span.drop-icon {
		display: none
	}

	.nav ul li {
		border-top: 1px solid #f2f2f2;
		font-weight: 500;
		position: relative
	}

	.nav ul li a {
		display: block;
		padding: 0 0 0 20px;
		height: 40px;
		line-height: 40px;
		transition: all .125s ease-in-out;
		-webkit-transition: all .125s ease-in-out
	}

	.nav ul li .drop-icon {
		background: url(../img/arrow-2.svg) top 17px center/14px 8px no-repeat #fff;
		height: 40px;
		position: absolute;
		right: 0;
		top: 0;
		width: 40px
	}

	.nav ul li li {
		background: #fff;
		border-top: 1px solid #f0f0f0;
		font-weight: 400
	}

	.nav ul li li a {
		padding-left: 40px
	}

	.nav ul li li .drop-icon {
		background-color: #f7f7f7
	}

	.nav ul li li li {
		background: #f7f7f7;
		border-top: 1px solid #e0e0e0
	}

	.nav ul li li li a {
		padding-left: 60px
	}

	.nav ul li li li .drop-icon {
		background-color: #e8e8e8
	}

	.nav ul li li li li {
		background: #e8e8e8;
		border-top: 1px solid #d1d1d1
	}

	.nav ul li li li li a {
		padding-left: 80px
	}

	.nav ul li li li li .drop-icon {
		background-color: #d9d9d9
	}

	.nav ul li li li li li {
		background: #d9d9d9;
		border-top: 1px solid #c2c2c2
	}

	.nav ul li li li li li a {
		padding-left: 100px
	}

	.nav .sub-menu {
		border: none;
		display: none
	}

	.nav input[type=checkbox]:checked+.sub-menu {
		display: block
	}

	input.menu:checked~.nav {
		display: block
	}

	input.menu:checked~.outer-nav {
		display: block
	}
}

@media screen and (min-width:65rem) {
	header {
		height: 188px
	}

	header .wrap {
		max-width: 1010px
	}

	header:before {
		background: linear-gradient(to right, #3f4ba4 0, #19a2c3 100%);
		content: "\00a0";
		font-size: 14px;
		left: 0;
		padding: 8px 0;
		position: absolute;
		right: 0;
		top: 0;
		z-index: 0
	}

	header .top {
		color: #FFF;
		font-size: 14px
	}

	header .top li {
		float: left;
		padding: 0 20px 0 0
	}

	header .top a,
	header .top span {
		float: left;
		padding: 8px 10px
	}

	header .top a:focus {
		background: #333;
		outline: 0
	}

	header .login {
		position: absolute;
		right: 0;
		top: 0
	}

	header .login li {
		padding: 0 0 0 20px
	}

	header .login a:focus {
		background: #333;
		outline: 0
	}

	header .logo {
		position: absolute;
		top: 62px
	}

	header .burger,
	header .menu {
		display: none
	}

	header form {
		position: absolute;
		right: 10px;
		top: 63px
	}

	header input {
		background: #eaeaea;
		border: 2px solid #eaeaea;
		border-right: none;
		border-bottom-left-radius: 4px;
		border-top-left-radius: 4px;
		box-sizing: border-box;
		float: left;
		height: 42px;
		line-height: 42px;
		padding: 0 10px;
		width: 300px
	}

	header input:focus {
		border-color: #333
	}

	header button {
		background: #333;
		border-bottom-right-radius: 4px;
		border-top-right-radius: 4px;
		color: #FFF;
		float: left;
		font-weight: 700;
		height: 42px;
		width: 100px
	}

	header .nav {
		left: 0;
		position: absolute;
		top: 138px;
		right: 0
	}

	header nav {
		margin: 0 auto;
		position: relative
	}

	header ul.main-menu {
		background: #eaeaea;
		border-radius: 4px;
		margin: 0 10px
	}

	header ul.main-menu li {
		float: left;
		font-weight: 500;
		position: relative;
		white-space: nowrap
	}

	header ul.main-menu li:first-child:hover {
		border-top-left-radius: 4px
	}

	header ul.main-menu li:hover span {
		border-bottom: 3px solid #ED3B3B
	}

	header ul.main-menu li a {
		color: #333;
		display: block;
		height: 50px;
		line-height: 50px;
		padding: 0 20px;
		position: relative
	}

	header ul.main-menu li a:hover span {
		border-bottom: 3px solid #ED3B3B
	}

	header ul.main-menu li:hover>input[type=checkbox]+ul {
		display: block
	}

	header ul.main-menu ul {
		left: 0;
		position: absolute;
		top: 100%;
		z-index: 8
	}

	header ul.main-menu ul li {
		background: #eaeaea;
		color: #666;
		float: none;
		font-weight: 400
	}

	header ul.main-menu ul li:hover {
		background: #ccc;
		color: #333
	}

	header ul.main-menu ul li:hover a {
		color: inherit
	}

	header ul.main-menu ul li a {
		color: #666;
		font-size: 14px;
		height: 40px;
		line-height: 40px;
		padding: 0 60px 0 20px;
		position: relative
	}

	header ul.main-menu ul li a:hover {
		background: #ccc
	}

	header ul.main-menu ul li label.drop-icon {
		background: url(../img/arrow-1.svg) top 9px center/12px 12px no-repeat;
		border-radius: 4px;
		bottom: 5px;
		position: absolute;
		right: 5px;
		top: 5px;
		width: 30px
	}

	header ul.main-menu ul li ul {
		top: 0;
		left: 100%
	}

	header ul.main-menu ul li ul li:first-child:hover {
		border-top-left-radius: 0
	}

	header ul.main-menu input[type=checkbox]:checked+ul,
	header ul.main-menu ul {
		display: none
	}

	header ul.main-menu input[type=checkbox],
	header ul.main-menu span.drop-icon {
		display: none
	}
}

.skip-link {
	background: #333;
	border-radius: 4px;
	color: #FFF;
	left: 20px;
	padding: 8px 15px;
	position: absolute;
	top: -40px;
	z-index: 100
}

.body {
	padding: 67px 0 0
}

#scrollToTop {
	background: url(../img/up.svg) center center/20px 20px no-repeat #27b5de;
	border-radius: 50px;
	bottom: 20px;
	display: none;
	height: 50px;
	overflow: hidden;
	position: fixed;
	right: 20px;
	text-indent: -300px;
	width: 50px
}

.pseudo-table {
	display: table;
	width: 100%
}

.bc {
	font-size: 12px;
	padding: 7px 20px 1px
}

.bc li {
	float: left
}

.bc li:after {
	color: #999;
	float: left;
	content: "/";
	padding: 0 5px
}

.bc li:last-child:after {
	content: ""
}

.bc li a {
	color: #999;
	float: left
}

.klima .t1 {
	background: #6CF
}

.klima .t2 {
	background: #8DF
}

.klima .t3 {
	background: #AEF
}

.klima .t4 {
	background: #CFF
}

.klima .t5 {
	background: #FF9
}

.klima .t6 {
	background: #FC6
}

.klima .t7 {
	background: #FB5
}

.klima .t8 {
	background: #FA4
}

.klima .t9 {
	background: #F93
}

.klima .t10 {
	background: #F82
}

.klima .t11 {
	background: #F71
}

.klima .t12 {
	background: #F60
}

.klima .s1 {
	background: #FFC
}

.klima .s2 {
	background: #FFFAB9
}

.klima .s3 {
	background: #FFF6A7
}

.klima .s4 {
	background: #FFF194
}

.klima .s5 {
	background: #FFEC82
}

.klima .s6 {
	background: #FFE86F
}

.klima .s7 {
	background: #FFE35D
}

.klima .s8 {
	background: #FFDF4A
}

.klima .s9 {
	background: #FFDA38
}

.klima .s10 {
	background: #FFD525
}

.klima .s11 {
	background: #FFD113
}

.klima .s12 {
	background: #FC0
}

.klima .w1 {
	background: #CFF
}

.klima .w2 {
	background: #B9F6FA
}

.klima .w3 {
	background: #A7ECF6
}

.klima .w4 {
	background: #94E3F1
}

.klima .w5 {
	background: #82DAEC
}

.klima .w6 {
	background: #6FD1E8
}

.klima .w7 {
	background: #5DC7E3;
	color: #FFF
}

.klima .w8 {
	background: #4ABEDF;
	color: #FFF
}

.klima .w9 {
	background: #38B5DA;
	color: #FFF
}

.klima .w10 {
	background: #25ACD5;
	color: #FFF
}

.klima .w11 {
	background: #13A2D1;
	color: #FFF
}

.klima .w12 {
	background: #09C;
	color: #FFF
}

.klima .r1 {
	background: #9CF
}

.klima .r2 {
	background: #8BBEF6
}

.klima .r3 {
	background: #7DB0EC
}

.klima .r4 {
	background: #6FA2E3
}

.klima .r5 {
	background: #6194DA;
	color: #FFF
}

.klima .r6 {
	background: #5386D1;
	color: #FFF
}

.klima .r7 {
	background: #4679C7;
	color: #FFF
}

.klima .r8 {
	background: #386BBE;
	color: #FFF
}

.klima .r9 {
	background: #2A5DB5;
	color: #FFF
}

.klima .r10 {
	background: #1C4FAC;
	color: #FFF
}

.klima .r11 {
	background: #0E41A2;
	color: #FFF
}

.klima .r12 {
	background: #039;
	color: #FFF
}

@media screen and (max-width:65rem) {
	.klima {
		padding: 0 20px 29px
	}

	.klima table,
	.klima tbody,
	.klima td,
	.klima th,
	.klima thead,
	.klima tr {
		display: block
	}

	.klima thead {
		position: absolute;
		top: -9999px;
		left: -9999px
	}

	.klima tr {
		padding: 10px 0 0
	}

	.klima tr:first-child {
		padding: 0
	}

	.klima td {
		border-bottom: 1px solid #FFF;
		padding: 7px 0 8px 75%;
		position: relative;
		text-align: center
	}

	.klima td:before {
		background: #f2f2f2;
		box-sizing: border-box;
		color: #333;
		left: 0;
		padding: 7px 0 8px 10px;
		position: absolute;
		text-align: left;
		top: 0;
		white-space: nowrap;
		width: 75%
	}

	.klima td:nth-child(even):before {
		background: #ededed
	}

	.klima td:first-child {
		color: #333;
		font-weight: 900;
		padding: 7px 0 6px;
		text-align: left
	}

	.klima .day td:after,
	.klima .night td:after,
	.klima .water td:after {
		content: " °C"
	}

	.klima .day td:nth-of-type(1):after,
	.klima .night td:nth-of-type(1):after,
	.klima .water td:nth-of-type(1):after {
		content: ""
	}

	.klima .sun td:after {
		content: " h"
	}

	.klima .sun td:nth-of-type(1):after {
		content: ""
	}

	.klima td:nth-of-type(2):before {
		content: "Januar"
	}

	.klima td:nth-of-type(3):before {
		content: "Februar"
	}

	.klima td:nth-of-type(4):before {
		content: "März"
	}

	.klima td:nth-of-type(5):before {
		content: "April"
	}

	.klima td:nth-of-type(6):before {
		content: "Mai"
	}

	.klima td:nth-of-type(7):before {
		content: "Juni"
	}

	.klima td:nth-of-type(8):before {
		content: "Juli"
	}

	.klima td:nth-of-type(9):before {
		content: "August"
	}

	.klima td:nth-of-type(10):before {
		content: "September"
	}

	.klima td:nth-of-type(11):before {
		content: "Oktober"
	}

	.klima td:nth-of-type(12):before {
		content: "November"
	}

	.klima td:nth-of-type(13):before {
		content: "Dezember"
	}
}

.hero-isolated {
	background: #FFF;
	display: block
}

.hero-isolated .lft {
	padding: 17px 20px 0
}

.hero-isolated img {
	display: block;
	margin: 0 auto;
	max-height: 250px;
	max-width: 100%
}

.hero-isolated .rgt {
	padding: 0 20px 2px
}

.hero-isolated .dz {
	color: #0090ba;
	display: block;
	font-size: 16px;
	font-weight: 700;
	letter-spacing: 3px;
	padding: 19px 0 11px;
	text-transform: uppercase
}

.hero-isolated b {
	display: block;
	font-family: 'Work Sans', Roboto, Arial, Helvetica, sans-serif;
	font-size: 30px;
	font-weight: 700
}

.hero-isolated p {
	color: #666;
	font-size: 18px;
	line-height: 24px;
	padding: 10px 0 12px
}

.hero-isolated .seal {
	display: none
}

.hero-img {
	border-radius: 4px;
	display: block;
	padding: 17px 20px 2px;
	overflow: hidden;
	position: relative
}

.hero-img img {
	display: block;
	margin: 0 auto;
	max-height: 100%;
	max-width: 100%
}

.hero-img span {
	color: #0090ba;
	display: block;
	font-size: 16px;
	font-weight: 700;
	letter-spacing: 3px;
	padding: 19px 0 11px;
	text-transform: uppercase
}

.hero-img b {
	display: block;
	font-family: 'Work Sans', Roboto, Arial, Helvetica, sans-serif;
	font-size: 30px;
	font-weight: 700
}

.hero-img p {
	color: #666;
	font-size: 18px;
	line-height: 24px;
	padding: 10px 0 12px
}

.mehr .fake-table {
	padding: 20px 20px 0
}

.mehr a {
	border-top: 1px solid #EAEAEA;
	display: table;
	width: 100%
}

.mehr a div {
	display: table-cell;
	padding: 0 0 0 20px;
	vertical-align: middle
}

.mehr picture {
	display: table-cell;
	height: 70px;
	padding: 20px 0;
	vertical-align: middle;
	width: 120px
}

.mehr img {
	display: block;
	max-height: 80px;
	max-width: 100%;
	border-radius: 4px;
	margin: 0 auto
}

.mehr b {
	color: #0090ba;
	display: block;
	font-size: 14px;
	font-weight: 700;
	letter-spacing: 1px;
	padding: 3px 0 4px;
	text-transform: uppercase
}

.mehr em {
	display: block;
	font-family: 'Work Sans', Roboto, Arial, Helvetica, sans-serif;
	font-size: 18px;
	font-style: normal;
	font-weight: 700
}

.mehr p {
	display: none
}

.heading1 {
	font-family: 'Work Sans', Roboto, Arial, Helvetica, sans-serif;
	font-size: 24px;
	font-weight: 700;
	padding: 36px 20px 16px;
	text-align: center
}

.heading2 {
	border-radius: 4px;
	padding: 49px 20px 1px;
	position: relative;
	overflow: hidden
}

.heading2 .hl {
	display: block;
	font-family: 'Work Sans', Roboto, Arial, Helvetica, sans-serif;
	font-size: 28px;
	font-weight: 700;
	padding: 0 0 14px;
	text-align: center
}

.heading2 ul {
	font-size: 16px;
	text-align: center
}

.heading2 li {
	display: inline-block;
	opacity: .7;
	padding: 0 5px 16px
}

.heading2 .more {
	display: none
}

.rubrik {
	xbackground: pink
}

.rubrik .flexbox {
	xbackground: red;
	padding: 0 20px 20px
}

.rubrik a {
	xbackground: #0f0;
	border-top: 1px solid #EAEAEA;
	display: table;
	width: 100%
}

.rubrik a:first-child {
	xbackground: #ff0;
	border: none;
	display: block
}

.rubrik a:first-child .lft {
	display: block;
	height: auto;
	padding: 0;
	width: 100%
}

.rubrik a:first-child .lft img {
	max-height: 250px;
	max-width: 100%
}

.rubrik a:first-child .rgt {
	display: block;
	padding: 0 0 15px
}

.rubrik a:first-child .rgt b {
	color: #0090ba;
	display: Block;
	Font-Size: 16Px;
	Font-Weight: 700;
	Letter-Spacing: 3Px;
	Padding: 19Px 0 11Px 0;
	Text-Transform: Uppercase
}

.rubrik a:first-child .rgt em {
	display: block;
	font-family: 'Work Sans', Roboto, Arial, Helvetica, sans-serif;
	font-size: 30px;
	font-weight: 700
}

.rubrik a .lft {
	display: table-cell;
	height: 70px;
	padding: 20px 0;
	vertical-align: middle;
	width: 120px
}

.rubrik a .rgt {
	display: table-cell;
	padding: 0 0 0 20px;
	vertical-align: middle
}

.rubrik a img {
	border-radius: 4px;
	display: block;
	margin: 0 auto;
	max-height: 80px;
	max-width: 100%
}

.rubrik a b {
	color: #0090ba;
	display: block;
	font-size: 14px;
	font-weight: 700;
	letter-spacing: 1px;
	padding: 3px 0 4px;
	text-transform: uppercase
}

.rubrik a em {
	display: block;
	font-family: 'Work Sans', Roboto, Arial, Helvetica, sans-serif;
	font-size: 18px;
	font-style: normal;
	font-weight: 700
}

.rubrik a p {
	display: none
}

.pagination {
	padding: 10px 20px 30px;
	text-align: center
}

.pagination a,
.pagination b {
	background: #FFF;
	border-radius: 4px;
	box-sizing: border-box;
	color: #666;
	display: inline-block;
	height: 40px;
	line-height: 40px;
	margin: 10px 10px 0 0;
	min-width: 40px;
	padding: 0 10px;
	text-align: center
}

.pagination b {
	background: #999;
	color: #FFF;
	font-weight: 400
}

.pagination span {
	color: #999;
	display: inline-block;
	height: 40px;
	line-height: 40px;
	margin: 10px 10px 0 0
}

.pagination span:before {
	content: "..."
}

.pagination .desktop-only {
	opacity: 0;
	position: absolute;
	left: -1000px;
	overflow: hidden
}

.article {
	padding: 22px 0 0
}

.article .dz {
	color: #0090ba;
	display: block;
	font-size: 16px;
	font-weight: 700;
	letter-spacing: 3px;
	padding: 14px 20px 4px;
	text-transform: uppercase
}

.article h1 {
	font-family: 'Work Sans', Roboto, Arial, Helvetica, sans-serif;
	font-size: 30px;
	font-weight: 700;
	padding: 7px 20px 2px 18px
}

.article h2 {
	font-family: 'Work Sans', Roboto, Arial, Helvetica, sans-serif;
	font-size: 26px;
	font-weight: 700;
	margin: 0 20px;
	padding: 48px 0 18px;
	position: relative
}

.article h2:after {
	background: #fc0;
	bottom: 7px;
	content: "";
	height: 5px;
	left: 0;
	position: absolute;
	width: 40px
}

.article h2+p {
	padding-top: 7px
}

.article h2+ol,
.article h2+ul {
	padding-top: 0
}

.article h3 {
	font-family: 'Work Sans', Roboto, Arial, Helvetica, sans-serif;
	font-size: 22px;
	font-weight: 700;
	margin: 0 20px;
	padding: 26px 0 3px
}

.article h3+p {
	padding-top: 7px
}

.article h3+ol,
.article h3+ul {
	padding-top: 0
}

.article p {
	font-size: 18px;
	line-height: 26px;
	padding: 24px 20px 0
}

.article p a {
	border-bottom: 2px solid #ace2f2;
	color: #0090ba
}

.article .vorspann p {
	font-weight: 700;
	padding: 27px 20px 0
}

.article .bold {
	font-weight: 500
}

.article ol,
.article ul {
	font-size: 18px;
	list-style: decimal;
	padding: 20px 20px 0
}

.article ol li,
.article ul li {
	line-height: 26px;
	margin: 0 0 0 20px;
	padding: 7px 0 0 10px
}

.article ol a,
.article ul a {
	border-bottom: 2px solid #ace2f2;
	color: #0090ba
}

.article ul {
	list-style: none
}

.article ul li {
	background: url(../img/dot.svg) top 17px left/6px 6px no-repeat;
	margin: 0;
	padding: 7px 0 0 20px
}

.article .fazit ul {
	font-size: 18px;
	padding: 5px 20px 0
}

.article .fazit ul:before {
	background: url(../img/yes.svg) top 5px left/24px 24px no-repeat;
	content: "Pro";
	display: block;
	font-size: 24px;
	font-weight: 700;
	padding: 5px 30px 6px 34px
}

.article .fazit ul.contra {
	padding: 22px 20px 0
}

.article .fazit ul.contra:before {
	background: url(../img/no.svg) top 4px left/24px 24px no-repeat;
	content: "Contra"
}

.article .fazit ul li {
	background: url(../img/pro2.svg) 6px 11px no-repeat;
	background-size: 12px 12px;
	line-height: 22px;
	padding: 6px 10px 5px 34px
}

.article .fazit ul.contra li {
	background: url(../img/con2.svg) 7px 12px no-repeat;
	background-size: 10px 10px
}

.article .fazit div {
	background: #232e75;
	border: 1px solid #232e75;
	margin: 30px auto 10px;
	text-align: center;
	width: 188px
}

.article .fazit div img {
	display: block;
	margin: 10px 10px 7px;
	width: 168px
}

.article .fazit div em {
	background: #FFF;
	display: block;
	font-size: 28px;
	font-weight: 700;
	padding: 16px 10px 15px
}

.article .fazit div b {
	background: #FFF;
	display: block;
	font-size: 16px;
	font-weight: 400;
	padding: 0 10px
}

.article .fazit div i {
	background: #FFF;
	color: #27B5DE;
	display: block;
	font-size: 16px;
	font-style: normal;
	font-weight: 700;
	padding: 4px 10px 16px
}

.article .fazit div span {
	background: #EAEAEA;
	color: #666;
	display: block;
	font-size: 11px;
	padding: 5px 10px 4px
}

.author {
	border-top: 1px solid #EAEAEA;
	box-sizing: border-box;
	color: #999;
	font-size: 14px;
	margin: 13px 20px 0
}

.author div {
	display: table;
	padding: 20px 0;
	width: 100%
}

.author b {
	background: top left/40px 40px no-repeat;
	border-radius: 40px;
	display: table-cell;
	height: 40px;
	vertical-align: middle;
	width: 40px
}

.author .name {
	display: table-cell;
	margin: 0 0 0 20px;
	padding: 2px 0 0 10px;
	vertical-align: middle
}

.author .name span {
	color: #333;
	font-weight: 700
}

.author .name span.ds:before {
	content: "Daniel Smolcic"
}

.author .name span.xds:after {
	content: ", Daniel Smolcic"
}

.author .name span.is:before {
	content: "Isabel Smolcic"
}

.author .name:after {
	content: " – Anzeige";
	font-weight: 400
}

.author i {
	display: none
}

.aufmacher {
	padding: 0 20px;
	position: relative
}

.aufmacher>a:after {
	background: url(../img/ecke-3.svg) right bottom no-repeat;
	bottom: 0;
	content: "";
	height: 80px;
	position: absolute;
	right: 10px;
	width: 160px;
	z-index: 5
}

.aufmacher img {
	border-radius: 4px;
	overflow: hidden;
	display: block;
	width: 100%
}

.aufmacher.isolated img {
	margin: 0 auto;
	max-height: 320px;
	max-width: 100%;
	width: auto
}

.aufmacher span {
	background: url(../img/arrow-3.svg) right 13px center/12px 12px no-repeat #333;
	border-radius: 4px;
	bottom: 15px;
	color: #FFF;
	font-weight: 500;
	height: 40px;
	line-height: 40px;
	padding: 0 38px 0 15px;
	position: absolute;
	right: 20px;
	z-index: 10
}

.aufmacher span:after {
	content: "Galerie öffnen";
	white-space: nowrap
}

.aufmacher .credit {
	top: 0;
	color: #666;
	display: block;
	font-size: 11px;
	opacity: .65;
	position: absolute;
	right: 15px;
	transform: rotate(270deg);
	transform-origin: 100% 0
}

.aufmacher .credit.ds:before {
	content: "Bild: Daniel Smolcic"
}

.aufmacher .credit.is:before {
	content: "Bild: Isabel Smolcic"
}

.aufmacher .credit:before {
	content: "Bild: "
}

.toc {
	border-bottom: 1px solid #EAEAEA;
	border-top: 1px solid #EAEAEA;
	counter-reset: section;
	margin: 20px 20px 7px
}

.toc .toggle {
	background: url(../img/arrow-9.svg) right center no-repeat;
	display: inline-block;
	font-size: 18px;
	font-weight: 700;
	padding: 8px 20px 7px 0
}

.toc ol {
	display: none;
	list-style: none;
	padding: 0
}

.toc ol li {
	border-top: 1px solid #EAEAEA;
	font-size: 18px;
	line-height: 1;
	margin: 0;
	padding: 8px 0 7px
}

.toc ol li:before {
	counter-increment: section;
	content: counter(section) ". "
}

.toc ol a {
	border: none
}

.inline-img {
	margin: 23px 0 0;
	padding: 0 20px;
	position: relative
}

.inline-img dt {
	border-radius: 4px;
	overflow: hidden
}

.inline-img dd {
	border-bottom: 1px solid #CCC
}

.inline-img dd p {
	color: #999;
	font-size: 14px;
	line-height: 21px;
	padding: 5px 0 3px
}

.inline-img dd p a {
	border-bottom: 1px solid #ace2f2;
	color: #0090ba
}

.inline-img dd span {
	color: #CCC;
	display: block;
	font-size: 10px;
	line-height: 1;
	opacity: .65;
	position: absolute;
	right: 15px;
	top: 0;
	transform: rotate(270deg);
	transform-origin: 100% 0
}

.inline-img dd span:before {
	content: "Foto: "
}

.inline-img dd span.ds:before {
	content: "Foto: Daniel Smolcic"
}

.inline-img dd span.is:before {
	content: "Foto: Isabel Smolcic"
}

.inline-img img {
	border-radius: 4px;
	display: block;
	margin: 0 auto;
	overflow: hidden;
	max-width: 100%
}

.inline-img.isolated img {
	margin: 20px auto;
	max-height: 300px
}

#gallery {
	background: #333;
	color: #FFF
}

#gallery .back {
	background: #000;
	display: block;
	font-size: 14px;
	position: sticky;
	top: 0;
	z-index: 10
}

#gallery .back a:first-of-type {
	background: url(../img/arrow-4.svg) 20px 20px no-repeat;
	background-size: 8px 8px;
	color: #CCC;
	display: inline-block;
	padding: 18px 20px 18px 40px
}

#gallery .back a:last-of-type {
	position: absolute;
	right: 20px;
	top: 17px;
	width: 120px
}

#gallery .back img {
	display: block;
	width: 100%
}

#gallery .dz {
	color: #fc0;
	display: block;
	font-size: 14px;
	font-weight: 700;
	letter-spacing: 3px;
	padding: 19px 20px 0;
	text-transform: uppercase
}

#gallery .h1 {
	display: block;
	font-family: 'Work Sans', Roboto, Arial, Helvetica, sans-serif;
	font-size: 24px;
	font-weight: 700;
	padding: 3px 20px 36px
}

#gallery dl {
	border-bottom: 1px dashed #999;
	margin: 0 20px 20px
}

#gallery dl dt {
	box-sizing: border-box;
	height: 0;
	overflow: hidden;
	padding-top: 66.66667%;
	position: relative
}

#gallery dl dt.isolated {
	background: #FFF
}

#gallery dl dt.isolated img {
	box-sizing: border-box;
	border: 20px solid #FFF
}

#gallery dl dt picture {
	box-sizing: border-box;
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	vertical-align: middle;
	width: 100%
}

#gallery dl dt picture div {
	align-items: center;
	box-sizing: border-box;
	display: flex;
	height: 100%;
	justify-content: center
}

#gallery dl dt picture img {
	display: block;
	max-height: 100%;
	max-width: 100%
}

#gallery dl dd span {
	color: #999;
	display: block;
	font-weight: 700;
	padding: 19px 0 12px
}

#gallery dl dd p {
	font-size: 16px;
	line-height: 24px
}

#gallery dl dd p a {
	border-bottom: 2px solid #FC0
}

#gallery dl dd div {
	color: #666;
	display: block;
	font-size: 12px;
	padding: 2px 0 18px
}

#gallery dl dd div:before {
	content: "Bild: "
}

#gallery dl dd div.ds:after {
	content: "Daniel Smolcic"
}

#gallery dl dd div.is:after {
	content: "Isabel Smolcic"
}

#gallery .close {
	padding: 20px 20px 40px
}

#gallery .close a {
	background: url(../img/close.svg) center center/20px 20px no-repeat #666;
	border-radius: 50px;
	display: block;
	height: 50px;
	margin: 0 auto;
	width: 50px
}

.product-box {
	border-radius: 4px;
	box-shadow: 0 0 6px 0 rgba(0, 0, 0, .25);
	margin: 10px 20px 30px;
	overflow: hidden;
	position: relative
}

.product-box:after {
	color: #ccc;
	content: "Anzeige";
	font-size: 9px;
	right: 4px;
	position: absolute;
	top: 2px
}

.product-box .img {
	background: #FFF;
	padding: 20px 20px 0;
	text-align: center
}

.product-box .img img {
	display: block;
	margin: 0 auto;
	max-height: 150px;
	max-width: 100%
}

.product-box .cell {
	background: #FFF
}

.product-box .name {
	font-family: 'Work Sans', Roboto, Arial, Helvetica, sans-serif;
	font-size: 24px;
	font-weight: 700;
	line-height: 26px;
	margin: 0 20px;
	padding: 17px 0 11px;
	position: relative
}

.product-box .name:after {
	background: #fc0;
	bottom: 0;
	content: "";
	height: 6px;
	left: 0;
	position: absolute;
	width: 50px
}

.product-box .descr {
	color: #666;
	font-size: 18px;
	line-height: 26px;
	padding: 14px 20px
}

.product-box .price {
	background: #F5F5F5;
	padding: 20px 0 10px;
	text-align: center
}

.product-box .price b {
	background: url(../img/amazon.svg) top center/80px 25px no-repeat;
	color: #ed3b3b;
	display: block;
	font-size: 16px;
	padding: 34px 0 7px
}

.product-box .price span {
	color: #999;
	display: block;
	font-size: 12px;
	padding: 0 0 8px;
	text-decoration: line-through
}

.product-box .price a {
	background: #ed3b3b;
	border-radius: 4px;
	color: #FFF;
	display: inline-block;
	font-weight: 700;
	height: 40px;
	line-height: 40px;
	margin: 10px auto;
	padding: 0 20px
}

.product-box .price a:after {
	content: " \00BB"
}

.product-box .price strong {
	color: #666;
	display: block;
	font-size: 13px;
	padding: 0 0 10px;
	text-align: center
}

.datenblatt {
	padding: 13px 20px 7px
}

.datenblatt table,
.datenblatt tbody {
	display: block;
	width: 100%
}

.datenblatt tr {
	border-radius: 4px;
	display: table;
	width: 100%
}

.datenblatt tr:nth-child(odd) {
	background: #EAEAEA
}

.datenblatt td,
.datenblatt th {
	box-sizing: border-box;
	display: table-cell;
	line-height: 22px;
	padding: 9px 10px;
	text-align: left;
	vertical-align: top;
	width: 50%
}

.datenblatt th {
	font-weight: 700
}

.datenblatt a {
	border-bottom: 2px solid #ace2f2;
	color: #0090ba
}

.datenblatt tr:nth-child(odd) a {
	border-bottom: 2px solid #7fd3ec
}

.datenblatt .rating {
	color: #3C3;
	font-weight: 700
}

.datenblatt .rating-4 {
	color: #9C0
}

.datenblatt .rating-3 {
	color: #F90
}

.datenblatt .rating-2 {
	color: red
}

.datenblatt .rating-1 {
	color: #900
}

.accordion {
	padding: 3px 0 7px
}

.accordion dt {
	font-size: 18px;
	margin: 10px 20px 0
}

.accordion dt a {
	background: url(../img/arrow-2.svg) top 16px right 15px no-repeat #eaeaea;
	background-size: 14px 14px;
	border-radius: 4px;
	display: block;
	line-height: 26px;
	padding: 9px 44px 8px 15px
}

.accordion dt.open a {
	background: url(../img/arrow-10.svg) top 16px right 15px no-repeat, linear-gradient(to right, #3f4ba4 0, #19a2c3 100%);
	color: #FFF
}

.accordion dd {
	display: none
}

.accordion p {
	padding: 14px 20px 20px
}

.form {
	font-size: 18px;
	padding: 0 20px
}

.form p {
	color: #666;
	line-height: 28px;
	padding: 25px 0 0
}

.form .error,
.form .notice,
.form .warning {
	padding: 32px 0 8px
}

.form .error div,
.form .notice div,
.form .warning div {
	border: 2px solid #ED3B3B;
	border-radius: 4px;
	padding: 13px 20px 12px
}

.form .error p,
.form .notice p,
.form .warning p {
	color: #ED3B3B;
	font-weight: 700;
	padding: 0
}

.form .error p a,
.form .notice p a,
.form .warning p a {
	border-bottom: 2px solid #fac7c7;
	color: inherit
}

.form .error span,
.form .notice span,
.form .warning span {
	font-weight: 700
}

.form .error ul,
.form .notice ul,
.form .warning ul {
	padding: 5px 0 0
}

.form .error li,
.form .notice li,
.form .warning li {
	background: url(../img/dot.svg) top 20px left/6px 6px no-repeat;
	line-height: 28px;
	padding: 10px 0 0 20px
}

.form .error span {
	color: #ED3B3B
}

.form .error li {
	background-image: url(../img/dot2.svg);
	color: #ED3B3B
}

.form .notice div {
	border: 2px solid #19A1C3
}

.form .error div,
.form .notice div {
	padding: 18px 20px 12px
}

.form .block {
	padding: 25px 0 8px;
	position: relative
}

.form .block label {
	display: inline-block;
	font-weight: 700;
	line-height: 28px;
	padding: 0 0 2px
}

.form .block .required-mark {
	background: 0 0;
	color: #ED3B3B;
	font-weight: 400
}

.form .block input[type=date],
.form .block input[type=email],
.form .block input[type=password],
.form .block input[type=phone],
.form .block input[type=text],
.form .block select,
.form .block textarea {
	background: #eaeaea;
	border: 2px solid #eaeaea;
	border-radius: 4px;
	box-sizing: border-box;
	font-size: 18px;
	padding: 7px 10px;
	width: 100%
}

.form .block input[type=date]:focus,
.form .block input[type=email]:focus,
.form .block input[type=password]:focus,
.form .block input[type=phone]:focus,
.form .block input[type=text]:focus,
.form .block select:focus,
.form .block textarea:focus {
	border-color: #333
}

.form .block input[type=checkbox],
.form .block input[type=radio] {
	appearance: none;
	-moz-appearance: none;
	-webkit-appearance: none;
	background: 0 0;
	border: none;
	box-shadow: none !important;
	display: block;
	font-size: 0;
	height: 24px;
	outline: 0 !important;
	overflow: hidden;
	position: absolute;
	top: 25px;
	margin: 0;
	width: 24px
}

.form .block input[type=checkbox]+label,
.form .block input[type=radio]+label {
	font-weight: 400;
	padding: 0 0 0 34px
}

.form .block input[type=checkbox]+label:before,
.form .block input[type=radio]+label:before {
	background: #eaeaea;
	border: 5px solid #eaeaea;
	border-radius: 4px;
	content: ' ';
	height: 14px;
	left: 0;
	position: absolute;
	top: 25px;
	width: 14px
}

.form .block input[type=radio]+label:before {
	border-radius: 14px
}

.form .block input[type=radio]:checked+label:before,
.form .block input[type=checkbox]:checked+label:before {
	background: #333;
	border-color: #eaeaea
}

.form .block select {
	appearance: none;
	-moz-appearance: none;
	-webkit-appearance: none;
	background: url(../img/arrow-8.svg) right center no-repeat #ebebeb;
	padding-right: 40px;
	text-overflow: ellipsis;
	width: auto
}

.form .block textarea {
	height: 200px
}

.form .block button {
	background: #333;
	border-radius: 4px;
	color: #FFF;
	font-size: 18px;
	font-weight: 700;
	margin: 7px 0 0;
	padding: 10px 15px
}

.form .block button.red {
	background: #ED3B3B
}

.form .block button.red:focus {
	background: #000
}

.form .block button:focus {
	background: #27b5de
}

.form .block .near {
	border-top: 1px solid #CCC;
	display: block;
	margin: 20px 0 0;
	padding: 19px 0 0;
	width: 100%
}

.form .block .forget {
	padding: 8px 0 0
}

.form .block .password-strength {
	align-items: center;
	display: flex;
	height: 20px;
	font-size: 15px;
	padding: 5px 0 0
}

.form .block .password-strength .bar {
	background: #eaeaea;
	border-radius: 8px;
	flex: 1;
	height: 8px;
	overflow: hidden;
	position: relative
}

.form .block .password-strength .bar:after {
	bottom: 0;
	left: 0;
	position: absolute;
	top: 0;
	transform: translateX(-100%);
	transition: transform .15s cubic-bezier(.2, .2, .2, 1), background-color .25s cubic-bezier(0, .2, .2, 1);
	width: 100%
}

.form .block .password-strength.strength-level-1 .bar:after {
	background: red;
	content: "";
	transform: translateX(-66%)
}

.form .block .password-strength.strength-level-2 .bar:after {
	background: Orange;
	content: "";
	transform: translateX(-33%)
}

.form .block .password-strength.strength-level-3 .bar:after {
	background: #9acd32;
	content: "";
	transform: translateX(0)
}

.form .block .password-strength .info {
	color: #CCC;
	margin-left: 8px
}

.form .block a {
	border-bottom: 2px solid #ace2f2;
	color: #0090ba
}

.tabelle {
	margin: 0 20px;
	position: relative
}

.tabelle table {
	width: 100%
}

.tabelle tr td,
.tabelle tr th {
	border-top: 1px solid #E5E5E5;
	box-sizing: border-box;
	color: #666;
	padding: 10px;
	text-align: left;
	vertical-align: middle
}

.tabelle tr.odd td,
.tabelle tr.odd th {
	background: #F8F8F8
}

.tabelle tr th {
	border-right: 1px solid #E5E5E5
}

.tabelle tr td {
	width: 40%
}

.tabelle tr td span {
	background: url(../img/good.svg) center center/12px 12px no-repeat;
	display: inline-block;
	height: 12px;
	margin: 0 2px 0 0;
	width: 12px
}

.tabelle tr td span.average {
	background-image: url(../img/average.svg)
}

.tabelle tr td span.bad {
	background-image: url(../img/bad.svg)
}

.tabelle tr.criteria,
.tabelle tr.overall {
	font-size: 18px;
	font-weight: 700
}

.tabelle tr.criteria th,
.tabelle tr.overall th {
	border-right: 1px solid #EBE794
}

.tabelle tr.criteria td,
.tabelle tr.criteria th {
	background: #FFFAB9;
	color: #333;
	line-height: 26px
}

.tabelle tr.overall td,
.tabelle tr.overall th {
	background: #FCEC80;
	color: #333
}

.tabelle tr+tr.criteria td,
.tabelle tr+tr.criteria th,
.tabelle tr.criteria+tr td,
.tabelle tr.criteria+tr th {
	border-top: none
}

.tabelle tr.criteria+tr.criteria td,
.tabelle tr.criteria+tr.criteria th,
.tabelle tr.odd+tr.criteria td,
.tabelle tr.odd+tr.criteria th {
	border-top: 1px solid #EBE794
}

.tabelle tr:first-of-type td,
.tabelle tr:first-of-type th {
	border-top: none
}

.tabelle .overlay {
	background: linear-gradient(to right, #3f4ba4 0, #19a2c3 100%);
	border-radius: 4px;
	color: #FFF;
	font-size: 18px;
	padding: 23px 0 30px;
	position: relative;
	text-align: center
}

.tabelle .overlay:before {
	background: url(../img/plus.svg) center center/60px 60px no-repeat;
	content: "";
	height: 60px;
	left: 0;
	margin: 0 auto;
	position: absolute;
	right: 0;
	top: -80px;
	width: 60px;
	z-index: 20
}

.tabelle .overlay:after {
	background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0, #fff 100%);
	content: "";
	height: 100px;
	left: 0;
	position: absolute;
	top: -100px;
	width: 100%;
	z-index: 10
}

.tabelle .overlay b {
	display: block;
	font-family: 'Work Sans', Roboto, Arial, Helvetica, sans-serif;
	font-size: 30px;
	font-weight: 700;
	padding: 0 20px 10px
}

.tabelle .overlay p {
	display: block;
	padding: 0 20px 13px
}

.tabelle .overlay a {
	border: 2px solid #FFF;
	border-radius: 4px;
	display: inline-block;
	margin: 10px 0 0;
	padding: 8px 0;
	width: 200px
}

.tabelle .overlay a.outline {
	color: #FFF
}

.tabelle .overlay a.filled {
	background: #FFF;
	color: #333
}

.tabelle .legend {
	color: #999;
	font-size: 12px;
	font-weight: 400;
	line-height: 16px;
	padding: 17px 0 6px
}

.static {
	padding: 84px 0 0
}

.static h1,
.static h2,
.static h3 {
	font-family: 'Work Sans', Roboto, Arial, Helvetica, sans-serif;
	font-size: 30px;
	font-weight: 700;
	padding: 24px 20px 20px
}

.static h2 {
	font-size: 22px;
	padding: 31px 20px 1px
}

.static h3 {
	font-size: 18px;
	padding: 31px 20px 1px
}

.static ol+h2,
.static ul+h2 {
	padding-top: 11px
}

.static sub,
.static sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline
}

.static sub {
	bottom: -.25em
}

.static sup {
	top: -.4em
}

.static p {
	font-size: 14px;
	line-height: 20px;
	padding: 10px 20px 0
}

.static strong {
	font-weight: 700
}

.static a {
	border-bottom: 2px solid #ace2f2;
	color: #0090ba
}

.static ol,
.static ul {
	padding: 0 20px 20px
}

.static ol ol,
.static ol ul,
.static ul ol,
.static ul ul {
	padding: 0
}

.static li {
	background: url(../img/dot.svg) top 18px left/6px 6px no-repeat;
	font-size: 14px;
	line-height: 20px;
	padding: 11px 0 0 20px
}

.static li p {
	padding: 0
}

.static ol li {
	background: 0 0;
	list-style-type: decimal;
	margin: 0 0 0 20px;
	padding: 11px 0 0 5px
}

.static .imprint:before {
	content: "SUPERTEST \A Schubertstraße 27 \A 71394 Kernen \A Deutschland";
	display: block;
	font-size: 14px;
	line-height: 20px;
	padding: 10px 20px 0;
	white-space: pre-wrap
}

.newsletter {
	background: #fc0;
	margin: 40px 0 0
}

.newsletter .pseudo-table {
	display: block
}

.newsletter .text {
	color: #333
}

.newsletter .text div {
	font-weight: 700;
	font-size: 28px;
	padding: 16px 20px 5px
}

.newsletter .text span {
	display: block;
	font-size: 14px;
	font-weight: 500;
	opacity: .65;
	padding: 0 20px
}

.newsletter .field {
	padding: 17px 20px 20px
}

.newsletter .field form {
	background: #FFF;
	border-radius: 4px;
	position: relative;
	padding: 0 100px 0 12px;
	overflow: hidden
}

.newsletter .field input {
	background: 0 0;
	height: 40px;
	line-height: 40px;
	padding: 0;
	width: 100%
}

.newsletter .field button {
	background: url(../img/arrow-3.svg) right 12px center/12px 12px no-repeat #333;
	border: none;
	color: #FFF;
	height: 40px;
	line-height: 40px;
	padding: 0 15px 0 0;
	position: absolute;
	right: 0;
	top: 0;
	width: 120px
}

footer {
	background: linear-gradient(to right, #3f4ba4 0, #19a2c3 100%);
	color: #FFF;
	padding: 0 0 5px
}

footer img {
	height: auto;
	margin: 20px 20px 5px;
	width: 200px
}

footer ul {
	padding: 17px 10px 23px
}

footer ul a {
	display: inline-block;
	padding: 6px 10px 10px
}

footer p {
	font-size: 12px;
	line-height: 18px;
	opacity: .65;
	padding: 0 20px 11px
}

footer p:before {
	content: "Wir sind ein unabhängiges Verbraucherportal. Unser Netzwerk aus Experten recherchiert, testet und vergleicht alle Produkte objektiv. Mit unserer Erfahrung und unserem breiten Netzwerk decken wir verschiedene Segmente optimal ab. Auf unserem Portal finden Sie keine von Herstellern finanzierten Inhalte. Wir finanzieren uns ausschließlich über Anzeigen und Affiliate-Links, bei denen von dem verlinkten Shop ggf. eine Vergütung erhalten. Für unsere Nutzer entstehen zu keinem Zeitpunkt Kosten. Alle Produkte wurden von uns selbst getestet. Wir verwenden Cookies, um ein optimales Webseitenerlebnis zu ermöglichen. Über unsere Datenschutzerklärung können Sie sich austragen (Opt-out).";
	display: block;
	padding: 0 0 11px
}

footer span {
	background: url(../img/leaf.svg) top left/16px 16px no-repeat;
	display: block;
	font-size: 12px;
	font-weight: 700;
	margin: 0 20px 10px;
	padding: 3px 3px 3px 21px
}

footer span a {
	border-bottom: 2px solid #ace2f2;
	color: #FFF
}

footer span sub {
	position: relative;
	vertical-align: baseline;
	font-size: 10px;
	top: .2em
}

@media screen and (min-width:65rem) {
	.skip-link:focus {
		outline: 0;
		top: 14px
	}

	.body {
		padding: 0
	}

	.bc {
		padding: 20px 60px 0
	}

	.bc li a:focus {
		color: #0090ba
	}

	.klima {
		padding: 0 0 5px 160px;
		position: relative;
		z-index: 10
	}

	.klima table {
		background: #FFF;
		display: block
	}

	.klima th {
		color: #ccc;
		float: left;
		font-size: 12px;
		padding: 9px 0 8px;
		width: 51px
	}

	.klima th:first-child {
		float: right
	}

	.klima th span {
		left: -2000px;
		overflow: hidden;
		position: absolute;
		text-indent: 300px;
		top: 0
	}

	.klima th:nth-of-type(2):before {
		content: "Jan"
	}

	.klima th:nth-of-type(3):before {
		content: "Feb"
	}

	.klima th:nth-of-type(4):before {
		content: "Mrz"
	}

	.klima th:nth-of-type(5):before {
		content: "Apr"
	}

	.klima th:nth-of-type(6):before {
		content: "Mai"
	}

	.klima th:nth-of-type(7):before {
		content: "Jun"
	}

	.klima th:nth-of-type(8):before {
		content: "Jul"
	}

	.klima th:nth-of-type(9):before {
		content: "Aug"
	}

	.klima th:nth-of-type(10):before {
		content: "Sept"
	}

	.klima th:nth-of-type(11):before {
		content: "Okt"
	}

	.klima th:nth-of-type(12):before {
		content: "Nov"
	}

	.klima th:nth-of-type(13):before {
		content: "Dez"
	}

	.klima td {
		border-bottom: 5px solid #FFF;
		border-left: 1px solid #FFF;
		border-top: 5px solid #FFF;
		float: left;
		height: 36px;
		line-height: 36px;
		text-align: center;
		width: 50px
	}

	.klima td:first-child {
		border-left: none;
		float: right;
		font-weight: 700;
		padding: 0 0 0 50px;
		text-align: left;
		width: 150px
	}

	.klima tr td:first-child {
		background: url(../img/sun.svg) left 20px center/20px 20px no-repeat
	}

	.klima tr.night td:first-child {
		background-image: url(../img/moon.svg);
		background-size: 16px 16px
	}

	.klima tr.rain td:first-child {
		background-image: url(../img/rain.svg)
	}

	.klima tr.sun td:first-child {
		background-image: url(../img/time.svg);
		background-size: 18px 18px
	}

	.klima tr.water td:first-child {
		background-image: url(../img/water.svg)
	}

	.hero-isolated {
		border-radius: 4px;
		height: 490px;
		margin: 40px 60px 0;
		overflow: hidden;
		position: relative;
		width: 990px
	}

	.hero-isolated .lft {
		display: table-cell;
		height: 490px;
		padding: 0;
		vertical-align: middle;
		width: 490px
	}

	.hero-isolated img {
		max-height: 410px;
		max-width: 410px
	}

	.hero-isolated .rgt {
		background: url(../img/ecke.svg) top right/100% 100% no-repeat;
		bottom: 0;
		height: 100%;
		padding: 0;
		position: absolute;
		right: 0;
		width: 640px
	}

	.hero-isolated .content {
		bottom: 40px;
		position: absolute;
		right: 40px;
		width: 400px
	}

	.hero-isolated .content .dz {
		background: #27b5de;
		border-radius: 4px;
		color: #FFF;
		float: left;
		font-size: 20px;
		font-weight: 700;
		letter-spacing: 1px;
		padding: 6px 10px 5px;
		text-transform: none
	}

	.hero-isolated .content .rating {
		background: url(../img/star-empty.svg) center left/19px 19px repeat-x;
		float: left;
		margin: 7px 0 0 15px;
		width: 95px
	}

	.hero-isolated .content .rating span {
		background: url(../img/star-full.svg) center left/19px 19px repeat-x;
		float: left;
		height: 19px
	}

	.hero-isolated .content b {
		color: #FFF;
		display: block;
		font-family: 'Work Sans', Roboto, Arial, Helvetica, sans-serif;
		font-size: 40px;
		font-size: 700;
		line-height: 40px;
		padding: 13px 0 11px
	}

	.hero-isolated .content p {
		color: #FFF;
		font-size: 16px;
		line-height: 25px;
		padding: 0
	}

	.hero-isolated .seal {
		background: url(../img/logo-5.svg) top 10px center/160px 32px no-repeat #232e75;
		border: 1px solid #232e75;
		box-sizing: border-box;
		display: block;
		float: right;
		margin: 5px 0 0 20px;
		padding: 50px 0 0;
		width: 190px
	}

	.hero-isolated .seal span {
		display: block;
		text-align: center
	}

	.hero-isolated .seal span:nth-child(1) {
		background: #FFF;
		font-size: 28px;
		font-weight: 700;
		padding: 16px 10px 15px
	}

	.hero-isolated .seal span:nth-child(2) {
		background: #FFF;
		padding: 0 10px
	}

	.hero-isolated .seal span:nth-child(3) {
		background: #FFF;
		color: #27B5DE;
		font-weight: 700;
		padding: 6px 10px 18px
	}

	.hero-isolated .seal span:nth-child(4) {
		background: #EAEAEA;
		color: #666;
		font-size: 11px;
		padding: 6px 10px 5px
	}

	.hero-img {
		border-radius: 4px;
		display: block;
		margin: 40px 60px 0;
		padding: 0;
		overflow: hidden;
		position: relative
	}

	.hero-img:after {
		background: url(../img/ecke-3.svg) right bottom no-repeat;
		bottom: -1px;
		content: "";
		height: 125px;
		position: absolute;
		right: -1px;
		width: 250px;
		z-index: 5
	}

	.hero-img .text {
		background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, .75) 100%);
		bottom: 0;
		left: 0;
		padding: 30px 50px 0;
		position: absolute;
		right: 0
	}

	.hero-img img {
		display: block;
		margin: 0 auto;
		width: 100%
	}

	.hero-img span {
		background: #27b5de;
		border-radius: 4px;
		color: #FFF;
		display: inline-block;
		font-size: 20px;
		letter-spacing: 1px;
		padding: 6px 10px 5px;
		text-transform: none
	}

	.hero-img b {
		color: #FFF;
		font-size: 40px;
		line-height: 40px;
		padding: 6px 0 8px
	}

	.hero-img p {
		box-sizing: border-box;
		color: #FFF;
		font-size: 16px;
		line-height: 24px;
		padding: 20px 0 34px;
		width: 690px
	}

	.mehr {
		margin: 0 40px;
		padding: 40px 0 0
	}

	.mehr .fake-table {
		display: table;
		padding: 0;
		width: 100%
	}

	.mehr a {
		border: none;
		display: table-cell;
		width: 50%
	}

	.mehr a div {
		display: block;
		padding: 0 20px
	}

	.mehr picture {
		box-sizing: border-box;
		display: table-cell;
		height: 276px;
		padding: 0 20px;
		text-align: center;
		vertical-align: middle;
		width: 515px
	}

	.mehr img {
		max-height: 280px
	}

	.mehr b {
		font-size: 18px;
		padding: 18px 0 2px;
		text-transform: none
	}

	.mehr em {
		font-size: 26px
	}

	.mehr p {
		color: #666;
		display: block;
		font-size: 16px;
		line-height: 25px;
		padding: 10px 0 0
	}

	.heading1 {
		font-size: 28px;
		padding: 64px 60px 16px
	}

	.heading2 {
		background: #EAEAEA;
		margin: 60px 60px 0;
		padding: 0;
		position: sticky;
		top: 0
	}

	.heading2 .text {
		background: url(../img/ecke-4.svg) right -1px center/auto 100% no-repeat, linear-gradient(90deg, #3f4ba4 0, #19a2c3 100%);
		display: table;
		color: #FFF
	}

	.heading2 .hl {
		display: table-cell;
		height: 50px;
		padding: 0 35px 0 20px;
		vertical-align: middle
	}

	.heading2 ul {
		display: table-cell;
		height: 50px;
		padding: 0 20px 0 0;
		vertical-align: middle
	}

	.heading2 ul a:hover {
		text-decoration: underline
	}

	.heading2 li {
		float: left;
		opacity: .8;
		padding: 0 20px 0 0
	}

	.heading2 .more {
		background: url(../img/arrow-1.svg) center center/20px 20px no-repeat;
		display: block;
		height: 50px;
		overflow: hidden;
		position: absolute;
		right: 0;
		text-indent: -500px;
		top: 0;
		width: 50px
	}

	.rubrik {
		margin: 0 40px
	}

	.rubrik .flexbox {
		background: inherit;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		padding: 0 1px 0 0
	}

	.rubrik a {
		xbackground: #f0f;
		border: none;
		display: block;
		margin: 22px 0 0;
		width: 343px
	}

	.rubrik a:nth-child(1),
	.rubrik a:nth-child(2),
	.rubrik a:nth-child(3) {
		margin: 0
	}

	.rubrik a:first-child {
		xbackground: green
	}

	.rubrik a:first-child .lft {
		xbackground: brown;
		box-sizing: border-box;
		display: table-cell;
		height: 207px;
		padding: 20px 20px 0;
		vertical-align: middle;
		width: 343px
	}

	.rubrik a:first-child .lft img {
		max-height: 187px
	}

	.rubrik a:first-child .rgt {
		padding: 0 20px
	}

	.rubrik a:first-child .rgt b {
		font-size: 18px;
		letter-spacing: 1px;
		padding: 18px 0 2px;
		text-transform: none
	}

	.rubrik a:first-child .rgt em {
		font-size: 26px
	}

	.rubrik a .lft {
		box-sizing: border-box;
		display: table-cell;
		height: 207px;
		padding: 20px 20px 0;
		vertical-align: middle;
		width: 343px
	}

	.rubrik a .rgt {
		display: block;
		padding: 0 20px
	}

	.rubrik a img {
		max-height: 187px
	}

	.rubrik a b {
		font-size: 18px;
		letter-spacing: 1px;
		padding: 18px 0 2px;
		text-transform: none
	}

	.rubrik a em {
		display: block;
		font-size: 26px
	}

	.rubrik a p {
		color: #666;
		display: block;
		font-size: 16px;
		line-height: 25px;
		padding: 10px 0 0
	}

	.pagination a,
	.pagination b {
		margin: 0 10px 10px 0
	}

	.pagination a:hover {
		background: #0090ba;
		color: #FFF
	}

	.pagination span {
		margin: 0 10px 10px 0;
		padding: 0 4px
	}

	.pagination .desktop-only {
		opacity: 1;
		position: relative;
		left: auto;
		overflow: visible
	}

	.article .text {
		padding: 10px 0 0
	}

	.article .dz {
		font-size: 20px;
		padding: 13px 160px 1px
	}

	.article h1 {
		font-size: 50px;
		padding: 7px 160px 2px
	}

	.article h2 {
		margin: 0 160px
	}

	.article h3 {
		font-size: 22px;
		margin: 0 160px
	}

	.article p {
		padding: 24px 160px 3px
	}

	.article p a {
		border-bottom: none;
		box-shadow: #ace2f2 0 -.1em inset;
		text-shadow: #fff -.07em -.07em, #fff -.07em .07em, #fff .07em -.07em, #fff .07em .07em, #fff 0 -.1em, #fff 0 .1em, #fff .1em 0, #fff -.1em 0
	}

	.article p a:hover {
		color: inherit;
		box-shadow: #27b5de 0 -.1em inset
	}

	.article .ad-in-text {
		xpadding: 24px 160px 3px 160px;
		padding: 0 160px
	}

	.article .ad-in-text ins {
		margin: 34px 0 13px
	}

	.article .vorspann p {
		font-size: 22px;
		line-height: 34px;
		padding: 22px 160px 0
	}

	.article ol,
	.article ul {
		padding: 20px 160px 0
	}

    .article ul ul {
		padding: 0 20px 20px 0
	}

	.article ol li,
	.article ul li {
		padding: 7px 0 0 5px
	}

	.article ol a,
	.article ul a {
		border-bottom: none;
		box-shadow: #ace2f2 0 -.1em inset;
		text-shadow: #fff -.07em -.07em, #fff -.07em .07em, #fff .07em -.07em, #fff .07em .07em, #fff 0 -.1em, #fff 0 .1em, #fff .1em 0, #fff -.1em 0
	}

	.article ol a:hover,
	.article ul a:hover {
		box-shadow: #27b5de 0 -.1em inset;
		color: inherit
	}

	.article ul li {
		padding: 7px 0 0 20px
	}

	.article .fazit {
		padding: 0 150px 0 160px
	}

	.article .fazit ul {
		float: left;
		margin: 0 10px 0 0;
		padding: 5px 20px 0 0;
		width: 370px
	}

	.article .fazit ul.contra {
		padding: 5px 20px 0 0
	}

	.article .fazit ul:before {
		background: url(../img/yes.svg) top 4px left/24px 24px no-repeat
	}

	.article .fazit.seal ul {
		width: 270px
	}

	.article .fazit.seal div {
		float: left;
		margin: 10px auto
	}

	.author {
		margin: 30px 160px 0
	}

	.author .name:after {
		content: " – Enthält Werbung"
	}

	.author i {
		display: block;
		float: right
	}

	.author i a {
		background: url(../img/facebook.svg) center center/22px 22px no-repeat;
		border-radius: 40px;
		float: left;
		height: 40px;
		overflow: hidden;
		text-indent: -500px;
		width: 40px
	}

	.author i a.twitter {
		background-image: url(../img/twitter.svg)
	}

	.author i a.whatsapp {
		background-image: url(../img/whatsapp.svg)
	}

	.author i a.mail {
		background-image: url(../img/mail.svg)
	}

	.aufmacher {
		xbackground: pink;
		margin: 0 40px
	}

	.aufmacher>a:after {
		height: 130px;
		right: 19px;
		width: 260px
	}

	.aufmacher.isolated {
		height: 350px;
		display: table-cell;
		vertical-align: middle;
		padding: 0 160px;
		width: 990px
	}

	.aufmacher.isolated img {
		max-height: 600px
	}

	.aufmacher.isolated .credit {
		right: 70px
	}

	.aufmacher span {
		background: url(../img/arrow-3.svg) right 23px center/12px 12px no-repeat #333;
		bottom: 20px;
		height: 52px;
		line-height: 52px;
		padding: 0 45px 0 23px
	}

	.toc {
		margin: 40px 160px 0
	}

	.toc .toggle {
		padding: 10px 20px 10px 0
	}

	.toc ol {
		padding: 0
	}

	.toc ol li {
		padding: 10px 0 10px 5px
	}

	.toc ol li a {
		color: #0090ba
	}

	.toc ol li a:hover {
		color: inherit
	}

	.inline-img {
		box-sizing: border-box;
		display: table;
		margin: 30px 60px 10px;
		padding: 0 20px;
		padding: 0;
		width: 990px
	}

	.inline-img dt {
		display: table-cell;
		padding: 0 40px 0 0;
		vertical-align: top
	}

	.inline-img dd {
		border-top: 1px solid #CCC;
		display: table-cell;
		padding: 10px 0 18px;
		vertical-align: top;
		width: 150px
	}

	.inline-img dd p {
		font-size: 16px;
		line-height: 24px;
		padding: 4px 0 13px;
		position: relative
	}

	.inline-img dd p a {
		border-bottom: none
	}

	.inline-img dd p a:hover {
		color: #666
	}

	.inline-img dd p:before {
		background: url(../img/arrow-4.svg) no-repeat;
		background-size: 12px 12px;
		content: "";
		height: 12px;
		left: -25px;
		position: absolute;
		top: 10px;
		width: 12px
	}

	.inline-img dd span {
		font-size: 12px;
		opacity: 1;
		position: relative;
		right: 0;
		transform: none;
		transform-origin: 0 0
	}

	.inline-img dd span:before {
		content: "Foto: "
	}

	.inline-img dd span.ds:before {
		content: "Foto: Daniel Smolcic"
	}

	.inline-img dd span.is:before {
		content: "Foto: Isabel Smolcic"
	}

	.inline-img.isolated {
		border-bottom: 1px solid #CCC;
		border-top: 1px solid #CCC
	}

	.inline-img.isolated dt {
		background: #FFF;
		border-top-right-radius: 0;
		border-bottom-right-radius: 0;
		padding: 20px 0;
		vertical-align: middle
	}

	.inline-img.isolated dd {
		background: #EAEAEA;
		border-bottom: 1px solid #fff;
		border-top: 1px solid #fff;
		padding: 11px 0 16px;
		width: 190px
	}

	.inline-img.isolated dd p {
		color: #666;
		padding: 0 20px 13px 40px
	}

	.inline-img.isolated dd p:before {
		left: 15px;
		top: 6px
	}

	.inline-img.isolated dd p a {
		box-shadow: #27b5de 0 -.1em inset;
		text-shadow: #eaeaea -.07em -.07em, #eaeaea -.07em .07em, #eaeaea .07em -.07em, #eaeaea .07em .07em, #eaeaea 0 -.1em, #eaeaea 0 .1em, #eaeaea .1em 0, #eaeaea -.1em 0
	}

	.inline-img.isolated dd p a:hover {
		color: #333
	}

	.inline-img.isolated dd span {
		color: #999;
		padding: 0 0 0 40px
	}

	.inline-img.isolated img {
		margin: 0 auto;
		max-height: 300px
	}

	#gallery .back {
		background: linear-gradient(to right, #3f4ba4 0, #19a2c3 100%);
		font-size: 16px
	}

	#gallery .back a:first-of-type {
		background: url(../img/arrow-7.svg) 20px 22px no-repeat;
		background-size: 8px 8px;
		color: #FFF;
		margin: 0 0 0 40px
	}

	#gallery .back a:first-of-type:hover {
		text-decoration: underline
	}

	#gallery .back a:last-of-type {
		right: 60px;
		top: 16px;
		width: 173px
	}

	#gallery .dz {
		font-size: 20px;
		padding: 37px 60px 0
	}

	#gallery .h1 {
		font-size: 40px;
		padding: 10px 60px 34px
	}

	#gallery dl {
		background: #FFF;
		border-bottom: none;
		border-radius: 4px;
		box-sizing: border-box;
		display: table;
		margin: 0 60px 40px;
		overflow: hidden;
		width: 990px
	}

	#gallery dl dt {
		display: table-cell;
		height: 493px;
		padding: 0;
		vertical-align: top;
		width: 800px
	}

	#gallery dl dt picture {
		width: 800px
	}

	#gallery dl dd {
		box-sizing: border-box;
		display: table-cell;
		padding: 15px 20px 0 40px;
		vertical-align: top
	}

	#gallery dl dd.isolated {
		background: #EAEAEA
	}

	#gallery dl dd.isolated p a {
		border: none;
		box-shadow: #7fd3ec 0 -.1em inset;
		color: #0090ba;
		text-shadow: #eaeaea -.07em -.07em, #eaeaea -.07em .07em, #eaeaea .07em -.07em, #eaeaea .07em .07em, #eaeaea 0 -.1em, #eaeaea 0 .1em, #eaeaea .1em 0, #eaeaea -.1em 0
	}

	#gallery dl dd.isolated p a:hover {
		box-shadow: #27b5de 0 -.1em inset;
		color: #333
	}

	#gallery dl dd span {
		color: #333;
		font-size: 14px;
		padding: 0 0 11px;
		position: relative
	}

	#gallery dl dd span:before {
		background: url(../img/arrow-4.svg) no-repeat;
		background-size: 12px 12px;
		content: "";
		height: 12px;
		left: -25px;
		position: absolute;
		top: 30px;
		width: 12px
	}

	#gallery dl dd p {
		color: #666;
		font-size: 14px;
		line-height: 22px
	}

	#gallery dl dd p a {
		border: none;
		box-shadow: #ace2f2 0 -.1em inset;
		color: #0090ba;
		text-shadow: #fff -.07em -.07em, #fff -.07em .07em, #fff .07em -.07em, #fff .07em .07em, #fff 0 -.1em, #fff 0 .1em, #fff .1em 0, #fff -.1em 0
	}

	#gallery dl dd p a:hover {
		box-shadow: #27b5de 0 -.1em inset;
		color: inherit
	}

	#gallery dl dd div {
		color: #CCC;
		line-height: 1;
		padding: 12px 0 18px
	}

	#gallery .close {
		padding: 20px 20px 60px
	}

	#gallery .close a:hover {
		background-color: #999
	}

	.product-box {
		background: linear-gradient(to bottom, #3f4ba4 0, #19a2c3 100%);
		box-shadow: 0 0 20px 0 rgba(0, 0, 0, .25);
		margin: 30px 60px 10px;
		padding: 0 0 0 10px
	}

	.product-box .img {
		display: table-cell;
		padding: 40px 20px 40px 40px;
		vertical-align: middle
	}

	.product-box .img img {
		max-height: 400px;
		max-width: 190px
	}

	.product-box .cell {
		display: table-cell;
		padding: 19px 0;
		vertical-align: middle
	}

	.product-box .price {
		display: table-cell;
		vertical-align: middle;
		width: 240px
	}

	.product-box .price a:hover {
		background: #333
	}

	.datenblatt {
		padding: 13px 160px 7px
	}

	.datenblatt a {
		border: none;
		box-shadow: #ace2f2 0 -.1em inset;
		text-shadow: #fff -.07em -.07em, #fff -.07em .07em, #fff .07em -.07em, #fff .07em .07em, #fff 0 -.1em, #fff 0 .1em, #fff .1em 0, #fff -.1em 0
	}

	.datenblatt a:hover {
		color: inherit;
		box-shadow: #27b5de 0 -.1em inset
	}

	.datenblatt tr:nth-child(odd) a {
		border: none;
		box-shadow: #7fd3ec 0 -.1em inset;
		text-shadow: #eaeaea -.07em -.07em, #eaeaea -.07em .07em, #eaeaea .07em -.07em, #eaeaea .07em .07em, #eaeaea 0 -.1em, #eaeaea 0 .1em, #eaeaea .1em 0, #eaeaea -.1em 0
	}

	.datenblatt tr:nth-child(odd) a:hover {
		box-shadow: #27b5de 0 -.1em inset
	}

	.accordion {
		padding: 17px 160px 7px
	}

	.accordion dt {
		margin: 13px 0 0
	}

	.accordion dd {
		padding: 10px 0 0
	}

	.accordion p {
		padding: 4px 0 23px
	}

	.form p {
		padding: 25px 140px 0
	}

	.form .error,
	.form .notice,
	.form .warning {
		padding: 32px 140px 8px
	}

	.form .error p a,
	.form .notice p a,
	.form .warning p a {
		border: none;
		box-shadow: #fac7c7 0 -.1em inset;
		color: inherit
	}

	.form .error p a:hover,
	.form .notice p a:hover,
	.form .warning p a:hover {
		box-shadow: #b21010 0 -.1em inset;
		color: #b21010
	}

	.form .block {
		padding: 25px 140px 8px
	}

	.form .block label a:hover {
		color: #27b5de
	}

	.form .block input[type=checkbox]+label:before,
	.form .block input[type=radio]+label:before {
		left: 140px
	}

	.form .block button {
		float: left
	}

	.form .block .near {
		border: none;
		float: left;
		margin: 19px 0 0 40px;
		padding: 0;
		width: auto
	}

	.form .block .forget a:hover,
	.form .block .near a:hover {
		color: #27b5de
	}

	.form .block a {
		border: none;
		box-shadow: #ace2f2 0 -.1em inset;
		text-shadow: #fff -.07em -.07em, #fff -.07em .07em, #fff .07em -.07em, #fff .07em .07em, #fff 0 -.1em, #fff 0 .1em, #fff .1em 0, #fff -.1em 0
	}

	.form .block a:hover {
		box-shadow: #27b5de 0 -.1em inset;
		color: #333 !important
	}

	.static {
		padding: 0
	}

	.static h1 {
		font-size: 40px;
		padding: 33px 160px 21px
	}

	.static h2 {
		font-size: 26px;
		padding: 31px 160px 1px
	}

	.static h3 {
		font-size: 22px;
		padding: 31px 160px 1px
	}

	.static p {
		padding: 10px 160px 0
	}

	.static a {
		border: none;
		box-shadow: #ace2f2 0 -.1em inset;
		text-shadow: #fff -.07em -.07em, #fff -.07em .07em, #fff .07em -.07em, #fff .07em .07em, #fff 0 -.1em, #fff 0 .1em, #fff .1em 0, #fff -.1em 0
	}

	.static a:hover {
		box-shadow: #27b5de 0 -.1em inset;
		color: inherit
	}

	.static ol,
	.static ul {
		padding: 0 160px 20px
	}

	.static .imprint:before {
		padding: 10px 160px 0
	}

	.newsletter {
		padding: 2px 0
	}

	.newsletter .pseudo-table {
		display: table;
		width: 100%
	}

	.newsletter .text {
		display: table-cell;
		vertical-align: middle;
		width: auto
	}

	.newsletter .text div {
		font-size: 34px;
		padding: 0 20px 3px 60px
	}

	.newsletter .text span {
		padding: 0 20px 0 60px
	}

	.newsletter .field {
		display: table-cell;
		padding: 20px 60px 20px 20px;
		vertical-align: middle;
		width: 490px
	}

	footer {
		padding: 0 0 4px;
		position: relative
	}

	footer img {
		margin: 20px 20px 17px 60px;
		width: 240px
	}

	footer ul {
		float: right;
		padding: 25px 50px 0 0
	}

	footer ul li {
		float: left
	}

	footer ul a {
		margin: 0 10px;
		padding: 0
	}

	footer ul a:hover {
		border-bottom: 2px solid #27b5de
	}

	footer p {
		padding: 0 60px 11px
	}

	footer span {
		bottom: 0;
		position: absolute;
		right: 40px
	}
}

@media screen and (max-width:65rem) {
	.vergleich {
		padding: 0 20px
	}

	.vergleich .cell {
		border: 1px solid #CCC;
		border-top: none;
		box-sizing: border-box;
		display: table;
		font-size: 14px;
		line-height: 18px;
		text-align: center;
		width: 100%
	}

	.vergleich .cell img {
		box-sizing: border-box;
		display: block;
		margin: 0 auto;
		max-height: 200px;
		max-width: 100%;
		padding: 20px
	}

	.vergleich .cell div {
		background: #eaeaea;
		display: table-cell;
		line-height: 18px;
		padding: 5px 10px;
		vertical-align: middle
	}

	.vergleich .cell div.no,
	.vergleich .cell div.yes {
		background: url(../img/yes.svg) center center/18px 18px no-repeat #eaeaea;
		overflow: hidden;
		padding: 7px 10px;
		text-indent: -500px
	}

	.vergleich .cell div.no {
		background-image: url(../img/no.svg)
	}

	.vergleich .cell div a {
		border-bottom: 1px solid #27b5de
	}

	.vergleich .cell.head {
		border-top: 1px solid #CCC;
		margin: 30px 0 0
	}

	.vergleich .cell.head a {
		text-decoration: none
	}

	.vergleich .cell.name {
		font-size: 20px;
		font-weight: 700
	}

	.vergleich .cell.name a {
		border: none
	}

	.vergleich .cell.buy {
		border-bottom: none
	}

	.vergleich .cell.buy b {
		background: url(../img/amazon.svg) top 10px center/80px 25px no-repeat;
		color: #ed3b3b;
		display: block;
		padding: 40px 0 3px
	}

	.vergleich .cell.buy b.ebay {
		background: url(../img/ebay.svg) top 10px center/88px 35px no-repeat;
		padding: 40px 0 10px
	}

	.vergleich .cell.buy span {
		color: #999;
		display: block;
		font-size: 12px;
		padding: 0 0 7px;
		text-decoration: line-through
	}

	.vergleich .cell.cta a {
		background: #ed3b3b;
		border: none;
		border-radius: 4px;
		color: #FFF;
		display: inline-block;
		font-weight: 700;
		height: 40px;
		line-height: 40px;
		margin: 1px 0 9px;
		padding: 0 20px
	}

	.vergleich .cell.cta a:after {
		content: " \00BB"
	}

	.vergleich .cell.cta strong {
		color: #333;
		display: block;
		font-size: 13px;
		padding: 0 0 8px
	}

	.vergleich .cell.foot {
		padding: 5px
	}

	.vergleich .cell.foot a {
		background: #ed3b3b;
		border: none;
		border-radius: 4px;
		color: #FFF;
		display: inline-block;
		font-weight: 700;
		padding: 14px 0 12px;
		width: 140px
	}

	.vergleich .cell.foot a:after {
		content: " \00bb"
	}

	.vergleich .cell.first {
		border-left: 2px solid #27b5de;
		border-right: 2px solid #27b5de
	}

	.vergleich .cell.first.head {
		border-top: 2px solid #27b5de
	}

	.vergleich .cell.first.foot {
		border-bottom: 2px solid #27b5de
	}

	.vergleich .cell:before {
		border-right: 1px solid #CCC;
		box-sizing: border-box;
		content: attr(data-label);
		display: table-cell;
		font-weight: 700;
		padding: 7px 10px;
		text-align: left;
		width: 50%
	}

	.vergleich .cell.buy:before,
	.vergleich .cell.cta:before,
	.vergleich .cell.foot:before,
	.vergleich .cell.head:before,
	.vergleich .cell.name:before {
		display: none
	}

	.vergleich .cell.buy div,
	.vergleich .cell.cta div,
	.vergleich .cell.foot div,
	.vergleich .cell.head div,
	.vergleich .cell.name div {
		background: #FFF
	}

	.vergleich .cell.buy,
	.vergleich .cell.foot {
		position: relative
	}

	.vergleich .cell.buy:after,
	.vergleich .cell.foot:after {
		color: #CCC;
		content: "Anzeige";
		font-size: 9px;
		right: 5px;
		position: absolute;
		top: 0
	}
}

@media screen and (min-width:65rem) {
	.vergleich {
		margin: 30px 60px 10px 10px;
		position: relative
	}

	.vergleich:after {
		color: #CCC;
		content: "Anzeige";
		font-size: 10px;
		left: 0;
		position: absolute;
		top: 0
	}

	.vergleich .table {
		display: flex;
		flex-wrap: wrap;
		width: 1040px
	}

	.vergleich .cell {
		align-items: center;
		border-left: 1px solid #D0D0D0;
		border-right: 1px solid #D0D0D0;
		box-sizing: border-box;
		display: flex;
		flex-grow: 1;
		margin: 0 0 0 10px;
		text-align: center;
		width: 170px
	}

	.vergleich .cell img {
		display: block;
		margin: 0 auto;
		max-height: 170px;
		max-width: 170px
	}

	.vergleich .cell div {
		box-sizing: border-box;
		font-size: 14px;
		line-height: 20px;
		padding: 10px;
		width: 170px
	}

	.vergleich .cell div.no,
	.vergleich .cell div.yes {
		background: url(../img/yes.svg) center center/18px 18px no-repeat;
		overflow: hidden;
		text-indent: -500px
	}

	.vergleich .cell div.no {
		background-image: url(../img/no.svg)
	}

	.vergleich .cell div a {
		border-bottom: 1px solid #27b5de
	}

	.vergleich .cell div a:hover {
		color: #27b5de
	}

	.vergleich .cell.head {
		border: none
	}

	.vergleich .cell.head a,
	.vergleich .cell.head span {
		align-items: center;
		border: none;
		display: flex;
		height: 100%;
		padding: 0 0 20px;
		text-align: center;
		width: 170px
	}

	.vergleich .cell.head picture {
		display: block;
		text-align: center;
		width: 170px
	}

	.vergleich .cell.name {
		background: #666;
		border: none;
		border-top-left-radius: 4px;
		border-top-right-radius: 4px;
		font-weight: 700;
		min-height: 62px;
		position: sticky;
		top: 0
	}

	.vergleich .cell.name a {
		border: none;
		color: #FFF;
		display: block;
		font-size: 16px;
		line-height: 20px
	}

	.vergleich .cell.name a:hover {
		color: #FFF
	}

	.vergleich .cell.buy {
		align-items: initial;
		vertical-align: top
	}

	.vergleich .cell.buy b {
		background: url(../img/amazon.svg) top 10px center/80px 25px no-repeat;
		color: #ed3b3b;
		display: block;
		padding: 40px 0 3px
	}

	.vergleich .cell.buy b.ebay {
		background: url(../img/ebay.svg) top 10px center/88px 35px no-repeat
	}

	.vergleich .cell.buy span {
		color: #999;
		display: block;
		font-size: 12px;
		padding: 0 0 7px;
		text-decoration: line-through
	}

	.vergleich .cell.cta {
		align-items: initial;
		vertical-align: top
	}

	.vergleich .cell.cta div {
		padding-top: 0
	}

	.vergleich .cell.cta a {
		background: #ed3b3b;
		border: none;
		border-radius: 4px;
		color: #FFF;
		display: inline-block;
		font-weight: 700;
		height: 40px;
		line-height: 40px;
		margin: 1px 0 9px;
		padding: 0 20px
	}

	.vergleich .cell.cta a:after {
		content: " \00BB"
	}

	.vergleich .cell.cta a:hover {
		background: #333;
		color: #FFF
	}

	.vergleich .cell.cta strong {
		color: #333;
		display: block;
		font-size: 13px;
		padding: 0 0 8px
	}

	.vergleich .cell.even {
		background: #F2F2F2
	}

	.vergleich .cell.foot {
		background: #666;
		border: none;
		border-bottom-left-radius: 4px;
		border-bottom-right-radius: 4px;
		padding: 5px
	}

	.vergleich .cell.foot a {
		background: #333;
		border: none;
		border-radius: 4px;
		color: #FFF;
		display: inline-block;
		font-weight: 700;
		padding: 14px 0 12px;
		width: 140px
	}

	.vergleich .cell.foot a:after {
		content: " \00bb"
	}

	.vergleich .cell.foot a:hover {
		background: #000;
		color: #FFF
	}

	.vergleich .first {
		border-left: 2px solid #ed3b3b;
		border-right: 2px solid #ed3b3b;
		margin: 0 0 0 150px;
		position: relative
	}

	.vergleich .first.name {
		background: #ed3b3b;
		position: sticky;
		top: 0;
		z-index: 10
	}

	.vergleich .first.name:before {
		left: -148px;
		padding: 15px 0
	}

	.vergleich .first.cta a:hover {
		background: #333
	}

	.vergleich .first.foot {
		background: #ed3b3b
	}

	.vergleich .first.foot a {
		background: #FFF;
		color: #333
	}

	.vergleich .first.foot a:hover {
		background: #333
	}

	.vergleich .first:before {
		background: #FFF;
		content: attr(data-label);
		font-weight: 700;
		display: block;
		display: flex;
		left: -150px;
		font-size: 14px;
		line-height: 16px;
		position: absolute;
		text-align: left;
		width: 140px
	}

	.tabelle {
		margin: 0 160px;
		padding: 13px 0 0
	}

	.tabelle tr td,
	.tabelle tr th {
		padding: 10px 20px
	}

	.tabelle tr th div {
		position: relative
	}

	.tabelle tr th div:after {
		content: attr(data-weight);
		float: right;
		font-weight: 400
	}

	.tabelle tr td {
		width: 25%
	}

	.tabelle tr.overall th {
		background: url(../img/logo-6.svg) 20px 11px no-repeat #fcec80;
		background-size: 123px 20px;
		padding-left: 155px
	}

	.tabelle .overlay {
		padding: 33px 0 40px
	}

	.tabelle .overlay p {
		padding: 0 20px 33px
	}

	.tabelle .overlay a {
		margin: 0 10px
	}

	.tabelle .overlay a.outline:hover {
		background: #0a145a;
		border-color: #0a145a;
		color: #FFF
	}

	.tabelle .overlay a.filled:hover {
		background: #9acd32;
		border-color: #9acd32;
		color: #FFF
	}
}

.cookie-container {
	opacity: 1;
	border-style: solid;
	border-width: 0;
	box-sizing: border-box;
	display: flex;
	flex-wrap: nowrap;
	font-family: inherit;
	font-size: 16px;
	line-height: 1.5em;
	-webkit-transition: opacity 1s ease;
	-moz-transition: opacity 1s ease;
	-ms-transition: opacity 1s ease;
	-o-transition: opacity 1s ease;
	overflow: hidden;
	position: fixed;
	transition: opacity 1s ease;
	z-index: 9999
}

@media print {
	.cookie-container {
		display: none
	}
}

.cookie-invisible {
	opacity: 0
}

.cookie-border-thin {
	border-width: 1px
}

.cookie-border-normal {
	border-width: 3px
}

.cookie-border-thick {
	border-width: 5px
}

.cookie-float {
	flex-direction: column;
	max-width: 22em;
	padding: 1.5em
}

.cookie-float.cookie-padding-small {
	padding: 1em
}

.cookie-float.cookie-padding-large {
	padding: 2em
}

.cookie-banner {
	flex-direction: row;
	margin: 1em;
	padding: 1em
}

.cookie-banner.cookie-padding-small {
	padding: .5em .5em .5em 1em
}

.cookie-banner.cookie-padding-large {
	padding: 1.5em
}

.cookie-banner.cookie-margin-none {
	margin: 0
}

.cookie-banner.cookie-margin-small {
	margin: .5em
}

.cookie-banner.cookie-margin-large {
	margin: 1.5em
}

.cookie-padding-none {
	padding: 0
}

.cookie-padding-none.cookie-float .cookie-message {
	margin: 1em
}

.cookie-padding-none.cookie-banner .cookie-message {
	margin: .8em 1em
}

.cookie-padding-none.cookie-banner .cookie-btn {
	height: 100%;
	padding: .9em 1.5em
}

.cookie-btn,
.cookie-privacy {
	cursor: pointer
}

.cookie-privacy {
	display: inline-block;
	opacity: .85;
	text-decoration: underline
}

.cookie-privacy:hover {
	opacity: 1
}

.cookie-privacy:active,
.cookie-privacy:visited {
	color: initial
}

.cookie-btn {
	display: block;
	font-size: 16px;
	font-weight: 700;
	padding: 10px 12px;
	text-align: center;
	white-space: nowrap;
	-webkit-transition: background-color .2s ease;
	-moz-transition: background-color .2s ease;
	-ms-transition: background-color .2s ease;
	-o-transition: background-color .2s ease
}

.cookie-btn:hover {
	text-decoration: none
}

.cookie-top {
	top: 1em
}

.cookie-top.cookie-margin-none {
	top: 0
}

.cookie-top.cookie-margin-small {
	top: .5em
}

.cookie-top.cookie-margin-large {
	top: 1.5em
}

.cookie-left {
	left: 1em
}

.cookie-left.cookie-margin-none {
	left: 0
}

.cookie-left.cookie-margin-small {
	left: .5em
}

.cookie-left.cookie-margin-large {
	left: 1.5em
}

.cookie-right {
	right: 1em
}

.cookie-right.cookie-margin-none {
	right: 0
}

.cookie-right.cookie-margin-small {
	right: .5em
}

.cookie-right.cookie-margin-large {
	right: 1.5em
}

.cookie-bottom {
	bottom: 1em
}

.cookie-bottom.cookie-margin-none {
	bottom: 0
}

.cookie-bottom.cookie-margin-small {
	bottom: .5em
}

.cookie-bottom.cookie-margin-large {
	bottom: 1.5em
}

.cookie-float .cookie-message {
	display: block;
	margin-bottom: 1em
}

.cookie-banner {
	align-items: center
}

.cookie-banner.cookie-top {
	left: 0;
	right: 0;
	top: 0
}

.cookie-banner.cookie-bottom {
	left: 0;
	right: 0;
	bottom: 0
}

.cookie-banner .cookie-message {
	display: block;
	flex: 1 1 auto;
	margin-right: 1em;
	max-width: 100%
}

.cookie-float .cookie-compliance {
	flex: 1 0 auto
}

.cookie-corners-small {
	border-radius: 5px
}

.cookie-corners-normal {
	border-radius: 7px
}

.cookie-corners-large {
	border-radius: 10px
}

.cookie-corners-round .cookie-btn {
	border-radius: 4px
}

.cookie-corners-round.cookie-margin-none,
.cookie-corners-round.cookie-padding-none .cookie-btn {
	border-radius: 0
}

@media screen and (max-width:414px) and (orientation:portrait),
screen and (max-width:736px) and (orientation:landscape) {
	.cookie-top {
		top: 0 !important
	}

	.cookie-bottom {
		bottom: 0 !important
	}

	.cookie-banner,
	.cookie-float,
	.cookie-left,
	.cookie-right {
		left: 0 !important;
		margin: 0 !important;
		right: 0 !important
	}

	.cookie-banner {
		align-items: unset;
		flex-direction: column
	}

	.cookie-corners-round {
		border-radius: 0 !important
	}

	.cookie-float {
		max-width: none
	}

	.cookie-message {
		margin-bottom: 1em
	}

	.cookie-banner.cookie-padding-small {
		padding: .5em
	}

	.cookie-padding-small .cookie-message {
		margin-bottom: .5em
	}
}