113 lines
2.1 KiB
CSS
113 lines
2.1 KiB
CSS
#preloader {
|
|
background-color: #35363b;
|
|
}
|
|
|
|
.mainContent {
|
|
opacity: 1;
|
|
visibility: visible;
|
|
-webkit-transition: opacity 400ms ease-out;
|
|
-moz-transition: opacity 400ms ease-out;
|
|
transition: opacity 400ms ease-out;
|
|
}
|
|
|
|
#overlay {
|
|
position: fixed;
|
|
z-index: 99;
|
|
top: -1000%;
|
|
left: 0;
|
|
right: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
background-color: #000;
|
|
opacity: 0;
|
|
-webkit-transition: top 0s ease 0.35s, opacity 0.35s ease;
|
|
-moz-transition: top 0s ease 0.35s, opacity 0.35s ease;
|
|
transition: top 0s ease 0.35s, opacity 0.35s ease;
|
|
}
|
|
|
|
.loading #preloader {
|
|
display: block;
|
|
}
|
|
|
|
.loading .mainContent {
|
|
opacity: 0;
|
|
visibility: hidden;
|
|
}
|
|
|
|
#preloader {
|
|
display: none;
|
|
position: fixed;
|
|
left: 0;
|
|
top: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
z-index: 9999;
|
|
}
|
|
|
|
#preloader .preload-text {
|
|
display: none;
|
|
}
|
|
|
|
#preloader .preload-icon {
|
|
width: 70px;
|
|
height: 70px;
|
|
display: inline-block;
|
|
padding: 0px;
|
|
text-align: left;
|
|
position: absolute;
|
|
left: 50%;
|
|
top: 50%;
|
|
margin-left: -35px;
|
|
margin-top: -35px;
|
|
}
|
|
|
|
#preloader .preload-icon span {
|
|
position: absolute;
|
|
display: inline-block;
|
|
width: 70px;
|
|
height: 70px;
|
|
border-radius: 100%;
|
|
background: #000000;
|
|
-webkit-animation: preloader 1.6s linear infinite;
|
|
-moz-animation: preloader 1.6s linear infinite;
|
|
animation: preloader 1.6s linear infinite;
|
|
}
|
|
|
|
#preloader .preload-icon span:last-child {
|
|
-webkit-animation-delay: -0.8s;
|
|
-moz-animation-delay: -0.8s;
|
|
animation-delay: -0.8s;
|
|
}
|
|
|
|
@-webkit-keyframes preloader {
|
|
0% {
|
|
-webkit-transform: scale(0, 0);
|
|
opacity: 0.5;
|
|
}
|
|
100% {
|
|
-webkit-transform: scale(1, 1);
|
|
opacity: 0;
|
|
}
|
|
}
|
|
|
|
@-moz-keyframes preloader {
|
|
0% {
|
|
-moz-transform: scale(0, 0);
|
|
opacity: 0.5;
|
|
}
|
|
100% {
|
|
-moz-transform: scale(1, 1);
|
|
opacity: 0;
|
|
}
|
|
}
|
|
|
|
@keyframes preloader {
|
|
0% {
|
|
transform: scale(0, 0);
|
|
opacity: 0.5;
|
|
}
|
|
100% {
|
|
transform: scale(1, 1);
|
|
opacity: 0;
|
|
}
|
|
} |