@charset "UTF-8";
/* CSS Document */

html {
  scroll-behavior: smooth;
}

body {
  font-family: "Montserrat";
  color: #f9f9f9;
  background-color: rgb(39,39,39, 1.0);
	width: 65vw;
	margin: 0px auto;
	
}

header {
	font-size: clamp(30px, 6vw, 50px);
	font-weight: 500;
	margin: 60px 0px;
}

details {
	border-bottom: 1px solid #f9f9f9;
}

details summary{
	font-size: clamp(24px, 5vw, 40px);
	font-weight: 100;
	margin: 30px 0;
	cursor: pointer;
}
details h1{
	font-size: clamp(22px, 4vw, 35px);
	font-weight: 700;
	margin: 20px 0px;
	
}

details li, details p{
	font-size: clamp(16px, 3.5vw, 20px);
	font-weight: 100;
	line-height: 2rem;
}

details ul{
	padding-left: 0px;
}


details li{
	list-style: none;
	
}

details a{
	text-decoration: none;
	color:#f9f9f9;
}
details a:visited{
	text-decoration: none;
	color:#f9f9f9;
}

details img{
	width: 100%;
	margin-bottom: 20px;
}
details .steps{
	border-bottom: none;
	padding: 0 clamp(20px, 5vw, 60px);
	
}
details .steps summary{
	font-size: clamp(18px, 4vw, 30px);
	font-weight: 100;
}
details .steps p{
	
	margin-block-start: 0px
}

footer{
	margin: 60px 0px 40px;
	width:100%;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: center;
  	align-items: center;
}

.footer_left,
.footer_right {
  min-width: 330px; 
}

.footer_left{
	width: 50%;
}
.footer_left img{
	width: 330px;
	height: auto;
	
}

.footer_left{
	width: 50%;
}

.footer_right{
	width: 50%;
	display: inline-block;
}

.footer_right ul{
	display: flex;
	flex-direction: row;
	justify-content: flex-end;
	align-items: flex-end;
	gap: 1.5rem;
	list-style: none;
	padding-left:0;
	font-size: 15px;
	font-weight: 100;
	color:#f9f9f9;
}

.fab{
	color:#f9f9f9;
	font-size: 30px;
}


.footer_right a:hover {
	display: inline-block;
	transform: scale(1.2);
	cursor: pointer;
}

.footer_right a{
	text-decoration: none;
	color:#f9f9f9;
}

.footer_right a:visited{
	text-decoration: none;
	color:#f9f9f9;
}

.Impressum h1{
	font-size: clamp(28px, 5vw, 40px);
	font-weight:400;
}

.Impressum h2{
	font-size: clamp(20px, 4vw, 24px);
	font-weight:400;
}

.Impressum p,
.Datenschutz p {
  font-size: clamp(16px, 3vw, 20px);
  font-weight: 100;
}

.Impressum a{
	text-decoration: none;
	color:#f9f9f9;
}
.Impressum a:visited{
	text-decoration: none;
	color:#f9f9f9;
}





/*================================
Media Queries
=================================*/

@media (max-width:900px){
   
    body {
        width: 90vw;
		hyphens: manual;
		overflow-wrap: break-word;
    }


	
	footer {
    flex-direction: column;
    align-items: center;
    text-align: center;
  }

  .footer_left,
  .footer_right {
    width: 100%;
    margin: 10px 0;
  }

  .footer_right ul {
    justify-content: center;
    flex-wrap: wrap;
  }
}