@import "commonnav.css";


/***  CSS TEMPLATE  ***/
/*
#template {
      * visibility *
      display:;
      visibility:;
      * positioning *
      clear:;
      float:;
      top:;
      left:;
      width:;
      height:;
      margin:;
      * look *
      padding:;
      background:;
      border:;
      * text style *
      font:;
}*/



/***  STANDARDS  ***/

HTML { 
      width: 100%;
      height: 100.1%;
      min-height: 100%;
      margin: 0;
      padding: 0;
      background-color: #FFFFFF;
      font-size: 125%; /* scale to 62.5% */
      font-family: Arial, Helvetica, sans-serif;
      color: #333333;
}
BODY {
      width: 100%;
      height: 100%;
      min-height: 100%;
      margin: 0;
      padding: 0;
      background-color: #FFFFFF;
      font-size: 100.01%;
      font-family: Arial, Helvetica, sans-serif;
      color: #333333;
}
h1 { font-size: 2.5em }
h2 { font-size: 2em }
h3 { font-size: 1.75em }
h4 { font-size: 1.5em }
h5 { font-size: 1.25em }
h6 { font-size: 1em }
img { 
      border: 0; 
}
p { 
      margin: 0;
}
form, 
fieldset { 
      margin: 0; 
      padding: 0; 
}
fieldset { 
      border: 1px solid #000000; 
}
legend { 
      padding: 0;
      color: #000000; 
}
input, 
textarea, 
select {
      margin: 0;
      padding: 1px;
      font-size: 100%;
      font-family: inherit;
}
input[type=radio],
input[type=checkbox] { 
      margin-right: 5px; 
}
select { 
      padding: 0; 
}
.bold {
      font-weight: bold
}
.underline {
      text-decoration: underline
}
div.clear {
      clear: both;
}
.hide {
   display: none;
}

/** CSS "clearfix solution"
that forces any kind of block element to adjust hight to content even though
the content is floated and CSS standards want the content to simply run over 
the bottom line of the container element --  in this case I want to extend the 
<ul> block to its content height **/

.clearfix:after {
      content: ".";
      display: block;
      height: 0;
      clear: both;
      visibility: hidden;
}
.clearfix {
      display: inline-block;
}

/* Hides from IE-mac \*/
* html .clearfix {
      height: 1%;
}
.clearfix {
      display: block;
}
/* End hide from IE-mac */
/** END clearfix solution **/



/*** WEBSITE GRID ***/

#Popup { 
      font-size: 50%; /* scale to 62.5% */
}
.main-container { 
      font-size: 50%; /* scale to 62.5% */
}

#Head {
      height: 7em;
      overflow: hidden;
      background-color: #FFFFFF;
}
#NamingArea {
      height: 7em;
      width: 71.5em;
}
#NamingArea img {
      width: 71.5em;
      height: 6.9em;
}
#Logo {
      height: 4.3em;
      width: 24.1em;
      margin: 1.1em 1.5em 0em 2.4em; /* margin-left 2.4em instead of 2.5em to avoid display error on zoom in FireFox */
}
#Logo img {
      width: 241px;
      height: 43px;
}
#MetaNavigation {
      height: 1.4em;
      width: 19em;
      margin: 0.2em 1.5em 0em 7.5em;
      overflow: hidden;
}
#MainNavigation {
      height: auto;
      background-color: #339933;
      border-bottom: 0.1em solid #FFFFFF;
      position: relative; /* Netscape Newline fix, force correct floating */
}
#MainNavigation div.Inner {
      margin-bottom: -0.1em;
      margin-top: 0.1em;  /* 2007-10-30: changed from 0.1em (Firefox 2px, IE 1px space between Naming and TopNav) */
}
#WebsiteMarker {
      height: 1.8em; /* force correct floating */
      width: auto;
      background-color: #339933;
      border-bottom: 0.1em solid #FFFFFF;
      text-align: right;
}
#WebsiteMarker img {
      height: 1.8em;
      width: 20.8em;
}
#ColorBar {
			background-color:#00334C;
			height:0.6em;
			margin-left:0;
			width:100%;
			overflow:hidden;
}
#KeyVisual { 
      height: 0;
      width: 0;
      overflow: hidden; /* workaround for IE to correct min-height for empty div */
}
#RightColumnBackGround {
      background-color: #FFFFFF;
      position: fixed;
      top: 0;
      left: 78%;
      width: 22%;
      height: 100%;
      z-index: 1;
      font-size: 50%;
}



