Blogger Theme Code experts HELP ME


#1

I want to change my website grid. screen shot below.

i want to make those 2 grids into 4 for each row.

this is my grid code: /* Grids -----------------------------------------*/

.grids-post { float: left; width: 49%; margin-right: 2%; height: 320px; position: relative; display: table; margin-bottom: 15px; }

.grids-post:nth-child(2n+2) { margin-right: 0; }

.grids-post:nth-last-child(2), .grids-post:last-child { margin-bottom: 0; }

.grids-post-info { display: table-cell; vertical-align: middle; text-align: center; background: rgba(0, 0, 0, .55); position: relative; padding: 15px; }

.grids-post .category { margin-top: 0; margin-bottom: 25px; }

.grids-post .heading { color: #fff; font-size: 1.3rem; margin-bottom: 25px; }

.grids-post .publish-date, .grids-post .writer { color: #CACACA; font-size: .7rem; text-transform: uppercase; }

.grids-post .publish-date { margin-right: 20px; }

thanks in advance for your /* Grids -----------------------------------------*/

.grids-post { float: left; width: 49%; margin-right: 2%; height: 320px; position: relative; display: table; margin-bottom: 15px; }

.grids-post:nth-child(2n+2) { margin-right: 0; }

.grids-post:nth-last-child(2), .grids-post:last-child { margin-bottom: 0; }

.grids-post-info { display: table-cell; vertical-align: middle; text-align: center; background: rgba(0, 0, 0, .55); position: relative; padding: 15px; }

.grids-post .category { margin-top: 0; margin-bottom: 25px; }

.grids-post .heading { color: #fff; font-size: 1.3rem; margin-bottom: 25px; }

.grids-post .publish-date, .grids-post .writer { color: #CACACA; font-size: .7rem; text-transform: uppercase; }

.grids-post .publish-date { margin-right: 20px; } /* Grids -----------------------------------------*/

.grids-post { float: left; width: 49%; margin-right: 2%; height: 320px; position: relative; display: table; margin-bottom: 15px; }

.grids-post:nth-child(2n+2) { margin-right: 0; }

.grids-post:nth-last-child(2), .grids-post:last-child { margin-bottom: 0; }

.grids-post-info { display: table-cell; vertical-align: middle; text-align: center; background: rgba(0, 0, 0, .55); position: relative; padding: 15px; }

.grids-post .category { margin-top: 0; margin-bottom: 25px; }

.grids-post .heading { color: #fff; font-size: 1.3rem; margin-bottom: 25px; }

.grids-post .publish-date, .grids-post .writer { color: #CACACA; font-size: .7rem; text-transform: uppercase; }

.grids-post .publish-date { margin-right: 20px; }

thanks in advanc for your valuable time