/*  =================================================================
    0.0 :ROOT ~ overwrites or extras (if needed)
================================================================== */
    :root {
        --row-width: 1170px; /* max-width */
        --font-main: 'Roboto', 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-red: #d83030;
		--color-green: #4fd966;
		--color-blue: #2A338F;
    }

/*  =================================================================
    1.0 STANDARDS
================================================================== */
    .clear, .clearall, .clearfix {
        clear: both;
    }

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

	@font-face {
		font-family: Flaticon;
		src: url(../fonts/flaticon.woff2) format("woff2"),
			 url(../fonts/flaticon.woff) format("woff");
		font-weight: 400;
		font-style: normal;
		font-display: swap
	}

	@media screen and (-webkit-min-device-pixel-ratio:0) {
		@font-face {
			font-family: Flaticon;
			src: url(../fonts/flaticon.svg#Flaticon) format("svg")
		}
	}
	[class*=" swm-fi-"]:after,
	[class*=" swm-fi-"]:before,
	[class^=swm-fi-]:after,
	[class^=swm-fi-]:before {
		font-family: Flaticon
	}
	.swm-fi-search:before {
		content: "\f100"
	}
	.swm-fi-phone-call:before {
		content: "\f101"
	}
	.swm-fi-envelope:before {
		content: "\f102"
	}
	.swm-fi-placeholder:before {
		content: "\f103"
	}
	.swm-fi-house:before {
		content: "\f104"
	}
	.swm-fi-next:before {
		content: "\f105"
	}
	.swm-fi-next-1:before {
		content: "\f106"
	}
	.swm-fi-back:before {
		content: "\f107"
	}
	.swm-fi-like:before {
		content: "\f108"
	}
	.swm-fi-heart:before {
		content: "\f109"
	}
	.swm-fi-share:before {
		content: "\f10a"
	}
	.swm-fi-shopping-cart:before {
		content: "\f10b"
	}
	.swm-fi-avatar:before {
		content: "\f10c"
	}
	.swm-fi-edit:before {
		content: "\f10d"
	}
	.swm-fi-star:before {
		content: "\f10e"
	}
	.swm-fi-musical-note:before {
		content: "\f10f"
	}
	.swm-fi-link:before {
		content: "\f110"
	}
	.swm-fi-shopping-bag:before {
		content: "\f111"
	}
	.swm-fi-cancel:before {
		content: "\f112"
	}
	.swm-fi-chat:before {
		content: "\f113"
	}
	.swm-fi-chat-1:before {
		content: "\f114"
	}
	.swm-fi-monitor:before {
		content: "\f115"
	}

	.bgDark {
		background-color: #191a1c;
	}
	.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;
	}
	.bgBlue,
	a.bgBlue, 
	.panel.bgBlue a {
		color: #ffffff;
	}
	.panel a {
		text-decoration: underline;
	}
	.bgBlue {
		background-color: var(--color-blue);
		border-color: var(--color-white);
	}
	.panel.alert, .panel.notice, .panel.success, .panel.bgBlue {
		text-align: center;
	}

	/*.w67 {
		max-width: 66.66667%;
	}*/
	

/*  =================================================================
    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;
    }
	
	nav .hdr-right span label {
        display: none;
    }
	nav .twoToned .hdr-left {
		background-color: var(--color-grey-5b);
	}

/*  x.x Logo Link
    -------------------------------------------------------------- */
    .logo-link {
        width: 100%;
        display: block;
        height: auto;
        float: left;
    }
    nav .logo-link {
        max-width: 294px;
        -webkit-transform: scale(0.2683); 
                transform: scale(0.2683);
        -webkit-transform-origin: center;
                transform-origin: center;
        -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;
        padding: 40px 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: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 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 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:not(:last-of-type) {
		border-bottom: 1px solid #ccc;
	}

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

/*  x.x NAV cart
    -------------------------------------------------------------- */
    .xtraLinks {
        float: right;
        position: relative;
        padding: 19px 0 21px 0;
		margin-top: -82px;
		margin-right: 60px;
    }
    .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;
    }

    .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;
    }
    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;	
    }
    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: 90px;
        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: 21px;
		display: block;
		width: 40px;
		height: 40px;
		border-radius: 50%;
		border: 1px solid #6d6d6d;
	}
	.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: 0;
		width: 100%;
		height: 100%;
		background-color: #fff;
		z-index: 1;
		padding: 40px;
	}
	nav .hdrSrch input {
		float: left;
		width: calc(100% - 40px);
		display: block;
		height: 26px;
		line-height: 26px;
		border-bottom: 1px solid #ccc;
	}
	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;
		border-radius: 40xp
	}
	

