#ajax-loading-screen .reveal-1 { background-color: #1a1c1e; }#ajax-loading-screen .reveal-2 { background-color: #131314;}

#ajax-loading-screen{background-color:#fff; width:100%; height:100%; position:fixed; top:0; left:0; display:none; z-index:1000000000}

#ajax-loading-screen .reveal-1, #ajax-loading-screen .reveal-2{position:absolute; left:100%; top:0; width:100%; height:100%}

#ajax-loading-screen[data-effect*="horizontal_swipe"]{background-color:transparent!important; left:-100%}

body[data-ajax-transitions="true"] #ajax-loading-screen[data-method="standard"][data-effect*="horizontal_swipe"]{display:block}

body[data-ajax-transitions="true"][data-apte="horizontal_swipe_basic"] #ajax-loading-screen .reveal-2 { display: none; }

#ajax-loading-screen.in-from-right{left:0%}

.no-cssanimations #ajax-loading-screen.loaded .reveal-1, .no-cssanimations #ajax-loading-screen.loaded .reveal-2{display:none}

#ajax-loading-screen.loaded .reveal-1{backface-visibility: hidden; -webkit-animation:anim-effect-2-2 1.85s cubic-bezier(0.67,0,0.3,1) forwards; animation:anim-effect-2-2 1.85s cubic-bezier(0.67,0,0.3,1) forwards}

#ajax-loading-screen.loaded .reveal-2{backface-visibility: hidden; -webkit-animation:anim-effect-2-1 1.85s cubic-bezier(0.67,0,0.3,1) forwards; animation:anim-effect-2-1 1.85s cubic-bezier(0.67,0,0.3,1) forwards}

#ajax-loading-screen.loaded.in-from-right .reveal-1{-webkit-animation:anim-effect-2-1 1.85s cubic-bezier(0.67,0,0.3,1) forwards; animation:anim-effect-2-1 1.85s cubic-bezier(0.67,0,0.3,1) forwards}

body[data-apte="horizontal_swipe_basic"] #ajax-loading-screen.loaded.in-from-right .reveal-1{
  -webkit-animation:anim-effect-2-1 1.1s cubic-bezier(0.215, 0.61, 0.355, 1) forwards; 
  animation:anim-effect-2-1 1.1s cubic-bezier(0.215, 0.61, 0.355, 1) forwards
}

#ajax-loading-screen.loaded.in-from-right .reveal-2{-webkit-animation:anim-effect-2-2 1.85s cubic-bezier(0.67,0,0.3,1) forwards; animation:anim-effect-2-2 1.85s cubic-bezier(0.67,0,0.3,1) forwards}

body[data-ajax-transitions="true"] #ajax-loading-screen[data-effect*="horizontal_swipe"].hidden{display:none}
body[data-ajax-transitions="true"] #ajax-loading-screen[data-effect*="horizontal_swipe"].hidden.loaded.in-from-right { display: block;}

@-webkit-keyframes anim-effect-2-1{0%{-ms-transform:translateX(0); -webkit-transform:translate3d(0,0,0); transform:translate3d(0,0,0)}
30%, 
100%{-ms-transform:translateX(-100%); -webkit-transform:translate3d(-100%,0,0); transform:translate3d(-100%,0,0); -webkit-animation-timing-function:cubic-bezier(0.67,0,0.3,1); animation-timing-function:cubic-bezier(0.67,0,0.3,1)}
}

@keyframes anim-effect-2-1{0%{-ms-transform:translateX(0); -webkit-transform:translate3d(0,0,0); transform:translate3d(0,0,0)}
30%, 
100%{-ms-transform:translateX(-100%); -webkit-transform:translate3d(-100%,0,0); transform:translate3d(-100%,0,0); -webkit-animation-timing-function:cubic-bezier(0.67,0,0.3,1); animation-timing-function:cubic-bezier(0.67,0,0.3,1)}
}

@-webkit-keyframes anim-effect-2-2{0%,14.5%{-ms-transform:translateX(0); -webkit-transform:translate3d(0,0,0); transform:translate3d(0,0,0)}
34.5%, 
100%{-ms-transform:translateX(-100%); -webkit-transform:translate3d(-100%,0,0); transform:translate3d(-100%,0,0); -webkit-animation-timing-function:cubic-bezier(0.67,0,0.3,1); animation-timing-function:cubic-bezier(0.67,0,0.3,1)}
}

