div.container {
  width: 100%;
}

.grid {
  float: left;
}

/* for none groupded columns */
.grid-1 {
  width: 4.16666%;
}

.grid-2 {
  width: 8.33333%;
}

.grid-3 {
  width: 12.5%;
}

.grid-4 {
  width: 16.66666%;
}

.grid-5 {
  width: 20.83333%;
}

.grid-6 {
  width: 25%;
}

.grid-7 {
  width: 29.16666%;
}

.grid-8 {
  width: 33.33333%;
}

.grid-9 {
  width: 37.5%;
}

.grid-10 {
  width: 41.66666%;
}

.grid-11 {
  width: 45.83333%;
}

.grid-12 {
  width: 50%;
}

.grid-13 {
  width: 54.16666%;
}

.grid-14 {
  width: 58.33333%;
}

.grid-15 {
  width: 62.5%;
}

.grid-16 {
  width: 66.66666%;
}

.grid-17 {
  width: 70.83333%;
}

.grid-18 {
  width: 75%;
}

.grid-19 {
  width: 79.16666%;
}

.grid-20 {
  width: 83.33333%;
}

.grid-21 {
  width: 87.5%;
}

.grid-22 {
  width: 91.66666%;
}

.grid-23 {
  width: 95.83333%;
}

.grid-24 {
  width: 100%;
}

