/**
 * Title: Bruidsmode Joan
 * Description: This stylesheet defines the layout of the website of Bruidsmode Joan
 * Copyright: Pronamic Internet, Vormgeving en Software
 * Company: Pronamic Internet, Vormgeving en Software
 * Author: Remco Tolsma
 * Version: 1.0
 */

body {
	background: #d9d9d9;

	font-family: Arial, "Lucida Console", sans-serif;
	font-size: 80%;
	line-height: 140%;

	padding: 50px 0;
	margin: 0;
}

/**
 * Headings 
 */
h2 {
	font-size: 125%;
}

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

blockquote {
	background: #eadfdf url("quote.gif") no-repeat top right;

	color: #000;

	margin: 1em 0;
	padding: 1px 15px;
}

/**
 * Forms 
 */
form .textarea, 
form .textfield {
	margin-bottom: 1em;
}

form label {
	cursor: pointer;

	float: left;

	font-weight: bold;

	margin: 1px 1em;
	padding: .25em;

	text-align: right;

	width: 10em;
}

form .textarea textarea,  
form .textfield input,
form .textfield select {
	background: #FFF url("input-back.gif") repeat-x top;

	border: 1px solid #BBB;

	font-family: "Verdana", "Arial", "Helvetica", sans-serif;
	font-size: 1em;

	padding: .25em;
	margin: 0;

	width: 18em;
}

form .textarea textarea:focus,  
form .textfield input:focus, 
form .textfield select:focus {
	border-color: #500;
}

form .error {
	background: #FFD9D9;

	border: 1px solid #F00;

	padding: 5px;
}

form .form-actions {
	padding-left: 12.5em;
}

/**
 * Images
 */
img.bride {
	background: url("image-bride-back.png") no-repeat;

	border: none;

	display: block;

	width: 180px;
	height: 240px;

	padding: 9px 11px 11px 9px;
}

img.decoration {
	border: 1px solid #500;

	float: right;

	margin: 5px;
}

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

	width: 800px;
}

#container a {
	color: #000;
}

#container a:hover {
	color: #600;
}

/**
 * Head
 */
#head {
	background: #222;

	color: #FFF;

	float: left;

	width: 100%;
}

#head a {
	color: #FFF;
}

#head a:hover {
	color: #EEEDCF;
}

/**
 * Main menu
 */
#main-menu {
	font-size: 120%;

	padding: 0 px;
}

#main-menu ul {
	margin: 0;
	padding: 0;

	list-style: none;
}

#main-menu li {
	float: left;
}

#main-menu a {
	background: transparent no-repeat center 17px;

	display: block;

	padding: 16px 12px;

	text-decoration: none;
}

#main-menu a.active,
#main-menu a:hover {
	background-color: #4D4D4F;

	color: #FFF;
}

/* Specific menu items */
#menu-item-home a { background-image: url("main-menu/home.png"); width: 50px; height: 16px; }
#menu-item-home a span { display: none; }

/* #menu-item-opruiming a { background-image: url("main-menu/opruiming.png"); width: 94px; height: 16px; } */
/* #menu-item-opruiming a span { display: none; } */

#menu-item-nieuws a { background-image: url("main-menu/nieuws.png"); width: 60px; height: 16px; }
#menu-item-nieuws a span { display: none; }  

#menu-item-collectie a { background-image: url("main-menu/collectie.png"); width: 77px; height: 16px; }
#menu-item-collectie a span { display: none; }

#menu-item-bruiden a { background-image: url("main-menu/onze-bruidsparen.png"); width: 156px; height: 16px; }
#menu-item-bruiden a span { display: none; }

#menu-item-verhuur a { background-image: url("main-menu/verhuur.png"); width: 68px; height: 16px; }
#menu-item-verhuur a span { display: none; }

#menu-item-agenda a { background-image: url("main-menu/agenda.png"); width: 71px; height: 16px; }
#menu-item-agenda a span { display: none; }

#menu-item-winkel a { background-image: url("main-menu/winkel.png"); width: 54px; height: 16px; }
#menu-item-winkel a span { display: none; }

#menu-item-contact a { background-image: url("main-menu/contact.png"); width: 72px; height: 16px; }
#menu-item-contact a span { display: none; }

/**
 * Main
 */
#main {
	background: #FFF url("main-back.jpg") no-repeat;

	clear: both;

	padding: 10px 0;

	position: relative;

	width: 100%;
	min-height: 450px;
}

