@charset "utf-8";
/* CSS Document */
#reservation5_thankYou{margin: 0 auto 0 auto;width: 680px}
#reservation5_thankYou p{padding-left: 30px;}
#reservation5_thankYou h1{ font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; font-size: 16px; font-weight: bold; }
/* FORMS */
#reservationLomake{margin: 0px 0px 0px 30px;width: 650px;}
#reservationLomake h1{ padding-bottom: 25px;font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; font-size: 16px; color: #000; }
#reservationLomake input{ font-size: 12px; font-family: Arial, Helvetica, sans-serif; border: 1px solid #999999; }

#reservationLomake select { font-size: 11px; }
#reservationLomake textarea {font-size: 10px; font-family: Arial, Helvetica, sans-serif; border: 1px solid #999;}
input[type="checkbox"], #reservationLomake input[type="radio"]{background: #FFF;border: 0;}
#reservationLomake label{float: left;display: block;width: 160px;font-size: 12px}
#reservationLomake .otsikko{ height: 28px;padding: 6px; margin: 0 2px 0px 2px; font-family: Arial, Helvetica, sans-serif; font-size: 11px; color: #333333; font-weight: normal; font-variant: small-caps;background-image: url(../img/chg.gif); background-repeat: repeat-x;  }
#reservationLomake ul{margin: 5px 0px 0px 0px;list-style-type: none;padding:10px 0px 0px 0px}
#reservationLomake li{display: block; margin: 2px 0px 2px 0px;padding: 0px 0px 0px 0px}
#reservationLomake .header { margin: 5px 0px 20px 0px;display:block;width: 390px; background-color: #f1f1f1; font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; font-size: 14px; font-weight: bold; }
#reservationLomake .headerReservation1 { margin: 5px 0px 20px 0px; display:block; width: 100%; font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; font-size: 14px; font-weight: bold; background-color: #f1f1f1; }
#reservationLomake .btn{padding: 5px;margin-top: 5px}


#previewLomake{margin: 0px auto 0px auto;width: 420px;text-align: left}
#previewLomake .header { margin: 15px 0px 20px 0px;display:block;width: 400px; background-color: #f1f1f1; font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; font-size: 14px; font-weight: bold; }
#previewLomake h1{ font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; font-size: 16px; color: #000; }
#previewLomake ul{margin: 5px 0px 0px 0px;list-style-type: none;padding:10px 0px 0px 0px;width: 400px}
#previewLomake li{height: 18px;display: block; margin: 2px 0px 2px 0px;padding: 0px 0px 0px 0px}
#previewLomake .labelTxt{ display: block; float:left; width: 150px; font-weight: bold;background-color: #fff }
#previewLomake .contentTxt{display: block; float: right;width: 200px;background-color: #fff}
/* RESERVATION 1 */
#reservationLomake ul.accom{width: 300px;float: left;padding: 3px;height: 150px}
#reservationLomake ul.nGuests{float: right;width: 300px;padding: 3px;height: 200px}
#type{width: 140px;}
#pleaseNote, #roomRates {color: #666;margin-left: 30px;padding: 0px}

#pleaseNote h1 { font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; font-size: 14px; font-weight: bold;margin-left: 160px }
#roomRates h1{ font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; font-size: 14px; font-weight: bold; }
/*BUTTONS*/
.btnBack a{float: left;border: none; padding: 0px; margin: 0px; background-image: url(../img/buttons/button_back.gif); background-repeat: no-repeat; height: 35px; width: 69px; background-color: #FFFFFF; }
.btnBack:hover a{ border: none; background-position: 0 -35px; cursor: pointer}

.btnNext{border: none;background-color: #FFF; padding: 0px; margin: 0px; background-image: url(../img/buttons/button_next.gif); background-repeat: no-repeat; height: 35px; width: 69px;}
.btnNext:hover{ border: none; background-position: 0 -35px; cursor: pointer}

.btnConfirm{border: none;background-color: #FFF; padding: 0px; margin: 0px; background-image: url(../img/buttons/button_confirm.gif); background-repeat: no-repeat; height: 35px; width: 90px;}
.btnConfirm:hover{ border: none; background-position: 0 -35px; cursor: pointer}



/*PROGRESS INDICATOR*/
#progress{height: 25px;margin: 15px 0px 0px 0px;padding: 0px;float:right}
#progress ul{list-style:none;margin: 0px;padding: 0px;width: 430px}
#progress li{ float: left;width: 90px; margin: 3px; display: block; padding: 3px; font-family: Arial, Helvetica, sans-serif; font-size: 11px; color: #999999; border-top-width: 5px; border-top-style: solid; border-top-color: #f1f1f1; text-align: center; }
#progress li.vaihe{ color: #333333; border-top-width: 5px; border-top-style: solid; border-top-color: orange; font-weight: bold; }


/*VALIDATION*/
.hidden { display: none; }
.show{color: #000000;}
.error {  color: #ff0000; }


#availableUnitsTable table{width: 90%;padding-top: 20px}
#availableUnitsTable td{}
#availableUnitsTable th{ width: 150px; font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; font-size: 12px; font-weight: bold; text-align: left; padding: 3px; }
#availableUnitsTable .selectCol{width: 40px}
#availableUnitsTable .unitTdFormat{width:240px}
/* DATEPICKER*/

a.dp-choose-date {
	float: left;
	width: 16px;
	height: 16px;
	padding: 0;
	margin: 1px 0px 0px 2px;
	display: block;
	text-indent: -2000px;
	overflow: hidden;
	background: url(../img/calendar.png) no-repeat; 
}
a.dp-choose-date.dp-disabled {
	background-position: 0 -20px;
	cursor: default;
}
/* makes the input field shorter once the date picker code
 * has run (to allow space for the calendar icon
 */
input.dp-applied {
	width: 100px;
	float: left;
}