﻿/*
*	Reset css By 960.gs
*/

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,b,u,i,center,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-size:100%;vertical-align:baseline;background:transparent}body{line-height:1}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}:focus{outline:0}ins{text-decoration:none}del{text-decoration:line-through}table{border-collapse:collapse;border-spacing:0}

/*
*	General
*/
body {
background: #dde6e8 url("images/pattern.png") repeat top left;
font-family: Tahoma, Verdana, Geneva, sans-serif;
font-size: 14px;
color: #444444;
line-height: 20px;
}
a:link, a:active, a:visited { color:#4a89dd; text-decoration:none; }
a:hover { color:#382AD7; text-decoration:underline; }
h1,h2,h3,h4 { font-family: "Trebuchet MS",Tahoma, Verdana, Geneva, sans-serif; }

.tabmenu { list-style: none; }
	.tabmenu li { float: left;  }
		.tabmenu li a { display: block;}
		.tabmenu li a:hover { text-decoration:none;}

.notice {
background: #F7DED4;
padding: 10px;
margin-top: 10px;
}

.spacer {
clear: both;
}		
	/*
	*	form
	*/
		.text, select, input, textarea{
			color: #000000;
			font-style: italic;
			font-size: 14px;
		}
		.text {
		border: 1px solid #12635A;
		line-height: 24px;
		}
		select {
		text-align: center; /* ไม่แสดงผลมน IE */
		}
		/*
		*	miniform
		*/
		.miniform {
		}
			.miniformline {
			margin: 5px 0 0 0;
			}
			.miniform-btn {	
			width: 110px;
			margin: 10px 0 0 0;
			}
	/*
	*	page now
	*/
	#page-home ul li #navi-home ,
	#page-overview ul li #navi-overview ,
	#page-ourrooms ul li #navi-ourrooms ,
	#page-reservation ul li #navi-reservation ,
	#page-gallery ul li #navi-gallery ,
	#page-map ul li #navi-map ,
	#page-contactus ul li #navi-contactus
	{
	color:#ffffff;
	background: #126f64 url(images/head-navi-bg.jpg) no-repeat center center;
	}


/*
*	Layout
*/
#container { 
width: 990px;
margin: 60px auto 0;
background: #ffffff url(images/page-bottom-bg.jpg) no-repeat center bottom;
overflow:auto;
padding-bottom: 28px;
}
#header {
height: 400px;
padding: 20px 25px 0;
background: #ffffff url(images/page-bg.jpg) repeat-y center top;
}
	#navi {
	height: 40px;
	margin: 0 auto 20px;
	text-align: center;
	}
	#logo {
	width: 280px; height:340px;
	float: left;
	background: #247165;
	overflow: hidden;
	}
	#banner {
	width: 640px; height: 340px;
	float: left;
	margin-left: 20px;
	}
#wrapper {
padding: 0 25px 0;
overflow: auto;
background: #ffffff url(images/page-bg.jpg) repeat-y center top;
}
	#sidebar {
	width: 280px;
	float: left;
	}
	#content {
	width: 640px;
	float: left;
	margin: 20px 0 0 20px;
	padding-bottom: 20px;
	border-bottom:3px solid #147B6F;
	}
#footer {
clear:both;
width: 940px;
margin: 0 auto;
height: 60px;
}
	#footer p {
	color: #666666;
	font-family: "Trebuchet MS",Tahoma, Verdana, Geneva, sans-serif;
	}
/*
* header navi menu
*/
.header-menu {
margin: 0 0 0 40px;
}
	.header-menu li {
	padding:0 10px 0;
	border-right: 1px dashed #ededed;
	}
		.header-menu li a {
		width: 100px; height: 40px;
		font-family: "Trebuchet MS",Tahoma, Verdana, Geneva, sans-serif;
		font-size: 18px;
		line-height: 40px;
		color: #126f64;
		text-decoration:none;
		}
		.header-menu li a:hover {
		color:#ffffff;
		background: #126f64 url(images/head-navi-bg.jpg) no-repeat center center;
		}
		.header-menu #navistart {
		border-left: 1px dashed #ededed;
		}
