/**
 * PHOENIX release
 *
 * @branch          stonehenge
 * @version         0.1 alpha
 *
 * @author:         alexander stroick
 * @author:         marvin biebrach
 * @author:         monika grünberg
 */
@media screen, projection
{
	div.bookingStep {
		display: block;
		margin: 0 0 10px 17px;
		background-color: #F2F2F2;
	}	
	div.bookingStep4 {
		padding-bottom: 10px;
	}

/**
* header & highlightboxes
* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
*/
	.bookingStep .stepHeader, .bookingStep .stepSubHeader {
		height: 23px;
		background-color: #DFDFDF;
		background-repeat: no-repeat;
		background-position: 0 0;
		padding: 0 0 0 47px;
		line-height: 2em;
		border-style: solid;
		border-width: 0 0 2px;
		border-color: #FFFFFF;
	}
	.bookingStep .stepSubHeader {
		padding: 0 0 0 10px;
		margin: 0 0 10px 0;
		line-height: 2em;
		border: 0;
	}

	.bookingStep .stepHeader span.headerText {
		float: left;
	}
	
	.bookingStep.step1 .stepHeader {
		background-image: url("/global/img/booking/step01.gif");
	}
	.bookingStep.step2 .stepHeader {
		background-image: url("/global/img/booking/step02.gif");
	}
	.bookingStep.step3 .stepHeader {
		background-image: url("/global/img/booking/step03.gif");
	}
	.bookingStep.step4 .stepHeader {
		background-image: url("/global/img/booking/step03.gif");
	}
	.bookingStep.step5 .stepHeader {
		background-image: url("/global/img/booking/step04.gif");
	}
	
	body#telegate .bookingStep.step1 .stepHeader {
		background-image: url("/11880/img/booking/step01.gif");
	}
	body#telegate .bookingStep.step2 .stepHeader {
		background-image: url("/11880/img/booking/step02.gif");
	}
	body#telegate .bookingStep.step3 .stepHeader {
		background-image: url("/11880/img/booking/step03.gif");
	}
	body#telegate .bookingStep.step4 .stepHeader {
		background-image: url("/11880/img/booking/step03.gif");
	}
	body#telegate .bookingStep.step5 .stepHeader {
		background-image: url("/11880/img/booking/step04.gif");
	}

	.bookingStep h4 {
		float: left;
	}	
	/*  @todo! */
	.bookingStep .gesamt {
		height: 10px;
		display: block;
		float: left;
		margin: 0 0 0 10px;
		width: 130px;
		padding: 0 10px 0 0;
		font-size: 133%;
		font-weight: bold;
		text-align: right;
	}


/**
* header- and background-images
* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
*/
	body .introImage img {
		margin: 0 0 10px 17px;
	}
	.bookingStep.step1 .choiceProduct {
		width: 270px;
		height: 105px;
		background-color: #EBEBEB;
		background-repeat: no-repeat;
		background-position: 0 0;
		line-height: 2em;
	}
	.bookingStep.step1 .choiceProduct.allMedia {
		float: left;	
		margin: 0 10px 28px 0;
	}
	.bookingStep.step1 .choiceProduct.online {
		float: right;
		margin: 0 10px 28px 0;	
	}
	
	.bookingStep.step1 #klassikBox .choiceProduct.allMedia {
		background-image: url("/global/img/booking/me_klassik.gif");
	}
	.bookingStep.step1 #klassikBox .choiceProduct.online {
		background-image: url("/global/img/booking/me_klassikonline.gif");
	}
	.bookingStep.step1 #komfortBox .choiceProduct.allMedia {
		background-image: url("/global/img/booking/me_komfort.gif");
	}
	.bookingStep.step1 #komfortBox .choiceProduct.online {
		background-image: url("/global/img/booking/me_komfortonline.gif");
	}
	.bookingStep.step1 #premiumBox .choiceProduct.allMedia {
		background-image: url("/global/img/booking/me_premium.gif");
	}
	.bookingStep.step1 #premiumBox .choiceProduct.online {
		background-image: url("/global/img/booking/me_premiumonline.gif");
	}
	
	body#telegate .bookingStep.step1 #klassikBox .choiceProduct.allMedia {
		background-image: url("/11880/img/booking/me_klassik.gif");
	}
	body#telegate .bookingStep.step1 #klassikBox .choiceProduct.online {
		background-image: url("/11880/img/booking/me_klassikonline.gif");
	}
	body#telegate .bookingStep.step1 #komfortBox .choiceProduct.allMedia {
		background-image: url("/11880/img/booking/me_komfort.gif");
	}
	body#telegate .bookingStep.step1 #komfortBox .choiceProduct.online {
		background-image: url("/11880/img/booking/me_komfortonline.gif");
	}
	body#telegate .bookingStep.step1 #premiumBox .choiceProduct.allMedia {
		background-image: url("/11880/img/booking/me_premium.gif");
	}
	body#telegate .bookingStep.step1 #premiumBox .choiceProduct.online {
		background-image: url("/11880/img/booking/me_premiumonline.gif");
	}
	
	.bookingStep.step1 .choiceProduct p {
		float: left;
		margin: 0;
		padding: 10px 80px 0 10px; 
	}
	

