@import 'reset.css';
@import 'jennasue.css';
@import url(http://fonts.googleapis.com/css?family=Josefin+Slab:600,400,700);

body {
	background-image: url('../img/hout_bg.jpg');
	font-family: 'Josefin Slab', serif;
	line-height: 1.5em;
	-webkit-font-smoothing: antialiased;
	height: 100%;
}

div#huls {
/*	background-color: grey;*/
	width: 960px;
	height: 100%;
	margin: 0 auto;
	background-image: url('../img/lichtvlek.png');
	background-repeat: no-repeat;
	background-position: -20px -40px;
}

div#hoofd {
	/*background-color: teal;*/
    height: 136px;
    margin: 60px auto 7px;

}

div#bovenbalk {
	/*background-color: red;*/
	background-image: url('../img/hout_balk.jpg');
	height: 60px;
	background-repeat: repeat-x;
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
	-webkit-box-shadow:  0px 3px 3px 0px rgba(0, 0, 0, .5); 
    box-shadow:  0px 3px 3px 0px rgba(0, 0, 0, .5);
    behavior: url('css/pie.htc');
}

div#logo {
	/*background-color: green;*/
	/*background-image: url('../img/logo_middelpunt.png');*/
    background-repeat: no-repeat;
    height: 110px;
    width: 453px;
    margin-right: 267px;
    position: relative;
    top: -555px;
    left: -30px;
}

div#social {
 	margin: 0 auto;
    position: relative;
    right: -380px;
    top: 20px;
    width: 50px;
    z-index: 100;
}

div#social img{
    width: 50px;

}

div#fotobalk {
	/*background-color: hotpink;*/
	/*background-image: url('../img/fotobalk.png');*/
	height: 135px;
	position: relative;
	top: 1px;
	z-index: -10;
}

div#pagina {
	/*background-color: yellow;*/
	float: left;
	margin-bottom: 50px;

}

div#navigatie {
	/*background-color: purple;*/
	float: left;
	width: 565px;
	height: 40px;
	margin-left: 20px;
}

div#navigatie ul li {
	display: block;
	float: left;
	width: 120px;
	height: 25px;
	background-color: #f9f7ea;
	background-image: url('../img/nav_sprite1.png');
	margin-right: 20px;
	/*padding: 2px 10px;*/
	text-align: center;
	-webkit-box-shadow:  1px 1px 3px 1px rgba(0, 0, 0, .5);
    box-shadow:  1px 1px 3px 1px rgba(0, 0, 0, .5);
    text-shadow: 1px 1px 0px #e0c59c;
    filter: dropshadow(color=#e0c59c, offx=1, offy=1);
}

div#navigatie ul li a {
	display: inline;
}

div#navigatie ul li a:link, div#navigatie ul li a:visited,  div#navigatie ul li a:active{
	color: #7a6f60;
	font-size: 1.1em;
	line-height: 1.4em;
	text-decoration: none;
}

div#navigatie ul li a:hover {
	color: #40241a;
}

div#navigatie ul li.huidige_pagina a:link, div#navigatie ul li.huidige_pagina a:visited, div#navigatie ul li.huidige_pagina a:hover, div#navigatie ul li.huidige_pagina a:active{
	color: #FAFAFA;
}

div#navigatie li.huidige_pagina {
	background-color: #fbb13a;
	font-weight: bold;
	color: #efefef;
	text-shadow: 1px 1px 0px #525252;
    filter: dropshadow(color=#525252, offx=1, offy=1);
}

div#navigatie li.huidige_pagina:before {
	content:"\2234 \2002";
}

div#navigatie ul li#nav_thuis, div#navigatie ul li#nav_fotos {
	-webkit-transform: rotate(-1deg);
	-moz-transform: rotate(-1deg);
	-o-transform: rotate(-1deg);
	-ms-transform: rotate(-1deg);
	transform: rotate(-1deg);
}

div#navigatie ul li#nav_bieren, div#navigatie ul li#nav_contact {
	-webkit-transform: rotate(1deg);
	-moz-transform: rotate(1deg);
	-o-transform: rotate(1deg);
	-ms-transform: rotate(1deg);
	transform: rotate(1deg);
}

div#navigatie ul li#nav_thuis {
	background-position: -35px; 
}

div#navigatie ul li#nav_thuis:hover {
	background-position: -10px -10px; 
}

div#navigatie ul li#nav_bieren {
	background-position: 10px; 
}

