/*  =================================================================
    0.0 :ROOT ~ overwrites or extras (if needed)
================================================================== */
    :root {
        --row-width: 1170px; /* max-width */
        --font-main: 'Poppins', san-serif;
        --font-weight: 400;
		
		--color-grey-32: #303032;
		--color-grey-66: #666666;
		--color-grey-70: #707070;
		--color-grey-5b: #5b5b5b;
		--color-grey-eb: #ebebeb;
		--color-yellow: #fbbe20;
        
        --color-red: #d83030;
        
        --color-denim: #73b3bd;
        --color-sky: #b8e3e3;
        --color-sage: #a6d9b0;
        --color-mint: #b3e6ba;
        --color-dewberry: #9eb8eb;
        --color-purple: #bdcff5;
        --color-bone: #b8acaa;
        --color-greige: #d1cccc;
        
    }
	
	@font-face {
		font-family: 'brighton_lightregular';
		src: url('../webfonts/brighton_light_regular-webfont.woff2') format('woff2'),
			 url('../webfonts/brighton_light_regular-webfont.woff') format('woff'),
			 url('../webfonts/brighton_light_regular-webfont.ttf') format('truetype');
		font-weight: normal;
		font-style: normal;
	}

	.g-recaptcha {
		float: left;
		width: calc(50% - 10px);
		overflow: hidden;
		height: 78px;
		border: 1px solid #d3d3d3;
	}
	.g-recaptcha > div,
	.g-recaptcha > iframe	{
		width: 100% !important;
	}
	.rc-anchor-light.rc-anchor-normal {
		border: 0 !important;
	}


/*  =================================================================
    1.0 STANDARDS
================================================================== */
	h1, h2, h3, h4, h5, h6 {		
		font-family: 'brighton_lightregular';
	}

    .clear, .clearall, .clearfix {
        clear: both;
    }

    .gridFrame {
        grid-gap: 30px;
    }
	.gridFrame.noGap {
        grid-gap: 0;
    }

	.bgDark {
		background-color: var(--color-black);
	}
	.bgLight {
		background: #404040;
	}

	.line {
		position: relative;
	}
	.line:before {
		content: '';
		position: absolute;
		top: 50%;
		left: 0;
		height: 1px;
		width: 100%;
		border-top: 1px dashed;
		z-index: 0;
	}

	.panel {
		position: relative;
		display: block;
		width: 100%;
		margin: 0 auto;
		background-color: #ddd;
		border: 2px solid #ccc;
		padding: 14px;
		padding-bottom: 13px;
		font-size: 16px;
		line-height: 23px;
		margin-bottom: 20px;
	}
	.panel.big {
		padding: 20px 14px;
		padding-bottom: 19px;
		font-size: 20px;
		line-height: 26px;
		font-weight: 600;
	}
	
	.panel.big,
	.panel.big a {
		font-weight: 600;
	}
	
	.bgBlue,
	a.bgBlue, 
	.panel.bgBlue a {
		color: #ffffff;
	}
	.panel a {
		border-bottom: 1px solid;
	}
	.panel.big a {
		border-bottom: 2px solid;
	}
	.panel.alert, .panel.notice, .panel.success, .panel.bgBlue {
		text-align: center;
	}
	.panel.alert {
        background-color: #f0c1c1;
        border-color: #dd0000;
        color: #dd0000;
    }
    .panel.success h2 {
        color: #dd0000;
    }
    .panel.notice,
	.panel.notice a {
        background-color: #f2ccb4;
        border-color: #ff8400;
        color: #ff8400;
    }
    .panel.success h2 {
        color: #ff8400;
    }
    .panel.success {
        background-color: #b1eab1;
        border-color: #007700;
        color: #007700;
    }
    .panel.success h2 {
        color: #007700;
    }

	/*.w67 {
		max-width: 66.66667%;
	}*/
	.panel.bgBlue {
		background: var(--color-dewberry);
		border-color: var(--color-dewberry);
	}
	
	.message {
        background-color: #0193d7;
        color: #fff;
        height: 62px;
        font-size: 15px;
        font-family: monospace;
        position: absolute;
        width: 100%;
        z-index: 10000;
        top: 0;
        left: 0;
        text-align:center;
    }
	
	#siteContainer {
		background-image: url(../img/bg.jpg);
		background-repeat: no-repeat;
		background-attachment: fixed;
		background-size: cover;
	}

/*  =================================================================
    3.0 NAV
================================================================== */
    nav {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: auto;
        z-index: 998;
        background-color: #fff;
        -webkit-transition: box-shadow .3s ease-out;
                transition: box-shadow .3s ease-out;
    }
    .row .twoToned {
        background-color: #252628;
        position: relative;
        float: left;
        width: 100%;
    }

    .row .twoToned,
    .row .twoToned a {
        color: #e0e0e0;
        font-size: 14px;
    }
    nav .row .twoToned .hdr-left a:first-of-type {
        margin-right: 20px;
    }
    nav .row .twoToned a i {
        color: #fff;
    }
    nav .row .twoToned a i.fa-phone-alt {
        font-size: 90%;
    }

    nav .hdr-left,
    nav .hdr-right {
        position: relative;
        float: left;
        width: 100%;
        line-height: 40px;
        padding: 0;
		text-align: center;
    }
    nav .hdr-left > span,
    nav .hdr-right > span {
        position: relative;
        z-index: 1;
		color: #fff;
		font-size: 0;
		line-height: 0;
		float: left;
		width: 100%;
		padding: 13px;
    }
	
	nav .hdr-right span label {
        display: none;
    }
	nav .twoToned .hdr-left {
		background-color: var(--color-grey-5b);
	}

    nav .bgDark a,
	nav .bgDark em {
        color: var(--color-white);
		font-size: 16px;
		line-height: 24px;
	}
	nav .bgDark a {
        color: var(--color-white);
		font-size: 16px;
		line-height: 24px;
		float: left;
		width: 25%;
    }
	nav .bgDark em {
		margin-left: 10px;
        font-style: normal; 
		display: none;
	}
	nav .bgDark .hdr-left a {
		width: 50%;
    }
	nav .bgDark .hdr-left a:last-of-type {
		width: 100%;
    }
	
    nav .bgDark a.bgYellow {
        display: inline-block;
        background-color: var(--color-yellow);
        color: #000;
        padding: 0 20px;
		margin-left: /*10px*/10%;
		width: 40%;
    }

/*  x.x Logo Link
    -------------------------------------------------------------- */
    .logo-link {
        width: 100%;
        display: block;
        height: auto;
        float: left;
    }
    nav .logo-link {
		padding: 13px;
        max-width: 292px;
        /*-webkit-transform: scale(0.5); 
                transform: scale(0.5);
        -webkit-transform-origin: center;
                transform-origin: center;*/
		-webkit-transform: scale(0.8); 
                transform: scale(0.8);
        -webkit-transform-origin: left;
                transform-origin: left;
        -webkit-transition: transform .3s ease-out;
                transition: transform .3s ease-out;
    }
    .logo-link img {
        float: left;
    }

/*  x.x mainNav (menu buttons)
    -------------------------------------------------------------- */
	#mainNAV {
		position: fixed;
		left: 0;
		top: 0;
		display: block;
		height: 100vh;
		z-index: 1;
		background-color: #000;
		width: 100%;
		margin: 0;
		max-width: 270px;
        text-align: left;
        font-size: 0;
        line-height: 0;
		background-color: #fff;
		
		box-shadow: 0 0 35px -10px rgb(0 0 0 / 25%);
		-webkit-transition: all .3s ease-out 0s;
				transition: all .3s ease-out 0s;
		-webkit-transform: translateX(-300px);
				transform: translateX(-300px);
	}
	#mainNAV.showed {
		-webkit-transform: translateX(0);
				transform: translateX(0);
	}
	
	#mainNAV ul {
        padding: 40px 0;
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
		overflow-y: scroll;
	}
	
	#mainNAV:after {
		content: '';
		position: absolute;
		left: 100%;
		top: 0;
		width: calc(100vw - 270px);
		height: 100%;
		background-color: #000;
		opacity: 0;
		visibility: hidden;
		pointer-events: none;
		-webkit-transition: all .3s ease-out 0s;
				transition: all .3s ease-out 0s;
	}
	#mainNAV.showed:after {
		opacity: .6;
		visibility: visible;
	}
    #mainNAV li {
        position: relative;
        display: inline-block;
		width: 100%;
        padding: 14px;
		border-bottom: 1px solid #e6e6e6;
    }
	#mainNAV li.dist {
		background-color:var(--color-yellow);
	}
    #mainNAV a {
        position: relative;
        font-family: var(--font-main);
        font-size: 14px;
        line-height: 20px;
        color: #6d6d6d;
        font-weight: 600;
		display: block;
		padding-left: 8px;
    }
    #mainNAV a.tip {
        color: var(--color-yellow);
    }
	
	#mainNAV label {
		display: block;
		padding: 14px;
		margin: 28px 14px;
		background-color: #efefef;
	}
	#mainNAV label a {
		padding-top: 2px;
		padding-bottom: 2px;
		text-align: center;
	}
	#mainNAV label a:first-of-type {
		padding-bottom: 4px;
	}
	#mainNAV label a:last-of-type {
		padding-top: 4px;
	}
	#mainNAV label a:not(:last-of-type) {
		border-bottom: 1px solid #ccc;
	}

/*  x.x Fixed status
    -------------------------------------------------------------- */
    nav.sticky {
        top: -74px;
        position: fixed;
        box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
    }
    /*nav.sticky .logo-link {
        -webkit-transform: scale(0.6); 
                transform: scale(0.6);
    }*/
    nav.sticky .btmRow .hdr-left, 
    nav.sticky .btmRow .hdr-right {
        padding: 0;
    }

