/*color variables*/
:root {
  --red-opacity: rgba(227, 0, 0, .3);
  --red-lighter: rgb(255, 0, 15);
  --red-darker: rgb(179, 0, 15);
  --white: #ffffff;
  --red: rgb(227, 0, 15);
  --red-dark: rgb(139, 0, 0);
}

/* source-sans-pro-300 - latin-ext */
@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 300;
  src: url('../fonts/source-sans-pro-v21-latin-ext-300.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/source-sans-pro-v21-latin-ext-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/source-sans-pro-v21-latin-ext-300.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/source-sans-pro-v21-latin-ext-300.woff') format('woff'), /* Modern Browsers */
       url('../fonts/source-sans-pro-v21-latin-ext-300.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/source-sans-pro-v21-latin-ext-300.svg#SourceSansPro') format('svg'); /* Legacy iOS */
}

/* source-sans-pro-300italic - latin-ext */
@font-face {
  font-family: 'Source Sans Pro';
  font-style: italic;
  font-weight: 300;
  src: url('../fonts/source-sans-pro-v21-latin-ext-300italic.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/source-sans-pro-v21-latin-ext-300italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/source-sans-pro-v21-latin-ext-300italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/source-sans-pro-v21-latin-ext-300italic.woff') format('woff'), /* Modern Browsers */
       url('../fonts/source-sans-pro-v21-latin-ext-300italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/source-sans-pro-v21-latin-ext-300italic.svg#SourceSansPro') format('svg'); /* Legacy iOS */
}


/* source-sans-pro-regular - latin-ext */
@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/source-sans-pro-v21-latin-ext-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/source-sans-pro-v21-latin-ext-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/source-sans-pro-v21-latin-ext-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/source-sans-pro-v21-latin-ext-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/source-sans-pro-v21-latin-ext-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/source-sans-pro-v21-latin-ext-regular.svg#SourceSansPro') format('svg'); /* Legacy iOS */
}

/* source-sans-pro-italic - latin-ext */
@font-face {
  font-family: 'Source Sans Pro';
  font-style: italic;
  font-weight: 400;
  src: url('../fonts/source-sans-pro-v21-latin-ext-italic.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/source-sans-pro-v21-latin-ext-italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/source-sans-pro-v21-latin-ext-italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/source-sans-pro-v21-latin-ext-italic.woff') format('woff'), /* Modern Browsers */
       url('../fonts/source-sans-pro-v21-latin-ext-italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/source-sans-pro-v21-latin-ext-italic.svg#SourceSansPro') format('svg'); /* Legacy iOS */
}

/* source-sans-pro-600 - latin-ext */
@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 600;
  src: url('../fonts/source-sans-pro-v21-latin-ext-600.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/source-sans-pro-v21-latin-ext-600.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/source-sans-pro-v21-latin-ext-600.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/source-sans-pro-v21-latin-ext-600.woff') format('woff'), /* Modern Browsers */
       url('../fonts/source-sans-pro-v21-latin-ext-600.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/source-sans-pro-v21-latin-ext-600.svg#SourceSansPro') format('svg'); /* Legacy iOS */
}

/* source-sans-pro-700 - latin-ext */
@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/source-sans-pro-v21-latin-ext-700.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/source-sans-pro-v21-latin-ext-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/source-sans-pro-v21-latin-ext-700.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/source-sans-pro-v21-latin-ext-700.woff') format('woff'), /* Modern Browsers */
       url('../fonts/source-sans-pro-v21-latin-ext-700.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/source-sans-pro-v21-latin-ext-700.svg#SourceSansPro') format('svg'); /* Legacy iOS */
}

/* source-sans-pro-900 - latin-ext */
@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 900;
  src: url('../fonts/source-sans-pro-v21-latin-ext-900.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/source-sans-pro-v21-latin-ext-900.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/source-sans-pro-v21-latin-ext-900.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/source-sans-pro-v21-latin-ext-900.woff') format('woff'), /* Modern Browsers */
       url('../fonts/source-sans-pro-v21-latin-ext-900.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/source-sans-pro-v21-latin-ext-900.svg#SourceSansPro') format('svg'); /* Legacy iOS */
}


/*typography*/
*, html, body, p, p2, h1, h2, h3, h4, h5, h6, texarea, a, td, em {
  font-family: 'Source Sans Pro', sans-serif;
  color: #222;
}

html, body {
  font-size: clamp(16px, 1.4vw, 18px);
  line-height: 1.5;
}

*, a {font-size: inherit; font-weight: inherit;}


h1, h2, h3, h4 {
	text-transform: uppercase;
	font-family: 'Source Sans Pro', sans-serif;
	hyphens: manual;
	}
	
h1 {font-size: 1.8em; font-weight: 700;}
h2 {font-size: 1.4em; font-weight: 700;}
h3 {font-size: 1.2em; font-weight: 700;}
h4 {font-size: 1.1em; font-weight: 700;}

  
a {
  text-decoration: none!important; 
  transition: .2s;
}
	
a:link {
  color: var(--red);
  border-bottom: 1px solid var(--red-opacity);
  }
 
a:visited { 
  color: current-color;
  border-bottom: 1px dotted var(--red-opacity);
}

@media (hover: hover){ 
a:hover {
  color: var(--red);
  border-bottom: 1px solid var(--red);
}
}

a:focus {
  color: var(--red);
  border-bottom: 1px solid var(--red);}

a:active, a.active {
  color: var(--red);
  border-bottom: 1px solid var(--red);}

.themen p, .themen a, a.pointer, .a-img, .close, a#logo {border-bottom: none!important; opacity: 1!important;}

