/* CSS Document */
@font-face {
	font-family: 'Conv_ThaiSansNeue-Regular';
	src: url('fonts/ThaiSansNeue-Regular.eot');
	src: local('
'), url('fonts/ThaiSansNeue-Regular.woff') format('woff'), url('fonts/ThaiSansNeue-Regular.ttf') format('truetype'), url('fonts/ThaiSansNeue-Regular.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}

img{ border:0; margin:auto;}
*{ margin:0; padding:0;}
a{ text-decoration:none;}
a:hover{ text-decoration: none;}

body {
	background:#FFF ;
	font-family: 'Conv_ThaiSansNeue-Regular';
	font-size:22px;
	color:#000;
}
.carousel-control.right{
	background-image: inherit;
}
.carousel-control.left{
	background-image:inherit;
}
.carousel-inner>.item>img {
    margin: auto;
	width:100%;
}
.red{color:#F00;}

.cleaner {clear:both; width:100%; height:0px;}
.h30{clear:both; width:100%; height:30px;}
.h20{clear:both; width:100%; height:20px;}
.h10{clear:both; width:100%; height:10px;}

.hvr-grow {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -moz-osx-font-smoothing: grayscale;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: transform;
  transition-property: transform;
}
.hvr-grow:hover, .hvr-grow:focus, .hvr-grow:active {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}
.pull-left{
	margin-left:5%;
}
/*///////////////////////////////////////////////////head///////////////////////////////////////////////////*/
.navbar-brand{
	position: relative;
}
.navbar-brand>img {
	position:absolute;
	width:5em;
    top:0em;
}
.navbar{
	margin-bottom:0;
	border-radius:0;
	border:0;
}
.navbar-default {
    background-color: #783b25;
    border-color: #783b25;
}
.navbar-default .navbar-toggle .icon-bar{
	background-color:#ffc20f;
}
.navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:focus, .navbar-default .navbar-nav>.active>a:hover{
	color:#ffc20f;
    background-color: #783b25;
}
.navbar-nav>li>a{
	text-transform:uppercase;
	transition:all 0.4s;
}
.navbar-default .navbar-nav>li>a:focus, .navbar-default .navbar-nav>li>a:hover{
	color:#ffc20f;
    background-color: #783b25;
}
.navbar-default .navbar-toggle:focus, .navbar-default .navbar-toggle:hover{
	background-color:transparent;
}
.navbar-default .navbar-toggle{
	border:0;
}
.book-room{
    background-color: #783b25;
}
.book-room a{
	color:#ffc20f;
	text-transform:uppercase;
    font-family: 'DSNBRO';
	padding:1% 0 1% 5%;
}
/*///////////////////////////////////////////////////////////////////////////content///////////////////////////////////////////////////////////////////////////*/
.bg-content{
	background:url(../images/bg-content.png) top center no-repeat;
	webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}
.about-title{
	padding:7% 0 3%;
}
.about-detail{
	text-align:justify;
}
.title-detail{
	text-transform:uppercase;
}
.youtube-box{
	background-color:#783b25;
	padding:2%;
	text-align:center;
	margin:auto;
}
.youtube-box iframe{
	margin:auto;
	width:100%;
}
.tagline{
	font-size:20px;
	color:#000;
	margin:auto;
	text-align:center;
	display:block;
}
.room-box{
	position:relative;
	overflow:hidden;
	cursor:pointer;
	height:180px;
}
.room-box img{
	width:100%;

}
.name-room{
	width:100%;
	font-weight:bold;
    font-size: 30px;
    color: #FFF;
	display: block;
    text-align: center;
    margin: auto;
	display: block;
	z-index:99;
	position:absolute;
	bottom:0;
	padding:1% 0;
    text-transform: uppercase;
    background-color: rgba(0,0,0,0.7);
}
.room-stlye{
	margin:3% 0;
}
/*.room-view{
	margin:auto 15px;
}*/

.room-boxlarge{
	position:relative;
	overflow:hidden;
	cursor:pointer;
	width:100%;
}

.room-boxlarge img{
	max-width: 100%;  
	-moz-transition: all 0.3s;
	-webkit-transition: all 0.3s;
	transition: all 0.3s;
}
/*///////////////////////////////////////////////////////////////////////////content///////////////////////////////////////////////////////////////////////////*/


/*///////////////////////////////////////////////////////////////////////////footer///////////////////////////////////////////////////////////////////////////*/
.bg-footer{
	background: linear-gradient(to bottom, rgba(120,59,37,1) 0%, rgba(120,59,37,1) 23%, rgba(50,25,15,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#783b25', endColorstr='#32190f', GradientType=0 );
	color:#FFF;
}
.name-footer img{
	width:95%;
}
.facebook-box{
	background-color:#FFF;
	padding:1%;
	margin:auto;
	text-align:center;
}
.facebook-box .fb-page{
	margin:auto;
}
.contact-footer{
	font-size:21px;
	line-height:2;
}
.contact-footer a{
	color:#FFF; 
}
.contact-footer img{
	vertical-align:middle;
}
.addess-footer{
	font-size:22px;
	color:#FFF;
	text-align:justify;
}
.copyright {
	font-size:18px;
	padding:1% 5%;
}
.copyright a{
	color:#FFF;
	transition:all 0.3s;
}
.copyright a:hover{
	color:#ffc20f;
}
.topic{
	font-size:34px;
	margin:30px auto;
	border-bottom: 1px solid #562C2C;
	line-height:30px;
}
.topic a{
	color:inherit;
}
.topic a:hover{
	color:#069;
}

.view-room-title {
    font-size: 1.2em;
}
.box-vdo {
	margin:auto;
	text-align:center;	
}
.box-vdo iframe{
	width: 50%;
	height:300px;
	padding-top:0 !important;
	margin:auto;
	border:solid 1px #333;
}
/*///////////////////////////////////////////////////////////////////////////footer///////////////////////////////////////////////////////////////////////////*/
a.box-pdf{
    border: 0;
    background: #d24949;
    color: #fff;
    margin: 10px 0;
    display: inline-block;
    text-align: center;
    padding: 2px 20px 0px 20px;
    cursor: pointer;
}
a.box-pdf:hover{
    color: #333
}
/*-----List Page-----///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/

div.badoo {
	margin-top:20px;
	padding:10px 0px;
	margin-right:20px;
	font-size:14px; 
	color: #000; 
	font-family:Arial, Helvetica, sans-serif;
	text-align:right;text-decoration:none;
}


div.badoo a{
	border: #4E4A4C 1px solid;
	padding: 3px 8px;
	margin: 0px 4px;
	color: #181516;
	text-decoration: none;
	background: #FFFFFF;
}
div.badoo a:hover {
	border:#999 1px solid;
	color:#FFF;
	background: #9a9a9a; /* Old browsers */
}

div.badoo span.current {
	padding: 3px 8px;
	border: #75676E 1px solid;
	background: #7c7c7c;
	color: #FFFFFF;
	margin: 0px 4px;
}
div.badoo span.disabled {
	display:none;
}

.bx-wrapper img {
     max-width: 60%; 
     width: inherit; 
    display: block;
}
.text-regulations{
	margin: auto 5px auto 30px; 
	font-size:24px;
}
/*----Contact----/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
.text-contact{
	font-size:22px;
}
.map{
	width:100%;
	height:300px;
}
.map-contact{	
	padding:0;
	width:auto;
	margin:0 -10px 0 -60px;
}
.page-contact{
	font-size:23px;
}
.page-contact p{
	padding:0;
	margin:0;
}
.button_contact{
	margin:2px 0 0 0;
	padding:0px 20px;
	cursor:pointer;
	font-size:20px;
}
.form-contact-name{
	font-size:28px;
	font-weight:bold;
}
.form-group  label{font-size:20px;}
input.form-control{
	font-size:18px;
	display: block;
	border-style: solid;
	border-width: 1px;
	border-color: #dedede;
	margin-bottom: 5px;
	padding: 3px 0 3px 10px;
	width: 100%;
	color: #777;
	border-radius:5px;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) inset;
	-moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) inset;
	-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) inset; 
	transition: border 0.15s linear 0s, box-shadow 0.15s linear 0s, color 0.15s linear 0s;
	-webkit-transition: border 0.15s linear 0s, box-shadow 0.15s linear 0s, color 0.15s linear 0s;
	-moz-transition: border 0.15s linear 0s, box-shadow 0.15s linear 0s, color 0.15s linear 0s;
	-o-transition: border 0.15s linear 0s, box-shadow 0.15s linear 0s, color 0.15s linear 0s;
}
.form-contact .txtinput:focus { 
	color: #333;
	border-color: rgba(41, 92, 161, 0.4);
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) inset, 0 0 8px rgba(41, 92, 161, 0.6);
	-moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) inset, 0 0 8px rgba(41, 92, 161, 0.6);
	-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) inset, 0 0 8px rgba(41, 92, 161, 0.6);
	outline: 0 none; 
}
.form-contact .code {
	border-style: solid;
	border-width: 1px;
	border-color: #dedede;
	margin-bottom: 5px;
	font-size: 20px;
	padding: 3px 0 3px 35px;
	width: 50%;
	color: #777;
	border-radius:5px;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) inset;
	-moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) inset;
	-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) inset; 
	transition: border 0.15s linear 0s, box-shadow 0.15s linear 0s, color 0.15s linear 0s;
	-webkit-transition: border 0.15s linear 0s, box-shadow 0.15s linear 0s, color 0.15s linear 0s;
	-moz-transition: border 0.15s linear 0s, box-shadow 0.15s linear 0s, color 0.15s linear 0s;
	-o-transition: border 0.15s linear 0s, box-shadow 0.15s linear 0s, color 0.15s linear 0s;
}

.form-contact textarea {
	display: block;
	border-style: solid;
	border-width: 1px;
	border-color: #dedede;
	margin-bottom: 5px;
	font-size: 20px;
	/*padding: 3px 0 3px 35px;*/
	width: 100%;
	height: 100px;
	color: #777;
	border-radius:5px;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) inset;
	-moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) inset;
	-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) inset; 
	transition: border 0.15s linear 0s, box-shadow 0.15s linear 0s, color 0.15s linear 0s;
	-webkit-transition: border 0.15s linear 0s, box-shadow 0.15s linear 0s, color 0.15s linear 0s;
	-moz-transition: border 0.15s linear 0s, box-shadow 0.15s linear 0s, color 0.15s linear 0s;
	-o-transition: border 0.15s linear 0s, box-shadow 0.15s linear 0s, color 0.15s linear 0s;
}
.form-contact textarea:focus {
	color: #333;
	border-color: rgba(41, 92, 161, 0.4);
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) inset, 0 0 8px rgba(40, 90, 160, 0.6);
	-moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) inset, 0 0 8px rgba(40, 90, 160, 0.6);
	-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) inset, 0 0 8px rgba(40, 90, 160, 0.6);
	outline: 0 none; 
}
.verify-code{ margin-top:-2px !important;height:28px !important; width:100px; vertical-align:middle; padding:0 5px;}
.refresh{vertical-align:middle; width:25px;}

