/*
============================================================================
门户结构和样式 - -  上演一幕幕的穿插和组合的代码演义...值得一战
============================================================================
*/


/*
===================
门户基础框架结构
===================
*/

/*框架套框架，他们需要有距离，不能太亲密无间*/
.design_layout_style .design_layout_style{
	margin:1px;
}
/*内容区域*/
.design_layout_ct{
	zoom:1;
}
.design_layout_ct:after{
	content:'\20';
	display:block;
	height:0;
	clear:both;
	visibility: hidden;
}
/*模块的样式需要有一定的空间来呼吸新鲜空气*/
.design_layout_ct .tmode_list{
	padding:5px 10px 7px;
}

/*
===================
门户结构组合
>>	1				design_layout_1
>>	1:1			design_layout_1_1
>>	1:2			design_layout_1_2
>>	1:3			design_layout_1_3
>>	2:1			design_layout_2_1
>>	3:1			design_layout_3_1
>>	3:2			design_layout_3_2
>>	2:3			design_layout_2_3
>>	1:1:1			design_layout_3_1
>>	1:1:1:1			design_layout_1111
>>	2:3:3			design_layout_233
>>	3:3:2			design_layout_332
>>	1:4:3			design_layout_143
>>	3:4:1			design_layout_341
>>	tab
===================
*/
/*1:1*/
.design_layout_1_1{
}
.design_layout_1_1 .design_layout_1_1_left{
	float:left;
	width:49.9%;
	min-height:40px;
}
.design_layout_1_1 .design_layout_1_1_right{
	float:right;
	width:49.9%;
	min-height:40px;
}
/*1:2*/
.design_layout_1_2 .design_layout_1_2_left{
	float:left;
	width:33.3%;
	min-height:40px;
}
.design_layout_1_2 .design_layout_1_2_right{
	float:right;
	width:66.6%;
	min-height:40px;
}
/*2:1*/
.design_layout_2_1 .design_layout_2_1_left{
	float:left;
	width:66.6%;
	min-height:40px;
}
.design_layout_2_1 .design_layout_2_1_right{
	float:right;
	width:33.3%;
	min-height:40px;
}
/*1:3*/
.design_layout_1_3 .design_layout_1_3_left{
	float:left;
	width:24.9%;
	min-height:40px;
}
.design_layout_1_3 .design_layout_1_3_right{
	float:right;
	width:74.9%;
	min-height:40px;
}
/*3:1*/
.design_layout_3_1 .design_layout_3_1_left{
	float:left;
	width:74.9%;
	min-height:40px;
}
.design_layout_3_1 .design_layout_3_1_right{
	float:right;
	width:24.9%;
	min-height:40px;
}
/*2:3*/
.design_layout_2_3 .design_layout_2_3_left{
	float:left;
	width:39.5%;
	min-height:40px;
}
.design_layout_2_3 .design_layout_2_3_right{
	float:right;
	width:60%;
	min-height:40px;
}
/*3:2*/
.design_layout_3_2 .design_layout_3_2_left{
	float:left;
	width:60%;
	min-height:40px;
}
.design_layout_3_2 .design_layout_3_2_right{
	float:right;
	width:39.5%;
	min-height:40px;
}
/*1:1:1*/
.design_layout_1_1_1 .design_layout_1_1_1_left{
	float:left;
	width:33.3%;
	min-height:40px;
}
.design_layout_1_1_1 .design_layout_1_1_1_cont{
	float:left;
	width:33.3%;
	min-height:40px;
}
.design_layout_1_1_1 .design_layout_1_1_1_right{
	float:right;
	width:33.3%;
	min-height:40px;
}
/*1:1:1:1*/
.design_layout_1111 .design_layout_1111_left{
	float:left;
	width:25%;
	min-height:40px;
}
.design_layout_1111 .design_layout_1111_right{
	float:right;
	width:25%;
	*width:24.98%;
	min-height:40px;
}

