.dsf-plane-emirates {
  display: block;
  width: 10%;
  height: 5%;
  left: 62%;
  top: 10%;
  background: url(../image/dsf/animations/plane.svg) center center no-repeat transparent;
  -webkit-background-size: 100% auto;
  background-size: 100% auto;
  -webkit-animation: dsfplane1 50s infinite linear;
  -moz-animation: dsfplane1 50s infinite linear;
  -o-animation: dsfplane1 50s infinite linear;
  -ms-animation: dsfplane1 50s infinite linear;
  animation: dsfplane1 50s infinite linear;
  pointer-events: none;
  z-index: 40;
}

@keyframes dsfplane1 {
    0% {
        left: 100%;
    }        
    100% {
        left: 1%;
    }
}


.dsf-seaplane{
    display: block;
    width: 3.5%;
    height: 4%;
    left: 30%;
    top: 16%;
    background: url(../image/dsf/animations/seaplane.svg) center center no-repeat transparent;
    -webkit-background-size: 100% auto;
    background-size: 100% auto;
    -webkit-animation: dsfseaplane 50s infinite linear;
    -moz-animation: dsfseaplane 50s infinite linear;
    -o-animation: dsfseaplane 50s infinite linear;
    -ms-animation: dsfseaplane 50s infinite linear;
    animation: dsfseaplane 50s infinite linear;
    z-index: 40;
    
}

@keyframes dsfseaplane {
    0% {
        left: 1%;
    }        
    100% {
        left: 100%;
    }
}


.dsf-horse1{
  
  display: block;
width: 43.634px;
    height: 42.53px;
    left: 41.5%;
    top: 50%;
  background: url(../image/dsf/animations/horse-sprite.png) left center no-repeat;
  -webkit-background-size: auto;
  background-size: auto;
  background-position: auto;
  background-repeat: no-repeat;
  -webkit-animation: imagespritehorse 2s steps(22) infinite;
  -moz-animation: imagespritehorse 2s steps(22) infinite;
  -o-animation: imagespritehorse 2s steps(22) infinite;
  -ms-animation: imagespritehorse 2s steps(22) infinite;
  animation: imagespritehorse 2s steps(22) infinite;
  /*z-index: 5;*/
  
}

.dsf-horse2{
  
  display: block;
width: 43.634px;
    height: 42.53px;
    left: 65.5%;
    top: 65.5%;
  background: url(../image/dsf/animations/horse-sprite.png) left center no-repeat;
  -webkit-background-size: auto;
  background-size: auto;
  background-position: auto;
  background-repeat: no-repeat;
  -webkit-animation: imagespritehorse 2s steps(22) infinite;
  -moz-animation: imagespritehorse 2s steps(22) infinite;
  -o-animation: imagespritehorse 2s steps(22) infinite;
  -ms-animation: imagespritehorse 2s steps(22) infinite;
  animation: imagespritehorse 2s steps(22) infinite;
  /*z-index: 5;*/
    
}


@keyframes imagespritehorse{
    
    100% { background-position: -962px; }   
}
@keyframes imagespritehorse2{
    
    100% { background-position: -1921px; }  
}


.dsf-hotballoon {
  display: block;
  width: 10.4%;
  height: 10%;
  background: url(../image/dsf/animations/hotairballoon.svg) center center no-repeat transparent;
  -webkit-background-size: 100% auto;
  background-size: 100% auto;
  -webkit-animation: dsfflyaround 140s infinite linear;
  -moz-animation: dsfflyaround 140s infinite linear;
  -o-animation: dsfflyaround 140s infinite linear;
  -ms-animation: dsfflyaround 140s infinite linear;
  animation: dsfflyaround 140s infinite linear;
  left: 62%;
  top: 14.1%;
  /*z-index: 10;*/
  pointer-events: none;
}



.dsf-arabcamel
{
  display: block;
    width: 3.5%;
    height: 9%;
    left: 28%;
    top: 82%;
  background: url(../image/dsf/animations/arabincamel2.gif) left center no-repeat;
  -webkit-background-size:100% auto;
  background-size: 100% auto;
  background-repeat: no-repeat;
   -webkit-animation: dsfarabcamel 50s infinite;
  -moz-animation: dsfarabcamel 50s infinite;
  -o-animation: dsfarabcamel 50s infinite;
  -ms-animation: dsfarabcamel 50s infinite;
  animation: dsfarabcamel 50s infinite;
  z-index: 5;
  }

@keyframes dsfarabcamel {
    
    
    0%{
-webkit-transform: translate(0%)  rotateY(0deg);
                transform: translate(0%)  rotateY(0deg);
    }
    
    
  50%{
-webkit-transform: translate(260%)  rotateY(0deg);
                transform: translate(260%)  rotateY(0deg);
                
    }
    
    50.5%{
-webkit-transform: translate(260%) rotateY(-180deg);
                transform: translate(260%) rotateY(-180deg);
                
    } 
    
    100%{
        -webkit-transform: translate(0%) rotateY(-180deg);
                transform: translate(0%) rotateY(-180deg);
    }
}


.dsf-kiteski1
{
display: block;
width: 4%;
    height: 8%;
    left: 60%;
    top: 14%;
  background: url(../image/dsf/animations/kite-ski-1.svg) center center no-repeat transparent;
  -webkit-background-size: 90% auto;
  background-size: 90% auto;
  background-position: 0% 0;
  background-repeat: no-repeat;
  -webkit-animation: dsfjetski 20s infinite linear;
  -moz-animation: dsfjetski 20s infinite linear;
  -o-animation: dsfjetski 20s infinite linear;
  -ms-animation: dsfjetski 20s infinite linear;
  animation: dsfjetski 20s infinite linear;
  z-index: 2;
}

