@media screen and (max-height: 700px){ 
	.overlay>div {
		top: 0px;
    	transform: translate(-50%,0%);
	}
	
}


@media screen and (max-width: 1300px){ 
	.search-open #searchall input {
		width: 200px;
	}
}

@media screen and (max-width: 1200px){ 
	.container {
		width: 100%;
	}

	.grid-magazines { 
		grid-template-columns: 1fr 1fr 1fr 1fr;
	}
}

@media screen and (max-width: 1000px){


	.timeline {
		background: none;
		padding: 25px;
	}

	.step-block {
		padding: 0px;
	}

	:root {
		--header-height: 75px;
	}

	.iconref.active {
		border-radius: 50% 50%;
	}

	.search-open #searchall input {
		width: 350px;
	}


	nav:not(.right) {
		position: fixed;
		left: 0;
		width: 80%;
		height: calc(100vh - var(--header-height));
		top: var(--header-height);
		background: var(--green);
		display: flex;
		justify-content: center;
		align-items: stretch;
		flex-direction: column;
		transform: translateX(-100%);
		transition: .3s;
	}
		nav a {
			    padding: 20px;
    border-bottom: 1px solid #ffffff45;
    border-top: 1px solid #ffffff45;
    margin-top: -1px;
}


	.menu-open nav {
		transition: .3s;
		transform: translateX(0);
	}

	.grid-magazines { 
		grid-template-columns: 1fr 1fr 1fr;
	}

	
	.brand {
		max-width: 125px;
	}


	.brand-pic {
    	width: 100px;
    	height: 100px;
    	padding: 15px;
	} 

	#smpleabvv {
		grid-template-columns: 1fr;
	}
	
	.pic-container {
		width: 75vw;
		position: relative;
		top: auto;
	}

	.pic-container, .prdct-container {
	    display: block;
	    margin: 0px auto;
	    width: 100%;
	}

	.custom_blok .c-buttons {
		left: auto;
		right: 0px;
	}

	.custom_blok img {
		width: 100px;
	}

	#cntsTxtCntr, .cntFrmCntr {
		width: 100%;
		display: block;
	}
	
	#shoppingcart-inline .cpbcp.right {
		position: relative;
		background: transparent;
		left: auto;
		bottom: auto;
		color: black;
	}

	.tar, #shippingg, .sh-right, #shippingg+.sh-right {
	    width: 100%;
	    margin: 5px 0px;
	    position: relative;
	    top: auto;
	}

	.tabs {
		background: white;
		margin-bottom: 15px;
	}
	.tabs a {
	    display: block;
	    width: 100%;
	    border: 1px solid #eee;
	    xxmargin-top: -1px;
	    border-radius: 0px;
	}

	.tabs a.active {
		border: none;
	}

	.tabs a.btn {
		padding: 15px 20px;
		margin: 0px;
	}

	.tabs a:after {
	    position: absolute;
	    left: 0px;
	    top: 0px;
	    height: 100%;
	    content: "";
	    width: 0px;
	    background: var(--blue);
	}

		.tabs a:hover:after, .tabs a.active:after {	
			width: 5px;
		}

	.vndk {
		display: block;
		padding: 0px 20px;
	}
		.vndk>div {
		    width: 100%;
		    margin: 5px auto;
		    text-align: center;
		    padding: 20px;
		    
		}

		.vndk>div:nth-child(1){
			border-bottom: 1px solid #eee;
		}


	.merken {
		text-align: center;
	}

	h2 {
		font-size: calc(10px + 1.25vw);
	}

	#searchResult h2 {
	    font-size: calc(9px + .5vw);
	}

	#searchResult .prct-inline b {
		font-size: 12px;
	}



	h3 {
		font-size: calc(10px + 1vw);
	}

	h4 {
		font-size: calc(10px + 1vw);
	}

	.dropdown .dropdown-content {
		padding: 5px;
	}

	.shpNlblk .var {
		font-size: 12px;
	}

	.mobile {
		display: block;
	}

	input, select, textarea {
		padding: 12px;
	}

	.btn, .nice-select {
		padding: 15px 20px;
   		margin: 5px 0px;
	}

	.nice-select li {
		padding: 15px 20px;
	}

	.extraInfo span, .extraInfo .content {
		width: 100%;
		text-align: center;
	}

	.extraInfo .content table {
		margin: 0 auto;
 	}

	.dropdown  .dropdown-content {
		position: fixed;
		width: 100vw !important;
		left: 0px;
		top: calc(var(--header-height) - 2px);
	}

	#searchall-popup input {
		width: calc(100% - 10px);
	}

	.content.left {
		left: -350px;
	    position: fixed;
	    top: 75px;
	    background: white;
	    width: 350px;
	    height: calc(100vh - 110px);
	    z-index: 150;
	    transition: .5s;
	    
	}

		.content.left>div {
			overflow-y: auto;
			padding: 5px;
		}

	.filters-open .content.left {
		transition: .5s;
		left: 0px;
	}
	
	.content.right {
		width: 100%;
	}

	.lightSlider li img, .lSSlideOuter { 
		width: 300px;
	}

	.prdct-dtls {
		width: 100%;
	}

	#filterForm {
		padding: 10px;
	}

	.btn-simple:after {
	    background: var(--blue);
	    height: 0%;
	    position: absolute;
	    left: 50%;
	    top: 50%;
	    width: 0%;
	    content: "";
	    z-index: -1;
	    transition: .5s;
	    transform:translate(-50%,-50%);
	}

		.btn-simple:hover {
			color: white;
			transition: .5s;
			text-decoration: none;
		}

		.btn-simple:hover:after {
			height: 105%;
			width: 105%;
			transition: .5s;
		}

	#footer>div {
		text-align: center;
		flex-direction: column;
		row-gap: 50px;
	}

	.frdouble .shoppingcart-inline {
		width: 100% !important;
	}

	.frsingle {
		width: 150px;
	} 

	.frdouble {
		width: calc(100% - 150px);
	}
	.space-between {
			flex-direction: column;
	}

	.pdnz>.inn {
		flex-direction: column;
	}
	.pdnz>.inn>div {
		justify-content: center;
		column-gap: 0px;
		width: calc(100% - 20px);
		flex-wrap: wrap;
	}

	#shippingg, #shcart {
		grid-template-columns: 1fr;
	}

	.popart .prdct:nth-child(3), .popart .prdct:nth-child(4) {
		display: none;
	}


}

