/********************************************************** LightBlue #105cb6 #CC3300 yellow #CC9900
 * Description:  Provite CSS of roamChina v2011 homepage redesign. 
 * Last updated: 03/19/2011
 * Authors:      yangko@hotmail.com on March 19, 2011
 * Copyright(c)  2011-1015 RoamChina.com
 **********************************************************/

/* begin content
#content-wrapper { float:left; margin:0; padding:0; width:960px; background-color:#fafafa;}*/

/* main ads slideshow (jQuery.FeatureList) */
div#feature-list { margin:30px 20px 10px 20px;
	width: 920px;
	height: 320px;
	overflow: hidden;
	position: relative; background-color:#eee;
}
div#feature-list ul {
	position: absolute;
	top: 0;
	list-style: none;	
	padding: 0;
	margin: 0;
}
ul#tabs {
	left: 0;
	z-index: 2;
	width:354px;
}
ul#tabs li {
	width:320px; height:80px; overflow: hidden;
}	
ul#tabs li img {
	padding: 0px; 
	border: #ccc 1px solid;
	float: left;
	margin: 3px;
}
ul#tabs li h3 { margin:5px; color:#a40; width:300px; font-size:1.3em;}
ul#tabs li p { width:300px;}
ul#tabs li a {
	color: #222;
	text-decoration: none;	
	display: block;
	padding: 5px;
	height: 70px;
	outline: none;
}
ul#tabs li a:hover {
	color: #222;
	text-decoration: none;
}
ul#tabs li a.current:link h3 { 
	color:#a40;
	text-decoration: none;
}
ul#tabs li a.current:link p { 
	color:#222;
	text-decoration: none;
}

ul#tabs li a.current {
	background:  url(images/main/feature-tab-current.png);
	color: #222;
}
ul#tabs li a.current:hover {
	color: #222;
	text-decoration: none;
	cursor: default;
}
ul#tabs li a.current:hover h3 { 
	color:#a40;
	text-decoration: none;
	cursor: default;
}
ul#tabs li a.current:hover p { 
	color:#222;
	text-decoration: none;
	cursor: default;
}


ul#output {
	right: 0;
	width: 600px;
	height: 320px;
	position: relative;
}
ul#output li.output {
	position: absolute;
	width: 600px;
	height: 320px;
}
/*
ul#output li.output a {
	position: absolute;
	top: 2px;
	right: 2px;
	padding: 0;
	text-decoration: none;
	font-size: 11px;
	color: #FFF;
	background:#bbb;
	-moz-border-radius: 5px;
}
ul#output li.output a:hover {
	background: #f93;
}
*/
ul#output li.output img {
	position: absolute;
	top: 0px;
	left: 0px;
}
#dhtml {
	position: absolute;
	top: 0px;
	left: 0px;
	width:600px; height:320px; display:block; overflow:hidden;
}
#dhtml div.image  { float:left;  width:290px; height:320px;}
#dhtml div.content{ float:right; width:300px; height:320px;}
	

