/*__________________________ ANIMATIONS _________________________*/

@-webkit-keyframes cloud_to_left 
{
    0% 
    {
        left: -10vh;
    }
    100% 
    {
        left: 110vw;
    }
}
@keyframes cloud_to_left 
{
    0% 
    {
        left: -10vh;
    }
    100% 
    {
        left: 110vw;
    }
}
@-webkit-keyframes cloud_to_right
{
    0% 
    {
        right: -10vh;
    }
    100% 
    {
        right: 110vw;
    }
}
@keyframes cloud_to_right
{
    0% 
    {
        right: -10vh;
    }
    100% 
    {
        right: 110vw;
    }
}
@keyframes pop {
    0% {
        -webkit-transform: scale(0.6);
        transform: scale(0.6);
    }
    33% {
        -webkit-transform: scale(0.8);
        transform: scale(0.8);
    }
    66% {
        -webkit-transform: scale(0.5);
        transform: scale(0.5);
    }
    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}


@-webkit-keyframes pop
{
    0% {
        -webkit-transform: scale(0.6);
        transform: scale(0.6);
    }
    33% {
        -webkit-transform: scale(0.8);
        transform: scale(0.8);
    }
    66% {
        -webkit-transform: scale(0.5);
        transform: scale(0.5);
    }
    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}


@-webkit-keyframes pop2
{
    0% {
        -webkit-transform: scale(1) translateX(0px);
        transform: scale(1) translateX(0px);
    }
    50% {
        -webkit-transform: scale(0.99) translateX(-10px);
        transform: scale(0.99) translateX(-10px);
    }
    100% {
        -webkit-transform: scale(1) translateX(0px);
        transform: scale(1) translateX(0px);
    }
}


@keyframes pop2
{
    0% {
        -webkit-transform: scale(1) translateX(0px);
        transform: scale(1) translateX(0px);
    }
    50% {
        -webkit-transform: scale(0.99) translateX(-10px);
        transform: scale(0.99) translateX(-10px);
    }
    100% {
        -webkit-transform: scale(1) translateX(0px);
        transform: scale(1) translateX(0px);
    }
}


@-webkit-keyframes pop3
{
    0% {
        -webkit-transform: scale(1) translateX(0px);
        transform: scale(1) translateX(0px);
    }
    50% {
        -webkit-transform: scale(0.99) translateX(10px);
        transform: scale(0.99) translateX(10px);
    }
    100% {
        -webkit-transform: scale(1) translateX(0px);
        transform: scale(1) translateX(0px);
    }
}


@keyframes pop3
{
    0% {
        -webkit-transform: scale(1) translateX(0px);
        transform: scale(1) translateX(0px);
    }
    50% {
        -webkit-transform: scale(0.99) translateX(10px);
        transform: scale(0.99) translateX(10px);
    }
    100% {
        -webkit-transform: scale(1) translateX(0px);
        transform: scale(1) translateX(0px);
    }
}


@-webkit-keyframes color1 
{
    0% {
        fill: #38B6B0;
        color: #38B6B0;
    }
    50% {
        fill: #D9205E;
        color: #D9205E;
    }
    100% {
        fill: #38B6B0;
        color: #38B6B0;
    }
}


@keyframes color1 
{
    0% {
        fill: #38B6B0;
        color: #38B6B0;
    }
    50% {
        fill: #D9205E;
        color: #D9205E;
    }
    100% {
        fill: #38B6B0;
        color: #38B6B0;
    }
}


@-webkit-keyframes color2 
{
    0% {
        fill: #D9205E;
        color: #D9205E;
    }
    50% {
        fill: #38B6B0;
        color: #38B6B0;
    }
    100% {
        fill: #D9205E;
        color: #D9205E;
    }
}


@keyframes color2 
{
    0% {
        fill: #D9205E;
        color: #D9205E;
    }
    50% {
        fill: #38B6B0;
        color: #38B6B0;
    }
    100% {
        fill: #D9205E;
        color: #D9205E;
    }
}

.pop
{
    -webkit-animation: pop 0.5s ease;
    animation: pop 0.5s ease;
}
.pop2
{
    -webkit-animation: pop2 1s ease;
    animation: pop2 1s ease;
}
.pop3
{
    -webkit-animation: pop3 1s ease;
    animation: pop3 1s ease;
}
.color1
{
    -webkit-animation: color1 4s ease;
    animation: color1 4s ease;
}
.color2
{
    -webkit-animation: color2 4s ease;
    animation: color2 4s ease;
}
.dashedsvg
{
    stroke-dasharray: 10;
}
.pathsvg
{
    stroke-dasharray: 1000;
    stroke-dashoffset: 1000;
    -webkit-animation: dash 5s linear alternate infinite;
    animation: dash 5s linear alternate infinite;
}

.stphone {
    stroke-dasharray: 7000;
    stroke-dashoffset: 7000;
    stroke: #EB5E69 !important;
    -webkit-animation: stphone 10s ease-out infinite;
            animation: stphone 10s ease-out infinite;
}
@-webkit-keyframes stphone {
    to {
        stroke-dashoffset: 2500;
    }
}
@keyframes stphone {
    to {
        stroke-dashoffset: 2500;
    }
}


.infinite
{
    -webkit-animation-iteration-count: infinite;
            animation-iteration-count: infinite;
}