/*

  xs: 480px
  sm: 768px
  md: 1024px
  lg: 1280px

1vw: 0.078125
*/

:root {
  --weis: #ffffff;
  --schwarz: #00000E;
}


:focus { 
	outline: none !important; 
    background: transparent !important;
}

.debugLayout{
    /*position: absolute;*/
    top: 0;
    background: rgba(255,0,0,0.6);
    color: white;
    padding: 10px;
}

body {
    font-size: 18px;
    line-height: 1.6;
    font-family: 'Roboto', sans-serif;
    font-style: normal;
    font-weight: 400;
	color:#00000E;
	overflow-x: hidden;
}

.bg-ffffff{background: #ffffff;}
.bg-f1f3f2{background: #f1f3f2;}
.bg-000000{background: #000000;}

.aosini{
	opacity: 0;
}

h1, h2{
	font-family: roboto-condensed, sans-serif;
	font-weight: 700;
	font-style: normal;
	margin-bottom: 50px;
	line-height: 1;
    font-size: calc(1.425rem + 4.5vw);
}

h3{
	font-family: roboto-condensed, sans-serif;
	font-weight: 700;
	font-size:36px;
	font-style: normal;
}


h1:after, h2:after {
	content: "\A";
    width: calc(39px + 12.3vw);
	height: calc(7px + 0.7vw);
	background: #00000E;
	display: block;
	margin: 25px 0 50px;
	margin-top: calc(15px + 0.7vw);
}

.bg-000000 h1, .bg-000000 h2, .bg-000000 h3, .bg-000000 p{
	color:#ffffff;
}

.bg-000000 h1:after, .bg-000000 h2:after {
	background: #ffffff;
}

p{
	margin-bottom: 24px;
}

#page-main{
	overflow:hidden;
}
strong{
	font-weight:600;
	display: inline-block;

}

picture{
	overflow:hidden !important;
	width:100%;
}

img{width:100%; height: auto;}

#page-main ul {
    list-style-type: none;
    padding: 0;
  }

#page-main li::before {
    content: "+";
   /* color: green; Farbe des Pluszeichens */
    font-weight: bold; /* Optionale Schriftgewichtung */
    margin-right: 5px; /* Optionaler rechter Abstand zum Text */
    display: inline-block;
  }

.container{
	width:90%;
}

.row, .container{
	position: relative;
}

.mar-top{
	margin-top:8.333333%;
}
.mar-bot{
	margin-bottom:8.333333%;
}

.pad-top{
	padding-top:8.333333%;
}
.pad-bot{
	padding-bottom:8.333333%;
}

.linie{
	border-bottom:1px solid #00000E;
	margin-bottom: 15px;
}

.bg-000000 .linie{
	border-bottom:1px solid #ffffff;
}


.image-over{height:100%; width:auto;}


.underline:after{
		content: "";
		width: 100%;
		height: 1px;
		background: #00000E;
		display: block;
		margin: 12px 0 16px;;
}




.text-center{text-align: center;}



@media (min-width: 768px){
	h1, h2{
		font-weight:600;
		margin-bottom: 0px;
		line-height: 1;
	}
	


}

@media (min-width: 1200px){
	h1{
		font-size: 6rem;
	}
	h2{
		font-size: 4rem;
	}
	h1:after, h2:after {
		height: 14px;
		width: 148px;
		margin-top:25px;
	}
}

@media (min-width: 1280px){

}

@media (min-width: 1440px){}