.grid-x-1 {
  
}

/**/
.grid-x-1-1-1 {
  display: flex;
  flex-direction: row;
  flex-wrap:wrap;
}
.grid-x-1-1-1 > *{
  width:33.3%;
}

/**/
.grid-x-2-1 {
  display: flex;
  flex-direction: row;
  flex-wrap:wrap;
}
.grid-x-2-1 > *{
  width:33.3%;
}
.grid-x-2-1 > *:first-child{
  width:66.7%;
}

/**/
.grid-x-1-2 {
  display: flex;
  flex-direction: row;
  flex-wrap:wrap;
}
.grid-x-1-2 > *{
  width:33.3%;
}
.grid-x-1-2 > *:last-child{
  width:66.7%;
}

/**/
.grid-x-1-1 {
  display: flex;
  flex-direction: row;
  flex-wrap:wrap;
}
.grid-x-1-1 > *{
  width:50%;
}

/**/
.grid-y-2-1 {
  display: grid;
  grid-template-rows: 66.6% auto;
}
.grid-y-1-2 {
  display: grid;
  grid-template-rows: 33.3% auto;
}

/**/
.grid-gap-5 {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
}
.grid-gap-10 {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
}
.grid-gap-15 {
  grid-column-gap: 15px;
  grid-row-gap: 15px;
}
.grid-gap-20 {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
}
.grid-gap-25 {
  grid-column-gap: 25px;
  grid-row-gap: 25px;
}
.grid-gap-30 {
  grid-column-gap: 30px;
  grid-row-gap: 30px;
}