/**
 * All of the CSS for your public-facing functionality should be
 * included in this file.
 */

/** Styles for our Divi blog module in includes/builder/module/class-jki-builder-module-filterable-blog.php **/
/** Blog items grid **/
#et-boc .et-l .jki_blog_items_wrapper {
	margin-top: 40px;
}
.jki_blog_items_wrapper .jki_blog_items {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	grid-template-rows: repeat(3, auto auto auto auto);
	column-gap: 18px;
	row-gap: 18px;
}
@media (max-width: 850px) {
	.jki_blog_items_wrapper .jki_blog_items {
		grid-template-columns: repeat(2, 1fr);
	}
}
@media (max-width: 500px) {
	.jki_blog_items_wrapper .jki_blog_items {
		grid-template-columns: repeat(1, 1fr);
	}
}
.et-db #et-boc .et-l .et_pb_gutters3 .jki_blog_items_wrapper .jki_blog_items .jki_blog_item {
	width: 100%;
	margin-right: 0;
	margin-left: 0;
	margin-bottom: 0;
}

.et-db #et-boc .et-l .et_pb_filterable_portfolio.et_pb_filterable_portfolio_grid .jki_blog_items .jki_blog_item {
	border: 1px solid #F2F2F2;
	border-radius: 6px;
	overflow: hidden;

	display: grid;
	grid-template-rows: subgrid;
	grid-row: span 4;
	grid-row-gap: 0;
}
#et-boc .et-l .et_pb_filterable_portfolio_grid .jki_blog_items .jki_blog_item .entry-title, 
#et-boc .et-l .et_pb_filterable_portfolio_grid .jki_blog_items .jki_blog_item .dp-post-excerpt,
.et-db #et-boc .et-l .et_pb_module .jki_blog_items .jki_blog_item .post-meta {
	margin-left: 15px;
	margin-right: 15px;
}

.et-db #et-boc .et-l .et_pb_module .jki_blog_items .jki_blog_item {
	position: relative;
}
.et-db #et-boc .et-l .et_pb_module .jki_blog_items .jki_blog_item .post-meta {
	display: flex;
	justify-content: space-between;
	align-items: end;
	position: static;
	margin-bottom: 20px;
}
#et-boc .jki_blog_items .jki_blog_item .ppp-blog-post-date {
	position: absolute;
	top: 20px;
	right: 0;
	background-color: #34ABCB;
	color: white;
	padding: 8px 10px;
}
#et-boc .et-l .jki_blog_items .jki_blog_item .ppp-blog-post-estimated-reading-time {
	text-wrap: nowrap;
	margin-left: 5px;
	font-size: 14px;
}
#et-boc .et-l .jki_blog_items .jki_blog_item .ppp-blog-post-categories {
	word-break: break-word;
    overflow-wrap: break-word;
    text-wrap-style: balance;
	font-size: 14px;
}
@media (max-width: 768px) {
	#et-boc .et-l .jki_blog_items .jki_blog_item .ppp-blog-post-estimated-reading-time,
	#et-boc .et-l .jki_blog_items .jki_blog_item .ppp-blog-post-categories {
		font-size: 12px;
	}
}
#et-boc .et-l .jki_blog_items .jki_blog_item .ppp-blog-post-categories, 
.et-db #et-boc .et-l .et_pb_bg_layout_light .jki_blog_items .jki_blog_item .ppp-blog-post-categories a {
	color: #453848;
	font-weight: bold;
	line-height: 15px;
}
#et-boc .et-l .et_pb_filterable_portfolio_grid .jki_blog_items .jki_blog_item .entry-title {
	margin-bottom: 10px;
}
#et-boc .et-l .jki_blog_items .jki_blog_item .entry-title, 
.et-db #et-boc .et-l .et_pb_module .jki_blog_items .jki_blog_item .entry-title a {
	font-weight: bold;
	line-height: 25px;
	font-size: 17px;
}
#et-boc .et-l .jki_blog_items .jki_blog_item .dp-post-excerpt {
	font-size: 14px;
	margin-bottom: 10px;
}
@media (max-width: 768px) {
	#et-boc .et-l .jki_blog_items .jki_blog_item .dp-post-excerpt {
		margin-bottom: 20px;
	}
}
.jki_blog_items .jki_blog_item .et_portfolio_image {
	height: 220px;
	overflow: hidden;
}
@media (max-width: 768px) {
	.jki_blog_items .jki_blog_item .et_portfolio_image {
		height: 200px;
	}
}
.jki_blog_items .jki_blog_item .et_portfolio_image img {
	position: absolute;
	top: 50%;
    transform: translateY(-50%);
}

