/*
	99Lime.com HTML KickStart by Joshua Gatcke
	kickstart-grids.css
	
	DO NOT EDIT THIS FILE unless you know what you are doing. 
*/
/*---------------------------------
	GRID/COLUMNS
-----------------------------------
	tinyfluidgrid.com
	& girlfriendnyc.com
	with changes by 99Lime
-----------------------------------*/
/*
 & Columns : 12 
 & Gutter %: 20% 
 & MaxWidth: 1280px
 */

.grid {
	max-width: 1220px;
	margin: 0 auto;

}

.bgstretcher-page .grid {
	padding: 0 2em;
}

.grid.flex {
	width: 100%;
	max-width: 100%;
	padding: 0 2%;
	padding: 2em;
}

.row {
	display: block;
	overflow: hidden;
	clear: both;
}

*[class*="col_"].alpha {
	margin-left: 0;
}

*[class*="col_"].omega {
	margin-right: 0;
}

.col_1 {
	width: 6.6666666666667%;
}

.col_2 {
	width: 15%;
}

.col_3 {
	width: 23.333333333333%;
}

.col_4 {
	width: 31.666666666667%;
}

.col_5 {
	width: 40%;
}

.col_6 {
	width: 48.333333333333%;
}

.col_7 {
	width: 56.666666666667%;
}

.col_8 {
	width: 65%;
}

.col_9 {
	width: 73.333333333333%;
}

.col_10 {
	width: 81.666666666667%;
}

.col_11 {
	width: 90%;
}

.col_12 {
	width: 98.333333333333%;
}

*[class*="col_"] {
	margin-left: 0.83333333333333%;
	margin-right: 0.83333333333333%;
	margin-top: 0.5em;
	margin-bottom: 0.5em;
	float: left;
	display: block;
}

.jourRando[class*="col_"] {
	margin: 1px 0;
}

.jourRando .col_1 {
	width: 8%;
}

.jourRando .col_2 {
	width: 16%;
}

.jourRando .col_3 {
	width: 24%;
}

.jourRando .col_4 {
	width: 32%;
}

.jourRando .col_5 {
	width: 40%;
}

.jourRando .col_6 {
	width: 49%;
}

.jourRando .col_7 {
	width: 57%;
}

.jourRando .col_8 {
	width: 65%;
}

.jourRando .col_9 {
	width: 73.333333333333%;
}

.jourRando .col_10 {
	width: 81.666666666667%;
}

.jourRando .col_11 {
	width: 91%;
}

.jourRando .col_12 {
	width: 99.333333333333%;
}


.grid img {
	max-width: 100%;
	height: auto;
}

.clear {
	clear: both;
	display: block;
	overflow: hidden;
	visibility: hidden;
	width: 0;
	height: 0
}

.clearfix:after {
	clear: both;
	content: ' ';
	display: block;
	font-size: 0;
	line-height: 0;
	visibility: hidden;
	width: 0;
	height: 0
}

* html .clearfix,
*:first-child + html .clearfix {
	zoom: 1
}

/* Viewable Grids 
	To view your grids, add the class .visible to any grid container.
	This will add a background color so you can see the layout of your grids. 
*/
*[class*="col_"].visible {
	background: #eee;
	border: 1px dotted #ccc;
}


/*---------------------------------
	Responsive Grid Media Queries - 1280, 1024, 768, 480
	1280-1024 	- desktop (default grid)
	1024-768 	- tablet landscape
	768-480 	- tablet 
	480-less 	- phone landscape & smaller
-----------------------------------*/
@media all and (min-width: 1024px) and (max-width: 1280px) {

	.grid *[class*="col_"] {}

	.grid {
		max-width: 1024px;
	}

	.show-desktop {
		display: block;
	}

	.hide-desktop {
		display: none;
	}

	.show-tablet {
		display: none;
	}

	.hide-tablet {
		display: block;
	}

	.show-phone {
		display: none;
	}

	.hide-phone {
		display: block;
	}

}

@media all and (min-width: 768px) and (max-width: 1024px) {

	.grid *[class*="col_"] {}

	.grid {
		max-width: 768px;
	}

	.show-desktop {
		display: none;
	}

	.hide-desktop {
		display: block;
	}

	.show-tablet {
		display: block;
	}

	.hide-tablet {
		display: none;
	}

	.show-phone {
		display: none;
	}

	.hide-phone {
		display: block;
	}

	.entete div {
		font-weight: normal;
		font-size: 9px;
		hyphens: auto;
		overflow-wrap: anywhere;
	}

	.jourRando div {
		font-size: 10px;
	}
}


@media all and (min-width: 480px) and (max-width: 768px) {

	.grid *[class*="col_"] {
		float: none;
		width: auto;
		clear: both;
		display: block;
	}

	/* columns inside of columns */
	.grid *[class*="col_"] [class*="col_"] {
		margin-left: 0;
		margin-right: 0;
		width: 100%;
	}

	.grid {
		max-width: 480px;
		padding: 0 2em;
	}

	.show-desktop {
		display: none;
	}

	.hide-desktop {
		display: block;
	}

	.show-tablet {
		display: block;
	}

	.hide-tablet {
		display: none;
	}

	.show-phone {
		display: none;
	}

	.hide-phone {
		display: block;
	}

	.entete div {
		font-weight: normal;
	}

	.jourRando div {
		height: auto;
		padding: 2px 0
	}
}

@media all and (max-width: 480px) {

	.grid *[class*="col_"] {
		float: none;
		width: auto;
		clear: both;
		display: block;
	}

	/* columns inside of columns */
	.grid *[class*="col_"] [class*="col_"] {
		margin-left: 0;
		margin-right: 0;
		width: 100%;
	}

	.grid {
		max-width: 100%;
		padding: 0 2em;
		/*320*/
	}

	.show-desktop {
		display: none;
	}

	.hide-desktop {
		display: block;
	}

	.show-tablet {
		display: none;
	}

	.hide-tablet {
		display: block;
	}

	.show-phone {
		display: block;
	}

	.hide-phone {
		display: none;
	}

	.jourRando div {
		height: auto;
		padding: 2px 0
	}
}