@import url(fonts/th_mali_grade6.css);
::selection{ /* Safari and Opera */       
background:#c3effd;       
color:#000;   }   
::-moz-selection{ /* Firefox */       
background:#c3effd;       color:#000;   
} 


html{ 
height:100%;
overflow-y:scroll; 
}

body{ 
	font-family: 'THMaliGrade6', sans-serif; font-size: 0.75em; line-height: 1.2em; background: #ffffff; 
	margin-top: 0px; 
	margin-bottom: 0px; 
	margin-left: 0px; 
	margin-right: 0px;
	padding: 0;
	height:100%;
	background-image:url(images/bg01-ok.jpg);
	background-repeat:no-repeat;

}
a {
text-decoration: none;
}
a:link {color:#FF0000;}      /* unvisited link */
a:visited {color:#00FF00;}   /* visited link */
a:hover {color:#0F7AC2;}     /* mouse over link */
a:active {color:#0F7AC2;}    /* selected link */
div.jqDockLabel {
	font-weight:bold;  
	white-space:nowrap; 
	color:#FFFFFF; 
	cursor:pointer; 
	padding:1px 1px; 
	z-index:998;
	top:-50px; left:0; 
	width:100%; height:20%; overflow:hidden;
}
#menu1 div.jqDockLabel {padding:5px 5px 5px 5px; z-index:998;text-align:center;}
#menu2 div.jqDockLabel {padding:5px 5px 5px 5px; z-index:998;text-align:center; }

#kohkood {
width:1024px;
margin:auto;
height:768px;
border:medium;
border-color:#009;
	
}

#header {
	height: 180px;
	
	/*background-color: #bbb;*/
	margin-top: 2px;

}
#lineh {
	float:left;
	height: 100px;
	width:1024px;
	background-color: #ccc;

	z-index:900;
	margin-left:0px;
	margin-top:0px;
	z-index:900;
	position:relative;
	color:#225e9a;
	line-height:35px;

	-moz-border-radius-topleft:10px;
	-moz-border-radius-topright:10px;
	-webkit-border-top-left-radius:10px;
	-webkit-border-top-right-radius:10px;
	border-top-left-radius:10px;
	border-top-right-radius:10px;
	
	background: -webkit-linear-gradient(left top, white , gray); /* For Safari 5.1 to 6.0 */
  	background: -o-linear-gradient(top left, white, gray); /* For Opera 11.1 to 12.0 */
  	background: -moz-linear-gradient(top left, white, gray); /* For Firefox 3.6 to 15 */
  	background: linear-gradient(to top left, white , gray); /* Standard syntax */
  
}
#web_name {
	position:absolute;
margin-left:320px;	
line-height:35px;
padding-top:20px;
}

#header2 {
	height: 80px;
	background-color: #bbb;
	margin-top: 80px;

	z-index:990;
	-moz-border-radius-topleft:10px;
	-moz-border-radius-topright:10px;
	-webkit-border-top-left-radius:10px;
	-webkit-border-top-right-radius:10px;
	border-top-left-radius:10px;
	border-top-right-radius:10px;
	
	background: -webkit-linear-gradient(left top, white , gray); /* For Safari 5.1 to 6.0 */
  	background: -o-linear-gradient(top left, white, gray); /* For Opera 11.1 to 12.0 */
  	background: -moz-linear-gradient(top left, white, gray); /* For Firefox 3.6 to 15 */
  	background: linear-gradient(to top left, white , gray); /* Standard syntax */
}

#logo {
	width:250px;
	height:209px;
	margin-left:20px;
	background-image:url('images/le1-15s.png');
	background-repeat:no-repeat;
	position:absolute;
	z-index: 999;
}
#web_namex {
	float:left;
	margin-left:280px;
	margin-top:80px;
	color:#225e9a;
	line-height:35px;
	/*color:#FFF;*/
	z-index:999;
	position:relative;
}
#lang_bar {
	margin-top:15px;
	margin-right:30px;
	height:0px;
	float:right;
}
#enter_button {
	font-weight:bold;
	float:right;
	margin-top:-30px;
	margin-right:50px;
	padding: 0px 50px; 
	color: #225e9a;
	font-size:20px;
	clear:both;
}
#enter_button2 {
	font-weight:bold;
	float:right;
	margin-top:-90px;
	line-height:30px;
	margin-right:-20px;
	padding: 0px 50px; 
	color: red;
	font-size:20px;
	clear:both;
}
#contact_info{
margin-top:10px;	
color:#F00;
}
#gutter{
	float: left;
	width: 3%;
	height: 1px;
}

#col1 {
	float: left;
	width: 79%;
	background-color: #bbb;
	margin-bottom: 0px;
	margin-top:0px
}

#col2 {
	float: left;
	width: 20%;
	margin-left: 1%;
	background-color: #FFFFFF;
	margin-bottom: 0px;
	margin-top:0px
}



