/* https://philipwalton.github.io/solved-by-flexbox/demos/grids/ */

.Grid {
  display: flex;
  flex-wrap: wrap;
  list-style: none;
  margin: 0;
  padding: 0;
}

.Grid-cell {
  flex: 1;
}



/* grid gutters */
.Grid--gutters {
  margin: 0px 0px 0px -1.5em; /* -3rem 0 0em -3rem; */
}
.Grid--gutters > .Grid-cell {
  padding: 0px 0px 0px 1.5rem; /* 3rem 0 0 3rem; */
}



/* ******************************************************************** */
@media screen {

  .Grid > .g1of1 {
    flex: 0 0 100%;
    /* border: 1px solid red; */
  }

  .Grid > .g1of2 {
    flex: 0 0 100%;
    /* border: 1px solid red; */
  }

}


/* ******************************************************************** */
@media (min-width: 650px) {
  
  .Grid > .g1of1 {
    flex: 0 0 100%;
  }

  .Grid > .g1of2 {
    flex: 0 0 50%;
  }

}