/* #################
   ZENTRALNAV 
   ################# */

.zentralnavigation {
  font-family: 'Open Sans', sans-serif;
  background: rgba(221, 221, 221, 0);
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 999;
}

.zentralnavigation-header {
  background: transparent;
  position: relative;
  padding: 21px 20px;
  max-width: 1280px;
  margin: auto;
  z-index: 888;
  opacity: 1;
}

.zn-header_aktiv {
  background: #fff;
  background: rgba(255, 255, 255, .98);
}

.zentralnavigation-header > .btn {
  /*Change by PB - 28.03.2015*/
  display: none;
}

.zn-header_aktiv > .btn {
  /*Change by PB - 28.03.2015*/
  display: block;
}

.zentralnavigation-header-logowrap {
  background: transparent;
  position: absolute;
  width: 100px;
  height: 100px;
  top: 15px;
  left: 50%;
  margin-left: -50px;
  z-index: 800;
  cursor: pointer;
  -webkit-transition: top .05s ease-in 0s;
  transition: top .05s ease-in 0s;
  /*Change by PB - 28.03.2015*/
  -webkit-transform-origin: center center;
  transform-origin: center center;
}

.zentralnav_home .zentralnavigation-header-logowrap {
  top: 265px;
  width: 200px;
  height: 200px;
  margin-left: -100px;
  margin-top: -40px;
}

.zentralnavigation-header-logo {
  width: 100px;
  height: 100px;
  background: #fff url("../bilder/kompass2017.svg") no-repeat 50% 50%;
  background-size: 80px auto;
  border-radius: 50%;
  -webkit-transform-origin: center center;
  transform-origin: center center;
}

.zentralnav_home .zentralnavigation-header-logo {
  width: 200px;
  height: 200px;
  background-size: 120px auto;
}

.zentralnavigation-header-logo:after {
  content: "Kompass";
  display: block;
  font-family: "ob-sans", serif;
  font-weight: bold;
  font-size: 16px;
  color: #00457c;
  position: absolute;
  bottom: -15px;
  left: 0;
  right: 0;
  text-align: center;
}

.zentralnav_home .zentralnavigation-header-logo:after {
  bottom: -7px;
  font-size: 20px;
}


.zn-header_aktiv .zentralnavigation-header-logo:after {
  bottom:-7px;
}


/* #################
   DG KOMPASSNADEL 
   ################# */

.nadel {
  background: rgba(0, 0, 0, 0) url("/addons/DGZentralNav/desktop/bilder/nadel.svg") no-repeat 50% 50%;
  position: absolute;
  width: 100px;
  height: 100px;
  margin-left: -50px;
  margin-top: -50px;
  background-size: 60px auto;
  background-position: 50% 50%;
  right: auto;
  left: 50%;
  top: 50%;
  -webkit-transform-origin: center center;
  transform-origin: center center;
  -webkit-transform: rotate3d(0, 0, 1, -15deg);
  transform: rotate3d(0, 0, 1, -15deg);
}

.zentralnav_home .nadel {
  width: 200px;
  height: 200px;
  margin-left: -100px;
  margin-top: -100px;
  background-size: 80px auto;
}

.zn-header_aktiv .nadel {
  width: 120px;
  height: 120px;
  margin-left: -60px;
  background-size: 60px auto;
  top: 50px;
}

.zentralnav_home .zn-header_aktiv .nadel {
  top: 100px;
}

.zn-header_aktiv .zentralnavigation-header-logowrap {
  -webkit-transition: top .05s ease-in 0s;
  transition: top .05s ease-in 0s;
  top: 15px;
  width: 120px;
  height: 120px;
  margin-left: -60px;
  -webkit-transform-origin: center center;
  transform-origin: center center;
}

.zentralnav_home .zn-header_aktiv .zentralnavigation-header-logowrap {
   top: 50px;
}


.zn-header_aktiv .zentralnavigation-header-logo {
  background: #efefef url("../bilder/kompass2017.svg") no-repeat 50% 50%;
  background-size: 80px auto;
  width: 120px;
  height: 120px;
  -webkit-transform-origin: center center;
  transform-origin: center center;
}

.zn-header_aktiv .zentralnavigation-header-logo:after {
  font-size: 16px;
}

.zentralnavigation-helptext {
  position: absolute;
  z-index: 999;
  font-size: 14px;
  width: 450px;
  background: #fff;
  border: 1px solid #00457c;
  top: 65px;
  padding: 15px;
  box-shadow: 0 0 5px #aaa;
}

