/*
 Theme Name:     Fluid Minds
 Theme URI:      
 Description:    Fluid Minds Theme
 Author:         Fluid Minds
 Author URI:     http://www.fluidmindsconsulting.com
 Template:       Divi
 Version:        3.0.89
*/
 
@import url("../Divi/style.css");
 
/* =Theme customization starts here
------------------------------------------------------- */
:root {
    /*home1*/
	--color1: #74ba57;    
    --color2: #4281A4;
}

/* Refer to: https://www.peeayecreative.com/how-to-change-crop-divi-image-aspect-ratios-in-the-builder/*/
/*image aspect ratio landscape 4:3*/


.pa-blog-image-4-3 .et_pb_post {
	display:block!important;
}

.pa-image-4-3 .et_pb_image_wrap {
    padding-top: 75%;
    display: block;
}

.pa-blog-image-4-3 .entry-featured-image-url img{
	object-fit: scale-down;
  }

.pa-image-4-3 .et_pb_image_wrap img {
position: absolute;
height: 100%;
width: 100%;
top: 0;
left: 0;
right: 0;
bottom: 0;
object-fit: cover;
}
  
.ec-blog .et_pb_ajax_pagination_container {
	gap: 30px;
	display: grid!important;
	grid-template-columns: repeat(3,1fr);
}
.ec-blog .et_pb_post {
	position: relative;
	display: flex;
	flex-wrap: wrap;
	margin-bottom: 0px;
	transition: all 0.5s ease!important;
	background: #FFFFFF;
	box-shadow: 0px 0px 14px -4px rgba(0, 0, 0, 0.25);
	border-radius: 10px;
	overflow:hidden;
}
.ec-blog .entry-featured-image-url {
	margin-bottom: 22px;
}
.ec-blog img {
	order: 1;
	width: 100%;
	height: 100%;
	max-width: 360px;
	min-height: 250px;
	margin-bottom: 0;
}
.ec-blog p.post-meta {
	order: 2;
	width:100%;
	/*padding: 0 0 0 45px!important;*/
	margin: 0px 0 15px;
	/*font-weight: 500;
	font-size: 16px;
	line-height: 26px;*/
	/*color: #9B9B9B;*/
	position: relative;
}
.ec-blog h4.entry-title {
	order: 3;
	width: 100%;
	font-weight: 600;
	font-size: 17px;
	line-height: 34px;
	color: var(--black);
	padding: 0 22px;
	margin-bottom: 20px;
}
.ec-blog .post-content {
	order: 4;  
	width: 100%;
	padding: 0 22px 22px;
}
.ec-blog .post-content a {
	font-weight: 600;
	font-size: 12px;
	line-height: 22px;
	color: var(--color2);
	position: relative;
	display: flex;
	align-items: center;
	text-transform: capitalize;
}
.ec-blog .post-content a:before {
	content: "\24";
	font-family: 'etModules';
	position: absolute;
	left: 70px;
	top: 0px;
	font-size: 15px;
	line-height: 25px;
	color: var(--color1);
}
.ec-blog .author a:before {
	content: '\e08a';
	position: absolute;
	left: 20px!important;
	top: 0;
	font-family: 'ETMODULES';
	color: var(--color1)!important;
	font-size: 18px;
}
.ec-blog .et_pb_post span.published,
.et_pb_post_title span.published{
	position: relative;
	padding-left: 35px;
}
.ec-blog .et_pb_post span.published:before{
	content: '\e023';
	position: absolute;
	left: 12px;
	font-family: ETModules;
	color: var(--color1)!important;
}

.et_pb_post_title span.published:before {
	content: '\e023';
	position: absolute;
	left: 12px;
	font-family: ETModules;
	color: var(--color1)!important;
}

.ec-blog .et_pb_post>a:before{
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	right: 0;
	left: 0;
	background: rgba(0, 0, 0, 0.5);
	transition: all 0.5s ease!important;
	opacity: 0;	
	border-radius: 10px 10px 0px 0px;
}
.ec-blog .et_pb_post>a:after{
	content: "\4c";
	font-family: ETModules;
	position: absolute;
	top: 45%;
	right: 0;
	left: 0;
	text-align: center;
	color:var(--white);
	font-size: 60px;
	transition: all 0.5s ease!important;
	opacity: 0;
}
.ec-blog .et_pb_post:hover a:after,
.ec-blog .et_pb_post:hover a:before {
	opacity: 1;
}
@media(max-width:980px){
	.ec-blog .et_pb_ajax_pagination_container {
		grid-template-columns: repeat(1,1fr);
	}
	.ec-blog .et_pb_post {		
		display: flex!important;
		width: 100%!important;
		max-width: 555px;
		margin: 0 auto 0px!important;
	}
	.ec-blog  .et_pb_post .entry-featured-image-url {
		width: 100%!important;
	}
	.ec-blog h4.entry-title {
		font-size: 22px;
		line-height: 32px;
	}	
}
@media(max-width:767px){
	.ec-blog h4.entry-title {
		font-size: 20px;
		line-height: 30px;
	}	
}


/** Blog Module as a list **/
/***  https://www.peeayecreative.com/how-to-change-the-divi-blog-module-into-a-list-layout/                 **/
/*add media query so changes only affect tablet and desktop*/
@media (min-width: 767px) {
    /*set the image width*/
    .pa-blog-list .entry-featured-image-url  {
    width: 30%;
    float: left;
    margin-bottom: 0!important;
    }
    /*set the details width*/
    .pa-blog-list .entry-title,
    .pa-blog-list .post-meta,
    .pa-blog-list .post-content {
    width: 70%;
    float: left;
    padding-left: 30px;
    }
}

.pa-blog-list .et_pb_post {
    margin-bottom: 30px;
    box-shadow: 0px 2px 80px 0px rgba(160,190,212,0.22);  
    border-radius: 6px;
    padding: 60px;
  }

@media (max-width: 766px) {

    /*set the details width*/
    .pa-blog-list .entry-title,
    .pa-blog-list .post-meta,
    .pa-blog-list .post-content {
    padding-left: 10px;
    padding-right: 10px;
    }
    }