Thanks so much @arminunruh!!! This worked perfectly!

Thanks @arminunruh i can do this.

@arminunruh Thank you for your reply and the solutions provided. Just in case you got me wrong: I created a one row layout with a fullscreen carousel (fixed height: 100vH, filled slides) and text elements "on image". Now I'm trying to change these elements (e.g. the site title) on a specific carousel slide (2) like this: .slug-fullscreen .lay-carousel-slide:nth-child(2) .sitetitle span{ color: white !important; } Does this make any sense?

it seems the sliding speed is set to 0 pls check this setting in lay options → fullscreen slider addon [image: 1665657238630-screenshot-2022-10-13-at-12.33.33.png] and set it to a higher value u could also create a custom phone layout that contains a carousel

the issue was there was custom css

no sorry :/

hey there one day i will work on this feature where you can create a menu or any overlay by creating a page in the gridder its on my todo list not sure when i will work on it!

Very cool! I'll try that. Thank you Armin for sharing the post!

Yesss. Meant cursors! Thxxx. Would be super super nice :)))

https://laytheme.com/documentation/custom-css-styling.html#css-based-on-current-page

<script> var showDesktop = false; jQuery(document).on("mouseenter click", ".desktopbutton", function(e) { e.stopPropagation(); if( showDesktop ) { jQuery("nav").removeClass("navoff"); }else{ jQuery("nav").addClass("navoff"); } showDesktop = !showDesktop; }); the touchstart event is triggered at the same time the click event is triggered. you need to read about event propagation, google it var showMobile = false; jQuery(".mobilebutton",).on("click", function(e) { e.stopPropagation(); if( showMobile == true ) { jQuery("nav").removeClass("navoff"); }else{ jQuery("nav").addClass("navoff"); } showMobile = !showMobile; }); jQuery(document).on("click", function(event) { // hide desktop and mobile menu // if you dont want these menus to get hidden when clicking on a menu point, // you need to take a look at event.target and see if that element or its parents are part of the menu }); u probably also only need to add and remove one class: navoff instead of switching out navon, navoff. the navoff class just has opacity: 0; i'd recommend you to read a beginners book about jquery to learn how to do things like that or post questions like that on stackoverflow or sth i didn't test this code, idk if it really works well. but i don't have time to help you more than that, as its custom coding

can you send your website address, /wp-admin/ username and password and a link to this topic to info@laytheme.com?

not possible but it is planned

sorry! see this setting: [image: 1665506956743-screenshot-2022-10-11-at-18.48.58.png]

u can find the correct working code here: https://laytheme.com/documentation/custom-javascript.html#newpage-events <script> var colors = ["#fff", '#000', '#f0f', '#0ff', '#00f', '#ff0', '#0f0'] window.laytheme.on("newpageshown", function(){ var ix = getRandomInt(0, colors.length); var color = colors[ix]; jQuery('#grid, #custom-phone-grid, .cover-region-desktop, .cover-region-phone, #footer, #footer-custom-phone-grid').css('background-color', color); }); // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/random // Returns a random integer between min (included) and max (excluded) function getRandomInt(min, max) { min = Math.ceil(min); max = Math.floor(max); return Math.floor(Math.random() * (max - min)) + min; } </script> @Giammi read the text at the link above, u can find out how to do that there

Found a solution :) If someone has the same problem: ._MarqueeSmall_no_spaces:hover{ -webkit-text-stroke: 2px #FFFFFF; color: transparent; transition: 0.25s ease-in-out; } ._MarqueeSmall_no_spaces{ color: white; -webkit-text-stroke: unset; } this works perfectly fine for me :)

Hey Armin ! I figured it out in the end : First I think there was an issue with the fact that I was using a space in the name of the font. Then I only used .woff2 as mentioned here. Here's the code input now for people that need it. This is both in the custom CSS and the file.css supplied to the Add by "<link>" tag and CSS webfonts option of LayTheme. @font-face { font-family: 'GTAmerica'; src: url('/wp-content/themes/fonts/gtamerica/GT-America-Standard-Ultra-Light.woff2') format('woff2'); font-weight: 100; font-style: normal; font-display: swap; } @font-face { font-family: 'GTAmerica'; src: url('/wp-content/themes/fonts/gtamerica/GT-America-Standard-Thin.woff2') format('woff2'); font-weight: 200; font-style: normal; font-display: swap; } etc. for the rest of the family fonts. Then in the import options : Font name : GTAmerica Link tag : <link href="https://triplesine.com/wp-content/fonts/gtamerica/gtamerica.css" rel="stylesheet" type="text/css"> "font-family" CSS: font-family:'GTAmerica'; Maybe this can be added as a mini tutorial on the Lay website ? Thanks to everyone at Lay Theme for this great theme : )