body{ padding:0px; margin:0px;}
/* indexcase*/
.panel-5{ background-color:#313131;}
.indexcase .block-title h1{ font-size:1em;}
.indexcase .block-title h1 font{ color:#FFFFFF; cursor:pointer;}
.indexcase .block-title h1 font:hover, .indexcase .block-title h1 font.on{ color:#d64709;}
.indexcase .line-before:after, .indexcase .line-after:after{ bottom:6px;}
.indexcase .line-before:before, .indexcase .line-after:before{ bottom:6px;}


.megafolio-container{ width:100%}
.megafolio-container ul, .megafolio-container li{ padding:0px; margin:0px; list-style:none;}
.megafolio-container li{ float:left; width:25%; overflow:hidden;position:relative;z-index:1; cursor:pointer;}
.mega-entry{ position:absolute; z-index:2; width:100%; height:100%;   background-repeat:no-repeat; background-position:center center; background-size:cover; 
}
.casehover{width:100%;height:42px;position:absolute;background-color:rgba(90,90,90,0.4);bottom:-60px; text-align:center; color:#FFFFFF; line-height:18px;font-family: "Microsoft Yahei", "微软雅黑", Arial, sans-serif, "宋体";
	-webkit-transition: all 0.2s ease-out;
	-moz-transition: all 0.2s ease-out;
	-o-transition: all 0.2s ease-out;
	-ms-transition: all 0.2s ease-out;
}
.megafolio-container li:hover .casehover{bottom:0px;}
.hovertitle1{ font-size:14px; position:relative; padding-top:3px;}
.hovertitle2{ font-size:12px; position:relative}

.mega-hover { 
	width:100%;
	height:100%;
	position:absolute;
/*	background: url(../images/grain.png) repeat;*/
	background-color:rgba(43,43,43,0.8);
/*	border-radius:4px;
	-moz-border-radius:4px;
	-webkit-border-radius:4px;*/
	-webkit-transition: all 0.2s ease-out;
	-moz-transition: all 0.2s ease-out;
	-o-transition: all 0.2s ease-out;
	-ms-transition: all 0.2s ease-out;
	top:100%;
}
.megafolio-container li:hover .mega-hover{ top:0;}


/*.mega-hovertitle,  .mega-hoverlink,  .mega-hoverview {*/
.mega-hoverlink,  .mega-hoverview {
	-webkit-transition: all 0.2s ease-out;
	-moz-transition: all 0.2s ease-out;
	-o-transition: all 0.2s ease-out;
	-ms-transition: all 0.2s ease-out;
	transition-delay: 0.2s;
	-moz-transition-delay: 0.2s; /* Firefox 4 */
	-webkit-transition-delay: 0.2s; /* Safari and Chrome */
	-o-transition-delay: 0.2s; /* Opera */
}
.mega-hovertitle {
	position:absolute;
	color:#fff;
	font-family: "Microsoft Yahei", "微软雅黑", Arial, sans-serif, "宋体";
	font-size:14px;
/*	font-weight:700;*/
	text-align:center;
	width:100%;
	top:30%;
	/*padding:0px 0px 15px;
	left:20%;
	bottom:40%;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	filter: alpha(opacity=0);
	-moz-opacity: 0;
	-khtml-opacity: 0;
	opacity: 0;*/
}
.mega-hovertitle .mega-hoversubtitle {
	color:#fff;
	font-size:12px;
	line-height:13px;
	font-weight: 400;
	margin-top: 5px;
}
.mega-hoverlink {
	left:50%;margin-left:-16px;
/*	right:50%;
	margin-right:15px;
	background:url(../images/link.png) no-repeat center;*/
	-webkit-transform: translateZ(10);
	-webkit-backface-visibility: hidden;
	-webkit-perspective: 1000;
}
.mega-hoverlink,  .mega-hoverview {
	width:33px;
	height:33px;
	position:absolute;
	top:50%;
	text-align:center;
	margin-top:0px;
	cursor:pointer;
}
.mega-hover.alone .mega-hoverview {
	margin-left:-16px;
	margin-top: -20px;
}
.mega-hover.alone .mega-hoverlink {
	margin-right:-16px;
	margin-top: -20px;
}
/********************************
		-	 THE HOVER EFFECT -
**********************************/
.mega-hover:hover .mega-hoverlink {
	right:50%;
	margin-right:5px;
	transition-delay: 0.1s;
	-moz-transition-delay: 0.1s; /* Firefox 4 */
	-webkit-transition-delay: 0.1s; /* Safari and Chrome */
	-o-transition-delay: 0.1s; /* Opera */
}
.mega-hover:hover .mega-hoverview {
	left:50%;
	margin-left:5px;
	transition-delay: 0.1s;
	-moz-transition-delay: 0.1s; /* Firefox 4 */
	-webkit-transition-delay: 0.1s; /* Safari and Chrome */
	-o-transition-delay: 0.1s; /* Opera */
}
.mega-hover.alone:hover .mega-hoverview {
	margin-left:-16px;
	margin-top: 0px;
}
.mega-hover.notitle.alone:hover .mega-hoverview {
	margin-left:-16px;
	margin-top: -16px;
}
.mega-hover.notitle.alone:hover .mega-hoverlink {
	margin-right:-16px;
	margin-top: -16px;
}
.mega-hover:hover .mega-hoverlink:hover,  .mega-hover:hover .mega-hoverview:hover {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
	filter: alpha(opacity=60);
	-moz-opacity: 0.6;
	-khtml-opacity: 0.6;
	opacity: 0.6;
}
.mega-hover.notitle .mega-hoverlink,  .mega-hover.notitle .mega-hoverview {
	margin-top: -16px;
}


/*@media (max-width: 991px){
.megafolio-container li{width:50%;}
}*/

@media (max-width: 480px){
.megafolio-container li{width: 50%;}
}
/*@media (max-width: 767px){
.megafolio-container li{width: 50%;}
}*/
.fa-link{background: url(../images/link_clean.png) no-repeat; background-size:cover;  width:100%; height:100%; display:block;}