@import url("basic_extended.css");
@charset "utf-8";

/* CSS Document */

*{margin:0;padding:0}
html{font-size:100%}
body{font-family:Arial, Helvetica, sans-serif;font-size:68.75%;background-color:#a0aab5;color:#FFF;height:100%}

#divresult{position:absolute;top:0;left:0;z-index:2500;width:100%;height:100%;opacity:0;filter:alpha(opacity=0)}
#divresult #butclose{position:absolute;
	left:30%;
	top:46%;
z-index:2650;
}
#result{
	position:absolute;
	left:30%;
	top:50%;
    border: 1px solid #000;
	background-color:#fff;
	padding:20px;
	z-index:2620;
}

h1{} /*Überschrift*/
h2{} /*Überschrift 2. Ordnung bei Presse*/
h3{} /*Überschrift prodlist*/
h4{width:95%;font-size:100%;margin-top:20px;background-color:#304152;color:#fff;padding:5px} /*Überschrift mit blauem Hintergrund negativ*/




/*Generelle Elemente*/
h1{width:100%;font-size:100%;margin-top:20px}
dl{float:left;margin-right:10px;margin-top:20px;width:142px}
dl.w295{float:left;margin-right:10px;margin-top:20px;width:295px}
dd{margin-top:10px;padding-right:10px}
img{border:0}
a{text-decoration:none;color:#000}
a:hover{text-decoration:underline}
a.uline{text-decoration:underline}
dd p{width:100%;margin-bottom:10px;line-height:150%;}
dd p a{text-decoration:underline}
dd p a.notd{text-decoration:none}
dd p a.notd:hover{text-decoration:underline}
dt.headline{min-height:28px}
a.download{
	background-image: url(../basic/down-135.png);
	background-repeat: no-repeat;
	background-position: left;
	display:block;
	width:140px;
	height:16px;
	padding-left:24px;
	padding-top:2px;
	color:#000;
	font-size:90%;
}

#rightcol a.download{background-image: url(../basic/downbut-blue.jpg);text-decoration:none}

/*Formatierung*/
.mb10{margin-bottom:10px}

/*Hauptcontainer*/
div#main{width:960px;margin-left:auto;margin-right:auto;height:100%}
div#head{width:100%;height:100px;background-color:#304152;position:relative;z-index:1900}
div#menue{
	width:100%;
	height:auto;
	background-color:#0e2230;
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #FFF;
	position:relative;
	z-index:1000;
}
div#content, div#contentprod{
	width:100%;
	background-color:#fff;
	color:#000;
	height:100%;
	background-image: url(../basic/bg-content.gif);
	background-repeat: repeat-y;
	padding-bottom:50px;
}
div#content div#rightcol, div#contentprod div#rightcol{width:320px;min-height:600px;height:100%;background-color:#304152;float:left}
div#content div#leftcol, div#contentprod div#leftcol{width:620px;min-height:600px;height:100%;margin-left:20px;background-color:#fff;float:left}
div#content div#rightcol {position:relative}

div#content li, div#contentprod li{
	list-style-image: url(../basic/li-item.png);
} 

div#content div#leftcol div.cols{width:295px;padding-right:10px;float:left;margin-top:10px}
div#content div#leftcol p{margin-bottom:10px;line-height:150%}

/* Erweiterung #leftcol durch class .contvideo*/
.contvideo{margin-left:73px !important;width:495px !important;margin-right:72px !important} 

/*content linker Container */
div#content div#leftcol img{margin-top:20px;margin-right:10px}
.twotextcols{margin-top:20px}
.twotextcols div{width:295px;float:left;padding-right:10px}
.twotextcols p{width:100%;margin-bottom:10px;line-height:150%}
.twotextcols ul{margin-left:15px;margin-bottom:10px;line-height:150%}
.twotextcols p a{text-decoration:underline}

