/*
Theme Name: Melkert Lederwaren
Theme URL: https://smeckdesigns.com
Author: Smeckdesigns.com
Author URL: https://smeckdesigns.com

*/


/* HTML5 Reset
---------------------------------------------------------------------------- */

/* normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css
---------------------------------------------------------------------------- */
/* stylelint-disable */
html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}[hidden],template{display:none}
.genesis-skip-link {display:none}
/* stylelint-enable */



/*basic*/

html {
font-size: 62.5%;
	scroll-behavior: smooth;
}

a, div, span, button, input, p, article, tr, td, section, h1, h2, h3, h4, h5, img, :after, :before, li {transition:0.3s ease all !important;position:relative;}

body {
	margin:0;
	font-size: 18px;
	font-size: 1.8rem;
	overflow-x:hidden;
	position:relative;
}

:root {
	--zwart: #1E1E1E;
  	--wit: #ffffff;
	--bruin: #6E4A03;
}


::selection {background-color:var(--zwart);color:white}
h1, h2 {    
	font-size: 4rem;
    line-height: 50px;
	font-weight:800;
	margin-top:0;
	margin-bottom:1rem;
	width:100%;
}
h3{font-size:3.6rem;width:100%;margin-bottom:1rem;}

a {text-decoration:none;cursor:pointer;color:var(--bruin)}
a:hover {color:var(--bruin)}

body {font-family:'Open Sans', sans-serif;color:var(--zwart)}
.site-inner {max-width:100%;overflow: hidden;}

p {margin:0 0 1.2rem;line-height:1.75}
ul {padding:0;margin-left:20px;width:100%}
li {line-height:2;}


@keyframes fadein {

	from {
		opacity: 0;
	}

	to {
		opacity: 1;
	}

}

/* Site Container
--------------------------------------------- */

.site-container {
	animation: fadein 1s;
	word-wrap: break-word;
}



/* Site Inner
--------------------------------------------- */

.site-inner {
	clear: both;
	margin: 100px auto 0;
	padding: 0px;
    width: 100%;
    max-width: 1280px;
}

.wrapper {
	width:calc(100% - 50px);
	max-width:1280px;
	padding:0 25px;
	margin: 0 auto;
}

.elementor {margin-top: 100px;}

/* Site Header
---------------------------------------------------------------------------- */

.header {
    width: 100%;
    height: 100px;
    display: flex;
    flex-wrap: wrap;
	background: #ffffffcc;
    box-shadow: 0 0px 15px #33333333;
    justify-content: space-between;
    position: fixed;
    top: 0;
    left: 0;
	z-index:9;
}
.admin-bar .header{top:32px}
.header-wrap {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    height: 75px;
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
	align-items: center;
}
.hidden {transform: translateY(-100%);   }

.header-top {
    width: 100%;
	height: 20px;
    background: #3C424Ffe;
	padding:5px 0;
    color: white;
}
.header-top-wrap {
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    text-align: right;
	font-size:12px
}
.header-top a {
    color: white;
    padding: 0 15px;
}

.custom-logo {
    max-width: 120px !important;
    height: auto !important;
}

.woocommerce-header a {
    color: var(--zwart);
    padding: 0 5px;
    font-size: 2rem;
}
.woocommerce-header a:hover{color:var(--bruin)}
span.cartaantal {
    position: absolute;
    top: -10px;
    font-size: 1.2rem;
    background: white;
    border: 1px solid var(--zwart);
    border-radius: 50px;
    width: 14px;
    height: 14px;
    text-align: center;
    padding: 2px;
    right: -5px;
}

/* Title Area
--------------------------------------------- */



/* Homepage ------------------------------------------------------------------
----------------------------------------------------------------------------------------------------------------------------------- */


/* FOOTER ------------------------------------------------------------------
----------------------------------------------------------------------------------------------------------------------------------- */
footer {
    width: 100vw;
    display: flex;
    background: var(--zwart);
    color: white;
	padding:25px 0;
}
footer h1, footer h2, footer h3, footer a, footer h2.widgettitle {color:white;margin:0}

footer .wrapper {
    display: flex;
    flex-wrap: wrap;
}
li#text-3 {width: 25%;}
li#nav_menu-2 {width: 50%;}
.widget, .widget_nav_menu .menu-item {list-style: none;}
ul#menu-snel-naar {margin: 0;}

/* WOOCOMMERCE ------------------------------------------------------------------
----------------------------------------------------------------------------------------------------------------------------------- */
header.woocommerce-products-header {display: none;}
.woocommerce .woocommerce-info {border-color:var(--bruin)}
.woocommerce .woocommerce-info::before {color:var(--bruin)}
button.woocommerce-Button.button {
    color: white;
    background: var(--bruin);
    border-radius: 0;
    border: 2px solid var(--bruin);
    box-shadow: none;
	margin-top: 15px;
}
button.woocommerce-Button.button:hover {
    color: var(--bruin);
    background: white;
    box-shadow: 5px 5px 15px #33333322;
}

