@charset "utf-8";


/* Custom Title Font */
@font-face {
	font-family: 'titleFont';
	src: url('titleFont.eot'); src: url('titleFont.eot?#iefix') format('embedded-opentype'), url('titleFont.woff') format('woff'), url('titleFont.ttf') format('truetype');
	font-weight: normal; font-style: normal;
}
/* Some default styles */
html										{	overflow-y:scroll; }
body, html 									{ 	width:100%; height:100%; margin:0px; padding:0px; position:relative; -webkit-text-size-adjust:none; background-color:#FFFFFF;   }
body, html, input, select, textarea			{	font-size:23px; line-height:1.4em; font-family: 'acumin-pro-condensed', sans-serif; color:#4d4d4d; font-weight:400; } 
*											{	outline:none; }
a											{	color:#333333;  }
strong										{	font-weight:700;}
.red										{	color:#c1272d !important; }
.customFont									{	font-family:'titleFont' !important; }									
			
@media (max-width: 768px)							{ 
	body, html, input, select, textarea			{	font-size:15px; line-height:1.3em;  }
}

/* A few responsive widths */

.center												{	position:relative; width:1009px; margin:0px auto; }
														body, html{ min-height:4px; }
@media (min-width: 769px) and (max-width: 1150px) 	{ 	body, html{ min-height:3px; } .center { width:720px;  }  }
@media (max-width: 768px)							{ 	body, html{ min-height:2px; } .center { width:470px;  } }
@media (max-width: 479px) 							{ 	body, html{ min-height:1px; } .center { width:auto; min-width:240px; margin:0px 10px; } }

/**********************************************
HEADINGS
**********************************************/
h2														{	font-size:1.4em; }
h3														{	font-size:1.3em; }
h4														{	font-size:1.2em;}
h1, h2, h3, h4, h5, h6									{	line-height:1.3em; margin:0.4em 0px; font-weight:normal; color:#17253f; }

				
/**********************************************
TO TOP
**********************************************/
#totop				{	opacity:0; display:block; position:fixed; bottom:80px; right:-150px;  width:40px; height:40px; border-radius:20px;  cursor:pointer;
						background-color:#f15a24; color:#FFF; z-index:20; transition: all 300ms ease-in-out; -webkit-transition: all 300ms ease-in-out; -moz-transition: all 300ms ease-in-out;}
#totop.show			{	right:20px; opacity:1; }
#totop img			{	display:block; max-height:100%; max-width:100%; margin:auto; position:absolute; top:0; bottom:0; left:0; right:0; border:0px; }

/**********************************************
MENU
**********************************************/

#menu 								{	position:fixed; top:0px; left:0px; width:100%; overflow:hidden; z-index:20; background-image:url('../images/menu.bg.jpg'); background-position:50% 50%; background-size:cover;}
#menu .mobilemenu					{	display:none; }
#menu nav							{	display:block; position:relative; z-index:2;}
#menu nav > div > ul				{	margin:0px; padding:0px; list-style:none; float:left; left:50%; position:relative; z-index:2;}
#menu nav > div > ul > li			{	float:left; left:-50%; position:relative; }
#menu nav > div > ul > li > a		{	font-family:'titleFont';  display:block; text-decoration:none; text-transform:uppercase; height:50px; line-height:50px; padding:0px 10px; font-size:20px; }

@media (min-width: 769px) and (max-width: 1150px) {	
#menu nav > div > ul > li > a		{	padding:0px 7px;  }
	#menu nav > div > ul > li > a		{	font-size:17px; }
}

@media (max-width: 768px) {
	#menu													{	min-height:50px; position:fixed; width:100%;  top:inherit; right:inherit; clear:both; background-color:transparent; overflow:visible;
	-webkit-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.43);
	-moz-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.43);
	box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.43); }
	#menu nav												{	display:block; height:0px; overflow:hidden;   }
	#menu .mobilemenu										{	display:block; position:absolute; top:0px; right:10px; z-index:24; width:50px;  height:50px; overflow:hidden; cursor:pointer; 	}
	#menu .mobilemenu > span								{	display:block; position:absolute; right:0px; bottom:0px;  line-height:50px; height:50px; width:50px; }
	#menu .mobilemenu > span > span							{	position:absolute; top:25px; left:25px; width:0px; height:0px; }	
	#menu .mobilemenu > span > span > span, 
	#menu .mobilemenu > span > span > span:before, 
	#menu .mobilemenu > span > span > span:after {
		height: 4px; width: 30px; border-radius: 3px; background-color:#000000; position: absolute; left:0px; 
		display: block; content: ''; transition: all 300ms ease-in-out; -webkit-transition: all 300ms ease-in-out; -moz-transition: all 300ms ease-in-out;
	}
	
	#menu .mobilemenu > span > span > span 							{ 	top:-2px; left:-10px; }
	#menu .mobilemenu > span > span > span:before 					{	top: -8px; }
	#menu .mobilemenu > span > span > span:after 					{ 	bottom: -8px; }

	#menu.open .mobilemenu > span > span > span:before 				{ 	top:0px; transform: rotate(45deg); -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg);}
	#menu.open .mobilemenu > span > span > span:after 				{ 	bottom:0px; transform: rotate(-405deg); -webkit-transform: rotate(-405deg); -moz-transform: rotate(-405deg);}
	#menu.open .mobilemenu > span > span > span 					{	background-color: transparent; }
	
	#menu nav > div 								{	position:relative; overflow:hidden; transition: all 300ms ease-in-out; -webkit-transition: all 300ms ease-in-out; -moz-transition: all 300ms ease-in-out; }
	#menu nav > div						{	margin:50px 0px -50px 0px; }
	#menu.open nav > div				{	margin:0px 0px 0px 0px; }
	#menu nav > div > ul				{	float:none; left:0%;}
	#menu nav > div > ul > li			{	float:none; left:0%; }
	#menu nav > div > ul > li > a		{	font-size:20px; }
}






