@charset "utf-8";
/* CSS Document */

* { margin: 0; padding: 0; border: 0;}

body { font-family: Arial, Helvetica, sans-serif; font-size: 12px; color: #888788; background: #ffffff url(../images/bg.jpg) repeat-x;}
html { margin: 0; padding: 0; }

a { text-decoration: none; color: #c00101;}
a:hover { text-decoration: none; color: #febb08; }
a:visited { }

p { line-height: 18px; margin: 0 0 10px 0; }
img { border: none; }
ul li { list-style: none; }
span { color: #006fbf; }
h1, h2, h3, h4, h5 { font-family: Arial, Helvetica, sans-serif; font-weight: normal; color: #006fbf; margin: 0 0 15px 0;}
h1 { }
h2 { }
h3 { }
h4 { }
h5 { }

.clear-both { clear: both; }
.float-left { float: left; }
.float-right { float: right; }
.margin-bottom { margin: 0 0 15px 0; }
.margin-auto { margin: 0 auto; }
.txt-center { text-align: center; }
.align-right { text-align: right; }
.line { border-bottom: 1px #cccccc dashed; margin: 0 0 10px 0; }
.note { font-size: 11px; color:#993300; }

.content-float-img { float: left; margin: 0 10px 10px 0; }
.readmore a { color: #993300; text-decoration: none; font-size: 11px; background: url(../images/arrow.jpg) no-repeat 0 2px; padding: 0 0 0 15px;}
.readmore a:hover { color: #ff0000; }

/*----------form style----------*/
label { color: #374043; }
.txtbox-small, .txtbox-medium, .txtbox-large, .txtarea { font-family: Arial, Helvetica, sans-serif; font-size: 12px; }
.txtbox-small { border: 1px #dedddd solid; width: 212px; height: 22px; padding: 3px 2px 0 2px; }
.txtbox-medium { border: 1px #dedddd solid; width: 282px; height: 22px; padding: 3px 2px 0 2px; }
.txtbox-large { border: 1px #dedddd solid; width: 342px; height: 22px; padding: 3px 2px 0 2px; }
.dropdown-small { border: 1px #dedddd solid; width: 218px; height: 26px; padding: 3px 2px 2px 2px; }
.dropdown-medium { border: 1px #dedddd solid; width: 282px; height: 26px; padding: 3px 2px 2px 2px; }
.dropdown-large { border: 1px #dedddd solid; width: 342px; height: 26px; padding: 3px 2px 2px 2px; }

.txtarea { border: 1px #dedddd solid; width: 420px; height: 150px; padding: 3px 2px 0 2px; margin: 0 0 10px 0; }
.button { border: 1px #ffffff solid; width: 86px; height: 39px; background: url(../images/button3.png) no-repeat; color: #333333; font-weight: ; font-size: 15px; cursor: pointer; }

/*----------nav----------*/
#nav-wrap { width: 950px; height: 83px; position: absolute; top: 192px; }
#bottom-nav { width: 950px; height: 83px; }
.nav { width: 930px; height: 41px; float: left; display: inline; background: url(../images/ul-bg.jpg) repeat-x; }
.nav li { height: 41px; float: left; display: inline; }
.nav li a { height: 41px; float: left; display: block; overflow: hidden; }
.start-left { width: 10px; height: 41px; background: url(../images/start-left.jpg) no-repeat; float: left; }
.start-bottom-left { width: 10px; height: 41px; background: url(../images/start-bottom-left.jpg) no-repeat; float: left; }
.end-right { width: 10px; height: 41px; background: url(../images/end-right.jpg) no-repeat; float: left; }
.end-bottom-right { width: 10px; height: 41px; background: url(../images/end-bottom-right.jpg) no-repeat; float: left; }

.home { width: 60px; height: 41px; background: url(../images/nav/home.jpg) no-repeat; }
.home:hover { width: 60px; height: 41px; background: url(../images/nav/nav-bg-sprite.jpg) no-repeat 0 0; }

.photogallery { width: 128px; height: 41px; background: url(../images/nav/photogallery.jpg) no-repeat; }
.photogallery:hover { width: 128px; height: 41px; background: url(../images/nav/nav-bg-sprite.jpg) no-repeat -60px 0; }

.accomodation { width: 180px; height: 41px; background: url(../images/nav/accomodation-rooms.jpg) no-repeat; }
.accomodation:hover { width: 180px; height: 41px; background: url(../images/nav/nav-bg-sprite.jpg) no-repeat -192px 0; }

.poolbar { width: 183px; height: 41px; background: url(../images/nav/poolbar.jpg) no-repeat; }
.poolbar:hover { width: 183px; height: 41px; background: url(../images/nav/nav-bg-sprite.jpg) no-repeat -378px 0; }

.about-boracay { width: 126px; height: 41px; background: url(../images/nav/about-boracay.jpg) no-repeat; }
.about-boracay:hover { width: 126px; height: 41px; background: url(../images/nav/nav-bg-sprite.jpg) no-repeat -561px 0; }

.activities { width: 93px; height: 41px; background: url(../images/nav/activities.jpg) no-repeat; }
.activities:hover { width: 93px; height: 41px; background: url(../images/nav/nav-bg-sprite.jpg) no-repeat -686px 0; }

.how-to-findus { width: 160px; height: 41px; background: url(../images/nav/how-to-findus.jpg) no-repeat; }
.how-to-findus:hover { width: 160px; height: 41px; background: url(../images/nav/nav-bg-sprite.jpg) no-repeat -780px 0; }

.tariff { width: 178px; height: 41px; background: url(../images/nav2/tariff.jpg) no-repeat; }
.tariff:hover { width: 178px; height: 41px; background: url(../images/nav2/nav-bg-sprite2.jpg) no-repeat 0 0; }

.reservation { width: 107px; height: 41px; background: url(../images/nav2/reservation.jpg) no-repeat; }
.reservation:hover { width: 107px; height: 41px; background: url(../images/nav2/nav-bg-sprite2.jpg) no-repeat -178px 0; }

.travel { width: 227px; height: 41px; background: url(../images/nav2/travel.jpg) no-repeat; }
.travel:hover { width: 227px; height: 41px; background: url(../images/nav2/nav-bg-sprite2.jpg) no-repeat -285px 0; }

.useful { width: 109px; height: 41px; background: url(../images/nav2/useful.jpg) no-repeat; }
.useful:hover { width: 109px; height: 41px; background: url(../images/nav2/nav-bg-sprite2.jpg) no-repeat -512px 0; }

.investment { width: 203px; height: 41px; background: url(../images/nav2/investment.jpg) no-repeat; }
.investment:hover { width: 203px; height: 41px; background: url(../images/nav2/nav-bg-sprite2.jpg) no-repeat -621px 0; }

.contact { width: 106px; height: 41px; background: url(../images/nav2/contact.jpg) no-repeat; }
.contact:hover { width: 106px; height: 41px; background: url(../images/nav2/nav-bg-sprite2.jpg) no-repeat -824px 0; }

/*----------divs----------*/
#wrapper { width: 950px; margin: 0 auto; position: relative; z-index: 1;}
#header { position: relative; width: 950px; height: 283px; background: url(../images/header-bg.jpg) no-repeat; }
#logo { width: 235px; height: 175px; background: url(../images/logo.png) no-repeat; position: absolute; left: 335px; top: 15px; }

#banner { width: 930px; height: 330px; background: #ffffff; /*z-index: 10; position: relative;*/ padding: 10px; }
.boracay-signboard { width: 220px; height: 110px; background: url(../images/boracay-signboard.png) no-repeat; position: absolute; top: 573px; left: 10px; z-index: 9999; }
.call { width: 266px; height: 56px; background: url(../images/call.png) no-repeat; position: absolute; left: 360px; top: 653px; z-index: 9999; }
.umbrella { width: 313px; height: 210px; background: url(../images/umbrella.png) no-repeat; position: absolute; right: 10px; top: 523px; z-index: 9999;}

#contact { widht: 950px; height: 120px; background: #ffffff url(../images/contact-bg.jpg) no-repeat; z-index: 1; position: relative; }
#content { width: 950px; float: left; background: #ffffff; }
#content-left { width: 640px; float: left; padding: 10px 15px 10px 15px; }
.accomodations-box { width: 195px; float: left; margin: 0 10px 0 0; padding: 0 5px 0 0; }
.accomodations-box p{ margin: 0 0 10px 5px; }
.accomodations-img { float: left; margin: 0 10px 20px 0; }

.tariff-wrapper, .row-wrapper { width: 640px; float: left; }
.tariff-wrapper span { font-size: 15px; }
.row-wrapper h3, .row-wrapper-head h3, .row-wrapper h4 { margin: 0;}
.row-wrapper-head { width: 640px; float: left; background: #f0fdfd; padding: 5px 0 5px 0; margin: 0 0 10px 0; border: 1px #d1f6f6 solid; }
.colmn { width: 370px; float: left; }
.colmn2 { width: 120px; float: left; }
.colmn1 { width: 300px; float: left; }
.colmn2-1 { width: 270px; float: left;  }
.colmn3 { width: 120px; float: left; }
.colmn, .colmn1, .colmn2, .colmn3 { padding: 5px;}
.price, .row-wrapper h3, .row-wrapper-head h3 { color: #006fbf; font-weight: bold; font-size: 16px; }
.otherservices, .contactdetails { font-size: 15px; color: #006fbf; }

.form-wrap { width: 620px; float: left; border: 1px #e8e8e8 solid; background: #f7f7f7; padding: 10px; }
.form-row { width: 620px; float: left; margin: 0 0 7px 0; }
.form-colm { width: 120px; float: left; }
.form-colm2 { width: 400px; float: left; }
.form-colm, form-colm2 { padding: 5px; }

.contact-colmn { width: 205px; float: left; margin: 0 5px 0 0; border-right: 1px #02d2ff dashed; }
.contact-colmn2 { width: 300px; float: left; }
.logo-small { width: 160px; height: 122px; margin: 0 auto 20px auto; }

.list li { margin: 0 0 5px 20px; }

#content-right { width: 258px; float: left; padding: 10px; border-left: 1px #cccccc dashed; }

#photogallery-list { width: 950px; float: left; margin: 10px 0 10px 0; }
#photogallery-list ul{ width: 950px; float: left; display: inline; margin: 0 0 10px 0; }
#photogallery-list ul li { height: 100px; float: left; display: inline; padding: 0 7px 0 7px; }

#gallery { float: left; margin: 0 0 30px 0; }
#gallery ul li { float: left; display: inline; margin: 3px; }
#poolbar-img ul li { float: left; display: inline; margin: 3px; }
#poolbar-img { width: 640px; float: left; margin: 0 0 20px 0; }

#footer { width: 930px; height: 40px; background: url(../images/footer-bg.jpg) no-repeat; font-size: 11px; padding: 10px; }

/*----------slideshow divs----------*/
#slideshow {
    position:relative;
    height:330px;
	width: 930px;
}
#slideshow IMG {
    position:absolute;
    top:0;
    left:0;
    z-index:8;
    opacity:0.0;
}
#slideshow IMG.active {
    z-index:10;
    opacity:1.0;
}
#slideshow IMG.last-active {
    z-index:9;
}