/* -----------------------------------------------------------------------



	CSS INFO



	Date	: 13 Nov 2007



	Title	: My Boracay Guide v1 (Design v4)



	Author	: JT Desquitado



	URL		: www.philwebservices.com



	E-mail	: philweb.jude@gmail.com



	Legal	: All images and style elements copyright by MyBoracay Guide



			  unless specified.



   ----------------------------------------------------------------------- */



   



/* -----------------------------------------------------------------------



	AUTHORS NOTE



	Important: 



   ----------------------------------------------------------------------- */



   



   



/* Common Styles



-------------------------------------------------------------------------- */







* {



	margin: 0;



	padding: 0;



}



form{ margin:0px; padding:0px;}


a.language{text-decoration:none;color:#FFF; font-size:18px; font-family:Arial, Helvetica, sans-serif;}
a.language:visited{color:#FFF;}a.language:link{color:#FFF;}a.language:hover{color:#3E1C12;}







body {



	font-family: Verdana, Arial, Helvitica, san-serif;



	line-height: 16px;



	font-size: 12px;



	word-spacing:normal;



	color: #111;



	background: url(../../images/bg.jpg) top repeat-x #ffffff;



}







ul {



	list-style: none;



}







h1 { font-size: 18px;



	



}







h2 {



	font-size: 160%;



	margin: 4px 0 25px 0;



	color: #615840;



	font-weight: normal;



}







h3 {



	font-size:130%;



}







p {



	margin: 4px 0 16px 0;



}







a:link {



	color: #2d5ea7;



}







a:visited {



	text-decoration: none;



	color: #1E53A2;



}







a:active, a:hover, a:link {



	text-decoration: none;



}



a img { border-color:#F58D09;}







/* Common Classes



-------------------------------------------------------------------------- */



.clear {



	clear: both;



}







.left {



	float: left;



}







.right {



	float: right;



}







.center {



	margin: 0 auto; /* To use this class specify the width with style attribute */



}







img.imgAL {



	float: left;



	margin: 0 27px 27px 0;



}







img.imgAR {



	float: right;



	margin: 0 0 27px 27px;



}







.txtAL {



	text-align: left;



}







.txtAC {



	text-align: center;



}







.txtAR {



	text-align: right;



}







.hBorder {



	border-bottom: 2px solid #928980;



	padding-bottom: 5px;



	display: block;



}



.pH10 { padding:10px 0;}



.pT20 {	padding-top:20px;}



.mT20 {	margin-top:20px;}



.mB20{	margin-bottom:20px;} .mB10 { margin-bottom:10px;}







.mR10{



	margin-right:10px;



}



.none {



	display:none;



}



/* Basic Structure



-------------------------------------------------------------------------- */







#container {



	margin: 0 auto;



	position: relative;



	width: 1000px;



	padding: 0 15px 0 15px;



}







#header {



	float: left;



	width: 1000px;



	margin-bottom: 27px; background: url(../../images/header_new.jpg) top no-repeat;



}







#content {



	/*float: left;*/



	width: 970px; margin:auto;



}







#sidebar {



	float: left;



	width: 168px;



}







#main {



	float: right;



	width: 759px; 



}



#footer {



	float: left;



	width: 970px;



	text-align: center;



	padding: 40px 0 20px 0;



}







/* Header



-------------------------------------------------------------------------- */







#header h1 a {



	float: left;



	width: 390px;



	height: 140px;



	/*margin: 50px 0pt 10px;*/ height:229px;



}







#header h1 a span {



	display: none;



}







#header ul {



clear:left;



	list-style: none; background: url(../../images/navigation_bg.jpg) top no-repeat; width:970px; height:50px; margin:auto;position:relative;



}



#header ul li  {



	float: left;



	/*border-right: 1px solid #ced5dd;



	height: 19px; margin-top: 27px;*/



	padding: 0px 19px 0 19px;



	font-weight: bold; line-height:48px;



	position:relative;



	



}







#header ul li:hover ul{position:absolute; display:block;}







#header ul li ul{width:174px; /*top:15px; border:1px solid #FFFFFF;*/ display:none; padding:0px; margin:-15px 0px 0px 0px; list-style:none; position:relative; overflow-y:scroll; height:170px; float:left; #margin:15px 0px 0px 0px;#left:20px;}