/*Neuheiten Slideshow mit Thumbs*/
#picthumblist{height:280px;margin-top:20px}
#picthumblist .slideshow-images img{margin:0 !important}
#picthumblist .slideshow-thumbnails img{margin:0 !important}
#picthumblist .slideshow-thumbnails li{list-style-image: none !important}
#picthumblist .slideshow-captions {width:600px !important}


/*Produktübersicht*/
#prodtitleright{width:300px;background-color:#031020;height:25px;padding-left:20px;padding-top:7px;position:absolute;margin:0 !important}
div.fix{width:100%;height:1px;float:left}


/*Produkt */
div#contentprod div#leftcol img{margin-right:3px !important;margin-bottom:3px}

.mat{float:left !important;width:auto !important;min-width:85px;height:19px;padding-top:3px;padding-left:3px;padding-right:3px;font-size:10px;background-color:#F00;margin-right:2px;text-align:center;color:white}
.maticon{float:left !important;width:auto !important;min-width:0px !important;height:19px;padding-top:0px;padding-left:0px;padding-right:0px;font-size:10px;background-color:white;margin-left:10px;text-align:center;color:black}
.maticon:first-child{margin-left:0px}
.maticon img{height:30px}
.maticon a{text-decoration:none !important}
.mat a{text-decoration:none !important;color:#FFF}
h1 span{font-weight:normal}

/* Produkt okl, ogl, sgl icons*/
div#beschlagtechnik{margin-top:20px;margin-bottom:15px}
div#beschlagtechnik img{margin-left:6px;height:24px}
div#beschlagtechnik img:first-child{margin-left:0px}

div#surface{margin-bottom:35px}

div#schilder{margin-top:5px}
#schilder img{float:left;margin-left:10px}
#schilder img:first-child{margin-left:20px}

/*Produkt Detail rechte Spalte*/
div#rightcol dl{width:280px;color:#fff;margin:0;margin-left:20px;margin-top:5px}
div#rightcol dl:first-child{margin-top:20px}
div#rightcol dt, div#rightcol dd {float:left;margin:0;padding:0;margin-bottom:3px} 
div#rightcol dt{width:220px}
div#rightcol dd img{float:right}
div#rightcol hr{width:278px;float:left;margin-left:20px;margin-top:10px;border:none;border-top: 1px solid #fff;
color: #304152;
background-color: #304152;
height: 1px;
clear:left;
padding:0;
}
div#rightcol p{margin-left:20px;margin-top:10px;color:#fff;float:left}
div#rightcol a{color:#fff;text-decoration:underline}


/*Tabellen*/

table{width:100%}
th{text-align:left;background-color:#304152;color:#fff;padding:5px}
td{text-align:left;background-color:#d0d6de;color:#000;padding:5px}


/*Head*/
#head ul{
	list-style-type: none;
	position:absolute;
	z-index:2;
	top:20px;
	left:20px;
}
#head ul li{float:left;margin-left:20px;}
#head ul li#sprachwahl{position:relative;z-index:2000;}

#head ul li:first-child{margin-left:0px}
#head ul li a{color:white}
#claim{position:absolute;top:75px;left:15px;z-index:1}
#logo{position:absolute;bottom:0px;right:20px;}

#head ul li#sprachwahl ol{
	list-style-type: none;
	position:absolute;
	z-index:2200;
	left:8px;
	top:20px;
	background-color:#6e7a86;
	padding:5px;
	padding-top:2px;
	padding-bottom:2px;
	border: 1px solid #FFF;
	visibility:hidden;
}
#head ul li#sprachwahl ol li{
	clear:left;
	margin-left:0px !important;
	padding:2px !important;
	padding-left:5px !important;
	padding-right:5px !important;
	min-width:50px;
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #FFF;
}

#head ul li#sprachwahl ol li:first-child{border:none}

#head ul li#sprachwahl ol li a{text-decoration:none}
#head ul li#sprachwahl ol li a:hover{color:#304152}
/*Menue*/