/*  x.x NAV cart
    -------------------------------------------------------------- */
    .xtraLinks {
        float: right;
        position: relative;
        padding: 5px 0;
		margin-top: -61px;
		margin-right: 70px;
    }
    .xtraLinks > a,
    .xtraLinks .scBtn {
        float: left;
        width: 42px;
        height: 42px;
        text-align: center;
        position: relative;
    }
    .xtraLinks > a,
    .xtraLinks .scBtn a {
        color: #6d6d6d;
    }
    .xtraLinks > a::after {
        content: '';
        position: absolute;
        right: -1px;
        top: 50%;
        height: 12px;
        width: 1px;
        margin-top: -6px;
        background: #6d6d6d;
        display: block;
    }
    .xtraLinks > a i,
    .xtraLinks .scBtn > a i {
        display: block;
        line-height: 42px;
        vertical-align: middle;
    }
    .xtraLinks .scBtn > a span {
        position: absolute;
        right: 0;
        top: -14px;
        width: 42px;
		text-align: center;
    }

    .hdrSrch, .dd-shop {
        display: none;
    }

    nav .dd-shop {
        position: absolute;
        top: calc(100% - 5px);
        right: 0;
        width: 320px;
        z-index: 1;
        background-color: #fff;
        padding: 20px;
        filter: drop-shadow(0px 0px 4px rgba(0, 0, 0, .3));
        text-align: left;
    }
    nav .dd-shop.opened {
        display: block;
    }
    nav .dd-shop h3 {
        display: block;
        font-size: 18px;
        line-height: 18px;
        margin-bottom: 10px;
    }
    nav .dd-shop h4 {
        display: block;
        font-size: 15px;
        line-height: 19px;
        margin-bottom: 5px;
		
		
        display: -webkit-box;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
        -webkit-line-clamp: 1;
		
    }
    nav .dd-shop em {
        display: block;
        font-size: 13px;
        line-height: 15px;
    }
    nav .dd-shop dd {
        margin: 0;
    }
    nav .dd-shop dl {
        width: 100%;
        position: relative;
        margin-bottom: 10px;
        line-height: 30px;
        min-height: 60px;
    }
    nav .dd-shop .img {
        position: relative;
        width: 60px;
        height: 60px;
        overflow: hidden;
        float: left;
        margin: 0 10px 0 0;	
		border-right: 1px solid #eaeaea;
    }
    nav .dd-shop .img img {
        position: absolute;
        left: 50%;
        top: 50%;
        -webkit-transform: translate(-50%,-50%);
        transform: translate(-50%,-50%);
        width: auto;
        min-width: 60px;
        max-width: 60px;
        height: auto;	
    }
    nav .dd-shop a.btn {
        position: relative;
        background-color: #d83030;
        color: #fff;
        display: block;
        padding: 10px;
        text-align: center;
        width: 100%;
        margin: 10px 0 0 0;
        font-size: 14px;
        -webkit-transform: translate(0,0);
        transform: translate(0,0);
    }
    nav .dd-shop price {		
        position: absolute;
        top: 5px;
        right: 5px;
        display: inline-block;
        width: auto;
        font-size: 15px;
        line-height: 15px;
        padding: 5px 10px;
        background-color: #d83030;
        color: #fff;
    }
	
	.mob-btn {
		position: absolute;
		right: 15px;
		top: 50%;
		margin-top: -20px;
		display: block;
		width: 40px;
		height: 40px;
		border-radius: 50%;
		border: 1px solid #6d6d6d;
		z-index: 2;
	}
	.mob-btn span,
	.mob-btn:before,
	.mob-btn:after  {
		content: "";
		display: block;
		height: 2px;
		left: 12px;
		position: absolute;
		width: 14px;
		top: 14px;
		background-color: #6d6d6d;
	}
	.mob-btn:before {
		top: 22px;
	}
	.mob-btn span {
		top: 18px;
		width: 10px;
	}
	#mainNAV a.closeBtn {
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		height: 40px;
		background-color: #222;
	}	
	#mainNAV a.closeBtn:after, 
	#mainNAV a.closeBtn:before {
		background-color: #fff;
		content: "";
		height: 12px;
		margin: auto;
		position: absolute;
		right: 25px;
		top: 14px;
		width: 2px;
	} 
	#mainNAV a.closeBtn:before {
	    -webkit-transform: rotate(45deg);
				transform: rotate(45deg);
	}
	#mainNAV a.closeBtn:after {
		-webkit-transform: rotate(-45deg);
				transform: rotate(-45deg);
	}
	
	nav .hdrSrch {
		position: absolute;
		left: 0;
		top: -70px;
		width: 100%;
		height: 100%;
		min-height: 70px;
		background-color: #fff;
		z-index: 1;
		padding: 0 40px;
	}
	nav .hdrSrch input {
		float: left;
		width: calc(100% - 80px);
		display: block;
		height: 40px;
		line-height: 40px;
		border-bottom: 1px solid #ccc;
		
		position: absolute;
		left: 40px;
		top: 50%;
		margin-top: -20px;
	}
	nav .hdrSrch button {
		position: absolute;
		right: 40px;
		top: 50%;
		margin-top: -20px;
		width: 40px;
		height: 40px;
		line-height: 40px;
		display: block;
		background-color: #ccc;
		color: #323232;
		font-size: 16px;
		text-align: center;
		padding: 0;
	}
	

/*  =================================================================
    4.0 HEADER
================================================================== */
	
	header {
		overflow: hidden;
        margin-top: 194px;
		height: 100px;
		overflow: hidden;
        border-bottom: 2px solid var(--color-grey-32);
	}
	.home header {
		height: 250px;
	}
	header a.distriBtn {
		display: none;
		position: absolute;
		top: 30px;
		right: 0;
		background-color: var(--color-yellow);
		color: #000;
		font-size: 16px;
		line-height: 24px;
		padding: 8px 24px;
		box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
		z-index: 9;
	}
	header img {
		position: absolute;
		left: 50%;
		top: 50%;
		-webkit-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		width: auto;
		height: 100%;
	}
	header.subPage img {
		min-width: 100%;
		max-width: none;
		min-height: 100%;
	}

    header .row {    
        height: 100%;    
    }

    header article {
        position: absolute;
        left: 0;
        top: 50%;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        width: 100%;
    }

	header article text {
		position: relative;
		float: left;
		width: 100%;
        max-width: 65%;
		padding-top: 32px;
		padding-left: 15px;
	}
    header article h2 {
        display: block;
        float: left;
        text-align: left;
        padding-right: 20px;
		font-size: 26px;
		line-height: 32px;
		width: 100%;
		font-weight: 600;
    }
    header article h2 span {
        font-weight: 300;
        /*font-size: 30px;
        line-height: 40px;*/
    }

    header article a {
        display: block;
        background-color: var(--color-yellow);
        color: #000;
        padding: 8px 24px;
        margin-right: 20px;
        float: left;
		font-size: 20px;
		font-weight: 500;
		background-color: var(--color-dewberry);
		box-shadow: 0 0 10px rgba(0,0,0,0.25);
    }
    header article figure {
        padding-bottom: 300px;
        float: left;
        max-width: 300px;
        box-shadow: 0 5px 10px rgb(0 0 0 / 25%);
    }
	header h1 {
		position: absolute;
		left: 50%;
		top: 50%;
		width: 100%;
		max-width: var(--row-width);
		-webkit-transform: translate(-50%,-50%);
		transform: translate(-50%,-50%);
		z-index: 1;
		padding-left: 15px;
	}
	header h1 small{
		margin: 0;
		display: inline;
		font-size: 70%;
	}
	
	figure.temp {
		margin-top: 32px;
		box-shadow: none;
		max-width: 100px;
		padding-bottom: 0;
	}
	figure.temp img {
		-webkit-filter: drop-shadow(3px 3px 3px rgba(0,0,0,0.35));
		filter: drop-shadow(3px 3px 3px rgba(0,0,0,0.35));
		max-width: none;
		width: 100%;
		height: auto;
		position: relative;
		left: auto;
		top: auto;
		-webkit-transform: translate(0,0);
		transform: translate(0,0);
		
	}


/*  =================================================================
    5.0 SHOP
================================================================== */
/*  x.x Filters
    -------------------------------------------------------------- */
	.mobFilters {
		position: fixed;
		left: 0;
		top: 0;
		background-color: #fff;
		padding: 15px 15px 80px;
		z-index: 998;
		width: 100%;
		height: 100vh;
		min-height: 100%;
		-webkit-transform: translateY(100%);
		transform: translateY(100%);
		-webkit-transition: transform 300ms ease-in-out;
		transition: transform 300ms ease-in-out;
		filter: drop-shadow(0px 2px 2px rgba(0, 0, 0, .3));
		overflow-y: auto;
	}
	.mobFilters.showed {
		-webkit-transform: translateY(0);
		transform: translateY(0);
	}
	

	h2,
    #options h3 {
        margin-bottom: 10px;
        font-weight: 500;
        font-size: 29px;
        line-height: 40px;
    }

    h2 i {
        font-size: 50%;
        vertical-align: super;
    }
    #options h3 {
        color: #6d6d6d;
        font-size: 21px;
    }
    #options .option-set {
        margin-bottom: 20px;
    }
    #options span {
        display: block;
        width: 100%;
        float: left;
        padding: 5px 10px 5px 7px;
        border-top: 1px solid #ccc;
        border-bottom: 1px solid #ccc;
        line-height: 30px;
        font-size: 15px;
        position: relative;
    }
    #options span:not(:first-of-type) {
        margin-top: -1px;
    }

    #options span:before,
    .item .buttons a:before,
    .item .buttons form.mini button:before {
        content: '';
        position: absolute;
        top: 0;
        left: 10px;
        width: 100%;
        height: 100%;
        -webkit-transform: skew(-26deg);
        transform: skew(-26deg);
        max-width: 26px;
        background-color: var(--color-grey-32);
        opacity: 0.1;
        -webkit-transition: all 300ms ease-in;
        transition: all 300ms ease-in;
    }

    #options input[type="checkbox"],
    #options label {
        cursor: pointer;                        
    }
    #options input[type="checkbox"] {
        position: relative;
        width: 16px;
        height: 16px;
        border-radius: 4px;
        border: 1px solid #d83030;
        margin: 7px 20px 7px 0;
        float: left;
        z-index: 2;
        background-color: #fff;
        overflow: hidden;
    }
    #options input[type="checkbox"]:after {
        content: '';
        position: absolute;
        left: -1px;
        top: -1px;
        width: 18px;
        height: 18px;
        background-color: transparent;
        border-radius: 4px;
    }
    #options input[type="checkbox"]:checked:after {
        background-color: #d83030;
    }
    #options label {
        position: relative;
        float: left;
        width: calc(100% - 36px);
        z-index: 2;
        margin: 0;
    }
	.mobFilterBtn {
		display: block !important;
		position: fixed;
		z-index: 998;
		left: 50%;
		bottom: 20px;
		-webkit-transform: translateX(-50%);
		transform: translateX(-50%);
		padding: 10px 20px;
		line-height: 25px;
		font-size: 14px;
		text-transform: uppercase;
		color: #fff;
		background-color: var(--color-blue);
		text-align: center;
		border-radius: 20px;
	}

