.grid-spacing-10{
  margin:0 -10px;
}
.grid-spacing-10 .col{
  padding:0 10px;
}
.grid-spacing-20{
  margin:0 -20px;
}
.grid-spacing-20 .col{
  padding:0 20px;
}
.grid-spacing-30{
  margin:0 -30px;
}
.grid-spacing-30 .col{
  padding:0 30px;
}

.col,.mobile-col{
  display:inline-block;
  box-sizing:border-box;
  vertical-align:top;
}
.col-16{
  width:16.666%;
}
.col-25{
  width:25%;
}
.col-30{
  width:30%;
}
.col-33{
  width:33.333%;
}
.col-45{
  width:45%;
}
.col-40{
  width:40%;
}
.col-50{
  width:50%;
}
.col-55{
  width:55%;
}
.col-60{
  width:60%;
}
.col-66{
  width:66.666%;
}
.col-75{
  width:75%;
}
.col-83{
  width:83.333%;
}
.col.left{
  text-align:left;
}
.col.right{
  text-align:right;
}
.col.center{
  text-align:center;
}
.col.vbottom{
  vertical-align:bottom;
}
.table-container{
  display:table;
  width:100%;
}
.table-col{
  display:table-cell;
  vertical-align:middle;
}

/*Flexbox*/
.flex-container{
  display:flex;
  justify-content:space-between;
  margin:0 -10px;
}
.flex-container > div{
  padding:0 10px;
}
.flex-container:not(:last-child){
  margin-bottom:20px;
}
.flex-container.valign{
  align-items:center;
}
.flex-30{
  width:30%;
}
.flex-70{
  width:70%;
}