html{
margin:0;
padding:0;
border:0;
width:100%;
}

body{
margin:auto;
padding:0;
width:100%;
color:#505050;
background-color:#dddddd;
font-family:Helvetica, Arial, sans-serif;
}


a:link {
  color:#195399;
}
a:visited {
  color:#195399;
}
a:hover {
  color:#d16049;
}
a:active {
  color:#d16049;
}

img a {
border:0;
}

a[href^="http://"]:not([href*="andreaskuhr.com"]):after,
a[href^="https://"]:not([href*="andreaskuhr.com"]):not([href*="reddit.com"]):not([href*="whatsapp.com"]):not([href*="facebook.com"]):not([href*="ko-fi.com"]):after {
content: url('/dateien/icons/link_extern.svg');
padding-left:4px;
}

h1 {
font-size:1.2em;
font-weight:300;
line-height:1.375em;
margin:0;
}

h2 {
font-size:1.05em;
font-weight:300;
line-height:1.3em;
margin:0;
padding:.6em 0 .6em 0;
}

h3 {
font-size:.875em;
font-weight:300;
line-height:1.3em;
margin:0;
padding:.6em 0 .6em 0;
}


p, ul, ol, table {
margin:0 0 1.1em 0;
font-size:.875em;
font-weight:300;
line-height:1.225em;
}

table {
width:100%;
border-collapse:collapse;
}

thead tr {
text-align:left;
background-color:#cccccc;
}

tbody tr:nth-child(odd) {
background-color:#eeeeee;
}

tbody tr:nth-child(even) {
background-color:#cccccc;
}

th, td {
font-weight:300;
padding:.3em .4em .2em .3em;
vertical-align:top;
}

th {
border-right:5px solid #dddddd;
border-bottom:5px solid #dddddd;
}

thead th:last-child {
border-right:0;
}

blockquote {
margin:.5em 0 .5em 0;
font-size:.875em;
font-weight:300;
line-height:1.375em;
}

pre {
display:block;
white-space:pre-wrap;
margin:.8em 0 .8em 0;
padding:.2em .5em .2em .5em;
font-size:0.875em;
font-weight:300;
line-height:1.463em;
background-color:#eeeeee;
color:#505050;
border-left:1em solid #f5bd81;
border-top:1px solid #cccccc;
border-right:1px solid #cccccc;
border-bottom:1px solid #cccccc;
}

#header {
width:90%;
margin:auto;
}

#translate {
width:100%;
height:1.3em;
margin:1em 0 0 0;
padding:0;
font-size:0.875em;
font-weight:300;
line-height:1em;
text-align:right;
}

#translate a {
display:inline-block;
color:#505050;
margin-right:1.5em;
text-decoration:none;
}

#translate a:hover {
border-bottom: 3px solid #d16049;
}

#mainmenu_wrap {
display:flex;
flex-wrap:wrap;
margin:0.3em 0 1.5em 0;
overflow:hidden;
}

#sitename {
float:left;
height:1.3em;
margin:.7em 4em 0 0;
padding:0 0 .3em 0;
vertical-align:bottom;
}

#sitename a{
color:#505050;
font-size:1.05em;
font-weight:300;
line-height:1.3em;
text-decoration:none;
}

nav.main {
display:flex;
flex-wrap:wrap;
float:left;
margin:0;
padding:0;
}
	
nav.main ul {
list-style:none;
margin:.7em 0 0 0;
padding:0 0 .3em 0;
font-size:1.05em;
font-weight:300;
line-height:1.3em;
}
	
nav.main li {
display:block;
float:left;
height:1.1em;
margin:0 .7em 0 .7em;
padding:0;
text-align:center;
}
	
nav.main li.dot {
margin:0;
padding:0;
}
		
nav.main li:first-child {
margin:0 .7em 0 0;
}
	
nav.main li a {
display:block;
color:#505050;
text-decoration:none;
}
	
nav.main li:hover {
border-bottom: 3px solid #d16049;
}

nav.main li.dot:hover {
border-bottom: 0;
}
	
nav.main li.active {
border-bottom: 3px solid #f5bd81;
}

#slogan{
clear:both;
width:100%;
margin:0;
padding:0;
}

#slogan h1{
margin:0;
padding:0;
}