/**********************************************
MAIN ELEMENTS
**********************************************/
#container				{	height:100%; z-index:1; max-width:1920px; position:relative; margin: 0 auto;  }
.chapter				{	position:relative; overflow:hidden; text-align:center; }
h1.intro					{	font-size:35px; line-height:1.2em; color:#FFF; position:relative; margin:0 auto; text-align:center; }

@media (max-width: 768px){ 
	h1.intro	 {	font-size:20px; line-height:1.2em; }
}


/**********************************************
BACKGROUNDS / PARALLAX
**********************************************/
.background					{	position:relative; background-repeat:no-repeat; background-size:cover; background-position:50% 100%;}
.background.landscape		{	background-image:url(../images/landschap.jpg);  background-size:110% auto;  }
.background.varken			{	background-image:url(../images/varken.jpg); height:0px; padding-bottom:48%; background-size:auto 160%; }
.background.boer			{	height:100%; position:relative; background-image:url(../images/boer.jpg); background-size:auto 110%;     }
.background.vleeswaren		{	height:100%; position:relative; background-image:url(../images/vleeswaren.jpg); background-size:auto 140%;  }
.background.ham				{	height:100%; position:relative; background-image:url(../images/ham.jpg); background-size:auto 140%;     }
.background.broodje			{	background-image:url(../images/broodje.jpg); height:0px; padding-bottom:50%;     }

@media (min-width: 769px) and (max-width: 1150px) {	
	.background.boer			{	background-image:url(../images/boer.jpg); background-size:auto 100%; right:100px; margin-right:-100px;     }
	.background.broodje			{	background-image:url(../images/broodje.jpg); height:120px;  background-size:auto 140%;    }
}

@media (max-width: 768px){ 
	.background.landscape		{	background-image:url(../images/landschap-mobile.jpg);  min-height:inherit; padding:130px 0px 30px 0px;  background-size:auto 120%;  }
	.background.varken			{	background-image:url(../images/varken-mobile.jpg); background-size:auto 330%; }
	.background.boer			{	background-image:url(../images/boer-mobile.jpg); height:0px; padding-bottom:80%; }
	.background.vleeswaren		{	background-image:url(../images/vleeswaren-mobile.jpg); height:0px; padding-bottom:75%;}
	.background.ham				{ 	background-image:url(../images/ham-mobile.jpg); height:0px; padding-bottom:70%; }
	.background.broodje			{	background-image:url(../images/broodje-mobile.jpg); height:200px; background-size:auto 160%;    } 
}

/**********************************************
COLUMN LAYOUT
**********************************************/
.cols-2					{	clear:both; overflow:hidden; }
.cols-2 > div			{	width:50%; float:left; overflow:hidden;  }
@media (max-width: 768px){ 
	.cols-2 > div		{	width:inherit; float:none; overflow:hidden;  }
}


/**********************************************
CHAPTERS
**********************************************/
#limbourgois-chapter									{	}
#limbourgois-chapter .background						{	min-height:400px; padding:150px 0px 60px 0px; } 
#limbourgois-chapter .background > div > img		 	{	display:block; width:70%; max-width:300px; position:relative; margin:40px auto;}
#limbourgois-chapter .background > div > .plus			{	display:block; width:80px; position:relative; margin:70px auto 0px auto; }
#limbourgois-chapter .background > div > .plus img		{	display:block;width:100%; height:auto; }
#limbourgois-chapter .intro		{	text-align:center; padding:10px;}
@media (max-width: 768px){ 
	#limbourgois-chapter img	{	max-width:200px; }
}

.genieten									{	background-color:#f0edea; height:650px;position:relative;}
.genieten > div								{	height:100% !important;}

.genieten .padder							{	display:table; width:100%; height:100%; }
.genieten .padder > div						{	display:table-cell; height:100%; width:100%; padding:30px; vertical-align:middle; }
.genieten .padder ul						{	margin:0px; list-style:none; padding:0px 0px 10px 0px; }
.genieten .padder ul li						{	text-align:center; color:#000; padding:5px 0px; position:relative; }
.genieten .padder ul li:before				{	content:'> '; color:#c1272d; }
.genieten .padder ul li:after				{	content:' <'; color:#c1272d; }

@media (max-width: 768px){ 
	.genieten							{	height:inherit; }
	.genieten .padder > div				{	padding:25px; }
	
	.genieten .padder					{	height:inherit; }
	.genieten .padder > div				{	height:inherit;}
	.genieten .padder ul li:before		{	display:none; }
	.genieten .padder ul li:after		{	display:none; }
}

.bourgondisch							{	background-image:url(../images/menu.bg.jpg);  background-attachment:scroll; background-position:50% 50%; overflow:hidden; color:#000000;   }
.bourgondisch *							{	color:#000000; }
.bourgondisch .center > div				{	position:relative; z-index:3; padding:50px 0px;}
.bourgondisch .center > img				{	position:absolute; bottom:-30px; right:50px; width:80%; max-width:750px; z-index:2; opacity:0.5;}

.vandaag-gemaakt .center > div			{	position:relative; z-index:3; padding:90px 0px;}

@media (max-width: 768px){ 
	.vandaag-gemaakt .center > div			{	padding:30px 0px;}
}

#van-boer-tot-bord-chapter .cols-2				{	background-color:#f0edea; height:750px; position:relative;}
#van-boer-tot-bord-chapter .cols-2 > div		{	height:100%;}

#van-boer-tot-bord-chapter .top					{	height:50%;}
#van-boer-tot-bord-chapter .top > div			{	display:table; width:100%; height:100%; }
#van-boer-tot-bord-chapter .top > div > div		{	padding:20px; display:table-cell; width:100%; height:100%; vertical-align:middle; text-align:center; }

#van-boer-tot-bord-chapter .bottom				{	height:50%; background-color:#534741; color:#FFF;  }
#van-boer-tot-bord-chapter .bottom > div		{	display:table; width:100%; height:100%; }
#van-boer-tot-bord-chapter .bottom > div > div	{	padding:20px 40px; display:table-cell; width:100%; height:100%; vertical-align:middle; text-align:center; }

@media (min-width: 769px) and (max-width: 1279px) 	{ 
#van-boer-tot-bord-chapter .bottom				{	font-size:20px; line-height:1.3em; }
	#van-boer-tot-bord-chapter .cols-2				{	height:600px;}
	#van-boer-tot-bord-chapter .top					{	height:30%;}
	#van-boer-tot-bord-chapter .bottom				{	height:70%; }
}

@media (max-width: 768px){ 
	#van-boer-tot-bord-chapter .bottom > div > div	{	padding:20px 20px;}
	#van-boer-tot-bord-chapter .cols-2				{	height:inherit; }
	#van-boer-tot-bord-chapter .cols-2 > div		{	height:inherit;}
	#van-boer-tot-bord-chapter .top					{	height:inherit;}
	#van-boer-tot-bord-chapter .bottom				{	height:inherit; }
}



#delicatessen .cols-2				{	height:750px; position:relative;}
#delicatessen .cols-2 > div			{	height:100%;}
#delicatessen .padder 				{	display:table; width:100%; height:100%; }
#delicatessen .padder > div			{	padding:20px 40px; display:table-cell; width:100%; height:100%; vertical-align:middle; text-align:center; }

@media (max-width: 768px){ 
	#delicatessen .padder > div	{	padding:20px 20px;}
	#delicatessen .cols-2			{	height:inherit; }
	#delicatessen .cols-2 > div		{	height:inherit;}
}

.fijnproeven						{	background-image:url(../images/menu.bg.jpg);   background-attachment:scroll; background-position:50% 50%; overflow:hidden; color:#000000;   }
.fijnproeven *						{	color:#000000; }
.fijnproeven .center > div			{	position:relative; z-index:3; padding:50px 0px;}
.fijnproeven .center > img			{	position:absolute; bottom:-30px; right:50px; width:80%; max-width:500px; z-index:2; opacity:0.5;}

.broodje			{	}
.broodje img		{	display:block; width:300px; position:relative; position:absolute; bottom:50px; left:50%; margin-left:-150px;}
@media (max-width: 768px){ 
	.broodje img		{	width:200px; margin-left:-100px;}
}

#assortiment								{	padding:70px 0px;}
#assortiment .list							{	margin:-10px;}
#assortiment .list ul						{	position:relative; padding:0px; margin:0px; list-style:none; }
#assortiment .list ul li					{	width:25%; float:left; }
#assortiment .list ul li.clear-4			{	clear:left;}
#assortiment .list ul li > a				{	display:block; margin:10px; text-decoration:none; font-size:0.85em; line-height:1.2em;}
#assortiment .list ul li > a span			{	display:block;}
#assortiment .list ul li > a span > img		{	display:block; width:100%; height:auto; }
#assortiment .list ul li > a strong			{	display:block; font-weight:normal; padding:5px 0px 0px 0px; }


@media (min-width: 769px) and (max-width: 1150px) 	{ 
#assortiment .list ul li					{	width:33.333%;}
#assortiment .list ul li.clear-3			{	clear:left;}
#assortiment .list ul li.clear-4			{	clear:none;}
}

@media (max-width: 768px){ 
	#assortiment								{	padding:20px 0px;}
	#assortiment .list							{	margin:-5px;}
	#assortiment .list ul li > a				{	margin:5px; }
	#assortiment .list ul li					{	width:50%;}
	#assortiment .list ul li.clear-2			{	clear:left;}
}


footer	{	background-color:#c1272d; color:#FFF; font-size:15px; line-height:30px; padding:20px 0px; text-align:center;}
footer a	{	color:#FFFFFF; }


/* GALLERY  */


/* CUSTOM CSS*/


.gallery div.header .info					{	padding:0px 20px; background-color:rgba(0,0,0,0.8); color:#FFF; position:relative;}

/* MAIN DIVS */
.gallery									{	display:none; position:fixed; left:0px; top:0px; width:100%; height:100%; z-index:100; background-color:#000000;}
.gallery div.padder							{	position:relative; height:100%; overflow:hidden; z-index:1;}
.gallery div.hider							{	position:relative; z-index:1; height:100%; }
.gallery div.hammer							{	position:absolute; z-index:2; width:100%; height:100%; left:0px; top:0px; }


/* HEADER EN FOOTER */
.gallery div.header							{	height:0px; width:100%; position:absolute; left:0px; top:0px; z-index:10; padding-bottom:45px; overflow:hidden;}
.gallery div.header > div					{	position:absolute; width:100%; bottom:0px; }

.gallery div.footer							{	height:0px; position:absolute; bottom:0px; width:100%; z-index:25; padding-bottom:0px; overflow:hidden;}
.gallery div.footer > div					{	background-color:rgba(0,0,0,0.8); padding:0px;}
.gallery div.footer > div a					{	display:block; color:#FFF; }
.gallery div.footer .info					{	max-width:1200px; margin:0px auto; padding:1px 20px 10px 20px; color:#FFFFFF;  }
.gallery div.footer .info h1				{	color:#FFFFFF; font-size:1.1em; }
.gallery div.footer .info p					{	margin:0px; padding:0px;}


/* ICONS */
.gallery > a.close							{	width:60px; height:60px;  position:absolute; 
												display:block;  top:0px; right:0px; z-index:28; cursor:pointer; text-decoration:none;
												text-indent:-1000px; overflow:hidden; background:url('../images/gallery.close.png') no-repeat 50% 50%;}

.gallery > a.next,
.gallery > a.prev							{	min-width:50px; width:10%; height:100%; position:absolute; display:block; top:0%; z-index:20; cursor:pointer; text-indent:-10000px; overflow:hidden;  text-decoration:none; 
												-moz-opacity:.8; filter:alpha(opacity=80); opacity:.8; transition: opacity 0.3s; -webkit-transition: opacity 0.3s; }
.gallery > a.prev							{	left:0px; }									
.gallery > a.next							{	right:0px; }									
.gallery > a span							{	display:block; width:50px; height:100%; position:absolute; top:0px; background-color:#F00;  }

.gallery > a.prev span						{	background:url('../images/gallery.left.png') no-repeat 50% 50%; left:0px; }
.gallery > a.next span						{ 	background:url('../images/gallery.right.png') no-repeat 50% 50%; right:0px; }	

.gallery > a.close:hover,
.gallery > a.next:hover,
.gallery > a.prev:hover						{	-moz-opacity:1; filter:alpha(opacity=100); opacity:1;}

/* MOVE CONTAINER */
.gallery div.mover							{	position:absolute; left:0px; top:0px; height:100%; z-index:1; }
.gallery div.mover ul						{	height:100%; margin:0px; padding:0px; list-style:none;  }
.gallery div.mover ul	li					{ 	position:relative; float:left; width:100%; height:100%; background:url('../images/gallery.loading.gif') no-repeat 50% 50%; overflow:hidden;}
.gallery div.mover ul	li img				{	position:absolute; left:0px; top:0px; display:block;}

/* LITTLE BIT RESPONSIVE */
@media (max-width: 768px){
	.gallery a.menu,
	.gallery a.next,
	.gallery a.prev			{	display:none !important; }
	.gallery a.close		{	border-bottom:0px; padding:0px 0px 20px 20px; width:50px; height:50px; line-height:50px; font-size:30px;  }
/*	.gallery div.footer		{	top:-10000px;}*/
	.gallery div.padder		{	margin:0px; }
}