/********************************************* RESET ************************************************/
/****************************************************************************************************/
html, body{ height: 100%; width:100%; padding:0;  margin:0;} 
ul{ margin:11px 0; padding:0 0 0 40px; list-style-type:square;}
ol{ margin:11px 0; padding:0 0 0 40px; list-style-type:decimal;}
p{ padding:0 0 11px 0; margin:0;}

/************************************** START STANDAARD CSS *****************************************/
/****************************************************************************************************/


body{ 
	height:100%; 
	
	overflow-y:scroll !important;
	overflow-x:hidden;
	background-color:#FFF;

	/* default font */
	font-family: 'PT Sans', sans-serif;
	font-weight:300;
	font-size:17px;
	color:#818181;
	line-height:26px;
	font-display: auto;
	/*
	 min-height: 100%;
  	 display: flex;
  	 flex-direction: column;
    */
	
		
	background-position: center center;
	background-repeat: no-repeat;
	background-size:cover;

}

.bg-home {background-image: url('../images/banner/home.jpg');}

h1{ 
	margin:0; 
	padding:0;
	font-family: 'Patua One', cursive;
	font-weight: 400;
	font-size:69px;
	font-display: auto;
	line-height:69px;
	color:#8bc268;
	padding-bottom:25px;
	margin-bottom:25px;
}

.subtitle {
	font-family: 'Patua One', cursive;
	color:#454545;
	font-size: 37px;
	line-height: 34px;
	margin-bottom: 30px;
}


h2{ 
	margin:0;
	padding:0;
	font-family: 'Patua One', cursive;
	font-weight: 400;
	font-size:47px;
	font-display: auto;
	line-height:52px;
	color:#395c26;
	padding-bottom:20px;
	margin-bottom:10px;
	margin-top:30px;
}


h3{ 
	margin:0; 
	padding:0;
	font-family: 'Patua One', cursive;
	font-weight: 400;
	font-size:28px;
	font-display: auto;
	line-height:32px;
	color:#ff9400;
	padding-bottom:20px;
	margin-bottom:0px;
}


h4{ 
	margin:0; 
	padding:0;
	font-family: 'Patua One', cursive;
	font-weight: 400;
	font-size:24px;
	font-display: auto;
	line-height:32px;
	color:#999;
	padding-bottom:5px;
	margin-bottom:0px;
}


.h1{ 
	margin:0; 
	padding:0;
	font-family: 'Patua One', cursive;
	font-weight: 400;
	font-size:69px;
	font-display: auto;
	line-height:69px;
	color:#8bc268;
	padding-bottom:25px;
	margin-bottom:25px;
}

.h2{ 
	margin:0;
	padding:0;
	font-family: 'Patua One', cursive;
	font-weight: 400;
	font-size:47px;
	font-display: auto;
	line-height:52px;
	color:#395c26;
	padding-bottom:20px;
		margin-top:30px;
	margin-bottom:10px;
}


.h3{ 
	margin:0; 
	padding:0;
	font-family: 'Patua One', cursive;
	font-weight: 400;
	font-size:28px;
	font-display: auto;
	line-height:32px;
	color:#ff9400;
	padding-bottom:20px;
	margin-bottom:0px;
		margin-top:30px;
}


.h4{ 
	margin:0; 
	padding:0;
	font-family: 'Patua One', cursive;
	font-weight: 400;
	font-size:24px;
	font-display: auto;
	line-height:32px;
	color:#999;
	padding-bottom:5px;
	margin-bottom:0px;
}




/***** NORMALE LINK *****/
a,a:link,a:visited,a:active{
	color:#395c26;
	text-decoration:underline;
    outline:hidden !important;
    overflow: hidden !important;
}
a:hover{
	color:#8bc268;
	text-decoration:none;
}


/***** MENULINK *****/
a.menulink, a.menulink:link, a.menulink:visited, a.menulink:active{ 
	outline: none;  
	overflow: hidden;
	
	font-family: 'Patua One', cursive;
	font-weight: 400;
	font-size:16px;
	color:#fec92d;
	text-decoration:none;
	text-transform:uppercase;
	
	padding:16px;
	display:inline-block;

	/* Standaard fade rollover CSS3 */
	-webkit-transition-property:color;
    -webkit-transition-duration: 0.2s, 0.2s;
    -webkit-transition-timing-function: linear, ease-in;
	
	transition-property: color;
	transition-duration: 0.2s, 0.2s;
	transition-timing-function:  linear, ease-in;
	
}

/***** MENULINK ROLLOVER *****/
a.menulink:hover {
	color: #ffffff;
	text-shadow: none;
}

/***** MENULINK ACTIEF *****/
.actief{
	color:#ffffff!important;
	opacity: 1;
}

*:focus {outline:none !important}