/*
* logo
*/
#logo h1 {
font-weight: normal;
color: #ffffff;
font-style:italic;
text-align: center;
}
#logo h1 span {
display: block;
}
.big-text {
font-size: 56px;
line-height: 60px;
margin-top: 100px;
}
.normal-text {
font-size: 24px;
line-height: 30px;
}
.en-text {
font-size: 36px;
line-height: 40px;
}
.tel-text {
font-size: 18px;
line-height: 22px;
}

/*
*	sidebar block 
*/
.sd-block {
width: 100%;
margin: 20px 0 0 0;
background: #F3F5EF;
float:left;
padding-bottom: 10px;
}
	.sd-block h2 {
	margin: 10px 30px 0 30px;
	font-size: 24px;
	line-height: 24px;
	color: #1A5048;
	padding-bottom:4px;
	border-bottom: 1px solid #818181;
	}
	.sd-block .sd-data {
	margin:12px 0 10px 30px;
	}

/*
*	index content
*/
.index-left ul, .index-right ul{
list-style: none;
}
.index-left {
width: 409px;
float: left;
}
.index-right {
float: left;
width: 220px;
padding: 0 0 0 10px;
border-left:1px solid #eeeeee;

}
	.index-right img {
	margin-bottom: 10px;
	}
.content-headtext {
clear:both;
font-size: 24px;
line-height: 36px;
font-weight: normal;
letter-spacing: 0.5px;
margin:0 0 3px 0;
}
	.content-headtext span {
	font-size: 36px;
	font-weight: bold;
	color: #147b6f;
	}
.welcome, .gallery {
width:400px;
overflow:auto;
}
	.welcomelist {
	float:left;
	}
		.welcomelist li {
		background: url(images/turtle-icon.png) no-repeat left center ;
		height: 22px;
		float: left;
		display: inline;
		width: 190px;
		margin: 0 0 0 10px;
		}
			.welcomelist li a{
			text-decoration: none;
			margin-left: 25px
			}

	.serviceslist {
	margin: 10px 0 0 40px;
	}
		.serviceslist li {
		background: url(images/check-icon.png) no-repeat left center ;
		padding-left: 20px;
		}
.gallery {
margin-top: 20px;
}
.gallery img{
margin:0 0 0 2px;
width: 94px; height: 94px;

}

/*
*	overview
*/		
.overview {
}
	.overview-block {
	clear:both;
	padding-top: 20px;
	}
		.overview-block h3 {
		font-size: 18px;
		color: #1A5048;
		}
		.overview-img {
		width: 340px; height: 200px;
		margin: 10px 0 0 0;
		}
		.overview-info {
		margin: 10px 0 0 0;
		}
			.italic {
			font-size:17px;
			color: #000000;
			font-style: italic;
			}
		.overview-link {
		padding-left: 26px;
		font-size: 14px;
		background:url(images/linkmap-icon.png) no-repeat left center;
		}
		.overview-left {
		float: left;
		margin-right: 20px;
		}
		.overview-right {
		float: right;
		margin-left: 20px;
		}
		
/*
*	our rooms
*/
.ourrooms {
}
	.ourrooms-block {
	width: 100%;
	margin-top: 20px;
	}
		.ourrooms-block h3 {
		font-size: 18px;
		color: #1A5048;
		}
		.ourrooms-block img {
		margin:10px 0 5px 0;
		}
			.ourrooms-link {
			padding-left: 26px;
			font-size: 14px;
			background:url(images/linkmap-icon.png) no-repeat left center;
			margin: 10px 0 0 0;
			}
		.ourroomslist {
			width: 340px;
			margin: 20px 0 0 20px;
			list-style: none;
		}
		.ourroomslist li{
			background: url(images/check-icon.png) no-repeat left center ;
			padding-left: 20px;
			float: left;
			width: 120px;
		}

