[et_pb_section bb_built=”1″ admin_label=”JS: This code wraps the title and caption in a container to allow for better positioning. You can leave it here or move to Divi > Theme Options > Integration > Add to head” fullwidth=”on” _builder_version=”3.0.90″ custom_padding=”0|0px|0px|0px|false|false” next_background_color=”#f5f5f5″ border_radii=”on|0px|0px|0px|0px” animation_style=”slide”][et_pb_fullwidth_code admin_label=”CSS: You can leave this here or move the code between the style tags to your child theme stylehseet or Divi > Theme Options > General > Custom CSS” _builder_version=”3.9″]<style><!– [et_pb_line_break_holder] –>/*———————————————–*/<!– [et_pb_line_break_holder] –>/*——-CSS Grid Blog Layout by Divi Soup——-*/<!– [et_pb_line_break_holder] –>/*———————————————–*/<!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –>/*Blog layout settings, adjust these values only*/<!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –>:root {<!– [et_pb_line_break_holder] –> –ds-white: #ffffff; /*The background colour for the post content and text colour for the second and third post content*/<!– [et_pb_line_break_holder] –> –ds-grid-2-item: 250px; /*Minimum column width for second grid, decrease this value for more columns*/<!– [et_pb_line_break_holder] –> –ds-grid-gap: 30px; /*The gap between posts*/<!– [et_pb_line_break_holder] –> –ds-title-background: rgba(0, 0, 0, .5); /*The background colour of the titles on the second and third posts*/<!– [et_pb_line_break_holder] –>}<!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –>/******************************************************/<!– [et_pb_line_break_holder] –>/*You should not need to edit anything below this line*/<!– [et_pb_line_break_holder] –>/******************************************************/<!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –>/*Set posts to flex and remove post margin*/<!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –>.ds-grid-blog .et_pb_post {<!– [et_pb_line_break_holder] –> display: -webkit-box;<!– [et_pb_line_break_holder] –> display: -ms-flexbox;<!– [et_pb_line_break_holder] –> display: flex;<!– [et_pb_line_break_holder] –> margin-bottom: 0;<!– [et_pb_line_break_holder] –>}<!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –>/*Set flex direction for second grid*/<!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –>.ds-grid-blog-2 .et_pb_post {<!– [et_pb_line_break_holder] –> -webkit-box-orient: vertical;<!– [et_pb_line_break_holder] –> -webkit-box-direction: normal;<!– [et_pb_line_break_holder] –> -ms-flex-direction: column;<!– [et_pb_line_break_holder] –> flex-direction: column;<!– [et_pb_line_break_holder] –>}<!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –>/*Set post content to flex*/<!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –>.ds-grid-blog-content {<!– [et_pb_line_break_holder] –> display: -webkit-box;<!– [et_pb_line_break_holder] –> display: -ms-flexbox;<!– [et_pb_line_break_holder] –> display: flex;<!– [et_pb_line_break_holder] –> -webkit-box-orient: vertical;<!– [et_pb_line_break_holder] –> -webkit-box-direction: normal;<!– [et_pb_line_break_holder] –> -ms-flex-direction: column;<!– [et_pb_line_break_holder] –> flex-direction: column;<!– [et_pb_line_break_holder] –> background: var(–ds-white);<!– [et_pb_line_break_holder] –>}<!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –>/*Remove image margin and resize for responsiveness*/<!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –>.ds-grid-blog .entry-featured-image-url {<!– [et_pb_line_break_holder] –> margin-bottom: 0;<!– [et_pb_line_break_holder] –> height: 100%;<!– [et_pb_line_break_holder] –> width: auto;<!– [et_pb_line_break_holder] –>}<!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –>.ds-grid-blog .et_pb_post a img {<!– [et_pb_line_break_holder] –> height: 100%;<!– [et_pb_line_break_holder] –> -o-object-fit: cover;<!– [et_pb_line_break_holder] –> object-fit: cover;<!– [et_pb_line_break_holder] –>}<!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –>/*Reset the read more link display*/<!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –>.ds-grid-blog a.more-link {<!– [et_pb_line_break_holder] –> display: initial;<!– [et_pb_line_break_holder] –>}<!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –>/*Add margin to excerpt*/<!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –>.ds-grid-blog .post-content p {<!– [et_pb_line_break_holder] –> margin-bottom: 20px;<!– [et_pb_line_break_holder] –>}<!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –>/*Pagination placement*/<!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –>.ds-grid-blog .pagination {<!– [et_pb_line_break_holder] –> grid-column: 1/-1;<!– [et_pb_line_break_holder] –>}<!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –>/*Set the grid for the first 3 posts*/<!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –>.ds-grid-blog-1 .et_pb_ajax_pagination_container {<!– [et_pb_line_break_holder] –> display: grid;<!– [et_pb_line_break_holder] –> grid-template-columns: repeat(2, 1fr);<!– [et_pb_line_break_holder] –> grid-gap: var(–ds-grid-gap);<!– [et_pb_line_break_holder] –>}<!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –>/*Set the grid for the remaining posts*/<!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –>.ds-grid-blog-2 .et_pb_ajax_pagination_container {<!– [et_pb_line_break_holder] –> display: grid;<!– [et_pb_line_break_holder] –> grid-template-columns: repeat(auto-fill, minmax(var(–ds-grid-2-item), 1fr));<!– [et_pb_line_break_holder] –> grid-gap: var(–ds-grid-gap);<!– [et_pb_line_break_holder] –>}<!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –>/*First grid first post placement*/<!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –>.ds-grid-blog-1 .et_pb_post:first-child {<!– [et_pb_line_break_holder] –> grid-column: 1 / -1;<!– [et_pb_line_break_holder] –>}<!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –>/*First grid second post placement*/<!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –>.ds-grid-blog-1 .et_pb_post:nth-child(2) {<!– [et_pb_line_break_holder] –> grid-column: 1 / 2;<!– [et_pb_line_break_holder] –>}<!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –>/*First grid third post placement*/<!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –>.ds-grid-blog-1 .et_pb_post:nth-child(3) {<!– [et_pb_line_break_holder] –> grid-column: 2 / 3;<!– [et_pb_line_break_holder] –>}<!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –>/*First post content*/<!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –>.ds-grid-blog-1 .et_pb_post:first-child .ds-grid-blog-content {<!– [et_pb_line_break_holder] –> width: 60%;<!– [et_pb_line_break_holder] –> padding: 30px;<!– [et_pb_line_break_holder] –> display: -webkit-box;<!– [et_pb_line_break_holder] –> display: -ms-flexbox;<!– [et_pb_line_break_holder] –> -webkit-box-pack: justify;<!– [et_pb_line_break_holder] –> -ms-flex-pack: justify;<!– [et_pb_line_break_holder] –> justify-content: space-between;<!– [et_pb_line_break_holder] –>}<!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –>/*Position and colour for second & third posts*/<!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –>.ds-grid-blog-1 .et_pb_post:nth-child(n+2) .ds-grid-blog-content {<!– [et_pb_line_break_holder] –> background: var(–ds-title-background);<!– [et_pb_line_break_holder] –> position: absolute;<!– [et_pb_line_break_holder] –> left: 0;<!– [et_pb_line_break_holder] –> right: 0;<!– [et_pb_line_break_holder] –> bottom: 0;<!– [et_pb_line_break_holder] –> -webkit-box-align: center;<!– [et_pb_line_break_holder] –> -ms-flex-align: center;<!– [et_pb_line_break_holder] –> align-items: center;<!– [et_pb_line_break_holder] –> padding: 10px;<!– [et_pb_line_break_holder] –> text-align: center;<!– [et_pb_line_break_holder] –>}<!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –>/*Text colour for second & third posts*/<!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –>.ds-grid-blog-1 .et_pb_post:nth-child(n+2) .entry-title,<!– [et_pb_line_break_holder] –>.ds-grid-blog-1 .et_pb_post:nth-child(n+2) .post-meta,<!– [et_pb_line_break_holder] –>.ds-grid-blog-1 .et_pb_post:nth-child(n+2) .post-meta a {<!– [et_pb_line_break_holder] –> color: var(–ds-white) !important;<!– [et_pb_line_break_holder] –>}<!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –>/*Font size for second & third posts*/<!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –>.ds-grid-blog-1 .et_pb_post:nth-child(n+2) .entry-title {<!– [et_pb_line_break_holder] –> font-size: 150% !important;<!– [et_pb_line_break_holder] –>}<!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –>/*Hide excerpt for second & third posts and second grid posts*/<!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –>.ds-grid-blog-1 .et_pb_post:nth-child(n+2) .post-content,<!– [et_pb_line_break_holder] –>.ds-grid-blog-2 .et_pb_post .post-content p {<!– [et_pb_line_break_holder] –> display: none;<!– [et_pb_line_break_holder] –>}<!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –>/*Remaining posts display*/<!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –>.ds-grid-blog-2 .et_pb_post .ds-grid-blog-content {<!– [et_pb_line_break_holder] –> padding: 30px;<!– [et_pb_line_break_holder] –> display: -webkit-box;<!– [et_pb_line_break_holder] –> display: -ms-flexbox;<!– [et_pb_line_break_holder] –> display: flex;<!– [et_pb_line_break_holder] –> -webkit-box-pack: justify;<!– [et_pb_line_break_holder] –> -ms-flex-pack: justify;<!– [et_pb_line_break_holder] –> justify-content: space-between;<!– [et_pb_line_break_holder] –> height: 100%;<!– [et_pb_line_break_holder] –>}<!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –>/*Set margin for remaining posts*/<!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –>.ds-grid-blog-2 .et_pb_post .entry-title {<!– [et_pb_line_break_holder] –> margin-bottom: 30px;<!– [et_pb_line_break_holder] –>}<!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –>/*Keep read more link at bottom*/<!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –>.ds-grid-blog-2 .et_pb_post .post-content {<!– [et_pb_line_break_holder] –> margin-top: auto;<!– [et_pb_line_break_holder] –>}<!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –>/*Adjust for mobile*/<!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –>@media all and (max-width:980px) {<!– [et_pb_line_break_holder] –> .ds-grid-blog-1 .et_pb_post:first-child {<!– [et_pb_line_break_holder] –> -webkit-box-orient: vertical;<!– [et_pb_line_break_holder] –> -webkit-box-direction: normal;<!– [et_pb_line_break_holder] –> -ms-flex-direction: column;<!– [et_pb_line_break_holder] –> flex-direction: column;<!– [et_pb_line_break_holder] –> }<!– [et_pb_line_break_holder] –> .ds-grid-blog-1 .et_pb_post:first-child .ds-grid-blog-content {<!– [et_pb_line_break_holder] –> width: 100%;<!– [et_pb_line_break_holder] –> }<!– [et_pb_line_break_holder] –> .ds-grid-blog-1 .et_pb_post {<!– [et_pb_line_break_holder] –> grid-column: 1 / -1 !important;<!– [et_pb_line_break_holder] –> }<!– [et_pb_line_break_holder] –>}<!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –><!– [et_pb_line_break_holder] –>/*———————————————–*/<!– [et_pb_line_break_holder] –>/*—–End CSS Grid Blog Layout by Divi Soup—–*/<!– [et_pb_line_break_holder] –>/*———————————————–*/<!– [et_pb_line_break_holder] –></style>[/et_pb_fullwidth_code][et_pb_fullwidth_code admin_label=”JS: You can leave it here or move to Divi > Theme Options > Integration > Add to head” disabled_on=”off|off|on” _builder_version=”3.9″]<script><!– [et_pb_line_break_holder] –>//CSS Grid Blog Layout by Divi Soup<!– [et_pb_line_break_holder] –>(function ($) {<!– [et_pb_line_break_holder] –> $(document).ready(function () {<!– [et_pb_line_break_holder] –> //Wrap first grid elements in containers<!– [et_pb_line_break_holder] –> $(“.ds-grid-blog-1 .et_pb_post”).each(function () {<!– [et_pb_line_break_holder] –> $(this).find(“.entry-featured-image-url”).wrapAll(‘<div class=”ds-grid-blog-image”></div>’);<!– [et_pb_line_break_holder] –> $(this).find(“.entry-title, .post-meta, .post-content”).wrapAll(‘<div class=”ds-grid-blog-content”></div>’);<!– [et_pb_line_break_holder] –> });<!– [et_pb_line_break_holder] –> });<!– [et_pb_line_break_holder] –>})(jQuery);<!– [et_pb_line_break_holder] –>(function ($) {<!– [et_pb_line_break_holder] –> $(document).ready(function () {<!– [et_pb_line_break_holder] –> $(document).bind(‘ready ajaxComplete’, function () {<!– [et_pb_line_break_holder] –> //Wrap second grid elements in containers<!– [et_pb_line_break_holder] –> $(“.ds-grid-blog-2 .et_pb_post”).each(function () {<!– [et_pb_line_break_holder] –> $(this).find(“.entry-featured-image-url”).wrapAll(‘<div class=”ds-grid-blog-image”></div>’);<!– [et_pb_line_break_holder] –> $(this).find(“.entry-title, .post-meta, .post-content”).wrapAll(‘<div class=”ds-grid-blog-content”></div>’);<!– [et_pb_line_break_holder] –> });<!– [et_pb_line_break_holder] –> //Move elements around<!– [et_pb_line_break_holder] –> $(“.et_pb_post”).each(function () {<!– [et_pb_line_break_holder] –> $(“.post-meta”, this).insertBefore($(“.entry-title”, this));<!– [et_pb_line_break_holder] –> });<!– [et_pb_line_break_holder] –> //Add button class to read more link<!– [et_pb_line_break_holder] –> $(“.et_pb_post a.more-link”).addClass(“et_pb_button”);<!– [et_pb_line_break_holder] –> //Replace pipes and remove commas from the meta<!– [et_pb_line_break_holder] –> $(“.et_pb_post”).html(function () {<!– [et_pb_line_break_holder] –> return $(this).html().replace(/\|/g, ‘/’).replace(/,/g, ”);<!– [et_pb_line_break_holder] –> });<!– [et_pb_line_break_holder] –> });<!– [et_pb_line_break_holder] –> });<!– [et_pb_line_break_holder] –>})(jQuery);<!– [et_pb_line_break_holder] –>//End CSS Grid Blog Layout by Divi Soup<!– [et_pb_line_break_holder] –></script>[/et_pb_fullwidth_code][/et_pb_section][et_pb_section bb_built=”1″ _builder_version=”3.9″ background_color=”#f5f5f5″ prev_background_color=”#ffffff”][et_pb_row _builder_version=”3.0.90″ module_class=”ds-blog-grid-row”][et_pb_column type=”4_4″][et_pb_blog admin_label=”Blog – First 3 posts” posts_number=”3″ show_more=”on” show_author=”off” show_pagination=”off” module_class=”ds-grid-blog ds-grid-blog-1″ _builder_version=”3.0.90″ header_font=”Playfair Display|700|||||||” header_font_size=”35px” header_line_height=”1.2em” body_line_height=”2em” meta_font=”|600||on|||||” meta_text_color=”#8c8c8c” meta_font_size=”10px” meta_letter_spacing=”3px” custom_margin=”||30px|” show_content=”off” show_thumbnail=”on” show_date=”on” show_categories=”on” show_comments=”on” fullwidth=”on” use_dropshadow=”off” use_overlay=”off” background_layout=”light” pagination_font_size_tablet=”51″ pagination_line_height_tablet=”2″ border_radii_fullwidth=”on|10px|10px|10px|10px” animation_style=”fade”]
[/et_pb_blog][et_pb_blog admin_label=”Blog – Remaining posts” posts_number=”6″ show_more=”on” show_author=”off” offset_number=”3″ module_class=”ds-grid-blog ds-grid-blog-2″ _builder_version=”3.9″ header_font=”Playfair Display|700|||||||” header_font_size=”25px” header_line_height=”1.2em” body_line_height=”2em” meta_font=”|600||on|||||” meta_text_color=”#8c8c8c” meta_font_size=”10px” meta_letter_spacing=”3px”]
[/et_pb_blog][/et_pb_column][/et_pb_row][/et_pb_section]