/***** VET *****/
.vet, strong{font-weight:700 !important;}
/***** SUB *****/
.klein{font-size:14px;}
.grijs{color:#BBB;}
/***** STROKES *****/
.stroke{border:2px solid #333 !important;}
.stroke_met_schaduw{border:4px solid #FFF !important; box-shadow:0px 0px 15px rgba(0,0,0,0.25); margin: 0 25px 25px 0;}
.thmb{margin-right:10px; margin-bottom: 6px; outline: none;}
/***** RESET UL + LI MENU *****/
#menu ul {list-style: none; margin:0 !important; padding:0 !important;}
#menu li {display: inline-block; margin:0 !important; padding:0 !important;}
#menu #space {width:295px;}

#menu select { display: none;}
/***** CLEAR *****/
.clear{clear: both; width:100%;}
.nomargin{margin:0 !important;}
/* RESPONSIVE IMAGES */
.resp_img{ width:auto;height:auto;max-width:100%;}
.editable img{ width:auto; height:auto; max-width:100%;}
/* COLUMS */
.section100{float:left; width:100%; height:auto; position:relative; box-sizing:border-box;}
.section75{float:left; width:75%; height:auto; position:relative; box-sizing:border-box;}
.section70{float:left; width:70%; height:auto; position:relative; box-sizing:border-box;}
.section60{float:left; width:60%; height:auto; position:relative; box-sizing:border-box;}
.section50{float:left; width:50%; height:auto; position:relative; box-sizing:border-box;}
.section48{float:left; width:48%; height:auto; position:relative; box-sizing:border-box;}
.section45{float:left; width:45%; height:auto; position:relative; box-sizing:border-box;}
.section40{float:left; width:40%; height:auto; position:relative; box-sizing:border-box;}
.section35{float:left; width:35%; height:auto; position:relative; box-sizing:border-box;}
.section33{float:left; width:33%; height:auto; position:relative; box-sizing:border-box;}
.section31{float:left; width:31%; height:auto; position:relative; box-sizing:border-box;}
.section30{float:left; width:30%; height:auto; position:relative; box-sizing:border-box;}
.section25{float:left; width:25%; height:auto; position:relative; box-sizing:border-box;}
.section23{float:left; width:23%; height:auto; position:relative; box-sizing:border-box;}
.section20{float:left; width:20%; height:auto; position:relative; box-sizing:border-box;}
.section19{float:left; width:19%; height:auto; position:relative; box-sizing:border-box;}
.section100 img, .section75 img, .section70 img, .section60 img, .section50 img, .section48 img, .section45 img, .section40 img, .section35 img, .section33 img, .section31 img, .section30 img, .section25 img, .section23 img, .section20 img , .section19 img{width:auto;height:auto;max-width:100%;}
/* QUOTE */
.quote{background-color:#C00; color: #FFF; padding:20px; border:6px solid #FFF; box-shadow:0px 0px 20px #999; border-radius:4px;}
.quote h2{color: #FFF; font-weight:700;}
.quote a{color: #FFF;}

.fright{float: right;}
.fleft{float: left;}
.tt{opacity: 0.15;margin-top: 50px;margin-bottom: 55px;display: block;}

#menu-layer{
	background-color:#fdc829;
	width:100%;
	height:100%;
	position:fixed;
	z-index:95;
	display:none;
	opacity:1;
}

.twee_links{margin-right:2%;}
.twee_rechts{margin-left:2%;}

.drie_links{margin-right:1.75%;}
.drie_mid{margin-right:1.75%; margin-left:1.75%;}
.drie_rechts{margin-left:1.75%;}

.vier_links{margin-right:2.7%;}
.vier_mid_links{margin-right:1.3%;}
.vier_mid_rechts{margin-left:1.3%;}
.vier_rechts{margin-left:2.7%;}


.vijf_links{margin-right:1.25%;}
.vijf_mid_links{margin-right:1.25%;}
.vijf_mid{margin:0;}
.vijf_mid_rechts{margin-left:1.25%;}
.vijf_rechts{margin-left:1.25%;}

/* VB BOX TEST */
.il{
	border:1px solid #FF0004;
	padding: 10px;
}


/**************************************** START EIGEN CSS *******************************************/
/****************************************************************************************************/

#header{
	width:100%;
	/*height:125px;*/
	height:225px;
	top:0;
	position: relative;
	z-index:99;
	margin-left:auto;
	margin-right:auto;
	
	background-image: url('../images/bg_head.png');
	background-position: bottom;
	background-repeat: repeat-x;
	background-size: auto 100%;
}

#navigatie{
	position: relative;
	max-width:1600px;
	width:100%;
	margin-left:auto;
	margin-right:auto;
}

#logo{
	width:200px;
	height:125px;
	margin: auto;

	background-image:url(../images/logo.svg);
	background-position:left;
	background-repeat:no-repeat;
	position:relative;
	z-index:98;
}

#menu{
	text-align: center;
	z-index:97;
	padding-top: 0;
	margin-top: -90px;
}

#container{
	max-width:1600px;
	width:100%;
	height:auto;
	margin-left:auto;
	margin-right:auto;
	padding:200px 0px 50px 0px;
	box-sizing:border-box;
	/*overflow-x: hidden;*/
}

body.detail #container {padding-top:100px;}


.content_small{
	max-width:1600px;
	width:100%;
	height:auto;
	margin-left:auto;
	margin-right:auto;
	padding:0px 25px 0px 25px;
	box-sizing:border-box;
	position:relative;
}


.content_wide{
	width:100%;
	height:auto;
	margin-left:auto;
	margin-right:auto;
	box-sizing:border-box;
	position:relative;
}

.fsBody, .fsBody a  {
	color: #fff !important;
}

.fsPage input[type="checkbox"]::before {
	margin-bottom: 0 !important;
	margin-top: 6px !important;
}

.gZbrPz {
	display: flex !important;
	align-items: flex-start !important;
}


#footer{
	padding: 0px;
	box-sizing: border-box;
	background-color: #f7f7f7;
	flex:none;
}


#subfooter{
	font-size: 10px;
	color:#fff;
	padding-top: 14px;
	box-sizing: border-box;
	margin-top: 0px;
	height: 50px;
	padding-left: 25px;
	padding-right: 20px;
}

#subfooter.footer-orange {background-color: #e58500;}
#subfooter.footer-yellow {background-color:#e3b425;}
#subfooter.footer-orange {background-color:#ff9400;}
#subfooter.footer-lgreen {background-color:#7aad5a;}

#subfooter a{
	color:#fff;

}

#sig{
	float:right;
	padding-right: 0px;
	opacity: 1;
}


/*=========== GENERAL ============*/
.center {text-align:center;}
.nospacing {margin:0; padding: 0;}

.pd30 {padding:30px;}
.pd60 {padding:60px;}
.pd90 {padding:90px;}
.pd120 {padding:120px;}

.pt30{padding-top:30px;}
.pt60{padding-top:60px;}
.pt90{padding-top:90px;}
.pt120{padding-top:120px;}
.pb30{padding-bottom:30px;}
.pb60{padding-bottom:60px;}
.pb90{padding-bottom:90px;}
.pb120{padding-bottom:120px;}
.pb160{padding-bottom:160px;}

.pl30{padding-left:30px;}
.pl60{padding-left:60px;}
.pl90{padding-left:90px;}
.pr30{padding-right:30px;}
.pr60{padding-right:60px;}
.pr90{padding-right:90px;}

.mt10 {margin-top:10px;}
.mt30 {margin-top:30px;}
.mt60 {margin-top:60px;}
.mt80 {margin-top:80px;}
.mt90 {margin-top:90px;}
.mb10 {margin-bottom:10px;}
.mb30 {margin-bottom:30px;}
.mb60 {margin-bottom:60px;}
.mb90 {margin-bottom:90px;}

.pullup90 {margin-top: -90px;}


.txt-xs {font-size:17px; line-height: 24px;}
.introtxt {font-size:21px; line-height: 32px;}

