/*
Theme Name: Enfold Child
Description: A <a href='http://codex.wordpress.org/Child_Themes'>Child Theme</a> for the Enfold Wordpress Theme. If you plan to do a lot of file modifications we recommend to use this Theme instead of the original Theme. Updating will be much easier then.
Version: 1.0
Author: Kriesi
Author URI: http://www.kriesi.at
Template: enfold
*/



/*Add your own styles here:*/
.logo img, .logo svg {
  padding: 5px !important;
	
}
.cl-layout__item {
	margin-top:0 !important;
}
.cl-layout__item .cl-template {
	padding:0;
}
.cl-layout-container {
	overflow:visible !important;
}
.cl-template .cl-element.cl-element-section .cl-element {
	width:20%;
	float:left;
	padding:8px;
}
.cl-template .cl-element.cl-element-section .cl-element.titel {
	/*width:38%;*/
	width:30%;
}
#top .cl-template .cl-element.cl-element-section h3.cl-element.titel {
	font-weight:normal !important;
}
.cl-template .cl-element.cl-element-section .cl-element.prijs {
	/*width:14%;*/
	/*width:calc(21% - 16px);*/
	width:18%;
	text-align:right;
}
.cl-template .cl-element.cl-element-section .cl-element.eenheid {
	/*width:14%;*/
	/*width: calc(15% - 16px);*/
	width:12%;
	padding-left:0;
}
.cl-template .cl-element.cl-element-section .cl-element.afmeting {
	/*width:14%;*/
	/*width:calc(24% - 16px);*/
	width:20%;
}
.cl-element.cl-element-title {
	font-weight:normal;
}
.cl-layout__item:nth-child(odd) .cl-template .cl-element.cl-element-section {
	background-color:#dcddde;
}
.cl-layout__item:nth-child(even) .cl-template .cl-element.cl-element-section {
	background-color:#f9f9f9;
}
.cl-layout__item:first-of-type .cl-template .cl-element.titel:before {
	content:"Kwaliteit";
}
.cl-layout__item:first-of-type .cl-template .cl-element.afmeting:before {
	content:"Afmeting";
}
.cl-layout__item:first-of-type .cl-template .cl-element.prijs:before {
	content:"Prijs per eenheid";
	text-align:center;
}
.cl-layout__item:first-of-type .cl-template .cl-element.eenheid:before {
	content:"\00a0 ";
	/*width:0;
	padding:0;*/
}
.cl-layout__item:first-of-type .cl-template .cl-element.prijs_m2:before {
	content:"Prijs per m2";
}
.cl-template .cl-element.titel:before,
.cl-template .cl-element.afmeting:before,
.cl-template .cl-element.prijs:before,
.cl-template .cl-element.eenheid:before,
.cl-template .cl-element.prijs_m2:before {
	position:absolute;
	bottom:100%;
	left:0;
	width:calc(100% - 16px);
	background-color:#000000;
	color:#ffffff;
	padding:8px;	
	z-index:0;
	text-transform:none;
	font-weight:bold;
	font-size:13px !important;
}
.cl-template .cl-element.prijs:before {
	width:calc(150% - 16px);
	z-index:1;
}
.cl-template .cl-element.eenheid:before{
	width:calc(100% - 16px);
}
.cl-layout-container .cl-layout.prod_layout {
	padding-top:50px;
}

.searchandfilter ul li ul {
	display:flex;
	flex-wrap: wrap;
}
.searchandfilter ul li ul li{
    width:calc(50% - 10px);
	margin:0px 10px 0px 0px;
	list-style: none;
}
ul li.sf-field-taxonomy-product_cat li.sf-item-34 {order:1;}
ul li.sf-field-taxonomy-product_cat li.sf-item-47 {order:2;}
ul li.sf-field-taxonomy-product_cat li.sf-item-32 {order:3;}
ul li.sf-field-taxonomy-product_cat li.sf-item-118 {order:4;}
ul li.sf-field-taxonomy-product_cat li.sf-item-30 {order:5;}
ul li.sf-field-taxonomy-product_cat li.sf-item-131 {order:6;}
ul li.sf-field-taxonomy-product_cat li.sf-item-40 {order:7;}