/*** CONTENT COLUMNS ***/

#CenterColumn div.Inner {
      margin: 2em;
}
#RightColumn div.Inner {
      margin: 1em;
}
#RightColumn .Content {
      font-size: 1.2em;
      font-weight: normal;
      border-bottom: 0 solid #FF6699;
}
#RightColumn .Content div.InnerShell {
      margin: 0 0 1em 0;
}
#CenterColumn .Content {
      clear: left;
      border-bottom: 0 solid #FF6699;
}
.Content {
      font-size: 1.2em;
      font-weight: normal;
}
.ContentFloating {
      font-size: 1.2em;
      font-weight: normal;
}
.ContentFloating h2 {
      font-size: 1em;
      color: red;
}


/* scale size to 1em = 10px for images and tables in ContentArea  */
/* Zum Verständnis: für Schrifthöhe ist font-size im Elternelement maßgeblich - bei alle anderen Elemente die Schriftgröße des AKTUELLEN Elements]  */
.Content img,
.Content table {
      font-size: 0.8334em;
}
.Content table tbody {
      font-size: 1.2em;
}

/** self clearing rules 
for all standards compliant browsers  **/

#CenterColumn .Content:after, 
#RightColumn .Content:after { 
      content: "."; 
      display: block; 
      height: 0; 
      clear: both; 
      visibility: hidden; 
}
      /* for IE 5.0 see conditional CSS*/
      /* for IE 5.5 and later  */
      /* the toggle (2 parts) between display:inline-block and display: block makes it!
      Important: the clearing effect stops working if you combine the #container { display: inline-block; } and #container { display: block; } rules into one line*/
#CenterColumn .Content, 
#RightColumn .Content {
      display: inline-block;
}        
/* 2nd part of the toggle. Mandatory for WinIE but must be hidden from IE-mac */
      /* Hides from IE-mac who needs only first part of the toogle method \*/
#CenterColumn .Content, 
#RightColumn .Content {
      display: block; 
}
 /* End hide from IE-mac */
      /* End for self clearing rules for IE */

#CenterColumn .TwoColumn {
      clear: none;
      float: left;
      width: 50%;
      background-color: #FFFFFF;
   overflow: hidden; /* content cut */
}
#CenterColumn .ThreeColumn {
      clear: none;
      float: left;
      width: 33%;
      background-color: #FFFFFF;
}
#CenterColumn .Content .InnerShell {
      margin: 0 0 1em 0;
}
#CenterColumn .Content .InnerShellLeft {
      margin: 0 0.5em 1em 0;
}
#CenterColumn .Content .InnerShellMiddle {
      margin: 0 0.5em 1em 0.5em;
}
#CenterColumn .Content .InnerShellRight {
      margin: 0 0 1em 0.5em;
}
#CenterRight {
      float: left;
      width: 50%;
      background-color: #FFFFFF;
}

#CenterColumn .TwoColumnFloatLeft {
      float: left;
}
#CenterColumn .Content .InnerShellFloatLeft {
      margin: 0 1em 1em 0;
}
#CenterColumn .TwoColumnFloatRight {
      float: right;
}
#CenterColumn .Content .InnerShellFloatRight {
      margin: 0 1em 1em 0;
}
#CenterColumn .ContentFloating {
      clear: none;
}
#CenterColumn .ContentFloating .InnerShell {
      margin: 0 0 1em 0; 
}

/** BreadCrumbTrail **/