/** The filters **/
.et-db #et-boc .et-l .et_pb_jkifilterable_blog .et_pb_filterable_portfolio {
	display: flex !important;
	flex-wrap: wrap;
}
.et_pb_jkifilterable_blog .et_pb_portfolio_filters {
	display: inline-flex;
	align-items: center;
}
@media (max-width: 768px) {
	.et_pb_jkifilterable_blog .et_pb_portfolio_filters {
		width: 100%;
		justify-content: center;
	}
	.et-db #et-boc .et-l .et_pb_column .et_pb_jkifilterable_blog .et_pb_filterable_portfolio .et_pb_portfolio_filters ul,
	.et-db #et-boc .et-l .et_pb_column .et_pb_jkifilterable_blog .et_pb_filterable_portfolio .et_pb_portfolio_filters li {
		width: auto;
	}
}
.et-db #et-boc .et-l .et_pb_jkifilterable_blog .et_pb_filterable_portfolio .et_pb_portfolio_filters {
	margin-bottom: 0;
}
@media (min-width: 992px) and (max-width: 1275px) {
	.et-db #et-boc .et-l .et_pb_jkifilterable_blog .et_pb_filterable_portfolio .et_pb_portfolio_filters {
		margin-bottom: 20px;
	}
}
.et-db #et-boc .et-l .et_pb_jkifilterable_blog .et_pb_portfolio_filters > span {
	font-size: 12px;
	font-weight: 600;
	align-self: center;
	margin-right: 10px;
}
.et_pb_jkifilterable_blog .et_pb_portfolio_filters > ul {
	display: inline-block;
}
.et-db #et-boc .et-l .et_pb_jkifilterable_blog .et_pb_portfolio_filters > ul .ppp_filterable_link,
.et-db #et-boc .et-l .et_pb_jkifilterable_blog .et_pb_portfolio_filters > ul .ppp_filterable_link_all {
	border: none;
	color: #333333;
	background-color: #F3F3F3;
	border-radius: 15px !important;
	padding: 8px 12px;
	margin-right: 7px;
	font-weight: normal;
}
.et-db #et-boc .et-l .et_pb_jkifilterable_blog .et_pb_filterable_portfolio .et_pb_portfolio_filters li {
	font-size: 12px;
}
.et-db #et-boc .et-l .et_pb_jkifilterable_blog .et_pb_portfolio_filters > ul .dropdown.show .ppp_filterable_link_all {
	border-bottom-left-radius: 0 !important;
	border-bottom-right-radius: 0 !important;
}
.et-db #et-boc .et-l .et_pb_jkifilterable_blog .et_pb_portfolio_filters > ul .ppp_filterable_link_all {
	margin-right: 0;
}
.et-db #et-boc .et-l .et_pb_jkifilterable_blog .et_pb_portfolio_filters > ul .ppp_filterable_link_all .icon-filter {
	display: inline-block;
	padding: 0 8px 0 3px;
}
.et-db #et-boc .et-l .et_pb_jkifilterable_blog .et_pb_portfolio_filters > ul .ppp_filterable_link_all .icon-filter:before {
	display: block;
	content: '';
	height: 10px;
	width: 10px;
	background-image: url('../images/icons/filter.svg');
	background-repeat: no-repeat;
	background-position: 50%;
	background-size: 100%;
}
.et-db #et-boc .et-l .et_pb_jkifilterable_blog .et_pb_portfolio_filters > ul .ppp_filterable_link_all .fa:last-child {
	padding: 0 3px 0 8px;
}
.et-db #et-boc .et-l .et_pb_jkifilterable_blog .et_pb_portfolio_filters > ul .ppp_filterable_link_all.active .fa {
	color: #333333;
}
.et-db #et-boc .et-l .et_pb_jkifilterable_blog .et_pb_portfolio_filters .dropdown-menu {
	min-width: max(9rem, 100%);
}
.et-db #et-boc .et-l .et_pb_jkifilterable_blog .et_pb_portfolio_filters .dropdown-menu .jki_blog_filter .ppp_filterable_link {
	border: 1px solid white;
	border-bottom-width: 0;
	border-left-width: 0;
	border-right-width: 0;
	font-size: 12px;
}
.et-db #et-boc .et-l .et_pb_jkifilterable_blog .et_pb_portfolio_filters .dropdown-menu .ppp_filterable_link {
	border-radius: 0 !important;
	margin-right: 0;
}
.et-db #et-boc .et-l .et_pb_jkifilterable_blog .et_pb_portfolio_filters .dropdown-menu .jki_blog_filter:last-child .ppp_filterable_link {
	border-bottom-left-radius: 15px !important;
	border-bottom-right-radius: 15px !important;
}
.et-db #et-boc .et-l .et_pb_jkifilterable_blog .et_pb_portfolio_filters .dropdown-menu[x-placement="top-start"] .jki_blog_filter:last-child .ppp_filterable_link {
	border-bottom-left-radius: 0 !important;
	border-bottom-right-radius: 0 !important;
	border-bottom-width: 1px;
}
.et-db #et-boc .et-l .et_pb_jkifilterable_blog .et_pb_portfolio_filters .dropdown-menu[x-placement="top-start"] .jki_blog_filter:first-child .ppp_filterable_link {
	border-top-left-radius: 15px !important;
	border-top-right-radius: 15px !important;
	border-top-width: 0;
}
.et-db #et-boc .et-l .et_pb_jkifilterable_blog .et_pb_portfolio_filters > ul .dropdown.show .ppp_filterable_link_all:has(+ .dropdown-menu[x-placement="top-start"]) {
	border-bottom-left-radius: 15px !important;
	border-bottom-right-radius: 15px !important;
	border-top-left-radius: 0 !important;
	border-top-right-radius: 0 !important;
}
.et-db #et-boc .et-l .et_pb_jkifilterable_blog .et_pb_portfolio_filters > ul .dropdown.show .ppp_filterable_link_all .fa-chevron-down:before {
	transform: rotate(180deg);
	display: inline-block;
}
.et-db #et-boc .et-l .et_pb_jkifilterable_blog .et_pb_portfolio_filters > ul .dropdown.show .ppp_filterable_link_all:has(+ .dropdown-menu[x-placement="top-start"]) .fa-chevron-down:before {
	transform: rotate(0deg);
}

