/*

 * 12-column grid system

 */







/* Grid units

%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%

*/

.grid12-1,

.grid12-2,

.grid12-3,

.grid12-4,

.grid12-5,

.grid12-6,

.grid12-7,

.grid12-8,

.grid12-9,

.grid12-10,

.grid12-11,

.grid12-12,

.grid-full, /* Alias for full-width unit */



/* Special grid units */

.grid-col2-sidebar,

.grid-col2-main

{

	/*position:relative;*/

	display:inline;

	float:left;

	margin-left:1%;

	margin-right:1%;

}



/* Basic grid units width */

.grid12-1	{ width:6.33%; }

.grid12-2	{ width:14.66%; }

.grid12-3	{ width:23%; }

.grid12-4	{ width:31.33%; }

.grid12-5	{ width:39.67%; }

.grid12-6	{ width:48%; }

.grid12-7	{ width:56.33%; }

.grid12-8	{ width:64.67%; }

.grid12-9	{ width:73%; }

.grid12-10	{ width:81.33%; }

.grid12-11	{ width:89.67%; }

.grid12-12,

.grid-full	{ width:98%; }



/* Grid units without left gutter (margin) */

.no-left-gutter.grid12-1	{ margin-left:0; width:7.33%; }

.no-left-gutter.grid12-2	{ margin-left:0; width:15.66%; }

.no-left-gutter.grid12-3	{ margin-left:0; width:24%; }

.no-left-gutter.grid12-4	{ margin-left:0; width:32.33%; }

.no-left-gutter.grid12-5	{ margin-left:0; width:40.67%; }

.no-left-gutter.grid12-6	{ margin-left:0; width:49%; }

.no-left-gutter.grid12-7	{ margin-left:0; width:57.33%; }

.no-left-gutter.grid12-8	{ margin-left:0; width:65.67%; }

.no-left-gutter.grid12-9	{ margin-left:0; width:74%; }

.no-left-gutter.grid12-10	{ margin-left:0; width:82.33%; }

.no-left-gutter.grid12-11	{ margin-left:0; width:90.67%; }

.no-left-gutter.grid12-12,

.no-left-gutter.grid-full	{ margin-left:0; width:99%; }



/* Grid units without right gutter (margin) */

.no-right-gutter.grid12-1	{ margin-right:0; width:7.33%; }

.no-right-gutter.grid12-2	{ margin-right:0; width:15.66%; }

.no-right-gutter.grid12-3	{ margin-right:0; width:24%; }

.no-right-gutter.grid12-4	{ margin-right:0; width:32.33%; }

.no-right-gutter.grid12-5	{ margin-right:0; width:40.67%; }

.no-right-gutter.grid12-6	{ margin-right:0; width:49%; }

.no-right-gutter.grid12-7	{ margin-right:0; width:57.33%; }

.no-right-gutter.grid12-8	{ margin-right:0; width:65.67%; }

.no-right-gutter.grid12-9	{ margin-right:0; width:74%; }

.no-right-gutter.grid12-10	{ margin-right:0; width:82.33%; }

.no-right-gutter.grid12-11	{ margin-right:0; width:90.67%; }

.no-right-gutter.grid12-12,

.no-right-gutter.grid-full	{ margin-right:0; width:99%; }



/* Grid units without any gutter (margin) */

.no-gutter.grid12-1		{ margin-left:0; margin-right:0; width:8.33%; }

.no-gutter.grid12-2		{ margin-left:0; margin-right:0; width:16.66%; }

.no-gutter.grid12-3		{ margin-left:0; margin-right:0; width:25%; }

.no-gutter.grid12-4		{ margin-left:0; margin-right:0; width:33.33%; }

.no-gutter.grid12-5		{ margin-left:0; margin-right:0; width:41.67%; }

.no-gutter.grid12-6		{ margin-left:0; margin-right:0; width:50%; }

.no-gutter.grid12-7		{ margin-left:0; margin-right:0; width:58.33%; }

.no-gutter.grid12-8		{ margin-left:0; margin-right:0; width:66.67%; }

.no-gutter.grid12-9		{ margin-left:0; margin-right:0; width:75%; }

.no-gutter.grid12-10	{ margin-left:0; margin-right:0; width:83.33%; }

.no-gutter.grid12-11	{ margin-left:0; margin-right:0; width:91.67%; }

.no-gutter.grid12-12,

.no-gutter.grid-full	{ margin-left:0; margin-right:0; width:100%; }



/* Special grid units: basic structure of pages with 1 and 2 sidebars

-------------------------------------------------------------- */

