/*
screen stylesheet by izziSoft.com
rattapol at izzisoft.com
created : 2007-08-05
last edited : 2007-10-01
*/

/* ------------------------------------------------------------------------------------- general setting */

* {margin:0; padding:0;} /* set all elements spacing to zero */

body, th, td, input, select, textarea {font-family: Verdana, Tahoma, Loma, Thonburi, "Lucida Grande", sans-serif;}

html, body {
	background-color: #C5C5C5;
	color: #000000;
	font-size: 90%; /* set as base font size */
}

#container {min-height: 100%; overflow: auto;}

img {border: 0;}

abbr, acronym {font-variant: small-caps; letter-spacing: 0.1em;}
hr {border: 1px inset;}
del  {text-decoration: line-through;}
ins {text-decoration: underline;}
sub {vertical-align: sub; font-size: 0.8em;}
sup {vertical-align: super; font-size: 0.8em;}
pre, code, tt, xmp {font-family: monospace;}
blockquote {margin-left: 40px; margin-right: 40px;}

h1 {font-size: 1.8em;}
h2 {font-size: 1.5em;}
h3 {font-size: 1.3em;}
h4 {font-size: 1.2em;}
h5 {font-size: 1.0em;}
h6 {font-size: 0.9em;}


/* ------------------------------------------------------------------------------------------ setting link */

a {background: transparent; text-decoration: none;}
a:link {color: #A4A4A4;}
a:visited {color: #A4A4A4;}
a:hover {color: #FA1313;}
a:active {color: #CC0000;}

a.maplink {display: block; width: 100px; height: 160px; border: 3px solid #FA1313;}
a.maplink:hover {border: 3px solid #CC0000;}


/* ------------------------------------------------------------------------------------------ setting table */

table {border-collapse: collapse; width: 470px; margin-left: 40px;}

caption {}
col {}
colgroup {}

th, td {border: 1px solid #FFFFFF; padding: 4px; background-color: #EDEDED; color: #333333;}
th {text-align: left;}


/* ------------------------------------------------------------------------------------------ setting form */

form {font-size: 0.9em; padding-top: 5px;}

fieldset {}
legend {}
label {display: block; margin-left: 30px;}

input, select, textarea {
	width: 418px;
	height: 16px;
	margin: 4px 0 8px 30px;
	border: 1px dotted #FA1313;
	background-color: #FFFFFF;
	color: #222222;
}

input:focus, textarea:focus {border: 1px solid #555555; background-color: #C5C5C5;}
input.short {width: 20px;}
input.disable {background-color: #555555; color: #FFFFFF;}
input.button, button {
	width: 100px;
	height: 25px;
	margin: 6px 0 0 30px;
	padding: 3px;
	border: 0;
	background-color: #FA1313;
	color: #FFFFFF;
	font-weight: bold;
	cursor: pointer;
	cursor: hand;
}

input.button:hover, button:hover {background-color: #FF3300;}

textarea {height: 100px; font-size: 1em;}
textarea.small {width: 10em; height: 8em;}

.inlineform {display: inline;} /* single line form */


/* -------------------------------------------------------------------------------------- setting content */

#header {
	width: 820px;
	height: 124px;
	margin: 0 auto;
	background: #FFFFFF url("../images/bg_header.gif") no-repeat;
}
#header h1 {
	float: left;
	width: 320px;
	height: 100px;
	text-indent: -6000px;
	background: transparent url("../images/header_extra.gif") no-repeat;
	cursor: pointer;
	cursor: hand;
}

#mainnav {
	float: right;
	margin-top: 80px;
	margin-right: 45px;
	list-style-type: none;
	background: transparent;
	text-align: right;
	font: normal 1.3em "Trebuchet MS", Tahoma, Thonburi, Loma, sans-serif;
	font-weight: bold;
}
#mainnav li {float: left; padding-right: 3px;}
#mainnav li.current {color: #FA1313;}

#gallery {
	clear: both;
	width: 820px;
	height: 520px;
	margin: 0 auto;
	background: transparent url("../images/bg_gallery.gif") repeat-y;
}

#branding {margin-left: 20px; float: left;}

#showimg {float: right; list-style-type: none;}
#showimg li {margin: 0 70px 20px 0;}

#content {
	clear: both;
	width: 820px;
	margin: 0 auto;
	background: #FFFFFF url("../images/border.gif") repeat-y;
}
#content h3 {margin: 0 10px 10px 40px; padding-top: 10px; font-weight: normal;}
#content p {margin: 10px 40px;}
#content p.description {margin: 30px 20px 10px 40px; font-size: 0.85em;}
#content ul.description li {margin: 6px 60px; font-size: 0.85em;}

#content img {}
#content img.attraction {float: right; margin: 0 50px 10px 10px;}

.attracbox {margin-bottom: 60px;}
.attracbox ul {margin: 10px 0 0 60px; list-style-type: square;}


/* ------------------------------------------------------------------------------------- setting footer */

#footer {
	clear: both;
	width: 820px;
	height: 30px;
	margin: 0 auto;
	background: transparent url("../images/bg_gallery.gif") repeat-y;
	color: #FFFFFF;
}
#footer p {clear: right; float: left; margin: 0 0 0 34px; padding: 6px; font-size: 0.8em;}
#footer img {float: left; padding: 6px;} /* izzisoft webbutton */


/* ---------------------------------------------------------------------------------------- setting pop */

#popcontainer {}

#popcontainer #header {
	width: 480px;
	height: 124px;
	margin: 0 auto;
	background: #FFFFFF url("../images/bg_header_contact.gif") no-repeat;
}
#popcontainer #header h1 {
	float: left;
	width: 320px;
	height: 100px;
	text-indent: -6000px;
	background: transparent url("../images/header_contact.gif") no-repeat;
}
#popcontainer #header p.close {float:right; margin-top: 80px; margin-right: 30px; text-align: right;}

#popcontainer #content {
	clear: both;
	width: 480px;
	margin: 0 auto;
	background: #FFFFFF url("../images/border.gif") repeat-y;
}