/*************************************************************
  
  author:         Miel Vandevelde (I-Folks)
  company:        PANACHE.be
  version:        1.0
  created on:     01.04.2008
  
  CONTENT
  -------
  01. PAGE STRUCTURE
  02. HEADER
  03. NAVIGATION
  04. CONTENT
	
  typography specs use code behind parent ID or class: /*!T!*/
  
/************************************************************/



/*============================================================
  01. PAGE STRUCTURE
============================================================*/

body /*!T!*/ { 
background: #fff; 
font-family: Arial, Helvetica, sans-serif;
	scrollbar-arrow-color: #00000;
	scrollbar-darkshadow-color:#fff;
	scrollbar-track-color:#E5EBF1;
	scrollbar-face-color:#fff;
	scrollbar-highlight-color:#fff;
	scrollbar-3dlight-color:#E5EBF1;
	scrollbar-shadow-color:#fff; 
}

#wrapper { height: 457px; margin: 73px auto 0; width: 990px }



/*============================================================
  02. HEADER
============================================================*/

#header { float: left; height: 457px; width: 226px; position:relative; }

#header h1   { margin: 395px 0 0 5px }
#header h1 a { background: url(../img/logo.gif); display: block; height: 40px; text-indent: -9999em; width: 209px }

#header ul /*!T!*/ { color: #808080; font-size: 0.75em; margin: 187px 0 0 63px; position: absolute; bottom:65px; left:0px;  text-align: right; width: 150px }
#header ul li { height: 20px }
#header ul li a /*!T!*/        { background: url(../img/bg-list.gif) right center no-repeat; color: #808080; padding: 0 4px 0 0; text-decoration: none }
#header ul li a:hover /*!T!*/  { font-weight: bold }
#header ul li a:active,
#header ul li a.selected,
body#afvalbakken_in #header ul li a.afv_in,
body#afvalbakken_out #header ul li a.afv_out,
body#asbakken_in #header ul li a.as_in,
body#asbakken_out #header ul li a.as_out,
body#banken_in #header ul li a.bank_in,
body#banken_out #header ul li a.bank_out,
body#bloembakken_in #header ul li a.bloem_in,
body#trottoirpalen #header ul li a.trot_out,
body#verlichting_in #header ul li a.licht_in,
body#verlichting_out #header ul li a.licht_out{
	font-weight: bold
}

/* ROLLOVERS */
#menu-sellex, #menu-miramondo, #menu-outsider, #menu-proiek  {
	visibility: hidden;
	background-color: #FFFFFF;
	padding-top:200px;
}




/*============================================================
  03. NAVIGATION
============================================================*/

#navigation /*!T!*/ { background: #000; color: #fff; float: right; font-size: 0.69em; height: 32px; letter-spacing: 0.18em; line-height: 2.91em; padding: 0 15px; text-transform: uppercase; width: 734px }

#navigation a /*!T!*/       { color: #fff; text-decoration: none }
#navigation a:hover /*!T!*/ { color: #f79408 }

#navigation p.left /*!T!*/  { float: left }
#navigation p.right /*!T!*/ { float: right }



/*============================================================
  04. CONTENT
============================================================*/

#content { float: right; height: 425px; width: 764px }

/* ID's used when CONTENT is seperated into 2 parts */
#content #photo2     { height: 425px; position: absolute; width: 764px; z-index: 1 }
#content #photo2 img { height: 425px; width: 764px }

#content #text2 /*!T!*/ { background: url(../img/bg-text.png); color: #fff; font-size: 0.75em; height: 385px; letter-spacing: 0.08em; line-height: 1.67em; margin: 0 0 0 484px; overflow: hidden; padding: 20px; position: absolute; width: 240px; z-index: 2 }
#content #text2 img.uit_knop{
	cursor:pointer;
}


#content #scrollbar {
	margin: 380px 0 0 745px;
	position: absolute;
	width: 13px;
	z-index: 8;
	cursor:pointer;
}
#content #imgContShow { height: 385px; margin: 0 0 0 484px; padding: 20px; position: absolute; width: 240px; z-index: 2;cursor:pointer }

