Using SquareSpace to edit html/css

I am trying to create a website on Squarespace and am having trouble selecting elements on my HTML page to use in the custom css. When I use the inspect element on my browser, the ID's for some elements change while others are constant.

I am running the developer mode and downloaded the code to my local machine via github.

In the downloaded site.region file I found the div element which contains the content I am trying to style:

<div id="content" class="main-content" data-content-field="main-content" data-collection-id="{collection.id}" {.equal? collection.typeName "gallery"}{.or}{.equal? collection.typeName "index"}{.or}data-edit-main-image="Banner"{.end}{.end}>
     {squarespace.main-content}
</div>

Where is {squarespace.main-content} coming from and how do I select elements inside of it to style?