@media screen and (max-width: 850px){


	.slogan {
		width: min-content;
	}

	


	.step-block:not([data-step="2"]) .shoppingcart-summary {
		display: none;
	}

	.grid-split, .grid-split.grid-split-half {
		grid-template-columns: 1fr;
	}

	.split-name {
    	grid-template-columns: 1fr 1fr;
	}

	.timeline_inner {
		padding: 25px 0px 0px 0px;
	}

	.orderrr {
		grid-template-columns: 1fr;
		row-gap: 25px;
		text-align: center;
		padding: 10px;
	}

	.paypay .pay_pop>.inner {
	    grid-template-columns: 1fr;
	    grid-gap: 2.5px;
	}



}

@media screen and (max-width: 600px){

	.icon.icon-mega {
		width: 10vw;
	}

	.slick-pic .slick-slide img, .slick-thumbs .slick-slide img {
		top: 0;
		left: 0;
		transform: none;
		position: relative;
	    display: block;
	    max-height: 250px;
	    width: auto !important;
	    margin: 0px auto;
	}

	 

	.slick-pic .slick-slide:after, .slick-thumbs .slick-slide:after {
		content: none;
	}

	.pic-container>div {
		padding: 0px;
	}

	.breadcrumbs {
		display: none;
	}

	.shpLine:not(.simple) img {
	    position: absolute;
	    left: 0;
	    top: 0;
	    width: 65px;
	    height: 90px;
	    object-fit: contain;
	}

	#shoppingcart-inline .shpLine:not(.simple) img {
		width: 40px;
		height: 60px;
	}

	.shpLine:not(.simple) .left>div {
	    margin-left: 75px;
	}

	.shpLine:not(.simple)>.left {
		grid-template-columns: 1fr;
	}

	.shpLine:not(.simple) a {
		font-size: 13px;
	}

	#zak {
		width: 100%;
	}

	.timeline {
	    position: sticky;
	    top: var(--header-height);
	    z-index: 9000;
	    background: white;
	    border-bottom: 1px solid #ddd;
	    padding-bottom: 10px;
	    margin-bottom: 15px;
	    padding-top: 10px;
    	margin-top: -25px !important;
	}

	.timeline span {
    	height: 30px;
   		width: 30px;
	}


	.timeline .step>div {
    	font-size: 10px;
	}

	.slogan-small {
		font-size: 32px;
	}

	.slick-arrow::after {
		top: 100px;
	}

	#brands .slick-arrow::after {
		top: 50px;	
	}

	#hamburger {
    	display: block;
	}

	.grid-magazines {
		grid-template-columns: 1fr 1fr;
	}

	.search-open #searchall {
	    position: fixed;
	    top: var(--header-height);
	    left: 0px;
	    width: 100vw;
	    background: var(--blue);
    	padding: 2.5px 0px 7.5px 0px;
	}

	.search-open #searchall input {
		width: calc(100vw - 10px);
		background: white;
	}


	.shoppingcart-inline .subContainer {
		width: 100%;
	}

	.shoppingcart-inline .shpLine:not(.simple) a {
	    font-size: 13px;
	}

	.search-open #searchall img {
		filter: invert(0);
	}

	span#searchResult {
		top: 53px;
		width: 100vw;
		left: 0px;
	}

	.shpLine:not(.simple) {
		flex-direction: column;
		min-height: 110px;
	}

	#shoppingcart-inline .shpLine:not(.simple) {
		min-height: 75px;
	}

	.shpLine>div {
		width: 100%;
	}

	.subContainer {
	    text-align: right;
	}

	.pdnz>.inn {
		flex-direction: column;
		text-align: center;
    	row-gap: 25px;
	}


	.overlay-content>div>.btn {
		width: 100%;
	}
	
	.bbgk {
		grid-template-columns: 1fr;
	}

	.asteps {
		grid-column:  1;
	}

