/* EXTERNE FONTS */

@import url(http://fonts.googleapis.com/css?family=[NAAM VAN DE FONT]);

/* GEHOSTE FONTS */
@font-face {
    font-family: '[NAAM VAN DE FONT]';
    src: url('../fonts/[BESTANDSNAAM VAN FONT].eot');
    src: url('../fonts/[BESTANDSNAAM VAN FONT].eot?#iefix') format('embedded-opentype'),
         url('../fonts/[BESTANDSNAAM VAN FONT].woff') format('woff'),
         url('../fonts/[BESTANDSNAAM VAN FONT].ttf') format('truetype'),
         url('../fonts/[BESTANDSNAAM VAN FONT].svg#[NAAM VAN DE FONT]') format('svg');
    font-weight: normal;
    font-style: normal;

}
@charset "UTF-8";

html,
body {
   margin:0;
   padding:0;
   height:100%;
   font-family: Verdana, Arial, Sans-Serif;
}
#container {
   min-height:100%;
   position:relative;
}

/* COOKIE MELDING */
#PLCookie {
  width: 100%;
  min-height: 50px;
  position: fixed;
  padding: 0 15px;
  z-index: 1000;
  bottom: 0;
  left: 0;
  right: 0;
  display: flex;
  -ms-align-items: center;
  align-items: center;
  background-color: #4f4f4f;
  -webkit-box-shadow: 0px 0px 20px 0px rgba(102,102,102,0.23);
  -moz-box-shadow: 0px 0px 20px 0px rgba(102,102,102,0.23);
  box-shadow: 0px 0px 20px 0px rgba(102,102,102,0.23);
}

#PLCookie article {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  -ms-align-items: center;
  align-items: center;
  color: #fff;
  letter-spacing: 1px;
}

#PLCookie article div {
  display: flex;
  justify-content: center;
  -ms-align-items: center;
  align-items: center;
}

#PLCookie article div a {
  padding: 10px 15px;
  margin-left: 20px;
  background-color: #fff;
  color: #4f4f4f;
  text-transform: uppercase;
  letter-spacing: 1px;
  white-space: nowrap;
  cursor: pointer;
  transition: all .3s;
}
#PLCookie article div a:hover {
 background-color: #dbdbdb;
}

h1 strong
{
	display: block;
	font-size: .5em;
}

#searchmerk
{
	background: #000;
	padding: 5px;
	-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
}

#searchmerk input
{
	border: 0;
	height: 35px;
	margin-bottom: 0;
	background: #ccc;
	padding: 0 .5em;
	line-height: 35px;
	width: 100%;
}

.ui-autocomplete li
{
	height: 30px !important;
	line-height: 30px !important;
	padding-left: .6em;
}

/* HEADER */
#headerwrap { background-image:url(../images/bg_head.png); background-repeat:repeat-x;
   height:159px; 
}
#header {
    max-width:1400px; 
    margin: 0px auto 0px auto; 
    position:relative; font-family: 'Questrial', sans-serif; font-weight: 400; 
}

/* BODY */
#bodywrap {
   padding-bottom:594px;   /* HOOGTE VAN DE FOOTER - AAN TE PASSEN */
}
#body {
    max-width:1400px;
    margin: 0px auto 0px auto; 
    padding: 60px 20px 80px 20px; font-family: 'Questrial', sans-serif; font-weight: 400; font-size:1em; line-height:2em; color:#323232; text-align:justify;
}

/* FOOTER */
#footerwrap {
   position:absolute;
   bottom:0;
   width:100%;
   height:594px;   /* HOOGTE VAN DE FOOTER - AAN TE PASSEN */ background-image:url(../images/bg_foot.png); background-repeat:repeat-x; font-family: 'Questrial', sans-serif; font-weight: 400; 
}
#footer {
    max-width:1400px;
    margin: 0px auto 0px auto; 
    padding: 0px 20px 0px 20px; height:306px; background-image:url(../images/bg_footer.png); background-repeat:no-repeat; background-position:bottom center; color:#FFF; font-size:0.9em; line-height:1.6em; text-align:justify;
}

#footer h2 { font-size:18px; line-height:30px; margin-bottom:20px; color:#FFF; text-align:left; margin-top:30px;}