/* sliding-door homepage */
div.sliding-door { margin-top:10px; width: 600px; min-height:350px; overflow:hidden;}
ul.TabBar { margin:0; padding:0; width:600px; height:34px; border-bottom:#f93 1px solid; background-color:#eee;}
li.TabBarActive { 
	float:right; 
	margin:0px; 
	padding:10px 10px 0px 10px;
  width: auto; border-left:#f93 1px solid; border-right:#f93 1px solid; 
	height:22px; border-top:#f93 3px solid; 
	background-color:#fff; 
	list-style-type:none; 
	display:inline;
	text-align:center;
}
li.TabBarNormal { 
	float:right; 
	margin:0px; 
	padding:10px 10px 0px 10px; 
	width: auto; border-left: none;  border-right: #ccc 1px solid; 
	height:24px; border-bottom:#f93 1px solid; 
	background-color:#eee; 
	list-style-type:none; 
	display:inline;
	text-align:center;
	cursor:pointer;
}
span.tab {
	font-family: Arial, Helvetica, sans-serif;
	font-size:1.6em;
	color:#333;
	font-weight:bold;
}

div.TabContent { margin:10px 0px; padding:0; width:600px; height: auto; overflow:hidden;}
div.space10px { clear:both; margin:0 auto; width:100%; height:10px;}
div.space20px { clear:both; margin:0 auto; width:100%; height:20px;}

/* HIGHLIGHTS */
ul.highlights2 { margin:0; padding:0; width:600px; height: auto; overflow:hidden;}
li.highlights2 { float:left; margin:0; padding:0; width:180px; height:auto; list-style-type:none; display:inline; overflow:hidden;}
li.hls2-vspace { float:left; margin:0; padding:0; width: 30px; height:auto;  list-style-type:none; display:inline;} 
div.route-code { 
	position: absolute; 
	float: left; 
	margin-top:5px;
	padding-left:5px;
	width:50px; 
	height: 15px; 
	font-size:8px;
	font-weight:bold;
	color: #fff; 
	background-color:#a40; 
	filter:alpha(opacity=70);
	z-index:2;
}
a.highlights2:link, a.highlights2:visited {
	font-family:  Arial, Verdana, sans-serif;
	font-size:1.2em;
	color: #a40; 
	font-weight: bold; 
	text-decoration: none; 
	padding-right: 5px;
}
a.highlights2:hover, a.highlights2:active {  
	font-family: Arial, Verdana, sans-serif;
	font-size:1.2em;
	color: #333; 
	font-weight: bold; 
	text-decoration: underline; 
	padding-right: 5px;
}
li.highlights2 p {
	 font-size: 1.2em; line-height: 20px; color: #333;
}

/* NEWS */
div.news { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 1.1em;}
ul.first-news { margin:0; padding:0 10px; width: 580px; height:142px; overflow:hidden;} 
h2.first-news { margin:0; padding:0; font-size:1.5em; line-height:1.8em; text-align:center;}
p.publish { color:#666; text-align:center;}
ul.news       { margin: 0; padding:0; width: 600px; min-height: 22px;} 
li.news-title { float:left; margin-left:10px; width:495px; list-style:none; display:inline; line-height:22px; overflow: hidden; 
	padding-left:15px;
	background:url(images/icons/mark_bullet.gif) left center no-repeat;
}
li.news-date  { float:right; margin:0; width:80px; list-style:none; display:inline; text-align:left; overflow: hidden;}
li.news-date span { font-size:1.0em; color: #666;}

a.news:link, a.news:visited {
	font-family:  Arial, Verdana, sans-serif;
	font-size:1.3em;
	color: #a40; 
	font-weight: normal; 
	text-decoration: none; 
	padding-right: 5px;
}
a.news:hover, a.news:active {  
	font-family: Arial, Verdana, sans-serif;
	font-size:1.3em;
	color: #333; 
	font-weight: normal; 
	text-decoration: underline; 
	padding-right: 5px;
}

/* RECOMMENDED CITIES */
ul.topcity { margin:10px 0px; padding:0; width:600px; height:auto; overflow:hidden;}
li.topcity-img { float:left; margin:0; padding:0; 
	width:304px; 
	height:202px; 
	border: #f93 1px solid; 
	list-style-type:none; 
	display:inline; 
	overflow:hidden;
}
li.topcity-space { float:left; margin:0; padding:0; width: 14px; height:240; list-style-type:none; display:inline; overflow:hidden;} 
li.topcity-txt   { float:left; margin:0; padding-left:14px; width:280px; height:240; list-style-type:none; display:inline; overflow:hidden;} 

h2.topcity { margin:0; padding:0; font-size:1.7em; line-height:1.9em; text-align:center;}
p.topcity-slogan { font-family: "Trebuchet MS", Helvetica, sans-serif; font-size: 13px; color: #900; text-align: left; line-height:18px;}

h3.city-attr { margin-top:0; margin-bottom:6px; padding:0; width:300px; height:18px; border-bottom: #f93 2px solid;
	font-size:1.4em;
	color:#333;
}
ul.city-attr { float:left; margin:0; margin-left:6px; padding:0;}
li.city-attr { float:left; margin:0; padding-left:10px; width:188px; min-height:18px; display:inline; background:url(images/icons/mark_bullet.gif) left center no-repeat;}

div.bottom-more { margin:0px; width:600px; height:auto; text-align:right;}


/* TOURIST ATTRACTIONS */
li.TabBar { 
	float:left; 
	margin:0px; 
	padding:10px 10px 0px 10px; 
	height:24px; border-bottom:#f93 1px solid; 
	background-color:#eee; 
	list-style-type:none; 
	display:inline;
	text-align:center;
}


/* #home_flash { width: 920px; height: 285px; margin: 0px; padding: 20px 20px 0 20px; font-size: 10px; line-height: 14px; text-align: center;} */
/* #main_ad { width: 920px; height: 300px; margin: 20px 20px 0 20px; text-align: center;} */
/* Advanced Gallery DHTML script */
.gallerycontroller{
	width: 920px
}
.gallerycontent{ margin: 20px 20px 0 20px;
	width: 920px;
	height: 300px;
	display: block;
}
.left_img { float:left; margin:0 auto; width:600px; height:300px; list-style:none; display:inline;}
.right_txt{ float:left; margin:0 auto; width:300px; height:300px; list-style:none; display:inline; padding-left:20px;}
h1.flash_title { margin-top:0; font-size:1.1em;}
h1.flash_title a:link    { font-size:1.1em; color:#333; text-decoration:none;}
h1.flash_title a:visited { font-size:1.1em; color:#333; text-decoration:none;}
h1.flash_title a:hover   { font-size:1.1em; color:#f00; text-decoration:underline;}
h1.flash_title a:active  { font-size:1.1em; color:#f00; text-decoration:underline;}


#content { clear: both; width: 960px; margin: 0px; padding-top: 0px; font-size: 10px; line-height: 14px; text-align: left;}
#content #main      { float: left; width: 600px; margin: 0px auto; padding: 20px 0px 20px 20px;} /*620*/
#content #col_right { float: left; width: 302px; margin: 0px auto; padding: 20px 20px 20px 18px;} /*340*/

#main #main_content { margin-top: 0px; width: 600px; height: auto; overflow: hidden;}
#main_content h1 { 
	width: 590px; 
	height: 30px;
	padding-top: 8px; 
	padding-left: 10px;
	background: url(images/bg_title_600_yellow.gif) left top no-repeat; 
	font-family: sans-serif, Verdana, Tahoma, "Bookman Old Style", Cambria; 
	color: #AE0707; 
	font-size: 1.4em; /* font-style:oblique; */
	text-align: left; 
}
#main_content #body_text { width: 598px; height: aotu;
	margin-top: -10px;
	padding: 0px;
	border-top:    #fb5 0px solid;
	border-left:   #fb5 0px solid;
	border-bottom: #fb5 0px solid;
	border-right:  #fb5 0px solid;
	overflow: hidden;
} 
#body_text h2 { font-family: "Trebuchet MS", Helvetica, sans-serif; font-size: 1.8em; color: #333; text-align: center; line-height: 24px; padding-top: 20px; padding-bottom: 0px; padding-left: 10px; padding-right: 10px;}
#body_text #text { width: 560px; height: auto; padding-left: 19px; padding-right: 19px; }
#body_text p { font-size: 1.2em; line-height: 20px; color: #333;}
#body_text p.subTitle { font-size: 1.4em; font-weight: bold; color: #930;}
#body_text td { font-size: 1.2em; line-height: 20px; color: #333;}
#body_text .bottom_line { width: 550px; height: 10px; border-top: #c60 1px dashed;}

a.travel_highlights:link, a.travel_highlights:visited {
	font-family: sans-serif, Verdana, Arial, Helvetica; 
	font-size: 13px; 
	color: #900;
	font-weight: bold;
	text-decoration: none;
}
a.travel_highlights:hover, a.travel_highlights:active {
	font-family: sans-serif, Verdana, Arial, Helvetica; 
	font-size: 13px; 
	color:#f00;
	font-weight: bold;
	text-decoration: underline;
}
span.h_subtitle { font-style:oblique; line-height: 1.5em;}


/* Tour Packages*/
#main_content .routes { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 1.1em; line-height: 16px; min-height: 100px;}
#main_content .routes_clear { clear: both; width: 600px; height:5px;}

ul.nav_entry_bottom { margin: 0;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #666;
	line-height: 20px;
	text-align: left; padding: 2px 0px 0 40px;
}

<!--Popular China Attractions -->
#main_content #attr_list { 
	width: 600px; 
	height: 260px;
	margin: 0px;
	padding: 0px;
	border-top:    #fb5 0px solid;
	border-left:   #fb5 0px solid;
	border-bottom: #fb5 0px solid;
	border-right:  #fb5 0px solid;
	overflow: hidden; 
	float: left;
} 
#attr_list ul { width: 600px; height: 105px; margin: 0px; padding-top: 0px; padding-left: 0px; padding-bottom: 20px;
	list-style-type: none;
	float: left;
	overflow: hidden;
}
#attr_list li.withSpace { width: 150px; padding-left: 5px; margin: 0 auto; 
	height: 105px; 
	list-style-type: none; 
	display: inline; 
	float: left;
} 
#attr_list li.noSpace { width: 122px; padding-left: 5px; padding-right: 0px;
	height: 100px; 
	margin: 0px;
	list-style-type: none; 
	display: inline; 
	float: left;
} 
#attr_list li div.a_img { width: 120px; height: 80px; border: #FFB64B 1px solid; border-bottom: #FFE9C1 1px solid;}
/*#attr_list li div.a_img { width: 120px; height: 80px; border: #999 1px solid; border-bottom: #eee 2px solid;} */
#attr_list li div.a_txt { width: 120px; height: 18px; padding-top: 1px; 
	background: url(images/bg_top10attr_img.gif) bottom repeat-x;
	border: #FFB64B 1px solid;
	border-top: none;
	font-size: 1.0em; 
	font-weight: normal; 
	text-align: center; 
	white-space: nowrap; 
	overflow: hidden;
}
#attr_list li a:link { color: #b00; text-decoration: none;}
#attr_list li a:visited { color: #b00; text-decoration: none;}
#attr_list li a:hover { color: #f00; text-decoration: underline;}


a.highlights:link, a.highlights:visited {  font-family: Verdana, Arial; color: #c60; font-weight: bold; text-decoration: none; padding-right: 5px;
}
a.highlights:hover, a.highlights:active {  font-family: Verdana, Arial; color: #f00; font-weight: bold; text-decoration: underline; padding-right: 5px;
}

#col_right #promo_events { margin-top: 20px; width: 300px; height: auto; overflow: auto; background-color: #FFE4B6; border: #FFE4B6 1px solid;}
#promo_events  h1 { width: 300px; height: 30px; overflow: hidden; 
	color: #900; 
	font-size: 1.6em;
	margin-top: 0px;
	margin-bottom: 0px; 
	padding-top: 16px;
	padding-bottom: 0px;
	text-align: center;
	letter-spacing: 1px;
	text-transform: uppercase;
}
#promo_events p { padding-left: 10px; padding-right: 10px;}
#promo_events #e1_link { margin-top: 10px; width: 300px; height: 15px; background-color: #FFE4B6;}