.BreadCrumbTrail {
      margin: 0 0 0.5em 0.1em;
      overflow: hidden;
      width: 99.9%; /* 100% causes problems with lt IE 6 */
}
.BreadCrumbTrail ul {
      margin: 0 0 0 -1.1em;
      padding: 0;
      list-style: none;
      display: inline;
}
.BreadCrumbTrail ul ul {
      margin-left: 0em;
}
.BreadCrumbTrail li {
      display: inline;
}
.BreadCrumbTrail li a {
      color: #339933;
      text-decoration: none;
      font-weight: normal;
      font-size: 1.1em;
      padding-left: 1em;
      background: url(../icons/BreadCrumbTrail_Arrow_1.gif) 0.2em 0.45em no-repeat;
}
.BreadCrumbTrail li a:hover {
      text-decoration: underline;
}
.BreadCrumbTrail li.active {
      padding-left: 1em;
      background: url(../icons/BreadCrumbTrail_Arrow_2.gif) 0em 0.45em no-repeat;
      color: #333333;
      font-weight: normal;
      font-size: 1.1em;
}


/** more CONTENT ELEMENTS **/

/* Page Headline */
.Headline {
      margin: 0 0 1.4em 0;
      color: #339933;
      font-size: 1.5em;
      font-weight: bold;
}
.Topline em {
      margin: 0 0 1.4em 0;
      font-size: 1.2em;
      font-weight: bold;
      color: #333333;
      font-style: normal;
}
.Underline {
      margin: 0 0 1.4em 0;
      font-size: 1.2em;
      font-weight: bold;
      color: #333333;
}
.Date strong {
      font-size: 1.1em;
      font-weight: bold;
      color: #333333;
}
.Abstract {
      font-size: 1.2em;
      font-weight: normal;
      font-style: normal;
      color: #333333;
      margin: 0;
}
.Location {
      font-size: 1.2em;
      font-weight: bold;
      color: #339933;
}

/* Page Forwarding for Items, News, Events with external Link */
.Content .PageForwarding {
      margin: 2em 0;
      padding: 3em 2em;
      line-height: 1.5em;
      border: solid 1px #FF6600;
      font-weight: bold;
}
.Content .PageForwarding span {
      color: #FF6600;
}
.Content .PageForwarding a {
      color: #339933;
}


/**  BOTTOM LINE Area  **/

#BottomLine {
      margin-top: 2.5em;
      clear: both;
}

#BottomLine ul {
      margin: 0 0 0.3em 0;
      padding: 0;
      list-style-type: none;
      list-position: inline;
}        
#BottomLine li.TellaFriend, 
#BottomLine li.Bookmark, 
#BottomLine li.Print {
      margin: 0 3em 0 0;
      float: left;
}

#BottomLine li.TellaFriend img {
      height: 1.1em;
      width: 2.7em;
      margin: 0.1em 1em 0 0;
      border: none;
}
#BottomLine li.Bookmark img {
      height: 1.2em;
      width: 1.5em;
      margin: 0 1em 0 0;
      border: none;
}

#BottomLine li.Print img {
      height: 1.2em;
      width: 1.5em;
      margin: 0.1em 1em 0 0;
      border: none;
}
#BottomLine li.Top img {
      height: 0.8em;
      width: 0.7em;
      margin: 0.4em 1em 0 0;
      border: none;
}
#BottomLine li.Top {
      float: right;
		height: 1.4em;
}
#BottomLine div {
      margin: 0;
      padding: 0.5em 0 0 0;
      border-top: 0.1em solid #666666;
      font-family: Arial, Helvetica, sans-serif;
      font-size: 1em;
}
#BottomLine div p.Info {
      float: left;
      width: 50%;
}
#BottomLine div p.Modified {
      float: right;
}
#BottomLine a { 
      color: #666666;
      text-decoration: none;
}



/***  NAVIGATIONS ***/


/** META NAVIGATION **/

