Change background color of header

Hello,
This is probably very easy but I need some quick help.
How Can I change the background color of the header? See my attachment for an illustration.
Thanks

Add following css codes in override.css file and enable css override option from template settings > advanced settings > css override "on".

Change #333333 to your chosen color.

Code: Select all

/* Active Menu Item Color */
#gkMainMenu > div > ul > li.active,
/* header background color */
#gkHeader { background: #333333; }
/* Border color between menu and header */
#gkMainMenu { border-bottom: 5px solid #333; }


See you around...

Thanks alot. It worked like a charm. Just one more question, probably quite easy too..how can I change the padding around the slideshow so that it is very thin, like 1px?

Add following css codes in override.css file and enable css override option from template settings > advanced settings > css override "on".

Change #333333 to your chosen color.

Code: Select all

/* Active Menu Item Color */
#gkMainMenu > div > ul > li.active,
/* header background color */
#gkHeader { background: #333333; }
/* Border color between menu and header */
#gkMainMenu { border-bottom: 5px solid #333; }


See you around...

Padding comes from "#gkHeader", you can play around with below settings however it will break layout as other elements depends on those spaces. So you might need to change few css lines to get other stuff lined up properly.
Currently used padding as below. You can replace previous code with below and play with numbers. Top / bottom 22px and left / right 27px.

Code: Select all

/* GK Header Padding */
/* Active Menu Item Color */
#gkMainMenu > div > ul > li.active,
/* header background color and padding */
#gkHeader { background: #333333; padding: 22px 27px; }
/* Border color between menu and header */
#gkMainMenu { border-bottom: 5px solid #333; }


This is the way current html nested.
Header Position
Header Position > GK Tabs module
Header Position > GK Tabs module > Slideshow Module.

See you around...