#footer {
	clear: both;
	height: 100px;
	background-color: #bbb;
	
	-moz-border-radius-bottomleft:10px;
	-moz-border-radius-bottomright:10px;
	-webkit-border-bottom-left-radius:10px;
	-webkit-border-bottom-right-radius:10px;
	border-bottom-left-radius:10px;
	border-bottom-right-radius:10px;
	
	background: -webkit-linear-gradient(right top, white , gray); /* For Safari 5.1 to 6.0 */
  	background: -o-linear-gradient(top right, white, gray); /* For Opera 11.1 to 12.0 */
  	background: -moz-linear-gradient(top right, white, gray); /* For Firefox 3.6 to 15 */
  	background: linear-gradient(to top right, white , gray); /* Standard syntax */
}
#footer {
	clear: both;
	height: 120px;
	background-color: #bbb;
}

h1 {
	margin: 0;
	padding: 5px;
}

h2 {
	margin-top: 0;
	padding-top: 3px;
}

h2, p {
	margin-left: 3px;
	margin-right: 3px;
}
#menu1 { 
 	float: left;
	width: 53%;
	margin-top:20px;
	display:none;
 }
 #menu2 { 
 	float: left;
	width: 45%;
	margin-top:10px;
	margin-left:80px;
	display:none;
	z-index:991;
 }
 #menu2 img {
	 z-index:997;
 }
 
 #iconbanner {
	 float: left;
	width: 47%;
 }
 .slogan {
	font-weight:bold;
	font-size:22px;
	background: #225e9a; 
	color: #FFF; 
	margin: 0px 0 20px; 
	line-height: 4em;
	margin-top:8px;
	
}





#fullscreenC {
position:fixed;
bottom:0px;
right:0px;
}

#headicon {
	position:absolute;
	margin-top:-20px;
	z-index:990;
}
#headicon img {
	opacity: 0.5;
    filter: alpha(opacity=50); /* For IE8 and earlier */


}

.headline {
/*	position:relative;*/
float:right;
	width:auto;
	height:25px;
	margin-top:25px;
	margin-right:80px;
	color:#F00;
	padding: 10px;
  line-height: 0.5;
  font-size:25px;
  font-weight:bold;
  z-index:800;
}
.headline span {
  display: inline-block;
  position: relative;  
}
.headline span:after,
.headline span:before {
  content: "";
  position: absolute;
  height: 8px;
  border-bottom: 5px solid #F00;
  border-top: 5px solid #F00;
  top: 0;
  width:15%;
}
.headline span:before {
  right: 100%;
  margin-right: 5px;
}
.headline span:after {
  left: 100%;
  margin-left: 5px;
}





#Gallery_content { /* "id" selector for the wrapper tag. The styles in this tag will refer to whatever tag in the html code has the id of "wrapper." */
    width:100%;
	height:auto;
    border-style:none; /* Displays border for wrapper tag with help of the 2 following lines of code*/
    border-color:black;
    border-width:1px;
    margin-left:auto; /* "auto" to help center the wrapper along with margin-right */
    margin-right:auto; /* "auto" to help center the wrapper along with margin-left */
	overflow:hidden;
	position:absulute;
	font-size:120%;
	color:#FF0;
	line-height: 33px;
	text-align:center;
}
#Gallery_content h3{

width:100%;
font-size:120%;
color:red;
}
#Gallery_content img {
	margin-top:2px;
	-webkit-border-radius: 5px; /* กำหนดรัศมีของมุมครับ */
	-khtml-border-radius: 5px; /* กำหนดรัศมีของมุมครับ */
	-moz-border-radius: 5px; /* กำหนดรัศมีของมุมครับ */
	border-radius: 5px; /* กำหนดรัศมีของมุมครับ */
	-moz-box-shadow: 0 0 8px #CCC; /* กำหนดสีของกรอบและเงาครับ */
	-webkit-box-shadow: 0 0 8px #CCC; /* กำหนดสีของกรอบและเงาครับ */
	box-shadow: 0 0 8px #CCC; /* กำหนดสีของกรอบและเงาครับ */
	padding:8px; /* กำหนดระยะห่างจากขอบด้านในของกรอบถึงขอบของรูป���าพ */
	margin:5px;
	max-height:600px;
	max-width:100%;
	background-color:white;
}

#Maps_left {
	 width:65%;
	height:100%;
	float:left;

}
#Maps_content {
    width:100%;
	height:550px;
	border-style:none; /* Displays border for wrapper tag with help of the 2 following lines of code*/
    border-color:black;
    border-width:1px;
    margin-left:auto; /* "auto" to help center the wrapper along with margin-right */
    margin-right:auto; /* "auto" to help center the wrapper along with margin-left */
	overflow:hidden;
	position:absulute;
	font-size:120%;
	color:#00F;
	text-align:center;
}
#Maps_detail {
	width:100%;
	height:auto;
	color:#FF0;
	float:right;
	overflow:hidden;
}

#directionsPanel {
	float:right;
	max-height:550px;
	width:35%;
	background-color:#FFF;
	overflow:scroll;
	color:#00F;

}


#Maps_detail table {
    border-spacing:1px;
    border-style:solid;
    border-width:2px;
    border-color:#F00;
    padding:5;
    box-shadow:0px 0px #000000;
    border-radius:10px;
	background-color:#fff;
	width:98%;
	height:98%;
}
 