#MetaNavigation ul {
      list-style-type: none;
      margin: -0.1em 0em -0.1em -0.4em;
      padding: 0;
}
#MetaNavigation li {
      display: inline;
      margin: 0;
      padding: 0;
}
#MetaNavigation li.active a {
      color: #00CC00;
}
#MetaNavigation .Logout {
      color: #C50401;
      font-weight: bold;
}
#MetaNavigation a {
      color: #999999;
      font-size: 10px;
      line-height: 1em;
      font-weight: normal;
      text-decoration: none;
      border-left: 0.1em solid #999999;
      padding: 0em 0em 0em 0.3em;
}
#MetaNavigation a:hover {
      color: #00CC00;
}


/** LEFT NAVIGATION **/

#LeftNavigation {
      position: relative; /* correct display error for Site locator in Netscape */
}
#LeftNavigation ul {
      list-style-type: none;
      margin: 0;
      padding: 0;
      width: 100%;
}
#LeftNavigation li {
      position:relative; 
      float: left;
      margin: 0;
      padding: 0;
      width: 100%;
      overflow: hidden;
      border-top: 0.1em solid #FFFFFF;
}
#LeftNavigation a {
      position:relative; 
      display: block;
      padding: 0.1em 1em 0.1em 2em;
      font-size: 1.2em;
      /* line-height: 1.3em; */
      text-decoration: none;
      background-color: #DFF5CC;
      color: #666666;
      font-weight: normal;
      background-position: 0.9em 0.4em;
      background-repeat: no-repeat;
}
#LeftNavigation a:hover{
      background-color:#DFF5CC;
      color: #339933;
      background-image: url(../icons/NAV_Arrow_339933.gif);
}
#LeftNavigation a.active,
#LeftNavigation a.active:hover {
      background-color:#00CC00;
      color: #FFFFFF;
      background-image: url(../icons/NAV_Arrow_FFFFFF.gif);
}

/* level 2 */
#LeftNavigation ul ul a {
      padding-left: 3em;
      background-position: 1.9em 0.4em;
      background-color: #F0FAE6;
      color: #339933;
}
#LeftNavigation ul ul a.active,
#LeftNavigation ul ul a.active:hover {
      font-weight: bold;
      background-color:#F0FAE6;
      color: #00CC00;
      background-image: url(/bayerordersBCS/resources/css/NAV_Arrow_00CC00.gif);
}

/* level 3 */
#LeftNavigation ul ul ul a {
      padding-left: 4em;
      background-position: 2.9em 0.4em;
}

/* level 4 */
#LeftNavigation ul ul ul ul a {
      padding-left: 5em;
      background-position: 3.9em 0.4em;
}

/* level 5 */
#LeftNavigation ul ul ul ul ul a {
      padding-left: 6em;
      background-position: 4.9em 0.4em;
}


/** SITE LOCATOR NAVIGATION **/

#SiteLocator {
      clear: left; /* correction for FireFox, prohibit float */
      position: relative; /* correct display error for Site locator in Netscape */
}
#SiteLocator ul {
      list-style-type: none;
      margin: 0;
      padding: 0;
}
#SiteLocator li {
      margin: 0;
      padding: 0;
}
#SiteLocator li div {
      padding: 0.1em 1em 0.1em 2em;
      font-size: 12px;
      line-height: 1.3em;
      text-decoration: none;
      color: #FFFFFF;
      font-weight: bold;
      background-position: 0.9em 0.5em;
      background-repeat: no-repeat;
      border-top: 0.2em solid #FFFFFF;
      border-bottom: 0.1em solid #FFFFFF;
      margin-bottom: 0.2em;
}
#SiteLocator li.SiteLocator div {
      background-color: #339933;
}
#SiteLocator li.IntranetLinks div {
      background-color: #339933;
}
#SiteLocator li.InternetLinks div {
      background-color: #999999;
}
#SiteLocator li.ConditionalLinks div {
      display: none;
}
#SiteLocator li li {
      padding: 0em 0.2em 0em 2.5em;
}
#SiteLocator a {
      font-size: 11px;
      text-decoration: none;
      color: #111111;
      font-weight: normal;
}
#SiteLocator a:hover {
      text-decoration: underline;
}
#SiteLocator select {
      font-size: 1.1em; 
      font-family: Arial,Helvetica,sans-serif; 
      margin: 0.2em 0em 0.3em 2.2em;
      background-color: #FFFFFF;
      color: #111111;
      width: 85%;
      position: relative;
}
#SiteLocator li.SiteLocatorLinks {
      background-color: #EBF6DA;
      border-bottom: 0.2em solid #FFFFFF;
}
#SiteLocator li.IntranetLinks {
      background-color: #EBF6DA;
      border-bottom: 0.2em solid #FFFFFF;
}
#SiteLocator li.InternetLinks {
      background-color: #DDDDDD;
      border-bottom: 0.2em solid #FFFFFF;
}
#SiteLocator li.ConditionalLinks {
      border-top: 0.1em solid #999999;
      padding-top: 0.2em;
}
#ActiveHub {
      color:#111111;
      font-size:1.1em;
      font-weight:normal;
}


