@import url('nav.css');
/* Reset All Browser */
* {
	font-size:100%;
	font-style:normal;
	margin:0;
	padding:0;
}
a {
	cursor:pointer;
	text-decoration:none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after, q:before, q:after {
	content: '';
	content: none;
}
body {
	color: #666;
	font:0.75em/1 Tahoma, Thonburi;
	height:100%;
	background:rgb(246, 246, 246);
	font-size:16px;
}
del {
	text-decoration:none;
}
:focus {
	outline:0 none;
}
html {
	height:100%;
	overflow:auto;
}
img, a img {
	border:0;
}
ins {
	text-decoration:none;
}
ol, ul {
	list-style:none;
}
table {
	border-collapse:collapse;
	border-spacing:0;
}
.clr {
	clear:both;
	float:none;
	height:0;
}
div#flashContent { height:410px; width:100%;}
div#flashContent  > a {height:410px; width:100%; display:block;}
#en div#flashContent { background: url(../images/flash-intro-en.jpg) no-repeat;}

/* Structure */
#container {
	font-size:1em;
	margin:auto;
	overflow:hidden;
	position:relative;
	width:960px;
	font-family:tahoma;
}
.clear {
	float:left;
	display:block;
	width:100%;
	height:100px;
	overflow:hidden;
	clear:both;
}
/* content */
div#content {
	height:410px;
	background: white;
	line-height:120%;
	position:relative;
	overflow:hidden;
	width:100%;
	background:url(../images/include/bg-content.jpg) no-repeat;
	z-index:1;
}


#content .head {
	display:none;
	float: left;
	clear:left;	
	width:100%;
	padding-bottom:8px;
	color:#002F65;
	/*border-bottom:1px solid #BC733B;*/
	border-bottom:1px solid #002F65;
	margin-bottom:12px;
	text-transform:uppercase;
}


#content .head h2 {
	font-size:20px;
	width:100%;	
}
#content .head h3 {
	font-size:30px;
	margin-top:-2px;
}




#content h4 {
	font-size:16px;
}

#content p {
	padding-bottom:12px;
}
.list-cir {
	padding:0 0 15px 0;
	margin-left:15px;
}
.list-cir > li { background:url(../images/include/bu-cir.png) no-repeat 0 12px; padding-left:10px;}

#content div.content-left {
	float:left;
	position:relative;
	z-index:1;
}
#content div.content-right {
	float:right;
	position:relative;
	width:462px; line-height:11px;padding:149px 0 0 17px;
}
#container #content.pic { left:0; top:0;display:none}




.en #container #content div.content-right  ul li { font-size:12px; padding-bottom:2px;}
.en #container #content .head h2 { font-size:13px; padding-bottom:5px;}
.en #container #content .head h3 { font-size:22px !important; margin-top:0}
.en #container #content h4 {font-size:12px; padding-bottom:3px;}
.en #container #content p { font-size:12px;}
.en #container #content table td ,.en #container #content table th { font-size:12px !important;}






.pic { display:none; position: absolute; z-index:0;}
.pic img { float:left;}

ul.list li { background: url(../images/include/list.png) left 9px no-repeat; padding-left:15px; font-size:18px;}



/*Home*/
.home #slideshow { display:block; width:479px; height:410px; position: absolute; display:none; top:0; right:0; display:none; float:right}
.home #slideshow li {}
.home #detail { width:479px; float:left; text-align:center; padding-top:60px;}
#container .home { background:#93D0EB;}



/*concept*/
#container .concept div.content-right{  padding-top:150px;}
.concept .head { float:right; clear:both; width:100%; padding-bottom:10px;} 
#container .concept p {  font-size:16px; padding-bottom:15px; float:left; width:440px; display:none; line-height:18px;}