/**
* sets & boxes
* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
*/
	.bookingStep fieldset {
		margin: 16px 0 15px 47px;
	}
	.bookingStep.step5 fieldset {
		margin: 16px 0 0 47px;
	}
	
	.bookingStep span.set {
		display: block;
		white-space: nowrap;
	}
	.bookingStep.step2 span.set {
		height: 34px;
	}
		
	.bookingStep .set.labelUnderInput {
		line-height: inherit;
		float: left;
		margin: 0 5px 15px 0;
	}
	.bookingStep.step5 .set.labelUnderInput {
		width: 235px;
	}
		
	.bookingStep.step4 span.set.voucher {
		margin: 0 0 10px 10px;
	}
	
	.bookingStep.step4 .optionbox.payment .set {
		margin-bottom: 6px;
	}

	.bookingStep span.append_set {
		float: right;
		margin: -30px 8px 0 0;
		width: 200px;
	}

	.bookingStep .divisionline {
		display: block;
		clear: both;
		border-style: dashed;
		border-width: 0 0 1px 0;
		border-color: #C9C9C9;
		margin: 10px 8px 10px 0;
	}	
	.bookingStep .footerBox.divisionline {
		display: block;
		clear: both;
		border-style: dashed;
		border-width: 0 0 1px 0;
		border-color: #C9C9C9;
		margin: 10px 8px 0 47px;
	}
	.bookingStep .cl {
		float: left;
		width: 250px;
		margin: 0;
	}
	.bookingStep .cr {
		float: left;
		width: 250px;
		margin-left: 20px;
	}
	
	.bookingStep .setBox {
		width: 100%;
	}
	.bookingStep .priceBox {
		float: left;
		margin: 0 0 10px 0;
	}
	.bookingStep .footerBox {
		margin: 0 0 10px 20px; /* ie: 0*/
		padding: 10px 0 10px 0;
	}
	
/**
* text, labels, inputs
* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
*/
	.bookingStep span.footnote {
		line-height: 16px;
		font-size: 75%;
		vertical-align: top;
	}

	.bookingStep .optionbox label.optionText {
		display: block;
		float: left;
		line-height: 1.5em;
		margin-left: 13px;
	}
	.bookingStep.step3 .optionbox label.optionText {
		margin: 0 5px 0 13px;
		width: 190px;
	}
	.bookingStep.step4 .optionbox label.optionText {
		width: 190px;
	}
	.bookingStep.step4 .optionbox.payment label.optionText {
		width: 200px;
		margin: 0 0 0 6px;
	}
	
	.bookingStep label {
		line-height: 22px;
		margin-right: 6px;
		float: left;
	}
	.bookingStep.step1 label {
		margin: 0 5px;
	}
	.bookingStep.step2 label {
		width: 110px;
	}
	.bookingStep .checkboxBox label {
		width: auto;
		line-height: 1.5em;
	}
	.bookingStep .set.labelUnderInput label {
		line-height: inherit;
	}
	
	.bookingStep input {
		border: 1px solid #C9C9C9;
		padding: 0.35em 1em 0.4em;
	}

	
	.bookingStep.step2 input {
		width: 210px;
	}
	.bookingStep.step2 input.zipcode, .bookingStep.step2 input.streetNumber{
		width: 36px;
		/*width: 64px; ie: 36px*/
	}
	.bookingStep.step2 input.city, .bookingStep.step2 input.street {
		width: 146px;
		/*width: 142px; ie: 146px*/
	}
	.bookingStep.step2 input.phone {
		width: 91px; 
	}
	
	.bookingStep.step4 input, .bookingStep.step5 input {
		width: 200px; 
	}
	.bookingStep.step5 input.time {
		width: 40px; 
		padding: 0.2em 0.5em 0.2em;
		
	}
	
