How to modify CSS for the index page only in Brooklyn theme?

hi!

I wanted to remove some spacing on my index page and added this code:

.hr–large {
display: none;
}
.main-content {
padding-bottom: 0px;
}

This did the job, however it doesn’t look good on the rest of the pages. How can I make this only apply on the index page?

This is my page: https://8avadsq4ofwqtb33-51011682499.shopifypreview.com

the theme is Brooklyn

you could do it this way

.template-index .hr--large {
display: none;
}
.template-index .main-content {
padding-bottom: 0px;
}
1 Like

Perfect, thank you!