#Maps_detail th {
    color:#FFF;
    background:#F00;
    border-style:solid;
    border-width:1px;
    border-color:#F00;
    font-weight:bold;
    padding:5px;
    text-align:center;
    vertical-align:top;
}
 
#Maps_detail tr {
    color:#5A7ECC;
    font-weight:normal;
}
 
#Maps_detail tr:hover td {
    color:#F00;
}
 
#Maps_detail td {
    padding:3px 5px;
    text-align:left;
    vertical-align:top;
}
 
#Maps_detail th:first-child {
    border-top-left-radius:10px;
}
 
#Maps_detail th:last-child {
    border-top-right-radius:10px;
}
 
#Maps_detail tr:last-child td:first-child {
    border-bottom-left-radius:10px;
}
 
#Maps_detail tr:last-child td:last-child {
    border-bottom-right-radius:10px;
}


#Payment_content {
width:95%;
float:right;
font-size:130%;
line-height: 35px;
color:#0408a1;
font-weight:bold;
}
#Payment_content h3 {
color:red;
}

#Activity_content {
width:95%;
float:right;
font-size:135%;
line-height: 35px;
font-weight:bold;
color:#0408a1;
}

#Package_content {
width:95%;
float:right;
font-size:130%;
line-height: 35px;
color:#0408a1;
font-weight:bold;
}
#Package_content h2 {
	font-size:100%;
color:#F30;
}
#Package_content h3 {
color:red;
}
span.tab{
    padding: 0 50px; /* Or desired space*/
}


#contactx {
	width:98%;
	border-style:none; /* Displays border for wrapper tag with help of the 2 following lines of code*/
    border-color:black;
    border-width:1px;
    margin-left:auto; /* "auto" to help center the wrapper along with margin-right */
    margin-right:auto; /* "auto" to help center the wrapper along with margin-left */
	overflow:hidden;
}

#contact_form {
	width:40%;
	height:100%;
	float:left;
	border:thin;
	border-style:none;
}
#addressx {
	width:58%;
	max-width:650px;
	float:left;
	height:100%;
	font-size:145%;
	color:#0408a1;
	font-weight:bold;

	line-height:30px;
	border:thin;
	border-style:none;
	padding:30px 10px 30px 5px;
	opacity:0.9;
	 border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
}
#addressx span {
	color:red;
	font-weight:bold;
	font-size:130%;	
}

/*######## Smart Green ########*/
.smart-green {
    width: 320px;
    margin-right: auto;
    margin-left: auto;
    background: #FFF;
    padding: 0px 30px 0px 30px;
    box-shadow: rgba(0, 0, 0, 0.7) 0 3px 10px -1px;
    -webkit-box-shadow: rgba(0, 0, 0, 0.7) 0 3px 10px -1px;
    font: 12px;
    color: #0408a1;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
	opacity:0.9;
}
.smart-green h1 {
    font: 24px;
    padding: 20px 0px 20px 40px;
    display: block;
    margin: 30px -30px 10px -30px;
    color: #F00;
    background:#FF0; /*#9DC45F;*/
    text-shadow: 1px 1px 1px #949494;
    border-radius: 5px 5px 0px 0px;
    -webkit-border-radius: 5px 5px 0px 0px;
    -moz-border-radius: 5px 5px 0px 0px;
    border-bottom:1px solid #89AF4C;

}
.smart-green h1>span {
    display: block;
    font-size: 14px;
    color: #F00;
}

.smart-green label {
    display: block;
    margin: 0px 0px 5px;
}
.smart-green label>span {
    float: left;
    margin-top: 10px;
    color: #0408a1;
	font-weight:800;
}
.smart-green input[type="text"], .smart-green input[type="email"], .smart-green textarea, .smart-green select {
    color: #555;
    height:24px;
    width: 96%;
    padding: 3px 3px 3px 3px;
    margin-top: 2px;
    margin-bottom: 2px;
    border: 1px solid #225e9a;
    background: #FBFBFB;
    outline: 0;
    -webkit-box-shadow: inset 1px 1px 2px rgba(238, 238, 238, 0.2);
    box-shadow: inset 1px 1px 2px rgba(238, 238, 238, 0.2);
    font: normal 14px/14px;
}
.smart-green textarea{
    height:170px;
    padding-top: 10px;
}
.smart-green select {
    background: url('down-arrow.png') no-repeat right, -moz-linear-gradient(top, #FBFBFB 0%, #E9E9E9 100%);
    background: url('down-arrow.png') no-repeat right, -webkit-gradient(linear, left top, left bottom, color-stop(0%,#FBFBFB), color-stop(100%,#E9E9E9));
   appearance:none;
    -webkit-appearance:none; 
   -moz-appearance: none;
    text-indent: 0.01px;
    text-overflow: '';
    width:100%;
    height:30px;
}
.smart-green .button {
    background-color: #FF0;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-border-radius: 5px;
    border: none;
    padding: 10px 25px 10px 25px;
    color: #F00;
    text-shadow: 1px 1px 1px #FC3; /*#949494;*/
}
.smart-green .button:hover {
    background-color:#FC3;  /*#80A24A;*/
}