/*2:3:3*/
.design_layout_233 .design_layout_233_left{
	float:left;
	width:25%;
	min-height:40px;
}
.design_layout_233 .design_layout_233_cont{
	float:left;
	width:37.5%;
	min-height:40px;
}
.design_layout_233 .design_layout_233_right{
	float:right;
	width:37.5%;
	_width:37.49%;
	min-height:40px;
}

/*3:3:2*/
.design_layout_332 .design_layout_332_left{
	float:left;
	width:37.5%;
	_width:37.49%;
	min-height:40px;
}
.design_layout_332 .design_layout_332_cont{
	float:left;
	width:37.5%;
	min-height:40px;
}
.design_layout_332 .design_layout_332_right{
	float:right;
	width:25%;
	min-height:40px;
}

/*1:4:3*/
.design_layout_143 .design_layout_143_left{
	float:left;
	width:12.5%;
	min-height:40px;
}
.design_layout_143 .design_layout_143_cont{
	float:left;
	width:50%;
	min-height:40px;
}
.design_layout_143 .design_layout_143_right{
	float:right;
	width:37.5%;
	_width:37.49%;
	min-height:40px;
}

/*3:4:1*/
.design_layout_341 .design_layout_341_left{
	float:left;
	width:37.5%;
	_width:37.49%;
	min-height:40px;
}
.design_layout_341 .design_layout_341_cont{
	float:left;
	width:50%;
	min-height:40px;
}
.design_layout_341 .design_layout_341_right{
	float:right;
	width:12.5%;
	min-height:40px;
}

/*tab形式*/
.design_layout_tab{
	position:relative;
	height:18px;
}
.design_layout_tab ul{
	position:absolute;
	bottom:-1px;
}
.design_layout_tab li{
	float:left;
}
.design_layout_tab li a{
	display:block;
	float:left;
	color:#333;
	font-size:12px;
	padding:3px 10px 3px;
}
.design_layout_tab li.current a{
	background:#fff;
	position:relative;
	color:#333;
}

