ul.fieldError {
	border: 1px solid red;
	padding: 4px;
	background-color: #FFD1D1;
	list-style: none;
	color: B30000;
}


ul.fieldError:not(:has(li)) {
  display: none;
}

div.fieldError label {
	color: red !important;
}

div.fieldError input,
div.fieldError textarea,
div.fieldError select {
	outline: 1px solid red !important;

}

div.fieldError input[type="checkbox"] {
	outline-offset: 2px;
}



.displayNone {
	display: none;
}

.visibilityHidden {
	visibility: hidden;
}

a,
a:visited,
a:hover {
	text-decoration: none;
 	color: rgb(41, 196, 169);
}

a:hover {
	text-decoration: underline;
}

.menu a,
.menu a:visited {	text-decoration: none;
 	color: #333;
}

.menu a:hover {
	text-decoration: underline;
}


body {
	margin: 0px;
	background: url(/verabredung/img/canvas.jpg) repeat;
}

.main h1,
.main h2, 
.main h3 {
    font-family: 'Oxygen', Helvetica, sans-serif;
    line-height: 38px;    /* etwas mehr Luft */
    color: #333;
    margin-bottom: 16px;
}

.main h1 { font-size: 32px; font-weight: 700; }
.main h2 { font-size: 24px; font-weight: 600; }
.main h3 { font-size: 18px; font-weight: 600; }

header.topline {
	font: 15px/28px 'Georgia', serif;
	font-weight: 600;
	color: #342020;
	height: 70px;
	background-color: #FF6B6B;
}

header.topline .logo {
	width: 250px;
	position: absolute;
	right: 40px;
}

header.topline .logo img {
	width: 250px;  
}

.main {
	margin: 0 auto;
	margin-top: 20px;
	width: 80%;
	min-height: calc(100vh - 300px);
	padding: 20px;
	background-color: #fff;
	-moz-box-shadow: 0px 2px 7px #C2B9B3;
	-webkit-box-shadow: 0px 2px 7px #C2B9B3;
	box-shadow: 0px 2px 7px #C2B9B3;
	z-index: 1;
	display: block;
	background-color: white;
	display: table;
	clear: both;
}


footer.bottomline {
	font: 15px/28px 'Georgia', serif;
	color: #342020;
}

footer.bottomline .copyright {
	margin: 0 auto;
	width: 80%;
	padding-top: 20px;
	padding-bottom: 20px;
}

footer.bottomline .copyright .left {
	padding-right: 20px;
	display: inline-block;
	vertical-align: top;
	width: calc(50% - 80px);
	text-align: right;
}

footer.bottomline .copyright .middle {
	display: inline-block;
	padding-top: 15px;
	margin-top: -20px;
}

footer.bottomline .copyright .right {
	padding-left: 20px;
	display: inline-block;
	vertical-align: top;
	width: calc(50% - 80px);
}
	
footer.bottomline .menu {
	padding-top: 20px;
	padding-bottom: 20px;
	background-color: #FF6B6B;
	display: block;
}

footer.bottomline .menu ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
}

footer.bottomline .menu .service {
	padding-left: 5%;
	width: 30%;
	display: inline-block;
	vertical-align: top;
}

footer.bottomline .menu .company {
	width: 30%;
	display: inline-block;
	vertical-align: top;
}

footer.bottomline .menu .terms {
	width: 30%;
	display: inline-block;
	vertical-align: top;
}

.waitlist-box {
	max-width: 600px;
	margin: 40px auto;
}

.form .box div:has(.btn) {
	height: 50px;
}

.btn {
  margin-left: 10px;
  margin-right: 10px;
  color: rgb(255, 255, 255);
  width: auto;
  max-width: auto;
  min-width: auto;
  border-top: rgb(170, 170, 170) 1px solid;
  border-left: rgb(170, 170, 170) 1px solid;
  border-right: rgb(170, 170, 170) 1px solid;
  border-bottom: rgb(170, 170, 170) 1px solid;
  border-radius: 4px;
  background-color: rgb(41, 196, 169);
  padding: 10px;
}

a:visited.btn, a:hover.btn  {
	color: rgb(255, 255, 255);
}

.statusNotification {
	position: fixed;
	bottom: 20px;
	left: 20px;
	min-width: 100px;
	max-width: 250px;
	min-height: 50px;
	max-height: 200px;
	border-radius: 3px;
	padding: 20px;
	color: #fff;
	z-index: 9999;
	box-shadow: 0 4px 12px rgba(0,0,0,0.3);
}

.statusNotification.info {
	border-color: #467fcf;
	color: #2F5A9C;
	background-color: #C8D9F1;
}

.statusNotification.okay {
	border-color: #29C4A9;
	color: #fff;
	background-color: #29C4A9
}

.statusNotification.warning { 
	border-color: #F59E0B; 
	color: #F59E0B; 
	background-color: #FDE68A;
}

.statusNotification.error {
	border-color: red;
	color: #B30000;
	background-color: #FFD1D1;
}