.sendmail {
	font-size:1.2em;
	font-weight:bold;
	border:1px solid #09F;
	color:#036;
	background:#FFF;
	padding:0em 1em;
	margin:20px auto;
}
.sendmail:hover{
	color:#000;
	transition: 0.3s cubic-bezier(.6,.2,.5,1.3);
	cursor:pointer;
}
.btn-map, .btn-df {
    border: 0;
    background: #696969;
    color: #fff;
    margin: 10px 0;
    display: inline-block;
    text-align: center;
    padding: 2px 20px 0px 20px;
    cursor: pointer;
}
a.btn-map{
	font-size:24px;
}
a.btn-map:hover{
	color:#000;
}
.img-lang{
	border-bottom: 2px #FFF solid;
}
.img-nonelang{
	border-bottom: 2px #e9cd3f solid;
}
.boximg-intro{
	text-align:center;
	margin:10px auto 20px auto;
}
.boximg-intro img{
	border: solid 1px #333;
}
/*-----List Page-----///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
.lang-right{
	float:right;
	margin: 5px 10px;
	color:#FFF;
}
.lang-right .img-nonelang {
    border-bottom: 2px #783b25  solid;
}
/****************************/
@media (max-width: 767px ) {
	body{
		max-width: 100% !important;
	}
	.navbar-collapse{
		position: fixed;
		width: 250px;
		background: #fff;
		height: 100vh !important;
		max-height: none !important;
		top: 0;
		display: block;
		left: -250px;
		margin: 0 !important;
		z-index: 9999;
	}
	.navbar-collapse.in{
		left: 0 !important;
	}
	.all-container{
		width: 100%;
	}
	.all-container.-collapse{
		margin-left: 250px;
	}
	.navbar-default, .navbar-collapse, .navbar-collapse.collapsing, .all-container.all-container.all-container {
		transition: all 0.5s !important;
	}
	.navbar-default.-collapse {
		margin-left: 250px;
		width:100%;
	}
}