
/* font
http://www.colourlovers.com/palette/106467/Ambuside
 */

/*
Thema gebruik makend van een aantal kleuren
1 zwart en wit
2 steunkleur, steunkleur licht
3 steunkleur2, steunkleur2 licht
*/

:root {
    --kleur1: #3e3e3e; 	
	--kleur2: #0074be;
	--kleur3: #A4A4A4; 
	--kleur4: #217cc1; 
	--kleur5: #efefef;
	--kleur6: #2B085B;
	--kleur7: rgb(193, 195, 245);
    --kleur8: #ee7201;
	--grijs:  #333333;
	--wit:	  #ffffff;
	--zwart:  #000000;
	
    --lettertype20: "Niramit","Helvetica Neue Light","Helvetica Neue","Helvetica","Arial",sans-serif;    
    --lettertype30: "Open Sans","Helvetica Neue Light","Helvetica Neue","Helvetica","Arial",sans-serif;	
	
}

html{/*background:url(patroon.jpg);background-size:cover;background-attachment:fixed;*/height:100%;position:relative;}

body{position:relative;height:100%;font-family: var(--lettertype30,'arial');font-size:15px;line-height:1.6em;height:100%; color:var(--grijs); margin:0;}

input,textarea,select{font-family: var(--lettertype30); color:var(--kleur3); border:none;
border-radius:3px;}
h1,h2,h3,h4,h5,h6{font-family: var(--lettertype20);line-height:140%;font-weight:600;}

h1{color:var(--kleur2);font-size:32px}
h2{color:var(--kleur2);font-size:28px}
h3{color:var(--kleur2);font-size:24px;}

p{margin: 0 0 1.6em;}


.regel{display:inline-block;width:100%;}
.p10{width:10%;display:inline-block;}
.p20{width:20%;display:inline-block;}
.p30{width:30%;display:inline-block;}
.p40{width:40%;display:inline-block;}
.p50{width:50%;display:inline-block;}
.p60{width:60%;display:inline-block;}
.p70{width:70%;display:inline-block;}
.p80{width:80%;display:inline-block;}
.p90{width:90%;display:inline-block;}

/* @media only screen and (max-width:480px){body{font-size:15px;}}
@media only screen and (max-width:1024px){body{font-size:15px;}}
@media only screen and (min-width:1200px){body{font-size:15px;}}
@media only screen and (min-width:1680px){body{font-size:15px;}} */

/* algemeen */
div,img,body{margin:0;padding:0;vertical-align:top;box-sizing:border-box;position:relative;}
span{vertical-align:top;}

img{max-width:95%;height:auto;margin:auto;}

/* h1{color:var(--kleur1);font-size:2em;}
h2{color:var(--kleur2);font-size:1.6em;} */


@media only screen and (max-width:767px){
h2 {
	font-size: 22px;
	max-width: 90%;
	margin: 0.5em auto 0.5em auto;
}	 }

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

.knop , input[type="submit"] {
	font-family: var(--lettertype20);
	display: inline-block;
	padding: 13px 25px 17px;
	background-color: var(--kleur1);
	color: var(--wit);
	font-size: 120%;
	font-weight: 600;
	line-height: 100%;
	margin: 20px 0;
	transition:all 0.4s ease-in;
    cursor: pointer;
	box-sizing:border-box;
}

.knop.actie{
	background-color: var(--kleur8);
	}

.knop.light{
	color:var(--kleur1);
	border-color:var(--kleur1);
	padding: 12px 25px 16px;
	background-color:transparent;
	border:1px solid var(--kleur1);
	font-weight:normal;
	}
	
.knop i{position:absolute;margin-left:10px;margin-top:-4px;font-size:28px;}

img.round-icon{height:80%;width:auto;max-height:400px;max-width:400px;border-radius:200px;border:2px solid #fff;float:left;}

.mobileonly{display:none;!important}
.nomobile{display:inline;!important}


@media only screen and (max-width:767px)
	{
	a.knop{font-size: 1.3em;margin: 15px;min-width: 200px;padding:10px 30px 10px 10px;}
	a.knop:hover{padding:10px 30px 10px 10px;}
	div.blok25{width:45%;margin:1%;}	div.blok35,div.blok50{width:97%;display:block;margin-left:1%;}
	.mobileonly{display:inline;!important}
	.nomobile{display:none;!important}
	}



/* blokken */

div#canvas_website{position:relative;height:100%;width:100%;text-align:center; padding-top:50px;}
div#canvas_head{position:fixed;height:100px;top:0;z-index:1000; width:100%;background-color:var(--wit);}
div#canvas_head.ingeklapt , div#canvas_head.contentpagina {height:55px; background-color: var(--wit); color: var(--kleur1); width:100%;}
div#canvas_head.ingeklapt #canvas_categorien, div#canvas_head.contentpagina #canvas_categorien {
	top: 0;
	padding: 10px;
}
div#canvas_logo{width:20%;position:absolute;left:0;}

div#canvas_logo img#fclogo{display:block;height:90px;width:auto;max-width:none;margin: 5px 0 0 1.5em;}
div#canvas_logo img#monologo{display:none;}


div#canvas_logo.ingeklapt #fclogo, div#canvas_logo.contentpagina #fclogo{display:none;}
div#canvas_logo.ingeklapt #monologo, div#canvas_logo.contentpagina #monologo{display:block; max-width:250px;width:auto; height:55px;}

div#canvas_logo.ingeklapt, div#canvas_logo.contentpagina{position:relative;width:10%;}
@media only screen and (max-width:767px){
	div#canvas_logo.ingeklapt, div#canvas_logo.contentpagina{position:absolute;left:25%;width:50%;}
	div#canvas_logo img#fclogo, div#canvas_logo img#monologo{height:65px;margin:5px auto;}
	}
div#canvas_menu_hr.ingeklapt, div#canvas_menu_hr.contentpagina{margin-top:10px;}

/* Kolommen */
div.kolommen{    width: 100%;
    max-width: 1200px;
    position: relative;
    margin-left: auto;
    margin-right: auto;
    padding: 0 1.5em;}
div.kolommen.paginabreed{max-width:100%;width:100%;}
div.kolommen.paginabreed div.canvas_container{width:100%;max-width:none}

.kolom{border-radius:5px;}

div.kolommen .kolom50, div.kolommen.kolom35, div.kolommen .kolom25{background:rgba(255,255,255,0.90);} 
div.kolommen .kolom50 { padding:2em}
div.kolommen .kolom35 { padding:1.5em}
div.kolommen .kolom25 { padding:1em}

div.kolom50{max-width:49%;display:inline-block;height:auto;min-height:50px;padding:10px;}
div.kolom50.links{width:50%;margin-left:4%;margin-right:45%;}
div.kolom50.rechts{width:50%;margin-left:45%;margin-right:4%;}

div.kolom25{display:inline-block;width:22.5%; margin:1%; padding:10px;text-align:center;}
div.kolom33{display:inline-block;width:30%;margin:2.2%; padding:0px;text-align:center;}
div.kolom80{width:80%;max-width: 800px;    margin: auto;    background-color: rgba(255,255,255,0.9);    padding: 2em;    text-align: justify;}

div.kolom33:first-of-type {margin-left:0;padding-left:0;}
div.kolom33:last-of-type {margin-right:0;padding-right:0;}

h3 i {
	display: inline-block;
	font-size: 32px;
	color: inherit;
	width: 50px;
	height: 50px;
	background: var(--kleur2);
	color: #fff;
	padding: 13px 0;
	border: radius;
	border-radius: 200px;
	text-align: center;	
	margin-right: 20px;
	display: block;
	box-sizing: border-box;
}

.blockOverlay{width:100%;height:100%;position:absolute;opacity:0;background:#000;}

div.blok25{display:inline-block;width:23%;margin-right:1%;margin-bottom:1%;text-align:left;}
div.blok35{display:inline-block;width:30%;margin-right:1%;text-align:left;}
div.blok50{display:inline-block;width:47%;text-align:left;}

div.blok50:first-of-type{margin-right: 2.5%;}
div.blok50:last-of-type{margin-left: 2.5%;}

div.kolom33.links{margin-right:17%;  }
div.kolom33.rechts{margin-left:17%;  }

@media only screen and (max-width:767px){
div.kolom25, div.kolom33, div.kolom80, div.kolom50, div.blok50, div.blok25{width:auto; min-width:300px;margin:auto;display:inline-block;vertical-align:middle}
}


@media only screen and (max-width:480px)
	{
	div.kolom33{display:inline-block;width:48%;margin:0.5%; padding:10px;text-align:center;}
	div.kolom33.links{margin-right:1%;  }
	div.kolom33.rechts{margin-left:1%;  }
	}
	
@media only screen and (max-width:480px)
	{
	div.kolom25,div.kolom33,div.kolom80,div.kolom50{max-width:none;width:98%;margin:auto;display:block;text-align:center}
	div#adres{text-align:center;}
	}


/* LOGIN KNOPPERN */

div#service_login_basket {
	width: 275px;
	position: absolute;
	display: flex;
	right: 1.5em;
	background-color: var(--kleur2);
	color: var(--wit);
	top:0;
    height: 50px;
}

