/*Basic grid Styles*/
.grid {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-flow: row;
          flex-flow: row;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.grid-cell {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  max-width: 100%;
}

/* With gutters*/
.grid--gutters {
  margin-left: -1em;
}
.grid--gutters .grid-cell {
  padding-left: 1em;
}
.grid--gutters .grid--nested .grid-cell  .Demo {
  margin-right: 1em;
}

/* Padding */
.grid--padding-tb{
	padding: 3em 0;
}

.grid--padding-tb:nth-child(1){
	padding-top: 0;
}

.grid--padding-tb:nth-last-child(1){
	padding-bottom: 0;
}

.grid--padding{
	padding: 0 1em;
}

.grid--padding:nth-child(1){
	padding-left: 0;
}

.grid--padding:nth-last-child(1){
	padding-right: 0;
}

.grid--padding-big{
	padding: 0 2em;
}

.grid--padding-big:nth-child(1){
	padding-left: 0;
}

.grid--padding-big:nth-last-child(1){
	padding-right: 0;
}

.grid-padding:

/* Justify per row*/
.grid--left {
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
}

.grid--right {
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}

.grid--center {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.grid--centerh {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

/* Alignment per row */
.grid--top {
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}

.grid--bottom {
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
}

.grid--center {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.grid--centerv {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

/* Alignment per cell */
.grid-cell--top {
  -ms-flex-item-align: start;
      align-self: flex-start;
}

.grid-cell--bottom {
  -ms-flex-item-align: end;
      align-self: flex-end;
}

.grid-cell--center {
  -ms-flex-item-align: center;
      -ms-grid-row-align: center;
      align-self: center;
}

/*===========================================*/
/* Base classes for all media - Mobile first */
.grid--cols-2 > .grid-cell {
	-webkit-box-flex:100;
	-ms-flex:0 0 100%;
	flex:0 0 100%;
	max-width:100%;
}

.grid--cols-3 > .grid-cell {
	-webkit-box-flex:100;
	-ms-flex:0 0 100%;
	flex:0 0 100%;
	max-width:100%;
}

.grid--cols-4 > .grid-cell {
	-webkit-box-flex:100;
	-ms-flex:0 0 100%;
	flex:0 0 100%;
	max-width:100%;
}

.grid--cols-6 > .grid-cell {
	-ms-flex:0 0 calc(50% - 1em);
	-webkit-box-flex:0;
	        flex:0 0 calc(50% - 1em);
	max-width:calc(50% - 1em);
}

.grid--cols-12 > .grid-cell {
	-ms-flex:0 0 calc(33.3333% - 1em);
	-webkit-box-flex:0;
	        flex:0 0 calc(33.3333% - 1em);
	max-width:calc(33.3333% - 1em);
}

.grid--holly-grail .aside,.grid--holly-grail .main {
	-webkit-box-flex:1;
	-ms-flex:1 100%;
	flex:1 100%;
	max-width:100%;
}

/* One of -- columns*/
.grid--1of2 > .grid-cell,.grid--1of4 > .grid-cell:first-of-type,.grid--1of3 > .grid-cell:first-of-type,.grid--2of3 > .grid-cell:first-of-type {
	-webkit-box-flex:100;
	-ms-flex:0 0 100%;
	flex:0 0 100%;
	max-width:100%;
}

.grid--1of6 > .grid-cell:first-of-type,.grid--1of5 > .grid-cell:first-of-type {
	-webkit-box-flex:50;
	-ms-flex:0 0 50%;
	flex:0 0 50%;
	max-width:50%;
}

.grid--fit > .grid-cell {
	-webkit-box-flex:1;
	-ms-flex:1;
	flex:1;
}

.grid--full > .grid-cell {
	-webkit-box-flex:100;
	-ms-flex:0 0 100%;
	flex:0 0 100%;
	max-width:100%;
}

@media (max-width: 30em) {
	.grid--padding {
		padding:0;
	}
}

/* Tablet (medium) screens */
@media (min-width: 30em) {
	.grid--cols-4 > .grid-cell {
		-ms-flex:0 0 calc(50% - 1em);
		-webkit-box-flex:0;
		        flex:0 0 calc(50% - 1em);
		max-width:calc(50% - 1em);
	}
	
	.grid--cols-6 > .grid-cell {
		-ms-flex:0 0 calc(33.3333% - 1em);
		-webkit-box-flex:0;
		        flex:0 0 calc(33.3333% - 1em);
		max-width:calc(33.3333% - 1em);
	}
	
	.grid--cols-12 > .grid-cell {
		-ms-flex:0 0 calc(16.6666% - 1em);
		-webkit-box-flex:0;
		        flex:0 0 calc(16.6666% - 1em);
		max-width:calc(16.6666% - 1em);
	}
	
	.grid--holly-grail .aside {
		-webkit-box-flex:1;
		-ms-flex:1 calc(25% - 1em);
		flex:1 calc(25% - 1em);
		max-width:calc(25% - 1em);
	}
	
	.grid--1of2 > .grid-cell {
		-webkit-box-flex:50;
		-ms-flex:0 0 50%;
		flex:0 0 50%;
		max-width:50%;
	}
	
	.grid--1of6 > .grid-cell:first-of-type {
		-webkit-box-flex:30;
		-ms-flex:0 0 30%;
		flex:0 0 30%;
		max-width:30%;
	}
	
	.grid--1of5 > .grid-cell:first-of-type {
		-webkit-box-flex:50;
		-ms-flex:0 0 50%;
		flex:0 0 50%;
		max-width:50%;
	}
	
	.grid--1of4 > .grid-cell:first-of-type {
		-webkit-box-flex:50;
		-ms-flex:0 0 50%;
		flex:0 0 50%;
		max-width:50%;
	}
	
	.grid--2of3 > .grid-cell:first-of-type {
		-webkit-box-flex:100;
		-ms-flex:0 0 100%;
		flex:0 0 100%;
		max-width:100%;
	}
	
	.grid--1of3 > .grid-cell:first-of-type {
		-webkit-box-flex:100;
		-ms-flex:0 0 100%;
		flex:0 0 100%;
		max-width:100%;
	}
}

/* Large screens */
@media (min-width: 48em) {
	.grid--cols-2 > .grid-cell,.grid--cols-3 > .grid-cell,.grid--cols-4 > .grid-cell,.grid--cols-6 > .grid-cell,.grid--cols-12 > .grid-cell {
		-webkit-box-flex:1;
		-ms-flex:1;
		flex:1;
	}
	
	.grid--holly-grail .main {
		-webkit-box-flex:2;
		-ms-flex:2;
		flex:2;
	}
	
	.grid--holly-grail .aside {
		-webkit-box-flex:1;
		-ms-flex:1;
		flex:1;
	}
	
	.grid--holly-grail .aside-1 {
		-webkit-box-ordinal-group:2;
		-ms-flex-order:1;
		order:1;
	}
	
	.grid--holly-grail .main {
		-webkit-box-ordinal-group:3;
		-ms-flex-order:2;
		order:2;
	}
	
	.grid--holly-grail .aside-2 {
		-webkit-box-ordinal-group:4;
		-ms-flex-order:3;
		order:3;
	}
	
	.grid--1of2 > .grid-cell {
		-webkit-box-flex:50;
		-ms-flex:0 0 50%;
		flex:0 0 50%;
		max-width:50%;
	}
	
	.grid--1of6 > .grid-cell:first-of-type {
		-webkit-box-flex:16.6666;
		-ms-flex:0 0 16.6666%;
		flex:0 0 16.6666%;
		max-width:16.6666%;
	}
	
	.grid--1of5 > .grid-cell:first-of-type {
		-webkit-box-flex:20;
		-ms-flex:0 0 20%;
		flex:0 0 20%;
		max-width:20%;
	}
	
	.grid--1of4 > .grid-cell:first-of-type {
		-webkit-box-flex:25;
		-ms-flex:0 0 25%;
		flex:0 0 25%;
		max-width:25%;
	}
	
	.grid--1of3 > .grid-cell:first-of-type {
		-webkit-box-flex:33.3333333;
		-ms-flex:0 0 33.3333333%;
		flex:0 0 33.3333333%;
		max-width:33.3333333%;
	}
	
	.grid--2of3 > .grid-cell:first-of-type {
		-webkit-box-flex:66.6666667;
		-ms-flex:0 0 66.6666667%;
		flex:0 0 66.6666667%;
		max-width:66.6666667%;
	}
	
	.grid--gutters.grid--nested .grid-cell .Demo {
		margin-right:0;
	}
}


/* ALL BELOW ORIGINAL GRID */
/*===========================================*/
/* Base classes for all media - Mobile first */
/*
.grid--cols-2 > .grid-cell {
	-webkit-box-flex:100;
	-ms-flex:0 0 100%;
	flex:0 0 100%;
	max-width:100%;
}

.grid--cols-3 > .grid-cell {
	-webkit-box-flex:100;
	-ms-flex:0 0 100%;
	flex:0 0 100%;
	max-width:100%;
}

.grid--cols-4 > .grid-cell {
	-webkit-box-flex:100;
	-ms-flex:0 0 100%;
	flex:0 0 100%;
	max-width:100%;
}

.grid--cols-6 > .grid-cell {
	-webkit-box-flex:calc(50% - 1em);
	-ms-flex:0 0 calc(50% - 1em);
	flex:0 0 calc(50% - 1em);
	max-width:calc(50% - 1em);
}

.grid--cols-12 > .grid-cell {
	-webkit-box-flex:calc(33.3333% - 1em);
	-ms-flex:0 0 calc(33.3333% - 1em);
	flex:0 0 calc(33.3333% - 1em);
	max-width:calc(33.3333% - 1em);
}

.grid--holly-grail .aside,.grid--holly-grail .main {
	-webkit-box-flex:1;
	-ms-flex:1 100%;
	flex:1 100%;
	max-width:100%;
}
*/

/* One of -- columns*/
/*
.grid--1of2 > .grid-cell,.grid--1of4 > .grid-cell:first-of-type,.grid--1of3 > .grid-cell:first-of-type,.grid--2of3 > .grid-cell:first-of-type {
	-webkit-box-flex:100;
	-ms-flex:0 0 100%;
	flex:0 0 100%;
	max-width:100%;
}

.grid--1of6 > .grid-cell:first-of-type,.grid--1of5 > .grid-cell:first-of-type {
	-webkit-box-flex:50;
	-ms-flex:0 0 50%;
	flex:0 0 50%;
	max-width:50%;
}

.grid--fit > .grid-cell {
	-webkit-box-flex:1;
	-ms-flex:1;
	flex:1;
}

.grid--full > .grid-cell {
	-webkit-box-flex:100;
	-ms-flex:0 0 100%;
	flex:0 0 100%;
	max-width:100%;
}

@media (max-width: 480px) {
	.grid--padding {
		padding:0;
	}
}
*/

/* Tablet (medium) screens */
/*
@media (min-width: 30em) {
	.grid--cols-4 > .grid-cell {
		-webkit-box-flex:calc(50% - 1em);
		-ms-flex:0 0 calc(50% - 1em);
		flex:0 0 calc(50% - 1em);
		max-width:calc(50% - 1em);
	}
	
	.grid--cols-6 > .grid-cell {
		-webkit-box-flex:calc(33.3333% - 1em);
		-ms-flex:0 0 calc(33.3333% - 1em);
		flex:0 0 calc(33.3333% - 1em);
		max-width:calc(33.3333% - 1em);
	}
	
	.grid--cols-12 > .grid-cell {
		-webkit-box-flex:calc(16.6666% - 1em);
		-ms-flex:0 0 calc(16.6666% - 1em);
		flex:0 0 calc(16.6666% - 1em);
		max-width:calc(16.6666% - 1em);
	}
	
	.grid--holly-grail .aside {
		-webkit-box-flex:1;
		-ms-flex:1 calc(25% - 1em);
		flex:1 calc(25% - 1em);
		max-width:calc(25% - 1em);
	}
	
	.grid--1of2 > .grid-cell {
		-webkit-box-flex:50;
		-ms-flex:0 0 50%;
		flex:0 0 50%;
		max-width:50%;
	}
	
	.grid--1of6 > .grid-cell:first-of-type {
		-webkit-box-flex:30;
		-ms-flex:0 0 30%;
		flex:0 0 30%;
		max-width:30%;
	}
	
	.grid--1of5 > .grid-cell:first-of-type {
		-webkit-box-flex:50;
		-ms-flex:0 0 50%;
		flex:0 0 50%;
		max-width:50%;
	}
	
	.grid--1of4 > .grid-cell:first-of-type {
		-webkit-box-flex:50;
		-ms-flex:0 0 50%;
		flex:0 0 50%;
		max-width:50%;
	}
	
	.grid--2of3 > .grid-cell:first-of-type {
		-webkit-box-flex:100;
		-ms-flex:0 0 100%;
		flex:0 0 100%;
		max-width:100%;
	}
	
	.grid--1of3 > .grid-cell:first-of-type {
		-webkit-box-flex:100;
		-ms-flex:0 0 100%;
		flex:0 0 100%;
		max-width:100%;
	}
}
*/

/* Large screens */
/*
@media (min-width: 48em) {
	.grid--cols-2 > .grid-cell,.grid--cols-3 > .grid-cell,.grid--cols-4 > .grid-cell,.grid--cols-6 > .grid-cell,.grid--cols-12 > .grid-cell {
		-webkit-box-flex:1;
		-ms-flex:1;
		flex:1;
	}
	
	.grid--holly-grail .main {
		-webkit-box-flex:2;
		-ms-flex:2;
		flex:2;
	}
	
	.grid--holly-grail .aside {
		-webkit-box-flex:1;
		-ms-flex:1;
		flex:1;
	}
	
	.grid--holly-grail .aside-1 {
		-webkit-box-ordinal-group:2;
		-ms-flex-order:1;
		order:1;
	}
	
	.grid--holly-grail .main {
		-webkit-box-ordinal-group:3;
		-ms-flex-order:2;
		order:2;
	}
	
	.grid--holly-grail .aside-2 {
		-webkit-box-ordinal-group:4;
		-ms-flex-order:3;
		order:3;
	}
	
	.grid--1of2 > .grid-cell {
		-webkit-box-flex:50;
		-ms-flex:0 0 50%;
		flex:0 0 50%;
		max-width:50%;
	}
	
	.grid--1of6 > .grid-cell:first-of-type {
		-webkit-box-flex:16.6666;
		-ms-flex:0 0 16.6666%;
		flex:0 0 16.6666%;
		max-width:16.6666%;
	}
	
	.grid--1of5 > .grid-cell:first-of-type {
		-webkit-box-flex:20;
		-ms-flex:0 0 20%;
		flex:0 0 20%;
		max-width:20%;
	}
	
	.grid--1of4 > .grid-cell:first-of-type {
		-webkit-box-flex:25;
		-ms-flex:0 0 25%;
		flex:0 0 25%;
		max-width:25%;
	}
	
	.grid--1of3 > .grid-cell:first-of-type {
		-webkit-box-flex:33.3333333;
		-ms-flex:0 0 33.3333333%;
		flex:0 0 33.3333333%;
		max-width:33.3333333%;
	}
	
	.grid--2of3 > .grid-cell:first-of-type {
		-webkit-box-flex:66.6666667;
		-ms-flex:0 0 66.6666667%;
		flex:0 0 66.6666667%;
		max-width:66.6666667%;
	}
	
	.grid--gutters.grid--nested .grid-cell:first-of-type .Demo {
		margin-right:0;
	}
}
*/