.omschrijving {
    background: var(--zwart);
    color: white;
    text-align: center;
    margin-top: 100px;
	padding:50px 25px;
}
.woocommerce-wrapper {
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
}
.sidebar {
    float: left;
    width: 200px;
	overflow:hidden;
	max-height:0;
}
.sidebar.active {max-height:750px}
.filter-tonen.active i {transform: rotate(180deg);}
.producten-overzicht {
    float: right;
    width: calc(100% - 250px);
}
.widget.woocommerce {list-style: none;}
h2.widgettitle {
    font-size: 2rem;
}
ul.product-categories {
    margin: 0;
    padding: 0 0 0 15px;
    list-style: none;
    line-height: 1.5;
}
ul.products.columns-4:before, ul.products.columns-6:before {
    display: none;
}
ul.products.columns-4 {
    display: grid;
    grid-gap: 25px;
    grid-template-columns: repeat(4, 1fr);
}
ul.products.columns-6 {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    grid-gap: 25px;
}
.woocommerce ul.products li.product, .woocommerce-page ul.products li.product {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 0 25px;
    background: white;
    box-shadow: none;
	text-align:center;
}
.woocommerce ul.products li.product:hover, .woocommerce-page ul.products li.product:hover {box-shadow:5px 5px 15px #33333322}

li.product h2, li.product span.price {
    padding: 0 15px !important;
    text-align: center;
	max-width: calc(100% - 30px);
}
h2.woocommerce-loop-product__title {
    color: var(--zwart);
    font-weight: 500;
	line-height: 1.2;
    height: 45px;
}


/* ====== Product page ============ */

.single-product #primary {
    margin-top: 100px;
}

.product {
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
}

.woocommerce div.product .product_title {font-size:4rem;}

.product-usp {padding: 25px 0;}
.product-usp ul {
    list-style: none;
    margin: 0;
    padding: 0;
}
.product-usp li {line-height:1.5}

.variations select {
    padding: 8px;
	background:white !important;
    border: 1px solid var(--zwart);
}
.variations th.label {text-align: left;}
.woocommerce .quantity .qty {
    padding: 8px 0;
    border: 1px solid var(--zwart);
    box-shadow: none;
    font-weight: 600;
}
button.single_add_to_cart_button {background: var(--bruin) !important;margin-left: 30px !important;}

ul.tabs.wc-tabs { 
	border-bottom: 1px solid var(--zwart);
	padding:0 !important;
}
li.description_tab {
    padding: 0 15px !important;
    margin: 0 !important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li {
    background: transparent !important;
    border: none;
}
li#tab-title-description {
    border-right: 1px solid var(--zwart);
    border-radius: 0 !important;
}
.description_tab a, .additional_information_tab a {
    font-size: 3rem;
    color: #B8B8B8 !important;
    padding: 0 !important;
}
.description_tab.active a, .additional_information_tab.active a {color:var(--zwart) !important}
.woocommerce-Tabs-panel h2:first-child {display: none;}

section.related.products h2 {
    font-size: 2.4rem;
    text-align: center;
    font-weight: 700;
    line-height: 1.2;
    height: 45px;
}
section.related.products {padding:50px 25px;}
section.related.products:before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: -50vw;
    width: 150vw;
    background: #F7F7F5;
    height: 100%;
}
.related .columns-6 li.product {padding-bottom: 0 !important;}
.woocommerce ul.products.columns-6 li.product, .woocommerce-page ul.products.columns-6 li.product {width:100%; !important}

/* Account
 * --------------------------------------------- */

.woocommerce-account {background: var(--zwart);}
.woocommerce-account .woocommerce {background-color:white}
nav.woocommerce-MyAccount-navigation ul {list-style: none;}
li.woocommerce-MyAccount-navigation-link {
    width: 80%;
    margin: 5px 0;
    display: block;
    position: relative;
    font-weight: 600;
}
li.woocommerce-MyAccount-navigation-link a {
	background: var(--bruin);
    color: white;
    width: 100%;
    display: block;
    padding: 5px 15px;
	border:2px solid var(--bruin);
	box-shadow:none
}
li.woocommerce-MyAccount-navigation-link a:hover {
	background: white;
    color: var(--bruin);
	box-shadow:5px 5px 15px #33333322;
}
.woocommerce-account .woocommerce-MyAccount-content {padding: 25px;width: calc(68% - 50px);}




/* RESPONSIVE 
 * --------------------------------------------- */

.mob {display:none !important}

@media (max-width:1400px){

}

@media (min-width:1240px) {
	
}



@media (max-width:1280px){
	ul.products.columns-6 {grid-template-columns: repeat(4, 1fr)}
	.woocommerce-Tabs-panel {padding: 0 25px !important;}
}

@media (min-width:768px) and (max-width:1024px) {
	
	.content-wit {width:50%;}
}

@media (max-width:960px){
	
}

@media (max-width:768px)
{
	.mob {display:inherit !important;}
	.desktop {display:none !important}
	.product .summary.entry-summary { padding: 0 25px;width:calc(100% - 50px) !important}
	ul.products.columns-4, ul.products.columns-6 {grid-template-columns: repeat(2, 1fr)}
	.description_tab a, .additional_information_tab a {font-size:2.4rem;}
	.sidebar, .producten-overzicht {
        width: calc(100% - 30px);
        padding: 0 15px;
    }
	.filter-tonen.mob {padding: 0 15px;}
	li#text-3, li#nav_menu-2{padding:25px; width:calc(100% - 50px);}
}
@media (max-width: 600px) {
	

}


@media (max-width:480px){
	h1, h2 {font-size:3rem;}
	.woocommerce div.product .product_title {font-size:3rem;}
	button.single_add_to_cart_button {font-size:1.6rem !important;margin:0 !important;}
	ul.products.columns-4, ul.products.columns-6 {
		grid-template-columns: repeat(2, 1fr);        
		padding: 0 15px;
        width: calc(100% - 30px);
    }
	.description_tab a, .additional_information_tab a {font-size:2rem;}
}