/* 
Yes2web Standaard CSS - V 20070801 
Site.css Bevat alle elementen voor de opmaak van de website, exclusief de opmaak die door TinyMCE gebruikt kan worden.
*/

/*
LePuij
@author: Yes2web
@version: 20100409
*/

body, #publerBody {
	background: #000 url('../../images/lepuij/background/bodyBg.gif') repeat-y center top;
	text-align: center;
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
	html {height:100%;}
	body {background: #000 url('../../images/lepuij/background/bodyBg-webkit.gif') repeat-y center top; height:100%;}
}

#containerWrapper {
	background:transparent url('../../images/lepuij/background/wrapperBg.gif') repeat-x left top;
	height:522px;
	margin-top:100px;
}

#container {
	position:relative;
	width:915px;			/* Page width */
	margin:0 auto; 			/* First one for top spacing, second one for center alignment */
	text-align: left;		/* IE undo center alignment */
	padding-bottom:70px;
}
		
#header {
}
		
div#main {
	border-left:1px solid #333;
	border-right:1px solid #333;
	padding:1px 0;
}

div#contents {
	/*margin: 0 0 0 150px;	/*Geef de margins zo breed als de columns */
	background:transparent url('../../images/lepuij/background/contentBg.gif') repeat-y left top;
	border-bottom:solid 1px #333;
	float:left;
}

#logo {
	left:1px;
	position:absolute;
	top:1px;
	z-index: 100;
}

#sidebar {
	float:left;
	min-height:420px;
	height:auto !important;
	height:420px;
	padding:0;
	width:314px;
}
	#sidebar a.item {
		color:#999;
		float:left;
		height:60px;
		margin:16px 3px;
		padding:5px 0;
		text-align:center;
		text-decoration:none;
		width:75px;
	}
		#sidebar a.item span.imgWrap {
			display:block;
			height:45px;
			line-height:55px;
			overflow:hidden;
			width:75px;
		}
		#sidebar a.item span {
			display:block;
		}
		#sidebar a.active, #sidebar a.item:hover {
			background-color:#333;
			color:#fff;
		}
	#sidebar img, .headerImg {display:block;}
		.headerImg {border-bottom:1px solid #333;}
		#flash-holder {height:420px;}
		#sidebar span img {display:inline;}
	
.home #sidebar, .products #sidebar, .collection #sidebar, .projects #sidebar{
	min-height:1px;
	height:auto !important;
	height:1px;
	padding:0 33px;
	width:247px;
}
.products #sidebar , .collection #sidebar{text-align:center;}

#text {
	float:left;
	padding:24px 46px 29px;
	width:507px;
}
	.subnav #text {
		padding-top:58px;
	}
	.products #text, .collection #text {
		padding-top:24px;
	}


#footer {
	border-bottom:solid 1px #333;
	height:29px;
	line-height:27px;
	width:100%;
}

#footer .crumbs {
	float:left;
	letter-spacing:0.12em;
	margin:0 0 0 17px;
}
	#footer .crumbs li, #footer .footerLinks li {
		color:#999;
		float:left;
		list-style:none;
		margin-right:3px;
	}
	#footer .footerLinks li {
		margin:0 0 0 20px;
	}
		#footer .crumbs li a, #footer .footerLinks li a {
			color:#999;
			text-decoration:none;
		}
#footer .footerLinks {
	float:right;
	letter-spacing:0.12em;
	margin:0 15px 0 0;
}
	#footer .footerLinks a:hover {
		color:#fff;
	}

ul#navigation {
	height:30px;
	margin:0;
	padding-right:8px;
	position:absolute;
	right:0;
	top:-30px;
}
	ul#navigation li {
		float:left;
		list-style:none;
		margin-left:15px;
	}
		ul#navigation li a {
			color:#999;
			display:block;
			display:inline-block;
			height:30px;
			letter-spacing:0.12em;
			line-height:30px;
			outline:none;
			padding:0 7px;
			text-decoration:none;
		}
			ul#navigation li.active a, ul#navigation li a.hover {
				background-color:#333;
				color:#fff;
			}
		ul#navigation li ul {display:none;}
		ul#navigation li.active ul {
			border-bottom:1px solid #333;
			display:block;
			height:30px;
			margin:0;
			padding:0 5px 0 26px;
			position:absolute;
			right:0;
			top:31px;
			width:568px;
		}
			ul#navigation li.active ul li {
				margin-left:13px;
			}
			ul#navigation li.active ul li a {
				background:none; 
				color:#999;
			}
				ul#navigation li.active ul li.active a, ul#navigation li.active ul li a.hover {
					background-color:#333;
					color:#fff;
				}
			.products ul#navigation li ul, .collection ul#navigation li ul{display:none;}
div#sub-navigation{
	float:left;
	width:150px;			/* De breedte + padding + border + margin moet even breed zijn als de margins van de contents */
	margin-left:-700px; 	/* Zo breed als de container */
}

/* 360ª Photo styles */
.rotate360 #sidebar{
	display: none;
}
.rotate360 #contents{
	height: 420px;
}
.rotate360 #rotate360{
	width: 913px;
	height: 330px;
	padding-top: 90px;
	background-color: #FFF;
	position: absolute;
	z-index: 50;
	text-align: center;
}
.rotate360 #rotate360 div, .rotate360 #rotate360 img{
	margin: 0 auto;
}
.rotate360 .back{
	top: 38px;
	left: 117px;
	display: block;
	height: 31px;
	width: 91px;
	position: absolute;
	z-index: 75;
	text-indent: -5555px;
	background: #FFF url(/images/lepuij/buttons/back.png) top left no-repeat;
	cursor: pointer;
}
.rotate360 .back:hover{background-position: 0 -41px;}
.rotate360 .back:active{background-position: 0 -82px;}

.clearfix:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
	}
* html .clearfix             { zoom: 1; } /* IE6 */
*:first-child+html .clearfix { zoom: 1; } /* IE7 */

.dummy {position:relative;} /* IE6 fix - absolute positioned item may disappear next to a floated element. */