The demo items were released prior the the X 5 update so if you import them, in the most recent version of X and Cornerstone, you would be getting the Classic elements which has less options than the v2 elements.
For example the gym demo, if you try to import the demo locally, you will see that the section where the background is set have limit options compared to the sections that you will create manually in Cornerstone, thought replicating it in the v2 section element is still quite easy and straightforward.
You can simply create a new section, go to section settings, click on Advanced for the background options then set the background image to either the lower or upper layer then enable the parallax option to the layer where you set the background.
Once you had the section setup, you can then add a Classic Creative CTA element in the section. For the classic CTA element options, set 10% padding to all sides, set the text content and the text size of the CTA, select image as the graphic then set the image to it. Set the image width and set the background colors.
That should give you the same view as the CTA section in the demo content.
Normally, it is pretty easy to recreate the sections in the demo content as long as they are not heavily customized just like the CTA section of the gym demo but it would be a big plus if you know all the options in Cornerstone and you know how to inspect the code through the browser's inspect element feature.
Also, if you want to replicate the demo contents but you do not want to import it on your live site, you can setup wordpress locally and have the import there. You can then explore in Cornerstone the settings of the elements.
As for learning Cornerstone more, it would be best go over our knowledge based as it has an ample of resources that for X and Cornerstone.