/************************* RESET *******************/
BODY{margin: 0px; padding: 0px; background: #fff}
H1,H2,H3,H4,H5,DIV,SPAN,P,A,IMG,UL,LI,FIELDSET,FORM,INPUT,SELECT,OPTION,TEXTAREA,TABLE,TH,TR,TD,IFRAME{color: #000; font-family: Arial, Helvetica, sans-serif; font-size: 12px; line-height: 12px; font-weight: normal; letter-spacing: 0px; word-spacing: 0px; margin: 0px; padding: 0px; list-style-type: none}
TABLE{border-spacing: 0px; border-collapse: collapse}
IMG, FIELDSET{border: none}
LEGEND{display: none}


/************************* FONTS *******************/
H1, H2{color: #505050; font-size: 40px; line-height: 44px; letter-spacing: -2px; text-align: center; padding: 0px 0px 10px 0px}
H2{color: #303030; font-size: 30px; line-height: 32px; font-weight: normal; letter-spacing: -1px; text-align: left; padding: 0px 0px 10px 0px}

P.intro{color: #ffa010; font-size: 26px; line-height: 30px; letter-spacing: -1px; text-align: center; padding: 0px 0px 15px 0px}
P.intro-sub{color: #888; font-size: 22px; line-height: 28px; letter-spacing: -1px; text-align: center; padding: 0px 50px 25px 50px}
P.main, P.main A{color: #000; font-size: 16px; line-height: 22px}	
P.main STRONG{letter-spacing: -1px}
P.main{padding: 0px 0px 20px 0px}


/************************* FONT STACKS *******************/
H1, H2, P.main, P.intro-sub, P.label, P.font-embed{font-family: 'Open Sans', sans-serif}


/************************* COMMON CLASSES *******************/
.link-text{display: none}
.clear{width: 100%; clear: both; font-size: 1px; line-height: 0px}


/************************* HEADER *******************/
#header{width: 100%; padding: 17px 0px 15px 0px; background: #fff}
#header DIV.container H1{width: 354px; height: 59px; padding: 0px; background: url(../images/ya-nui-beach-villas.png)}
#header DIV.container H1 SPAN{display: none}	

#icon-menu{margin: 0px 0px 0px -34px; cursor: pointer; position: absolute; left: 100%; top: 20px; display: none}
#header DIV.container P.nav{text-align: right; width: 100%; position: absolute; left: 0px; top: 24px}
#header DIV.container P.nav A{color: #707070; font-size: 16px; line-height: 16px; font-weight: bold; letter-spacing: -1px; text-decoration: none; display: block; float: right; margin: 0px 0px 0px 70px; padding: 3px 0px 0px 0px}
#header DIV.container P.nav A:hover, #header DIV.container P.nav A.active{color: #000}

#header DIV.container P.nav A.index{width: 24px; height: 19px; padding: 0px; background: url(../images/icon-home-black.png)}
#header DIV.container P.nav A.index-active{width: 24px; height: 19px; padding: 0px; background: url(../images/icon-home-orange.png)}
#header DIV.container P.nav A.index SPAN{color: #fff; font-size: 1px; line-height: 0px}

	
/************************* CONTAINER *******************/
DIV.container{width: 980px; min-height: 0px; margin: 0px auto; position: relative}


/************************* BANNER *******************/
#banner-outer{width: 100%; height: auto; position: relative}
#banner-inner{height: 500px; position: relative; overflow: hidden}
#banner{width: 1600px; height: 500px; margin-left: -800px; position: absolute; left: 50%}
#banner-transparent-strip{width: 100%; height: 80px; margin: -80px 0px 0px 0px; border-top: solid 1px #888; position: absolute; left: 0%; top: 100%; background: url(../images/bg-transparent.png)}
#banner-transparent-strip P.banner-text, #banner-transparent-strip P.banner-text SPAN{color: #fff; font-size: 14px; line-height: 25px; text-align: center; padding: 16px 0px 0px 0px}
#banner-shadow, #banner-contact-shadow{width: 100%; height: 10px; margin: 5px 0px -10px 0px; z-index: 50; position: relative; background: url(../images/bg-banner-shadow.png) repeat-x}


/************************* RESERVE *******************/
#reserve{width: 240px; min-height: 0px; margin: -198px 0px 0px -490px; padding: 65px 20px 18px 20px; position: absolute; left: 50%; top: 50%; z-index: 99; background: url(../images/header-book-now.png) no-repeat -395px 0px}
#reserve P.reserve{color: #000; font-size: 12px; line-height: 12px; padding: 0px 0px 3px 1px}
#calendar-wrapper{position: relative}
#reserve INPUT.reserve, #reserve SELECT{color: #000; font-size: 12px; line-height: 12px; width: 236px; margin: 0px 0px 12px 0px; padding: 3px 1px 3px 1px; border: solid 1px #d0d0d0; background: #fff}
#reserve SELECT{width: 240px}
#reserve DIV.arrival-departure-1, #reserve DIV.arrival-departure-2{width: 110px; margin: 0px 20px 12px 0px; float: left}
#reserve DIV.arrival-departure-2{margin: 0px}
#reserve INPUT.arrival-departure{width: 106px; margin: 0px}
#reserve-responsive-wrapper-1, #reserve-responsive-wrapper-2{font-size: 1px; line-height: 0px}
#reserve IMG.button-submit-reservation{margin: -5px 20px 0px 0px; cursor: pointer}
#reserve #reservation-throbber{width: 26px; height: 26px; margin-top: -5px; visibility: hidden}	


/************************* CALENDAR *******************/
#calendar{width: 250px; display: none; position: absolute; top: 40px; z-index: 99; background: #fffff8}
DIV.calendar-arrival{left: 0px}
DIV.calendar-departure{left: 130px}	
	
DIV.calendar-month{font-size: 1px; line-height: 0px; padding: 5px 4px 15px 5px; border: solid 1px #d0d0d0; display: none}
DIV.calendar-month-active{display: block}

DIV.calendar-header{padding: 10px 0px 9px 0px; position: relative; background: #e8e8e8}
P.calendar-header{color: #000; font-size: 14px; line-height: 14px; font-weight: bold; letter-spacing: -1px; text-align: center}
IMG.button-calendar-up, IMG.button-calendar-down{margin: 0px 0px 0px -23px; position: absolute; left: 100%; top: 10px; cursor: pointer}
IMG.button-calendar-down{margin: 0px 0px 0px 10px; left: 0%}

P.calendar-day{color: #000; font-size: 12px; line-height: 12px; text-align: center; width: 14.2%; padding: 10px 0px 10px 0px; float: left}
DIV.calendar-day{width: 14.2%; height: 22px; float: left}
DIV.calendar-day-inner{color: #fff; font-size: 12px; line-height: 12px; text-align: center; height: 12px; margin: 0px -1px 0px -1px; padding: 5px 0px 5px 0px; border: solid 2px #fff; background: #fffff8}
DIV.calendar-day-inner-booked{background: #ffa010}
DIV.calendar-day-inner-available{color: #000; cursor: pointer; background: #c5f0fb}

DIV.date-available-booked{height: 20px; padding: 15px 0px 0px 0px; clear: both}
DIV.date-available, DIV.date-booked{height: 20px; width: 50%; float: left}
DIV.date-booked{float: right}
DIV.date-available P, DIV.date-booked P{color: #000; font-size: 14px; line-height: 14px; font-weight: bold; letter-spacing: -1px; padding-top: 3px}
DIV.date-available SPAN, DIV.date-booked SPAN{width: 20px; height: 20px; margin: 0px 5px 0px 5px; display: block; background: #c5f0fb}
DIV.date-booked SPAN{background: #ffa010}
DIV.date-available P, DIV.date-available SPAN{float: right}
DIV.date-booked P, DIV.date-booked SPAN{float: left}


/************************* HOME PAGE *******************/
#home-page{min-height: 0px; padding: 30px 0px 0px 0px}

#features-amenities{margin: 10px 0px 0px 0px; padding: 30px 0px 24px 0px; background: #fffff4 url(../images/bg-banner-shadow.png) repeat-x 0px 0px}
#features-amenities DIV.container{position: relative}
#features-amenities DIV.left{width: 80px; position: absolute; left: 50px; top: 2px}
#features-amenities DIV.left P{color: #000; font-size: 16px; line-height: 16px; font-weight: bold; letter-spacing: -1px}	

#features-amenities-inner{padding: 0px 50px 0px 150px}
#features-amenities DIV.center, #features-amenities DIV.right{width: 50%; float: left}
#features-amenities DIV.features-amenities-list P{color: #000; font-size: 14px; line-height: 18px; padding: 0px 20px 6px 20px; background: url(../images/bullet-orange.png) no-repeat 0px 6px}
#features-amenities DIV.left P{padding-right: 0px}

#villa-section{font-size: 1px; line-height: 0px; padding: 25px 0px 25px 0px; background: #101010}
#villa-section DIV.container{font-size: 1px; line-height: 0px}
#villa-section DIV.outer{width: 50%; float: left}
#villa-section DIV.inner{font-size: 1px; line-height: 0px; margin: -1px -1px 0px 0px; border: solid 1px #202020}
#villa-section IMG{font-size: 1px; line-height: 0px; width: 100%; height: auto}	
#villa-section P.read-more{text-align: center; padding: 30px 0px 0px 0px}
#villa-section P.read-more A{color: #fff; font-size: 16px; line-height: 16px; font-weight: bold; letter-spacing: -1px; text-decoration: none; padding: 4px 40px 4px 40px; background: #ffa010}

	
/************************* FOOTER *******************/
#footer{width: 100%; border-top: solid 2px #404040; padding-bottom: 20px; background: #fff}
#footer DIV.container{padding: 28px 0px 0px 0px}
#footer P{text-align: center}
P.footer-main, P.footer-main A{color: #000; font-size: 14px; line-height: 14px}
P.footer-main SPAN.divider{padding: 0px 25px 0px 25px}
	
P.footer-misc{color: #202020; font-size: 14px; line-height: 17px; margin: 18px 0px 0px 0px; padding: 12px 20px 15px 20px; border-top: solid 1px #c0c0c0}
P.footer-credit, P.footer-credit A{color: #606060; font-size: 16px; line-height: 16px; font-weight: bold; letter-spacing: -1px}

P.admin{text-align: center; padding: 6px 0px 6px 0px; background: #000}
P.admin A{color: #fff; font-size: 14px; line-height: 14px; text-decoration: none}