.dsf-kiteski2
{
display: block;
width: 4%;
    height: 8%;
    left: 59%;
    top: 18%;
  background: url(../image/dsf/animations/kite-ski-2.svg) center center no-repeat transparent;
  -webkit-background-size: 100% auto;
  background-size: 90% auto;
  background-position: 0% 0;
  background-repeat: no-repeat;
  -webkit-animation: dsfjetski 30s infinite;
  -moz-animation: dsfjetski 30s infinite;
  -o-animation: dsfjetski 30s infinite;
  -ms-animation: dsfjetski 30s infinite;
  animation: dsfjetski 30s infinite;
  z-index: 3;
}

.dsf-kiteski3
{
display: block;
width: 4%;
    height: 8%;
    left: 61%;
    top: 16%;
  background: url(../image/dsf/animations/kite-ski-3.svg) center center no-repeat transparent;
  -webkit-background-size: 90% auto;
  background-size: 90% auto;
  background-position: 0% 0;
  background-repeat: no-repeat;
  -webkit-animation: dsfjetski 40s infinite;
  -moz-animation: dsfjetski 40s infinite;
  -o-animation: dsfjetski 40s infinite;
  -ms-animation: dsfjetski 40s infinite;
  animation: dsfjetski 40s infinite;
  z-index: 2;
}


@keyframes dsfjetski {
    
    0%{
        -webkit-transform: translate(0%,0%) rotateY(0deg);
                transform: translate(0%,0%) rotateY(0deg);
    }
    
    25%{
-webkit-transform: translate(-70%,10%);
                transform: translate(-70%,10%);
    }
    
    49.5%{
-webkit-transform: translate(-150%,0%);
                transform: translate(-150%,0%);
    }
  50%{
-webkit-transform: translate(-150%,0%) rotateY(-180deg);
                transform: translate(-150%,0%) rotateY(-180deg);                
    }
    
    50.5%{
-webkit-transform: translate(-150%,0%) rotateY(-180deg);
                transform: translate(-150%,0%) rotateY(-180deg);                
    } 
    
    
    75%{
-webkit-transform: translate(-60%,15%) rotateY(-180deg);
                transform: translate(-60%,15%) rotateY(-180deg);                
    }
    
    100%{
        -webkit-transform: translate(0%,0%) rotateY(0deg);
                transform: translate(0%,0%) rotateY(0deg);
    }
}

.dsf-windboat1 {
    display: block;
    width: 3.6%;
    height: 5%;
    left: 27%;
    top: 15.4%;
    background: url(../image/dsf/animations/boat-2.svg) center center no-repeat transparent;
    -webkit-background-size: 50% auto;
    background-size: 45% auto;
   /* transform: translate(0%,0%) rotateY(0deg);*/
    -webkit-animation: dsfwindboat1 70s infinite linear; 
    -moz-animation: dsfwindboat1 70s infinite linear;
    -o-animation: dsfwindboat1 70s infinite linear;
    -ms-animation: dsfwindboat1 70s infinite linear;
     animation: dsfwindboat1 70s infinite linear; 
}
@keyframes dsfwindboat1{
    
    0%
    {
        
-webkit-transform: translate(0%) rotateY(0deg);
                transform: translate(0%) rotateY(0deg);

                }
        
    50%
    {
        
-webkit-transform: translate(150%,0%) rotateY(0deg);
                transform: translate(150%,0%) rotateY(0deg);

                }
    50.5%
    {
        
-webkit-transform: translate(150%,0%) rotateY(-180deg);
                transform: translate(150%,0%) rotateY(-180deg);

                }
    
     100%
    {
        
-webkit-transform: translate(0%,0%) rotateY(-180deg);
                transform: translate(0%,0%) rotateY(-180deg);

                }
  }



  .dsf-windboat2 {
    display: block;
    width: 1.8%;
    height: 2.5%;
    left: 61%;
    top: 18.4%;
    background: url(../image/dsf/animations/boat-3.svg) center center no-repeat transparent;
    -webkit-background-size: 50% auto;
    background-size: 70% auto;
    transform: translate(0%,0%) rotateY(0deg);
     -webkit-animation: dsfwindboat1 30s infinite linear; 
    -moz-animation: dsfwindboat1 30s infinite linear;
    -o-animation: dsfwindboat1 30s infinite linear;
    -ms-animation: dsfwindboat1 30s infinite linear;
     animation: dsfwindboat1 30s infinite linear; 
}





.dsf-desertjeepblueopen
{
  display: block;
  width: 4%;
  height: 4.3%;
   left: 87%;
    top:88.6%;
  background: url(../image/dsf/animations/desert-jeep-blue-open.svg) center center no-repeat transparent;
  -webkit-background-size: 100% auto;
  background-size: 100% auto;
  -webkit-animation: desertjeep 45s  infinite linear; 
  -moz-animation: desertjeep 45s  infinite linear; 
  -o-animation: desertjeep 45s  infinite linear; 
  -ms-animation: desertjeep 45s  infinite linear; 
  animation: desertjeep 45s  infinite linear; 
  z-index: 4; 
  
}

.dsf-desertjeepredopen
{
  display: block;
  width: 4%;
  height: 4.3%;
  left: 85%;
  top: 92%;
  background: url(../image/dsf/animations/desert-jeep-red-open.svg) center center no-repeat transparent;
  -webkit-background-size: 100% auto;
  background-size: 100% auto;
  -webkit-animation: desertjeep 30s  infinite linear; 
  -moz-animation: desertjeep 30s  infinite linear; 
  -o-animation: desertjeep 30s  infinite linear; 
  -ms-animation: desertjeep 30s  infinite linear; 
  animation: desertjeep 30s  infinite linear; 
  z-index: 5; 
  
}

.dsf-desertsafarired
{
  display: block;
  width: 4%;
  height: 4.3%;
  left: 21%;
  top: 83%;
  background: url(../image/dsf/animations/desert-jeep-red.svg) center center no-repeat transparent;
  -webkit-background-size: 100% auto;
  background-size: 100% auto;
  -webkit-animation: desertsafari 50s  infinite linear; 
  -moz-animation: desertsafari 50s  infinite linear; 
  -o-animation: desertsafari 50s  infinite linear; 
  -ms-animation: desertsafari 50s  infinite linear; 
  animation: desertsafari 50s  infinite linear; 
  z-index: 3; 
  
}


