/* mulish-600 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Mulish';
  font-style: normal;
  font-weight: 600;
  src: url('../fonts/mulish-v18-latin-600.eot'); /* IE9 Compat Modes */
  src: url('../fonts/mulish-v18-latin-600.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/mulish-v18-latin-600.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/mulish-v18-latin-600.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('../fonts/mulish-v18-latin-600.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('../fonts/mulish-v18-latin-600.svg#Mulish') format('svg'); /* Legacy iOS */
}

/* mulish-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Mulish';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/mulish-v18-latin-700.eot'); /* IE9 Compat Modes */
  src: url('../fonts/mulish-v18-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/mulish-v18-latin-700.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/mulish-v18-latin-700.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('../fonts/mulish-v18-latin-700.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('../fonts/mulish-v18-latin-700.svg#Mulish') format('svg'); /* Legacy iOS */
}

/* poppins-500 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 500;
  src: url('../fonts/poppins-v24-latin-500.eot'); /* IE9 Compat Modes */
  src: url('../fonts/poppins-v24-latin-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/poppins-v24-latin-500.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/poppins-v24-latin-500.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('../fonts/poppins-v24-latin-500.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('../fonts/poppins-v24-latin-500.svg#Poppins') format('svg'); /* Legacy iOS */
}

@font-face {
  font-family: 'icomoon';
  src:  url('../fonts/icomoon.eot?bmyu9g');
  src:  url('../fonts/icomoon.eot?bmyu9g#iefix') format('embedded-opentype'),
    url('../fonts/icomoon.ttf?bmyu9g') format('truetype'),
    url('../fonts/icomoon.woff?bmyu9g') format('woff'),
    url('../fonts/icomoon.svg?bmyu9g#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: block;
}

[class^="icon-"], [class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'icomoon' !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-map-marker:before {
  content: "\e900";
}


/* ### Main-Styles ##################################################################*/
    
body,table,td,div,form,input,pre {
    font-family: 'Mulish';
    font-size: 17px; 
    color: #3f3f41; 
    vertical-align: top;
    line-height:1.7;
    }
    
#seite {
    margin:auto;
    width: 100%;
    background: #FFF;
    }
    
/* ### Kopf-Styles ##################################################################*/
    
#kopf { 
    width:auto;
    height:320px;
    }

.attentionbox { 
    background-color:#2e5e62;
    text-align:center;
    color:#fff;
    padding:12px 0px;
    }

.attentionbox { 
            background-color: #2e5e62;
            text-align: center;
            padding: 12px 0px;
            overflow: hidden;
            white-space: nowrap;
            position: relative;
        }

.attentionbox span { 
            color: #fff;
        }
        
        .scroll-container {
            display: inline-block;
            animation: scroll-left 40s linear infinite;
        }
        
        .scroll-text {
            display: inline-flex;
            align-items: center;
            gap: 8px;
        }
        
        .material-icons {
            vertical-align: middle;
            font-size: 20px;
        }
        
        .separator {
            margin: 0 20px;
        }
        
        @keyframes scroll-left {
            0% {
                transform: translateX(0);
            }
            100% {
                transform: translateX(-50%);
            }
        }


.logo { 
    margin-top:70px;
    text-align:center;
    padding:0px 8%; 
}

.logo img {
    width:418px;
    height:auto;
}
@media (max-width:500px) { 
.logo img {
    width:100%;
} 
} 


/* ### Körper-Styles ##################################################################*/ 
    
#koerper { 
    width:auto;
    padding:0px 8% 80px 8%;
    }

.titelbild img { width:100%; height:auto; }
.headline img { width:1078px; height:auto; }
@media (max-width:1366px) { 
.headline img { width:100%; height:auto; }
} 
.headline { padding: 20px 3% 0px 3%; }
.textcontent { padding: 70px 3% 0px 3%;}
@media (max-width:900px) { 
.headline { padding: 60px 0px 0px 0px;}
.textcontent { padding: 70px 0px 0px 0px;}
.headline img { width:100%; height:auto; }
} 
.unterschrift { width:158px; height:auto; margin: 15px 0px 0px 80px; }