/**
* optionboxes, checkboxes etc.
* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
*/
	.bookingStep .checkboxBox {
		margin: 0 20px 10px 0;
		line-height: 1.5em;
	}
	
	.bookingStep .optionbox {
		float: left;
		margin: 0 20px 20px 0;
	}
	.bookingStep .cr .optionbox { 
		margin: 0 0 20px 0;
	}
	.bookingStep.step1 .optionbox {
		margin: 2px 0 0 0;
	}	
	.bookingStep.step3 .optionbox {
		margin: 0 20px 20px 0;
	}	
	.bookingStep.step4 .optionbox {
		margin-bottom: 8px;
	}
	
	
	
	.bookingStep .checkbox, .bookingStep .radio {
		float: left;
		margin: 1px 0 0 0;
		border: none;
		width: auto !important;
	}
	
	.bookingStep .checkboxBox .checkbox {
		float: left;
		margin-right: 13px;
		width: auto;
	}
	
	.bookingStep .choiceProduct .radio {
		margin: 6px 0 0 5px;
		
	}

/**
* Dropdowns
* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
*/
	.bookingStep.step1 .select {
		float: right;
		margin: 1px 1px 0 0;
		width: 150px;
	}
	.bookingStep.step2 .select {
		float: left;
		margin: 1px 10px 0 1px;
		width: 234px; /*ie6: */
	}

	.bookingStep .stepHeader .dropdown {
		margin: 2px 10px 0 0;
	}
	.bookingStep.step2 .dropdown {
		margin: 0;
		width: 193px;
	}

	.bookingStep .dropdown_content {
		margin-left: -7px;
		display: none; /*draft*/
	}
	.bookingStep.step2 .dropdown_content {
		width: 216px;
	}
	
/**
* Button(s)
* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
*/
	.bookingStep button, .bookingStep input.button {
		width: 141px;
		height: 28px;
		line-height: 1.25em;
		font-size: 1em;
		font-weight: bold;
		margin: 0 0 -2px;
		padding: 0 0 0.35em 0;
		cursor: pointer;
		border: none;
		background: transparent url(/global/img/buttons/dialog_button_bg_kt.gif) no-repeat left top;
	}
	.bookingStep.step5 div.buttons {
		float: right;
		margin: 0 10px 10px 0;
	}
	
/**
* captcha
* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
*/
	.bookingStep .captcha_set {
		display: block;
		margin: 4px 0 10px;
		float: left; /*workaround because of double-margins in IE*/
	}

	.bookingStep .captcha_box {
		display: block;
		float: left;
		width: 150px;
		margin-top: 4px;
	}

	.bookingStep .captcha_box img {
		margin-bottom: 6px;
	}

	.bookingStep .captcha_box input {
		width: 126px !important;
		margin-right: 0;
	}

	.bookingStep p.howto_captcha {
		float: left;
		width: 214px;
		margin-right: 20px;
	}
	
/* eventually hidden spans*/
	.bookingStep .errorMessages {
		padding: 10px 0 0 47px;
	}
	
	.bookingStep span.set.yetfilled {
		height: 56px;
		width: 350px;
	}	
	.bookingStep span.set.yetfilled input {
		margin-left: 115px;
		float: left;
	}
	.bookingStep span.set.yetfilled img {
		margin-top: 4px;
	}
	
/* others ... */
	.bookingStep.step5 a {
		text-decoration: underline;
	}
	
}