.dsf-desertsafariwhite
{
  display: block;
      width: 4%;
    height: 4.3%;
    left: 40.6%;
    top: 78.5%;
  background: url(../image/dsf/animations/desert-jeep-white.svg) center center no-repeat transparent;
  -webkit-background-size: 100% auto;
  background-size: 100% auto;
  -webkit-animation: desertsafariwhite 40s  infinite linear; 
  -moz-animation: ddesertsafariwhite 40s  infinite linear; 
  -o-animation: desertsafariwhite 40s  infinite linear; 
  -ms-animation: desertsafariwhite 40s  infinite linear; 
  animation: desertsafariwhite 40s  infinite linear; 
  z-index: 2; 
  
}


@keyframes desertsafariwhite
{
    
    0%
    {
        
-webkit-transform: translate(0%) rotateZ(-5deg);
                transform: translate(0%) rotateZ(-5deg);

                }
        
    15%
    {
        
-webkit-transform: translate(-100%,25%) rotateZ(5deg);
                transform: translate(-100%,25%) rotateZ(5deg);

                }
  25%{
-webkit-transform: translate(-170%,20%) rotateZ(-5deg);
                transform: translate(-170%,20%) rotateZ(-5deg);

                 }
                 
                 45%{
-webkit-transform: translate(-270%,20%) rotateZ(5deg);
                transform: translate(-270%,20%) rotate(Z5deg);

                 }
                 
    50.5%{
-webkit-transform: translate(-320%,40%) rotateZ(-20deg) rotateY(0deg);
                transform: translate(-320%,40%) rotateZ(-20deg) rotateY(0deg);

                 } 
    
    51%{
-webkit-transform: translate(-320%,40%) rotateZ(-20deg) rotateY(-180deg);
                transform: translate(-320%,40%) rotateZ(-20deg) rotateY(-180deg);

                 } 
                 
                 70%{
-webkit-transform: translate(-150%,35%) rotateZ(-5deg) rotateY(-180deg);
                transform: translate(-150%,35%) rotateZ(-5deg) rotateY(-180deg);

                 }
    
    100%{
        -webkit-transform: translate(0%) rotateZ(-15deg) rotateY(-180deg);
                transform: translate(0%) rotateZ(-15deg) rotateY(-180deg);

                }       
                
    
}

@keyframes desertsafari
{
    
    0%
    {
        
-webkit-transform: translate(0%) rotateZ(-5deg);
                transform: translate(0%) rotateZ(-5deg);

                }
        
    25%
    {
        
-webkit-transform: translate(-100%,25%) rotateZ(15deg);
                transform: translate(-100%,25%) rotateZ(15deg);

                }
  30%{
-webkit-transform: translate(-150%,20%) rotateZ(-5deg);
                transform: translate(-150%,20%) rotateZ(-5deg);

                 }
                 
                 45%{
-webkit-transform: translate(-250%,20%) rotateZ(5deg);
                transform: translate(-250%,20%) rotateZ(5deg);

                 }
                 
    50.5%{
-webkit-transform: translate(-300%,20%) rotateZ(15deg) rotateY(0deg);
                transform: translate(-300%,20%) rotateZ(15deg) rotateY(0deg);

                 } 
    
    51%{
-webkit-transform: translate(-300%,10%) rotateZ(15deg) rotateY(-180deg);
                transform: translate(-300%,10%) rotateZ(15deg) rotateY(-180deg);

                 } 
                 
                 75%{
-webkit-transform: translate(-150%,25%) rotateZ(-25deg) rotateY(-180deg);
                transform: translate(-150%,25%) rotateZ(-25deg) rotateY(-180deg);

                 }
    
    100%{
        -webkit-transform: translate(0%) rotateZ(0deg) rotateY(-180deg);
                transform: translate(0%) rotateZ(0deg) rotateY(-180deg);

                }       
                
    
}


@keyframes desertjeep
{
    
    0%
    {
        
-webkit-transform: translate(0%) rotate(-3deg);
                transform: translate(0%) rotate(-3deg);

                }
        
    25%
    {
        
-webkit-transform: translate(-100%,20%) rotate(3deg);
                transform: translate(-100%,20%) rotate(3deg);

                }
  30%{
-webkit-transform: translate(-150%,0%) rotate(-3deg);
                transform: translate(-150%,0%) rotate(-3deg);

                 }
                 
                 45%{
-webkit-transform: translate(-250%,0%) rotate(3deg);
                transform: translate(-250%,0%) rotate(3deg);

                 }
                 
    50.5%{
-webkit-transform: translate(-300%,20%) rotate(0deg) rotateY(0deg);
                transform: translate(-300%,20%) rotate(0deg) rotateY(0deg);

                 } 
    
    51%{
-webkit-transform: translate(-300%,0%) rotate(0deg) rotateY(-180deg);
                transform: translate(-300%,0%) rotate(0deg) rotateY(-180deg);

                 } 
                 
                 70%{
-webkit-transform: translate(-150%,20%) rotate(-5deg) rotateY(-180deg);
                transform: translate(-150%,20%) rotate(-5deg) rotateY(-180deg);

                 }
    
    100%{
        -webkit-transform: translate(0%) rotate(0deg) rotateY(-180deg);
                transform: translate(0%) rotate(0deg) rotateY(-180deg);

                }       
                
    
}

















.ajman-flag{
    display: block;
    width: 2.5%;
    height: 5.4%;
    left: 53.1%;
    top: 47%;
    background: url(../image/ajman/animation/flag.gif) center center no-repeat transparent;
    background-size: 60% auto;
}