#header ul li ul li{float:none; padding:5px; margin:0px; line-height:12px; background:#eba510; border-bottom:1px solid #000000; position:relative;}



#header ul li ul li a:visited{text-decoration:none; font-family:Verdana, Geneva, sans-serif; font-size:11px; font-weight:normal; text-align:left; color:#FFFFFF;}



#header ul li ul li a:link{text-decoration:none; font-family:Verdana, Geneva, sans-serif; font-size:11px; font-weight:normal; text-align:left; color:#FFFFFF;}



#header ul li ul li:hover{float:none; padding:5px; margin:0px; background-color:#1e53a2;}







#header ul li ul li a:hover{text-decoration:none; color:#ffffff;}











#header ul li ul li.anylinkcss1{



	padding:0px;



	



	



	left:231px;



	top:217px;



	BORDER-RIGHT:1px solid #464646;



	BORDER-TOP:1px solid #464646;



	FONT: 10px/18px Verdana, Arial, Helvetica, sans-serif;



	BORDER-LEFT:1px solid #464646;



	WIDTH: 200px;



	COLOR:#000000;



	BORDER-BOTTOM:none;



	BACKGROUND-COLOR:#6CF;



	overflow-x:hidden;



	position:absolute;



	display:block;



}







	



#header ul li ul li.anylinkcss1 A {



	DISPLAY: block;



	position:absolute;



	WIDTH: 200px;



	text-align:left;



	COLOR: #000000;



	BORDER-BOTTOM:1px solid #464646;



	TEXT-DECORATION: none;



	font-size:13px;



	float:left;



	padding:0px 0px 1px 5px;



	margin:0px;



	float:left;



	white-space:nowrap;



}







#header ul li ul li.anylinkcss1 A:hover {



	DISPLAY: block;



	position:absolute;



	WIDTH: 200px;



	text-align:left;



	COLOR: #464646;



	BORDER-BOTTOM:1px solid #464646;



	TEXT-DECORATION: none;



	font-size:13px;



	float:left;



	padding:0px 0px 1px 5px;



	margin:0px;



	float:left;



	white-space:nowrap;	



	BACKGROUND-COLOR: #eeffed;



}







#header ul li a:visited {



	font-family: Myriad Pro, Arial, Helvitica, sans-serif;



	font-size: 120%;



	text-decoration: none;



	color: #2d5ea7; font-weight:bold; text-transform:uppercase;



}







#header ul li a {



	font-family: Myriad Pro, Arial, Helvitica, sans-serif;



	font-size: 120%;



	text-decoration: none;



	color: #2d5ea7; font-weight:bold; text-transform:uppercase;



}







#header ul li a span {



	/*display: none;*/



}







#header ul li a:hover {



	color: #ecb02d;



}







#header ul #nav5 {



	border: 0;



}







/*#header ul #home a {



	background: url(../../images/english/nav/home.jpg) no-repeat;



	float: left;



	width: 35px;



	height: 10px;



	margin-top: 5px;



}







#header ul #home a:hover {



	background: url(../../images/english/nav/home_hover.jpg) no-repeat;



}







#header ul #nav2 a {



	background: url(../../images/english/nav/beaches.jpg) no-repeat;



	float: left;



	width: 124px;



	height: 11px;



	margin-top: 4px;



}







#header ul #nav2 a:hover {



	background: url(../../images/english/nav/beaches_hover.jpg) no-repeat;



}







#header ul #nav3 a {



	background: url(../../images/english/nav/booking.jpg) no-repeat;



	float: left;



	width: 103px;



	height: 10px;



	margin-top: 5px;



}







#header ul #nav3 a:hover {



	background: url(../../images/english/nav/booking_hover.jpg) no-repeat;



}







#header ul #nav5 a {



	background: url(../../images/english/nav/contact.jpg) no-repeat;



	float: left;



	width: 76px;



	height: 10px;



	margin-top: 5px;



	border-right: 0;



}







#header ul #nav5 a:hover {



	background: url(../../images/english/nav/contact_hover.jpg) no-repeat;



}







#header ul #nav13 a {



	background: url(../../images/english/nav/blog.jpg) no-repeat;



	float: left;



	width: 35px;



	height: 10px;



	margin-top: 5px;



}







#header ul #nav13 a:hover {



	background: url(../../images/english/nav/blog_hover.jpg) no-repeat;



}



*/







