@keyframes anmcopy
{
    0%
    {
        opacity: 1; 

        stroke-dashoffset: 2000;
        fill: transparent;
    }
    40%
    {
        stroke-dashoffset: 2000;
        fill: transparent;
    }
    50%
    {
        fill: transparent;
    }
    100%
    {
        stroke-dashoffset: 0;
        fill: #fff;
    }
}

@keyframes anmcopy2
{
    0%
    {
        transform: scale(.9); 

        opacity: 0;

        -webkit-filter: blur(80px);
                filter: blur(80px);
    }
    40%
    {
        transform: scale(.95); 

        opacity: .2;

        -webkit-filter: blur(60px);
                filter: blur(60px);
    }
    80%
    {
        transform: scale(1); 

        opacity: .7;

        -webkit-filter: blur(40px);
                filter: blur(40px);
    }
    100%
    {
        transform: scale(1); 

        opacity: 1;

        -webkit-filter: blur(0px);
                filter: blur(0px);
    }
}

@keyframes sdb
{
    0%
    {
        opacity: 0;
    }
    30%
    {
        opacity: 1;
    }
    60%
    {
        opacity: 0; 
        box-shadow: 0 0 0 60px rgba(255, 255, 255, .1);
    }
    100%
    {
        opacity: 0;
    }
}

.anim_rise .anim_elm
{
    transition: all 1s ease;
    transform: translate3d(0, 40px, 0); 

    opacity: 0;
}

.anim_rise .anim_elm.is-act
{
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0); 

    opacity: 1;
}

.anim_bounce .anim_elm
{
    -webkit-transition: all .8s cubic-bezier(.68, -.55, .265, 1.55);
            transition: all .8s cubic-bezier(.68, -.55, .265, 1.55); 
    -webkit-transform: scale(0);
            transform: scale(0);
}

.anim_bounce .anim_elm.is-act
{
    -webkit-transform: scale(1);
            transform: scale(1);
}

.anim_3 .anim_elm
{
    -webkit-transition: opacity 1.8s cubic-bezier(.215, .61, .355, 1), -webkit-transform 1.8s cubic-bezier(.215, .61, .355, 1);
            transition: opacity 1.8s cubic-bezier(.215, .61, .355, 1), -webkit-transform 1.8s cubic-bezier(.215, .61, .355, 1);
            transition: opacity 1.8s cubic-bezier(.215, .61, .355, 1), transform 1.8s cubic-bezier(.215, .61, .355, 1);
            transition: opacity 1.8s cubic-bezier(.215, .61, .355, 1), transform 1.8s cubic-bezier(.215, .61, .355, 1), -webkit-transform 1.8s cubic-bezier(.215, .61, .355, 1); 
    -webkit-transform: scale3d(1.15, 1.15, 1) rotate3d(-1, -3, -1, 20deg) translate3d(-70%, 5%, -100px);
            transform: scale3d(1.15, 1.15, 1) rotate3d(-1, -3, -1, 20deg) translate3d(-70%, 5%, -100px);

    opacity: 0;
}

.anim_3 .anim_elm.is-act
{
    -webkit-transform: scale3d(1, 1, 1) rotate3d(0, 0, 0, 0) translate3d(0, 0, 0);
            transform: scale3d(1, 1, 1) rotate3d(0, 0, 0, 0) translate3d(0, 0, 0); 

    opacity: 1;
}

.anim_4 .anim_elm
{
    position: relative;
    z-index: 1;

    width: 100%;
    height: 100%;

    -webkit-transition-property: -webkit-transform;
         -o-transition-property:         transform;
            transition-property: -webkit-transform;
            transition-property:         transform;
            transition-property:         transform,-webkit-transform;
    -webkit-transform: translate(50%, 0);
        -ms-transform: translate(50%, 0);
            transform: translate(50%, 0); 

    -ms-flex-negative: 0;
    flex-shrink: 0;
}

.anim_4 .anim_elm.is-act
{
    -webkit-transition: opacity .2s ease, -webkit-transform .9s cubic-bezier(.04, .41, .2, 1);
         -o-transition: opacity .2s ease, transform .9s cubic-bezier(.04, .41, .2, 1);
            transition: opacity .2s ease, -webkit-transform .9s cubic-bezier(.04, .41, .2, 1);
            transition: opacity .2s ease, transform .9s cubic-bezier(.04, .41, .2, 1);
            transition: opacity .2s ease, transform .9s cubic-bezier(.04, .41, .2, 1), -webkit-transform .9s cubic-bezier(.04, .41, .2, 1);
    -webkit-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
            transform: translate(0, 0);

    opacity: 1;
}

.anim_5 .anim_elm
{
    position: relative;
}

.anim_5 .anim_elm:after,
.anim_5 .anim_elm:before
{
    position: absolute;
    top: 0;
    right: 0;

    display: block;

    width: 100%;
    height: 100%;

    content: '';
    transition-timing-function: cubic-bezier(.86, 0, .07, 1); 
    transition-duration: .75s;
    transition-property: width;
}

