html, body{
	padding: 0;
	margin: 0;
	font-family: "Montserrat", sans-serif;
}
body{
	display: flex;
	justify-content: center;
	justify-items: center;
	align-items: center;
	flex-direction: column;
}
a{
	color: white;
	text-decoration: none;
}
a:hover{
	text-decoration: underline;
}
a:visited{
	color: #cfcfcf;
}
.lander{
	width: 100%;
	height: 90lvh;
	display: flex;
	justify-content: space-between;
	justify-items: center;
	align-items: center;
	flex-direction: column;
	background-image: url(../bilder/start.jpg);
	background-size: cover;
	background-position: center;
}
.topstripe{
	background-color: #E8E6E6;
	width: 80%;
	display: flex;
	justify-content: space-between;
	justify-items: center;
	align-items: center;
	padding: 1rem;
	padding-left: 2rem;
	padding-right: 2rem;
}
.linkwrapper{
	display: flex;
	justify-content: center;
	justify-items: center;
	align-items: center;
	gap: 1.5rem;
}
.link{
	font-size: 1.2rem;
}
.link:hover{
	cursor: pointer;
	text-decoration: underline;
}
.logo{
	width: 15rem;
}
.landertextbox{
	display: flex;
	justify-content: center;
	justify-items: center;
	align-items: center;
	flex-direction: column;
	gap: 4rem;
}
.header{
	font-size: clamp(1.4rem,5vw,2.5rem);
	font-weight: 600;
	margin: 0;
	color: white;
	text-align: center;
}
.underliner{
	text-align: center;
	font-size: clamp(1rem,3vw,1.2rem);
	margin: 0;
	color: white;
}
.botstripe{
	height: 20%;
	width: 100%;
	background-color: rgba(0, 0, 0, 0.4);
	display: flex;
	justify-content: center;
	justify-items: center;
	align-items: center;
}
.button{
	color: white;
	display: flex;
	justify-content: center;
	justify-items: center;
	align-items: center;
	border: 1px solid white;
	padding: 1rem;
	padding-left: 3rem;
	padding-right: 3rem;
	transition: .6s all linear;
}
.button:hover{
	cursor: pointer;
	box-shadow: inset 500px 0px #efefef;
	color: black;
}
/*Standard--------------------------------------------------------------------*/
.grey{
	opacity: 0.6;
}
.section{
	width: 100%;
	display: flex;
	justify-content: center;
	justify-items: center;
	align-items: center;
	flex-direction: column;
}
.innerboard{
	margin-top: 4rem;
	width: min(90vw,80rem);
	display: flex;
	justify-content: center;
	justify-items: center;
	align-items: center;
	flex-direction: column;
	display: flex;
	gap: 3rem;
}
.sectionheader{
	font-weight: 500;
	margin: 0;
	font-size: clamp(1.6rem,5vw,2rem);
	text-align: center;
}
.sectiontext{
	text-align: center;
	margin: 0;
	font-size: clamp(.8rem,3vw,1rem);
	line-height: 34px;
}
.transabstand{
	width: 100%;
	height: clamp(5rem,5vw,10rem);
}
/*Section1-----------------------------------------------------------------------*/
.section1{
	background-color: #E8E6E6;
}
.sec1button{
	font-size: 1rem;
	color: white;
	display: flex;
	justify-content: center;
	justify-items: center;
	align-items: center;
	background-color: #001431;
	padding: .8rem;
	padding-left: 2rem;
	padding-right: 2rem;
	transition: .2s all linear;
	border: 1px solid #001431;
}
.sec1button:hover{
	border: 1px solid #E8E6E6;
	cursor: pointer;
	background-color: #203451;
}
.picstripe{
	margin-top: -10%;
	transform: translateY(30%);
	width: 100%;
	display: flex;
	justify-content: space-between;
	justify-items: center;
	align-items: center;
}
.sec1pics{
	width: 30%;
}
.transpic{
	transform: translateY(12%);
}
/*Section2------------------------------------------------------------------*/
.section2{
	margin-top: 8rem;
}
.in2{

}
.sec2stripewrapper{
	display: flex;
	justify-content: center;
	justify-items: center;
	align-items: center;
}
.containerwrapper{
	width: 33.33%;
	display: flex;
	justify-content: flex-start;
	justify-items: center;
	align-items: center;
	flex-direction: column;
	gap: 2rem;
}
.sec2pic{
	width: 100%;
}
.containertextwrapper{
	width: 100%;
	display: flex;
	justify-content: center;
	justify-items: center;
	align-items: center;
	flex-direction: column;
}
.sec2text{
	font-weight: 600;
}
.sec2stripe{
	width: 40%;
	border-bottom: 1px solid black;
}
/*Section3---------------------------------------------------------------------*/
.section3{
	margin-top: 8rem;
	background-color: #001431;
}
.sec3header{
	color: #cfcfcf;
}
.sec3containerwrapper{
	width: 100%;
	display: flex;
	justify-content: space-between;
	justify-items: center;
	align-items: flex-start;
}
.sec3container{
	width: 15rem;
	color: #cfcfcf;
	display: flex;
	justify-content: flex-start;
	justify-items: center;
	align-items: flex-start;
	flex-direction: column;
}
.sec3icon{
	filter: brightness(0) invert(90%);
	width: 3rem;

}
.sec3containertext{
	color: #cfcfcf;
	font-size: clamp(.8rem,5vw,1rem);
	line-height: 25px;
}
.sec3stripe{
	width: 100%;
	border-bottom: 1px solid #cfcfcf;
}
/*Section4-------------------------------------------------------------------------*/
.section4{
	margin-top: clamp(5rem,13vw,16rem);
}
.sec4containerwrapper{
	width: 100%;
	display: flex;
 	justify-content: space-between;
 	justify-items: center;
 	align-items: flex-start;
}
.sec4text{
	line-height: 25px;
	width: 19rem;
	text-align: center;
	font-size: 1rem
}
/*Section5--------------------------------------------------------------------*/
.section5{
	margin-top: clamp(5rem,13vw,10rem);
	background-color: #001431;
}
.in5{
	gap: 0;
}
.sec5header{
	color: #cfcfcf;
	margin: 0;
}
.sec5text{
	margin:0;
	margin-top: .8rem;
	color: #cfcfcf;
}
.contactwrapper{
	width: 100%;
	margin-top: 4rem;
	display: flex;
	justify-content: center;
	justify-items: center;
	align-items: center;
	flex-direction: column;
	gap: 1.5rem;
	margin-bottom: 4rem;
}
.sec5topstripe{
	width: 100%;
	display: flex;
	justify-content: space-between;
	justify-items: center;
	align-items: center;

}
.inputcontainer{
	width: 48%;
	display: flex;
	justify-content: center;
	justify-items: center;
	align-items: flex-start;
	flex-direction: column;
	gap: .4rem;
}
.inputname{
	color: #cfcfcf;
}
.inputfield{
	height: 2.5rem;
	width: 100%;
	padding-left: .4rem;
	font-size: 1rem;
}
.sendbutton{
	background-color: white;
	font-size: 1rem;
	padding: .5rem;
	padding-left: 3rem;
	padding-right: 3rem;
	transition: .6s all linear;
	border: 1px solid white;
}
.sendbutton:hover{
	color: white;
	cursor: pointer;
	box-shadow: inset 500px 0px #001431;
}
/*Section6-------------------------------------------------------------------*/
.section6{
	height: 28rem;
	background-image: url(../bilder/sec6.jpg);
	background-size: cover;
	background-position: center;
}
/*Footer----------------------------------------------------------------------*/
.footer{
	background-color: #E8E6E6;
	padding-bottom: 6rem;
}
.footerwrapper{
	margin-top: 2rem;
	width: 100%;
	display: flex;
	justify-content: space-between;
	justify-items: center;
	align-items: flex-start;
}
.footercontainer{
	display: flex;
	justify-content: center;
	justify-items: center;
	align-items: flex-start;
	flex-direction: column;
	gap: 2rem;
}
.text{
	gap: 2rem;
}
.footerheader{
	font-weight: bold;
}
.footercontactwrapper{
	display: flex;
	justify-content: center;
	justify-items: center;
	align-items: center;
	flex-direction: column;
}
.inputwrapper{
	display: flex;
	justify-content: center;
	justify-items: center;
	align-items: center;
	flex-direction: column;
	gap: 3rem;
}
.topinputs{
	display: flex;
	justify-content: space-between;
	justify-items: center;
	align-items: center;
}
.inputbox{
	width: 44%;
	display: flex;
	justify-content: center;
	justify-items: center;
	align-items: flex-start;
	flex-direction: column;
	gap: .4rem;
}
.inputboxlong{
	width: 100%;
	display: flex;
	justify-content: center;
	justify-items: center;
	align-items: flex-start;
	flex-direction: column;
	gap: .4rem;
}
.footerinput{
	width: 100%;
	border: none;
	border-bottom: 1px solid black;
	background-color: rgba(0, 0, 0, 0.0);
}
.footerbuttonsend{
	margin-top: 1rem;
	display: flex;
	justify-content: center;
	justify-items: center;
	align-items: center;
	color: black;
	border: 1px solid black;
	padding-top: .6rem;
	padding-bottom: .6rem;
	width: 100%;
	transition: .6s all linear;
}
.footerbuttonsend:hover{
	cursor: pointer;
	border: 1px solid #001431;
	box-shadow: inset 800px 0px #001431;
	color: white;
}
.endfooter{
	padding-top: 2rem;
	padding-bottom: 2rem;
	width: 100%;
	display: flex;
	justify-content: center;
	justify-items: center;
	align-items: center;
	flex-direction: column;
	background-color: #001431;
	gap: .4rem;
	font-size: clamp(.6rem,3vw,1rem);
}
.footerlinkwrapper{
	gap: .2rem;
	color: white;
	display: flex;
	justify-content: center;
	justify-items: center;
	align-items: center;
}
#extra{
	text-decoration: underline;
}
.creator{
	margin:0;
	color: white;
}
.debug{
	width: 100%;
	height: 100vh;
}