/*
===================
门户和模块的框架样式列表
>> 七彩的，你值得拥有
===================
*/
.box_wrap .design_layout_hd{
	padding:7px 10px;
	border-bottom:1px solid #e4e4e4;
}
.box_wrap .design_layout_hd ul{
	margin-top:-1px;
}
.box_wrap .design_layout_hd li.current a{
	border:1px solid #e4e4e4;
	border-bottom:0 none;
}
.design_tmode_h2,
.design_layout_hd{
	background:url(../../images/design/mode_h_bg.png) 999em 999em;
	font-size:12px;
	font-weight:100;
	padding:5px 10px 0;
}
/*灰色*/
.mod_boxA,
.layout_boxA{
	border:1px solid #e0e0e0;
	background:#fff;
	margin-bottom:15px;
}
.mod_boxA .design_tmode_h2,
.layout_boxA .design_layout_hd{
	color:#333;
	border-bottom:1px solid #e0e0e0;
	background-color:#eeeeee;
	background-position:0 -60px;
	padding-bottom:5px;
}
.layout_boxA .design_layout_hd ul{
	margin-top:-1px;
}
.layout_boxA .design_layout_hd li.current a{
	border:1px solid #e0e0e0;
	border-bottom:0 none;
}
/*浅蓝*/
.mod_boxB,
.layout_boxB{
	border:1px solid #bdd7f2;
	background:#fff;
	margin-bottom:15px;
}
.mod_boxB .design_tmode_h2,
.layout_boxB .design_layout_hd{
	background-position:0 -120px;
	color:#4c9dd1;
	padding-top:9px;
	padding-bottom:2px;
	background-repeat:no-repeat;
}
.layout_boxB .design_layout_hd li a{
	padding:2px 10px;
}
.layout_boxB .design_layout_hd li.current a{
	background:#4c9dd1;
	border-radius:3px;
	color:#fff;
}
/*红色*/
.mod_boxC,
.layout_boxC{
	border:1px solid #c22929;
	background:#fff;
	margin-bottom:15px;
}
.mod_boxC .design_tmode_h2,
.layout_boxC .design_layout_hd{
	color:#fff;
	border-bottom:1px solid #c22929;
	background-color:#c53131;
	background-position:0 -180px;
	padding-bottom:5px;
}
/*橙色*/
.mod_boxD,
.layout_boxD{
	border:1px solid #ec7601;
	background:#fff;
	margin-bottom:15px;
}
.mod_boxD .design_tmode_h2,
.layout_boxD .design_layout_hd{
	color:#fff;
	border-bottom:1px solid #cb7d09;
	background-color:#ec7601;
	background-position:0 -240px;
	padding-bottom:5px;
}
/*黄色*/
.mod_boxE,
.layout_boxE{
	border:1px solid #a39c00;
	background:#fff;
	margin-bottom:15px;
}
.mod_boxE .design_tmode_h2,
.layout_boxE .design_layout_hd{
	color:#fff;
	border-bottom:1px solid #a39c00;
	background-color:#aaa300;
	background-position:0 -300px;
	padding-bottom:5px;
}
/*绿色*/
.mod_boxF,
.layout_boxF{
	border:1px solid #6bad01;
	background:#fff;
	margin-bottom:15px;
}
.mod_boxF .design_tmode_h2,
.layout_boxF .design_layout_hd{
	color:#fff;
	border-bottom:1px solid #6bad01;
	background-color:#7bac00;
	background-position:0 -360px;
	padding-bottom:5px;
}
/*青色*/
.mod_boxG,
.layout_boxG{
	border:1px solid #2cb7ae;
	background:#fff;
	margin-bottom:15px;
}
.mod_boxG .design_tmode_h2,
.layout_boxG .design_layout_hd{
	color:#fff;
	border-bottom:1px solid #2cb7ae;
	background-color:#39bdb4;
	background-position:0 -420px;
	padding-bottom:5px;
}
/*蓝色*/
.mod_boxH,
.layout_boxH{
	border:1px solid #0f75a4;
	background:#fff;
	margin-bottom:15px;
}
.mod_boxH .design_tmode_h2,
.layout_boxH .design_layout_hd{
	color:#fff;
	border-bottom:1px solid #0c497c;
	background-color:#3776bf;
	background-position:0 -480px;
	padding-bottom:5px;
}
/*紫色*/
.mod_boxI,
.layout_boxI{
	border:1px solid #4d5e96;
	background:#fff;
	margin-bottom:15px;
}
.mod_boxI .design_tmode_h2,
.layout_boxI .design_layout_hd{
	color:#fff;
	border-bottom:1px solid #4d5e96;
	background-color:#58689e;
	background-position:0 -540px;
	padding-bottom:5px;
}

/*默认标题连接颜色*/
.mod_boxC .design_tmode_h2 a,
.layout_boxC .design_layout_hd a,
.mod_boxD .design_tmode_h2 a,
.layout_boxD .design_layout_hd a,
.mod_boxE .design_tmode_h2 a,
.layout_boxE .design_layout_hd a,
.mod_boxF .design_tmode_h2 a,
.layout_boxF .design_layout_hd a,
.mod_boxG .design_tmode_h2 a,
.layout_boxG .design_layout_hd a,
.mod_boxH .design_tmode_h2 a,
.layout_boxH .design_layout_hd a,
.mod_boxI .design_tmode_h2 a,
.layout_boxI .design_layout_hd a{
	color:#fff;
}

/*模块连接颜色*/
.mod_box li a{
	color:#333;
}
.layout_boxA .mod_box,
.layout_boxB .mod_box,
.layout_boxC .mod_box,
.layout_boxD .mod_box,
.layout_boxE .mod_box,
.layout_boxF .mod_box,
.layout_boxG .mod_box,
.layout_boxH .mod_box,
.layout_boxI .mod_box{
	margin:0;
}
/*模块图片清楚多余高度*/
.mod_box img{
	vertical-align:top;
}