@media only screen and (max-width:767px){
	div#service_login_basket {
	right:10px;	
}
}

@media only screen and (max-width:481px){
	div#service_login_basket {
	width: 97%;
	height: 50px;
	position: fixed;
	display: flex;
	left: 0;
	background-color: var(--kleur2);
	color: var(--wit);
	top: unset;
	bottom: 0px;
	/* z-index: 100000; */
	box-sizing: border-box;
}
}

div#service_login_basket i {
	/* float: left; */
	height: 30px;
	margin: 10px;
	width: 30px;
	padding-top: 0px;
	font-size: 20px;
	display: inline-block;
	text-align: center;
	left: -5px;
	position: absolute;
	color: rgba(255,255,255,0.8);
	line-height: 28px;
}

div#service_login_basket a{color:var(--wit);cursor:pointer;}
div#service_login_basket h4 {
	font-size: 13px;
	position: absolute;
	left: 36px;
	top: -9px;
	text-align: left;
}
div#service_login_basket h5 {
	font-size: 11px;
	position: absolute;
	left: 36px;
	top: 7px;
	font-weight: normal;
	text-align: left;
}
div#canvas_mini_basket .quantity{	display:none;}
div#canvas_login,div#canvas_mini_basket,div#canvas_klantenservice{display:flex;flex:1;}

div#canvas_login li{display:inline-block;}
div#canvas_login a{text-decoration:none;cursor:pointer;}

#service_login_basket #canvas_login i {left:10px;}
#service_login_basket #canvas_login h4, #service_login_basket #canvas_login h5 {left:50px;}

div#canvas_speerpunten {
    display: none;
    position: fixed;
    width: 100%;
    bottom: 0px;
    left: calc(100%-250px);
    background-color: rgba(255, 255, 255, 1);
    color: #333;
    z-index: 100000;
    padding: 10px 0;
    font-size: 90%;
}

@media only screen and (max-width:481px){
	div#canvas_speerpunten{display:none;}
}
div#canvas_speerpunten ul{display:block;width:100%;max-width:1200px;margin:0 auto;padding:0;}
div#canvas_speerpunten li{display:inline-flex;padding:0 20px;}
div#canvas_speerpunten li i {padding:5px 10px 5px 0;}

div#canvas_menu{display:none;}
div#canvas_menu_hr {
	font-size: 13px;
	text-align: left;
	position: absolute;
	right: 0;
	text-align: right;
	top: 65px;
}

div#canvas_menu_hr.ingeklapt, div#canvas_menu_hr.contentpagina {top:6px;width:61%;left:175px;text-align:left;}
div#canvas_menu_hr.ingeklapt a, div#canvas_menu_hr.contentpagina a{color:var(--kleur1);}
div#canvas_menu_hr.ingeklapt a:hover, div#canvas_menu_hr.contentpagina a:hover{color:var(--kleur2);}

div#canvas_header{position:relative;height:30%;width:100%;max-height:300px;margin-top:50px;}
div#canvas_header.home{max-height:none;height:60%;height:60vh;}
div#canvas_header.contentpagina{display:none;}

div#canvas_content{position:relative;width:100%;min-height:200px;}	  
div#canvas_recenties{position:relative;width:100%;background-color:#eee;min-height:200px;padding:2em 0 2em 0;}
div#canvas_latest_blog{display:none;}

div#content{padding:0;}

div#createdby{font-size:0.8rem;color:#444;width:100%;text-align:right;padding:5px;margin:0;}
div#createdby a{color:#444;}

div.canvas_container{width:100%;max-width:1200px; position:relative; margin-left:auto;margin-right:auto;padding: 0 1.5em;}

div#broodkruimel,div#broodkruimel a{color:rgb(174, 194, 183)}
	
 	@media only screen and (max-width:767px){
		div#broodkruimel{display:none;}
		div#canvas_logo{display:block;width:80%;position:absolute;top:0;left:10%;}
		div#canvas_head{height:50px;}
		div#canvas_slider{height:60%;}
		div#canvas_zelfwaardering {	padding:1em;line-height:120%;	}
		div#zelfwaardering_eigenschappen{padding-top:0;}
		}

/* elements */

div.element{width:100%;height:auto;position:relative;}
div.element.PAGE {
	width: 100%;
	max-width: 1200px;
	margin: auto;
	padding: 6em 1.5em 4em;
	text-align: left;
}

div.element.GALLERY{background-color:var(--kleur5);}

div.element.FORM{background-color:var(--kleur5); padding:3em;}

@media only screen and (max-width:481px){
	div.element.FORM{padding:1em;}
}

.element.FORM.ACTIE {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	padding: 1em;
	background-color: rgba(0,0,0,0.4);
	text-align: center;
	border: 1px dashed #ccc;
	margin: 0;
	border-radius: 15px;
	box-shadow: 0px 30px 50px #ccc;
	height: 100%;
	/* text-align: center; */
}

.element.FORM.ACTIE .canvas_container {
	width: 100%;
	max-width: 700px;
	top: 100px;
	background: #fff;
	padding: 0em 0 2em 0;
	border-radius: 15px;
}


