:root {
	--head-grad-w:810px;
	--form-control-color:#000;
	--color-green0:#57793c;
	--color-green0-hl:#709c4d;
	--color-green1:#652f53;
	--color-green2:#adba74;
	--color-green3:#f6f8ed;
	--color-orange:#e57649;
	--color-orange-hl:#f9804f;
}

html, body, div, h1, h2, h3, h4, p {
	margin: 0;
	padding:0;
	font-family:Gabarito;
	color:#666;
}

html {
	background:#fff;
}

body {
	width:1024px;
	margin-left:auto;
	margin-right:auto;
	border-left: 1px solid #ccc;
	border-right: 1px solid #ccc;
	padding:0 2em;
	min-height:100vh;
	box-shadow: 0 0 16px 1px #00000020;
	position:relative;
}

h1 {
	font-size:25px;
	font-weight:900;
	text-transform:uppercase;
	text-align:center;
	padding-top:2em;
	padding-bottom:1em;
}

h2 {
	font-size:15px;
	font-weight:600;
	padding-top:2em;
	padding-bottom:1em;
}

p {
	padding-bottom:0.66em;
}

a {
	color:var(--color-green-dk);
	text-decoration:none;
	border-bottom:1px dashed var(--color-green-dk);
}

/*
.form-row {
	margin-bottom:0.5em;
}

.form-row label {
	padding-right:0.5em;
	display:inline-block;
	min-width:9em;
}

.form-row input[type=checkbox] + label {
	color:red;
	padding-left:1.4em;
	text-indent:-0.7em;
	display:block;
}
*/

.form-row label.required:after {
	content:'*';
	font-size:0.875em;
	vertical-align:super;
	padding-left:0.25em;
	font-weight:900;
}

fieldset {
	border-width:0;
}

fieldset > div {
	display:flex;
	margin-bottom:0.5em;
}

fieldset > div > * {
	align-self:baseline;
}

fieldset > div > input {
	flex-shrink:0;
}

fieldset > div > label {
	min-width:9em;
}

fieldset > div > input[type=checkbox] {
	margin: 0 0.5em 0 0;
	width:1em;
	height:1em;
}

fieldset div.error {
	display:block;
	color:red;
	font-style:italic;
}

.form-row input[type=submit] {
	border-width:0;
	background-color:rgba(122,122,122,0.7);
	color:#fff;
	padding:7px 14px;
	transition: background-color 0.2s ease;
	margin-left:6em;
	margin-top:1em;
}

.form-row input[type=submit]:hover {
	background-color:#7a7a7a;
}

.frame {
	border: 1px solid #ccc;
	margin:2em;
	padding:2em 4em;
	box-shadow: 0 0 16px 1px #00000020;
	display:grid;
}

input#processing {
	margin-top: 2em;
}

body#email {
	background:var(--color-green3);
	box-shadow: 0 0 0 0 transparent;
	border-width: 0;
}

header#email {
	display:flex;
	justify-content:center;
	align-items:end;
	/*border-bottom:2px solid #eee;*/
	margin:0 -2em 1em -2em;
	padding:1em 2em 1em 2em;
	/*box-shadow: 0 6px 6px -4px #0001;*/
	background: linear-gradient(90deg, var(--color-green2) 0%, #fff var(--head-grad-w));
	position:relative;
}

header#email::before,
main#email::before {
	content:"";
	position: absolute;
	bottom:0;
	height:1px;
	left:0;
	width:var(--head-grad-w);
	background: var(--color-green2);
}

header#email .cover-image {
	/*
	float:right;
	margin-left:2em;
	margin-top:2em;
	*/
	/*height:286px;*/
	height:355px;
	margin:0;
	/*border:1px solid #666;*/
	/*box-shadow: 2px 2px 2px 0 #0008;*/
	filter: drop-shadow(2px 2px 6px #0006);
	margin-bottom:-69px;
	margin-left:12px;
}

main#email {
	margin:3em 250px;
	padding-top:1em;
	padding-bottom:2em;
	line-height: 23px;
	font-weight:500;
	font-size:17px;
	hyphens:auto;
}

header#email h1 {
	font-size: 38px;
	flex-grow:1;
	/*text-transform: none;*/
	/*font-variant: petite-caps;*/
	margin:0 1em 0 1em;
	font-weight:600;
	color:var(--color-green0);
	text-transform: revert;
	line-height:1.03em;
	padding-top:0;
	padding-bottom:16px;
}

main#email p {
	padding-bottom: 1.2em;
}

main#email .frame {
	margin:0;
}

main#email h2 {
	padding-top:0;
	color:var(--color-green0);
	font-weight:800;
	font-size:16px;
}

main#email fieldset {
	padding:0;
	margin:0;
}

main#email fieldset > div > label {
	min-width:7em;
}

main#email input {
	border: 1px solid #dee1d0;
	border-radius: 4px;
	box-shadow:1px 1px 1px 0 #dee1d010;
	padding:7px;
}

main#email input[type='text'] {
	flex-grow:1;
}

main#email input[type='checkbox'] {
	/* hide native checkbox */
	/* Add if not using autoprefixer */
	-webkit-appearance: none;
	appearance: none;
	/* For iOS < 15 to remove gradient background */
	background-color: #fff;
	/* Not removed via appearance */
	margin: 0;

	/* new base style */
	font: inherit;
	color: currentColor;
	width: 19px;
	height: 19px;
	border: 1px solid #dee1d0;
	border-radius: 4px;
	transform: translateY(3px);	
	margin-right: 8px;
	display:grid;
	place-content: center;
}

main#email input[type='checkbox']::before {
	content:'';
	width:11px;
	height:11px;
	border-radius: 2px;
	transform:scale(0);
	transition: 120ms transform ease-in-out;
	box-shadow: inset 1em 1em var(--color-green0);
	transform:scale(0);
}