/*
*	reservation
*/
.reservform {
min-height: 600px;
margin: 20px 0 0 0;
background: url(images/reservform-bg.jpg) no-repeat top right;
}
	.reservform fieldset {
	width: 425px;
	}
	.formtitle {
	width: 300px; height: 30px;
	padding-left: 10px;
	font-size: 16px;
	line-height:30px;
	font-weight: bold;
	color: #ffffff;
	background: url(images/fieldset-bg.jpg) no-repeat top left;
	}
	.formline {
	margin:10px 0 10px 20px;
	}
	.reservform label {
	width: 180px; 
	line-height: 24px;
	float: left;
	}
	.reservform input.text {
	width: 200px; height: 20px;
	}
	.reservform textarea {
	width: 380px;
	border: 1px solid #12635A;
	line-height: 24px;
	}
	.reservform select {
	font-size: 14px;
	text-align: center;
	border: 1px solid #12635A;
	}
		.select-date {
		width: 60px;
		margin-right: 7px;
		}
		.select-rooms {
		width: 202px;
		}
	.persdata {
	margin-top: 20px;
	}
	.reservdetail {
	margin-top: 20px;
	}
.reserv-report {
width: 100%;
background:#CFFFC7 url(images/reserv-report-bg.png) no-repeat 10px 10px;
border:1px solid #117900;
padding-bottom:10px;
}
	.reserv-report .report-text {
	margin:10px 5px 5px 0px;
	padding-left:120px;
	color:#003300;
	font-weight:bold;
	float:left;
	}
	.reserv-report ul {
	clear:both;
	list-style: none;
	margin:0 5px 10px 120px;
	padding-top:40px;
	}	
	.reserv-report ul li{
	margin-bottom:10px;
	font-size:14px;
	color:#003300;
	overflow:auto;
	font-weight:bold;
	}	
	.reserv-report ul li img{
	float: left;
	margin-right:20px;
	}	
/*
*	Contact us
*/

.contactdata {
width: 340px;
float: left;
line-height: 20px;
}
	.contactdata h3 {
	font-size: 20px;
	padding: 0 0 10px 0;
	color: #1A5048;
	}
	.contactdata div {
	margin-bottom: 5px;
	}
	.contactdata strong {
	color: #000000
	}
	.maplink {
	padding-left: 25px;
	font-size: 15px;
	background:url(images/linkmap-icon.png) no-repeat left center;
	}
	.contact-th {
	margin-top: 10px;
	}
	.contact-en {
	margin-top: 20px;
	}
.contactform {
width: 280px; height:369px;
float: right;
background: #6DC2BE url(images/contactform-bg.jpg) no-repeat left top;
color: #ffffff;
}
	.contactform fieldset {
	
	}
	.contactform fieldset legend {
	font-size: 16px;
	font-weight: bold;
	padding: 20px 20px 0 20px;
	}
	.contactform div {
	margin:10px 20px 0 20px;
	}
	.contactform label{
	}
	.contactform input.text {
		width: 238px; height: 20px;
	}
	.contactform textarea {
		width: 240px; 
		border: 0;
	}


/*
*	gallery
*/
#gallery {
width: 940px;
float: left;
margin: 20px 0 0 0;
padding-bottom: 20px;
border-bottom:3px solid #147B6F;
}
.gallery-block {
width: 100%;
float: left;
margin-top: 20px;
}
	.gallerytitle {
	width: auto; height: 40px;
	padding-left: 50px;
	font-size: 18px;
	font-weight:normal;
	line-height:40px;
	background: url(images/gallery-icon-3.jpg) no-repeat top left;
	color: #1A5048;
	}
	.image-block {
	width: 140px; height:120px;
	display: block;
	float: left;
	margin: 20px 8px 0 0;
	text-decoration: none;
	overflow: hidden;
	border: 1px solid #cccccc;
	padding: 3px 2px 0 3px;
	}
		.image-block:hover {
		text-decoration: none;
		border: 1px solid #147B6F;
		background: #DDE6E8;
		}
		.image-block img {
		width: 140px; height: 100px;
		}
		.image-block span {
		display:block;
		width: 100%;
		text-align: center;
		font-size: 12px;
		color: #444444;
		}

}

/*
*	map
*/
.map {
}

.map img {
border:1px solid #cccccc;
margin-bottom: 10px;
}
	.map-link {
	padding-left: 25px;
	font-size: 14px;
	background:url(images/linkmap-icon.png) no-repeat left center;
	margin-right: 30px;
}
.map-block {
margin-top: 20px;
} 


