@charset "utf-8";
.parallax-window_short{
	flex-direction: column;
	color:#DFDFDF;
	justify-content: center;
}

.parallax-window_short h1{
	line-height: .6;
	color: rgba(67,236,113,1.00);
	color:white;
}
.parallax-window_short p{
	font-size: 15pt;
	font-family: bureau-grot, sans-serif;
	font-weight: 300;
	line-height: 1;
	color: rgba(67,236,113,1.00);
}

#contact{
	width:80%;
	margin:50px auto;
	display:flex;
	justify-content: space-around;
	align-items: flex-start;
	min-height: 40vh;
}

.contact_box{
	display:flex;
	justify-content: center;
	align-items: center;
}

.contact_circle{
	height:100px;
	width:100px;
	margin:50px;
	border-radius: 50px;
	display:flex;
	justify-content: center;
	align-items: center;
	background-color:#444444;
}
.contact_circle img{
	max-width:50%;
	max-height:50%;
}

.contact_text{
	height:100px;
	display:flex;
	flex-direction: column;
	justify-content: center;
}
.contact_text h2{
	font-size: 15pt;
	font-family: bureau-grot, sans-serif;
	font-weight: 500;
	line-height: 1;
	margin-bottom:10px;
}
.contact_text p{
	margin-top:10px;
	font-size: 12pt;
	font-family: bureau-grot, sans-serif;
	font-weight: 300;
	line-height: 1;
}

#form{
	width:100%;
	display:flex;
	justify-content: center;
	flex-direction: column;
	align-items: center;
	margin-bottom:50px;
}
#form h2{
	text-transform: uppercase;
	font-family: bureau-grot, sans-serif;
	font-weight: 800;
	letter-spacing: 5px;
	color:#111111;
}
#contact_form{
	display:flex;
	flex-direction: column;
	justify-content: center;
	font-size: 15pt;
	width:900px;
}
#contact_form input:focus{
  	outline: 2px solid rgba(67,236,113,.5);
}
#contact_form textarea:focus{
  	outline: 2px solid rgba(67,236,113,.5);
}
#contact_form input.checked:invalid{
  	background:rgba(145,70,60,.8);
  	outline: none;
}
#contact_form textarea.checked:invalid{
  	background:rgba(145,70,60,.8);
  	outline: none;
  	
}

#contact_form *::placeholder{
	color: rgba(255,255,255,.5);
}

.row{
	width:100%;
	margin:0;
	padding:0;
	display:flex;
	justify-content: space-between;
}

.button_row{
	width:100%;
	margin:0;
	padding:0;
	display:flex;
	justify-content: center;
}

#name, #vorname, #email, #telefon{
	width:48%;
	margin:10px 0;
	padding:0;
	border:2px solid #444444;
	height:50px;
	background:#666666;
	color:#ffffff;
	padding-left:1%;
	flex-shrink: 1;
	font-size: 12pt;
}
#nachricht{
	width:calc(100% - 10px);
	resize: none;
	border:2px solid #444444;
	height:200px;
	margin:10px 0;
	background:#666666;
	color:#ffffff;
	vertical-align: top;
	font-size: 12pt;
	padding:0;
	padding-left:6px;
	padding-top:6px;
	font-family: bureau-grot, sans-serif;
}

#prog_button1{
	width: 150px;
	height: 50px;
	background: none;
	border: 5px solid rgba(67,236,113,1.00);
	font-size: 15pt;
	color: rgba(67,236,113,1.00);
	font-weight: 600;
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
	border-radius: 35px;
	outline:none;
	padding:0;
	
	transition: color .3s, border-color .5s, background-color .3s, width .5s;
	-moz-transition: color .3s, border-color .5s, background-color .3s, width .5s;
	-webkit-transition: color .3s, border-color .5s, background-color .3s, width .5s;
	-o-transition: color .3s, border-color .5s, background-color .3s, width .5s;
	transition-timing-function: ease;
	-moz-transition-timing-function: ease;
	-webkit-transition-timing-function: ease;
	-o-transition-timing-function: ease;
	
	user-select: none;
	-moz-user-select: none;
	-webkit-user-select: none;
	-o-user-select: none;
	
}

#prog_button1:hover {
	background-color: rgba(67,236,113,1.00);
	color: #555555;
	cursor: pointer;
}

#canvas{
	position:absolute;
	pointer-events: none;
	display:none;
}

#button-container{
	display:flex;
	justify-content: center;
	align-items: center;
}

#danke{
	width:100%;
	height:100vh;
	height:calc(100vh - 260px);
	padding-top:60px;
	display:flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
}
#danke h1{
	font-family: bureau-grot, sans-serif;
	font-size: 25pt;
	color:#1A1A1A;
}
#danke p{
	font-family: bureau-grot, sans-serif;
	font-size: 12pt;
	color:#111111;
	margin:10px 0;
}
#danke a{
	font-family: bureau-grot, sans-serif;
	font-size: 10pt;
	color:#111111;
	text-decoration: none;
	text-transform: uppercase;
}
#danke a:hover{
	text-decoration: underline;
}
#danke a:visited{
	color:#111111;
}

@media all and (max-width:1400px){
	#contact{
		width:95%;
	}
}
@media all and (max-width:1200px){
	.contact_circle{
		margin:25px;
	}
}
@media all and (max-width:1100px){
	#contact{
		flex-wrap: wrap;
	}
}
@media all and (max-width:900px){
	#contact_form{
		width:95%;
	}
}
@media all and (max-width:700px){
	#contact{
		flex-direction: column;
		width:100%;
	}
}
@media all and (max-width:900px){
	#contact_form{
		width:95%;
	}
	.row{
		flex-direction: column;
	}
	#name, #vorname, #email, #telefon{
		width:calc(100% - 10px);
		padding-left:6px;
		font-size:16px;
	}
	#nachricht{
		font-size: 16px;
	}
}
@media all and (max-width:350px){
	.contact_circle{
		width:80px;
		height:80px;
	}
	.contact_text h2{
		font-size: 12pt;
	}
	.contact_text p{
		font-size: 10pt;
	}
}
@media all and (max-width:280px){
	#contact{
		width:90%;
	}
	
	.contact_circle{
		display:none;
	}
}