/*******************************************************************************
Algemeen
*******************************************************************************/
body {
	background: url("../img/bg.png") #998465 !important;
	text-align: center;
	font-family: "Trebuchet MS","Lucida Sans Unicode";
	font-size: 12px;
	filter: none !important;
}

#main {
	background: #FFF;
	width: 960px;
	margin: 0px auto;
	height: 640px;
	position: relative;
}


h1 {
	color: #C26E2C;
	font-size: 22px;
	margin-bottom: 20px;
	font-weight: bold;
}

.overlay {
	width:710px;
	position:relative;
	left:40px;
	z-index:600;
}

#copyright {
	font-size: 10px;
	color: #6B5C47;
	position: relative;
	margin: 0 auto;
	width: 960px;
	top: -10px;
}



/*******************************************************************************
Navigatie
*******************************************************************************/

.title {
	float: left;
	cursor: pointer;
	z-index: 100;
}

/*******************************************************************************
Sets
*******************************************************************************/

.set {
	float: left;
	display: block;
	height: 640px;
}

.set.margin {
	margin-left: 3px;
}

/*******************************************************************************
Content
*******************************************************************************/

.content {
	display: none;
	width: 655px;
	float: left;
	text-align: left;
	line-height: 1.2;
	color: #5c5b5d;
	margin-left: 25px;
	margin-right: 25px;
	height: 650px;
	position: relative;
	background-color: #FFF;
	filter: none;
}

.content ul {
	list-style: disc;
	list-style-position: inside;
}

.content h1 {
	margin-top: 13px;
	margin-bottom: 45px !important;
}


/*******************************************************************************
Shadows
*******************************************************************************/

#shadow_top {
	background: url('../img/top.png') no-repeat;
	width: 990px;
	height: 34px;
	margin: 30px auto 0;
}

#shadow_bottom {
	background: url("../img/bottom.png") no-repeat scroll 1px 0 #998465;
	width: 990px;
	height: 34px;
	margin: 0 auto;
	margin-top: -16px;
	position: relative;
	z-index: -10;
}

#shadow_main {
	background: url("../img/side.png") repeat-y scroll 1px 0 #998465;
	width: 990px;
	margin: -17px auto 0;
}


/*******************************************************************************
Producten pagina
*******************************************************************************/


.producten {
	margin-top: 65px;
	/*margin-top: -20px;*/
}

.kiesmateriaal {
	background: url('../img/gradient.jpg') repeat scroll 0 0 transparent !important;
	display: block;
	border: 3px solid #d5d5d5 !important;
	color: #FFF !important;
	font-weight: bold !important;
	text-align: center !important;
	width: 280px !important;
	background: #FFF;
	height: 30px;
	line-height: 30px;
	*margin-left: -14px;
}

#dropdown ul li {
	display: block;
	width: 268px;
	background: #FFF;
	border: 3px solid #d5d5d5 !important;
	height: 30px;
	line-height: 30px;
	padding-left: 12px;
	margin-top: -1px;
	color: #FFF;
	*margin-left: -14px;
}

#dropdown ul li:hover {
	display: block;
	width: 255px;
	padding-left: 25px;
	height: 30px;
	background: #AAA097 url('../img/shine.png') no-repeat;
	background-position: -100px;

}

#dropdown ul {
	list-style-position: inside;
}

li.headlink ul {
	display: none;
}

li.headlink ul li:hover {
	cursor: pointer;
}

#dropdown {
	z-index: 5;
	list-style: none;
	position: absolute;
	top: 50px;
}

#dropdown a {
	text-decoration: none;
	color: #FFF;
	display: block;
	height: 100%;
	width: 100%;
}

.shine {
	z-index: 10;
	position: relative;
	top: 0;
	left: 0;
}

/*******************************************************************************
Producten pagina
*******************************************************************************/

.home {
}

/*******************************************************************************
Over Potmaat
*******************************************************************************/

#overpotmaat {
	margin-left: -5px;
}

#overpotmaat_adres {
	font-size: 11px;
	width: 143px;
	height: 105px;
	background: #FFF;
	opacity: 0.95;
	filter: alpha(opacity = 95);
	color: #000;
	z-index: 2;
	padding: 5px;
	position: relative;
	top: 80px;
}

#banner {
	position: absolute;
	left: -25px;
}

.overpotmaatcontent {
	position: absolute;
	width: 70%;
	left: 140px;
}


/*******************************************************************************
Inloggen
*******************************************************************************/

form label {
	width: 120px;
	text-align: right;
	display: inline-block;
}

form input[type=text], form input[type=password] {
	border: 1px solid #7b7b7b;
	margin-bottom: 6px;
	width: 200px;
}

