Caroline_Smith

I think this would be possible using custom coded forms in addition to the default signup forms squarespace offers. Of course you would need a developer to write the code for you because this is an advanced function that is not native to the platform.

No Problem!

I don't think you would need code to do this. You can change the focal point of a background image and when the page resizes, it will recenter the image around the focal point. So you could place the focal point (the open white circle) over the couple walking, and on mobile, that's what will be shown. Is this the answer you needed?

It sounds like you need to use the URL mappings feature in Squarespace to redirect each portfolio page to the new page from your site. I have a blog post about a similar issue dealing with Squarespace store pages, but you can easily repurpose the instructions for portfolio pages.

You could try using the "#page" selector instead. This will cover all links in the main content area, i.e. not the header and footer links. #page a:hover { font-style: italic; color:#990000!important; text-decoration: underline !important; text-decoration-thickness: 1px !important; text-decoration-color: #990000 !important; }

If you are using a Mega Menu in Squarespace 7.1, chances are it is not web-accessible/keyboard accessible. What makes a mega menu meet web accessibility requirements? Accessible mega menus should open on mouse-click or delayed mouse-hover, include proper ARIA and role attributes for screen readers, and use conventional keyboard triggers that make them easily accessible to people with disabilities. To learn more, read my blog post How to Make Mega Menus Web-Accessible.

With the Free Comparison Table Generator, you can create as many comparison tables for your Squarespace 7.0 or 7.1 website without having to write your own code. Whether you want to compare products, services, hotel resorts, dogs, or anything else, you can easily generate comparison table HTML and CSS with customization colors, optional images, links, and pricing.

What is your website URL?

I think you could achieve this without code. Since the rest of your site pages are white, you could just make the header theme white in general, and it will have the same affect while also making it white on the home page. But, if you still think you need the CSS code, you can add this to the Page Header code injection of the home page. <style> #header { background-color: #ffffff; } </style>

Is this for a Squarespace 7.0 or 7.1 site?

The best way I have found so far is to give the list items container a negative margin-bottom and margin-top to lessen the space. Replace the max-height rule with this, and you'll need to change the margin-bottom and margin-top property to a negative value that works for you on mobile: @media screen and (max-width: 575px) { .user-items-list-banner-slideshow .slide-content { margin-bottom: -149px; margin-top: -149px; } }

Here is a code snippet that will accomplish that on mobile. However, I think it would be more beneficial to change the text to black in general since the background is very light all around (on all devices). //Start: Make text in Homepag ehero black on mobile @media(max-width: 550px) { [data-section-id="6339b4b3a8b2184f09f0f518"] { h1, h2, h3, h4, h5, h6, p, span { color: black; } } } //End: Make text in Homepag ehero black on mobile

It's not that it moves it to the bottom of the page; it has to do with how the arrows are positioned within the page section. Here is my best attempt at explaining it: The arrows are positioned with "position: absolute;" Elements that are positioned with "absolute" are removed from the natural document flow, and therefore no actual space is created for the element in the page layout. This allows us to place an element with absolute position in the exact place we want it in the document instead of where it would normally be placed. So this means that if the page section has the property "max-height: 825px", it will not account for the space that the arrows would take up if they were positioned normally with the document flow, so it essentially just ignores the arrows and that makes them overlap in the footer.

Have you tried clearing your cache?

I would try reuploading the fonts. I can't think of what else could be happening. I have noticed recently that the images uploaded using "Manage Custom Files" have been changing randomly, causing me to have to change my CSS. I don't know why.