/* =========================================================
bosse.de - Stylesheet für Trendoffice
Datei: design.css
Media: screen
Datum: 22. August 2008
Autor: Ulf Mayer
Mail: mayer@navigate.de
Web: http://navigate.de
========================================================== */

/* ===============================
   = General Definitions
=============================== */
*{
font-size: 1em; /* don't edit! */
}

html {
font-size: 62.51%; /* don't edit */
}

body {
	width: 100%;
	font-size: 1.25em; /* edit here to change font size globaly 1em = 10px */
	margin: 0;
	padding: 0;
	font-family: Verdana, Arial, sans-serif;
	background: #76858d;
}


div {font-size: 1em;}

address { font-style: normal; }
h1,h2,h3,h4,h5,h6,pre,code { font-size:1em; }
h4,h5 { font-weight:normal; }
ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset,input, dl, dt, dd { margin:0; padding:0; }
ul,ol { list-style:none }
:link,:visited { text-decoration:none }
dl {margin: 0 0 0 .8em;}
dl dt {margin: 0 0 .5em 0;}
dl dd+dt {margin-top: 1.5em;}
dl dd {margin: 0 0 1em 2em;}
ol {list-style: decimal;}
ol li {margin: 0 0 1em 2.5em;}
ol li ol {margin: 1em 0 1em 1em;}
ol li ul {margin: 1em 0 1em 1em;}
p {margin-bottom: 1em;}
ul {list-style: disc;}
ul li {margin: 0 0 1em 2em;}
ul li ul {margin: 1em 0 1em 1em; list-style: circle;}
ul li ol {margin: 1em 0 1em 1em;}

a img,:link img,:visited img { border:none }

.screenreader,
.hidden {
	display: none;
}
fieldset {
   border: none 0;
}
.clear {
	clear: both;
}

.screenreader {display: none;}