div#navigatie ul li#nav_bieren:hover {
	background-position: -10px; 
}

div#navigatie ul li#nav_fotos {
	background-position: 5px; 
}

div#navigatie ul li#nav_fotos:hover {
	background-position: -5px -5px; 
}

div#navigatie ul li#nav_contact {
	background-position: -10px; 
}

div#navigatie ul li#nav_contact:hover {
	background-position: 15px -10px; 
}


div.inhoud {
/*	background-color: beige;*/
	background-image: url('../img/blad.png');
	width: 590px;
	height: 525px;
	float: left;
	padding-bottom: 30px; /* padding om de scrollende pagina's mooi te laten verdwijnen in de div*/
	padding-top: 20px;
	margin-right: 40px;
}

div.inhoud h2, div.inhoud p, div.inhoud h4 {
	margin: 30px 30px; 
}


div.inhoud h2 {
	margin-top: 10px;
	font-family: 'JennaSueRegular', serif;
	font-weight: 300;
	font-size: 3em;
	color: #2a1a0b;
	border-bottom: 1px solid #f1af41;
	line-height: 1em;
}

div.inhoud p {
	padding: 0 20px; 
	font-size: .8em;
}

div#inhoud_thuis p:nth-of-type(2) {
	font-family: 'JennaSueRegular', serif;
	font-size: 1.5em;
	text-align: right;
	color: #2a1a0b;
}

div#inhoud_thuis a:link, div#inhoud_thuis a:visited, div#inhoud_thuis a:hover, div#inhoud_thuis a:active  {
	color: #2a1a0b;
	text-decoration: none;
	text-align: right;
}

div#inhoud_thuis div#sticky {
	background-image: url('../img/sticky.png');
	background-repeat: no-repeat;
	height: 96px;
	width: 100px;
	font-family: 'JennaSueRegular', serif;
	font-size: 3.5em;
	padding-top: 40px;
	padding-left: 20px;
	margin-left: 40px;
}



div.inhoud table {
	margin-left: 30px;
	margin-bottom: 20px;
	width: 500px;
}

div#inhoud_bier table td {
	padding: 0 10px;
	border-right: 1px solid #000;
	font-size: .8em;
	vertical-align: top;
}

div#inhoud_bier table td.naam_foto {
	width: 110px;
}

div#inhoud_bier table td.uitleg{
	width: 290px;
	line-height: 1em;
}

div#inhoud_bier table td.info {
	width: 50px;
	border-right: none;
}

div#inhoud_wedstrijd h2 {
	font-size: 2.3em;
}

div#inhoud_wedstrijd form {
	margin-left: 30px;
	font-size: .8em;
}

textarea {
	max-width: 275px;
	min-width: 275px;
	height: 100px;
	margin-top: 20px;
}

#zendknop {
	margin: 20px 140px;
}

div#inhoud_fotos img {
	margin-right: 10px;
}

div#inhoud_contact iframe {
	margin-left: 40px;
}

div#inhoud_contact p {
	width: 180px;
	float: left;
	margin-top: 0px;
}

div#inhoud_contact p#openingsuren {
	float: right;
	text-align: right;
}


div#vat {
/*	background-color: black;*/
	font-family: 'JennaSueRegular', serif;
	background-image: url('../img/krijtbord.png');
	background-repeat: no-repeat;
	color: #FFF;
	width: 252px;
	height: 298px;
	float: left;

	/*padding-left: 50px;*/
}

div#vat h3 {
	margin: 80px 0 10px 50px;
	font-weight: normal;
	font-size: 2.5em;
}

div#vat ul li {
	margin-left: 55px;
	font-weight: 300;
	font-size: 1.4em;
	padding: 5px 0;
}

div#voet {
	color: #50473d;
	margin: 0 auto;
	text-align: center;
	font-size: .7em;
}

div#voet a:link, div#voet a:visited, div#voet a:hover, div#voet a:active  {
	color: #50473d;
	text-decoration: none;
}

div#voet a:hover {
	color: #7a6f60;
}

div#emaille {
	height:100%;
	position: absolute;
	bottom: 100px;
	z-index: -10;
}


div#duvel {
    left: -220px;
    position: relative;
    top: 450px;
    width: 200px;
}

div#duvel img{
	height: 250px;
}

div#palm {
    margin-top: -400px;
    position: relative;
    right: -950px;
    top: 600px;
    width: 150px;
}

div#palm img{
	height: 330px;
}