@charset "utf-8";
/* CSS 大赛样式 guojunhui@zcool-mail.com  date:2014.11.17*/
/*
目录结构：
  1. 重定义浏览器默认样式
  2. 基础样式
    2.1 浮动
    2.2 清除浮动
	2.3 对齐
	2.4 定位
	2.5 隐藏 显示
	2.6 css3阴影
	2.7 边框，css3圆角
	2.8 外边距
	2.9 内填充
	2.10 字体
	2.11 文字尺寸
	2.12 文字行距
	2.13 文字颜色
	2.14 文字颜色强调
	2.15 行内分割竖线
	2.16 表单
	2.17 按钮
	2.18 内容
	2.19 线条
  3. 布局
    3.1 尺寸
	3.2 主视觉
  4. 模块
    4.1 头图
	4.2 导航条
	4.3 上传作品
	4.4 下载模版
	4.5 作品列表
	4.6 排序
	4.7 评委阵容
	4.8 报名表格
*/
/*------------------zcool.dasai.css-------------------------*/
/*2. 基础样式*/
/*2.1 浮动
	Name:			style_float
	Example:		class="l/r"
	Explain:		.l 左浮动/.r 右浮动
*/
.l{_display:inline;float:left!important;}.r{_display:inline;float:right!important;}
/*2.2 清除浮动
	Name:			style_clearfix
	Example:		class="clearfix|cl"
	Explain:		clearfix（简写cl）避免因子元素浮动而导致的父元素高度缺失能问题
*/
.cl:after,.clearfix:after{content:".";display:block;height:0;clear:both;visibility:hidden}.cl,.clearfix{zoom:1;}
/*2.3 对齐
	Name:			style_text-align
	Example:		class="ftext-l/text-r/text-c"
	Explain:		.text-水平对齐 （.text-l左对齐/.text-r右对齐/.text-c居中对齐）
					.va-上下对齐 （.va-t 居上对齐 .va-m 居中对齐 .va-b 居下对齐）
*/
.text-l{text-align:left}.text-r{text-align:right}.text-c{text-align:center}
.va-t{ vertical-align:top!important}.va-m,.va-m *{ vertical-align:middle!important}.va-b{ vertical-align:bottom!important}
/*2.4 定位
	Name:			style_position
	Example:		class="pos-r/pos-a/pos-f"
	Explain:		.pos-r 相对定位/.pos-a 绝对定位/.pos-f 固定
*/
.pos-r{position:relative}.pos-a{position:absolute}.pos-f{position:fixed}

/*2.5 隐藏&显示
  Name:				style_display
  Example:    <div class="hide">隐藏的内容</div> <div class="show">显示的内容</div>
  Explain:    		.hide 隐藏 / .show 显示
*/
.hide{display:none}[hidden]{display: none}
.hidden{display:none!important;visibility:hidden!important}
.f-hide{font:0/0 a;color:transparent;text-shadow:none;background-color:transparent;border:0}
[class*="span"].hide,.row-fluid [class*="span"].hide{display:none;}
.show{display:block}
.invisible{visibility:hidden}

