﻿/*************************************************
* Title:       Default                           *
* Description: This stylesheet defines           *
*              the default layout of             *
*              iesicht.nl                *
* Copyright:   Pronamic.nl                       *
* Company:     Pronamic.nl                       *
* Author:      Martijn Cordes                   *
* Version:     1.0                               *
*************************************************/

/**********************
* Default             *
**********************/
html, body, input, textarea
{
  font-family: "Verdana", "Arial", "Helvetica", sans-serif;
  font-size: 11px;

  margin: 0;
}

body
{
  background: #333333 url("background.gif") repeat;
}

a { color: #EF9A01; }
a:hover { color: #666666; }

a img { border: none; }

h1
{
  color: Black;

  font-size: 20px;
  font-weight: normal;

  margin: 0;
  margin-bottom: 15px;
  padding: 0;
}

p strong, h2
{
  color: Black;

  font-size: 14px;
  font-weight: normal;

  line-height: 150%;
  
  margin-bottom: 10px;
}

h3, legend
{
  color: #EF9A01;

  font-size: 11px;
  font-weight: bold;

  text-transform: uppercase;
  
  margin: 0;
  padding: 0;
}

/**********************
* Container           *
**********************/
#container
{
  background: #EDEADB url("main_background.gif") repeat-y;

  border-left: solid 25px #1B1B1B;
  border-right: solid 25px #1B1B1B;

  width: 750px;

  margin: 0 auto;
}

/**********************
* Top                 *
**********************/
#top
{
  background: #9CA9CC url("header.gif") repeat-x bottom;

  color: #666699;

  font-family: Times New Roman;
  font-size: 12px;
  font-weight: normal;

  float: left;

  padding: 5px;

  text-transform: uppercase;

  width: 740px;
}

#top h1
{
  font-size: 12px;

  float: left;

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

#top a 
{ 
  color: #666699;

  text-decoration: none;
}

#contact_link
{
  font-weight: bold;

  float: right;
  
  padding-right: .5em;
}

#contact_link:hover { text-decoration: underline; }

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

  height: 170px;
  width: 750px;

  float: left;
}

#page_arrangement #header { background-image: url("arrangement.jpg"); }
#page_wie_zijn_wij #header { background-image: url("wie_zijn_wij.jpg"); }
#page_huwelijk #header { background-image: url("huwelijk.jpg"); }
#page_hotel #header { background-image: url("hotel.jpg"); }
#page_contact #header { background-image: url("contact.jpg"); }
#page_fotos #header { background-image: url("fotos.jpg"); }
#page_menukaart #header { background-image: url("menukaart.jpg"); }

/**********************
* Navigation          *
**********************/
#navigation
{
  background: #1B1B1B;

  float: left;

  border-bottom: solid 1px #FFFFFF;

  padding: 9px 0;
  
  text-align: center;

  width: 100%;
}

#navigation ul
{
  display: inline;

  margin: 0 auto;
  padding: 0;
  
  text-align: left;
}

#navigation li
{
  display: inline;

  padding: 0 6px;
}

#navigation a
{
  color: White;

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

#navigation a:hover
{
  text-decoration: underline;
}

#navigation .active a
{
  font-style: italic;
}

/**********************
* Main                *
**********************/
/* Layout */
#content_wrapper { float: left; width: 100%; }
#content { margin: 0 160px 0 200px; }
#extra_1 { float: left; width: 160px; margin-left: -160px; }
#extra_2 { float: left; width: 200px; margin-left: -750px; }

/**********************
* Content             *
**********************/
#content
{
  color: #666666;

  padding: 15px;

  line-height: 175%;

  word-spacing: 3px;
}

#content p
{
  margin-top: 0;
  margin-bottom: 1em;
}

/**********************
* Extra 2             *
**********************/
#extra_2
{
  color: White;
}

#extra_2 h2
{
  color: White;

  font-size: 11px;
  font-weight: bold;

  border-bottom: dotted 1px White;

  margin: 0 0 2px 0;
  padding: 2px;
}

#extra_2 p
{
  margin: 0;
  padding-bottom: 1em;
}

/**********************
* Reservation         *
**********************/
#reservation {
	background-color: #EF9A01; 

	padding: 10px 0 10px 20px;
}

/**********************
* Addres              *
**********************/
#address
{
  background: #9CA9CC;

  padding: 20px 0 20px 20px;

  line-height: 135%;

  word-spacing: 2px;
}

#address a
{
  color: White;
}

/**********************
* Extra image 2       *
**********************/
#extra_image_2
{
  background: White url("column.gif") repeat-x;

  margin: 0;
  padding: 20px 0;

  text-align: center;
}

#extra_image_2 img { margin-bottom: 10px; }

/**********************
* Extra 1             *
**********************/
#extra_1
{
  color: White;
}

#extra_1 h2
{
  color: White;

  font-size: 11px;
  font-weight: bold;

  border-bottom: dotted 1px White;

  margin: 0 0 2px 0;
  padding: 2px;
}

#extra_1 li a
{
  color: White;
}

/**********************
* Sub navigation      *
**********************/
#sub_navigation
{
  background: #EF9A01;

  width: 140px;

  padding: 20px 0 20px 20px;

  line-height: 140%;

  word-spacing: 2px;
}

#sub_navigation ul
{
  list-style: none;

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

#sub_navigation li
{
  background: url("sub_navigation_item.gif") no-repeat 5px 6px;

  padding-left: 18px;
  padding-right: 1em;
  margin: .5em 0;
}

#sub_navigation a { text-decoration: none; }
#sub_navigation a:hover { text-decoration: underline; }

/**********************
* Extra image 1       *
**********************/
#extra_image_1
{
  background: White url("column.gif") repeat-x;

  color: Black;

  margin: 0;
  padding: 20px 0;

  text-align: center;
}

/**********************
* Footer              *
**********************/
#footer
{
  background: #9CA9CC;

  color: #666699;

  font-family: Times New Roman;

  clear: both;
  width: 100%;

  padding: 5px 0;

  text-align: center;
  text-transform: uppercase;
}

#footer h2
{
  color: #666699;

  font-size: 20px;
  font-weight: normal;
  
  margin: 0;
  padding: 15px 0;
}

/**********************
* Copyright           *
**********************/
#copyright
{
  background: #999999 url("copyright_background.gif") repeat-x;
  color: #666666;

  font-size: 10px;

  padding: 8px 0;

  text-align: center;

  width: 100%;
}

#copyright a
{
  color: #666666;

  text-decoration: none;
}

#copyright a:hover
{
  color: Black;
}

/**********************
* Contact form        *
**********************/
#contact_form
{
  margin: 0;
  padding: 0;
}

#contact_form fieldset
{
  border: none;
  
  margin: 0;
  padding: 0;
}

#contact_form fieldset div 
{
  margin: 0;
  padding: 6px;
}

#contact_form fieldset div span 
{
  display: block;
  font-weight: bold;
  float: left;
  width: 11em;
}

#contact_form input,
#contact_form textarea
{
  border: 1px solid #9CA9CC;
  
  padding: 3px;
  
  width: 18em;
}

#contact_form input.submit
{
  width: auto;
  
  margin-left: 11em;
  padding: 2px 5px;
}

#contact_form legend
{
  margin: 0 0 .5em 0;
  padding: 0;
}

/**********************
* Photo gallery       *
**********************/
#photo_gallery img
{
  border: 1px solid #999999;

  padding: 1px;
  
  margin: 0 20px 20px 0;
}

/**********************
* Menu card           *
**********************/
.menu_card_section img
{
  border: 1px solid #999999;
  float: left;
  padding: 1px;
}

.menu_card_item
{
  clear: left;
  float: left;
  
  width: 32em;
}

.menu_card_item h3 { float: left; }
.menu_card_item .price { float: right; }
.menu_card_item p { clear: both; }

.price
{
  color: #5D7BB9;
  
  font-weight: bold;
  
  white-space: nowrap;
}

/***********************
* De omgeving (iframe) *
************************/
#iframe_omgeving {
	width: 525px;
	height: 700px;
	margin-bottom: -15px;
	margin-right: -160px;
}