Como editar uma cor de um local especifico do site

Para editar um cor de um local especifico do site, é necessário descobrir o nome da classe do local que desejamos atualizar.

Exemplo: Digamos que quero trocar apenas a cor do Topo do site, para uma cor que não está cadastrada nas Cores Primárias, Segundárias e Terciárias.

Para fazer isso, utilize o navegador Google Chrome. Acesse o site e clique com o botão direito no local que deseja descobrir o nome da classe. Exemplo: Topo

Após clicar com o botão direito no local desejado, clique em Inspecionar.

Quando você selecionar a DIV do local desejado, ela vai aparecer numa cor diferente no site, para você identificar a DIV selecionada.

Nesse caso aqui, a DIV que quero alterar a cor individual é o TOPO, que tem todas as classes a seguir: navik-header header-shadow header-dark navik-mega-menu mega-menu-fullwidth viewport-lg

Na coluna da direita, vai aparecer o nome da classe, e o comando que coloca cor: Exemplo:  background-color: #2B2B2B !important;

Você pode clicar na cor e modificar conforme desejado, e já terá uma pré-visualização de como vai ficar a cor no site, depois de modificado.

Agora que sabemos o nome da classe Exemplo: navik-header podemos acessar o gerenciador e alterar a cor desta classe individualmente.

Acesse o Gerenciador de Conteúdo, na opção Criador de Site / Cores e clique na aba Editar Cores individuais.

A gente sabe que o topo do site tem as Classes: navik-header header-shadow header-dark navik-mega-menu mega-menu-fullwidth viewport-lg   

Obs.: A cada espaço, temos uma nova classe, logo, nesse exemplo, temos várias classes do topo do site.

Você pode pesquisar se encontra uma das classes no Editor de Cores Individuais, se você encontrar uma das classes, clique no botão Editar para altarar a cor.

Selecione a nova cor desejada, ou preencha o código RGB da nova cor no campo Cor.

Clique em Salvar e está pronto. Confira no site como ficou e se necessário altere novamente.

Caso você não encontre a Classe que você deseja alterar na lista de cores cadastradas, você pode clicar na aba Cadastrar Cor.

Selecione o Tipo Estilo

• Background - Quando deseja alterar a cor de fundo de uma caixa do site
• Cor - Texto - Quando desejar mudar a cor da fonte do site
• Borda - Quando desejar mudar a cor de uma borda do site

O campo Nome da Cor você pode escrever um nome para identificar onde você está mexendo. Esse campo é apenas para você idenficar o local, não vai influenciar em nada no site.

O campo @Media serve para você configurar se quer exibir essa versão somente na versão Mobile ou somente na versão Computador.

Para alterar a cor somente na versão Mobile, preencha o campo assim: @media screen and (max-width: 991px) {

Para alterar a cor somente na versão Computador, preencha o campo assim: @media screen and (min-width: 991px) { 

Obs.: Caso você utilize essa opção, terá que cadastrar a mesma classe duas vezes, uma para a versão MOBILE e outra para a versão COMPUTADOR.

No campo Classe, preencha o nome da classe que você deseja alterar a cor.

Se desejamos alterar a cor do Topo do site apenas, devemos incluir o nome de uma das classes do topo. Exemplo: navik-header

Atenção: Sempre coloque um . (ponto) antes da classe. Caso contrário não vai funcionar

Caso não seja uma classe, seja um ID coloque um # (jogodavelha)

Caso seja um elemento padrão da Web como por exemplo: footer ou header, não precisa colocar . nem #

Você pode selecionar uma Cor Sócida ou uma Cor em Degrade. 

Caso queira uma Cor Sólida, preencha o código RGB da cor desejada.

Caso queira um Degrade, acesse o site https://www.cssmatic.com/ e gere o código de uma cor degrade para incluir no campo.

O campo Nivel, não altera nada no site, apenas serve para facilitar a edição das cores em Grupos.

As cores de Nivel 1, 2 e 3, são editadas na edição das cores em grupo: Cor Primária, Secudária e Terciária, conforme descrito neste post.

Caso você não queira que ao motificar as cores primárias essa cor seja alterada novamente, pode alterar o campo nivel para o número 10. Assim quando alterar as cores em Grupos, essa cor não será modificada.