/*
===================
门户模块样式
>>【系统】帖子列表
>>【系统】用户列表
>>【系统】版块列表
>>【系统】标签列表
>>【系统】友情链接
===================
*/
.tmode_list li{
	line-height:24px;
	height:24px;
	overflow:hidden;
}
.tmode_list li .time{
	float:right;
	color:#666;
	padding-left:10px;
	white-space:nowrap;
}
/*无序*/
.tmode_list_light li a{
	padding-left:10px;
	background:url(../../images/design/light.png) 0 6px no-repeat;
}
/*有序*/
.tmode_list_sort ul{
	background:url(../../images/design/sort.png) 0 8px no-repeat;
}
.tmode_list_sort ul li{
	padding-left:18px;
}
/*热点*/
.tmode_hot dl{
	padding:5px 0 8px;
}
.tmode_hot dt{
	text-align:center;
	line-height:30px;
	height:35px;
}
.tmode_hot dt a{
	color:#000;
	font-size:22px;
	font-family:"Microsoft Yahei";
	font-weight:400;
}
.tmode_hot dd{
	color:#666;
}
/*图文*/
.tmode_imglist{
	overflow:hidden;
	padding:4px 0 5px;
}
.tmode_imglist dl{
	padding:7px 8px 7px 10px;
}
.tmode_imglist dt{
	float:left;
	margin-right:10px;
	_margin-right:5px;
}
.tmode_imglist dt img{
	vertical-align:top;
}
.tmode_imglist dd{
	overflow:hidden;
	color:#666;
}
.tmode_imglist dd a{
	display:block;
	color:#333;
	margin-bottom:3px;
	font-weight:700;
}

/*
===================
门户-【系统】帖子组图
门户-【系统】标签组图
===================
*/
.tmode_imgGroup{
	overflow:hidden;
	min-height:20px;
}
.tmode_imgGroup ul{
	overflow:hidden;
}
.tmode_imgGroup li{
	float:left;
}
.tmode_imgGroup li a{
	float:left;
	color:#fff;
	background:#ccc;
	position:relative;
}
.tmode_imgGroup li a:hover{
	text-decoration:none;
}
.tmode_imgGroup li em{
	position:absolute;
	left:0;
	height:24px;
	line-height:24px;
	overflow:hidden;
	width:100%;
	bottom:0;
	_bottom:-1px;
}
.tmode_imgGroup li strong{
	font-weight:100;
	position:relative;
	z-index:1;
	height:24px;
	line-height:24px;
	overflow:hidden;
	display:block;
	cursor:pointer;
	padding:0 9px;
}
.tmode_imgGroup li span{
	position:absolute;
	background:#000;
	width:100%;
	height:24px;
	top:0;
	left:0;
	filter:alpha(opacity=60);
	opacity:0.6;
	-webkit-transition: all 0.2s ease-out;
	transition: all 0.2s ease-out;
}
.tmode_imgGroup li a:hover span{
	filter:alpha(opacity=90);
	opacity:0.9;
}
/*有间隙*/
.tmode_tagFront ul{
	margin-left:-6px;
}
.tmode_tagFront li{
	padding:0 0 5px 5px;
	width:156px;
}
.tmode_tagFront li em{
	width:auto;
	bottom:5px;
	_bottom:0;
}

/*
===================
门户-【系统】版块列表[横向]
门户-【系统】用户列表[横向]
门户-【系统】标签列表[横向]
门户-【系统】友情链接[横向]
===================
*/
.tmode_traverseList{
	padding:5px 10px 5px 0;
}
.tmode_traverseList li{
	float:left;
	padding:5px 0 5px 10px;
	white-space:nowrap;
}