/* for grouped 24 columns */
.group-24 .grid-1 {
  width: 4.16666%;
}
.group-24 .grid-2 {
  width: 8.33333%;
}
.group-24 .grid-3 {
  width: 12.5%;
}
.group-24 .grid-4 {
  width: 16.66666%;
}
.group-24 .grid-5 {
  width: 20.83333%;
}
.group-24 .grid-6 {
  width: 25%;
}
.group-24 .grid-7 {
  width: 29.16666%;
}
.group-24 .grid-8 {
  width: 33.33333%;
}
.group-24 .grid-9 {
  width: 37.5%;
}
.group-24 .grid-10 {
  width: 41.66666%;
}
.group-24 .grid-11 {
  width: 45.83333%;
}
.group-24 .grid-12 {
  width: 50%;
}
.group-24 .grid-13 {
  width: 54.16666%;
}
.group-24 .grid-14 {
  width: 58.33333%;
}
.group-24 .grid-15 {
  width: 62.5%;
}
.group-24 .grid-16 {
  width: 66.66666%;
}
.group-24 .grid-17 {
  width: 70.83333%;
}
.group-24 .grid-18 {
  width: 75%;
}
.group-24 .grid-19 {
  width: 79.16666%;
}
.group-24 .grid-20 {
  width: 83.33333%;
}
.group-24 .grid-21 {
  width: 87.5%;
}
.group-24 .grid-22 {
  width: 91.66666%;
}
.group-24 .grid-23 {
  width: 95.83333%;
}
.group-24 .grid-24 {
  width: 100%;
}
/* for grouped 23 columns */
.group-23 .grid-1 {
  width: 4.34782%;
}
.group-23 .grid-2 {
  width: 8.69565%;
}
.group-23 .grid-3 {
  width: 13.04347%;
}
.group-23 .grid-4 {
  width: 17.3913%;
}
.group-23 .grid-5 {
  width: 21.73913%;
}
.group-23 .grid-6 {
  width: 26.08695%;
}
.group-23 .grid-7 {
  width: 30.43478%;
}
.group-23 .grid-8 {
  width: 34.7826%;
}
.group-23 .grid-9 {
  width: 39.13043%;
}
.group-23 .grid-10 {
  width: 43.47826%;
}
.group-23 .grid-11 {
  width: 47.82608%;
}
.group-23 .grid-12 {
  width: 52.17391%;
}
.group-23 .grid-13 {
  width: 56.52173%;
}
.group-23 .grid-14 {
  width: 60.86956%;
}
.group-23 .grid-15 {
  width: 65.21739%;
}
.group-23 .grid-16 {
  width: 69.56521%;
}
.group-23 .grid-17 {
  width: 73.91304%;
}
.group-23 .grid-18 {
  width: 78.26086%;
}
.group-23 .grid-19 {
  width: 82.60869%;
}
.group-23 .grid-20 {
  width: 86.95652%;
}
.group-23 .grid-21 {
  width: 91.30434%;
}
.group-23 .grid-22 {
  width: 95.65217%;
}
.group-23 .grid-23 {
  width: 100%;
}
/* for grouped 22 columns */
.group-22 .grid-1 {
  width: 4.54545%;
}
.group-22 .grid-2 {
  width: 9.0909%;
}
.group-22 .grid-3 {
  width: 13.63636%;
}
.group-22 .grid-4 {
  width: 18.18181%;
}
.group-22 .grid-5 {
  width: 22.72727%;
}
.group-22 .grid-6 {
  width: 27.27272%;
}
.group-22 .grid-7 {
  width: 31.81818%;
}
.group-22 .grid-8 {
  width: 36.36363%;
}
.group-22 .grid-9 {
  width: 40.90909%;
}
.group-22 .grid-10 {
  width: 45.45454%;
}
.group-22 .grid-11 {
  width: 50%;
}
.group-22 .grid-12 {
  width: 54.54545%;
}
.group-22 .grid-13 {
  width: 59.0909%;
}
.group-22 .grid-14 {
  width: 63.63636%;
}
.group-22 .grid-15 {
  width: 68.18181%;
}
.group-22 .grid-16 {
  width: 72.72727%;
}
.group-22 .grid-17 {
  width: 77.27272%;
}
.group-22 .grid-18 {
  width: 81.81818%;
}
.group-22 .grid-19 {
  width: 86.36363%;
}
.group-22 .grid-20 {
  width: 90.90909%;
}
.group-22 .grid-21 {
  width: 95.45454%;
}
.group-22 .grid-22 {
  width: 100%;
}
/* for grouped 21 columns */
.group-21 .grid-1 {
  width: 4.7619%;
}
.group-21 .grid-2 {
  width: 9.5238%;
}
.group-21 .grid-3 {
  width: 14.28571%;
}
.group-21 .grid-4 {
  width: 19.04761%;
}
.group-21 .grid-5 {
  width: 23.80952%;
}
.group-21 .grid-6 {
  width: 28.57142%;
}
.group-21 .grid-7 {
  width: 33.33333%;
}
.group-21 .grid-8 {
  width: 38.09523%;
}
.group-21 .grid-9 {
  width: 42.85714%;
}
.group-21 .grid-10 {
  width: 47.61904%;
}
.group-21 .grid-11 {
  width: 52.38095%;
}
.group-21 .grid-12 {
  width: 57.14285%;
}
.group-21 .grid-13 {
  width: 61.90476%;
}
.group-21 .grid-14 {
  width: 66.66666%;
}
.group-21 .grid-15 {
  width: 71.42857%;
}
.group-21 .grid-16 {
  width: 76.19047%;
}
.group-21 .grid-17 {
  width: 80.95238%;
}
.group-21 .grid-18 {
  width: 85.71428%;
}
.group-21 .grid-19 {
  width: 90.47619%;
}
.group-21 .grid-20 {
  width: 95.23809%;
}
.group-21 .grid-21 {
  width: 100%;
}
/* for grouped 20 columns */
.group-20 .grid-1 {
  width: 5%;
}
.group-20 .grid-2 {
  width: 10%;
}
.group-20 .grid-3 {
  width: 15%;
}
.group-20 .grid-4 {
  width: 20%;
}
.group-20 .grid-5 {
  width: 25%;
}
.group-20 .grid-6 {
  width: 30%;
}
.group-20 .grid-7 {
  width: 35%;
}
.group-20 .grid-8 {
  width: 40%;
}
.group-20 .grid-9 {
  width: 45%;
}
.group-20 .grid-10 {
  width: 50%;
}
.group-20 .grid-11 {
  width: 55%;
}
.group-20 .grid-12 {
  width: 60%;
}
.group-20 .grid-13 {
  width: 65%;
}
.group-20 .grid-14 {
  width: 70%;
}
.group-20 .grid-15 {
  width: 75%;
}
.group-20 .grid-16 {
  width: 80%;
}
.group-20 .grid-17 {
  width: 85%;
}
.group-20 .grid-18 {
  width: 90%;
}
.group-20 .grid-19 {
  width: 95%;
}
.group-20 .grid-20 {
  width: 100%;
}
/* for grouped 19 columns */
.group-19 .grid-1 {
  width: 5.26315%;
}
.group-19 .grid-2 {
  width: 10.52631%;
}
.group-19 .grid-3 {
  width: 15.78947%;
}
.group-19 .grid-4 {
  width: 21.05263%;
}
.group-19 .grid-5 {
  width: 26.31578%;
}
.group-19 .grid-6 {
  width: 31.57894%;
}
.group-19 .grid-7 {
  width: 36.8421%;
}
.group-19 .grid-8 {
  width: 42.10526%;
}
.group-19 .grid-9 {
  width: 47.36842%;
}
.group-19 .grid-10 {
  width: 52.63157%;
}
.group-19 .grid-11 {
  width: 57.89473%;
}
.group-19 .grid-12 {
  width: 63.15789%;
}
.group-19 .grid-13 {
  width: 68.42105%;
}
.group-19 .grid-14 {
  width: 73.68421%;
}
.group-19 .grid-15 {
  width: 78.94736%;
}
.group-19 .grid-16 {
  width: 84.21052%;
}
.group-19 .grid-17 {
  width: 89.47368%;
}
.group-19 .grid-18 {
  width: 94.73684%;
}
.group-19 .grid-19 {
  width: 100%;
}
/* for grouped 18 columns */
.group-18 .grid-1 {
  width: 5.55555%;
}
.group-18 .grid-2 {
  width: 11.11111%;
}
.group-18 .grid-3 {
  width: 16.66666%;
}
.group-18 .grid-4 {
  width: 22.22222%;
}
.group-18 .grid-5 {
  width: 27.77777%;
}
.group-18 .grid-6 {
  width: 33.33333%;
}
.group-18 .grid-7 {
  width: 38.88888%;
}
.group-18 .grid-8 {
  width: 44.44444%;
}
.group-18 .grid-9 {
  width: 50%;
}
.group-18 .grid-10 {
  width: 55.55555%;
}
.group-18 .grid-11 {
  width: 61.11111%;
}
.group-18 .grid-12 {
  width: 66.66666%;
}
.group-18 .grid-13 {
  width: 72.22222%;
}
.group-18 .grid-14 {
  width: 77.77777%;
}
.group-18 .grid-15 {
  width: 83.33333%;
}
.group-18 .grid-16 {
  width: 88.88888%;
}
.group-18 .grid-17 {
  width: 94.44444%;
}
.group-18 .grid-18 {
  width: 100%;
}
/* for grouped 17 columns */
.group-17 .grid-1 {
  width: 5.88235%;
}
.group-17 .grid-2 {
  width: 11.7647%;
}
.group-17 .grid-3 {
  width: 17.64705%;
}
.group-17 .grid-4 {
  width: 23.52941%;
}
.group-17 .grid-5 {
  width: 29.41176%;
}
.group-17 .grid-6 {
  width: 35.29411%;
}
.group-17 .grid-7 {
  width: 41.17647%;
}
.group-17 .grid-8 {
  width: 47.05882%;
}
.group-17 .grid-9 {
  width: 52.94117%;
}
.group-17 .grid-10 {
  width: 58.82352%;
}
.group-17 .grid-11 {
  width: 64.70588%;
}
.group-17 .grid-12 {
  width: 70.58823%;
}
.group-17 .grid-13 {
  width: 76.47058%;
}
.group-17 .grid-14 {
  width: 82.35294%;
}
.group-17 .grid-15 {
  width: 88.23529%;
}
.group-17 .grid-16 {
  width: 94.11764%;
}
.group-17 .grid-17 {
  width: 100%;
}
/* for grouped 16 columns */
.group-16 .grid-1 {
  width: 6.25%;
}
.group-16 .grid-2 {
  width: 12.5%;
}
.group-16 .grid-3 {
  width: 18.75%;
}
.group-16 .grid-4 {
  width: 25%;
}
.group-16 .grid-5 {
  width: 31.25%;
}
.group-16 .grid-6 {
  width: 37.5%;
}
.group-16 .grid-7 {
  width: 43.75%;
}
.group-16 .grid-8 {
  width: 50%;
}
.group-16 .grid-9 {
  width: 56.25%;
}
.group-16 .grid-10 {
  width: 62.5%;
}
.group-16 .grid-11 {
  width: 68.75%;
}
.group-16 .grid-12 {
  width: 75%;
}
.group-16 .grid-13 {
  width: 81.25%;
}
.group-16 .grid-14 {
  width: 87.5%;
}
.group-16 .grid-15 {
  width: 93.75%;
}
.group-16 .grid-16 {
  width: 100%;
}
/* for grouped 15 columns */
.group-15 .grid-1 {
  width: 6.66666%;
}
.group-15 .grid-2 {
  width: 13.33333%;
}
.group-15 .grid-3 {
  width: 20%;
}
.group-15 .grid-4 {
  width: 26.66666%;
}
.group-15 .grid-5 {
  width: 33.33333%;
}
.group-15 .grid-6 {
  width: 40%;
}
.group-15 .grid-7 {
  width: 46.66666%;
}
.group-15 .grid-8 {
  width: 53.33333%;
}
.group-15 .grid-9 {
  width: 60%;
}
.group-15 .grid-10 {
  width: 66.66666%;
}
.group-15 .grid-11 {
  width: 73.33333%;
}
.group-15 .grid-12 {
  width: 80%;
}
.group-15 .grid-13 {
  width: 86.66666%;
}
.group-15 .grid-14 {
  width: 93.33333%;
}
.group-15 .grid-15 {
  width: 100%;
}
/* for grouped 14 columns */
.group-14 .grid-1 {
  width: 7.14285%;
}
.group-14 .grid-2 {
  width: 14.28571%;
}
.group-14 .grid-3 {
  width: 21.42857%;
}
.group-14 .grid-4 {
  width: 28.57142%;
}
.group-14 .grid-5 {
  width: 35.71428%;
}
.group-14 .grid-6 {
  width: 42.85714%;
}
.group-14 .grid-7 {
  width: 50%;
}
.group-14 .grid-8 {
  width: 57.14285%;
}
.group-14 .grid-9 {
  width: 64.28571%;
}
.group-14 .grid-10 {
  width: 71.42857%;
}
.group-14 .grid-11 {
  width: 78.57142%;
}
.group-14 .grid-12 {
  width: 85.71428%;
}
.group-14 .grid-13 {
  width: 92.85714%;
}
.group-14 .grid-14 {
  width: 100%;
}
/* for grouped 13 columns */
.group-13 .grid-1 {
  width: 7.6923%;
}
.group-13 .grid-2 {
  width: 15.38461%;
}
.group-13 .grid-3 {
  width: 23.07692%;
}
.group-13 .grid-4 {
  width: 30.76923%;
}
.group-13 .grid-5 {
  width: 38.46153%;
}
.group-13 .grid-6 {
  width: 46.15384%;
}
.group-13 .grid-7 {
  width: 53.84615%;
}
.group-13 .grid-8 {
  width: 61.53846%;
}
.group-13 .grid-9 {
  width: 69.23076%;
}
.group-13 .grid-10 {
  width: 76.92307%;
}
.group-13 .grid-11 {
  width: 84.61538%;
}
.group-13 .grid-12 {
  width: 92.30769%;
}
.group-13 .grid-13 {
  width: 100%;
}
/* for grouped 12 columns */
.group-12 .grid-1 {
  width: 8.33333%;
}
.group-12 .grid-2 {
  width: 16.66666%;
}
.group-12 .grid-3 {
  width: 25%;
}
.group-12 .grid-4 {
  width: 33.33333%;
}
.group-12 .grid-5 {
  width: 41.66666%;
}
.group-12 .grid-6 {
  width: 50%;
}
.group-12 .grid-7 {
  width: 58.33333%;
}
.group-12 .grid-8 {
  width: 66.66666%;
}
.group-12 .grid-9 {
  width: 75%;
}
.group-12 .grid-10 {
  width: 83.33333%;
}
.group-12 .grid-11 {
  width: 91.66666%;
}
.group-12 .grid-12 {
  width: 100%;
}
/* for grouped 11 columns */
.group-11 .grid-1 {
  width: 9.0909%;
}
.group-11 .grid-2 {
  width: 18.18181%;
}
.group-11 .grid-3 {
  width: 27.27272%;
}
.group-11 .grid-4 {
  width: 36.36363%;
}
.group-11 .grid-5 {
  width: 45.45454%;
}
.group-11 .grid-6 {
  width: 54.54545%;
}
.group-11 .grid-7 {
  width: 63.63636%;
}
.group-11 .grid-8 {
  width: 72.72727%;
}
.group-11 .grid-9 {
  width: 81.81818%;
}
.group-11 .grid-10 {
  width: 90.90909%;
}
.group-11 .grid-11 {
  width: 100%;
}
/* for grouped 10 columns */
.group-10 .grid-1 {
  width: 10%;
}
.group-10 .grid-2 {
  width: 20%;
}
.group-10 .grid-3 {
  width: 30%;
}
.group-10 .grid-4 {
  width: 40%;
}
.group-10 .grid-5 {
  width: 50%;
}
.group-10 .grid-6 {
  width: 60%;
}
.group-10 .grid-7 {
  width: 70%;
}
.group-10 .grid-8 {
  width: 80%;
}
.group-10 .grid-9 {
  width: 90%;
}
.group-10 .grid-10 {
  width: 100%;
}
/* for grouped 9 columns */
.group-9 .grid-1 {
  width: 11.11111%;
}
.group-9 .grid-2 {
  width: 22.22222%;
}
.group-9 .grid-3 {
  width: 33.33333%;
}
.group-9 .grid-4 {
  width: 44.44444%;
}
.group-9 .grid-5 {
  width: 55.55555%;
}
.group-9 .grid-6 {
  width: 66.66666%;
}
.group-9 .grid-7 {
  width: 77.77777%;
}
.group-9 .grid-8 {
  width: 88.88888%;
}
.group-9 .grid-9 {
  width: 100%;
}
/* for grouped 8 columns */
.group-8 .grid-1 {
  width: 12.5%;
}
.group-8 .grid-2 {
  width: 25%;
}
.group-8 .grid-3 {
  width: 37.5%;
}
.group-8 .grid-4 {
  width: 50%;
}
.group-8 .grid-5 {
  width: 62.5%;
}
.group-8 .grid-6 {
  width: 75%;
}
.group-8 .grid-7 {
  width: 87.5%;
}
.group-8 .grid-8 {
  width: 100%;
}
/* for grouped 7 columns */
.group-7 .grid-1 {
  width: 14.28571%;
}
.group-7 .grid-2 {
  width: 28.57142%;
}
.group-7 .grid-3 {
  width: 42.85714%;
}
.group-7 .grid-4 {
  width: 57.14285%;
}
.group-7 .grid-5 {
  width: 71.42857%;
}
.group-7 .grid-6 {
  width: 85.71428%;
}
.group-7 .grid-7 {
  width: 100%;
}
/* for grouped 6 columns */
.group-6 .grid-1 {
  width: 16.66666%;
}
.group-6 .grid-2 {
  width: 33.33333%;
}
.group-6 .grid-3 {
  width: 50%;
}
.group-6 .grid-4 {
  width: 66.66666%;
}
.group-6 .grid-5 {
  width: 83.33333%;
}
.group-6 .grid-6 {
  width: 100%;
}
/* for grouped 5 columns */
.group-5 .grid-1 {
  width: 20%;
}
.group-5 .grid-2 {
  width: 40%;
}
.group-5 .grid-3 {
  width: 60%;
}
.group-5 .grid-4 {
  width: 80%;
}
.group-5 .grid-5 {
  width: 100%;
}
/* for grouped 4 columns */
.group-4 .grid-1 {
  width: 25%;
}
.group-4 .grid-2 {
  width: 50%;
}
.group-4 .grid-3 {
  width: 75%;
}
.group-4 .grid-4 {
  width: 100%;
}
/* for grouped 3 columns */
.group-3 .grid-1 {
  width: 33.33333%;
}
.group-3 .grid-2 {
  width: 66.66666%;
}
.group-3 .grid-3 {
  width: 100%;
}
/* for grouped 2 columns */
.group-2 .grid-1 {
  width: 50%;
}
.group-2 .grid-2 {
  width: 100%;
}
/* for grouped 1 columns */
.group-1 .grid-1 {
  width: 100%;
}