/**
 * Title: Hotel Restaurant Karsten B.V.
 * Description: This stylesheet defines the layout of the website of Hotel Restaurant Karsten B.V.
 * Copyright: Pronamic Internet, Vormgeving en Software
 * Company: Pronamic Internet, Vormgeving en Software
 * Author: Remco Tolsma
 * Version: 1.0
 */

body {
	background: #0C4119 url("back.jpg") repeat-x top center;

	color: #FFF;

	font: 80% Georgia, "Times New Roman", Times, serif;

	line-height: 200%;

	padding: 40px 0;
}

a {
	color: #157222;
}

a:visited {
	color: #965E07;
}

a:hover {
	color: #AA421F;
}

.hr {
	background: url("hr.gif") no-repeat center center;

	height: 15px;

	margin: 2em 0;
}

.hr hr {
	display: none;
}

/**
 * Images
 */
a img {
	border: none;
}

img.decoration {
	float: left;

	margin: 0 20px 40px 0;
}

/**
 * Other
 */
.clear {
	clear: both;
}

.price {
	color: #A73109;

	font-size: 175%;

	padding: 20px;
}

/**
 * Forms
 */
form {
	
}

label {
	cursor: pointer;

	font-weight: bold;
}

.textarea, 
.textfield {
	margin-bottom: 1em;
}

.textarea label, 
.textfield label {
	display: block;
}

.textarea textarea, 
.textfield input {
	border: 1px solid #D6CABE;

	padding: 5px;
}

.textarea textarea:focus, 
.textfield input:focus {
	border-color: #AA421F;
}

.error textarea, 
.error input {
	border-color: #F00;
}

/**
 * Table
 */
table {
	background: #F6E6D7;

	margin-bottom: 1em;

	width: 100%;
}

th, td {
	padding: 5px 10px;

	text-align: left;

	vertical-align: bottom;
}

thead {
	background: #ECDAC5;
}

/**
 * Container
 */
#container {
	margin: 0 auto;

	width: 880px;
}

/** 
 * Top menu
 */
#top-menu {
	background: url("top-shadow.png") no-repeat bottom center;

	float: left;

	width: 100%;
}

#top-menu ul {
	float: right;

	list-style: none;

	margin: 0 25px 0 0;
	padding: 0;
}

#top-menu li {
	float: left;
}

#top-menu a {
	background: #F4E7D6;

	color: #2D1B0D;

	display: block;

	padding: 5px 15px;
}

#top-menu a:hover {
	/* unknown */
}

/* Home */
#top-item-home a {
	background: url("top-menu/home.png") bottom;

	width: 80px;
	height: 26px;
}

#top-item-home span { 
	display: none;
}

/* Contact */
#top-item-contact {
	margin-left: -25px;
}

#top-item-contact a {
	background: url("top-menu/contact.png") bottom;

	width: 80px;
	height: 26px;
}

#top-item-contact span { 
	display: none;
}

/**
 * Header
 */
#header-wrapper {
	background: url("header-shadow.png") no-repeat;

	clear: both;

	/* 10px for shadow */
	padding: 0 10px;

	position: relative;
}

#header {
	background: url("header-back.gif") repeat-x 0 20px;

	min-height: 225px;

	padding: 10px;
}

/**
 * Impression
 */
#impression {
	background: url("impression/restaurant.jpg") no-repeat;

	height: 231px;
}

#impression object {
	display: block;
}

/**
 * Company name
 */
#company-name {
	margin: 0;
	padding: 0;
}

#company-name a {
	background: url("logo.png") no-repeat;

	display: block;

	position: absolute;
	top: -40px;
	left: 40px;

	width: 225px;
	height: 145px;
}

#company-name a span {
	display: none;
}

/* By pass section */
#by-pass-section {
	display: none;
}

/**
 * Navigation
 */
#navigation-wrapper {
	background: url("container-shadow.png") repeat-y;

	/* 10px for shadow */
	padding: 0 10px;
}

#navigation {
	background: #A4320b url("nav-back.gif");
}

/**
 * Main menu
 */
