/*--- HTML ---*/

/*--- ITT-FLYGT -----------------------------------------------------------

Farben                                                                                                       
  ITT Gold      = R255/G166/B22  = #FFA616
  ITT Black     = R0/G0/B0       = #000000
  ITT Dark Gray = R124/G124/B124 = #7C7C7C
  White         = R255/R255/R255 = #FFFFFF

Fonts
  The primary ITT typeface, Humanist 777, is a sans serif typeface for HEADLINES.
  Secondary typeface Classical Garamond, is a serif typeface for BODY CONTENT.
  Garamond provides a well-rounded complement to Humanist 777 and visual continuity with the tagline typography.
  
  Humanist 777 and Classical Garamond are the only typefaces to be used henceforth 
  and are available as fonts for both Macintosh and PC platforms.

Fonts on Websites: 
  Always use one of the specified fonts from the Humanist 777 family for bitmapped text. 
  For HTML text, always specify Verdana, Arial or Helvetica, in that order. 

---------------------------------------------------------------------------*/


/*
rotbraun         = (701A2D)    ok
grauer rahmen    = (C0C0C0)    ?
*/


/*************
*  IE-Fix: Einige margin-right( oder left): -3px; zur Behebung des auf 
*  http://www.positioniseverything.net/explorer/dup-characters.html
*  beschriebenen Problems zusaetzlich bei floatenden DIVs eingefuegt.
*/


/* IE-Spezialitaet: Scrollbars umfaerben  -- nicht bei Flygt */


/* Allgemeines */

BODY, TABLE, TR, TD, P, INPUT, SELECT, TEXTAREA, FRAMESET, FRAME,
A, A:visited, A:link
{
  border: none;
  color: #000000;
  background-color: #ffffff;
  /* FLYGT: For HTML text, always specify Verdana, Arial or Helvetica, in that order. */
  font-family: Verdana, Arial, Helvetica;   
  font-size: 7.5pt;
  font-style: normal;
  font-weight: 500;
  line-height: 130%;
  /*letter-spacing: -0.02em;*/
  text-decoration: none;
  text-align: left;  
}

HTML
{
  overflow-x: hidden;   /* Flygt-Gebot: Du sollst keine Webinhalte mit horizontalen Scrollbalken haben. */
}

BODY
{
  background-position: center center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  margin: 0px;
  padding: 0px;
  width: 100%;
  overflow: auto;
}

BODY.iframe
{
  background-image: none;
  padding: 8px 5px 0px 5px;
  border: none;
  width: 98%
}

IFRAME
{
  border: 1px solid #C0C0C0;
  margin-right: 10px;
}

P
{
  padding: 4px 4px 0px 4px;
}

H1,H2,H3,H4,H5,H6
{
  padding: 0px 4px 0px 4px;
  margin:  2px 0px 2px 0px;
}

DIV
{
  margin: 0px;
  padding: 0px;
  border: none;
}

IMG
{
  border: none;
}

IMG.linkicon
{
  width: 8px;
  height: 8px;
}

H1
{
  font-size: 1.2em;
  font-weight: bold;  
}

H2,
.h2  /* fuer andere Verwendung, zB. in Tabellen */
{
  font-size: 1.1em;
  font-weight: bold;  
}

INPUT, SELECT, TEXTAREA
{
  width: 120px;
  border: 1px solid #C0C0C0;
  color: #000000;
}

SPAN.check INPUT,  /* SPAN version used by ASP.NET */
SPAN.radio INPUT,
INPUT.check,       /* preferred version */
INPUT.radio
{
  width: 25px  !important;
  border: none;
  text-align: left;
}

*.checkfailed
{
  /* background-color: #FFA616; */
  border: 2px solid red !important;
}

TABLE
{
  width: 95%;  
  border: none;
}

A, A:visited, A:link,
INPUT.button
{
  font-weight: bold;
  font-size: 8pt;
  color: #000000; 
  cursor: pointer;
  text-decoration: none;
}

A:active, A:hover
{
  color: #FFA616; 
  text-decoration: none;
}

/*-- Elemente im IFRAME --*/

BODY.iframe P,
BODY.iframe TABLE
{
	background-color: transparent;
}

/*-- Speziallfall Pumpen-IFRAME --*/

HTML.iframe.pump,
HTML.iframe.zub
{
  overflow: hidden;  /* Scroller bei Bedarf im Content unter(!) dem Heading anbringen */
}

BODY.iframe.pump,
BODY.iframe.zub 
{
  width: 100%;
  background-color: #FFFFFF;
  padding: 0px;
}

BODY.iframe.pump DIV#frameheading
{
  position: absolute;
  left: 0px;
  top: 0px;
  background-color: #FFA616 !important;
  height: 39px;
  width: 100%; /* 807px; */
  overflow: hidden;  
}

DIV#configArea DIV#iframe_container DIV
{ /* Heading eines IFRAME simulieren, waehrend IFRAME noch laedt */
  position: absolute;
  left: 0px;
  top: 0px;
  margin: 0px;
  padding: 0px;
  width: 100%; /* 807px; */
  overflow: hidden;  
}

DIV#configArea DIV#iframe_container DIV#simulatedheading
{ /* Heading eines IFRAME simulieren, waehrend IFRAME noch laedt */
  background-color: #FFA616 !important;
  height: 39px;
  z-index: 10;
}

DIV#configArea DIV#iframe_container DIV#iframe_inner_cont
{ /* Heading eines IFRAME simulieren, waehrend IFRAME noch laedt */
  z-index: 0;
}

DIV#configArea DIV#iframe_container DIV#iframe_inner_cont IFRAME#pumpdata
{ /* Heading eines IFRAME simulieren, waehrend IFRAME noch laedt */
  background-color: transparent;
}

BODY.iframe.pump DIV#framecaption
{
  position: absolute;
  top: 0px;
  left: 0px;
  width: 280px;
  padding: 4px 4px 0px 4px;
}

BODY.iframe.pump DIV#framecaption A
{
  background-color: transparent;
  color: #FFFFFF;  
}

BODY.iframe.pump DIV#framecaption H2
{
  color: #FFFFFF;
  font-size: 1.2em;
}

BODY.iframe.pump DIV#frameoptions
{
  position: absolute;
  top: 0px;
  left: 280px;
  width: 520px;
  text-align: left;
  white-space: nowrap;
}

BODY.iframe.pump DIV#frameoptions A.subpage
{
  position: static;
  width: 32px;
  height: 32px;
  margin: 0px 2px 2px 0px;
  overflow: hidden;
  float: left;
  background-color: transparent !important;
}

BODY.iframe.pump DIV#content
{ /* Hilfs-DIV fuer den content des IFRAMEs, der ja unter dem Heading liegen soll */
  position: absolute;
  width: 100%;
  height: 568px;
  overflow: auto;
  top: 40px;
  left: 0px;
  background-color: #FFFFFF;
}


BODY.iframe.zub DIV#content
{ /* Hilfs-DIV fuer den content des IFRAMEs */
  position: absolute;
  width: 100%;
  height: 100%;
  overflow: auto;
  top: 0px;
  left: 0px;
  background-color: #FFFFFF;
}


BODY.iframe.pump DIV.Container INPUT.radio,
BODY.iframe.pump DIV.Container INPUT.check,
DIV#konfigsect INPUT.radio,
DIV#konfigsect INPUT.check 
{
  background-color: #FFFFFF;
}


DIV.hiddendata
{ 
  /* fuer Scripts: absolut unsichtbarer Datencontainer, dynamisch generierte zusaetzliche Formularfelder, usw. */
  visibility: hidden;
  position: absolute;
  width: 0px;
  height: 0px;
  border: 0px none;
  margin: 0px;
  padding: 0px;  
}

/*--- grundlegende Platzaufteilung ---*/

DIV#header 
{
  position: relative;
  overflow: hidden;
  z-index: 0;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 75px;
  padding: 0px 0px 0px 0px;
  border: none;
  background-color: #FFFFFF;
  color: #000000;
}

DIV#navlinks
{ /* breadcrumbs-navigation */
  position: relative;
  top: 0px;
  left: 0px;
  width: 100%;
  clear: both;
  font-size: 8pt;
  height: 18px;
  margin: 0px;
  border-top: 2px solid #7C7C7C;
  padding: 0px;
  background-color: #FFFFFF;
  color: #000000;
  overflow: hidden;
}

DIV#bodycontent   
{ /* Datenbereich */
  position: relative;
  float: inherit;
  /* margin-right: -3px;  /* IE-Fix */
  left: 0px;
  top: 0px;
  width: 100%;
  border: none; 
  height: auto;
  overflow: auto;
  overflow-x: hidden;  /* an ITT page should never scroll in X-direction */
  padding: 0px;
  z-index: 40;   /* im Konfliktfall ueber dem footer */
}

