﻿/* Copyright 1999-2009 MINGHUI.ORG */
/* CSS layout version MH.2009.05.21.1*/
/* Supported browsers: 
   Microsoft: IE6,IE7,IE8
   Mozilla: Firefox 3.0.x
   Opera: Opera 9.x
   Google: Chrome 1.x
   Apple: Safari 
=================================================================
Guidelines followed in this stylesheet
(1) blocks with BORDER/PADDING cannot have WIDTH, and vice versa. Use a outer block to control WIDTH, and an inner block for BORDER/PADDING
==> this is to support IE box model and W3C box model
http://www.456bereastreet.com/archive/200612/internet_explorer_and_the_css_box_model/

(2) page centering
http://www.maxdesign.com.au/presentation/center/

Prefix naming conventions
- c: container
- b: border
- m: margin

Dimensions: margin_left + border_left + padding_left + content + padding_right + border_right + margin_right
Example: 0+1+350+1+5 means
- margin_left: 0px
- border_left: 1px
- content: 350px
- border_right: 1px
- margin_right: 5px

There are 2 big blocks: "c_main" (715px) and "c_right" (245px)

c_main (715px) is made up of 2 blocks:
c_main_left (0+1+5+335+5+1+5) + c_main_right (5+1+5+335px+5+1+5)

c_right (200px) = left-mbp(5+0+0) + 235px + right-pbm(0+0+0)
- shifu_photo: 
/*---------------------------------------------------------------------------*/


* {
/* reset all styles to have zero padding and margin for consistency across all browsers */
   padding:0;
   margin:0;
}
body {
	margin: 5px;
	text-align: center; /* for IE */
	font-size: 12pt;
	line-height: 1.5em;
}

div {height: 100%}

#body_centralize {
/* wrapper block for BODY to centralize page, support all browsers, except NN4 */
	width: 960px;
	margin: 0 auto;   /* align for good browsers */
	text-align: left; /* counter the body center */
}
.noborder {
	border-collapse: collapse;
	border-width: 0;
	padding: 0;
	vertical-align: top;
}

td { vertical-align: top; }

.empty_line {
	width: auto;
	height: 10px;
}
.empty_column {
	width: 10px;
	height: auto;
}
/*-----------------------------------------------
Below are the root blocks that sets the width
-----------------------------------------------*/
/* c_full = c_left + c_right */
.c_full		{ width: 960px;}
.c_left		{ width: 730px; }
.c_right	{ width: 230px; }
/* c_left = c_left_3c_leftwide + 10px + c_left_3c_right */
.c_left_3c_leftwide	{ width: 480px; }
/* c_left = c_left_3c_left + c_left_3c_middle + c_left_3c_right */
.c_left_3c_left		{ width: 245px; }
.c_left_3c_middle	{ width: 245px; }
.c_left_3c_right	{ width: 240px; }	/* one extra pixel due to account for rounding excess */
/* c_left = c_left_5c_left + 10px + c_left_5c_middle + 10px + c_left_5c_right */
.c_left_5c_left		{ width: 237px; }
.c_left_5c_middle	{ width: 237px; }
.c_left_5c_right	{ width: 236px; }	/* one extra pixel due to account for rounding excess */
/* c_left = c_left_2c_left + 10px + c_left_2c_right */
.c_left_2c_left		{ width: 360px; }
.c_left_2c_right	{ width: 360px; }

.content { padding: 5px 5px 0 5px;}