.indent {padding-left: 1.6em;}

@media (hover: hover){
  a img:hover {filter: drop-shadow(2px 3px 4px rgba(0,0,0,.4)); -webkit-transition: .5s; transition: .5s;}
}

::-moz-selection, mark {
         background-color: #aaa; 
		 color: #fff;
}

::selection, mark {
         background-color: #aaa; 
		 color: #fff;
}

/*seitenteile*/
html {
  box-sizing: border-box;
  scrollbar-width: thin;
  scrollbar-color: #ccc #fff;
  overflow-x: hidden;
}
 
::-webkit-scrollbar {
  width: 7px;
}

::-webkit-scrollbar-track {
  background: #fff; 
}
 
::-webkit-scrollbar-thumb {
  background: #ccc; 
}

::-webkit-scrollbar-thumb:hover {
  background: #bbb; 
}

/*topnav*/
.topnav {
  overflow: hidden;
  background-color: #fff;
  position: fixed;
  top: 0;
  width: 100%;
  height: 50px;
  z-index: 5;
  transition: .2s;
  //border-bottom: 1px solid #ddd;
  box-shadow: 2px 3px 4px rgba(0,0,0,.3);
}

.topnav a {
  float: left;
  display: block;
  text-align: center;
  padding: 12px 20px;
  text-decoration: none;
  font-size: 1.1em;
  font-weight: 500;
  transition: .2s;
  border-bottom: none;
  text-transform: uppercase;
  color: #333;
}
  
.topnav a.active, .topnav.responsive a.active {color:var(--red); cursor: default; opacity: 1;}
@media (hover:hover){
.topnav a:hover {color:var(--red); cursor: pointer; opacity: 1;}
}

.topnav .navicon {
  cursor: pointer;
  background-size: 60%;
  background-repeat: no-repeat;
  border-bottom: none!important;
  background-position: center;
  height: 50px;
  width: 50px;
  position: absolute;
  top: 0;
  right: 8px;
  opacity: .6;
  display: none;
}

.topnav .navicon {background-image: url("../icons/menu.svg");}
.topnav.responsive .navicon {background-image: url("../icons/close.svg");}

@media screen and (max-width: 1200px) {
  .topnav a {display: none;}
  .topnav a.navicon {
    display: block;
  }
}

@media screen and (min-width: 1201px){
	.topnav .hide-large {display: none;}
}

@media screen and (max-width: 1200px) {
  .topnav.responsive {position: fixed; top: 0; height:auto;   box-shadow: 2px 3px 4px rgba(0,0,0,.5);}
  .topnav.responsive a {
    float: none;
    display: block;
    text-align: left;
	color: #000;
	font-size: 1.2em;
  }
  .topnav a {font-size: 1.2em;}
  .overlay {
	position: fixed;
	top 0;
	width: 100vw;
	height: 100vh;
	background-color:#000;
	opacity: .3;
	display:none;
	z-index:2;
}
}
	
.topnav.responsive small a {display: inline-block; padding: 12px 0px;}
.topnav .footer {display: none;}
.topnav.responsive .footer {display: block; border-top: 1px dotted #aaa; margin: 20px;}

/*seitenteile*/
main {
	margin-top: 50px;
	min-height: 95vh;
	}

@media screen and (min-width: 900px) {
main {border-right: 1px solid #ddd;}
}


@media screen and (min-width: 1201px){
.content {
  width: 100%;
  max-width: 1080px;
  margin: auto;
}
}

.center-text {
	padding-top: 3vw;
	padding-bottom: 3vw;
	padding-left: 20px;
	padding-right: 20px;
	hyphens: auto;
}

section {
	min-height: 90vh;	
}

hr {
  opacity: 0;
  margin: 50px;
}

/*r-button*/
a.r-button {
  box-shadow: 2px 3px 4px rgba(0,0,0,.1);
  width: 200px;
  text-align: center;
  padding: 12px;
  -webkit-transition: .5s all ease-out;
  -moz-transition: .5s all ease-out;
  transition: .2s all ease-out;
  cursor: pointer;
  display: block;
  background-color: var(--red);
  color: #fff;
  font-weight: 600;
  font-size: 1.1em;
  text-transform: uppercase;
  margin: auto;
  border-radius: 2px;
}

a.r-button.active, a.r-button:hover {
  box-shadow: 2px 3px 4px rgba(0,0,0,.3);
  background-color: var(--red-lighter);
}

.active:hover {
  cursor: default;
}

/*formular*/
input, textarea {
  background-color: #fff;
  color: #000!important;
  width: 90%;
  margin: auto;
  max-width: 450px;
  outline: none;
  border: none;
  resize: vertical;
  padding: 2px 6px;
  border-radius: 2px;
}
textarea{  min-height: 6em;}

@media screen and (max-width: 450px){
	textarea {min-height: 8em;}
}
}

@media screen and (orientation: landscape) and (hover: hover) {
textarea:hover, input:hover {
  border: 1px solid var(--red);
}
}


input[type="checkbox"], input[type="radio"], input[type="range"], progress {
  accent-color: var(--red);
  width: 2em;
}

input[type="submit"]{
	border: none;
	width: 30%;
	padding: 12px;
}

input[type="submit"]:hover{
	border: none;
	width: auto;
}

label {color: #fff;}
label a {font-size: inherit;}

/*cookie consent*/
#klaro{display: none;}
.c-c {cursor: pointer;}

/*@media*/
@media screen and (orientation: portrait){
	.landscape {display: none;}
}

@media screen and (orientation: landscape){
	.portrait {display: none;}
}