/* base */
@font-face {
    font-family: 'juergenbold_kursiv';
    src: url('juergen_bold_kursiv-webfont.eot');
    src: url('juergen_bold_kursiv-webfont.eot?#iefix') format('embedded-opentype'),
    	 url('juergen_bold_kursiv-webfont.svg#juergenbold_kursiv') format('svg'),
         url('juergen_bold_kursiv-webfont.woff') format('woff'),
         url('juergen_bold_kursiv-webfont.ttf') format('truetype');
         
    font-weight: normal;
    font-style: normal;

}




@font-face {
    font-family: 'juergenitalic';
    src: url('juergen_italic-webfont.eot');
    src: url('juergen_italic-webfont.eot?#iefix') format('embedded-opentype'),
    	 url('juergen_italic-webfont.svg#juergenitalic') format('svg'),
         url('juergen_italic-webfont.woff') format('woff'),
         url('juergen_italic-webfont.ttf') format('truetype');
         
    font-weight: normal;
    font-style: normal;

}




@font-face {
    font-family: 'juergenregular';
    src: url('juergen-webfont.eot');
    src: url('juergen-webfont.eot?#iefix') format('embedded-opentype'),
         url('juergen-webfont.svg#juergenregular') format('svg'),
         url('juergen-webfont.woff') format('woff'),
         url('juergen-webfont.ttf') format('truetype');

    font-weight: normal;
    font-style: normal;

}

body {
	font-family: "Avant Garde", Avantgarde, "Century Gothic", CenturyGothic, "AppleGothic", sans-serif;
	background: center top no-repeat #ffffff;
	margin:0;
	font-size:15px;
	line-height:16pt;
	color: #fff;
}

body h1,
body h2,
body h3,
body h4,
body h5,
body h6{
	font-family: "Avant Garde", Avantgarde, "Century Gothic", CenturyGothic, "AppleGothic", sans-serif;
	margin: 0px;
	padding: 0px;
}
body h2 {
	font-family: juergenitalic ;
	letter-spacing: 1px, 0.10px;
	font-size: 36px !important;
}
h1 {
	font-size: 200px;
	
}
a, a:link, a:active, a:visited {
	color: #51271c;
	text-decoration: none;
}
a:hover {
	color: #b29150;
	
}
h1 {
	font-size:35px;
	font-weight:normal;
	margin:0 0 5px;	
	line-height:40px;
}
	
h2 {
	font-size:27px;
	font-weight:normal;
	line-height:24pt;
	margin:0 0 12px;
}	
p {
	line-height: 17px;	
}	
h3 {
	
	font-size:17px;
	font-weight:normal;
	margin:0;
	font-family: 'Nobile';
}

.logo {
	margin-top: 25px;
}
.navigation a{
	font-size: 15px;
	font-weight: lighter;
}

.navigation {
	text-align: right;
}
.navigation li{
	margin-top: 60px;
	display: inline-block;
	padding-left: 15px;
	margin-left: 15px;
	text-transform: uppercase;
	border-left: 1px solid  #b29150;
}
.navigation li:first-child {
	border: 0px;	
}

/* arrows */

.arrow-up {
	width: 0; 
	height: 0; 
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	
	border-bottom: 5px solid black;
}

.arrow-down {
	width: 0; 
	height: 0; 
	border-left: 20px solid transparent;
	border-right: 20px solid transparent;
	
	border-top: 20px solid #f00;
}




.bannerhead{
	background: url('../images/bannerhead.png') center top no-repeat;
	height: 531px;
}

/* subnav */

.subnav ul, .subnav li {
	margin: 0px;
	padding: 0;	
}
.subnav li {
	cursor: pointer;
}
.subnav {
	margin-bottom: 20px;
	text-align: center;
}
.subnav  a{
	font-size: 20px;
	color: #fff;
}
div.posarrow {
	position: relative; 
	display: block;
	left: 0;
	right: 0;
	z-index: 99999;
	width: auto;
	text-align: center;
}
.subnav li:hover .linkarrow {
	display: -moz-inline-stack;
    content: "&nbsp;";
    position: absolute;
    left: 50%;
    width: 0; 
    height: 0;
    margin-left: -10px;
    margin-top: 15px;
    border-left: 12px solid transparent;
    border-right: 12px solid transparent;
 
    /*border-top: 12px solid ;*/
  
    
    
}