DIV#minheight
{ /* Stellt minimale Contenthoehe sicher. Unsichtbar, wirkt sich aber trotzdem auf die Platzaufteilung aus */
  position: relative;  /* im Fluss lassen */
  float: right;        /* aus dem Weg damit */
  height: 600px;       /* hier Minimalhoehe einstellen */
  z-index: -4000;      /* ganz weit unten */
  top: 0px;
  padding: 0px;
  border: none;
  right: 2px;
  width: 1px;
  margin: 0px;
  margin-left: -3px;  /* IE-Fix */
  visibility: hide;  
  visibility: hidden;
  /*
   Beobachtung JKX
   Manchmal bringt der Firefox einen horizontalen scollbalken um nach rechts zu scollen und zwar nur wenige pixel
   wenn das immer so ist dann hier einpflanzen, ansonsten beim jeweiligen HTML
  */
   margin-right: 3px; /* FireFox-Fix */ 
  
}

DIV#footer
{
  /* das ist fuer alle footer, die Erweiterungen fuer den boxed footer sind weiter unten */
  background-color: transparent;
  padding: 0px 2px 0px 2px;
  clear: both;         /* unterhalb jeglichen (gefloateten) contents */
  height: 20px !important;
  width: 99%;
  overflow: hidden;
}


/*--- Platzaufteilung Content ---*/

DIV#leftpanel   
{ /* zweispaltig, linke Seite */
  position: relative;
  float: left;
  margin-right: -3px;  /* IE-Fix */
  left: 0px;
  top: 0px;
  width: 49%;
  border: none;
  z-index: 60;
}

DIV#rightpanel
{ /* zweispaltig, rechte Seite */
  position: relative;
  float: left;
  margin-right: -3px;  /* IE-Fix */
  right: 0px;
  top: 0px;
  width: 49%;
  border: none;
  z-index: 60;
}

DIV#toppanel,
DIV.nextpanel
{ /* einspaltig untereinander */
  position: relative;
  left: 30px;
  top: 0px;
  width: 95%;
  border: none;
  height: auto;
  z-index: 50;
}

/*--- Formatierung ---*/

DIV.fmtSection
{
  border: none; 
  border-width: 0px; 
  /*margin: 2px 5px 5px 0px; */
  margin: 2px 0px 5px 0px; 
  padding: 0px;
  background-color: #FFFFFF;
}

DIV.fmtSection.noborder
{
  border: none;     /* fuer bestimmte Layout-Spezialfaelle */
}

DIV.fmtSection H1
{
  position: relative;
  top: 0px;
  display: block;
  background-color: #FFA616;
  margin: 0px 0px 4px 0px;
  padding: 3px; 
  border: none;
  color: #FFFFFF;
}

DIV.fmtSection P,
DIV.fmtSection H2,
DIV.fmtSection DIV
{
  margin: 4px 0px 0px 0px;
  padding: 0px 0px 4px 6px;
  border: none;
}

DIV.fmtSection SELECT,
DIV.fmtSection INPUT,
DIV.fmtSection TEXTAREA
{  
  width: 96%;    /* eine Defaultbreite fuer alle Eingabeelemente */
}

DIV.fmtSection P.prodtext
{
  /* multiline text, CSS class reserved for future use */
}


/*--- Spezialfall Pumpenliste (Suchergebnis) ---*/

DIV#configArea DIV.fmtSection H1
{
  background-image: none;
  height: 31px;  /* = 39-padding */
  padding: 4px 0px 4px 4px;
  border-bottom-width: 0px;
  overflow: hidden;
}

/*--- Inhalt Footer ---*/

DIV#footer DIV
{
  width: 100%;
}

DIV#footer DIV TABLE TD#TD1
{
  text-align: center;
}

DIV#footer P
{
  background: transparent;
  color: #000000;
  font-weight: bold;
  text-align: center;
  padding: 0px;
  margin: 0px;
  white-space: nowrap;
}

DIV#footer  A
{
  font-size: 7.5pt !important;
  color: inherit !important;
}

/*--- Buttons und buttonartige Links ---*/

A.action, 
A.action:visited, 
A.action:link,
A.action:focus,
A.tool, 
A.tool:visited, 
A.tool:link,
A.tool:focus,
INPUT.button
{
  float: left;   /* damit wird display:block, siehe RFC */
  background-color: transparent;
  background-image: url(html/picture/leer.gif);
  background-repeat: no-repeat;
  background-position: left center;
  color: #000000;
  border: none;
  height: 20px;    /* fuer IE vor 6.0 */
  he\ight: 15px;   /* fuer IE ab 6.0 und alle anderen */
  padding: 2px 0px 0px 20px;
  width: auto; 
  text-align: left;
  vertical-align: middle;
  white-space: nowrap;
  text-decoration: none;
  font-size: 8pt;
  font-weight: bold;
  margin: 4px 5px 0px 0px;
}


A.tool, 
A.tool:visited, 
A.tool:link,
A.tool:focus
{
  background-image: url(html/picture/btn_tool_default.gif);   /* default, damit man etwas sieht */
  padding: 0px 0px 0px 25px;  /* kein Text, trotzdem Breite generieren */
  width: 1px; 
  height: 25px;
  overflow: hidden;
}


A.action:hover,
A.tool:hover
{
  color: #FFA616; 
  background-color: transparent;
  text-decoration: none;
}


A.action:active,
A.tool:active
{
  color: #FFA616; 
  background-color: transparent;
  text-decoration: none;
}


P.actionbuttons
{
  height: 30px;   /* eine Zeile Buttons */
}


/*--- ITT-Links mit Pfeil davor --*/

A.arrow, 
A.arrow:visited, 
A.arrow:link
{
  background-color: transparent;
  background-image: url(html/picture/link_arrow.gif);
  background-position: left center;
  background-repeat: no-repeat;
  padding-left: 9px !important;
}

A.arrow:active, 
A.arrow:hover
{
}

A.down, 
A.down:visited, 
A.down:link,
A.down:active, 
A.down:hover
{
  background-image: url(html/picture/link_arrow_down.gif) !important;
}

A.linklist
{
  font-weight: normal !important;   /* damit sich diese optisch etwas von den anderen Links abheben */
}

/*--- Links zu Unterseiten im IFRAME ---*/

A.subpage, 
A.subpage:visited, 
A.subpage:link,
A.subpage:focus
{
  display: block;
  width: 121px;   /* hier 131-rand */
  margin-left: 2px;
  margin-right: 2px;
  padding: 4px 0px 4px 2px;
  font-size: 9px;  /* according to flygt.com */
  font-weight: bold;
  text-decoration: none !important;
  color: #000000 !important;
  background-color: #FFFFFF !important;
  border-bottom: solid 1px #FFA616;
}

A.subpage:hover,
A.subpage:active,
A.subpage.active,
A.subpage.active:visited,
A.subpage.active:link,
A.subpage.active:hover,
A.subpage.active:active
{
  color: #FFA616 !important;
}


/* Sonderfall: normaler Link in der Subpage-Abteilung. 
   Kombinierte Klassen bringen den IE 6 manchmal durcheinander, deshalb mehr oder weniger ein Duplikat von subpage.
*/

A.subpage_stdlink,
SPAN.subpage_stdlink
{
  display: block;
  width: 121px;   /* hier 131-rand */
  margin-left: 2px;
  margin-right: 2px;
  padding: 4px 0px 4px 2px;
  font-size: 9px;  /* according to flygt.com */
  font-weight: bold;
  text-decoration: none !important;
  color: #000000 !important;
  background-color: #FFFFFF !important;
  border-bottom: solid 1px #FFA616;
}

SPAN.subpage_stdlink
{
  color: #000000 !important;
}



/*--- Iconlinks ---*/

A.icon
{
  background-image: url(html/picture/leer.gif); 
  background-repeat: no-repeat;
  background-position: left center;
  height: 30px;
  border-style: none;
  padding-left: 10px;   /* schafft Platz zum IMG, aber ohne Underline */
  margin-bottom: 0px;
  display: block;
  margin-top: 10px;
}

DIV.fmtSection A.icon IMG
{
  border-style: none;
  /* border: 1px solid #000000;   We do not intend to have the borders right now. - Magnus 20.09.07 */
  position: relative; 
  float: left;
  /*  margin-right: -3px;  /* IE-Fix */
  top: 0px;
  left: -10px;    /* macht fuer IMG das Padding des umgebenden A rueckgaengig */
  width: 33px;
  height: 33px;
}

/*--- Mainmenu ---*/

P.menuitem 
{
  border-bottom: 1px solid #FFA616 !important;
  padding-bottom: 0px !important;
  width: 99% !important;
  height: 100%;
}

P.menuitem A.icon 
{ 
  background: transparent;
  margin-top: 0px;
}


P.menuitem A.icon SPAN.menuitemtext
{ 
  background-image: url(html/picture/link_arrow.gif) !important;
  background-position: 0px 5px !important;
  background-repeat: no-repeat !important;
  padding-left: 9px !important;
}


/*--- Katalogbuttons ---*/

A.etacat
{
  background-image: url(html/picture/leer.gif); 
  background-repeat: no-repeat;
  background-position: left center;
  height: 85px;
  border-style: none;
  padding-left: 10px;   /* schafft Platz zum IMG, aber ohne Underline */
  margin-bottom: 5px;
  display: block;
}