#step2>.decads, .center.bak {
    grid-template-columns: 1fr;
}
	.prdct.large, .prdct.large .img-cntr {
		width: 100%;
		max-width: none;
	}


	.ppp label .popout {
		grid-template-columns: 1fr;
	}

	.pdnz img {
	    height: 29px;
	    margin: 10px 10px;
	}

	.pdnz {
		padding: 20px 0px;
	}

	.prdct .img-cntr {
	    height: 200px;
	    min-width: 75px;
	}

	.slick-arrow {
		box-shadow: -3px 0 7px 7px rgb(255 255 255 / 50%)
	}

	.slick-arrow.slick-prev {
		box-shadow: 3px 0 7px 7px rgb(255 255 255 / 50%)
	}

	.prdct .prdct-txt {
		max-width: 150px;
		min-width: 150px;
	}

	.ideal-qr {
		display: none;
	}

	#plaatsOrder input[type="text"], #plaatsOrder textarea , #plaatsOrder select{
		width: 100%;
	}

	.frdouble.pay {
		width: 100% !important;
		padding: 0px !important;
	}

		.frdouble.pay .mkhndr {
			width: 100% !important;
		}
	
		.frdouble.pay .mkhndr>div {
			height: auto !important;
		}
		.frdouble.pay .mkhndr>div>img {
			height: 50px;
		}

	input[type=text], select {
		padding: 10px !important;
		line-height: 1;
	}

	.login .cntr {
		padding: 0px;
	}

	.frdouble>div {
		padding: 0px !important;
	}

	.frsingle {
		width: 100px;
	} 

	.frdouble {
		width: calc(100% - 100px);
	}

	.adBtnLft li a {
		font-size: 11px;
		padding: 5px;
   		padding-left: 10px;
	}

	.tab-content {
		padding: 0px;
	}

	.overlay-content {
		    height: calc(100vh - 48px);
    	overflow-y: scroll;
	}

	#page {
		padding: 5px;
		padding-top: calc(var(--header-height) + var(--space-large));
	}

	.dropdown .dropdown-content {
    	top: calc(var(--header-height) - 10px);
	}

	.content.left { 
		left: -100%;
		width: 100%;
		top: 16vw;
		height: calc(100vh - 16vw);
	}

	.collabsible .collapsible-content>label>* {
		font-size: 12px;
	}

	#eurbxx {
	    display: flex;
	    flex-direction: column;
	    width: 100%;
	    justify-content: center;
	    align-items: center;
	    text-align: center;
	}

		#eurbxx small {
			font-size: 10px;
			margin: 0px;
		}

	.prdct-dtls {
		width: 100%;
    	padding: 12.5px 25px;
	}

	.iconref>span, #searchall input {
		background: none;
		border: none;
	}

	.iconref>span>img, .iconref>img {
		filter: invert(0);
	}

	#searchall img {
		filter: invert(1);
	}

	#searchall, .iconref>span {
		margin: 0;
	}

	#header .logo img {
		margin-left: 10px;
	}

	.lightSlider li img, .lSSlideOuter { 
		width: 60vw;
		display: block;
		margin: 0 auto;
	}

	.o-left, .o-right {
		width: 100%;
		margin: 0px;
	}

	#header .slogan {
		display: none;
	}

	.rghtDv.lgn#first {
		padding: 10px;
	}

	.cpbcp input[type=text] {
		padding: 6px !important;
		line-height: 1;
		font-size: 18px;
	}

	#coupon {
		display: grid;
		grid-template-columns: 1fr max-content;
	}

	#coupon h2, #coupon p {
		grid-column: span 2;
	}

	.sndption {
		padding:  25px 10px;
	}

	#login_sm input {
		width: 100%;
	}

	#coupon .btn {
		background: none;
		color: black;
		text-decoration: underline;
		text-shadow: none;
	}

	#shippingg>div:first-child {
		padding: 0px;
	}
}

@media screen and (max-width: 400px){
	.prct-inline {
		width: 100%;
	}

	.prct-inline {
	    width: 100%;
	    margin: 0px;
	    border: 0px;
	}





}