<div class="stage" direction="right" style="height: 75vh;">
<div id="clouds-1" class="clouds"></div>
<div id="clouds-2" class="clouds"></div>
<div id="clouds-3" class="clouds"></div>
</div>
.stage { position: relative; top: 0; left: 0; overflow: hidden; } .clouds { position: absolute; width: 100%; height: 500px; top: 0; left: 0; } #clouds-1 { background: transparent url(https://torn.com/images/v2/travel_agency/clouds/clouds_3_row.png) left center repeat-x; animation: bread 80s linear infinite; } #clouds-2 { background: transparent url(https://torn.com/images/v2/travel_agency/clouds/clouds_1_row.png) left center repeat-x; animation: pan 120s linear infinite; } #clouds-3 { background: transparent url(https://torn.com/images/v2/travel_agency/clouds/clouds_2_row.png) left center repeat-x; animation: pan 60s linear infinite; } @keyframes pan { from {background-position: 0;} to {background-position: -2000px;} }
If for this tutorial you need a plugin you can find it in the plugin page.
