CSS cover page navigation changes reverting to default

Hi,

I've added CSS to the cover-page on my site to position the navigation in top left corner, but it keeps reverting back to the original default CSS. 

<style>
 [data-slice-type="navigation"] {
   position: fixed !important;
   left: 25px !important; 
   top: 25px !important;
 }
</style>

When I load the page the nav goes to the top left for a split second and then moves back to the default spot.

Here is a link to the site – www.designbyassoc.com

Is there some CSS that can disable the default settings for that page?

Thanks

Try the following.

<style>

  /* Center navigation at top */

  @media only screen and ( min-width : 768px ) {
  
    .sqs-slide-wrapper[ data-slide-type="cover-page" ] .sqs-slice-group.align-center-vert {
    
      top : unset !important;
      transform : unset !important;
      
      }
      
    }
    
  </style>

Let us know how it goes.

Thanks very much. I tried it but it doesn't seem to work. 

It keeps wanting to go back to the original setting!

Thanks very much, that's solved it! That's really appreciated.

Sorry to ask for more help, but I’m now trying to get the cover page text size to go from the default of 20px to 25px on a mobile.

Any further help would be really appreciated.

Thanks again

Try something like the following.

.sqs-slide-wrapper[ data-slide-type="cover-page" ] [ data-slice-type="navigation" ] ul {

  font-size : 25px;
  
  }

You'll of course need to wrap the ruleset in a media query.

Let us know how it goes.

Thanks again for your help. I tried the code wrapped in a media query but it doesn't appear to be working.

I added some code to make the slide-show images clickable links and then managed to work out how to change the mobile text size as a part of that code.

Thanks again for all your help, it has been really appreciated.