main#email input[type='checkbox']:checked::before {
	transform:scale(1);
}

main#email input[type='checkbox'] + label {
	font-size:13px;
	line-height:17px;
}

main#email .form-row label.required::after {
	font-size: 1.2em;
	vertical-align: revert;
	display: inline-block;
	transform: translateY(-0.1em);
	padding-left:0;
}

main#email .required-notice {
	border:1px solid #0002;
	border-width:1px 0;
	padding:0;
	margin:0;
	font-size:13px;
	padding-left:25px;
	flex-grow:1;
}

main#email .form-row.add-spacing {
	margin-top:2em;
}

main#email a {
	text-decoration: none;
	border-bottom:none;
	background-color: color-mix(in srgb, var(--color-green2) 25%, transparent);   /*#adba7440;*/
	color:var(--color-green0);
	padding:2px;
	transition: 100ms color ease-in;
}
main#email a:hover {
	color:var(--color-green0-hl);
}

main#email input[type='submit'] {
	padding:7px 3.5em;
	font-size:16px;
	font-weight:800;
	text-transform: uppercase;
	background-color:var(--color-orange);
	border-radius:6px;
	margin-left:auto;
	margin-right:auto;
	display:block;
	cursor:pointer;
	transition: 100ms background-color ease-in;
}

main#email input[type='submit']:hover {
	background-color:var(--color-orange-hl);
}

@media(max-width:1090px) {
	:root {
		--head-grad-w:610px;
	}
	body#email {
		width:720px;
	}
	header#email .baum-image {
		height:220px;
	}
	header#email .cover-image {
		height:285px;
		margin-left:0;
	}
	header#email h1 {
		font-size: 26px;
	}
	main#email {
		margin:3em 100px;
	}
}

@media(max-width:786px) {
	:root {
		--head-grad-w:460px;
	}
	body#email {
		width:560px;
	}
	header#email {
		padding: 0.25em 0.5em;
	}
	header#email .baum-image {
		height:200px;
	}
	header#email .cover-image {
		height:220px;
		margin-left:0px;
		margin-bottom:-30px;
	}
	header#email h1 {
		font-size: 24px;
		margin:0 0.33em 0 0.33em;
	}
	main#email {
		margin:3em 20px;
	}
}

@media(max-width:626px) {
	:root {
		--head-grad-w:70vw;
	}
	body#email {
		width:100%;
		padding: 0 0;
		box-sizing:border-box;
	}
	header#email .baum-image {
		height:auto;
		width:20vw;
	}
	header#email .cover-image {
		height:auto;
		width:25vw;
	}
	header#email {
		margin-left:0;
		margin-right:0;
		padding:0.25em 0.25em 1em 0.25em;
		overflow-x: clip;
	}

	header#email h1 {
		font-size: 4vw;
		/*line-height: 1.4em;*/
		font-weight:500;
		padding:0 0.3em 0.5em;
		flex-shrink: 1;
		max-width:50vw;
	}
	main#email {
		margin:2em 1em 0;
	}
	main#email fieldset {
		padding-left:0;
		padding-right:0;
	}

	main#email .frame {
		padding:2em 2em;
	}
}

/**********************************************************************/

.lvberlin-logo {
	padding-top:2em;
}
.lvberlin-logo img {
	width:288px;
	max-width:75%;
}

.btn-page-edit {
	/*background-color: #5e89b7;*/
	background: rgb(160,160,160);
	color: #000;
	font-size: 1.1rem;
	font-weight:100;
	border: 1px solid #999;
	border-radius:0 6px 0 0;
	padding: .25em .5em;
	margin: .5em 0.25em;
	float: right;
	position:relative;
	box-shadow:3px 2px 4px 0 #0003;
	cursor:pointer;
}

.btn-page-edit::after {
	content:'';
	position:absolute;
	top:0;
	bottom:0;
	left:0;
	right:0;
	background: linear-gradient(180deg, rgba(255,255,255,0.1) 0%, rgba(255,255,255,0.3) 23%, rgba(255,255,255,0) 100%);
}

.btn-save {
	/*background: rgb(94,137,183);*/
	background: #7bade1;
}

.btn-revert {
	background: #c6be73;
}

.center {
	display:flex;
	justify-content: center;
}

.infoheader {
	background:#f00;
	border: 2px solid #d00;
	border-top:0;
	font-size: 16px;
	font-weight: 100;
	padding:0.25em 1em;
	color:#000;
}

footer {
	position: absolute;
	bottom: 0;
	height: 1.5em;
	width: 1024px;
	text-align: center;
	border-top: 1px solid #ccc;
	color: #888;
	font-weight: 100;
	padding: .5em 0 1em;
}

footer a {
	border-bottom: 0;
	color:#777;
}

main#agb {
	padding-bottom:5em;
}

main#agb h1 {
	font-size:2em;
	font-weight: 100;
	text-transform: revert;
}

main#agb h2 {
	font-size:1.4em;
	font-weight: 700;
	padding:0;
}

main#agb h3 {
	font-size:1.1em;
	font-weight: 700;
}

@media(max-width:1090px) {
	body#agb {
		width:720px;
	}
	footer#agb {
		width:720px;
	}
}

@media(max-width:786px) {
	body#agb {
		width:560px;
	}
	footer#agb {
		width:560px;
	}
}

@media(max-width:626px) {
	body#agb {
		width:calc(100% - 1em);
		padding: 0 0.5em;
	}
	footer#agb {
		width:calc(100% - 1em);
	}
	.lvberlin-logo {
		text-align: center;
	}
	h1 {
		padding-top:1em;
	}
}