#headimgwrap {
width:100%;
height:1.5em;
}

.headimg {
display:none;
}

.headimg img {
/*float:right;*/
position:relative;
left:10px;
bottom:10px;
border:0;
}

.mask {
width:91%;
max-width:40em;
margin:auto;
}

#explain {
width:91%;
margin:auto;
}

.flexcontainer {
display:flex;
flex-direction:row;
flex-wrap: wrap;
justify-content:center;
width:91%;
margin:auto;
}

.teaser h2 {
font-size:1.2em;
font-weight:300;
line-height:1.2em;
margin:1em 1em 0 1em;
padding:0;
height:4em;
}

.teaser p{
font-size:.875em;
font-weight:300;
line-height:1.2em;
margin:1em 1em 0 1em;
padding:0;
}

.teaser {
float:left;
width:280px;
height:30em;
margin:2.5em 1em 3em 0;
padding:0;
background-color:#B3B3B3;
}

.teasercontent {
width:280px;
height:30em;
position:relative;
top:-10px;
left:10px;
margin:0;
padding:0;
background-color:#eeeeee;
overflow:hidden;
}

.teasercontent a {
text-decoration:none;
color:#505050;
}

.teasercontent a:hover {
color:#d16049;
}

.accordion > input[type="checkbox"] {
position: absolute;
left: -100vw;
}

#infobar {
width:100%;
height:3em;
}

#update {
float:left;
height:3em;
display:flex;
align-items:center;
}

#update p{
font-size:.875em;
font-weight:300;
line-height:3em;
margin-bottom:0;
}

.social{
float:right;
height:3em;
display:flex;
align-items:center;
}

.social p{
font-size:.875em;
font-weight:300;
line-height:3em;
margin-bottom:0;
}

.social img{
margin:0 0 0 1.2em;
}

.donbutton{
float:right;
margin:1em 0 0 0;
padding:0;
height:2em;
}

.donate {
display:block;
width:12em;
height:2em;
margin:0;
padding:.2em .3em .2em .3em;
background:#f5bd81;
font-size:.875em;
line-height: 2em;
font-weight:700;
text-align:center;
}

.donate:link  {
color:#FFFFFF;
text-decoration:none;
}
.donate:visited  {
color:#FFFFFF;
text-decoration:none;
}
.donate:hover {
color:#FFFFFF;
text-decoration:none;
background:#f4607c;
}

.donate img{
border:0;
margin:0 .7em 0 0;
position:relative;
top:.2em;
}

.accordion {
clear:both;
}

.accordion .acontent {
overflow-y: hidden;
height: 0;
transition: height 0.3s ease;
}

.accordion > input[type="checkbox"]:checked ~ .acontent {
height: auto;
overflow: visible;
margin-top:1em;
padding:0;
border: 1px solid #cccccc;
background-color:#eeeeee;
}

.accordion label {
display: block;
cursor: pointer;
font-weight: 300;
padding:.2em 0 0 0;
border-bottom: 1px solid #B3B3B3;
}

.accordion {
margin-bottom: 1.7em;
}

.accordion .handle {
margin: 0;
padding-bottom:0;
font-size: 1.3em;
font-weight:300;
}

.accordion .handle h2{
padding-bottom:0;
}

.accordion label:hover,
.accordion label:focus {
background:#eeeeee;
}

.accordion .handle label:before {
content:"▸";
display: inline-block;
margin-right: 10px;
font-size: 1em;
line-height: 1.556em;
vertical-align: middle;
}

.accordion > input[type="checkbox"]:checked ~ .handle label:before {
content: "▾";
}

nav.toc{
margin:0 0 1em 0;
padding:1em 0 0 0;
font-size:1em;
font-weight:300;
line-height:1em;
color:#195399;
column-count:2;
column-width:19em;
column-gap:0;
}

nav.toc ul{
font-size:1em;
margin:0 1em 0 0;
}

nav.toc li{
list-style-type:square;
margin-bottom:.8em;
}

#content {
clear:both;
margin:1.5em 0 2em 0;
}

.glightbox:after {
content:url('/dateien/icons/ak_zoom.svg');
display:block;
width:30px;
height:30px;
position:relative;
bottom:28px;
left:calc(100% - 23px);
}