/*fact-sheet*/
.fact-sheet .head { float:right; clear:both; width:100%; padding-bottom:10px;} 
#container .fact-sheet table { font-size:17px; display:none}
#container .fact-sheet table th { text-align:left; color:#002F65;}
#container .fact-sheet table th ,#container .fact-sheet table td { padding-bottom:3px;}





/*facilities*/
.facilities  .head { float:right; clear:both; width:100%; padding-bottom:10px;} 
#container .facilities  table { font-size:17px; display:none}
#container .facilities  ul { float:left;width:420px; clear:both; display:none; padding-bottom:12px;line-height:15px;}
#container .facilities  ul > li { float:left;width:420px; padding-left:10px; background:url(../images/include/bullet_blue.gif) no-repeat 0 7px;}
#container .facilities  h4 { color:#002F65; display:none; float:left; clear:both}


/*location*/
#container .location-inner .map { overflow:hidden; display:none; float:right; width:100%; padding-top:5px;}
.location-inner .map a { display: none; padding-top:5px; float:left;}
.google-map { display:none}


/*floor plan*/
#container .floor-plan .content-left {position:relative;width:462px; line-height:11px; height:261px; background:#93D0EB; padding:149px 0 0 18px;}
#container .floor-plan .head { border-bottom:1px solid #ffffff;}
#container .floor-plan .head > h2 { color:white}
#container .floor-plan .head > h3 {color:white; margin-top:-2px;}

#container .floor-plan #myController { clear:both; margin:0; padding:0; float: left; width:100%;display:none}
#container .floor-plan #myController h4 { float:left; padding-right:10px; color:white; font-size:11px;}


/*floor plan list*/
#container .floor-plan ul {float: left;margin:0;width:130px;text-align: left;font-size:11px;}
#container .floor-plan ul li { float:left;width:150px; padding-bottom:3px; background:url(../images/floor-plan/bullet-white.png) no-repeat 0 4px; padding-left:10px;}
#container .floor-plan ul li.active {background:url(../images/floor-plan/bullet-white.png) no-repeat 0 4px;}
#container .floor-plan ul li a {color:#000; text-transform:uppercase;}
#container .floor-plan ul li.active a {color:#fff}
#container .floor-plan ul li a > strong { width:50px; float:left}
#container .floor-plan ul li a > span { width:100px; float:left}

.floor-plan #slides {
	height:410px;
	overflow:hidden;
	position:relative;
	width:480px;
	text-align:right;
	float:left;
}

.floor-plan .slide-wrapper {
	display:none;
	height:410px;
	overflow:hidden;
	width:457px;
	text-align: right;
	float:left;
	position:absolute;
	top:0;
	right:23px;
}
.floor-plan .slide-wrapper > div + div { padding-top:170px; text-align:right;width:100%; padding-bottom:5px;}
.floor-plan .slide-wrapper > div + div img { width:430px}

.floor-plan .slide-wrapper > div + div img.masterImg {margin-top:-110px;margin-right:50px;width:400px;height:200px; margin-left:50px;}
#container .floor-plan .master-type { color:black; text-transform:uppercase;float:right; height:70px; padding: 25px 0 0 220px;z-index:5;position:relative;}

#container .floor-plan .floor-type { color:black; text-transform:uppercase; background:url(../images/floor-plan/type.jpg) no-repeat center 5px;float:right; height:70px; padding: 25px 0 0 220px;z-index:5;position:relative;}
#container .floor-plan .floor-type span { display:block; font-size:15px;}
#container .floor-plan .floor-type strong { display:block; font-size:11px; margin-top:-4px;}

#container .floor-plan .floor-typeA { color:black; text-transform:uppercase; /*background:url(../images/floor-plan/a.jpg)*/ no-repeat center 5px;float:right; height:70px; padding: 25px 0 0 220px;z-index:5;position:relative;}
#container .floor-plan .floor-typeA span { display:block; font-size:15px;}
#container .floor-plan .floor-typeA strong { display:block; font-size:11px; margin-top:-4px;}