/*
===================
门户-【系统】用户列表[带头像]
===================
*/
.tmode_faceList{
	background:url(../../images/design/li_bg_50.png);
}
.tmode_faceList ul{
}
.tmode_faceList li{
	padding:10px;
	height:30px;
	line-height:30px;
}
.tmode_faceList li .time{
	float:right;
	color:#666;
	white-space:nowrap;
	background:#f7f7f7;
	padding:0 10px;
	border-radius:8px;
	margin-top:6px;
	line-height:18px;
}
.tmode_faceList li img{
	float:left;
	margin-right:5px;
}
.tmode_faceList li.li_bg .time{
	background:#fff;
}
/*有序*/
.tmode_faceList_sort ul{
	background:url(../../images/design/sort_50.png) 10px 15px no-repeat;
}
.tmode_faceList_sort ul li{
	padding-left:30px;
}
/*
===================
门户-【系统】用户列表[横向+头像]
===================
*/
.tmode_userList{
	padding:0 10px 10px 0;
}
.tmode_userList li{
	float:left;
	width:50px;
	padding:10px 0 0 10px;
}
.tmode_userList li img{
	display:block;
	margin-bottom:5px;
}
.tmode_userList li span{
	display:block;
	line-height:18px;
	height:18px;
	overflow:hidden;
	text-align:center;
}
/*
===================
门户-【系统】帖子列表[瀑布流]
===================
*/
.tmode_waterfall{
	border:1px solid #dddddd;
	width:228px;
	background:#fff;
	box-shadow:0 1px 2px rgba(0,0,0,0.08);
	margin-bottom:10px;
	padding-top:15px;
}
.tmode_waterfall .img{
	display:block;
	width:200px;
	margin:0 auto 10px;
}
.tmode_waterfall .img img{
	vertical-align:top;
	width:200px;
}
.tmode_waterfall .title{
	font-size:14px;
	font-weight:700;
	padding:0 14px 5px;
}
.tmode_waterfall .title a{
	color:#333;
}
.tmode_waterfall .descrip{
	padding:0 14px 10px;
	line-height:1.6;
	color:#666;
}
.tmode_waterfall .descrip a{
	color:#333;
}
.tmode_waterfall .user{
	padding:0 15px 15px;
	height:30px;
	overflow:hidden;
	line-height:normal;
	color:#999;
	line-height:30px;
}
.tmode_waterfall .user img{
	float:left;
	margin-right:8px;
}
.tmode_waterfall .user a{
	color:#333;
	margin-right:10px;
}
.tmode_waterfall .num{
	padding:10px 0 10px 15px;
	background:#fbfbf9;
	border-top:1px solid #e7e7e7;
	text-align:right;
}
.tmode_waterfall .num span{
	background-position:0 -478px;
	display:inline-block;
	padding:0 15px 0 18px;
}
.tmode_waterfall .num span.icon_like{
	background-position:0 -499px;
	padding-left:20px;
}

/*
===================
门户-搜索模块
===================
*/
.design_layout_search{
	width:100%;
	height:33px;
	position:relative;
	padding:0;
	background:#fff;
}
.design_layout_search div{
	_display:inline;
	height:27px;
	margin:3px 37px 3px 8px;
}
.design_layout_search input{
	padding:5px 0;
	border:0 none;
	margin:0;
	width:100%;
	height:18px;
}
.design_layout_search input:focus{
	outline:0 none;
}
.design_layout_search button{
	position:absolute;
	right:0;
	top:0;
	border:0 none;
	padding:0;
	background:#fff;
	width:30px;
	height:33px;
	cursor:pointer;
}
.design_layout_search button span{
	width:20px;
	height:20px;
	display:inline;
	font:0/0 Arial;
	overflow:hidden;
	padding:0;
	margin:0 0 0;
	background-position:0 -530px;
	float:left;
	text-indent:-2000em;
	cursor:pointer;
}