/** The pagination **/
.et-db #et-boc .et-l .et_pb_jkifilterable_blog .et_pb_filterable_portfolio .et_pb_portofolio_pagination {
	display: inline-block;
    width: auto;
	margin-right: 0;
    margin-left: auto;
	border-top: none;
}
.et-db #et-boc .et-l .et_pb_jkifilterable_blog .et_pb_filterable_portfolio .et_pb_portofolio_pagination .page {
	padding: 0;
	margin: 0 5px
}
.et-db #et-boc .et-l .et_pb_jkifilterable_blog .et_pb_filterable_portfolio .et_pb_portofolio_pagination .next,
.et-db #et-boc .et-l .et_pb_jkifilterable_blog .et_pb_filterable_portfolio .et_pb_portofolio_pagination .prev {
	padding: 0;
}
.et-db #et-boc .et-l .et_pb_jkifilterable_blog .et_pb_filterable_portfolio .et_pb_portofolio_pagination .next a,
.et-db #et-boc .et-l .et_pb_jkifilterable_blog .et_pb_filterable_portfolio .et_pb_portofolio_pagination .prev a {
	font-size: 12px;
}
.et-db #et-boc .et-l .et_pb_jkifilterable_blog .et_pb_filterable_portfolio .et_pb_portofolio_pagination .prev {
	margin-right: 10px;
}
.et-db #et-boc .et-l .et_pb_jkifilterable_blog .et_pb_filterable_portfolio .et_pb_portofolio_pagination .next {
	margin-left: 10px;
}
.et-db #et-boc .et-l .et_pb_jkifilterable_blog .et_pb_filterable_portfolio .et_pb_portofolio_pagination .page a {
	border-radius: 50%;
    padding: 5px 10px;
    border: 1px solid #dddddd !important;
	font-size: 12px;
	min-width: 31px;
    display: inline-flex;
    justify-content: center;
}
/** If wp_pagenavi is enabled **/
.et-db #et-boc .et-l .et_pb_jkifilterable_blog .et_pb_filterable_portfolio .wp-pagenavi {
	border: none;
	padding-top: 0;
	margin-bottom: 0;
	flex-grow: 1;
	align-self: center;
}
@media (max-width: 823px) {
	.et-db #et-boc .et-l .et_pb_jkifilterable_blog .et_pb_filterable_portfolio .wp-pagenavi {
		margin-top: 20px;
	}
}
@media (max-width: 445px) {
	.et-db #et-boc .et-l .et_pb_jkifilterable_blog .et_pb_filterable_portfolio .wp-pagenavi {
		text-align: center;
	}
	.et-db #et-boc .et-l .et_pb_jkifilterable_blog .et_pb_filterable_portfolio .wp-pagenavi .pages {
		flex-grow: 1;
		display: block;
	}
}
.et-db #et-boc .et-l .et_pb_jkifilterable_blog .et_pb_filterable_portfolio .wp-pagenavi a,
.et-db #et-boc .et-l .et_pb_jkifilterable_blog .et_pb_filterable_portfolio .wp-pagenavi span {
	font-size: 12px !important;
}
.et-db #et-boc .et-l .et_pb_jkifilterable_blog .et_pb_filterable_portfolio .wp-pagenavi a,
.et-db #et-boc .et-l .et_pb_jkifilterable_blog .et_pb_filterable_portfolio .wp-pagenavi span.current {
	border-radius: 50%;
    padding: 5px 10px;
    border: 1px solid #dddddd !important;
	min-width: 31px;
    display: inline-flex;
    justify-content: center;
	line-height: initial;
}
@media (max-width: 333px) {
	.et-db #et-boc .et-l .et_pb_jkifilterable_blog .et_pb_filterable_portfolio .wp-pagenavi a {
		margin-left: 3px;
		margin-right: 3px;
	}
}
/*.et-db #et-boc .et-l .et_pb_jkifilterable_blog .et_pb_filterable_portfolio .wp-pagenavi .pages,*/
.et-db #et-boc .et-l .et_pb_jkifilterable_blog .et_pb_filterable_portfolio .wp-pagenavi .nextpostslink,
.et-db #et-boc .et-l .et_pb_jkifilterable_blog .et_pb_filterable_portfolio .wp-pagenavi .previouspostslink,
.et-db #et-boc .et-l .et_pb_jkifilterable_blog .et_pb_filterable_portfolio .wp-pagenavi .extend {
	display: none;
}
.et-db #et-boc .et-l .et_pb_jkifilterable_blog .et_pb_filterable_portfolio .wp-pagenavi a.first,
.et-db #et-boc .et-l .et_pb_jkifilterable_blog .et_pb_filterable_portfolio .wp-pagenavi a.last {
	border: none !important;
	margin: 0;
}
/** Bottom pagination **/
.et-db #et-boc .et-l .et_pb_jkifilterable_blog .et_pb_filterable_portfolio .wp-pagenavi:last-child {
	margin-top: 40px;
	padding-top: 20px;
	border-top: 1px solid #DDDDDD;
}