.element.FORM.ACTIE h3{color:#fff;}

.canvasProgress {
	width: 80%;
	padding: 5px;
	background: rgba(255,255,255,0.3);
	left: 10%;
	height: 30px;
	border: 1px solid rgba(255,255,255,0.4);
	text-align:left;
}

.progressBar {
	width: 50%;
	background: rgba(255,255,255,0.4);
	height: 100%;	
	color: #000;
	display:inline-block;
}
.progressBarTxt{padding-left:10px;font-size:0.9em;color:#fff;display:inline-block;}

#orderVoortgang {	width: 100%;	background: #eee;	padding: 6px 8px; color:#888}
.percentage {	background: #5cb85c;	height: 100%;	position: absolute;	left: 0;	top: 0;	z-index: 0;}
.voortgangTxt { z-index:2;position:relative; color:#fff;}

.element.FORM.ACTIE #formHeader{
	display:inline-block;
	width:100%;
	background-color:var(--kleur2);
	padding:1em;color:#fff;
}

element.FORM.ACTIE form{
	padding:1em;
}

div#canvas_website.ACTIE .element.PAGE{padding:1em;}

div.element.GALLERY .canvas_container{max-width:none;width:100%;}

div.element.BLOCK .imageonly {
	height: 300px;
	padding: 200px;
	opacity: 1;
}

div.element.BLOCK .imageonly h2 {
	font-size: 50px;	
	margin: 0;
    line-height: 0.55em;
	font-family: var(--lettertype20);
}

div.bullitpoints{padding:4em 0;}
div.bullitpoints ul{width:100%;max-width:800px;list-style-type:none;margin:auto;}
div.bullitpoints ul li{width:100%;max-width:380px;display:inline-block;text-align:left;padding:10px 0;}
div.bullitpoints ul li:before{content:"\2714\0020";color:var(--kleur2);}

div#fotoGallery{width:100%;display:block;position:relative;height:auto;}
div.gallery_thumb{width:20%;margin:0;padding:0;border:0;padding-top:25%;margin:0px;transition:all .6s ease;;display:inline-block;filter:alpha(opacity=100);opacity:1;cursor:pointer;}

@media only screen and (min-width:767px)
	{
	div.gallery_thumb{width:20%;margin:0 0 0 0; padding-top:19%;} 		
	div.gallery_thumb.foto-4 {width:25%;}
	div.gallery_thumb.foto-5 {width:20%;}
	div.gallery_thumb.foto-6 {width:16.6%;}
	div.gallery_thumb.foto-7 {width:14.25%;}
	div.gallery_thumb.foto-8 {width:12.5%;}
	
	div.gallery_thumb.foto-9 {width:20%;}
	div.gallery_thumb.foto-9:nth-child(n+6){width:20%;}		
	
	div.gallery_thumb.foto-10 {width:20%;}
	div.gallery_thumb.foto-11 {width:16.6%;}
	div.gallery_thumb.foto-11:nth-child(n+6){width:20%;}
	
	div.gallery_thumb.foto-12 {width:16.6%;}
	div.gallery_thumb.foto-13 {width:14.25%;}
	div.gallery_thumb.foto-13:nth-child(n+6){width:16.6%;}
	
	div.gallery_thumb.foto-14 {width:14.25%;}		
	}

@media only screen and (min-width:767px)
{
div#fotoGallery div.gallery_thumb{ width:33%;padding-top:33%;}
}

@media only screen and (min-width:1025px)
{
div#fotoGallery div.gallery_thumb{width:25%;padding-top:25%;}
}

/* videos */
iframe{width:320px !important; height:240px !important; max-width:100% !important; margin:1em 0 1em 0;}
span.video{padding:20px;}
span.video iframe{width:400px;height:300px;margin:auto;}

/* blog */
div#blog_overzicht{
    column-count: 2;
    column-gap: 40px;
}
div#blog_overzicht div{ -webkit-column-break-inside: avoid;
          page-break-inside: avoid;
               break-inside: avoid; }
.blog_feed_item {
	margin-bottom: 10px;
    padding-bottom: 10px;
	border-bottom: 1px solid #ccc;
}
.blog_feed_datum {
	color: var(--kleur6); display: none;
}

div.blog_feed a.knop{float:right;}
div.blog_item{color:#777;}
div.blog_item h2{color:#000;}
div.blog_link{text-align:right;}
div.blog_titel a{text-decoration:none;}


main { 
 	width: calc(100% - 360px);		
	display:inline-block;
	position:relative;
	margin-right:50px;
	box-sizing:border-box;
}

aside {
	width: 300px; 
	height: 100%;
	position: relative;
	background: #f4f4f4;
	padding: 30px;
	box-sizing: border-box;
	display: inline-block;
	vertical-align: top;
}

.blog-main-image {
    width: 100%;
    height: 380px;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

main h1 {
    margin-bottom: 10px;
}

main time {
    margin-bottom: 30px;
    color: #666;
    display: block;
}

aside h3 {
    margin-top: 0;
    color: var(--kleur1);
}

aside .knop {
    margin-bottom: 0;
}

.blog-auteur-info, #blog_overzicht_small{max-width:300px;margin:auto; display:inline-block;}
@media only screen and (max-width:767px)
{
	main{width:100%; border:0; display:block;}
	aside{width:100%; border:0; display:block;}
}

div#blog_navigatie {text-align:right;border-bottom:1px dotted #CCC;padding-bottom:5px;margin-top: -33px;}
div#blog_navigatie a{
    display: inline-block;
    width: 30px;
    height: 30px;
    background-color: #ff0000;
    padding: 0px;
    margin-right: 10px;
    text-align: center;
    color: #fff;
    font-weight: bold;
    font-size: 1.1em;
    border-radius: 15px;
}

div#blog_items{text-align:left;display:inline-block;vertical-align:top;width:60%;margin-right:1%;margin-bottom:4px;}
div#adres{text-align:left;width:35%;display:inline-block;text-align:left;vertical-align:top;}
div#blog_items div.blog_feed_datum{display:inline-block;width:150px;color:#C00;font-weight:bold;}
div#blog_items div.blog_feed_title{display:inline-block;width:auto;color:#eee;font-weight:normal;}


div.blog_header {
    background-position: center;
    background-size: cover;
    width: 100%;
    margin-bottom: 20px;
    height: 250px;
}

div.blog_titel,div.blog_datum,div.blog_intro,div.blog_link{padding: 0 20px;}

div.blog_block {
	margin-bottom: 40px;
	background-color: #f5f5f5;
    border-radius: 3px;
}

div.blog_block h2 {
	font-size: 1.6em;
	box-sizing: border-box;
    margin-bottom: 10px;
}

/* blog - latest 5 block */
div#canvas_latest_five_blogs {
	width: 100%;
	padding: 100px 0;
	max-width: 1100px;
	margin: auto;
}
div#canvas_latest_five_blogs a{text-decoration:none;}
div#canvas_latest_five_blogs h2{color:rgba(50, 169, 102, 1)}
span#blog_latest_1 {
	width: 50%;
	height: 350px;
	border: 1px dotted #ccc;
	display: inline-block;
	margin: 2%;
	max-width: 600px;
}
span#blog_latest_1 div.blog_image{position:relative;z-index:900; width:100%;height:100%;position:relative;}
span#blog_latest_1 div.blog_info{position:relative;z-index:901;  width:100%;height:100px;margin-top:-100px; padding:10px; background-color:rgba(255,255,255,0.7);font-size:1.1em;}
span#blog_latest_1 div.blog_info:hover{background-color:var(--kleur7);}

span.blog_recent_list{width:44%;box-sizing:border-box;display:inline-block;vertical-align:top;overflow:hidden;}
span.blog_recent_list span {
	max-height: 20%;
	width: 100%;
	vertical-align: top;
	border-bottom: 1px dotted #000;
	padding: 1em 0px 1em 1em;
	text-align: left;
	display: block;
}

span.blog_regel:hover {
	background-color: var(--kleur7);
}

div.blog_datum {
	font-size: 0.9em;
    color: #555;
    margin-bottom: 15px;
}

div.blog_auteur{font-size:0.92em;color:#111;display:inline-block;max-width:65%;overflow:hidden;}

div.blog_titel{
    
}

.blog_link .knop {
    margin: 20px 0;
    padding: 0;
    color: var(--kleur2);
    background-color: transparent;
    font-size: 110%;
    font-weight: 400;
}

@media only screen and (max-width:767px)
	{
	div#canvas_latest_five_blogs{padding:10px;text-align:center;}
	span#blog_latest_1,span.blog_recent_list{width:95%;display:block;margin:auto;height:280px;}	
	div.blog_datum{max-width:100%;width:100%;}
	div.blog_auteur{display:none;}
	span.blog_recent_list span{height:auto;}
	div.blog_datum,div.blog_titel{font-size:0.92em;width:100%;text-align:center;}
	
	}

/* Latest blogs v2 */

#canvasRecentBlogs{
	background:#fff;
	padding:2em 0;
}

.recentBlogBlock {
	display: inline-block;
	width: 22%;
	margin: 1%;
	min-width:200px;
	max-width:300px;
}

@media only screen and (max-width:900px){ .recentBlogBlock {	width: 46%;	margin: 1%;}}
@media only screen and (max-width:481px){	.recentBlogBlock {width:100%;margin:0;max-width:none;	}}

.blogHeader img{
	object-fit: cover;
	height:200px;
	max-width:100%;
	padding:4px;
	border:1px solid #ddd;
	border-radius:3px;
	background:#fff;
}

.blogIntro, .blogLink, .blogDatum{display:none;}
.blogHeader {
	margin-bottom: -70px;
}
.blogTitel {
	background: rgba(255,255,255,0.8);
	padding: 2px;
	height: 70px;
}
.blogTitel h3{font-size:18px; margin:5px 10px}

.recentBlogBlock h2{
}

/* logo */
div#canvas_logo img{max-width:250px;height:55px;padding:10px 0;/*padding-top:60px;*/transition: all 0.3s ease-in-out;margin:0;}
@media only screen and (max-width:767px){div#canvas_logo img{max-width:70%;margin:auto;}}

/* content */
div#content{margin:auto;background-color:var(--wit);}
div#shop_gadget,div#content_2{max-width:30%;display:inline-block;text-align:left;background-color:rgba(244,244,244,1);color:#555;padding:2em 1em 2em 2em;float:right;font-size:0.92em}
div#broodkruimel a{ font-size:0.92em; text-align:left; padding:bottom:10px; color:(--kleur2);}
div#content_2 img,div#content_1 img{max-width:100%;height:auto;}
div#content_2 img, div#content_1 #canvas_configurator img{border:0;}

@media only screen and (max-width:767px)
{
div#content img,div#content_1 img{float:none; display:block;max-width:80%;margin:15px auto 15px auto;!important}
div#shop_gadget,div#content_2{max-width:100%;display:inline-block;text-align:left;padding-top:2em;float:none}
}

/* --------------------------------------------------------------------------- */
/* FORMULIEREN */
/* --------------------------------------------------------------------------- */

/* Formulieren */
input.halvebreedte{width:48%;margin-right:1%;display:inline-block;}

div.div_formulier, div#formulier {	max-width: 1100px;	margin: auto;	}
div#formulier form{padding:2em 0;}

@media only screen and (min-width:767px){
	div.div_formulier, div#formulier {max-width:700px;}
	div.element.FORM div#formulier {max-width:1200px;}
	div.element.FORM #formulier form{column-count:2; column-gap:50px;}	
	}
	
#voorletters{display:none;}
div.div_formulier i{color:#00C;} 
div.form_content{float:left} 
input, textarea, select {	padding: 0.7em;	border: 1px solid #ddd;	color: #333;	width: 100%;	box-sizing: border-box;
	font-size: 1.05em;	letter-spacing: 1px; color:#000;}
input[type=radio],input[type=checkbox]{width:auto;min-width:0;}
textarea{width:100%;}
input.submit{margin-top:0.7em;width:100px;text-transform:uppercase;}
div.form_row{width: 100%; padding: 2px; margin-left:auto;margin-right:auto; }
div.form_row_klein{width:49%;display:inline-block;min-width:200px;}
div.form_field_desc{min-width: 160px; width: 100%; display: block; text-align: left; }
div.form_field_input{width:100%;display:inline-block;text-align:left;}
div.div_form_desc{}
div.form_field_desc {
	/* position: absolute; */
	font-size: 0.8em;
	padding: 0px;
	z-index: 2;
	color: var(--kleur4);
}

div.form_field_input input[type="text"], div.form_field_input input[type="password"], .form_field_textarea textarea, div.form_field_input select {
	border: 1px solid #ccc;
	border-radius: 2px;
	margin: 5px 0 10px;
	/* max-width: 300px; */
}



div.form_field_label{text-transform:uppercase;font-weight:bold;margin-top:0.5em;margin-bottom:0.5em;font-size:1.2em;}
div.form_input_comment {	display: none;	max-width: 8%;	position: absolute;	bottom: 10px; right: 0;}
/* form in gadget style */
div#content_2 div#formulier div{padding-bottom: 5px; }
div#content_2 div#formulier{background-color:#eee;padding:20px;}
 .form_field_desc{font-size: 0.8em;display:block;width:90%;}
 .form_field_input{display:inline-block;width:90%;}
span.foutmerk{color:#eb2126;font-weight:bold;padding-right:1em;}
div#validation{margin:7px;}

/* bottom */
div#canvas_bottom {
	position: relative;
	width: 100%;
	text-align: center;
	background-color: var(--kleur1);
	color: #dbdbdb;
	font-size: 0.9em;
	padding: 0 0 5em 0;
}

div#canvas_bottom img{width:36px;height:auto;}
div#canvas_bottom ul{list-style-type:none;margin-left:0;padding-left:0}
div#canvas_bottom ul li{margin-left:0;padding-left:0}
div#canvas_bottom a{color:inherit;}
div#canvas_bottom h3{color:var(--wit);text-align:inherit;font-size:1.4em;}
div#canvas_bottom div{text-align:left;}

@media only screen and (max-width:767px)
{
div#canvas_bottom div{text-align:center;}	
div#canvas_bottom ul li {
	margin-left: 0;
	padding-left: 0;
	width: 46%;
	display: inline-block;
	text-align: left;
	padding-right: 10px;
}
}

/* menu */
div#canvas_menu ul li{display:inline-block;width:auto;margin-right:10px;list-style-type:none;letter-spacing:1px}
div#canvas_menu a{color:#000;cursor:pointer;text-decoration:none;}
div#canvas_menu a:hover{font-weight:bold;}

/* templates CMS */
blockquote{
 position: relative;
  padding-left: 1em;
  color: var(--kleur1);
  border-left: 0.2em solid var(--kleur1);
  font-family: var(--lettertype1,'arial');
  font-size: 1.2em;
  font-weight: 100;
  &:before, &:after {
      content: '\201C';
      font-family: var(--lettertype1,'arial');
      color: var(--kleur1);
   }
   &:after {
      content: '\201D';
   }
}

div.intro{width:100%;position:absolute;bottom:1em;height:auto; color:var(--wit); text-shadow:1px 1px 5px var(--zwart);}
div.intro h2, div.intro h3 {color:var(--wit);}
div.intro a.knop{background-color:var(--kleur3); color:var(--wit); text-shadow:none;}

div.intro ul {
	position: absolute;
	bottom: 0px;
	left: 0px;
	text-align: center;
	width: 100%;
	background-color: rgba(255, 255, 255, 0.7);
	color: #000;
	padding-top: -10px;
	margin: 0px;
	height: 50px;
}

div.intro ul li {
	display: inline-block; 
	padding-right:20px;
	font-size: 1.1rem;
	letter-spacing: 1px;
	left: 0px;
	/* padding: -10px 0 0 0; */
	/* padding: -10px 0 10px 0; */
	margin: -10px 0 -10px 0;
}

div.intro ul li:before {
   content:  "\2713 ";
   padding-right:10px;
   color:rgba(0,153,51,1);
   font-weight:bold;
   font-size:1.1em;
}

@media only screen and (max-width:767px)	{	div.intro ul{display:none;}		}

a.download{display:none;}
@media only screen and (max-width:1400px){div.intro{font-size:2.0em;}}
@media only screen and (max-width:1400px){div.intro{font-size:1.8em;}}
@media only screen and (max-width:1024px){div.intro{font-size:1.6em;}}
@media only screen and (max-width:767px){div.intro{font-size:1.4em;width:80%;left:10%;top:10%;text-align:center;margin:auto}}
@media only screen and (max-width:480px){div.intro{font-size:1.2em;width:98%;left:1%;top:5%;text-align:center;margin:auto}}

/* menu */
.collapse-button{position:absolute;top:10px;left:10px; border-radius:5px; padding:5px;cursor:pointer;text-align:center;}
.collapse-button:hover, .collapse-button:focus{background-image:none;color:#FFF;}
.collapse-button .icon-bar {
	background-color: #7769dd;
	border-radius: 1px 1px 1px 1px;
	display: block;
	height: 2px;
	width: 22px;
	margin: 4px;
	margin-bottom: 6px;
}
div#canvas_menu_hr a{margin-left: -10px;margin-right: 10px;padding-top: 0px; color:#000; text-decoration:none;}
div#canvas_menu_hr a:hover{color:var(--kleur2);}

div#canvas_menu_hr ul.sub-menu li a{color:#888;}
div#canvas_menu_hr ul.sub-menu li a:hover{color:#000;}
div#canvas_menu_hr li {	display: inline-block;	margin: 0 10px 0 10px;}
div#canvas_menu_hr li:last-child{border:none;}
div#canvas_menu_hr span.sub-collapser{display:none;}

ul.slimmenu li {margin-left:-10px;}
ul.slimmenu li:last-child {}
ul.slimmenu li ul li{border:0px;background-color:none;width:150px;text-align:left;}
div#canvas_menu_hr ul.sub-menu{
background-color:var(--kleur3);
-webkit-box-shadow: 3px 3px 12px 0px rgba(50, 50, 50, 0.18);
-moz-box-shadow:    3px 3px 12px 0px rgba(50, 50, 50, 0.18);
box-shadow:         3px 3px 12px 0px rgba(50, 50, 50, 0.18);
padding:5px;
}
ul.slimmenu{list-style-type:none;margin:0;padding:0;}
ul.slimmenu li{position:relative;display:inline-block;box-sizing:border-box;}
ul.slimmenu li:last-child{border-right:0xp;}
ul.slimmenu > li{}
ul.slimmenu > li:first-child{border-left:0}
ul.slimmenu > li:last-child{margin-right:0}
ul.slimmenu li a{display:block;padding:5px;
transition:background-color 0.2s ease-out; -o-transition:background-color 0.2s ease-out; -moz-transition:background-color 0.2s ease-out;
-webkit-transition:background-color 0.2s ease-out; box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box}
ul.slimmenu li a:hover{text-decoration:none;}

ul.slimmenu li .sub-collapser{color:#eee;position:absolute;right:0;top:0;width:30px;height:100%;text-align:center;z-index:999;cursor:pointer;}
ul.slimmenu li .sub-collapser:before{content:'';display:inline-block;height:100%;vertical-align:middle;}
ul.slimmenu li .sub-collapser > i{display:inline-block;vertical-align:middle;}
ul.slimmenu li ul{list-style-type:none;}
ul.collapsed{}
ul.collapsed li{padding-left:10px;padding-right:10px;}

@media only screen and (min-width: 767px)
{
ul.slimmenu li ul a{list-style-type:none;padding:5px;border-bottom:1px dotted #eee;font-weight:normal;}
}

ul.slimmenu li ul li{min-width:240px;}
ul.slimmenu li ul li:last-child{}
ul.slimmenu li ul li:first-child{}
ul.slimmenu li ul li:hover{min-width:240px;}

ul.slimmenu li > ul{display:none;position:absolute;left:0;top:100%;z-index:999;font-weight:400}
ul.slimmenu li > ul > li ul{display:none;position:absolute;left:-100%;top:0;z-index:999;width:100%;}

ul.slimmenu.collapsed li > ul{width:100%;box-sizing:border-box;}
ul.slimmenu.collapsed li{display:block;width:auto;-webkit-box-sizing:border-box;margin:0px;margin-top:5px;margin-bottom:5px;}
ul.slimmenu.collapsed li a{display:block;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;color:#000;}
ul.slimmenu.collapsed li .sub-collapser{height:40px;}
ul.slimmenu.collapsed li > ul{display:none;position:static;}

/* YOU TUBE */
 p:has(div.youtube-player){display:inline-block;}
  
  div#canvas_website .youtube-player {
        position: relative;
        /* Use 75% for 4:3 videos */
        height: 0;
        overflow: hidden;
		width:320px;
		height:250px;		
		display:inline-block;                
        margin: 5px;
    }
    
    .youtube-player iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 100;
        background: transparent;
    }
    
    .youtube-player img {
        bottom: 0;
        display: block;
        left: 0;
        margin: auto;
        max-width: 100%;
        width: 100%;
        position: absolute;
        right: 0;
        top: 0;
        border: none;
        height: auto;
        cursor: pointer;
        -webkit-transition: .4s all;
        -moz-transition: .4s all;
        transition: .4s all;
    }
    
    .youtube-player img:hover {
        -webkit-filter: brightness(75%);
    }
    
    .youtube-player .play {
        height: 72px;
        width: 72px;
        left: 50%;
        top: 50%;
        margin-left: -36px;
        margin-top: -36px;
        position: absolute;
        background: url("//i.imgur.com/TxzC70f.png") no-repeat;
        cursor: pointer;
    }

/* VEEL GESTELDE VRAGEN */
#accordion h3{border-bottom:1px solid #eeeeee;}
h3.ui-state-hover{color:#eb2126};
h3.ui-accordion-header-active{color:#eb2126;}
div.antwoord{padding-left:5%;padding-bottom:1%;box-sizing:border-box;border-bottom:1px solid #eeeeee;}

div#shop_gadget,div#content_2{max-width:30%;display:inline-block;text-align:left;}
div#broodkruimel{font-size:0.92em;text-align:left;padding:bottom:10px;border-bottom:1px dotted #eee;}
div#content_2 img,div#content1 img{max-width:100%;height:auto;}

/* LOGIN KNOP */
div#login_knop{    margin:5px;      background-color: var(--kleur1);    color: var(--wit);    padding: 5px;    border-radius: 19px;    text-align: center;    }
div.buttons_login_menu{width:100%;color:#090;font-weight:bold;}

/* CATEGORIE */
span#navigatie{}
span#navigatie a{
	padding:5px;
	background-color:#fff;	
	margin-right:5px;
	padding-left:10px;
	padding-right:10px;
	border-radius:20px;
	margin-right:5px;
	
}
span#navigatie a.actief{
	background-color:#f00;
	color:#fff;}
	

	 	 
div.product_omschrijving{height:100px;overflow:hidden;}

.product_block {
	width: 245px;
	display: inline-block;
	margin: 20px;
}

.product_img {
	max-width: 250px;
	max-height: 150px;
	margin: auto;
	height: auto;
	width: auto;
	min-height: 150px;
	margin: 10px auto;
}

.product_name {
	font-size: 110%;
	font-weight: bold;
	/* padding: 10px; */
	margin-bottom: 10px;
}

.product_price.exclusief {
	color: var(--kleur4);
	margin: 10px auto;
}

div#canvas_categories{max-width:1300px;margin:3em auto 0;}
div#shopCategory{}
div#category_intro{width:100%;max-width:800px;text-align:left; display:inline-block;margin:1em;padding:1em;}
div.category_link {
	width: 22%;
	margin: 0 1.35% 2.25em;
	display: inline-block;
	height: auto;
    border: 1px solid #ddd;
    border-radius: 3px;
}

div.category_link:hover {
    cursor: pointer;
    border: 1px solid var(--kleur2);
}

div.category_link .product_img {
    width: 100%;
    height: 165px;
    max-width:none;
    max-height:none;
    background-position: center !important;
    background-size: cover !important;
}

div.category_link .category_name {
    margin: 0;
    text-align: left;
}

div.category_link .category_name a {
    display: block;
    padding: 16px;
}

div.category_link .category_name a:hover {
    text-decoration: none;
}

@media only screen and (max-width:767px){
	div.category_link{width:46.8%; }
	.category_name{margin:10px 0;}
}

#category_price{width: 100%; border: 1px solid #ddd; border-radius:3px;border-spacing:0;overflow:hidden;}
#category_price tr th:first-of-type{display:none;}
#category_price tr td:first-of-type{display:none}
#category_price tbody tr:first-of-type {background:#f5f5f5;}
#category_price tbody tr:last-of-type td {border:0;}
#category_price th, #category_price td{text-align:left;padding: 10px 0;vertical-align:top;}
#category_price th:nth-child(2), #category_price td:nth-child(2){padding-left: 20px;}
#category_price a {display:inline-block;}

#category_price thead {background:var(--kleur2);color:#fff;}
#category_price th {font-weight:400;}

#category_price tbody tr:hover td:nth-child(2){background:#f2f7fc;}
#category_price tbody tr td:hover{background:#f2f7fc;}

#category_price tr td {border-bottom: 1px solid #ddd;width:24%}
.prijstabelOmschrijving{margin:0 auto 25px;}
.category_name {
	color: var(--kleur4);
	font-weight: bold;
	/* padding: 20px; */
	text-align: center;
	/* text-decoration: underline; */
	margin: 30px 0 0;
}
div.sub_category_list{width:100%;display:inline-block;padding:1em;padding:4px;}
div.sub_category_link{width:47%;display:inline-block;
border-bottom:1px #eee dotted;margin-bottom:15px;margin-left:auto;margin-right:auto;margin-top:20px;padding:10px;}
div.sub_category_name{font-weight:bold;color:#000;width:100%;background-color:#eee;margin:4px;padding:5px;text-align:center;}
div.sub_category_img{width:190px;height:125px;}
div.sub_category_img img{width:100%;height:100%;border:1px solid #333;margin:5px;}
div.sub_category_intro{min-height:100px;padding:1em;text-align:justify;font-size:0.9em;color:#333}
div.sub_category_url{width:100%;height:auto;padding:5px;text-align:center;}
div.sub_category_url a{font-weight:300;color:#aaa;}

/*basket*/
div#canvas_minicart {       position: absolute;    right: 0;	top:0px;    padding: 15px;
    font-size: 0.8em;		border:1px solid #eee;		background-color:#fff;	border-radius:10px;	margin:10px;	min-width: 240px;}
div#canvas_minicart img{width:45px;height:auto;margin:10px;}

#div_basket{text-align:center;}

/* checkout */
/* checkout */
div#checkoutFormulier{max-width:1150px;margin:auto;}

div.subtotal,div.shipping,div.discount,div.coupon,div.korting,div.subtotal2,div.btw,div.total,div.product_regel{width:100%;text-align:right;}
div.total,div.subtotal,div.subtotal2{font-weight:bold;border-top:1px solid #333;}
#canvas_basket_ro .priceExclBtw{	min-width:0;}
.invisible{display:none !important;}

#canvas_basket_ro .priceExclBtw:after, #canvas_basket_ro.priceInclBtw:after{content:'';}

form#NieuwAfleverAdresFormulier .regel {
	padding: 5px 0;
}
div#canvas_checkout {    font-size: 0.8em;     margin-left: auto;     margin-right: auto;    text-align: left;    max-width: 900px;}
div.verzend_methode,div.verzend_adressen,div.betaal_methode,div.order_referentie,div.order_bericht,div.algemene_voorwaarden,div.order_afsluiting,div.factuur_gegevens,div.verzend_gegevens{	text-align:left;		padding:10px;	border-bottom:1px dotted #eee;}

div.checkout_halfblok{display:inline-block;width:90%;max-width:400px;padding:10px;border:1px solid #eee;border-radius:10px;text-align:left;margin:10px;min-height:200px;
background-color:#fff;}

input.afrond-button {    background-color: var(--kleur8);    color: #fff;     font-size: 1rem;    margin-top: 10px;    display: block; cursor:pointer; font-weight:600; float:none!important;}

div#checkoutFormulier{
	display:block;
}

div#nieuwAfleverAdres, div.popupFormulier, #formulierAdres {
	display: none;
	width: 100%;
	max-width: 600px;
	margin: auto;
	padding: 2em;
	border: 1px solid #eee;
	border-radius: 4px;
	position: fixed;
	z-index: 10001;
	background: #efefef;
	left: 0;
	right: 0;
	top: 10%;
	/* bottom: 0; */
	max-height: 80%;
	/* height: auto; */
	/* box-shadow: 7px 7px 7px #eee; */
	overflow-y: scroll;
	border: 2px solid #fff;
	border-radius: 0;
}


/* categorie overzicht */
div#canvas_categorien{width:100%;display:block;text-align:center;position:relative;top:100px;background:var(--kleur2);padding:10px;}
div#canvas_categorien ul{margin:0 auto;padding:0;}
div#canvas_categorien ul li {list-style-type: none; display: inline-block; margin: 0; padding: 0 15px; font-size: 0.9em; border-right: 1px solid #f2f7fc;}
#canvas_categorien #categorien li:last-of-type {padding-right:0;border-right:0;}

div#canvas_categorien ul li ul {
	width: auto;
	display: none;
	position: absolute;
	box-shadow: 0px 3px 6px rgba(0,0,0,0.2);
	text-align: left;
	/* left: 0; */
	background: #fff;
	max-height: 500px;
	/* min-height: 200px; */
	overflow: hidden;
	column-count: 1;
	box-sizing: border-box;
	/* padding: 30px 200px; */
	/* padding-left: calc(50% - 500px); */
	/* padding-right: calc(50% - 500px); */
	font-size: 14px;
}

div#canvas_categorien ul li ul li {padding:0;}

div#canvas_categorien .subcategorien li {border-right:0;}

#canvas_categorien .subcategorien .categoryMenuOption a {
    display: block;
    padding: 5px 10px;
    color: var(--kleur1);
}

#canvas_categorien .subcategorien .categoryMenuOption a:hover {
    background: #f2f7fc;
    color: var(--kleur2);
}

#canvas_categorien .categoryMenuOption a:hover {
    color:#fff;
}

@media only screen and (max-width:767px){

div#canvas_categorien ul li ul
{
	padding:10px;
	column-count:2;
	max-height:100%;
}
	
}
.categoryheader {
	font-weight: bold;
	font-size:1.1em;
	color: var(--kleur1);
	padding-bottom:1em;
}

div#canvas_categorien ul li ul li{display:block;background-color:#fff;width:180px;}
div#canvas_categorien ul li ul li:first-child {padding-top:0em;}
div#canvas_categorien ul li ul li:last-child {padding-bottom:0em;}
div#canvas_categorien ul li:hover ul{display:block;}

div#canvas_categorien ul li a{color:#fff;text-decoration:none;padding: 6px 0;display:inline-block;font-weight: 600;}
.product_img {	width: 150px;	height: 150px;	margin:auto;}

.category_link .product_img {width: 180px; height: 180px;}
.category_link .category_name {margin:15px 0 0;}

/* prijstabel */
#products_list {
	max-width: 600px;
	text-align: left;
	border: 1px solid #eee;
	padding: 20px;
	margin:auto;
}
.prijsknop {
	width: 50%;
	display: inline-block;
	/* float: left; */
	text-align: right;
	margin-right: 10px;
}
div.productCell{width:22%;margin-right:2%;display:inline-block;border-right:1px solid #eee;border-bottom:1px solid #eee;height:20px;text-align:right;}

.prijsNetto{display:block;}
.prijsBruto{display:block; font-size:0.92em; text-decoration:line-through;}

/* product configurator */
div#canvas_configurator{width:100%;max-width:1200px;text-align:left;margin: 30px auto 0;}
div#content_1 div.configuratorOptie img{height:130px;width:130px;}

div.configuratiestap{border-bottom:1px dotted var(--kleur1);margin-bottom:10px;text-align:center;font-size:0.84em;color:var(--kleur2);}
div.configuratorOptie{width:49%;display:inline-flex;align-items:center;cursor:pointer;border:1px solid #ddd;padding:25px;margin-bottom: 20px;text-align:left;border-radius:3px;}
.configuratorOptie:hover {border:1px solid var(--kleur2);}

div#content_1 div.configuratorOptie img {display:inline-block;}

#configuratie1 div:nth-of-type(odd), #configuratie2 div:nth-of-type(odd), #configuratie3 div:nth-of-type(odd), #configuratie4 div:nth-of-type(odd), #configuratie5 div:nth-of-type(odd), #configuratie6 div:nth-of-type(odd) { margin: 0 1.45% 0 0; }

div.configuratorOptie.gekozenOptie{font-weight:bold;display:block;color:var(--kleur2);font-size:1.6em;width:100%;margin: 0 0 6px !important;border-radius:0;}
div#content_1 div.configuratorOptie.gekozenOptie img {display:none;}

div.configuratorOptie.gekozenOptie .category_name:before{	 content:  "\2713 ";   padding-right:20px;   color:rgba(0,153,51,1);   font-weight:bold;   font-size:1.1em;	position:relative;top:1px;}	
div.configuratorOptie.gekozenOptie .category_name {
	margin: 0;
	text-align: left;
	/* border-bottom: 1px dotted #ddd; */
	/* padding: 0; */
}

div.gekozenOptie {background:#eee;border:0;text-align:left;}
.gekozenOptie:hover {border:0;}
div#canvas_configurator .gekozenOptie .category_name {font-size:22px;font-weight:600;color:#888;}


div#canvas_configurator span.category_name br{display:none;}

div#priceTableFooter{color:#888; font-size:0.9em; margin: 40px auto 0;}
.dgticon{margin-right:10px;}
div.configuratorOptie.gekozenOptie img{display:none;}
h3.gekozenOptie{display:none;}
div.configuratorOptie img{max-width:140px;width:90%;height:auto;margin:0 40px 0 0;display:block;}
div#canvas_configurator span.category_name {display: inline-block;text-align:left;margin:0;font-size:1.25em;font-weight:600;}

.prijsknop-img {width: 16px; height: auto; margin: 2px 0 0 8px;}

.resetOptions {
	max-width: 19%;
	display: inline-block;
	color: #888;
	font-size: 16px;
	cursor: pointer;
	padding: 4px 13px 4px 5px;
	border-radius: 2px;
	border: 1px solid #888;
	float: right;
    position: relative;
    top: -4px;
}

.resetOptions:hover {text-decoration:none !important;background:#fff;}

@media only screen and (max-width:767px){
	div.configuratorOptie.gekozenOptie{font-size:1.2em;}
	.resetOptions{font-size:13px;}
}

.resetOptions:hover {text-decoration:underline;}
.resetOptions i{transform:rotate(0deg);transition:0.5s all ease-in-out;}
.resetOptions:hover i{transform:rotate(180deg);}
.disabledOnClick{ pointer-events:none;}

div#canvas_configurator span.category_name>span {display:none;width:35px;background:color:#eee;border-radius:20px;vertical-align:top;box-sizing:border-box}
div#categoryConfigurator {    max-width: 1200px;    margin: auto;}
div.categoryImage, div.categoryDescription, div.categoryExtra { display:inline-block; min-height:300px;}
div.categoryImage {
	width: 40%;
	text-align: left;
max-width: 500px;
}
div.categoryImage {padding:0 35px 0 0;}
div.categoryDescription {padding:0 35px 0 0;}
	
div.categoryDescription {width:40%;text-align: left; color:var(--kleur1);}
div.categoryExtra {max-width:19%;text-align:left}
.categoryExtra h3 {margin-top:0;}

@media only screen and (max-width:1024px){
div.categoryDescription{width:59%;}
div.categoryExtra{display:none;}
}

ul.checkPoints{list-style-type:none;text-align:left;padding:0}
ul.checkPoints li:before { content:"\2714\0020"; color:var(--kleur2); } 

.categoryName {
    margin-top: 0;
}




@media only screen and (max-width:767px){
div.categoryImage, div.categoryDescription, div.categoryExtra { width:block;width:100%;padding:10px; min-height:unset;}
div.categoryImage {text-align:center;}
div.categoryDescription {text-align: }
div.categoryExtra {display:none;}
div.configuratorOptie {	width: 32%;}
#category_price tr td {text-align: left;	padding: 10px 0;	font-size: 13px;}
div#content_1 div.configuratorOptie.gekozenOptie img{display:none;}

div#canvas_configurator span.category_name{width:auto;}

}
@media only screen and (max-width:481px){
	div.configuratorOptie {	width: 49%;}
}

/* shop gadget / right */
#shop_gadget{padding-top:20px;}
#shop_gadget>div {    width: 100%;    max-width: 300px;    padding: 20px 30px 20px 30px;    background-color: rgba(250, 250, 250, 1);
    border-radius: 10px;    text-align: left;    margin-bottom: 15px;    font-size: 0.92em;    border: 1px solid #eee;}
#shop_gadget ul{padding:0}
#shop_gadget ul li{margin-left:0;padding-left:0;list-style-type:none;}


div#winkelmandje {
	width: 70%;
	margin-left: auto;
	margin-right: auto;
	display: inline-block;
	vertical-align: top;
	border: 1px solid #eee;
	padding: 13px;
	border-radius:var(--radius);
	/* border-radius: 9px; */
	/* background-color: #eee; */
}
#winkelmandje .fa-remove{color:#930;}
#winkelmandje .fa-plus-circle{color:#063;}
#winkelmandje .fa-minus-circle{color:#900;}
#kortingscode .knop{font-size:1em; font-size: 1em; margin: 12px 10px 20px; display: block;text-align:center;}
#knopBestellen {
    background-color: var(--kleur8);
}

#knopWinkelen {
	background: #805b4466;
	border: 0;
}
@media only screen and (max-width:481px){
#kortingscode .knop{max-width:120px;padding:10px;width:45%;display:inline-block;margin:5px 2px;}
}

div.item{width:100%;display:block;border-bottom:1px solid #eee;margin:5px;padding:5px;}
div.item span{padding:5px;box-sizing:border-box;}

div.kop span {
	padding: 5px;
	font-weight: bold;
	font-size: 0.9em;
	text-transform: uppercase;
	color: #000;
}
span.product_aantal{display:inline-block;width:8%;text-align:left;}
span.product_naam{display:inline-block;width:48%;text-align:left;}
span.buttons{width:15%;display:inline-block;}
.product_naam i{display:block; margin-right:10px; display:inline-block;}
span.product_prijs{display:inline-block;width:10%;text-align:right;}
span.product_totaal{display:inline-block;width:15%;text-align:right;}
.product_maat {	display: block;	height: auto;	color: var(--kleur1);}

span.omschrijving{display:inline-block;width:81%;padding:5px;text-align:right;}
span.waarde{display:inline-block;width:14%;text-align:right;padding: 5px;}

span.product_thumb{display:none;}
div#kortingscode {
	width: 25%;
	display: inline-block;
	vertical-align: top;
	margin-left: 2%;
	padding: 10px;
	background-color: #eee;
	border: 1px solid #ddd;
	text-align: left;
	border-radius:var(--radius);
}

@media only screen and (max-width:768px){
div.item span{padding:2px;}
span.product_aantal{width:5%;}
div.item {	padding: 9px 0;}
span.product_prijs {width: 14%;}
div#winkelmandje {	font-size:0.92em;	width: 100%;	display: inline-block;	padding: 5px;}
div#kortingscode {	width: 100%;	display: block;	margin-left: 0;	padding: 5px;	text-align: center;}	
}

@media only screen and (max-width:600px){
	
.item.kop {	display: none; font-size:12px;}

span.product_naam {
	width: 100% !important;
	position: absolute;
	text-align: center;
	left: 0;
	top: 0;
	font-size: 100%;
	max-height: 26px;
	overflow: hidden;
}
span.product_naam span{display:none;}

span.product_totaal {
	display: inline-block;
	width: 30%;
	text-align: right;
	position: absolute;
	left: 30%;
	top: 40px;
}

span.product_prijs {
	width: 14%;
	position: absolute;
	left: 13%;
	top: 40px;
}

span.buttons {
	display: inline-block;
	top: 40px;
	width: 40%;
	position: absolute;
	left: 60%;
	font-size: 155%;
}
.buttons i{margin:-5px 0 0 0;}

span.product_aantal {
	width: 15%;
	position: absolute;
	left: 0;
	top: 40px;
	font-size: 100%;
	font-weight: bold;
}
div.item {
	width: 100%;
	display: block;
	border-bottom: 1px solid #f1ede8;
	margin: 5px;
	padding: 5px;
	height: 80px;
}

.subtotalen{text-align:right;}
.subtotalen .regel span{display:inline; padding-right:5px;}

}

/* meldingen */
.melding:empty, .error:empty {
	display: none !important;
}
div#error{width:500px;display:block;margin:auto;padding:10px;border:1px solid #900;color:#000;font-weight:bold;}
div#error li{font-weight:normal;text-align:left;list-style-type:none;margin:0;}
div#melding{color:#f00;font-weight:bold;margin:10px 0 0 0;}

div#error, .error {
	/* color: red; */
	border: 1px solid #ccc;
	padding: 10px 10px 10px 50px;
	border-style: dashed;
	max-width: 750px;
	background: var(--kleur2);
	color: #fff;
}
div#error::before, .error::before {
	color: ;
	content: '!';
	color: #f00;
	position: absolute;
	left: 10px;
	width: 22px;
	height: 23px;
	/* border-radius: 10px; */
	background: #f00;
	color: #fff;
	font-weight: bold;
	text-align: center;
	padding-p: ;
	padding: 0;
}

/* mydata */
div#myData {max-width:980px;padding:2em;margin:auto; }
div#myOrders{}
div#myAdress{text-align:left;}
div#myData h3{width:100%;text-align:left;border-bottom:1px dashed #ddd;}

span.orderRegel{width: 100%;border-bottom: 1px solid #eee;display: block;padding:5px;text-align:left;position:relative}
span.orderRegel span{display:inline-block;padding:5px 15px 5px 0; font-size:0.92em;}

span.orderNo{width:45px;}
span.orderDatum, span.factuurBedrag{width:90px;}

span.factuurBedrag{text-align:right;}
span.factuurDatum{width:120px;}

span.orderRegel:nth-child(2n) {
	background: #f6f6f6;
}

@media only screen and (max-width:481px){
div#myData{padding:0;}
div#myData .blok50{width:100%;}
span.orderNo{width:50px;}

span.orderRegel span{padding:0 5px;}
span.orderRegel{height:70px;}
span.orderDatum{position:absolute;top:15px;left:0;width:90px;height:35px;}
span.orderNo{position:absolute;top:40px;left:0;width:90px;height:35px;}
span.factuurBedrag{position:absolute;top:15px;left:90px;width:105px;height:35px;}
span.factuurDatum{position:absolute;top:40px;left:90px;width:105px;height:35px;}
span.orderStatus{position:absolute;top:14px;left:200px;width:calc(100% - 200px);height:70px; padding:0}
span.orderStatus span{display:block;height:25px}


}


#drieKolommenRondIcoon{padding:5em 2em;background:#f2f7fc;}

#canvas_labels {	background: #fff;	padding: 2em;}
div.vendorBlock { width:180px;  display:inline-block; margin:10px; }
#canvas_labels img{max-width:100%;height:auto;margin:auto;}

.labelDescription {
	color: var(--kleur3);
	font-size: 0.9em;
}


@media only screen and (max-width:481px){
	#canvas_labels{display:none;}
	div.vendorBlock{width:30%;margin:1%;}
	#drieKolommenRondIcoon{padding:2em 0;}
}


/* Producten overzicht */


/* Product slider */







/* Black Overlay Pop ups */
.black_overlay{display: none;position: fixed;top: 0;left: 0;width: 100%;
height: 100%;background-color: black;z-index:1001;-moz-opacity: 0.8;opacity:.80;filter: alpha(opacity=80); }
.white_content {    display: none;	text-align:left;    position: fixed;    top: 15%;    left: calc(50% - 200px);    width: 400px;    padding: 20px;    background-color: #FFF;    z-index: 1002;    overflow: auto;    line-height: 150%;    border-radius: 10px;}
.white_content h2 {margin-top:0;}
.white_content .input_login {margin: 0 0 10px;}
.white_content .knop {margin: 20px 0 0;}
.white_content #login_form {margin: 0 0 20px;}

@media only screen and (max-width:481px){
	.white_content{ top:4%; left:4%;width:92%;	}
	}
	
.fa::before {padding: 5px;}
#canvas_menu_hr .fa::before{color:var(--kleur2);}


#canvas_categorien {	box-shadow: 0px 2px 6px rgba(0,0,0,0.2);}

/* betands uploader */
#drag-and-drop-zone {
	width: 100%;
	/* max-width: 500px; */
	background: #fff;
	padding: 2em;
	border: 1px dashed #ccc;
	border-radius: 10px;
	text-align: center;
}
.canvas_uploader {
	width: 100%;
	max-width: 500px;
	padding: 10px;
	/* border: 1px solid var(--kleur2); */
	background: #eee;
}
ul#files {	margin: 0;	padding: 5px;}
ul#files li {	list-style-type: none;}
.progress {background-color:#fff;}
.progress-bar {background-color:#ddd;}

/* voor pagina featured items */
.imageContainer {
	height: 200px;
	width: 200px;
	text-align: center;
	padding: 5px;
	margin: auto;
}
.imageContainer .alternative{display:none;}

.featuredItem {
	width: 18%;
	display: inline-block;
	padding: 5px;
	vertical-align: top;
	margin: 30px 1%;
	/* border: 1px so; */
}

.canvas_container .featuredItem:first-of-type {margin-left:0;}
.canvas_container .featuredItem:last-of-type {margin-right:0;}


@media only screen and (max-width:767px){
	.featuredItem{width:31%;margin:0.5%}
	}
@media only screen and (max-width:481px){
	.featuredItem{width:48%;margin:0.5% 0.5% 20px 0.5%}
	.imageContainer {	width: 150px;	height: 150px;}
	}


.featuredItem .productPrice {
	font-size: 1.2em;
	color: var(--kleur2);
	font-weight: bold;
}

#featuredProductSlider  div.product_info {display:none;}
#featuredProductSlider  div.product_omschrijving {display:none;}
#featuredProductSlider .featuredItem{width:100%;}
#featuredProductSlider {
	max-width:1200px; 
	margin: 1em auto 3em;
    padding: 0 1.5em;
	/* background: #eee; */
}

.owl-nav {
	position: absolute;
	width: 60px;
	left: calc(50% - 30px);
	top: 0%;
}

.owl-nav button {
	width: 20px;
	height: 20px;
	border-radius: 20px;
	margin-right:10px;
	background: #ccc;
	color: #fff;
	font-color:10px;
	padding:5px 0;
}

/* CONTENT BLOKKEN */

#Block_PAGE14 {
    display: none;
}

#Block_FIXEDBLOCK21 {
    padding: 0 0 30px;
}

#Block_BLOCK27 {
    padding: 30px 0 44px;
}

#Block_BLOCK27 p a {
    color: var(--kleur2) !important;
}

#Block_BLOCK28 {
    padding: 3em 0 1em;
}

div#Block_BLOCK28 h2, div#Block_BLOCK31 h3 {
    color: var(--kleur2) !important;
}

#Block_BLOCK29 {
    padding: 6em 0 4em;
}

div#Block_BLOCK26 .kolom a {
    color: var(--kleur2) !important;
}

/* AFREKENEN */
#canvas_shop #checkoutFormulier h3 {
    background: var(--kleur2);
}

