<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<link rel="stylesheet" type="text/css" href="http://www.cosmores.com/plugins/css/smoothness/jquery-ui-1.8.13.custom.css" />
<script type="text/javascript" src="http://www.cosmores.com/plugins/js/jquery-1.5.2.min.js"></script>
<script type="text/javascript" src="http://www.cosmores.com/plugins/js/jquery-ui-1.8.13.custom.min.js"></script>
<script type="text/javascript" src="http://www.cosmores.com/plugins/js/cosmoresbooking.search.plugin.js"></script>

<style type="text/css">

#div_children_cosmores{
	border-style:solid;
	border-width:1px;
	border-color:#1f1f1f;
	background-color:#efefef;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px
}
div.div_children_content_cosmores{
	padding:5px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px
}
/** style for children popup h3 tag() **/
div.div_children_content_cosmores h3{
	width:100%;
	text-align:center;
	padding:0px;
	margin:0px;
	padding-top:2px;
	padding-bottom:2px;
	font-weight:normal;
}
/** style for children popup label fields **/

div.div_children_content_cosmores label.label_child_cosmores{
}
/** style for children popup input fields **/

div.div_children_content_cosmores input{
}
div.div_children_content_cosmores div.div_children_buttons_cosmores{
	text-align:center;
	width:100%;
}
div.div_children_content_cosmores div.div_children_buttons_cosmores a{
	padding-left:5px;
	padding-right:5px;
}
#frmSearchCosmoresBooking label{
	display:inline-block;
	width:100px;
}
#frmSearchCosmoresBooking input{
	width:80px;
}




/** style for jquery ui datepicker **/
#ui-datepicker-div{
	font-size:11pt;
}
#ui-datepicker-div span.ui-datepicker-month{
	color:#fff;
}
#ui-datepicker-div span.ui-datepicker-year{
	color:#eee;
}
.link_children_ok_cosmores{
color:#003366;
text-decoration:underline;
}
</style>
<script type="text/javascript">
<!--
	
	jQuery(document).ready(function(){
		
		//jquery plugin cosmoresbooking -- jQuery("#[elementName]").cosmoresbooking(options);
		//form element id name that holds the elements for the search
		//example for testhotel
		jQuery("#frmSearchCosmoresBooking").cosmoresbooking(
			{
				'checkInDateFailureMessage':'The field of Arrival is mandatory.',
				'checkInDateName':'check_in_datehere_cosmores',
				'hotelUrl':'https://olympicvillas.cosmores.com/?SITE=71',
				'childrenOKText':'Yes',
				'childrenCancelText':'Cancel',
				'childrenText':'Children',
				'numberOfMonths':1
				/**
					'hotelUrl':'',	require field
					'numberOfMonths':2,	not required default 2
					'firstDay':1,	not requried default 1
					'dateFormat':'yy-mm-dd',	not required default yy-mm-dd (2011-05-05)
					'siteId':71,	not required default 8
					'showToday':true, not required default true
					'checkInDateFailureMessage':'Check-in date field is required', not required default ''
					'checkInDateName':'check_in_date_cosmores', not required default check_in_date_cosmores
					'checkOutDateFailureMessage':'Check-out date field is required', not required default ''
					'checkOutDateName':'check_out_date_cosmores', not required default check_out_date_cosmores
					'adultsName':'adults_cosmores', not required default adults_cosmores
					'roomsName':'rooms_cosmores', not required default rooms_cosmores ( NOT IMPLEMENTED YET )
					'childrenName':'children_cosmores', not required default children_cosmores
					'buttonName':'button_cosmores', not required default button_cosmores
					'childrenCancelText':'Cancel', not required default 'Cancel'
					'childrenOKText':'OK' not required default 'OK',
					'childrenText':'Child', not required default 'Child'
					'childrenHeaderText':'Age(s) of children.' not required default 'Age(s) of children'
					**/
			}
		);	
	});
	
//-->
</script>
</head>

<body>
<table width="324" border="0" cellspacing="0" cellpadding="0" align="center" class="txtwhite" style="padding-bottom:20px;">
                    <tr>
                      
    <td>
    <form name="frmSearchCosmoresBooking" id="frmSearchCosmoresBooking" method="get"  >
        <div style="padding:5px; background-color:#75b4f7; font-weight:bold; color:#FFFFFF">Online Booking
        </div>
    <div style="padding:5px; background-color:#2353ad">
		<label for="check_in_datehere_cosmores"><strong>Check-in:</strong></label>
		<input type="text" name="check_in_datehere_cosmores" id="check_in_datehere_cosmores" value="" />
		<br />
		<label for="check_out_date_cosmores"><strong>Check-out:</strong></label>
		<input type="text" name="check_out_date_cosmores" id="check_out_date_cosmores" value="" />
		<br />
		<!--<label for="rooms_cosmores">Rooms:</label>
		<select name="rooms_cosmores" id="rooms_cosmores">
			<option value="1">1</option>
			<option value="2">2</option>
		</select><br />-->
		<label for="adults_cosmores" ><strong>Adults:</strong></label>
		<select name="adults_cosmores" id="adults_cosmores">
			<option value="1">1</option>
			<option value="2" selected="selected">2</option>
			<option value="3">3</option>
			<option value="4">4</option>
		</select>
			<br />
		<label for="children_cosmores"><strong>Children</strong>:</label>
		<select name="children_cosmores" id="children_cosmores">
			<option value="0">0</option>
			<option value="1">1</option>
			<option value="2">2</option>
			<option value="3">3</option>
		</select>
		<br />
		<input type="submit" id="button_cosmores" name="button_cosmores" value="Search" />
        </div>
	</form>
    
    
    </td>
                    </tr>
                  </table>
</body>
</html>
