/*!
PRELOADERS
*/

/* General */
.loader-wrapper {background:#fff;position:fixed;right:0;top:0;z-index:10000;-moz-transition:all 600ms ease-in-out;-o-transition:all 600ms ease-in-out;-webkit-opacity:1;-webkit-transition:all 600ms ease-in-out;bottom:0;filter:alpha(opacity=100);left:0;opacity:1;overflow:hidden}
.loader-wrapper.loaded{-moz-opacity:0;-webkit-opacity:0;filter:alpha(opacity=0);opacity:0;visibility:hidden;zoom:1;z-index:1;}
.loader-wrapper span {display: none;}
.loader-wrapper img {position: fixed;top:50%;left:50%;max-width: 128px;max-height:128px;margin-left: -64px;margin-top: -128px;}

/* Circular Effect */
.loader-wrapper .loader-circular span:nth-child(2) {display: none;}
.loader-wrapper .loader-circular span:nth-child(1){display: block; animation:animate 1.5s linear infinite;clip:rect(0,80px,80px,40px);height:80px;width:80px;position:fixed;left:50%;margin-left:-40px;top:50%;margin-top:-80px}
.loader-wrapper .loader-circular span:nth-child(1):after{animation:animate2 1.5s ease-in-out infinite;clip:rect(0,80px,80px,40px);content:'';border-radius:50%;height:80px;width:80px;position:absolute}
@keyframes animate {0%{transform:rotate(0deg)}100%{transform:rotate(220deg)}}
@keyframes animate2 {0%{box-shadow:inset #DADADA 0 0 0 17px;transform:rotate(-140deg)}50%{box-shadow:inset #DADADA 0 0 0 2px}100%{box-shadow:inset #DADADA 0 0 0 17px;transform:rotate(140deg)}}

/* Crossing Circle */
.loader-wrapper .loader-crossing-circle span:nth-child(1), .loader-wrapper .loader-crossing-circle span:nth-child(2) {display: block; height:30px;width:30px;position:fixed;left:50%;margin-left:-50px;top:50%;margin-top:-30px;background: #DADADA;border-radius:999px;}
.loader-wrapper .loader-crossing-circle span:nth-child(1) {animation: cross-1 1.5s infinite linear;}
.loader-wrapper .loader-crossing-circle span:nth-child(2) {animation: cross-2 1.5s infinite linear;}
@keyframes cross-1 {0% {transform: translateX(0px); opacity: 1;}50% {transform: translateX(80px); opacity: 0.5;}100% {transform: translateX(0px); opacity: 1;}}
@keyframes cross-2 {0% {transform: translateX(80px); opacity: 1;}50% {transform: translateX(0px); opacity: 0.5;}100% {transform: translateX(80px); opacity: 1;}}

/* Ball */
.loader-wrapper .loader-ball span:nth-child(2) {display: none;}
.loader-wrapper .loader-ball span:nth-child(1) {display: block; background-color: #DADADA;position:fixed;left:50%;margin-left:-30px;top:50%;margin-top:-80px;border-radius: 100%;display: block;height: 60px;width: 60px;-webkit-animation: ball-scale 1s 0s ease-in-out infinite;animation: ball-scale 1s 0s ease-in-out infinite;}
@-webkit-keyframes ball-scale {0%{-webkit-transform:scale(0);transform:scale(0)}100%{-webkit-transform:scale(1);transform:scale(1);opacity:0}}
@keyframes ball-scale {0%{-webkit-transform:scale(0);transform:scale(0)}100%{-webkit-transform:scale(1);transform:scale(1);opacity:0}}

/* Cube */
.loader-wrapper .loader-cube {position: fixed;top:50%;left:50%;width: 60px;height:60px;margin-left: -30px;margin-top: -60px;}
.loader-wrapper .loader-cube span{display:block; width:33%;height:33%;background-color:#DADADA;float:left;-webkit-animation:sk-cubeGridScaleDelay 1.3s infinite ease-in-out;animation:sk-cubeGridScaleDelay 1.3s infinite ease-in-out}
.loader-wrapper .loader-cube span:nth-child(1){-webkit-animation-delay:.2s;animation-delay:.2s}
.loader-wrapper .loader-cube span:nth-child(2){-webkit-animation-delay:.3s;animation-delay:.3s}
.loader-wrapper .loader-cube span:nth-child(3){-webkit-animation-delay:.4s;animation-delay:.4s}
.loader-wrapper .loader-cube span:nth-child(4){-webkit-animation-delay:.1s;animation-delay:.1s}
.loader-wrapper .loader-cube span:nth-child(5){-webkit-animation-delay:.2s;animation-delay:.2s}
.loader-wrapper .loader-cube span:nth-child(6){-webkit-animation-delay:.3s;animation-delay:.3s}
.loader-wrapper .loader-cube span:nth-child(7){-webkit-animation-delay:0;animation-delay:0}
.loader-wrapper .loader-cube span:nth-child(8){-webkit-animation-delay:.1s;animation-delay:.1s}
.loader-wrapper .loader-cube span:nth-child(9){-webkit-animation-delay:.2s;animation-delay:.2s}
@-webkit-keyframes sk-cubeGridScaleDelay {
0%,70%,100%{-webkit-transform:scale3D(1,1,1);transform:scale3D(1,1,1)}
35%{-webkit-transform:scale3D(0,0,1);transform:scale3D(0,0,1)}
}
@keyframes sk-cubeGridScaleDelay {
0%,70%,100%{-webkit-transform:scale3D(1,1,1);transform:scale3D(1,1,1)}
35%{-webkit-transform:scale3D(0,0,1);transform:scale3D(0,0,1)}
}

/* Rotating Cube */
.loader-wrapper .loader-rotating-plane {position: fixed;top:50%;left:50%;width: 60px;height:60px;margin-left: -30px;margin-top: -60px;}
.loader-wrapper .loader-rotating-plane span:nth-child(1){display:block;width:100%;height:100%;background-color:#DADADA;margin:0 auto;-webkit-animation:rotateplane 1.2s infinite ease-in-out;animation:rotateplane 1.2s infinite ease-in-out}
@-webkit-keyframes rotateplane {
0%{-webkit-transform:perspective(120px)}
50%{-webkit-transform:perspective(120px) rotateY(180deg)}
100%{-webkit-transform:perspective(120px) rotateY(180deg) rotateX(180deg)}
}
@keyframes rotateplane {
0%{-webkit-transform:perspective(120px) rotateX(0deg) rotateY(0deg);transform:perspective(120px) rotateX(0deg) rotateY(0deg)}
50%{-webkit-transform:perspective(120px) rotateX(-180.1deg) rotateY(0deg);transform:perspective(120px) rotateX(-180.1deg) rotateY(0deg)}
100%{-webkit-transform:perspective(120px) rotateX(-180deg) rotateY(-179.9deg);transform:perspective(120px) rotateX(-180deg) rotateY(-179.9deg)}
}

/* Line Scale */
.loader-wrapper .loader-rectangle-bounce{position: fixed;top:50%;left:50%;height: 60px;width:70px;z-index: 10;display: inline-block;margin-left: -70px;margin-top: -40px;} 
.loader-wrapper .loader-rectangle-bounce span{height:100%;border-radius: 4px;width:7px;margin:0 3px 0 0;background-color:#DADADA;-webkit-animation:stretchdelay 1.2s infinite ease-in-out;animation:stretchdelay 1.2s infinite ease-in-out}
.loader-wrapper .loader-rectangle-bounce span:nth-child(1) {display: inline-block;}
.loader-wrapper .loader-rectangle-bounce span:nth-child(2){display: inline-block;-webkit-animation-delay:-1.1s;animation-delay:-1.1s}
.loader-wrapper .loader-rectangle-bounce span:nth-child(3){display: inline-block;-webkit-animation-delay:-1s;animation-delay:-1s}
.loader-wrapper .loader-rectangle-bounce span:nth-child(4){display: inline-block;-webkit-animation-delay:-.9s;animation-delay:-.9s}
.loader-wrapper .loader-rectangle-bounce span:nth-child(5){display: inline-block;-webkit-animation-delay:-.8s;animation-delay:-.8s}
@-webkit-keyframes stretchdelay {
0%,40%,100%{-webkit-transform:scaleY(0.4)}
20%{-webkit-transform:scaleY(1)}
}
@keyframes stretchdelay {
0%,40%,100%{transform:scaleY(0.4);-webkit-transform:scaleY(0.4)}
20%{transform:scaleY(1);-webkit-transform:scaleY(1)}
}

/* Three Bounce */
.loader-wrapper .loader-three-bounce {position: fixed;top:50%;left:50%;height: 60px;width:110px;z-index: 10;display: inline-block;margin-left: -80px;margin-top: -50px;}
.loader-wrapper .loader-three-bounce span{width:18px;height:18px;margin-right:14px; border-radius:100%;background-color:#DADADA;-webkit-animation:bouncedelay 1.4s infinite ease-in-out both;animation:bouncedelay 1.4s infinite ease-in-out both}
.loader-wrapper .loader-three-bounce span:nth-child(3) {display: inline-block;}
.loader-wrapper .loader-three-bounce span:nth-child(1){display:inline-block;-webkit-animation-delay:-.32s;animation-delay:-.32s}
.loader-wrapper .loader-three-bounce span:nth-child(2){display:inline-block;-webkit-animation-delay:-.16s;animation-delay:-.16s}
@-webkit-keyframes bouncedelay {
0%,80%,100%{-webkit-transform:scale(0)}
40%{-webkit-transform:scale(1)}
}
@keyframes bouncedelay {
0%,80%,100%{-webkit-transform:scale(0);transform:scale(0)}
40%{transform:scale(1);-webkit-transform:scale(1)}
}

/* Circle Rotating */
.loader-circle, .loader-circle::before {width:50px;height:50px;-webkit-border-radius:50%;-moz-border-radius:50%;border-radius:50%;background:none;-webkit-transform-origin:center center;-ms-transform-origin:center center;transform-origin:center center}
.loader-circle {width:50px;height:50px;margin-left:-25px;margin-top: -25px;position:absolute;top:50%;left:50%;-webkit-animation:preloader-outer 1.5s ease infinite;-moz-animation:preloader-outer 1.5s ease infinite;-o-animation:preloader-outer 1.5s ease infinite;animation:preloader-outer 1.5s ease infinite}
.loader-circle::before {content:"";display: block; -webkit-animation:preloader 3s ease infinite;-moz-animation:preloader 3s ease infinite;-o-animation:preloader 3s ease infinite;animation:preloader 3s ease infinite;border:2px solid #ccc;border-bottom:2px solid #000}
@-webkit-keyframes preloader-outer {
from{opacity:1;-webkit-transform:rotate(0deg)}
to{opacity:1;-webkit-transform:rotate(360deg)}
}
@keyframes preloader-outer {
from{opacity:1;transform:rotate(0deg)}
to{opacity:1;transform:rotate(360deg)}
}
@-webkit-keyframes preloader {
0%{opacity:.3}
50%{opacity:1}
100%{opacity:.3}
}
@keyframes preloader {
0%{opacity:.3}
50%{opacity:1}
100%{opacity:.3}
}