Announcement Bar Color

Use these code to Custom CSS box

#1. All Pages

div.sqs-announcement-bar {
    background-color: #f1f !important;
}

#2. Desktop Only

@media screen and (min-width:768px) {
div.sqs-announcement-bar {
    background-color: #f1f !important;
}}

#3. Mobile Only

@media screen and (max-width:767px) {
div.sqs-announcement-bar {
    background-color: #f1f !important;
}}

#4. Before Header Scroll

header#header:not(.shrink) div.sqs-announcement-bar {
    background-color: #f1f !important;
}

#5. On Header Scroll

header#header.shrink div.sqs-announcement-bar {
    background-color: #f1f !important;
}

#6. When mobile menu is open

body.header--menu-open div.sqs-announcement-bar {
    background-color: #f1f !important;
}

#7. When mobile menu is Closed

body:not(.header--menu-open) div.sqs-announcement-bar {
    background-color: #f1f !important;
}

#8. One Page

First, find Page ID.

Next, use CSS code like this

#collection-66a1bfc99041e47b896c1e48 div.sqs-announcement-bar {
    background-color: #f1f !important;
}