#canvas_shop span.productAantal, #canvas_shop span.productNaam, #canvas_shop span.productPrijs, #canvas_shop span.productSubtotaal {
    border: 0 !important;
    box-sizing: border-box;
    overflow: auto !important;
}

#canvas_shop span.productAantal {
    width: 7%;
}

#canvas_shop span.productNaam {
    text-align: left;
    width: 52%;
    height: auto;
}

#canvas_shop span.productPrijs, #canvas_shop span.productSubtotaal {
    width: 18%;
}


/* NIEUWSBRIEF */

#mc_embed_signup input.email {letter-spacing: 0; font-size: 14px;}
#mc_embed_signup input.button {font-size:14px; display:block; width:50%; padding: 12px 22px 16px;}

/* LOWER FOOTER */
#lowerft {padding: 1em;}
#lowerft p {font-size: 13px; margin: 0;}
#lowerft a {color: var(--grijs)}

div#canvasShopStart{display:block;width:100%;padding:150px 1.5em 50px;max-width:1200px;margin:auto;}
div#productSlider{width:861px;height:484px;display:inline-block;margin-right:20px;border:1px solid #eee; background:#ccc;padding:0;overflow:hidden;	}

@media only screen and (max-width:767px){
	div#shopKlantenService{display:none;}	
	div#canvasShopStart {
	display: block;
	width: 100%;
	padding: 50px 0;
	max-width: 1200px;
	margin: auto;
}}