.anim_5 .anim_elm:before
{
    z-index: 2;

    transition-delay: .85s; 

    background-color: rgba(255, 255, 255, .6);
}

.anim_5 .anim_elm:after
{
    z-index: 3;

    transition-delay: .15s; 

    background-color: #fff;
}

.anim_5 .anim_elm.is-act:after,
.anim_5 .anim_elm.is-act:before
{
    width: 0;
}

.anim_6 .anim_elm.line-horizontal.is-act
{
    position: relative;

    display: block;
}

.anim_6 .anim_elm.line-horizontal.is-act:before
{
    position: absolute;
    z-index: 100; 
    top: 0;
    left: 0;

    display: block;

    width: 100%;
    height: 1px;

    content: '';
    -webkit-animation: lineHorizontal 2s cubic-bezier(.19, 1, .22, 1) forwards;
            animation: lineHorizontal 2s cubic-bezier(.19, 1, .22, 1) forwards;

    opacity: 0;
    background-color: #fff;
}

.anim_6 .anim_elm.line-horizontal.is-act:after
{
    position: absolute;
    z-index: 100;
    bottom: 0;
    left: 0;

    display: block;

    width: 100%;
    height: 1px;

    content: '';
    -webkit-animation: lineHorizontal 2s .2s cubic-bezier(.19, 1, .22, 1) forwards;
            animation: lineHorizontal 2s .2s cubic-bezier(.19, 1, .22, 1) forwards; 

    opacity: 0;
    background-color: #fff;
}

.anim_6 .anim_elm.line-vertical.is-act
{
    position: relative;

    display: block;
}

.anim_6 .anim_elm.line-vertical.is-act:before
{
    position: absolute;
    z-index: 100;
    top: 0;
    left: 0;

    display: block;

    width: 1px;
    height: 100%;

    content: '';
    -webkit-animation: lineVertical 2s .1s cubic-bezier(.19, 1, .22, 1) forwards;
            animation: lineVertical 2s .1s cubic-bezier(.19, 1, .22, 1) forwards; 

    opacity: 0;
    background-color: #fff;
}

.anim_6 .anim_elm.line-vertical.is-act:after
{
    position: absolute;
    z-index: 100; 
    top: 0;
    right: 0;

    display: block;

    width: 1px;
    height: 100%;

    content: '';
    -webkit-animation: lineVertical 2s .3s cubic-bezier(.19, 1, .22, 1) forwards;
            animation: lineVertical 2s .3s cubic-bezier(.19, 1, .22, 1) forwards;

    opacity: 0;
    background-color: #fff;
}

@-webkit-keyframes lineHorizontal
{
    from
    {
        -webkit-transform: translate3d(-60%, 0, 0) scale(1);
                transform: translate3d(-60%, 0, 0) scale(1);
        -webkit-transform-origin: right top;
                transform-origin: right top; 

        opacity: 0;
    }
    50%
    {
        -webkit-transform: translate3d(0, 0%, 0) scale(1);
                transform: translate3d(0, 0%, 0) scale(1); 

        opacity: .7;
    }
    to
    {
        -webkit-transform: translate3d(60%, 0, 0) scale(1);
                transform: translate3d(60%, 0, 0) scale(1); 
        -webkit-transform-origin: right top;
                transform-origin: right top;

        opacity: 0;
    }
}

@keyframes lineHorizontal
{
    from
    {
        -webkit-transform: translate3d(-60%, 0, 0) scale(1);
                transform: translate3d(-60%, 0, 0) scale(1);
        -webkit-transform-origin: right top;
                transform-origin: right top; 

        opacity: 0;
    }
    50%
    {
        -webkit-transform: translate3d(0, 0%, 0) scale(1);
                transform: translate3d(0, 0%, 0) scale(1); 

        opacity: .7;
    }
    to
    {
        -webkit-transform: translate3d(60%, 0, 0) scale(1);
                transform: translate3d(60%, 0, 0) scale(1); 
        -webkit-transform-origin: right top;
                transform-origin: right top;

        opacity: 0;
    }
}

@-webkit-keyframes lineVertical
{
    from
    {
        -webkit-transform: translate3d(0, -60%, 0) scale(1);
                transform: translate3d(0, -60%, 0) scale(1);
        -webkit-transform-origin: right top;
                transform-origin: right top; 

        opacity: 0;
    }
    50%
    {
        -webkit-transform: translate3d(0, 0%, 0) scale(1);
                transform: translate3d(0, 0%, 0) scale(1); 
        -webkit-transform-origin: right top;
                transform-origin: right top;

        opacity: .7;
    }
    to
    {
        -webkit-transform: translate3d(0, 60%, 0) scale(1);
                transform: translate3d(0, 60%, 0) scale(1); 
        -webkit-transform-origin: right top;
                transform-origin: right top;

        opacity: 0;
    }
}

