@charset "utf-8";
/* ******************************
1. Reset
******************************* */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: Helvetica, Arial, sans-serif;
	vertical-align: baseline;
}
:focus {
	outline: 0;
}
body {
	line-height: 1;
	color: black;
	background: black;
}
ol, ul {
	list-style: none;
}
caption, th, td {
	text-align: left;
	font-weight: normal;
}

/* ******************************
2.1 Main Global Layout Settings 
******************************* */

*{ padding: 0px; }
body, html{ height: 100%; margin: 0;height: auto; min-height: 100%; }
body{ 
	font: 12px  Helvetica, Arial, sans-serif;
	background-color: #333;
	background-repeat: repeat; 
	color: #ccc;
	}
a{ outline: none; text-decoration:none; color:#ccc; }
a:hover{text-decoration:none; color:#e8e381 }
a img{ border: none; }
p {margin:0 0 10px 0}

.clear {clear:both;}
.clearlast {clear:both;padding-bottom:35px;}
.clearlastgallery {clear:both;padding-bottom:55px;}
.ienoclear {clear:both;}
.clearfix:after	{ content: "."; visibility: hidden; display: block; height: 0px; clear: both; }
* html .clearfix{ height: 1%; }
*+html .clearfix{ height: 1%; }

.float-right { float:	right; }
.float-left {float:	left; }

.align-right { float:right; }
.align-left { float:left; }
.align-center { margin:0 auto; display:block;}

.single-header-space { margin: 25px 0 0 0; }
.blank-head-space-1 { margin: 24px 0 0 0; }

.gradient {
filter:none;
}

.type-post, .type-mtheme_portfolio, .type-page {
	margin: 0;
	}
strong {font-weight:bold}
em {font-style:italic}

/* customize */

.main-select-menu,.x-pc {display:none;}	
.main-select-menu select { position:relative;width:100%;padding:10px;z-index:99;}

h1 {font-family: Helvetica, Arial, sans-serif; font-size:24px; color:#e8e381; text-transform:uppercase}
h2 {font-family: Helvetica, Arial, sans-serif;font-size:18px;margin-bottom:5px; font-weight: normal; color:#e8e381}
h3 {font-size:14px; line-height:normal; font-weight: bold}
.mobile-slide {display:none}
header {width:100%; height:115px; margin:0; text-align:left; background:#000; position:fixed; top:0; z-index:10;
-moz-box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.6);
-webkit-box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.6);
box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.6);
}
.in-header {width:91%; height:115px; margin:0 auto; position:relative}
.logo {width:160px; height:auto; margin:20px 0 0 0; float:left; text-align:center; font-size:11px}
.logo a {color:#ccc}
.logo img {width:100%; height:auto; margin:0 0 3px 0;}
nav {position: absolute;bottom: 0;right: 5%;width: 95%;z-index: 10;}
nav ul {width:100%; text-align:right}
nav li {display:inline;margin:0 0 0 2.5%; line-height:40px}
nav li a {color:#f2f1ed; font-size:15px; text-transform:uppercase; padding: 0 0 7px 0}
nav li a:hover, nav .select a{color:#e8e381; border-bottom:4px solid #e8e381}
.bestrate {width:223px; height:auto; position:absolute; top:0; right:0}
.topslide {width:100%; position: relative; margin-top:100px; min-height:200px; background:#000 url(../images/bg-logo.gif) center no-repeat}
.topslide2 {width:93%;background:#0f0f0f;border-radius: none;padding: 1.5%;margin:115px auto 0 auto;max-width: 1500px;position: relative;}
.thumbnail {width:100%}
.thumbnail img {width:33.33%; height:auto; float:left}

.content {width:100%; margin:0 auto 60px auto;position:relative;}
.content h2 {font-size:16px; margin:0 0 5px 0; line-height:normal}
.content h1 { display:block; position:absolute; top:-15px; left:10px; padding:5px 10px; color:#fff; background:#000}
.content-home {width:100%;margin:0 auto 60px auto;position:relative;}
.content ul {margin-bottom:10px; position:relative}
.content li {list-style:url(../images/list.png); margin:5px 0 0 15px; padding:0}
.content h3 {font-size:13px; font-weight:bold}
.package-home {width:260px; height:auto; position:absolute !important; bottom:30px; left:5%;padding:10px; background:#0f0f0f; z-index:1}
.intro {width: 580px;text-align: right; position:absolute; bottom:7%; right:5%; z-index:1}
.intro h1 {font-size:35px; line-height:38px; color:#fff; margin:0 0 0 0; font-weight:bold;
text-shadow:
3px 3px 0 #000,
-1px -1px 0 #333,  
1px -1px 0 #333,
-1px 1px 0 #333,
1px 1px 0 #333;}
.intro h1 span{font-size:22px;font-family: Helvetica, Arial, sans-serif; line-height:normal; color:#fff}
.intro p {font-family: Helvetica, Arial, sans-serif;font-size:20px; line-height: normal; color:#fff; margin-top:5px; font-weight:bold;
text-shadow:
3px 3px 0 #000,
-1px -1px 0 #333,  
1px -1px 0 #333,
-1px 1px 0 #333,
1px 1px 0 #333;}
.maincontent {width:94%; background:#0f0f0f; border-radius:none; padding:1% 0 0 1%; margin:0 auto; max-width:1500px}
.facilities,.contact {width:980px; margin:0 auto; position:relative ; background:#0f0f0f; padding:35px 15px 15px 15px;}
.location,.contact,.room,.parinda,.sitemap,.promotion {width:93%; background:#0f0f0f; border-radius:none; padding:30px 1.5% 1.5% 1.5%; margin:0 auto; max-width:1500px; position:relative}
.gallery {width:93%; background:#0f0f0f; border-radius:none; padding:30px 1.5% 1.5% 1.5%; margin:150px auto 0 auto; max-width:1500px; position:relative}
.gallery img {width:16.2%; height:auto; margin:.1%}
.gallery h2 {margin: 5px 0 0 0;}
.roomdetail {background:#333;float:left;width:23%; margin:1%; position:relative}
.roomdetail img { width:100%; height:auto; float:left; margin-bottom:15px}
.roomdetail table { width:94%; margin:0 3% 20px 3%}
.roomdetail td {padding:2px; text-align:left; font-size:12px}
.roomdetail h3 {margin:10px 3% 10px 3% !important; font-size:15px; color:#e8e381}
.roomdetail:hover {background:#eee;color:#000;}
.roomdetail:hover h3 {color:#000}
.roomdetail span a {color:#eee;display:block;margin:0 0 10px 10px; line-height:24px; text-align:center; width:100px; background:#e8e381; color:#333; border-radius:3px;float: left}
.roomdetail span a:hover {color:#fff; background:#333}
.roomdetail a {color:#333}
.roomdetail a:hover{text-decoration:none; color:#e8e381 }
.wide-text {width:100%; position:relative}
.wide-text ul {float:right; margin:0 0 0 2%}
.three-column {background:#1b1b1b; width:32.3%; margin:0 1% 1% 0; float:left;height:430px; position:relative; color:#ccc}
.three-column img { width:100%; height:auto; margin-bottom:5px; border-bottom:1px solid #666}
.three-column p {line-height:18px; margin:0 3% 3% 3%}
.three-column a {color:#ccc}
.three-column a:hover {color:#e8e381}
.three-column h2 {font-size:18px; margin:2% 3%; color:#e8e381; text-transform:uppercase}
.three-column h3 {font-size:16px; margin:3% 3% 5px 3%; color:#e8e381}
.qr-code {width:60px; padding:5px; position:absolute; bottom:10px; right:10px; text-align:center; font-size:11px; color:#666; background:#fff; line-height:12px}
.qr-code img {width:60px; height:auto; border:none}
.btn-book {display:block;width:100px; height:49px; position:absolute; top:0; left:0;}
.reservation {width: 95%; max-width:1517px;background:#0f0f0f;text-align: left;height: 49px;padding: 0;position: relative;margin: 0 auto;}
.reservation input[type="text"] {width:85px; text-align:center;font-size:11px; border:none; padding:2px; background:#ccc}
.reservation select {margin-top:15px;width:40px;font-size:11px; border:none; padding:2px; background:#ccc; }
.reservation label,.reservation form {float:left; display:block; margin-right:8px}
.reservation form {margin-top:12px; font-size:11px}
.reservation label {color:#ececec;line-height: 49px;}
img.email {width:180px; height:18px; border:none}
a.btn-home-download {display:block; position:absolute; bottom:3%; left:3%; background:url(../images/icon-download.png) left no-repeat #333; padding:3px 5px 3px 25px; border-radius:none;}
a.btn-home-download:hover {background:url(../images/icon-download.png) left no-repeat #666;}
a.btn-detail {display:block; position:absolute; bottom:3%; right:3%; background:url(../images/icon-more.png) left no-repeat #333; padding:1px 5px 1px 25px; border-radius:none;}
a.btn-detail:hover {background:url(../images/icon-more.png) left no-repeat #666;}
.btn-taxi {width:190px; height:auto; position:absolute; bottom:27px; left:31%}
.btn-taxi2 {width:190px; height:auto;}
.btn-offers {width:23%; height:auto; float:right; margin:0 .6% 0 2%}
img.booknow {margin:0; position:absolute; bottom:10px; right:10px; width:85px!important; height:auto}
img.booknow2 {margin:0; position:absolute; bottom:15px; right:0; width:90px!important; height:auto}
.check-in,.check-out,.ddroom,.ddadult,.ddchild {height:25px; line-height:25px; float:left; margin-right:1.5%}
.reservation input[type="image"]{position:absolute;top:0;right:0; height:49px; width:126px}
.reservation .head { height:39px; background:#000; padding:10px 0 0 0; text-align:center; width:150px; float:left; margin-right:1.5%}
.reservation .head h3 {color:#eee; font-size:17px; line-height:15px; text-transform:uppercase}
.reservation .head span {color:#eee; font-size:10px; text-transform:uppercase}
.reservation img.tcalIcon {margin: 0 0 4px 3px}
.heading {padding:35px 0 0 10px; color:#fff; background: url(../images/bg-heading.png) top right no-repeat; width:370px; position:relative; height:108px;z-index: 10}
.heading h1 {font-weight:normal; font-style:normal; font-size:22px; line-height:24px; margin-bottom:3px; text-transform:uppercase;background:url(../images/icon-lotus.png) top left no-repeat; padding-left:22px;}
.heading p {font-size:11px; line-height:normal; margin-bottom:5px}
.heading select {font-size:12px; border:none; width:210px}
.wrapdetail {width: auto; min-width:130px}
.detail {width:465px; background: url(../images/bg-detail.png) top left no-repeat; color:#333; padding:20px 10px 15px 45px; line-height:normal;position:absolute; top:135px; left:30px; z-index:5; min-width:150px}
.detail p {margin-bottom:20px}
.s-link { font-size:12px; text-decoration:none; margin-top:5px;width:100%; font-weight:bold; padding:2px 4px; background:#574d37; color:#fff}
.s-link:hover{background:#fff; color:#574d37}
.select-room { margin-bottom:20px; }
.contact-form { display:block;float:left;width:35%}
.contact-field {width:100%; min-height:30px; font-size:12px; margin-top:10px}
.contact-field2 {font-size:12px; margin-top:10px;}
.contact-field label { display:block; font-weight:bold; float:left;width:90%; line-height:20px}
.contact-field input[type="text"],.contact-field select,.contact-field2 input[type="text"],.contact-field input[type="email"] {line-height:25px; height:25px; padding:3px 2px; background:#666; color:#fff; border:none; width:90%; font-family:Helvetica, Arial, sans-serif}
.contact-field textarea {padding:0 2px; background:#666; color:#fff; border:none; width:90%; font-family:Helvetica, Arial, sans-serif; height:75px}
.contact-field2 input[type="submit"],.contact-field2 input[type="reset"] {display:block; color:#fff; padding:5px; font-weight:bold; background:#4d4d4d; border:none; cursor:pointer; float:left; margin-right:15px}
.contact-field2 input[type="submit"]:hover,.contact-field2 input[type="reset"]:hover {background:#333;}
form {margin:0;padding:0;}
.contact-button {width:60px;}
.error {color:#ff0000;margin:0 0 10px 0;}
.accept {color:#339966;margin:0 0 10px 0;}
.address { display:block;float:right; margin:0; width:30%; line-height:20px}
.note {font-size:12px; display:block; position:absolute; top:10px; left:150px}
ul.leftmenu {position:absolute; top:0 ;left:0; width:200px}
.leftmenu li { width:100%; margin:0 0 5px 0}
.leftmenu li a { padding:3%; width:92%;background:rgba(255,255,255,.7); display:block; text-transform:uppercase;color:#000;}
.leftmenu li a:hover, .leftmenu li .select {background:rgba(255,190,40,.8); color:#fff}
aside {width:193px; background:url(../images/bg-aside.png) top no-repeat; min-height:300px; float:left}
aside ul {margin:10px 14px 0 14px}
aside img {margin:0 0 0 14px;width:165px; height:auto}
aside h1 {font-size:16px; font-weight:bold; padding:14px 0 10px 14px; display:block}
aside h2 {font-size:14px; font-weight:bold; padding:0; margin:0; display:block}
aside li {display:block; border-bottom: 1px solid #ccc; padding-bottom:5px; margin-bottom:5px}
.quick-contact {display:none}
a.gps, a.taxi-card {padding:2px 5px 2px 25px; border-radius:none; font-size:13px; margin-right:10px}
a.gps {background:url(../images/icon-location.png) left no-repeat #333;}
a.taxi-card {background:url(../images/icon-print.png) left no-repeat #333;}
a.gps:hover {background:url(../images/icon-location.png) left no-repeat #666;}
a.taxi-card:hover {background:url(../images/icon-print.png) left no-repeat #666;}
img.btn-book2 {width:auto; height:27px; float:right; margin:15px 0 0 0}
.wrap3div {width:33%; float:left}
.btn-google {width:30%; height:auto; margin:0 10px 10px 0; float:left;font-size:11px}
.btn-google img {width:100%; height:auto}
.intropage {width:780px; margin:10% auto 0 auto}
.flashwrap {width:510px; height:430px; margin:0 auto; position:relative}
.flashwrap h1, .flashwrap h2 {color:#eee}
.entertohome {text-align:center; font-size:14px}
.mini-thumb {background:#1b1b1b; width:17%; margin:0 1% 1% 0; color:#ccc; font-size:11px; float:left; text-align:center}
.mini-thumb img { width:100%; height:auto; border-bottom:1px solid #666}
.mini-thumb2 {background:#1b1b1b; width:22%; margin:0 .5%; color:#ccc; float:left; text-align:center; padding:0 0 5px 0}
.mini-thumb2 img { width:100%; height:auto; border-bottom:1px solid #666}
.dining-aside {width:23%; height:auto; float:right; margin:0 1% 0 2%}
.dining-aside img {width:100%; height:auto;}
.dining {
width: 93%;
background: #0f0f0f;
border-radius: none;
padding: 1.5%;
margin: 0 auto;
max-width: 1500px;
position: relative;
}
img.logo-myfav {
width: 15%;
height: auto;
margin: 0 15px 0 0;
float: left;
}

ul.list50 {width:35%; float:left; margin:0 1% 15px 0}
ul.list5col {width:14.3%; float:left; margin:0 .5% 15px 0}
.rate-table { width:45%; float:right}
.promotion-list-wrap {width:49%; float:left}
.promotion-list-wrap2 {width:49%; float:right}
.promotion-list {width:100%; padding:1% 1% 35px 1%; background:#333; margin:0 0 2% 0; position:relative}
.promotion-list img {width:30%; height:auto; margin-right:2%; float:left}
.promotion-detail { width:68%; float:left}
.promotion table {width:100%; border:0; padding:0; margin-bottom:10px}
.promotion th,.promotion td {text-align:center; vertical-align:middle; padding:1% 0; width:20%}
.promotion th {background:#272727}
.promotion td {background:#666; color:#fff;}
.promotion li {font-size:11px}
.content2col {width:50%; float:left}
.content3col {width:50%; float:left; margin-top:30px}
ul.breadcrum { width:100%; margin:10px 0 0 0; padding:10px 0 0 0; border-top:#333 solid 1px}
.breadcrum li {list-style:none; display:inline; float:left; padding:0 1%; font-weight:bold; margin:0; border-right:#333 solid 1px}
table.bangkok-landmark { width:100%; border:0}
.bangkok-landmark th,.bangkok-landmark td {text-align:center; vertical-align:middle; padding:1% 0;}
.bangkok-landmark th {background:#333; font-weight:bold}
.bangkok-landmark td {background:#666; color:#fff;}
.bangkok-landmark td.place {text-align:left; padding:1%;}
.mobile-nav {display:none}
.sitemap ul {width:25%; float:left}
.sitemap ul li ul {width:100%; margin:0 0 5px 0}
.btn-show {display:block; height:15px; width:15px; background:url(../images/btn-show.png) no-repeat; position:absolute; top:0; left:120px; z-index:1}
.btn-hide {display:block; height:15px; width:15px; background:url(../images/btn-hide.png) no-repeat; position:absolute; top:0; left:120px; z-index:2}
blockquote {display:block; width:69%; padding-right:55px; background:url(../images/q-c.png) bottom right no-repeat;float:left; margin-top:15px}
blockquote p {font-family:'Lucida Sans Typewriter', 'Lucida Grande', sans-serif;font-size: 14px;color: #ccc;font-style:italic; line-height:20px}

blockquote:before {
	display: block;
	float: left;
	margin: -20px 15px 0 0;
	font-size: 100px; /* let's make it a big quote! */
	content: open-quote; /* here we define our :before as a smart quote. It could be any content, even the HTML entity alternative to this opening quote, that is “ */
	color: #e8e381;
	text-shadow: 0 1px 1px #909090;
}
blockquote:after {content: none;/* could be content:close-quote; but lets keep it clean*/}
.cite{font-size:12px;text-align: right; color:#ccc}
p.name {
font-family: 'Lucida Sans Typewriter', 'Lucida Grande', sans-serif;
font-size: 12px;
text-align: right;
display: block;
width: 69%;
padding-right: 55px;
font-style: italic;
float: left;
margin-top: 10px;
}


footer {width:100%; height:47px; background:#000; line-height:normal; font-size:11px;color:#ccc; z-index:11; position:fixed; bottom:0}
.footer-text {padding: 7px 0 0 3%;height: 40px;line-height: normal}
footer a{color:#ccc; text-decoration:none; font-size:11px}
footer a:hover{color:#eee;text-decoration: underline}
.footer-text ul { margin-top:5px }
.footer-text li {line-height:10px;display:inline; float:left; border-right:#333 solid 1px; padding:0 5px}
.footer-text li a {color:#ccc;}
.footer-mobile {display:none}
.socials {position:absolute; right:3%; top: -25px;}
.socials img { margin:5px 0 0 5px; width:auto; height:15px;}
.checkavailability {background:rgba(0,0,0,.4);position:absolute; top:0; right:3%; height:42px; padding-top:5px; font-size:10px; z-index:11; width:450px}
.checkavailability h3 {color:#fff; clear:both; font-size:14px; float:left; line-height:20px}
.checkin,.checkout {float:left; margin-left:10px; width:94px}
.checkavailability label {font-size:10px; line-height:10px; float:left; width:100%; color:#ccc}
.checkin input,.checkout input { width:65px; height:18px; font-size:11px; border:none; text-align:center; background:#ccc; color:#333}
.checkavailability select { width:40px; height:18px; font-size:11px; border:none; background:#ccc; color:#333}
.adultinput,.childinput,.roominput {width:40px}
.adultinput,.childinput,.roominput,.button {float:left; margin-left:10px}
.button {position:absolute; top:8px; right:0; width:83px; height:auto}
.booking-engine {position:absolute; right:3%; bottom:10px}
.mobile-book {display:none}
img.qr-code {width:auto; height:47px; position:absolute; right:15px; bottom:0; z-index:10}
.mobile-scan {position:absolute; right:75px; top:5px; font-size:12px; color:#eee}

.why-book-direct {/*position: absolute;bottom: 7%;left: 3%; */width:400px}

/* show hide button */
.menu-toggle {width:105px;height:30px;text-indent:-99999px;cursor:pointer;position:absolute;opacity:1;top:5px;right:50px;-webkit-transition: all 0.2s ease-in;-moz-transition: all 0.2s ease-in;transition: all 0.2s ease;
z-index:100}
.menu-toggle:hover {opacity:1;-webkit-transition: all 0.2s ease-in;-moz-transition: all 0.2s ease-in;transition: all 0.2s ease;}
.menu-toggle-off {background: url(../images/menu_toggle.png) 0 top;}
.menu-toggle-on {background: url(../images/menu_toggle.png) 0 bottom;}
.clear {clear:both}