A.etacat IMG
{
  border-style: none;
  position: relative; 
  float: left;
  top: 0px;
  left: -10px;    /* macht fuer IMG das Padding des umgebenden A rueckgaengig */
  width: 80px;
  height: 80px;
}

/*--- spezielle actionbuttons ---*/

/* OK */
A.action.submit        {  background-image: url(html/picture/btn_Ok.gif)         !important; }
A.action.submit:hover  {  background-image: url(html/picture/btn_Ok.gif)         !important; }
A.action.submit:active {  background-image: url(html/picture/btn_Ok_hi.gif)      !important; }

/* Hinzu */
A.action.add           {  background-image: url(html/picture/btn_plus.gif)       !important; }
A.action.add:hover     {  background-image: url(html/picture/btn_plus.gif)       !important; }
A.action.add:active    {  background-image: url(html/picture/btn_plus_hi.gif)    !important; }

/* Entf */
A.action.del           {  background-image: url(html/picture/btn_minus.gif)      !important; }
A.action.del:hover     {  background-image: url(html/picture/btn_minus.gif)      !important; }
A.action.del:active    {  background-image: url(html/picture/btn_minus_hi.gif)   !important; }

/* Print */
A.action.print         {  background-image: url(html/picture/btn_Print.gif)      !important; }
A.action.print:hover   {  background-image: url(html/picture/btn_Print.gif)      !important; }
A.action.print:active  {  background-image: url(html/picture/btn_Print_hi.gif)   !important; }

/* Download */
A.action.download        {  background-image: url(html/picture/btn_download.gif)    !important; }
A.action.download:hover  {  background-image: url(html/picture/btn_download.gif)    !important; }
A.action.download:active {  background-image: url(html/picture/btn_download_hi.gif) !important; }

/* Question */
A.action.question        {  background-image: url(html/picture/btn_question.gif)    !important; }
A.action.question:hover  {  background-image: url(html/picture/btn_question.gif)    !important; }
A.action.question:active {  background-image: url(html/picture/btn_question_hi.gif) !important; }

/* Select_all */
A.action.Select_all        {  background-image: url(html/picture/btn_Select_all.gif)   !important; }
A.action.Select_all:hover  {  background-image: url(html/picture/btn_Select_all.gif)   !important; }
A.action.Select_all:active {  background-image: url(html/picture/btn_Select_all_hi.gif)!important; }

/* Select */
A.action.Select          {  background-image: url(html/picture/btn_Select.gif)       !important; }
A.action.Select:hover    {  background-image: url(html/picture/btn_Select.gif)       !important; }
A.action.Select:active   {  background-image: url(html/picture/btn_Select_hi.gif)    !important; }

/* UnSelect */
A.action.UnSelect        {  background-image: url(html/picture/btn_UnSelect.gif)       !important; }
A.action.UnSelect:hover  {  background-image: url(html/picture/btn_UnSelect.gif)       !important; }
A.action.UnSelect:active {  background-image: url(html/picture/btn_UnSelect_hi.gif)    !important; }

/* UnSelect_all */
A.action.UnSelect_all        {  background-image: url(html/picture/btn_UnSelect_all.gif)   !important; }
A.action.UnSelect_all:hover  {  background-image: url(html/picture/btn_UnSelect_all.gif)   !important; }
A.action.UnSelect_all:active {  background-image: url(html/picture/btn_UnSelect_all_hi.gif)!important; }

/* Reload */
A.tool.tool_reload         {  background-image: url(html/picture/btn_reload.gif)     !important; }
A.tool.tool_reload:hover   {  background-image: url(html/picture/btn_reload.gif)     !important; }
A.tool.tool_reload:active  {  background-image: url(html/picture/btn_reload_hi.gif)  !important; }

/* Suche */
A.action.search        {  background-image: url(html/picture/btn_lupe.gif)       !important; }
A.action.search:hover  {  background-image: url(html/picture/btn_lupe.gif)       !important; }
A.action.search:active {  background-image: url(html/picture/btn_lupe_hi.gif)    !important; }

/* Reload */
A.action.reload        {  background-image: url(html/picture/btn_reload.gif)     !important; }
A.action.reload:hover  {  background-image: url(html/picture/btn_reload.gif)     !important; }
A.action.reload:active {  background-image: url(html/picture/btn_reload_hi.gif)  !important; }

/* Clear */
A.action.clear         {  background-image: url(html/picture/btn_clear.gif)     !important; }
A.action.clear:hover   {  background-image: url(html/picture/btn_clear.gif)     !important; }
A.action.clear:active  {  background-image: url(html/picture/btn_clear_hi.gif)  !important; }

/* Cancel */
A.action.cancel        {  background-image: url(html/picture/btn_cancel.gif)     !important; }
A.action.cancel:hover  {  background-image: url(html/picture/btn_cancel.gif)     !important; }
A.action.cancel:active {  background-image: url(html/picture/btn_cancel_hi.gif)  !important; }

/* Edit */
A.action.edit          {  background-image: url(html/picture/btn_edit.gif)       !important; }
A.action.edit:hover    {  background-image: url(html/picture/btn_edit.gif)       !important; }
A.action.edit:active   {  background-image: url(html/picture/btn_edit_hi.gif)    !important; }

/* Edit1 */
A.action.edit1         {  background-image: url(html/picture/btn_edit1.gif)      !important; }
A.action.edit1:hover   {  background-image: url(html/picture/btn_edit1.gif)      !important; }
A.action.edit1:active  {  background-image: url(html/picture/btn_edit1_hi.gif)   !important; }

/* FlygtInfo */
A.action.info          {  background-image: url(html/picture/flygt_infobtn.gif)       !important; }
A.action.info:hover    {  background-image: url(html/picture/flygt_infobtn.gif)       !important; }
A.action.info:active   {  background-image: url(html/picture/flygt_infobtn_hi.gif)    !important; }




/*--- kleine Toolbuttons ---*/
/* WICHTIG: Ohne zusaetzliches "tool_" kriegts der IE 6 leider nicht gebacken, der Idiot */

/* OK */
A.tool.tool_submit         {  background-image: url(html/picture/btn_Ok.gif)         !important; }
A.tool.tool_submit:hover   {  background-image: url(html/picture/btn_Ok.gif)         !important; }
A.tool.tool_submit:active  {  background-image: url(html/picture/btn_Ok_hi.gif)      !important; }

/* Clear */
A.tool.tool_clear          {  background-image: url(html/picture/btn_cancel.gif)     !important; }
A.tool.tool_clear:hover    {  background-image: url(html/picture/btn_cancel.gif)     !important; }
A.tool.tool_clear:active   {  background-image: url(html/picture/btn_cancel_hi.gif)  !important; }

/* Cancel (momentan identisch zu Clear) */
A.tool.tool_cancel         {  background-image: url(html/picture/btn_cancel.gif)     !important; }
A.tool.tool_cancel:hover   {  background-image: url(html/picture/btn_cancel.gif)     !important; }
A.tool.tool_cancel:active  {  background-image: url(html/picture/btn_cancel_hi.gif)  !important; }

/* Hinzu */
A.tool.tool_add            {  background-image: url(html/picture/btn_plus.gif)       !important; }
A.tool.tool_add:hover      {  background-image: url(html/picture/btn_plus.gif)       !important; }
A.tool.tool_add:active     {  background-image: url(html/picture/btn_plus_hi.gif)    !important; }

/* Entf */
A.tool.tool_del            {  background-image: url(html/picture/btn_minus.gif)      !important; }
A.tool.tool_del:hover      {  background-image: url(html/picture/btn_minus.gif)      !important; }
A.tool.tool_del:active     {  background-image: url(html/picture/btn_minus_hi.gif)   !important; }

/* Edit */
A.tool.tool_edit           {  background-image: url(html/picture/btn_edit.gif)       !important; }
A.tool.tool_edit:hover     {  background-image: url(html/picture/btn_edit.gif)       !important; }
A.tool.tool_edit:active    {  background-image: url(html/picture/btn_edit_hi.gif)    !important; }

/* Edit1 */
A.tool.tool_edit1          {  background-image: url(html/picture/btn_edit1.gif)      !important; }
A.tool.tool_edit1:hover    {  background-image: url(html/picture/btn_edit1.gif)      !important; }
A.tool.tool_edit1:active   {  background-image: url(html/picture/btn_edit1_hi.gif)   !important; }

/* Tree */
A.tool.tool_tree           {  background-image: url(html/picture/btn_tree.gif)       !important; }
A.tool.tool_tree:hover     {  background-image: url(html/picture/btn_tree.gif)       !important; }
A.tool.tool_tree:active    {  background-image: url(html/picture/btn_tree_hi.gif)    !important; }

/* select all */
A.tool.tool_selall         {  background-image: url(html/picture/btn_selall.gif)     !important; }
A.tool.tool_selall:hover   {  background-image: url(html/picture/btn_selall.gif)     !important; }
A.tool.tool_selall:active  {  background-image: url(html/picture/btn_selall_hi.gif)  !important; }

/* unselect all */
A.tool.tool_selnone        {  background-image: url(html/picture/btn_selnone.gif)    !important; }
A.tool.tool_selnone:hover  {  background-image: url(html/picture/btn_selnone.gif)    !important; }
A.tool.tool_selnone:active {  background-image: url(html/picture/btn_selnone_hi.gif) !important; }