@media only screen and (max-width: 1100px) {
	.sec4text{
		width: 15rem;
	}
}
@media only screen and (max-width: 900px) {
	.topstripe{
		flex-direction: column;
		padding-left: 0;
		padding-right: 0;
		padding-bottom: 0;
		width: 100%;
	}
	.sec3containerwrapper{
		flex-direction: column;
		align-items: center;
		text-align: center;
	}
	.sec3containerheader{
		width: 100%;
		text-align: center;
	}
	.sec3container{
		width: 60%;
		align-items: center;
	}	
}
@media only screen and (max-width: 850px) {
	.sec4containerwrapper{
		flex-direction: column;
		align-items: center;
	}
	.sec4text{
		width: 75%;
	}
}
@media only screen and (max-width: 780px) {
	.underliner{
		width: 90%;
	}
}
@media only screen and (max-width: 700px) {
	.sec2stripewrapper{
		flex-direction: column;
	}
	.containerwrapper{
		width: 60%;
	}
}
@media only screen and (max-width: 650px) {
	.sectiontext{
		line-height: 25px;
	}
	.transabstand{
		height: 0rem;
	}
	.sec5topstripe{
		gap: 1rem;
		flex-direction: column;
	}
	.inputcontainer{
		width: 75%;
	}
	.footerwrapper{
		flex-direction: column;
		gap: 2rem;
		align-items: center;
	}
	.footercontainer{
		align-items: center;
		width: 75%;
		text-align: center;
		gap: .6rem;
	}
}
@media only screen and (max-width: 500px) {
	.sec3container{
		width: 75%;
	}
	.containerwrapper{
		width: 75%;
	}

}
@media only screen and (max-width: 450px) {
	.section2{
		margin-top: 6rem;
	}
}