/* ICONFONT */

@font-face {
	font-family: 'Iconfont';
	src:url('./iconfont.eot');
	src:url('./iconfont.eot?#iefix') format('embedded-opentype'), url('./iconfont.woff') format('woff'),	url('./iconfont.ttf') format('truetype'), url('../fonts/iconfont.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}

accordion

html, body, div, p, h1, h2, h3, h4, h5, h6, span, a, table, td, tr, ol, ul, form, fieldset {
	margin:0;
	padding:0;
	list-style:none;
	border:none;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: auto;
}
html {
	box-sizing: border-box;
	overflow-y: scroll;
	overflow-x: hidden; /* wichtig fuer full-width */
}
*, *:before, *:after {
	box-sizing: inherit;
}
body {
	font-family: Roboto, Sans-Serif;
	font-size: 16px;
	line-height:1.5;
	font-weight:300;
	height:100%;
	color:#222;
	/* Deaktivieren der autom. Schriftanpassung beim iPhone !!! */
	-webkit-text-size-adjust:none;
}
input,submit,textarea,button {
	font-family:Roboto, sans-serif;
	-moz-appearance: none;
	-webkit-appearance: none;
}
input, textarea {vertical-align: middle;} /* wichtig für Chrome wg. ABstand zum Submit-Button*/

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

b {font-weight: 900}

.clr 	{clear:both;}
div.clr {height:0;overflow:hidden;line-height:0;}

.hidden {display:none;}

a {
	color:#0066aa;
	text-decoration:none;
	font-weight:300;
}
b, strong	{font-weight:700;}
i 			{font-weight:400;font-style:italic;}

b a, strong a	{font-weight:700;}


.main a {font-weight:700;}
.main a:hover {text-decoration:underline;}
.main p {margin:0 0 15px 0;}


img, a img, 
p a img 	{border:none;}
img { -ms-interpolation-mode: bicubic; }

input[placeholder] {
	color: #b3b3b3;opacity: 1;
	}
::-webkit-input-placeholder	{color: #b3b3b3;opacity: 1;}
:-moz-placeholder 			{color: #b3b3b3;opacity: 1;}
::-moz-placeholder 			{color: #b3b3b3;opacity: 1;}
:-ms-input-placeholder 		{color: #b3b3b3 !important;opacity: 1}


/* 1200 PX Breite */
.header,
.footer {
	width: 100vw;
	position: relative;
	left: 50%;
	margin-left: -50vw;
	padding-left:calc((100vw - 1200px)/2);
	padding-right:calc((100vw - 1200px)/2);
}

/* 800 PX Breite */
.main {
	width: 100vw;
	position: relative;
	left: 50%;
	margin-left: -50vw;
	padding-left:calc((100vw - 800px)/2);
	padding-right:calc((100vw - 800px)/2);
}

.header {
	background: #f0f0f0;
	/*width: 100%;*/
	height:115px;
	padding-top: 15px;
	border-bottom:1.5em solid #06a;
}
.header img { 
	width:230px;
	max-width:calc(100vw - 20px);
	height:auto;
	margin:0 0 0 20px;
}


.main {
	padding-top:80px;
	padding-bottom:40px;
}

.footer {
	display: flex;
	justify-content: space-between;
	/*width: 100%;*/
	border-top: 1px solid #eee;
	padding-top: 15px;
	padding-bottom: 15px;
	font-size: 16px;
	font-weight: 300;
}
.footer > :first-child	{margin-left: 10px; color:#777;}
.footer > :last-child 	{margin-right: 10px}

.footer li {
	list-style: none;
	display: inline-block;
}
.footer p {margin: auto auto;}

nav a {
	margin: auto 10px;
	text-decoration: none;
	color: #000;
	border-bottom: 2px solid transparent;
}
nav a:hover {border-bottom-color: #0066aa;}

hr {
	clear:both;
	height: 1px;
	color: #e1e1e5;
	background: #e1e1e5;
	font-size: 0;
	border: 0;
	margin: 40px 0 40px 0;
	/*float:left;*/
}

p.text-klein {font-size: 14px;}
	
h1 {
	font-size: 40px;
	line-height:1.2;
	font-weight:300;
	margin:0 0 50px 0;
}

h3 {
	clear: both;
	font-size: 24px;
	line-height:1.4;
	font-weight:400;
	margin:0 0 20px 0;
}

/* Accordion */
h2.accordion-header {
	display:block;
	font-size:18px;
	line-height:1.33;
	font-weight:400;
	min-height:70px;
	height:auto;
	margin:0 0 20px 0;
	padding:10px 75px 10px 75px;
	display: flex;
	align-items: center;
	cursor:pointer;
	position:relative;
	transition:0.15s;
}

#acc1 .accordion-header {background:#e4f1f9;}
#acc2 .accordion-header {background:#d7eaf6;}
#acc3 .accordion-header {background:#cae2f2;}
#acc4 .accordion-header {background:#c5e3f7;}

h2.accordion-header:before {
	position:absolute;
	font-size:36px;
	line-height:1;
	font-weight:700;
	left:27px;
	color:#88b0d2;
}
#acc1 h2.accordion-header:before {content:'1';}
#acc2 h2.accordion-header:before {content:'2';}
#acc3 h2.accordion-header:before {content:'3';}
#acc4 h2.accordion-header:before {content:'4';}
	
h2.accordion-header:after {
	position:absolute;
	right:27px;
	color:#72abd1;
	/* Infos aus Datei _iconfont.scss !! */
	content: '\e92b';
	font-family:'Iconfont';
	speak: none;
	font-size:30px;
	font-weight:1;
}

.open h2.accordion-header {
	background:#0066aa !important;
	color:#fff;
}
.open h2.accordion-header:after {content: '\e929';}

.accordion-content {
	float:left;
	display:none;
	width: 100%;
	padding:0px 75px 60px 75px;
	margin-top:15px !important;
}

a.mail {margin:0 0 0 33px;}
a.mail:before {
	content: '\e920';
	font-family:'Iconfont';
	speak: none;
	font-size:25px;
	font-weight:1;
	position:absolute;
	margin:-6px 0 0 -33px;
}


/*-------- KONTAKT / TIPP -------- */

p.kontakt {
	line-height:44px;
}
img.img-kontakt {
	float:left;
	margin:0 35px 0 0;
}

.img-copyright {
	clear:left;
	float:left;
	padding:3px 0 0 0;
	color:#999999;
	font-size:12px;
}


table.tb-kontakt {
	font-size: 18px;
	font-weight:700;
	margin:0 0 15px 0;
}

.tb-kontakt td:first-child {
	padding:0 30px 0 0;
}

.icon-tipp {
	height:62px;
	width:62px;
	background:#0066aa;
	border-radius:31px;
	display: flex;
	align-items: center;
	justify-content: center;
	line-height:1;
	font-size:57px;
	font-weight:700;
	color:#fff;
	float:left;
	margin:5px 20px 0 0;
}

img.app-grafik {
	float:right;
	margin:-25px 10px 20px 10px;
}

/*-------- ACCORDION 1 -------- */

input[type=email].form-control,
input[type=password].form-control{
	width:calc(50% - 75px);
	float:left;
	padding:10px 10px 10px 10px;
	margin:0 15px 20px 0;
	border:1px solid #cacaca;
	font-size:18px;
	font-weight:400;
	color:#333;
	border-radius:8px;
	background:#fff;
}
input[type=text].form-control:focus {
	border:1px solid #0066aa;
	outline: none; /* Chrome */
}
button[type=submit].bt-submit {
	width:120px;
	float:left;
	margin: 0 0 20px 0;
	padding: 12px 10px 13px 10px;
	font-weight: 700;
	font-size: 18px;
	line-height: 1;
	color: #fff;
	border:none;
	border-radius: 8px;
	background: #0066aa;
	text-align:center;
	cursor:pointer;
}

h3.abonnent:before {
	height:49px;
	width:49px;
	background:#0066aa;
	border-radius:25px;
	display: flex;
	align-items: center;
	justify-content: center;
	color:#fff;
	float:left;
	margin:-8px 0 0 -70px;
	position:relative;
	font-family:'Iconfont';
	speak: none;
	font-size:27px;
	font-weight:1;
}
h3.abonnent.zeitschrift:before {
	content: '\e964';
}
h3.abonnent.loseblatt:before {
	content: '\e902';
}

/*-------- ACCORDION 2 -------- */

.partner {
	width:100%;
	display: flex;
	flex-flow: row wrap;
	/*justify-content: flex-start;*/
	justify-content: center;
	padding: 30px 0 0 0;
	margin: 0;
	/*row-gap: 15px;
	column-gap: 35px;*/
}
.partner a {
	margin:0 15px 15px 15px;
}
	

.partner img {
	width:100px;
	height:auto;
}

/*-------- ACCORDION 3 -------- */

img.module-grafik {
	float:right;
	margin:-5px 0px 35px 20px;
}

button {
	display:block;
	margin: 40px auto 40px auto;
	padding: 12px 20px 13px 20px;
	font-weight: 700;
	font-size: 18px;
	line-height: 1;
	color: #fff;
	border:none;
	border-radius: 8px;
	background: #0066aa;
	text-align:center;
	cursor:pointer;
}
button:hover {background:#1975b2;}




/****************************************************************/
/********************  RESPONSIVE STYLES    *********************/
/****************************************************************/

@media only screen and (max-width:800px) {
	
/*.header,*/
.footer,
.main {
	padding-left:15px;
	padding-right:15px;
}

.main {
	padding-top:20px;
	padding-bottom:35px;
}

} /* ENDE 800 PX */

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

body {font-size: 18px;}

.hide-767px {display:none;}	

p.text-klein {font-size: 16px;}

h1 {
	margin:0 0 30px 0;
}

h3 {
	font-size: 24px;
	margin:0 0 20px 0;
}

h2.accordion-header {
	font-size:20px;
	line-height:1.33;
	margin:0 0 20px 0;
	padding:10px 75px 10px 75px;
}


table.tb-kontakt {
	margin:0;
}

.tb-kontakt td {
	padding:0 !important;
	display:block;
	margin:0 0 15px 0;
}



} /* ENDE 767 PX */
 

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

.hide-667px {display:none;}	

input[type=text].form-control {width:100%;}
input[type=submit].bt-submit {width:100%;}


} /* ENDE 667 PX */

@media only screen and (max-width:567px) {
.footer {
	display:block;
	text-align:center;
}
.footer > :first-child	{margin-left:0; padding:10px 0 20px 0;}
.footer > :last-child 	{margin-right:0; padding:0 0 10px 0;}	

.accordion-content {
	padding:0 10px 30px 10px;
	margin-top:15px !important;
}

h3 {text-align:center;}

img.img-kontakt {
	float:none;
	margin: 0 auto 20px auto;
	display: block;
}


.img-copyright {
	float:none;
	margin: -17px 0 15px 0;
	padding:0;
	text-align:center;
}


.icon-tipp {
	float:none;
	margin:-15px auto 40px auto;
	height: 72px;
	width: 72px;
	border-radius: 41px;
}

img.app-grafik {
	width:120px;
	height:auto;
	margin:-5px 10px 20px 20px;
}

h3.abonnent:before {
	display: inline-block;
	color: #fff;
	margin: -8px 10px 1px 0px;
	position: relative;
	padding: 6px 0px 0px 0;
	/*float:none;*/
}
	
} /* ENDE 567 PX */


@media only screen and (max-width:479px) {
	
h1 {text-align:center;}
		
.header {text-align:center;}
	
.header img {margin:0 0 0 0;}	

.partner img {
	width:35vw;
	height:auto;
}

.partner {
	row-gap: 15px;
	column-gap: 35px;
}
.partner a {
	margin:0 0;
}
	
} /* ENDE 479 PX*/