:root {
   --msf-text-hell: #ffffff;
   --msf-bg-color: #1478b4;
   --msf-trenner-farbe: #FF6E3A;
   --msf-h-color: #2C3E5C;
   --hintergrund: url("../bilder/MSF_Web_header_links.png");
}

body,
td,
th {
   font-family: "Open Sans";
}

a {
   color: var(--msf-bg-color);
}

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

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

h1,
h2,
h3,
h4,
h5 {
   font-family: "Nocturno" !important;
   font-weight: bold !important;
   color: var(--msf-h-color);
}

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

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

.trenner {
   font-weight: bolder;
   color: var(--msf-trenner-farbe);
   margin-left: 7px;
   margin-right: 7px;
}

.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: #000;
   background-color: var(--msf-bg-color);
}

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

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

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

.error-message {
   color: red;
}

.msf-logo-detail {
   width: 50%;
}

.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;
}

body.hintergrundbild {
   background-image: var(--hintergrund);
   background-position: top left;
   background-repeat: no-repeat;
}

.msf-detail {
   --msf-bg-color: #7A9A85;
}

.msf-detail p,
.msf-detail li {
   font-size: 20px;
}

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

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

@media (max-width: 767px) {
   h2 {
      margin-top: 0;
      text-align: center;
   }
}

@media (min-width: 768px) {
   .hintergrundbild {
      background-image: var(--hintergrund);
      background-position: top left;
      background-repeat: no-repeat;
   }

   h2 {
      margin-top: 40px;
   }
}

@media (min-width: 992px) {
   .hintergrundbild {
      background-image: var(--hintergrund);
      background-position: top left;
      background-repeat: no-repeat;
   }

   h2 {
      margin-top: 53px;
   }
}

@media (min-width: 1200px) {
   .hintergrundbild {
      background-image: var(--hintergrund);
      background-position: top left;
      background-repeat: no-repeat;
   }

   h2 {
      margin-top: 65px;
   }
}