#de-loader {
  position: fixed;
  z-index: 99999999999999;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background:#000 url(../images/bg-load.webp) center top no-repeat;
  background-size:cover;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
}

.dark-scheme #de-loader{
  background: var(--bg-dark-1);
}

/* Declate color shifting animation */
 @keyframes colorShift {
                0%, 100% {
                    background: #cabaa6;
                }

                33% {
                    background: #cbb397;
                }

                66% {
                    background: #d4c5b3;
                }
            }

            /* Declare border pulse animation */
@keyframes borderPulse {
                0% {
                    box-shadow: inset 0px 0px 0px 5px rgba(255, 255, 255,.4), 0px 0px 0px 0px rgba(212,197,179,0.7);
                }

                100% {
                    box-shadow: inset 0px 0px 0px 3px rgba(212,197,179,.2), 0px 0px 0px 10px rgba(255,255,255,0);
                }
            }

            /* CSS */
            
@-webkit-keyframes floatUp {
            0% {
                top: 100vh;
                opacity: 0;
            }

            25% {
                opacity: 1;
            }

            50% {
                top: 0vh;
                opacity: .8;
            }

            75% {
                opacity: 1;
            }

            100% {
                top: -100vh;
                opacity: 0;
            }
        }

        @-moz-keyframes floatUp {
            0% {
                top: 100vh;
                opacity: 0;
            }

            25% {
                opacity: 1;
            }

            50% {
                top: 0vh;
                opacity: .8;
            }

            75% {
                opacity: 1;
            }

            100% {
                top: -100vh;
                opacity: 0;
            }
        }

        @-o-keyframes floatUp {
            0% {
                top: 100vh;
                opacity: 0;
            }

            25% {
                opacity: 1;
            }

            50% {
                top: 0vh;
                opacity: .8;
            }

            75% {
                opacity: 1;
            }

            100% {
                top: -100vh;
                opacity: 0;
            }
        }

        @keyframes floatUp {
            0% {
                top: 100vh;
                opacity: 0;
            }

            25% {
                opacity: 1;
            }

            50% {
                top: 0vh;
                opacity: .8;
            }

            75% {
                opacity: 1;
            }

            100% {
                top: -100vh;
                opacity: 0;
            }
        }
        
         @keyframes nieve {
            from {
                top: -100px;
            }

            to {
                top: 1200px;
            }
        }
        @keyframes copos {
            0% {
                transform: rotate(0deg) translate(0px, 0px);
            }

            100% {
                transform: rotate(720deg) translate(0px, 100px);
            }
        }