@font-face {
   font-family: "Montserrat";
   src: url("../../fonts/MontserratRegular.eot");
   src: url("../../fonts/MontserratRegular.eot") format("embedded-opentype"),
        url("../../fonts/MontserratRegular.woff2") format("woff2"),
        url("../../fonts/MontserratRegular.woff") format("woff"),
        url("../../fonts/MontserratRegular.ttf") format("truetype"),
        url("../../fonts/MontserratRegular.svg#MontserratRegular") format("svg");
}

@font-face {
   font-family: "MontserratMedium";
   src: url("../../fonts/MontserratMedium.eot");
   src: url("../../fonts/MontserratMedium.eot") format("embedded-opentype"),
        url("../../fonts/MontserratMedium.woff2") format("woff2"),
        url("../../fonts/MontserratMedium.woff") format("woff"),
        url("../../fonts/MontserratMedium.ttf") format("truetype"),
        url("../../fonts/MontserratMedium.svg#MontserratMedium") format("svg");
}

:root {
   --msf-bg-color: #1478b4;
   --msf-trenner-farbe: #A3287A;
   --msf-text-hell: #ffffff;
}

.mdd-detail {
   --msf-bg-color: #646262;
}

body,
td,
th,
p,
h1,
h2,
h3,
h4,
h5 {
   font-family: "Montserrat" !important;
}

body {
   background-image: none;
}

p,
li,
h1 {
   font-family: "Montserrat";
   font-size: 18px;
   line-height: 1.4em;
   font-weight: 300;
}

h1 {
   font-weight: 700;
   font-size: 40px;
}

h1,
h3 {
   font-weight: bold !important;
}

h2 {
   margin-top: 64px;
}

.flag {
   width: 22px !important;
   height: 15px !important;
}

.city-logo {
   width: 70%;
   margin-bottom: 40px;
}

.city-karte {
   width: 100%;
}

.logos {
   max-width: 170px;
   max-height: 70px;
   padding: 0 20px;
}

.mdd-bild {
   max-width: 500px;
   max-height: 600px;
   margin: 0 auto;
}

#googlemaps {
   width: 100% !important;
   height: 360px;
}

#googlemaps .x-panel,
#googlemaps .x-panel-body,
#googlemaps .x-panel-body-default,
#googlemaps .x-fit-item,
#googlemaps .gmappanel,
#googlemaps .gmappanel-body,
#googlemaps .gm-style,
#googlemaps iframe {
   width: 100% !important;
   max-width: 100% !important;
   height: 100% !important;
}

#googlemaps .x-panel-body-default,
#googlemaps .x-panel-body {
   position: relative;
}

.beschreibung b {
   display: block;
   margin-bottom: 20px;
}

.blocksatz {
   text-align: justify;
   hyphens: auto;
}

.durchsicht {
   background-color: rgba(255,255,255,0.8);
   padding: 20px;
}

.aussteller p {
   font-size: 26px;
   line-height: 1.5em;
   font-weight: 400;
}

.aussteller a {
   text-decoration: none;
   color: black;
}

.fancybox-caption {
   font-size: 20px;
}

.panel-title {
   text-transform: uppercase;
   font-weight: 700;
}

.panel-default > .panel-heading {
   color: var(--msf-text-hell);
   background-color: var(--msf-bg-color);
}

.msf-balken {
   background-color: var(--msf-bg-color);
   padding: 10px 0;
}

.mdd-detail .msf-balken {
   padding: 3px 0;
}

.msf-logo {
   padding: 20px 0;
}

.produkt_vorschau {
   border: 1px solid #ddd;
   box-shadow: 0 .5em 10px #ddd;
}

.error-message {
   color: red;
}

.mdd-logo-detail {
   max-width: 50%;
   max-height: 150px;
}

.footer {
   background-color: #fff;
   font-size: 1.1em;
   font-weight: 400;
   padding: 30px;
}

.footer a {
   color: black;
}

.filterbox {
   display: inline-block;
   border: 1px solid hsla(204, 48%, 53%, 0.2);
   background: hsla(203, 48%, 88%, 0.2);
   padding: 12px;
   text-align: center;
   font-size: 1.2em;
}

.filterbox a {
   padding-right: 15px;
}

.filter {
   color: black;
   text-decoration: underline;
}

@media (max-width: 767px) {
   .mdd-bild {
      max-width: 100%;
      max-height: 600px;
      margin: 0 auto;
   }
}