BUTTONS

Buttons

Standard buttons will change colour depending on which page / template is set ie Holidays will be lightblue as below

View this offer Standard Button 
<a class="button" href="www.parkholidays.com">View this offer</a>
Red Button Red Button 
<a class="button button-red" href="www.parkholidays.com">Red Button</a>
Blue Button Blue Button 
<a class="button button-blue" href="www.parkholidays.com">Blue Button</a>
Book Now Button 
<input class="primary" type="submit" value="Book Now Button">
Lightblue Button Lightblue Button 
<a class="button button-lightblue" href="www.parkholidays.com">Lightblue Button</a>
Green Button Green Button 
<a class="button" href="www.parkholidays.come">Green Button</a>

Tabs

Tab 1

Tab 1 content goes here.

Each id link each tab to its content these must be the same in the menu as the the content it is linked to and must be uniquie and have not spaces, ie id="tab1" in the menu will liknk to id="#tab1" in the content section.

				
<nav class="tabs">

	<ul>

		<li class="active"><a href="#tab1">Tab 1</a></li>

		<li><a href="#tab2">Tab 2</a></li>

		<li><a href="#tab3">Tab 3</a></li>

		<li><a href="#tab4">Tab 4</a></li>

		<li><a href="#tab5">Tab 5</a></li>

		<li><a href="#tab6">Tab 6</a></li>

	</ul>

</nav>

        <div class="tab-content first" id="tab1" style="display: block;">            

            <h2>Tab 1</h2>

            <p>Tab 1 content goes here.</p>                                   

        </div>

        <div class="tab-content" id="tab2" style="display: none;">                                   

            <h2>Tab2</h2>

            <p>Tab 2 content goes here.</p>                         

        </div>

        <div class="tab-content" id="tab3" style="display: none;">                   

            <h2>Tab 3</h2>

            <p>Tab 3 content goes here.</p>                                               

        </div>

        <div class="tab-content" id="tab4" style="display: none;">          

            <h2>Tab 4</h2>

            <p>Tab 4 content goes here.</p>

        </div>

        <div class="tab-content" id="tab5" style="display: none;">           

            <h2>Tab 5</h2>

            <p>Tab 5 content goes here.</p>

        </div>

        <div class="tab-content" id="tab6" style="display: none;">           

			<h2>Tab 6</h2>

            <p>Tab 6 content goes here.</p>

        </div>