/*  x.x Items
    -------------------------------------------------------------- */
    .item {
        width: 100%;
        padding: 20px 10px;
        padding-top: 0;
    }
    .item figure {
        filter: drop-shadow(0px 0px 4px rgba(0, 0, 0, .3));
        transform-origin: top;
        transform: translateY(0);
        transition: all .25s ease-in-out;
        color: #111111;
        background-color: #f9f9f9;
        padding: 10px;
    }
    .item figure > a {
        position: relative;
        width: 100%;
        height: 160px;
        overflow: hidden;
        margin-bottom: 10px;
    }
    .item figure > a img {
        position: absolute;
        left: 50%;
        top: 50%;
        width: auto;
        height: auto;
        max-width: 120%;
        -webkit-transform: translate(-50%,-50%);
                transform: translate(-50%,-50%);
    }

    .item price {
        position: absolute;
        right: 5px;
        top: 5px;
        background-color: #d83030;
        color: #fff;
        z-index: 1;
        padding: 5px 10px 2px;
        line-height: 20px;
        font-size: 14px;
    }                    
    .item h2 {
        font-size: 18px;
        text-transform: uppercase;
        line-height: 22px;
        padding: 4px 0 13px;
        border-bottom: 1px solid #ccc;
    }
    .item p {
        font-size: 14px;
        line-height: 20px;
        margin-bottom: 10px;
    }

    .item .buttons {
        border-top: 1px solid #ccc;                        
        border-bottom: 1px solid #ccc;
        position: relative;
        overflow: hidden;
    }
    .item .buttons a,
	.item .buttons form.mini,
	.item .buttons .mini button	{
        float: left;
        width: 50%;
        line-height: 22px;
        font-size: 12px;
        text-align: center;
        display: block;
        text-transform: uppercase;
        position: relative;
        padding: 4px 0;
        color: #d83030;
    }
	.item .buttons form.mini {
		padding: 0;
	}
	.item .buttons .mini button {
		width: 100%;
		background-color: transparent; 
	}
    .item .buttons a:before,
	.item .buttons form.mini button:before {
        left: auto;
        right: 0;
        max-width: 10px;
        z-index: -1;
        opacity: 1;
        margin-right: -5px;
    }
    /*.item .buttons a:last-of-type:before,*/
	.item .buttons form.mini button:before {
        left: 0;
        margin-left: -5px;
    }    

/*  x.x Filterset
    -------------------------------------------------------------- */
    .filterSet {
        padding: 10px;
        line-height: 30px;
        font-size: 14px;
        margin-bottom: 20px;
    }
    #filter-display {
        margin-left: 5px;
        font-size: 15px;
        padding: 0.5em;
        border: 1px solid #ccc;
        color: #d83030;
    }  
	
/*  x.x Filterset
    -------------------------------------------------------------- */
	iframe {
		position: relative;
		display: block;
		margin-bottom: 40px;
	}
	
/*  x.x WYSIWYG
    -------------------------------------------------------------- */	
	.WYSIWYG {
        padding-bottom: 60px;
    }
    .WYSIWYG h2 {
        text-transform: uppercase;
        font-size: 18px;
        line-height: 18px;
        margin-bottom: 20px;
    }
    .WYSIWYG .padTop {
        padding-top: 38px;
    }

    .WYSIWYG p,
    .WYSIWYG li {
        font-size: 15px;
        line-height: 23px;
    }
    .WYSIWYG p:not(:last-of-type),
    .WYSIWYG ul:not(:last-of-type),
    .WYSIWYG ol:not(:last-of-type) {
        margin-bottom: 23px;
    }
	
	.WYSIWYG.tab p:last-of-type,
    .WYSIWYG.tab ul:last-of-type,
    .WYSIWYG.tab ol:last-of-type {
        margin-bottom: 23px;
    }
	
	.WYSIWYG ul li:before,
	.WYSIWYG.tab ul li:before,
	.times ul li:before {
		font-family: 'Font Awesome 6 Free';
		content: '\f017';
		color: var(--color-yellow);
		margin-right: 10px;
	}
	.WYSIWYG.tab ul {
		margin-top: -23px;
	}
	.WYSIWYG.tab ul li:before {
		content: "\e516";
		font-weight: 900;
		font-size: 17px;
		line-height: 23px;
		vertical-align: bottom;
	}
	.times ul li b, 
	.times ul li strong {
		display: inline-block;
		width: 100px;
	}
	
	.WYSIWYG table {
		margin-bottom: 23px;
	}
	.WYSIWYG table li {
		padding-left: 23px;
		position: relative;
		margin-bottom: 23px;
	}
	.WYSIWYG table li:before {
		content: '\f138';
		font-weight: 700;
		position: absolute;
		left: 0;
		top: 0;
		width: 23px;
		line-height: 23px;		
	}
	
    .WYSIWYG a {
        color: var(--color-orange-dark);
    }
	.WYSIWYG a.tokenLink  {
		color: var(--color-grey-66);
	}
	
	.WYSIWYG .price,
	.WYSIWYG .price label {
		font-family: 'Old Standard TT', serif;
		font-weight: 700;
		font-size: 40px;
		color: var(--color-red);
		letter-spacing: -4px;
	}
	
    .WYSIWYG form {
        padding-top: 21px;
        display: block;
        width: 100%;
    }
    .WYSIWYG form input,
	.WYSIWYG form select,
    .WYSIWYG form textarea {
		position: relative;
        float: left;
        width: 100%;
        background-color: var(--color-grey-eb);
        border-radius: 3px;
        height: 40px;
        line-height: 40px;
        padding: 0 10px;
        font-size: 14px;
        color: #666;
        font-weight: 400;
        margin-bottom: 20px;
    }
	.WYSIWYG form > label {
		position: relative;
		float: left;
		width: 100%;
		display: block;
		font-size: 15px;
		line-height: 17px;
	}
	
	form.searchBar {
		background-color: var(--color-orange-dark);
	}
	.WYSIWYG form.searchBar input,
	.WYSIWYG form.searchBar button {
        border-radius: 3px;
    }
	.WYSIWYG .shoppingCart form input {
        margin-bottom: 0;
		margin: 5px 0;
	}
    .WYSIWYG form textarea {
        height: 160px;
    }
	.WYSIWYG form .cbContainer {
		padding-bottom: 20px;
	}
	.WYSIWYG form input[type="checkbox"] {
		max-width: 20px;
		height: 20px;
		padding: 0;
		margin: 10px;
		margin-left: 0px;		
	}
	form input[type="checkbox"]:after {		
		content: '';
		position: absolute;
		left: 4px;
		top: 4px;
		width: 12px;
		height: 12px;
		background-color: #ebebeb;
	}
	form input[type="checkbox"]:checked:after {
		background-color: #666;
	}
	.WYSIWYG form input[type="checkbox"] + label {
		display: block;
		float: left;
		line-height: 40px;
		width: calc(100% - 30px);
	}
	
	.WYSIWYG form small {
		display: block;
		padding: 0 0 10px 0;
	}
	
	.WYSIWYG form ul.selector {
		position: relative;
		display: block;
		width: 100%;
		background-color: var(--color-grey-eb);
		border-radius: 3px;
		font-size: 14px;
		color: #666;
		font-weight: 400;
		z-index: 1;
	}
	.WYSIWYG form ul.selector li {
		position: relative;
		height: 40px;
		line-height: 40px;
		padding: 0 10px;
	}
	.WYSIWYG form ul.selector li label {
		display: block;
		cursor: pointer;
	}
	.WYSIWYG form ul.selector li ul li:not(:last-of-type) {
		border-bottom: 1px solid var(--color-grey-eb)
	}	
	.WYSIWYG form ul.selector ul {
		display: none;
		position: absolute;
		width: 100%;
		left: 0;
		top: 100%;
		background-color: var(--color-white);
		border-radius: 3px;
		font-size: 14px;
		color: #666;
		font-weight: 400;
		border: 1px solid var(--color-grey-eb)
	}
	.WYSIWYG form ul.selector > li:after {
		content: '\022A5';
		position: absolute;
		right: 0;
		top: 0;
		line-height: 40px;
		font-size: 20px;
		width: 40px;
		text-align: center;
	}	
	.WYSIWYG form ul.selector > li:focus:after {
		content: '\022A4';
	}
	.WYSIWYG form ul.selector > li:focus ul	{
		display: block;
	}
	
    .WYSIWYG form input.half {
        max-width: calc(50% - 10px);
        margin-right: 10px;
    }
    .WYSIWYG form > input.half ~ input.half {
        margin-left: 10px;
        margin-right: 0;
    }
    .WYSIWYG form button {
        float: right;
        width: 100%;
        max-width: calc(50% - 10px);
        border: 2px solid var(--color-yellow);
        color: var(--color-white);
        font-size: 16px;
        text-transform: uppercase;
        text-indent: 2px;
        letter-spacing: 2px;
        background-color: var(--color-yellow);
        padding: 10px;
        cursor: pointer;
        border-radius: 3px;
    }
    .WYSIWYG form.searchBar button {
		border: 0;
        border-left: 2px solid var(--color-black);
    }
    .WYSIWYG form.shopItem label:not(.soldOut) {
        display: block;
        float: left;
        width: 150px;
        height: 40px;
        line-height: 40px;
        font-size: 14px;
        color: #666;
        font-weight: 400;
        margin-bottom: 20px;
    }
    .WYSIWYG form.shopItem label ~ input[type="number"] {
        max-width: calc(100% - 150px);
    }
    .WYSIWYG form.shopItem input[type="number"] {
        margin: 0;
        padding: 0 20px 0 30px;
        border: 1px solid #666;
    }
    .WYSIWYG form.shopItem button {
        width: auto;
        max-width: none;
        float: left;
    }
	form.row.collapsed .col.w33 {
		padding-right: 15px;
	}
	form.row.collapsed .col.w67 {
		padding-left: 15px;
	}
	
	.WYSIWYG.counters li {
		line-height: 23px;
	}
	.WYSIWYG.counters ol, 
	.WYSIWYG.counters ul {
		counter-reset: section;
	}								
	.WYSIWYG.counters ol li:before {
		counter-increment: section;
		content: counters(section, ".") " ";
		opacity: 0;
		visibility: hidden;
	}
	/*.WYSIWYG.counters ol li ol li:before,*/
	.WYSIWYG.counters ol li:before,
	.WYSIWYG.counters ul li:before {
		opacity: 1;
		visibility: visible;
		background-color: var(--color-orange-dark);
		color: var(--color-white);
		padding: 0 3px;
		border-radius: 3px;
		font-weight: bold;
		text-align: center;
		margin-right: 3px;
		display: inline-block;
		width: 40px;
		line-height: 21px;
	}
	.WYSIWYG.counters ol li > ul {
		padding-left: 40px;
		margin-bottom: 5px;
	}
	.WYSIWYG.counters ul li:before {
		width: 21px;
		content: 'o';
	}
	
	.pInfo ul {
		position: relative;
		padding: 14px;
		border-left: 1px solid #ccc;
		margin-bottom: 20px;
		width: 100%;
	}
	.pInfo ul:before,
	.pInfo ul:after {
		content: '';
		position: absolute;
		left: 0;
		height: 1px;
		background-color: #ccc;
	}
	.pInfo ul:before {
		top: 0;
		width: 20%;
	}
	.pInfo ul:after {
		bottom: 0px;
		width: 70%;
	}
	.pInfo ul li {
		padding-left: 20px;
		position: relative;
		font-size: 14px;
		line-height: 22px;
		margin: 0;
	}
	.pInfo ul li:before {
		content: 'â– ';
		position: absolute;
		text-align: center;
		font-size: 20px;
		line-height: 16px;
		left: 0;
		top: 0;
		width: 20px;
		height: 22px;
		color: #666;
	}
	
	.txtBlock {
		text-align: center;
	}
	.txtBlock h3 {
		font-size: 16px;
		font-weight: 500;
		margin-bottom: 20px;
	}
	.txtBlock h3 span {
		font-size: 14px;
		font-weight: 300;
	}
	.txtBlock p {
		font-size: 13px;
	}
	
	.shopFormContainer {
		padding: 20px 20px 30px;
		margin-top: 20px;
		border-left: 2px solid #000;
		position: relative;
	}
	.shopFormContainer:before,
	.shopFormContainer:after {
		content: '';
		position: absolute;
		left: 0;
		background-color: #000;
		height: 2px;
		width: 100%;
	}
	.shopFormContainer:before {
		top: 0;
		max-width: 30%;
	}
	.shopFormContainer:after {
		bottom: 0;
		max-width: 70%;
	}
	.product.single .shopFormContainer button {
		background-color: var(--color-white);
	}

    .quantity {
        position: relative;
        display: inline-block;
        float: left;
        width: 100%;
        max-width: 120px;
        overflow: hidden;
        border: 1px solid #ccc;
    }
    .shopCart .quantity {
        float: none;
        margin-top: 5px;
    }
    input[type="number"]::-webkit-inner-spin-button,
    input[type="number"]::-webkit-outer-spin-button {
        -webkit-appearance: none;
        margin: 0;
    }
    .quantity input[type="number"] {
        width: 100%;
        -moz-appearance: textfield;
        text-align: center;
        padding: 3px 40px;
        line-height: 24px;
    }
    .quantity input:focus {
        outline: 0;
    }
    .quantity-nav {
        position: absolute;
        top: 0;
        right: 0;
        height: 100%;
        width: 100%;
        pointer-events: none;
    }
    .quantity-button {
        position: absolute;
        cursor: pointer;
        width: 30px;
        text-align: center;
        background-color: #ccc;
        color: #333;
        color: #fff;
        font-size: 13px;
        line-height: 30px;
        top: 0;
        height: 30px;
        -webkit-user-select: none;
                user-select: none;
        -webkit-transition: background 150ms ease-in, color 150ms ease-in;
                transition: background 150ms ease-in, color 150ms ease-in;
        pointer-events: all;
    }
    .quantity-button.quantity-up {
        right: 0;
    }
    .quantity-button.quantity-down {
        left: 0;
    }	
	
	.soldOutText {
		font-size: 12px;
		line-height: 16px;
		font-style: italic;
		color: var(--color-red);
		font-weight: 500;
	}
	.soldOutText.large {
		display: block;
		padding: 20px;
		font-size: 14px;
		line-height: 18px;
		border: 2px solid var(--color-red);
		background-color: rgba(216,48,48,0.15);
	}

	/*  7.6 Login screens
    -------------------------------------------------------------- */
    .secForm {
        position: relative;
        width: 100%;
        max-width: 480px;
        margin: 0 auto
    }
    .secForm .col {
        padding: 10px;
    }
    .secForm h2,
    .secForm p,
    .secForm label,
    .secForm input {
        float: left;
        display: block;
        width: 100%;
        line-height: 20px;
        font-size: 14px;
    }
    .secForm h2 {
        color: var(--color-blue);
        font-size: 20px;
        line-height: 32px;
        font-weight: 400;
        text-transform: uppercase;
    }
    .secForm h2 small {
        font-size: 12px;
        line-height: 16px;
        text-transform: none;
        margin-top: -4px;
    }
    .secForm input {
        float: left;
        display: block;
        width: 100%;
        border: 0;
		background-color: var(--color-grey-eb);
        box-shadow: 0px 0px 0px 1px var(--color-grey-eb);
        padding: 6px 10px;
    }
    input[type="radio"],
    input[type="checkbox"] {
        position: relative;
        width: 16px;
        height: 16px;
        margin: 8px 0;
        padding: 0;
    }
	
	.secForm input[type="checkbox"]:after {
		left: 3px;
		top: 3px;
		width: 10px;
		height: 10px;
	}
	
    .secForm .selectOptions label {
        width: calc(100% - 32px);
        padding-left: 10px;
    }
    .secForm .col > small {
        display: block;
        padding: 20px;
        text-align: center;
    }
    .secForm button {
		background-color: var(--color-yellow);
		color: #fff;
		position: relative;
		display: block;
		width: 100%;
		height: 40px;
		line-height: 40px;
		padding: 0 20px;
		border-radius: 3px;
	}	
    .secForm a {
        font-weight: 400;
        color: var(--color-yellow);
    }

	.button.verify {
		margin-top: 20px;
		text-align: center;
        color: var(--color-white);
	}

