/**
 * Description for file
 *
 * CSS version $version
 *
 * @author      PROMACX AG
 * @copyright   PROMACX AG / Wasserwerkgasse 20 / 3011 CH-Bern
 * @link        www.promacx.ch
 * @version     0.0.1
 * @media       screen
 */

/* ------------------------------ Layout
*/


@import url("editor.css");


@import url("collections.css");

img, div { behavior: url(/fileadmin/templates/roamer/css/iepngfix.htc) }


* {
	padding: 0;
	margin: 0;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
}

body {
	background: #292827 url(../images/layout/background.jpg) center top repeat-y;
	text-align: center;
}

html[xmlns^="http"] { /* verhindert Mozilla-Zucken * > Firefox 1.5  */
	overflow-y: scroll;
}

#webcontainer {
	margin: 0 auto;
	width: 1000px;
	/*overflow:hidden;*/
	height:750px;
	/*padding: 0 20px;*/
	text-align: left;
}

/* ---------------------------------------------------
   Header
   =================================================== */
#header { 
	height: 84px;
	padding: 41px 0 0 416px;
	background:  url(../images/layout/header_bg.jpg) bottom left no-repeat;
}
#header img { 
	border: none;
}

.accessibility {
	display: inline;
	left: -1000px;
	overflow: hidden;
	width: 0px;
	position: absolute;
	top: -1000px;
	height: 0px
}



/* ---------------------------------------------------
   Content
   =================================================== */
#main {
	height: 474px;
	overflow:hidden;
}

#contentbild {
	height: 474px; 
	width: 1000px;
	background: #363534 url(../images/layout/bg_opt.jpg) top left repeat;
}
#products {

	height: 474px; 
	width: 1000px;
	position: relative;
	margin-top: -474px;
	z-index: 50px;
}

#content_gross {
	height: 454px; 
	width: 960px;
	position: relative;
	margin-top: -474px;
	z-index: 50px;
	overflow: auto;
	padding: 20px 20px 0 20px;
}
#columns table.contenttable, #columns table.contentbreittable {
	padding-left:10px;
}
#columns table.contenttable td{
	width: 450px;
	padding:0px 5px;
}
#columns table.contentbreittable td{
	width: 100%;
	padding: 0px 5px;
}
#columns table.adress td{
	width: 180px;
	padding: 0px 5px;
}


p.bodytext{ padding:0px; margin:0px;}


#content {
	background: url(../images/layout/content_bg.png);
	height: 141px;
	width: 985px;
	margin-top: -150px;
	margin-left: 8px;
	position: absolute;
	z-index: 100;
	padding: 5px 0 4px 0;
}
* html #content {
	/*filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/layout/content_bg.png', sizingMethod='crop');
	background:none;*/
	background: #090909;
	filter: alpha(opacity=80);
  	opacity:0.8;
	border-left: 1px solid #333231;
	border-right: 1px solid #333231;
	border-top: 1px solid #333231;
	height: 140px;
	width: 985px;
	margin-top: -151px;
	margin-left: 8px;
	position: absolute;
	z-index: 100;
	padding: 5px 0 4px 0;
}
*+html #content {
	background: url(../images/layout/content_bg.png) no-repeat;
	height: 140px;
	width: 985px;
	margin-top: -150px;
	margin-left: 8px;
	position: absolute;
	z-index: 100;
	padding: 5px 0 4px 0;
}

/* ---------------------------------------------------
   Content gross mit Subnavi
   =================================================== */
#content_grossmitnavi {
	height: 284px; 
	width: 960px;
	position: relative;
	margin-top: -474px;
	z-index: 50px;
	overflow: auto;
	padding: 40px 20px 0 20px;
}

#content2 {
	float: left;
	background: url(../images/layout/content_bg.png);
	height: 141px;
	width: 985px;
	margin-top: 0px;
	margin-left: 8px;
	position: relative;
	padding: 5px 0 4px 0;
}