.zentralnavigation-helptext h3 {
  margin-top: 0px;
}

.zentralnavigation-wrap {
  max-width: 1280px;
  margin: auto;
  box-shadow: 0 0 70px 0 #8E8E8E;
  overflow: hidden;
  background: rgb(221, 221, 221);
  background: url("../bilder/kompass-bg.svg"), url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIzMCUiIHN0b3AtY29sb3I9IiNkZGRkZGQiIHN0b3Atb3BhY2l0eT0iMSIvPgogICAgPHN0b3Agb2Zmc2V0PSIzMCUiIHN0b3AtY29sb3I9IiNlZWVlZWUiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
  background: url("../bilder/kompass-bg.svg"), -webkit-gradient(linear, left top, right top, color-stop(30%, rgba(221, 221, 221, 1)), color-stop(30%, rgba(238, 238, 238, 1)));
  background: url("../bilder/kompass-bg.svg"), -webkit-linear-gradient(left, rgba(221, 221, 221, 1) 30%, rgba(238, 238, 238, 1) 30%);
  background: url("../bilder/kompass-bg.svg"), linear-gradient(to right, rgba(221, 221, 221, 1) 30%, rgba(238, 238, 238, 1) 30%);
  filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#dddddd', endColorstr='#eeeeee', GradientType=1);
  background-repeat: no-repeat, no-repeat;
  background-position: 49% 90%, 0 0;
  background-size: 460%, 100%;
  display: block;
  height: 0;
  opacity: 0;
  -webkit-transition: all 0.2s ease-in 0s;
  transition: all 0.2s ease-in 0s;
}

.zn-wrap_aktiv {
  /*Change by PB - 28.03.2015*/
  opacity: 1;
  display: block;
  height: auto;
  -webkit-transition: all 0.2s ease-in 0s;
  transition: all 0.2s ease-in 0s;
}

.zentralnavigation-nav {
  float: left;
  background: transparent;
  width: 30%;
  padding: 75px 4% 5% 8%;
}


/* #################
   ZENTRALNAV CONTENT
   ################# */

.zentralnavigation-content {
  width: 70%;
  float: left;
  padding: 75px 3% 5% 3%;
  font-weight: 400;
  font-size: 14px;
  height: 100%;
  min-height: 400px;
  position: relative;
}

.zn-header {
  margin: 0 0 10px 0;
  font-size: 24px;
  position: relative;
	color:#555;
}

.zn-header + .zentralnavigation-content-list {
  margin: 20px 0 0 0;
}

.zentralnavigation-content-item {
  float: left;
  width: 31.66%;
  padding: 0 0 0 0;
  margin: 0 0 25px 2.5%;
}

.zentralnavigation-content-item > ul {
  /*Change by PB - 17.03.2015*/
  display: none;
}

.zentralnavigation-content-item:nth-child(3n+1) {
  clear: left;
  margin-left: 0;
}

.zn-content-item_aktiv > ul {
  /*Change by PB - 17.03.2015*/
  display: block
}

.zentralnavigation-content-link {
  display: block;
  background: #fff;
  padding: 7px 25px 7px 7px;
  position: relative;
  font-size: 14px;
  color: #535353;
  text-decoration: none;
  height: 34px;
  line-height: 17px;
  border-radius: 0 66px 66px 0;
}

.zn-content-link_external:after {
  -webkit-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  transform: rotate(-90deg);
}

.zentralnavigation-content-link:after {
  content: "\e044";
  display: block;
  background: transparent;
  border-radius: 100px;
  position: absolute;
  top: 4px;
  right: 4px;
  width: 24px;
  height: 24px;
  color: #aaa;
  font-size: 22px;
  line-height: 24px;
}

.zn-content-item_aktiv > .zentralnavigation-content-link:after {
  content: "\e043";
}

.zn-content-link_dglive:after {
  color: #00437c;
}

.zn-content-link_medien:after {
  color: #83062e;
}

.zn-content-link_sport:after {
  color: #de3d0c;
}

.zn-content-link_europa:after {
  color: #00437c;
}

.zn-content-link_kulturerbe:after {
  color: #7e775d;
}

.zn-content-link_bildung:after {
  color: #00a091;
}

.zn-content-link_statistik:after {
  color: #03583e;
}

.zn-content-link_recht:after {
  color: #03583e;
}

.zn-content-link_tourismus:after {
  color: #009c39;
}

.zn-content-link_familie:after {
  color: #FCB430;
}

