Trying to understand CSS priority for announcement div

[lwasser]

Hey yall. I"m working on a jupyter book for @pyOpenSci. I'm trying to add an announcement and change the color of that div. I'm fighting overriding sphinx css with my own. i've gotten the css to work in some cases but i can't seem to override that dark grey announcement color.. My css below tries many different things to get the color to override to a light grey.

Any guidance on how to properly override the default .announcement color would be helpful. When i look at web tools i dont even see the style there from my file but i know the css file is loading in the book html.

/* HEADER BLOCK (my styles trying to override default sphinx in various ways) */ 
div.header__block { 
  background-color: #fff;
  color: #222;
}

.announcement div {
  background-color: #0e6654;
}

div .announcement .header-item .noprint, header-item.announcement {
  background-color: #ccc!important;
}

Here is the CSS that i see - my style sheet is pyos.css .

<link rel="stylesheet" type="text/css" href="[_static/pygments.css](view-source:file:///Users/leahawasser/Documents/GitHub/contributing-guide/_build/html/_static/pygments.css)" />
    <link rel="stylesheet" href="[_static/styles/sphinx-book-theme.css?digest=5115cc725059bd94278eecd172e13a965bf8f5a9](view-source:file:///Users/leahawasser/Documents/GitHub/contributing-guide/_build/html/_static/styles/sphinx-book-theme.css?digest=5115cc725059bd94278eecd172e13a965bf8f5a9)" type="text/css" />
    <link rel="stylesheet" type="text/css" href="[_static/togglebutton.css](view-source:file:///Users/leahawasser/Documents/GitHub/contributing-guide/_build/html/_static/togglebutton.css)" />
    <link rel="stylesheet" type="text/css" href="[_static/copybutton.css](view-source:file:///Users/leahawasser/Documents/GitHub/contributing-guide/_build/html/_static/copybutton.css)" />
    <link rel="stylesheet" type="text/css" href="[_static/mystnb.css](view-source:file:///Users/leahawasser/Documents/GitHub/contributing-guide/_build/html/_static/mystnb.css)" />
    <link rel="stylesheet" type="text/css" href="[_static/sphinx-thebe.css](view-source:file:///Users/leahawasser/Documents/GitHub/contributing-guide/_build/html/_static/sphinx-thebe.css)" />
    <link rel="stylesheet" type="text/css" href="[_static/pyos.css](view-source:file:///Users/leahawasser/Documents/GitHub/contributing-guide/_build/html/_static/pyos.css)" />
    <link rel="stylesheet" type="text/css" href="[_static/design-style.b7bb847fb20b106c3d81b95245e65545.min.css](view-source:file:///Users/leahawasser/Documents/GitHub/contributing-guide/_build/html/_static/design-style.b7bb847fb20b106c3d81b95245e65545.min.css)" />
    
  <!-- Pre-loaded scripts that we'll load fully later -->

Many thanks for any suggestions!!!

UPDATE: i've been working on this for 30 minutes and then i just did a clean and rebuilt and that did the trick. so sorry for adding to the questions. i'm not sure i can delete this .

[lwasser]

i'm going to answer it here - i need to run

clean . and then build . the book to get the styles to appear. it was just a browser issue not a book issue.