.footy { width:100%; text-align:center; height:34px; line-height:34px; font-size:9px;}
.footy a { color:#FFF;}

.logo { position:absolute; margin-top:20px; margin-bottom: 20px; margin-left: 20px; width: 200px;}

.logo img {
	width: 100%;
}

.topnav { position:absolute; right:0px; top:0px; width:180px;}
.topnav a { color:#777777; line-height:33px;  font-size:13px;}
.talen {  width:180px; float:right; font-size:13px;}
.talen a { width:45px; text-align:center; display:block; color:#FFF; line-height:33px; background-color:#c71d23; float:right; margin-left:1px;}
.talen a:hover, .talen .active { background-color:#000;}

.midnav { position:absolute; width:100%; right:0px; top:63px;}
.midnav a { float:right; line-height:33px; background-image:url(../images/bg_mid_nav.png); background-repeat:no-repeat; background-position:left; padding-left:30px; text-transform:uppercase; font-size:12px; color:#919191; margin-left:5%;}

.nav { width:100%; position:absolute; top:115px;  -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; height:44px; border-right:1px solid #FFF; }

.tickerzone { width:100%; margin-bottom: 80px;height:175px; background-image:url(../images/bg_ticker.png); background-repeat:no-repeat; background-position:center top; color:#000; text-align:center; font-size:18px; text-align:center;}


.left { float:left;}
.right { float:right;}

h1 {
	text-align:center;
	font-size:2em;
	color:#000;
	line-height:1.25em;
	padding-bottom: 50px;
	font-weight:bold; 
	background-image:url(../images/h1.png); background-repeat:no-repeat; background-position:center bottom;
	margin-bottom:53px;
}

h2 { color:#d1222a; font-size:18px; line-height:44px;}

h3 { font-size:16px; line-height:44px; text-decoration: underline; }

.producthead { margin-top:2px; padding-top: 32%;width:100%;   background: url(../images/product.jpg) no-repeat center center; 
  -webkit-background-size: cover;  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover; font-family: 'Questrial', sans-serif; font-weight: 400; position:relative; }
.producthead h1 { color:#FFF; text-align:center; width:100%; font-size:21px; background-image:url(../images/bg_prod.png); background-repeat:no-repeat; background-position:center bottom; line-height:42px; height:145px; position:absolute; bottom:0px;}

a.btn { overflow:hidden;color:#FFF; background-color:#a09f23; font-size:16px; text-align:center; max-width:365px; margin:auto; line-height:44px; display:block; -webkit-border-radius:2px;  -moz-border-radius:2px; border-radius:2px;  
margin-top:80px; }

a {color:#c71d23}


.extra { width:100%; border-bottom:2px solid #6d6e6c; margin-bottom:40px; clear:both;}

.extraleft { width:48%; float:left;}
.extraleft a{ float:left; margin-right:2%;}

.extraright { width:48%; float:right;}
.extraright a{ float:right; margin-left:2%;}

.faq { width:100%;}
.faq h1 { background-color:#a09f23; background-image:url(../images/bgfaq.jpg); background-position:left; background-repeat:repeat-y; line-height:44px; color:#FFF; text-align:left; font-size:14px; height:44px; margin-bottom:16px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
.faq h1 span { width:43px; display:inline-block; text-align:center; margin-right:27px; }
.ant { width:90%; margin:auto; margin-bottom:16px;}
.ant h2 { font-size:14px; color:#515151; text-align:left; line-height:30px;}

.cent { text-align:center;}

.ligging { height:290px; margin-top:2px; width:100%;}
.gegevens {-webkit-border-radius:2px;  -moz-border-radius:2px; border-radius:2px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; border:1px solid #000; text-align:center;   padding:2% 2% 2% 2%;}
.gegevens span { color:#d1222a; font-size:1.2em; font-weight:bold;}
.gegevens a { color:#d1222a;}

a.submit { color:#FFF; background-color:#c71d23; font-size:16px; text-align:center; width:100%; margin:auto; line-height:44px; display:block; -webkit-border-radius:2px;  -moz-border-radius:2px; border-radius:2px;  
 }
 
input, select, textarea {color:#000;  font-size:14px;  width:100%; height: 42px; line-height:42px; display:block; -webkit-border-radius:2px;  -moz-border-radius:2px; border-radius:2px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; border:1px solid #000; margin-bottom:20px; height:42px; padding-left:2%;  }
 textarea
 {
 	padding: 1em;
 	line-height: 1.5em;
 	height: 140px;
 	width: 95%;
 }
 input[type="submit"]
 {
 	background-color: #D1222A;
 	border-color: #D1222A;
 	text-align: center;
 	color: #fff;
 	width: 95%;
 }
.search { background-color:#6c6c3a; }
.search a {color:#FFF; background-color:#a09f23; font-size:16px; text-align:center; width:100%; margin:auto; line-height:32px; display:block; -webkit-border-radius:2px;  -moz-border-radius:2px; border-radius:2px; background-image:url(../images/kart.jpg); background-repeat:no-repeat; background-position:left; }
.search select { width:100%; line-height:32px; height:32px;}
.pad { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding-left:1%; padding-right:1%;}

.shop {}
.shop a h2 { display:none; text-align:center; color:#FFF; position:absolute; height:100%; background-image:url(../images/bg_shop.png); background-position:bottom; width:100%; display:none; font-size:14px; line-height:28px;  -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding-top:10%;}
.shop a:hover h2{ display:block;} 
.shop a h2 span { color:#dad987; font-size:18px; }

.basketcontent { max-width:960px; margin:auto;}
.kols { width:25%; float:left;}


.txtright { text-align:right;}
.price { font-size:30px; color:#888713;}
.price span { font-size:10px; color:#575757;}

.footcontact {  background-image:url(../images/yves.png); background-repeat:no-repeat; background-position:right;}

.left { float:left;}
.right { float:right;}

.footfloat { width:33%; float:left;}
.auto { margin:auto;}

.socialfoot { width:24.5%; float:left;}

.login { max-width:400px; margin:auto;}

.hide {}

.list { list-style-image:url(../images/li.png); line-height:28px; padding-left:20px; margin-left: 23px;}

.diensten { text-align:center;}
.diensten a img{  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;   
  box-sizing: border-box; border:3px solid #000; }
.diensten a:hover img {border:3px solid #c71d23;}

.faq h2 { color:#FFF; background-color:#c71d23; padding:.5em; margin-bottom:3%; text-align: left;line-height: 1.4em;}
.ant { width:95%; margin:auto; margin-bottom:3%;}


#contact
{
	overflow: auto;
}

#contact .gegevens
{
	float: right;
	width: 350px;
}

#contact .superblock
{
	overflow: auto;
	margin-right: 350px;
}

#contact .block
{
	width: 45%;
	margin-right: 5%;
	float: left;
}

.Center .col.span_1_of_3{
	float: none;
	text-align: left;
	display: inline-block;
	vertical-align: top;
}

.Center{
	text-align: center;
}
/*  SECTIONS  */
.section {
	clear: both;
	padding: 0px;
	margin: 0px;
}

/*  COLUMN SETUP  */
.col {
	display: block;
	float:left;
	margin: 1% 0 1% 2%;
}
.col:first-child { margin-left: 0; }

.colnav {
	display: block;
	float:left;
	margin: 0 0 0 0; text-align:center; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; border-left:1px solid #FFF;
}

.colnav a { display:block; line-height:44px;  background-color:#000; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; color:#FFF; font-size:15px; }
.colnav a:hover, .colnav .active { background-color:#c71d23;}

.colnav:first-child { margin-left: 0; }

.colhome {
	display: block;
	float:left;
	margin: 1% 0 1% 0.1%; position:relative;
}
.colhome h2 { text-align:center; color:#FFF; position:absolute; bottom:0px; font-size:16px; line-height:56px; background-image:url(../images/bg_h2.png); width:100%;}

.colhome:first-child { margin-left: 0; }


.colref {
	display: block;
	float:left;
	margin: 3% 0 1% 5%; position:relative;
}
.colref a h2 { text-align:center; color:#FFF; position:absolute; bottom:0px; font-size:16px; line-height:56px; background-image:url(../images/bg_h2.png); width:100%; display:none;}
.colref a:hover h2 { display:block;}
.colref:first-child { margin-left: 0; }

.colcon {
	display: block;
	float:left;
	margin: 1% 0 1% 3%; position:relative;
}
.colcon:first-child { margin-left: 0; }


/*  GROUPING  */
.group:before,
.group:after { content:""; display:table; }
.group:after { clear:both;}
.group { zoom:1; /* For IE 6/7 */ }


/*  GRID OF TWO  */
.span_2_of_2ref {
	width: 100%;
}
.span_1_of_2ref {
	width: 47.5%;
}


/*  GRID OF THREE contact  */
.span_3_of_3con { width: 100%; }
.span_2_of_3con { width: 65.66%; }
.span_1_of_3con { width: 31.33%; }


/*  GRID OF THREE  */
.span_3_of_3 { width: 100%; }
.span_2_of_3 { width: 66%; }
.span_1_of_3 { width: 32%; }

/*  GRID OF FOUR  */
.span_4_of_4 {
	width: 100%;
}
.span_3_of_4 {
	width: 74.5%;
}
.span_2_of_4 {
	width: 49%;
}
.span_1_of_4 {
	width: 23.5%;
}


/*  GRID OF FIVE NAV */

.span_1_of_5 {
	width: 25%;
}

/*  GRID OF SIX  */
.span_6_of_6 {
	width: 100%;
}

.span_5_of_6 {
  	width: 83.31%;
}

.span_4_of_6 {
  	width: 66.63%;
}

.span_3_of_6 {
  	width: 49.95%;
}

.span_2_of_6 {
  	width: 33.26%;
}

.span_1_of_6 {
  	width: 16.58%;
}



/*  GRID OF SEVEN  */
.span_7_of_7 {
	width: 100%;
}

.span_6_of_7 {
  	width: 85.7%;
}

.span_5_of_7 {
  	width: 71.4%;
}

.span_4_of_7 {
  	width: 57.1%;
}

.span_3_of_7 {
  	width: 42.8%;
}

.span_2_of_7 {
  	width: 28.5%;
}

.span_1_of_7 {
  	width: 14.2%;
}

@media only screen and (max-width: 1000px) {
	#contact .gegevens
	{
		float: none;
		width: 100%;
	}

	#contact .superblock
	{
		margin-top: 1em;
		margin-right: 0;
	}

	input[type="submit"], textarea
	{
		width: 100%;
	}

	#footer .span_1_of_3
	{
		width: 47%;
	}

	#contact .block
	{
		margin-right: 2.5%;
		width: 48.75%;
	}

	#contact .block:nth-child(2)
	{
		margin-right: 0
	}

	#footer .hide
	{
		display: none;
	}
}

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

	.fuckoff
	{
		display: none;
	}
	
	.faq
	{
		width: 100%;
	}

	.hide { display:none;}
	
	.expand { width:100%;}

	#body
	{
		padding-bottom: 0;
	}

	#bodywrap
	{
		padding-bottom: 394px;
	}

	#footerwrap
	{
		height: 340px;
		background-position: center bottom;
	}

	#tickertape
	{
		display: none;
	}
}

@media only screen and (max-width: 600px) {
	h1
	{
		font-size: 1.8em;
	}

	#footer .span_1_of_3
	{
		width: 100%;
	}

	#footer .hidesecond
	{
		display: none;
	}
}
/*  GO FULL WIDTH BELOW 480 PIXELS */
@media only screen and (max-width: 480px) {
	#header
	{
		padding-top: 1px;
	}

	.producthead
	{
		display: none;
	}

	#contact .block
	{
		margin-right: 0;
		width: 100%;
	}

	.logo
	{
		position: relative;
		display: block;
		width: 150px;
	}

	#res
	{
		position: absolute;
		z-index: 10;
		right: 0;
		top: 0;
		cursor: pointer;
		display: inline;
		float: right;
		margin-top: 60px;
		margin-right: 20px;
	}

	h1
	{
		font-size: 1.5em;
	}
	
	.tickerzone { font-size:10px;}
	
	.nav
	{
		display: none;
		z-index: 10;
	}
	
	
	.col {  margin: 1% 0 1% 0%; }
	
	.colhome { margin: 1% 0 1% 0%;}
	
	.colref {	margin: 1% 0 1% 0%;}
	
	.colcon {  margin: 1% 0 1% 0%; }
	
	.span_2_of_2ref, .span_1_of_2ref { width: 100%; }
	
	.span_3_of_3con, .span_2_of_3con, .span_1_of_3con { width: 100%; }
	
	.span_3_of_3, .span_2_of_3, .span_1_of_3 { width: 100%; }
	.span_1_of_4, .span_2_of_4, .span_3_of_4, .span_4_of_4 { width: 100%; }
	
	.colnav {  margin: 0 0 0 0; }
	.span_1_of_5 { width: 100%; }

    .span_1_of_6, .span_2_of_6, .span_3_of_6, .span_4_of_6, .span_5_of_6, .span_6_of_6 { width: 100%; }
	.span_1_of_7, .span_2_of_7, .span_3_of_7, .span_4_of_7, .span_5_of_7, .span_6_of_7, .span_7_of_7 { width: 100%; }
}


@media only screen and (max-width: 300px) {
	.footcontact
	{
		background-image: none;
	}
}

#content-container {
  width: 75%;
  margin: auto;
}

#content-container h2 {
  color:#d1222a; 
  font-size:2em; 
  font-weight:bold; 
  margin-bottom: 5px;
  margin-top: 1em;
}

#content-container h3 {
  background-color:#323232; 
  color:#fff;
  font-size:1.4em; 
  margin: 1em;
  padding: 7px;
  border-radius: 10px;
}

#content-container h3 span {
  display: inline-block;
  float: right;
  width: 0;
  height: 0;
  border-bottom: 8px solid transparent;
  border-top: 8px solid transparent;
  border-left: 8px solid #d1222a;
  margin-right: 10px;
}

#content-container h3.active span {
  margin-top: 6px;
  margin-right: 10px;
  border-bottom: 0;
  border-top: 8px solid #fff
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
}

#content-container h4 {
  margin-left: 2em;
  font-size: 1.1em;
  font-weight: bold;
}

#content-container p {
  margin-left: 2em;
  margin-bottom: 2em;
}

#content-container ul {
  margin-left: 3em;
}

#content-container table {
  margin-left: 3em;
}

#content-container a {
  color: #D3191C;
}

#gdpr-wrapper {
   min-height:100%;
   position:relative;
}