#header ul #nav113 a:hover {



	/*background: url(../../images/english/nav/transportation_hover.jpg) no-repeat;*/



}







#header ul #nav113 a {



	/*background: url(../../images/english/nav/transportation.jpg) no-repeat;*/



	float: left;



	width: 112px;



	height: 10px;



	/*margin-top: 5px;*/



}







#header ul #nav4 a {



	background: url(../../images/nav/eguide.gif) no-repeat;



	float: left;



	width: 52px;



	height: 14px;



	margin-top: 5px;



}







#header ul #nav4 a:hover {



	background: url(../../images/nav/eguide-h.gif) no-repeat;



}











#header ul #nav12 a {



	background: url(../../images/nav/qhf.gif); background-repeat:no-repeat;



	float: left;



	width: 129px;



	height: 9px;



	margin-top: 5px;



}







#header ul #nav12 a:hover {



	background: url(../../images/english/nav/qhf-h.gif); background-repeat:no-repeat;



}















#header ul #nav17 a {



	background: url(../../images/english/nav/transfer.gif) no-repeat;



	float: left;



	width: 172px;



	height: 10px;



	margin-top: 5px;



}







#header ul #nav17 a:hover {



	background: url(../../images/english/nav/transfer-h.gif) no-repeat;



}







#header ul li a {



	



}



#header ul li a:hover {



		COLOR: #656565;



}



/*#header ul li ul li{



		float: left; position:absolute; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:10px; background-color:#FFCC00; line-height:20px; margin:0px; 



}



*/



/* nav2



**********************/



#header ul #nav6 a {



	background: url(../../images/english/nav/more-info.gif) no-repeat;



	float: left;



	width: 150px;



	height: 9px;



	margin-top: 5px;



}



#header ul #nav6 a:hover {



	background: url(../../images/english/nav/more-info-h.gif) no-repeat;



}



#header ul #nav7 a {



	background: url(../images/nav/rooms-prices.gif) no-repeat;



	float: left;



	width: 117px;



	height: 9px;



	margin-top: 5px;



}



#header ul #nav7 a:hover {



	background: url(../images/nav/rooms-prices-h.gif) no-repeat;



}



#header ul #nav8 a {



	background: url(../images/nav/area-map.gif) no-repeat;



	float: left;



	width: 117px;



	height: 9px;



	margin-top: 5px;



}



#header ul #nav8 a:hover {



	background: url(../images/nav/area-map-h.gif) no-repeat;



}



#header ul #nav9 a {



	background: url(../images/nav/guest-book.gif) no-repeat;



	float: left;



	width: 77px;



	height: 9px;



	margin-top: 5px;



}



#header ul #nav9 a:hover {



	background: url(../images/nav/guest-book-h.gif) no-repeat;



}



#header ul #nav10 a {



	background: url(../images/nav/enquiries.gif) no-repeat;



	float: left;



	width: 63px;



	height: 9px;



	margin-top: 5px;



}



#header ul #nav10 a:hover {



	background: url(../images/nav/enquiries-h.gif) no-repeat;



}



#header ul #nav11 a {



	background: url(../images/nav/online-booking.gif) no-repeat;



	float: left;



	width: 122px;



	height: 9px;



	margin-top: 5px;



}



#header ul #nav11 a:hover {



	background: url(../images/nav/online-booking-h.gif) no-repeat;



}



/* Main



-------------------------------------------------------------------------- */







#photo-gallery {



	width: 759px;



	text-align: center;



}







#photo-gallery #preview img {



	width: 635px;



	height: 400px;



}







#photo-gallery #thumbs img {



	height: 110px;



	border: 0;



	/*float: left;*/



	margin: 0 1px 0 1px;



}







#thumbs {



	width: 735px;



	margin: 0 auto;



	position: relative;



}







#prev span, #next span {



	display: none;



}







#prev a {



	width: 50px;



	float: left;



	background: url(../images/prev.gif) no-repeat center;



	height: 150px;



}



#prev a:hover {



	background: url(../images/prev-h.gif) no-repeat center;



}







#next  a {



	float: right;



	background: url(../images/next.gif) no-repeat center;



	width: 50px;



	height: 150px;



}



#next a:hover {



	background: url(../images/next-h.gif) no-repeat center;



}







