I am in the process of creating a website using Squarespace () and I have been adding custom code to style it according to my preferences. However, I am facing an issue with the 'collection' page (which is a gallery) as it is not displaying correctly compared to other pages like the Contact page. I am struggling to find a solution to make it consistent with the rest of the site.
If anyone could kindly use Inspect Code or any similar tool to provide suggestions, I would be extremely grateful for your assistance.
Below is the current CSS that I have customized:
/* Custom Home Background */
#siteWrapper{
background-image:url('http://static1.squarespace.com/static/52dcef2ae4b086a63887d86f/t/54dd3da2e4b0977f1c7ca66e/1423785392011/Melbourne-Property-Photography-1.jpg');
background-repeat:no-repeat;
-webkit-background-size:cover;
-moz-background-size:cover;
-o-background-size:cover;
background-size:cover;
background-position:center;}
/* Styling for header div top */
.transparent-header.view-list .banner-thumbnail-wrapper, .transparent-header.collection-type-page .banner-thumbnail-wrapper {
padding: 180px 0 155px;
height: 50px
}
/* Design for Gallery and Contact page headers */
body:not(.has-banner-image).transparent-header #header, .collection-type-gallery.has-banner-image.transparent-header #header {
background-color: #3f3131;
background: -moz-linear-gradient(top, rgba(63,49,49,1) 0%, rgba(255,255,255,0) 100%); /* FF3.6+ */
...
color:#FFF
}