.inloggen,
.definitief,
.redirect,
.back,
.bereken {
	background: url('../img/gradient.jpg') repeat scroll 0 0 transparent !important;
	border: 1px solid #867558;
	display: block;
	color: #FFF;
	font-weight: bold;
	text-align: center;
	width: 140px;
	background: #FFF;
	margin-left: 120px;
	padding: 4px 10px 6px 7px;
	font-size: 12px;
	font-family: "Lucida Grande", Tahoma, Arial, Verdana, sans-serif;
	width: auto;
	overflow: visible;
}

#adres {
    float: left;
	margin-left: 10px;
	margin-top: -3px;
}

.route-input label {
    float: left;
}

.bereken {
    margin-left: 10px;
	float: left;
	margin-top: -6px;
}

.back {
    margin: 0;
}

.definitief {
	margin-left: 0px;
}

#login a {
	color: #5C5B5D;
}

/*******************************************************************************
Home
*******************************************************************************/

#eerste {
	float: left;
	width: 200px;
	margin-left: 10px;
	margin-right: 9px;
	display: block;
	height: 200px;
	background: url('../img/home/pot1.jpg') no-repeat;
}

#tweede {
	float: left;
	width: 200px;
	margin-left: 5px;
	margin-right: 9px;
	display: block;
	height: 200px;
	background: url('../img/home/pot2.jpg') no-repeat;
}

#derde {
	float: left;
	width: 200px;
	margin-right: 10px;
	margin-left: 5px;
	display: block;
	height: 200px;
	background: url('../img/home/pot3.jpg') no-repeat;
}

#eerste,#tweede,#derde {
	display: none;
	position: relative;
	top: 76px;
}

.blokken {
	position: relative;
	display: block;
	top: 220px;
}

.welkom_nl,
.welkom_en {
	float: left;
	font-size: 30px;
	width: 400px;
}

.welkom_ingelogd {
	position: relative;
	left: 5px;
	float: left;
	font-size: 30px;
	width: 400px;
}

.welkom {
	position: relative;
	top: 200px;
	font-size: 20px !important;
	width: 200px;
	margin: 0 auto;
	*margin-top: 50px;
	*left: 150px;
}

.welkom a {
	text-decoration: none !important;
	color: grey;
}

.welkom img {
	margin-right: 10px;
}

/*******************************************************************************
Downloads
*******************************************************************************/

#downloads a {
	display: block;
	height: 30px;
	padding-left: 50px !important;
	line-height: 30px;
	text-decoration: none;
	color: #7b7b7b;
}

/*******************************************************************************
Buttons
*******************************************************************************/

.redirect {
	text-decoration: none;
	margin-left: 0px;
	margin-top: 20px;
}


/*******************************************************************************
Icons
*******************************************************************************/

.zip {
	background: url("../img/zip2.gif") no-repeat scroll 0 50% transparent;
}
.pdf {
	background: url('../img/pdf.gif') 0 50% no-repeat;
}




/*******************************************************************************
jScrollPaneContainer
*******************************************************************************/

.jScrollPaneContainer {
	position: relative;
	overflow: hidden;
	z-index: 1;
	padding-right: 19px;
	margin-top: 85px;
}

.jScrollDragBottom {
	position: relative;
	overflow: hidden;
	z-index: 1;
	padding-right: 19px;
	margin-top: 40px;
}


.jScrollPaneDrag {
	background: url('../img/scroll_middle.jpg') repeat-y !important;
}

.jScrollPaneTrack {
	background: #dbd7b3 !important;
}

a.jScrollArrowUp {
	height: 30px !important;
	background: url('../img/scroll_top.jpg') no-repeat 0 0;
}

a.jScrollArrowDown {
	height: 30px !important;
	background: url('../img/scroll_bottom.jpg') no-repeat 0 0;
}

p {
	margin-bottom: 10px !important;
}

/*******************************************************************************
Route
*******************************************************************************/

#map {
	height: 400px;
	width: 650px;
	margin-top: 20px;
}

#map_1 {
	height: 400px;
	width: 650px;
	margin-top: 20px;
}

#map_2 {
	height: 400px;
	width: 650px;
	margin-top: 20px;
}

#dialog {
	font-size: 10px;
	overflow: relative;
}

.ui-dialog {
	width: 700px !important;
	height: 700px !important;
}

/*******************************************************************************
Fotoalbum
*******************************************************************************/

.galleria_container {
	display: block;
	height: 200px;
	width: 100%;
        margin-top: 50px;
}

#gallery {
	overflow: hidden;
	width: 465px;
	*width: 470px !important;
	height: 90px;
	margin: 0 auto;
}

.gallery_wrap {
    margin-left: 70px;
}

#fotoalbum ul {
	list-style: none;
        width: auto;
}

#fotoalbum li {
	margin-right: 15px;
	margin-bottom: 15px;
	border: 1px solid lightgrey;
	height: 100px;
	width: 100px;
	overflow: hidden;
	float: left;

}


#fotoalbum li:hover {
	border: 1px solid darkgrey;
}