#productSlider li, #productSlider2 li {
	
	width:830px; height:453px;
	overflow: hidden;
	position: relative;
}

	@media only screen and (min-width:900px) and (max-width:1025px)
	{
	div#productSlider, #productSlider li, #productSlider2 li{		width:680px; height:430px;}
	}	

	@media only screen and (min-width:800px) and (max-width:900px)
	{
	div#productSlider, #productSlider li, #productSlider2 li{		}
	}	

	@media only screen and (min-width:700px) and (max-width:800px)
	{
	div#productSlider, #productSlider li, #productSlider2 li{	width:680px; height:373px;	}
	}
	
	@media only screen and (min-width:600px) and (max-width:700px)
	{
	div#productSlider, #productSlider li, #productSlider2 li{	width:580px; height:318px;	}
	}	
	
	@media only screen and (min-width:480px) and (max-width:600px)
	{
	div#productSlider, #productSlider li, #productSlider2 li{	width:470px; height:258px;	}
	}		

	@media only screen and (max-width:480px)
	{
	div#productSlider, #productSlider li, #productSlider2 li{	width:350px; height:192px;	}
	}		


div#productSlider img{min-width:100%; max-width:100%; height:auto;margin:auto; position: relative; left: 0px; top:0;}
div#productSlider .slideComment {	width: 38%;	height: auto;	background: rgba(255,255,255,0.85);	top: 55%;	left: 0;	padding: 5px 2em;	text-align: right;
position:absolute}