.terminbuttonbox { margin: 40px 0px 0px 3%; }
@media (max-width:1000px) { 
.terminbuttonbox { margin: 40px 0px 0px 0px; }
} 

    
/* ### Fuss-Styles ##################################################################*/
    
#fuss {
    padding:0px 8% 80px 8%; 
    width:auto;
    height:auto;
    background-color: #ccc3ac;
    }

#fuss .logo { 
    padding:70px 0px 40px 0px;
}
@media (max-width:485px) { 
#fuss .logo img { width:100%; height:auto; }
} 

.dreierbox { 
    display:flex;
    justify-content:space-between;
    flex-wrap: nowrap;
}

@media (max-width:900px) { 
.dreierbox { 
    flex-direction: column;
} 
} 

.dreierbox div { 
    font-size:20px;
    color:#fff; 
}

.oeffnungszeiten {text-align:center; }
.impbox {
    display:flex;
    justify-content: flex-end;
    flex-direction: column;
}
.impbox img { 
    float:right;
    width:63px;
    height: auto;
    margin-bottom:38px;
}
@media (max-width:900px) { 
.impbox img { 
    float:unset;
    margin:40px 0px;
} 
} 


@media (max-width:900px) { 
.adressbox, .implinks, .instabox { 
    text-align:center;
}
.oeffnungszeiten {
    padding-top:40px;
} 
} 

/* ### Standard-Styles ##################################################################*/ 
    
h1, h2 { font-family: 'Poppins'; font-size:25px; color:#000; margin-top:-10px; }
h2 { color:#f1ebe2; }
.impressum h2 { color:#3f3f41; }
.impressum #fuss h2 { color:#f1ebe2; }
.blauerFont { color:#2e5e62; }

p, h1, h2, h3, h4 {
   -moz-hyphens: auto;
   -o-hyphens: auto;
   -webkit-hyphens: auto;
   -ms-hyphens: auto;
   hyphens: auto;
   word-wrap: break-word;
}   
  
/* ### Linkfarben ##################################################################*/

a, a:link, a:visited, a:active, a:focus { color: #2e5e62; text-decoration: none;}
a:hover { text-decoration: underline;}

.implinks a { text-decoration: none; }
.implinks a:link { color: #fff; }
.implinks a:visited { color: #fff; }
.implinks a:hover { color: #fff; text-decoration: underline; }

.adressbox a { text-decoration: none; }
.adressbox a:link { color: #fff; }
.adressbox a:visited { color: #fff; }
.adressbox a:hover { color: #fff; text-decoration: underline; }

.button, .button:link, .button:visited {
    background: #2e5e62 url('../img/terminbuchen-hg.png') left top no-repeat; 
    color:#fff;
    padding:15px 25px 15px 55px;
    border:none;
    border-radius:5px;
    text-decoration: none;
}
.button:hover {
   text-decoration: underline;  
}

.textcontent a[href^="tel"]:link,
.textcontent a[href^="tel"]:visited,  
.textcontent a[href^="tel"]:hover {
    text-decoration: none;
    color: #3f3f41;
    cursor: default; 
    }

.adressbox a[href^="tel"]:link,
.adressbox a[href^="tel"]:visited,  
.adressbox a[href^="tel"]:hover {
    text-decoration: none;
    cursor: default; 
    }


/* ### Noscript-Styles ##################################################################*/ 
    
#noscript-bg {
position:fixed;
width:100%;
height:60px;
z-index:9999;
background:#ffff99;
border:1px solid #000;
}

#noscript-warnung {
width:690px;
height:45px;
margin:7px auto;
background:url('../img/noscript_warnung.gif') left top no-repeat;
padding:3px 0px 0px 60px;
font-size:12px;
line-height:1.5em;
color:#000000;
}

#noscript-warnung a {color:#ff0000;}
#noscript-warnung a:hover {color:#ff0000;}
#noscript-warnung b{font-size:16px;}



