SVG2CSS : output files

animations.css

@keyframes dropball {
	0% {
		bottom: 200px;
	}
	2% {
		bottom: 198.89046144485474px;
		left: 2.000002145767212px;
	}
	4% {
		bottom: 197.5577425956726px;
		left: 4.000004291534424px;
	}
	6% {
		bottom: 195.3596692085266px;
		left: 5.999995708465576px;
	}
	7% {
		bottom: 192.5960192680359px;
		left: 6.999996662139893px;
	}
	9% {
		bottom: 189.49127101898193px;
		left: 8.999999046325684px;
	}
	10% {
		bottom: 186.1709690093994px;
		left: 10px;
	}
	11% {
		bottom: 182.70591926574707px;
		left: 11.000000953674316px;
	}
	12% {
		bottom: 179.13814735412598px;
		left: 12.000001907348633px;
	}
	13% {
		bottom: 175.49418449401855px;
		left: 12.999998092651367px;
	}
	14% {
		bottom: 171.79171752929688px;
		left: 13.999999046325684px;
	}
	15% {
		bottom: 168.04300498962402px;
		left: 15px;
	}
	16% {
		bottom: 160.43976974487305px;
		left: 16px;
	}
	17% {
		bottom: 156.59682846069336px;
		left: 17.000001907348633px;
	}
	18% {
		bottom: 152.7318572998047px;
		left: 17.999998092651367px;
	}
	19% {
		bottom: 144.94751739501953px;
		left: 18.999998092651367px;
	}
	20% {
		bottom: 141.03264236450195px;
		left: 20px;
	}
	21% {
		bottom: 133.16590881347656px;
		left: 21px;
	}
	22% {
		bottom: 129.2165756225586px;
		left: 22.000001907348633px;
	}
	23% {
		bottom: 121.2911605834961px;
		left: 22.999998092651367px;
	}
	24% {
		bottom: 113.33521270751955px;
		left: 23.999998092651367px;
	}
	25% {
		bottom: 105.3537826538086px;
		left: 25px;
	}
	26% {
		bottom: 97.35050964355469px;
		left: 26px;
	}
	27% {
		bottom: 89.328369140625px;
		left: 27.000001907348633px;
	}
	28% {
		bottom: 81.2899169921875px;
		left: 27.999998092651367px;
	}
	29% {
		bottom: 73.23715209960938px;
		left: 28.999998092651367px;
	}
	30% {
		bottom: 65.17164611816406px;
		left: 30px;
	}
	31% {
		bottom: 57.09471130371093px;
		left: 31px;
	}
	32% {
		bottom: 49.00764465332031px;
		left: 32px;
	}
	33% {
		bottom: 36.85993957519531px;
		left: 32.999996185302734px;
	}
	34% {
		bottom: 28.751373291015625px;
		left: 34px;
	}
	35% {
		bottom: 16.575027465820312px;
		left: 35px;
	}
	36% {
		bottom: 8.449356079101562px;
		left: 36px;
	}
	37% {
		bottom: 5.6273956298828125px;
		left: 37px;
	}
	38% {
		bottom: 9.474273681640625px;
		left: 37.999996185302734px;
	}
	39% {
		bottom: 13.295852661132812px;
		left: 39px;
	}
	40% {
		bottom: 17.087554931640625px;
		left: 40px;
	}
	41% {
		bottom: 24.556503295898438px;
		left: 41px;
	}
	42% {
		bottom: 28.216049194335934px;
		left: 42.00000000000001px;
	}
	43% {
		bottom: 31.808395385742188px;
		left: 42.999996185302734px;
	}
	45% {
		bottom: 35.3138427734375px;
		left: 44.99999999999999px;
	}
	46% {
		bottom: 38.70347595214844px;
		left: 46px;
	}
	47% {
		bottom: 41.93290710449219px;
		left: 47px;
	}
	48% {
		bottom: 44.93080139160156px;
		left: 47.99999618530273px;
	}
	50% {
		bottom: 47.578704833984375px;
		left: 50px;
	}
	52% {
		bottom: 49.67784118652344px;
		left: 52px;
	}
	54% {
		bottom: 50.92765808105468px;
		left: 53.999996185302734px;
	}
	56% {
		bottom: 51.02694702148437px;
		left: 56px;
	}
	58% {
		bottom: 49.938507080078125px;
		left: 57.999996185302734px;
	}
	60% {
		bottom: 47.933502197265625px;
		left: 60px;
	}
	61% {
		bottom: 45.32872009277344px;
		left: 61px;
	}
	63% {
		bottom: 42.34429931640625px;
		left: 63.000003814697266px;
	}
	64% {
		bottom: 39.11199951171875px;
		left: 63.999996185302734px;
	}
	65% {
		bottom: 35.71031188964844px;
		left: 65px;
	}
	66% {
		bottom: 32.18757629394531px;
		left: 66px;
	}
	67% {
		bottom: 28.575515747070312px;
		left: 66.99999237060547px;
	}
	68% {
		bottom: 24.89520263671875px;
		left: 68px;
	}
	69% {
		bottom: 21.161895751953125px;
		left: 69px;
	}
	70% {
		bottom: 17.3868408203125px;
		left: 70px;
	}
	71% {
		bottom: 13.579330444335938px;
		left: 71px;
	}
	72% {
		bottom: 5.90618896484375px;
		left: 72px;
	}
	73% {
		bottom: 2.0910797119140625px;
		left: 73px;
	}
	74% {
		bottom: 3.0439453125px;
		left: 74px;
	}
	75% {
		bottom: 6.3134307861328125px;
		left: 75px;
	}
	77% {
		bottom: 9.31329345703125px;
		left: 76.99999237060547px;
	}
	79% {
		bottom: 11.872848510742188px;
		left: 79px;
	}
	80% {
		bottom: 13.68403625488281px;
		left: 80px;
	}
	82% {
		bottom: 14.308319091796875px;
		left: 82px;
	}
	84% {
		bottom: 13.5106201171875px;
		left: 84px;
	}
	86% {
		bottom: 11.5677490234375px;
		left: 86px;
	}
	88% {
		bottom: 8.915969848632812px;
		left: 88px;
	}
	89% {
		bottom: 5.852020263671875px;
		left: 89px;
	}
	90% {
		bottom: 2.5506134033203125px;
		left: 90px;
	}
	92% {
		bottom: 0.8137359619140625px;
		left: 92px;
	}
	93% {
		bottom: 3.8302154541015625px;
		left: 93px;
	}
	95% {
		bottom: 5.7218170166015625px;
		left: 94.99999237060547px;
	}
	97% {
		bottom: 5.4010467529296875px;
		left: 96.99999237060547px;
	}
	99% {
		bottom: 3.1641998291015625px;
		left: 99px;
	}
	100% {
		left: 100px;
	}
	98% {
		left: 97.99999237060547px;
	}
	96% {
		left: 95.99999237060547px;
	}
	94% {
		left: 94px;
	}
	91% {
		left: 91px;
	}
	87% {
		left: 86.99999237060547px;
	}
	85% {
		left: 85px;
	}
	83% {
		left: 83px;
	}
	81% {
		left: 81px;
	}
	78% {
		left: 78px;
	}
	76% {
		left: 76px;
	}
	62% {
		left: 62px;
	}
	59% {
		left: 58.999996185302734px;
	}
	57% {
		left: 56.999996185302734px;
	}
	55% {
		left: 55px;
	}
	53% {
		left: 52.999996185302734px;
	}
	51% {
		left: 51px;
	}
	49% {
		left: 48.99999618530273px;
	}
	44% {
		left: 43.99999999999999px;
	}
	8% {
		left: 7.999997615814209px;
	}
	5% {
		left: 4.99999475479126px;
	}
	3% {
		left: 3.0000030994415283px;
	}
	1% {
		left: 1.000001072883606px;
	}
}

base.css

/* Add Your CSS */
.ball {
	left: 100px;
 	bottom: 100px;
	height: 20px;
  	width: 20px;
	background: white;
  	border-radius: 50%;
 	position: absolute;
	animation: dropball 2s infinite;
} 

index.html

<!-- Add Your HTML -->
<div class="ball"></div>