html {
    scroll-behavior: smooth;
}

.none{
	display:none;
} 


/*
.body{
	background-color: black;
	margin: 0; 
	
	overflow-x: hidden;
	width: 100vw;
	
} */
html, body{
    margin: 0;
    padding: 0;
    overflow-x: hidden;
    background: black;
}

.Sektion{
	width: 100%;
	margin-left: 0;
	margin-right: 0;
	position: relative;
	min-height: 100vh;
}

.Sektion_1{
	padding: 20px 0 0 0;
}

.Sektion_box{
	position: relative;
	z-index: 2;
}
.Sektion_1_Head{
	width: 80vw;
    display: flex;
}
.Sektion_1_logo{
	width: 80%;
	margin-left: 20%;
}
.Sektion_1_Headline{
	margin-top: calc(3vh + 5vw); 
	font-size: 2rem;
	color: rgb(151, 151, 151);
	background-color: rgb(58, 26, 0);
	padding: 10px 20px;
	text-align: center;
	width: 120px;
	border-radius: 20px;
}
.Sektion_hg{
	position: absolute;
	top: 0;
	height: 100vh;
	overflow: hidden;
	width: 100%;
}
.Sektion_hg_img{
	height: 100vh;
	margin-left: 50%;
	transform: translateX(-50%);
}

.Sektion_1_foot{
	position: relative;
	padding: 5vw 0 5vw 0;
}
.Sektion_1_foot_img{
	cursor: pointer;
	margin-left: 50%;
	transform: translateX(-50%);
	width: 50%;
	max-width: 200px;
}






.Sektion_2_Headline{
	margin-top: calc(3vh + 5vw); 
	font-size: 2rem;
	color: rgb(151, 151, 151);
	background-color: rgb(58, 26, 0);
	padding: 10px 20px;
	text-align: center;
	width: 120px;
	border-radius: 20%;
}

.Sektion_2_overHead{
	position: relative;
}
.Sektion_2_overHead_img{
	height: calc(5vh + 2vw);
	margin-left: 50%;
	transform: translateX(-50%);
}

.Footer{
	position: fixed;
	bottom: 10px;
	right: 5px;
	z-index: 9;
	display: flex;
    justify-content: center;
    align-items: center;
}
.Footer_body{
	padding: 10px 5px 5px 5px;
	background-color: blanchedalmond;
	border-radius: 20px;
	display: flex;
    justify-content: center;
    align-items: center;
}
.Footer_i{

}
.Footer_icon{
	margin: 0 3px 0 3px;
	height: 30px;
	border-radius: 50%;
	/*border-color: white;*/
	border: solid 2px;
} 
 
.Sektion_1_body{
	margin-top: 10px;  
	width: 100%;
}
.Sektion_1_item_body{ 
	margin-left: 50%;
	transform: translateX(-50%);
}

.Sektion_1_item_font{
	color: rgb(255, 255, 255);
	font-size: 1.2rem;
	padding: 10px;
	text-align: center;
}

.Sektion_1_item{
	user-select: none;
	z-index: 8;
	position: relative; 
	
	/*
	background: rgba(0, 133, 255, 0.823);
	background: linear-gradient(180deg, rgba(0, 132, 255, 0.823) 5%, rgba(0, 132, 255, 0.487) 55%);
	border: 5px solid rgba(0, 133, 255, 0.96);
	color: white;
	*/
	background: rgba(255, 236, 25, 0.823);
	background: linear-gradient(180deg, rgba(255, 236, 25, 0.823) 5%, rgba(203, 149, 12, 0.763) 55%);
	border: 5px solid rgba(244, 244, 244, 0.823);
	color: white;
	
	border-radius: 16px;
	box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
	backdrop-filter: blur(3px);
	-webkit-backdrop-filter: blur(3px);
	padding: 5px 10px;
}

.Sektion_1_youtube_div {
	overflow: hidden;
	border-radius: 10px;
    width: 100%;
    aspect-ratio: 16 / 9;
    position: relative;
}

.Sektion_1_youtube_div iframe {
    width: 100%;
	height: 100%;
}

