p, h1, h2, h3, h4, h5, ul {
	margin: 0;
	padding: 0;
}

ul {
	list-style: none;
}

.group:after {
	content: "";
	display: table;
	clear: both;
}

.right-column {
	box-sizing: border-box;
	width: 360px;
	float: right;
}

.left-column {
	box-sizing: border-box;
	width: 335px;
	float: left;
}

.greenyellow {
	background-color: #85b200;
}

.orange {
	background-color: #F66;
}

.gray {
	background-color: #C5C5FE;
}

.circle {
	display: inline-block;
	width: 10px;
	height: 10px;
	border-radius: 50%;
	margin-right:10px;
}

.down-arrow {
	position: relative;
	float: right !important;
	width: 24px;
	height: 24px;
	background-image: url(../images/icons/arrow_down_4.png);
	background-size: cover;
}

span.down-arrow {
	position: relative;
	background-image: url(../images/icons/arrow_down.png);
	background-size: cover;
	width: 16px;
	height: 16px;
}

span.up-arrow {
	background-image: url(../images/icons/arrow_up.png);
}

.medium {
	width: 20px;
	height: 20px;
}

.small {
	width: 16px;
	height: 16px;
}

.up-arrow {
	background-image: url(../images/icons/arrow_up_4.png);
}


/***************************************************************************************/
/*	Allgemein */
/***************************************************************************************/

body {
	width: 875px;
	/* margin: 0 auto; */
	padding-top: 10px;
	padding-bottom: 50px;
	font-size: 14px;
}

fieldset {
	margin: 0;
	padding: 0;
	border: thin solid #D7D7D7;
	border-radius:3px;
}

fieldset + fieldset {
	margin-top: 15px;
}

fieldset > header {
	padding: 15px;
}

fieldset > header > div {
	line-height: 27px;
}

fieldset > section {
	padding: 20px 15px;
}

fieldset > header,
#selectedRooms header {
	/*border-bottom: solid thin #D7D7D7;*/
	cursor: pointer;
	border-top-left-radius:3px;
	border-top-right-radius:3px;
}

fieldset > header > h2 {
	display: inline-block;
}

fieldset > header div, .zimmer > header:first-child > div {
	float: right;
}

fieldset > header p, #selectedRooms header p {
	margin-left: 15px;
	display: inline-block;
}

.button {
	padding: 0.3em 1em;
	color: white;
	cursor: pointer;
	transition: 0.1s ease-out;
	border-radius:3px;
	font-size:16px;
}

.anfragebutton {
	padding: 0.3em 1em;
	color: white;
	cursor: pointer;
	transition: 0.1s ease-out;
	border-radius:3px;
	font-size:16px;
	background-color:#f66;
}


.button:hover,
input[type=submit]:hover {
	transition: 0.3s;
}

.anfragebutton:hover {
	transition: 0.3s;
	color:black;
}




/***************************************************************************************/
/*	Überschriften */
/***************************************************************************************/

h1 {
	font-weight: normal;
	padding-left: 5px;
}

/* h2, h3, h4 {
	font-family: open-sans, sans-serif;
} */

h2 {
	font-weight: lighter;
	font-size:1.5em;
}

h3 {
	font-weight: normal;
	font-size: 1.5em;
}

h4.zimmer-bezeichnung {
	display: inline-block;
	font-weight: 300;
	font-size: 1.3em;
}

.zimmer-bezeichnung.selected + .down-arrow:before {
	position: absolute;
	margin-left: 10px;
	top: 0;
	left: -40px;
	color: #8AB72F;
	font-family: entypoj, sans-serif;
	font-size: 2em;
	content: "\2713";
}


/***************************************************************************************/
/*	Navigation */
/***************************************************************************************/

a {
	text-decoration:none;
}

.tabs {
	border-bottom: thin solid #D7D7D7;
}

.tabs > button {
	padding: .5em 2em;
	border: thin solid #D7D7D7;
	border-bottom: none;
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
	background-color: white;
}

.tabs > button.active {
	background-color: #D7D7D7;
}


/***************************************************************************************/
/*	Formulare */
/***************************************************************************************/

