body {

	font-family: -apple-system, BlinkMacSystemFont, Roboto, Segoe UI,

		Helvetica Neue, Helvetica, Arial, sans-serif;

	margin: 0 auto;

	-webkit-font-smoothing: antialiased;

	box-sizing: border-box;

	color: #2f2f2f;

	line-height: 1.5;

}



a {

	text-decoration: none;

	color: #2f20d1;

}



a:hover {

	text-decoration: underline;

}



.bg-img{
	position: absolute;
	margin: 0;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	z-index: -10;
	opacity: 0.5;
	object-fit: cover;
	width: 100%;
	height: 100%;
	filter: blur(20px);
}



.phppot-container {
	width: 90%;              /* passt sich an Bildschirmbreite an */
	max-width: 400px;        /* aber nicht breiter als 740px */
	padding: 20px;

	background-color: white;

	margin: 0 auto;          /* horizontal zentrieren */

	position: relative;
	margin-top: 20px;

	box-shadow: 0 4px 12px rgba(0,0,0,0.1); /* optional für Optik */
	border-radius: 40px;      /* optional */

	border: #9a9a9a 1px solid;

}




.row {

	padding: 6px 0 6px 0;

}



.label {

	color: #565656;

	margin-bottom: 2px;

}



.card {

	padding: 1rem 2rem;

	border-radius: 4px;

	box-shadow: 0 1px 3px #747681;

}



.message {

	padding: 6px 20px;

	font-size: 1em;

	color: rgb(40, 40, 40);

	box-sizing: border-box;

	margin: 0px;

	border-radius: 3px;

	width: 100%;

	overflow: auto;

}



.error {

	padding: 6px 20px;

	border-radius: 3px;

	background-color: #ffe7e7;

	border: 1px solid #e46b66;

	color: #dc0d24;

}



.success {

	background-color: #48e0a4;

	border: #40cc94 1px solid;

	border-radius: 3px;

	color: #105b3d;

}



.validation-message {

	color: #e20900;

}



.font-bold {

	font-weight: bold;

}



.display-none {

	display: none;

}



.inline-block {

	display: inline-block;

}



.float-right {

	float: right;

}



.float-left {

	float: left;

}



.text-center {

	text-align: center;

}



.text-left {

	text-align: left;

}



.text-right {

	text-align: right;

}



.full-width {

	width: 100%;

}



.cursor-pointer {

	cursor: pointer;

}



.mr-20 {

	margin-right: 20px;

}



.m-20 {

	margin: 20px;

}





@media all and (max-width: 780px) {



}



@media all and (max-width: 400px) {







	input, textarea, select {

		width: 100%;

	}

}