.ajman-seaman1{
    display: block;
    width: 1.8%;
    height: 2.4%;
    left: 70.5%;
    top: 85%;
    background: url(../image/ajman/animation/sea1.gif) center center no-repeat transparent;
    background-size: 60% auto;
}
.ajman-seakid1{
    display: block;
    width: 1.6%;
    height: 2.4%;
    left: 65.6%;
    top: 84.5%;
    background: url(../image/ajman/animation/seakid1.jpg) center center no-repeat transparent;
    background-size: 60% auto;
}
.ajman-seakid2{
   display: block;
    width: 1.6%;
    height: 2%;
    left: 66%;
    top: 85%;
    background: url(../image/ajman/animation/seakid2.gif) center center no-repeat transparent;
    background-size: 60% auto;
}
.ajman-runners{
   display: block;
    width: 2%;
    height: 2.3%;
    left: 70.7%;
    top: 80.8%;
    background: url(../image/ajman/animation/runners.gif) center center no-repeat transparent;
    background-size: 60% auto;
   -webkit-animation: runners 20s infinite linear; 
    -moz-animation: runners 20s infinite linear;
    -o-animation: runners 20s infinite linear;
    -ms-animation: runners 20s infinite linear;
     animation: runners 20s infinite linear;
}

@keyframes runners{
    
    0%
    {
        
-webkit-transform: translate(0%) rotateY(-160deg);
                transform: translate(0%) rotateY(-160deg);

                }
 
    100%
    {
        
-webkit-transform: translate(-215%,200%) rotateY(-160deg);
                transform: translate(-215%,200%) rotateY(-160deg);

                }
    
  }
.ajman-mosque1{
    display: block;
    width: 1.5%;
    height: 5%;
    left: 60%;
    top: 51%;
    background: url(../image/ajman/buildings/mosque1.png) center center no-repeat transparent;
    background-size: 60% auto;
    z-index:10;
}
.ajman-horseride{
    display: block;
    width: 3.5%;
    height: 5.4%;
    left: 59.1%;
    top: 40%;
    background: url(../image/ajman/animation/horse-ride.gif) center center no-repeat transparent;
    background-size: 60% auto;
    -webkit-animation: horseride1 10s infinite linear; 
    -moz-animation: horseride1 10s infinite linear;
    -o-animation: horseride1 10s infinite linear;
    -ms-animation: horseride1 10s infinite linear;
     animation: horseride1 10s infinite linear;
}

@keyframes horseride1{
    
    0%
    {
        
-webkit-transform: translate(0%) rotateZ(0deg);
                transform: translate(0%) rotateZ(0deg);

                }
 
    50%
    {
        
-webkit-transform: translate(-90%,0%) rotateY(0deg);
                transform: translate(-90%,0%) rotateY(0deg);

                }
    50.5%
    {
        
-webkit-transform: translate(-90%,0%) rotateY(180deg);
                transform: translate(-90%,0%) rotateY(180deg);

                }
    100%
    {
        
-webkit-transform: translate(0%,0%) rotateY(180deg);
                transform: translate(0%,0%) rotateY(180deg);

                }
    
  }

.ajman-stud{
    display: block;
    width: 3.5%;
    height: 4.4%;
    left: 12.8%;
    top: 53%;
    background: url(../image/ajman/animation/horse.gif) center center no-repeat transparent;
    background-size: 65% auto;
    z-index: 4;
}
.ajman-studwall{
    display: block;
    width: 3.5%;
    height: 4.4%;
    left: 13%;
    top: 53.5%;
    background: url(../image/ajman/buildings/stud-wall.png) center center no-repeat transparent;
    background-size: 85% auto;
    z-index: 3;
}

.ajman-camel1{
    display: block;
    width: 3.5%;
    height: 5.4%;
    left: 47.1%;
    top: 22%;
    background: url(../image/ajman/animation/camel.gif) center center no-repeat transparent;
    background-size: 60% auto;
    z-index: 5;
     -webkit-animation: camel1 10s infinite linear; 
    -moz-animation: camel1 10s infinite linear;
    -o-animation: camel1 10s infinite linear;
    -ms-animation: camel1 10s infinite linear;
     animation: camel1 10s infinite linear;
}
.ajman-camel2{
    display: block;
    width: 3.5%;
    height: 6.4%;
    left: 47.6%;
    top: 20.7%;
    background: url(../image/ajman/animation/camel.gif) center center no-repeat transparent;
    background-size: 75% auto;
    z-index: 4;
     -webkit-animation: camel1 10s infinite linear; 
    -moz-animation: camel1 10s infinite linear;
    -o-animation: camel1 10s infinite linear;
    -ms-animation: camel1 10s infinite linear;
     animation: camel1 10s infinite linear;
}
.ajman-camel3{
    display: block;
    width: 4%;
    height: 5.4%;
    left: 47.1%;
    top: 20%;
    background: url(../image/ajman/animation/camel.gif) center center no-repeat transparent;
    background-size: 60% auto;
    z-index: 3;
     -webkit-animation: camel1 10s infinite linear; 
    -moz-animation: camel1 10s infinite linear;
    -o-animation: camel1 10s infinite linear;
    -ms-animation: camel1 10s infinite linear;
     animation: camel1 10s infinite linear;
}

.ajman-camelshadow{
    display: block;
    width: 4%;
    height: 7.6%;
    left: 47.1%;
    top: 20.8%;
    background: url(../image/ajman/animation/camelshadow.png) center center no-repeat transparent;
    background-size: 70% auto;
    z-index: 2;
     -webkit-animation: camel1 10s infinite linear; 
    -moz-animation: camel1 10s infinite linear;
    -o-animation: camel1 10s infinite linear;
    -ms-animation: camel1 10s infinite linear;
     animation: camel1 10s infinite linear;
}


@keyframes camel1{
    
    0%
    {
        
-webkit-transform: translate(0%) rotateZ(0deg);
                transform: translate(0%) rotateZ(0deg);

                }
 
    100%
    {
        
-webkit-transform: translate(-160%,0%) rotateY(0deg);
                transform: translate(-160%,0%) rotateY(0deg);

                }
    
  }


