/*
	copyright@ Joe Zhou http://xiebiji.com download by http://www.codefans.net
*/
/*=====fix容器=====*/
.fixdock{
	position:fixed;
	bottom:25px;
	width:100%;
	text-align:center
}
.fixdock .bg{
	display:inline-block;
	position:relative;
}
.fixdock .bg .dock{
	position:relative;
	z-index:2;
	white-space:nowrap;
}
.fixdock .bg .dock:after{
	content:'';
	height:0px;
	width:100%;
	position:absolute;
	z-index:-1;
	left:-20px;
	top:30px;
	border-bottom:40px solid #fff;
	border-right:20px solid transparent;
	border-left:20px solid transparent;
	opacity:0.3;
}
.fixdock .bg .dock:before{
	content:'';
	height:1px;
	width:100%;
	left:-19px;
	position:absolute;
	top:70px;
	padding:0 19px;
	background:#fff;
	opacity:0.5;
}

/*===== 图标开始 =====*/
ul.dock>li{
	position:relative;
	-webkit-box-sizing:border-box;
	width:50px;
	height:50px;
	margin:0 5px;
	float:left;
	-webkit-box-reflect:below 5px -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(0.45, transparent), to(rgba(255, 255, 255, 0.25)));
	-webkit-transition: 0.15s linear;
	-webkit-transition-property: -webkit-transform margin;
}
ul.dock>li:hover{
	-webkit-transform-origin: center bottom;
	-webkit-transform: scale(1.5);
	margin:0 22px;
}
ul.dock li .title>a{
	text-decoration:none;
	color:inherit;
	display:block;
	height:100%;
	width:100%;
	overflow:hidden;
	line-height:700px;
	position:absolute;
	z-index:50;
}
/*icon*/
.icon{
	background:#000;
	border:3px solid #fff;
	-webkit-border-radius:25px;
	-webkit-box-shadow:0 0 3px #999;
	
}
.icon .title{
	position:relative;
	color:#fff;
	display:block;
	width:44px;
	height:44px;
	text-align:center;
	line-height:44px;
	text-decoration:none;
	font-size:28px;
	font-family:Arial;
	font-weight:bold;
	-webkit-box-sizing:border-box;
	-webkit-border-radius:22px;
	background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#999), to(#000));
	border:1px solid #444;
	text-shadow:0 0 2px #000;

}
.icon .title:after{
	content:'';
	position:absolute;
	height:20px;
	width:100%;
	-webkit-border-radius:1200px 1200px 0px 0px;
	-webkit-transform: rotate(-20deg);
	opacity:0.1;
	background:#fff;
	top:0px;
	left:-4px;
}
/*icon2*/
.icon2 .title{
	color:#0066ce;
	text-shadow:0 0 2px #fff;
	font-weight:bold;
	font-size:18px;
	font-family:Arial;
	line-height:40px;
	text-decoration:none;
	display:block;
	position:relative;
	height:40px;
	width:50px;
	text-align:center;
	border-bottom-left-radius: 600px 500px;
	border-bottom-right-radius: 600px 500px;
	border-top-left-radius: 600px 500px;
	border-top-right-radius: 600px 500px;
	background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#fff), to(#b4b4b4));
	-webkit-box-shadow:0 0 5px #999
}
.icon2 .title:before{
	content:'';
	height:10px;
	width:0px;
	position:absolute;
	top:39px;
	left:12px;
	border-right:10px solid transparent;
	border-top:10px solid #b4b4b4;
	-webkit-transform: rotate(10deg);
}
/*icon3*/
.icon3 .title{
	display:block;
	width:100%;
	height:100%;
	-webkit-box-sizing:border-box;
	-webkit-border-radius:30px;
	background-image:-webkit-gradient(radial, 25 45, 2, 25 30, 33, from(#fea3a3), to(#fff),color-stop(60%,#d00000),color-stop(90%,#fea3a3));
	border:1px solid #840000;
	text-decoration:none;
	line-height:50px;
	color:#fff;
	font-size:30px;
	font-weight:bold;
	font-family:'twitter';
	text-shadow:0 0 2px #ff5757;
}
.icon3 .title:after{
	content:'';
	position:absolute;
	height:23px;
	width:98%;
	-webkit-border-radius:1200px 1200px 0px 0px;
	-webkit-transform: rotate(-20deg);
	opacity:0.2;
	background:#fff;
	top:1px;
	left:-4px;
}
/*icon4*/
.icon4 .title{
	display:block;
	width:100%;
	height:100%;
	-webkit-box-sizing:border-box;
	-webkit-border-radius:5px;
	background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#00fcff), to(#0085b7),color-stop(90%,#0094d2));
	-webkit-box-shadow:0 0 3px #0085b7;
	text-decoration:none;
	line-height:56px;
	color:#fff;
	font-size:44px;
	font-family:'twitter';
	text-shadow:0 0 1px #00838f;
}
/*icon5*/
.icon5 .title{
	display:block;
	width:100%;
	height:100%;
	-webkit-box-sizing:border-box;
	-webkit-border-radius:25px;
	background-image:-webkit-gradient(radial, 45 45, 2, 45 30, 33, from(#d9d9d9), to(#fff));
	text-decoration:none;
	line-height:47px;
	color:#0234a4;
	font-size:44px;
	font-family:'Bookman Old Style';
	font-weight:normal;
	text-shadow:0 0 2px #00fafd;
	-webkit-box-shadow:0 0 5px #999;
}
.icon5 .title:after{
	content:'';
	position:absolute;
	height:23px;
	width:98%;
	-webkit-border-radius:1200px 1200px 0px 0px;
	-webkit-transform: rotate(-20deg);
	opacity:0.4;
	background:#fff;
	top:1px;
	left:-4px;
}
/*folder*/
ul.dock .folder{
	width:72px;
	padding:0 0 0 2px;
}

ul.dock .folder .title>a{
	width:74px;
	height:54px;
	top:-8px;
}
ul.dock .folder .title a{
	text-align: center;
	line-height: normal;
	overflow: visible;
}
ul.dock .folder .title a span{
	background: rgba(0,0,0,1);
	white-space: nowrap;
	font-size: 10px;
	font-weight:normal;
	-webkit-border-radius:10px;
	margin: -20px 0 0px 3px;
	color:#fff;
	padding:2px 15px;
	position:absolute;
	text-shadow:0 1px 1px #000;
	display:none;
	-webkit-transform: scale(0.7);
}
ul.dock .folder .title a span:after{
	content:"";
	position: absolute;
	border: 4px solid transparent;
	border-top:4px solid rgba(0,0,0,1);
	display: block;
	margin:2px 0 0 7px;
}
ul.dock .folder .title a:hover span{
	display:block;
}
ul.dock .folder:target .title a:hover span{
	display:none;
}
.folder:after{
	position:absolute;
	content:'?';
	left:53px;
	top:38px;
	height:2px;
	width:2px;
	color:#e9004d;
	font-size:24px;
	text-shadow:0 0 2px #000;
	text-indent:-4px;
	line-height:2px;
	text-decoration:none;
	font-family:'宋体';
}
.star:after{
	color:#ffa200;
	content:'★';
}
.hot:after{
	color:#000;
	content:'N';
	text-indent:-41px;
	top:25px;
	text-shadow:none;
	font-size:34px;
	opacity:0.4;
}
.folder .title{
	position:absolute;
	top:6px;
	left:0;
	border-bottom-left-radius: 6px 60px;
	border-bottom-right-radius: 6px 60px;
	border-top-left-radius: 6px 6px;
	border-top-right-radius: 6px 6px;
	height:40px;
	width:64px;
	background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#e4f6ff), to(#66adce),color-stop(90%,#8ad9fe));
	-webkit-box-shadow:0 -1px 1px #004f7c;

}


ul.dock>.folder .title:after{
	position:absolute;
	top:-4px;
	left:2px;
	content:"";
	height:40px;
	width:60px;
	-webkit-border-radius:3px;
	background:#5d8ca1;
	z-index:-2;
}
ul.dock>.folder .title:before{
	position:absolute;
	top:-8px;
	left:5px;
	content:"";
	height:30px;
	width:20px;
	-webkit-border-radius:2px;
	background:#6ea3bc;
	z-index:-1;
}
ul.dock>.folder:target:after{
	display: none;
}
ul.dock>.folder:target>.title{
	background:rgba(255,255,255,0.3);
	border-radius:3px;
	-webkit-box-shadow:0 0px 2px #004f7c;
	width: 50px;
	margin: 0 0 0 9px;
	border: 1px solid rgba(255,255,255,0.8);;
}
ul.dock>.folder:target>.title:before{
	display:none;
}
ul.dock>.folder:target>.title:after{
	z-index: 3;
	-webkit-border-radius:0px;
	height: 0;
	width: 0;
	border-right: 10px solid transparent;
	border-left: 10px solid transparent;
	border-top: 10px solid rgba(255,255,255,0.7);
	background: none;
	top:50%;
	left:50%;
	margin: -5px 0 0 -9px;
}
/*二级*/
/*假如被选中，自身hover消除,并且弹跳*/
ul.dock>li:target:hover{
	opacity:1;
}
ul.dock>li:target{
	opacity:0.7;
	-webkit-transform-origin: center bottom;
	-webkit-transform: scale(1.2);
	-moz-transform: scale(1.2);
	margin:0 19px;
	/*-webkit-animation: 'jump' 0.5s alternate 15;*/
}
/*点亮*/
/*
ul.dock>li:target:before{
	content:"*";
	height:20px;
	width:20px;
	color:transparent;
	background-image:-webkit-gradient(radial, 10 10, 13, 10 10, 6, from(#fff), to(rgba(116,247,255,0)),color-stop(30%,#fff),color-stop(55%,rgba(116,247,255,0)),color-stop(30%,rgba(116,247,255,1)));
	position:absolute;
	left:15px;
	top:48px;
	z-index:1;
	font-weight:bold;
	opacity:0.8;
}
*/
ul.dock>li:target:before{
	content:"?";
	height:20px;
	width:20px;
	color:#ccfeff;
	position:absolute;
	left:15px;
	top:50px;
	z-index:1;
	font-size:18px;
	text-shadow:0 0 3px #00fcff;
	-webkit-transform: scale(1,0.5);
}
ul.dock>.folder:target:before{
	left:25px;
}
/*@-webkit-keyframes 'jump' {
  0% {
	margin:0px 19px 0;
	
  }
  5% {
	margin:0px 19px 0;
  }
  10% {
	margin:-1px 19px 0;
  }
  20% {
	margin:-4px 19px 0;
  }
  30% {
	margin:-6px 19px 0;
  }
  45% {
	margin:-7px 19px 0;
  }
  50% {
	margin:-7px 19px 0;
  }
  60% {
	margin:-6px 19px 0;
  }
 70% {
	margin:-4px 19px 0;
  }
  80% {
	margin:-1px 19px 0;
  }
  85% {
	margin:0px 19px 0;
  }
  100% {
	margin:0px 19px 0;
  }
}*/
.folder:target>ul.sub_folder{
	-webkit-transform: scale(0.666666);
	-moz-transform: scale(0.666666);
	-webkit-transform-origin: center center;
	opacity:0.7;
}
.folder>ul.sub_folder{
	position:absolute;
	border:2px solid #fff;
	-webkit-box-shadow:0 0 4px #000;
	-webkit-border-radius:25px;
	background:#000;
	width:600px;
	height:440px;
	bottom:10px;
	left:-275px;
	-webkit-transform: scale(0);
	-moz-transform: scale(0);
	-webkit-transition: all 0.5s ease-in-out;
	padding:20px;
	z-index:1;
	opacity:0;
	-webkit-transform-origin: 320px bottom;
}
.folder>ul.sub_folder:after,.folder>ul.sub_folder:before{
	position:absolute;
	content:'';
	left:285px;
	bottom:-51px;
	border-top:20px solid #fff;
	border-right:20px solid transparent;
	border-left:20px solid transparent;
	height:30px;
	width:0px;
	z-index:2;
}
.folder>ul.sub_folder:before{
	bottom:-48px;
	border-top:20px solid #000;
	z-index:3;
}
.folder>ul.sub_folder>.folder{
	-webkit-box-sizing: border-box;
	-webkit-transition: 0.15s linear;
	float: left;
	height: 50px;
	margin: 42px 60px;
	position: relative;
	width:64px;
	-webkit-transform: scale(1.5);
}
.folder>ul.sub_folder>.folder:after{
	content:'?';
	border:0px none;
	background:none;
	top:36px;
	color:#333;
	left:50px;
	text-shadow:1px 0px 1px #fff;
	font-family:'宋体';
	font-size:18px;
}
.folder>ul.sub_folder>.folder:hover{
	background:#fff;
	padding:5px;
}
.folder>ul.sub_folder>.folder p{
	position:absolute;
	text-align:center;
	font-size:12px;
	white-space:nowrap;
	font-weight:normal;
	color:#fff;
	font-family:Arial;
	left:-20px;
	top:56px;
	width:110px;
	height:17px;
	text-overflow: ellipsis;
	text-shadow:1px 1px 1px #000;
	overflow:hidden;
}
.folder>ul.sub_folder>.folder .title a{
	height: 70px;
	left: -20px;
	width: 110px;
	overflow:hidden;
	line-height:700px;
}
.folder>ul.sub_folder>.img .title{
	background:#999;
	-webkit-border-radius:1px;
	height:50px;
	margin:-6px 0 0 0;
	-webkit-box-shadow:none;
}
.folder>ul.sub_folder>.img .title:after,.folder>ul.sub_folder>.img .title:before,.folder>ul.sub_folder>.img:after{
	display:none;
}
.folder>ul.sub_folder>.img img{
	width:58px;
	height:46px;
	position:absolute;
	top:2px;
	left:3px;
	-webkit-transition: all 0.5s ease-in-out;
}
.folder>ul.sub_folder>.img .title:hover{
	background:#fff;
}
.folder>ul.sub_folder>.return .title{
	background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#666), to(#000),color-stop(40%,#000));
	-webkit-border-radius:25px;
	height:50px;
	width:50px;
	margin:-6px 0 0 0;
	left:7px;
	-webkit-box-shadow:0 0 4px #333;
	-webkit-box-sizing:border-box;
	border:2px solid #fff;
}
.folder>ul.sub_folder>.return .title:after,.folder>ul.sub_folder>.return .title:before,.folder>ul.sub_folder>.return:after{
	background:none;
	border-bottom-left-radius: 0px 0px;
	border-bottom-right-radius: 0px 0px;
	border-top-left-radius: 0px 0px;
	border-top-right-radius: 0px 0px;
	content: '';
	left: 4px;
	top: -8px;
	z-index:2;
	height:25px;
	width:15px;
}
.folder>ul.sub_folder>.return:after{
	height:0px;
	width:0px;
	border:11px solid transparent;
	border-top:11px solid #fff;
	left:31px;
	top:5px;
	-webkit-transform: rotate(-114deg);
}
.folder>ul.sub_folder>.return .title:after,.folder>ul.sub_folder>.return .title:before{
	margin:23px 0 0 10px;
}
.folder>ul.sub_folder>.return .title:after{
	top: -4px;
	left:9px;
	background:#000;
	border-top-left-radius: 40px 30px;
	border-bottom-left-radius: 40px 40px;
}
.folder>ul.sub_folder>.return .title:before{
	background:#fff;
	border-top-left-radius: 40px 30px;
	border-bottom-left-radius: 40px 40px;
}
.folder>ul.sub_folder>.return .title a{
	left:-30px;
	top:0;
}
/*new sub_folder*/
.folder>ul.new,.folder>ul.new:after,.folder>ul.new:before{
	background: none;
	border: none;
	-webkit-box-shadow:none;
	width: auto;
	height: auto;
	left: -17px;
	top:-420px;
}
.folder>ul.new>.folder{
	float: none;
	-webkit-transform: rotate(4deg);
	margin:30px 0;
}
.folder>ul.new>li:nth-child(5){
	left:7px;
	-webkit-transform: rotate(6deg);
}
.folder>ul.new>li:nth-child(4){
	left:14px;
	-webkit-transform: rotate(8deg);
}
.folder>ul.new>li:nth-child(3){
	left:25px;
	-webkit-transform: rotate(10deg);
}
.folder>ul.new>li:nth-child(2){
	left:40px;
	-webkit-transform: rotate(12deg);
}
.folder>ul.new>li:nth-child(1){
	left:63px;
	-webkit-transform: rotate(14deg);
}
.folder>ul.new>.folder p{
	right: 70px;
	left: auto;
	top:15px;
	background: rgba(0,0,0,0.8);
	border-radius: 30px;
	padding: 2px 10px;
	width:auto;
	max-width: 150px;
	font-size: 14px;
}
.folder>ul.new{
	-webkit-transform-origin: center bottom;
}