/*  =================================================================
    4.0 HEADER
================================================================== */
	header {
		overflow: hidden;
        margin-top: 157px;
	}
	header {
		height: 86px;
		overflow: hidden;
        border-bottom: 2px solid var(--color-grey-32);
	}
	header img {
		position: absolute;
		left: 50%;
		top: 50%;
		-webkit-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		width: auto;
	}


/*  =================================================================
    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 {
        font-family: 'Fira Sans', sans-serif;
        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;
    }  
	
	.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: 14px;
        line-height: 21px;
    }
    .WYSIWYG p:not(:last-of-type),
    .WYSIWYG ul:not(:last-of-type),
    .WYSIWYG ol:not(:last-of-type) {
        margin-bottom: 21px;
    }
    .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 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;
    }
	
	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-red);
        color: var(--color-grey-66);
        font-size: 16px;
        text-transform: uppercase;
        text-indent: 2px;
        letter-spacing: 2px;
        background-color: #fff;
        padding: 10px;
        cursor: pointer;
        border-radius: 3px;
    }
    .WYSIWYG form.searchBar button {
		border: 0;
        border-left: 2px solid var(--color-orange-dark);
    }
    .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;
	}

	.tab {
		width: 100%;
		border-bottom: 1px solid var(--color-light);
	}
	.tab button {
		background-color: #fff;
		float: left;
		width: 50%;
		border: none;
		outline: none;
		cursor: pointer;
		padding: 0 30px;
		text-align: left;
		color: var(--color-yellow);
		font-size: 17px;
		line-height: 52px;
		height: 52px;
		border-bottom: 3px solid transparent;
	}
	.tab button.active {
		font-weight: 500;
		border-bottom-color: var(--color-yellow);
	}

	.tabcontent {
		display: none;
		padding: 30px 0 15px 0;
	}
	.tabcontent.active {
		display: block;
	}
	.tabcontent ul li {
		position: relative;
		padding-left: 23px;
		line-height: 23px;
		text-indent: 0;
	}
	.tabcontent ul li:not(:last-of-type) {
		margin-bottom: 10px;														
	}
	.tabcontent ul li:before {
		content: '¬';
		line-height: 23px;
		width: 23px;
		position: absolute;
		left: 0;
		top: 0;
	}
	
	.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;
	}

    .quantity {
        position: relative;
        display: inline-block;
        float: left;
        max-width: 100px;
        margin-right: calc(100% - 250px);
        margin-bottom: 20px;
        border-radius: 3px;
        overflow: hidden;
    }
    .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;
    }
    input[type=number] {
        -moz-appearance: textfield;
    }
    .quantity input:focus {
        outline: 0;
    }
    .quantity-nav {
        position: absolute;
        top: 0;
        right: 0;
        height: 100%;
    }
    .quantity-button {
        position: relative;
        cursor: pointer;
        width: 20px;
        text-align: center;
        background-color: #666;
        color: #fff;
        font-size: 13px;
        line-height: 1.7;
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%);
        -webkit-user-select: none;
           -moz-user-select: none;
            -ms-user-select: none;
             -o-user-select: none;
                user-select: none;
        -webkit-transition: background 150ms ease-in, color 150ms ease-in;
            -ms-transition: background 150ms ease-in, color 150ms ease-in;
                transition: background 150ms ease-in, color 150ms ease-in;
    }
    .quantity-button.quantity-up {
        position: absolute;
        height: 50%;
        top: 0;
        border-bottom: 1px solid var(--color-grey-eb);
    }
    .quantity-button.quantity-down {
        position: absolute;
        bottom: 0;
        height: 50%;
    }	

	/*  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-blue);
		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-blue);
    }

	.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-red);
	}
	.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-red);
	}	
	.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 li.passed,
	.steps li.current {
		background-color: var(--color-red);
	}	
	.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: 18px;
		line-height: 21px;
		letter-spacing: 1px;
	}
	.steps li em {
		font-style: normal;
		display: none;
	}
	.steps li.passed:before,
	.steps li.current:before  {
		background-color: var(--color-red);
		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;
    }
    .shoppingCart span {
        width: 100%;
        float: left;
        display: block;
        min-height: 26px;
        border: 0;
        margin: 1px;
        padding: 5px;
        position: relative;
    }
    .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-red);
		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-red);
		-webkit-transition: all 300ms ease-in;
				transition: all 300ms ease-in;
	}
	.shoppingCart .button.right {
		margin-top: -100px;
		margin-right: 0;
		background-color: var(--color-blue);
		border-color: var(--color-blue);
		color: var(--color-white);
	}
	
	#prijsContainer {
		width: 100%;
		position: relative;
		padding-bottom: 65px;
	}

	form.searchBar {float: left;width: 100%;padding: 30px; background-color: var(--color-orange-dark);}
	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;}
	form.searchBar button {float: left; width: 300px; height: 42px; background-color: #efefef;}
	
	.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;
	}
	.noGap .bgDarkGrey {
		order: 1;
	}
	.contentBox {
		box-shadow: 0px 0px 40px 0px rgb(0 0 0 / 10%);
		order: 2;
	}
	.contentBox text,
	aside.myH2Y {
		display: block;
		padding: 30px 15px;
		position: relative;
	}
	aside.myH2Y {
		padding: 30px;
		color: var(--color-white);
	}
	
	.myH2Y ul ul,
	.myH2Y li.link {
		padding-left: 20px;
	}
	.myH2Y li {
		position: relative;
	}
	.myH2Y li.link:before,
	.myH2Y li li:before {
		content: '\025F9';
		position: absolute;
		left: -20px;
		top: 0;
		line-height: 21px;
		text-align: center;
		color: var(--color-white);
	}
	.myH2Y li.link:before {
		left: 0px;
	}

	table.lines {
		font-size: 13px;
	}
	table.lines .orderLines {
		display: none;
	}
	table.lines .orderLines.showed {
		display: table-row;
	}
	td.mobileFull {
		display: block;
		width: 100%;
	}	
	td.noMobile {
		width: 0px;
	}
	
	.ordersList {
		font-size: 12px;
	}
	.ordersList li span {
		text-align: left;
		line-height: 15px;
		font-weight: normal;
		display: block;
		width: 100%;
		float: left;
		padding: 5px;
		margin: 1px;
		font-size: 13px;
	}
	.ordersList li.head {
		display: block;
		padding: 1px;
	}
	.ordersList li.head span {
		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;
		display: block;
		width: 100%;
		padding: 5px;
		margin: 0;
	}										
	.ordersList li li.head span,										
	.ordersList li li.lightGrey span {
		background-color: #ebebeb;
		color: #666;
	}
	.ordersList li.head span:nth-of-type(1n) {
		max-width: none;
	}
	.ordersList li.blue span {
		background-color: var(--color-blue);
		color: #fff;
	}
	.ordersList li span:nth-of-type(1n) {
		max-width: 25px;
	}
	.ordersList li span:nth-of-type(2n) {
		max-width: calc(29% - 29px);
	}
	.ordersList li span:nth-of-type(3n) {
		max-width: calc(71% - 59px);
		}
	.ordersList li span:nth-of-type(4n) {
		max-width: 55px;
	}
	.ordersList ul {
		margin: 2px;
		display: none;
		border: 1px solid #666;
		padding: 4px;
	}
	.ordersList ul.showed,
	.ordersList ul ul {
		display: block;
	}
	.ordersList ul ul {
		border: 0;
		padding: 0;
		margin: 0;
	}
	.ordersList ul ul li span:nth-of-type(1n) {
		max-width: calc(100% - 183px);
	}
	.ordersList ul ul li.full span:nth-of-type(1n) {
		max-width: none;
	}
	.ordersList ul ul li span:nth-of-type(2n) {
		max-width: 50px;
	}
	.ordersList ul ul li span:nth-of-type(3n) {
		max-width: 55px;
	}
	.ordersList ul ul li span:nth-of-type(4n) {
		max-width: 70px;
		text-align: right;
	}
	.ordersList li li.lightGrey span {
		font-weight: 600;
	}
	.ordersList p {
		padding: 4px;
	}
	.ordersList li.borderTop {
		margin-top: 5px;
		border-top: 1px solid #000;
		padding-top: 5px;
	}
	.ordersList ul ul li.prijs span {
		text-align: right;
	}
	.ordersList ul ul li.prijs span:nth-of-type(1n) {
		max-width: calc(100% - 74px);
	}
	.ordersList ul ul li.prijs span:nth-of-type(2n) {
		max-width: 70px;
	}
	
	.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.0 FOOTER
================================================================== */
    footer, 
    footer p {
        font-size: 15px;
        line-height: 30px;
    }
    footer {
		padding-left: 15px;
		padding-right: 15px;
        background-color: #252628;
        color: #bbbbbb;
    }
    
    footer > .row:first-of-type {
        padding: 60px 0 0 0;
    }
    footer > .row:last-of-type {
        padding: 10px 0;
        text-align: center;
    }
    footer .logo-link {
        max-width: 294px;
        margin-bottom: 16px;
    }

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

    footer > .row:last-of-type,
    footer > .row:last-of-type a {
        color: #aaaaaa;
    }

    footer h3,
    footer .superBlocks a,
    footer .superBlocks strong {
        font-family: 'Fira Sans', sans-serif;
        font-weight: 700;
    }

    footer h3 {
        font-size: 20px;
        margin-bottom: 25px;
    }

    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,.05);
        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;
    }


