mobile break point columns not full width

Hi,
Sorry for the late reply, I took a look at your page, and see that for mobile the grid cells a full width, and for desktop the grid cells are 3 across with a fine white border between them.
To remove this fine border, Please try this code in the General Styling > Quick CSS field:

#top.home #topgridrow.av-layout-grid-container .no_margin.av_one_third,#top.home #nextgridrow.av-layout-grid-container .no_margin.av_one_third {
    width: 33.4% !important; 
}

Best regards,
Mike

Hi,
Thanks for the feedback, I took another look at your css and adjusted your top column widths so they would be full width for mobile.
But I’m not sure what “other columns” you want to adjust the margin on, as I read your other posts I thought the top 6 1/3 columns with the images was what you wanted to adjust.
Please clear your browser cache and check.

Best regards,
Mike

Hi,
To reduce the spacing between the 5 blue columns (CATEGORIES AND OTHER EVENTS) and also allow them to go full width for mobile, Please try this code in the General Styling > Quick CSS field:

@media only screen and (min-width: 768px) { 
#top.home #av_section_4 .flex_column.av_one_fifth {
    margin-left: 1% !important; 
    width: 19% !important; 
}
}

please feel free to adjust to suit, notice the width & margin equals a total of 20%, these two must equal this.

For the 3 columns “services”, try this css:

@media only screen and (min-width: 768px) { 
#top.home #services .flex_column.av_one_third {
      margin-left: 1% !important; 
    width: 32% !important; 
}
}

please feel free to adjust to suit, notice the width & margin equals a total of 33%, these two must equal this.

Best regards,
Mike