#container .floor-plan .floor-typeB { color:black; text-transform:uppercase; /*background:url(../images/floor-plan/b.jpg)*/ no-repeat center 5px;float:right; height:70px; padding: 25px 0 0 220px;z-index:5;position:relative;}
#container .floor-plan .floor-typeB span { display:block; font-size:15px;}
#container .floor-plan .floor-typeB strong { display:block; font-size:11px; margin-top:-4px;}

#container .floor-plan .floor-typeC { color:black; text-transform:uppercase; /*background:url(../images/floor-plan/c.jpg)*/ no-repeat center 5px;float:right; height:70px; padding: 25px 0 0 220px;z-index:5;position:relative;}
#container .floor-plan .floor-typeC span { display:block; font-size:15px;}
#container .floor-plan .floor-typeC strong { display:block; font-size:11px; margin-top:-4px;}

#container .floor-plan .floor-typeD { color:black; text-transform:uppercase; /*background:url(../images/floor-plan/d.jpg*/) no-repeat center 5px;float:right; height:70px; padding: 25px 0 0 220px;z-index:5;position:relative;}
#container .floor-plan .floor-typeD span { display:block; font-size:15px;}
#container .floor-plan .floor-typeD strong { display:block; font-size:11px; margin-top:-4px;}


.floor-plan #slides .more {
	width:109px;
	height:16px;
	display:block;
	text-indent:99999em;
	overflow:hidden;
	float:right;
	overflow:hidden;
	clear: right;
	text-decoration:none;
	background:url(../images/include/more-detail.png) no-repeat;
}


.floor-plan #slides .more-en {
	width:114px;
	height:16px;
	display:block;
	text-indent:99999em;
	overflow:hidden;
	float:right;
	overflow:hidden;
	clear: right;
	text-decoration:none;
	background:url(../images/include/more-detail-en.png) no-repeat;
}

.floor-plan #slides .moreEN {
	width:109px;
	height:16px;
	display:block;
	text-indent:99999em;
	overflow:hidden;
	float:right;
	overflow:hidden;
	clear: right;
	text-decoration:none;
	background:url(../images/include/more-detail_en.png) no-repeat;
}





/*popup*/
#floor-plan #popup {
	display: none;
	margin: 0;
	padding: 0;
	position: absolute;
	z-index: 99;
	width:898px;
	height:443px;
	background: url(../images/floor-plan/bg-lightbox.png) no-repeat;
	padding:35px;
	top:123px;
}

#floor-plan #popup > div { margin-top:80px; text-align:right}
#floor-plan #popup .floor-type { color:black; margin-top:20px; text-transform:uppercase; background:url(../images/floor-plan/type.jpg) no-repeat center 5px;float:right; height:70px; padding: 25px 0 0 220px;}
#floor-plan #popup .floor-type span { display:block; font-size:15px;}
#floor-plan #popup .floor-type strong { display:block; font-size:11px;}

#floor-plan #popup .floor-typeA { color:black; margin-top:20px; text-transform:uppercase; background:url(../images/floor-plan/a.jpg) no-repeat center 5px;float:right; height:70px; padding: 25px 0 0 220px;}
#floor-plan #popup .floor-typeA span { display:block; font-size:15px;}
#floor-plan #popup .floor-typeA strong { display:block; font-size:11px;}

#floor-plan #popup .floor-typeB { color:black; margin-top:20px; text-transform:uppercase; background:url(../images/floor-plan/b.jpg) no-repeat center 5px;float:right; height:70px; padding: 25px 0 0 220px;}
#floor-plan #popup .floor-typeB span { display:block; font-size:15px;}
#floor-plan #popup .floor-typeB strong { display:block; font-size:11px;}

#floor-plan #popup .floor-typeC { color:black; margin-top:20px; text-transform:uppercase; background:url(../images/floor-plan/c.jpg) no-repeat center 5px;float:right; height:70px; padding: 25px 0 0 220px;}
#floor-plan #popup .floor-typeC span { display:block; font-size:15px;}
#floor-plan #popup .floor-typeC strong { display:block; font-size:11px;}

