#clouds {
  animation: float ease 10s infinite;

	 
  }
  	@keyframes float {
  0%   {transform: translateY(0)}
  50%  {transform: translateY(5px)}
  100% {transform: translateY(0)}
}
  
  #clouds1 {
 animation: float1 ease 8s infinite;


	 
  }
  


	@keyframes float1 {
  0%   {transform: translateY(0)}
  50%  {transform: translateY(-15px)}

  100% {transform: translateY(0)}
}


  #clouds2 {
 animation: float2 ease 6s infinite;
-webkit-animation-delay: 6s; 

	 
  }
  
  #umbrellag2 {
 animation: float2 ease 6s infinite;
-webkit-animation-delay: 6s; 

	 
  }

	@keyframes float2 {
  0%   {transform: translateY(0)}
  50%  {transform: translateY(-15px)}

  100% {transform: translateY(0)}
}


  #umbrella {
	  transform-origin: center center;
	   -moz-transform-origin: center center;
  animation: brella ease 1s forwards;
-webkit-animation-delay: 5s; 
	 
  }
 
	@keyframes brella {
  0%   {transform: scaleX(1)scaleY(1); }

  100% {transform: translate(0px,120px)scaleX(1.7)scaleY(1.7);}
}

@-moz-keyframes brella{
  0% {
    -moz-transform: scaleX(1)scaleY(1); }

  100% { -moz-transform: translate(0px,120px)scaleX(1.7)scaleY(1.7);}
  }
  
  
@-webkit-keyframes brella {
 100% {
    -webkit-transform: translate(0px,0px)scaleX(1.7)scaleY(1.7);}
  }

  #umbrella1 {
	  opacity:1;
  animation: fader 10s 1.5s ease forwards;
  -webkit-animation-delay: 4s; 

	 
  }
  