#admin {
width: 300px;
margin:0 auto;
margin-top: 20px;
padding-bottom: 5px;
border-bottom:3px solid #147B6F;
}
.admin-button {
margin:10px 0 10px 0px;
text-align:center;
}
.admin-formline {
margin:10px 0 10px 0px;
}
	.admin-formline label {
	width: 140px; 
	line-height: 24px;
	float: left;
	font-size:13px;
	text-align:right;
	margin-right:5px;
	}
	.admin-formline input.text {
	width: 140px; height: 20px;
	}

/*
*	index link
*/
.index-link {
float:left;
margin-top:20px;
overflow:auto;
}
	.index-linklist {
		list-style:none;
		display:block;
		padding:0px 0px 20px 36px;
		overflow:auto;
	}
		.index-linklist li {
			float:left;
			width:200px;
			display:inline;
		}
			.index-linklist dd{
				font-size:16px;
				font-weight:bold;
				margin-bottom:10px;
			}
			.index-linklist dt{
			}
				.index-linklist dt a{
				display:block;
				width:80%;
				text-decoration:none;
				padding-left: 10px;
				border-bottom:1px #dddddd dashed;
				font-size:13px;
				background:url(images/index-list-icon.png) no-repeat center left;
				}
				.index-linklist dt a:hover {
				
				}
/*
* 	calendar 
*/
.calenderhead {
	margin-top:10px;
}
.calenderhead a:link {
	text-decoration: none;
	color: #4A89DD;
	font-size:12px;
}
.calenderhead a:hover{
	color: #BC0D08;
}
/* วันที่ของเดือนที่แล้ว, วันที่ของเดือนต่อไป */
.last_month, .next_month {
	color: #cccccc;
	font-size: 12px;
	font-weight:normal;
}
/* วันปัจจุบัน */
#today {
	color: #444444;
	border:1px solid #4A89DD;
}
.overview #selected {
	color: #FFFFFF;
	background-color: #FF9999;
}
/* ชื่อวัน */
.dayname {
	background-color: #1A5048;
	font-weight: bold;
	font-size: 13px;
	color: #ffffff;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	text-align: center;

}

/* ปุ่มย้อนกลับ */
#backmonth, #nextmonth {
display:block;
width:18px; height:18px;
font-size:14px;
text-decoration:none;
text-align:center;
line-height:16px;
color:#1A5048;
border:1px solid #1A5048;
}

#backmonth:hover, #nextmonth:hover {
text-decoration:none;
background:#1A5048;
color:#ffffff;
}

.monthname {
	font-size: 16px;
	text-align: center;
	font-weight: bold;
	color:#003300;
}
/*
*	ตัวเลขวันที่ที่แสดงทั้งหมด
*/
.number {
	font-weight:normal;
	font-size:12px;
}

/*
*	วันที่มีกิจกรรม
*/
.event {
	font-weight:bold;
}
.event a{
	color:#BC0D08;
}

/*
*	acces
*/
.acces {
	float:left;
	margin-top: 20px;
}

/*
*	terms of use
*/
.terms-block {
	width: 100%;
}
	.terms-block  hr{
		width: 94%;
		color: #cccccc;
	}
	.terms-block  .termlink{
		margin-top: 20px auto;
	}
.termstext {
	margin: 10px 0 0 0;
	width: 600px;
}
	.termstext h3 {
		font-size: 16px;
		color: #000000;
	}
	.termstext h4 {
		font-size: 14px;
		margin: 5px 0 0 20px;
		color: #000000;
	}
	.termstext ol {
		display: block;
		font-size: 13px;
		margin: 5px 0 0 50px;
	}
	strong {
		color:#000000;
	}
	.redtext {
		color: #7C0800;
	}
	.termstext table, .termstext table tr th, .termstext table tr td {
		border:1px solid #cccccc;
		padding: 0 8px 0 8px;
	}
		.termstext table {
			margin-bottom: 20px;
			color: #000000;
		}
		.termstext table caption {
			text-align: left;
			font-weight: bold;
			margin-top: 10px;
		}
		.termstext table tr th {
			background: #26766A;
		}
		.termstext table tr td {
			
		}
	



