* {
	box-sizing:border-box;
	color:#1a1a1a;
	font-family:"Open Sans", sans-serif;
	font-size:100%;
	line-height:1.5;
	margin:0px;
	padding:0px;
}
 
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 300;
  src: local('Open Sans Light'), local('OpenSans-Light'), url(OpenSans-Light.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
  font-display: swap;
}

@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: local('Open Sans Regular'), local('OpenSans-Regular'), url(OpenSans-Regular.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
  font-display: swap;
}

@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 700;
  src: local('Open Sans Bold'), local('OpenSans-Bold'), url(OpenSans-Bold.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
  font-display: swap;
}

a {
	color:#4285F4;
	text-decoration:none;
}

#antwort1, #antwort2 {
	display:none;
}

.article-frame {
	padding:16px;
	width:100%;
}

#aufklappen-inhalt {
	display:none;
}

#aufklappen-titel {
	
}

b {
	color:#333333;
}

.bg-green {
	background-color:#EBF9EF;
}

.bg-blue {
	background-color:#E7F0FE;
}

.bg-yellow {
	background-color:#FEF2CD;
}

body {
	background-color:#F2F2F2;
	font-size:120%;
}

.bold {
	color:#333333;
	font-weight:bold;
}

.breadcrump {
	background-color:#4285F4;
	border-radius:8px;
	color:white;
	float:left;
	margin-right:16px;
	padding:8px 12px;
}

.breadcrump:hover {
	background-color:#6EA3F7;
}

.breadcrumps-outside {
	background-color:white;
	margin-left:25%;
	margin:auto;
	padding:16px;
	position:sticky;
	top:0px;
	width:100%;
	z-index:200;
}

.break {
	clear:both;
}

.button {
	border-radius:16px;
	border:3px solid gray;
	padding:16px 24px;
}

.button-klein {
	background-color:#4285F4;
	border-radius:12px;
	color:white;
	cursor:pointer;
	margin-right:16px;
	max-width:100%;
	padding:8px 16px;
	width:max-content;
	word-wrap:break-word;
}

.button-klein:hover {
	background-color:#6EA3F7;
}

.cookiehinweis-aussen {
	margin:auto;
	margin-top:8px;
	margin-bottom:8px;
	width:100%;
}

.cookiehinweis-table {
	background-color:#4285F4;
	border-collapse:collapse;
	border-style:none;
	width:100%;
}

.cookiehinweis-tr {
	border-style:none;
}

.cookiehinweis-td {
	background-color:#4285F4;
	border-style:none;
	color:white;
	padding:16px;
	text-align:left;
	vertical-align:middle;
}

.cookiehinweis-schliesser {
	background-color:#4285F4;
	border-style:none;
	color:white;
	cursor:pointer;
	font-size:120%;
	padding:16px;
	text-align:center;
	vertical-align:middle;
	width:100px;
}

h1 {
	color:#333333;
	font-family:"Open Sans", sans-serif;
	font-size:300%;
	font-weight:300;
	hyphens:auto;
	letter-spacing:2px;
}

.h1-outside {
	background-image:linear-gradient(to right, #4285F4, #33cccc);
	margin:auto;
	padding:16px;
	width:100%;
}

h2 {
	color:#333333;
	font-size:125%;
}

.h2-inside {
	background-color:#4285F4;
	border-radius:16px;
	color:white;
	font-weight:bold;
	margin:16px 16px 0px 0px;
	max-width:100%;
	padding:16px 24px;
	width:max-content;
	word-wrap:break-word;
}

.h2-outside {
	background-color:white;
	margin:16px -16px;
	padding:0px 16px 16px 16px;
	padding-bottom:16px;
	padding-top:1px;
	position:sticky;
	top:0px;
}

h3 {
	background-color:#33CCCC; /*ehemals #F2F2F2*/
	border:1px solid #33CCCC;
	border-radius:16px 16px 0px 0px;
	color:white;
	font-size:120%;
	font-weight:bold;
	margin-top:8px;
	padding:16px 24px;
	width:100%;
}

.h3-div-box {
	border:1px solid #33CCCC;
	border-top:0px solid white;
	border-radius:0px 0px 16px 16px;
	margin-top:0px;
	padding:12px 8px;
}

.h3-ul-box li {
	background-color:white;
	margin:0px 8px;
	max-width:100%;
	padding:4px 8px
}

.h3-ul-box li::marker {
	color:#33CCCC;
}

h4 {
	color:#333333;	
	font-size:110%;
	font-weight:bold;
	word-wrap:break-word;
}

h5 {
	background-color:#D6F5F5;
	border-radius:8px;
	font-weight:normal;
	max-width:100%;
	padding:8px 12px;
	width:max-content;
	word-wrap:break-word;
}

h6 {
	background-color:#FEF2CD;
	border-radius:8px;
	font-weight:normal;
	max-width:100%;
	padding:8px 12px;
	width:max-content;
	word-wrap:break-word;
}

input[type="radio"] {
	display: none;
}

.kaertchen_bild_all {
	display:block;
	width:100%;
}

label {
  color:#333333;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  gap:16px;
  border:3px solid #4285F4;
  padding:16px 24px;
  border-radius:16px;
}

label:before {
  content:"";
  height:32px;
  width:32px;
  border:3px solid #4285F4;
  border-radius:50%;
}

input[type="radio"]:checked + label:before {
  height:16px;
  width:16px;
  border:11px solid #ffffff;
  background-color:#4285F4;
}

input[type="radio"]:checked + label {
  background-color:#4285F4;
  color:#ffffff;
}

.line-big {
	border-width:0px;
	background-color:#F2F2F2;
	color:#F2F2F2;
	height:8px;
}

.line-small {
	border-width:0px;
	background-color:#F2F2F2;
	color:#F2F2F2;
	height:2px;
	margin:0px -16px;
}

.main-frame {
	background-color:white;
	margin:auto;
	margin-left:25%;
	margin-bottom:8px;
	width:50%
}

.runde-ecken {
	border-radius:16px;
}

#scrollProgressContainer {
	position: fixed;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 8px;
	background-color: #eee;
	z-index: 1000;
    }