.zn-content-link_mio:after {
  color: #009c39;
}

.zn-content-list_2 {
  padding: 0 20px 0 0;
}

.zn-content-link_2 {
  font-size: 13px;
  display: block;
  padding: 5px 7px;
  margin: 0 0 1px 0;
  background: #fff;
}

.zn-content-link_2:hover {
  background: #eee;
}


/* #################
   ZENTRALNAV NAV
   ################# */

.zentralnavigation-nav-list {
  font-weight: bold;
  font-size: 14px;
}

.zentralnavigation-nav-item {
  position: relative;
  padding: 0 0 0 10px;
  border-top: 1px solid #eee;
  border-radius: 10px 0 0 10px;
}

.zentralnavigation-nav-link {
  display: block;
  padding: 0 5px 0 35px;
  height: 40px;
  line-height: 40px;
}

.zn-nav-link_active {
  background: #aaa;
  color: #fff;
  border-top: 0px solid #aaa;
}

.zentralnavigation-nav-item:first-child {
  border-top: 0px solid #aaa;
}

.zentralnavigation-nav-link:before {
  content: "";
  display: block;
  background: #ddd;
  border-radius: 100%;
  position: absolute;
  top: -2px;
  left: -8px;
  width: 43px;
  height: 43px;
  text-align: center;
}

.zentralnavigation-nav-link:after {
  background: #00457c;
  position: absolute;
  top: 50%;
  margin-top: -16px;
  left: -2px;
  font-size: 16px;
  color: #fff;
  text-align: center;
  width: 32px;
  height: 32px;
  border-radius: 100%;
  line-height: 32px;
  text-align: center;
  background-size: 14px 14px;
}

.zn-nav-link_themen:after {
  content: "";
  background: #00437d url("../bilder/nav-rund.svg") no-repeat 49% 49%;
  background-size: 18px 18px;
}

.zn-nav-link_dienstleistungen:after {
  content: "";
  background: #00437d url("../bilder/puzzle.svg") no-repeat 50% 49%;
  background-size: 16px 16px;
}

.zn-nav-link_anwendungen:after {
  content: "";
  background: #00437d url("../bilder/tool.svg") no-repeat 50% 50%;
  background-size: 16px 16px;
}

.zn-nav-link_service:after {
  content: "";
  background: #00437d url("../bilder/daumen.svg") no-repeat 50% 49%;
  background-size: 16px 16px;
}

.no-svg .zn-nav-link_themen:after {
  content: "";
  background: #00437d url("../bilder/nav-rund.png") no-repeat 49% 49%;
  background-size: 18px 18px;
}

.no-svg .zn-nav-link_dienstleistungen:after {
  content: "";
  background: #00437d url("../bilder/puzzle.png") no-repeat 50% 49%;
  background-size: 16px 16px;
}

.no-svg .zn-nav-link_anwendungen:after {
  content: "";
  background: #00437d url("../bilder/tool.png") no-repeat 50% 50%;
  background-size: 16px 16px;
}

.no-svg .zn-nav-link_service:after {
  content: "";
  background: #00437d url("../bilder/daumen.png") no-repeat 50% 49%;
  background-size: 16px 16px;
}


/* #################
   ZENTRALNAV SUCHE
   ################# */

.zentralnavigation-nav-search,
.zentralnavigation-dlk-search {
  position: relative;
  margin: 0 0 35px 0;
}

.zentralnavigation-nav-search-input,
.zentralnavigation-dlk-search-input {
  border: 0;
  background: #fff;
  padding: 0 0 0 2%;
  width: 98%;
  z-index: 0;
  position: relative;
  z-index: 560;
  border-radius: 0 18px 18px 0;
  font-size: 13px;
  line-height: 12px;
  height: 32px;
}

::-webkit-input-placeholder {
  /* WebKit browsers */
  color: #888;
  font-size: 13px;
  font-style: italic;
  padding-top: 2px;
}

:-moz-placeholder {
  /* Mozilla Firefox 4 to 18 */
  color: #888;
  opacity: 1;
  font-size: 13px;
  font-style: italic;
  padding-top: 2px;
}

::-moz-placeholder {
  /* Mozilla Firefox 19+ */
  color: #888;
  opacity: 1;
  font-size: 13px;
  font-style: italic;
  padding-top: 2px;
}

:-ms-input-placeholder {
  /* Internet Explorer 10+ */
  color: #888;
  font-size: 13px;
  font-style: italic;
  padding-top: 2px;
}