@keyframes fader {
  0% { opacity: 1; }
  10% { opacity: 1; }
  15% { opacity: 0; }
  100% { opacity: 0; }
} 

	.path1 {
		
	stroke: #91bdc2;
    stroke-width: 1;
    stroke-dasharray: 1000px;
    stroke-dashoffset: 1000px;
    animation-name: draw;
    animation-duration: 5s;
    animation-fill-mode: forwards; // Stay on the last frame
    animation-iteration-count: 1; // Run only once
    animation-timing-function: linear;

    
    }
	.path6 {
		
	stroke: #3e8590;
    stroke-width:1;
    stroke-dasharray: 1000px;
    stroke-dashoffset: 1000px;
    animation-name: draw;
    animation-duration: 5s;
    animation-fill-mode: forwards; // Stay on the last frame
    animation-iteration-count: 1; // Run only once
    animation-timing-function: linear;

    
    }
 
   	.path7 {
	
	stroke: #999;
    stroke-width:1;
    stroke-dasharray: 1000px;
    stroke-dashoffset: 1000px;
    animation-name: draw;
    animation-duration: 5s;
    animation-fill-mode: forwards; // Stay on the last frame
    animation-iteration-count: 1; // Run only once
    animation-timing-function: linear;

    
    }
    
    	.umbrellapath1 {
		
	stroke: #91bdc2;
    stroke-width: 3;
    stroke-dasharray: 1000px;
    stroke-dashoffset: 1000px;
    animation-name: draw;
    animation-duration: 5s;
    animation-fill-mode: forwards; // Stay on the last frame
    animation-iteration-count: 1; // Run only once
    animation-timing-function: linear;

    
    }
	.umbrellapath6 {
		
	stroke: #3e8590;
    stroke-width:3;
    stroke-dasharray: 1000px;
    stroke-dashoffset: 1000px;
    animation-name: draw;
    animation-duration: 5s;
    animation-fill-mode: forwards; // Stay on the last frame
    animation-iteration-count: 1; // Run only once
    animation-timing-function: linear;

    
    }
 
   	.umbrellapath7 {
	
	stroke: #999;
    stroke-width:3;
    stroke-dasharray: 1000px;
    stroke-dashoffset: 1000px;
    animation-name: draw;
    animation-duration: 5s;
    animation-fill-mode: forwards; // Stay on the last frame
    animation-iteration-count: 1; // Run only once
    animation-timing-function: linear;

    
    }
    
    
    
    	.finance1 {
		
	stroke: #42858e;
    stroke-width: 3;
    stroke-dasharray: 1000px;
    stroke-dashoffset: 1000px;
    animation-name: draw;
    animation-duration: 5s;
    animation-fill-mode: forwards; // Stay on the last frame
    animation-iteration-count: 1; // Run only once
    animation-timing-function: linear;

    
    }
    
    
    .finance2 {
		
	stroke: #e67825;
    stroke-width: 3;
    stroke-dasharray: 3000px;
    stroke-dashoffset: 3000px;
    animation-name: draw;
    animation-duration: 5s;
    animation-fill-mode: forwards; // Stay on the last frame
    animation-iteration-count: infinite; // Run only once
    animation-timing-function: linear;
  -webkit-animation-delay: 0s; /* Safari 4.0 - 8.0 */

    animation-delay: 0s;
    
    }
	
		.path2 {
		
	stroke: #91bdc2;
    stroke-width: 1;
    stroke-dasharray: 1000px;
    stroke-dashoffset: 1000px;
    animation-name: draw;
    animation-duration: 3s;
    animation-fill-mode: forwards; // Stay on the last frame
    animation-iteration-count: 1; // Run only once
    animation-timing-function: linear;
  -webkit-animation-delay: 2s; /* Safari 4.0 - 8.0 */
    animation-delay: 1.7s;
    
    }
		.path3 {
		
	stroke: #91bdc2;
    stroke-width:3;
    stroke-dasharray: 1000px;
    stroke-dashoffset: 1000px;
    animation-name: draw;
    animation-duration: 3s;
    animation-fill-mode: forwards; // Stay on the last frame
    animation-iteration-count: 1; // Run only once
    animation-timing-function: linear;
  -webkit-animation-delay: 3.5s; /* Safari 4.0 - 8.0 */
    animation-delay: 3.5s;
    
    }
    
    	.umbrellapath2 {
		
	stroke: #91bdc2;
    stroke-width: 3;
    stroke-dasharray: 1000px;
    stroke-dashoffset: 1000px;
    animation-name: draw;
    animation-duration: 3s;
    animation-fill-mode: forwards; // Stay on the last frame
    animation-iteration-count: 1; // Run only once
    animation-timing-function: linear;
  -webkit-animation-delay: 2s; /* Safari 4.0 - 8.0 */
    animation-delay: 1.7s;
    
    }
		.umbrellapath3 {
		
	stroke: #91bdc2;
    stroke-width:3;
    stroke-dasharray: 1000px;
    stroke-dashoffset: 1000px;
    animation-name: draw;
    animation-duration: 3s;
    animation-fill-mode: forwards; // Stay on the last frame
    animation-iteration-count: 1; // Run only once
    animation-timing-function: linear;
  -webkit-animation-delay: 3.5s; /* Safari 4.0 - 8.0 */
    animation-delay: 3.5s;
    
    }
	
	@-webkit-keyframes draw {

  to {
    stroke-dashoffset: 0;
  }
}
	
		.path4 {
		
 stroke-dasharray:10;

}

		.path5 {
			stroke-width:1px;
	stroke: #e88d49;	
  stroke-dasharray: 1000;
  stroke-dashoffset: -1000;
  animation: dash 5s forwards;
}

		.umbrellapath4 {
		
 stroke-dasharray:10;

}

		.umbrellapath5 {
	stroke-width:3px;
	stroke: #e88d49;	
  stroke-dasharray: 1000;
  stroke-dashoffset: -1000;
  animation: dash 5s forwards;
}

@keyframes dash {
  from {
    stroke-dashoffset: -1000;
  }
  to {
    stroke-dashoffset: 0;
  }
@-webkit-keyframes draw1 {
  from {
    stroke-dashoffset: -1000;
  }
  to {
    stroke-dashoffset: 0;
  }
  

}


		.dashpath {
		
 stroke: #e88d49;

}



	@keyframes horsemove {
  0%   {transform: scaleX(1)scaleY(1); }

  100% {transform: translate(0px,120px)scaleX(1.7)scaleY(1.7);}
}

@-moz-keyframes horsemove{
  0% {
    -moz-transform: scaleX(1)scaleY(1); }

  100% { -moz-transform: translate(0px,120px)scaleX(1.7)scaleY(1.7);}
  }
  
  
@-webkit-keyframes horsemove {
 100% {
    -webkit-transform: translate(0px,0px)scaleX(1.7)scaleY(1.7);}
  }


.horse

{       	  transform-origin: center center;
	   -moz-transform-origin: center center;
  animation: horsemove ease 1s forwards;
-webkit-animation-delay: 5s; 
	 
 

}