#footer {
clear:both;
display:flex;
flex-direction:row;
flex-wrap:wrap;
justify-content:center;
width:100%;
position:relative;
bottom:0;
margin-top:5em;
padding:.6em 0 2.4em 0;
background-color:#505050;
}

.footmenu {
width:16em;
margin:2em 0 0 1em;
padding:0;
font-size:.875em;
font-weight:400;
line-height:1.2em;
}

.footmenu h2{
margin:0 0 .5em 0;
padding:0;
font-size:1.463em;
font-weight:400;
line-height:1.75em;
color:#bbbbbb;
column-span:all;
}

.footmenu ul {
margin:0;
padding:0 0 0 .9em;
list-style:square;
font-size:1.125em;
font-weight:300;
line-height:1.35em;
color:#bbbbbb;
}

.footmenu li {
margin:0;
padding:0 1em 1em 0;
}

.footmenu a {
margin:0;
padding:0;
color:#bbbbbb;
text-decoration:none;
}

.footmenu a:hover {
color:#ffffff;
border-bottom-width:1px;
border-bottom-color:#fff;
border-bottom-style:solid;
}

.footmenu a.active,
.footmenu a.active:hover {
color:#fff;
background:#BDCDD4;
font-weight:bold;
}

@media only screen and (min-width:500px) {

   .footmenu.tutorial {
   width:33em;
   column-count:2;
   column-width:16em;
   column-gap:1em;
   }
}

@media only screen and (min-width:720px) {

	html{
	margin:auto;
	padding:0;
	border:1.5em solid #ffffff;
	box-sizing:border-box;
	width:100%;
	}

	h1 {
	font-size:1.9em;
	font-weight:300;
	line-height:1.375em;
	margin:0;
	}

	h2 {
	font-size:1.463em;
	font-weight:300;
	line-height:1.375em;
	margin:0;
	padding:.6em 0 .6em 0;
	}

	h3 {
	font-size:1.125em;
	font-weight:300;
	line-height:1.375em;
	}
	
	p, ul, ol {
	margin:0 0 1.1em 0;
	font-size:1.125em;
	font-weight:300;
	line-height:1.375em;
	}
	
	table {
	margin:0 0 1.1em 0;
	font-size:1em;
	font-weight:300;
	line-height:1.375em;
	}
	
	blockquote {
	margin:.5em 0 .5em 0;
	font-size:.938em;
	font-weight:300;
	line-height:1.375em;
	}

	pre {
	display:block;
	white-space:pre-wrap;
	margin:.8em 0 .8em 0;
	padding:.2em .5em .2em .5em;
	font-size:1.125em;
	font-weight:300;
	line-height:1.463em;
	background-color:#eeeeee;
	color:#505050;
	border-left:1em solid #f5bd81;
	border-top:1px solid #cccccc;
	border-right:1px solid #cccccc;
	border-bottom:1px solid #cccccc;
	}
	
	#header {
	width:80%;
	margin:auto;
	}
	
	#translate {
    width:100%;
    height:1.6em;
    margin:2em 0 0 0;
    padding:0;
    font-size:0.875em;
    font-weight:300;
    line-height:1.3em;
    text-align:right;
    }
    
    #translate a {
    display:inline-block;
    color:#505050;
    margin-right:2.5em;
    text-decoration:none;
    }
    
	#header {
	width:80%;
	margin:auto;
	}
	
	#mainmenu_wrap {
	display:flex;
    flex-wrap:wrap;
    align-items:flex-end;
	margin:2em 0 0 0;
	overflow:hidden;
	}
	
	#sitename {
	float:left;
	width:10em;
	height:2em;
	margin:0 2.8em 0 0;
	padding:0 0 .3em 0;
	vertical-align:bottom;
	}
	
	#sitename a{
	color:#505050;
	font-size:1.463em;
	font-weight:300;
	line-height:2em;
	text-decoration:none;
	}
		
	nav.main {
	display:flex;
    flex-wrap:wrap;
	float:left;
	margin:0;
	padding:0;
	}
	
	nav.main ul {
	list-style:none;
	height:1em;
	margin:1em 0 0 0;
	padding:0 0 .3em 0;
	font-size:1.125em;
    font-weight:300;
    line-height:1.3em;
	}
	
	nav.main li {
	display:block;
	float:left;
	height:1.1em;
	margin:0 1em 0 1em;
	padding:0;
	}
	
	nav.main li:first-child {
	margin:0 1em 0 0;
	}
		
	nav.main li.last {
	margin:0 0 0 1em;
	}
	
	nav.main li a {
	display:block;
	color:#505050;
    text-decoration:none;
	}
	
	#slogan{
	clear:both;
	width:100%;
	margin:.3em 0 0 0;
	padding:0;
	}
	
	#slogan h1{
	margin:1.3em 0 0 0;
	padding:0;
	}
	
    #headimgwrap {
	display:block;
	width:100%;
	height:234px;
	margin:2.5em 0 2em 0;
	}

	.headimg {
	display:block;
	position:absolute;
	right:0px;
	width:80%;
	height:224px;
	background-color:#B3B3B3;
	border:0;
	}
	
	.headimg img {
	width:calc(100% - 10px);
	object-fit:cover;
	object-position:0 0;
	}
	
	.mask {
	width:80%;
	max-width:40em;
	margin:auto;
	}
	
	#explain {
	width:80%;
	margin:auto;
	}
	
	.flexcontainer {
	justify-content:space-between;
	width:80%;
	/*max-width:40em;*/
	}
	
	.teaser h2 {
	font-size:1.25em;
	font-weight:300;
	line-height:1.2em;
	margin:1em 1em 0 1em;
	padding:0;
	height:4em;
	}
	
	.teaser p{
	font-size:.962em;
	font-weight:300;
	line-height:1.2em;
	margin:1em 1em 0 1em;
	padding:0;
	}
	
	.accordion .handle {
    margin: 0;
    padding-bottom:0;
    font-size: 1.463em;
    font-weight:300;
    }
	
	#content {
	clear:both;
	margin:3em 0 2em 0;
	}
	
	strong {
    font-weight:700;
    }
}