.box_left { border: 1px #C3F6EB solid;  border-bottom: none;}
.box_right { border: 1px #C3F6EB solid; border-bottom: none;}
.box_feature { border: 1px solid #C3F6EB; border-bottom: none; }
.box_yellow { padding: 5px 0 0 0; background-color: #FAFCAD; }

.box_left_more_articles { border: 1px #C3F6EB solid; border-top: none;}
.box_right_more_articles { border: 1px #C3F6EB solid; border-top: none;}
.box_feature_more_articles { border: 1px solid #C3F6EB; border-top: none; padding-right: 5px;}
.box_yellow_more_articles { padding: 0 0 0 5px; background-color: #FAFCAD; }


#banner {
	width: inherit;
	float: none;
	margin-bottom: 5px;
}



img { border: 0px; vertical-align: bottom }

a 			{ text-decoration:	none; color:	#0033CC;	}
a:active	{ text-decoration:	none; color:	#0033CC;	}	
a:link		{ text-decoration:	none; color:	#0033CC;	}	
a:visited	{ text-decoration:	none; color: 	#666666; 	}	
a:hover		{ text-decoration:	underline;	color: #99CCFF;	}

ul { 
	padding-left:1em;
    margin-left:0;
}
li {
	list-style: disc url(/images/yellowarrow.gif) outside;
	color: blue;
}

#empty_line {
	clear:both;
}

.separator {
	background-image: url(/images/lightBlueDot.gif);
	background-repeat: repeat-x;
	width: 100%;
	height: 1px;
	clear: both;
	margin-bottom: 20px;
}

/*--------------------------------------------------------------------------------*/
/* This is the 1st container with the righbar (shifu-photo + recommended articles)*/
.menubar {
	padding: 5px 0 5px 0;
	background-color: #4A96FA; 
/*	background-color: #1978FF; */
	color: #FFFFFF;
	text-align: center;
}

.menubar ul { display:inline; list-style: none; }
.menubar li { font-size: 13pt; display:inline; text-align: center; padding: 0px 25px 0px 25px; }
.menubar a { font-size: 13pt; color: #FFFFFF; text-decoration: none;}
.menubar a:hover { font-size: 13pt; color: blue; background-color: #FFFFFF;text-decoration: none;}
.menubar li:hover { font-size: 13pt; color:blue; background-color: #FFFFFF; text-decoration: none;}

.topbar {
	-moz-border-radius: 15px;
	-webkit-border-radius: 15px;
	border-color: #D0FAA5;
	border-style: solid;
	border-width: 1px;
	text-align: center;
	padding: 5px 0 5px 0;
	height: 21px;
}

#search_text {
	position: relative;
	color: #5A0FC8;
	display: inline;
}

#search_bar {
	display: none;
}
#search_input {
	padding: 0;
	border: collapse;
	border-width: 0px;
	width: 160px;
	margin-right: 5px;
	text-align: center;
	height: 21px;
}

.blue 		{ color: #3366FF; }
.blue a 	{ color: #3366FF; }
.orange 	{ color: #FF7D00; }
.orange a 	{ color: #FF7D00; }
.purple 	{ color: #5A0FC8; }
.purple a 	{ color: #5A0FC8; }

.float_left { float: left;}

.FrontpageTopDate { text-align: center; margin: 5px; font-size: 10pt; color: #007fbf; clear: both; text-decoration: none;}
.FrontpageTopDate a:link {  font-size: 10pt; color: #007fbf; text-decoration: none;}
.FrontpageTopDate a:visited { fontsize: 10pt; color: #007fbf; text-decoration: none;}
.FrontpageTopDate a:hover {  font-size: 10pt; color: #99ccff; text-decoration: underline;}
.FrontpageTopDate img { vertical-align: middle; padding: 0 10px 4px 10px; }
	
.FrontpagePageNav_Disabled {  padding: 0 10px 0 10px; font-size: 10pt; color: #C0C0C0; text-decoration: none; }
.FrontpagePageNav {  margin: 0 10px 0 10px; font-size: 10pt; color: #000000; text-decoration: none; }
.FrontpagePageNav:link {  font-size: 10pt; color: #0033cc; text-decoration: none;}
.FrontpagePageNav:visited {	font-size: 10pt; color: #0033cc; text-decoration: none;}
.FrontpagePageNav:hover {  font-size: 10pt; color: #99ccff; text-decoration: underline;}
.FrontpagePageNav img { vertical-align: middle; padding-bottom: 4px;}

.FeaturedArticleTitle { text-align: center; font-size: 14pt; color: #DF821C; font-weight: bold; }
.FeaturedArticleTitle a:link {  font-size: 14pt; color: #DF821C; text-align: center; font-weight: bold; }
.FeaturedArticleTitle a:visited {  font-size: 14pt; color: #DF821C; text-align: center; font-weight: bold; }
.FeaturedArticleTitle a:hover {  font-size: 14pt; color: #DF821C; text-align: center; font-weight: bold; }

.FeaturedArticleText {  margin: 10px; font-size: 12pt; color: #635F29; line-height:130%; text-decoration: none;}
.FeaturedArticleText a:link {  font-size: 12pt; color: #635F29; line-height:130%; text-decoration: none;}
.FeaturedArticleText a:visited {  font-size: 12pt; color: #635F29; line-height:130%; text-decoration: none;}
.FeaturedArticleText a:hover {  font-size: 12pt; color: #635F29; line-height:130%; text-decoration: none;}

.FeaturedArticleSubTitle { text-align: center;font-size: 12pt; color: #635F29; text-decoration: none}
.FeaturedArticleSubTitle a:link {  text-align: center; font-size: 14pt; color: #635F29; text-decoration: none}
.FeaturedArticleSubTitle a:visited {  text-align: center; font-size: 14pt; color: #635F29; text-decoration: none}
.FeaturedArticleSubTitle a:hover {  text-align: center; font-size: 14pt; color: #635F29; text-decoration: none}

		.todaynews_title {
			float:left;
			margin: 5px 5px 5px 0;
		}
						
		.todaynews_image {
			float: left;
			width: 150px;
			margin: 5px 8px;
		}
		
		.todaynews_image img {
			width: 160px;
		}

		.todaynews_articles {
			float: right;
			width: 280px;
			height: auto;
		}

		.todaynews_articles_noimage {
			float: right;
			min-width: 450px;
			height: auto;
		}

		.category_title {
			float:left;
			clear:both;
			text-align: left;
			vertical-align: middle;
			margin: 5px 15px 20px 5px;
		}
		.category_subcat_title { padding: 5px 0 15px 0; margin: 0; font-size: 10pt; line-height: 130%; }
		.category_subcat_title li { padding: 0; margin: 0; list-style: none; display: inline;}
		.category_subcat_title li:hover { background-color: blue; color: white;}
		.category_subcat_title li.first { margin: 0; padding: 0; list-style: none; display: inline; }
		.category_articles { clear:both; float:none; margin: 0 5px 0 5px; }
		
		#recommended_title {
			text-align:center;
			float:none;
			clear: none;
			margin: 10px;
			margin-bottom: 20px;

		}
		#recommended_articles {
			clear:both;
			float:none;	
			margin: 5px;
			font-size: 11pt;
		}
		
		#recommended_articles li {
			list-style-type: none;
		}

		.more_articles {
			float: right;
			clear: both;
			text-align:right;
			width: 50px;
			height: 20px;
			margin: 0px 5px 5px 0;
			font-size: 10pt;
			background-image: url(/images/icon_more_articles_arrow.gif);
			background-repeat: no-repeat;
			background-position: center left;
		}

		#misc_category {
			margin: 5px;
			height: 180px;
		}

		#misc_category li {
			list-style-image: none;
			list-style-type: none;
			margin-left: -10px;
			margin-bottom: 10px
		}

#c1_content_right_jingwen  .category_title { float: none; text-align: center; margin-top: 10px; margin-bottom: 0px; }
#c1_content_right_jingwen  .category_subcat_title { margin-bottom: -55px; }
#c1_content_right_mheditorial .category_title { float: none; text-align: center; margin-top: 10px; margin-bottom: 15px; }
#c1_content_right_mheditorial .category_subcat_title { float: none; text-align: center; margin: -5px 0 -20px 0 ; }
		

		.c1_right_shifu_photo {
			background-color: #4A96FA;
			text-align: center;
			color: #FFEA96;
			font-size: 9pt;
			line-height: 125%;
			width:220px;
		}
		.c1_right_shifu_photo img {
			margin-bottom: 5px;
			border-color: #FFCC00;
			text-align: center;
		}
		.shifu_photo_caption {
			padding: 0 5px 3px 5px;
		}
		.c1_right_recommended {
			-moz-border-radius: 15px;
			-webkit-border-radius: 15px;
			border-style: solid;
			border-width: 2px 2px 0 2px;
			border-color: #66CCFF;
		}
		.c1_right_recommended_more_articles {
			-moz-border-radius: 15px;
			-webkit-border-radius: 15px;
			border-style: solid;
			border-width: 0 2px 2px 2px;
			border-color: #66CCFF;
		}

.promotion_ad {
	border: 0;
	text-align: center;
/*		border-style: solid;
		border-width: 2px;
		border-color: #FAFCAD;
*/
}

/*--------------------------------------------------------------------------------*/

.hottopics {
	-moz-border-radius: 15px;
	-webkit-border-radius: 15px;
	padding: 5px 5px 0 5px;
	border-style: solid;
	border-width: 2px 2px 0 2px;
	border-color: #FFFF00;
}
.hottopics_more_articles {
	-moz-border-radius: 15px;
	-webkit-border-radius: 15px;
	padding: 0 5px 5px 5px;
	border-style: solid;
	border-width: 0 2px 2px 2px;
	border-color: #FFFF00;
}
.hottopics li {
	padding-top: 0px;
	margin-left: 10px;
	list-style-type: none;
}



/* This is the 3rd container with the horizontal scrolling text*/
.message_scroll {
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-style: dashed;
	border-width: 2px;
	border-color: #800080;
	padding: 10px;
}

/* This is the 4th container with the rightbar (mhbooks + mhsubsites, etc.*/

.mhbooks {
	float: left;
	-moz-border-radius: 15px;
	-webkit-border-radius: 15px;
	border: 2px solid #FFFF00;
	margin-bottom: 10px;
}

.mhbooks_carousel_container {
	width: 90%;
	margin-bottom: 10px
}
			
		
.quicklinks {
	-moz-border-radius: 15px;
	-webkit-border-radius: 15px;
	padding: 15px 15px 15px 15px;
	text-align: center;
	border-style: solid;
	border-width: 2px;
	border-color: #AAAAAA;
	margin: 10px 0 10px 0;
	color: #FFFFFF;
	background-color: #4A96FA; 
}
.quicklinks a { color: white; }

/* This is the 5th container with the friendly links*/
.friendly_links {
	width: inherit;
	border-color: #66CCFF;
	border-style: solid;
	border-width: 1px;
	float: left;
	clear: both;
	margin-bottom: 5px;
	margin-top: 5px;
	color: #3366FF;
}

.friendly_links img { margin: 15px 20px 15px 5px; }

.footer {
	text-align: center;
	margin-top: 10px;
	font-size: small;
	color: black;
}


.c_mhsubsites {
	width: inherit;
	float: right;
	margin: 15px 0 15px 0;
	text-align: center;
}

.mh_subsites {
	-moz-border-radius: 15px;
	-webkit-border-radius: 15px;
	border-color: #D0FAA5;
	border-style: solid;
	border-width: 1px;
	text-align: center;
	width: 220px;
	padding: 15px 0 15px 0;
	margin-bottom: 10px;
}

.mhradio_site 		{	background-color: #5EB63B; 	color: #FAFCAD; }
.mhzb_dalu_site 	{	background-color: #0087FF; 	color: #FAFCAD; }
.mhzb_haiwai_site 	{	background-color: #FFD000; 	color: #0033CC; }
.mhzk_site 			{	background-color: #FFFB00; 	color: #0033CC; }
.library_site 		{	background-color: #33DF7A;	color: #0033CC; }
.weekend_site 		{	background-color: #B992F3;	color: #0033CC; }
.worldfldfday_site 	{	background-color: gold;		color: #0033CC; }
.huiyuan_site 		{	background-color: #B9ED5D;	color: #0033CC; }
.photo_site 		{	background-color: #66E0EF;	color: #0033CC; }

.mhradio_site a 	{	color: #FAFCAD; }
.mhzb_dalu_site a	{	color: #FAFCAD; }
.mhzb_haiwai_site a	{	color: #0033CC; }
.mhzk_site a		{	color: #0033CC; }
.library_site a		{	color: #0033CC; }
.weekend_site a		{	color: #0033CC; }
.worldfldfday_site a	{	color: #0033CC; }
.huiyuan_site a		{	color: #0033CC; }
.photo_site a 		{	color: #0033CC; }