.txt-white {color:#fff;}
.txt-yellow {color:#fdc829;}
.txt-orange {color:#ff9400;}
.txt-lgreen {color:#82ba5f;}
.txt-dgreen {color:#395c26;}
.txt-dgrey {color:#454545;}

/*--- LANGUAGES ---*/
.lang {
    position: absolute;
    top: 50px;
    right: 25px;
}

.lang a, .lang a:link, .lang a:visited, .lang a:active {
	color:#fff;
	font-size: 14px;
	line-height: 14px;
	text-decoration: none;
	font-family: 'Patua One', cursive;
	border-radius: 50%;
	background-color:#82ba5f;
	padding: 7px;
	margin-left: 7px;
	
		-o-transition: .5s;
	-ms-transition: .5s;
	-moz-transition: .5s;
	-webkit-transition: .5s;
	transition: .5s;
}
.lang a:hover, .lang a.act {background-color:#fec92d;}


/*--- BREADCRUMBS ---*/
.brd-path {
    margin-left: 25px;
}
.breadcrumbs a {
    text-decoration: none;
    color: #d2d2d2;
    padding: 0 12px;
}

.breadcrumbs a:hover {text-decoration:underline;}

.brd-act.txt-lgreen {
    padding: 0px 10px 3px 10px;
}

/*--- ICONS ---*/
img.wave, img.titlewave {height:13px; width: auto;}
img.titlewave {margin-bottom:30px;}

.ico-brd {width:25px;height:25px;position: absolute;top: -2;}
.ico-bull {width:8px; height: 8px;}
.fas {color: #395c26;}

/*--- HORIZONTAL LINE ---*/
hr.tt {
	height: 6px;
	background: url(../images/hr.png) repeat-x 0 0;
    border: 0;
	margin: 120px 0 120px 0;
}
hr.tt.top {margin-top:60px;}

/*--- IMAGE OVERLAY ---*/
.overlay {position:relative;}
.img-overlay {
	position:absolute;
	width: 100%;
	height: 100%;
	background-image:url('../images/img-overlay.svg');
}

.overlay img {
    padding: 0px;
	display: inline-flex;
}
.overlay img.pd1 {
    padding: 1px;
}

/*--- BULL ---*/
.bull {
	width:60px;
	height:60px;
	background-image: url('../images/ico-arrow.svg');
	background-size: contain;
	background-repeat: no-repeat;
	background-color:#fdc829;
	position: absolute;
	right:0;
	bottom: 0;
	border-radius: 50%;
	padding: 0;

}

.bull.orange {background-color:#ff9400;}

.bull-txt {
    position: absolute;
    bottom: 0px;
    right: -60px;
    width: 210px;
    height: 210px;
    background-image: url('../images/bg-green.svg');
    background-repeat: no-repeat;
    font-family: 'Amatic SC', cursive;
    color:#fff;
    font-size:52px;
    line-height: 52px;
    padding-top: 52px;
}

.bull-txt-xs {font-size:46px; line-height: 46px;}
.bull-txt-xxs {
    font-size: 42px;
    line-height: 42px;
    padding-top: 46px;
}


/*--- PRODUCTS ---*/
.prod-img {padding:40px; margin-bottom: 30px;}
.prod a, .owl-carousel a {text-decoration:none;}

/*--- OVER FRUITSAP ---*/
.over-fruitsap {min-height: 590px; padding:120px 280px 0px 120px;}
.over-fruitsap-pullleft {
    margin-left: -160px;
}

/*--- BACKGROUNDS & BG-IMAGES ---*/

.bg-yellow {background-color:#fdc829;}
.bg-orange {background-color:#ff9400;}
.bg-lgreen {background-color:#82ba5f;}

.bg-img-green {
	background-image:url('../images/bg-green.svg');
	background-repeat: no-repeat;
	background-size: contain;
	position: relative;
}

.bg-img-orange {
	background-image:url('../images/bg-orange.svg');
	background-repeat: no-repeat;
	background-size: contain;
	position: relative;
}

.bg-img-grey {
	background-image:url('../images/bg-grey.svg');
	background-repeat: no-repeat;
	background-size: contain;
	position: relative;
}

.bg-box-yellow {
	background-image:url('../images/bg-box-yellow.svg');
	background-repeat: no-repeat;
	background-size: 100% 100%;
	position: relative;
	background-position: left top;
}

.bg-box-yellow-fw {background-size:100% 100%;}

.divider img {
    width: 102%;
    max-width: 104%;
    margin-left: -4px;
}


/*--- BACKGROUND LEAFES ---*/

.bg-top-leaf-left {
    position: absolute;
    width: 350px;
    height: 350px;
    background-image: url('../images/leaf-top-left.png');
    background-repeat: no-repeat;
    bottom: 45%;
    left: 0;
}

body.detail .bg-top-leaf-left {bottom:0;}

.bg-top-leaf-right {
    position: absolute;
    width: 350px;
    height: 350px;
    background-image: url('../images/leaf-top-right.png');
    background-repeat: no-repeat;
    bottom: 50%;
    right: 0;
}

body.detail .bg-top-leaf-right {bottom:30%;}

body.detail2 .bg-top-leaf-right {bottom:-10%;}

.bg-bottom-leaf-left {
    position: absolute;
    width: 350px;
    height: 350px;
    background-image: url('../images/leaf-bottom-left.png');
    background-repeat: no-repeat;
    bottom: -13%;
    left: 0;
}

body.detail .bg-bottom-leaf-left {bottom:-7%;}

.bg-bottom-leaf-right {
    position: absolute;
    width: 350px;
    height: 350px;
    background-image: url('../images/leaf-bottom-right.png');
    background-repeat: no-repeat;
    top: -15%;
    right: 0;
}



/*===============
	BUTTONS
===============*/

a.btn-default, a.btn-default:link, a.btn-default:active, a.btn-default:visited {
	font-family: 'Patua One', cursive;
	color:#395c26;
	font-size:17px;
	line-height: 21px;
	text-transform: uppercase;
	text-decoration: none;
	-o-transition: .5s;
	-ms-transition: .5s;
	-moz-transition: .5s;
	-webkit-transition: .5s;
	transition: .5s;
	position: relative;
	padding: 0 0 0 34px;
}

a.btn-default .ico {color:#ff9400; font-size:26px;line-height: 32px;margin-right: 97px;position: absolute;top: -5px;left: 0;}
a.btn-default .ico.txt-white {color:#fff;}

a.btn-default:hover { color:#181818;}
a.btn-default:hover .ico {color:#395c26;
	-o-transition: .5s;
	-ms-transition: .5s;
	-moz-transition: .5s;
	-webkit-transition: .5s;
	transition: .5s;}

/*** BACK BUTTON ***/
a.btn-xs, a.btn-xs:link, a.btn-xs:visited, a.btn-xs:active {
	color: #818181;
	background-color: #eaeaea;
	font-size: 13px;
	font-weight: 400;
	padding: 6px 15px 7px 15px;
	border-radius: 15px;
	text-decoration: none;
	-o-transition: .5s;
	-ms-transition: .5s;
	-moz-transition: .5s;
	-webkit-transition: .5s;
	transition: .5s;
}
a.btn-xs:hover {
	background-color: #ccc;
}
.backbtn {
	float: right;
}


/*** BUTTON PRIMARY ***/
a.btn-primary,
a.btn-primary:link,
a.btn-primary:visited,
a.btn-primary:active,
.btn-primary{
	outline: none;  
	overflow: hidden;
	
	font-weight: 500;
	font-size:18px;
	color:#FFF;
	text-decoration:none;
	background-color: #82ba5f;
	text-shadow:none;
	padding:14px 30px;
	border-radius: 30px;
	display:inline-block;
	

	/* Standaard fade rollover CSS3 */
	-webkit-transition-property:background-color;
    -webkit-transition-duration: 0.2s, 0.2s;
    -webkit-transition-timing-function: linear, ease-in;
	
	transition-property: background-color;
	transition-duration: 0.2s, 0.2s;
	transition-timing-function:  linear, ease-in;
	
}

a.btn-primary:hover, .btn-primary:hover {background-color:#333;}




/*=== INFO FOOTERS ===*/
.infofooter.bg-lgreen h3 {color:#395c26;}
.infofooter h3, .infofooter .subtitle {
    color: #fff;
}


/*==== OWL CAROUSEL - custom styles ====*/

.prodcarousel h4 {color:#fff;}

.carouselcontainer.detail h4 {color:#ff9400;font-size: 19px;line-height: 24px;}

button.owl-prev {
    position: absolute;
    left: -60px;
    top: 30%;
}

button.owl-next {
    position: absolute;
    right: -60px;
    top: 30%;
}

.owl-theme .owl-nav [class*=owl-prev]:hover span {
	    padding: 20px;
    width: 100px;
    height: 100px;
    display: inline-block;
    background-image: url('../images/arrow-left-act.png');
    background-repeat: no-repeat;
}

.owl-theme .owl-nav [class*=owl-prev] span {
    color:transparent;
	padding: 20px;
    width: 100px;
    height: 100px;
    display: inline-block;
    background-image: url('../images/arrow-left.png');
    background-repeat: no-repeat;
	
	-o-transition: .5s;
	-ms-transition: .5s;
	-moz-transition: .5s;
	-webkit-transition: .5s;
	transition: .5s;
}

.owl-theme .owl-nav [class*=owl-next]:hover span {
	    padding: 20px;
    width: 100px;
    height: 100px;
    display: inline-block;
    background-image: url('../images/arrow-right-act.png');
    background-repeat: no-repeat;
}

.owl-theme .owl-nav [class*=owl-next] span {
    color:transparent;
	padding: 20px;
    width: 100px;
    height: 100px;
    display: inline-block;
    background-image: url('../images/arrow-right.png');
    background-repeat: no-repeat;
	
	-o-transition: .5s;
	-ms-transition: .5s;
	-moz-transition: .5s;
	-webkit-transition: .5s;
	transition: .5s;
}


.btn {
    font-family: 'Patua One', cursive;
    color: #ffffff!important;
    background-color: #fec92d;
    text-decoration: none!important;
    padding: 6px 13px 7px 13px;
    border-radius: 30px;
    display: inline-block;
    margin-top: 35px;
    margin-right: 7px;

    -o-transition: .5s;
	-ms-transition: .5s;
	-moz-transition: .5s;
	-webkit-transition: .5s;
	transition: .5s;
}

.btn:hover {background-color:#8bc268;}


/************************************** ANIMATIONS CSS *****************************************/
/****************************************************************************************************/

/***** MOOV UP *****/
.moove-up {
	display:block;
	vertical-align: middle;
	text-decoration: none;
	
	-webkit-transform: perspective(1px) translateZ(0);
	transform: perspective(1px) translateZ(0);
	
	transition-duration:0.2s;
	-webkit-transition-duration:0.2s;
	
	transition-property:transform;
	-webkit-transition-property: transform;
	
	transition-timing-function: ease-out;
	-webkit-transition-timing-function: ease-out;
}

.moove-up:hover, .moove-up:focus, .moove-up:active {
	transform:translateY(-10px);
	-webkit-transform:translateY(-10px);
	
	text-decoration: none;
}


/***** FADE EFFECTS *****/

.fadeInLeft {
	position: relative;
	overflow: initial;
	animation: animaterleft 2s
}
@keyframes animaterleft {
from {
left:-300px;
opacity:0
}
to {
left:0;
opacity:1
}
}
.fadeInRight {
	position: relative;
	overflow: initial;
	animation: animateright 2s;
}
@keyframes animateright {
from {
right:-300px;
opacity:0
}
to {
right:0;
opacity:1
}
}
.fadeInTop {
	position: relative;
	animation: animatetop 1.5s
}
@keyframes animatetop {
from {
top:-50px;
opacity:1
}
to {
top:0;
opacity:1
}
}
.fadeInBottom {
	position: relative;
	animation: animatebottom 1.5s;
}
@keyframes animatebottom {
from {
bottom:-50px;
opacity:0
}
to {
bottom:0;
opacity:1
}
}
.animations {
	overflow: initial;
}
.fadeIn {
	position: absolute;
	animation: animatefade 1.5s
}
@keyframes animatefade {
	from {
	opacity:0.5
	}
	to {
	opacity:1
	}
}



/*========================= TIMELINE ==========================*/

.timelinecontainer .section40, .timelinecontainer .section60, .timelinecontainer .section30, .timelinecontainer .section70 {padding:0 60px;} 



.timelinecontainer {
  opacity: 0;
  margin: 2em auto;
  -webkit-transition: opacity 0.2s;
  -moz-transition: opacity 0.2s;
  transition: opacity 0.2s;
}
.timelinecontainer::before {
  /* never visible - this is used in jQuery to check the current MQ */
  content: 'mobile';
  display: none;
}
.timelinecontainer.loaded {
  /* show the timeline after events position has been set (using JavaScript) */
  opacity: 1;
}
.timelinecontainer .timeline {
  position: relative;
  height: 100px;
  width: 100%;
  max-width: 1600px;
  margin: 0 auto;
}
.timelinecontainer .events-wrapper {
  position: relative;
  height: 100%;
  margin: 0 40px;
  overflow: hidden;
}
.timelinecontainer .events-wrapper::after, .timelinecontainer .events-wrapper::before {
  /* these are used to create a shadow effect at the sides of the timeline */
  content: '';
  position: absolute;
  z-index: 2;
  top: 0;
  height: 100%;
  width: 20px;
}

.timelinecontainer .events {
  /* this is the grey line/timeline */
  position: absolute;
  z-index: 1;
  left: 0;
  top: 49px;
  /*height: 2px;*/
	height:5px;
  /* width will be set using JavaScript */
  /*background: #dfdfdf;*/
	background-image:url('../images/tl-bg.png');
  -webkit-transition: -webkit-transform 0.4s;
  -moz-transition: -moz-transform 0.4s;
  transition: transform 0.4s;
}
.timelinecontainer .filling-line {
  /* this is used to create the green line filling the timeline */
  position: absolute;
  z-index: 1;
  left: 0;
  top: 1px;
 /* height: 100%;*/
	height:50%;
  width: 100%;
 /* background-color: #7b9d6f;*/
	background-image:url('../images/tl-bggreen.png');
  -webkit-transform: scaleX(0);
  -moz-transform: scaleX(0);
  -ms-transform: scaleX(0);
  -o-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transform-origin: left center;
  -moz-transform-origin: left center;
  -ms-transform-origin: left center;
  -o-transform-origin: left center;
  transform-origin: left center;
  -webkit-transition: -webkit-transform 0.3s;
  -moz-transition: -moz-transform 0.3s;
  transition: transform 0.3s;
}
.timelinecontainer .events a {
  position: absolute;
  bottom: 0;
  z-index: 2;
  text-align: center;
  font-family:'Patua One', cursive;
  font-size: 1.3rem;
  padding-bottom: 25px;
  color: #88c164;
  text-decoration: none;
  /* fix bug on Safari - text flickering while timeline translates */
  -webkit-transform: translateZ(0);
  -moz-transform: translateZ(0);
  -ms-transform: translateZ(0);
  -o-transform: translateZ(0);
  transform: translateZ(0);
}
.timelinecontainer .events a::after {
  /* this is used to create the event spot */
  content: '';
  position: absolute;
  left: 50%;
  right: auto;
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
  transform: translateX(-50%);
  bottom: -5px;
  height: 12px;
  width: 12px;
  border-radius: 50%;
  border: 2px solid #d2d2d2;
  background-color: #ffffff;
  -webkit-transition: background-color 0.3s, border-color 0.3s;
  -moz-transition: background-color 0.3s, border-color 0.3s;
  transition: background-color 0.3s, border-color 0.3s;
}
.no-touch .timelinecontainer .events a:hover::after {
  background-color: #7b9d6f;
  border-color: #7b9d6f;
}
.timelinecontainer .events a.selected {
  pointer-events: none;
	color:#ff9400;
}
.timelinecontainer .events a.selected::after {
  background-color: #517d38;
  border-color: #517d38;
}
.timelinecontainer .events a.older-event::after {
  border-color: #517d38;
}
@media only screen and (min-width: 1100px) {
  .timelinecontainer {
    margin: 6em auto;
  }
  .timelinecontainer::before {
    /* never visible - this is used in jQuery to check the current MQ */
    content: 'desktop';
  }
}

.cd-timeline-navigation a {
  /* these are the left/right arrows to navigate the timeline */
  position: absolute;
  z-index: 1;
  top: 30%;
  bottom: auto;
 /* -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);*/
  height: 50px;
  width: 50px;
  border-radius: 50%;
 /* border: 2px solid #fff;*/
  /* replace text with an icon */
  overflow: hidden;
  color: transparent;
  text-indent: 100%;
  white-space: nowrap;
  -webkit-transition: border-color 0.3s;
  -moz-transition: border-color 0.3s;
  transition: border-color 0.3s;
	/*box-shadow: 0px 7px 10px rgba(0,0,0,0.3);*/
}
/*
.cd-timeline-navigation a::after {
  content: '';
  position: absolute;
  height: 16px;
  width: 16px;
  left: 50%;
  top: 50%;
  bottom: auto;
  right: auto;
 /* -webkit-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -ms-transform: translateX(-50%) translateY(-50%);
  -o-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);*/
 /* background-image: url('../images/arrow-left.png');
	background-repeat: no-repeat;
}*/
.cd-timeline-navigation a.prev {
  left: 0;
/* -webkit-transform: translateY(-50%) rotate(180deg);
  -moz-transform: translateY(-50%) rotate(180deg);
  -ms-transform: translateY(-50%) rotate(180deg);
  -o-transform: translateY(-50%) rotate(180deg);
  transform: translateY(-50%) rotate(180deg);*/
	background-image:url('../images/arrow-left-xs-act.png');
}
.cd-timeline-navigation a.next {
  right: 0;
	background-image:url('../images/arrow-right-xs-act.png');
}
.no-touch .cd-timeline-navigation a:hover {
  border-color: #7b9d6f;
}
.cd-timeline-navigation a.prev.inactive {
  cursor: not-allowed;
	background-image:url('../images/arrow-left-xs.png');
}
.cd-timeline-navigation a.next.inactive {
  cursor: not-allowed;
	background-image:url('../images/arrow-right-xs.png');
}
.cd-timeline-navigation a.inactive::after {
  background-position: 0 -16px;
}
.no-touch .cd-timeline-navigation a.inactive:hover {
  border-color: #dfdfdf;
}

.timelinecontainer .events-content {
  position: relative;
  width: 100%;
  margin: 2em 0;
  overflow: hidden;
  -webkit-transition: height 0.4s;
  -moz-transition: height 0.4s;
  transition: height 0.4s;
}
.timelinecontainer .events-content li {
  position: absolute;
	list-style-type: none;
  z-index: 1;
  width: 100%;
  left: 0;
  top: 0;
  -webkit-transform: translateX(-100%);
  -moz-transform: translateX(-100%);
  -ms-transform: translateX(-100%);
  -o-transform: translateX(-100%);
  transform: translateX(-100%);
  padding: 0 5%;
  opacity: 0;
  -webkit-animation-duration: 0.4s;
  -moz-animation-duration: 0.4s;
  animation-duration: 0.4s;
  -webkit-animation-timing-function: ease-in-out;
  -moz-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
}
.timelinecontainer .events-content li.selected {
  /* visible event content */
  position: relative;
  z-index: 2;
  opacity: 1;
  -webkit-transform: translateX(0);
  -moz-transform: translateX(0);
  -ms-transform: translateX(0);
  -o-transform: translateX(0);
  transform: translateX(0);
}
.timelinecontainer .events-content li.enter-right, .timelinecontainer .events-content li.leave-right {
  -webkit-animation-name: cd-enter-right;
  -moz-animation-name: cd-enter-right;
  animation-name: cd-enter-right;
}
.timelinecontainer .events-content li.enter-left, .timelinecontainer .events-content li.leave-left {
  -webkit-animation-name: cd-enter-left;
  -moz-animation-name: cd-enter-left;
  animation-name: cd-enter-left;
}
.timelinecontainer .events-content li.leave-right, .timelinecontainer .events-content li.leave-left {
  -webkit-animation-direction: reverse;
  -moz-animation-direction: reverse;
  animation-direction: reverse;
}
.timelinecontainer .events-content li > * {
  max-width: 800px;
  margin: 0 auto;
}
/*
.timelinecontainer .events-content h2 {
  font-weight: bold;
  font-size: 2.6rem;
  font-family: "Playfair Display", serif;
  font-weight: 700;
  line-height: 1.2;
}*/
.timelinecontainer .events-content em {
  display: block;
  font-style: italic;
  margin: 10px auto;
}
.timelinecontainer .events-content em::before {
  content: '- ';
}
.timelinecontainer .events-content p {
 /* font-size: 1.4rem;
  color: #959595;*/
}
.timelinecontainer .events-content em, .timelinecontainer .events-content p {
 /* line-height: 1.6;*/
}

.cd-timeline-navigation, .events li { list-style-type: none;}



@media only screen and (min-width: 768px) {
  .timelinecontainer .events-content h2 {
  }
  .timelinecontainer .events-content em {
  }
  .timelinecontainer .events-content p {
  }
}

@-webkit-keyframes cd-enter-right {
  0% {
    opacity: 0;
    -webkit-transform: translateX(100%);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0%);
  }
}
@-moz-keyframes cd-enter-right {
  0% {
    opacity: 0;
    -moz-transform: translateX(100%);
  }
  100% {
    opacity: 1;
    -moz-transform: translateX(0%);
  }
}
@keyframes cd-enter-right {
  0% {
    opacity: 0;
    -webkit-transform: translateX(100%);
    -moz-transform: translateX(100%);
    -ms-transform: translateX(100%);
    -o-transform: translateX(100%);
    transform: translateX(100%);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0%);
    -moz-transform: translateX(0%);
    -ms-transform: translateX(0%);
    -o-transform: translateX(0%);
    transform: translateX(0%);
  }
}
@-webkit-keyframes cd-enter-left {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-100%);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0%);
  }
}
@-moz-keyframes cd-enter-left {
  0% {
    opacity: 0;
    -moz-transform: translateX(-100%);
  }
  100% {
    opacity: 1;
    -moz-transform: translateX(0%);
  }
}
@keyframes cd-enter-left {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-100%);
    -moz-transform: translateX(-100%);
    -ms-transform: translateX(-100%);
    -o-transform: translateX(-100%);
    transform: translateX(-100%);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0%);
    -moz-transform: translateX(0%);
    -ms-transform: translateX(0%);
    -o-transform: translateX(0%);
    transform: translateX(0%);
  }
}


/*=== MESSAGES ===*/ 


.bedankt, .call2actionxl {
	font-size:21px;
	line-height: 32px;
	padding:90px 0 160px 0;
}

.bedankt h1, .errormessage h1 {border-bottom:0px dotted!important;}

.error-404 {
	font-weight: 600;
	font-size: 140px;
	color:#c2c2c2;
	line-height: 340px;
	margin:auto;
}

.thxmessage {
		font-weight: 400;
	font-size: 140px;
	color:#c2c2c2;
	line-height: 350px;
	margin:auto;
}
.circle {border:12px solid #c2c2c2;border-radius:50%;width: 350px;height: 350px;}
.thxmessage .fas {color:#c2c2c2;}



/*--- START TABLE ---*/

.table {
                border-collapse: collapse;
                border-spacing: 0;
                width: 100%;
				margin: 50px 0;
}

.table table {
                border-collapse: collapse;
                width:100%;
                max-width:100%;
                margin:1rem 0 2rem 0;
}

.table thead tr {
                background-color:#f7f7f7;
                font-weight:600;
}

.table tbody td, .table thead th {
                padding:.75rem;
                text-align: left;
}

.table thead th {
                background-color: #f5f5f5;
                border-color:#f5f5f5;
}

.table thead th {
                vertical-align: top;
}
.table tbody td {
                vertical-align: top;
                border-top:2px solid #f2f2f2;
}

/*--- EINDE TABLE ---*/

.dt-hidden {display:none;}


/************************************** RESPONSIVE CSS *****************************************/
/****************************************************************************************************/


@media only screen and (min-width :2150px)   { 

	/*--- BACKGROUND LEAFES ---*/

	.bg-top-leaf-left {
		position: absolute;
		width: 350px;
		height: 350px;
		background-image: url('../images/leaf-top-left.png');
		background-repeat: no-repeat;
		bottom: 25%;
		left: 0;
	}

	.bg-top-leaf-right {
		position: absolute;
		width: 350px;
		height: 350px;
		background-image: url('../images/leaf-top-right.png');
		background-repeat: no-repeat;
		bottom: 30%;
		right: 0;
	}

	.bg-bottom-leaf-left {
		position: absolute;
		width: 350px;
		height: 350px;
		background-image: url('../images/leaf-bottom-left.png');
		background-repeat: no-repeat;
		bottom: -13%;
		left: 0;
	}

	.bg-bottom-leaf-right {
		position: absolute;
		width: 350px;
		height: 350px;
		background-image: url('../images/leaf-bottom-right.png');
		background-repeat: no-repeat;
		top: -15%;
		right: 0;
	}
	
	.infofooter .mt90 {
    margin-top: 0;
}
}


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

	/*--- BACKGROUND LEAFES ---*/

	.bg-top-leaf-left {
		bottom: 35%;
		
	}

	.bg-top-leaf-right {
		bottom: 56%;
	}
	
	body.detail .bg-top-leaf-left {
		bottom: 1%;
		left: -9%;
	}

	body.detail .bg-top-leaf-right {
		bottom: -13%;
		right: -4%;
	}
	body.detail3 .bg-top-leaf-right {bottom: 30%;}
}


@media only screen and (min-width :1030px) and (max-width :1445px)   { 

	/*--- BACKGROUND LEAFES ---*/

	.bg-top-leaf-left {
		bottom: 35%;
				left:-15%;
	}

	.bg-top-leaf-right {
		bottom: 78%;
				right:-10%;
	}
	
	.bg-bottom-leaf-left {bottom:0;}
}



@media only screen and (max-width :1370px)   { 
	.over-fruitsap {padding:10% 20% 0% 10%; min-height: 600px;;}
	
	.bg-box-yellow {
	background-image: url('../images/bg-box-yellow-xl.svg');
	background-repeat: no-repeat;
	background-size: contain;
	position: relative;
	}

}

@media only screen and (max-width :1250px)   { 
	
	.over-fruitsap {padding:10% 20% 0% 10%; min-height: 600px;;}
	
	.bg-box-yellow {
	background-image: url('../images/bg-box-yellow-xl.svg');
	background-repeat: no-repeat;
	background-size: contain;
	position: relative;
	}
	
	.lang {
		position: relative;
		top: unset;
		right: unset;
		margin: 0 auto;
		width: 100%;
		text-align: right;
		max-width: 965px;
	}

}
@media only screen and (max-width :1150px)   { 
	.bg-box-yellow {
	background-image: url('../images/bg-box-yellow-square.svg');
	background-repeat: no-repeat;
	background-size: contain;
	position: relative;
	}

	.prod.pd30 {
    padding: 0px 15px;
	}
	
}

@media only screen and (max-width :1029px) {
		/*--- BACKGROUND LEAFES ---*/
	.bg-top-leaf-left, .bg-top-leaf-right, .bg-bottom-leaf-left, .bg-bottom-leaf-right {display: none;}
		.pt120{padding-top:60px;}
	.pb120{padding-bottom:30px;}
}

@media only screen and (max-width :1015px)   { 
	
	.section100, .section75, .section70, .section60, .section50, .section48, .section45, .section40, .section35, .section33, .section31, .section30, .section25, .section23, .section20, .section19  {
		width:100%;
		margin-top:0px; 
	}
	
	.twee_links, .twee_rechts{margin-right:0; margin-left:0; margin-bottom: 10px;}
	.drie_links, .drie_mid, .drie_rechts{margin-right:0;margin-left:0;  margin-bottom: 10px;}
	.vier_links, .vier_mid_links, .vier_mid_rechts, .vier_rechts{margin-right:0; margin-left:0;  margin-bottom: 10px;}
	.vijf_links, .vijf_mid_links, .vijf_mid_rechts, .vijf_rechts, .vijf_mid{margin-right:0; margin-left:0;  margin-bottom: 10px;}

	#header{
	position: absolute;
		height:125px;
	}
	
		.lang {
		position: absolute;
		top: 95px;
		right: 40px;
		margin: 0;
		width: unset;
		text-align: right;
		max-width: unset;
	}

	
	.pd30 {padding:0 90px;}
	.pd60, .pd90, .pl30, .pl60{padding:0px;}
	.pd120 {padding:60px;}
	.mb90 {margin-bottom: 60px;}
		.pl90 {padding-left: 30px;}
	.pr90 {padding-right: 30px;}
	.pb160 {padding-bottom:30px;}
	.clear.mb60 {margin-bottom:0px;}
	.mt-120-mob {margin-top:120px;}
	.pt-mob-120 {padding-top:30px;}
	.pb-mob-120 {padding-bottom: 30px;}
	.pd30-mob {padding:30px;}
	.pd60-mob {padding: 60px 30px 0 30px;}
	.gesch-mob-pd {padding:0 90px 0 30px;}
	.mob-nopadding {padding: 0;}
	.mb-hidden {display: none;}
	
	hr.tt {margin:90px 0 90px 0;}
	
	/*--- HOME - Vruchtensap--*/
	.productlijnen .section23.pd30 {width: 50%;padding: 0 30px;}
	.over-fruitsap.pd120 {padding: 60px 30px 0 30px;}
	
	.bg-box-yellow {
	background-image: inherit;
	background-repeat: no-repeat;
	background-size: contain;
	position: relative;
	}
	.over-fruitsap-container {background-color: #fdc829;}
	.over-fruitsap {min-height: inherit;}	
	.over-fruitsap-pullleft {
    margin-left: 0;
    margin-top: -30px;
		text-align: right;
		padding-bottom: 60px;
	}
	
	.mb-img-xs img {
    width: 80%;
    height: 100%;
    text-align: center!important;
    margin: 0 auto;
    padding-left: 10%;
}
	
	h1, .h1, .banner h4.h1 {font-size:52px; line-height: 62px;}
	#container {padding:380px 0px 50px 0px;}
	body.detail #container {padding-top: 160px;}

	
		/*--- OWL CAROUSEL ---*/
	.owl-theme .owl-nav [class*=owl-prev] span, .owl-theme .owl-nav [class*=owl-prev]:hover span {
		width: 60px;
		height: 60px;
		background-size: contain;
	}
		button.owl-prev {
		position: absolute;
		left: 0;
		top: inherit;
		bottom: 0;
		width: 49%;
		text-align: right;
	}

	.owl-theme .owl-nav [class*=owl-next] span, .owl-theme .owl-nav [class*=owl-next]:hover span {
		width: 60px;
		height: 60px;
		background-size: contain;
	}
	
	button.owl-next {
		position: absolute;
		right: 0;
		top: inherit;
		bottom: 0;
		width: 49%;
		text-align: left;
	}
	
	.divider img {
    width: 100%;
    max-width: 104%;
    margin-left: 0;
}
	
		
	/*=== TIMELINE GESCHIEDENIS ===*/
		.timelinecontainer .section40, .timelinecontainer .section60, .timelinecontainer .section30, .timelinecontainer .section70 {padding:0 30px;}
	.timelinecontainer .events-content li, 	.timelinecontainer ol {padding:0;}
	
	/*---- MESSAGES ----*/

.intro, .call2actionxl {
	font-size:21px;
	line-height: 32px;
	padding: 30px 0 0 0;
}	

.error-404 {
	font-weight: 300;
	font-size: 110px;
	color:#ccc;
	line-height: 210px;
	margin:auto;
}

.thxmessage {
		font-weight: 400;
		font-size: 110px;
		color:#ccc;
		line-height: 210px;
		margin:auto;
}
.circle {border:7px solid #ccc;border-radius:50%;width: 210px;height: 210px;}

	
	a.btn {display:inline-block;}

	
	
	                /*--- START TABLE ---*/
	
	.table {
		width: 100%;
		max-width: 100%;
	}
               .table-responsive {
                               display: block;
                               width:100%;
                               overflow-x:auto;
                               -webkit-overflow-scrolling: touch;
                               -ms-overflow-style: -ms-autohiding-scrollbar;
                }
                /*--- END TABLE ---*/

	
	.dt-hidden {
		display: initial;
	}

}

@media only screen and (max-width :480px)   { 
	
	#container {padding:430px 0px 50px 0px;}
	
	.productlijnen .section23.pd30 {width:100%;}
	.prod {margin-bottom:40px;}
	.over-fruitsap.pd120 {padding:60px 30px 0 30px;}
	.over-fruitsap-pullleft {margin-left: 0px; margin-top: 30px;}
	.mb-img-xs img {width: 100%; height: 100%;}
	.over-varesa .gesch-mob-pd {padding: 0 60px 0 0;}
	.over-varesa .bull-txt {bottom: -60px;}
	.over-varesa .pd60-mob {padding:90px 0px 0 0px;}
	.over-varesa.pt120 {padding-top: 30px;}

	.bg-box-yellow {
		background-image:url('../images/bg-box-yellow-mob.svg');
		background-repeat: no-repeat;
		background-size: 90% auto;
		position: relative;
		padding: 20px;
		background-position: top center;
	}
	
	.bull-txt {
    width: 160px;
    height: 160px;
    font-size: 42px;
    line-height: 42px;
    padding-top: 42px;
}

	/*--- Royal Slider ---*/
	.rsABlock {padding:0!important;}
	.banner h4.h1, h2 {font-size:36px; line-height: 42px;}
	.subtitle {font-size:28px; line-height: 32px;}
	
	
		/*--- OWL CAROUSEL ---*/
	.owl-theme .owl-nav [class*=owl-prev] span, .owl-theme .owl-nav [class*=owl-prev]:hover span {
		width: 60px;
		height: 60px;
		background-size: contain;
	}
		button.owl-prev {
		position: absolute;
		left: 0;
		top: inherit;
		bottom: 0;
		width: 49%;
		text-align: right;
	}

	.owl-theme .owl-nav [class*=owl-next] span, .owl-theme .owl-nav [class*=owl-next]:hover span {
		width: 60px;
		height: 60px;
		background-size: contain;
	}
	
	button.owl-next {
		position: absolute;
		right: 0;
		top: inherit;
		bottom: 0;
		width: 49%;
		text-align: left;
	}
	
}

@media only screen and (max-width :320px)   { 
	#logo {margin: 0 0 0 15px;}
	
}



/*--- IPHONE ---*/

@media only screen 
and (min-device-width : 375px) 
and (max-device-width : 736px) 
and (orientation : landscape) {

}


@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 667px) 
and (orientation : portrait) {

}





/** RESPOSIVE MENU **/
@media only screen and (min-width :1016px) {
#menu {
    display: block !important;
}
.hamx {
    display: none;
}
}

@media only screen and (max-width :1015px) {
.hamx {
    top: 40px;
    right: 25px;
    position: absolute;
    z-index: 101;
    display: block;
    cursor: pointer;
     width: 75px;
    height: 75px; 
}
    
#menu {
    position: absolute;
    top: 225px;
    width: 100%;
    display: none;
    padding-top: 0;
}
	
	
#menu li, #menu li a {
    display: block;
    margin-bottom: 1px;
    text-align: center;
    background-color: #fdc829;
    padding-left: 25px;
    padding-top: 18px;
    padding-bottom: 14px;
}
/***** MENULINK *****/
a.menulink {
    font-size: 32px !important;
    color: #ff9400!important;
    padding: 25px!important;
}
/***** MENULINK ROLLOVER *****/
a.menulink:hover, a.menulink.actief {
    color: #fff!important;
}
}

.hamx .line {
    width: 36px;
    height: 4px;
    background-color: #ffff;
    display: block;
    margin: 6px auto;
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
.hamx:hover {
    cursor: pointer;
}
#x-1.is-active .line:nth-child(2) {
    opacity: 0;
}
#x-1.is-active .line:nth-child(1) {
    -webkit-transform: translateY(10px) rotate(45deg);
    -ms-transform: translateY(10px) rotate(45deg);
    -o-transform: translateY(10px) rotate(45deg);
    transform: translateY(10px) rotate(45deg);
}
#x-1.is-active .line:nth-child(3) {
    -webkit-transform: translateY(-10px) rotate(-45deg);
    -ms-transform: translateY(-10px) rotate(-45deg);
    -o-transform: translateY(-10px) rotate(-45deg);
    transform: translateY(-10px) rotate(-45deg);
}


.accordion {
	background: #FFF;
 /* box-shadow: 0 15px 20px -15px rgba(0, 0, 0, 0.3), 0 35px 50px -25px rgba(0, 0, 0, 0.3), 0 85px 60px -25px rgba(0, 0, 0, 0.1);*/
}

.accordion-header {
	color: #333;
	cursor: pointer;
	font-weight: 600;
	padding: 1.5rem;
    background: #f7f7f7;
    margin-bottom: 1px;
}

.accordion-header:hover {
	background: #f1f1f1;
}

.accordion-content {
	display: none;
	padding: 25px;
}

.accordion-header::before {
    font-family: "Font Awesome 5 Pro";
    font-weight: 700;
    content: "\f107";
    display: inline-block;
	width: 24px;
	height: .75rem;
    color:#999;
}

.active.accordion-header::before {
    font-family: "Font Awesome 5 Pro";
    font-weight: 700;
    content: "\f106";
    color:#FF0000;
}

#acc-wrap{
    padding-top: 200px;
}



/* THUMBS FANCYBOX ONDERAAN DE PAGINA - STYLE.CSS LADEN NA FB CSS */
/*
.fancybox-caption:before{
    background-image: none;
}
        
@media all and (min-width: 800px) {
  .fancybox-thumbs {
    top: auto;
    width: auto;
    bottom: 0 !important;
    left: 0;
    right : 0;
    height: 95px;
    padding: 10px 10px 5px 10px;
    box-sizing: border-box;
    background: rgba(0, 0, 0, 0.0);
  }
  
  .fancybox-show-thumbs .fancybox-inner {
    right: 0;
    bottom: 95px;
  }
}

 @media all and (max-width: 800px) {
  .fancybox-thumbs {
    display: none !important;
  }
  .fancybox-show-thumbs .fancybox-inner {
    right: 0;
  }
}
*/

/* Copyright (C) - IMAXX Smart Web Solutions - All Rights Reserved */