#floor-plan #popup .floor-typeD { color:black; margin-top:20px; text-transform:uppercase; background:url(../images/floor-plan/d.jpg) no-repeat center 5px;float:right; height:70px; padding: 25px 0 0 220px;}
#floor-plan #popup .floor-typeD span { display:block; font-size:15px;}
#floor-plan #popup .floor-typeD strong { display:block; font-size:11px;}

/* popup master plan */

#floor-plan #popupMaster {
	display: none;
	margin: 0;
	padding: 0;
	position: absolute;
	z-index: 99;
	width:898px;
	height:443px;
	background: url(../images/floor-plan/bg-lightbox.png) no-repeat;
	padding:35px;
	top:123px;
}

#floor-plan #popupMaster > div { margin-top:-10px; text-align:right}
#floor-plan #popupMaster .master-type { color:black; margin-top:20px; text-transform:uppercase;float:right; height:70px; padding: 25px 0 0 220px;}
#floor-plan #popupMaster .master-type span { display:block; font-size:15px;}
#floor-plan #popupMaster .master-type strong { display:block; font-size:11px;}



/*unit*/
.unit  #container .floor-plan ul { width:100%}
.unit  #container .floor-plan ul li { width:350px; background-position:0 7px;}
.unit  #container .floor-plan ul li span { font-size:17px; float:inherit}
.unit  #container .floor-plan ul li strong { font-size:11.5px; float:inherit}
.unit  #container .slide-wrapper > div + div { padding-top:40px;}

.unit  #container .floor-plan .floor-type { color:black; text-transform:uppercase;float:right;padding: 10px 0 0 0; background:none; width:100%;text-align:right}
.unit  #container .floor-plan .floor-type span { display:block; font-size:31px;}
.unit  #container .floor-plan .floor-type strong { display:block; font-size:19px; margin-top:0;}
.unit  #container .floor-plan .floor-type strong em.b { font-size:13px;}
.unit  #container .floor-plan .slide-wrapper > div + div img { width:inherit;margin-right:70px;}

.en-room #container .floor-plan .floor-type { padding-top:10px;}
.en-room #container .floor-plan .floor-type span { display:block; font-size:22px;}
.en-room #container .floor-plan .floor-type strong { display:block; font-size:12px; margin-top:0;}
.en-room  #container .floor-plan ul li { width:350px; background-position:0 5px;}


/*guide*/
.guide #container #content #inner-content  ul li { font-size:17px; background-position:0 7px}
.guide #container #content .head h3 { font-size:30px;}

/*news*/
#news-page .news-pro h4 { font-size:17px; color:#002F65; float:left; padding-right:10px; width:42px;padding-left:10px;/*background:url(../images/sansiri-service/bullet.gif) no-repeat 0 7px;*/}
#news-page .news-pro .news-detail { float:left; width:100%; padding-bottom:30px; display:none}
#news-page .news-pro .news-detail ul li { float:left;width:170px; margin-right:15px;}
#news-page .news-pro .news-detail ul li em { float:left; width:68px; padding-right:10px;}
#news-page .news-pro .news-detail ul li div { float:left; width:90px; position:relative; height:68px; font-size:16px;}
#news-page .news-pro .news-detail ul li div a.more { background:url(../images/news/more.png) no-repeat left center; height:10px; left:0; bottom:0; text-indent:9999em; overflow:hidden; width:50px; display:block; position:absolute; }

#news-page .promotion-detail {float:left; width:100%; display:none; line-height:23px;}
#news-page .promotion-detail h4 { margin-top:4px;}
#news-page .promotion-detail p {font-size:22px; width:380px; float:left; margin-left:10px;}
#news-page .promotion-detail-en {float:left; width:100%; display:none; line-height:9px;}
#news-page .promotion-detail-en h4 { margin-top:4px;}
#news-page .promotion-detail-en p {font-size:22px; width:380px; float:left; margin-left:10px;}
#news-page #container .head h3 { font-size:30px;}