/* Kennfeld */
A.tool.tool_kennf          {  background-image: url(html/picture/btn_kennf.gif)      !important; }
A.tool.tool_kennf:hover    {  background-image: url(html/picture/btn_kennf.gif)      !important; }
A.tool.tool_kennf:active   {  background-image: url(html/picture/btn_kennf_hi.gif)   !important; }

/* ein/ausblenden */
A.tool.tool_inout          {  background-image: url(html/picture/btn_inout.gif)      !important; }
A.tool.tool_inout:hover    {  background-image: url(html/picture/btn_inout.gif)      !important; }
A.tool.tool_inout:active   {  background-image: url(html/picture/btn_inout_hi.gif)   !important; }

/* Liste */
A.tool.tool_list           {  background-image: url(html/picture/btn_list.gif)      !important; }
A.tool.tool_list:hover     {  background-image: url(html/picture/btn_list.gif)      !important; }
A.tool.tool_list:active    {  background-image: url(html/picture/btn_list_hi.gif)   !important; }


/* Kleine Buttons nur mit Bild ohne Beschriftung */
A.action.submit.small,
A.action.add.small,
A.action.del.small,
A.action.search.small,
A.action.reload.small,
A.action.clear.small,
A.action.cancel.small,
A.action.edit.small,
A.action.info.small
{
  width     : 0px !important; /* IE will ein important*/
  min-width : 0px;
  margin    : 0px; 
  padding-right: 0px;  
  float: left; /* Na das ist nicht so gut...*/ 
}

/*--- formulartabellen ---*/

TABLE.form
{
  width: 99%;        /* weil haeufigster Einsatzfall */
  border: none;
  empty-cells: show;
  border-spacing: 1px;
  table-layout: fixed;
  border-collapse: collapse; 
}

TABLE.form.werte     /* nicht mit wertetabelle verwechseln */
{
  border: 1px solid #C0C0C0 !important;
}

TABLE.form TD
{
  border: none;
  vertical-align: top;
  padding-top: 3px;
  text-align: left;
  white-space: nowrap;
  padding-right: 5px;
}

/* Breiten fuer reduziertes Layout (lbl,edt) */
TABLE.form TH.lbl2  { width: 40%;  text-align: right; white-space: normal; } /* HEAD */
TABLE.form TD.lbl2  { width: 40%;  text-align: right; white-space: normal; }
TABLE.form TD.edt2  { width: 60%;  padding-top: 0px; }
TABLE.form TD.txt2  { width: 60%;  }

/* Breiten fuer normales Layout (lbl,edt,dim) */
TABLE.form TH.lbl3  { width: 56%;  text-align: right; white-space: normal; } /* HEAD */
TABLE.form TD.lbl3  { width: 56%;  text-align: right; white-space: normal; }
TABLE.form TD.edt3  { width: 36%;  padding-top: 0px; }
TABLE.form TD.txt3  { width: 36%;  }
TABLE.form TD.dim3  { width: 8%;   white-space: normal; }

/* Breiten fuer doppeltes Layout (lbl,edt,dim,sep,lbl,edt,dim) */
TABLE.form TH.lbl6  { width: 25%;   text-align: right; white-space: normal; } /* HEAD */
TABLE.form TD.lbl6  { width: 25%;   text-align: right; white-space: normal; }
TABLE.form TD.edt6  { width: 14.5%; padding-top: 0px; }
TABLE.form TD.txt6  { width: 14.5%; }
TABLE.form TD.dim6  { width: 10%;   white-space: normal; }
TABLE.form TD.sep6  { width: 1%;}

/* Spezialfaelle */
TABLE.form TD.edtXfull  { width: 100%; padding-top: 0px; }
TABLE.form TD.edt6col6  { width: 75%; padding-top: 0px; }


/* Zelleninhalte */
TABLE.form SELECT,
TABLE.form INPUT
{  
  width: 95%; 
}

TABLE.form SELECT
{  
  border-spacing: 0px;
}

/* diese Elemente teilen sich ueblicherweise eine Zeile */
TABLE.form INPUT.edCtry   { width:  8% !important; position: relative; left:  0%; top: 0px; margin-right: 1%; }
TABLE.form INPUT.edZip    { width: 20% !important; position: relative; left:  0%; top: 0px; margin-right: 1%; }
TABLE.form INPUT.edCity   { width: 52% !important; position: relative; right: 0%; top: 0px; }

TABLE.form INPUT.button 
{
  width: 120px;
}

TABLE.form TR.hsep
{ 
  height: 1px;
  padding: 0px 0px 0px 5px;
  overflow: hidden;
}

TABLE.form TR.hsep TD
{ 
  height: 1px;
  line-height: 1px;
  overflow: hidden;
  padding: 0px;
  border-top: 1px solid #C0C0C0;
}

TABLE.form TR.hsep.dark TD
{
  border-color: #000000;
}

TABLE.form TR.hsep TD.noborder
{ 
  border: none !important;   /* explizites Unterdruecken der border */
}


/*--- zusaetzliche Praezisierungen fuer PanelBar ---*/

/* Breiten etwas anders, da die Daten hier viel Platz brauchen */
TABLE.form TD.pbar.lbl3  { width: 40%; }
TABLE.form TD.pbar.edt3  { width: 52%; }
TABLE.form TD.pbar.txt3  { width: 52%; white-space: normal; }
TABLE.form TD.pbar.dim3  { width: 8%; }

/* Projekt-Header in bdyStart */

DIV#basket_data  TD.lbl2,
DIV#basket_data  TD.lbl3,
DIV#basket_data  TD.lbl6
{
  text-align: left;     /* AEND #1579 */
}


/*--- Caption ---*/

DIV#header_left
{
  position: absolute;
  top: 0px;
  left: 0px;
  background: url("html/picture/rund_li.gif") no-repeat top left;
  width: 6px;
  height: 6px;
  z-index: 40;
}


DIV#header_right
{
  position: absolute;
  top: 49px;
  right: 5px;
  background: url("html/logo/itt_wastewater_logo.jpg") no-repeat top right;
  width: 280px;
  height: 75px;
  z-index: 40;
}


DIV#sitelogo
{
  position: absolute;
  top: 0px;
  left: 0px;
  width: 235px;
  height: 75px;
  z-index: 3;
}

DIV#sitelogo A#start
{
  background: transparent;
  height: auto;
  width: auto; 
  text-align: left;
  margin: 0px;
  padding: 0px;
}

DIV#sitelogo IMG
{
  position: relative;
  right: 0px;
  top: 0px;
  width: 235px;
  height: 75px;
  background: none;
}

DIV#sitecaption
{
  position: absolute;
  top: 0px;
  left: 0px;
  height: 100%;
  width: 100%;
  overflow: hidden;
  padding: 0px;
  text-align: left;
  color: #FFFFFF;  /* fuellt nur den Hintergrund, bei FLYGT kein Text */
  background-color: #FFFFFF;
  font-size: 11pt;
  font-weight: bold;
  font-style: italic;
  letter-spacing: 0.18em;
  white-space: nowrap;
}


DIV#verlauf
{ /* Farbverlauf */
  position: absolute;
  top: 0px;
  left: 17em;
  height: 100%;
  width: 400px;
  background-image: url("html/picture/verlauf.gif");
  background-repeat: repeat-y;
  background-position: 0px 0px;
  background-color: #FFFFFF;
  padding: 0px;
  color: #FFFFFF;
  font-size: 11pt;
  white-space: nowrap;
}


/*--- Info, Warning, Error, Help ---*/

DIV.infopanel
{
  position: absolute;
  top: 150px;
  left: 250px;
  height: auto;
  width: 40%;
  overflow: visible;
}

DIV.infopanel H1
{
  margin-bottom: 10px;	
}

DIV.infopanel P.error,
P.infopanel.error,
SPAN.error
{ /* Fehlertexte zusaetzlich */
  color: red;
}

DIV.infopanel P.warning,
P.infopanel.warning,
SPAN.warning
{ /* Warnungen zusaetzlich */
  color: #FFA616;
}

DIV.infopanel P.success,
P.infopanel.success,
SPAN.success
{ /* Erfolgstexte zusaetzlich */
  color: #000000;
}

*.helpText    
{
  /* kurze lokale Info- oder Hilfstexte */	
  font-style: italic;
}

.required
{
  padding-right: 14px !important;
  background-image: url(html/picture/required.gif);
  background-repeat: no-repeat;
  background-position: right 0.3em;
  width: 12px;
  height: 12px;
}


/*--- Zusatzformatierung StartUpScreen ---*/

.startupheading
{
  font-size: 2em;
  font-weight: bold;	
  color: #FFA616;
  letter-spacing: -1px;
}

/*--- breadcrumbs-Navigation ---*/

DIV#navlinks P
{
  padding: 2px 0px 0px 5px;
  margin: 0px;
  font-size: 9px;
  font-weight: normal;
  height: 16px;
  color: #000000;
  background-color: transparent;
}