/*2.6 css3阴影
	Name:			style_shadow
	Example:		class="box-shadow"
	Explain:		css3阴影，IE下显示1像素边框
*/
.box-shadow{background-color:#fff;border:solid 1px #ddd\9;box-shadow:1px 1px 2px 2px #ddd;behavior: url(ie-css3.htc);}
.text-shadow{text-shadow:1px 1px 2px 2px #ddd;behavior: url(ie-css3.htc);}
/*2.7 边框，css3圆角
	Name:			style_border
	Example:		class="bk_gray radius"
	Explain:		.bk_gray 边框/bk_gray radius圆角边框<
*/
.bk_gray{border:solid 1px #ddd}
.radius{-khtml-border-radius:4px;-ms-border-radius:4px;-o-border-radius:4px;-moz-border-radius:4px;-webkit-border-radius:4px;border-radius:4px;}
.radius-2{-khtml-border-radius:2px;-ms-border-radius:2px;-o-border-radius:2px;-moz-border-radius:2px;-webkit-border-radius:2px;border-radius:2px;}
.radius-3{-khtml-border-radius:3px;-ms-border-radius:3px;-o-border-radius:3px;-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px;}

/*2.8 外边距
	Name:			style_margin
	Example:		class="mt-5/mt-10/..."
	Explain:		.mt表示上边距/.mb表示下边距/.ml表示左边距/.mr表示右边距
*/
.mt-5{margin-top:5px}.mt-10{margin-top:10px}.mt-15{margin-top:15px}.mt-20{margin-top:20px}.mt-30{margin-top:30px}.mt-40{margin-top:40px}
.mb-5{margin-bottom:5px}.mb-10{margin-bottom:10px}.mb-15{margin-bottom:15px}.mb-20{margin-bottom:20px}.mb-30{margin-bottom:30px}.mb-40{margin-bottom:40px}
.ml-5{margin-left:5px}.ml-10{margin-left:10px}.ml-15{margin-left:15px}.ml-20{margin-left:20px}.ml-30{margin-left:30px}.ml-40{margin-left:40px}
.mr-5{margin-right:5px}.mr-10{margin-right:10px}.mr-15{margin-right:15px}.mr-20{margin-right:20px}.mr-30{margin-right:30px}.mr-40{margin-right:40px}

/*2.9 内填充
	Name:			style_padding
	Example:		class="pt-5/pt-10/……"
	Explain:		.pt表示上填充/.pb表示下填充/.pl表示左填充/.pr表示右填充
*/
.pt-5{padding-top:5px}.pt-10{padding-top:10px}.pt-20{padding-top:20px}
.pb-5{padding-bottom:5px}.pb-10{padding-bottom:10px}.pb-20{padding-bottom:20px}
.pl-5{padding-left:5px}.pl-10{padding-left:10px}.pl-20{padding-left:20px}
.pr-5{padding-right:5px}.pr-10{padding-right:10px}.pr-20{padding-right:20px}
.pd-5{padding:5px}.pd-10{padding:10px}.pd-15{padding:15px}.pd-20{padding:20px}.pd-30{padding:30px}.pd-40{padding:40px}

/*2.10 字体*/
.MSYH{font-family:\5FAE\8F6F\96C5\9ED1,Arial;_font-family:Arial,\5b8b\4f53;}/*微软雅黑字体*/
.en{ font-family:arial;}/*英文字体*/
.f-song{ font-family:\65b0\5b8b\4f53,\5b8b\4f53;_font-family:\5b8b\4f53;}/*宋体*/

/*2.11 文字尺寸
	Name:			style_font-size
	Example:		class="f12/f14/f16/f18/f20"
	Explain:		12px字体/14px字体/16px字体/18px字体/20px字体
*/
.f-12{font-size:12px}.f-14{font-size:14px}.f-16{font-size:16px}.f-18{font-size:18px}.f-20{font-size:20px}.f-24{font-size:24px}.f-36{ font-size:36px}

/*2.12 文字行距
	Name:			mod_line-height
	Example:		class="l16/l18/l20/l22/l24/l26/l28/l30"
	Explain:		16px行高、18px行高、20px行高、22px行高、24px行高、26px行高、30px行高
*/
.l16{line-height:16px}.l18{line-height:18px}.l20{line-height:20px}.l22{line-height:22px}.l24{line-height:24px}.l26{line-height:26px}.l28{line-height:28px}.l30{line-height:30px}

/*2.13 文字颜色
	Name:			style_color
	Example:		class="c_red|c_green|c_blue|c_white|c_black|c_gray|c_999|c_orange"
	Explain:		红色|绿色|蓝色|白色|黑色|灰色|浅灰色|橙色
*/
.c_red,.c_red a{color:red}
.c_green,.c_green a{color:green}
.c_blue,.c_blue a{color:blue}
.c_white,.c_white a{color:white}
.c_black,.c_black a{color:black}
.c_gray,.c_gray a{color:gray}
.c_999,.c_999 a{color:#999}
.c_orange,.c_orange a{color:orange}

/*2.14 文字颜色强调
	Example:		class="text-muted/text-primary/text-warning/text-error/text-danger/text-success/text-info"
	Explain:		柔和/重要/警告/错误/危险/成功/信息
*/
.text-muted{color:#999}a.text-muted:hover{color:#808080}
.text-primary{color:#428BCA}a.text-primary:hover{color:#247dc9}
.text-warning{color:#c51900}a.text-warning:hover{color:#c51900}
.text-error{color:#f33}a.text-error:hover{color:#f03}
.text-danger{color:#c00}a.text-danger:hover{color:#900}
.text-success{color:#7da700}a.text-success:hover{color:#7da700}
.text-info{color:#1faef2}a.text-info:hover{color:#06c}
.text-disabled{ color:#919090}a.text-disabled:hover{color:#919090}

/*2.15 行内分割竖线
	Name:			style_pipe
	Example:		<span class="pipe">|</span>
*/
.pipe{margin:0 5px;color:#d4d4d4;font-size:12px!important;}
/*2.16 表单*/
.input_text,.textarea{border:solid 1px #bcdfd1;background-color:#fff;}
.input_text,.textarea{padding:6px 4px;_padding:5px 3px;font-size:14px;font-family:\5FAE\8F6F\96C5\9ED1,Arial;_font-family:Arial,\5b8b\4f53;}
.textarea{height:200px;line-height:22px;padding:6px 4px;_padding:5px 3px;}
.input-file{}

/*2.17 按钮*/
.btnZT,a.btnZT{display:inline-block;padding:0 30px;line-height:40px;cursor:pointer;background:#2dabe8; color:#fff; font-size:14px; font-weight:bold; text-align:center;vertical-align:middle; text-decoration:none;outline:0 none;border:none;font-family:\5FAE\8F6F\96C5\9ED1,Arial;_font-family:Arial,\5b8b\4f53;}
.btnZT:hover,a.btnZT:hover{ background:#0a8cf6; text-decoration:none}
.btnZT-big{}
.btnZT-small{height:28px;line-height:28px;font-size:14px;padding:0 10px;}
.btnZT.disabled,.btnZT.disabled:hover{background-color:#bec2c9!important;cursor: default!important;}

/*2.18 内容*/
.zt-title{color: #222;font-size: 24px; font-weight:bold}/*标题*/
.zt-content{color:#333;font-size:16px;line-height:30px;}/*内容*/
.zt-content h3{margin-top:20px;font-size:16px}
.zt-content p{text-indent:2em;margin-top:10px}
.zt-content img{ max-width:100%;}
.zt-content ul{text-indent:2em}
.zt-content .f-14,.zt-content.f-14{ font-size:14px}
a.more {color:#666;font-weight: normal;margin-top: 5px;font-size:14px!important;}/*更多*/

/*2.19 线条*/
.line1{ border-top:solid 1px #eee;border-bottom:solid 1px #fff;font-size:0;line-height:0; float:none; clear:both}

/*3. 布局*/
/*3.1 尺寸*/
.wp{width:1080px;margin-left:auto; margin-right:auto;text-align:left}/*页面整体宽度*/
.w370{ width:370px;}
.w220{ width:220px;}

/*3.2 主视觉*/
body{background-color:#fff;}
.maincolor{color:#78615d}
.c-link{ color:#3a8dcc!important}

/*4. 模块*/
.navMoreCon{ height:91px}
.navMoreCon a{ float:left;}
/*4.1 头图
	Name:	mod_headerBanner
	Example: <div class="headerBanner"></div>
*/
.headerBanner{background: url(https://img.zcool.cn/special-resource/asus2016/images/topbg.jpg) no-repeat center top;height:595px;margin-top: -3px;z-index: 1;}

/*4.2 导航条
	Name:	mod_mainnav
	Example:		
<div class="navWrapper">
  <div class="mainnavBar cl wp">
    <nav class="mainnav cl">
	  <ul class="cl">
	    <li class="current"><a title="首页" href="index.html">首页</a></li>
        <li><a title="活动介绍" href="details.html">活动介绍</a></li>
        <li><a title="设计说明" href="design.html">设计说明</a></li>
        <li><a title="全部作品" href="works.html">全部作品</a></li>
        <li><a target="_blank" title="讨论组" href="http://group.zcool.com.cn/group/2726">讨论组</a></li>
	  </ul>
    </nav>
  </div>
</div>
	Explain：鼠标经过状态a:hover，当前选中状态li:current。		
*/
.navWrapper{ background-color:#c1e3ff}
.mainnav li,.mainnav li a{height:50px;line-height:50px;}/*导航条高度*/
.mainnav li{color:#fff;font-size:18px;}
.mainnav li a{padding:0 24px;color:#74402c;}/*链接颜色*/
.mainnav li a:hover,.mainnav li.current a{color:#fff;background-color:#685652}/*导航交互颜色*/
.mainnavBar{ position:relative}
.mainnav{width:100%;z-index:1;}/*导航条背景*/
.mainnav li{float:left;display:inline;}/*设置字体*/
.mainnav li a{display:inline-block;}/*链接颜色*/
.mainnav li a:hover,.mainnav li.current a{text-decoration:none;}/*交互颜色*/

/*4.3 上传作品*/
a.btnZT-uploadzp{ position:absolute;line-height:34px;font-size:16px;top:8px;right:120px;}
/*4.4 下载模版*/
a.btnZT-downmb{position:absolute;line-height:34px;font-size:16px;top:8px;right:0;}

/*4.5 作品列表*/
.zxUl{margin-right:-60px;padding:0 0 0 0px;}
.zxUl li{float:left;width:250px; height:280px;margin:20px 25px 0 0;}
.zxUl li img{width:250px;height:188px; display:block}
	.zxUlCon{line-height:22px;margin-top:10px;}
	.zxUlTitle{width:230px; white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:14px;padding:0 0 5px 0;color:#4c2925;}
	.zxUlTitle a{color:#4c2925;}
	.zxUlDesS{color:#7e6866;font-size:12px;}
	.zxUlDes{color:#a09292; font-size:12px; font-family:Verdana}
	.zxUlDes a{color:#a09292;}
	.zxUIvote{color:#a09292; font-size:14px}
	.zxUIdown{ font-size:14px; padding-left:20px; background:url(https://img.zcool.cn/special-resource/asus2016/images/icon-down.png) no-repeat 0 center}
.zxVote .zxUlDes,.zxVote .zxUIvote{ padding-left:20px}
.zxVote .zxUlTitle a{ color:#054267}
.zxUlDesS span{ width:45px;font-size:12px; display:inline-block; float:left; padding-left:20px; background-repeat:no-repeat; background-position:0 center}
.zxUlDesS .view{ background-image:url(https://img.zcool.cn/special-resource/asus2016/images/icon_pv.png);}
.zxUlDesS .comment{ background-image:url(https://img.zcool.cn/special-resource/asus2016/images/icon_comment.png);}
.zxUlDesS .favorit{ background-image:url(https://img.zcool.cn/special-resource/asus2016/images/icon_ding.png);}

/*4.6 排序*/
.dosx{ color:#74402C}
.dosx a{color:#74402C;}
.dosx span{color:#999;}
.dosx .verdana{ color:#74402C}
.dosx{ text-align:right;float:right;font-size:12px;margin-top:10px; font-weight:normal}
.dosx a.selected{font-weight:bold;}
.dosx span{margin:0 5px;}
.dosx .verdana{font-family:Verdana, Geneva, sans-serif;line-height:1; vertical-align:text-bottom;margin:0;}

/*4.7 评委阵容*/
.pwuls{ margin-right:-50px}
.pwuls .item{width:327px; height:auto;text-align:left;float:left;overflow:hidden;padding-right:50px;margin-top:40px}
	.pw-pic{width:128px;height:128px;float:left;}
	.pw-info{margin-left:140px;}
	.pw-name{font-size:18px; font-weight:normal}
	.pw-title{color:#87736f;padding-left:15px; font-size:12px;}	
	.pw-title-all{font-size:14px;line-height:23px; color:#717171}

/*4.8 报名表格*/
.zxTable{margin-top:10px;}
.zxTable th{font-weight:normal; text-align:left;width:80px;padding:15px 0 0 0;font-size:14px; vertical-align:top;}
.zxTable td{padding:10px 0;font-size:12px;}



/*******/

.mt25{margin-top:25px;}
.f26{font-size:26px;}
.blackLine{ background:url(https://img.zcool.cn/special-resource/asus2016/images/b.jpg) repeat;font-family:"微软雅黑"}
.blackLineCon{height:630px;}

.video{width:600px;height:407px; position:absolute;z-index:2;left:0;top:60px;}
.videoCon{ background:#131313;width:405px;height:440px; padding:0 35px 0 100px; position:absolute;right:0;top:80px; color:#8d7f6a;font-size:14px;}
.cffd89f{color:#ffd89f;}


.downNav{ position:absolute;right:0;bottom:0;left:0;height:60px;}
.downNav li{height:60px;float:left;width:25%; text-align:center;line-height:60px; background:#191919;}
.downNav li a{height:60px; display:block;font-size:18px;color:#fff;font-family:"微软雅黑"}
.downNav li.active{ background:#e6e2da;}
.downNav li a:hover{color:#222222; text-decoration:none;background:#e6e2da;}
.downNav li.active a{color:#222222; cursor:default;}

.blackLineConL{ position:absolute;left:-20px;top:475px;}
.blackLineConR{ position:absolute;right:0px;top:45px;}



.grayBg{ background:#e6e2da;font-family:"微软雅黑"}
.blText{color:#e6e2da;line-height:100px;height:110px; }




.dv{width:1080px;height:270px; background:url(https://img.zcool.cn/special-resource/asus2016/images/down.jpg) no-repeat; position:relative;}
.dv.dv1{background:url(https://img.zcool.cn/special-resource/asus2016/images/down1.jpg) no-repeat; }
.dv.dv2{background:url(https://img.zcool.cn/special-resource/asus2016/images/down2.jpg) no-repeat; }
.dv.dv3{background:url(https://img.zcool.cn/special-resource/asus2016/images/down3.jpg) no-repeat; }
.dv a{left:594px;top:149px; display:inline-block; position:absolute; width:165px;height:55px; background:url(https://img.zcool.cn/special-resource/asus2016/images/buy.jpg);}

.bgs{width:1148px;height:3133px; position:relative;margin-left:-39px; background:url(https://img.zcool.cn/special-resource/asus2016/images/bgs.jpg) no-repeat center bottom;}


.bgs .personDes{font-size:16px;color:#7d776c; position:absolute;top:237px;left:533px;line-height:26px;}

.bgs .txt1{ position:absolute;left:130px;top:580px;color:#e6e2da;font-size:18px;line-height:36px;}
.bgs .txt2{ position:absolute;left:533px;top:925px;color:#e6e2da;font-size:18px;line-height:36px;width:510px;}
.bgs .txt3{ position:absolute;left:110px;top:1245px;color:#e6e2da;font-size:18px;line-height:36px;width:340px;}
.bgs .txt4{ position:absolute;left:650px;top:1590px;color:#e6e2da;font-size:18px;line-height:36px;width:380px;}
.bgs .txt5{ position:absolute;left:450px;top:2280px;color:#e6e2da;font-size:18px;line-height:36px;width:445px;}
.bgs .txt6{ position:absolute;left:210px;top:2990px;color:#e6e2da;font-size:18px;line-height:36px;width:740px;}



.bgs01{width:1185px;height:3584px; position:relative;margin-left:-52px; background:url(https://img.zcool.cn/special-resource/asus2016/images/bgs01.jpg) no-repeat center bottom;}
.bgs01 .personDes{font-size:16px;color:#7d776c; position:absolute;top:237px;left:548px;line-height:26px;}


.bgs01 .txt1{ position:absolute;left:80px;top:870px;color:#e6e2da;font-size:18px;line-height:36px;}
.bgs01 .txt2{ position:absolute;left:620px;top:885px;color:#e6e2da;font-size:18px;line-height:36px;width:510px;}
.bgs01 .txt3{ position:absolute;left:120px;top:1510px;color:#e6e2da;font-size:18px;line-height:36px;width:340px;}
.bgs01 .txt4{ position:absolute;left:740px;top:1780px;color:#e6e2da;font-size:18px;line-height:36px;width:380px;}
.bgs01 .txt5{ position:absolute;left:110px;top:2550px;color:#e6e2da;font-size:18px;line-height:36px;width:445px;}
.bgs01 .txt6{ position:absolute;left:780px;top:2820px;color:#e6e2da;font-size:18px;line-height:36px;width:300px;}
.bgs01 .txt7{ position:absolute;left:130px;top:3470px;color:#e6e2da;font-size:18px;line-height:36px;width:910px;}



.bgs02{width:1156px;height:2623px; position:relative;margin-left:-36px; background:url(https://img.zcool.cn/special-resource/asus2016/images/bgs02.jpg) no-repeat center bottom;}
.bgs02 .personDes{font-size:16px;color:#7d776c; position:absolute;top:203px;left:535px;line-height:26px;}


.bgs02 .txt1{ position:absolute;left:100px;top:525px;color:#e6e2da;font-size:18px;line-height:36px;width:380px;}
.bgs02 .txt2{ position:absolute;left:575px;top:860px;color:#e6e2da;font-size:18px;line-height:36px;width:510px;}
.bgs02 .txt3{ position:absolute;left:110px;top:1180px;color:#e6e2da;font-size:18px;line-height:36px;width:340px;}
.bgs02 .txt4{ position:absolute;left:680px;top:1530px;color:#e6e2da;font-size:18px;line-height:36px;width:390px;}
.bgs02 .txt5{ position:absolute;left:120px;top:1920px;color:#e6e2da;font-size:18px;line-height:36px;width:420px;}
.bgs02 .txt6{ position:absolute;left:680px;top:2320px;color:#e6e2da;font-size:18px;line-height:36px;width:380px;}



.bgs03{width:1156px;height:2990px; position:relative;margin-left:-36px; background:url(https://img.zcool.cn/special-resource/asus2016/images/bgs03.jpg) no-repeat center bottom;}
.bgs03 .personDes{font-size:16px;color:#7d776c; position:absolute;top:238px;left:535px;line-height:26px;}

.bgs03 .txt1{ position:absolute;left:100px;top:565px;color:#e6e2da;font-size:18px;line-height:36px;width:380px;}
.bgs03 .txt2{ position:absolute;left:575px;top:900px;color:#e6e2da;font-size:18px;line-height:36px;width:510px;}
.bgs03 .txt3{ position:absolute;left:110px;top:1245px;color:#e6e2da;font-size:18px;line-height:36px;width:340px;}
.bgs03 .txt4{ position:absolute;left:680px;top:1570px;color:#e6e2da;font-size:18px;line-height:36px;width:390px;}
.bgs03 .txt5{ position:absolute;left:120px;top:1980px;color:#e6e2da;font-size:18px;line-height:36px;width:420px;}
.bgs03 .txt6{ position:absolute;left:680px;top:2310px;color:#e6e2da;font-size:18px;line-height:36px;width:380px;}
.bgs03 .txt7{ position:absolute;left:110px;top:2720px;color:#e6e2da;font-size:18px;line-height:36px;width:360px;}