@charset "UTF-8";
/** CSS Datei für Lebensmittelwelt.de **/
/** Autor: Marco Kunz **/
html {
  background: url(../img/bg/body-long.png) repeat-x 0% 0%;
  background-color: #2f3e4e;
}
body { width: 960px; margin: 0 auto; }
#for-ie-six-and-below { display: none; visibility: hidden; }
table td {
  padding-right: 20px;
}
/** Headlines **/
h1 {
  font-size: 1.5em;
  color: #AD0022;
  margin: 15px 0 20px;
}
h2 {
  font-size: 1.4em;
  color: #006111;
  margin-bottom: 5px;
}
h3 {
  font-size: 1.3em;
  color: #444444;
}
h4 {
  font-size: 1.2em;
  color: #444444;
}
h5 {
  font-size: 1.1em;
  color: #444444;
}
h6 {
  font-size: 1.0em;
  color: #444444;
}

h1 a:link {
  color: #AD0022;
}
h2 a:link {
  color: #006111;
}
h3 a:link, h4 a:link h5 a:link, h6 a:link {
  color: #444444;
}

/** Header **/
#header {
  height: 80px;
  background: url(../img/bg/header-neu.jpg) no-repeat 0% 0%;
  background-color: #f4f4fd;
}
#logo { width: 75%; padding: 10px 0 0 2%; }
#logo img {
  opacity: 0.75;
  -moz-transition: all 0.25s ease; -webkit-transition: all 0.25s ease; -o-transition: all 0.25s ease; transition: all 0.25s ease;
}
#logo img:hover { opacity: 1; }
/** Header Ende **/
/** Haupt-Navigation **/
.main-nav { background-color: #AD0022; height: 36px; }
.main-nav ul {
  width: 98%;
  margin: 0 0 0 2%;
  list-style-type: none;
  text-align: center;
}
.main-nav li {
  float: left;
  font-size: .875em;
  height: 36px;
  margin-right: 1%;
}
.main-nav li:first-child a {
  background-image: url("../img/icons/icon-aussichtspunkt.gif");
  background-position: 10px 3px;
  background-repeat: no-repeat;
  padding-left: 45px;
}

.main-nav a {
  display: block;
  padding: 10px 15px;
  color: #fff;
  font-weight: bold;
}
.main-nav li a:hover, .main-nav li a:focus, .main-nav li a:active, .main-nav li.active a {
  color: #333;
  background-color: #e7e7e7;
  background: -moz-linear-gradient(top, #fff 10%, #e7e7e7 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fff), color-stop(10%,#fff), color-stop(100%,#e7e7e7));
  background: -webkit-linear-gradient(top, #fff 10%,#e7e7e7 100%);
  background: -o-linear-gradient(top, #fff 10%,#e7e7e7 100%);
  background: linear-gradient(to bottom, #fff 10%,#e7e7e7 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e7e7e7',GradientType=0 );
}
.main-nav li a:hover, .main-nav li a:focus { text-decoration: none; }

.main-nav li:first-child a:hover, .main-nav li:first-child a:focus {
  background-image: url(../img/icons/icon-aussichtspunkt-active.png);
  background-color: #e7e7e7;
  background: url(../img/icons/icon-aussichtspunkt-active.png) no-repeat 10px 3px, -moz-linear-gradient(top, #fff 0%, #e7e7e7 100%);
  background: url(../img/icons/icon-aussichtspunkt-active.png) no-repeat 10px 3px, -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fff), color-stop(100%,#e7e7e7));
  background: url(../img/icons/icon-aussichtspunkt-active.png) no-repeat 10px 3px, -webkit-linear-gradient(top, #fff 0%,#e7e7e7 100%);
  background: url(../img/icons/icon-aussichtspunkt-active.png) no-repeat 10px 3px, -o-linear-gradient(top, #fff 0%,#e7e7e7 100%);
  background: url(../img/icons/icon-aussichtspunkt-active.png) no-repeat 10px 3px, linear-gradient(to bottom, #fff 0%,#e7e7e7 100%);
}

/** Login- und Register-Buttons **/
.login-and-register {
  float: right;
  text-align: right;
  margin-right: 2.25%;
  height: 36px;
}
.login-and-register button {
  border: none;
  font-weight: bold;
  height: 36px;
  width: 130px;
  color: #fff;
  background-repeat: no-repeat;
  background-position: left 3px;
}
.login-and-register .login { background-color: #006111; background-image: url(../img/icons/anmelden-icon.gif); }
.login-and-register .logout { background-color: #ad0022; background-image: url(../img/icons/abmelden-icon.gif); }
.login-and-register .login:focus, .login-and-register .login:active { background-color: #fff; background-image: url(../img/icons/anmelden-icon-active.gif); }
.login-and-register .logout:focus, .login-and-register .logout:active { background-color: #fff; background-image: url(../img/icons/abmelden-icon-active.gif); }
/** Haupt-Navigation Ende **/
/** Zweite Navigation **/
.secondary-nav {
  clear: both;
  height: 32px;
  background-color: #e7e7e7;
}
.information-nav {
  list-style-type: none;
  font-size: .8125em;
  text-align: center;
}
.information-nav li {
  float: left;
  margin: 8px 0 0 2%;
  position: relative;
}
.information-nav a, .information-nav strong { color: #333; padding: 8px 0; }
.information-nav li.active > a {
  text-decoration: underline;
}
.information-nav strong { font-weight: bold; }
.dropdown {
  width: 210px;
  float: left;
  position: absolute;
  /*left: -999em;*/
  padding: 10px 0 0;
  background-color: #e7e7e7;
  z-index: 9;
}
.information-nav li:hover .dropdown {
  /*left: -10px;*/
  top: 24px;
}
.dropdown.showSubMenu {
  left: -10px;
}
.dropdown.hideSubMenu {
  left: -999px;
}
.drop-menu {
  display: inline;
  float: left;
  position: relative;
}
.information-nav .dropdown ul {
  list-style-type: none;
  color: #333;
  margin: 0 0 10px;
  width: 210px;
}
.information-nav .dropdown ul li {
  position: relative;
  padding: 0 0 0 10px;
  margin: 0;
  float: none;
  text-align: left;
  background: transparent;
  -moz-transition: background 0.4s ease;
  -webkit-transition: background 0.4s ease;
  -o-transition: background 0.4s ease;
  -ms-transition: background 0.4s ease;
  transition: background 0.4s ease;
}
.information-nav .dropdown ul li:hover { background: #898989; }
.information-nav .dropdown ul li a, .information-nav .dropdown ul li strong { display: block; padding: 5px; }
.information-nav .dropdown ul li a:hover { color: #fff; }
/** Zweite Navigation Ende **/
/** Inhalt Container **/
#content, .contentElement, #below-the-fold .typoContentElement, .bereiche-und-themen, .footer {
  width: 96%;
  padding: 0 2%;
  background-color: #fff;
}

.typoContentElement p.bodytext a {
  color: #666666;
  text-decoration: none;
  border-bottom: 1px dotted #666666;
}
.typoContentElement p.bodytext a:hover {
  border-bottom: 1px solid #666666;
}
.bereiche-und-themen .typoContentElement {
  margin-bottom: 20px;
}
#aside-content {
  float: right;
  width: 22%;
  padding-top: 35px;
}
#main-content {
  width: 77%;
  padding-top: 20px;
}
/** Inhalt Container Ende **/
/** Seitenleiste Rechts **/
.large {
  font-size: 1.125em;
  font-weight: bold;
  color: #444;
  margin: 7px 0 15px;
}
div.aktuelles { 
  background-color: #F0F0F0;  
  padding: 10px;
}
div.aktuelles div.eintrag {
  padding-bottom: 10px;
  margin-bottom: 10px;
  border-bottom: 1px solid #dddddd;
}
div.aktuelles h6, div.aktuelles p {
  font-size: .875em;
  color: #666;
}

div.aktuelles div.eintrag.anzeigeneintrag div.image {
  margin-bottom: 5px;
}
div.aktuelles div.eintrag.anzeigeneintrag div.textEntry {
}
div.aktuelles div.eintrag.anzeigeneintrag div.textEntry div.date {
  font-size: 0.75em;
}
div.aktuelles div.eintrag.anzeigeneintrag div.image img {
  max-width: 70%;
}

div.aktuelles-content { 
}
div.aktuelles-content div.eintrag {
  display: inline-block;
  vertical-align: top;
  width: 30%;
  margin-right: 2%;
  margin-bottom: 20px;
  
}
div.aktuelles-content h6, div.aktuelles-content p {
  font-size: .875em;
  color: #666;
}
div.aktuelles-content div.company div.logo,
div.aktuelles-content div.company div.name {
    text-align: center;
    margin-top: 5px;
    font-size: 0.8em;
}


/** Seitenleiste Rechts Ende **/
/** Hauptinhalt **/
.breadcrumbs { font-size: .75em; color: #666; }
.breadcrumbs a { color: #666; }


/** Portalbuttons **/
.portalnavigation { width: 100%; margin: 0; padding: 0; height: 400px; }
.portale {
  width: 100%;
  clear: left;
}
.portal-button {
  display: inline-block;
  vertical-align: top;
  max-width: 180px;
  width: 22%;
  margin-right: 2%;
  margin-bottom: 20px;
  border: 1px solid #d5d5d5;
}
.portal-button.last {
  clear: both;
}
.portal-button .portal-text {
  text-align: center;  
}
.portal-button .floatingText {
  padding: 5px;
  color: #666;
  font-size: 12px;
  height: 100px;
}
.portal-button.anzeigen .floatingText {
  height: auto;
}
.portal-button.anzeigen .floatingText .eintrag,
.portal-button.anzeigen .floatingText .text{
  margin-bottom: 10px;
}
.portal-button .floatingText li {
  font-size: 14px;
}
.portal-button ul { list-style-type: none; }
.portal-button li { 
  padding-left: 10px;
  background-image: url(../img/pfeil_grau.png);
  background-repeat: no-repeat;
  background-position: 0px 3px;
  margin: 0 0 3px; 
}
.portal-text {
  font-size: .8125em;
  font-weight: bold;
  background-color: #AD0022;
  padding: 6px 0;
}
.portal-text a { color: #fff; }
/** Suche **/
#anzeigen-durchsuchen {
  clear: left;
  width: 92%;
  padding: 10px 15px;
  background-color: #f0f0f0;
  border-top: 1px solid #d5d5d5;
  border-bottom: 1px solid #d5d5d5;
}
#anzeigen-durchsuchen p {
  font-size: .8125em;
  color: #666;
}
#anzeigen-durchsuchen form {
  float: right;
  font-size: .8125em;
  width: 40%;
  margin: -21px 11% 0 0;
  text-align: right;
  border: 1px solid #999;
}
#anzeigen-durchsuchen input { height: 23px; color: #666; border: none; }
#anzeigen-durchsuchen input[type="text"] {
  width: 68%;
  padding: 0 1%;
}
#anzeigen-durchsuchen input[type="submit"] {
  background: #d6d6d6;
  width: 30%;
  margin: 0 0 0 -5px;
  font-weight: bold;
}
#anzeigen-durchsuchen input[type="submit"]:hover { color: #000; }
#anzeigen-durchsuchen input[type="submit"]:focus, #anzeigen-durchsuchen input[type="submit"]:active { background: #ad0022; color: #fff; }
/** Hauptinhalt Ende **/
/** Footer **/
.footer {
  clear: both;
  background: #e7e7e7;
  color: #444;
  font-size: .8125em;
  padding-top: 10px;
  padding-bottom: 10px;
}
.footer.belowContent {
  margin-bottom: 20px;
}
.footer p { width: 100%; text-align: center; margin: 5px auto; }
.footer strong { font-weight: normal; }
/** Footer Ende **/
/** contentElement **/
.contentElement, #below-the-fold .typoContentElement {
  clear: both;
  margin-bottom: 20px;
  padding-top: 25px;
  padding-bottom: 15px;
  color: #666;
}
#below-the-fold {
  background-color: white;
  padding-top: 25px;
}
#below-the-fold .typoContentElement {
  margin-bottom: 0px;
  padding-top: 0px;
}
div.bereiche-und-themen {
  margin-top: 20px;
}

.contentElement h2.grey,
#below-the-fold .typoContentElement h2.grey { color: #666; }
.grafik-container {
  float: right;
  margin-top: -10px;
  width: 28.8888%;
}
.contentElement .grafik-container img,
#below-the-fold .typoContentElement .grafik-container img {
  border-bottom: 2px solid #fff;
  -moz-transition: all ease 0.4s;
  -webkit-transition: all ease 0.4s;
  -o-transition: all ease 0.4s;
  transition: all ease 0.4s;
}
.contentElement .grafik-container img:hover,
#below-the-fold .typoContentElement .grafik-container img:hover { border-bottom: 2px dashed #f00; }

.contentElement p,
#below-the-fold .typoContentElement p {
  margin-bottom: 10px;
  color: #666;
}
.columns {
  float: left;
  width: 45%;
  padding: 0 5% 0 0;
}
.columns p { width: 100%; }
/** contentElement Ende **/
/** Bereiche und Themen **/
.bereiche-und-themen {
  clear: both;
  color: #666;
  padding-top: 25px;
  padding-bottom: 25px;
  background-color: #f0f0f0;
  margin-bottom: 20px;
}
.bereiche-und-themen h2 {
  margin-bottom: 10px;
  font-size: 1.3125em;
}
.textTeaserRow { 
  clear: left; 
}
.textTeaserRow .teaser {
  width: 21%;
  float: left;
  text-align: center;
  padding: 10px 1%;
  margin-bottom: 20px;
  background-color: #E7E7E7;
  margin-right: 10px;
  height: 220px;
}
div.bereiche-und-themen .textTeaserRow {
}
div.bereiche-und-themen .textTeaserRow .teaser {
  border-left: 1px solid #ccc;
  background-color: transparent;
  margin-right: 0px;
  height: auto;
}
div.bereiche-und-themen .textTeaserRow .teaser.first { border-left: none; }
.textTeaserRow .teaser h3 {
  font-weight: normal;
  font-size: 1em;
  margin: 0 auto 10px;
  padding: 5px 0;
}
div.bereiche-und-themen  .textTeaserRow .teaser h3 {
  background-color: #fff;
}
div.bereiche-und-themen  .textTeaserRow .teaser.first h3 {
  background: -moz-linear-gradient(left, #f3f3f3 0%, #ffffff 100%);
  background: -webkit-gradient(linear, left top, right top, color-stop(0%,#f3f3f3), color-stop(100%,#ffffff));
  background: -webkit-linear-gradient(left, #f3f3f3 0%,#ffffff 100%);
  background: -o-linear-gradient(left, #f3f3f3 0%,#ffffff 100%);
  background: linear-gradient(to right, #f3f3f3 0%,#ffffff 100%);
}
div.bereiche-und-themen  .textTeaserRow .teaser.last h3 {
  background: -moz-linear-gradient(left, #ffffff 0%, #f3f3f3 100%);
  background: -webkit-gradient(linear, left top, right top, color-stop(0%,#ffffff), color-stop(100%,#f3f3f3));
  background: -webkit-linear-gradient(left, #ffffff 0%,#f3f3f3 100%);
  background: -o-linear-gradient(left, #ffffff 0%,#f3f3f3 100%);
  background: linear-gradient(to right, #ffffff 0%,#f3f3f3 100%);
}
.textTeaserRow .teaser p, .bereiche-link-list {
  font-size: 0.75em;
  text-align: left;
}
.textTeaserRow .teaser .links {
  text-align: left;
}
.textTeaserRow .teaser p { margin-bottom: 10px; }
.textTeaserRow .teaser ul { list-style-type: none; }
.textTeaserRow .teaser li { 
  padding-left: 10px;
  background-image: url(../img/pfeil_grau.png);
  background-repeat: no-repeat;
  background-position: 0px 3px;
  margin: 0 0 3px; 
}
.textTeaserRow .teaser a {
  color: #666;
}

div.typoContentElement {
  margin-bottom: 20px;
  color: #666666;
}

#bottomnav { border-bottom: 2px solid #e7e7e7; }
#offlinks { font-size: 4px; color: #f0f0f0; }
/** Bereiche und Themen Ende **/
/** Unterhalb des ersten Footers Ende **/
/* Und ganz am Schluss */
@media (min-width: 1160px) {
  body { width: 1140px; }
  #main-content { }
  #anzeigen-durchsuchen { font-size: .875em; width: 89%; }
}
@media (min-width: 1439px) {
  body { width: 1380px; }
  #header #logo { padding-left: 3%; }
  .main-nav ul { width: 97%; margin: 0 0 0 3%; }
  .main-nav li { font-size: 1em; }
  .information-nav li { margin-left: 3%; }
  .secondary-nav { height: 36px; }
  .information-nav { font-size: 1em; }
  .dropdown, .information-nav .dropdown ul { width: 250px; }
  #content { width: 94%; padding: 0 3% 20px; }
  #main-content { }
  #aside-content td { padding-bottom: 10px; }
  .portal-button { margin: 20px 60px 20px 0; }
  #anzeigen-durchsuchen { width: 87%; padding: 15px; font-size: 1.125em;}
  #anzeigen-durchsuchen form { margin: -28px 13% 0 0; }
  #anzeigen-durchsuchen input[type="text"] { height: 30px; width: 61%; }
  #anzeigen-durchsuchen input[type="submit"] { height: 30px; width: 36%; }
  .footer { font-size: 1.125em; }
  .contentElement, #below-the-fold .typoContentElement, .bereiche-und-themen, .footer { width: 94%; padding-left: 3%; padding-right: 3%; }
  #bottomnav { border-bottom: 5px solid #e7e7e7; }
}
@media (max-width: 1000px) {
  body { width: 700px; }
  #logo img { opacity: 1; }
  .main-nav {position: relative;}
  .main-nav li { margin-right: 4px; }
  .main-nav a:link, .main-nav a:visited, .main-nav li strong { padding: 10px; }
  .login-and-register { 
    margin: 0; 
    position: absolute;
    right: 19px;
    top: -64px;
  }
  #main-content { width: 72%;}
  #aside-content { width: 28%;}
  .portalnavigation { height: auto; }
  .portal-button { width: 40%; margin: 10px 5% 20px; }
div.aktuelles-content div.eintrag {
  width: 45%;
}
  
  #anzeigen-durchsuchen {clear: both;  width: 595px; margin-left: 5%; }
  .grafik-container { margin-top: 0; width: 36%; }
  .columns { width: 46%; padding: 0 4% 0 0; }
  .bereiche-container, .themen-container { width: 48%; border: none; }
  .one h3 { background: #fff; }
  .themen-container { height: 220px; }
  .textTeaserRow .teaser {
    width: 250px;
  }
  div.bereiche-und-themen {display: none;}
}
@media (max-width: 720px) {
  html { background: none; }
  body { width: 100%; }
  #header { margin-top: 45px; }
  #logo { text-align: center; margin: 0 auto; width: 100%; padding-left: 0; }
  .main-nav { height: auto; width: 50%; float: left; position: static;}
  .main-nav ul { width: 100%; margin: 0; }
  .main-nav li { margin: 0; float: none; }
  .main-nav a:link, .main-nav a:visited, .main-nav li strong, .main-nav #start a:link, .main-nav #start a:visited { padding: 10px; }
  .main-nav a:hover, .main-nav a:focus, .main-nav a:active, .main-nav li strong {
    background: -moz-linear-gradient(left, #fff 10%, #e7e7e7 100%);
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,#fff), color-stop(10%,#fff), color-stop(100%,#e7e7e7));
    background: -webkit-linear-gradient(left, #fff 10%,#e7e7e7 100%);
    background: -o-linear-gradient(left, #fff 10%,#e7e7e7 100%);
    background: linear-gradient(to right, #fff 10%,#e7e7e7 100%);
  }
  .main-nav #start a:hover, .main-nav #start a:focus, .main-nav #start a:active{
    background: url(../img/icon-aussichtspunkt-active.png) no-repeat 10px 3px, -moz-linear-gradient(left, #fff 0%, #e7e7e7 100%);
    background: url(../img/icon-aussichtspunkt-active.png) no-repeat 10px 3px, -webkit-gradient(linear, left top, right top, color-stop(0%,#fff), color-stop(100%,#e7e7e7));
    background: url(../img/icon-aussichtspunkt-active.png) no-repeat 10px 3px, -webkit-linear-gradient(left, #fff 0%,#e7e7e7 100%);
    background: url(../img/icon-aussichtspunkt-active.png) no-repeat 10px 3px, -o-linear-gradient(left, #fff 0%,#e7e7e7 100%);
    background: url(../img/icon-aussichtspunkt-active.png) no-repeat 10px 3px, linear-gradient(to right, #fff 0%,#e7e7e7 100%);
  }
  .login-and-register { top: 0; right: 0; width: 100%; height: 45px; text-align: center; background: #ad0022; }
  .login-and-register button { margin: 5px auto 0; }
  .secondary-nav { clear: none; height: auto; width: 50%; float: right; }
  .information-nav { width: 100%; margin: 0; font-size: .875em; }
  .information-nav li { float: none; margin: 0; height: 36px; }
  .information-nav a { display: block; padding: 10px; }
  .information-nav a:active { background: #fff; }
  #content { clear: both; }
  .dropdown, .information-nav li:hover .dropdown {
    /*display: none;*/
    top:30px;
  -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
  -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
  box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
  }
  .dropdown.showSubMenu {
    left: -100px;
  }
  #main-content { width: 70%; font-size: .875em; }
  #aside-content { width: 30%; padding: 18px 0; font-size: .875em; }
  .breadcrumbs { font-size: .875em; }
  #main-content h1 { font-size: 1.325em; }
  .portal-button { width: 44%; margin: 10px 3% 20px 0; }
  #anzeigen-durchsuchen { clear: both; width: 120%; margin-top: 10px; }
  #anzeigen-durchsuchen form { margin: -20px 12% 0 0; }
  .contentElement, #below-the-fold .typoContentElement { font-size: .875em; padding: 10px 2%; }
  .bereiche-und-themen h2 { clear: left; }
  .bereiche-container { height: 170px; }
  #bottomfooter .centered:first-child, #bottomnav { display: none; }
}
@media (max-width: 540px) {
  #aside-content { padding-top: 120px; }
  .portale { text-align: center; }
  .portal-button { width: 75%; margin: 10px 0 20px 10%; }
  #anzeigen-durchsuchen form { float: none; margin-top: 10px; width: 90%; }
  .contentElement, #below-the-fold .typoContentElement { width: 96%; margin: 20px 0 0; padding: 10px 2%; }
  .grafik-container { float: none; width: 100%; text-align: center; }
  .bereiche-container, .themen-container { float: none; width: 100%; height: auto; padding: 0; }
    div.aktuelles-content div.eintrag {
    width: 90%;
    }
}
@media (max-width: 400px) {
  .breadcrumbs { width: 130%; }
  #anzeigen-durchsuchen { width: 120%; }
  .contentElement p,
  #below-the-fold .typoContentElement p { width: 100%; padding: 0; }
  .columns { float: none; width: 100%; padding: 0; }
  .bereiche-und-themen h2 { font-size: 1em; }
}
@media print {
  * { background: transparent !important; color: black !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; }
  a, a:visited { text-decoration: underline; }
  a[href]:after { content: " (" attr(href) ")"; }
  abbr[title]:after { content: " (" attr(title) ")"; }
  .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; }
  pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
  thead { display: table-header-group; }
  tr, img { page-break-inside: avoid; }
  img { max-width: 100% !important; }
  @page { margin: 0.5cm; }
  p, h2, h3 { orphans: 3; widows: 3; }
  h2, h3 { page-break-after: avoid; }
}