.ajman-flyboard-boat
{
    display: block;
    width: 3%;
    height: 5%;
    left: 92%;
    top: 64%;
  background: url(../image/ajman/animation/flyboard1.gif) center center no-repeat transparent;
  -webkit-background-size: 100% auto;
  background-size: 100% auto;
  -webkit-animation: flyboard-anim 10s infinite linear;
  -moz-animation: flyboard-anim 10s infinite linear;
  -o-animation: flyboard-anim 10s infinite linear;
  -ms-animation: flyboard-anim 10s infinite linear;
  animation: flyboard-anim 10s infinite linear;
  z-index: 1;
  
}


.ajman-flyboard-boat2
{
    display: block;
    width: 2%;
    height: 5%;
    left: 91%;
    top: 66%;
  background: url(../image/ajman/animation/flyboard2.gif) center center no-repeat transparent;
  -webkit-background-size: 100% auto;
  background-size: 100% auto;
  -webkit-animation: flyboard2-anim 8s infinite linear;
  -moz-animation: flyboard2-anim 8s infinite linear;
  -o-animation: flyboard2-anim 8s infinite linear;
  -ms-animation: flyboard2-anim 8s infinite linear;
  animation: flyboard2-anim 8s infinite linear;
  z-index: 1;
  
}



@keyframes flyboard-anim {
  
  0%{
        -webkit-transform: translate(0%,0%) rotateY(0deg);
                transform: translate(0%,0%) rotateY(0deg);
    }
  
  50%{
-webkit-transform: translate(0%,-5%) rotateY(0deg);
                transform: translate(0%,-5%) rotateY(0deg);
        
    }
  
 
  
  100%{
        -webkit-transform: translate(0%,0%) rotateY(0deg);
                transform: translate(0%,0%) rotateY(0deg);
    }
}


@keyframes flyboard2-anim {
  
  0%{
        -webkit-transform: translate(0%,0%) rotateY(0deg);
                transform: translate(0%,0%) rotateY(0deg);
    }
  
  50%{
-webkit-transform: translate(0%,-5%) rotateY(0deg);
                transform: translate(0%,-5%) rotateY(0deg);
        
    }
  
 
  
  100%{
        -webkit-transform: translate(0%,0%) rotateY(0deg);
                transform: translate(0%,0%) rotateY(0deg);
    }
}

.ajman-boat1 {
    display: block;
    width: 5%;
    height: 7%;
    left: 84%;
    top: 68%;
    background: url(../image/ajman/animation/boatman.gif) center center no-repeat transparent;
    -webkit-background-size: 40% auto;
    background-size: 40% auto;
    z-index: 20;
     transform: translate(0%,0%) rotateX(0deg);
  -webkit-animation: ajmanboat1 60s infinite linear;
  -moz-animation: ajmanboat1 60s infinite linear;
  -o-animation: ajmanboat1 60s infinite linear;
  -ms-animation: ajmanboat1 60s infinite linear;
  animation: ajmanboat1 60s infinite linear;
  
}

 @keyframes ajmanboat1{
    
    0%
    {
        
-webkit-transform: translate(0%) rotate(0deg);
                transform: translate(0%) rotate(0deg);

                }
        
    15%
    {
        
-webkit-transform: translate(-16%,20%) rotate(4deg);
                transform: translate(-16%,20%) rotate(4deg);

                }

    35%
    {
        
-webkit-transform: translate(30%,40%) rotate(4deg);
                transform: translate(30%,40%) rotate(4deg);

                }
    75%
    {
        
-webkit-transform: translate(175%,60%) rotate(4deg);
                transform: translate(175%,60%) rotate(4deg);

                }
    100%
    {
        
-webkit-transform: translate(248%,100%) rotateX(40deg);
                transform: translate(248%,100%) rotateX(40deg);

                }
   
    
}

.ajman-boat2 {
    display: block;
    width: 5%;
    height: 4%;
    left: 75%;
    top: 78%;
    background: url(../image/ajman/animation/boatman.gif) center center no-repeat transparent;
    -webkit-background-size: 50% auto;
    background-size: 45% auto;
    z-index: 20;
     -webkit-animation: ajmanboat2 50s infinite linear; 
    -moz-animation: ajmanboat2 50s infinite linear;
    -o-animation: ajmanboat2 50s infinite linear;
    -ms-animation: ajmanboat2 50s infinite linear;
     animation: ajmanboat2 50s infinite linear; 
}

@keyframes ajmanboat2{
    
    0%
    {
        
-webkit-transform: translate(0%) rotateY(-130deg);
                transform: translate(0%) rotateY(-130deg);

                }

    100%
    {
        
-webkit-transform: translate(-298%,470%) rotateY(-130deg);
                transform: translate(-298%,470%) rotateY(-130deg);

                }
  }