/*  =================================================================
    HOVER STATES
================================================================== */
@media (any-hover: hover) {
    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;
    }
	
	#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);
	}
    
}


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

	.item {
        max-width: 50%;
    }

}

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

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

/* 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 0;
    }
	nav .hdr-left {
        max-width: 330px;
		text-align: left;
    }
	nav .hdr-left,
	nav .twoToned .hdr-left {
		background-color: transparent;
	}
	
	
	nav .row .twoToned .hdr-left a:first-of-type {
        margin-right: 34px;
    }
    nav .logo-link {
        -webkit-transform: scale(1); 
                transform: scale(1);
    }
    nav .hdr-right {
        max-width: calc(100% - 330px);
    }
    nav .hdr-right span {
        float: right;
    }
	nav .hdr-right span label {
		display: inline;
    }	

    nav .btmRow .hdr-left, 
    nav .btmRow .hdr-right {
        padding: 13px 0 12px 0;
        -webkit-transition: padding .3s ease-out;
                transition: padding .3s ease-out;
    }
	nav.sticky {
        top: -50px;
        box-shadow: 0 0 30px rgba(0, 0, 0, 0.2);
    }
	
	#mainNAV {
		position: relative;
		left: auto;
		top: auto;
		width: auto;
		max-width: none;
        padding: 19px 0 21px;
        margin: 0 -20px;
        float: left;
		height: auto;
		box-shadow: none;
		-webkit-transform: translateX(0);
				transform: translateX(0);
    }
	#mainNAV a.closeBtn,
	#mainNAV label,
	#mainNAV:after {
		display: none;
    }
    #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;
    }
	
    .xtraLinks {
		margin-top: 0;
		margin-right: 0;
    }
	
	header {
		height: 300px;
	}
	
	.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;
	}

	.mob-btn,
	.mobFilterBtn {
		display: none !important;
	}
	
	.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._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;
	}
	.noGap .bgDarkGrey {
		order: 2;
	}
	.contentBox text {
		padding: 30px;
	}
	td.mobileFull {
		display: table-cell;
		width: auto;
	}	
	td.noMobile {
		width: 50px;
	}
	
	.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;
	}
	
    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;
    }
	
}

/* SMALL SCREENS */
@media only screen and (min-width: 1280px) {
    
    footer .gridFrame {
        grid-template-columns: repeat(6, 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) { }