input[type=text],
input[type=email],
input[type=tel],
input[type=password] {
	line-height: 22px;
	padding-left:6px;
	border: 1px solid #d7d7d7;
}

select,
textarea {
	border: 1px solid #d7d7d7;
	padding:2px 6px;
}

.required:after {
	content: " *";
	vertical-align: top;
	font-size: 0.8em;
	color: #990000;
}


/***************************************************************************************/
/*	Fehlerbehandlung */
/***************************************************************************************/

label.error {
	width: auto !important;
	margin-left: 153px;
	color: #911e23;
	font-size: 12px;
	padding:2px;
}


/***************************************************************************************/
/*	Reisedatum */
/***************************************************************************************/

.legende {
	margin-top: 10px;
	padding: 10px;
	background-color: white;
	border: thin solid #DDDDDD;
	border-radius: 3px;
}

.legende p {
	display: inline-block;
}

.legende span {
	margin-left: 15px;
}

.square {
	display: inline-block;
	vertical-align: middle;
	width: 1em;
	height: 1em;
}


/***************************************************************************************/
/*	Zimmer */
/***************************************************************************************/

#angeboteZimmer {
	margin-top: 20px;
}

#angeboteZimmer h3 {
	display: inline-block;
}

#selectedRooms header {
	background-color: #e3dfd8;
}

#selectedRooms section header {
	border-radius:3px;
}

div.erwachsenen-auswahl {
	display: inline-block;
}

div.kinder-auswahl {
	display: inline-block;
	margin-left: 20px;
}

li.zimmer {
	/*border: thin solid #D7D7D7;*/
}

li.zimmer > section {
	background-color: white;
}

li.zimmer > header {
	padding: 10px;
}

li.zimmer > header > div {
	line-height: 1.75em;
}

#selectedRooms > li + li {
	margin-top: 5px;
}



#selectedRooms > li > section {
	padding: 20px;
	border-radius:3px;
}


ul.alter {
	margin-top: 15px;
}

ul.alter li + li {
	margin-top: 5px;
}


ul.zimmer-typen {
	margin-top: 15px;
}

ul.zimmer-typen > li {
	background-color: white;
}

ul.zimmer-typen li > header {
	padding: 10px;
}

ul.zimmer-typen > li + li {
	margin-top: 10px;
}

ul.zimmer-typen div.left-column,
ul.zimmer-typen div.right-column
{
	padding: 10px;
}

ul.preis-liste > li {
	padding-left: 10px;
	border-radius: 4px;
	overflow: hidden;
}

ul.preis-liste > li:nth-child(even) {
/*	background-color: #f9f9f9; */
}

ul.preis-liste > li > label {
	display: inline-block;
	padding: 0;
	width: 100%;
	height: 45px;
	line-height: 45px;
	cursor: pointer;
}

ul.preis-liste > li > label > input {
	margin-right: 4px;
	vertical-align: middle;
}


span.preis {
	float: right;
	padding: 0 10px 0 0;
	width:110px;
	text-align: right;
	background-color: #B22D00;
	color: white;
	font-size:14px;
}


span.rate-bezeichnung {
	display: inline-block;
	max-width: 155px;
	max-height: 100%;
	padding: 2px 0;
	overflow: hidden;
	vertical-align: middle;
	line-height: normal;
	font-size:14px;
}


/* Slider */
.flexslider {
	margin-top: 15px;
	margin-bottom: 40px;
}

.flex-direction-nav a:before {
	font-size: 20px;
}

.flex-control-nav li {
	bottom: -30px;
	margin: 0 8px;
}

a.delete-room-button {
	display: none;
	position: absolute;
	top: 10px;
	right: -25px;
	color: #969696;
}


/***************************************************************************************/
/*	Zusatzleistungen */
/***************************************************************************************/

fieldset#zusatz > section {
/*	background-color: white; */
}

#zusatzListe {
	width: 75%;
}

/***************************************************************************************/
/*	Persönliche Angaben	*/
/***************************************************************************************/



fieldset#gast-daten input[type=text],
fieldset#gast-daten input[type=email],
fieldset#gast-daten input[type=password],
fieldset#gast-daten input[type=tel] {
	width: 200px;
}

