.loader-hidden {
display: none !important;
}
.body-no-scroll {
overflow: hidden !important;
height: 100vh !important;
position: fixed;
width: 100%;
}
.loader-container {
z-index: 999999;
width: 100%;
height: 100svh;
position: relative;
display: flex;
justify-content: center;
align-items: center;
background: #1E1612;
}
.logo {
position: absolute;
width: 172px;
height: 186px;
opacity: 1;
z-index: 2;
}
.logo-container {
position: absolute;
width: 172px;
height: 186px;
background: linear-gradient(-30deg, #4D382F 21%, #6A4C3E 34%, #8C6B59 45%, #4D382F 70%);
background-size: 100% 400%;
background-position: 0% 0%;
animation: 2.5s moveBg .7s ease-in-out forwards;
-webkit-mask-image: url('data:image/svg+xml;utf8,');
-webkit-mask-repeat: no-repeat;
-webkit-mask-position: center;
-webkit-mask-size: contain;
mask-image:url('data:image/svg+xml;utf8,');
mask-repeat: no-repeat;
mask-position: center;
mask-size: contain;
z-index: 1;
}
.eye {
animation: 1s blink .5s ease-in-out forwards;
}
@keyframes blink {
0% { fill: #4D382F; }
100% { fill: #D7D6B8; }
}
@keyframes moveBg {
0% { background-position: 0% 0%; opacity: 1; }
100% { background-position: 0% 100%; opacity: 1; }
}
@media (max-width: 767px) {
.loader-container {
align-items: flex-start;
}
.logo {
width: 135px;
height: 145px;
top: 170px;
}
.logo-container {
width: 135px;
height: 145px;
top: 170px;
}
}