/* events box style without bgcolor */
#col_right #promo_events2 { margin-top: 24px; width: 300px; height: auto; background-color: #fff; border: #D73728 1px solid;}
#promo_events2  h1 { width: 300px; height: 20px; overflow: hidden; 
	color: #fff;
	background-color: #B91015; /* #939393; */
	font-family: Cambria, "Bookman Old Style";
	font-size: 1.6em;
	margin-top: 0px;
	margin-bottom: 0px; 
	padding-top: 8px;
	padding-bottom: 0px;
	text-align: center;
	letter-spacing: 1px;
	text-transform: uppercase;
}
#promo_events2 p { padding-left: 15px; padding-right: 15px;}
#promo_events2 #e1_link { margin-top: 10px; width: 300px; height: 15px; background-color: #FFE4B6;}


#col_right #links_exchange { margin-top: 20px; width: 300px; height: auto; overflow: auto;}
#links_exchange h1 { width: 300px; height: 30px; overflow: hidden; color: #900; margin: 0px; padding: 0px;}
#links_exchange ul { margin: 0px; padding: 0px;}
#links_exchange li { list-style-type: disc;}

/* Itinerary*/
#main_content #itinerary { width: 598px; height: aotu;
	margin-top: -10px;
	padding: 0px;
	border-top:    #fb5 0px solid;
	border-left:   #fb5 0px solid;
	border-bottom: #fb5 0px solid;
	border-right:  #fb5 0px solid;
	overflow: hidden;
} 
#itinerary h2 { font-family: "Trebuchet MS", Helvetica, sans-serif; font-size: 2.0em; color: #333; text-align: center; line-height: 24px; padding-top: 20px; padding-bottom: 0px; padding-left: 10px; padding-right: 10px;
}
#itinerary h3 { 
	font-family: Helvetica, sans-serif; font-size: 1.5em; font-weight: bold; color: #fff; line-height: 20px;
	width: 550px; height: 22px; margin-left: 14px; margin-right: 14px; 
	padding-top: 2px; padding-left: 10px;
	background-color: #c60;
}
#itinerary p { font-size: 1.2em; line-height: 20px; color: #333;}
#itinerary p.subTitle { font-size: 1.4em; font-weight: bold; color: #930;}
.bottom_line { width: 550px; height: 10px; border-top: #c60 1px dashed;}
#itinerary li.listQuotation { font-size: 1.2em; line-height: 20px; color: #333;}

#route_part1 { width: 570px; height: auto; padding-left: 14px; padding-right: 14px; }
#route_part2 { width: 560px; height: auto; padding-left: 19px; padding-right: 19px; margin-top: -10px;}
#route_part3 { width: 560px; height: auto; padding-left: 19px; padding-right: 19px; margin-top: 10px;}


/* Comments */
#comments { width: 600px; margin-left: 0px; margin-right: 0px; margin-top: 30px; margin-bottom: 40px; min-height: 128px;
	background: url(images/bg_comments.png) top left no-repeat;
	float: left; overflow: auto;
}
#comments h2 { padding-left: 50px; padding-top: 10px; margin-top: 0px; margin-bottom: 10px; font-size:18px; font-weight: bold; color:#993300;}
#comments #container2 { padding-left: 60px; margin: 0px; width: 540px; overflow: hidden; }
td.commentsTitle { color:#FFFFFF; font-family: Helvetica, Arial; font-size: 11px; font-weight: bold; 
	text-align: left; background-color: #993300;
	padding-left: 5px;
}
td.commentsName { background-color: #DCE5EF; font-family: Helvetica, Arial; font-size: 11px; color:#000000;
	padding-left: 5px; padding-top: 5px;
}
td.commentsText { background-color: #DCE5EF; font-family: Helvetica, Arial; font-size: 11px; color:#000000;
	text-align: left; height: 30px;
	padding-left: 5px; padding-top: 5px;
}

#comments ul { border-top: #E5BF52 1px dashed;}
#comments li { list-style-image: url(images/mark_ding.gif);}

#mark-reply { float: right; padding-right: 5px; padding-bottom: 2px;}

A.picstroke:link, A.picstroke:visited {
	display:block;
	height:248px;
	width:298px;
	border: #ccc 1px solid;	
}
A.picstroke:hover { 
	display:block;
	height:248px;
	width:298px;
	border: #c33 1px solid;	
}

