<div id="leaves">   <i></i>   <i></i>   <i></i>   <i></i>   <i></i>   <i></i>   <i></i>   <i></i>   <i></i>   <i></i>   <i></i>   <i></i>   <i></i>   <i></i>   <i></i>  </div>   

   body {background: #222;}  /* leaf animations */  #leaves {position:relative;top:-50px;width:100%;text-align: right;}  #leaves i {     display: inline-block;     width: 200px;     height: 150px;     background: linear-gradient(to bottom right, #309900, #005600);     transform: skew(20deg);     border-radius: 5% 40% 70%;     box-shadow: inset 0px 0px 1px #222;     border: 1px solid #333;     z-index: 1;     -webkit-animation: falling 5s 0s infinite; }  #leaves i:nth-of-type(2n) { -webkit-animation: falling2 5s 0s infinite; } #leaves i:nth-of-type(3n) { -webkit-animation: falling3 5s 0s infinite; }  #leaves i:before {   position: absolute;   content: '';   top: 117px;   right: 9px;   height: 27px;   width: 32px;   transform: rotate(49deg);   border-radius: 0% 15% 15% 0%;   border-top: 1px solid #222;   border-bottom: 1px solid #222;   border-left: 0px solid #222;   border-right: 1px solid #222;   background: linear-gradient(to right, rgba(0,100,0,1), #005600);   z-index: 1;