div.gast-login {
	width: 50%;
	margin-bottom: 30px;
	padding: 1em;
	border: solid thin #d7d7d7;
	background-color: #e3dfd8;
}

div.gast-login > div + div {
	margin-top: 10px;
}

section.personal > p {
	margin-bottom: 10px;
}

section.personal label {
	display: inline-block;
	width: 150px;
}

section.personal p + p {
	margin-top: 10px;
}

#gast-daten textarea {
	box-sizing: border-box;
	width: 100%;
}


/***************************************************************************************/
/*	Buchungsübersicht */
/***************************************************************************************/

div#rechnung p > span,
div#rechnung li > span {
	float: right;
}

div#rechnung > div + div {
	margin-top: 20px;
}

div#rechnung li + li {
	margin-top: 30px;
}

p.zusammenfassung {
	margin-bottom: 20px;
	line-height:22px;
}

p.zusammenfassung > span {
	display: inline-block;
	width: 100px;
}

p.summe {
	margin-bottom: 10px;
}

p.total {
	margin-top: 15px;
	font-size: 1.4em;
	margin-bottom: 10px;
}

p.indent {
	margin-left: 25px;
	line-height:20px;
	font-size:14px;
}

p.rechnung > span,
p.summe > span,
p.total > span {
	/*margin-right: 20px;*/
	float: right;
}

input[type=submit] {
	font-size: 1.4em;
	border: none;
	float: right;
}


/* Tablet */
@media only screen and ( min-width: 769px ) and ( max-width: 972px ) {
	/* Allgemein */
	body {
		width: 100%;
	}

	fieldset > header div,
	.zimmer header:first-child > div {
		float: none;
	}

	fieldset > header p,
	#selectedRooms header p {
		margin: 0;
	}


	span.down-arrow {
		margin-left: 5px;
		margin-right: 2px;
	}


	span.rate-bezeichnung {
		font-size: 13px;
	}

	a.delete-room-button {
		right: -15px;
	}

	/* Persönliche Angaben */
	section.personal label {
		display: block;
	}

	fieldset#gast-daten input[type=text],
	fieldset#gast-daten input[type=email],
	fieldset#gast-daten input[type=password],
	fieldset#gast-daten input[type=tel]  {
		width: 245px;
	}

	label.error {
		margin-left: 0;
	}


	/* Buchungsübersicht */
	label#agb {
		display: inline-block;
		max-width: 300px;
	}
}


/* Smartphone */
@media only screen and (max-width: 768px) {
	/* Allgemein */
	body {
		width: 100%;
	}

	h2 {
		font-size: 1.4em;
	}

	fieldset > section {
		padding: 10px;
	}

	fieldset > header div,
	.zimmer header:first-child > div {
		float: none;
	}

	fieldset > header p,
	#selectedRooms header p {
		display: block;
		margin: 0;
	}

	.left-column,
	.right-column {
		width: 100%;
		float: none;
	}

	.legende p {
		display: block;
	}

	.down-arrow {
		margin-left: 0;
	}


	/* Zimmer */
	#selectedRooms > li > header {
		margin: 0px;
	}

	#selectedRooms > li > section {
		padding: 10px;
	}

	div.erwachsenen-auswahl {
		display: block;
	}

	div.kinder-auswahl {
		display: block;
		margin-top: 10px;
		margin-left: 0;
	}

	div.erwachsenen-auswahl label,
	div.kinder-auswahl label {
		display: inline-block;
		width: 100px;
	}

	h4.zimmer-bezeichnung {
		max-width: 220px;
	}

	span.rate-bezeichnung {
		/* max-width: 90px; */
	}

	a.delete-room-button {
		right: -10px;
	}


	/* Zusatzleistungen */
	#zusatzListe {
		width: 100%;
	}


	/* Persönliche Angaben */
	section.personal label {
		display: block;
	}

	fieldset#gast-daten input[type=text],
	fieldset#gast-daten input[type=email],
	fieldset#gast-daten input[type=password],
	fieldset#gast-daten input[type=tel]  {
		width: 100%;
	}

	label.error {
		margin-left: 0;
	}


	/*Buchungsübersicht */
	input[type=submit] {
		margin-top: 25px;
	}
}