.ajman-windboat1 {
    display: block;
    width: 3.6%;
    height: 5%;
    left: 63%;
    top: 59.4%;
    background: url(../image/ajman/animation/windboat1.png) center center no-repeat transparent;
    -webkit-background-size: 50% auto;
    background-size: 45% auto;
    z-index: 20;
     -webkit-animation: windboat1 70s infinite linear; 
    -moz-animation: windboat1 70s infinite linear;
    -o-animation: windboat1 70s infinite linear;
    -ms-animation: windboat1 70s infinite linear;
     animation: windboat1 70s infinite linear; 
}
@keyframes windboat1{
    
    0%
    {
        
-webkit-transform: translate(0%) rotateZ(8deg);
                transform: translate(0%) rotateZ(8deg);

                }
        
    35%
    {
        
-webkit-transform: translate(136%,98%) rotateZ(8deg);
                transform: translate(136%,98%) rotateZ(8deg);

                }
    35.5%
    {
        
-webkit-transform: translate(136%,98%) rotateY(8deg);
                transform: translate(136%,98%) rotateY(8deg);

                }

    70%
    {
        
-webkit-transform: translate(306%,45%) rotateY(8deg);
                transform: translate(306%,45%) rotateY(8deg);

                }
     100%
    {
        
-webkit-transform: translate(488%,82%) rotateY(8deg);
                transform: translate(488%,82%) rotateY(8deg);

                }
  }



  .ajman-windboat2 {
    display: block;
    width: 2.4%;
    height: 3.5%;
    left: 74%;
    top: 48.5%;
    background: url(../image/ajman/animation/windboat2.png) center center no-repeat transparent;
    -webkit-background-size: 50% auto;
    background-size: 70% auto;
    z-index: 19;
     -webkit-animation: windboat2 80s infinite linear; 
    -moz-animation: windboat2 80s infinite linear;
    -o-animation: windboat2 80s infinite linear;
    -ms-animation: windboat2 80s infinite linear;
     animation: windboat2 80s infinite linear; 
}
@keyframes windboat2{
    
    0%
    {
        
-webkit-transform: translate(0%) rotateZ(0deg);
                transform: translate(0%) rotateZ(0deg);

                }
        
    40%
    {
        
-webkit-transform: translate(116%,25%) rotateZ(0deg);
                transform: translate(116%,25%) rotateZ(0deg);

                }
    40.5%
    {
        
-webkit-transform: translate(116%,25%) rotateY(40deg);
                transform: translate(116%,25%) rotateY(40deg);

                }
     100%
    {
        
-webkit-transform: translate(72%,366%) rotateY(40deg);
                transform: translate(72%,366%) rotateY(40deg);

                }
  }


  .ajman-windboat3 {
    display: block;
    width: 3.6%;
    height: 5%;
    left: 76%;
    top: 63.4%;
    background: url(../image/ajman/animation/windboat3.png) center center no-repeat transparent;
    -webkit-background-size: 50% auto;
    background-size: 45% auto;
    z-index: 21;
     -webkit-animation: windboat3 65s infinite linear; 
    -moz-animation: windboat3 65s infinite linear;
    -o-animation: windboat3 65s infinite linear;
    -ms-animation: windboat3 65s infinite linear;
     animation: windboat3 65s infinite linear; 
}
@keyframes windboat3{
    
    0%
    {
        
-webkit-transform: translate(0%) rotateZ(8deg);
                transform: translate(0%) rotateZ(8deg);

                }
        
    30%
    {
        
-webkit-transform: translate(158%,12%) rotateZ(0deg);
                transform: translate(158%,12%) rotateZ(0deg);

                }
      42%
    {
        
-webkit-transform: translate(213%,48%) rotateZ(0deg);
                transform: translate(213%,48%) rotateZ(0deg);

                }
    60%
    {
        
-webkit-transform: translate(270%,133%) rotateZ(0deg);
                transform: translate(270%,133%) rotateZ(0deg);

                }

    100%
    {
        
-webkit-transform: translate(590%,150%) rotateZ(0deg);
                transform: translate(590%,150%) rotateZ(0deg);

                }
    
  }

  .ajman-jetsky1 {
    display: block;
    width: 3.6%;
    height: 5%;
    left: 93%;
    top: 78%;
    background: url(../image/ajman/animation/jetsky1.svg) center center no-repeat transparent;
    -webkit-background-size: 50% auto;
    background-size: 85% auto;
    z-index: 21;
    -webkit-animation: jetsky1 15s infinite linear; 
    -moz-animation: jetsky1 15s infinite linear;
    -o-animation: jetsky1 15s infinite linear;
    -ms-animation: jetsky1 15s infinite linear;
     animation: jetsky1 15s infinite linear; 
}
@keyframes jetsky1{
    
    0%
    {
        
-webkit-transform: translate(0%) rotateZ(0deg);
                transform: translate(0%) rotateZ(0deg);

                }
 
    100%
    {
        
-webkit-transform: translate(-822%,360%) rotateY(0deg);
                transform: translate(-822%,360%) rotateY(0deg);

                }
    
  }

   .ajman-jetsky2 {
    display: block;
    width: 3.6%;
    height: 5%;
    left: 96%;
    top: 78%;
    background: url(../image/ajman/animation/jetsky2.png) center center no-repeat transparent;
    -webkit-background-size: 50% auto;
    background-size: 85% auto;
    z-index: 21;
     -webkit-animation: jetsky2 15s infinite linear; 
    -moz-animation: jetsky2 15s infinite linear;
    -o-animation: jetsky2 15s infinite linear;
    -ms-animation: jetsky2 15s infinite linear;
     animation: jetsky2 15s infinite linear; 
}
@keyframes jetsky2{
    
    0%
    {
        
-webkit-transform: translate(0%) rotateZ(0deg);
                transform: translate(0%) rotateZ(0deg);

                }

    80%
    {
        
-webkit-transform: translate(-568%,-81%) rotateZ(0deg);
                transform: translate(-568%,-81%) rotateZ(0deg);

                }
   100%
    {
        
-webkit-transform: translate(-568%,-81%) rotateZ(0deg);
                transform: translate(-568%,-81%) rotateZ(0deg);

                }
    
  }

  .ajman-plane1{
    display: block;
    width: 6%;
    height: 7.4%;
    left: 61.1%;
    top: 92.4%;
    background: url(../image/ajman/animation/plane.png) center center no-repeat transparent;
    background-size: 90% auto;
    z-index: 22;
     -webkit-animation: ajmanplane1 40s infinite linear; 
    -moz-animation: ajmanplane1 40s infinite linear;
    -o-animation: ajmanplane1 40s infinite linear;
    -ms-animation: ajmanplane1 40s infinite linear;
     animation: ajmanplane1 40s infinite linear;
}

