/* style definitions by Marco De Luca - DeLucaMarketing.ch */
/* V1.0 - 2008-10-29 */
/* main colors
red: #bd3826
sand: #9f9c6f
grey: #a8adb1
blue: #39529b
*/

*		{margin: 0; padding: 0;}
body	{font: 62.5% verdana, sans-serif; background: url(../img/ui/back.gif) repeat-x;}

/* the picture which fades into the header background */
#picture {float: right; width: 200px; height: 186px; margin-right: 0px; text-align: right;}
#logo	{position: absolute; left: 10px; top: 16px;}
#skipintro {position: absolute; left: -9999px;}

#wrapper {width: 95%; margin: 0 auto; position: relative; min-width: 770px;}

#header {position: absolute; left: 10px; top: 78px; background:#bd3826; color: #fff; font-size: 1.1em;}
#header ul {list-style: none; margin:0; padding: 0;}
#header li {display: inline;}
#header a {text-decoration: none; color: #fff; background: transparent; margin-right: 10px; float: left; display: block;}
#header a:hover {text-decoration: underline;}

#mainnav	{position: absolute; left: 0; top: 148px; background:#bd3826; color: #fff; padding-left: 0px; height: 18px; border-top: 1px solid #fff; border-bottom: 1px solid #fff; font: bold 13px arial,sans-serif; text-transform: uppercase;}
#mainnav ul {list-style: none; margin: 0; padding: 0;}
#mainnav li	{display: inline;}
#mainnav a	{text-decoration: none; color: #fff; background: transparent; margin:0; padding: 0 10px; float: left; display: block; line-height: 18px;}
#mainnav a:hover	{background-color: #9f9c6f; color: #fff;}
#mainnav .on a,
#mainnav .on,
#mainnav .on a:hover {background-color: #9F9C6F; color:#fff; cursor: default;}

#subnav	{position: absolute; left: 0; top: 168px;  background:#bd3826; color: #fff; padding: 0; height: 18px; font: 11px verdana,sans-serif; width: 600px;}
#subnav ul {list-style: none; margin:0; padding: 0;}
#subnav li {display: inline;}
#subnav a  {text-decoration: none; color: #fff; background: transparent; padding: 0 10px; float: left; display: block; line-height: 18px;}
#subnav ul li a:hover	{text-decoration: none; background-color: #9F9C6F; color: #fff;}
#subnav .on a,
#subnav .on,
#subnav .on a:hover {background-color: #9F9C6F; color:#fff; cursor: default;}

#breadcrumbs.hide {visibility: hidden;}
#breadcrumbs {visibility: hidden;}
#breadcrumbs {clear: both; margin: 0 0 30px 0; padding: 4px 0 2px 25%; font-size: 1em; background: #fff; color: #999;}
#breadcrumbs a {text-decoration: none; color: #999; background: #fff;}
#breadcrumbs a:hover {text-decoration: underline; color: #000; background: #fff;}
#breadcrumbs {/*visibility: hidden;*/}


#leftcol {width: 20%; float: left; font: 100%/1.5em verdana,sans-serif; font-size: 1.1em; min-width: 160px}
#leftcol h3 {margin-top: 0; border-top: 1px solid #a8adb1; margin-top: 1em; padding-top: 1em;}