DIV#navlinks SPAN.navpfeil
{
  display: inline-block;
  position: relative;
  top: -1px;
  background-color: transparent;
  background-image: url(html/picture/nav_arrow.gif);
  background-repeat: no-repeat;
  background-position: left top;
  width: 11px;
  height: 11px;
  padding: 0px;
  margin: 0px;
  border: none 0px;
}

DIV#navlinks A, 
DIV#navlinks A:visited, 
DIV#navlinks A:link,
DIV#navlinks A:focus
{
  padding: 3px 0px 3px 0px;	 
  font-size: 10px;
  font-weight: normal;
  color: #000000;
  background-color: transparent;
  background-position: 1px 2px;
  background-image: none;  /* url(html/picture/nav_arrow.gif); */ /* FLYGT */
  background-repeat: no-repeat;
  text-decoration: none;
}

DIV#navlinks A:hover
{
  color: #FFA616;
  background-color: transparent;
  text-decoration: none;
}

DIV#navlinks A:active,
DIV#navlinks A.active,
DIV#navlinks A.active:visited
{
  color: #666666;   
  text-decoration: none;
  background-color: #FFFFFF;
}

DIV#navlinks A.active:hover
{
  text-decoration: none;
}

DIV#navlinks DIV#userlogin
{
  position: absolute; 
  top: 2px;
  right: 10px;
  width: auto; 
  height: 100%; 
  text-align: right; 
  /* color: #FFFFFF;    FLYGT */
}

DIV#userloginhint
/* Hilfslayer fuer den Hinttext */
{
  position: absolute;
  right: 60px;
  top: 20px; 
  width: auto; 
  height: auto; 
  background-color: transparent;
  background-image: url(html/picture/transp_gold.png);
  border: solid 1px #7C7C7C;
  color: #404040;
  font-size: 9px;
  padding: 2px;
  z-index: 2000;  
  visibility: hide;    
  visibility: hidden;
}


DIV#navlinks DIV#userlogin P
{
  text-align: right; 
  display: inline;
}

DIV#navlinks DIV#userlogin A
{
  /* keine Pfeilgrafik davor */
  background-image: none !important;
  background-repeat: no-repeat !important;
}

/*-- Quicklogin --*/

A#quicklogin
{
	font-weight: bolder !important;
}

/*--- Listen, Pumpenliste, Teileliste ---*/

TABLE.Common   /* grundlegende Formatierung */
{
  table-layout: fixed;
  border-collapse: collapse; 
  border-spacing: 0; /* entspr. cellspacing: 0 */
  border: none;
  background-color: #FFFFFF;
  width: 100%;     /* = innere Tabelle x ScrollArea */
  padding: 0px;
  margin: 0px;
}
                            
DIV.ScrollArea.Common
{
  background-color: #FFFFFF;
  height: auto;
  width: 100%;        /* Platz fuer Scroller lassen, sonst Kollisionen */
  overflow-x: hidden;
  overflow-y: auto;
  padding: 0px !important;
  margin: 0px !important;
}

DIV.ScrollArea.Common TABLE,         /* innere Tabelle */
DIV.ScrollArea.Common TABLE.Common  
{
  padding: 0px;
	margin: 0px;
  width: 100%;       /* geringfuegig Platz lassen, sonst Kollisionen */
  left: 0px;
  top: 0px;
}

TABLE.Common THEAD.Common TR,
TABLE.Common TFOOT.Common TR,
TABLE.Common THEAD.Common TR TH,
TABLE.Common TFOOT.Common TR TD
{ 
  padding-left: 2px; 
  padding-right: 2px; 
	font-weight: bold;
  color: #FFFFFF; 
  background-color: #7C7C7C;
}

DIV.CommonHeadFootBackground  
{ /* Hilfskonstrukt, um die volle Breite bei Header/Footer-Tabelle zu simulieren */
  width: 100%;
  margin: 0px !important;
  padding: 0px !important;
  border:  0px none !important;
  overflow: hidden !important;
  background-color: #7C7C7C;   /* wie Header/Footer */
  height: auto;    /* wie Header/Footer */
}

TABLE.Common TH A,  
TABLE.Common TH A:visited,  
TABLE.Common TH A:link
{ 
  font-weight: bold;
  background-color: transparent; 
  color: #FFFFFF; 
  white-space: nowrap;
}

TABLE.Common TH A:hover,  
TABLE.Common TH A:active,  
TABLE.Common TH A.active
{ 
  text-decoration: none;
  color: #FFA616 !important;
}

TABLE.Common TR TH,
TABLE.Common TR TD
{ 
  white-space: nowrap;
  padding-left: 2px; 
  padding-right: 2px; 
  overflow: hidden; 
}

/* aktuelle Zeile als anklickbar anzeigen durch Mauszeiger*/
TABLE.Common TR TD
{
  cursor: pointer;
}

TABLE.Common TR.Even TD
{ 
  color: #000000;
  background-color: #FFFFFF;
}

TABLE.Common TR.Odd TD
{ 
  color: #000000;
  background-color: #F0F0F0;
}

TABLE.Common TR INPUT.check
{ 
  background-color: transparent; 
  width: 20px;
  margin-left: 0px;
  margin-right: 0px;
}

TABLE.Common TR.Odd A
{ 
  background-color: transparent; 
}

/* Focusierung*/
TABLE.Common TR.Focused TD,
TABLE.Common TR.Odd.Focused TD,      /* erst Even/Odd, dann Focused - sonst spinnt der IE */
TABLE.Common TR.Even.Focused TD,
TABLE.Common TR.Odd.Focused TD A,
TABLE.Common TR.Even.Focused TD A
{ /* fokussierte Zeilen: alles mit important ueberstimmen */
  background-color: #FFA616  !important;
  color: #000000  !important;
}

/* Selektion*/
TABLE.Common TR.Selection TD,
TABLE.Common TR.Odd.Selection TD,      
TABLE.Common TR.Even.Selection TD
{ 
   font-style: italic;
   font-weight: bold;
}

/* Gruppenzugehoerigkeit*/
TABLE.Common TR.Group TD,
TABLE.Common TR.Group TD A { font-style: italic;}

TABLE.Common TD A, 
TABLE.Common TD A:visited,
TABLE.Common TD A:link
{ 
  white-space: nowrap;
  background-color: transparent; 
  background-image: none;
  border: none;
  padding: 0px;
  height: 1.2em;
  width: auto;
}

TABLE.Common TD A:hover,  
TABLE.Common TD A:active,  
TABLE.Common TD A.active
{ 
  font-weight: bold;
  color: #FFA616 !important;
  background-color: transparent !important;
}

TABLE.Common TR.active TD
{ /* manchmal geht es nur so */
  font-weight: bold;
  color: #FFA616 !important;
}

/* grundlegende Ausrichtung */
TABLE.Common TR TD.left,   TABLE.Common TR TH.left   { text-align: left;   }
TABLE.Common TR TD.right,  TABLE.Common TR TH.right  { text-align: right;  }
TABLE.Common TR TD.center, TABLE.Common TR TH.center { text-align: center; }