#imgArray {



	float: left;



	width: 635px;



	height: 200px;



/*	height: 110px; */



	padding: 20px 0 20px 0;



	background: url(../images/gallery-bg.gif) repeat-x;



}







#awrap {



	position: relative;



	width: 635px;



	height: 110px;



	overflow: hidden;



}







.hr-dashed{



	border-top:1px dashed #CCCCCC;



}







.list {



	list-style: disc;



	margin-left:20px;



}







.list li{



	line-height:20px;



}



/* Sidebar



-------------------------------------------------------------------------- */







/* SubNav Accordion */



#sidebar #subnav {



	margin: 15px 0 25px 0;



	float: left;



}







#sidebar #subnav ul {



	float: left;



	width: 168px; padding:0px; margin:0px;



}







#sidebar #subnav ul li {



	float: left; padding:0px 8px 0px 8px; background: url(../../images/sub-nav-bg.png) top no-repeat; width:152px; font-size:11px; font-weight:bold; font-family:Arial, Helvetica, sans-serif;



}







#sidebar #subnav ul li ul li{



	float: left; padding:0px 8px 0px 8px; background:none; width:152px; font-size:11px; font-weight:bold; font-family:Arial, Helvetica, sans-serif;



}







#sidebar #subnav ul li a {



	float: left;



	/*width: 169px;



	height: 16px;*/



	padding: 6px 7px 10px 7px;



	text-transform: uppercase;



	text-decoration: none;



	color: #ffffff; font-weight:bold;



	outline: none; font-family:Arial, Helvetica, sans-serif;



}







#sidebar #subnav ul li ul {



	float: left;



	width:153px;



	/*padding: 10px 0 30px 0;*/



}







#sidebar #subnav ul li ul li a:visited {



	background: none;



	text-transform: none;



	color: #111;



	padding: 7px 5px 7px 5px;



	border-bottom: 1px solid #ecdfbf;



	width: 173px;



	margin: 0; font-size:11px;



}







#sidebar #subnav ul li ul li a {



	background: none;



	text-transform: none;



	color: #111;



	padding: 7px 5px 7px 5px;



	border-bottom: 1px solid #ecdfbf;



	width: 173px;



	margin: 0; font-size:11px;



}







#sidebar #subnav ul li ul li a:hover {



	color: #106fc0;



}







.accordion_content {



	overflow: hidden;



}







/* Spotlight */



#sidebar #spotlight {



	color: #8a8686;



	font-size:11px;



}







#sidebar #spotlight ul {



	float: left;



}







#sidebar #spotlight ul li {



	float: left;



	width: 168px;



	background: #fff;



	padding: 15px 8px 5px 8px;



	text-align: center;



	margin-bottom: 10px;



}







#sidebar #spotlight ul li h3 {



	margin: 5px 0 2px 0;



	font-size: 120%;



}







#sidebar #spotlight ul li p {



	margin: 0px;



}







#sidebar #spotlight ul li p a {



	display: block;



	font-size: 90%;



	text-align: right;



	margin: 3px 0 3px 0;



	color: #f58d09;



}







#sidebar #spotlight ul li p a:hover,#sidebar #spotlight ul li p a:active {



	text-decoration: none;



}







#sidebar #spotlight ul li p a:visited {



	color: #d0790a;



}







/* Footer



-------------------------------------------------------------------------- */







#footer .copyright {



	margin-right: 20px;



	color: #72675b;



	font-size: 100%;



}







#footer .legal-links {



	color: #72675b;



}







#footer .legal-links a {



	font-size: 100%;



	text-decoration: none;



	color: #72675b;



	margin: 0 3px 0 3px;



}







#footer .legal-links a:hover {



	text-decoration: underline;



}











/******accomodations*****/



#content2 {float:left; }



#main2 { float:right; }



#right_map { position:relative;/* background-image:url(../images/maps/map_right.jpg);*/ height:1240px; width:235px; float:right; top:30px;}



#main2 .sub-nav { clear:both; float:left; width:700px; margin-bottom:15px;}



