/******************/
/* general layout */
/******************/
.canvas-wrapper{
	overflow: hidden;
}

.canvas-row{
	display: flex;
	flex-wrap: wrap; /* is it really needed? */
	min-width: 100%;	
}	
.canvas-col{
	/*
	flex-grow: 1;
	flex-basis: 0;	
	*/
	flex: 1;
}

.canvas-label{
	max-width: 160px;
}				
.canvas-value{
	flex: 1;
}

/* this is to prevent flex container to strip spaces in betweer words (text and a tag (or span) for examples) */
.canvas-row:not(:has(.canvas-row)):not(:has(.canvas-col)){ 
	display:block;
	width:100%;
}

.canvas-row img,
.canvas-wrapper img{
	display: block;
}

/* 
only add this class to the image nested in an a tag and works like a charm
control the image width with the width attr
width: 10px !important; 
control the image height with this attribute
height:100px 
*/ 
.the-img{ 
	/* prevent image extra space at the bototm */
	vertical-align: middle; 
	display: block;
	
	/* fill parent container */
	width: 100% !important;
	max-width: 100% !important;
	aspect-ratio: 1/1 !important; /* defining the aspect ratio of the image */
  	object-fit: cover; /* cover, contain, fill, scale-down, none */
}

.halign{
	justify-content: center;
}
.valign,
.vertical-align{ /* remove after some time */
	display: flex;
  	align-items: center;
}

.red-face{ /* remove after some time */
	color: red !important;
}
/******************/
/* [end]general layout */
/******************/
















/*********************************/
/* archive entry post meta style */
/*********************************/
.canvas-row.archive-post-meta{
	display:block;
	padding:inherit;
}
.canvas-row.archive-post-meta .canvas-col{
	float:left;
	border: 1px solid #f4f4f4;
	padding: 3px 10px;
	border-radius: 2px;
}
.canvas-row.archive-post-meta .canvas-col:not(:last-child){
	margin-right: 10px;
}
/*********************************/
/* [end]archive entry entries style */
/*********************************/
















/***********************/
/* archive entry style */
/***********************/
.canvas-wrapper.post-archive .canvas-row:not(:last-child){
	margin-bottom: 10px
}
/***********************/
/* [end]archive entry style */
/***********************/
















/*****************************/
/* listing single view style */
/*****************************/
.canvas-wrapper.post-single > .canvas-row{
	padding: 20px;
	border: 1px solid #f4f4f4;
	border-radius: 3px;
}	
.canvas-wrapper.post-single .canvas-row.data > .canvas-row{
	padding: 5px 10px
}
.canvas-wrapper.post-single .canvas-row.data > .canvas-row:nth-child(2n+1){
	background: #f4f4f4 !important;
}
.canvas-wrapper.post-single > .canvas-row:not(:last-child){
	margin-bottom: 10px
}
.canvas-wrapper.post-single .canvas-row.section-title{
	font-size:24px !important;
	font-weight:bold;
}	
.canvas-wrapper.post-single .canvas-label{
	border-right: 2px solid #ffffff;
	padding-right: 10px;
}
.canvas-wrapper.post-single .canvas-value{
	padding-left: 10px;
}
/*****************************/
/* [end]listing single view style */
/*****************************/
















/***********************************************/
/* categories and archive grid shortcode style */
/***********************************************/
.ads-categories-grid .canvas-row .canvas-col, /* this class should match the shortcode file class value */
.ads-archive-grid .canvas-row .canvas-col{    /* this class should match the shortcode file class value */
	border:1px solid #f0f0f0;
	padding:10px;
}
@media screen and (max-width: 920px){
.ads-categories-grid .canvas-row .canvas-col, /* this class should match the shortcode file class value */
.ads-archive-grid .canvas-row .canvas-col{    /* this class should match the shortcode file class value */
	flex: 50% !important; /* two cols per row in small resolutions */
}
}
/***********************************************/
/* [end]categories and archive grid shortcode style */
/***********************************************/





























/************************* */
/* widget lastest listings */
/************************* */
.widget.latest-listings .canvas-wrapper > .canvas-row:not(:last-child){
	margin-bottom: 10px
}
.widget.latest-listings .canvas-row .canvas-col:not(:last-child){
	margin-right: 10px
}
/************************* */
/* [end]widget lastest listings */
/************************* */





























/******************* */
/* widget categories */
/******************* */
.widget.ul-categories .canvas-wrapper > .canvas-row:not(:last-child){
	margin-bottom: 10px
}
.widget.ul-categories .canvas-row .canvas-col:not(:last-child){
	margin-right: 10px
}
.widget.ul-categories .canvas-wrapper > .canvas-row .canvas-col:first-child{
	max-width: 52px;/*fixed width*/
	/*flex: 0 1 20%;*//*percentage width*/
}
.widget.ul-categories .canvas-wrapper > .canvas-row .canvas-col{
	display: flex;
  	align-items: center;
}
/******************* */
/* [end]widget categories */
/******************* */