body {background-color:black;}
body, select, input, textarea {color: #545454; font: 100%; font-family: "Segoe", "Arial", "Helvetica", sans-serif;
}/*verdana, arial, helvetica, sans-serif;*/
/* reset HTML tags */
a:link{color:#666;}
a:visited{color:#7399C6}
a:active{color:#7399C6}
a:hover{text-decoration:none;color:#f60;}

html, body, address, blockquote, dl, form, h1, h2, h3, h4, h5, h6, ol, p, pre, table, ul, dd, dt, li, tbody, td, tfoot, th, thead, tr, map, a, code, dfn, img, legend, fieldset {margin: 0;padding: 0;}
img, fieldset {border: 0;padding:0}
h1 {font-size: 20px;padding-bottom: .4em;font-weight:normal;}
h2 {font-size: 18px;padding-bottom: .3em;font-weight:normal;}
h3 {font-size: 16px;padding-bottom: .2em;font-weight:normal;}
h4 {font-size: 14px;padding-bottom: .1em;font-weight:normal;}
h5 {font-size: 12px;padding-bottom: .1em;font-weight:normal;}
h6 {font-size: 12px;padding-bottom: .1em;font-weight:normal;}
p,ol,ul,td  {font-size:12px;padding-bottom: .1em;padding-top:.3em;}

/*define surround */
#wrapper {margin:0 auto;min-width: 877px;position:relative;background-color:white; max-width:1280px}

/*breadcrumb */
#breadcrumb {padding: 225px 40px 0px 40px}
#breadcrumb ul {}
#breadcrumb li {display:inline; margin-right:5px;}

/* content area */
#content {padding: 25px 40px 40px 40px;min-height: 330px;}
#content a {font-weight:normal;text-decoration:none;}
#content ul {margin-left:14px;padding-bottom: .5em;list-style-type:square;}
#content ul li {margin-left:14px;padding-top: .5em;padding-bottom: 0em;}
#content ul li ul {margin-left:0px;padding-top: 0em;padding-bottom: 0em;}
#content ul li ul li {margin-left:0px;font-size:1em;padding-top: .15em;padding-bottom: 0em;}
#content ol {margin-left:18px;padding-top: .5em;padding-bottom: 0em;}
#content ol li {margin-left:18px;padding-top: .5em;padding-bottom: 0em;}
#content ol li ol, #content ol li ul, #content ul li ol,  #content ul li ul {padding-left:40px;}
#content table {border-collapse:collapse; border:solid 0px #ccc;}
#content table caption {text-align:left;font-style:italic; background-color:#666; color:white;padding:.2em}
#content table thead th { text-align:center; padding:.2em; background-color:#999;color:white;}
#content table tbody th {text-align:left; padding:.2em;border-bottom:solid 0px #ccc;}
#content table tbody td { padding:.2em;border-bottom:solid 0px #ccc;vertical-align:top;}
#content table tbody td.number {text-align:right}
#content table tbody td.date {text-align:right}
#content table tfoot th {padding:.2em;background-color:#ccc;}
#content table tfoot td {padding:.2em;background-color:#ccc;}
#content table tfoot td.number {text-align:right}
#content table tfoot td.date {text-align:right}
#content h1 {padding-top: 1em;}
#content h2 {padding-top: 1em;}

/*  logo */
#header {position:absolute;top:40px;left:40px;}
#header h1.pagehead {padding:10px 0 0 0 ;margin:0;font-size: 34px;font-weight: bold;letter-spacing: 1px}
#header h1 a span {display:none}
#header h1 a {height:103px;width:164px;display:block; background: transparent url(../img/logo.png) no-repeat;behavior: url("/trefiweb/js/iepngfix.htc");
}

/* cover shading */
#cover {}
.full {background: none;color: inherit}
.nine {background: rgba(40, 40, 40, 0.9);color: rgba(10, 10, 10, 0.9);}
.eight {background: rgba(20, 20, 20, 0.8);color: rgba(20, 20, 20, 0.8);}
.seven {color: rgba(40, 40, 40, 0.7);background: rgba(0, 0, 0, 0.7);}
.seven  a {color:inherit;}

/* menu setup */
#menu  {position:absolute;top:40px;right:40px;background-color:transparent; font-family:"Segoe", "Arial", "Helvetica", sans-serif;}
#menu ul {position:relative;list-style-type:none;padding:0;margin:0}
#menu ul li {float:left;border:1px solid transparent;border-width:0 0 2px 2px;}
#menu ul li.login {font-style: italic;} /*border-width:0 2px 2px 2px*/

#menu ul li h2 {font-size:13px; font-weight:bold;}
#menu ul li a {display:block;width:120px;background-color:#444;color:#999;text-decoration:none;height:74px; }
#menu ul li a span {padding-left: 10px; vertical-align: sub;}

#menu ul li a.open{background-color:white;color:#999}
#menu ul li a.select{background-color:white;color:black;}

#menu ul li ul {position:absolute;top:76px;left:2px;display:block;background-color:white;width:607px;}
#menu ul li ul li {background-color:white;text-align:left;border-width:0;font-size:1em; padding: 7px}
#menu ul li ul li h3 {padding:0 0 3px 0;font-size:12px; height:1.5em;color:#666; font-weight:bold;}

#menu ul li ul li a:link {color:black;background-color:white;}
#menu ul li ul li a:hover {color:#666; text-decoration:underline}

#menu ul li ul li ul {position:relative;float:left;border-width:0;width:120px;top:0;}
#menu ul li ul li ul li {display:block;border-top:1px solid #ccc;padding:2px;float:none;margin:0 4px 4px 0 }
#menu ul li ul li ul li.head, #menu ul li ul li ul li.l1 {border-width:0;}
#menu ul li ul li ul li a {height:auto;display:inline; font-size:12px;}
#menu ul li ul li ul li a:visited {color: black;background-color:white;}

#menu ul li ul li ul.close {display:block; width:auto; padding:0 0 10px 0}
#menu ul li ul li ul.close h3 {padding:0; height:auto}
#menu ul li ul li ul.close li {float:none; display:inline;border-width:0;padding:0 }

#access {}


/* footer */
#footer {padding: 10px 40px 20px 40px; background-color:#000; color:#ddd; }
#footer ul {display:inline;}
#footer ul li {display:inline;}
#footer a {color:inherit; }
#footer li {font-size:10px; }
#footer a:hover {color:#999}

/* common controls */
.display_none {display:none;}
.hidden {visibility:hidden;}
.show {visibility:visible;display:inline}
.clean {clear:both}

/*page styles */

/*splash screen */
#wrapper.splash #content {padding: 200px 80px 0 140px;height:450px; font-family:arial,helvetica,sans-serif;}
#wrapper.splash {background:white url(../img/background/background8.jpg) no-repeat; }
#wrapper.splash #content h1 {padding:0 0px 20px 0px; font-size:3.5em; font-weight:bold; width:20em; letter-spacing:-.035em; line-height:.8em;color: #8B1A1A;}
#wrapper.splash #content p {background-color:#ccc; background: rgba(235, 235, 235, 0.81); width:42em; padding:20px;margin-bottom: 1px;color:black;font-size:1em;}
#wrapper.splash #content p strong { text-transform:uppercase; text-align:right; display:block; padding:.5em 0 0 0;font-weight:bold;}
#wrapper.splash #content a {text-decoration:none; color:inherit;}
#wrapper.splash #select {position:absolute; top:250px; left:200px;  width:100%; padding: 30px 0 0 0 ;color:white; font-size: 3em;}/*background-color:black;*/
#wrapper.splash #select ul {margin:0 auto; width:31em; list-style-type:none;}
#wrapper.splash #select li {width:10em; float:left;border:solid 2px white; border-width:0 2px 0 0;}
#wrapper.splash #select li.l1 {border-width:0 2px ; }
#wrapper.splash #select a:link {color:inherit; text-decoration:none; padding:10px 5px;display:block; }
#wrapper.splash #select a:hover {color:#000;background-color:#ccc}
#wrapper.splash #languageselect {width:80px; position:absolute; top:480px; color: #666; padding: 10px 10px 10px 10px; right:40px;background-color:#ccc;}
#wrapper.splash #languageselect ul {list-style-type:none;}

/*twocol*/
#wrapper.twocol #content {margin: 0 320px 0 0px; max-width:700px;}
#wrapper.twocol {background:white url(../img/background/header8.jpg) no-repeat center top;}
#wrapper.twocol #content ol.big {font-size: 1.4em;}

#wrapper.twocol #rightcol {width:300px; position:absolute; top:240px; color: #666; padding: 40px 40px 0 40px; right:0;}
#wrapper.twocol #rightcol h2 {font-weight:normal; font-size:1.4em;letter-spacing:-.05em;margin-bottom:1em;}
#wrapper.twocol #rightcol p.outline {background: rgba(235, 235, 235, 0.6);border: 1px solid #666666;padding: 10px 10px 10px 10px;margin: 0 0 10px 0; font-weight:bold;font-size:13px;width:280px;}
#wrapper.twocol #rightcol strong {display:block; text-align:right;padding-top:5px;}

#wrapper.twocol div.navigationright {margin: 20px 0 10px 0;}
#wrapper.twocol div.navigationright strong {border-bottom: 1px solid #666666;background: rgba(235, 235, 235, 0.4);padding:3px 10px 0 10px;}
#wrapper.twocol #rightcol span, #wrapper.twocol #rightcol span strong {text-align:center;display:block;}
#wrapper.twocol #rightcol h3 {font-size:1.2em; padding-right:50px;}
#wrapper.twocol #rightcol ul {margin-left:14px;padding-bottom: .5em;}
#wrapper.twocol #rightcol ul li {margin-left:14px;padding-top: 1px;padding-bottom: 1px;list-style-type:square;}


#wrapper.twocol #header h1.pagehead {color:#ebebeb; }

/* news pages */
#wrapper.news #content {margin: 0 320px 0 0px;}
#wrapper.news {background:white url(../img/background/header8.jpg) no-repeat center top;}
#wrapper.news #rightcol {width:240px; position:absolute; top:240px; color: #666; padding: 40px 40px 0 40px; right:0;}
#wrapper.news #rightcol li.vw { background: transparent url(../img/VW-logo.jpg) no-repeat top right; margin: 0 0 10px 0; list-style-type:none; border:solid 1px #666; padding:5px;}
#wrapper.news #rightcol li {margin-left:18px;  min-height:50px}
#wrapper.news #rightcol h2 {font-weight:normal; font-size:1em;letter-spacing:-.05em;margin-bottom:1em;}
#wrapper.news #header h1.pagehead {color:#ebebeb; }
#wrapper.news #rightcol h3 {font-size:1.2em; padding-right:50px}

/* site map */
#wrapper.sitemap #content {margin: 0 320px 0 0px;}
#wrapper.sitemap {background:white url(../img/background/header8.jpg) no-repeat center top;}
#wrapper.sitemap #header h1.pagehead {color:#ebebeb; }
#wrapper.sitemap #content h2 {font-size: 1em;padding-bottom: .1em;}
#wrapper.sitemap #content h3 {font-size: 1em;padding-bottom: .1em;}
#wrapper.sitemap #content h4 {font-size: 1em;padding-bottom: .1em;}
#wrapper.sitemap #content h5 {font-size: 1em;padding-bottom: .1em;}
#wrapper.sitemap #content h6 {font-size: 1em;padding-bottom: .1em;}
#wrapper.sitemap #content ul {margin-left:18px;list-style-type: square; }
#wrapper.sitemap #content ul li ul { margin-left:18px;list-style-type: square;}

/* subscribe page */
#wrapper.subscribe {min-width: 1100px;}
#wrapper.subscribe #content {min-width: 650px;max-width:650px;margin: 0 320px 0 0px;padding: 250px 40px 0px 40px;min-height: 450px;}

#wrapper.subscribe {background:white url(../img/background/header8.jpg) no-repeat center top;}
#wrapper.subscribe #header h1.pagehead {color:#ebebeb; }
#wrapper.subscribe #content {width:500;}
#wrapper.subscribe #content input { background-color: #DDDDDD; border: 1px solid #666666; width:220px;}
#wrapper.subscribe #content input.mandatory { background-color: #dfefb1;}
#wrapper.subscribe #content input.error { background-color: #f7911f;}
#wrapper.subscribe #content input.checkbox { background-color:white; border: none; width:15px;}
#wrapper.subscribe #content select { background-color: #DDDDDD; border: 1px solid #666666; width:220px;}
#wrapper.subscribe #content div {}
#wrapper.subscribe #content div.subscribebutton { position: relative; right: 0; color:white; background-color: #5f6f31;border:1px solid ;padding:5px 5px 7px 7px;width:150px;text-align:center; margin: 15px 15px 0px 0px;cursor: pointer}
#wrapper.subscribe #content div.subscribebutton:hover {background-color:#697c2f;}

#wrapper.subscribe #rightcol {width:360px; position:absolute; top:240px; color: #666; padding: 40px 40px 0 40px; left:720px;text-align:left;}
#wrapper.subscribe #rightcol div p {font-size: 14px;color:white;font-weight:bold;}

#wrapper.subscribe #rightcol div.progress {width:300px; float:left; margin:0px 20px 70px 15px;color:white;}

#wrapper.subscribe #rightcol div.progress div {height:50px;padding: 10px 5px 5px 10px;border:0px solid black;}
#wrapper.subscribe #rightcol div.progress div.green {height:24px;width:60px;margin:0px 50px 0px 150px;background-color: #5f6f31;border:0px;}
#wrapper.subscribe #rightcol div.progress div.grey {height:24px;width:60px;margin:0px 50px 0px 150px;background-color: #CCCCCC;border:0px;}
#wrapper.subscribe #rightcol div.progress div.fadein{height:24px;width:60px;margin:0px 50px 0px 150px;background-color: #5f6f31;border:0px;
										filter: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=#5f6f31,endColorStr=#e7711a);}
#wrapper.subscribe #rightcol div.progress div.fadeout{height:24px;width:60px;margin:0px 50px 0px 150px;background-color: #CCCCCC;border:0px;
										filter: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=#e7711a,endColorStr=#CCCCCC);}

#wrapper.subscribe #rightcol div.progress div.now {background-color: #e7711a;-moz-border-radius: 10px;border-radius: 10px;}
#wrapper.subscribe #rightcol div.progress div.done {background-color: #5f6f31;-moz-border-radius: 10px;border-radius: 10px;}
#wrapper.subscribe #rightcol div.progress div.todo {background-color: #CCCCCC;-moz-border-radius: 10px;border-radius: 10px;}
#wrapper.subscribe #rightcol div.progress div.helpdesk {margin:28px 0px 0px 0px; background-color: white;border-width:1px ;border-color:#545454;}
#wrapper.subscribe #rightcol div.progress div.helpdesk  p {color:#545454;}
#wrapper.subscribe #content table{ margin:10px 0px 0px 0px;}
#wrapper.subscribe #content form {width: 650px; border: 1px solid #666699; padding: 5px 5px 5px 5px;margin: 15px 0px 15px 0px;}

/*two-column navigation left */
#wrapper.twocolleft #content {margin: 0 0px 0 280px;}
#wrapper.twocolleft {background:white url(../img/background/header8.jpg) no-repeat center top;}
#wrapper.twocolleft #navi {width:240px; position:absolute; top:240px; color: #666; padding: 40px 40px 0 40px; left:0;}
#wrapper.twocolleft #navi li {float:left;  margin-left:18px; padding:0 10px 0 0}
#wrapper.twocolleft #navi h2 {font-weight:normal; font-size:1.4em;letter-spacing:-.05em;margin-bottom:1em;}
#wrapper.twocolleft #header h1.pagehead {color:#ebebeb; }

/*three column with menu left and right column */
#wrapper.threecol #content, #wrapper.threecol #breadcrumb { margin: 0 320px 0 280px; }
#wrapper.threecol {background:white url(../img/background/header.jpg) no-repeat center top;}
#wrapper.threecol #rightcol, #wrapper.threecol #navi {width:240px; position:absolute; top:240px; color: #666; padding: 40px 40px 0 40px}
#wrapper.threecol #rightcol {right:0px; }
#wrapper.threecol #navi {left:80px; position:fixed }
#wrapper.threecol #rightcol h2, #wrapper.threecol #navi h2 {font-weight:normal; font-size:1.4em;letter-spacing:-.05em;margin-bottom:1em;}
#wrapper.threecol #navi li { float:left;  margin-left:18px; padding:0 10px 0 0}
#wrapper.threecol #rightcol li {margin-left:18px;  min-height:50px}
#wrapper.threecol #rightcol strong {display:block; text-align:right;}
#wrapper.threecol #rightcol span, #wrapper.threecol #rightcol span strong {text-align:center;display:block;}
#wrapper.threecol #header h1.pagehead {color:#ebebeb; }
#wrapper.threecol #rightcol h3 {font-size:1.2em; padding-right:50px}
#wrapper.threecol #rightcol li.vw { background: transparent url(../img/VW-logo.jpg) no-repeat top right; margin: 0 0 10px 0; list-style-type:none; border:solid 1px #666; padding:5px;}

/*white paper */
#wrapper.whitepaper #content {margin: 0 0px 0 280px;font-family:Courier, "Courier New", monospace }
#wrapper.whitepaper {background:white url(../img/background/header8.jpg) no-repeat center top;}
#wrapper.whitepaper #navi {width:240px; position:absolute; top:240px; color: #666; padding: 40px 40px 0 40px; left:0;font-family:Courier, "Courier New", monospace}
#wrapper.whitepaper #navi h2 {font-weight:normal; font-size:1.4em;letter-spacing:-.05em;margin-bottom:1em;}
#wrapper.whitepaper #header h1.pagehead {color:#ebebeb; }
#wrapper.whitepaper #navi dd { padding-left:1em;}
/* social links */
#social { padding:20px 0px 0px 0px; text-align:right;}
#social ul {}
#social ul li {display:inline}