.subnav li {
	
	text-align: center;
	display: inline-block;
	margin-left: 10px;
	margin-right: 10px;	
}
.subnav li a{
	display: block;
	margin: 15px;
}

.subnav .current {
	display: none;	
}

.subnav.page {
	text-align: left;
	margin-top: 20px;
	margin-left: -10px;
}
.subnav.page li:first-child {
	margin-left: 0px;
}

.page.header {
	margin-top: 16px;
}


.blockright .imageblock{
	width: 320px;
	
	float: left;
}
.blockleft .imageblock{
	width: 640px;
	float: right;
}
.blockright img {
	float: left;
}
.blockleft img {
	float: right;
	position: relative;
	
}

.blockleft .arrow-right{
	z-index: 99;
	width: 0; 
	height: 0; 
	position: absolute;
	
	margin-top: 140px;
	
	z-index: 9799;
	border-top: 30px solid transparent;
	border-bottom: 30px solid transparent;
	border-left: 30px solid #fff;
}
.blockright .arrow-left{
	z-index: 99;
	width: 0; 
	height: 0; 
	position: absolute;
	border-top: 30px solid transparent;
	border-bottom: 30px solid transparent; 
	float: right;
	margin-top: 140px;
	margin-left: 290px;

	z-index: 9799;
}

.content.column h1,
.content.column h2,
.content.column h3,
.content.column h4,
.content.column h5,
.content.column h6
 {
	color: #fff;
	margin-bottom: 30px;
	
}
.blockright .content.column {
	padding: 30px;
	width: 560px !important;
	text-align: center;
	color: #fff;
	font-size: 15px;
	line-height: 20px;
	display: table; 
}
.blockleft .content.column {
	width: 240px !important;
	padding: 30px;
	line-height: 20px;
	font-size: 15px;
	text-align: center;
}

.intro br:first-child {
	display: none;	
}



/* color scheme */
/* over ons */
	.subnav .li-over-ons {
		background: #00718c; 
	}
	.subnav li.li-over-ons:hover .linkarrow {
   		 border-top: 12px solid #00718c;
	}
	#over-ons {
		background: #00718c;
	}
	#over-ons .arrow-left{
		border-right:30px solid  #00718c;
		border-right:30px solid  #00718c;	
	}
	#over-ons .arrow-right{
		border-left: 30px solid #00718c;
	}
	#over-ons .block:before {
		border-right: 12px solid #00718c;
	}
	h1.over-ons {
		color: 	#00718c; 
	} 
	

/* de wagyu */
	.subnav .li-de-wagyu{
		background: #b39150; 
	}
	.subnav li.li-de-wagyu:hover .linkarrow {
   		 border-top: 12px solid #b39150;
	}
	#de-wagyu {
		background: #b39150;
		
	}
	#de-wagyu .arrow-left{
		border-right:30px solid  #b39150;
		border-right:30px solid  #b39150;	
	}
	#de-wagyu .arrow-right{
		border-left: 30px solid #b39150;
		
	}
	#de-wagyu .block:before {
		border-right: 12px solid #b39150;
	}
	
	h1.de-wagyu {
		color: 	#b39150; 
	} 

/* vlees kopen */
	.subnav .li-vlees-kopen{
		background: #51271d; 
	}
	.subnav li.li-vlees-kopen:hover .linkarrow {
   		 border-top: 12px solid #51271d;
	}
	#vlees-kopen {
		background: #51271d;
		
	}
	#vlees-kopen .arrow-left{
		border-right:30px solid  #51271d;
		border-right:30px solid  #51271d;	
	}
	#vlees-kopen .arrow-right{
		border-left: 30px solid #51271d;
	}
	#vlees-kopen .block:before {
		border-right: 12px solid #51271d;
	}
	h1.vlees-kopen {
		color: 	#51271d; 
	} 
	
	
