@charset "utf-8";
/* CSS Document */

/* Button List*/
.list_btn{ height: 100%; overflow: hidden;}
.list_btn .btn_sgrey, .list_btn .btn_sblue{ float: left; margin-right: 5px;}

/* Button style*/
.btn_sgrey{
	background: transparent url(../images/btn_sgrey.png) top left no-repeat;
	display: block;
	height: 15px;
	text-decoration: none;
	font-size: 9px;
	padding-left: 6px;
}
.btn_sgrey span{ 
	background: transparent url(../images/btn_sgrey.png) right bottom no-repeat;
	height: 14px;
	padding: 1px 6px 0px 0px;
	display: block;
	float: left;
	color:#fff;
}

.btn_sblue{
	background: transparent url(../images/btn_sblue.png) top left no-repeat;
	display: block;
	height: 15px;
	text-decoration: none;
	font-size: 9px;
	padding-left: 6px;
}
.btn_sblue span{ 
	background: transparent url(../images/btn_sblue.png) right bottom no-repeat;
	height: 14px;
	padding: 1px 6px 0px 0px;
	display: block;
	float: left;
	color:#fff;
}

.btn_blue{
	background: transparent url(../images/btn_blue.png) top left no-repeat;
	display: block;
	height: 20px;
	text-decoration: none;
	font-size: 11px;
	padding-left: 8px;
}
.btn_blue span{ 
	background: transparent url(../images/btn_blue.png) right bottom no-repeat;
	height: 18px;
	padding: 2px 8px 0px 0px;
	display: block;
	float: left;
	color:#fff;
}


/* Box style*/
.box{ margin-top: 15px; clear: both; height: 100%; overflow: hidden}
.box .boxhead{} 
.box .rdbox{ margin-top: 1px; clear: left}
.box .rdbox_blue{ margin-top: 1px;  clear: left}

/* Box Head*/

.boxhead, .boxhead1{ 
	font-family:Georgia, "Times New Roman", Times, serif; 
	font-size: 10px; 
	font-weight: bold;
	color: #fff;
	background: url(../images/bg_title_blk.png) top left no-repeat;
	height: 22px;
}
.boxhead span, .boxhead1 span{ 
	background: url(../images/bg_title_blk.png) right -22px no-repeat;
	margin-left: 10px;
	padding-right: 10px;
	display: block;
	height: 18px;
	padding: 4px 10px 0px 0px;
}

.boxhead1 span{ 
	float: left;
}
/* Round Box style*/
.rdbox_greybg{ 
	clear: both;
	border: 1px solid #999; 
	position: relative;
	background-color: #ccc;
	margin-top: 1px;	
}
.rdbox_greybg .tl	{ position: absolute; width: 8px; height: 8px; background: url(../images/bg_rdcnr_bggrey.gif) top left no-repeat; top: -1px; left: -1px; }
.rdbox_greybg .tr	{ position: absolute; width: 8px; height: 8px; background: url(../images/bg_rdcnr_bggrey.gif) top right no-repeat; top: -1px; right: -1px; }
.rdbox_greybg .bl	{ position: absolute; width: 8px; height: 9px; background: url(../images/bg_rdcnr_bggrey.gif) left -8px no-repeat; bottom: -1px; left: -1px; }
.rdbox_greybg .br	{ position: absolute; width: 8px; height: 8px; background: url(../images/bg_rdcnr_bggrey.gif) right -8px no-repeat; bottom: -1px; right: -1px;}
.rdbox_greybg .inside{ margin-top: 5px; }


