tuanphan

Use this CSS code under
[data-filter="lokation"].sqs-block:before { content: "Lokation"; display: block; font-size: 17px; margin-top: 20px; font-weight: bold; }  

Thank you so much Tuanphan!!!
I removed 
body#collection-5bca34dee5e5f0cd07ce8da8 so that it works on all other pages.
 

The customer has told me that they changed their mind and now no longer wish to print the form. I appreciate you assistance with this though and would still be interested in the code for future reference on other projects. Here is the link to the page.
https://nebraskagolfhalloffame.com/mailed-reservations

Thank you so much @tuanphan! This worked 🙌

That did it, thank you SO much!! Your responses in other forums have also helped me many a time so thank you for sharing your time and coding wisdom!

what a hero 🙂 thanks a million 

This is a JavaScript/jQuery solution, and site-wide animations can remain enabled. Timeout is optional but will allow the animation to be visible before the page redirects.
<script>
    $('.sqs-html-block a').on('touchstart', function () {
      var href = $(this).attr('href');
      setTimeout(function(){
        window.location.href = href;
      }, 100);
    });
</script>

Someone please tell me why o why?  Why is it that every time I feel like i've exhausted all remedies and hope on finding an answer and I reach out to this forum, all of a sudden I find it.  It's taken me 2.5 hours to find this answer AND on top of that, it was from on old circle member in this forum (https://forum.squarespace.com/profile/9595-rwp/)
Not sure is he is still on but thank you for this code.  Now I have to figure out then what exactly does the margin-width do but that's another day.  This can be closed.
#header {
    max-width: 1920px;
    margin: auto;
}
section.page-section {
    max-width: 1920px;
    margin: auto;
}
 

@tuanphan This worked perfectly - Thanks Buddy 

You can follow this to share url
 

Change this code
.header-nav-item--active a { background-image: linear-gradient(#5af5fa, #5af5fa) !important; padding-bottom: 5px !important; } to this
.header-nav-item--active>a { background-image: linear-gradient(#5af5fa, #5af5fa) !important; padding-bottom: 5px !important; }  

I have invalid id, use this new code
/* prev next */ .item-pagination[data-collection-type^="portfolio"] h2 { visibility: hidden; } a.item-pagination-link.item-pagination-link--next h2:after { content: "next"; visibility: visible; } .item-pagination-link--prev h2:before { content: "previous"; visibility: visible; }  

Remove above code & use this new code
div.header-title { width: 50% !important; } .header-nav { text-align: left !important; padding-left: 0 !important; }  

Add to Design > Custom CSS or Website > Website Tools > Custom CSS
/* move title under image lightbox */ .yui3-lightbox2 .sqs-lightbox-meta { opacity: 1 !important; background-color: transparent !important; padding: 0px !important; bottom: -30px !Important; } .sqs-lightbox-slideshow .sqs-gallery-design-stacked-slide img { top: -30px !important; } .yui3-lightbox2 .sqs-lightbox-meta * { color: black !important; text-align: center; }  

Add this to Design > Custom CSS or Website > Website Tools > Custom CSS
/* Mobile fix lightbox caption overlap image */ @media screen and (max-width:767px) { .light-caption { width: calc(~"100% - 10px") !important; padding-right: 5px; padding-left: 5px; } }  

Remove code I sent & use this new code
section[class*="add-ons"] div.sqs-add-to-cart-button:hover, section[class*="add-ons"] div.sqs-add-to-cart-button:before { border-radius: 50% !important; }  

Try this new code
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script> <script> $(document).ready(function(){ setTimeout(function(){ $("h3.comment-count span").html(function() { return $(this).html().replace("Comments", "Notes"); }); $("span.comment-btn.sqs-system-button").html(function() { return $(this).html().replace("Post Comment…", "Post"); }); }, 5000); }); </script>

You can use this code to Website > Website Tools > Custom CSS
body#collection-5bca34dee5e5f0cd07ce8da8 .gallery-block:hover { cursor: pointer; }  

Thank you so much! I will try this  plug in first.

It worked! Thank you for all your help.

It's not a native option, so it's not easy to do, luckily there are lovely people who have figured this out and share their code, this is one of many options:
 

Hi, add this to custom css:
.slide-content.list-item-card-background { border: 2px solid black; }

SOLVED: with code from this post:
 
I modified the code. This is what I used to achieve a color-changing logo on scroll. However, I still need to figure out how to make the burger menu change color on scroll too.
 
/* Change logo on scroll */
.shrink .header-title-logo img {
visibility: hidden;
transition: all 0.3s;
}
.shrink .header-title-logo a {
background-image: url(https://static1.squarespace.com/static/65a2d78aa72f1c4f2b2f30fe/t/6614307825e9e667d79278b4/1712599160701/Kristy-Burrell-Photography-Vermont-Wedding-Photographer-Logo-Black.png);
background-size: contain;
background-repeat: no-repeat;
}
 

Try this new CSS code
.custom-filter-container .customFiltersWrapper .customFiltersContainer:before { content: "Kategori"; display: block; font-size: 17px; margin-top: 20px; }  

@tuanphan Thanks a lot, will try this !