/* Formular
************************************************/
.preamble {
	display: block;
}

.ArrowDown {
	position: absolute;
	display: inline-block;
	width: 0;
	height: 0;
	margin: 18px 0 0 -27px;
	border-style: solid;
	border-width: 9px 5px 0 5px;
	border-color: #555 transparent transparent transparent;
	pointer-events: none;
}

.box {
	padding: 15px 10px 15px 20px;
	margin-bottom: 10px;
	border: solid 1px #999;
	border-radius: 4px;
	background-color: #FAFCFD;
	color: #555;
	font-size: 20px;
	line-height: 150%;
	-ms-user-select: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	user-select: none;
}

	.box::after {
		content: "";
		clear: both;
		display: table;
	}

	.box:first-of-type {
		margin-bottom: 30px !important;
	}

	.box label {
		display: inline-block;
		width: 130px;
		margin: 10px 5px 5px 5px;
		padding: 0;
		text-align: right;
		vertical-align: top;
		color: #0E4A74;
		font-size: 20px;
	}

	.box input[name="Anreise"],
	.box input[name="Abreise"] {
		width: 130px;
	}

	.box select[name="Personen"],
	.box select[name="Erwachsene"],
	.box select[name="Kinder"],
	.box select[name="Kinderbetten"] {
		width: 130px;
	}

	.box input, 
	.box select, 
	.box textarea {
		box-sizing: border-box;
		width: 310px;
		height: 32px;
		margin: 6px 5px;
		padding: 0 0 0 6px;
		border: solid 1px #CCC;
		border-radius: 4px;
		color: #333;
		background-color: #FFF;
		font-family: Arial;
		font-size: 16px;
		-webkit-appearance: none;
	}

	.box textarea {
		padding: 5px 0 0 6px;
		margin-bottom: 10px;
		height: auto;
	}

	.box input[name="Plz"] {
		width: 100px;
	}

	.box input[type="radio"] {
		width: 35px;
		height: 2px;
		margin: 30px 0 0 33px;
		position: absolute;
		border: none;
		box-shadow: none!important;
		-webkit-appearance: none;
		-moz-appearance: none;
		-ms-appearance: none;
		appearance: none;
		
	}

		.box input[type="radio"] + label {
			box-sizing: border-box;
			display: inline-block;
			width: 70px;
			height: 32px;
			margin: 4px 5px 5px 6px;
			padding: 0 0 0 30px;
			line-height: 34px;
			text-align: left;
			border-radius: 4px;
			color: #333;
			cursor: pointer;
			background: transparent url(data:image/gif;base64,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) no-repeat 5px center;
			background-size: 20px;
		}

		.box input[type="radio"]:checked + label {
			background: transparent url(data:image/gif;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAMAAAFe5kgVAAAAK3RFWHRDcmVhdGlvbiBUaW1lAE1vIDE4IE1yeiAyMDE5IDE5OjE5OjAxICswMTAwgmQNmAAAAAd0SU1FB+MDExIwJKXv5BEAAAAJcEhZcwAACvAAAArwAUKsNJgAAAAEZ0FNQQAAsY8L/GEFAAADAFBMVEUIjL0YlMYhlMYhnMYpnMYxnM4xpc45pc5Cpc5Krc5SrdZatdZjtdZrvdZzvd57xt6Ext6Mzt6Uzueczuec1uel1ue13u+93u/G5+/O5/fW7/fe7/fn9/fv9//3///6/P3///8AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABzMZKpAAADRUlEQVR42n1Vi5ajIAy9vupqtTPWbVFR4f+/cpMAitZuzjgVwg153EQYY0Z6YGCtpf/GArAGo/zetvWmN9sjP8ra1dAJ+VuA8GpLgpLwybp0gAb10iERXEPAEU9vtKF3ltLOHUxvH7KCXe/u4gRYt+szeq13J6bRu0JPMiy51zCMJFfe98wH0Gqr2XZrJTLrb4oXw1mTWVttC7b2Ahpr/0zka+XuUTlfqghrF9y9b+8ET7Nny5jW2UQxGWN2TYpCOzN2/QVU0KQI215yaBdcwSvtrbXiAH44Ugkbu0y0/IXGxJ4RPhI5WWKUM7ECM29Q7d01keIpFymYQV59VkgWdh0F+6apiiK6G3xu0PhIeyRRRHfkcXbYWHJjF9Mhzo6TcZyiVdAMmXfg56jh1BTdsqiaXrpI0wN9uH+kvG+aHuUaZbrffFOojkVQKD3FErdBbPX167jeoEh0nB1ODlFYuiw7pE1Ub/w1eIMagnkVRA4iNajh4DiAiOZIWDPHhavFB2IBF+55qCnHy5pEIogkl3sN8jN18LLSaOjkxjrSrNZ1ghbuRS78WOZ/RZGKcxtF8XAF5xy83GIWg5lwZKZAOaNlILzqZ/eSbhPn1As5hlBT3wFOhqh/2CBaSf/6ogxOMXd4A8WNnbifWGV0RzRMGvXBt130u6tzqUpSNk/1oT9BXpWvYFLcbqEN0/vwDaJKyU47LBsr1+VVi5H7dAHp2XZ7mhc+JXcuszpBGFBdng8TjUBxI2pyqTwAtOr6YT6AUnCze8grFF5k9u5LYM2wxTX/oUxMDjIkbsg48xVO8lhCLiikQiA628s/fwACJ1kW8r9iSEfYYKjGpTzX0OtMJ5h8HxsPfJGXd61mQtFYRTLtRq4l98mjRN0EEvx6foXAD9VRIFOybcz5N0TtPae4S4qllo+XM5JcI8plt9kR5M1psJuvF5L5WOljg1RzKelblwW26IvCtKEEbPyvI0yF/Uv4AdoAViVu4AstG0p08E1iesg3oXjGVO24pjv5mab/475jf6kPLcYNU6r1+vza51GP7Y3cp+xLf75rHX9FcT1hdONHRd0NC4miUeN2uu8ThpqnzY4ZK36m05HPOSYyjePx+xrJP50Dubmzk4zPAAAAAElFTkSuQmCC) no-repeat 5px center;
			background-size: 30%;
		}

	.box .checkboxContainer {
		display: inline-blo	ck;
		width: 316px;
		line-height: 140%;
		padding: 2px 3px 5px 3px;
		margin-left: 2px;
		vertical-align: top;
		border: solid 1px transparent;
	}

		.box .checkboxContainer span {
			font-size: 20px;
			vertical-align: top;
		}

	.box input[type="checkbox"] {
		display: none;
	}

	.box input[type=checkbox]:checked + label {
		background: white url(data:image/gif;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyBAMAAAGbFqUUAAAAK3RFWHRDcmVhdGlvbiBUaW1lAE1pIDMwIEphbiAyMDE5IDE0OjE3OjEyICswMTAwpRX4OAAAAAd0SU1FB+MBHg83GFmVtc8AAAAJcEhZcwAACxIAAAsSAdLdfvwAAAAEZ0FNQQAAsY8L/GEFAAAALVBMVEX////3+/PN37W1zpTi7dhCcwBzmzv3//fz9+tUgxdKdwCat2/n99b///fv997aLqGmAAABsUlEQVR42oVTPU/DQAy9tEnpx9IF5kpQBqZKVSUQS5cisaVFLkoqpDJkr4TYWUBiA4lIjAiUiYUlP4GdiYWFpQu/Att3Tdz2onq4O9+zn5+di1LaPFp83L0WLoCO66slw4iSr3zc2hQnUePMzXZOV2MmUQpA3xpX2i2vtZGO63DUWDuYk3bqlBL56QUBAfO4sGDlrecrq5Xlfaqp2RyAVuYg2Yd0XrT8KYdphgEVSmBsggCGgzypDmhnGUOMXl7JA5gIEQBTtcl2OsJpgOjBSUIBtY1SExcIKJJQDeTMYxguQX0JGalRU6nKosE5cfXAVE4wBmdkOLYBmtdZT2WAhzgvhqFiLp80JV8UFlNyyct1JHKc2KYcgSc/FlWcbZyntOpeAbAPYL0vRQDvNuAEJb/ZgKMCwEkRGFkAN156P6I2AZNZARD8FlCF4p0fm6BqRCPOJ3eF3/qLDlukCi4z4JTcJzod0Em83R/y6be5oz1sibJ/+g8oQ5acCeC6h7yuCP5mGk55XmmDNXFKcwVpLJDHtd5NUnCzhlTAWoW6Z2Fh3zL8e0JeLYBydrvdri3Fav9+pIgJjG8BVQAAAABJRU5ErkJggg==) no-repeat center;
		background-size: 80%;
	}

	.box .checkboxLabel {
		display: inline-block;
		float: left;
		width: 26px;
		height: 26px;
		margin: 1px 8px 0 0;
		border: solid 1px #CCC;
		background: white url() no-repeat;
		cursor: pointer;
	}

	.box .inputHover {
		border: solid 1px #666;
	}

	.box input:focus, 
	.box select:focus, 
	.box textarea:focus {
		border: solid 1px #55A2E9;
		box-shadow: 0 0 3px #55A2E9;
		-webkit-appearance: none;
		-moz-appearance: none;
		appearance: none;
		outline: none;
	}

	.box input[type="text"]:disabled {
		background-color: transparent;
		border-color: transparent;
		-webkit-text-fill-color: #333;
		-webkit-opacity: 1;
		margin: 0 5px;
	}

	.box .invalid {
		border: solid 1px #f33b1d !important;
		outline: none !important;
	}

	.invalidBox {
		display: none;
		padding-top: 10px;
	}

	.invalidMessage {
		margin: 20px 0 20px 0;
		padding: 10px;
		color: #f33b1d;
		font-size: 20px;
		border: solid 1px #f33b1d;
		border-radius: 4px;
		animation-iteration-count: infinite;
	}

@keyframes shake {
	0% {transform: translate(1px, 1px) rotate(0deg);}
	10% {transform: translate(-1px, -2px) rotate(-1deg);}
	20% {transform: translate(-3px, 0px) rotate(1deg);}
	30% {transform: translate(3px, 2px) rotate(0deg);}
	40% {transform: translate(1px, -1px) rotate(1deg);}
	50% {transform: translate(-1px, 2px) rotate(-1deg);}
	60% {transform: translate(-3px, 1px) rotate(0deg);}
	70% {transform: translate(3px, 1px) rotate(-1deg);}
	80% {transform: translate(-1px, -1px) rotate(1deg);}
	90% {transform: translate(1px, 2px) rotate(0deg);}
	100% {transform: translate(1px, -2px) rotate(-1deg);}
}

.buttonStandard {
	display: block;
	width: 200px;
	height: 45px;
	margin: 20px 0 20px 160px;
	padding: 8px 2px 8px 2px;
	border: solid 1px #666;
	cursor: pointer;
	background: #ddd;
	background-image: linear-gradient(to bottom, #f4f5f6, #cacaca);
	color: #333;
	font-family: Arial;
	font-size: 16px;
	-ms-user-select: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	user-select: none;
	border-radius: 4px;
}

	.buttonStandard:hover,
	.buttonStandard:focus {
		background-image: linear-gradient(to bottom, #f2f5f6, #aaa);
	}

.starBox::before {
	content: '*';
	margin-left: 2px;
	margin-right: 2px;
	color: #f33b1d;
	font-family: verdana;
	font-size: 15px;
	vertical-align: middle;
}

@media screen and (max-width: 610px) {
	.box input, 
	.box select, 
	.box textarea, 
	.box .checkboxContainer {
		width: 63%;
	}

	.box label {
		margin-left: 0;
		width: 130px;
	}
}

@media screen and (max-width: 500px) {
	.box .starBox::before {
		content: '';
		margin: 0;
	}

	.box .starBox::after {
		content: '*';
		margin-left: 2px;
		margin-right: 2px;
		color: #f33b1d;
		font-family: verdana;
		font-size: 15px;
		vertical-align: middle;
	}

	.box label {
		display: block;
		text-align: left;
		height: auto;
		line-height: normal;
		margin: 15px 0 0 6px;
	}

	.box input[type="radio"] + label {
		display: inline-block;
		margin: 5px 10px 5px 0;
	}

	.box input, 
	.box select, 
	.box textarea {
		width: 94.5%;
		margin: 1px 5px 1px 4px;
	}

	.box .checkboxContainer {
		width: 98%;
		margin: 1px 5px 1px 0;
	}

	.box input[type="text"]:disabled {
		padding-left: 1px;
	}

	.box input[type="radio"] {
		margin-top: 10px;
	}

	.buttonStandard {
		margin-left: auto;
		margin-right: auto;
	}
}