html, body {margin:0; padding:0; width:100%;}
body {font-family:'Titillium Web',Arial, sans-serif; font-size:15px; color:#000; background-color:#f2f2f2; background-image:url(../img/bg_body.png); background-repeat:repeat-x;}

* {box-sizing:border-box;}
a {color:#000;}
.clear {clear:both; height:1px; overflow:hidden; margin-top:-1px;}
.editorLink {display:block; position:absolute; top:0; right:0; height:40px; width:40px; background:#eee;}
.editorLink:before {content:"\f044"; display:block; position:absolute; width:100%; font-family:'icomoon' !important; font-size:32px; line-height:40px; text-align:center;}

#all {position:relative; width:100%; max-width:980px; margin:auto; text-align:left; background-image:url(../img/bg_main.gif); background-repeat:repeat-y;}
#header {position:relative; height:114px; color:#fff; background-image:url(../img/bg_body.png); background-repeat:repeat-x;}
#main {position:relative; float:right; width:670px; margin:70px 30px 20px 0; color:#333; background-color:#fff; border-top:6px #A6B7D3 solid; border-bottom:8px #A6B7D3 solid;}
#bottomOuter {position:relative; text-align:center; color:#fff; background-color:#7a91b8; border-top:2px #fff solid;}
#bottom {position:relative; width:95%; max-width:950px; margin:auto; padding:15px 0;}
#header p {font-size:11px;}

.logo {position:absolute; top:3px; left:0; padding-left:2px; height:108px; width:252px; background-image:url(../img/line_top.png); background-repeat:no-repeat;}
.logo a {display:block; height:100%; width:100%; background-image:url(../img/bg_topnavActive.png);}
.logo img {margin-top:40px;}

.topNavOuter {position:absolute; top:0; left:0; width:100%;}
.topNav {height:2px; margin:0 auto; width:auto; max-width:980px;}
.topNavS {display:none;}
.topNav .topNavS ul, .topNav .topNavS li {position:relative; display:inline-block; margin:0; padding:0;}
.topNav ul {margin:3px 0 0 252px; padding:0 0 0 2px; overflow:hidden; background-image:url(../img/line_top.png); background-repeat:no-repeat;}
.topNav li {list-style-type:none; float:left; margin:0; padding:0; width:25%; overflow:hidden; background-image:url(../img/line_top.png); background-position: top right; background-repeat:no-repeat;}
.topNav li a {display:block; height:108px; padding:83px 0 0 15px; margin-right:2px; color:#fff; font-size:1em; font-weight:bold; text-decoration:none; line-height:1em;}

.mainNav {width:256px; padding-bottom:20px;}
.mainNav ul {margin:0 0 28px; padding:70px 3px 0; list-style-type:none; background-image:url(../img/bg_menu.png); background-repeat:no-repeat; border-bottom:2px #fff solid;}
.mainNav li {border-top:2px #fff solid; padding:0; margin:0;}
.mainNav li a {display:block; height:110px; padding-left:15px; overflow:hidden; line-height: 170px; color:#000; font-weight:bold; text-decoration:none; background-position:top right; background-repeat:no-repeat;}

.mainNav .nav5.liAct a {background-color:#FBBF64;}
.mainNav .nav6.liAct a {background-color:#B0DE6B;}
.mainNav .nav7.liAct a {background-color:#7999D3;}

.navTxt {border-top:2px #fff solid; margin-top:28px;}
.navTxt a {display:block; padding:15px 17px; font-weight:bold; text-decoration:none; color:#333;}
.navPic {text-align:center; padding: 10px 0;}
.navPic a {display:block;}
.navPic img {display:block; margin:0 auto;}
.navPic a.act img {border-color:#859dc7;}

.subNav {position:absolute; top:-42px; left:0; width:101%;}
.subNav ul {margin:0; padding:0;}
.subNav li {list-style-type:none; float:left; width:19%; margin:0; padding:0; margin-right:1%; overflow:hidden;}
.subNav li.liAct {padding-bottom:2px;}
.subNav li a {display:block; height:36px; color:#666; font-size:0.85em; font-weight:bold; white-space:nowrap; text-decoration:none; line-height:36px; text-align:center; background:#f6f6f6; border-color:#999; border-style:solid; border-width:2px 2px 0; border-radius:15px 0 0 0;}
.subNav .liAct a {height:42px; color:#000; background-color:#fff; border-color:#A6B7D3; border-width:4px 4px 0px;}

.content {min-height:368px; overflow:hidden; margin:15px 25px; font-size:1em; line-height:1.45em;}
.boxFull, .boxHead, .boxContent {position:relative;}
.boxFull:before, .boxFull:after {content:""; display:table; clear:both;}
h1 {font-size:1.25em; margin:1em 0 1em; padding:0.5em 0; border-top:2px #859dc7 solid; border-bottom:2px #859dc7 solid;}
h2 {font-size:1.1em; margin:1em 0 1em; padding:0.5em 0; border-top:2px #BCC8DB solid; border-bottom:2px #BCC8DB solid;}
h3 {font-size:1em;  margin:1em 0 1em;; padding:0.1em 0; border-top:2px #BCC8DB solid; border-bottom:2px #BCC8DB solid;}
p {margin:0 0 0.8em;}
td, th {text-align:left; vertical-align:top;}
.content a {color:#224884;}
.content ol {margin:0 0 0.8em; padding:0 0 0 20px;}
.content ul {margin:0 0 0.8em; padding:0 0 0 8px;}
.content ol li {margin:0 0 0.8em; padding:0;}
.content ul li {position:relative; list-style-type:none; margin:0 0 0.6em; padding:0 0 0 14px;}
.content ul li:before {content:""; position:absolute; top:0.5em; left:0; display:block; height:6px; width:6px; background-color:#7A91B8;}
.content img {display:block; width:auto;height:auto; max-width:100%; margin:0 auto;}
.fotoLeft, .content img.fotoLeft {height:auto; width:auto; max-width:49%; float:left; margin:0.2em 2% 0.8em 0;}
.fotoRight, .content img.fotoRight {height:auto; width:auto; max-width:49%; float:right; margin:0.2em 0 0.8em 2%;}
a.more {padding-left:12px; background-image:url(../img/arrow_more.gif); background-position:0 3px; background-repeat:no-repeat;}
.btn {padding:0.3em 1.5em; font-size:1em; font-weight:bold; color:#fff; background-color:#44669E; border:none; cursor:pointer;}

.messagebox {padding:10px; background-color:#ffb;}
.loginContent {background-color:#eee; padding:0.5em; margin:15px 25px; font-size:1em; line-height:1.45em;}
.contentBottom {position:relative; background-color:#dedede;margin:30px 0 0; padding:5px 20px;}
.contentBottom a {color:#000;text-decoration:none;}
.printLink {position:relative; padding-left:2em; font-size:0.9em; line-height:1em;}
.printLink:before {content:"\f02f"; position:absolute; top:0.1em; left:0; font-family:'icomoon' !important; font-size:1.5em; color:#333;}
#toTop {position:absolute; top:-3px; left:50%; height:40px; width:40px; margin-left:-20px; color:#fff; background-color:#3d5f96; border-radius:50%; cursor:pointer;}
#toTop:before {content:"\f062"; display:block; width:40px; font-family:'icomoon' !important; font-size:26px; line-height:40px; text-align:center;}

#bottom p {font-size:0.85em; line-height:1.4em; text-align:left; margin:0;}
#databnet {float:right; margin:0.3em 0;}
#databnet img {display:block;}

.slideBox .boxHead h2 {margin:0.5em 0 1em; padding-left:1.7em; cursor: pointer;}
.slideBox .boxHead h2:before {position:absolute; top:0.4em; left:0.1em; content:"\f0a9"; font-family:'icomoon' !important; font-size:1.4em; color:#5E81BB;}
.slideBox.opened .boxHead {background-color:#eee;}
.slideBox.opened .boxHead h2:before {content: "\f0ab";}
.slideBox .boxContent {display:none;}

.csc-textpic:before, .csc-textpic:after {content:""; display:table; clear:both;}
.csc-textpic-intext-left .csc-textpic-imagewrap {float:left; padding:0 2% 2% 0; max-width:33%;}
.csc-textpic-intext-left .csc-textpic-text {overflow:hidden;}
.csc-textpic-intext-left h3 {margin-top:0;}
.frame_highlight_small {background:#eee; margin:0 0 1em; padding:1em;}

.category_5 .subNav a:hover, .category_5 .subNav .liAct a, .category_5 #main, .category_5 h1, .category_5 h2 {border-color:#FBBF64;}
.category_6 .subNav a:hover, .category_6 .subNav .liAct a, .category_6 #main, .category_6 h1, .category_6 h2 {border-color:#b0de6b;}
.category_7 .subNav a:hover, .category_7 .subNav .liAct a, .category_7 #main, .category_7 h1, .category_7 h2 {border-color:#7999D3;}
.category_5 .slideBox .boxHead h2:before {color:#ff9900;}
.category_6 .slideBox .boxHead h2:before {color:#85CC1C;}
.category_7 .slideBox .boxHead h2:before {color:#466BA7;}

/* Login */
.loginbox {background:#eee; padding:10px;}
.loginbox p {width:250px; max-width:100%; margin:0 auto 0.2em;}
.loginbox label {display:block;}
.loginbox .iMedium {width:100%; border:1px #ccc solid; padding:2px; font-family:Arial, sans-serif; font-size:1em;}
.loginbox .btn {width:100%; margin-top: 1em;}
.loginInfo {position:absolute; top:118px; left:2px; height:65px; width:250px; padding:0 15px; overflow:hidden;}
.loginInfo p {margin:0; padding:0.1em 0; white-space:nowrap; text-align:center; color:#fff;}
.loginInfo .btn { font-size:1em;}

/* Referenzen */
.refBox {clear:both; margin:0; padding:10px 30px; border-top:2px #BCC8DB solid;}
.refBoxPic {width:220px; max-width:45%; float:left; text-align:center;}
.refBox p {margin-left:50%;}


@media screen and (min-width:990px){
  .topNav li.liAct a, .topNav li a:hover {background-image:url(../img/bg_topnavActive.png); background-repeat:repeat-x;}
  .mainNav .nav5 a {background-image:url(../img/nav_gastro.png);}
  .mainNav .nav6 a {background-image:url(../img/nav_handel.png);}
  .mainNav .nav7 a {background-image:url(../img/nav_spezial.png);}
  .mainNav .nav5 a:hover {background-color:#FBBF64;}
  .mainNav .nav6 a:hover {background-color:#B0DE6B;}
  .mainNav .nav7 a:hover {background-color:#7999D3;}
  .navPic a:hover img {border-color:#fff;}
  .subNav a:hover {color:#000; background-color:#fff;}
  .slideBox .boxHead:hover {background-color:#eee;}
  .topNavS .homeLink {display:inline-block; height:40px; width:110px; margin-left:8px; background-image:url('../img/firstpos.png'); background-size:100% auto; background-position:center;}
  .topNavS .navLink {display:inline-block; height:30px; width:30px; margin:5px 3px; background-size:100%; border-radius:50%; transition:0.1s;}
  .topNavS .nav5 {background-color:#FBBF64; background-image:url(../img/nav_gastro.png);}
  .topNavS .nav6 {background-color:#B0DE6B; background-image:url(../img/nav_handel.png);}
  .topNavS .nav7 {background-color:#7999D3; background-image:url(../img/nav_spezial.png);}
  .topNavS .navLink:hover {transform: scale(1.2);}
  .scrolled .topNavOuter {position:fixed; top:0; left:0; width:100%; background:#3D5F96; border-bottom:2px #fff solid; box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.75);}
  .scrolled .topNav {height:40px;}
  .scrolled .topNav ul {margin-top:0;}
  .scrolled .topNav li a {height:38px; padding-top:15px;}
  .scrolled .topNavS {display:block; position:absolute; top:0: left:0;}
}

@media screen and (min-width:1280px){
  body {font-size:16px;}
  #all, .topNav {max-width:1250px;}
  #main {width:850px; margin:70px 70px 20px 0;}
  .content, .loginContent {margin:15px 75px;}
  #bottom {max-width:1140px;}
  #bottom p {font-size:0.9em;}
}

@media screen and (max-width:989px){
  body {background-image:none;}
  #all {background-image:none;}
  #main {max-width:100%; float:none; margin:60px auto 20px;}
  #header {height:50px; background-image:none; background-color:#3d5f96;}
  #header p, .logo img {display:none;}
  .logo {display:block; height:46px; width:110px;}
  .logo a {background-image:url('../img/firstpos.png'); background-size:100% auto;}
  #nav {position:fixed; top:0; left:100%; width:100%; height:100%; background-color:#fff; z-index:15; transition:0.5s;}
  #navOpen {position:absolute; top:5px; left:-40px; height:40px; width:40px; color:#fff; background:#3D5F96; cursor:pointer; z-index:15;}
  #navOpen:before {content:"\f0c9"; display:block; font-family: 'icomoon' !important; font-size:26px; line-height:40px; text-align:center;}
  #navClose {position:absolute; top:1px; right:1px; height:36px; width:36px; color:#fff; background:#3D5F96; cursor:pointer; z-index:15;}
  #navClose:before {content:"\f00d"; display:block; font-family: 'icomoon' !important; font-size:26px; line-height:36px; text-align:center;}
  .topNavOuter, .topNav, .topNav ul {position:relative; height:auto; width:auto; margin:0; padding:0; background-image:none;}
  .topNav li {float:none; width:auto; background-image:none; border-top:1px #ccc solid;}
  .topNav li a {height:auto; padding:0.8em 0; text-align:center; color:#333; background-color:#eee;}
  .topNav li.active a {background-color:#fff;}
  .mainNav, .mainNav ul {position:relative; height:auto; width:auto; margin:0; padding:0; background-image:none; border:none;}
  .mainNav li {border-top:1px #ccc solid;}
  .mainNav li a {height:auto; padding:0.8em 0; line-height:1em; text-align:center; color:#333; background-color:#eee;}
  .navPic {margin:0; padding:4px;}
  .navPic img {height:auto; width:auto; max-height:40px; border-width:2px;}
  .navTxt {border-top:1px #ccc solid; margin:0;}
  .navTxt a {padding:0.8em 0; color:#333; text-align:center; background-color:#eee;}
  .navOpened {overflow:hidden;}
  .navOpened #nav {left:0;}
  #bottom p {text-align:center; padding:0.5em 0;}
  #databnet {position:absolute; right:0; bottom:2px;}
  .loginInfo {position:relative; top:auto; left:auto; width:670px; max-width:100%; margin:10px auto -15px; background-color:#fff;}
  .loginInfo p {text-align:left; color:#000;}
}

@media screen and (max-width:700px){
  #main {margin-top:0;}
  .subNav {position:relative; top:auto; left:auto; width:auto;}
  .subNav li, .subNav li.liAct {float:none; width:auto; margin:0; padding:0;}
  .subNav li a, .subNav li.liAct a {height:auto; font-size:1em; border-width:1px; border-radius:0;}
  .loginInfo {margin-bottom:0; background-color:transparent;}
}

@media screen and (max-width:575px){
  .fotoLeft, .fotoRight {float:none; width:auto; max-width:100%;}
  .fotoLeft img, .fotoRight img, .content img.fotoLeft, .content img.fotoRight {float:none; max-width:100%; margin:0 auto 0.5em;}
  .refBoxPic {width:auto; max-width:100%; float:none; padding-bottom:0.5em;}
  .refBox p {margin-left:0; text-align:center;}
  .csc-textpic-intext-left .csc-textpic-imagewrap {float:none; max-width:100%; padding:0 0 5px;}
}

@media screen and (max-height:475px) and (max-width:989px){
  .navPic {display:none;}
}