.ann {
    transition-duration: 200ms;
    transition-property: opacity, transform;
    transition-timing-function: ease-out;

}

.anim-left {
    transform: translate(-2000px);
    margin-right: 10px;
}

.anim-right {
    transform: translate(2000px);

}

.ann img {
    max-width: 100%;
}

.anim-by-g img {
    width: 70px;
}


.anim-by-g {
    opacity: 0;
    padding-top: 10px;
}


.animstyle {

}

.w-logo {
    width: 200px;
    margin-left: auto;
    margin-right: auto;
}

.anim-bubbles {
    width: 20px;
    margin-left: auto;
    margin-right: auto;
    opacity: 0;
    text-align: center;
}


.anim1-droplarge {
    width: 45px;
    position: absolute;
    right: 51%;
    top: 20%;
}

.anim1-dropmedium {
    position: absolute;
    right: 53.6%;
    width: 27px;
    top: 25%;
}

.anim-dropsmall {
    position: absolute;
    left: 45%;
    width: 40px;
    top: 13%;
}

.anim-start .anim-bubbles {
    opacity: 1;
    transition-delay: 1600ms;
    transition-duration: 500ms;
}

.anim-start .anim-by-g {
    opacity: 1;
    transition-delay: 2000ms;
    transition-duration: 1s;
}


.anim-start .anim-right {
    transition-duration: 1500ms;
    transform: translate(0, 0);
}

.anim-start .anim-left {
    transition-duration: 1500ms;
    transform: translate(0, 0);
}


.animstyle {
    position: relative;
}


@keyframes wobble {
    33% {
        transform: translateX(-5px);
    }
    66% {
        transform: translateX(5px);
    }
}


@keyframes up {
    0% {
        opacity: 0;
    }
    20%, 60% {
        opacity: 1;
    }
    100% {
        opacity: 0;
        transform: translateY(-80px);
    }
}


.splash-loading {
    height: 100%;
    overflow: hidden;

}

.splash-loading-hidden {
    display: none !important;
}