a {color: #482d67; text-decoration: none;font-weight: bold;}

/* ===============================
   = Container
=============================== */

.elementNavigation {position: relative;}
.editbuttonNavi {position: absolute; top: 0;}

#wBlockMain {background: #fff; width: 932px; margin: 32px auto; margin-bottom: 0; position: relative;}
#wBlockTop {height: 410px;}
	#elementKeyvisual {background: #bcbdbe; padding:0; line-height: 0; height: 320px;width:932px;margin: 0}
	#elementKeyvisual img#keyvisual {margin: 0; padding: 0; line-height: 90%; height: 320px;width:932px;}
	#elementKeyvisual .elementLinkProduct {position: absolute; top:370px;right:20px;z-index: 10;}
	#flashAsKeyvisual {position: absolute; top:90px;left:00px;z-index: 5;width:932px;height:320px;margin:0;padding:0;}

#wBlockLeft {width: 160px; float: left;padding: 0;margin: 0;}
	#wBlockLeftInner {padding: 0;margin: 0;}

#wBlockContent {background: #fff; width: 772px; float: left;}
	#wBlockContentInner {padding: 25px 60px 0 20px;}
#wBlockBottom {clear: both;}
	#wBlockBottomInner { background: #fff; border-top: 1px solid #58585a; width: 772px; margin: 15px 0 0 160px; padding: 0 0 50px 0; font-size: .9em;}
	.blockBottom { position: relative;}
	.toTop {position: absolute; top: 10px; right: 10px;}
	.back {position: absolute; top: 10px; right: 40px;}
	.mail {position: absolute; top: 10px; right: 70px;}
	.tell {position: absolute; top: 10px; right: 100px;}
	.print {position: absolute; top: 10px; right: 130px;}

#blockCurNavigation {display: none;}

#wBlockLeft .elementProductName {text-align: left !important; padding: 0; margin: 0 0 20px 0; font-size: .9em;  color: #8b8b8b;width:160px}
#wBlockLeft .elementProductName a {margin: 0 0 0 0; display: block;}
#wBlockLeft .elementProductName img {margin: 0 0 0 0; display: block;}

/* ===============================
   = Content Elements
=============================== */

#wBlockLeft div {text-align:left;}
#wBlockLeft img {margin: 0 0 15px 20px;}

/* ===============================
   = Content Elements
=============================== */

.fragmentPictureFloatLeft {float: left; margin: 3px 20px 10px 0;}
.fragmentPictureFloatRight {float: right; margin: 3px 0 10px 20px;}

#wBlockContent a {text-decoration: none;}

#wBlockContent {font-size: .9em; line-height:140%}
#wBlockContent .elementText,
#wBlockContent .elementLink,
#wBlockContent .documentLink,
#wBlockContent .elementHeadline {margin: 0 0 20px 0; clear:both;}

#wBlockContent .elementPictureWithTitleSize ,
#wBlockContent .elementPicture {margin: 0 20px 20px 0; float:left;padding:0;}
#wBlockContent .elementPictureWithTitleSize img {margin:0 0 5px 0;padding:0;}
#wBlockContent .elementPictureWithTitleSize span {float:left;margin:0;padding:0;}
#wBlockContent .elementPictureWithTitleSize span.title {margin: 0 5px 0 0;}

#wBlockContent .elementLink a {margin: 0 0 20px 0;}
#wBlockContent .documentLink .icon {margin: 0; padding:0;display: inline ;}
#wBlockContent .documentLink .icon img {margin: 0 2px -5px 0 !important; padding:0;display: inline ;}
#wBlockContent .documentLink .text {margin: 0; padding:0;display: inline ;}


#wBlockContent .documentLinkAtPicture a {background: url(/weblication/wGui/wImages/fileicons/ext_pdf.gif) no-repeat left top; padding: 2px 0 2px 20px;height:25px;}

.listFooter {text-align: center;}
.more {display: block;}

#wBlockContent p {margin: 0 0 0 0;}

.product {margin: 0; padding: 0 0 0 50px !important; clear: both;}
.productOverview {height:90px;}

.productOverview,
.productOverview a,
.product a {text-decoration: none !important;}
.productOverview img  {float: left; margin: 0 10px 0 0;}
.product img {float: left; margin: 0 50px 10px 0;}
.productOverview h2,
.product h2 {letter-spacing: 1px;}

.product .glasses {height: 10px;}
.product .glasses a {}
.product .glasses a img {}
.product .headline {font-weight: bold;height: 18px;}
.product .headline .sonderausstattung {padding: 0 0 0 5px;}
.product .description {margin: 0 0 20px 0 !important;}

.product .productSpecial {float: left; margin: 0 0 0 0;}
.product .productSpecial img {margin: 0 20px 10px 0;}

.dotted {border-top: 2px #ff0000 dotted;clear: both;margin: 0 -60px 0px -10px; padding: 0; height:30px;}

#searchbutton {margin: 0 20px 0 0;}

#wBlockContentInner ul {margin: 20px 0 20px 20px;}

/* ===============================
   = Formular
=============================== */

form ol {position: relative;}

form ol,
form ol li {list-style: none; margin: 0; padding: 0; clear: both;}
form ol li {margin: 0 0 1em 0;}

form button,
form input,
form textarea,
form select {font:inherit;}

form textarea,
form input {border: 1px solid #58585A;}

form .elementSearchButton,
form input.button {background: #58585A; color: #fff; padding: 2px 10px 2px 10px; font-weight: bold;}

form label {cursor: pointer; width: 190px; display: block;  line-height: normal; float: left;}
form label.radio {width: auto; display: inline; float: none; margin: 0 15px 5px 5px;width: 290px;}

form span.button,
form li.C {margin: 10px 0 0 190px; clear: both; display: block; width:300px;}
form li.C img {display: block; margin: 10px 100px 10px 0;clear:both;}
form li.C input {clear: both;margin:0;padding:0;}

form li strong {font-weight: normal; display: block; margin: 0 0 10px 0;}
form div.alignToLine {padding: 0 0 0 190px; width: 300px;}
form li.Berufsgruppe input {display: block; width: auto;  margin: 0 0 5px 0; float: left; clear: left;}
form li.Berufsgruppe label {display: block; width: 200px; float: left;}
form li.Wie_wurden_Sie_auf_unsere_Website_aufmerksam {clear: left;}
form li.Wie_wurden_Sie_auf_unsere_Website_aufmerksam input {display: block; width: auto;  margin: 0 0 5px 0; float: left; clear: left;}
form li.Wie_wurden_Sie_auf_unsere_Website_aufmerksam label {display: block; width: 200px; float: left;}

div.radioCon {clear: both;}

form .wError {background: #FFEFEF; width: 350px; display: block; padding: 10px; color: #7F0707; font-weight: bold; border-top: 3px solid #7F0707; margin-bottom: 10px;}

form input.C,
.form input,
form input.kontakt {width: 170px; padding: 2px;}
form textarea.kontakt {width: 170px; height: 120px; padding: 2px;}

#radioAnd1,
#radioAnd2,
#radioOr1,
#radioOr2 {width: auto; border: 0;}

.form label {float: none; width: auto; display: inline; cursor: pointer;}
.sucheWortRadio {margin: 10px 0 10px 0;}

.form .elementSearchButton {width: auto;}

.elementStandard {margin: 0 0 20px 0;}
.elementStandard .elementStandardToggl {display:none;}
.elementStandard .elementStandardTogglLink {height:20px;}

.gallerieFirst {}
.gallerieFollow{display:none;}

.sideData {margin: 5px 0 10px 0;}
.sideData .title {margin: 0 10px 0 0;}
.sideData .title {}


/* ===============================
   = Hauptnavigation
=============================== */
.standardNavigation {text-align: left;position: absolute; top: 90px; left: 0; z-index: 80;width:500px;}
.standardNavigation ul {margin: 0; padding: 0; line-height:0;}
.standardNavigation ul li {margin: 0; padding: 0; list-style: none;clear:left;border:none;}
.standardNavigation ul li a {margin: 0 0 3px 0;padding: 0 5px 0 0;}
.standardNavigation ul li.level1 {display: block;}
.standardNavigation ul li.level1 a {display: block; float:left;}
.standardNavigation ul li.level1 a.selected,
.standardNavigation ul li.level1 a:hover {}


/* ===============================
   = Hauptnavigation
=============================== */
.standardNavigation {text-align: left;position: absolute; top: 90px; left: 25px; z-index: 80;width:500px;}
.standardNavigation ul {margin: 0; padding: 0; line-height:0;}
.standardNavigation ul li {margin: 0; padding: 0; display: block; height:14px !important; line-height:14px; width:180px; list-style: none;clear:left;border:none; }
.standardNavigation ul li a {margin: 0 !important;padding: 0 5px 0 0 !important;}
.standardNavigation ul ul li a {margin: 0 !important; padding: 0!important;}
.standardNavigation ul li.level1 {}
.standardNavigation ul li.level1 a {display: block; float:left;}
.standardNavigation ul li.level1 a.selected,
.standardNavigation ul li.level1 a:hover {}

.standardNavigation ul li.level1 div{display:none;}

.standardNavigation ul.level2  {position: absolute; left:175px;}
.standardNavigation ul.level3  {position: absolute;  left:105px;}


.standardNavigation ul li.level1 div{display:none;}
.standardNavigation ul li.openselected div.level2 {display:block;}
.standardNavigation ul li.childselected div.level2 {display:block;}

.standardNavigation ul.level2 {position: absolute; left:175px;}
.standardNavigation ul li ul li div{display:none;}
.standardNavigation ul li ul li.openselected div.level3{display:block;} 
.standardNavigation ul li.childselected ul li.childselected div.level3 {display:block;}

.standardNavigation ul.level3  {position: absolute;  left:105px;}


.standardNavigation ul li.openselected div.level3 {display:none;}

/* ===============================
   = Sprachnavigation
=============================== */

#languageSelection {background: url(/trendoffice/wLayout/design/img/backgrounds/bg_languageswitch.gif); width:121px;height:25px;float:left;}
#languageSelection a {position:relative; top:6px;left:8px;font-weight:normal;color:#000;}

#languageSelectionMenu {position:relative; display:none;top:5px; left:-8px;}
ul.langnav {}
ul.langnav li {list-style: none; margin: 0; padding: 0; display: inline; }
ul.langnav li a {display: block; margin: -1px 0 0 1px;border:#cccccc 1px solid;padding:4px 0 3px 6px;background-color: #ffffff;width: 111px;}

/* ===============================
   = 
=============================== */


.elementLogo {height:90px;}
.elementLogo a {display:block;}
.elementLogo a img {margin:20px 0 0 13px;}

.elementKeyvisual { width:971px;text-align:right;}

.elementWaS { width:901px;text-align:right;margin: 5px 0 0 0;padding: 0 70px 0 0;}

.elementToolbox {	position: absolute;	top:50px;	right: 0;	width: 300px;margin: 0; padding:0;}
.elementToolbox .iconLanguageSelection {float:left; width:20px;margin: 3px 5px 0 0;}

/* ===============================
   = Suche / Erweiterte Suche
=============================== */

.elementToolbox .basicSearch {float:left;}
.elementToolbox .search {float:left; width:150px;}
.elementToolbox .search img {float:left; width:20px;margin: 2px 5px 0 0;}
#wBlockContent #searchform img {visibility: hidden;}
.elementToolbox .search fieldset {width:100px;}
.elementToolbox .search input {width:98px; height:17px; border: 1px solid #ccc;background:#fff;padding: 4px 0 0 5px ;margin: 1px 0 0 0;}

.elementToolbox .extendedSearch {display: none;}

.editbuttonNavi {position: absolute; top: -20px; left: 0;}