#main2 .sub-nav .nav { background:#A8DFA6; font-size:14px; float:left; font-weight:bold; width:700px; height:20px; padding-top:5px; overflow:hidden;}



	#main2 .sub-nav .nav a, #main2 .sub-nav .nav span { text-decoration:none; padding-right:25px; padding-left:25px; }



	html:first-child .nav span {margin-left:-20px;} html:first-child #main2 .sub-nav {margin-top:20px;} html:first-child #extra {margin:-5px 0 0 30px !important;position:absolute !important;font-weight:normal;}



#main2 .bottom-details { clear:both; width:720px; float:left; border:1px #ecb875 solid; margin-top:7px;}



#main2 .bottom-details p {margin:6px; color:#0e57a3;}



/*****beaches extension*****/



.lower_map { width:504px; position:relative; background:#ede2d9;}



.map_nav { line-height:.3em; padding:20px 20px 5px 20px; position:relative;}



.lower_descript { padding:20px 20px 5px 20px; text-align:justify; width:190px; position:relative;}



a.yelborder img { border:2px solid #d47c08; display:block;}



/**#main .map_nav p a { color:#000000;}**/







/*****content thumbnail list****/



#main p.mR10, #main2 p.mR10 { width:480px; }



.thumb-link { text-decoration:none; font-size:12px; font-weight:bold; float:right; margin:0 5px 2px 30px;}



.noborder { border:0; padding-left:5px; margin-bottom:-3px;}



.catalog { margin-bottom:5px; text-align:left; }



 .catalog ul{ list-style:none; padding-right:56px; width:500px; margin-left:160px; } /*iehack*/ *html .catalog ul {margin-left:163px; padding-right:41px;}



   .catalog li{ display:inline; float:left; padding-right:5px; margin:0; }



	#main2 .catalog a { text-decoration:none; padding:0px; color:#A7A7A7; font-weight:bold;} #main2 .catalog a:hover { color:#d47c08;}



 /*****thumb listing on beaches and resorts*******/



 .thumb2 {margin-right:10px; margin-top:-10px;} /*iehack*/ *html .thumb2 {margin-top:-20px;}



 html:first-child .thumb2 img {padding:0 !important;}



 .details2 {padding-right:15px; } /*ie hack*/ *html .details2 { margin-bottom:4px;}



 html:first-child .details2 {float:none !important; width:694px !important;padding-top:7px !important;}



/*anti-wiper*/



.spacer { height:420px; position:relative;}







/****************************more-info******************************/



.heading2 { font-size:13px; font-weight:bold; color:#615840; height:25px; padding:6px 0 0 4px;}



.thumbnail p a { display:block; padding-top:5px; clear:both;}



.headerbg2 { background:url(../images/photos/info-thumb/headerbg2.gif) no-repeat;}



.headerbg2-wide { background:url(../images/photos/info-thumb/headerbg2-wide.gif) no-repeat;}



/****positioning****/



.mR40 { margin-right:40px;}



.mL30 { margin-left:30px;}



.pL30 { padding-left:30px;} .pL20 { padding-left:20px;} .pL10 { padding-left:10px;}



/***************enquiries*************/



.inputlabel { width:200px; height:25px; margin-top:5px; font-size:12px; color:#2b1505; }



.enquire form input, .enquire form select {background-color:#f8f1eb; border:1px #e4d3bd solid; padding:3px; margin:5px 0 10px 0; display:block; }







/**adjustments**/



.txt12 { font-size:12px; line-height:1.6em;}



#main2 a.left img { border:0; width:210px;} /*remove border of image ang resize its size */



.abs-float { position:absolute; z-index:999; top:40px; left:480px;}



/*#main p { font-size: 105%; line-height:1.6em;}*/



.dam-exp p { font-size:104%;}



.sub-nav span { padding-right:20px; }



.sub-nav span img { padding: 0 3px 0 3px; }



.announcement { color:#0e57a3;}







table {	font-size:12px;}







/* CSS for my first scrolling box */



	#scrollingContainer{



		width:100%;	/* 170 pixels in width */



		height:50px;	/* Height of box */



		



		border:1px solid #e0ded0;	/* Black border around box */



		background-color: #f8f1eb;	/* Light blue background color */







		padding:2px;	/* A little bit of space between border of box and text inside */



		float:left;	/* I want the text to wrap around the box */



		margin-right:10px;	/* Right margin of 10 pixels */



		



			/* Smaller font size than the rest of the page */



		



		overflow:hidden;	/* Hide overflow content */



	}



	/* End css for my first scrolling box */