/* de stal */	
	.subnav .li-de-stal{
		background: #6d6e71; 
	}
	.subnav li.li-de-stal:hover .linkarrow {
   		 border-top: 12px solid #6d6e71;
	}
	#de-stal {
		background: #6d6e71;
		
	}
	#de-stal .arrow-left{
		border-right:30px solid  #6d6e71;
		border-right:30px solid  #6d6e71;	
	}
	#de-stal .arrow-right{
		border-left: 30px solid #6d6e71;
	}
	#de-stal .block:before {
		border-right: 12px solid #6d6e71;
	}
	h1.de-stal {
		color: 	#6d6e71; 
	} 
	

/* contact */
	#contact {
		background: #51271d;
	}
	#contact .arrow-left{
		border-right:30px solid  #51271d;
		border-right:30px solid  #51271d;	
		margin-top: 90px; 
	}
	#contact .arrow-right{
		border-left: 30px solid #51271d;
	}
	#contact .block:before {
		border-right: 12px solid #51271d;
	}
	h1.contact {
		color: 	#51271d; 
	}
	

/* content specific */
#fader {
    height: 450px !important;
}
.pagesep {
	margin-top: 70px;
}
.slogan {
	text-align: center;
	color: #51271d;
	margin-top: 25px;
}
.sliderimg {
	position: absolute;	
}
.sliderbar {
	height: 430px;
	width: 960px;
	background: url('../images/sliderbar.png') center bottom no-repeat;
	position: absolute;
	margin-top: 20px;
	z-index: 999;
	text-align: center;
}
.sliderbar img{
	max-width: 100%;
	height: auto;
}
.sliderbar p {
	padding: 40px;
	margin-top: 10px;
	padding-top: 10px;
}
.sliderbar h2 {
	margin-top: 260px;	
}
.responsiveimage {
	display: inline-block;	
}
/* reponsiveness */
@media only screen and (min-width: 960px) {
	.slicknav_menu {
		display: none;
	}		
	.no-desktop {
		display: none;	
	}
} 
@media only screen and (max-width: 959px) {
	#fader, .twelve.columns.navigation, .subnav.page, .container.slogan, .blockleft .imageblock{
		display: none;	
	}
	.repsonsiveimage {
		width: 100%
	}
	.arrow-left {
		display: none;	
	}
	.blockright .imageblock {
		width: 100%;	
	}
	.responsiveimage img, .imageblock img{
		width: 100%;
	}
	.blockleft .content {
		display: inline-block;	
	}
	.blockleft img {
		clear: both;
		position: relative;	
	}
	
	.slicknav_menu {
		position: fixed;
		width: 100%;
		z-index: 999;	
		-webkit-box-shadow: -1px -1px 21px 0px rgba(50, 50, 50, 1);
		-moz-box-shadow:    -1px -1px 21px 0px rgba(50, 50, 50, 1);
		box-shadow:         -1px -1px 21px 0px rgba(50, 50, 50, 1);
	}
	
	.logo {
		padding-top: 70px !important;
		text-align: center;	
	}
	
	.pagesep {
		margin: 0px;	
	}
	
	.page.header h1 {
		padding-bottom: 15px !important;	
	}
	h2 {
		line-height: 50px;	
	}
	
	.blockright .content.column, .blockleft .content.column  {
		width: auto !important;	
	}
	
	.blockright, .blockleft {
		z-index: 99;
	}
	.block:before {
	  display: none;
	}
}
ul.vlees {
	display: inline-block;
		
}
ul.vlees li {
	line-height: 6px;	
}
ul.vlees, ul.vlees li { 
	text-align: left;	
}
ul.vlees li em {
	width: 20px;
	display: inline-block;
}