@keyframes anim-effect-2-2{0%,14.5%{-ms-transform:translate3d(0,0,0); -webkit-transform:translate3d(0,0,0); transform:translate3d(0,0,0)}
34.5%, 
100%{-ms-transform:translate3d(-100%,0,0); -webkit-transform:translate3d(-100%,0,0); transform:translate3d(-100%,0,0); -webkit-animation-timing-function:cubic-bezier(0.67,0,0.3,1); animation-timing-function:cubic-bezier(0.67,0,0.3,1)}
}

body[data-ajax-transitions="true"] #ajax-loading-screen[data-method="standard"], 
body[data-ajax-transitions="true"] #ajax-loading-screen[data-effect*="horizontal_swipe"][data-method="ajax"],
body[data-ajax-transitions="true"] #ajax-loading-screen[data-method="standard"] .loading-icon{display:block; opacity:1}

#ajax-loading-screen .loading-icon{background-repeat:no-repeat; background-position:center center; display:block; position:absolute; opacity:0; top:0; left:0; width:100%; height:100%}

.default-loading-icon{    top:50%;     border-radius:100%;     height:40px;     width:40px;     margin:0 auto;     display:block;     position:relative;      border:3px solid #e5e5e5;     margin-top:-20px}

.loading-icon .material-icon .spinner{  width:60px;   height:60px;   position:absolute;   top:0;   left:0;   right:0;   bottom:0;   margin:auto}
.loading-icon .material-icon .spinner{-webkit-animation:material-rotate-all 1s linear infinite; animation:material-rotate-all 1s linear infinite}

.loading-icon .material-icon .spinner .right-side, 
.loading-icon .material-icon .spinner .left-side{-webkit-animation:material-fade-in-first 1.2s linear infinite alternate; animation:material-fade-in-first 1.2s linear infinite alternate}
.loading-icon .material-icon .spinner.color-2 .right-side, 
.loading-icon .material-icon .spinner.color-2 .left-side{-webkit-animation:material-fade-in-second 1.2s linear infinite alternate; animation:material-fade-in-second 1.2s linear infinite alternate}

.loading-icon .material-icon .right-side, .loading-icon .material-icon .left-side{  width:50%;   height:100%;   position:absolute;   top:0;   overflow:hidden}

.loading-icon .material-icon .left-side{left:0}
.loading-icon .material-icon .right-side{right:0}

.loading-icon .material-icon .bar{  width:100%;   height:100%;   -moz-border-radius:200px 0 0 200px;   -webkit-border-radius:200px;   border-radius:200px 0 0 200px;   border:6px solid #666;   position:relative}
.loading-icon .material-icon .bar:after{  content:"";   width:6px;   height:6px;   display:block;   background:#666;   position:absolute;   -moz-border-radius:6px;   -webkit-border-radius:6px;   border-radius:6px}
.loading-icon .material-icon .right-side .bar{  -moz-border-radius:0 200px 200px 0;   -webkit-border-radius:0;   border-radius:0 200px 200px 0;   border-left:none;   -webkit-transform:rotate(-10deg);   -webkit-transform-origin:left center;   transform:rotate(-10deg);   transform-origin:left center;   -webkit-animation:material-rotate-right 0.75s linear infinite alternate;   animation:material-rotate-right 0.75s linear infinite alternate}
.loading-icon .material-icon .right-side .bar:after{  bottom:-6px;   left:-3px}
.loading-icon .material-icon .left-side .bar{  border-right:none;   -webkit-transform:rotate(10deg);   transform:rotate(10deg);   -webkit-transform-origin:right center;   transform-origin:right center;   -webkit-animation:material-rotate-left 0.75s linear infinite alternate;   animation:material-rotate-left 0.75s linear infinite alternate}
.loading-icon .material-icon .left-side .bar:after{  bottom:-6px;   right:-3px}

@keyframes material-rotate-left{  to{    transform:rotate(30deg)}
  from{    transform:rotate(175deg)}
}
@keyframes material-rotate-right{  from{    transform:rotate(-175deg)}
  to{    transform:rotate(-30deg)}
}
@keyframes material-rotate-all{  from{    transform:rotate(0deg)}
  to{    transform:rotate(-360deg)}
}
@keyframes material-fade-in-first{  from{  opacity:1}
  to{  opacity:0}
}
@keyframes material-fade-in-second{  from{  opacity:0}
  to{  opacity:1}
}
.loading-icon .material-icon{top:50%; height:65px;     width:65px;     position:relative;     margin:-32px auto 0 auto;     display:block}

.default-loading-icon:before{position:absolute; content:""; border-color:rgba(0,0,0,1) transparent transparent;     border-radius:100%;     border-style:solid;     border-width:3px;     display:block;     height:100%;     width:100%;     top:-3px;     left:-3px}

.loading-icon.spin, .portfolio-loading.spin, .pp_loaderIcon.spin, .default-loading-icon.spin{animation:2s cubic-bezier(0.63,0.045,0.34,1) 0s normal none infinite spinning_animation; -webkit-animation:2s cubic-bezier(0.63,0.045,0.34,1) 0s normal none infinite spinning_animation}

.default-skin-loading-icon{width:100%; height:100%; background-position:center; display:block; background-repeat:no-repeat; background-image:url("img/icons/loading-white-bg.gif")}

@keyframes spinning_animation{0%{ transform:scale(1) rotate(0deg);  -o-transform:scale(1) rotate(0deg)}
50%{ transform:scale(0.8) rotate(360deg);  -o-transform:scale(0.8) rotate(360deg)}
100%{ transform:scale(1) rotate(720deg);  -o-transform:scale(1) rotate(720deg)}
}

@-webkit-keyframes spinning_animation{0%{ -webkit-transform:scale(1) rotate(0deg)}
50%{ -webkit-transform:scale(0.8) rotate(360deg)}
100%{ -webkit-transform:scale(1) rotate(720deg)}

}

@keyframes bounce_in_animation{0%{ transform:scale(0,0);  -o-transform:scale(0,0)}
20%{ transform:scale(1.4,1.4);  -o-transform:scale(1.4,1.4)}
50%{ transform:scale(0.8,0.8);  -o-transform:scale(0.8,0.8)}
85%{ transform:scale(1.1,1.1);  -o-transform:scale(1.1,1.1)}
100%{ transform:scale(1,1);  -o-transform:scale(1,1)}
}

@-webkit-keyframes bounce_in_animation{0%{ -webkit-transform:scale(0,0)}
20%{ -webkit-transform:scale(1.4,1.4)}
50%{ -webkit-transform:scale(0.8,0.8)}
85%{ -webkit-transform:scale(1.1,1.1)}
100%{ -webkit-transform:scale(1,1)}
}

@keyframes grow_in_animation{0%{ transform:scale(0,0);  -o-transform:scale(0,0)}
100%{ transform:scale(1,1);  -o-transform:scale(1,1)}
}

@-webkit-keyframes grow_in_animation{0%{ -webkit-transform:scale(0,0)}
100%{ -webkit-transform:scale(1,1)}
}

#ajax-loading-screen[data-effect="center_mask_reveal"]{background-color:transparent!important}

body[data-ajax-transitions="true"] #ajax-loading-screen[data-effect="center_mask_reveal"].hidden{display:none}

#ajax-loading-screen[data-effect="center_mask_reveal"] span{ position:absolute;  background:#fff;  z-index:100;  -webkit-transition:0.8s cubic-bezier(0.12,0.75,0.4,1) !important;  transition:0.8s cubic-bezier(0.12,0.75,0.4,1) !important}

#ajax-loading-screen[data-effect="center_mask_reveal"].set-to-fade span{width:100%; height:100%; top:0; left:0; transform:none!important; -webkit-transform:none!important}

#ajax-loading-screen .mask-top{ top:0%;  left:0;  height:50%;  width:100%}

#ajax-loading-screen.loaded .mask-top{ -webkit-transform:translateY(-100%) translateZ(0);  -ms-transform:translateY(-100%) translateZ(0);  transform:translateY(-100%) translateZ(0)}

#ajax-loading-screen .mask-right{ top:0;  right:0;  height:100%;  width:50%}

#ajax-loading-screen.loaded .mask-right{ -webkit-transform:translateX(100%) translateZ(0);  -ms-transform:translateX(100%) translateZ(0);  transform:translateX(100%) translateZ(0)}

#ajax-loading-screen .mask-bottom{ bottom:0%;  right:0;  height:50%;  width:100%}

#ajax-loading-screen.loaded .mask-bottom{ -webkit-transform:translateY(100%) translateZ(0);  -ms-transform:translateY(100%) translateZ(0);  transform:translateY(100%) translateZ(0)}

#ajax-loading-screen .mask-left{ top:0;  left:0;  height:100%;  width:50%}

#ajax-loading-screen.loaded .mask-left{ -webkit-transform:translateX(-100%) translateZ(0);  -ms-transform:translateX(-100%) translateZ(0);  transform:translateX(-100%) translateZ(0)}