.placeholder {
  display: none !important;
}

.btn_znsearch,
.btn_dlksearch {
  position: absolute;
  right: -4px;
  top: 50%;
  margin-top: -17px;
  z-index: 1;
  border: 4px solid #ddd;
  border: 4px solid rgba(221, 221, 221, 1);
  width: 34px;
  height: 34px;
  z-index: 570;
  background-color: #00457c;
  background-image: url("../bilder/arrow-right.svg");
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-size: 16px;
}

.no-svg .btn_znsearch,
.no-svg .btn_dlksearch {
  background-image: url("../bilder/arrow-right.png");
}

.btn_dlksearch {
  border: 4px solid #efefef;
  border: 4px solid rgba(239, 239, 239, 1);
}

.btn_znsearch:focus,
.btn_znsearch:active,
.btn_dlksearch:focus,
.btn_dlksearch:active {
  position: absolute;
  right: -4px;
  top: 50%;
  margin-top: -17px;
  z-index: 1;
  border: 4px solid #ddd;
  border: 4px solid rgba(221, 221, 221, 1);
  width: 34px;
  height: 34px;
  z-index: 570;
  background-color: #00457c;
  background-image: url("../bilder/arrow-right.svg");
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-size: 16px;
}

.btn_dlksearch:focus,
.btn_dlksearch:active {
  border: 4px solid #efefef;
  border: 4px solid rgba(239, 239, 239, 1);
}


/* #################
   ZENTRALNAV SUCHERGENISSE
   ################# */

.suchdetails {
  padding: 10px 0;
  margin: 0 0 25px 0;
  position: relative;
}

.zn-anz-erg {
  margin: 0 5px 0 0;
  position: relative;
}

.zn-suchbox {
  margin: 0 0 30px 0;
}

.zn-content-suchitem {
  margin: 0 0 20px 0;
}

.zn-suchergebnisse {
  clear: both;
  position: relative;
}

#znavslidareafull_artikel,
#znavslidareafull_doks {
  -webkit-transition: all .2s ease-in 0s;
  transition: all .2s ease-in 0s;
}

.zn-slider {
  overflow: hidden;
  width: 100%;
  position: relative;
}

.zn-suche-liste {
  clear: both;
  list-style: none outside;
  margin: 0;
  padding: 5px 0 0 0;
  width: 2000px;
  position: relative;
  overflow: hidden;
}

.zn-suchergebnisse_aktiv .suche-liste {
  width: 100%;
}

.zn-suchergebnisse_aktiv:after,
.zn-suchergebnisse_aktiv:before,
.zn-suchergebnisse_dlk:after,
.zn-suchergebnisse_dlk:before {
  display: none;
}

.zn-suche-item {
  float: left;
  width: 187px;
  margin: 5px 0 5px 18px;
  background: #fff;
}

.zn-suche-item:first-child {
  margin: 5px 0 5px 0;
}

.zn-suchergebnisse_aktiv .zn-suche-item {
  /*width: 23.35%;*/
  /*Change by PB - 19.03.2015*/
  margin: 5px 0 18px 2%;
  /*Change by PB - 19.03.2015*/
}

.zn-suchergebnisse_aktiv .zn-suche-item:nth-child(2n+1) {
  margin: 5px 0 18px 0;
}

.zn-suche-link {
  display: block;
  text-decoration: none;
  color: #525252;
  font-size: 11px;
  height: 100px;
  padding: 3px 0 5px 0;
  background: #fff;
  line-height: 1.5;
  -webkit-transition: all .15s ease-in 0s;
  transition: all .15s ease-in 0s;
  width: 100%;
  word-wrap: break-word;
  position: relative;
  border-radius: 0;
}

.zn-suche-link:after {
  content: "";
  display: block;
  background: #fff;
  padding: 0;
  color: #fff;
  height: 10px;
  width: 10px;
  border-radius: 100%;
  position: absolute;
  top: -7px;
  right: -7px;
  box-shadow: 0px 0px 4px 4px #EEEEEE
}

.zn-suche-link:before {
  content: "";
  display: none;
  position: absolute;
  top: -10px;
  right: -5px;
  background: #eee;
  padding: 3px 15px 3px 3px;
  border-radius: 10px;
}

.zn-suche-link-details-title {
  font-size: 11px;
  word-wrap: break-word;
  font-weight: bold;
  margin-bottom: 5px;
}

.zn-suchergebnisse_dlk .zn-suche-link:after {
  display: none;
}

