Transparent navigation disappearing when I try to take my website live / click "set as homepage"

Site URL: https://unscriptedfilmco.com/home

Some scripts don't run when in setup. You log out or view them "live" and the script is running. If it has an error in it then you see it. There are some good coders here, much better than I am, and they can inspect your site for a problem. If you are using code to set your banner to transparent, post it here so we can look at it, and see what can be done to remedy the problem. 

1 hour ago, derricksrandomviews said:

Some scripts don't run when in setup. You log out or view them "live" and the script is running. If it has an error in it then you see it. There are some good coders here, much better than I am, and they can inspect your site for a problem. If you are using code to set your banner to transparent, post it here so we can look at it, and see what can be done to remedy the problem. 

Thanks! I tried viewing it in different browsers and in incognito mode, but no luck.

I implemented a coded "template" by a third party. Here is the section of CSS I believe is causing the issue - I tried changing the header from "white" to "transparent":

/* Homepage - White Header */
.homepage [data-controller="HeaderOverlay"] .Header-branding {
    filter: none;
}
.homepage .Header--bottom.Header--overlay,
.homepage .tweak-header-bottom-overlay-on-index-gallery .Header--bottom.Header--index-gallery {
    position: relative;
}
.homepage .Header-inner--bottom {
    padding-bottom: 24px;
}
.Header--overlay.flo-sticky-header,
.tweak-header-primary-nav-hover-style-plain .Header--overlay.flo-sticky-header .Header-nav .Header-nav-folder,
.homepage .Header--bottom.Header--overlay,
.homepage.tweak-header-primary-nav-hover-style-plain .Header--overlay .Header-nav .Header-nav-folder {
    background-color: #transparent;
}
.tweak-header-primary-nav-hover-style-plain .Header--overlay.flo-sticky-header .Header-nav .Header-nav-folder-item,
.tweak-header-primary-nav-hover-style-plain .Header--overlay.flo-sticky-header .Header-nav .Header-nav-item,
.homepage.tweak-header-primary-nav-hover-style-plain .Header--overlay .Header-nav .Header-nav-folder-item,
.homepage.tweak-header-primary-nav-hover-style-plain .Header--overlay .Header-nav .Header-nav-item {
    color: #fff;
}
.tweak-header-primary-nav-hover-style-plain .Header--overlay.flo-sticky-header .Header-nav .Header-nav-folder-item:hover,
.tweak-header-primary-nav-hover-style-plain .Header--overlay.flo-sticky-header .Header-nav .Header-nav-item:hover,
.homepage.tweak-header-primary-nav-hover-style-plain .Header--overlay .Header-nav .Header-nav-folder-item:hover,
.homepage.tweak-header-primary-nav-hover-style-plain .Header--overlay .Header-nav .Header-nav-item:hover {
    color: #474747;
}

Okay, lets give it some time. Some of our coders are on a different time zone so it may be a while, but hang in there. I am sure it can be fixed. 

14 hours ago, courtneynowlin said:

Thanks! I tried viewing it in different browsers and in incognito mode, but no luck.

I implemented a coded "template" by a third party. Here is the section of CSS I believe is causing the issue - I tried changing the header from "white" to "transparent":

/* Homepage - White Header */
.homepage [data-controller="HeaderOverlay"] .Header-branding {
    filter: none;
}
.homepage .Header--bottom.Header--overlay,
.homepage .tweak-header-bottom-overlay-on-index-gallery .Header--bottom.Header--index-gallery {
    position: relative;
}
.homepage .Header-inner--bottom {
    padding-bottom: 24px;
}
.Header--overlay.flo-sticky-header,
.tweak-header-primary-nav-hover-style-plain .Header--overlay.flo-sticky-header .Header-nav .Header-nav-folder,
.homepage .Header--bottom.Header--overlay,
.homepage.tweak-header-primary-nav-hover-style-plain .Header--overlay .Header-nav .Header-nav-folder {
    background-color: #transparent;
}
.tweak-header-primary-nav-hover-style-plain .Header--overlay.flo-sticky-header .Header-nav .Header-nav-folder-item,
.tweak-header-primary-nav-hover-style-plain .Header--overlay.flo-sticky-header .Header-nav .Header-nav-item,
.homepage.tweak-header-primary-nav-hover-style-plain .Header--overlay .Header-nav .Header-nav-folder-item,
.homepage.tweak-header-primary-nav-hover-style-plain .Header--overlay .Header-nav .Header-nav-item {
    color: #fff;
}
.tweak-header-primary-nav-hover-style-plain .Header--overlay.flo-sticky-header .Header-nav .Header-nav-folder-item:hover,
.tweak-header-primary-nav-hover-style-plain .Header--overlay.flo-sticky-header .Header-nav .Header-nav-item:hover,
.homepage.tweak-header-primary-nav-hover-style-plain .Header--overlay .Header-nav .Header-nav-folder-item:hover,
.homepage.tweak-header-primary-nav-hover-style-plain .Header--overlay .Header-nav .Header-nav-item:hover {
    color: #474747;
}

 

Add to Home > Design > Custom CSS

/* Home header color */
body.homepage .Header-nav-inner * {
    color: black !important;
}
body.homepage .Header-branding-logo {
    filter: invert(1);
    -webkit-filter: invert(1);
}