#fotoalbum li a {
	display: block;
	width: 100px;
	height: 100px;
	text-decoration: none;
}

.logo {
	background: url('../img/logo.jpg') no-repeat;
	display: block;
	height: 46px;
	width: 216px;
	position: relative;
	left: 0px;
	float: right;
	top: 7px;
	cursor: pointer;
}

.logo2 {
	background: url('../img/logo2.jpg') no-repeat;
	display: block;
	height: 64px;
	width: 300px;
	position: relative;
	float: right;
	top: 10px;
	left: -30px;
	cursor: pointer;
}

.overpotmaatimg {
	position: absolute;
	left: -25px;
}

#productenframe {
	margin-top: 20px;
	*margin-top: 0px;
}

.ui-dialog-title {
	line-height: 1.2;
}

/** Modals
------------------------------------------------------------------------------*/

.modal {
    background-color:			#fff;
    display:					none;
    width:						350px;
    padding:					15px;
    text-align:					left;
    border:						2px solid #333;

    -moz-border-radius:			6px;
    -webkit-border-radius:		6px;
    -moz-box-shadow:			0 0 50px #ccc;
    -webkit-box-shadow:			0 0 50px #ccc;
}

.modal h2 {
    background:		url(/img/global/info.png) 0 50% no-repeat;
    margin:			0px;
    padding:		10px 0 10px 0px;
    border-bottom:	1px solid #333;
    font-size:		20px;
}


/** buttons
------------------------------------------------------------------------------*/

.buttons {
	position: relative;
}

.buttons a, .buttons button {
    display:				block;
    float:					left;
    margin:					0 7px 0 0;
    background-color:		#C26E2C;
    border:					1px solid #dedede;
    border-top:				1px solid #eee;
    border-left:			1px solid #eee;

    font-family:			"Lucida Grande", Tahoma, Arial, Verdana, sans-serif;
    font-size:				100%;
    line-height:			130%;
    text-decoration:		none;
    font-weight:			bold;
	color:					#FFF;
    cursor:					pointer;
    padding:				5px 10px 6px 7px;

}

.buttons button {
    padding:				4px 10px 6px 7px;
	line-height:			17px;
}

*:first-child+html button[type]{
    padding:				3px 0px 3px 0px !important;
}


.buttons button img, .buttons a img{
    margin:					0 3px -3px 0 !important;
    padding:				0;
    border:					none;
    width:					16px;
    height:					16px;
}

/* Knop kleuren
------------------------------------------------------------------------------*/

/* Standaard */

.buttons button:hover, .buttons a:hover{
    background-color:		#E0AE87;
    border:					1px solid #c2e1ef;
    color:					#FFF;
}
.buttons a:active, .buttons button:active {
    background-color:		#FFF;
    border:					1px solid #6299c5;
    color:					#000;
}

/* Positief */

button.positive, .buttons a.positive{
    color:					#529214;
}
.buttons a.positive:hover, button.positive:hover {
    background-color:		#E6EFC2;
    border:					1px solid #C6D880;
    color:					#529214;
}
.buttons a.positive:active, button.positive:active {
    background-color:		#529214;
    border:					1px solid #529214;
    color:					#fff;
}

/* Negatief */

.buttons a.negative, button.negative{
    color:					#d12f19;
}
.buttons a.negative:hover, button.negative:hover {
    background-color:		#fbe3e4 !important;
    border:					1px solid #fbc2c4;
    color:					#d12f19;
}
.buttons a.negative:active{
    background-color:		#d12f19;
    border:					1px solid #d12f19;
    color:					#fff;
}


.ui-dialog-content {
	position: relative;
}

.close {
	width: auto;
	overflow: visible;
}

/** Bestelling aanpassen
------------------------------------------------------------------------------*/

#bestelling_aanpassen {
	position:					absolute;
    background-color:			#fff;
    display:					none;
    width:						650px;
	height:						520px;

    padding:					15px;
    text-align:					left;
    border:						2px solid #333;

    -moz-border-radius:			6px;
    -webkit-border-radius:		6px;
    -moz-box-shadow:			0 0 50px #ccc;
    -webkit-box-shadow:			0 0 50px #ccc;
}

#bestelling_aanpassen #model_details {
	display: none;
}


.window_bar,
.window_bottom {
	left: 0;
	right: 0;
}

.window_bar {
	position: absolute;
	height: 25px;
	line-height: 25px;
	top: 0;
	bottom: auto;
}
.window_bar img {
	padding: 5px 2px 5px 5px;
	vertical-align: middle;
}
.window_content {
	overflow-y:	auto;
	position: absolute;
	top: 25px;
	left: 0;
	right: 0;
	bottom: 25px;
	padding: 5px;
}


.window_bottom {
	bottom: 0;
	padding: 0 3px;
	height: 30px;
	line-height: 25px;
}