@keyframes ajmanplane1{
    
    0%
    {
        
-webkit-transform: translate(0%) rotateZ(5deg);
                transform: translate(0%) rotateZ(5deg);

                }
  100%
    {
        
-webkit-transform: translate(551%,-465%) rotateY(0deg);
                transform: translate(551%,-465%) rotateY(0deg);

                }
    
  }

  .ajman-car1{
    display: block;
    width: 4%;
    height: 5.4%;
    left: 37.1%;
    top: 74.4%;
    background: url(../image/ajman/animation/car-animation.gif) center center no-repeat transparent;
    background-size: 60% auto;
    z-index: 3;
   
     -webkit-animation: ajmancar1 40s infinite linear; 
    -moz-animation: ajmancar1 40s infinite linear;
    -o-animation: ajmancar1 40s infinite linear;
    -ms-animation: ajmancar1 40s infinite linear;
     animation: ajmancar1 40s infinite linear;
}

@keyframes ajmancar1{
    
    0%
    {
        
-webkit-transform: translate(0%) rotateZ(5deg);
                transform: translate(0%) rotateZ(5deg);

                }

    50%
    {
        
-webkit-transform: translate(431%,23%) rotateZ(5deg);
                transform: translate(431%,23%) rotateZ(5deg);

                }
  50.5%
    {
        
-webkit-transform: translate(431%,23%) rotateY(180deg);
                transform: translate(431%,23%) rotateY(180deg);

                }
   99%
    {
        
-webkit-transform: translate(0%,0%) rotateY(180deg);
                transform: translate(0%,0%) rotateY(180deg);

                }
  100%
    {
        
-webkit-transform: translate(0%,0%) rotateY(0deg);
                transform: translate(0%,0%) rotateY(0deg);

                }
    
  }

  .ajman-car2{
   display: block;
    width: 2.5%;
    height: 3.4%;
    left: 77.4%;
    top: 24.7%;
    background: url(../image/ajman/animation/car2.png) center center no-repeat transparent;
    background-size: 60% auto;
    z-index: 3;
     -webkit-animation: ajmancar2 40s infinite linear; 
    -moz-animation: ajmancar2 40s infinite linear;
    -o-animation: ajmancar2 40s infinite linear;
    -ms-animation: ajmancar2 40s infinite linear;
     animation: ajmancar2 40s infinite linear;
}

@keyframes ajmancar2{
    
    0%
    {
        
-webkit-transform: translate(0%) rotateZ(0deg);
                transform: translate(0%) rotateZ(0deg);

                }

    55%
    {
        
-webkit-transform: translate(-370%,331%) rotateZ(0deg);
                transform: translate(-370%,331%) rotateZ(0deg);

                }
  55.5%
    {
        
-webkit-transform: translate(-375%,331%) rotateZ(-10deg);
                transform: translate(-375%,331%) rotateZ(-10deg);
              }
   
  92%
    {
        
-webkit-transform: translate(-658%,737%) rotateZ(-10deg);
                transform: translate(-658%,737%) rotateZ(-10deg);

                }
  92.5%
    {
        
-webkit-transform: translate(-658%,737%) rotateZ(-6deg);
                transform: translate(-658%,737%) rotateZ(-6deg);

                }
  100%
    {
        
-webkit-transform: translate(-751%,844%) rotateZ(-6deg);
                transform: translate(-751%,844%) rotateZ(-6deg);

                }
    
  }


 .ajman-car3{
    display: block;
    width: 2.5%;
    height: 3.4%;
    left: 75.8%;
    top: 26.7%;
    background: url(../image/ajman/animation/car3.png) center center no-repeat transparent;
    background-size: 55% auto;
    z-index: 3;
    -webkit-animation: ajmancar3 36s infinite linear; 
    -moz-animation: ajmancar3 36s infinite linear;
    -o-animation: ajmancar3 36s infinite linear;
    -ms-animation: ajmancar3 36s infinite linear;
     animation: ajmancar3 36s infinite linear;
}

@keyframes ajmancar3{
    
    0%
    {
        
-webkit-transform: translate(0%) rotateZ(0deg);
                transform: translate(0%) rotateZ(0deg);

                }

    50%
    {
        
-webkit-transform: translate(-302%,271%) rotateZ(0deg);
                transform: translate(-302%,271%) rotateZ(0deg);

                }
  50.5%
    {
        
-webkit-transform: translate(-308%,271%) rotateZ(-8deg);
                transform: translate(-308%,271%) rotateZ(-8deg);

                }
   
  90%
    {
        
-webkit-transform: translate(-591%,679%) rotateZ(-15deg);
                transform: translate(-591%,679%) rotateZ(-15deg);

                }
  90.5%
    {
        
-webkit-transform: translate(-591%,679%) rotateZ(-10deg);
                transform: translate(-591%,679%) rotateZ(-10deg);

                }
  100%
    {
        
-webkit-transform: translate(-701%,803%) rotateZ(-10deg);
                transform: translate(-701%,803%) rotateZ(-10deg);

                }
    
  }

  .ajman-car4{
    display: block;
    width: 2.5%;
    height: 3.4%;
    left: 18.8%;
    top: 40.3%;
    background: url(../image/ajman/animation/car4.png) center center no-repeat transparent;
    background-size: 55% auto;
    z-index: 3;
    -webkit-animation: ajmancar4 36s infinite linear; 
    -moz-animation: ajmancar4 36s infinite linear;
    -o-animation: ajmancar4 36s infinite linear;
    -ms-animation: ajmancar4 36s infinite linear;
     animation: ajmancar4 36s infinite linear;
}

@keyframes ajmancar4{
    
    0%
    {
        
-webkit-transform: translate(0%) rotateZ(0deg);
                transform: translate(0%) rotateZ(0deg);

                }

    10%
    {
        
-webkit-transform: translate(108%,101%) rotateZ(0deg);
                transform: translate(108%,101%) rotateZ(0deg);

                }
  10.5%
    {
        
-webkit-transform: translate(115%,101%) rotateZ(-7deg);
                transform: translate(115%,101%) rotateZ(-7deg);

                }
    60%
    {
        
-webkit-transform: translate(656%,435%) rotateZ(-7deg);
                transform: translate(656%,435%) rotateZ(-7deg);

                }
   
 
  100%
    {
        
-webkit-transform: translate(1090%,769%) rotateZ(-5deg);
                transform: translate(1090%,769%) rotateZ(-5deg);

                }
    
  }

  .ajman-festivalland{
    display: block;
    width: 6.5%;
    height: 6.4%;
    left: 40.1%;
    top: 68%;
    background: url(../image/ajman/animation/festival-land.gif) center center no-repeat transparent;
    background-size: 100% auto;
}

