@charset 'utf-8';
/* configs
--------------------------------------------------------- */
/* grid
--------------------------------------------------------- */
.grid{
	margin: 0 auto;
	width: 100%;
	letter-spacing: -.35em;
}

.grid--right{
	text-align: right;
}

.grid--center{
	text-align: center;
}

.grid--justify{
	display: block;
	text-align: justify;
	text-justify: distribute-all-lines;
}

.grid--justify:after{
	display: inline-block;
	width: 100%;
	content: '';
}

.grid--middle .grid__col{
	vertical-align: middle;
}

.grid--top .grid__col{
	vertical-align: top;
}

.grid--bottom .grid__col{
	vertical-align: bottom;
}

.grid__col{
	display: block;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
	width: 100%;
	vertical-align: top;
	word-spacing: normal;
	word-wrap: break-word;
	letter-spacing: normal;
}

.grid__col--middle{
	vertical-align: middle;
}

.grid__col--top{
	vertical-align: top;
}

.grid__col--bottom{
	vertical-align: bottom;
}

@media (min-width: 768px){
	.grid--gutters .grid__col{
		margin-left: 2%;
	}
	.grid--gutters .grid__col:first-child{
		margin-left: 0;
	}
	.grid__col{
		display: inline-block;
		width: auto;
	}
	.grid__col--1{
		width: 8.33333%;
	}
	.grid__col--2{
		width: 16.66667%;
	}
	.grid__col--3{
		width: 25%;
	}
	.grid__col--4{
		width: 33.33333%;
	}
	.grid__col--5{
		width: 41.66667%;
	}
	.grid__col--6{
		width: 50%;
	}
	.grid__col--7{
		width: 58.33333%;
	}
	.grid__col--8{
		width: 66.66667%;
	}
	.grid__col--9{
		width: 75%;
	}
	.grid__col--10{
		width: 83.33333%;
	}
	.grid__col--11{
		width: 91.66667%;
	}
	.grid__col--12{
		width: 100%;
	}
	.grid__offset--1{
		margin-right: 8.33333%;
	}
	.grid__offset--2{
		margin-right: 16.66667%;
	}
	.grid__offset--3{
		margin-right: 25%;
	}
	.grid__offset--4{
		margin-right: 33.33333%;
	}
	.grid__offset--5{
		margin-right: 41.66667%;
	}
	.grid__offset--6{
		margin-right: 50%;
	}
	.grid__offset--7{
		margin-right: 58.33333%;
	}
	.grid__offset--8{
		margin-right: 66.66667%;
	}
	.grid__offset--9{
		margin-right: 75%;
	}
	.grid__offset--10{
		margin-right: 83.33333%;
	}
	.grid__offset--11{
		margin-right: 91.66667%;
	}
	.grid__offset--12{
		margin-right: 100%;
	}
	.grid--gutters .grid__col--1{
		width: 6.5%;
	}
	.grid--gutters .grid__col--2{
		width: 15%;
	}
	.grid--gutters .grid__col--3{
		width: 23.5%;
	}
	.grid--gutters .grid__col--4{
		width: 32%;
	}
	.grid--gutters .grid__col--5{
		width: 40.5%;
	}
	.grid--gutters .grid__col--6{
		width: 49%;
	}
	.grid--gutters .grid__col--7{
		width: 57.5%;
	}
	.grid--gutters .grid__col--8{
		width: 66%;
	}
	.grid--gutters .grid__col--9{
		width: 74.5%;
	}
	.grid--gutters .grid__col--10{
		width: 83%;
	}
	.grid--gutters .grid__col--11{
		width: 91.5%;
	}
	.grid--gutters .grid__col--12{
		width: 100%;
	}
	.grid--gutters .grid__offset--1{
		margin-right: 8.5%;
	}
	.grid--gutters .grid__offset--2{
		margin-right: 17%;
	}
	.grid--gutters .grid__offset--3{
		margin-right: 25.5%;
	}
	.grid--gutters .grid__offset--4{
		margin-right: 34%;
	}
	.grid--gutters .grid__offset--5{
		margin-right: 42.5%;
	}
	.grid--gutters .grid__offset--6{
		margin-right: 51%;
	}
	.grid--gutters .grid__offset--7{
		margin-right: 59.5%;
	}
	.grid--gutters .grid__offset--8{
		margin-right: 68%;
	}
	.grid--gutters .grid__offset--9{
		margin-right: 76.5%;
	}
	.grid--gutters .grid__offset--10{
		margin-right: 85%;
	}
	.grid--gutters .grid__offset--11{
		margin-right: 93.5%;
	}
	.grid--gutters .grid__offset--12{
		margin-right: 100%;
	}
}