@media only screen and (max-width: 599px) {
	.searchandfilter ul li ul li {
		width:100%;
	    padding: 0px 0;
		margin:0px 0px 5px 0px;
	}
	#top .content,
	#top .sidebar {
	  padding-bottom: 0px;
	}
}
.searchandfilter ul ul li label {
	width:100%;
	text-align:center;
	cursor: pointer;

}
#search-filter-form-258 input[type="radio"],
#search-filter-form-832 input[type="radio"] {
	opacity: 0;
	position: fixed;
	width: 0;
}
.searchandfilter h4 {
	font-size: 32px;
}

#search-filter-form-258 label,
#search-filter-form-832 label {
    display: inline-block;
    background-color: #000000;
    padding: 10px 20px;
    font-family: sans-serif, Arial;
    font-size: 16px;
    border: 2px solid #FFFFFF;
    border-radius: 4px;
	color:#FFFFFF;
}
#top .searchandfilter span.sf-count {
	color:#ffffff;
}

#search-filter-form-258 label:hover,
#search-filter-form-832 label:hover {
	background-color: #CD0039;
}

#search-filter-form-258 input[type="radio"]:focus + label,
#search-filter-form-832 input[type="radio"]:focus + label {
	border: 2px dashed #CD0039;
}

#search-filter-form-258 input[type="radio"]:checked + label,
#search-filter-form-832 input[type="radio"]:checked + label {
	background-color: #CD0039;
	border-color: #CD0039;
}
#cat-image {
    height: 1px;
    padding-bottom: 75%;
    overflow: hidden;
}
.cat-img-hidden {
	display: none;
}
.product-list .row {
	display: block;
	width: 100%;
	font-size:13px !important;
	margin-bottom: 0px;
	line-height: 100%;
}
.product-list .row::after{
	display: block;
	clear: both;
	content:" ";
}
.product-list .row.header {
	background-color:#000000;
	color:#ffffff;
	font-weight: bold;
}
.product-list .row.item {
	background-color:#f9f9f9;
	color:#000000;
}
.product-list .row.item:nth-child(2n+1) {
	background-color:#dcddde;
}
.product-list .row > div {
	display: block;
	float: left;
	width:50%;
	padding:9px;
}
.product-list .row > div.titel {
	font-weight: bold;
}
.product-list .row > div.afmeting {
	width:14%;
	text-align: center;
}
.product-list .row > div.prijs {
	width:19%;
	text-align: right;
}
.product-list .row > div.prijs_m2 {
	width:17%;
	text-align: center;
}

@media only screen and (min-width: 824px) {
	#cat-image {
		display: none;
	}
}
@media only screen and (max-width: 599px) {
.product-list .row > div {
	width:30%;
}
.product-list .row > div.afmeting {
	width:20%;
}
.product-list .row > div.prijs {
	width:30%;
}
.product-list .row > div.prijs_m2 {
	width:20%;
}
}

@media only screen and (min-width: 600px) {
	.cl-template .cl-element.titel {
		width:50% !important;
	}
	.cl-template .cl-element.afmeting {
		width:15% !important;
	}
	.cl-template .cl-element.prijs {
		width:12% !important;
	}
	.cl-template .cl-element.eenheid {
		width:10% !important;
	}
	.cl-template .cl-element.prijs_m2 {
		width:13% !important;
	}
}
@media only screen and (max-width: 767px) {
	.responsive #top #wrap_all #resultaten .container {
		width:unset;
		max-width:unset;
	}
	/*.cl-template .cl-element:before {
		height:30px;
	}*/
}
.cl-template .cl-element:before {
		height:30px;
}
.filter-titel {
	text-align:center;
}
.searchandfilter .sf-item-0 {
	display:none;
}