/* Subnavi Stufe 1 */
#subnavi {
	float: left;
	width: 175px;
	height: 141px;
	border-right: 1px solid #3a3a3a;
	padding-left: 25px;
	overflow: auto;
}
#subnavi h2 {
	font-size: 13px;
	color: #a1a1a1;
	text-transform: uppercase;
	font-weight: bold;
	padding-bottom: 5px;
}
#subnavi ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
#subnavi ul li {	
	margin-bottom:2px;
	margin-left: 0;
} 
#subnavi li a, #subnavi li a:visited {
	display: block;
	text-decoration: none;
	font-size: 12px;
	color: #a1a1a1;
	background: url(../images/layout/subnavi_inaktiv.png) left top no-repeat;
	padding-left: 15px;
}
#subnavi li a:hover, #subnavi li a:active, #subnavi li a.aktiv {
 	color: #e2a17d;
	background: url(../images/layout/subnavi_aktiv.png) left top no-repeat;
}
/* IE 6 */
* html #subnavi li a, * html #subnavi li a:visited {
	background: url(../images/layout/subnavi_inaktiv.gif) left top no-repeat;
}
* html #subnavi li a:hover, * html #subnavi li a:active, * html #subnavi li a.aktiv {
	background: url(../images/layout/subnavi_aktiv.gif) left top no-repeat;
}



/* Stufe 2 + 3 */
#subnavi ul ul.stufe2,
#subnavi ul ul ul.stufe3
{
	display: none;
}

#subnavi ul li.anzeigen ul.stufe2,
#subnavi ul ul li.anzeigen ul.stufe3
{
	display: block;
	margin-left: 10px;
} 

/* Stufe 2 */
#subnavi ul ul li {	
	margin-bottom:2px;
	margin-left: 0;
} 
#subnavi ul ul li a, #subnavi ul ul li a:visited {
	text-decoration: none;
	font-size: 12px;
	color: #a1a1a1;
	background: url(../images/layout/subnavi_inaktiv.png) left top no-repeat;
	padding-left: 15px;
}
#subnavi ul ul li a:hover, #subnavi ul ul li a:active, #subnavi ul ul li a.aktiv {
 	color: #e2a17d;
	background: url(../images/layout/subnavi_aktiv.png) left top no-repeat;
}
/* IE 6 */
* html #subnavi ul ul li a, * html #subnavi ul ul li a:visited {
	background: url(../images/layout/subnavi_inaktiv.gif) left top no-repeat;
}
* html #subnavi ul ul li a:hover, * html #subnavi ul ul li a:active,* html  #subnavi ul ul li a.aktiv {
	background: url(../images/layout/subnavi_aktiv.gif) left top no-repeat;
}


/* Stufe 3 */
#subnavi ul ul ul li {	
	margin-bottom:2px;
	margin-left: 0;
	display: block;
} 
#subnavi ul ul  li a, #subnavi ul ul ul li a:visited {
	text-decoration: none;
	font-size: 12px;
	color: #a1a1a1;
	background: url(../images/layout/subnavi_inaktiv.png) left top no-repeat;
	padding-left: 15px;
}
#subnavi ul ul ul li a:hover, #subnavi ul ul ul li a:active, #subnavi ul ul ul li a.aktiv {
 	color: #e2a17d;
	background: url(../images/layout/subnavi_aktiv.png) left top no-repeat;
}
/* IE 6 */
* html #subnavi ul ul  li a,* html  #subnavi ul ul ul li a:visited {
	background: url(../images/layout/subnavi_inaktiv.gif) left top no-repeat;
}
* html #subnavi ul ul ul li a:hover, * html #subnavi ul ul ul li a:active, * html #subnavi ul ul ul li a.aktiv {
	background: url(../images/layout/subnavi_aktiv.gif) left top no-repeat;
}






/* COLUMNS */
#columns {
	float: left;
	height: 141px;
	width: 775px;
	color: #a1a1a1;
	overflow: auto;
}