@keyframes lineVertical
{
    from
    {
        -webkit-transform: translate3d(0, -60%, 0) scale(1);
                transform: translate3d(0, -60%, 0) scale(1);
        -webkit-transform-origin: right top;
                transform-origin: right top; 

        opacity: 0;
    }
    50%
    {
        -webkit-transform: translate3d(0, 0%, 0) scale(1);
                transform: translate3d(0, 0%, 0) scale(1); 
        -webkit-transform-origin: right top;
                transform-origin: right top;

        opacity: .7;
    }
    to
    {
        -webkit-transform: translate3d(0, 60%, 0) scale(1);
                transform: translate3d(0, 60%, 0) scale(1); 
        -webkit-transform-origin: right top;
                transform-origin: right top;

        opacity: 0;
    }
}

ul.loader
{
    position: relative; 

    width: 100px;
    height: 100px;
    margin: 0 auto;
}
ul.loader li
{
    position: absolute;
    top: 0; 
    left: 0;

    width: 100%;
    height: 100%;
}
ul.loader li:before
{
    display: block;

    width: 15%;
    height: 15%;
    margin: 0 auto;

    content: '';
    -webkit-animation: ldBounceDelay 1.2s infinite ease-in-out both;
            animation: ldBounceDelay 1.2s infinite ease-in-out both; 

    border-radius: 100%;
    background-color: #fff;
}
ul.loader .ld2
{
    -webkit-transform: rotate(30deg);
        -ms-transform: rotate(30deg);
            transform: rotate(30deg);
}
ul.loader .ld2:before
{
    -webkit-animation-delay: -1.1s;
            animation-delay: -1.1s;
}
ul.loader .ld3
{
    -webkit-transform: rotate(60deg);
        -ms-transform: rotate(60deg);
            transform: rotate(60deg);
}
ul.loader .ld3:before
{
    -webkit-animation-delay: -1s;
            animation-delay: -1s;
}
ul.loader .ld4
{
    -webkit-transform: rotate(90deg);
        -ms-transform: rotate(90deg);
            transform: rotate(90deg);
}
ul.loader .ld4:before
{
    -webkit-animation-delay: -.9s;
            animation-delay: -.9s;
}
ul.loader .ld5
{
    -webkit-transform: rotate(120deg);
        -ms-transform: rotate(120deg);
            transform: rotate(120deg);
}
ul.loader .ld5:before
{
    -webkit-animation-delay: -.8s;
            animation-delay: -.8s;
}
ul.loader .ld6
{
    -webkit-transform: rotate(150deg);
        -ms-transform: rotate(150deg);
            transform: rotate(150deg);
}
ul.loader .ld6:before
{
    -webkit-animation-delay: -.7s;
            animation-delay: -.7s;
}
ul.loader .ld7
{
    -webkit-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
            transform: rotate(180deg);
}
ul.loader .ld7:before
{
    -webkit-animation-delay: -.6s;
            animation-delay: -.6s;
}
ul.loader .ld8
{
    -webkit-transform: rotate(210deg);
        -ms-transform: rotate(210deg);
            transform: rotate(210deg);
}
ul.loader .ld8:before
{
    -webkit-animation-delay: -.5s;
            animation-delay: -.5s;
}
ul.loader .ld9
{
    -webkit-transform: rotate(240deg);
        -ms-transform: rotate(240deg);
            transform: rotate(240deg);
}
ul.loader .ld9:before
{
    -webkit-animation-delay: -.4s;
            animation-delay: -.4s;
}
ul.loader .ld10
{
    -webkit-transform: rotate(270deg);
        -ms-transform: rotate(270deg);
            transform: rotate(270deg);
}
ul.loader .ld10:before
{
    -webkit-animation-delay: -.3s;
            animation-delay: -.3s;
}
ul.loader .ld11
{
    -webkit-transform: rotate(300deg);
        -ms-transform: rotate(300deg);
            transform: rotate(300deg);
}
ul.loader .ld11:before
{
    -webkit-animation-delay: -.2s;
            animation-delay: -.2s;
}
ul.loader .ld12
{
    -webkit-transform: rotate(330deg);
        -ms-transform: rotate(330deg);
            transform: rotate(330deg);
}
ul.loader .ld12:before
{
    -webkit-animation-delay: -.1s;
            animation-delay: -.1s;
}

@-webkit-keyframes ldBounceDelay
{
    0%,
    80%,
    100%
    {
        -webkit-transform: scale(0);
                transform: scale(0);
    }
    40%
    {
        -webkit-transform: scale(1);
                transform: scale(1);
    }
}

@keyframes ldBounceDelay
{
    0%,
    80%,
    100%
    {
        -webkit-transform: scale(0);
                transform: scale(0);
    }
    40%
    {
        -webkit-transform: scale(1);
                transform: scale(1);
    }
}