/*  =================================================================
    x.0 shoppingCart
================================================================== */
	.twoToned.sector {
		margin-top: -20px; /* for the padding in section */
		margin-bottom: 40px;
	}
	.twoToned.sector,
	.twoToned.sector:before,
	.twoToned.sector:after {
		border-bottom: 2px solid var(--color-grey-32);
	}
	.twoToned.sector:before, 
	.twoToned.sector:after {
		height: calc(100% + 2px);
	}
	.twoToned.sector:after {
		background-color: var(--color-yellow);
	}
	.steps {
		position: relative;
		background-color: #252628;
		width: 100%;
		text-align: left;
		font-size: 0;
		line-height: 0;
		/*overflow: hidden;*/
	}	
	.steps:before,
	.steps:after {
		content: '';
		position: absolute;
		top: 0;
		width: 20px;
		height: calc(100% + 2px);
		background-color: #252628;
		border-bottom: 2px solid var(--color-grey-32);
	}
	.steps:before {
		left: 100%;
	}
	.steps:after {
		right: 100%;
		background-color: var(--color-yellow);
	}	
	.steps li {
		display: inline-block;
		padding: 20px 10px;
		font-size: 13px;
		line-height: 19px;
		width: 25%;
		position: relative;
		background-color: var(--color-grey-5b);
	}
	.steps.search li {
		width: 50%;
	}
	.steps li.passed,
	.steps li.current {
		background-color: var(--color-yellow);
        color: #000;
	}
	.steps li:after {
		content: '';
		position: absolute;
		top: 0;
		left: calc(100% - 3px);
		width: 3px;
		height: 100%;
		background-color: var(--color-grey-32);
	}
	.steps li a {
		color: #666;
	}
	.steps li span,
	.steps li em {
		position: relative;
		z-index: 1;
	}
	.steps li span,
    .shoppingCart li.head span,
	table.adres th {
        font-family: 'Fira Sans', sans-serif;
	}
	
	.steps li span {
		display: block;
		font-size: 16px;
		line-height: 21px;
		letter-spacing: 1px;
	}
	.steps li em {
		font-style: normal;
		display: none;
	}
	.steps.search li em {
		display: block;
	}
	.steps li.passed:before,
	.steps li.current:before  {
		content: ''; /* reset to empty */
		background-color: var(--color-yellow);
		color: var(--color-white);
	}
	.steps li:nth-child(1) {
		z-index: 5;
	}
	.steps li:nth-child(2) {
		z-index: 4;
	}
	.steps li:nth-child(3) {
		z-index: 3;
	}
	.steps li:nth-child(4) {
		z-index: 2;
	}
	.steps li:nth-child(5) {
		z-index: 1;
	}

    .shoppingCart ul {
        position: relative;
        width: 100%;
    }
    .shoppingCart ul.endStep {
        max-width: 64%;
    }
    .shoppingCart li {
        position: relative;
		font-size: 14px;
    }
    .shoppingCart span {
        width: 100%;
        float: left;
        display: block;
        min-height: 26px;
        border: 0;
        margin: 1px;
        padding: 5px;
        position: relative;
    }
	.shoppingCart td[align="right"] span {
		display: inline !important;
		float: none !important;
		text-align: right !important;
		padding: 0 !important;
	}
    .shoppingCart li.head span,
	table.adres th	{
		background-color: var(--color-grey-5b);
		color: #fff;
		text-align: center;
		font-size: 20px;
		line-height: 40px;
		letter-spacing: 1px;
		text-indent: 1px;
		font-weight: normal;
	}
    .shoppingCart li.itemP:not(.first) span {
		border-top: 1px solid #aeaeae;
    }
    .shoppingCart li.itemP span {
		padding-left: 42px;
        line-height: 21px;
    }
    .shoppingCart li.sum span,
    .shoppingCart li.total span {
        border-top: 3px solid #666;
        line-height: 16px;
    }
    .shoppingCart li.sum span {
        border-top: 1px solid #999;
        line-height: 22px;
    }
    .shoppingCart li.sum span em {
        font-style: normal;
    }
    .shoppingCart li.foot {
        padding-top: 65px;
        text-align: right;
    }
    .shoppingCart li.foot span:nth-of-type(1n) {
        float: left;
    }
    .shoppingCart li.foot span:nth-of-type(2n),
    .shoppingCart li.total span {
        float: right;
        margin-right: 2px;
    }
    .shoppingCart img {
        display: inline-block;
    }
    .shoppingCart li span:nth-of-type(1n) {
		max-width: calc(70% - 2px);
    }
    .shoppingCart li span:nth-of-type(2n),
	.shoppingCart li.itemP span:nth-of-type(2n),
    .shoppingCart li.foot span:nth-of-type(2n),
	.shoppingCart li.itemP span:nth-of-type(2n) {
		max-width: calc(30% - 2px);
        float: right;
    } 
    .shoppingCart li.itemP span:nth-of-type(2n),
    .shoppingCart li.sum span:nth-of-type(1n),
    .shoppingCart li.total span:nth-of-type(1n) {
        text-align: right;
    }
	.shoppingCart li.sum span:nth-of-type(1n),
    .shoppingCart li.total span:nth-of-type(1n) {
        float: right;
		max-width: calc(44.5% - 2px);
    }
    .shoppingCart li span em {
        font-weight: normal;
        display: inline-block;
		width: 100%;
        max-width: 75px;
		float: left;
    }
	.shoppingCart li span strong,
	.shoppingCart li span label {
        display: inline-block;
		width: 100%;
        max-width: calc(100% - 75px);
		float: left;
    }
	.shoppingCart li span strong {
        display: inline;
		float: none;
    }
	.shoppingCart li span label {
        font-weight: normal;
    }
    .shoppingCart li.itemP span:nth-of-type(2n) {
        text-align: right;
    }
	.shoppingCart li.message label {		
		border: 1px solid #666;
		background: #ebebeb;
		color: #666;		
		font-weight: 700;
		display: block;
		padding: 10px;
		text-align: center;
		width: calc(100% - 2px);		
		margin: 10px 1px 15px;		
	}
	
	.shoppingCart .deleteBTN {
		position: absolute;
		left: 0;
		top: 10px;
		width: 32px;
		line-height: 32px;
		height: 32px;
		background-color: var(--color-red);
		color: #fff;
		text-align: center;
	}
	
	.shoppingCart .button {
		position: relative;
		float: left;
		/*width: 40%;
		margin-right: 20%;*/
		width: 100%;
		margin-bottom: 5px;
		display: block;
		text-align: center;
		background-color: var(--color-white);
		color: var(--color-yellow);
		line-height: 40px;
		border-radius: 3px;
		cursor: pointer;
		padding: 0;
		border: 0;
		text-transform: none;
		text-indent: 0;
		letter-spacing: 0;
		border: 2px solid var(--color-yellow);
		-webkit-transition: all 300ms ease-in;
				transition: all 300ms ease-in;
	}
	.shoppingCart .button.right {
		margin-top: -100px;
		margin-right: 0;
		background-color: var(--color-dewberry);
		border-color: var(--color-dewberry);
		color: var(--color-white);
	}
	
	tr, td {
		position: relative;
	}
	.shoppingCart ul.parsley-errors-list {
		list-style: none;
		float: left;
	}
	.WYSIWYG form select + ul.parsley-errors-list {
		margin-top: -15px;
	}
	.shoppingCart ul.parsley-errors-list li {
		background-color: #d00;
		color: #fff;
		border-radius: 4px;
		padding: 2px 20px;
		line-height: 16px;
		font-size: 14px;
	}
	.shoppingCart ul.parsley-errors-list li:before {
		display: none;
	}
	
	#prijsContainer {
		width: 100%;
		position: relative;
		padding-bottom: 65px;
	}

	form.searchBar {float: left;width: 100%;padding: 30px; background-color: var(--color-yellow);}
	form.searchBar h3 {float: left; width: 100%; display: block; color: var(--color-white); margin-bottom: 10px; font-size: 30px;
    line-height: 52px;
    font-weight: 500;}
	form.searchBar input {display: block; float: left; width: calc(100% - 300px); min-height: 42px; padding: 0 21px; border-right: 2px solid var(--color-orange-dark); background-color: #fff; border-radius: 0 !important;}
	form.searchBar button {float: left; width: 300px; height: 42px; background-color: var(--color-grey-32); border-radius: 0 !important;}
	
	.resultBar p {
		margin-bottom: 20px;
	}
	.searchResults {
		width: 100%;
		margin-left: 0;
		margin-right: 0;
		padding-left: 15px;
		padding-right: 15px;
	}
	.searchResults h3 {
		padding-top: 10px;
		font-weight: 400;
	}
	.searchResults .resCol {padding: 10px; color: #515151; background-color: #e5e5e5;}
	.searchResults .resCol:nth-of-type(odd) {background-color: #efefef;}
	.searchResults figure {float: left; width: 150px; height: 70px; position: relative; overflow: hidden;}
	.searchResults figure img {position: absolute; left: 50%; top: 50%; width: 100%; height: auto; min-height: 100%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%);}
	.searchResults h4 {float: left; display: block; width: calc(100% - 160px); margin-left: 10px; font-size: 21px; line-height: 29px; margin-top: 10px;}
	.searchResults small {float: left; display: block; width: calc(100% - 160px); margin-left: 10px; font-size: 13px; line-height: 21px;}

	.WYSIWYG.padded {
		padding-top: 75px;
		padding-bottom: 75px;
	}
	.bgDarkGrey {
		background-color: #33383E;
	}
		
	.results a {
		display: block;
		padding: 10px;
		background-color: #efefef;
		margin-bottom: 20px;
	}
	.results a:nth-of-type(even) {
		background-color: #ccc;
	}
	.results figure {
		width: 60px;
		height: 60px;
		position: relative;
		float: left;
		margin-right: 20px;
		overflow: hidden;
		background-color: #fff;
	}
	.results figure img {
		position: absolute;
		left: 50%;
		top: 50%;
		width: auto;
		max-width: 90%;
		-webkit-transform: translate(-50%,-50%);
		transform: translate(-50%,-50%);
	}
	
	.radioContainer {
		position: relative;
		padding: 10px 0;
		padding-left: 100px;
		border-top: 1px solid #ccc;
	}
	.radioContainer:last-of-type {
		border-top: 0;
		margin-bottom: 20px;
		border-bottom: 1px solid #ccc;
	}
	.radioContainer span {
		position: absolute;
		left: 0;
		top: 50%;
		-webkit-transform: translateY(-50%);
				transform: translateY(-50%);
				
		font-size: 14px;
		color: #666;
		font-weight: 400;
				
		line-height: 20px;
		padding: 10px 0;
		display: block;
		margin: 0;
		width: 100%;
		max-width: 100px;
	}
	.radioContainer label {
		position: relative;
		display: inline-block !important;
		line-height: 20px !important;
		width: auto !important;
		padding: 10px 20px;
		padding-left: 30px;
		border: 1px solid #ccc;
		border-radius: 4px;
		margin: 3px 6px !important;
		margin-left: 0px !important;
		-webkit-transition: all 150ms ease-out;
				transition: all 150ms ease-out;
		cursor: pointer;
	}
	.radioContainer input[type="radio"] {
		position: absolute;
		left: 10px;
		top: 50%;
		-webkit-transform: translateY(-50%);
				transform: translateY(-50%);
		width: 10px;
		height: 10px;
		margin: 0;
		padding: 0;
		border-radius: 5px;
	}
	.radioContainer input[type="radio"]:after {
		content: '';
		position: absolute;
		left: 0;
		top: 0;
		width: 10px;
		height: 10px;
		border-radius: 5px;
		background-color: transparent;
		-webkit-transition: all 150ms ease-out;
				transition: all 150ms ease-out;
	}
	.radioContainer label:hover {
		border-color: var(--color-red);
	}
	input[type="radio"]:checked:after,
	.radioContainer label:hover input[type="radio"]:after {
		background-color: var(--color-red);
	}
	
	/*  x.x Summary
    -------------------------------------------------------------- */
    .summary {
        padding-top: 0;
        padding-bottom: 0;
        /*background-color: #f0f4f3;*/
        /*margin-bottom: 40px;*/
    }
    .summary .gridFrame {
        grid-template-columns: repeat(4, minmax(50px, 1fr));
        grid-gap: 0;
    }
	.summary .grid-item {
		grid-column: span 4;
	}	
	
    .summary .grid-item textblock {
        display: block;
        /*padding: 40px 0;*/
    }
   /* .summary .grid-item:not(.full) textblock {
        position: absolute;
        left: 50%;
        top: 50%;
        padding: 40px;
        width: 100%;
        -webkit-transform: translate(-50%,-50%);
                transform: translate(-50%,-50%);
    }*/
    .summary .grid-item textblock p/*:not(:last-of-type)*/,
	.summary .grid-item figure {
        margin-bottom: 24px;
    }
	
	.summary .grid-item.txt_1 {
		order: 1;
	}
	.summary .grid-item.img_1 {
		order: 2;
	}
	.summary .grid-item.txt_2 {
		order: 3;
	}
	.summary .grid-item.img_2 {
		order: 4;
	}
	
	
	.catList {
		line-height: 32px;
		margin-bottom: 32px;
	}
	.catList a {
		margin-left: 10px;
		display: inline;
		position: relative;
		padding-right: 25px;
	}
	.catList a i {
		display: block;
		position: absolute;
		right: 0;
		top: -5px;
		width: 20px;
		height: 20px;
		line-height: 20px;
		text-align: center;
		background-color: #d00;
		color: #fff;
	}

	/*  x.x producten
    -------------------------------------------------------------- */
	.producten .col {
		padding: 0;
	}
	
	/*.shop .gridFrame {
		grid-template-columns: repeat(6, minmax(100px, 1fr));
	}*/
	.producten .gridFrame {
		grid-gap: 15px;
	}
	.producten .grid-item {
		grid-column: span 1;
	}
	
    .producten:not(.noStuff) .grid-item,
	.producten .grid-item:not(.noStuff)	{
        background-color: var(--color-white);
        border: 1px solid #e8e8e8;
        padding: 5px;
        box-shadow: 0 1px 5px rgb(0 0 0 / 15%);
    }
	.producten .grid-item.noStuff	{
        background-color: var(--color-white);
        border: 0;
        padding: 0;
        box-shadow: none;
    }
    .producten figure a.img {
        /*background-color: #f0f4f3;*/
        display: block;
        width: 100%;
        padding-bottom: 100%;
        overflow: hidden;
        position: relative;
        margin-bottom: 15px;
    }
    .producten figure a.img span.offer {
        position: absolute;
        left: 10px;
        top: 10px;
        z-index: 1;
        background-color: var(--color-yellow);
        color: var(--color-black);
        border-radius: 4px;
        line-height: 24px;
        padding: 6px 12px;
        font-weight: 500;
        text-transform: uppercase;
        font-size: 15px;
        letter-spacing: 1px;
    }
    .producten figure a.img img {
        position: absolute;
        left: 50%;
        top: 50%;
        width: auto;
        height: auto;
        max-width: 100%;
        -webkit-transform: translate(-50%,-50%);
                transform: translate(-50%,-50%);
    }

    .producten figure h2 {
		position: relative;
		font-size: 20px;
		text-align: center;
		padding: 0 20px;
		padding-top: 20px;
		margin-bottom: 20px;
		line-height: 30px;
		min-height: 80px;
    }
    .producten figure h2:before {
        content: '';
        position: absolute;
        left: 50%;
        top: 0;
        width: 60px;
        margin-left: -30px;
        height: 3px;
        background-color: var(--color-yellow);
    }
    .producten figcaption {
        text-align: center;
		position: relative;
		padding-bottom: 90px;
    }
    .producten figure price {
        font-size: 21px;
        font-weight: 700;
        padding-right: 5px;
        line-height: 25px;
        margin-bottom: 5px;
        display: inline-block;
    }
	.producten .buttons {
		position: absolute;
		left: 5px;
		bottom: 5px;
		width: calc(100% - 10px);
	}
    .producten .buttons .info {
		display: block;
        line-height: 24px;
        padding: 8px 20px;
        background-color: #333;
		width: 100%;
        margin-bottom: 15px;
        color: #fff;
        text-align: center;
    }
    .producten .buttons button {
        padding: 4px 0;
        text-align: center;
        width: calc(100% - 125px);
		max-width: 64px;
        line-height: 24px;
        background-color: var(--color-yellow);
        float: right;
    }
	
	/*.producten figure.empty ~ .buttons form,
	.producten figure.empty + .buttons form	{
		display: none;
	}*/
	
	.prodIMG figure {
		/*float: left;*/
		overflow: hidden;
		width: 100%;
		max-width: /*420px*/240px;
		margin: 0 auto;
	}
	.prodIMG figure img {
		float: left;
		width: /*auto*/ 100%;
		height: 100%;
		max-height: 420px;
	}
    .product.single h1 {
        font-size: 36px;
        line-height: 50px;
        margin-bottom: 20px;
    }

    .tabLinks,
    .tabcontent {
        position: relative;
        border: 1px solid #ccc;
        padding: 10px 20px;
    }
    .tabcontent {
        margin-top: -1px;
    }
    .tabLinks {
        line-height: 0;
        font-size: 0;
        text-align: left;
    }
    .tabLinks a {
        display: inline-block;
        line-height: 24px;
        font-size: 16px;
        padding: 8px 10px;
        background-color: #efefef;
        color: #333;
        margin-right: 10px;
        text-transform: uppercase;
        font-weight: 500;
		width: calc(50% - 5px);
		text-align: center;
		margin-bottom: 10px;
    }
	.tabLinks a:nth-of-type(2) {
		margin-right: 0;
	}
	.tabLinks a:nth-of-type(3) {
		width: 100%;
		margin: 0;
	}
	
    .tabLinks a:hover,
    .tabLinks a.current {
        background-color: var(--color-yellow);
        color: #000;
    }

    .tabcontent {
        padding: 20px;
        background-color: #fff;
    }
    /* Style the tab */
    .tabcontent .tab {
        display: none;
    }
    .tabcontent .tab.current {
        display: block;
    }
    .product.single .WYSIWYG {
        padding-bottom: 0;
    }
    .tabcontent .tab.WYSIWYG h3 {
        font-size: 24px;
        margin-bottom: 10px;
        font-weight: 600;
    }

	.testimonial {
		margin: 0 20px 40px;
	}
	.testimonial .testimonial-content {
		padding: 35px 25px 35px 50px;
		background: #efefef;
		position: relative;
	}
	.testimonial .testimonial-content:before {
		content: "";
		position: absolute;
		bottom: -30px;
		left: 0;
		border-top: 15px solid #718076;
		border-left: 15px solid transparent;
		border-bottom: 15px solid transparent;
	}
	.testimonial-content .testimonial-icon {
		width: 50px;
		height: 45px;
		background: var(--color-sky);
		text-align: center;
		font-size: 22px;
		color: #fff;
		line-height: 42px;
		position: absolute;
		top: 37px;
		left: -19px;
	}

	.testimonial-content .testimonial-icon:before {
		content: "";
		border-bottom: 16px solid var(--color-denim);
		border-left: 18px solid transparent;
		position: absolute;
		top: -16px;
		left: 1px;
	}

	.testimonial .description {
		font-size: 15px;
		font-style: italic;
		color: #8a8a8a;
		line-height: 23px;
		margin: 0;
	}

	.testimonial .title {
		font-size: 24px;
		font-weight: 600;
		padding: 10px 14px;
		margin: 0 14px;
		margin-bottom: 0 !important;
		width: calc(100% - 28px);
		border-left: 1px solid #ccc;
	}

	.testimonial .post {
		display: block;
		font-size: 14px;
		color: var(--color-denim);
		margin: 0 14px;
		width: calc(100% - 28px);
		padding: 0 14px 10px;
		border-left: 1px solid #ccc;
		border-bottom: 1px solid #ccc;
	}

	.rate {
		float: left;
		height: 46px;
		padding: 0 10px;
	}
	.rate span {
		display: inline-block;
		line-height: 40px;
		margin-right: 15px;
		margin-right: 15px;
		float: left;
	}
	
	.rate:not(:checked) > input {
		position: absolute;
		width: 20px;
		height: 20px;
		opacity: 0;
		visibility: hidden;
	}
	.rate:not(:checked) > label {
		position: relative;
		z-index: 1;
		float: right;
		width: 1em;
		overflow: hidden;
		white-space: nowrap;
		cursor: pointer;
		font-size: 30px;
		color: #ccc;
	}
	.rate:not(:checked) > label:before {
		content: '★ ';
	}
	.rate > input:checked ~ label {
		color: #ffc700;    
	}
	.rate:not(:checked) > label:hover,
	.rate:not(:checked) > label:hover ~ label {
		color: #deb217;  
	}
	.rate > input:checked + label:hover,
	.rate > input:checked + label:hover ~ label,
	.rate > input:checked ~ label:hover,
	.rate > input:checked ~ label:hover ~ label,
	.rate > label:hover ~ input:checked ~ label {
		color: #c59b08;
	}

    .product.single price,
    .product.single label  {
        font-weight: 600;
    }
	.product.single .prijs {
		line-height: 20px;
		padding: 90px 0 0 0;
		padding-left: /*180px*/;
		position: relative;
		margin-bottom: 10px;
	}
    .product.single price {
        font-size: 26px;
        line-height: 42px;
        padding: 10px;
        display: inline-block;
        background-color: var(--color-yellow);
        /*margin: 20px 0;*/
        color: var(--color-white);
        border-radius: 5px 10px;
		width: 160px;
		overflow: hidden;
		text-align: center;
		
		position: absolute;
		left: 0;
		top: 25%;
		-webkit-transform: translateY(-50%);
		transform: translateY(-50%);
    }

    .product.single .quantity {
        max-width: 160px;
    }
    .product.single .quantity input[type="number"] {
        padding: 8px 50px;
        font-size: 16px;
    }
    .product.single .quantity-button {    
        width: 40px;
        font-size: 20px;
        line-height: 40px;
        height: 40px;
    }
    .product.single button {
        line-height: 24px;
        padding: 7px 20px;
        border: 2px solid var(--color-yellow);
		color: var(--color-yellow);
        background-color: transparent;
		margin: 10px 0 0 /*20px*/;
        font-size: 14px;
    }
    .product.single .share {
        padding: 20px 0;
        line-height: 32px;
        font-size: 16px;
    }
    .product.single .share a {
        display: inline-block;
        width: 32px;
        line-height: 32px;
        text-align: center;
        margin: 3px;
        background-color: #000;
        color: #fff;
    }
    .product.single .share a.mail {
        background-color: #343a40;
    }
    .product.single .share a.fb {
        background-color: #3b5998;
    }
    .product.single .share a.tw {
        background-color: #1da1f2;
    }
    .product.single .share a.pi {
        background-color: #bd081c;
    }
    .product.single .share a.in {
        background-color: #0077b5;
    }
    .product.single .share a.gPlus {
        background-color: #dc4e41;
    }
    .product.single .share a.reddit {
        background-color: #ff4500;
    }
    .product.single .share a.digg {
        background-color: #005be2;
    }
	
	.filters a {
		display: block;
		width: 100%;
		line-height: 20px;
		padding: 5px;
		padding-left: 40px;
		position: relative;
		color: #333;
	}
	.filters a:before {
		content: '';
		position: absolute;
		top: 8px;
		left: 8px;
		width: 14px;
		height: 14px;
		border: 1px solid #ccc;
		background-color: #fff;
		border-radius: 4px;
		-webkit-transition: all 200ms ease-out;
		transition: all 200ms ease-out;
	}
	.filters a:hover, 
	.filters a.active {
		color: var(--color-yellow);
	}
	.filters a:hover:before, 
	.filters a.active:before {
		background-color: var(--color-yellow);
		border-color: var(--color-yellow);
	}
	.pagination {
		padding-top: 40px;
		margin: 0 auto;
		text-align: center;
		font-size: 0;
		line-height: 0;
	}
	.pagination li {
		display: inline-block;
	}
	
	.pagination li.outside {
		display: block;
	}
	
	.pagination a, .pagination span {
		line-height: 40px;
		min-width: 40px;
		text-align: center;
		padding: 0 5px;
		font-size: 16px;
		display: block;
		color: var(--color-dark);
	}
	.pagination span {
		background-color: var(--color-dewberry);
		color: var(--color-white);
	}
	.pagination span.light {
		background-color: #ddd;
		color: var(--color-black);
	}
	
	summary {
		position: relative;
		outline: none;
		cursor: pointer;
		list-style: none;
		font-size: 16px;
		font-weight: 600;
		padding: 8px 20px;
		line-height: 24px;
		text-align: left;
		color: #fff;
		background-color: var(--color-dewberry);
		box-shadow: inset 0px 0px 0px 1px var(--color-white), 0px 0px 0px 5px var(--color-dewberry);
		-webkit-transition: all 200ms ease-in;
		-ms-transition: all 200ms ease-in;
		transition: all 200ms ease-in;
		margin-bottom: 15px;
	}
	details > summary::after {
		position: absolute;
		right: 20px;
		content: "+";
	}
		details[open] > summary::after {
		content: "-";
	}
	.faq_content {
		background-color: var(--color-white);
		box-shadow: inset 0px 0px 0px 1px var(--color-dewberry), 0px 0px 0px 5px var(--color-white);
		padding: 20px;
		margin-top: -15px;
		margin-bottom: 10px;
	}
	.faq_content p {
		font-size: 14px;
		line-height: 20px;
	}
	
	.mapsFrame {
		 border: 0;
		 height: /*400px*/200px;
	}
	
	
	section.padded {
		padding-top: 100px;
	}
	

/*  =================================================================
    x.0 HOME GRID
================================================================== */
	.customGrid {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		grid-template-rows: repeat(6, 1fr);
		grid-column-gap: 10px;
		grid-row-gap: 10px;
	}

	.cat-item {
		position: relative;
		overflow: hidden;
	}
	.cat-item._1 { 
		grid-area: 1 / 1 / 2 / 2; 
	}
	.cat-item._2 { 
		grid-area: 1 / 2 / 2 / 3; 
	}
	.cat-item._3 { 
		grid-area: 4 / 1 / 5 / 2; 
	}
	.cat-item._4 { 
		grid-area: 4 / 2 / 6 / 3; 
	}				
	.cat-item._4 a {
		padding-bottom: 120%;
	}
	.cat-item._5 { 
		grid-area: 2 / 1 / 4 / 3; 
	}
	.cat-item._6 { 
		grid-area: 5 / 1 / 6 / 2; 
	}				
	.cat-item._6 img {
		top: 58%;
		max-width: 110%;
	}
	.cat-item._7 { 
		grid-area: 6 / 1 / 7 / 2; 
	}
	.cat-item._8 { 
		grid-area: 6 / 2 / 7 / 3; 
	}
	
	.cat-item a {
		position: relative;
		display: block;
		width: 100%;
		height: 100%;
		padding-bottom: 60%;
		overflow: hidden;
	}
	.cat-item img {
		position: absolute;
		width: auto;
		min-height: 100%;
		max-width: 130%;
		left: 50%;
		top: 50%;
		-webkit-transform: translate(-50%,-50%);
				transform: translate(-50%,-50%);
	}
	.cat-item .caption {
		position: absolute;
		left: 10px;
		bottom: 10px;
		z-index: 1;
		line-height: 20px;
		padding: 10px 15px;
		background-color: rgba(0,0,0,0.35);
		color: #fff;
		font-size: 15px;
	}

/*  =================================================================
    x.0 FOOTER
================================================================== */
    footer img.beeFlower {
        position: absolute;
        left: 75px;
        top: -260px;
        max-width: 250px;
        z-index: -1;
        -webkit-transform: rotate(-10deg);
        transform: rotate(-10deg);
    }
	footer img.beeFlower.ZW {
		top: auto;		
		left: 215px;
		bottom: -90px;
		max-width: 220px;
		
        z-index: 2;
		opacity: 0.65;
    }
	
	footer, 
    footer p {
        font-size: 15px;
        line-height: 30px;
    }
	footer ul:not(:last-of-type),
	footer p:not(:last-of-type) {
		margin-bottom: 20px;
	}
    footer {
		padding-left: 15px;
		padding-right: 15px;
        background-color: #252628;
        color: #bbbbbb;
    }
    
    footer > .row:first-of-type {
        padding: 60px 0 30px 0;
    }
    footer > .row:last-of-type {
        padding: 10px 0;
        text-align: center;
    }
    footer .logo-link {
        max-width: 294px;
        margin-bottom: 16px;
    }

    footer a,
    footer h2,
    footer h3,
    footer strong,
    footer .superBlocks {
        color: #fff;
    }

    footer > .row:last-of-type,
    footer > .row:last-of-type a {
        color: #aaaaaa;
    }
	
	footer .superBlocks a,
    footer .superBlocks strong {
        font-weight: 700;
    }	
	
    footer h2,
    footer h3 {
        font-size: 20px;
		line-height: 30px;
        margin-bottom: 0;
		text-transform: uppercase;
		font-style: normal;
		font-weight: normal;
    }
	footer h2 em {
		font-style: normal;
    }

    footer ul a {
        color: #bbbbbb;
    }

    footer ul li {
        position: relative;
        padding: 3px 0 3px 17px;
        list-style: none;
    }
    footer ul li:before {
        content: "\f054";
        font-weight: 700;
        font-family: 'Font Awesome 5 Free';
        left: 0;
        margin-right: 5px;
        position: absolute;
        top: 3px;
        font-size: 10px;
        margin-top: 0!important;
    }

    footer .line:before {
        border-color: #3b3c3f;
    }

    footer .superBlocks {
        font-style: normal;
    }
    
    footer .superBlocks .gridFrame {
        grid-gap: 0;
    }
    footer .superBlocks .grid-item {
        padding: 23px 30px;
    }

    footer .superBlocks a,
    footer .superBlocks strong {
        font-size: 110%;
    }
    footer .superBlocks a,
    footer .superBlocks strong,
    footer .superBlocks span {
        display: block;
        padding-left: 68px;
    }
    footer .superBlocks span {
        line-height: 1;
        opacity: .6;
        margin-top: 2px;
    }
    footer .swm_cf_icon {
        background: rgba(255,255,255,.15);
        width: 48px;
        height: 48px;
        text-align: center;
        line-height: 48px;
        border-radius: 100%;
        font-size: 20px;
        
        position: absolute;
        left: 30px;
        top: 24px;
    }
    footer .swm_cf_icon i {
        font-style: normal;
        font-weight: normal;
    }

	footer .blackFtr {
		background-color: black;
		z-index: 2;
		width: calc(100% + 30px);
		margin-left: -15px;
		padding: 0 15px !important;
	}

/*  =================================================================
    MEDIA QUERIES
================================================================== */
/* MOBILE */
@media only screen and (min-width: 572px) { 

	nav.sticky {
		top: -50px;
	}

	nav .bgDark .hdr-left a,
	nav .bgDark .hdr-left a:last-of-type {
		width: 33.33333%;
	}
	.item {
        max-width: 50%;
    }

	header {
		margin-top: 170px;
	}

	header img {
		height: auto;
		min-height: 100%;
		max-width: 110%;
	}
	.home header img {
		height: 100%;
		max-width: none;
	}
	
	.customGrid {
		grid-template-columns: repeat(3, 1fr);
		grid-template-rows: repeat(4, 1fr);
	}
	
	.cat-item._1 { 
		grid-area: 1 / 1 / 2 / 2; 
	}
	.cat-item._2 { 
		grid-area: 1 / 2 / 2 / 3; 
	}
	.cat-item._3 { 
		grid-area: 3 / 3 / 4 / 4; 
	}
	.cat-item._4 { 
		grid-area: 1 / 3 / 3 / 4; 
	}
	.cat-item._5 { 
		grid-area: 2 / 1 / 4 / 3; 
	}
	.cat-item._6 { 
		grid-area: 4 / 1 / 5 / 2; 
	}
	.cat-item._7 { 
		grid-area: 4 / 2 / 5 / 3; 
	}
	.cat-item._8 { 
		grid-area: 4 / 3 / 5 / 4; 
	}
	.cat-item .caption {
		font-size: 16px;
	}
	
	.tabLinks a {
        padding: 8px 20px;
		margin: 0;
        margin-right: 20px;
		width: auto;
    }
	.tabLinks a:nth-of-type(2) {
		margin-right: 20px;
	}
	.tabLinks a:nth-of-type(3) {
		width: auto;
		margin: 0;
	}
	
	footer img.beeFlower.ZW {
		left: 75px;
		bottom: -175px;
        max-width: 240px;
    }
	
}

@media only screen and (min-width: 572px) and (orientation: landscape) { }

/* IPADS portrait */
@media only screen and (min-width: 768px) and (min-height: 600px) {

	.summary .grid-item {
		grid-column: span 2;
	}
	.summary .grid-item.txt_2 {
		order: 4;
	}
	.summary .grid-item.img_2 {
		order: 3;
	}
	.summary .grid-item.txt_1 textblock {
		padding-right: 20px;
	}
	.summary .grid-item.txt_2 textblock {
		padding-left: 20px;
	}

}

/* IPADS landscape AND mini laptops */
@media only screen and (min-width: 960px) {
	.w67 {
		max-width: 66.66667%;
	}
	
    .twoToned:before,
    .twoToned:after {
        content: '';
        position: absolute;
        top: 0%;
        width: 100%;
        height: 100%;
    }
    .twoToned:before {
        left: 100%;
        background-color: #252628;
    }
    .twoToned:after {
        right: 100%;
    }
	
	.twoToned:after,
	nav .twoToned .hdr-left:before,
    nav .twoToned .hdr-left:after,
	.steps li:before,
	.steps li:after {
        background-color: var(--color-grey-5b);
	}	
    nav .twoToned .hdr-left:before,
    nav .twoToned .hdr-left:after,
	.steps li:before,
	.steps li:after	{
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: calc(100% + 10px);
        height: 100%;
        transform: skew(-26deg);
    }
    nav .twoToned .hdr-left:before,
	.steps li:before {
        left: -20px;
    }
    nav .twoToned .hdr-left:after,
	.steps li:after	{
        left: calc(100% - 15px);
        max-width: 9px;
        background-color: var(--color-grey-32);
    }
	nav .hdr-left,
    nav .hdr-right {
        padding: 5px 10px;
    }
	nav .hdr-left,
    nav .hdr-right {
        max-width: 50%;
		text-align: left;
    }
	
	nav .hdrBtm .hdr-left {
		max-width: 35%;
	}
	nav .hdrBtm .hdr-right {
		max-width: 65%;
	}
	
	nav .hdr-left,
	nav .twoToned .hdr-left {
		background-color: transparent;
	}
    
    nav .btmRow .hdr-left {
        max-width: 360px;
    }
    nav .btmRow .hdr-right {
        max-width: calc(100% - 360px);
    }
	
	nav .row .twoToned .hdr-left a:first-of-type {
        margin-right: 34px;
    }
    
	nav .bgDark .hdr-left > span, 
	nav .bgDark .hdr-right > span {
		padding: 0;
		float: none;
		width: 100%;
		display: block;
	}
    nav .hdr-right span {
		text-align: right;
    }
	nav .hdr-right span label {
		display: inline;
    }	

    nav .btmRow .hdr-left, 
    nav .btmRow .hdr-right {
        padding: 24px 0 24px 0;
        -webkit-transition: padding .3s ease-out;
                transition: padding .3s ease-out;
    }
    nav .btmRow .hdr-left {
        padding: 19px 0 19px 0;
    }
	
	nav .bgDark a, 
	nav .bgDark .hdr-left a:last-of-type {
		float: none;
		width: auto;
	}
	nav .bgDark .hdr-left a {
		margin-right: 10px;
	}
	nav .bgDark .hdr-left a:last-of-type {
		margin: 0;
	}
	
	nav .bgDark .hdr-right a {
		margin-left: 10px;
	}
	nav .bgDark .hdr-right a:first-of-type {
		margin-left: 0;
	}	
	nav .bgDark a.bgYellow {
		margin-left: 10px;
		width: auto;
	}
	nav .hdrSrch {
		top: 2px;
		width: 84%;
	}
	
	nav.sticky {
        top: 0;
    }
	nav .logo-link {
        max-width: none;
		padding: 0;
		
    }
	
    .xtraLinks {
		margin-top: 13px;
		/*margin-right: 0;*/
    }
	
	header {
		margin-top: 104px;
		height: 175px;
	}
	.home header {
		height: 375px;
	}
	
	header article text {
		max-width: 30%;
		padding-top: 75px;
		padding-left: 0;
	}	
	header article h2 {
		font-size: 30px;
		line-height: 40px;
    }
    header article a {
        padding: 13px 32px;
	}	
	
	header article figure.temp {
		margin-top: 0;
		max-width: 240px;
		padding-bottom: 260px;
		position: relative;
		overflow: hidden;
	}
	header article figure.temp img {
	    position: absolute;
		left: 50%;
		top: 50%;
		width: auto;
		max-width: 260px;
		-webkit-transform: translate(-50%,-50%);
				transform: translate(-50%,-50%);
	}
	.mobFilters {
		display: block;
		position: relative;
		left: auto;
		top: auto;
		height: auto;
		min-height: 10px;
		-webkit-transform: translateY(0);
		transform: translateY(0);
		filter: none;
		overflow-y: none;
		z-index: 0;
		
		background: rgb(255,255,255);
		background: -moz-linear-gradient(180deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0.6867121848739496) 56%, rgba(255,255,255,0) 100%);
		background: -webkit-linear-gradient(180deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0.6867121848739496) 56%, rgba(255,255,255,0) 100%);
		background: linear-gradient(180deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0.6867121848739496) 56%, rgba(255,255,255,0) 100%);
		filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff",endColorstr="#ffffff",GradientType=1);		
	}

	.item {
		max-width: 33.33333%;
	}	
	
	.steps {
		overflow: hidden;
	}
	.steps:before,
	.steps:after {
		display: none;
	}
	.steps li,
	.steps li.passed,
	.steps li.current {
		background-color: transparent;
	}
	.steps li {
		padding: 20px;
		width: 20%;
	}
	.steps.search li,
	.steps._4 li {
		width: 25%;
	}
	.steps li:not(:first-of-type) {
		padding-left: 40px;
		margin-left: -20px;
	}
	.steps li em {
		display: block;
	}
	.steps li span {
		font-size: 20px;
		line-height: 23px;
	}
	
    .shoppingCart li.foot {
        padding-top: 20px;
    }
    .shoppingCart li span:nth-of-type(1n) {
        max-width: calc(82.5% - 2px);
    }
    .shoppingCart li span:nth-of-type(2n),
    .shoppingCart li.foot span:nth-of-type(2n),
    .shoppingCart li.itemP span:nth-of-type(2n),
    .shoppingCart li.sum span:nth-of-type(1n),
    .shoppingCart li.total span:nth-of-type(1n) {
        max-width: calc(17.5% - 2px);
    }
	.shoppingCart li span strong {
        display: inline-block;
		float: left;
    }
    .shoppingCart li span em {
        max-width: 125px;
    }
	.shoppingCart li span strong,
	.shoppingCart li span label {
        max-width: calc(100% - 125px);
    }
	.shoppingCart li span em.hlf + label {
		width: 50%;
        max-width: calc(50% - 125px);
    }
	.shoppingCart .button {
		width: 40%;
		margin-right: 20%;
	}
	.shoppingCart .button.right {
		margin-top: 0;
		margin-right: 0;
	}
	#prijsContainer {
		padding-bottom: 0;
		max-width: 32%;
		position: absolute;
		top: 0;
		right: 0;
	}
	
	.contentBox {
		order: 1;
		position: relative;
		z-index: 2;
	}
	.noGap .bgDarkGrey {
		order: 2;
	}
	.contentBox text {
		padding: 30px;
	}
	td.mobileFull {
		display: table-cell;
		width: auto;
	}	
	td.noMobile {
		width: 50px;
	}
	
	.pagination li.outside {
		display: inline-block;
	}
	
	.ordersList li.xl50 {
		width: 100%;
		max-width: calc(50% - 10px);
		float: left;
		margin-right: 9px;
	}
	.ordersList li.xl50:last-of-type {
		margin-right: 0;
		margin-left: 9px;
	}	
	
	.prodIMG figure {
		float: left;
		max-width: 420px;
		margin: 0;
	}
	.prodIMG figure img {
		width: 100%;
		height: auto;
		max-height: 420px;
	}
	
	.summary .grid-item textblock {
        padding: 40px 0;
    }
   .summary .grid-item:not(.full) textblock {
        position: absolute;
        left: 50%;
        top: 50%;
        padding: 40px;
        width: 100%;
        -webkit-transform: translate(-50%,-50%);
                transform: translate(-50%,-50%);
    }
	.summary .grid-item textblock p:last-of-type,
	.summary .grid-item figure {
		margin-bottom: 0;
	}
	
    footer {
		padding-left: 0;
		padding-right: 0;
    }
	footer > .row:first-of-type {
		padding: 100px 0 66px 0;
	}
    footer > .row:last-of-type {
        padding: 25px 0;
    }
	
    footer h3 {
        margin-bottom: 0px;
    }
    footer ul {
        margin-bottom: 20px;
    }
    
}
/* SMALL SCREENS */
@media only screen and (min-width: 1152px) {
	.customGrid {
		grid-template-columns: repeat(4, 1fr);
		grid-template-rows: repeat(3, 1fr);
	}
	.cat-item._1 {
		grid-area: 1 / 1 / 2 / 2;
	}
	.cat-item._2 {
		grid-area: 1 / 2 / 2 / 3;
	}
	.cat-item._3 {
		grid-area: 1 / 3 / 2 / 4;
	}
	.cat-item._4 {
		grid-area: 1 / 4 / 3 / 5;
	}
	.cat-item._5 {
		grid-area: 2 / 1 / 4 / 3;
	}
	.cat-item._6 {
		grid-area: 2 / 3 / 3 / 4;
	}
	.cat-item._7 {
		grid-area: 3 / 3 / 4 / 4;
	}
	.cat-item._8 {
		grid-area: 3 / 4 / 4 / 5;
	}
}