@media only screen and (min-width:920px) {

	html{
	border:2em solid #ffffff;
	}
	#sitename {
	margin:0 8em 0 0;
	}

}

@media only screen and (min-width:1180px) {

	html{
	margin:auto;
	padding:0;
	border:2em solid #ffffff;
	box-sizing:border-box;
	width:100%;
	}

	h1 {
	font-size:1.9em;
	font-weight:300;
	line-height:1.375em;
	margin:0;
	}

	h2 {
	font-size:1.463em;
	font-weight:300;
	line-height:1.375em;
	margin:0;
	padding:.6em 0 .6em 0;
	}

	h3 {
	font-size:1.125em;
	font-weight:300;
	line-height:1.375em;
	}

	p, ul, ol {
	margin:0 0 1.1em 0;
	font-size:1.125em;
	font-weight:300;
	line-height:1.375em;
	}
	
	table {
	margin:0 0 1.1em 0;
	font-size:1em;
	font-weight:300;
	line-height:1.375em;
	}
	
	blockquote {
	margin:.5em 0 .5em 0;
	font-size:.938em;
	font-weight:300;
	line-height:1.3em;
	}

	pre {
	display:block;
	white-space:pre-wrap;
	margin:.8em 0 1.5em 0;
	padding:.2em .5em .2em .5em;
	font-size:1.125em;
	font-weight:300;
	line-height:1.463em;
	background-color:#eeeeee;
	color:#505050;
	border-left:1em solid #f5bd81;
	border-top:1px solid #cccccc;
	border-right:1px solid #cccccc;
	border-bottom:1px solid #cccccc;
	}
	
	#header {
	width:80%;
	margin:auto;
	}
	
	#mainmenu_wrap {
	display:flex;
    flex-wrap:wrap;
    align-items:flex-end;
	margin:2em 0 0 0;
	overflow:hidden;
	}
	
	#sitename {
	float:left;
	width:10em;
	height:2em;
	margin:0 8em 0 0;
	padding:0 0 .3em 0;
	}
	
	#sitename a{
	color:#505050;
	font-size:1.463em;
	font-weight:300;
	line-height:2em;
	text-decoration:none;
	}
		
	nav.main {
	display:flex;
    flex-wrap:wrap;
	float:right;
	position:absolute;
	right:12em;
	margin:0;
	padding:0;
	}
	
	nav.main ul {
	list-style:none;
	height:1em;
	margin:0;
	padding:0 0 .3em 0;
	font-size:1.125em;
    font-weight:300;
    line-height:1.3em;
	}
	
	nav.main li {
	display:block;
	float:left;
	height:1.1em;
	margin:0 1em 0 1em;
	padding:0;
	}
	
	nav.main li:first-child {
	margin:0 1em 0 0;
	}
	
	nav.main li a {
	display:block;
	color:#505050;
    text-decoration:none;
	}
	
	#slogan{
	clear:both;
	width:100%;
	margin:.3em 0 0 0;
	padding:0;
	}

    #headimgwrap {
	display:block;
	width:100%;
	height:234px;
	margin:2.5em 0 2em 0;
	}
	
	.headimg {
	display:block;
	position:absolute;
	right:0px;
	width:1034px;
	height:224px;
	background-color:#B3B3B3;
	border:0;
	}
	
	.headimg img {
	width:1024px;
	}
	
	.mask {
	width:80%;
	max-width:40em;
	margin:auto;
	}
	
    strong {
    font-weight:700;
    }
}