#menue ol{
	list-style-type: none;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #FFF;	
	min-height:27px;
}
#menue ol li{
	float:left;
	border-left-width: 1px;
	border-left-style: solid;
	border-left-color: #FFF;
}
#menue ol li:first-child{border-left:none;}
#menue ol li a{font-size:100%;font-weight:bold;width:144px;height:21px;padding-top:6px;padding-left:15px;color:white;display:block;text-decoration:none}
#menue ol li a.sel{background-color:#6e7a86}
#menue ol li:first-child a{padding-left:20px;width:139px;}
#menue ol li a:hover{background-color:#6e7a86}
#menue div{background-color:#cdd1d8;width:100%;height:24px;border-bottom:black 1px solid;float:left}
#menue div p{margin-left:20px;margin-top:5px;color:#000;font-weight:bold}
#menue div#breadcrumb{overflow:hidden}

ol.submenue{opacity:0;filter:alpha(opacity=0);visibility:hidden}
ol.submenue{position:absolute;left:319px;top:27px;background-color:#6e7a86}
ol.submenue li{
	clear:left;
	border-top: none;
	border-left-style: none;
	padding:0;
	width:159px;
	
}

ol.submenue li:first-child{border-left-width: 1px !important;
	border-left-style: solid !important;
	border-left-color: #FFF !important;}
	

ol.submenue li a{width:129px !important;border-top:#fff 1px solid;margin-left:15px;padding-left:0px !important;font-weight:normal !important;height:auto !important; min-height:16px;padding-bottom:5px}
ol.submenue li:first-child a{padding-left:0px !important;border-top:none}
ol.submenue li a:hover{color:#304152 !important}


ol.submenue ul{
	margin-left:15px;
	height:auto;
	width:auto;
	border:none;
	list-style-type: none;
}
ol.submenue ul li{padding-left:10px;
	padding-right:0px;
	padding-left:0px;
	border-top: none;
	border-left: none !important;

}

ol.submenue ul li:first-child{border-left:none !important}

ol.submenue ul li:first-child a{padding-left:0px;width:200px;border-top:#fff 1px solid;padding-bottom:3px}

ol.submenue ul li a, ol.submenue ul li:first-child a{height:auto !important;min-height:16px;padding-left:0px;width:114px !important;padding-bottom:5px;border-top:#fff 1px solid !important;}

hr.trenner{
	clear:left;
	border-top-style: none;
	border:none;border-top: 1px solid #fff;
	color: #fff;
	background-color: #fff;
	height: 1px;
}

hr.prodblue{
	border-top-width: 3px;
	border-top-style: solid;
	border-top-color: #304152;	
	margin-right:20px;
}

#contentprod hr.prodblue{margin-top:20px}

hr.linie{
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #304152;	
	margin-right:20px;
}

/*Video*/
.flashvideo{margin-top:20px}

/*Objekte*/

dl{float:left;margin-right:10px;margin-top:20px;width:142px}

ul.objekte{
	margin-left:0px;
	margin-top:10px;
	float:left;
	width:142px;
	margin-right:10px
}

ul.objekte li{
	list-style-type:none;
	list-style-image: none !important;
	margin-top:10px;
	font-weight: bold;
}

ul.objekte ul{
	margin-left:17px;
}

ul.objekte ul li{
list-style-image: url(../basic/li-item.png) !important;	
margin-top:0px;
font-weight: normal;
}

/*Squeezebox*/
#sbox-content {
	color:#000;
}

#sbox-content h1{margin-top:0;margin-bottom:10px}


/*Sitemap2*/

div#sitemap ul{margin-left:18px}


/*Suchen*/

select#sel01, select#sel02, select#sel03,select#sel04 {
	width:150px;
	margin-top:10px;
	font-size:10px;
	overflow: hidden;
	padding:3px;
	border: 1px solid #000;
	
} 
fieldset{margin-top:20px;float:left;width:150px;border:none;margin-right:5px}
fieldset legend{font-size:10px}
select#sel02, fieldset#fs02 {width:250px}
select#sel03, fieldset#fs03 {width:100px}
select#sel04, fieldset#fs04 {width:100px}
div#prodlist{margin-top:20px;float:left;clear:left}
div#prodlist h3{
	font-size:11px;
	width:200px;
	margin-bottom:7px;
	background-image: url(../basic/li-item_mt.png);
	background-repeat: no-repeat;
	background-position: left top;
	padding-left:12px;
}



/*Presse*/

div.teaser .teaserimg, div.teaser .teasertxt{float:left}
div.teaser .teaserimg{width:200px}
div.teaser .teaserimg a{cursor:pointer}
div.teaser .teasertxt{margin-left:20px;width:380px}
.teasertxt h1{font-size:120%;margin-bottom:5px}
.teasertxt h2{font-size:100%;margin-bottom:5px}
#rightcol dl.pressdownload{margin-top:20px}
#rightcol dl.pressdownload:first-child{margin-top:60px}



/*Produkte Teaser Startseite*/

.products_teaser{width:142px;float:left;margin-left:10px;position:relative}
.products_teaser img{cursor:pointer}
.products_teaser:first-child{margin-left:0px}
.products_teaser h2{font-size:12px;color:#666;margin-top:10px;position:absolute;z-index:3;background-color:#fff;padding-bottom:5px;padding-right:10px;cursor:pointer}
.products_teaser h2{top:163px}
.products_teaser p{margin-top:10px}
.products_teaser div{
	position:absolute;
	left:0px;
	top:178px;
	width:350px;
	padding:10px;
	border: 1px solid #000;
	background-color:#FFF;
	z-index:2;
	-webkit-border-radius: 10px; /*fuer Mozilla-Browser*/
  	-moz-border-radius: 10px;/*fuer Safari und Chrome*/
	border-radius: 10px; /* die eigentliche Anweisung*/
	 -moz-box-shadow: 2px 2px 10px rgba(0,0,0,0.5);
 -webkit-box-shadow: 2px 2px 10px rgba(0,0,0,0.5);
 box-shadow: 2px 2px 10px rgba(0,0,0,0.3);
 display:none;
}

.products_teaser div img{position:absolute;right:-20px;top:-30px}
.products_teaser div.alignleft img{position:absolute;left:-15px;top:-30px}

.products_teaser div.alignleft{
	left:-230px;
	/*display:block;*/
}

.products_teaser h2.alignleftsel{right:0px;white-space:nowrap;padding-right:0px;padding-left:10px}

/* 
REDAXO-Modul: do form!
Beschreibung: CSS-DEMO
Bereich: CSS 
: do form! 2.x  
Stand: 20.04.2009 
Version: 1.0
--------------------------------------------------------------------------
HINWEISE:
--------------------------------------------------------------------------
!! Das CSS beruecksichtigt nicht alle moeglichen Felder 
!! Farben nicht 1 zu 1 übernehmen
!! ist ja nicht wirklich huebsch

Weitere Infos zu den CSS hier:
http://wiki.redaxo.de/index.php?n=R4.DoForm
-------------------------------------------------------
*/

/* Formular Definition */
/*//////////////////////////////////////////////////////////////////////////////*

/* Div das das Formular umschliesst */
.formgen {
	font-size: 1em;
	padding-right: 10px;
	width:800px;
	margin-top:20px;
	float:left;
	position:relative;
}




/* Was passiert wenn auf das Label geklickt wird? */
label,
select,
input[type=checkbox],
input[type=radio],
input[type=button],
input[type=submit]
{
cursor : pointer;

}



.formgen form
{
line-height : 120%;

}




/* 
Wie sehen die einzelnen Bloecke aus? 
Jedes Feld wird von einem DIV umschlossen, das hier definiert werden kann
*/


.formgen .formblock
{
	margin-bottom: 15px;
	margin-top: 10px;
	padding-top: 3px;
	padding-bottom: 3px;
	padding-right: 2px;
	padding-left: 5px;	
	
}
 .forminfo 
{
	width: 423px;
	margin-top:10px;
	margin-bottom: 15px;
	margin-left:20px;
	background-color: #FFF;
	padding-top: 3px;
	padding-bottom: 3px;
	padding-right: 2px;
	padding-left: 5px;
	border: 1px dashed #c52030;
	float:left;
	clear:left;
}


.formhinweis{font-weight:bold;}

/*
Verhalten von br-Tags
*/
.formgen br
{
clear : both;
}


/* 
--------- FORMULAR-OBJEKTE ------------ 
*/


/* Mehrzeiliges Eingabefeld */
.formgen .formtextfield
{
	/*width: 400px;
	height: 200px;
	margin-left: 4px;
	border: 1px solid #003366;
	background-color: #DFEEDD;*/
}


/* Textfeld */
.formgen .formtext
{
	width: 220px;
	height:18px;
	background-color: #FFF;
	border: 1px solid #0e2230;
	/*margin-left: 4px;
	padding-bottom: 4px;
	font-size: 1em;
	background-color: #E9EBF3;
	border: 1px solid #003366;*/
}

.formgen input:focus, .formgen input:hover,
.formgen select:focus, .formgen select:hover, 
.formgen textarea:focus, .formgen textarea:hover {
	/*border-bottom-color: #000000;*/
	background-color: #FFF;	
}



/* Label */
.formgen label {
	/*width: 120px;
	clear: left;
	float: left;
	height: 20px;
	font-weight: bold;
	color: #003399;*/
}


/* Aussehen der Select-Ausgabe */
.formgen .formselect
{
	width: 222px;
	background-color: #FFF;
	color: #000;
	border: 1px solid #000;
    font-size:11px;
	display:block;float:left;
	margin-bottom:10px;
	height:20px;
}


/* Sende-Button */
.formgen .formsubmit
{
	border: 1px solid #000;
	/*width: 100%;
	text-align: center;
	background-color: #006699;
	
	float: right;
	color: #FFFFFF;*/
}



/* Fieldsetbeschriftung */
.formgen legend {
	/*color: #FFFFFF;*/
	width: 300px;
	font-size:11px;
	margin-bottom:10px;
}
.formgen .fieldset {
	margin-bottom: 10px;
	width:380px !important;
}



.formgen label{display:block;float:left;width:80px;color:#000}
.formgen input{display:block;float:left;width:250px;background-color:#F4F4F4;margin-bottom:10px;height:22px;font-family: Arial, Geneva, sans-serif}
.formgen input[type=hidden]{display:none}
div.tanachricht{position:absolute;left:320px;top:0px}
.formgen textarea{display:block;float:left;width:280px;background-color:#FFF;border: 1px solid #000;margin-bottom:10px;height:200px;font-size:11px;font-family: Arial, Geneva, sans-serif}
div.tanachricht textarea{clear:left;margin-top:10px}
.formgen input.formsubmit{background-color:#304152;
	height: 22px;
	width:100px;
	color:#fff;
	margin-left:325px
	border: 1px solid #000;
	position:absolute;
	left:500px;top:270px;
	font-size:11px;
}

fieldset label{float:right !important;width:350px !important}
.formgen input[type=checkbox]{width:15px;background-color:#F4F4F4;margin-bottom:10px;height:15px;}



/* -------------- AUSGABEN / Fehlermeldungen --------*/


/* Markierung der Labels bei Fehler */
.formgen .formerror {
	
	border-bottom-width: 1px;
	color:#c52030;
}

.formgen .formcaptcha
{
	border: 2px solid #990000;
	vertical-align: top;
	float: left;
	margin-right: 10px;
}

.formgen .formreq {
	color: #c52030;
}

.formgen .formheadline {
	color: #993300;
	background-color: #FFF7EA;
	padding-top: 4px;
	padding-bottom: 4px;
	margin-top: 5px;
	margin-bottom: 5px;
	font-style: italic;
}

/*//////////////////////////////////////////////////////////////////////////////*
/* Ende der Formulardefinition */