/* Headings */
#main h1 {
	background: transparent no-repeat;

	font-family: "Lucida Handwriting", Arial, "Lucida Console", sans-serif;
	font-weight: normal;
}

#main h1.home-head, 
#main h1.opruiming-head, 
#main h1.collectie-head, 
#main h1.agenda-head,
#main h1.contact-head, 
#main h1.nieuws-head, 
#main h1.verhuur-head,
#main h1.winkel-head, 
#main h1.onze-bruiden-head,
#main h1.alle-merken-head {
	height: 32px;

	text-indent: -1000em;
}

#main h1.home-head { background-image: url("headings/home.png"); }
#main h1.opruiming-head { background-image: url("headings/opruiming.png"); }
#main h1.collectie-head { background-image: url("headings/collectie.png"); }
#main h1.agenda-head { background-image: url("headings/agenda.png"); }
#main h1.contact-head { background-image: url("headings/contact.png"); }
#main h1.nieuws-head { background-image: url("headings/nieuws.png"); }
#main h1.verhuur-head { background-image: url("headings/verhuur.png"); }
#main h1.winkel-head { background-image: url("headings/winkel.png"); height: 39px; }
#main h1.onze-bruiden-head { background-image: url("headings/onze_bruidsparen.png"); height: 54px; }
#main h1.alle-merken-head { background-image: url("headings/alle-merken.png"); height: 80px;}

/**
 * Company name
 */
h1#company-name {
	float: right;
	clear: right;

	margin: 0;
	padding: 0;

	position: absolute;
	right: 20px;
	top: 20px;
}

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

	display: block;

	text-indent: -1000em;

	width: 109px;
	height: 157px;
}

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

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

	margin: 0 10px;

	width: 300px;
	min-height: 200px;
}

#extra #brands {
	margin: 350px 0 20px 50px;
}

/* Images */
#extra img {
	background: url("image-medium-back.png") no-repeat;

	border: none;

	display: block;

	width: 285px;
	height: 380px;

	padding: 9px 11px 11px 9px;
}

#extra img.landscape {
	background-image: url("image-landscape-back.png");

	height: 210px;
}

/* Spring banner */
.spring-banner {
	margin: 360px 0 -141px -150px;
}

.spring-banner a {
	background: url('bruid-actie.png') no-repeat top left;

	display: block;

	overflow: hidden;

	width: 600px;
	height: 482px;
}

.spring-banner span {
	display: none;
}

/**
 * Content
 */
#content {
	float: right;
	clear: right;

	margin-top: 40px;
	padding: 10px;

	width: 410px;
}

#content h1 {
	margin: 1em 0 1.5em 0;
	padding-top: 35px;
}

/* Home content */
#home-content { padding: 0 50px 0 50px;}

/**
 * Images list
 */
.images-list {
	float: left;

	clear: both;

	list-style: none;

	margin-left: 0;
	padding-left: 0;

	width: 100%;
}

.images-list li {
	float: left;

	margin: 5px;
}

.images-list a {
	display: block;
}

.images-list img {
	background: url("image-small-back.png") no-repeat;

	border: none;

	display: block;

	width: 75px;
	height: 100px;

	padding: 9px 11px 11px 9px;
}

/**
 * Brides list
 */
.brides-list li {
	min-height: 175px;

	width: 125px;
}

/**
 * Categories navigation
 */
.categories-navigation {
	line-height: 150%;
}

.categories-navigation a {
	padding: 0 0.25em;
}

/**
 * Page navigation
 */
.page-navigation a {
	background: #D3D3D3 url("page-nav-back.gif") repeat-x top;

	border: 1px solid #C2C2C2;

	font-weight: bold;

	padding: 2px 5px;

	text-decoration: none;
}

/**
 * Definition list
 */
dl {
	clear: both;

	float: left;

	margin-bottom: 1.5em;
	
	width: 400px;
}

dt, dd {
	float: left;
	padding: 1em 0;
}

dt {
	font-weight: bold;
	
	width: 100px;
}

dd {
	width: 200px;
}

/**
 * Foot
 */
#foot {
	background: #222;

	color: #BBB;

	clear: both;

	min-height: 25px;

	padding: 10px 100px;

	text-align: center;
}

/**
 * Copyright
 */
#copyright {
	font-size: 90%;

	margin: 0 auto;
	padding: 5px 0;

	text-align: center;

	width: 800px;
}

#copyright a {
	color: #69646b;

	text-decoration: none;
}

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