Positioning Title, meta elements and featured image in different ways (Divi Theme)

Please note that this code works for Blog Archive page.  It is not for single blog post or blog module.

You can download/grab the code free here.  I have 2 more here, Please support and download.

1/ The first code is given below.  You can paste it in your style.css or child theme or in theme options.

/*****************************
Blog Style 1
******************************/
body:not(.single) #content-area .et_pb_post {
	position: relative;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-box-orient: vertical;
	-moz-box-orient: vertical;
	-webkit-flex-direction: column;
	-ms-flex-direction: column;
	flex-direction: column;
}
body:not(.single) #content-area .et_pb_post .entry-featured-image-url {
 -webkit-box-ordinal-group: -1;
	-moz-box-ordinal-group: -1;
	-ms-flex-order: -1;
	-webkit-order: 1;
	order: -1;
}
body:not(.single) #content-area .et_pb_post .entry-title {
	-webkit-box-ordinal-group: -3;
	-moz-box-ordinal-group: -3;
	-ms-flex-order: -3;
	-webkit-order: -3;
	order: -3;
}
body:not(.single) #content-area .et_pb_post .post-meta {
	margin:0;
	-webkit-box-ordinal-group: -2;
	-moz-box-ordinal-group: -2;
	-ms-flex-order: 2;
	-webkit-order: -2;
	order: -2;
}

Using the above code, you can achieve the following effect.