.Sektion_2{
	font-size: large;
	background-color: white;
	color: black;
	min-height: 100vh;
}
.Sektion_3{
	font-size: large;
	background-color: rgb(255, 255, 255);
	color: black;
	min-height: 100vh;
}
.Sektion_4{
	font-size: large;
	background-color: white;
	color: black;
	min-height: 100vh;
}












.kontakt-box{
position: relative; 
margin-left: 50%;
transform: translateX(-50%);

	background:#1c1c1c;
padding:40px;
border-radius:15px;
width:calc(90% - 80px);
max-width: 400px;
box-shadow:0 0 25px rgba(0,0,0,0.6);
}


.kontakt-box h2{
color:white;
text-align:center;
margin-bottom:25px;
}


label{
color:#ccc;
font-size:14px;
}


input, textarea, select{
width:calc(100% - 24px);
padding:12px;
margin-top:6px;
margin-bottom:18px;
border:none;
border-radius:8px;
background:#2a2a2a;
color:white;
}


input:focus, textarea:focus{
outline:2px solid #4da3ff;
}


.send-btn{
width:calc(100% - 28px);
padding:14px;
border:none;
border-radius:10px;
background:linear-gradient(90deg,#4da3ff,#2563eb);
color:white;
font-size:16px;
cursor:pointer;
transition:0.3s;
text-align: center;
}

.send-btn_2{
display:none;
width:calc(100% - 28px);
padding:14px;
border:none;
border-radius:10px;
background:linear-gradient(90deg,#132b44,#0d2455);
color:white;
font-size:16px;
cursor:pointer;
transition:0.3s;
text-align: center;
}


.send-btn i{
margin-right:8px;
}


.send-btn:hover{
transform:scale(1.05);
}
 


.Sektion_4{
	padding-top: 80px;
}

.font_box{
	position: fixed;
	top: 50%;
	transform: translate(-50%, -50%);
	left: 50%;
	padding: 40px;
	border-radius: 20px;
	background-color: antiquewhite;
	color: #1c1c1c;
	z-index: 10;
	display: none;
}

.myButton { 
	box-shadow: 0px 0px 0px 2px #9fb4f2;
	/*background:linear-gradient(to bottom, #7892c2 5%, #2563eb 100%);*/
	background:#2563eb ;
	background-color:#2563eb;
	border-radius:10px;
	border:1px solid #4e6096;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:Arial;
	font-size:18px;
	padding:10px 20px;
	text-decoration:none;
	text-shadow:0px 1px 0px #283966;
	margin-left:  50%;
	margin-top: 15px;
	transform: translateX(-50%);   
	white-space: nowrap;
}
.myButton:hover {
	background:linear-gradient(to bottom, #476e9e 5%, #7892c2 100%);
	background-color:#476e9e;
}
.myButton:active {
	position:relative;
	top:1px;
}

.abo_close{
	position: absolute;
	right: -20px;
	top:-20px;
	width: 40px;
	cursor: pointer;
}

@media (orientation: landscape) {
    .Sektion_1_item_body {
        width: 40%;
    }
	.Sektion_1_Headline{
		margin-left: 30%;
	}
}


@media (orientation: portrait) {
    .Sektion_1_item_body {
        width: 80%;
    }
	.Sektion_1_Headline{
		margin-left: 10%;
	}
}

 
.noneHyperlink,
.noneHyperlink:hover,
.noneHyperlink:focus,
.noneHyperlink:active,
.noneHyperlink:visited{
	text-decoration: none;
	color: inherit;
	background: none;
	box-shadow: none;
	border: none;
	outline: none;
}




/* Loader */
.loader{
    display:none;
	padding: 40px;
	background: rgb(108, 108, 108);
	border: solid black 2px;
	border-radius: 10px;
	position: fixed;
	top: 50vh;
	left: 50vw;
	transform: translate(-50%, -50%);
	z-index: 99;
}

.spinner{
    border:6px solid #eee;
    border-top:6px solid #3498db;
    border-radius:50%;
    width:40px;
    height:40px;
    animation:spin 1s linear infinite;
    margin:auto;
}

@keyframes spin{
    0%{ transform:rotate(0deg); }
    100%{ transform:rotate(360deg); }
}