/* SMALL SCREENS */
@media only screen and (min-width: 1280px) {
    
	nav .hdrSrch {
		top: 0px;
		width: 86%;
	}
	.home header img {
		height: auto;
		max-width: 110%;
	}
	
	.shopFormContainer {
		padding: 30px 40px;
	}
	
	.product.single .prijs {
		padding: 25px 0 0 180px;
		margin-bottom: 20px;
	}
	.product.single price {
		top: 50%;
	}
	.product.single button {
		margin: 0 0 0 20px;
	}

    footer .superBlocks .gridFrame {
        grid-template-columns: repeat(6, minmax(100px, 1fr));
    }
	.gridFrame.full {
        grid-template-columns: repeat(4, minmax(100px, 1fr));
    }
    
}

/* WEIRD HEADER TEXT BREAKPOINT ~ must be paddings or margins */
@media only screen and (min-width: 1340px) { }

/* SMALL SCREENS */
@media only screen and (min-width: 1440px) {
	.home header {
		height: 475px;
	}
	header img {
		max-width: 100%;
	}
	header article figure.temp {
		max-width: 240px;
		padding-bottom: 300px;
	}
	header article figure.temp img {
		max-width: 300px;
	}
}

/*  =================================================================
    HOVER STATES
================================================================== */
@media (any-hover: hover) {
    
	#mainNAV li.dist {
		display: none;
	}
	
	
	.mob-btn,
	.mobFilterBtn {
		display: none !important;
	}
	nav .logo-link {
        -webkit-transform: scale(1); 
                transform: scale(1);
		padding: 5px 0;
    }
    nav .logo-link img {
        width: auto;
		height: 60px;
    }	
	#mainNAV {
        position: relative;
        left: auto;
        top: auto;
        width: 100%;
        max-width: calc(100% - 85px);
        padding: 10px 0;
        margin: 0;
        float: left;
        height: auto;
        box-shadow: none;
        -webkit-transform: translateX(0);
        transform: translateX(0);
        text-align: right;
    }
	#mainNAV a.closeBtn,
	#mainNAV label,
	#mainNAV:after {
		display: none;
    }
	
	#mainNAV ul {
		padding: 5px 0;
		position: relative;
		left: auto;
		top: auto;
		width: 100%;
		height: 100%;
		overflow: hidden;
	}
	
    #mainNAV li {
		width: auto;
        padding: 0 19px;
		border-bottom: 0;
    }
    #mainNAV li:not(:last-of-type):after {
        content: '';
        position: absolute;
        right: -1px;
        top: 50%;
        height: 12px;
        width: 1px;
        margin-top: -6px;
        background: #6d6d6d;
        display: block;
    }
    #mainNAV a,
    #mainNAV a:before {
        -webkit-transition: all .3s ease-out;
                transition: all .3s ease-out;
    }
    #mainNAV a {
        font-size: 15px;
        line-height: 42px;
        text-transform: uppercase;
		padding: 0;
    }
    #mainNAV a:before {
        content: '';
        position: absolute;
        left: 0;
        top: 27px;
        width: 0;
        height: 2px;
        display: block;
    }
    #mainNAV li.active a {
        color: #000000;
    }
    #mainNAV li.active a:before {
        width: 100%;
        background-color: #000000;
    }
    #mainNAV li.active a.tip {
        color: var(--color-yellow);
    }
    #mainNAV li.active a.tip:before {
        width: 100%;
        background-color: var(--color-yellow);
    }	
    .xtraLinks {
		margin-right: 0;
    }
	
	header a.distriBtn {
		display: block;
		font-size: 18px;
		font-weight: 600;
		padding: 20px 30px;
	}
	
	
	a, button {
        cursor: pointer;
        -webkit-transition: all 200ms ease-in;
                transition: all 200ms ease-in;
    }
    #mainNAV li a:hover {
        color: #000000;
    }
    #mainNAV li a:hover:before {
        width: 100%;
        background-color: #000000;
    }
	
    #mainNAV li a.tip:hover {
        color: var(--color-yellow);
    }
    #mainNAV li a.tip:hover:before {
        background-color: var(--color-yellow);
    }
	
	#options span:hover:before {
        max-width: calc(100% - 26px);
        opacity: 0.05;
    }
	.item .buttons a:hover:before,
	.item .buttons form.mini button:hover:before {
        max-width: calc(100% - 5px);
        opacity: 0.25;
    }
	.WYSIWYG form ul.selector > li:hover:after {
		content: '\022A4';
	}
	.WYSIWYG form ul.selector > li:hover ul	{
		display: block;
	}
	.WYSIWYG form ul.selector li ul li:hover {
		cursor: pointer;
		background-color: var(--color-grey-66);
		color: var(--color-white);		
	}
	.WYSIWYG form ul.selector li ul li:hover label {
		color: var(--color-white);		
	}
	.shoppingCart .button:hover {
		background-color: var(--color-red);
		color: var(--color-white);
	}
	.shoppingCart .button.right:hover {
		background-color: var(--color-white);
		border-color: var(--color-blue);
		color: var(--color-blue);
	}
    
}