/* nav in left column */
ul.nav 	{list-style: none; margin: 25px 0 0 0; padding: 0; color: #999; border-top: 1px solid #bd3826;}
ul.nav ul {list-style: disc; margin: 0;}
ul.nav a	{color: #333; text-decoration: none; display: block; line-height: 2; width: 100%;}
ul.nav a:visited {color: #333;}
ul.nav li {margin: 0;}
ul.nav li a {border-bottom: 1px solid #bd3826;}
ul.nav a:hover {background: #9f9c6f; color: white;}
ul.nav a.on,
ul.nav a.on:visited  {font-weight: bold; color: #bd3826;}
ul.nav a.on:hover {background: white; cursor: default;}



/* the content area which always comes with a indentation from the left */
#content {margin-left: 25%; font-size: 1.1em; line-height: 1.6; color: #333; background: white;}

#footer {background: #9f9c6f; color:#54533b; margin-top: 3em; margin-bottom: 3em; clear: both;}
#f-content {width: 90%; margin: 0 auto 0 auto; height: 18px; line-height: 18px;}
#pagedate {font-size: 11px; color: #54533B; margin-left: 25%}


/* standard HTML tags */
h1 {color: #bd3826; background: #fff; font: normal 220%/1.4 verdana,sans-serif; margin-bottom: 0.25em;}
h2 {color: #bd3826; background: #fff; font: bold 100%/1.4 verdana,sans-serif; margin: 2em 0 0.5em 0;}
h3 {font: bold 100%/1.3 verdana,sans-serif; margin: 1em 0 0.5em 0;}
h4 {font: bold 100% verdana,sans-serif; margin: 1em 0 0 0}
p  {margin: 0 0 0.5em 0;}


ul {margin-left: 0; padding-left: 2em; margin-top:3px; list-style-type: disc; /* list-style-image: url(../img/bullets.gif); */}
ol {margin-left: 0; padding-left: 2.5em; margin-top:3px;}
li {margin-bottom: 0.5em;}
ul.compact li {line-height: 1.2em}
ul.nobullets {list-style: none; margin-left: 0; padding-left: 0;}
hr {width: 100%; color: #a8adb1; background: #a8adb1; border: none; height: 1px; clear: both;}
blockquote {border: 2px solid #bd3826; padding: 1em; width: 18em; background: #fdf7f6; color: #bd3826; font-size: 2em; margin: 1em 0;}
blockquote span {color: #333;}
sup, sub {font-size: 90%;}




a			 {color: #39529B; background: transparent;}
a:link 	 {color: #39529B; background: transparent;} 
a:visited {color: #818EB5; background: transparent;}
a:hover	 {color: #a8adb1; background: transparent;}
a:active	 {color: #a8adb1; background: transparent;}

a.mail,
a.mail:link		{color: #39529B; background: url(../img/mail.gif) no-repeat 0 2px; padding-left: 14px;}
a.mail:visited {color: #818EB5; background: transparent;}
a.mail:hover	{color: #a8adb1; background: url(../img/mail-over.gif) no-repeat 0 2px;}
a.mail:active	{color: #a8adb1; background: transparent;}

a.url,
a.url:link 	 	{color: #39529B; background: url(../img/icons/arrow-right.gif) no-repeat 0 2px; padding-left: 14px;}
a.url:visited	{color: #818EB5; background: url(../img/icons/arrow-right-over.gif) no-repeat 0 2px;}
a.url:hover	 	{color: #a8adb1; background-image: url(../img/icons/arrow-right.gif);}
a.url:active	{color: #a8adb1; background: transparent;}

a.pdf,
a.pdf:link 	 	{color: #39529B; background: url(../img/icons/iconPDF.gif) no-repeat 0 2px; padding-left: 14px;}
a.pdf:visited	{color: #818EB5; background: url(../img/icons/iconPDF-over.gif) no-repeat 0 2px;}
a.pdf:hover	 	{color: #a8adb1; background: url(../img/icons/iconPDF-over.gif) no-repeat 0 2px;}
a.pdf:active	{color: #a8adb1; background: transparent;}

a.download,
a.download:link 	 	{color: #39529B; background: url(../img/icons/arrow-down.gif) no-repeat 0 2px; padding-left: 14px;}
a.download:visited	{color: #818EB5; background: url(../img/icons/arrow-down-over.gif) no-repeat 0 2px;}
a.download:hover	 	{color: #a8adb1; background: url(../img/icons/arrow-down-over.gif) no-repeat 0 2px;}
a.download:active		{color: #a8adb1; background: transparent;}

a.excel,
a.excel:link 	{color: #39529B; background: url(../img/icons/iconexcel.png) no-repeat 0 2px; padding-left: 14px;}
a.excel:visited{color: #818EB5; background: url(../img/icons/iconexcel.png) no-repeat 0 2px;}
a.excel:hover	{color: #a8adb1; background: url(../img/icons/iconexcel-over.png) no-repeat 0 2px;}
a.excel:active	{color: #a8adb1; background: transparent;}

a.back,
a.back:link		{background: url(../img/icons/arrow-left.gif) no-repeat 0 2px; padding-left: 14px;}
a.back:hover	{background: url(../img/icons/arrow-left-over.gif) no-repeat 0 2px;}

img {border: none;}


/*
#leftcol .on a {color: #bd3826; background: white; cursor: default; font-weight: bold;}
#leftcol .on ul a {font-weight: normal; color: #333;}
#leftcol .on ul a:hover {background: #9f9c6f; color: #fff; cursor: auto;}
#leftcol ul ul {padding: 0 0 0 20%; margin: 0;}
#leftcol ul ul .on a:hover {background: white; color: #bd3826; cursor: default;}
*/
/*
#leftcol li ul a {border-bottom: 1px solid #ccc;}
*/

/*
#leftcol a.lc	{text-decoration: none; color: black; font-weight: bold;}
#leftcol p.no	{border-bottom: 1px solid #a8adb1; text-align: right;}
#leftcol p.on	{border-bottom: 1px solid #bd3826; text-align: right; color: #bd3826;}
#leftcol p.on a.lc {color: #bd3826;}
#leftcol p a.lc:hover {color: #bd3826; background: transparent;}
#leftcol p.text {border: none; text-align: left; font-weight: normal;}
#leftcol p.dl {border-bottom: 1px solid #bd3826; text-align: right; margin-left: 20px;}
#leftcol p.dg {border-bottom: 1px solid #ccc; text-align: right; margin-left: 20px;}
#leftcol p.dl a {font-weight: normal;}
#leftcol p.dg a {font-weight: normal;}
#leftcol h2 {margin: 1px 0 0 0; padding:2px; background-color: #a8adb1; color: white; text-align: right;}
#leftcol h2 a {color: white;}
#leftcol h2 a:hover {color: #bd3826;}
#leftcol h3 {margin: 1px 0 0 20px; padding:2px; background-color: #a8adb1; color: white; text-align: right;}
*/


img.left10 {border: 1px solid #a8adb1; margin-right: 10px;}
img.left20 {border: 1px solid #a8adb1; float: left; margin-right: 20px;}



/* bloody hack for IE*/
* html #content {height: 1%;}



/* colors */
.lgrey-b {background-color: #f0f0f0;}
.grey {color: #a8adb1;}
.red {color: #bd3826;}



.featureMain {margin-top: 1.5em; position: relative; padding-left: 140px; height: 170px; width: 400px; float: left; margin-right: 30px; margin-bottom: 0.5em;}
.featureMain img {position: absolute; left: 0; top: 3px; border: 1px solid #a8adb1; margin-right: 1.5em; float: left;}
.featureMain h2 {margin-top:0;}

.feature {height: 150px; width: 60em;}
.feature h2,
.feature p {margin-left: 120px;}
.feature img {margin-left: -120px;}



.referenzen {margin-top: 1.5em; position: relative; padding-left: 160px; height: 170px; width: 400px; float: left; margin-right: 30px; margin-bottom: 0.5em; height: auto;}



.clearafter {clear: both;}


#content img.prodpic {margin-left: 30px; margin-bottom: 30px; border: 1px solid #a8adb1; float: right; padding: 10px;}
#content img.prodpic-left {margin-right: 20px; margin-bottom: 20px; border: 1px solid #a8adb1; float: left; padding: 10px;}
#content a:hover img.prodpic {border: 1px solid red;}
#content img.moodpic {margin-left: 30px; margin-bottom: 30px; border: 1px solid #a8adb1; float: right;}


/* specials */
/*
h2.title{ border-bottom-color: #bd3826; border-bottom-style: solid; border-bottom-width: 1px; margin-top:40px; margin-bottom:10px}
#content h2 a {color: #bd3826; text-decoration: none;}
#content img.prod {border: 1px solid #a8adb1;}


#content img.prodpic-ov {margin-left: 20px; border: 1px solid #a8adb1;}
.center {text-align: center;}
.right  {text-align: right;}
.ptitle {color: #9f9c6f; background: transparent; font-weight: bold;}
.spctop10 {margin-top: 10px}
.spctop20 {margin-top: 20px}
.spctop30 {margin-top: 30px}
.spcrgt10 {margin-right: 10px}
.spcrgt20 {margin-right: 20px}
.spcrgt30 {margin-right: 30px}
.contact {margin-top: 30px; text-align: right;}
.disable {display: none;}
.clr {clear: both;}
*/




table.tab		{margin: 2em 0;}
table.tab th	{background-color: #a8adb1; color: white; font-weight: bold; text-align: left; border-top: 1px solid black;}
table.tab th.right {text-align: right;}
table.tab th.center {text-align: center;}
table.tab td	{border-bottom: 1px solid #a8adb1;}
table.tab td.noline	{border-bottom: none;}
table.tab .subhead {background-color: #C1C5C8; color: white; font-weight: normal;}
table.tab tfoot td {border-bottom: none; padding-top: 2px;}
table.tab th,
table.tab td {padding: 2px 15px 2px 2px;}
table.tab ul {padding-left: 1.3em;}


/*
table.overview		{margin-top: 10px; background-color: #a8adb1;}
table.overview th	{background-color: #9f9c6f; color: white; font-weight: bold;}
table.overview td	{background-color: #fff;}

#tabnav {width: 590px; margin: 0 auto; height: 22em;}
#tabnav img {margin-right:10px;}

div.imgbox {margin-bottom: 1em;}
div.imgbox p {float: left; margin-right: 20px;}
div.imgbox img {border: 1px solid #a8adb1;}
*/

.floatleft {float: left;}
.clearFloat{clear: both; float: none;}


/* Page Vertrieb */
#VertriebDeutschland {margin-top: 0.5em;}
#vertrieblegende {list-style: none; margin-top: 5px; margin-left: 60px;}
#vertrieblegende li {margin-bottom: 0.2em;}
#vertrieblegende img {position: relative; left: -10px; top: 1px;}
#Adressen {float: left; margin-left: 20px;}
#Adressen h2 {margin-top: 20px; margin-bottom: 0;}


ul.compact {list-style: none; margin: 0; padding: 0;}
ul.compact li {line-height: 1;}

.top1em {margin-top: 1em;}
.top2em {margin-top: 2em;}
.top3em {margin-top: 3em;}
.top4em {margin-top: 4em;}
.top5em {margin-top: 5em;}



textarea {font-family: Verdana, sans-serif; font-size: 1.1em; float: left;}
.text {width: 320px; border: 1px solid #ddd; padding: 0.1em 0.25em;}
.icon {margin-left: 5px;}
fieldset li {clear: both;}

#ContactForm {background: #f0f0f0; width: 55em;}
#ContactForm fieldset {border: none; border-top: 1px solid #a8adb1; padding: 1em;}
#ContactForm ol {list-style: none; margin: 1em 0 0 0; padding: 0;}
#ContactForm li {margin: 0; padding: 0; margin-bottom: 0.2em;}
#ContactForm legend {padding: 0; margin: 0; color: #bd3826;}
#ContactForm label {display: block; float: left; width: 12em;}

#ContactForm .hinweis {padding: 1em;}
#ContactForm .hinweis input {float: left; margin: 5px 5px 0 0;}
#ContactForm .hinweis label {display:block; float:left; width: auto;}

#ContactForm fieldset.submit input {margin-right: 0.5em;}

/* Kontaktseite */
#ContactForm fieldset.checkboxes {border: none; padding: 0 0 1em 1em;}
#ContactForm fieldset.checkboxes ol {margin-left: 12em; margin-top: 0;}
#ContactForm fieldset.checkboxes label {width: auto; display: inline; float: none; text-align: left; margin-left: 0.25em;}
#ContactForm fieldset.checkboxes input {padding: 0.25em; margin-bottom: 0.5em;}
#ContactForm .fixedwidth {float: left; width: 14.5em;}
#ContactForm li strong {margin-top: 2em; display: block; border-bottom: 1px solid #a8adb1;}


.frame {border: 1px solid #a8adb1; padding: 0.5em 1em; margin: 1em 0;}


ul.thumbnails {list-style: none; margin: 4em 0 1em 0; padding: 0;}
ul.thumbnails li {margin-bottom: 20px;}

#home #leftcol {margin-top: 3em;}
#home #content {margin-right: 15%;}
#home #wrapper { position: relative;}
#home #rightcol {width: 20%; position: absolute; top: 240px; right: 0;}
#home .featureMain {width: auto; float: none;}


div.box {border: 1px solid #bd3826; padding-bottom: 10px;}
div.box h2 {padding: 5px 15px; margin: 0 0 10px 0; background: #bd3826; color: white;}
div.box p {padding: 0 15px;}

.imgborder {border: 1px solid #a8adb1;}


/* highslide */
.highslide {cursor: url(../img/hs/zoomin.cur), pointer; outline: none;}
.highslide-active-anchor img {visibility: hidden;}
.highslide img {border: 1px solid #a8adb1;}
.highslide:hover img {border: 1px solid #bd3826;}
.highslide-wrapper {background: white;}
.highslide-image {border: 5px solid white;}
.highslide-image-blur {}
.highslide-caption {display: none; border: 2px solid white; border-top: none; font-size: 1.3em; padding: 5px; background-color: white;}
.highslide-loading {display: block; color: black; font-size: 8pt; font-family: sans-serif; font-weight: bold; text-decoration: none; padding: 2px; border: 1px solid black;
    background-color: white;
    padding-left: 22px;
    background-image: url(../img/hs/loader.white.gif);
    background-repeat: no-repeat;
    background-position: 3px 1px;
}

a.highslide-credits, a.highslide-credits i {display: none;}
a.highslide-credits:hover, a.highslide-credits:hover i {display: none;}
.highslide-move {  cursor: move;}
.highslide-overlay {	display: none;}

a.highslide-full-expand {background: url(../img/hs/fullexpand.gif) no-repeat; display: block; margin: 0 10px 10px 0; width: 34px; height: 34px;}

/* Controlbar */
.controlbar {background: url(../img/hs/controlbar4.gif); width: 167px; height: 34px;}
.controlbar a {display: block; float: left;  /*margin: 0px 0 0 4px;*/ height: 27px;}
.controlbar a:hover {background-image: url(../img/hs/controlbar4-hover.gif);}
.controlbar .previous {width: 50px;}
.controlbar .next {width: 40px; background-position: -50px 0;}
.controlbar .highslide-move {width: 40px; background-position: -90px 0;}
.controlbar .close {width: 36px; background-position: -130px 0;}

/* Necessary for functionality */
.highslide-display-block {display: block;}
.highslide-display-none {display: none;}


#jobs #content p {width: 60em;}
#jobs #hr {margin-top: 20px;}
#jobs #hr h2 {margin-top: 0;}
#jobs #hr img {margin-right: 20px; border: 1px solid #a8adb1;}
#jobs #hr td {padding-bottom: 20px;}


.clr { clear: both; }


.mitarbeiter {border: 1px solid #a8adb1; float: left; margin-right: 20px; margin-bottom: 20px;}
.imgleft {float: left; margin-right: 20px; margin-bottom: 20px;}

.MDLmessage {border: 1px solid #99FF00; background:#EDFFD2; padding: 20px; color: #518700; font-size: 1.3em; margin: 1em 0;}