.logo-animate {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: -webkit-calc(100vh);
    height: -moz-calc(100vh);
    height: calc(100vh);
    z-index: 100001;
    overflow: hidden;
    background-color: #fff
}

.logo-animate .logo-animate-img {
    position: absolute;
    width: 6rem;
    height: 7rem;
    background: url(../img/logo_css_sprites_400_600.png) no-repeat;
    -webkit-background-size: 310rem 100%;
    background-size: 310rem 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translateX(-50%) translateY(-50%) !important;
    -moz-transform: translateX(-50%) translateY(-50%) !important;
    -ms-transform: translateX(-50%) translateY(-50%) !important;
    transform: translateX(-50%) translateY(-50%) !important
}

.logo-animate .logo-animate-img.logo-animate-0 {
    background-position: -0.1rem -0.1rem
}

.logo-animate .logo-animate-img.logo-animate-1 {
    background-position: -6.3rem -0.1rem
}

.logo-animate .logo-animate-img.logo-animate-2 {
    background-position: -12.5rem -0.1rem
}

.logo-animate .logo-animate-img.logo-animate-3 {
    background-position: -18.7rem -0.1rem
}

.logo-animate .logo-animate-img.logo-animate-4 {
    background-position: -24.9rem -0.1rem
}

.logo-animate .logo-animate-img.logo-animate-5 {
    background-position: -31.1rem -0.1rem
}

.logo-animate .logo-animate-img.logo-animate-6 {
    background-position: -37.3rem -0.1rem
}

.logo-animate .logo-animate-img.logo-animate-7 {
    background-position: -43.5rem -0.1rem
}

.logo-animate .logo-animate-img.logo-animate-8 {
    background-position: -49.7rem -0.1rem
}

.logo-animate .logo-animate-img.logo-animate-9 {
    background-position: -55.9rem -0.1rem
}

.logo-animate .logo-animate-img.logo-animate-10 {
    background-position: -62.1rem -0.1rem
}

.logo-animate .logo-animate-img.logo-animate-11 {
    background-position: -68.3rem -0.1rem
}

.logo-animate .logo-animate-img.logo-animate-12 {
    background-position: -74.5rem -0.1rem
}

.logo-animate .logo-animate-img.logo-animate-13 {
    background-position: -80.7rem -0.1rem
}

.logo-animate .logo-animate-img.logo-animate-14 {
    background-position: -86.9rem -0.1rem
}

.logo-animate .logo-animate-img.logo-animate-15 {
    background-position: -93.1rem -0.1rem
}

.logo-animate .logo-animate-img.logo-animate-16 {
    background-position: -99.3rem -0.1rem
}

.logo-animate .logo-animate-img.logo-animate-17 {
    background-position: -105.5rem -0.1rem
}

.logo-animate .logo-animate-img.logo-animate-18 {
    background-position: -111.7rem -0.1rem
}

.logo-animate .logo-animate-img.logo-animate-19 {
    background-position: -117.9rem -0.1rem
}

.logo-animate .logo-animate-img.logo-animate-20 {
    background-position: -124.1rem -0.1rem
}

.logo-animate .logo-animate-img.logo-animate-21 {
    background-position: -130.3rem -0.1rem
}

.logo-animate .logo-animate-img.logo-animate-22 {
    background-position: -136.5rem -0.1rem
}

.logo-animate .logo-animate-img.logo-animate-23 {
    background-position: -142.7rem -0.1rem
}

.logo-animate .logo-animate-img.logo-animate-24 {
    background-position: -148.9rem -0.1rem
}

.logo-animate .logo-animate-img.logo-animate-25 {
    background-position: -155.1rem -0.1rem
}

.logo-animate .logo-animate-img.logo-animate-26 {
    background-position: -161.3rem -0.1rem
}

.logo-animate .logo-animate-img.logo-animate-27 {
    background-position: -167.5rem -0.1rem
}

.logo-animate .logo-animate-img.logo-animate-28 {
    background-position: -173.7rem -0.1rem
}

.logo-animate .logo-animate-img.logo-animate-29 {
    background-position: -179.9rem -0.1rem
}

.logo-animate .logo-animate-img.logo-animate-30 {
    background-position: -186.1rem -0.1rem
}

.logo-animate .logo-animate-img.logo-animate-31 {
    background-position: -192.3rem -0.1rem
}

.logo-animate .logo-animate-img.logo-animate-32 {
    background-position: -198.5rem -0.1rem
}

.logo-animate .logo-animate-img.logo-animate-33 {
    background-position: -204.7rem -0.1rem
}

.logo-animate .logo-animate-img.logo-animate-34 {
    background-position: -210.9rem -0.1rem
}

.logo-animate .logo-animate-img.logo-animate-35 {
    background-position: -217.1rem -0.1rem
}

.logo-animate .logo-animate-img.logo-animate-36 {
    background-position: -223.3rem -0.1rem
}

.logo-animate .logo-animate-img.logo-animate-37 {
    background-position: -229.5rem -0.1rem
}