/* 2 columns: fixed-width sidebar unit and fluid main unit.

   Sidebar unit has the same width for all screen sizes equal or greater than 1280px.

   Width of the main unit is fluid.

*/

.grid-col2-sidebar	{ width:23%; }

.grid-col2-main		{ width:73%; }



.no-gutter.grid-col2-sidebar	{ margin-left:0; margin-right:0; width:25%; }

.no-gutter.grid-col2-main		{ margin-left:0; margin-right:0; width:75%; }



/* Another 2 columns inside ".grid-col2-main": fixed-width sidebar unit and fluid main unit */

.grid-col3-sidebar	{ width:31.52%; }

.grid-col3-main		{ width:65.90%; }



.no-gutter.grid-col3-sidebar	{ margin-left:0; margin-right:0; width:31.52%; }

.no-gutter.grid-col3-main		{ margin-left:0; margin-right:0; width:65.90%; }



/* Vertically aligned grid

-------------------------------------------------------------- */

.v-grid-container {

	display:table;

	width:100%;

}

.v-grid {

	float:none;

	display:table-cell;

	vertical-align:middle;

}





/* Utility classes

%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%

*/

/* Units with no gutter (margin): alpha - first unit in a row, omega - last unit in a row */

.alpha { margin-left:0; }

.omega { margin-right:0; }



/* Hide element if screen width is lower than the width specified in the class name */

.hide-below-1680 { display:none !important; }

.hide-below-1440 { display:none !important; }

.hide-below-1360 { display:none !important; }

.hide-below-1280 { display:none !important; }





/* Containers

%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%

*/

/* Main container for page content.

   Max width of the page is applied to elements with this class.

-------------------------------------------------------------- */

.container {

	margin-left:auto;

	margin-right:auto;

}

.nested-container { width:102%; margin-left:-1%; } /* Deprecated */
.nested-homepage-container { width:100%; margin-left:11%; } /* Customised by HH */
.nested-homepage-container-middle { width:100%; margin-left:16%;} /* Customised by HH */
.nested-homepage-container-middle-nogrid { width:100%; margin-left:7%;} /* Customised by HH */
.nested-homepage-container-middle-95 { width:92%; margin-left:10%;} /* Customised by HH */

/* Inner container.

   Additional container, horizontal padding is applied to elements with this class.

-------------------------------------------------------------- */

.inner-container {

	padding-left: 15px;

	padding-right: 15px;



	/* Clear floats */

	*zoom: 1;

	clear: both;

}

/* Clear floats */

.inner-container:before,

.inner-container:after { display: table; line-height: 0; content: ""; }

.inner-container:after { clear: both; }



/* Full width container

-------------------------------------------------------------- */

.container.full-width {

	width: 100%;

	max-width: none;

}



/* Expanded container (without inner side padding)

-------------------------------------------------------------- */

.container.no-side-padding > .inner-container

{

	padding-left: 0;

	padding-right: 0;

}





/* Grid units containers

%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%

*/

/* Grid units container:

   clears floats (place grid units inside "div" with this class)

-------------------------------------------------------------- */

.grid-container { *zoom: 1; clear: both; }

.grid-container:before,

.grid-container:after { display: table; line-height: 0; content: ""; }

.grid-container:after { clear: both; }



/* Grid unit container:

   clears floats and adds vertical margin between units

-------------------------------------------------------------- */

.grid-container-spaced { *zoom: 1; clear: both; }

.grid-container-spaced:before,

.grid-container-spaced:after { display: table; line-height: 0; content: ""; }

.grid-container-spaced:after { clear: both; }

.grid-container-spaced .grid12-1,

.grid-container-spaced .grid12-2,

.grid-container-spaced .grid12-3,

.grid-container-spaced .grid12-4,

.grid-container-spaced .grid12-5,

.grid-container-spaced .grid12-6,

.grid-container-spaced .grid12-7,

.grid-container-spaced .grid12-8,

.grid-container-spaced .grid12-9,

.grid-container-spaced .grid12-10,

.grid-container-spaced .grid12-11,

.grid-container-spaced .grid12-12,

.grid-container-spaced .grid-full

{

	margin-bottom: 2%;

}



/* Grid presentation

-------------------------------------------------------------- */

.show-grid [class*="grid12-"] {

	background-color: #eee;

	text-align: center;

	min-height: 40px;

	line-height: 40px;

	transition:			all 300ms ease-in-out;

	-moz-transition:	all 300ms ease-in-out;

	-webkit-transition:	all 300ms ease-in-out;

	-o-transition:		all 300ms ease-in-out;

}

.show-grid [class*="grid12-"]:hover {

	background-color: #F08080;

}