/* CSS Document */

@media screen and (max-width: 1650px) and (min-width: 1100px) {

}
@media screen and (max-width: 1550px) and (min-width: 1100px) {

    ul.categories > li > a { padding: 0 10px 2px 10px; }
    
}
@media screen and (max-width: 1450px) and (min-width: 1100px) {
    
    #content .homepage_textimage .text .center .snippet { width: 100%; }

}
@media screen and (max-width: 1350px) and (min-width: 1100px) {
    
    ul.categories > li > a { padding: 0 8px 2px 8px; font-size: 18px; }

}
@media screen and (max-width: 600px) {
    
    body { font-size: 16px; }
	
    .notice-container > span { padding-right: 0; font-size: 15px; }
    .notice-container > span img { width: 20px; height: 20px; margin-right: 15px; }

}
@media screen and (max-width: 1100px) {
	
	#wrapper { position: relative; margin-top: 50px; width: 100%; }
    
	.topmenu.desktop { display: none; }

	/* HEADER */
    
    #header-top { display: none; }

	#header { position: fixed; top: 0; width: 100%; height: 50px; box-shadow: 0 5px 10px rgba(0,0,0,0.05); z-index: 11; background-color: #fff; }
	#header:after { content: none; }
	#header #header-container { justify-content: flex-end; width: 100%; }
	
	#header #header-container #headerlogo { position: absolute; order: 1; top: 0; left: 5%; margin: 0; padding: 0; width: 90px!important; height: 50px; z-index: 15; background-color: transparent; background-size: contain; }
	#header #header-container #headerlogo:before,
    #header #header-container #headerlogo:after { content: none; }
    
	#header #header-container #menu { position:relative; DISPLAY: NONE; float:right; padding:0; width:auto; height:50px; }
	#header #header-container #menu ul.pagesmenu.desktop { display:none; }
	
	#header #header-container #menu ul.usermenu.desktop { display:NONE; height:100%; }
	#header #header-container #menu ul.usermenu.desktop li { margin-left:1px; width:50px; height:50px; }
	#header #header-container #menu ul.usermenu.desktop li a { margin:0; padding:0; width:100%; height:100%; font-size:0; }
	#header #header-container #menu ul.usermenu.desktop li a.login { background-size:40%!important; }
	#header #header-container #menu ul.usermenu.desktop li a.signup { background-size:35%!important; }
    
    .menu-basket-wrapper { width: auto; }


	/* MENU MOBILE */
	
	.toggle-menu-mobile { display: block; order: 4; float: right; width: 50px; height: 50px; background-image: url(../images/icons/icon-menu.svg); background-color: #fff; background-position: center; background-size: 18px; background-repeat: no-repeat; }
    
	.menu-mobile-wrapper { position:fixed; display:block; top:50px; left:0; padding:0 8%; width:100%; height:0; box-sizing:border-box; transition:padding ease 0.15s; overflow:hidden; z-index:1; background-color:#fff; }
	.menu-mobile-wrapper.active { padding:30px 8%; height:calc(100% - 50px); overflow-y:scroll; }
	.menu-mobile-wrapper a { color:#333!important; }
	
		.menu-mobile-wrapper ul.pagesmenu { margin-bottom:10px!important; padding-bottom:10px; width:100%; border-bottom:3px solid #b4ccc9; }
		.menu-mobile-wrapper ul.pagesmenu li { width:100%; text-align:left; border-bottom:1px solid #ddd; }
		.menu-mobile-wrapper ul.pagesmenu li:last-child { border-bottom:none; }
		.menu-mobile-wrapper ul.pagesmenu li a { margin:0; padding:5px 0!important; font-size:15px; font-weight:normal; }

		.menu-mobile-wrapper ul.usermenu { float:left; margin-bottom:10px!important; padding-bottom:10px; width:100%; border-bottom:3px solid #b4ccc9; }
		.menu-mobile-wrapper ul.usermenu li { width:100%; text-align:left; border-bottom:1px solid #ddd; }
		.menu-mobile-wrapper ul.usermenu li:last-child { border-bottom:none; }
		.menu-mobile-wrapper ul.usermenu li a { padding:5px 0 5px 0!important; font-size:15px; font-weight:normal; text-transform:capitalize; background-position:right 10px center!important; background-size:auto 40%!important; }
		.menu-mobile-wrapper ul.usermenu li a.login { /*background-image:url(../images/icon-lock-black.png)!important;*/ }
		.menu-mobile-wrapper ul.usermenu li a.signup { /*background-image:url(../images/icon-pencil-black.png)!important;*/ }
	
		.menu-mobile-wrapper ul.categories { float:left; margin-bottom:10px; padding-bottom:10px; border-bottom:3px solid #b4ccc9; }
		.menu-mobile-wrapper ul.categories li { width:100%; text-align:left; border-bottom:1px solid #ddd; }
		.menu-mobile-wrapper ul.categories li:hover,
		.menu-mobile-wrapper ul.categories li.active { background-color:transparent; }
		.menu-mobile-wrapper ul.categories li.active:before { content:none; }
		.menu-mobile-wrapper ul.categories li:last-child { border-bottom:none; }
		.menu-mobile-wrapper ul.categories li strong { display:block; width:100%; padding:5px 0 15px 0; font-size:15px; color:#333; font-weight:bold; text-transform:uppercase; }
		.menu-mobile-wrapper ul.categories li a { padding:5px 0; font-size:15px; font-weight:normal; }
		.menu-mobile-wrapper ul.categories li ul { display:none; }
		
		.menu-mobile-wrapper .topmenu { width:100%; background-color:transparent; }
		.menu-mobile-wrapper .topmenu ul { width:100%; }
		.menu-mobile-wrapper .topmenu ul li { padding:6px 0; width:100%; font-weight:normal; text-align:left; border-bottom:1px solid #ddd; }
		.menu-mobile-wrapper .topmenu ul li:last-child { border-bottom:none; }
		.menu-mobile-wrapper .topmenu ul li:before { content:none; }
		.menu-mobile-wrapper .topmenu ul li a { margin:0; padding:0; font-size:13px; font-weight:normal; }
		
    
	/* HEADER IMAGE */

    #header-image { margin-top: 0; height: calc(100vh - 200px); }
    #header-image-image:before { background-color: rgb(0 0 0 / 25%); }
    #header-image-image .image { background-color: #000; }
    #header-image-image .image img { width: 100%; height: 100%; object-fit: cover; opacity: 0.8; }
        
    #header-image-container { width: 90%; }
    #header-image-container .center { margin-bottom: 0; }
    #header-image-container .center:after { opacity: 0.25; }
    #header-image-container .center h1 { margin-bottom: 10px; font-size: 20px; line-height: 1.3; }
    #header-image-container .center h1:after { bottom: -30px; width: 180px; height: 5px; }
    #header-image-container .center h1 > span { display: flex; flex-direction: column; }
    #header-image-container .center h1 > span.title { margin-bottom: 0; font-size: 21px; }
    #header-image-container .center h1 > span.title:after { left: 0; margin: 20px auto 10px auto; width: 100%; height: 2px; }
    #header-image-container .center h1 > span.subtitle { margin-top: 15px; font-size: 40px; line-height: 1.1; }
    
    #header-image-container .center a.btn { padding: 14px 20px 16px 20px; font-size: 18px; }
    #header-image-container .center a.btn span { display: none; }
    #header-image-container .center a.btn img { top: 0; margin: -5px -5px -5px 8px; width: 20px; }
    
	#header #header-container #basket,
	#header #header-container .sideblock.search { margin: 0!important; padding: 0!important; width: 50px; height: 50px; border-left: 1px solid rgba(0,0,0,0.1); border-radius: 0; background-position: center; background-size: 40%!important; }

	#header #header-container #basket { order: 3; }
		#header #header-container #basket .icon { display: flex; align-items: center; justify-content: center; top: 0; margin: 0; padding: 0; width: 50px; height: 50px; border: none; }
		#header #header-container #basket .icon img { width: 24px; }
		#header #header-container #basket p.title { display:none; }
		#header #header-container #basket .summary { position: absolute; width: 100%; height: 100%; }
        #header #header-container #basket .summary:after { content: none; }
		#header #header-container #basket .summary span.totalquantity { top: 6px; right: 3px; transform: scale(0.75); }
		
	#header #header-container #belvoormeer { display:none; }
	
	#header #header-container .sideblock.search { position:relative; order: 2; }
	#header #header-container .sideblock.search .btn { position:absolute; top:0; left:0; width:100%; height:100%; z-index: 1; }
	#header #header-container .sideblock.search .form { width:100%; height:100%; }
    #header #header-container .sideblock.search .form input.button { border-radius: 0!important; }
	#header #header-container .sideblock.search .form input.button.search { width: 100%; height: 100%; font-size: 0; filter: none; /*background-color: #341794!important;*/ background-image: url(../images/icons/icon-search.svg)!important; background-position: center!important; background-size: 38%!important; background-repeat: no-repeat!important; }

	#header #header-container .sideblock.search .form input.hasplaceholder { display:none; }
	#header #header-container .sideblock.search .form.active input.hasplaceholder { display: NONE; pointer-events: initial; background-color: #fff; }
    #header #header-container .sideblock.search .form input[type=text] { position: fixed; top: 0; left: 0; width: 57%; height: 50px; border-radius: 0; z-index: 15; }
    
	#header #header-container .sideblock.search.active { border: none; }
	#header #header-container .sideblock.search.active .btn { filter: invert(1); /*background-color: #341794;*/ background-image: url(../images/icon-close.png); background-position: center; background-size: 12px; background-repeat: no-repeat; }
	#header #header-container .sideblock.search.active .form input.hasplaceholder { position: fixed; display:block; left:50px; padding:17px 17px; width: calc(100% - 200px); color: var(--black); text-overflow: ellipsis; border: 1px solid rgba(0,0,0,0.1); border-top: none; border-bottom: none; z-index: 1000; /*background-color: var(--green);*/ }
	#header #header-container .sideblock.search.active .form input.button.search { position:fixed; width: 50px; height: 50px; left: 0; top: 0; z-index: 15; /*background-color: #341794!important;*/ }

	.sideblock.newsletter.mobile { display:block; width:84%; margin: 30px 8% 60px 8%; box-sizing:border-box; background-image:none; background-color:#efefef; }
	.sideblock.newsletter.mobile h2 { padding:0; }
	.sideblock.newsletter.mobile span.acties { padding:0; }
	.sideblock.newsletter.mobile span.acties br { display:none; }

	#menu ul li a.active { color:#b4ccc9!important; font-weight:bold; background-color:transparent; }
    
    	
	body.dark #header #header-container #basket,
	body.dark #header #header-container .sideblock.search { border-left: none; }
    body.dark #header #header-container .sideblock.search .form input.button { filter: none; }
    body.dark .toggle-menu-mobile { filter: invert(1); background-color: #d6cecc; }

    
    #content .usps { }
    #content .usps .usps-container { padding: 45px 0; width: 100%; }
    #content .usps .usps { flex-direction: column; gap: 10px; }
    #content .usps .usps .usp { display: flex; flex-direction: row; gap: 20px; width: 100%; text-align: left; }
    #content .usps .usps .usp span { font-size: 16px; }
    #content .usps .usps .usp span img { margin-bottom: 0; width: 30px; }
    #content .usps .usps .usp span strong { display: inline-block; }
    

	/* SIDEBARS */
	
	#sidebar_left,
	#sidebar_right { display: none; }
	#sidebar_left { position: fixed; display: flex; flex-direction: column; align-items: center; justify-content: center; top: 0; right: 0; margin: 0; padding: 0; width: 90%; height: 100%; border-top: none; transform: translateX(100%); transition: transform ease 0.25s; z-index: 100; background-color: var(--black); }
	#sidebar_left.active { /*padding-bottom: 15%;*/ transform: translateX(0); box-shadow: 0 0 90px rgba(0, 0, 0, 1); }
    #sidebar_left .close { display: block; position: absolute; top: 15px; right: 15px; width: 50px; height: 50px; font-size: 0; background-color: var(--black); background-image: url(../images/icons/icon-close.svg); background-position: center; background-size: 16px; background-repeat: no-repeat; }
    ul.categories { display: flex; flex-direction: column; align-items: center; justify-content: center; /*padding-top: 10px;*/ width: 100%; height: auto; }
    ul.categories > li { padding: 0; color: #fff; }
    ul.categories > li > a { padding: 8px 0 !important; font-size: 18px; line-height: 1; }
    ul.categories > li > ul { display: none!important; }
    
    ul.categories > li:hover,
    ul.categories > li.active { background-color: transparent; }
    ul.categories > li:hover > a,
    ul.categories > li.active > a { color: var(--green); }
    
    #sidebar_left #menu { display: block; right: 50px; width: calc(100% - 50px); height: auto; background-color: transparent; }
    #menu ul.usermenu { display: flex; flex-wrap: wrap; justify-content: flex-end; width: 100%; border: none; }
    #menu ul.usermenu li a { padding: 25px; }
    #menu ul.usermenu li.username { padding: 19px 18px 0 20px; width: calc(100% - 102px); text-align: right; text-overflow: ellipsis; overflow: hidden; box-sizing: border-box; }
    
    #sidebar_left ul.usermenu { display: block; margin-top: 20px; padding-top: 12px; text-align: center; border-top: 1px solid rgb(255 255 255 / 25%); }
    #sidebar_left ul.usermenu li { padding: 2px 0px; }
    #sidebar_left ul.usermenu li a { align-items: center; display: inline-block; margin: 0; padding: 7px 0 9px 0; height: 100%; font-size: 18px; color: #fff; line-height: 1; letter-spacing: 0.5px; text-transform: none; }
    
    #sidebar_left ul.usermenu li.username { DISPLAY: NONE; margin-top: 8px; margin-bottom: 12px; padding: 0 15px; color: #fff; }

    
	/* CONTENT */
	
	#content { margin: 0; padding: 0; padding-bottom: 0; width: 100%; border-top: none; }
	#content h1 { margin-bottom: 25px!important; font-size: 24px; line-height: 1; }
	
	#content .page_content p a { word-wrap:break-word; }
	    
	#content.home { padding: 0; }
    #content-container { width: 85%; }
    #content.home #content-container { padding: 0; width: 85%; }
    
	#content.home #home-slider { margin-top: 7px; /*height:150px;*/ }
	#content.home #homepage { padding: 0; width: 100%; box-sizing: border-box; }
    #content.home .homepage_textcontent h2 { font-size: 40px; line-height: 1.1; }
    
    #content .homepage_intro { margin: 0 0 45px 0; padding: 30px; font-size: 16px; text-align: left; }
    #content .homepage_intro h2 { margin-bottom: 15px; padding: 0; font-size: 21px; line-height: 1.1; }
    
    #content .homepage_textimage { margin-top: 30px; padding: 45px 0; }
    #content .homepage_textimage:nth-of-type(n+2) { margin-top: 30px; }
    #content .homepage_textimage .text,
    #content .homepage_textimage .image { width: 100%; }
    #content .homepage_textimage .text { position: relative; order: 2!important; margin-top: 30px; padding: 0!important; line-height: 1.6; }
    #content .homepage_textimage .text .center .title { /*display: none;*/ }
    #content .homepage_textimage .text .center .title h2 { display: block; margin-bottom: 15px; width: 100%; font-size: 24px; line-height: 1.2; }
    #content .homepage_textimage .text .center .snippet { width: 100%; }
    #content .homepage_textimage .text .center a.more { margin-left: 0; margin-top: 25px; padding: 15px 30px; font-size: 16px; }
    #content .homepage_textimage .image { position: relative; order: 1!important; aspect-ratio: 16 / 9; border-radius: 5px; }
    #content .homepage_textimage .image h2 { position: absolute; display: block; bottom: 0; left: 0; margin: 30px 20px; font-size: 28px; color: #fff; line-height: 1.1; z-index: 1; }
    #content .homepage_textimage .image img { }
    
    #content .homepage_usps { padding: 45px 0; font-size: 18px; }
    #content .homepage_usps .usps { flex-direction: column; row-gap: 15px; }
    #content .homepage_usps .usps .usp { flex-direction: column; margin: 0; padding: 30px 0; width: 100%; }
    
    #content .homepage_usps ul { flex-direction: column; gap: 10px; }
    #content .homepage_usps ul li { }
    #content .homepage_usps ul li img { top: 2px; width: 18px; height: 18px; }
    
    #content .homepage_content { padding: 45px 0; }
    #content .homepage_content .categories { display: flex; flex-direction: column; gap: 15px; }
    
    #content .homepage_textimage .text .center .snippet ul li { width: 100%; }
    
    #content .homepage_columns { flex-direction: column; gap: 30px; padding: 45px 0; }
    #content .homepage_columns .column { padding: 30px; width: 100%; }
    #content .homepage_columns .column h2 { font-size: 24px; }
    
    #content .homepage_maandaanbieding .split .item.carousel { margin: 0; padding-bottom: 100%; width: 100%; }
    #content .homepage_maandaanbieding .split .left { margin: 0; margin-top: 45px; padding: 45px 10% 10% 10%; width: 100%; z-index: 12; }
    #content .homepage_maandaanbieding .split .left:after { top: -12px; left: 50%; width: 30px; height: 30px; transform: translateX(-50%) rotate(45deg); }
    #content .homepage_maandaanbieding .split .left .content { display: flex; flex-direction: column; width: 100%; }
    #content .homepage_maandaanbieding .split .left .content h2 { margin-left: 0; font-size: 32px; }
    #content .homepage_maandaanbieding .split .left .content .dates { position: relative; bottom: 0!important; right: 0!important; margin-top: 25px; width: 100%!important; text-align: left; }
    
    #content .homepage_maandaanbieding .split .left .prices { position: absolute; top: -35px; right: 15px; padding-bottom: 110px; width: 110px; height: 0; transform: rotate(10deg) scale(0.9); transform-origin: top right; }
    #content .homepage_maandaanbieding .split .left .prices .prices-border { position: absolute; display: flex; flex-direction: column; justify-content: center; top: 0; left: 0; width: 100%; height: 100%; }
    #content .homepage_maandaanbieding .split .left .prices .price.original { font-size: 20px; }
    #content .homepage_maandaanbieding .split .left .prices .price.original:before { position: absolute; top: 45%; left: 20%; width: 60%; height: 2px; }
    #content .homepage_maandaanbieding .split .left .prices .price.now { margin-bottom: 8px; font-size: 26px; }

	#content.home #homeblocks { left: 0; padding: 0; width: 100%; box-sizing: border-box; }
	#content.home #homeblocks .homeblock { margin: 5px 0; width: 100%!important; }
    
	#content.home #homeblocks .homeblock.small.custom .foto { margin-bottom:0; }

	#content.home #homeblocks .homeblock.small.product .foto { padding-bottom:0; width:50%; height:100px; }
	#content.home #homeblocks .homeblock.small.product .title { width:50%; }
	#content.home #homeblocks .homeblock.small.product .title a h1,
	#content.home #homeblocks .homeblock.small.product .title a h2 { margin-top:0!important; padding:0 15px; height:auto; line-height:21px; border:none; }
	#content.home #homeblocks .homeblock.small.product .acontent { padding-bottom:0; width:50%; }
	
	#content.home #homeblocks .homeblock.mega.newspage { height:auto; }
	#content.home #homeblocks .homeblock.mega.newspage .acontent ul li { height:auto; }
	#content.home #homeblocks .homeblock.mega.newspage .acontent ul li .right span.titel { white-space:initial; overflow:initial; text-overflow:initial; }
    
    /*#content.home #homepage .sideblock.popularproducts { padding: 45px 0; }
    #content.home #homepage .sideblock.popularproducts h2 { font-size: 28px; }
    #content.home #homepage .sideblock.popularproducts .items { display: flex; flex-direction: column; left: 0; margin-top: 30px; width: 100%; }
    #content.home #homepage .sideblock.popularproducts .items .item { margin: 0; margin-bottom: 0; width: 100%; }
    #content.home #homepage .sideblock.popularproducts .items .item .foto { padding-bottom: 50%; }
    #content.home #homepage .sideblock.popularproducts .items .item .info { width: 100%; }
    #content.home #homepage .sideblock.popularproducts .items .item .info .title { margin-bottom: 15px; min-height: 0; font-size: 16px; line-height: 1.2; }
    #content.home #homepage .sideblock.popularproducts .items .item .info .price { }*/
    
    #content.home #homepage .sideblock.popularproducts { padding: 45px 0; }
    #content.home #homepage .sideblock.popularproducts h2 { margin-bottom: 20px; font-size: 24px; }
    #content.home #homepage .sideblock.popularproducts .items { display: flex; flex-direction: column; gap: 15px; margin-top: 25px; }
    #content.home #homepage .sideblock.popularproducts .items .item { display: flex; flex-direction: row; padding: 0!important; width: 100%!important; }
    
    #content.home #homepage .sideblock.popularproducts .items .item .foto { margin: 0; padding-bottom: 0; width: 30%; height: auto; /*height: 100px;*/ aspect-ratio: 1/1; }
    #content.home #homepage .sideblock.popularproducts .items .item .foto a { padding-left: 5px; }
    #content.home #homepage .sideblock.popularproducts .items .item .foto img { max-width: 60%; max-height: 80%; }

    #content.home #homepage .sideblock.popularproducts .items .item .info { align-items: flex-start; padding: 15px 10px 18px 10px; width: 70%; }
    #content.home #homepage .sideblock.popularproducts .items .item .info h2 { padding: 0; font-size: 15px; line-height: 1; text-align: left; }
    #content.home #homepage .sideblock.popularproducts .items .item .info .title { min-height: 0; text-align: left; }
    #content.home #homepage .sideblock.popularproducts .items .item .info .price { position: relative; flex-direction: column; align-items: flex-start; row-gap: 2px; bottom: 0; margin-top: 0!important; }
    #content.home #homepage .sideblock.popularproducts .items .item .info .price .price-holder { row-gap: 2px; }
    #content.home #homepage .sideblock.popularproducts .items .item .info .price span { font-size: 20px; }
    #content.home #homepage .sideblock.popularproducts .items .item .info .price span.incl,
    #content.home #homepage .sideblock.popularproducts .items .item .info .price span.excl { flex-direction: row; align-items: center; justify-content: flex-start; column-gap: 5px; font-size: 16px; }
    #content.home #homepage .sideblock.popularproducts .items .item .info .price span.incl:after,
    #content.home #homepage .sideblock.popularproducts .items .item .info .price span.excl:after { top: -2px; font-size: 12px; letter-spacing: 0.25px; }
    
    #content.home #homepage .sideblock.popularproducts .items .item .info .btn { display: none; }
    
    #content .reviews { align-items: flex-start; padding: 45px 0; }
    #content .reviews h2 { font-size: 24px; }
    #content .reviews span { text-align: left; }
    #content .reviews .items { display: flex; flex-direction: column; gap: 20px; margin-top: 30px; }
    #content .reviews .items .item { padding: 30px; }
    
    .commercial figure { align-items: flex-start; gap: 5px; padding: 40px 0 50px 0; }
    .commercial figure audio { width: 100%; }
    
	#content.home #iframes { display:none; }
    
    #content .homepage_intro ul { margin-top: 25px; padding: 0; padding-top: 20px; }
    #content .homepage_intro ul li { margin: 5px 0; font-size: 18px; }
    #content .homepage_intro ul li:before { margin-right: 5px; }

	#content.cmspage { padding: 0; }
	#content.cmspage .page_content p iframe { height:210px; }
    
    #content.cmspage.blog #content-container { flex-direction: column; padding: 60px 0; }
    #content.cmspage.blog #content-container .page_content { width: 100%; }
    #content.cmspage.blog #content-container .news_media { margin-top: 45px; width: 100%; }

	.breadcrumbs { display: flex; flex-wrap: wrap; padding-top: 0; width: 100%; border-top: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
	
	#content .page_media { margin: 0; margin-top: 20px; padding: 0; width: 100%; }
	#content .page_media a { margin: 0; width: 100%; }
    #content .page_media .image .caption { font-size: 15px; }
	
	#content.klantpage form#loginform { margin-top: 15px; margin-bottom: 0; }	    
	#content.klantpage form#loginform div { display: flex; flex-direction: column; padding: 0; width: 100%; height: auto; }	    
	#content.klantpage form#loginform div span { margin-bottom: 5px; width: 100%; }	    
	#content.klantpage form#loginform div input { padding: 10px; width: 100%; box-sizing: border-box; }
    #content.klantpage form#loginform div input.button { margin-top: 10px; width: 100%; }
	
	#content form#registreerform .row .element { padding:0; }	    
	#content form#registreerform .row .element p { margin-top:10px; margin-bottom:0; width:100%; }	
	#content form#registreerform .row .element p small { position: relative; display: block; margin-top: -3px; }	
	#content form#registreerform .row .element input { margin-top:0; padding:10px; width:100%; box-sizing: border-box; }	    
	#content form#registreerform .row .element select { padding:10px; height:auto; }	    
	#content form#registreerform .column.submit { width:100%; }	    
	#content form#registreerform .column.submit input { margin-top:5px; padding:10px; width:100%; }
	
    #content.klantpage form#registreerform { width: 100%; }
    #content.klantpage form#registreerform .row .element p { display: block; margin-bottom: 5px !important; width: 100%; }
	#content.klantpage form#registreerform .row .element input { width :100%; }
    #content.klantpage form#registreerform .column.submit { margin: 0; margin-top: 10px; width: auto; }
    #content.klantpage form#registreerform .column.submit input.button { margin: 0; width: auto; }
    
	/* Contactpagina */
    #content .page_content.contact { flex-direction: column; }
    #content .page_content.contact .contact,
    #content .page_content.contact form.contactform { width: 100%; }
    #content .page_content.contact form.contactform { margin-top: 0; padding: 0; }
    #content .page_content.contact form.contactform h2 { margin-top: 15px; margin-bottom: 15px !important; font-size: 24px; color: var(--black); line-height: 1; }
    
	/* Producten */
    #category_info { margin-bottom: 0; max-width: none!important; line-height: 1.4; }

	#category_products_controls { }
        #category_products_controls { position: relative; display: flex; justify-content: flex-end; margin: 18px 0 20px 0!important; padding-bottom: 21px!important; width: 100%!important; border-bottom: 1px solid #ddd; box-sizing: border-box; }
	#category_products_controls .subfilter { margin-top: 28px!important }
	#category_products_controls .subfilter ul.subfilters li { margin-right: -1px; padding: 0 10px; height: 35px; font-size: 12px; }
	
	#category_products_controls .weergave { display:none; }
	
	#category_products_controls .sorteren { position: relative; top: 0; right: 0; transform: scale(0.8); transform-origin: right top; z-index: 1; }
    
        #category_products_controls .sorteren p.controltag { display: flex; margin: 8px 135px 0 0; padding: 0; white-space: nowrap; }
        #category_products_controls .sorteren ul.uldropdown { position: absolute; top: 0; right: 1px; margin: 0; padding: 0; width: 125px; border: 1px solid #ddd; border-radius: 3px; }
	
    
    .notice.active { transform: translateY(0); }
    .notice { transform: translateY(125%); }
    
    .notice:after { position: absolute; display: flex; align-items: center; justify-content: center; top: -8px; right: 10px; width: 20px; height: 20px; content: "x"; font-size: 14px; color: #fff; line-height: 1; border-radius: 50%; background-color: #000; }
    
	
	/* PRODUCTS */
    
	#category_products.tile { }
	#category_products.tile.subcats { /*margin-top: -40px;*/ margin-top: 15px; }
	#category_products.tile .items,
	#category_products.tile.subcats .items { display: flex; flex-direction: column; row-gap: 10px; }
	#category_products.tile .items { row-gap: 15px; }
	#category_products.tile .clear { display: none; }
	#category_products.tile .item,
	#category_products.tile .item.bigpic,
	#category_products.related_products.tile .item { display: flex; flex-direction: column; margin: 0!important; padding: 15px 15px 25px 15px!important; width: calc(100% / 2 - 4%)!important; box-sizing:border-box; }
	#category_products.tile .item .thumb2,
	#category_products.tile .item.bigpic .thumb2,
	#category_products.related_products.tile .item .thumb2 { float: left; margin: 0 6% 0 0; padding: 0; width: 100%; height: 100px; }
	#category_products.tile .item .txt,
	#category_products.tile .item.bigpic .txt,
	#category_products.related_products.tile .item .txt { float: left; padding: 0; width: 100%; border: none; }
	#category_products.tile .item .txt h2,
	#category_products.tile .item.bigpic .txt h2,
	#category_products.related_products.tile .item .txt h2 { padding-top: 20px; height: auto; font-size: 16px; line-height: 1.2; }
    
    .label { top: 14px; right: -113px; padding: 11px 0 11px 0; transform: rotate(45deg) scale(0.75); }
    .label.big { top: 18px; right: -108px; }
    
    #category_products.tile .item .txt .specs { position: relative; }
    #category_products.tile .item .txt .specs .price { position: relative; bottom: 0; margin-top: 10px!important; font-size: 19px; }

    #content-container .item .price span.incl,
    #content-container .item .price span.excl { display: flex; flex-direction: column; row-gap: 2px; }
    #content-container .item .price span.excl { font-size: 21px; }
    #content-container .item .price span.incl:after,
    #content-container .item .price span.excl:after { top: 2px; margin: 0; font-size: 14px; }
	
    #category_products.tile .item { flex-direction: row; padding: 0!important; width: 100%!important; text-align: left; }
    #category_products.tile .item .thumb2 { margin: 0; width: 30%; }
    #category_products.tile .item .thumb2 a { padding-left: 5px; }
    #category_products.tile .item .thumb2 img { max-width: 80%; max-height: 80%; }
    #category_products.tile .item .txt { display: flex; flex-direction: column; justify-content: center; padding: 15px 10px 18px 10px; width: 70%; }
    #category_products.tile .item .txt h2 { padding: 0; font-size: 15px; line-height: 1; text-align: left; }
    #category_products.tile .item .txt h2 a span.artcode { margin: 6px 0; width: 100%; font-size: 14px; }
    #category_products.tile .item .txt .specs { left: 0; width: 100%; }
    #category_products.tile .item .txt .specs .price { flex-direction: column; row-gap: 2px; margin-top: 0!important; }
    #category_products.tile .item .txt .specs .price .price-holder { row-gap: 2px; }
    #category_products.tile .item .txt .specs .price span.incl,
    #category_products.tile .item .txt .specs .price span.excl { flex-direction: row; align-items: center; justify-content: flex-start; column-gap: 5px; font-size: 16px; }
    #category_products.tile .item .txt .specs .price span.incl:after,
    #category_products.tile .item .txt .specs .price span.excl:after { top: -2px; font-size: 12px; letter-spacing: 0.25px; }
    
    #category_products.tile.related_products .item { flex-direction: row; padding: 0!important; width: 100%!important; }
    #category_products.tile.related_products .item .thumb2 { margin: 0; width: 30%; }
    #category_products.tile.related_products .item .thumb2 a { padding-left: 5px; }
    #category_products.tile.related_products .item .thumb2 img { max-width: 60%; max-height: 80%; }
    #category_products.tile.related_products .item .txt { padding: 15px 10px 18px 10px; width: 70%; }
    #category_products.tile.related_products .item .txt h2 { padding: 0; font-size: 15px; line-height: 1; text-align: left; }
    #category_products.tile.related_products .item .txt h2 a span.artcode { margin: 6px 0; width: 100%; font-size: 14px; }
    #category_products.tile.related_products .item .txt .specs { left: 0; width: 100%; }
    #category_products.tile.related_products .item .txt .specs .price { flex-direction: column; row-gap: 2px; margin-top: 0!important; }
    #category_products.tile.related_products .item .txt .specs .price .price-holder { row-gap: 2px; }
    #category_products.tile.related_products .item .txt .specs .price span.incl,
    #category_products.tile.related_products .item .txt .specs .price span.excl { flex-direction: row; align-items: center; justify-content: flex-start; column-gap: 5px; font-size: 16px; }
    #category_products.tile.related_products .item .txt .specs .price span.incl:after,
    #category_products.tile.related_products .item .txt .specs .price span.excl:after { top: -2px; font-size: 12px; letter-spacing: 0.25px; }
    
	#category_products.subcats.tile .item { flex-direction: row; margin: 2%; padding: 0!important; width: 100%!important; }
	#category_products.subcats.tile .item .thumb2 { margin: 0; width: 30%; height: 80px; }
    #category_products.subcats.tile .item .thumb2 a { padding-left: 5px; }
	#category_products.subcats.tile .item .thumb2 img { max-width: 80%; max-height: 80%; }
    #category_products.subcats.tile .item h2 { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; top: 0; padding: 0 15px 0 10px; width: 70%; font-size: 16px; line-height: 1.1; text-align: left; box-sizing: border-box; }
    #category_products.subcats.tile .item h2 a { font-size: 18px; font-weight: 600; }
    
	.product_content .images { width:100%!important; }
	.product_content .description { width:100%!important; padding:0; }
	.product_content .bestellen .add { width:100%; }
	
	.bestellen .opties .optie { padding:15px; width:calc(100% - 10px); }
	.bestellen .opties .optie div.name { width:100%; height:30px!important; }
	.bestellen .opties .optie.enum > .name { height:32px!important; }
	.bestellen .opties .optie div.keuze { width:45%; }
	.bestellen .opties .optie div.keuzes { width:100%; }
	
	.bestellen .opties .optie .keuze { /*width:100%!important;*/ min-height:0!important; }
	.bestellen .opties .optie .keuze-image { width:100%; }
	.bestellen .opties .optie .keuze-image .image { float:left; margin-right:10px; }
	.bestellen .opties .optie .keuze-image span.name { float:left; margin:0; padding:0; width:calc(100% - 70px); height:auto!important; }
	.bestellen .opties .optie .select { width:135px; }
    
    
	/* PRODUCT PAGE */
    
    #product_page .product_content .left { margin: 0; padding-right: 0; width: 100%; }
    #product_page .product_content .description { padding-right: 0; }
    #product_page .product_content .right { margin: 0; width: 100%; }
    #product_page .product_content .right .images { top: 0; }
    #product_page .bestellen { padding: 0; border: none; }
    #product_page .bestellen h3 { font-size: 24px!important; line-height: 1; }
    #category_products.related_products strong { margin-top: 40px!important; margin-bottom: 25px; margin-left: 0; font-size: 24px!important; line-height: 1; }
    #category_products.related_products strong + .clear { display: none; }
        	
	
	/* WINKELWAGENTJE */
    
	.bestellen .opties .add { width:calc(100% - 10px); }
	
	#shoppingcart .item .prices { display: flex; flex-wrap: wrap; }
	#shoppingcart .item span.button { position: relative; top: 0!important; }
	#shoppingcart .item span.button.remove { margin-left: 75px; }
	#shoppingcart .item span.button.changeset { top:30px; margin-left: 10px; }

	#shoppingcart .item.header { display:none; }
	
	#shoppingcart .item .description { width:calc(100% - 75px); }
	#shoppingcart .item .prices { float:left; width:100%; }
	#shoppingcart .item .subtotaal,
	#shoppingcart .item span.prijs,
	#shoppingcart .item span.aantal { float:left; padding-left:75px; width:100%; text-align:left; box-sizing:border-box; }
	#shoppingcart .item span.aantal { margin-bottom: 12px; }
	#shoppingcart .item .subtotaal:before { content:"Subtotaal:"; }
	#shoppingcart .item span.prijs:before { content:"Prijs:"; }
	#shoppingcart .item span.aantal:before { content:"Aantal: "; }

	#shoppingcart .bestellen .add .aantal select { float:left; }
	
	#shoppingcart .order.left { float:right!important; margin-top:0px!important; }
	
	#content.besteltraject .step .loginorregister { margin-left:0!important; margin-top:15px!important; width:100%; }
	#content.besteltraject .step .loginorregister:nth-of-type(2) { height:170px; }
	
	
    #content .page_content ul.files.werkbladkleuren { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 15px; row-gap: 15px; margin-top: 30px; }
	#content .page_content ul.files.werkbladkleuren li { }

    .step > #bestelform { width: 100%; }
    
    #content.besteltraject .step { flex-direction: column; }
    #shoppingcart { width: 100%!important; }
    #shoppingcart .item { padding: 20px 10px 40px 0; }
    .klantgegevens { margin-top: 15px; padding: 0; width: 100%; }
    
    .akkoord { width: 100%; }
    .akkoord label { width: calc(100% - 35px)!important; }
    .akkoord input[type=submit] { margin-bottom: 10px; }
    .akkoord input[type=submit] { padding: 9px 10px 11px 10px; font-size: 16px; line-height: 1.6!important; }
    .akkoord input[type=submit]:hover { opacity: 0.8; box-shadow: none!important; }
    
    div.bottomrow { width: 100%!important; }
    .bottomrow .order.left a.button { width: 100%; margin-top: 0; }
    
    
    /* FORM */
    
    form.contactform { width: 100%; }
    form.contactform .field { flex-wrap: wrap; width: 100%; }
    form.contactform .field label { margin-bottom: 10px; width: 100%; }
    form.contactform .field input { width: 100%!important; }
    form.contactform .field.radio input { width: 20px!important; }
    form.contactform .field.checkbox input { width: 20px!important; }
    form.contactform .field label,
    form.contactform .field.textarea span.wysiwyglabel { margin-bottom: 10px; width: 100%; }
    form.contactform .field.checkbox label { margin-left: 0; }
    form.contactform .field.textarea .wysiwyg { width: 100%; }
    form.contactform input[type="submit"] { margin-left: 0; }
    
    form.contactform .field.textarea label.error { top: 46px; }
    
    form#newpwform { width: 100%; }
    form#klantdataform #factuuradres { width: 100%; }
    
    
    .element { width: 100%; }
    .element p { width: 100%; }
    .element input:not([type=radio]),
    .element textarea,
    .element select { width: 100%!important; }
    .element select.percent25 { width: 50%!important; }
    .element select.percent50 { width: 75%!important; }
    .element select.percent75 { width: 100%!important; }

    
    #showroom { flex-direction: column; padding: 45px 7.5%; }
    #showroom span { top: auto; margin-top: -15px; font-size: 32px; line-height: 1; text-align: center; }
    #showroom a.btn { margin-left: 0; margin-top: 20px; padding: 15px 30px; font-size: 16px; }
    
    
    .projecten { grid-template-columns: repeat(1, minmax(0, 1fr)); gap: 20px; margin-top: 30px; margin-bottom: 45px; }
    .projecten .project .text { padding: 20px 25px 30px 25px; }
    
    
    /* OVER ONS */
    
    body.over #content .page_media { margin-top: 0; }
    
    .row .content { padding: 60px 0; width: 85%; }
    .row.team .content .page_content { padding: 0; }
    
    .row.team .team { flex-direction: column; }
    .row.team .team { display: flex; flex-direction: column; gap: 20px; }
    .row.team .team .member { width: 100%; }
    .row.team .team .member .name h2 { }

    
	/* FOOTER */

	#footer { padding: 0; font-size: 16px; box-sizing: border-box; }
	#footer .footer-content { width: 100%; }
	#footer .footer-content img { width: 150px; margin-right: 0; margin-bottom: 15px; }
    #footer .footer-column { margin-bottom: 20px; padding: 0!important; width: 100%; max-width: 100%!important; }
	#footer .footer-content .text { text-align: left; }
	#footer .footer-content ul { margin-left: 0; }
	#footer ul#footermenu { display: none; }
    
    #footer .footer-content .footer-column.ideal { margin-bottom: 0; }
    #footer .footer-content .footer-column.ideal img { margin-bottom: 0; }
    
    #footer .footer-top { }
    #footer .footer-top .footer-top-container { flex-direction: column; gap: 0; padding: 50px 0 45px 0; width: 85%; }
    #footer .footer-top .column { margin-bottom: 32px; padding: 0; width: 100%; max-width: none; text-align: left!important; }
    #footer .footer-top .column.contact ul li { justify-content: flex-start; }
    
    #footer .footer-top .badges { position: relative; bottom: 0; }
    #footer .footer-top .badges .ideal { }
    
    #footer .footer-top .column:last-of-type { margin-bottom: 0; }
    .footer-top .column.nav1 ul li { width: calc(100% / 2); }
    
    .footer-top .column.social .socials .icons { justify-content: flex-start; gap: 15px; margin-top: 10px; }
    
    .betaalmogelijkheden { position: relative; display: flex; justify-content: flex-end; bottom: 0; right: 0; margin-top: 40px; width: 100%; }
    .betaalmogelijkheden .options { justify-content: flex-start; gap: 12px; }
    .betaalmogelijkheden .options .option { margin: 0; }
    .betaalmogelijkheden .options .option:first-of-type:before { position: absolute; top: -30px; right: auto; margin: 0 !important; width: 100%; white-space: nowrap; text-align: left; content: "Veilig betalen via: (Mollie)"; transform: none; }

    #footer .footer-bottom { }
    #footer .footer-bottom .footer-bottom-container { display: flex; flex-direction: column; align-items: flex-start; padding: 40px 0 60px 0; padding-bottom: 60px; width: 85%; }
    #footer .footer-bottom ul { flex-direction: column; }
    #footer .footer-bottom ul li { display: block; float: left; margin: 0 0 10px 0; width: 100%; }
    #footer .footer-bottom ul li:after,
    #footer .footer-bottom ul li a:after { content: none; }
    #footer .footer-bottom .ideal { margin-top: 20px; }
    
    .footer-bottom .footer-bottom-container .socials { gap: 15px; margin-top: 15px; }
	
}