/** MAIN / TOP NAVIGATION **/

/* standard definitions */
#MainNavigation ul {
      list-style-type: none;
      margin: 0;
      padding: 0;
      position: relative;
}
#MainNavigation li {
      float: left;
      margin: 0;
      padding: 0;
      position: relative;
      border-right: 0.1em solid #FFFFFF;
}
#MainNavigation a {
      display: block;
      line-height: 1.3em;
      padding: 0.1em 1em;
      font-size: 1.2em;
      font-weight: bold;
      border-bottom: 1px solid #FFFFFF;
      text-decoration: none;
}
#MainNavigation a.active {
      background-color: #339933;
      color: #FFFFFF;
}

/* drop down for 2nd-level menu entries */
#MainNavigation ul ul {
      display: none;
      left: -999em;
      border-top: 0.1em solid #FFFFFF;
      border-left: 0.1em solid #FFFFFF;
      margin-left: -0.1em;
      margin-top: -0.1em;
      position: absolute;
      width: 17em;
}
#MainNavigation ul ul a {
      padding-left: 2em;
      font-weight: normal;
      background-position: 0.9em 0.5em;
      background-repeat: no-repeat;
}
#MainNavigation ul ul a:hover,
#MainNavigation ul ul a.active {
      background-image: url(../icons/NAV_Arrow_FFFFFF.gif); /* zieht im FF nicht *grübel*/
}
#MainNavigation ul ul li {
      float: left;
      width: 17em;
}

/*  drop down for 3rd-level menu entries  */
#MainNavigation ul ul ul {
      margin-left: 17em;
      margin-top: -2em;
}


/** special home button **/

#MainNavigation li.first-child {
      width: 17%;
}
#MainNavigation li.first-child a {
      padding-left: 2em;
}
#MainNavigation li.first-child a.active,
#MainNavigation li.first-child a.active:hover {
      background-color: #339933;
      color: #339933;
      border-bottom: solid 0.1em #FFFFFF;
      cursor: default;
}
/*  special color for home button MouseOver  */
#MainNavigation li.first-child a:hover {
}


/** Dropdown for TopNavigation **/

/* show level 2 */
#MainNavigation ul li:hover ul,
#MainNavigation ul li.hover ul {
      display: block;
      left: auto;
}
/* hide level 3 */
#MainNavigation ul li:hover ul ul,
#MainNavigation ul li.hover ul ul {
      display: none;
      left: -999em;
}
/* show level 3 */
#MainNavigation ul li:hover ul li:hover ul,
#MainNavigation ul li.hover ul li.hover ul {
      display: block;
      left: auto;
}
/* hide level 4 */
#MainNavigation ul li:hover ul li:hover ul ul,
#MainNavigation ul li.hover ul li.hover ul ul {
      display: none;
      left: -999em;
}
/* show level 4 */
#MainNavigation ul li:hover ul li:hover ul li:hover ul,
#MainNavigation ul li.hover ul li.hover ul li.hover ul {
      display: block;
      left: auto;
}
/* hide level 5 */
#MainNavigation ul li:hover ul li:hover ul li:hover ul ul,
#MainNavigation ul li.hover ul li.hover ul li.hover ul ul {
      display: none;
      left: -999em;
}

