#loading {position:absolute; top:0; left:0; right:0; bottom:0; z-index:1; background:url(../img/loader_dark.gif) no-repeat center center #f5f5f5;}

#css3panels {overflow:hidden; position:relative; z-index:0;}
#css3panels .panel {width:25%; float:left; overflow:hidden;  border: 3px solid white; margin-top: -35px;
-webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; 
-webkit-box-shadow: 0 0 15px #000; -moz-box-shadow: 0 0 15px #000; box-shadow: 0 0 15px #000;
-webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; -o-transform-style: preserve-3d; -ms-transform-style: preserve-3d; transform-style: preserve-3d;
-webkit-transition: -webkit-box-shadow 0.2s ease-out; -moz-transition: -moz-box-shadow 0.2s ease-out; -ms-transition: -ms-box-shadow 0.2s ease-out; transition: box-shadow 0.2s ease-out;
-webkit-transform: rotate(7deg); -moz-transform: rotate(7deg); -ms-transform: rotate(7deg); }
#css3panels .panel img {-webkit-transition: opacity 0.4s ease-out,  -webkit-transform 0.8s ease-out; -moz-transition: opacity 0.4s ease-out,  -moz-transform 0.8s ease-out; -ms-transition: opacity 0.4s ease-out,  -ms-transform 0.8s ease-out; -o-transition: opacity 0.4s ease-out,  -o-transform 0.8s ease-out; transition: opacity 0.4s ease-out,  transform 0.8s ease-out;}

#css3panels .panel:hover {-webkit-box-shadow: 0 0 60px #000, 0 0 30px #000; -moz-box-shadow: 0 0 60px #000, 0 0 30px #000; box-shadow: 0 0 60px #000, 0 0 30px #000;}
#css3panels.cols-4 .panel {width:25%; margin-top: -35px;}
#css3panels.cols-4 .panel.first {width: 28%; margin-left: -7%;}
#css3panels.cols-4 .panel.last {width: 29%; margin-right: -4%;}
#css3panels.cols-3 .panel {width:33%; margin-top: -50px; }
#css3panels.cols-3 .panel.first {width: 36%; margin-left: -7%;}
#css3panels.cols-3 .panel.last {width: 37%; margin-right: -4%;}
#css3panels.cols-5 .panel {width:20%; margin-top: -35px; }
#css3panels.cols-5 .panel.first {width: 24%; margin-left: -7%;}
#css3panels.cols-5 .panel.last {width: 23%; margin-right: -4%;} 

#css3panels .panel img {max-width:none; position:relative; vertical-align:top;
-webkit-transform: translate3d(0, -60px,0);
-moz-transform:translatey(-60px) translatex(0px);
-ms-transform:translatey(-60px) translatex(0px);
-o-transform:translatey(-60px) translatex(0px);
transform: translate3d(0, -60px,0); }
#css3panels .panel img:hover {
-webkit-transform: translate3d(-100px, -60px,0);
-moz-transform: translatey(-60px) translatex(-100px);
-o-transform: translatey(-60px) translatex(-100px);
-ms-transform: translatey(-60px) translatex(-100px);
transform: translate3d(-100px, -60px,0);}

#css3panels .panel img.grayscale {opacity:0; filter:alpha(opacity=0); z-index:998;}
#css3panels .panel:hover img.grayscale {opacity:1; filter:alpha(opacity=100);}

#css3panels .inner-panel { margin-top:90px; position:relative;
-webkit-transform: rotate(-7deg);
-moz-transform: rotate(-7deg);
-ms-transform: rotate(-7deg);
-o-transform: rotate(-7deg);
transform: rotate(-7deg);
}
/*
#css3panels .caption {position: absolute; top: 450px; right: -100px; color: #e9e9e9; padding: 10px 300px 10px 20px; width: 400px; margin-right: -300px; z-index: 999; opacity:0.7; filter:alpha(opacity=70);
font-weight:500;
-webkit-transition: all 0.5s ease-out; -moz-transition: all 0.5s ease-out; -ms-transition: all 0.5s ease-out; -o-transition: all 0.5s ease-out; transition: all 0.5s ease-out;}
*/
#css3panels .caption {position: absolute; top: 450px; left:20%; color: #e9e9e9; padding: 10px 300px 10px 20px; width: 400px; z-index: 999; opacity:0.7; filter:alpha(opacity=70); font-weight:500; -webkit-transition: all 0.5s ease-out; -moz-transition: all 0.5s ease-out; -ms-transition: all 0.5s ease-out; -o-transition: all 0.5s ease-out; transition: all 0.5s ease-out;}
#css3panels .first .caption {left: 30%;}
#css3panels .caption.upper {top:350px;}
#css3panels .caption:before { content:""; position:absolute; width:100%; height:100%; background:#000; background:rgba(0,0,0,0.9); right: 0; top: 0; z-index: -1;
-webkit-transform: skew(-8deg); -moz-transform: skew(-8deg); -o-transform: skew(-8deg); -ms-transform: skew(-8deg); transform: skew(-8deg); }

#css3panels .caption .title {margin:0; line-height:1.3;}

#css3panels .panel:hover .caption {opacity:1; filter:alpha(opacity=100);}