/* Round Box style*/
.rdbox{ 
	clear: both;
	background:  #fff url(../images/arr_bldown.gif) 10px 0px no-repeat;
	border: 1px solid #ccc; 
	position: relative;
	
}
.rdbox1{ 
	border: 1px solid #ccc; 
	position: relative;
}
.rdbox .tl, .rdbox1 .tl		{ position: absolute; width: 8px; height: 8px; background: url(../images/bg_rdcnr_bdrgrey.gif) top left no-repeat; top: -1px; left: -1px; }
.rdbox .tr, .rdbox1 .tr		{ position: absolute; width: 8px; height: 8px; background: url(../images/bg_rdcnr_bdrgrey.gif) top right no-repeat; top: -1px; right: -1px; }
.rdbox .bl, .rdbox1 .bl		{ position: absolute; width: 8px; height: 8px; background: url(../images/bg_rdcnr_bdrgrey.gif) left -8px no-repeat; bottom: -1px; left: -1px; }
.rdbox .br, .rdbox1 .br		{ position: absolute; width: 8px; height: 8px; background: url(../images/bg_rdcnr_bdrgrey.gif) right -8px no-repeat; bottom: -1px; right: -1px;}
.rdbox .inside, .rdbox1 .inside	{ padding: 10px; margin-top: 5px; height: 100%; overflow: hidden}
.rdbox1 .inside1{ padding: 5px; height: 100%; overflow: hidden}
/* Round Blue Box style*/
.rdbox_blue{ 
	clear: both;
	background-color: #036; 
	position: relative;
	height: 100%;
	overflow: hidden;
	float: left;
}
.rdbox_blue .tl		{ position: absolute; width: 8px; height: 8px; background: url(../images/bg_rdcnr_blue.gif) top left no-repeat; top: 0px; left: 0px; }
.rdbox_blue .tr		{ position: absolute; width: 8px; height: 8px; background: url(../images/bg_rdcnr_blue.gif) top right no-repeat; top: 0px; right: 0px; }
.rdbox_blue .bl		{ position: absolute; width: 8px; height: 8px; background: url(../images/bg_rdcnr_blue.gif) left -8px no-repeat; bottom: 0px; left: 0px; }
.rdbox_blue .br		{ position: absolute; width: 8px; height: 8px; background: url(../images/bg_rdcnr_blue.gif) right -8px no-repeat; bottom: 0px; right: 0px; }
.rdbox_blue .inside	{ padding: 10px; height: 100%; overflow: hidden; float: left;}

/* Avatar*/
.avatar40{
	width: 40px;
	height:40px;
	border: 1px solid #666;
	overflow: hidden;
}
.avatar40 img{}

.avatar20{
	width: 20px;
	height:20px;
	border: 1px solid #666;
	overflow: hidden;
}
.avatar20 img{}


.comments{
	height: 100%; 
	overflow: hidden;
	clear: both;
}