.ajman-groupbird{
    display: block;
    width: 4.5%;
    height: 4.4%;
    left: 60.1%;
    top: 63%;
    background: url(../image/ajman/animation/birds/groupbird1.gif) center center no-repeat transparent;
    background-size: 100% auto;
    z-index: 5;
    -webkit-animation: ajmanbird3 40s infinite linear;
  -moz-animation: ajmanbird3 40s infinite linear;
  -o-animation: ajmanbird3 40s infinite linear;
  -ms-animation: ajmanbird3 40s infinite linear;
  animation: ajmanbird3 40s infinite linear;
}
@keyframes ajmanbird3{
    
    0%
    {
        
-webkit-transform: translate(0%) rotateZ(0deg);
                transform: translate(0%) rotateZ(0deg);

                }

    100%
    {
        
-webkit-transform: translate(-200%,0%) rotateZ(0deg);
                transform: translate(-200%,0%) rotateZ(0deg);

                }
     
  }
.ajman-birdimggroup1{
    display: block;
    width: 3.3%;
    height: 3%;
    left: 56.3%;
    top: 63.5%;
    background: url(../image/ajman/animation/birds/birdimggroup1.png) center center no-repeat transparent;
    background-size: 100% auto;
    z-index: 5;
}
.ajman-birdimggroup2{
    display: block;
    width: 4.3%;
    height: 3%;
    left: 60.5%;
    top: 66.4%;
    background: url(../image/ajman/animation/birds/birdimggroup2.png) center center no-repeat transparent;
    background-size: 100% auto;
    z-index: 5;
}
.ajman-bird1{
    display: block;
    width: 2%;
    height: 2.4%;
    left: 60.1%;
    top: 63%;
    background: url(../image/ajman/animation/birds/bird3.gif) center center no-repeat transparent;
    background-size: 70% auto;
    z-index: 6;
    -webkit-animation: ajmanbird2 40s infinite linear;
  -moz-animation: ajmanbird2 40s infinite linear;
  -o-animation: ajmanbird2 40s infinite linear;
  -ms-animation: ajmanbird2 40s infinite linear;
  animation: ajmanbird2 40s infinite linear;
}
.ajman-bird2{
    display: block;
    width: 2%;
    height: 2.4%;
    left: 59%;
    top: 65%;
    background: url(../image/ajman/animation/birds/bird3.gif) center center no-repeat transparent;
    background-size: 60% auto;
    z-index: 7;/*

    transform: translate(0%,0%) rotateX(0deg);*/
  -webkit-animation: ajmanbird2 40s infinite linear;
  -moz-animation: ajmanbird2 40s infinite linear;
  -o-animation: ajmanbird2 40s infinite linear;
  -ms-animation: ajmanbird2 40s infinite linear;
  animation: ajmanbird2 40s infinite linear;
}
@keyframes ajmanbird2{
    
    0%
    {
        
-webkit-transform: translate(0%) rotateZ(0deg);
                transform: translate(0%) rotateZ(0deg);

                }

    100%
    {
        
-webkit-transform: translate(-352%,0%) rotateZ(0deg);
                transform: translate(-352%,0%) rotateZ(0deg);

                }
     
  }
.ajman-bird3{
    display: block;
    width: 2%;
    height: 2.4%;
    left: 61.8%;
    top: 64.5%;
    background: url(../image/ajman/animation/birds/bird3.gif) center center no-repeat transparent;
    background-size: 60% auto;
    z-index: 7;
    -webkit-animation: ajmanbird2 40s infinite linear;
  -moz-animation: ajmanbird2 40s infinite linear;
  -o-animation: ajmanbird2 40s infinite linear;
  -ms-animation: ajmanbird2 40s infinite linear;
  animation: ajmanbird2 40s infinite linear;
}
.ajman-bird4{
    display: block;
    width: 2%;
    height: 2.2%;
    left: 53.3%;
    top: 63.5%;
    background: url(../image/ajman/animation/birds/bird4.gif) center center no-repeat transparent;
    background-size: 80% auto;
    z-index: 7;
}
.ajman-bird5{
    display: block;
    width: 2.2%;
    height: 3%;
    left: 63.3%;
    top: 69.5%;
    background: url(../image/ajman/animation/birds/bird4.gif) center center no-repeat transparent;
    background-size: 100% auto;
    z-index: 7;
}
.ajman-bird6{
    display: block;
    width: 2.3%;
    height: 3%;
    left: 63.5%;
    top: 71.5%;
    background: url(../image/ajman/animation/birds/bird15.gif) center center no-repeat transparent;
    background-size: 100% auto;
    z-index: 7;
}
.ajman-bird7{
    display: block;
    width: 2%;
    height: 3%;
    left: 53.3%;
    top: 63.5%;
    background: url(../image/ajman/animation/birds/bird1.gif) center center no-repeat transparent;
    background-size: 90% auto;
    z-index: 8;
  -webkit-animation: ajmanbird7 40s infinite linear;
  -moz-animation: ajmanbird7 40s infinite linear;
  -o-animation: ajmanbird7 40s infinite linear;
  -ms-animation: ajmanbird7 40s infinite linear;
  animation: ajmanbird7 40s infinite linear;
}
@keyframes ajmanbird7{
    
    0%
    {
        
-webkit-transform: translate(0%) rotateZ(0deg);
                transform: translate(0%) rotateZ(0deg);

                }

    100%
    {
        
-webkit-transform: translate(507%,71%) rotateZ(0deg);
                transform: translate(507%,71%) rotateZ(0deg);

                }
     
  }