.logo-animate .logo-animate-img.logo-animate-38 {
    background-position: -235.7rem -0.1rem
}

.logo-animate .logo-animate-img.logo-animate-39 {
    background-position: -241.9rem -0.1rem
}

.logo-animate .logo-animate-img.logo-animate-40 {
    background-position: -248.1rem -0.1rem
}

.logo-animate .logo-animate-img.logo-animate-41 {
    background-position: -254.3rem -0.1rem
}

.logo-animate .logo-animate-img.logo-animate-42 {
    background-position: -260.5rem -0.1rem
}

.logo-animate .logo-animate-img.logo-animate-43 {
    background-position: -266.7rem -0.1rem
}

.logo-animate .logo-animate-img.logo-animate-44 {
    background-position: -272.9rem -0.1rem
}

.logo-animate .logo-animate-img.logo-animate-45 {
    background-position: -279.1rem -0.1rem
}

.logo-animate .logo-animate-img.logo-animate-46 {
    background-position: -285.3rem -0.1rem
}

.logo-animate .logo-animate-img.logo-animate-47 {
    background-position: -291.5rem -0.1rem
}

.logo-animate .logo-animate-img.logo-animate-48 {
    background-position: -297.7rem -0.1rem
}

.logo-animate .logo-animate-img.logo-animate-49 {
    background-position: -303.9rem -0.1rem
}

.logo-animate .logo-animate-bg {
    position: absolute;
    width: 100%;
    height: 100%
}

.logo-animate .logo-animate-bg img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

.logo-animate .logo-img {
    position: absolute;
    width: 14rem;
    height: 12rem;
    display: none;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translateX(-50%) translateY(-50%) !important;
    -moz-transform: translateX(-50%) translateY(-50%) !important;
    -ms-transform: translateX(-50%) translateY(-50%) !important;
    transform: translateX(-50%) translateY(-50%) !important
}

.logo-animate .logo-img img {
    width: 100%;
    height: 100%
}

.logo-animate .logo-img.move-top {
    width: 4rem;
    height: auto;
    top: 0.5rem;
    -webkit-transition: all 600ms linear;
    -moz-transition: all 600ms linear;
    transition: all 600ms linear
}

.logo-animate .text {
    width: 100%;
    position: absolute;
    bottom: 33%;
    text-align: center;
    position: absolute;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    opacity: 0;
    font-size: 0.48rem
}

.logo-animate .text.animate-opacity {
    -webkit-animation: textOpacity 1500ms ease-in-out forwards;
    -moz-animation: textOpacity 1500ms ease-in-out forwards;
    animation: textOpacity 1500ms ease-in-out forwards
}

@media screen and (max-width: 750px) {
    .logo-animate .logo-animate-bg {
        position: absolute;
        width: 100%;
        height: 100%
    }

    .logo-animate .logo-animate-bg img {
        width: 100%;
        height: 100%;
        -o-object-fit: cover;
        object-fit: cover
    }

    .logo-animate .logo-img {
        position: absolute;
        width: 6rem;
        height: 4rem;
        display: none
    }

    .logo-animate .logo-img img {
        width: 100%;
        height: 100%
    }

    @-webkit-keyframes moveTop {
        0% {
            -webkit-transform: translateY(0);
            transform: translateY(0)
        }
        100% {
            -webkit-transform: translateY(-50%);
            transform: translateY(-50%)
        }
    }@-moz-keyframes moveTop {
         0% {
             -moz-transform: translateY(0);
             transform: translateY(0)
         }
         100% {
             -moz-transform: translateY(-50%);
             transform: translateY(-50%)
         }
     }@keyframes moveTop {
          0% {
              -webkit-transform: translateY(0);
              -moz-transform: translateY(0);
              transform: translateY(0)
          }
          100% {
              -webkit-transform: translateY(-50%);
              -moz-transform: translateY(-50%);
              transform: translateY(-50%)
          }
      }.logo-animate .text {
           width: 100%;
           position: absolute;
           bottom: 33%;
           text-align: center;
           position: absolute;
           left: 50%;
           -webkit-transform: translateX(-50%);
           -moz-transform: translateX(-50%);
           -ms-transform: translateX(-50%);
           transform: translateX(-50%);
           opacity: 0
       }

    .logo-animate .text.animate-opacity {
        -webkit-animation: textOpacity 1500ms ease-in-out forwards;
        -moz-animation: textOpacity 1500ms ease-in-out forwards;
        animation: textOpacity 1500ms ease-in-out forwards
    }
}

@-webkit-keyframes textOpacity {
    0% {
        opacity: 0
    }
    50% {
        opacity: 1
    }
    100% {
        opacity: 0
    }
}

@-moz-keyframes textOpacity {
    0% {
        opacity: 0
    }
    50% {
        opacity: 1
    }
    100% {
        opacity: 0
    }
}

@keyframes textOpacity {
    0% {
        opacity: 0
    }
    50% {
        opacity: 1
    }
    100% {
        opacity: 0
    }
}