.en #container #content .promotion-detail h4 { margin-top:0;}


/*siriService*/
#container .siriService div.content-right { padding-top:169px}
#content #inner-content { display:none}
#content #inner-content p { font-size:16px; line-height:16px; width:96%;}
#content #inner-content  ul li { font-size:11px; color:#002F65; background:url(../images/sansiri-service/bullet_blue.gif) 0 5px no-repeat; padding:0 0 5px 10px;}
#content #inner-content  ul li a {color:#002F65 }
#container .siriService .head h3 { font-size:19px;}


.en #content #inner-content p { font-size:12px;}
.en #container #content #inner-content  ul li { margin-bottom:5px;font-size:11px; text-transform:uppercase;}




/*contact*/
#container #content .head h3 { float:left; padding-right:10px;}
#container #content .head h4 { float:left; font-size:16px; padding-top:8px;}
#container #content div.content-right { padding-top:43px}
#container .contact .info a ,#container .contact .info a span { color:#666666}
.contact ul {
	display:none;
	visibility:inherit;
	position:relative;
	margin:0;
	
}
.contact ul li {
	float:left;
	width:100%;
	clear:both;
	margin-bottom:2px;
}
.contact ul li label {
	float:left;
	width:120px;
	text-align:left;
	font-size:18px;
	padding-right:10px;
	text-align:right;
	color:666
}
.contact ul li span {
	float:left;
	width:312px;
	font-size:11px;
	position:relative;
	overflow:hidden;
	color:#f6f6f6;
}
#container .contact ul li strong.select select { position:absolute; top:0; left:0; font-size:14px;}

.contact ul li input[type="image"] {
	margin-top:3px;
}
.contact ul li.btn {
	text-align:right;
}
.contact input[type="text"] {
	font-size: 11px;
	height: 20px;
	width: 307px;
	border:0;
	padding:0 0 2px 5px;
	font-size:14px;
	border:0;
	background:url(../images/contact/bg-txt.png);
}
.contact select {
	width:189px;
	border:0;
	background: none repeat scroll 0 0 transparent
}
.contact select option {
	background:#fff;
	color:#666
}
.contact select option.none {
	height:1px;
	overflow:hidden;
	background:#fff;
}
.contact ul li strong {
	display:block;
	padding:4px 5px;
	background:#ededed;
	text-align :left;
}
.contact textarea {
	border:0;
	width: 312px;
	padding:5px;
	height:34px;
	font-size:14px;
	background:url(../images/contact/bg-txt.png);
}
.contact .call, .contact .btn {
	display:none;
	float:right;
	clear:both;
	width:100%;
}
.contact .btn {
	padding-bottom:10px;
}
.contact input[type="submit"] {
	background: url(../images/contact/agree.jpg) no-repeat;
	border: 0 none;
	height: 20px;
	width: 59px;
	cursor:pointer
}
.contact .select {
	height: 21px;
	width:100%;
	padding:0 0 2px;
	background: url(../images/contact/bg-select.png) right 50% no-repeat;
	z-index:1;
}
.contact .select select {
	opacity: 0;
	filter: alpha(opacity = 0);
	moz-opacity:0;
	position: relative;
	/*z-index: 1;*/
	width:100%;
	height:21px;
	*margin-top:-30px;
}
.contact .select .select-text {
	float: right;
	text-indent: 10px;
	line-height: 19px;
	width:312px;
	display:block;
	margin:0 0 0 -312px;
	*margin:0 0 0 -100px;
}
.contact .select .select-text, .contact .select select {
	width: 100%;
	font-size:12px;
	font-weight:normal;
	color:#666;
}
.contact.select select option {width: 100%;
	font-size:12px;
	font-weight:normal;
	color:#000 !important;}

.contact p.submit {
	display:none;
	overflow:hidden;
	float:left;
	margin:7px 10px 0  130px;
}
.contact .info {
	display:none;
	font-size:15px;
	color:#666;
	float:left;
	line-height:12px;
}




.en .contact ul li label { font-size:11px;}
.en #container  #content p.info { font-size:11px; padding-top:2px;}
.en #container #content div.content-right  ul li { padding-bottom:0 !important;}




/*progress*/
#container .progress {
	padding:28px 0 0 80px;
	height:376px;
}
#container .progress .slide {
	float:left;
	padding-left:25px;
	margin-right:30px;
}
#container .progress .slide h4 {
	font-size:23px;
}
#container .progress .slide ul {
	padding-bottom:15px;
	font-size:17px;
}
#container .progress .slide a {
	color:#666;
}
#container .progress .scroll-pane {
	line-height:140%;
	position:relative;
}