.slideComment .knop {	left: 250px;	top: -70px;	position: relative;}
.slideComment h4{color:var(--kleur2);font-size:150%;font-weight:bold;margin:5px 0;}	

@media only screen and (max-width:900px){
	
	div#productSlider{width:700px;height:385px;margin:auto;}
	div#productSlider .slideComment{ width:100%; height:80px; top:-100px; }
	.slideComment h4{color:var(--kleur2);font-size:130%;font-weight:bold;margin:5px 0;}	

}

svg.above_form {
	width: 300px;
	height: 30px;
	position: absolute;
	left: 0;
	background: transparent;
	z-index: 1;
	fill: #fff;
	/* max-width: 200px; */
	/* margin: auto; */
	left: calc(50% - 150px);
	margin-top: -1px;
}

div#shopKlantenService { display: inline-block;	width: 270px; padding: 26px; border: 1px solid #ddd; text-align: left; font-size:0.9em;}
#shopKlantenService h3 {margin:0 0 20px;}

@media only screen and (max-width:1000px){div#shopKlantenService{display:none;}}
div#shopKlantenService span{display:block;}

div#shopKlantenService .aandacht {	color: var(--kleur2);	/* font-weight: bold; */	font-size: 1.1rem;	margin: 4px 0 0;}
div#shopKlantenService h4 i{color:var(--kleur2);margin-right:5px;}
div#shopKlantenService h4{font-size: 20px; padding: 0; margin: 20px 0 5px 0; color: var(--kleur1);}


div#canvas_content{max-width:100%;overflow:hidden}

.chat, .bel {padding-bottom:20px;border-bottom:1px solid #ddd;}

.product-price-table-container {overflow-x:auto;}

#drieKolommenRondIcoon h3 {padding-top:0;margin-top:0;}

h2#ID26-1 {display:none;}
#Block_BLOCK7 {padding:0;}



/* SOCIAL MEDIA FOOTER */
#socialmedia_logos {margin: 15px 0 0;}
.social-link {display:inline-block;line-height:36px;margin: 0 10px 0 0;}


/* RESPONSIVE AANPASSINGEN - XEBIUS-LEVI */

@media only screen and (min-width:320px) and (max-width:480px) {
    /* balk onderin */
    div#canvas_klantenservice {display:none;}
    
    /* product pagina */
    .resetOptions {width:12px;height:19px;overflow:hidden;}
    .category_link .product_img {width:120px;height:120px;}
    .category_link .category_name {font-size:14px;}
}

@media only screen and (max-width:480px) {
    /* algemeen */
    .kolom33 i.fa {display:none;}
    
    /* product pagina */
    div.configuratorOptie {padding:15px;}
    div#content_1 div.configuratorOptie img {width:75px;height:75px;}
    div#canvas_configurator span.category_name {font-size:1em;}
    div.configuratorOptie.gekozenOptie {padding:10px;}
    div#canvas_configurator .gekozenOptie .category_name {font-size:0.8em;}
    
    div.category_link {width:97%;}
}

@media only screen and (max-width:767px){
    /* helpdesk */
    #tawkchat-container {display:none;}
    
    /* product pagina */
    div.element.PAGE {padding:1.5em;}
    div.categoryImage, div.categoryDescription, div.categoryExtra {padding:0;}
    div.categoryDescription {margin: 0 0 30px;}
    div.categoryImage {margin-bottom:20px;}
    div#content img, div#content_1 img {margin:0;max-width:100%;}
    div.configuratorOptie {width:100%;margin-bottom:10px;}
    #configuratie1 div:nth-of-type(odd), #configuratie2 div:nth-of-type(odd), #configuratie3 div:nth-of-type(odd), #configuratie4 div:nth-of-type(odd), #configuratie5 div:nth-of-type(odd), #configuratie6 div:nth-of-type(odd) {
        margin: 0 0 10px;}
    div#canvas_configurator span.category_name {padding-left:25px;}
    div#canvas_configurator div.configuratorOptie.gekozenOptie span.category_name {font-size:18px; padding-left:5px;}
    .resetOptions {max-width:105px;}
    #category_price {min-width:475px;}
    div#canvas_categories {margin:1em auto 0}
}

@media only screen and (min-width:768px) and (max-width:1024px) {
    div.element.PAGE {padding: 2em 1.5em 4em;}
    div#canvas_logo {left: 40px;}
    .category_link .product_img {width:160px;height:160px;}
    div.categoryImage, div.categoryDescription, div.categoryExtra {min-height:inherit;}
    div#canvas_categories {margin: 3em auto 0;}
    div.category_link{width: 30.2%;}
}

@media only screen and (min-width:1024px) {
    #Block_PAGE14 #content_1 {max-width:60%;margin:0 auto;}
}

.priceExclBtw{display:inline-block;}
.priceInclBtw{display:none;}
.priceInclBtw::after {	content: "incl. btw";	position: relative;	display: inline-block;	color: #bbb;	font-size: 80%;}
.priceExclBtw::after {	content: "excl. btw";	position: relative;	display: inline-block;	color: #bbb;	font-size: 80%;}

/* BLOG */

/* HOMEPAGE MELDING BLOK */

#ID36-3 {
    width: 100%;
    max-width: 100%;
    padding: 130px 1.5em 30px;
}

div#Block_BLOCK36 .canvas_container {
    padding: 0;
}

.hp-melding {
    background: #D4181D;
    color: #fff;
    padding: 15px;
}

div#Block_FIXEDBLOCK15 div#canvasShopStart {
    padding: 0px 1.5em 50px;
}

/* SEO EDITS */

.category-long-desc {
	margin-top: 60px;
}