Travel Agent Website Customisation

 

 

Add the following HTML to Custom CSS Snippet in web builder
<style type="text/css">
/* Use this color to change the background of the website */
body { background-color:#F4F4F4; }
/* Use this to put a color strip across the top of the website */
#outterHeader { background-color:inherit; }
/* Use this to change the background color of the menu */
#headerMenuBar { background-color:#F10000; }
/* Use this to change the color of the menu links */
#headerMenuBar a { color:White; }
/* Use this to change the color of the menu links and background color for the mouse over effect */
#headerMenuBar a:hover { color:#F10000; background-color:White; }
/* Use this to change the color od the secondary bar under the menu containing the breadcrumbs and search */
#headerSubBar { background-color:inherit; }
/* Use this to change the background color of the main content */
#pageContent { background-color:White; }
/* Use this to change the background color of the first column */
#sidebar1 { background-color:inherit; }
/* Use this to change the background color of the second column */
#sidebar2 { background-color:inherit; }
/* Use this to put a color strip across the bottom of the website */
#outterFooter { background-color:inherit; }
/* Use this to put a background color and color on the headings */
.widget h2 { background-color:#F10000; color:White; }
</style>

 

Explanation of Code

/* Use this color to change the background of the website */
body { background-color:#F4F4F4; }

 

This is the overall background colour of the website. In the case of the default it’s the light grey colour.

 

 

/* Use this to put a color strip across the top of the website */
#outterHeader { background-color:inherit; }

 

This will put a colour strip across the top of the website. The default is inherit which uses the overall background colour.

 

 

/* Use this to change the background color of the menu */
#headerMenuBar { background-color:#F10000; }

 

This is the colour of the menu bar

 

/* Use this to change the color of the menu links */
#headerMenuBar a { color:White; }

 

This is the colour of the links in the menu bar the default is white.

 

 

 

/* Use this to change the color of the menu links and background color for the mouse over effect */
#headerMenuBar a:hover { color:#F10000; background-color:White; }

 

This is for changing the colour of the links and background colour for the mouse over effect. The color value is the link colour and the background-color value is the background colour.

 

/* Use this to change the color of the secondary bar under the menu containing the breadcrumbs and search */
#headerSubBar { background-color:inherit; }

 

This is used to add a background colour to the bar below the menu

 

 

/* Use this to change the background color of the main content */
#pageContent { background-color:White; }

 

This is for adding a background colour to the content of the page the default is white.

 

 

 

 

 

 

 

/* Use this to change the background color of the first column */
#sidebar1 { background-color:inherit; }
/* Use this to change the background color of the second column */
#sidebar2 { background-color:inherit; }

These are used to put a background on the two sidebars. Sidebar1 is the column on the left and Sidebar2 is the column on the right.

 

 

/* Use this to put a color strip across the bottom of the website */
#outterFooter { background-color:inherit; }

 

This is for putting a colour strip at the bottom of the page.

 

 

/* Use this to put a background color and color on the headings */
.widget h2 { background-color:#F10000; color:White; }

 

This is used to put a background colour on the headings for each box. The background-color value is the background colour and the color value is the colour of the text.

 

 

 

 

 

Colours

 

Colours can be entered either using the English name or by the hexadecimal colour code.

 

The English names that can be used are:

aqua / cyan
black
blue
fuchsia / magenta
gray
green
lime
maroon
navy
olive
purple
red
silver
teal
white
yellow

 

 

For more detailed colours the hexadecimal codes can be used. To get colours in hexadecimal format please use http://www.rgbtool.com