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

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

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

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

.grid--cols-4 > .grid-cell {
	-webkit-box-flex:100;
	-ms-flex:0 0 100%;
	flex:0 0 100%;
	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);
	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);
	width:calc(33.3333% - 1em);
}

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

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

.grid--1of6 > .grid-cell,.grid--1of5 > .grid-cell {
	-webkit-box-flex:50;
	-ms-flex:0 0 50%;
	flex:0 0 50%;
	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%;
	width:100%;
}

@media screen and (max-width: 714px) {
/*
	.grid{
		display: block !important;
	}
	
	.grid-cell{
		display: block !important;
		width: 100% !important;
	}
	
	.grid--padding{
		padding: 0;
	}
*/
	.grid{
		-webkit-box-orient: vertical;
	}

	.grid-cell{
		-webkit-box-flex:100;
		-ms-flex:0 0 100%;
		flex:0 0 100%;
		display: block;
		width:100%;
		
	}
	
	.grid--padding{
		padding: 1em 0;
	}
	
	.section__vh--half{
		min-height: 0;
	}
	
	.section__highlight{
		top: -55px;
	}
	
	#filters{
		padding: 20px;
	}
	
	#filters .grid{
		display: none;
	}
	
	#footer__main .grid--1of4 > .grid-cell{
		-webkit-box-flex:100 !important;
		-ms-flex:0 0 100%;
		flex:0 0 100% !important;
		max-width:100% !important;
		text-align: center;
		margin-bottom: 20px;
	}
}