.zn-suche-link[href*="ostbelgienlive"]:after {
  background: #00457c;
}

.zn-suche-link[href*="stat"]:after {
  background: #10583d;
}

.zn-suche-link[href*="bildung"]:after {
  background: #18a091;
}

.zn-suche-link[href*="sport"]:after {
  background: #e73e0c;
}

.zn-suche-link[href*="europa"]:after {
  background: #00457c;
}

.zn-suche-link[href*="rechts"]:after {
  background: #10583d;
}

.zn-suche-link[href*="medien"]:after {
  background: #c35a66;
}

.zn-suche-link[href*="kultur"]:after {
  background: #91886b;
}

.zn-suche-link[href*="tourismus"]:after,
.zn-suche-link[href*="service"]:after {
  background: #0d9739;
}

.zn-suche-link[href*="gemeindewahlen"]:after {
  background: #00457c;
}

.zn-suche-liste_bilder .zn-suche-link {
  padding: 0;
}

.zn-suche-link:hover,
.zn-suche-link:active {
  -webkit-transform: translate3d(0, -3px, 0);
  transform: translate3d(0, -3px, 0);
  -webkit-transform-origin: center;
  -ms-transform-origin: center;
  transform-origin: center;
  -webkit-transition: all .15s ease-in 0s;
  transition: all .15s ease-in 0s;
  overflow: visible;
}

.zn-suche-link-details {
  width: 100%;
  overflow: hidden;
  height: 100%;
  padding: 5px 5px 5px 5px;
}

.zn-suche-img {
  display: block;
  margin: auto;
  max-width: 100%;
  height: auto !important;
}

.zn-suche-slidingarea {
  float: left;
}

.zn-suche-link-details-size {
  display: inline;
  font-size: 10px;
  font-style: italic;
}


/* #################
   DLK SUCHERGENISSE
   ################# */

.zn-dlk-stichworthelper,
.zn-portal-stichworthelper {
  position: absolute;
  z-index: 550;
  background: #fff;
  background: rgba(255, 255, 255, 0.95);
  width: 94.5%;
  box-shadow: 0 2px 3px 0 #999;
}

.zn-dlk-helperlist,
.zn-portal-helperlist {
  padding: 10px;
  font-size: 13px;
  max-height: 240px;
  overflow-y: scroll;
}

.zn-dlk-helperitem,
.zn-portal-helperitem {
  padding: 5px 5px;
  cursor: pointer;
}

.zn-dlk-helperitem:hover,
.zn-portal-helperitem:hover {
  background: #efefef;
}

.zn-dlk-suche-liste_dlk,
.zn-portal-suche-liste_portal {
  width: 100%;
}


/* #################
   ZENTRALNAV-HILFE
   ################# */

.zentralnavigation-video {
  display: none;
}

.zentralnavigation-video {
  width: 65px;
  height: 55px;
  background: #afafaf;
  position: absolute;
  top: 5px;
  left: -52px;
  background: rgba(0, 0, 0, 0) url("/dgicons/help.svg") no-repeat 50% 50%;
  background-size: 100% auto;
}

.body_home .zentralnavigation-video {
  width: 85px;
  height: 75px;
  top: -50px;
  left: 40px;
  width: 0;
  height: 0;
  overflow: hidden;
  display: block;
}

.zentralnavigation-video:before {
  content: "";
  display: block;
  width: 24px;
  height: 24px;
  position: absolute;
  top: 13px;
  left: 21px;
  background: rgba(0, 0, 0, 0) url("/dgicons/icon_question.svg") no-repeat 50% 50%;
  background-size: 24px 24px;
}

.body_home .zentralnavigation-video:before {
  width: 32px;
  height: 32px;
  top: 19px;
  left: 27px;
  background-size: 32px 32px;
}

.zentralnavigation-video:hover:before {
  background: rgba(0, 0, 0, 0) url("/dgicons/play.svg") no-repeat 50% 50%;
}

.zentralnavigation-header-logowrap:hover .zentralnavigation-video {
  display: block;
}

.zn-header_aktiv .zentralnavigation-video,
.zn-header_aktiv .zentralnavigation-video:hover {
  display: none !important;
}


.zentralnavigation-content video {
  width: 100%;
  
}

.zn-btn_help, 
.zentralnavigation-video {
  display: none !important;
}

/* #################
   HELPERS 
   ################# */

.clearfix:before,
.clearfix:after {
  content: " ";
  display: table;
}

.clearfix:after {
  clear: both;
}

.clearfix {
  *zoom: 1;
}