/* ================================================================ 
This copyright notice must be untouched at all times.

The original version of this stylesheet and the associated (x)html
is available at http://www.cssplay.co.uk/menus/drop_variations.html
Copyright (c) 2005-2007 Stu Nicholls. All rights reserved.
This stylesheet and the assocaited (x)html may be modified in any 
way to fit your requirements.
=================================================================== */
 /* common styling */

 /* Set up the default font and ovrall size to include image */
 
 body {
	padding: 0; 
	margin: 0; 
	background: #fff;
	font-family: Arial, 宋体;
	font-size: 12px;
	line-height: 19px;
	color: #454545; 
}
/* style the outer div to give it width */
.menu {font-size:12px; color:#252A6D; text-align:center; padding:0 0 0 0;}

/* remove all the bullets, borders and padding from the default list styling */
.menu ul {padding:0;margin:0;list-style-type:none; height:25px; background:transparent;}

/* style the sub-level lists */
.menu ul ul {width:0px;}

/* float the top list items to make it horizontal and a relative positon so that you can control the dropdown menu positon */
.menu ul li {float:left; height:40px; display:block; margin-right:-1px;}

/* style the sub level list items */
.menu ul ul li {display:block; width:150px; height:auto; line-height:1em;}
.menu ul ul li.last {padding-bottom:10px; background:url('images/sub_bottom.gif') no-repeat bottom left;}
.menu ul ul ul li.last {padding-bottom:10px; background:url('images/two_bottom.gif') no-repeat bottom left;}
.menu ul ul ul ul li.last {padding-bottom:10px; background:url('images/three_bottom.gif') no-repeat bottom left;}

/* style the links for the top level */
.menu a, .menu a:visited {border-left:0 none; border-right:0 none; border-top:0 none; display:block; float:right; width:80px; text-decoration:none; color:#252A6D; padding-left:0px; padding-right:0px; padding-top:40px; padding-bottom:0}
/* hack IE5.x to get the correct the faulty box model and get the width right */
* html .menu a, * html .menu a:visited {width:125px; w\idth:115px;}

/* style the sub level links */
.menu ul ul a, .menu ul ul a:visited {display:block;background:#A9C0CE; color:black;width:130px; height:100%; line-height:1em; padding:5px 10px; border:0; border-width:0;}
* html .menu ul ul a, * html .menu ul ul a:visited  {width:150px; w\idth:130px;}


/* style the table so that it takes no part in the layout - required for IE to work */
.menu table {border-collapse:collapse; padding:0; margin:-1px; width:0; height:0; font-size:1em; z-index:1;}


/* style the third level background */
.menu ul ul ul a, .menu ul ul ul a:visited {background:#009999;}
/* style the fourth level background */
.menu ul ul ul ul a, .menu ul ul ul ul a:visited {background:#A9C0CE;}
/* style the sub level 1 background */
.menu ul :hover a.sub1 {background:#A9C0CE;}
/* style the sub level 2 background */
.menu ul ul :hover a.sub2 {background:#009999;}

/* style the level hovers */
/* first */
* html .menu a:hover {color:#ff0; border:0; height:25px; position:relative; z-index:100;}
.menu li:hover {position:relative;}

.menu :hover > a {color:#ff0; border:0; height:25px;}
/* second */
* html .menu ul ul a:hover{color:#ff0; background:#7aa; position:relative; z-index:110; height:100%; border-width:0 1px;}

.menu ul ul li:hover {position:relative;}
.menu ul ul :hover > a {color:#ff0;background:#7aa;background:#6C757A; z-index:110; height:100%; border-width:0 1px;}
/* third */
* html .menu ul ul ul a:hover {background:#A9C0CE; position:relative; z-index:120;}
.menu ul ul ul :hover > a {background:#6C757A;}
/* fourth */
.menu ul ul ul ul a:hover {background:#6C757A; position:relative; z-index:130;}


/* hide the sub levels and give them a positon absolute so that they take up no room */
.menu ul ul {visibility:hidden;position:absolute; height:0; top:24px; left:0px; width:150px;}

/* position the third level flyout menu */
.menu ul ul ul{top:-10px; width:150px;}


/* make the second level visible when hover on first level list OR link */
.menu ul :hover ul {visibility:visible; height:auto; background:url('images/sub_top.gif') no-repeat 30px 0; left:90px; padding-left:30px; padding-right:30px; padding-top:10px; padding-bottom:30px}
.menu ul :hover ul.left {visibility:visible; height:auto; background:url('images/sub_top.gif') no-repeat 30px 0; left:-55px; padding-left:30px; padding-right:30px; padding-top:10px; padding-bottom:30px}

/* keep the third level hidden when you hover on first level list OR link */
.menu ul :hover ul ul{visibility:hidden;}
/* keep the fourth level hidden when you hover on second level list OR link */
.menu ul :hover ul :hover ul ul{visibility:hidden;}
/* make the third level visible when you hover over second level list OR link */
.menu ul :hover ul :hover ul{visibility:visible; left:90px; height:auto; background:url('images/two_top.gif') no-repeat 30px 0;; padding-left:30px; padding-right:30px; padding-top:10px; padding-bottom:30px}
.menu ul :hover ul.left :hover ul {left:-150px;}
/* make the fourth level visible when you hover over third level list OR link */
.menu ul :hover ul :hover ul :hover ul {visibility:visible; left:90px; height:auto; background:url('images/three_top.gif') no-repeat 30px 0;; padding-left:30px; padding-right:30px; padding-top:10px; padding-bottom:30px}
 

/* default styles */
   
a {	color: #414141; background: inherit; text-decoration : underline; }
a:hover { color: #252A6D; background: inherit; text-decoration : none; }

p {	margin: 0 0 5px 0; }

ul { margin: 0; padding : 0; list-style : none; }

form { margin: 0; }

input.search { 
	width: 300px;
	height: 24px;
	border: 0;
	background: url(images/input.gif) no-repeat;
	color: #E0691A;
	font-weight: bold;
	margin: 0;
	padding: 0; 
}

input.submit {
	background: url(images/submit.gif) no-repeat;
	border: 0;
	width: 65px;
	height: 24px;	
	color: #FFF;
	font-weight: bold;
	margin: 0;
	padding: 0; 
}

.search_field { 
	color: #808080;
	clear: both;
	padding: 0;
	margin: 5px 0 0 0;
	font-weight: bold;	
}

/* layout */

.float_right { float: right; }

.content { 
	margin: 0px auto;
	width: 900px;
	padding: 0; 
}

.header { 
	width: 900px;
	height: 61px;
	background: #eee url('images/logo.gif') no-repeat center center;
	margin: 5px 0;
	border-bottom: 1px solid #ccc;
}

	.logo {
		float: right;
	    margin: 5px 0;
	    padding:4px 0;
	}

.bar { 
	clear: both;
	height: 25px; 
	margin: 0 0 0 0px; 
	background: #FF9148;
}

/* left side */

.left {
	float: left;
	width: 122px;
	margin: 0 0 0 0;
	padding: 0 0 0 0; 
}

/* mid side */

.mid {
	float: left;
	width: 513px;
	margin: 0;
	padding: 0 10px 0 10px; 
}

.mid_image {
	float: left;
	margin: 0 0 0 0;
	padding: 0 20px 0 10px; 
}

.mid h3 {
	clear: both;
	background: #A9C0CE url('images/corner.gif') no-repeat top right;
	color: #FFF;
	font-style:normal; font-variant:normal; font-weight:bold; font-size:12px; font-family: 宋体,Arial; 
	margin:10px 0; 
	padding:0px 0px 0px 15px;
}

	.mid_articles { 
		margin: 15px 0 15px 0;
		padding: 0 0 0 0; 
	}

	.left_side {
	    clear: both;	
		float: left;
		width: 48%;
		padding: 0 0 0 0;
		margin: 0;
	}
	
    .left_side h3 {
	    clear: both;
	    background: #A9C0CE url('images/corner.gif') no-repeat top right;
		color: #FFF;
		font-style:normal; font-variant:normal; font-weight:bold; font-size:12px; font-family: 宋体,Arial; 
		margin:10px 0; 
		padding:0px 0px 0px 15px;
    }	
		
	.right_side {
	    clear: both;
		float: right;
		width: 48%;
		background: #fff url('images/line-grey.gif') repeat-y;
		margin: 0; 
		padding: 0 0 0 10px;

	}

    .right_side h3 {
	    clear: both;
	    background: #A9C0CE url('images/corner.gif') no-repeat top right;
		color: #FFF;
		font-style:normal; font-variant:normal; font-weight:bold; font-size:12px; font-family: 宋体,Arial;
		margin:10px 0; 
		padding:0px 0px 0px 15px;
    }
    
/* right side */
		
.right {
	float: right;
	width: 245px;
	margin: 0 0 0 0;
	padding: 0 0 0 0; 
}

.right_image {
	float: top;
	margin: 0 0 0 0;
	padding: 0 0 0 0; 
}

.right h3 {
	clear: both;
	background: #6C757A url('images/corner.gif') no-repeat top right;
	color: #FFF;
	font-style:normal; font-variant:normal; font-weight:bold; font-size:12px; font-family: 宋体,Arial; 
	margin:5px 0; 
	padding:5px 0 5px 15px;
}

	.right_articles {
		color: inherit;
		margin: 0 0 5px 0;
		padding: 8px; 
	}
	
/* footer */

.footer { 
	clear: both;
	text-align: center;
	padding: 10px 0 10px 0;
	margin: 0;
	border-top: 1px solid #ccc;
}

.footer a { color: #808080; background: #fff; }