/*gallery*/
#container .gallery-page .head { color:white; border-bottom:1px solid #ffffff; font-size:16px;margin-top:-50px;}
#container .gallery-page div.content-left  {width:462px; height:252px; padding:158px 0 0 18px; background:#93D0EB;}

#container .gallery-page div.content-left  h4 { font-size:18px; text-transform:uppercase; padding-bottom:5px; color:white; float: left;}
#container .gallery-page div.content-left p { float:left; margin-right:10px;}

/* gallery helicam*/
#container .gallery-page #myController { clear:both; margin:0; padding:0; float: left; width:100%;display:none}

/*  end */
#container .gallery-page #vdo{ width:958px; height:410px; position:absolute; z-index:5; top:0; left:0; display:none}
#container .gallery-page #vdo .bt-close { background:url(../images/btClose.png) no-repeat center center; width:30px; height:30px; position: absolute; z-index:6; display:block; overflow:hidden; text-indent:-99999em; top:0; right:0}

#gallery-page #container .gallery-page div.content-right {height:410px; width:462px; padding:12px 0 0 18px; display:none; background:#93D0EB;}
#gallery-page #container .gallery-page div.content-right h4 { font-size:18px; text-transform:uppercase; color:#002F65; padding-bottom:5px;}
#gallery-page #container .gallery-page div.content-right  ul { float:left; clear:both; width:100%; padding-bottom:7px;}
#gallery-page #container .gallery-page div.content-right  ul li { float:left; margin:0 0 2px 0; background:url(../images/gallery/bg-photo-list.png) no-repeat; width:107px; height:68px;}


.en #container .gallery-page div.content-right h4 { font-size:10px !important;}
.en #container .gallery-page div.content-left h4 { font-size:10px !important;}

#popup .close ,#popup2 .close, #popupMaster .close{
	position: absolute;
	top: -10px;
	right: -10px;
	width: 30px;
	height: 30px;
	background: url(../images/fancybox.png) -40px 0px;
	cursor: pointer;
	z-index: 1103;
	display: none;
	display:block;
}

#overlay {
	display:  none;
	left: 0;
	margin: 0;
	padding: 0;
	position: absolute;
	top: 0;
	z-index:88;
	cursor:pointer;
	background: white;
}


#gallery-page #popup {
	display: none;
	margin: 0;
	padding: 0;
	position: absolute;
	z-index: 99;
	padding:0;
	top:0;
	right:10px;
	width:853px;
	height:605px;	
}

#gallery-page #popup >  div {background: url(../images/gallery/lightbox_w.png) no-repeat;padding:20px 0 0 20px;width:833px;height:585px; margin:0 auto; position:relative; display:none}
#gallery-page #popup >  div.h {background: url(../images/gallery/lightbox_h.png) no-repeat; padding:15px 0 0 15px;width:650px; height:590px}
#gallery-page #popup >  div img { float:left; }
#gallery-page #popup >  div .close { top:-15px;}