/* main.css */


/* Add Pregressive Enhancement CSS if Flexbox not supported */
.no-flexbox .container {
  background: #eee;
  overflow: auto;
}

.no-flexbox .container .col {
    width: 27%;
    padding: 30px 3.15% 0;
    float: left;
}

@media screen and (max-width: 48rem) {
  .no-flexbox .container .col {
    width: 95%;
  }
}
/* Add Pregressive Enhancement CSS if Flexbox not supported */


.container {
  display: -webkit-box;  /* OLD - iOS 6-, Safari 3.1-6 */
  display: -ms-flexbox;  /* TWEENER - IE 10 */
  display: flex;         /* NEW, Spec - Firefox, Chrome, Opera */
  background: #eee;  
  overflow: auto;
}

.container .col {
  flex: 1;
  padding: 1rem;
}


@media screen and (max-width: 48rem) {
  .container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    flex-flow: column;
  }
}

/* main.css */


/* Add Pregressive Enhancement CSS if Flexbox not supported */
.no-flexbox .container {
  background: #eee;
  overflow: auto;
}

.no-flexbox .container .col {
    width: 27%;
    padding: 30px 3.15% 0;
    float: left;
}

@media screen and (max-width: 48rem) {
  .no-flexbox .container .col {
    width: 95%;
  }
}
/* Add Pregressive Enhancement CSS if Flexbox not supported */



/* Add Pregressive Enhancement CSS if Flexbox is supported */
.flexbox .container {
  display: -webkit-box;  /* OLD - iOS 6-, Safari 3.1-6 */
  display: -ms-flexbox;  /* TWEENER - IE 10 */
  display: flex;         /* NEW, Spec - Firefox, Chrome, Opera */
  background: #eee;  
  overflow: auto;
}

.flexbox .container .col {
  flex: 1;
  padding: 1rem;
}


@media screen and (max-width: 48rem) {
  .flexbox .container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    flex-flow: column;
  }
}
/* Add Pregressive Enhancement CSS if Flexbox is supported */



Add Pregressive Enhancement CSS if Flexbox is supported
Add Pregressive Enhancement CSS if Flexbox is supported