/*#spalte1 {
	float: left;
	width: 230px;
	height: 141px;
	padding: 0 28px;
	color: #a1a1a1;
	overflow: auto;
}
#spalte2 {
	float: left;
	width: 230px;
	height: 141px;
	padding: 0 28px;
	color: #a1a1a1;
	overflow: auto;
}
#spalte_breit {
	float: left;
	width: 516px;
	height: 141px;
	padding: 0 28px;
	color: #a1a1a1;
	overflow: auto;
}
#spalte3 {
	float: left;
	width: 150px;
	height: 127px;
	color: white;
	border-left: 1px solid #3a3a3a;
	margin-left: 10px;
	padding: 0 25px;
	overflow: auto;
}
* html #bild {
	float: left;
	width: 150px;
	height: 127px;
	color: white;
	border-left: 1px solid #3a3a3a;
	margin-left: 5px;
	padding: 10px 25px 0 25px;
}*/

/* ---------------------------------------------------
   Hauptnavigation
   =================================================== */

#mainnavi {
	height: 19px;
	width: 944px;
	background: url(../images/layout/mainnavi_bg.jpg) top left repeat-x;
	padding-left: 57px;
}

#mainnavi ul {
	list-style: none;
}
#mainnavi li {
	float: left;
	
} 
#mainnavi ul li a {
	text-decoration: none;
	font-size: 14px;
	color: #000;
}
#mainnavi ul li a:hover, #mainnavi ul li a:active, #mainnavi ul li a.aktiv {
 	color: #FFF;
}


/* ---------------------------------------------------
   Footer
   =================================================== */
#footer {
	height: 173px;
	background:  url(../images/layout/footer_bg.jpg) top left no-repeat;
}

#footer img {
	float: right;
	padding-top: 64px;
}


/* ---------------------------------------------------
   Nebennavigation (Discalimer)
   =================================================== */

#nebennavi {
	float: left;
	height: 19px;
	width: 200px;
	padding: 140px 0 0 0px;
}
#nebennavi ul {
	list-style: none;
}
#nebennavi li {
	float: left;
} 
#nebennavi ul li a {
	text-decoration: none;
	font-size: 12px;
	color: #FFF;
	font-weight: normal;
}
#nebennavi ul li a:hover, #mainnavi ul li a:active, #mainnavi ul li a.aktiv {
 	color: #FFF;
	text-decoration: underline;
}

/*////SCROLLING*/

#jsmain {
	width: 760px;
	height: 125px;
	/*border: 1px solid #111;
	background: #ff3300;*/
}

#jscontent{
	width: 760px;
	height: 125px;
	float: left;
	/*overflow: hidden;
	color: #fff;*/
}
#subnavi {
	width: 160px;
	height: 141px;
	/*border: 1px solid #111;
	background: #ff3300;*/
}

#subnaviscroller {
	width: 160px;
	height: 141px;
	float: left;
	/*overflow: hidden;
	color: #fff;*/
}

.text {
	/*margin: 10px;*/
}

.vScrollbar {
	float: left;			
}

.hScrollbar {
	clear: both;	
	}

.vTrack {
	height: 300px;
	width: 15px;
	position: relative;
	background: #ddd;
	overflow: hidden;			
}

.hTrack {
	float: left;
	height: 15px;
	width: 255px;
	position: relative;
	background: #ddd;
	overflow: hidden;			
}			

.vThumb, .hThumb {
	position: absolute;
	top: 0;
	left: 0;
	height: 15px;
	width: 15px;
	background: #292827;
	overflow: hidden;
}

.arrowUp, .arrowDown, .arrowLeft, .arrowRight, .corner {
	height: 15px;
	width: 15px;
	background: #777;
	overflow: hidden;						
}

.arrowUp{ background-image:url(../images/arrow_up.gif);}
.arrowDown{ background-image:url(../images/arrow_down.gif);}
.arrowLeft{ background-image:url(../images/arrow_left.gif);}
.arrowRight{ background-image:url(../images/arrow_right.gif);}

.arrowLeft, .arrowRight, .corner {
	float: left;
	}
	
.corner {
	background: #000;
	}			
	#columns{ position:relative;}