#scrollProgressBar {
	height: 100%;
	width: 0%;
	background-color: #CCCCCC;
	transition: width 0.2s ease-out, background-color 0.2s ease-out;
    }

.section-article {
	background-color:white;
	margin:auto;
	padding:16px;
	padding-top:0px;
	width:100%;
}

.section-title-picture {
	margin:auto;
	width:100%;
}

table {
	border-spacing:0px 8px;
}

table.table-weiter {
	border-spacing: 0px 0px;
	margin:-16px 0px;
	width:100%;
}

tr {

}

td {
	border-radius:12px;
	height: 100%;
	padding:8px 12px;
}

td.blue {
	background-color:#4285F4;
	color:white;
}

td.td-weiter-1 {
	border-radius:0px;
	color:white;
	font-size:125%;
	padding:16px 0px;
	vertical-align:top;
}

td.td-weiter-2 {
	border-radius:0px;
	padding:16px 16px 16px 8px;
	vertical-align:top;
}

td.td-weiter-3 {
	border-radius:0px;
	font-size:125%;
	padding:16px 0px;
	text-align:right;
	vertical-align:bottom;
}

.thema {
	background-color:#4285F4;
	border-radius:16px;
	cursor:pointer;
	font-weight:bold;
	margin-top:16px;
	padding:16px 24px;
	width:100%;
}

.thema:hover {
	background-color:#6EA3F7;
}

.thema-ziel {
	background-color:#4285F4;
	border-radius:16px;
	font-weight:bold;
	margin-top:16px;
	max-width:100%;
	padding:16px 24px;
	width:max-content;
}

.title {
	background-image:linear-gradient(to right, #4285F4 , #33CCCC);
	color:white;
	padding:8px 16px;
	width:100%;
	z-index:100;
}

.title-mid {
	background-image:linear-gradient(to right, #4285F4 , #33CCCC);
	color:white;
	padding:16px;
	width:100%;
	z-index:100;
}

ul {
	padding-left:24px;
}

ul > li::marker {
	color:#333333;
}

ul > li {
	padding:px 0px;
}

ul-none {
	list-style-type:none;
	padding-left:16px;
}

.vergleich-head-inner-frame {
	background-color:#33CCCC;
	border-radius:16px 16px 0px 0px;
	display:flex;
	font-weight:bold;
	width:100%;
}

.vergleich-head-item1 {
	color:white;
	hyphens:auto;
	padding:16px 24px;
	width:50%;
}

.vergleich-head-item2 {
	border-left:1px solid white;
	color:white;
	hyphens:auto;
	padding:16px 24px;
	width:50%;
}

.vergleich-head-outer-frame {
	background-color:white;
	padding-top:16px;
	position:sticky;
	top:0px;
}

.vergleich-inhalt-inner-frame {
	border:1px solid #33CCCC;
	border-top:0px solid white;
	border-bottom:0px solid white;
	display:flex;
	width:100%;
}

.vergleich-inhalt-inner-frame-last {
	border:1px solid #33CCCC;
	border-top:0px solid white;
	border-radius:0px 0px 16px 16px;
	display:flex;
	width:100%;
}

.vergleich-inhalt-item1 {
	hyphens:auto;
	padding:16px 24px 16px 24px;
	width:50%;
}

.vergleich-inhalt-item2 {
	border-left:0px solid #33CCCC;
	hyphens:auto;
	padding:16px 24px 16px 24px;
	width:50%;
}

.vergleich-inhalt-symptom {
	background-color:#EBFAFA;
	border:1px solid #33CCCC;
	border-bottom:0px solid white;
	font-weight:bold;
	hyphens:auto;
	padding:16px 24px;
}




.white {
	color:white;
}

/* AB HIER: HOCHFORMAT */
/* AB HIER: HOCHFORMAT */
/* AB HIER: HOCHFORMAT */

@media (orientation:portrait) {
	
.breadcrumps-outside {
	margin-left:0%;
	margin:auto;
	width:100%
}

.cookiehinweis-schliesser {
	border-style:none;
	color:white;
	cursor:pointer;
	font-size:150%;
	padding:16px;
	text-align:center;
	vertical-align:middle;
	width:60px;
}

.h1-outside {
	width:100%;
}

.h2-outside {
	top:0px;
}

.h2-inside {
	padding:16px 16px;
}

h3 {
	padding:16px 16px;
}

.main-frame {
	margin:auto;
	margin-left:0%;
	width:100%
}

.section-article {
	width:100%;
}

.section-title-picture {
	width:100%;
}
	
.title {
	margin-left:0%;
	margin:auto;
	padding:8px 16px;
	width:100%;
}
	
	
	
	
}