#main-menu {
	background: #AA421F;

	float: left;

	font-size: 120%;

	margin-bottom: 10px;
	padding: 5px 0;

	width: 100%;
}

#main-menu ul {
	list-style: none;

	margin: 0 0;
	padding: 0 5px;
}

#main-menu li {
	float: left;

	margin: 0 1px 0 0;
}

#main-menu a {
	background-position: left top;

	color: #FFF;

	display: block;

	padding: 4px 15px;

	text-decoration: none;
	text-transform: uppercase;
}

#main-menu .child-active a, 
#main-menu a.active, 
#main-menu a:hover {
	background-color: #893519;
	background-position: left bottom;
}

/* Specific items */
#main-item-home a, 
#main-item-over-ons a, 
#main-item-hotel a,
#main-item-restaurant a,
#main-item-themafeesten a,
#main-item-omgeving a,
#main-item-reserveringen a,
#main-item-contact a {
	padding: 0;

	height: 34px;
}

#main-item-home a span,
#main-item-over-ons a span, 
#main-item-hotel a span,
#main-item-restaurant a span, 
#main-item-themafeesten a span,
#main-item-omgeving a span, 
#main-item-reserveringen a span,
#main-item-contact a span {
	display: none;
}

/* Over ons */
#main-item-home a {
	background-image: url("main-menu/home.gif");

	width: 85px;
}

#main-item-over-ons a {
	background-image: url("main-menu/over-ons.gif");

	width: 116px;
}

/* Hotel */
#main-item-hotel a {
	background-image: url("main-menu/hotel.gif");

	width: 90px;
}

/* Restaurant */
#main-item-restaurant a {
	background-image: url("main-menu/restaurant.gif");

	width: 143px;
}

/* Themafeesten */
#main-item-themafeesten a {
	background-image: url("main-menu/themafeesten.gif");

	width: 166px;
}

/* Omgeving */
#main-item-omgeving a {
	background-image: url("main-menu/omgeving.gif");

	width: 125px;
}

/* Resereringen */
#main-item-reserveringen a {
	background-image: url("main-menu/reserveringen.gif");

	width: 173px;
}

/* Contact */
#main-item-contact a {
	background-image: url("main-menu/contact.gif");

	width: 110px;
}

/* Sub levels */
#main-menu ul ul {
	display: none;
}

/**
 * Bread crumbs
 */
#bread-crumbs {
	background: url("bread-crumbs-back.gif") no-repeat top center;

	clear: both;

	color: #a39a91;

	margin-left: 20px;
	padding: 10px 30px;

	text-align: right;

	width: 560px;
}

#bread-crumbs p {
	background: #FCF5EF url("decoration-top.gif") no-repeat bottom center;

	margin: 0;
	padding: 0 0 25px 0;
}

#bread-crumbs em {
	color: #bdb2a8;
}

#bread-crumbs a {
	color: #a39a91;
}

#bread-crumbs a:hover {
	color: #A85336;
}

/**
 * Main
 */
#main-wrapper {
	background: url("container-shadow.png") repeat-y;

	/* 10px for shadow */
	padding: 0 10px;
}

#main {
	background: #F6E6D7 url("main-back.jpg") no-repeat bottom right;

	padding-left: 20px;

	color: #15120D;
}

#main-bottom {
	background: url("main-bottom.png") no-repeat;

	height: 28px;
}

/**
 * Core
 */
#core {
	background: #FCF5EF url("core-back.gif") repeat-y;

	float: left;

	min-height: 750px;

	padding: 20px 40px 20px 40px;

	position: relative;

	width: 540px;
}

#core-bottom {
	background: url("core-bottom.png") no-repeat;

	float: left;
	clear: left;

	height: 54px;

	position: relative;

	width: 620px;
}

#core h1 {
	color: #AA421F;

	font-size: 400%;
	font-weight: bold;

	padding: 0;
	margin: 0 0 .5em 0;
}

#core h2 {
	color: #A73109;

	font-size: 175%;
	font-weight: normal;

	margin: .5em 0 .5em 0;
}

#core h3 {
	font-size: 120%;

	margin: .5em 0 .5em 0;
}

