Wolfsilon

Hmmm,
You could try:
@media only screen and (max-width:640px){ .portfolio-hover { min-height: unset; } .portfolio-hover-display { min-height: unset; } }  

Hello there,
I think there isn't an easy way to achieve your desired results regarding how the cards scroll to the left or right. However, the arrows are more easily fixed. 
 
.sqs-gallery-design-carousel .sqs-gallery-controls .next, .sqs-gallery-design-carousel .sqs-gallery-controls .previous { margin: 0 15px 15px 0 !important; } If you want a more robust slider/carousel, I'd look into using Swiper.JS or similar Javascript library. You can target the above selectors for further customization as well.
 
Best,
Dan

Hi there,
I just checked on Safari and didn't see any outline on the Nav.
Did you solve the problem?

Try 
@media screen and (max-width: 833px) { .design-layout-poster .image-card-wrapper { background-color: rgba(0,0,0,.5) !important; } }  

@Wolfsilon Great, that worked. Thank you!

@palomamcclain I'd love to help you build your website, answer any questions that you have, and/or provide my services. I'd very much like to see your art be displayed in the best ways possible (I'm an artist as well) -- I understand your budget restrictions, so... please consider this an early Holiday gift. Message me if you'd like.
 

Hi there!
This is really neat! Thanks for sharing. Achieving something like this would take some custom coding and need to use Javascript. The code for this isn't as simple as it may seem so you might want to look into hiring a developer to help you. If you're familiar with coding, I'd be more than happy to give some pointers or suggestions.
 
Best,
Dan

Hi Anne,
I'm afraid that the solution for these issues are not possible using the tools available. You will need to use CSS and possibly Javascript in order to get this working properly.
 
Best,
Dan

Hi CPharmacyScot,
I took a look at your website -- it looks nice by the way! You'll need to adjust the media queries for both mobile and tablet. You'll end up with 2 separate CSS queries. You'll need to decide the breakpoints, but mobile is almost always set as "640px" or below.
Another note, on my end all of the circle images in the rows are oval-shaped, I'm not sure is that was the intended look, but either way looks good!
Best,
Dan
 

Hi there!
This is really neat! Thanks for sharing. Achieving something like this would take some custom coding and need to use Javascript. The code for this isn't as simple as it may seem so you might want to look into hiring a developer to help you. If you're familiar with coding, I'd be more than happy to give some pointers or suggestions.
 
Best,
Dan

Hi,
if I remember correctly, some of the banners aren’t actually only H1 text, they are either nest in another class, links (<a>), or a different class of their own.
If you’d only like to use that font, you can try adding: 
* {
font-family: “your-font-here” !important;
}

if this works, you may need to be more specific with your code targeting. 

Great, glad to hear that. Happy Coding!

Hello there,
To add an animated arrow down element, we'll need to use a Code Block and Custom CSS.
1) Create a Code Block and place the block directly underneath the "Get A Quote" button.
2) In the Code Block menu, you'll see "<p> hello world! </p>" -- Remove the entire line and replace it with the following: 
<div class="arrow"> <span></span> </div> 3) You can now save and close the page editor. Return to "Home" and navigate to Design > Custom CSS.
4) To animate and place the element onto your website you can paste the following into the Custom CSS box:
 .arrow{     position: absolute;     top: 50%;     left: 50%;     transform: translate(-50%,-50%); } .arrow span{     display: block;     width: 30px;     height: 30px;     border-bottom: 3px solid #000;     border-right: 3px solid #000;     transform: rotate(45deg);     margin: -10px;     animation: animate 1.8s ease infinite; } @keyframes animate {     0%{         opacity: 0;         transform: rotate(45deg) translate(-20px,-20px);     }     50%{         opacity: 1;     }     100%{         opacity: 0;         transform: rotate(45deg) translate(20px,20px);     } } 5) You should start to see the arrow animate downward in the center of the page, directly under the "Get A Quote" button. 
You can customize the "stroke" of the arrow by adjusting the dimensions of the Border-Bottom and Border-Right "px" properties.
You can adjust the color of the arrow ("stroke") by inserting a hex/rgb/rgba color of your choice. Simply replace the "#000" with the color/format of your choice for both Border-Bottom and Border-Right.
You can adjust the speed of the downwards animation by entering new timings and transitions. The CSS format of the animation shown above is listed below and I would encourage you to experiment with different properties for transition-duration and timing-function. 
 
Let me know if you need any additional help. Hope this provided a solution for you! 
Cheers,
Dan

Hello there,
To add an animated arrow down element, we'll need to use a Code Block and Custom CSS.
1) Create a Code Block and place the block directly underneath the "Get A Quote" button.
2) In the Code Block menu, you'll see "<p> hello world! </p>" -- Remove the entire line and replace it with the following: 
<div class="arrow"> <span></span> </div> 3) You can now save and close the page editor. Return to "Home" and navigate to Design > Custom CSS.
4) To animate and place the element onto your website you can paste the following into the Custom CSS box:
 .arrow{     position: absolute;     top: 50%;     left: 50%;     transform: translate(-50%,-50%); } .arrow span{     display: block;     width: 30px;     height: 30px;     border-bottom: 3px solid #000;     border-right: 3px solid #000;     transform: rotate(45deg);     margin: -10px;     animation: animate 1.8s ease infinite; } @keyframes animate {     0%{         opacity: 0;         transform: rotate(45deg) translate(-20px,-20px);     }     50%{         opacity: 1;     }     100%{         opacity: 0;         transform: rotate(45deg) translate(20px,20px);     } } 5) You should start to see the arrow animate downward in the center of the page, directly under the "Get A Quote" button. 
You can customize the "stroke" of the arrow by adjusting the dimensions of the Border-Bottom and Border-Right "px" properties.
You can adjust the color of the arrow ("stroke") by inserting a hex/rgb/rgba color of your choice. Simply replace the "#000" with the color/format of your choice for both Border-Bottom and Border-Right.
You can adjust the speed of the downwards animation by entering new timings and transitions. The CSS format of the animation shown above is listed below and I would encourage you to experiment with different properties for transition-duration and timing-function. 
 
Let me know if you need any additional help. Hope this provided a solution for you! 
Cheers,
Dan

This problem has been in existence since before time. The parallax effect on 7.0 is both a blessing and a curse. Unfortunately, no. There is not a simple fix for this problem.

Hello there,
To add an animated arrow down element, we'll need to use a Code Block and Custom CSS.
1) Create a Code Block and place the block directly underneath the "Get A Quote" button.
2) In the Code Block menu, you'll see "<p> hello world! </p>" -- Remove the entire line and replace it with the following: 
<div class="arrow"> <span></span> </div> 3) You can now save and close the page editor. Return to "Home" and navigate to Design > Custom CSS.
4) To animate and place the element onto your website you can paste the following into the Custom CSS box:
 .arrow{     position: absolute;     top: 50%;     left: 50%;     transform: translate(-50%,-50%); } .arrow span{     display: block;     width: 30px;     height: 30px;     border-bottom: 3px solid #000;     border-right: 3px solid #000;     transform: rotate(45deg);     margin: -10px;     animation: animate 1.8s ease infinite; } @keyframes animate {     0%{         opacity: 0;         transform: rotate(45deg) translate(-20px,-20px);     }     50%{         opacity: 1;     }     100%{         opacity: 0;         transform: rotate(45deg) translate(20px,20px);     } } 5) You should start to see the arrow animate downward in the center of the page, directly under the "Get A Quote" button. 
You can customize the "stroke" of the arrow by adjusting the dimensions of the Border-Bottom and Border-Right "px" properties.
You can adjust the color of the arrow ("stroke") by inserting a hex/rgb/rgba color of your choice. Simply replace the "#000" with the color/format of your choice for both Border-Bottom and Border-Right.
You can adjust the speed of the downwards animation by entering new timings and transitions. The CSS format of the animation shown above is listed below and I would encourage you to experiment with different properties for transition-duration and timing-function. 
 
Let me know if you need any additional help. Hope this provided a solution for you! 
Cheers,
Dan

Thanks @Wolfsilon for sharing the solution.
I've customized some change to meet it with @KasperBed99 's site.
Kindly try the below codes in Home > Settings > Advanced > Code injection, choose Footer
<script> $(document).ready(function() { $(document).on("scroll", onScroll); }); function onScroll() { var scrollPos = $(document).scrollTop(); $('.header-display-desktop .header-nav-item > a[href*="#"]').each(function() { var currLink = $(this); var refElement = $(currLink.attr("href")).closest('section'); if (refElement.position().top <= scrollPos && refElement.position().top + refElement.height() > scrollPos) { $('.header-display-desktop .header-nav-item > a[href*="#"]').removeClass("active"); currLink.addClass("active"); } else { currLink.removeClass("active"); } }); } </script> <style> .header-nav-item > a:after { content: ''; display: block; width: 0; height: 1px; background: #fff; transition: width 0.5s ease; } .header-nav-item > a.active:after { width: 100%; } </style> Let me know how it works on your site
Support me by pressing 👍 if this useful for you

If you could please share the private viewing password so that we can enter your website, we will be able to provide a more accurate code/solution for you.
 

If you could please share the private viewing password so that we can enter your website, we will be able to provide a more accurate code/solution for you.
 

Hello there!
I don't see why it wouldn't be. The widget is a stand-alone tool that serves content to wherever you want, so long as you have a Feed ID. Widget looks pretty simple to setup but you'll probably need Jquery and simple plugin installation in your Code Injection.
 
Best,
Dan

Actually, yeah. You can use this easily, but you'd ideally want to have access to a Business Plan from their subscription offers to get the most control over your Curator widget.

@palomamcclain I'd love to help you build your website, answer any questions that you have, and/or provide my services. I'd very much like to see your art be displayed in the best ways possible (I'm an artist as well) -- I understand your budget restrictions, so... please consider this an early Holiday gift. Message me if you'd like.
 

Thank you so much for the kind words and info @paul2009! I checked my analytics and it appears that 70% of visitors use desktop and 30% use mobile. I actually really like what you did with the CSS. A couple questions:
1. Could the navigations words on the side be flipped to sitting horizontal to be read left to right, while staying on the sidebar?
2. Would there be be way to keep links like "About" "Contact" on the top, and in the sidebar put categories like "Portraits", "Pets", "Landscapes"?
Thanks so much! I honestly am considering upgrading my plan if Javascript can easily create the sidebar identical to Wells.

Hi @luislovera also try to use text blocks not code blocks only.

You'll have several options to achieve the effect you want:
1) Use Custom CSS + Javascript to build your own slideshow
2) Purchase a slideshow plugin - SQSMODS, Will Myers, and Ghost Plugins is where I'd start to look, the latter two used to have free plugins but I'm not sure anymore.
3) Edit existing tools to meet your needs - you could use any of the auto-section banner/slideshow sections and have them auto scroll.