/* COLORSET for Top- / MainNavigation including DropDown */
/* 1st level */
#MainNavigation a { 
      background-color: #339933;
      color: #FFFFFF;
}
#MainNavigation a:hover,
#MainNavigation a.hover  {    /* Spez = 111 */
      background-color: #DFF5CC;
      color: #339933;
}
#MainNavigation a.active {   /* Spez = 111 */
     background-color: #00334c;
     border-bottom: 1px solid #00334c;
     color: #FFFFFF;
}

/* freeze focus to 1st level chapter when corresponding dropdown is visible */
#MainNavigation li:hover a {   /* Spez = 112 */
     background-color: #DFF5CC;
     border-bottom: 1px solid white;
     color: #339933;
}
/* lt IE 7 */
#MainNavigation li.hover a {   /* Spez = 112 */
     background-color: #DFF5CC;
     color: #339933;
}

/*  default colors 2nd level and below */
#MainNavigation .Inner ul ul a {    /* class Inner mit aufgenommen, damit ausreichend hohe Spez = 113 zwecks Überschreiben */
     background-color: #DFF5CC;
     color: #666666;
}
#MainNavigation ul ul a:hover {  /* Spez = 113 */
     background-color: #DFF5CC;
     color: #FFFFFF;
     background-image: url(../icons/NAV_Arrow_FFFFFF.gif); 
}

/*  highlight click path - mouseover 2nd level and below */
#MainNavigation li li:hover > a {   /* Spez = 113 */
     background-color:#DFF5CC;
     background-image: url(../icons/NAV_Arrow_339933.gif);
     color:#339933;
}
/* lt IE 7 */
#MainNavigation li li.hover a.isChild {   /* Spez = 123 */
     background-color:#DFF5CC;
     background-image: url(../icons/NAV_Arrow_339933.gif);
     color:#339933;
}

/* highlight active path */
/* 2nd level  */
#MainNavigation ul ul a.active,
#MainNavigation ul ul a.active:hover {   /* Spez = 113 bzw.  123 */
     background-color: #00CC00;
     color: #FFFFFF;
     background-image: url(../icons/NAV_Arrow_FFFFFF.gif); 
}
/*  3rd Level  */
#MainNavigation ul ul ul a.active,
#MainNavigation ul ul ul a.active:hover {   /* Spez = 114 bzw.  124 */
     background-color: #DFF5CC;
     color: #00CC00;
     background-image: url(/bayerordersBCS/resources/css/NAV_Arrow_00CC00.gif); 
} 


/**  IMAGE PopUp **/

.Popup {
	position: absolute;
	top: 2%;
	left: 3%;
	z-index: 15;
	width: 94%;
	border: solid 2px #999999;
	padding: 0;
	margin: 0;
	background: #DDDDDD url(../icons/Icon_Wait.gif) center center no-repeat;
	display: none;
}
.Popup .PopupTitle {
   font-size: 1.2em;
   font-weight: bold;
   color: #339933;
   text-align: center;
}
.Popup .CloseButton {
	background: #BBBBBB url(../icons/Icon_Close_Green.gif) top right no-repeat;
	width: 100%;
	height: 16px;
	cursor: pointer;
	border-top: 1px solid #FFFFFF;
	border-right: 1px solid #666666;
	border-bottom: 1px solid #666666;
	border-left: 1px solid #FFFFFF;
}
.PopupIMG .Image {
	margin: 1em 0.5em 1em 0.5em;
	text-align: center;
}
.PopupIMG .Image img {
	margin:0;
	border: 1px solid #339933;
}

.gigya-screen.portrait {
	width: 100% !important;
}