/* === css for www.tre-ag.com - written by eypix mediadesign - Bernd Willenberg, 12/12/2009 === */

/* general specifications */

* {margin: 0; padding: 0;}
a {text-decoration: underline;}
a img {border: 0;}
body, html {background: #ababab; color: #404040; font: 100.01%/1.5 arial, verdana, helvetica, sans-serif;}
img {float/**/:/**/ left;}
table, table* {border: 0;}
ul {list-style: none;}
.i {font-style: italic;}


/* container */

#ct-1, #ct-2 {margin: auto; text-align: left; width: 970px;}
#bg-s {background: #ababab url(../img/bg-s.jpg) repeat-x; float: left; font-size: .75em; text-align: center; width: 100%;}
#bg-t {background: #e9e7e9 url(../img/bg-t.jpg) repeat-x; float: left; font-size: .75em; text-align: center; width: 100%;}


/* head, buttons, language */

#bt-1 {float: left; height: 124px; left: 29px; line-height: 200em; overflow: hidden; position: relative; width: 125px;}
#bt-1 a {float: left; height: 124px; width: 125px;}
#bt-2 {float: left; height: 124px; left: 42px; line-height: 200em; overflow: hidden; position: relative; width: 100px;}
#bt-2 a {float: left; height: 124px; width: 100px;}
#hd {background: #4c6672 url(../img/common.jpg) no-repeat 0 -774px; height: 132px; width: 970px;}
#lang {background: url(../img/common.jpg) no-repeat -632px -620px; float: right; height: 31px; right: 9px; position: relative; top: 5px; width: 120px;}
#l-cn, #l-de, #l-en, #l-cn a, #l-de a, #l-en a {float: right; height: 23px; line-height: 200em; overflow: hidden; width: 35px;}
#l-cn, #l-de, #l-en {margin: 3px 0 0 5px;}
#l-cn a {background: url(../img/common.jpg) no-repeat -702px -597px;}
#l-de a {background: url(../img/common.jpg) no-repeat -772px -597px;}
#l-en a {background: url(../img/common.jpg) no-repeat -632px -597px;}
#l-cn, #l-cn a:hover {background: url(../img/common.jpg) no-repeat -737px -597px;}
#l-de, #l-de a:hover {background: url(../img/common.jpg) no-repeat -807px -597px;}
#l-en, #l-en a:hover {background: url(../img/common.jpg) no-repeat -667px -597px;}
.skipnav {left: -9999px; position: absolute; top: -9999px;}


/* navigation */

#nav {color: #fff; float: left; font-weight: 700; left: 60px; position: relative; top: 42px; width: 680px;}
#nav li {float: left;}
#nav li:hover {background: url(../img/nav-hover.jpg) no-repeat; position: relative; z-index: 2;}
#nav li:hover ul.sub {left: 0; top: 24px; white-space: nowrap; z-index: 3;}
#nav li:hover ul.sub li {height: 18px; text-indent: 22px; width: 150px;}
#nav li:hover ul.sub li a {background: #54768a url(../img/square-off.gif) no-repeat 7px 5px; float: left; color: #fff; height: 18px; text-decoration: none; width: 150px;}
#nav li:hover ul.sub li a:hover, #nav li:hover ul.sub li {background: #315468 url(../img/square.gif) no-repeat 7px 5px;}
#nav .sub {background: #54768a url(../img/nav-px.gif) no-repeat left bottom; float: left; font-size: 11px; font-weight: 400; left: -9999px; line-height: 18px; overflow: hidden; padding: 8px 0 18px; position: absolute; top: -9999px; width: 150px;}
#nav .top {background: url(../img/arrow-d.gif) no-repeat 7px 8px; cursor: default; float: left; font-size: 12px; height: 24px; line-height: 21px; margin-right: 3px; padding: 0 8px 0 22px;}
#nav .on {background: url(../img/nav-hover.jpg) no-repeat;}
#nav .mt {border-top: 1px solid #fff; margin-top: 5px;}


/* content - column left */

#col-l {background: url(../img/cont-bg.gif) no-repeat 294px -85px; float: left; padding: 31px 40px 74px; width: 670px; width/**/:/**/ 590px;}
#col-l h1 {background: #a4a4a1 url(../img/square.gif) no-repeat right 50%; border-right: 6px solid #a4a4a1; color: #fff; float: right; font-size: .833em; font-weight: 400; padding: 0 1.33em 0 .75em;}
#col-l h2 {border-top: 1px solid #d6d6d6; color: #4d4c46; float: left; font-size: 1.5em; font-style: italic; font-weight: 700; line-height: 2.5em; padding-bottom: 1em; width: 100%;}
#col-l h3 {background: #f0f0f0; clear: both; color: #4d4c46; font-size: 1.1em; font-style: italic; font-weight: 700; line-height: 1.5em; padding-left: 3px; margin: 1.5em 0; }
#col-l h4 {clear: both; color: #000; font-size: 1em; font-weight: 700; line-height: 1.5em; margin-bottom: 1.5em; }
#col-l p {clear: both; padding-bottom: 1.83em;}
#col-l ul {padding: 0 0 1.5em;}
#col-l ul li {background: url(../img/li-1.gif) no-repeat 0 .33em; padding: 0 0 .66em 1.417em;}
#col-l ul ul {padding: .417em 0 0;}
#col-l ul ul li {background: url(../img/li-2.gif) no-repeat 0 .33em; padding: 0 0 .25em 1.25em;}
#cont {background: #fff url(../img/col-y.gif) repeat-y 670px 0; border-bottom: 5px solid #fff; float: left; width: 970px;}
#cont a {color: #404040; text-decoration: underline;}
#cont a.pdf {background: url(../img/icons.gif) no-repeat -21px 0; float: left; height: 21px; line-height: 200em; margin-right: 7px; overflow: hidden; width: 21px;}
#cont .cb {clear: both;}
#cont .fl {float: left;}
#cont .fr {float: right;}
#cont .mt {margin-top: 0;}
#cont .oh {overflow: hidden;}
#cont .pb {padding-bottom: 1.83em;}
#cont .pb-0 {padding-bottom: 0.33em;}
#cont .pt {padding-top: 1.5em;}
#cont table {background: #c2a965 url(../img/common.jpg) no-repeat 0 -920px; border-collapse: collapse; clear: both; margin-bottom: 40px; width: 100%;}
#cont table a {display: block; text-decoration: none;}
#cont table a:hover {text-decoration: underline;}
#cont table a.link-ext, #cont table a.pdf, #cont table a.video {float: left; height: 21px; line-height: 200em; margin-top: 8px; overflow: hidden; width: 21px;}
#cont table a.link-ext {background: url(../img/icons.gif) no-repeat; margin-left: 8px; margin-left/**/:/**/ 17px;}
#cont table a.pdf {background: url(../img/icons.gif) no-repeat -21px 0;}
#cont table a.video {background: url(../img/icons.gif) no-repeat -42px 0;}
#cont td {background: #fdfdfa; border-bottom: 1px solid #d6d6d6; font-size: 12px; font-size/**/:/**/ 1em; line-height: 18px; line-height/**/:/**/ 1.5em; padding: 5px 10px; vertical-align: top;}
#cont td .source, #cont td .lang {font-size: .833em;}
#cont td .lang {background: #f1ebd7; border-left: 3px solid #f1ebd7; border-right: 3px solid #f1ebd7;}
#cont td .i {font-style: italic; font-weight: 700;}
#cont th {border-bottom: 1px solid #d6d6d6; color: #fff; font-size: 12px; font-size/**/:/**/ 1em; font-weight: 700; line-height: 18px; line-height/**/:/**/ 1.5em; padding: 3px 10px 2px; text-align: left;}
#cont tr.alt td {background: #f9f7ef;} /* class "alt" is written by javascript */
#cont .tb tr.over td, #cont .tb tr:hover td {background: #f1ebd7;}
#cont table ul {padding: 0;}
#cont table li {background: url(../img/li-3.gif) no-repeat 0 .33em;}
#cb {background: url(../img/cont-bg.gif) no-repeat; float/**/:/**/ left; height: 85px; position: relative; margin: -85px 0 0 11px; width: 646px; z-index: 3;}
* html #cb {float: none;}

/* newsletterform */
form#nl {float: left; font: 400 12px/18px arial, helvetica, sans-serif;}
form#nl h1 {clear: both; float: left; background: #5a7d92 url(../img/nl-bg.gif) no-repeat 0 0; border: 0; height: 25px; line-height: 250px; margin: 0; overflow: hidden; padding: 0; width: 590px;}
#nl label {color: #fff; float: left; font-weight: 700; line-height: 11px;}
#nl .error, #nl .ok {background: #743528; color: #fff; float: left; font: 700 11px/16px arial, helvetica, sans-serif;  margin: 10px 0 2px 0; padding: 2px 8px; width: 560px; width/**/:/**/ 544px;}
#nl .ok {background: #335569;}
.nl-cont {background: #eef1f3 url(../img/nl-bg.gif) no-repeat 0 -25px; float: left; padding-left: 15px; width: 590px; width/**/:/**/ 575px;}
.nl-txt {color: #2c4c5f; float: left; font: 400 11px/16px arial, helvetica, sans-serif; padding: 13px 10px 0 0; width: 455px; width/**/:/**/ 445px;}
.nl-form {background: #698798 url(../img/nl-bg.gif) no-repeat 0 -137px; float: left; padding-left: 15px; width: 590px; width/**/:/**/ 575px;}
.nl-form input {border: 0; float: left;}
.nl-form label {float: left; padding: 18px 0 2px;}
.nl-form #address input, .nl-form #view input {background: #fff url(../img/nl-bg.gif) no-repeat 0 -263px; float: left; font: 400 12px/18px arial, helvetica, sans-serif; height: 19px;}
.nl-form #address .validation-error label, .nl-form #view .validation-error label {color: #081b25;}
.nl-form #address div {float: left; width: 150px;}
.nl-form #address input {padding: 0 2px; width: 140px; width/**/:/**/ 136px;}
.nl-form #view div {float: left; width: 110px;}
.nl-form #view input {padding: 0 2px; width: 100px; width/**/:/**/ 96px;}
.nl-form-bottom {background: #698798 url(../img/nl-bg.gif) no-repeat 0 -244px; float: left; font-size: 0; height: 10px; line-height: 0; width: 590px;}
.nl-form-top {float: left; padding-bottom: 2px; width: 575px;}
/*.nl-note {background: #fff url(../img/nl-foot.gif) no-repeat 0 30px; color: #777; float: left; font: 400 11px/16px arial, helvetica, sans-serif; height: 130px; height: 110px; padding: 5px 0 20px; width: 590px;}*/
.nl-note {color: #777; float: left; font: 400 11px/16px arial, helvetica, sans-serif; padding: 5px 0; width: 590px;}
.nl-radio {background: #698798 url(../img/nl-bg.gif) no-repeat -470px -25px; float: left; height: 60px; height/**/:/**/ 48px; overflow: hidden; padding-top: 12px; width: 120px;}
.nl-radio div {float: left; padding-top: 2px; width: 120px;}
.nl-radio #f-action-subscribe, .nl-radio #f-action-unsubscribe {float: left; height: 15px; left: 12px; position: relative; width: 15px;}
.nl-radio label {line-height: 15px; left: 20px; position: relative; top: 2px;}


/* content - column right */

#col-r {float: left; font-size: 0.917em; line-height: 1.25em; width: 295px;}
#col-r a {text-decoration: none;}
#col-r a:hover {text-decoration: underline;}
#col-r h1 {border-top: 8px solid #fff; color: #fff; font-size: 11px; height: 30px; height/**/:/**/ 22px; line-height: 20px; overflow: hidden; padding: 0 50px 0 15px; width: 295px; width/**/:/**/ 230px;}
#col-r p {border-bottom: 1px solid #d5c79d; padding: 5px 0 10px; width: 262px;}

/* teaser - buttons */
#col-r .btn {float: right; font-size: 10px; line-height: 13px; height: 14px; overflow: hidden; margin-top: 7px; text-indent: 32px; width: 65px;}
#col-r .btn a {color: #fff; float: left; height: 14px; width: 65px;}
#col-r .btn a:hover {text-decoration: none;}
#col-r .g {background: #5f5f5f url(../img/common.jpg) no-repeat -762px -651px;}
#col-r .r {background: #743528 url(../img/common.jpg) no-repeat -697px -651px;}
#col-r .y {background: #a5915c url(../img/common.jpg) no-repeat -632px -651px;}

/* teaser - header */
#col-r .bg-g {background: #606060 url(../img/common.jpg) no-repeat -632px -509px;}
#col-r .bg-me {background: #743528 url(../img/common.jpg) no-repeat -632px -575px;}
#col-r .bg-p {background: #a5915c url(../img/common.jpg) no-repeat -632px -487px;}
#col-r .bg-r {background: #743528 url(../img/common.jpg) no-repeat -632px -553px;}
#col-r .bg-t {background: #a5915c url(../img/common.jpg) no-repeat -632px -465px;}
#col-r .bg-v {background: #606060 url(../img/common.jpg) no-repeat -632px -531px;}
#col-r .bg-y {background: #a5915c url(../img/common.jpg) no-repeat -632px -443px;}

/* teaser - container */
#col-r .tsr {float: left; padding: 7px 18px 15px 15px; width: 295px; width/**/:/**/ 262px;}


/* sitemap */

#ct-sm {background: #4c6672 url(../img/common.jpg) no-repeat; float: left; padding: 13px 0 15px; width: 970px;}
#sm {background: url(../img/common.jpg) no-repeat 0 -427px; color: #fff; float: left; left: 20px; padding-left: 2px; position: relative; width: 632px; white-space: nowrap; width/**/:/**/ 630px;}
#sm a {color: #fff; float: left; height: 16px; text-decoration: none; width: 148px;}
#sm a:hover {background: url(../img/common.jpg) no-repeat -632px -427px;}
#sm h1 {font-size: 10px; font-weight: 400; left: 18px; line-height: 17px; overflow: hidden; position: relative; width: 47px;}
#sm h2 {float: left; font-size: 11px; font-weight: 700; height: 16px; line-height: 16px;}
#sm ul {float: left; font-size: 11px; line-height: 16px; padding-bottom: 16px;}
#sm li {height: 16px; float: left; overflow: hidden; width: 148px;}
#sm .on {background: url(../img/common.jpg) no-repeat -632px -427px;}
#sm .sm-col {float: left; margin-right: 12px; overflow: hidden; padding: 12px 0 5px; text-indent: 18px; width: 148px;}
#sm .mr {margin-right: 0;}
#sm .mb {margin-bottom: 1.4em;}
#sm-b {background: url(../img/common.jpg) no-repeat 0 -768px; float: left; font-size: 0; height: 6px; left: 20px; line-height: 0; position: relative; width: 632px;}


/* footer */

#fb {float: left; font-size: .833em; height: 80px; color: #828180; text-align: right; width: 100%;}
#fb {line-height: 3.3em;}
#fb a {color: #828180; text-decoration: none;}
#fb a:hover {text-decoration: underline;}
#ft {background: #3b3b3b url(../img/common.jpg) no-repeat 0 -380px; color: #d3d0c4; float: left; font-size: .833em; height: 47px; line-height: 4.5em; overflow: hidden; padding: 0 40px; width: 970px; width/**/:/**/ 890px;}
#ft a {color: #d3d0c4; text-decoration: none;}
#ft a:hover {text-decoration: underline;}


/* classes for transparent elements and safari-hack. note: this is not valid css, just "opacity" is part of css 3. */
#nav .sub {filter: alpha(opacity=90); -moz-opacity: 0.90; opacity: 0.90; -khtml-opacity: 0.90; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";} /*all browsers whitout IE5 and IE5.5*/
@media screen and (-webkit-min-device-pixel-ratio:0) {#sm li {float/**/:/**/ none;}} /*IE5.5 and Safari 4.0*/