/********************************************************************************************* 

2.  Grid From 1024px To 1245px

*********************************************************************************************/

@media only screen and (max-width: 1245px) {
.container {
	width: 720px;
	margin: 0 auto;
}
.grid-1, .grid-2, .grid-3, .grid-4, .grid-5, .grid-6, .grid-7, .grid-8, .grid-9, .grid-10, .grid-11, .grid-12{
	display:block;
	float: left;
	margin: 0 10px;
}
.container .grid-1 {
	width:40px;
}
.container .grid-2 {
	width:100px;
}
.container .grid-3 {
	width:160px;
}
.container .grid-4 {
	width:220px;
}
.container .grid-5 {
	width:280px;
}
.container .grid-6 {
	width:340px;
}
.container .grid-7 {
	width:400px;
}
.container .grid-8 {
	width:460px;
}
.container .grid-9 {
	width:520px;
}
.container .grid-10 {
	width:580px;
}
.container .grid-11 {
	width:640px;
}
.container .grid-12 {
	width:700px;
}
/*******************************************************
********************* Offset 720px
*******************************************************/
.offset-by-1{
	margin-left: 60px;
}
.offset-by-2{
	margin-left: 120px;
}
.offset-by-3{
	margin-left: 180px;
}
.offset-by-4{
	margin-left: 240px;
}
.offset-by-5{
	margin-left: 300px;
}
.offset-by-6{
	margin-left: 360px;
}
.offset-by-7{
	margin-left: 420px;
}
.offset-by-8{
	margin-left: 480px;
}
.offset-by-9{
	margin-left: 540px;
}
.offset-by-10{
	margin-left: 600px;
}
.offset-by-11{
	margin-left: 660px;
}
.offset-by-12{
	margin-left: 720px;
}
}
/********************************************************************************************* 

3.  Grid lt 1023px / Mobile (mediaqueries)

*********************************************************************************************/
	
@media only screen and (max-width : 767px) {
.container{
	width: 80%;
	margin: 0 auto;
	text-align: left;
}
.offset-by-1,.offset-by-2,.offset-by-3,.offset-by-4,.offset-by-5,.offset-by-6,.offset-by-7,.offset-by-8,.offset-by-9,.offset-by-10,.offset-by-11,.offset-by-12{
	margin: 0;
}
.grid-1, .grid-2, .grid-3, .grid-4, .grid-5, .grid-6, .grid-7, .grid-8, .grid-9, .grid-10, .grid-11, .grid-12, .grid-13, .grid-14, .grid-15, .grid-16 {
	width:100%;
	margin: 0 0 20px 0;
}
.container .grid-1, .container .grid-2, .container .grid-3, .container .grid-4, .container .grid-5, .container .grid-6, .container .grid-7, .container .grid-8, .container .grid-9, .container .grid-10, .container .grid-11, .container .grid-12 {
	width:100%;
}
}
/*******************************************************
********************* Responsive images
*******************************************************/
.scale{
	max-width: 100%;
	height: auto;
}