#core h4 {
	font-size: 100%;

	margin: .5em 0 .5em 0;
}

#core p {
	margin: .5em 0 2em;
}

/**
 * Extra
 */
#extra {
	float: right;

	padding-bottom: 50px;

	width: 220px;
}

#extra h1 {
	color: #965E07;

	font-size: 275%;
	font-weight: normal;

	margin: 0;
}

/**
 * Extra menu
 */
#extra-menu {
	background: #ECDAC5;

	border-top: 1px solid #CEBAA7;
}

#extra-menu ul {
	list-style: none;

	margin: 0;
	padding: 0;
}

#extra-menu li {
	
}

#extra-menu a {
	background-repeat: no-repeat;
	background-position: bottom right;

	border-bottom: 1px solid #CEBAA7;

	color: #000;

	display: block;

	padding: 6px 15px;

	text-decoration: none;
}

#extra-menu a.active, 
#extra-menu a:hover {
	background-color: #A73109;

	color: #FFF;
}

#extra-menu a.active {
	font-weight: bold;
}

#extra-menu .parent a {
	background-image: url("arrow-black.gif");
}

#extra-menu .parent a.active, 
#extra-menu .parent a:hover {
	background-image: url("arrow-white.gif");
}

/* Sub levels */
#extra-menu ul ul {
	display: none;
}

#extra-menu li.active ul {
	display: block;
}

#extra-menu li li a {
	background-color: #F5E7D6;

	padding-left: 30px;
}

#extra-menu .parent li a {
	background-image: none;
}

#extra-menu .parent li a.active,
#extra-menu .parent li a:hover {
	background-image: none;
}

/**
 * Extra 1
 */
#extra-1 {
	padding: 15px;
}

/**
 * Extra 2
 */
#extra-2 {
	margin: 0 15px;
}

#extra-2 h1 {
	border-bottom: 1px solid #CEBAA7;

	margin-bottom: .25em;
	padding: 5px 0;
}

/**
 * Photos
 */
#photo-1 {
	position: relative;

	margin-bottom: -80px;

	top: -80px;
	left: -40px;
}

#photo-2 {
	position: relative;

	margin-bottom: -50px;

	top: -80px;
	left: -35px;
}

/**
 * Block
 */
.block-top {
	background: url("block-top.gif") no-repeat;

	width: 525px;
	height: 10px;

	overflow: hidden;
}

.block {
	background: #F5E7D6;

	padding: 10px 20px;

	width: 485px;
}

.block h2 {
	margin-top: 0 !important;
}

.block p {
	margin-bottom: .25em !important;
}

.block img {
	border: solid 2px #883519;

	float: right;

	margin: 0 0 0 20px;
}

.block-bottom {
	background: url("block-bottom.gif") no-repeat;

	margin-bottom: 20px;

	width: 525px;
	height: 10px;

	overflow: hidden;
}

/**
 * Partners list
 */
.partners-list {
	list-style: none;

	margin: 0;
	padding: 0;
}

.partners-list li {
	float: left;

	margin: 10px;
}

/**
 * Hooks
 */
#hook-1 {
	background: url("leaf-1.png") no-repeat;

	position: absolute;

	left: -62px;
	top: -60px;

	width: 62px;
	height: 247px;
}

#hook-2 {
	background: url("leaf-2.png") no-repeat;

	position: absolute;

	right: -37px;
	bottom: -27px;

	width: 141px;
	height: 99px;
}

/**
 * Google Maps
 */
#google-maps {
	border: 1px solid #D6CABE;

	width: 525px; 
	height: 350px;
}

/**
 * Footer
 */
#footer {
	color: #8EAF90;

	clear: both;

	padding: 5px 25px;
}

#footer p {
	margin: 0;
}

#footer a {
	color: #FFF;
}

#footer a:hover {
	color: #8EAF90;
}

/**
 * Copyright
 */
#copyright {
	float: left;
}

/**
 * Pronamic
 */
#pronamic {
	float: right;
}

/**
 * Hoteliers book form
 */
#hoteliers-book-form {
	background: #FCF5EF;

	border: none;

	width: 100%;
	height: 450px;
}