.grid-item { float: left; width: 29.7619047619%; margin-bottom: 40px; margin-left: 5.3571428571%; } .grid-item:nth-of-type(3n+1) { margin-left: 0; } @media only screen and (max-width: 800px) { .grid-item { width: 46.2121212121%; margin-left: 7.5757575758%; } .grid-item:nth-of-type(3n+1) { margin-left: 7.5757575758%; } .grid-item:nth-of-type(2n+1) { margin-left: 0; } } @media only screen and (max-width: 500px) { .grid-item { width: 100%; margin-left: 0; } .grid-item:nth-of-type(3n+1) { margin-left: 0; } }