/*
 * 12-column grid system
 */


/* Container */
.container {
	margin-left:auto;
	margin-right:auto;
	max-width: 1188px;
}
.nested-container {
	width:102%;
	margin-left:-1%;
}

/* 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.3%;
	margin-right:1.3%;
}

/* Basic grid units width *94.8**/
.grid12-1	{ width:5.81%; }
.grid12-2	{ width:14.14%; }
.grid12-3	{ width:22.47%; }
.grid12-4	{ width:30.8%;  }

.grid12-5	{ width:39.14%; }
.grid12-6	{ width:47.47%; }
.grid12-7	{ width:55.81%; }

.grid12-8	{ width:64%; }

.grid12-9	{ width:72.47%; }
.grid12-10	{ width:80.8%; }
.grid12-11	{ width:89.14%; }
.grid12-12,
.grid-full	{ width:97.47%; }

/* 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%; }

/* 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%; }

/* 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; }

/* Container: stretched, without side margin 
-------------------------------------------------------------- */
/* Remove padding from stretched container (it is added for narrow screens via media queries) */
.container.stretched { width:96%; padding-left:0; padding-right:0; }

/* Stretch inner grid unit (full width) */
.container.stretched > .grid-full { width:100%; margin-left:0; margin-right:0; }

/* 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;
}

/**
 * WARNING: do not edit this file. It was generated automatically, your changes will be overwritten and lost.
 * 2014-08-12 09:35:41 */






/* Grid container
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
*/



	.container {
		width:97.4%;
	
											max-width: 960px;
						}

				.lte-ie8 .container { max-width:1200px; }
	






















/* Desktop - design for a width of 1280px
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
*/

/* 1280px <= width */

@media only screen and (min-width: 1280px)  {

	.container { max-width: 1188px; }
				
	/* Special grid units */
	.grid-col2-sidebar 	{ width: 20.41%; }
	.grid-col2-main		{ width: 75.58%; }
	.grid-col3-sidebar		{ width:27.01%; }
	.grid-col3-main			{ width:70.34%; }
	
	/* Hide */
	.hide-below-1280 { display:inherit !important; }
}






/* Design for a width of less than 1024 px
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
*/

/* width < 1024px */
@media only screen and (max-width: 1023px) {

	/* Hide */
	.hide-below-1024 { display:none !important; }
}





/* Tablet (Portrait) - design for a width of 768px
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
*/

/* 768px <= width < 960px */
@media only screen and (min-width: 768px) and (max-width: 959px) {

		.container { max-width:737px; }
		
	/* Hide */
	.hide-below-960 { display:none !important; }
}





/* All mobile - design for a width of less than 768px
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
*/

/* width < 768px */
@media only screen and (max-width: 767px) {
	
	/* Grid units below 768px screen size are 100% wide with no margin. Padding compensates lack of margin. */
	.container { width:92%; padding-left:2%; padding-right:2%; }
	.nested-container { width:100%; margin-left:auto; }

	/* Nav container with outline (if nav container has background color).
	   Apply the same vertical margins, as container's side padding. */
	.nav.has-outline > .grid-full { margin-top: 2%; margin-bottom: 2%; }
	
	/* Below 768px all grid units are stretched (full width) and stack vertically */
	.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,
	
	.grid-col2-sidebar,
	.grid-col2-main,
	.grid-col3-sidebar,
	.grid-col3-main
	{
		width:100% !important; /* Added "!important" to override units with "no-gutter" */
		margin-left:0;
		margin-right:0;
	}

	/* Vertically aligned grid
	-------------------------------------------------------------- */
	.v-grid-container { display:block; }
	.v-grid { float:inherit; display:block; width:100%; }
}





/* Mobile (Landscape) - design for a width of 480px
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
*/

/* 480px <= width < 768px */
@media only screen and (min-width: 480px) and (max-width: 767px) {

		.container { max-width:440px; }
		
	/* Hide */
	.hide-below-960 { display:none !important; }
	.hide-below-768 { display:none !important; }
	
	/* Deprecated: persistent grid units (will be removed in the next update)
	-------------------------------------------------------------- */
		/* Half */
		.persistent-grid2-1 { width:48%; margin-left:1%; margin-right:1%; }
		
		/* One-third + two-thirds */
		.persistent-grid3-1 { width:31.33%; margin-left:1%; margin-right:1%; }
		.persistent-grid3-2 { width:64.67%; margin-left:1%; margin-right:1%; }
		
		/* One-fourth + two-fourths + three-fourths */
		.persistent-grid4-1 { width:23%; margin-left:1%; margin-right:1%; }
		.persistent-grid4-2 { width:48%; margin-left:1%; margin-right:1%; }
		.persistent-grid4-3 { width:73%; margin-left:1%; margin-right:1%; }

	/* Mobile grid (for browser viewport between 480px and 768px):
	   Below 768px all grid units are stretched (full width) and stack vertically.
	   The "mobile-grid" class forces narrow grid units to stay narrow,
	   but the width is increased to avoid too small columns.
	-------------------------------------------------------------- */
	.mobile-grid.grid12-1 { width:14.66% !important;	margin-left:1%; margin-right:1%; } /* 1/12 turns into 1/6 */
	.mobile-grid.grid12-2 { width:31.33% !important;	margin-left:1%; margin-right:1%; } /* 1/6  turns into 1/3 */
	.mobile-grid.grid12-3 { width:48% !important;		margin-left:1%; margin-right:1%; } /* 1/4  turns into 1/2 */
	
	/* Force other grid units to take half of the available width */
	.mobile-grid-half { width:48% !important; margin-left:1%; margin-right:1%; }

}





/* Mobile (Landscape, iPhone 4 Portrait) - design for a width of 640px
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
*/
/* 640px <= width < 768px */
@media only screen and (min-width: 640px) and (max-width: 767px) {

		.container { max-width:590px; }
	}





/* Design for a width of less than 480px (small mobile)
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
*/

/* width < 480px */
@media only screen and (max-width: 479px) {

	/* Stretch containers to full width and add side padding */
	.container { max-width:none !important; width:94%; padding-left:3%; padding-right:3%; }

	/* Nav container with outline (if nav container has background color).
	   Apply the same vertical margins, as container's side padding. */
	.nav.has-outline > .grid-full { margin-top: 3%; margin-bottom: 3%; }

}





/* Mobile (Portrait) - design for a width of 320px
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
*/

/* 320px <= width < 480px */
@media only screen and (min-width: 320px) and (max-width: 479px) {

		/* .container { max-width:301px; } */
		
	/* Hide */
	.hide-below-960 { display:none !important; }
	.hide-below-768 { display:none !important; }
	.hide-below-480 { display:none !important; }
}





/* Mobile (Portrait) - design for a width of less than 320px
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
*/

/* width < 320px */
@media only screen and (max-width: 319px) {

		/* .container { max-width:226px; } */
	
	.container { max-width:none !important; width:92%; padding-left:4%; padding-right:4%; }

	/* Nav container with outline (if nav container has background color).
	   Apply the same vertical margins, as container's side padding. */
	.nav.has-outline > .grid-full { margin-top: 4%; margin-bottom: 4%; }

	/* Hide */
	.hide-below-960 { display:none !important; }
	.hide-below-768 { display:none !important; }
	.hide-below-480 { display:none !important; }
	.hide-below-320 { display:none !important; }
}