#content #text2 a /*!T!*/       { color: #fff }
#content #text2 a:hover /*!T!*/ { text-decoration: none }

#content #text2 p { margin: 10px 0 }
#content #text2 p.link { margin: 30px 0 0 }
#content #text2 p.contact { margin: 10px 0 }
#content #text2 p.technische { margin: 45px 0 0 }

#content #text2 table td /*!T!*/ { font-size: 0.92em; line-height: 1.42em; padding: 0 0 3px 3px; vertical-align: top }
#content #text2 table td.space /*!T!*/ { padding: 0 0 3px 10px }

#content #text2 .orange /*!T!*/ { color: #f79408 }
#content #text2 .red /*!T!*/ { color: #e53a33 }
/* end of 2 parts */

/* ID's used when CONTENT is seperated into 4 parts */
#content #product /*!T!*/ { background: #000; color: #fff; float: left; font-size: 0.69em; height: 147px; line-height: 1.82em; overflow: auto; padding: 15px; width: 454px }

#content #product a /*!T!*/       { color: #fff }
#content #product a:hover /*!T!*/ { text-decoration: none }

#content #product h1 /*!T!*/ { color: #f79408; font-weight: normal; font-size: 1.27em }

#content #product p { margin: 10px 0 }

#content #product .orange /*!T!*/ { color: #f79408 }

#content #product table { height: 147px; padding: 0; width: 454px }
#content #product table td { vertical-align: top }
#content #product table td.productinfo { padding: 37px 0 0 }

#content #imageSlideshowHolder     { float: right; height: 177px; width: 280px; position:relative; }
#content #imageSlideshowHolder img { position:absolute; height: 177px; width: 280px; left:0px; 	top:0px}

#content #text4 /*!T!*/ { color: #000; float: left; font-size: 0.75em; height: 208px; letter-spacing: 0.08em; line-height: 1.67em; overflow: auto; padding: 20px 30px; width: 424px }

#content #text4 a /*!T!*/ { color: #f79408 }
#content #text4 a:hover /*!T!*/ { text-decoration: none }

#content #text4 p /*!T!*/ { margin: 10px 0 }

#content #text4 table.form /*!T!*/ { font-size: 0.92em; height: 194px; letter-spacing: 0; line-height: 1.45em; padding: 0; width: 414px }
#content #text4 table.form td { padding: 1px }
#content #text4 table.form td.subject /*!T!*/ { text-align: right; width: 92px }
#content #text4 table.form td.type { width: 122px }
#content #text4 table.form input /*!T!*/ { border: 1px solid #000; font: 1em/1.45em Arial, Helvetica, sans-serif; height: 18px; padding: 0 2px; width: 109px }
#content #text4 table.form textarea /*!T!*/ { border: 1px solid #000; font: 1em/1.64em Arial, Helvetica, sans-serif; height: 40px; overflow: auto; padding: 0 2px; width: 250px }
#content #text4 table.form :focus { border: 1px solid #777 }

#content #text4 .orange /*!T!*/ { color: #f79408 }

#content #info /*!T!*/ 
{
	position:relative; 
	/*background: url(../img/bg-text.png); */
	background-color: #333; 
	color: #fff; 
	float: right; 
	font-size: 0.75em; 
	height: 208px; 
	letter-spacing: 0.08em; 
	line-height: 1.67em; 
	overflow: auto; 
	padding: 20px; 
	width: 240px;
}

#content #info div {
	position:absolute;
	height: 218px;
	width: 255px;
	left:0px;
	top:0px;
	padding-top: 20px;
	padding-right: 10px;
	padding-bottom: 10px;
	padding-left: 15px;
	overflow: hidden;
}

#content #info a /*!T!*/       { color: #f79408 }
#content #info a:hover /*!T!*/ { text-decoration: none }

#content #info p { margin: 10px 0 }

#content #info .orange /*!T!*/ { color: #f79408 }
#content #info .red /*!T!*/ { color: #e53a33 }
/* end of 4 parts */