/* Comments Box */
.comments .listComments{ clear: both; width: 560px;}
.comments h6{ font-size: 10px; margin-bottom: 5px; width: 200px;}
.comments h6 span{ font-weight: none;}
.comments .com_paging{ float: right}
.comments .listComments li{ clear: left; padding: 7px; height: 100%; overflow: hidden}
.comments .listComments .comment_left{ width: 40px; float: left; margin-right: 15px;}
.comments .listComments .comment_left .name{ font-weight: bold; color: #666; font-size: 9px; text-decoration: none; width: 40px; height: 11px; overflow: hidden; display: block}
.comments .listComments .comment_left .name:hover{text-decoration: underline;}
.comments .listComments	.inputCom{ width: 470px; }
.comments .listComments	.rdbox1{ float:left; position: relative;}
.comments .listComments	.rdbox1 .bg_talk{ width: 10px; height: 22px; background: url(../images/bg_talk.gif) top left no-repeat; position: absolute; top: 10px; left: -10px;}
.comments .listComments	.rdbox1 .inside1{ padding-left: 10px;}
.comments .listComments	.inputCom .com_detail{ color: #666; font-size: 9px; margin-top: 5px; border-top: 1px solid #f0f0f0; padding-top: 3px;}
.comments .listComments	.inputCom .com_detail a{ float: left; margin-right: 5px;}
.comments .listComments	.inputCom .com_detail .time{ margin-bottom: 3px; float: left; margin-right: 5px;}

.comments .addComment{ width: 460px; background: #e4e4e4; padding-bottom:10px; padding: 5px; height: 100%; overflow: hidden}
.comments .addComment textarea{
	font-family: Verdana, Geneva, sans-serif;
	font-size: 11px;
	float: left;
	border: 1px solid #fff; 
	width: 316px;
	height: 80px;
	border:0;
	overflow:auto	
}
.comments .addComment textarea span{ color: #999}
.comments .addComment .avatar40{ float: left}
.comments .addComment input{ float: right}
.comments .addComment .inputCom{ background: #fff; border: 1px solid #ccc; width: 410px; height: 85px; float: left; margin-left: 5px;}
.comments .addComment .btn_comment{ background: #f0f0f0; padding: 25px 5px;  height: 35px; width: 80px; float: right}

/* search*/
.search{}
.search .search_name{ float: left;}
.search .search_name input{ width:200px;}
.search .form{ float: left; margin-left: 5px;}

/* List viewed*/
.list_viewed{}
.list_viewed li{ float: left; margin-right: 5px; margin-bottom: 5px;}
.list_viewed li .name{ width: 40px; height: 12px; overflow: hidden; font-size: 10px; }
.list_viewed li .name a{ text-decoration: none}
.list_viewed li .name a:hover{ text-decoration: underline}

/*Friends messages*/
.friendsAdd{ margin-top: 5px; border-bottom: 1px solid #ccc; padding-bottom: 5px; height: 100%; overflow: hidden;}
.friendsAdd h6{ font-size: 10px;  margin-bottom: 10px; color: #0b8dc6}
.friendsAdd .list_add{}

.friendsInvite{}
.friendsInvite h6{ font-size: 10px;  margin-bottom: 10px; color: #0b8dc6}
.friendsInvite .list_add{}

/* list add*/
.list_add{}
.list_add li{ clear: both; margin-bottom: 10px; height: 100%; overflow: hidden}

.list_add .avatar40{ float: left}

.list_add .name a{ text-decoration: none}
.list_add .name a:hover{ text-decoration: underline;}

.list_add .info{ float: left; margin-left: 7px;}
.list_add .info .textc{ font-size: 10px;}
.list_add .list_btn{ margin-top: 3px;}


/* Contest List*/
#contest{  margin: auto; width: 955px; height: 100%; overflow: hidden; margin-left: 10px}
.rightContest{ float: left; width:255px; margin-left: 10px}
.leftContest{ width: 685px; float:left;}
#contest .contentContest h4{ margin: 20px 0px 10px 0px;}
#contest .contentContest{ margin-left: 10px; margin-top: 15px; float: left;}

.conList{ clear: both; height: 100%; overflow: hidden}
.conList li{ width: 110px; float: left; height: 100%; overflow: hidden; margin: 0px 15px 20px 0px}

.vote{  color: #fff;  background-color: #F30; }
.vote .nvotes{ font-size: 14px; font-weight: bold; text-align: center; padding: 2px 0px 0px 0px; background-color: #F30; display: block; }
.vote .nvotes span{ font-weight: normal; font-size: 11px; margin-left: 3px;}


.conList li .vote{  color: #fff; }
.conList li .vote .nvotes{ font-size: 14px; font-weight: bold; text-align: center; padding: 2px 0px 0px 0px; background: #F30; display: block; }
.conList li .vote .nvotes span{ font-weight: normal; font-size: 11px; margin-left: 3px;}
.conList li .vote a{ 
	display: block; 
	text-align: center;
	background: url(../images/btn_vote1.png) top left no-repeat;
	width: 110px;
	height: 20px;
	margin-bottom: 2px;
}
.conList li .vote a span{ display: none;}

.conList li .detail{ background: none;}
.conList li .detail a{ text-decoration: none;}
.conList li .detail a:hover{ text-decoration: underline;}
.conList li .detail span{ display: block;}

.conList li .photo, .conList li .video, .conList li .note{ width: 110px; height: 80px; overflow: hidden; position: relative;}
.conList li .photo a, .conList li .video a, .conList li .note a{ text-decoration: none; color:auto;}
.conList li .photo span, .conList li .video span{ display:block; }
.conList li .photo .caption, .conList li .video .caption{ 
	color: #fff; 
	text-decoration: none; 
	background: url(../images/bg_transblk.png) top left repeat; 
	overflow: hidden;
	padding: 0px 3px;
	position: absolute; 
	bottom: 0px; 
	left:0px;  
	font-size: 10px;
	font-weight: normal; 
	display: block;
	width: 110px;
	height: 13px;
	overflow: hidden;
}
.conList li .photo .caption a, .conList li .video .caption a{ text-decoration: none; color: #fff;}

.points{}
.points a{ padding-top: 3px; }


/*Images size Sp*/
.image{ padding: 1px; border: 1px solid #ccc;}

.imageSp{
	width: 310px;
	background: url(../images/bg_imgL.png) left top no-repeat;
	padding-top: 5px;
}
.imageSp span{
	background:url(../images/bg_imgL.png) -310px bottom no-repeat;
	display: block;
	text-align:center;
	height: 100%;
	overflow: hidden;
	padding-bottom: 31px;
	position:relative
}
.imageSp span img{ border-left: 1px solid #ccc; border-right: 1px solid #ccc; padding: 0px 5px}
.imageSp .glossy{
	background: url(../images/bg_glossy.png) bottom left repeat-x;
	width: 299px;
	height: 45px;
	position: absolute;
	left: 5px;
	bottom: 25px;
}

/*Images size L*/
.image{ padding: 1px; border: 1px solid #ccc;}

.imageL{
	width: 310px;
	background: url(../images/bg_imgL.png) left top no-repeat;
	padding-top: 5px;
}
.imageL span{
	background:url(../images/bg_imgL.png) -310px bottom no-repeat;
	display: block;
	text-align:center;
	height: 100%;
	overflow: hidden;
	padding-bottom: 31px;
	position:relative
}
.imageL span img{ border-left: 1px solid #ccc; border-right: 1px solid #ccc; padding: 0px 5px}
.imageL .glossy{
	background: url(../images/bg_glossy.png) bottom left repeat-x;
	width: 299px;
	height: 45px;
	position: absolute;
	left: 5px;
	bottom: 25px;
}
/*Images size M*/
.imageM{
	width: 210px;
	background: url(../images/bg_imgM.png) left top no-repeat;
	padding-top: 5px;
}
.imageM span{
	background:url(../images/bg_imgM.png) -210px bottom no-repeat;
	display: block;
	text-align:center;
	height: 100%;
	overflow: hidden;
	padding-bottom: 24px;
}
.imageM span img{ border-left: 1px solid #ccc; border-right: 1px solid #ccc; padding: 0px 4px}

/*Images size S*/
.imageS{
	width: 180px;
	background: url(../images/bg_imgS.png) left top no-repeat;
	padding-top: 4px;
}
.imageS span{
	background:url(../images/bg_imgS.png) -180px bottom no-repeat;
	display: block;
	text-align:center;
	height: 100%;
	overflow: hidden;
	padding-bottom: 22px;
}
.imageS span img{ border-left: 1px solid #ccc; border-right: 1px solid #ccc; padding: 0px 4px}

/*Images size S*/
.imageXS{
	width: 150px;
	background: url(../images/bg_imgXS.png) left top no-repeat;
	padding-top: 4px;
}
.imageXS span{
	background:url(../images/bg_imgXS.png) -150px bottom no-repeat;
	display: block;
	text-align:center;
	height: 100%;
	overflow: hidden;
	padding-bottom: 20px;
}
.imageXS span img{ border-left: 1px solid #ccc; border-right: 1px solid #ccc; padding: 0px 4px}

.videoM{
	width: 200px;
}
.videoM span{background: url(../images/bg_imgS.png) -180px bottom no-repeat; padding-bottom: 16px;}
.videoM embed{ border: 1px solid #ccc}
.videoM object, .videoM embed{ width: 200px; height: 162px;}

.contribute .avatar20{ float: right}
.contribute .name{ 
	float: right; margin-right: 3px; font-size: 9px; color: #666; text-align: right;
}
.contribute .name a{ display: block; margin-top: 0px; height:10px; color: #666;}

.subtab{
	height: 22px;
	background: #fff url(../images/bg_menusub.gif) bottom left repeat-x;
	padding-left: 5px;
}
.subtab a{
	display: block; 
	float: left; 
	margin: 0px 5px; 
	text-decoration: none;
	padding-left: 10px;
	height: 22px;
}
.subtab a span{
	height: 19px;
	padding-right: 10px;
	padding-top: 3px;
	color: #666;
	display: block;
	float: left;
	font-weight: bold;
}
.subtab .tab_active{
	background:url(../images/bg_menu_user.png) top left no-repeat;
}

.subtab .tab_active span{
	background:url(../images/bg_menu_user.png) right -22px no-repeat; color: #000; font-weight: bold;
}

.avatar {
	border: 1px solid #ccc;
	text-align: center;
	width: 200px;
	min-height: 100px;
	height: auto !important;
	height: 100px;
	padding:2px;
}
.avatar img{}