/* defaults etwas anders */
TH.Eta    { padding-left: 2px; text-align: left; color: #7C7C7C; }
TD.Eta    { padding-left: 2px; padding-right: 2px;  vertical-align: text-top; }


/* Pumpenliste - Spalten und Spezialitaeten  */
/* Dynamische Spalten - JKX
TH.scroll           { width: 16px; text-align: left;  }
TH.waste, TD.waste	{ width: 20px; text-align: left;  }
TH.make,  TD.make		{ width: 90px; text-align: left;  }
TH.baur,  TD.baur		{ width: 180px; text-align: left; }
TH.bez,   TD.bez		{ width: 250px; text-align: left;  }
TH.Q1,    TD.Q1		  { width: 75px; text-align: right;  }
TH.H1,    TD.H1  		{ width: 50px; text-align: right;  }
TH.dQ,    TD.dQ	  	{ width: 50px; text-align: right;  }
TH.dH,    TD.dH		  { width: 50px; text-align: right;  }
TH.wirk,  TD.wirk		{ width: 50px; text-align: right;  }
TH.drz,   TD.drz		{ width: 50px; text-align: right;  }
TH.pwr,   TD.pwr		{ width: 50px; text-align: right;  }
TH.lfr,   TD.lfr		{ width: 50px; text-align: right;  }
TH.imp,   TD.imp		{ width: 50px; text-align: left;  }
TH.preis, TD.preis  { width: 80px; text-align: right;  }   
*/          

IMG.waste	{ width: 16px; height: 16px; border: none;  }

/* #1727: Flygt-Logo neben den Wastel */
DIV#pulist TD.waste	
{ 
  background-image: url(html/logo/flygt_50x17.gif);
  background-repeat: no-repeat;
  background-position: 23px center;  
}


/* ErsatzteilListe - Spalten und Spezialitaeten  */
/*
TH.Eta.Check,
TD.Eta.Check     { width: 25px !important; text-align: left;  }
TH.Eta.Check INPUT, 
TD.Eta.Check INPUT  { background-color: transparent; }
TH.Eta.Anz       { width: 6%; text-align: left; }
TD.Eta.Anz       { width: 6%; text-align: right; } 
TD.Eta.Anz INPUT { text-align: right; width: 80%;}
TH.Eta.ME, 
TD.Eta.ME        { width: 5%;  text-align: left;  }
TH.Eta.Pos,
TD.Eta.Pos       { width: 8%; text-align: left; }
TH.Eta.Art,
TD.Eta.Art		 { width: 27%; text-align: left;  }
TH.Eta.Bez,
TD.Eta.Bez		 { width: 29%; text-align: left; white-space: normal; }
TH.Eta.Wgr,
TD.Eta.Wgr		 { width: 15%; text-align: left;  }
TH.Eta.Preis	 { width: 10%; text-align: left;  }
TD.Eta.Preis	 { width: 10%; text-align: right; }
TH.Eta.Status,
TD.Eta.Status    { width: 45px !important; text-align: left;  }
*/

TH.Eta.Check,
TD.Eta.Check     { width: 25px !important; text-align: left;  }
TH.Eta.Check INPUT, 
TD.Eta.Check INPUT  { background-color: transparent; }
TH.Eta.Anz,
TD.Eta.Anz       { width: 6em; text-align: right; } 
TD.Eta.Anz INPUT { text-align: right; width: 80%;}
TH.Eta.ME, 
TD.Eta.ME        { width: 4em;  text-align: left;  }
TH.Eta.Pos,
TD.Eta.Pos       { width: 4em; text-align: left; }
TH.Eta.Art,
TD.Eta.Art		 { width: 12em; text-align: left;  }
TH.Eta.Bez,
TD.Eta.Bez		 { text-align: left; white-space: normal; }
TH.Eta.Wgr,
TD.Eta.Wgr		 { width: 4em; text-align: left;  }
TH.Eta.Preis,
TD.Eta.Preis	 { width: 12em; text-align: right; }
TH.Eta.Status    { width: 60px !important; text-align: left;  }
TD.Eta.Status    { width: 45px !important; text-align: left;  }


/* Spezialfall Preise */
/*
TH.Eta.Preis,
TH.Eta.NoPreis,
TD.Eta.NoPreis  { width: 8em; text-align: center; }
TD.Eta.Preis    { width: 5em; text-align: right;  }
TD.Eta.IKZ 	    { width: 3em; text-align: left;   }
TD.Eta.Text1    { text-align: left;   }
TD.Eta.Text2    { text-align: left;   }
*/
/* Einrueckung von Gruppen*/
TABLE.Common TR.Group TD.Eta.Bez,
TABLE.Common TR.Group TD.Eta.Art,
TABLE.Common TR.Group TD.Eta.Pos { padding-left: 12px;}

/*--- Tabsets ---*/


DIV.tabsetframe
{
  padding: 0px;
  margin: 0px;
  border: 1px solid #C0C0C0 !important;
}



/*--- Wertetabelle wie zB. bei Motoren ---*/

BODY.iframe TABLE.wertetabelle,
TABLE.wertetabelle 
{
  width: auto;
  border: none;
  background-color: #C0C0C0; 
  margin-left: 4px;
}

TABLE.wertetabelle TH,
TABLE.wertetabelle TD
{
  white-space: nowrap;
  width: auto;
  padding-right: 5px;
  padding-left: 5px;
  background-color: #E0E0E0; /* zu dunkel #7C7C7C; */
}

TABLE.wertetabelle TH
{
  text-align: center;
}

TABLE.wertetabelle TD.key
{
  text-align: right;
}

TABLE.wertetabelle TD.val
{
  text-align: left;
}

/*--- pgbar und Co ---*/

DIV#splash
{
  position: absolute;
  top: 30%; 
  left: 10%;
  width: auto;
  height: auto;
  background: none;
  border: none;
}

DIV#splash IMG#splashpic
{
  width: 1187px;
  height: 209px;
  border: none;
}

DIV#waitinfo
{
  position: absolute;
  top: 55%; 
  left: 30%; 
  width: 40%; 
  height: auto; 
  background: none;	
  border: none;
}

DIV#waittext
{
  position: relative;
  height: auto; 
  background: none;	
  border: none;
}

DIV#waittext P
{ 
  position: relative;
  text-align: center; 
  width: 100%; 
  font-weight: bold; 
  height: auto; 
  background: none;
}


DIV#pgbar
{
  position: relative;
  left: 30%; 
  width: 40%; 
  z-index: 1;
  height: auto;
  min-width: 20%;
  overflow: hidden;
  clip: auto;
  white-space: nowrap;
  background-color: white;
  border: 1px solid #000000;
  padding: 2px;
}

DIV#bricks
{
  position: relative;
  left: -120px;
  width: 100px;  /* 6x16px plus Rand */
  padding-left: 0px;
}

DIV.formular
{
  visibility: hide;
  visibility: hidden;
  position : absolute;
}

DIV.Container
{
  position: relative;
  background: transparent;
  border: none;
  margin: 0px;  
  padding: 0px;
}


.brick
{
  display: inline-block;
  width: 16px;
  min-width: 16px;
  max-width: 16px;
  height: 16px;
  overflow: hidden !important;
  background-color: #000000;
  color: #000000;
  margin: 0px;
  border: none;
  padding: 0px;
}

/* variante VSX */
.brick.one    { background-color: #FFF3DF; color: #FFF3DF; }
.brick.two    { background-color: #FFE3B7; color: #FFE3B7; }
.brick.three  { background-color: #FFD48F; color: #FFD48F; }
.brick.four   { background-color: #FFC467; color: #FFC467; }
.brick.five   { background-color: #FFB43F; color: #FFB43F; }
.brick.six    { background-color: #FFA616; color: #FFA616; }


/*--- VsxTree-Extras ---*/

.tree A:active,
.tree A *.selnode,
.tree TR *.TreeFocused A
{
  color: #FFA616;  /* nur Farbe, weil Layout-spezifisch */
}

.tree A#tree_BtnBack
{
  float: right;
  padding-left: 20px;
}

/* toplevel nodes */
.hyselpics *.level_1
{
  border-top: 1px #FFA616 solid;
  margin-bottom: 1px;
}

.nohysel *.level_1.inside,
.nohysel *.level_1.last
{
  border-top: 1px #FFA616 solid;
}

.nohysel *.level_1.first  
{
  border-top: 0px none;
}

.hyselpics *.dummybelow   /* hier kein level_1 anhaengen, sonst PRB mit IE5,IE6 */
{
  border-top: none !important;
  border-bottom: none !important;
}

.tree *.level_1  TD 
{
  vertical-align: top;
  padding: 3px;
}

.tree.nohysel   *.level_1  TD.plusminus,
.tree.hyselpics *.level_1  TD.plusminus
{
  width: 122px;  /* Bildbreite, damit der Guidelink auch in der letzten Zeile korrekt positioniert wird */
}

.tree *.level_1  TD  DIV.guidelink
{
  position: relative; 
  top: -28px;
}

.tree *.level_1  TD  DIV.guidelink  A
{
  font-weight: normal;
  font-style: italic;
  background-image: url(html/picture/link_arrow.gif);
  background-position: left center;
  background-repeat: no-repeat;
  padding-left: 8px !important;
}

.tree.hyselpics *.level_1  A.nodetext
{
  position: relative; 
  top: -24px;
  font-size: 10pt !important;  
  line-height: 1.5em;
}

.tree.nohysel *.level_1 A.nodetext
{
  position: relative;
  font-size: 10pt !important;  
  /* jetzt doch mit Bild: 
  left: -20px;
  background-image: none !important; 
  */
}

.tree.nohysel   *.level_1.collapsed  A.nodetext,
.tree.hyselpics *.level_1.collapsed  A.nodetext  
{
  background-image: url(html/picture/link_arrow.gif);
  background-position: left center;
  background-repeat: no-repeat;
  padding-left: 6px !important;
}

.tree.nohysel   *.level_1.expanded  A.nodetext,
.tree.hyselpics *.level_1.expanded  A.nodetext
{
  background-image: url(html/picture/link_arrow_down.gif);
  background-position: left center;
  background-repeat: no-repeat;
  padding-left: 6px !important;
}

.nohysel *.dummybelow  A.nodetext /* hier kein level_1 anhaengen, sonst PRB mit IE5,IE6 */
{
  background-image: none !important; 
}

.tree *.level_1  DIV.flygtinfobtn_container
{
  float: left;
  position: relative;
  bottom: 0px;
  width: 20px;
  height: 20px;
}

.tree *.level_1  DIV.flygtinfobtn_container A.guidedtour
{
  width: 24px;
  height: 24px;
  z-index: 10000;
}


/* ab zweiter Ebene alles verschieben */
.tree.nohysel *.level_2,  
.tree.nohysel *.level_3,
.tree.nohysel *.level_4,
.tree.nohysel *.level_5,
.tree.nohysel *.level_6,
.tree.nohysel *.level_7,
.tree.hyselpics *.level_2,  
.tree.hyselpics *.level_3,
.tree.hyselpics *.level_4,
.tree.hyselpics *.level_5,
.tree.hyselpics *.level_6,
.tree.hyselpics *.level_7
{
  position: relative;
  top: -48px;
  left: 140px;
  border-top: 0px none;
  border-bottom: 0px none;
}

/* untergeordnete Links */
.tree *.level_3  A,
.tree *.level_4  A,
.tree *.level_5  A,
.tree *.level_6  A,
.tree *.level_7  A
{
  font-weight: normal !important;
}

/* Links ab zweiter Ebene mit vorangestelltem LinkArrow */
.tree.nohysel *.level_1.neutral  A.nodetext,
.tree.nohysel *.level_1.neutral  A.nodetext,
.tree *.level_2.collapsed  A.nodetext,  
.tree *.level_3.collapsed  A.nodetext,  
.tree *.level_4.collapsed  A.nodetext,  
.tree *.level_5.collapsed  A.nodetext,  
.tree *.level_6.collapsed  A.nodetext,
.tree *.level_7.collapsed  A.nodetext,
.tree *.level_2.neutral  A.nodetext,
.tree *.level_3.neutral  A.nodetext,
.tree *.level_4.neutral  A.nodetext,
.tree *.level_5.neutral  A.nodetext,
.tree *.level_6.neutral  A.nodetext,
.tree *.level_7.neutral  A.nodetext
{
  background-image: url(html/picture/link_arrow.gif);
  background-position: left center;
  background-repeat: no-repeat;
  padding-left: 6px !important;
}

.tree *.level_2.expanded  A.nodetext,
.tree *.level_3.expanded  A.nodetext,
.tree *.level_4.expanded  A.nodetext,
.tree *.level_5.expanded  A.nodetext,
.tree *.level_6.expanded  A.nodetext,
.tree *.level_7.expanded  A.nodetext
{
  background-image: url(html/picture/link_arrow_down.gif);
  background-position: left center;
  background-repeat: no-repeat;
  padding-left: 6px !important;
}


/*--- Guide ---*/

DIV#flygt_guide_head P
{
  font-size: 16pt;
  font-weight: bold;
  color: #FFA616;
  border-bottom: solid 2px #7C7C7C;
  padding-bottom: 0px;
  margin-top: 0px;
  z-index: 0;
}


/*--- debug ---*/

.debug
{
  border: 1px solid red;
}

DIV.dbg_info
{
  position: absolute !important; 
  color: #808080;
  z-index: 100; 
}

DIV#dbg_bdysrc
{
  top: 10px; 
  left: 90%; 
}

DIV#dbg_ifmsrc
{
  top: 15px;
  left: 10px; 
}


/* Speziell fuer FireFox - H1 verdeckt die ersten Pixel des darunterliegenden Elements*/
H1.HeadLine
{
 margin-bottom : 10px; 
}

/* Usergroup Auswahl */
IFRAME#herstgrp    { visibility: hide; visibility: hidden; position: absolute; }
FORM#USERGRPFORM   { position: absolute; }
DIV#usergrp_select { width: 100%;}
DIV#DivUserGrp     { padding: 0px; margin: 0px; width: 100%; visibility: hide; visibility: hidden; position: absolute; }

/* spezielle Farben Pumpenliste */

DIV#pumpensect     { background-color: #FFFFFF; }
DIV#konfigsect H1  { background-color: #FFA616; }

DIV#INFOBP
{
  background-color: #FFA616;
  opacity: 0.85; filter:alpha(opacity=85); -moz-opacity:0.85;     /* 3x fuer CSS, IE, Mozilla */
  border: solid 1px #7C7C7C;
  color: #404040;
}


/*--- loading DIV ---*/

DIV#loading         
{ 
  position: absolute; 
  width: 400px; 
  height: 85px; 
  left: 30%; 
  top: 200px;  
  z-index: 4096; 
  border: 1px solid #404040; 
  background-color: #FFFFFF;
  overflow: hidden;
  visibility: hidden;
}

DIV#loading IMG
{
  position: absolute;
  margin: 25px; 
}

DIV#loading DIV.msg
{
  position: absolute;
  height: auto;
  width: 300px;
  margin: 20px 20px 0px 80px;
}


/* Baureihenliste */

DIV#baureihen  TH.check,  DIV#baureihen  TD.check { width: 25px;  }
DIV#baureihen  TH.pic,    DIV#baureihen  TD.pic   { width: 70px; }
DIV#baureihen  TH.herst,  DIV#baureihen  TD.herst { width: 10%; }
DIV#baureihen  TH.baur,   DIV#baureihen  TD.baur  { width: 75px; font-weight: bold; white-space:normal;  }
DIV#baureihen  TH.magni,  DIV#baureihen  TD.magni  { width: 48px; }
DIV#baureihen  TH.prodc,  DIV#baureihen  TD.prodc  { font-weight: bold; }
DIV#baureihen  TH.info,   DIV#baureihen  TD.info  { width: 100%; white-space: normal !important;  }

/* diverse Bilder sollen einen schwarzen Rahmen bekommen */
DIV#baureihen  TABLE#baurB  TR  TD.pic  IMG,
DIV.hint       TABLE        TR  TD      IMG
{
  border: solid 1px #000000;
}


/*
=== Spaix V3 "boxed" Layout =======================================================================================
*/


/* Positionierungscontainer fuer neues SpaixV3 Layout */

/*
  Template fuer HTML
  
  <div class="fmtSection" id="one">
    <div class="head"> <h1> box caption </h1> </div>
    <div class="cont">
    	<div class="left"> <p> sidebar area </p> </div>
    	<div class="right"> <p> content area </p> </div>
    </div>
  </div>
  
  <div class="fmtSection" id="one">
    <div class="head"> <h1> box caption </h1> </div>
    <div class="cont">
    	<div class="full"> <p> fullwidth content area </p> </div>
    </div>
  </div>

  Hinweis: Beide Varianten sind moeglich, der Boxinhalt (left/right oder full) wird IMMER in ein "cont" geschachtelt

*/

/*--- boxed Areas ---*/
/* HTML und BODY muessen class="boxed" gesetzt werden */

HTML.boxed 
{
  height: 100%;
  width: 100%;
  overflow: hidden;
}

BODY.boxed DIV#footer   
{
  position: absolute;
  bottom: 0px;
}


BODY.boxed DIV#bodycontent
{
  overflow: hidden;
}


/*--- Platzaufteilung Content ---*/


DIV#leftArea,
DIV#rightArea,
DIV#topArea,
DIV#nextArea,
DIV.nextArea
{
  position: absolute;
  top: 0px;
  margin-right: -3px;  /* IE-Fix */
}

DIV#leftArea,
DIV#topArea,
DIV#nextArea,
DIV.nextArea
{
  left: 0px;
}

DIV#topArea  DIV#leftArea,
DIV#topArea  DIV#rightArea
{
  top: 0px;  /* sonst doppelter Abstand */
}

DIV#leftArea
{ /* zweispaltig, linke Seite */
  width: 30%;
  border: none;
  z-index: 60;
}

DIV#rightArea
{ /* zweispaltig, rechte Seite */
  left: 50%;
  margin-left: 2px;
  width: 49%;
  border: none;
  z-index: 60;
}

DIV#topArea,
DIV#nextArea,
DIV.nextArea
{ /* einspaltig untereinander */
  margin: 0px;
  padding: 0px;
  width: 95%;
  border: none;
  height: auto;
  z-index: 50;
  overflow: visible;
}

/*--- verboxte ftmSection ---*/

DIV.fmtSection DIV.head,
DIV.fmtSection DIV.cont,
DIV.fmtSection DIV.left,
DIV.fmtSection DIV.right,
DIV.fmtSection DIV.full
{
  position: absolute;
  margin:  0px;
  padding: 0px;
  border: 0px none;
}

DIV.fmtSection DIV.head
{
  width: 100%;
  height: 24px;
  overflow: hidden;
}

DIV.fmtSection DIV.head H1
{
  display: block;
  margin:  0px;
}

DIV.fmtSection DIV.cont
{
  top: 24px;  /* = head.height */
  left: 0px;
  width: 100%;
  overflow: hidden;
  background-color: transparent;   /* manche weiss einfaerben, manche bleiben transparent */
  /* individuell berechnet:
  height = container.height - head.height 
  */
}

DIV.fmtSection DIV.left
{
  top: 0px;
  left: 0px;
  width: 131px;
  height: 100%;
  background-color: transparent;
  overflow: hidden;
}

DIV.fmtSection DIV.right
{
  top: 0px;
  left: 131px;
  height: 100%;
  overflow: auto;
  background-color: transparent;
  /* individuell berechnet:
  width = container.width- left.width 
  */
}

DIV.fmtSection DIV.full
{
  top: 0px;
  left: 0px;
  height: 100%;
  width: 100%;
  overflow: auto;
  background-color: #FFFFFF;
}

/*--- Hilfsklassen ---*/

DIV.fmtSection DIV.left P.margin,
DIV.fmtSection P.margin
{
  margin: 4px;
}

DIV.white
{
  background-color: #FFFFFF;
}


/*--- SideBar Controls ---*/

DIV.sidebar_ctls
{
  /* immer */
  position: absolute;
  width: 131px;
  background-color: transparent;
  margin: 0px 0px 4px 0px !important;     /* kein 4px-Abstand zur H1, dafuer unten 4px-Abstand */
  padding: 0px;
  /* defaults */
  left: 0px;
}

DIV.sidebar_ctls DIV.padding   /*  bei Bedarf: zusaetzliches DIV fuer inneren Abstand einsetzen - ist nicht immer erwuenscht */
{             
  margin: 4px;
  padding: 0px;        
  border: none;
}

DIV#rightArea DIV.fmtSection DIV.sidebar_ctls
{
  /* linke Sidebars liegen auf dem Hintergrund, rechte Sidebars muessen das fmtSection bis unten fuellen */
  height: 100%;
  overflow: hidden;  
  background-color: #FFFFFF;
}


DIV.sidebar_ctls  A.tab,
DIV.sidebar_ctls  A.tab:link,
DIV.sidebar_ctls  A.tab:visited
{
  display: block;
  width: 131px;
  margin-left: 2px;
  margin-right: 2px;
  padding: 4px 0px 4px 2px;
  font-size: 9px;  /* according to flygt.com */
  font-weight: bold;
  text-decoration: none !important;
  color: #000000 !important;
  background-color: #FFFFFF !important;
  border-bottom: solid 1px #FFA616;
}

DIV.sidebar_ctls  A.tab:hover,
DIV.sidebar_ctls  A.tab:active,
DIV.sidebar_ctls  A.tab.active,
DIV.sidebar_ctls  A.tab:link.active,
DIV.sidebar_ctls  A.tab:visited.active
{
  color: #FFA616 !important;
  text-decoration: none !important;
}

/*--- Notebook-Tabs ---*/

DIV.notetab
{
  position: absolute;
  top: 0px;
  left: 0px;
  height: 99%;
  width: 99%;
  overflow-x: hidden;
  overflow-y: auto;
  visibility: hidden;
}

DIV.fmtSection DIV.notetab
{
  margin-top: 0px;  /* margin bei DIV.fmtSection DIV rueckgaengig machen */
  padding: 0px;     /* padding bei DIV.fmtSection DIV rueckgaengig machen */
}

DIV.fmtSection DIV.notetab DIV
{
  margin-top: 4px;  /* margin hier statt bei DIV.fmtSection DIV.notetab */
  padding: 0px 0px 4px 6px; /* margin hier statt bei DIV.fmtSection DIV.notetab */
}



/*--- Guide ---*/

DIV#flygt_guide_head  DIV.backlink_container  
{
  float:right; 
  margin-right: 10px; 
  margin-top: 0px;
}

DIV#flygt_guide
{
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 90%;
  visibility: hidden;
}

DIV#flygt_guide DIV
{
  margin: 0px;
  padding: 0px;
}

DIV#flygt_guide_head
{
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  z-index: 1;
}

DIV#flygt_guide_pic,
DIV#flygt_guide_ovl
{
  position: absolute;
  top: 30px;
  left: 0px;
  margin: 0px;
  padding: 0px;
  width: 100%;
  height: 100%;
  overflow: hidden;
  z-index: 2;
}

DIV#flygt_guide_pic IMG
{
  top: 0px;
  left: 0px;
  margin: 0px;
  padding: 0px;
  border: 0px none;
  width: 100%;
  height: 100%;
}

DIV#flygtlegalese
{
  position: absolute;
  margin-top: 3px;
  width: 100%;
  overflow: hidden;
  height: 20px !important;
  border-top: 1px solid #CCCCCC;  /* im Original als 1-Pixel-GIF */
  color: #808080;
}

DIV#flygtlegalese DIV
{
  position: absolute;
  top: 2px;
  white-space: normal;
  font-size: 10px; 
  color: #808080; 
}

DIV#flygtlegalese DIV#leg_left   { left:  2%;  width: 20%; text-align: left; }
DIV#flygtlegalese DIV#leg_center { left: 22%;  width: 16%; text-align: left; }
DIV#flygtlegalese DIV#leg_right  { left: 38%;  width: 60%; text-align: center; }



/*--- Guide Nodes ---*/

DIV.guidenode,
DIV.guidenode H1,
DIV.guidenode P,
DIV.guidenode A,
DIV.guidenode DIV
{
  background-color: transparent;
  height: auto;
  width: 250px;   /* diesen Wert mit function CreateOverlayHtmlFromGuideNode() abgleichen */
}

DIV.guideknubbel
{
  position: absolute;
  width: 28px;
  height: 28px;
  overflow: hidden;
  z-index: 50;   /* auf dem Bild */
  background-image: url(html/picture/flygt_knubbel.gif);
  background-position: left top;
  background-repeat: no-repeat; 
  cursor: pointer;
}

DIV.guidenode IMG#guide_landscape
{
  border: 1px solid red;
}

DIV.guidenode DIV.guideheaderback
{ /* Hintergrund der H1 seoparat, weil sonst die Transparenz auch auf H1 wirkt - was unerwuenscht ist */
  position: absolute;
  background-color: #7C7C7C; 
  width: 100%;
  height: 40px;  /* bei 100% macht der IE6 das DIV nicht hoch genug  */
  opacity: 0.50; filter:alpha(opacity=50); -moz-opacity:0.50;     /* 3x fuer CSS, IE, Mozilla */
}

DIV.guidenode
{ /* normaler, ausgeklappter Knoten */
  position: absolute;
  border: 1px solid #FFA616 !important; 
  padding: 0px !important;
  overflow-x: hidden;
  height: auto;
  z-index: 100;   /* Hover-Effect: die gerade ausgeklappte Node vor die selektierte Node stellen */
}

DIV.guide_minimized
{ /* minimierter und nicht aktueller Knoten */
  width: auto;
  color: #000000;
  overflow-y: hidden;
  z-index: 80;    /* Knoten ist nicht gewaehlt und minimiert, ab nach hinten */
}

DIV.guide_selected
{ /* Zusetzliche Hervorhebung fuer den selektierten Knoten, kann minimiert oder ausgeklappt sein */
  z-index: 90;   /* Gewaehlten Knoten vor nichtgewaehlte Knoten, aber unter Hover-Knoten */
  opacity: 1; filter:alpha(opacity=100); -moz-opacity:1;     /* 3x fuer CSS, IE, Mozilla */
}

DIV.guidenode H1
{
  margin-bottom: 0px;
  cursor: pointer;
  font-size: 1em;
  height: 1.1em;
  padding-top: 1px;

  color: #000000;
  background-color: transparent;
  opacity: 1; filter:alpha(opacity=100); -moz-opacity:1;     /* 3x fuer CSS, IE, Mozilla */
  white-space: nowrap;
}

DIV.guide_minimized H1
{ /* ein minimierter Knoten */
  width: auto;
  color: #000000;
  background-color: transparent;
  opacity: 1; filter:alpha(opacity=100); -moz-opacity:1;     /* 3x fuer CSS, IE, Mozilla */
}

DIV.guide_selected H1
{
  color: #FFFFFF;
}

DIV.guidenode DIV.guidenodecont
{
  position: absolute;
  margin: 0px !important;
  padding: 0px !important;
  visibility: hidden;
}

DIV.guidenode P
{
  width: auto;  
  overflow: hidden;
  padding: 0px !important;
  margin: 5px !important;
}

DIV.guidenode P IMG
{
  float: left;
  width: 85px;
  height: 60px;
  margin-right: 4px;
}




/* Permatrix */

TABLE#permatrix 
{
  border-bottom: 1px solid #808080;
  border-left:   1px solid #808080;
}

TABLE#permatrix TH,
TABLE#permatrix TD
{
  border-top:   1px solid #808080;
  border-right: 1px solid #808080;
  white-space: nowrap;
  height: 20px;
}

TABLE#permatrix TH
{
  background-color: #7C7C7C;
  color: #FFFFFF;
  font-weight: bold;
}

TABLE#permatrix TH.system,
TABLE#permatrix TD.system,
TABLE#permatrix TH.usertype,
TABLE#permatrix TD.usertype
{
  text-align: center !important;
  width:  80px !important; 
  font-weight: bold;
}

TABLE#permatrix TD.system   { background-color: #F0FFFF !important; }
TABLE#permatrix TD.usertype { background-color: #FFFFF0 !important; }
TABLE#permatrix TD.perm     { width: 250px !important; font-weight: bold !important; }

TABLE#permatrix TD.fixed       { color: #808080 !important; }
TABLE#permatrix TD.editable    { /*nix*/ }

TABLE#perlegend TD.granted,
TABLE#permatrix TD.granted,
TABLE#permatrix TD.granted SELECT     { color: #00A000; }
TABLE#perlegend TD.inherit,
TABLE#permatrix TD.inherit,
TABLE#permatrix TD.inherit SELECT     { color: #0000C0; }
TABLE#perlegend TD.denied,
TABLE#permatrix TD.denied,
TABLE#permatrix TD.denied  TABLE#permatrix TD.denied  SELECT     { color: #C00000; }
TABLE#permatrix TD.unused   { color: #808080; background-color: #E0E0E0 !important; }

TABLE#permatrix TD SELECT
{
  width: 75px !important;
}



/* EOF */