.article {
margin:1em 0 0 0;
}

.article img:not(.fix){
border:1px solid #cccccc;
width:100%;
height:auto;
}

.article img.fix{
display:block; 
margin:auto;
border:1px solid #cccccc;
max-width:100%;
height:auto;
}

.article p{
font-family:Palatino, Georgia, Times New Roman, serif;
}

.article li{
font-family:Palatino, Georgia, Times New Roman, serif;
}

.serif p {
font-family:Palatino, Georgia, Times New Roman, serif;
}

.alert{
margin:.5em 0 1em 0;
padding:0 .8em 0 .8em;
border-left:1em solid #f4607c;
}

.alert1st{
color:#f4607c;
}

#author p{
display:none;
}

.newsletter{
margin:3em 0 2em 0;
padding:2em;
border:1em solid #ffffff;
text-align:center;
background-color:#505050;
}

.newsletter h3{
font-size:1.463em;
font-weight:400;
line-height:1.375em;
color:#f5bd81;
margin:0;
padding:0 0 .6em 0;
}

.newsletter p{
color:#ffffff;
margin:0;
padding:0 0 .6em 0;
font-family:Helvetica, Arial, sans-serif;
}

.newsletter p.consent{
width:70%;
font-size: .875em;
font-weight:300;
line-height:1em;
margin:auto;
padding:0 0 1em 0;
}

.newsletter a{
color:#ffffff;
}

.newsletter label {
font-size: .875em;
font-weight:300;
color:#ffffff;
margin 0;
}

.newsletter .errorMsg {
font-size:1em;
font-weight:400;
color:#f4607c;
margin 0;
padding:0 0 .6em 0;
}

.newsletter .fielderror {
font-size:1em;
font-weight:400;
color:#f4607c;
margin 0;
padding:0 0 .6em 0;
}

.newsletter .formerror p{
font-size:1em;
font-weight:400;
color:#f4607c;
margin 0;
padding:0 0 .6em 0;
}

input {
border:0;
padding:.3em;
background-color:#dddddd;
}

#gdprcheck{
border:0;
padding:0;
background-color:#dddddd;
}

.newsletter input[type=email] {
width:70%;
height:1.6em;
margin:.4em 0 1em 0;
text-align:center;
}
    
.newsletter .submitbutton {
width:calc(70% + .6em);
height:2.3em;
background-color:#f5bd81;
margin:0 0 1em 0;
cursor:pointer;
}

.newsletter .submitbutton:hover {
color:#ffffff;
background-color:#d16049;
}

#profileform {
width:20em;
margin:auto;
}

#profileform .submitbutton {
width:20em;
height:2.3em;
font-size:1em;
font-weight:500;
color:#505050;
background-color:#f5bd81;
cursor:pointer;
}

#profileform .submitbutton:hover {
color:#ffffff;
background-color:#d16049;
}

.listarticle{
float:left;
width:288px;
height:20em;
margin:0;
padding:0;
background-color:#505050;
}

#listcontent {
clear:both;
margin:2em 0 6em 0;
}

.clear {
clear:both;
}

strong {
font-weight:700;
}