@charset "UTF-8";
/* wrapper ที่เราเขียนข้อความไปให้คนอ่าน มีขนาด width:750px;	*/
body{
	color:#555;
	line-height:2em;
	font-size:12px;
	font-family:tahoma;
	text-align:center;
	min-width:780px;
	margin-top:0;
	padding-top:0;}
#wrapper, #msn_wrapper{
	width:750px;	
	margin: 0 auto;
	text-align:left;}
#container, #msn_container{/*ที่ต้องมี div container นี่เพราะว่า จะได้เป็น nearest ancestor ให้กับ div high ที่มี position absolute*/
	position:relative;
	width:100%;}
#access, #msn_access{
	text-align:right;
	background:url(../img/newindex/thai-dating-website.gif) no-repeat;
	padding:12px 0 2px 0;
	margin:5px 0 0 0;}	
#access a, #msn_access a{
	color:#0F29BC;
	text-decoration:none;}
#access a:hover, #msn_access a:hover{
	text-decoration:underline;}	
#mainNav{
	text-align:left;
	padding-top:28px;
	color:#FF7701;
}
#mainNav a{
	text-decoration:none;
	font-size:125%;
	font-weight:bold;
	color:#0F29BC;
	margin-left:15px;
}
#mainNav  a:link {color:#0F29BC;}     /* unvisited link */
#mainNav  a:visited {color:#0F29BC;}  /* visited link */
#mainNav  a:hover {color:#FF7701;}   /* mouse over link */
#mainNav  a:active {color:#0F29BC;}   /* selected link */	

#model, #msn_model{
	background:url(../img/newindex/soulmates.gif) no-repeat;
	padding-left:219px;/*ภาพ soulmates.gif = 220 x 250 px   เฉพาะภาพตรงคนกอดกัน กว้าง x สูง = 173 x 250 px ความสูงของสีเขียว #67FF02 = 150px*/
	/*ที่ต้องทำ padding-left = 219px เพราะ Firefox under windows vista หากใช้ padding-left = 220px จะมีขีดรอยต่อสีขาว ดูสีเขียวที่เป็นแผงแนวนอน ไม่ smooth ถูกคั่นด้วยสีขาว 1 เส้น*/	
	height:250px;
	border-top:#A96C39 1px solid;}
#model #search, #msn_model #msn_search{
	background: url(../img/newindex/bg-green.gif) bottom repeat-x;
	height:250px;
	padding:0 40px 0 15px;/*ตรงนี้มี padding ในแนวตั้งไม่ได้ เพราะจะทำให้ div search  ยาวขึ้น สัดส่วนเสีย ตรงที่เขียวๆ จะต่ำลงเกินไป*/}
#model #search h1, #msn_model #msn_search h1{
	color:#DB0280;
	font-size:16px;
	margin:0;
	padding:20px 0 0 0;/*padding แนวตั้งเลยต้องมาทำที่ component ข้างในแทน*/}	
#search a, #msn_search a, #search span, #msn_search span{
	display:block;
	text-decoration:none;	
	color:#0F29BC;
	font-size:14px;
	margin-top:10px;}
#search a:hover, #msn_search a:hover{
	text-decoration:underline;}
#model form, #msn_model form{
	margin:30px 0 0 0;
	padding:0;}	
#model form table, #msn_model form table{
	border-collapse:collapse;
	margin:3px 0;}	
#model form table td, #msn_model form table td{
	padding-bottom:10px;}
#model form table td.i, #msn_model form table td.i{
	width:50px;}	
#model form table td.ii, #msn_model form table td.ii{
	width:40px;
	padding-left:25px;}		
#model form select, #msn_model form select{
	border:#aaa 1px solid;
	font-size:12px;
	font-family:tahoma;
	height:20px;
	vertical-align:bottom;}	
#model form input.submit, #msn_model form input.submit{
	font-size:14px;
	font-weight:bold;
	padding:2px 10px;
	background-color:#DB0280;
	color:#fff;
	border:1px outset #DB0280;
	margin-right: 20px;}	
#news, #msn_news{
	background:url(../img/index/gradient-bg.gif) repeat-x;
	padding:15px 0 0 15px;
	margin-bottom:15px;}	
#news h2, #msn_news h2{
	padding:0 0 0 0;
	margin:0;
	font-size:13px;}	
	

#members, #msn_members, #members_men{
	border-top:1px solid #BF9E60;
	padding-top:5px;
	background:url(../img/newindex/online-dating.gif) no-repeat 100% 0;/*ส่วนตรงนี้ ภาพbg จะเป็นภาพทั้ง ญ และ ช*/	}
#members_men{background:url(../img/newindex/men.gif) no-repeat 100% 0;/*ส่วนตรงนี้ ภาพbg จะเป็นภาพ ช ทั้งหมด*/	}
#members h4	, #msn_members h4, #members_men h4	{
	padding:0;
	margin:40px 0 0 0;
	font-size:13px;}
#members table, #msn_members table, #members_men table{
	width:100%;
	border-collapse:collapse;
	margin-top:30px;
	margin-bottom:20px;
	table-layout:fixed;}
#members table th, #msn_members table th, #members_men table th{
	font-weight:bold;
	font-size:110%;
	color:#fff ;
	background-color:#BF9E60;}		
#members table tr#first_row td, #msn_members table tr#first_row td, #members_men table tr#first_row td{
	padding-top:8px;}	
#members table th.i, #members table td.i, 
#msn_members table th.i, #msn_members table td.i,
#members_men table th.i, #members_men table td.i{
	width:130px;
	padding: 0 0 0 5px;}		
#members table th.ii, #members table td.ii, #members table th.iii, #members table td.iii, 
#msn_members table th.ii, #msn_members table td.ii, #msn_members table th.iii, #msn_members table td.iii,
#members_men table th.ii, #members_men table td.ii, #members_men table th.iii, #members_men table td.iii{
	width:50px;}		
#members table td, #msn_members table td, #members_men table td{
	border-bottom:#ccc dotted 1px;}
#members table td a, #msn_members table td a, #members_men table td a{
	color:#555;
	text-decoration:none;
	display:block;}	
#members table td a:hover, #msn_members table td a:hover, #members_men table td a:hover{
	text-decoration:underline;
	color:#A96C39;}
	/*end of #members*/	
	
a#more_members, a#more_msn_members{
	display:block;
	padding:5px 0;
	text-align:center;
	color:#0F29BC;
	text-decoration:none;}	
a#more_members:hover, a#more_msn_members:hover{
	text-decoration:underline;}	

#footer{
	padding:15px 0;
	text-align:center;
	color:#555;
	clear:both;
	border-top:#ccc 1px solid;}
#footer a{
	color:#555;
	text-decoration:none;}	
#footer a:hover{
	text-decoration:underline;}	
#footer span{
	padding:0 15px;}