
.contenitore {
  position: relative;
  width: 100%;
  max-width:1280px;
  margin: 0 auto;
  padding: 0 20px;
  box-sizing: border-box; }
.colonna,
.colonne {
  width: 100%;
  float: left;
  box-sizing: border-box; }

/* For devices larger than 400px */
@media (min-width: 400px) {
  .contenitore {
    width: 85%;
    padding: 0; 
	}
}

/* For devices larger than 550px */
@media (min-width: 1024px) {
  .contenitore {
    width:90%; }
  .colonna,
  .colonne {
    margin-left: 4%; }
  .colonna:first-child,
  .colonne:first-child {
    margin-left: 0; }

  .una.colonna,
  .una.colonne                    { width: 4.66666666667%; }
  .due.colonne                    { width: 13.3333333333%; }
  .tre.colonne                  { width: 22%;            }
  .quattro.colonne                   { width: 30.6666666667%; }
  .cinque.colonne                   { width: 39.3333333333%; }
  .sei.colonne                    { width: 48%;            }
  .sette.colonne                  { width: 56.6666666667%; }
  .otto.colonne                  { width: 65.3333333333%; }
  .nove.colonne                   { width: 74.0%;          }
  .dieci.colonne                    { width: 82.6666666667%; }
  .undici.colonne                 { width: 91.3333333333%; }
  .dodici.colonne                 { width: 100%; margin-left: 0; }

  .un-terzo.colonna               { width: 30.6666666667%; }
  .due-terzi.colonna              { width: 65.3333333333%; }

  .mezza.colonna                { width: 48%; }

  /* Offsets */
  .offset-by-una.colonna,
  .offset-by-una.colonne          { margin-left: 8.66666666667%; }
  .offset-by-due.colonna,
  .offset-by-due.colonne          { margin-left: 17.3333333333%; }
  .offset-by-tre.colonna,
  .offset-by-tre.colonne        { margin-left: 26%;            }
  .offset-by-quattro.colonna,
  .offset-by-quattro.colonne         { margin-left: 34.6666666667%; }
  .offset-by-cinque.colonna,
  .offset-by-cinque.colonne         { margin-left: 43.3333333333%; }
  .offset-by-sei.colonna,
  .offset-by-sei.colonne          { margin-left: 52%;            }
  .offset-by-sette.colonna,
  .offset-by-sette.colonne        { margin-left: 60.6666666667%; }
  .offset-by-otto.colonna,
  .offset-by-otto.colonne        { margin-left: 69.3333333333%; }
  .offset-by-nove.colonna,
  .offset-by-nove.colonne         { margin-left: 78.0%;          }
  .offset-by-dieci.colonna,
  .offset-by-dieci.colonne          { margin-left: 86.6666666667%; }
  .offset-by-undici.colonna,
  .offset-by-undici.colonne       { margin-left: 95.3333333333%; }

  .offset-by-un-terzo.colonna,
  .offset-by-un-terzo.colonne    { margin-left: 34.6666666667%; }
  .offset-by-due-terzi.colonna,
  .offset-by-due-terzi.colonne   { margin-left: 69.3333333333%; }

  .offset-by-mezza.colonna,
  .offset-by-mezze.colonne     { margin-left: 52%; }

}




/* Larger than mobile */
@media (min-width: 400px) {}

/* Larger than phablet (also point when grid becomes active) */
@media (min-width: 550px) {}

/* Larger than tablet */
@media (min-width: 750px) {}

/* Larger than desktop */
@media (min-width: 1000px) {}

/* Larger than Desktop HD */
@media (min-width: 1200px) {}
