/* ------------------------------------------------- */
/* Individualisierendes CSS für Single Template Site */
/* (c) 2025 Wolfgang Schütte, büro punkt.            */
/* ------------------------------------------------- */

body { background-color: #706F6F; font-family: 'Source Sans Pro', Arial, Helvetica, sans-serif; font-weight: 400; font-size: 20px; line-height: 30px; letter-spacing: -0px; color: #585857; min-width: 320px; padding-top: 200px; }
html { background-color: #706F6F; }
h1,h2 { text-transform: uppercase; font-size: 38px; line-height: 44px; font-weight: 400; color: #585857; margin-bottom: 25px; position: relative; left: -2px; letter-spacing: 0px; }
h1 b, h2 b { font-weight: bold; letter-spacing: 0px; }
h3 { text-transform: none; font-size: 38px; line-height: 44px; font-weight: 400; color: #585857; margin-bottom: 25px; position: relative; left: -2px; letter-spacing: 0px;  }
h4 { text-transform: uppercase; font-size: 28px; line-height: 34px; color: #585857; font-weight: 400; margin: 0px 0px 0px 0px; }
h5 { font-size: 25px; line-height: 33px; color: #585857; font-weight: 200; text-transform: uppercase; }
h6 { font-size: 14px; font-weight: 200; margin: -10px 0px 0px 0px; line-height: 20px; }

.glink { font-size: 24px; line-height: 34px; font-weight: 200; text-transform: uppercase; text-decoration: underline; }
.glink:hover, .glink.aktiv { color: #706F6F;}
 
a { color: black; }
         
#content { background-color: white; padding-bottom: 100px; box-sizing: border-box; -moz-box-sizing: border-box; }
#content a { color: #706F6F; }
#content a:hover { text-decoration: underline; }
#kopfzeile { background-color: #706F6F; height: 225px; padding: 28px 0px 20px 0px; top: 0px; border-color: #706F6F; box-sizing: border-box; -moz-box-sizing: border-box; max-height: 225px; }

.wrapper { background-color: white; margin-top: 0px; }
#kopfzeile .innerwrapper .menu { text-align:left; height: auto; font-weight: 400; font-size: 20px; line-height: 38px; text-transform: uppercase; color: white; width: 100%; letter-spacing: 0px; bottom: -10px; left: -12px; padding: 0px 0px 0px 0px; }
#kopfzeile .innerwrapper .menu ul { margin-right: 18px; }
#kopfzeile .innerwrapper .menu ul li { margin-left: 30px; }
#kopfzeile .innerwrapper .mobilemenu { font-weight: 400; font-size: 20px; margin: 0px; line-height: 20px; text-transform: uppercase; color: white; letter-spacing: 0px; border-style: solid; border-width: 1px 1px 1px 0px; border-color: white; background-color: #706F6F; position: absolute; width: 285px; }
#kopfzeile .innerwrapper .mobilemenu ul li { margin: 15px 0px 15px 28px; }
#kopfzeile .innerwrapper .mobilemenu a:link, #kopfzeile .innerwrapper .mobilemenu a:visited { color: white !important; }
#kopfzeile .innerwrapper .mobilemenu a:hover, #kopfzeile .innerwrapper .mobilemenu a.aktiv { color: rgba(255,255,255,0.7) !important; }
#logo { max-width: 315px; height: auto; top: inherit; top: 0px; left: 20px; position: absolute; }
.logo { width: 100%; max-width: 315px; height: 127px !important; display: inherit; top: 0px; margin: 0px; }
#kopfzeile .innerwrapper .slogan { display: none; }

#kopfzeile .innerwrapper .imprint { font-size: 14px; top: -18px; }

#kopfzeile a { color: rgba(255,255,255,1); }
#kopfzeile a:hover { color: rgba(255,255,255,0.7);}
#kopfzeile a.aktiv, #kopfzeile .aktiv { color: gba(255,255,255,0.7); }
#footer { height: auto; color: white; background-color: #706F6F; padding: 40px 0px 0px 0px; font-weight: 500; font-size: 16px; line-height: 22px; box-sizing: border-box; -moz-box-sizing: border-box; margin: 50px 0px -100px 0px !important; }
#footer .innerwrapper { text-align: left; }
#footer a .aktiv { color: white !important; }

.platzhalter { background-color: #eef5fd; height: 100%; }

.modul_bildleiste { width: 100%; padding: 0px; background-color: #d0d1d1; margin-top: 0px; margin-bottom: 81px; height: 520px; }
.leistenbild {width: 100%; max-width: 100%; left: 0px; }
.modul_fliesstext { padding: 0px 0px 20px 0px;   }
.modul_slider { padding: 0px 0px 20px 0px;  margin: 0px; }
.modul_kontakt { padding: 0px 0px 50px 0px; margin: 0px; }
.modul_bildergalerie { padding: 0px 0px 20px 0px; margin: 0px; }
.modul_bildteppich { width: 100%; overflow-x: hidden; }

.hintergrund { background-color: #c5c4c4; }

.modul_bildleiste .textbox h3 { color: black; letter-spacing: 0px; text-transform: uppercase; }
.modul_bildleiste:first-of-type { margin-top: -175px; height: 520px; }

.bild { margin-top: 10px; border-radius: 0px; margin-bottom: 0px !important;}
.bildbox { margin-top: 10px; margin-bottom: -30px; }
.bildbox { height: 320px !important; }

.tabelle.dreispaltig .bildbox { border-radius: 0px 0px 0px 0px; }
.tabelle.zweispaltig .bildbox { border-radius: 0px 0px 0px 0px; height: 480px !important;}
.tabelle.zweispaltiggrossklein .bildbox { border-radius: 0px 0px 0px 0px; }
.tabelle.zweispaltigkleingross .bildbox { border-radius: 0px 0px 0px 0px; }

#footer .tabelle { }
#footer .spalte.rechts { display: table-cell; text-align: left; font-size: 24px; line-height: 30px; padding-left: 10px; width: 240px; vertical-align: bottom; }
#footer .spalte.links { display: table-cell; text-align: left; padding-right: 10px; vertical-align: bottom; }
#footer .spalte.mitte { display: table-cell; text-align: center; width: 370px; }

#footer a:link, #footer a:visited { color: white; opacity: 1 }
#footer .copyright { display: inline-block; position: relative; margin-top: 0px; }
#footer .copyright ul { margin-left: -50px; }
#footer a:hover, #footer a:active { color: rgba(255,255,255,0.5) !important; }
#footer .partner { display: inline-block; text-transform: uppercase; width: 100%;}

.fancyinput, .fancytextarea, .fancyselect { font-size: 16px; line-height: 24px; font-weight: 200; }

.fancybutton { color: #706F6F; border-color: #706F6F; font-size: 16px; line-height: 24px; font-weight: 400; }
.fancybutton:hover { background-color: #706F6F; color: white; }

#cookie_hinweis .fancybutton { color: #706F6F; border-color: #706F6F; font-size: 16px; line-height: 24px; font-weight: 400; }
#cookie_hinweis .fancybutton:hover { background-color: #706F6F; color: #C5C4C4; }

#openmenubutton:hover { color: #706F6F; cursor: pointer; }
#openmenubutton .aktiv a { color: #706F6F; }
.error { color: #e62a3f; }

#cookie_hinweis { color: #706F6F; background-color: #C5C4C4; }
            
.abschnittstrenner hr { background-color: #706F6F;}

.modul_kontakt { color: #706F6F; }

.top { margin: 0px auto; position: relative; top: -60px; }

.sonderabstand { display: block; height: 0px; margin-top: -50px; }

.slick-dots li button { border-color: #706F6F; opacity: 0.6; }
.slick-dots li button:hover, .slick-dots li.slick-active button { 
        background-color:  #706F6F; border-color:  #706F6F;
        opacity: 0.3;
}

.fadeleft { display: none; }
.faderight { display: none; }

.platzhalter {
    background-color: white;
    border-style: solid; border-width: 1px;
    border-color: #6f706f;
}

@media (max-width: 1100px) {
    #logo { right: 20px; }
}

@media (max-width: 1080px) {
    .modul_bildleiste .textbox {
        margin-left: 0px; padding-left: 20px;
    }
}

@media (max-width: 1050px) {
    #kopfzeile .innerwrapper .menu { letter-spacing:-0.5px; }
}

@media (max-width: 1000px) {
    #kopfzeile .innerwrapper .menu { letter-spacing:-1px; }
    
}

@media (max-width: 960px) {
    #kopfzeile .innerwrapper .menu { letter-spacing:-0.5px; font-size: 18px; }
}
@media (max-width: 910px) {
    #kopfzeile .innerwrapper .menu { letter-spacing:-1px; font-size: 18px; }
    #kopfzeile .innerwrapper .menu ul li { margin-left: 20px; }
    #kopfzeile .innerwrapper .menu ul { margin-left: 10px; }
}

@media (max-width: 800px) {
    .tabelle.dreispaltig, .tabelle.dreispaltig .zeile, .tabelle.dreispaltig .spalte { display: block; width: 100%; }  
    .break { display: none; }
}

@media (max-width: 830px) {
    #kopfzeile .imprint { width: 320px !important; margin-top: 9px;}
    #kopfzeile { height: 155px; }
    #kopfzeile .innerwrapper .menu { display: none; }
    #logo { top: -20px; }
    #openmenubutton { display: block !important; top: 0px; right: 0px; z-index: 200; position: absolute !important; }
    #kopfzeile .innerwrapper .mobilemenu { top: 116px; left: 0px; }
    .top { margin-right: -50px;  margin: 0px auto; }
    .modul_bildleiste { height: 450px;}
    #kopfzeile { top: 0px;}
    .modul_bildleiste:first-of-type { margin-top: -245px !important; }
}

@media (max-width: 750px) {
    .break { display: block; }
    .tabelle.zweispaltigkleingross, .tabelle.zweispaltigkleingross .zeile, .tabelle.zweispaltigkleingross .spalte { display: block; width: 100% !important; }  
    #kopfzeile .innerwrapper .menu { letter-spacing:-0.5px; font-size: 16px; } 
}

@media (max-width: 720px) {
    #footer .tabelle, #mapwrap .tabelle { display: table !important;}
    #footer .zeile, #mapwrap .zeile { display: table-row !important;}
    #footer .spalte, #mapwrap .spalte { display: table-cell !important;}
    .tabelle.dreispaltig .spalte, .tabelle.zweispaltig .spalte, .tabelle.zweispaltiggrossklein .spalte, .tabelle.zweispaltigkleingross .spalte, .tabelle.einspaltig .spalte { margin-bottom: 0px; }
    #footer .copyright  { text-align: center; width: 100%; padding: 0px 0px 0px 22px; } 
    #footer .tabelle { display: block !important;}
    #footer .zeile { display: block !important;}
    #footer .spalte.links { display: block !important;}
    #footer .spalte.rechts { display: none !important;}
    #footer .spalte.mitte { display: none !important;}
    #footer .partner { width: 100%; text-align: center; }
    .top { top: 0px; }
}


@media (max-width: 600px) {
    .tabelle.dreispaltig .spalte, .tabelle.zweispaltig .spalte, .tabelle.zweispaltiggrossklein .spalte, .tabelle.zweispaltigkleingross .spalte, .tabelle.einspaltig .spalte { margin-bottom: 0px; }
    #kopfzeile .imprint { width: 220px !important; }
}

@media (max-width: 500px) {
    #kopfzeile .innerwrapper { padding: 0px 10px 0px 10px;}
    #kopfzeile .innerwrapper .imprint { width: 100% !important; text-align: center; padding: 0px; margin: 0px; right: inherit; left: inherit; position: static; margin-top: -25px; }
    #kopfzeile .innerwrapper .imprint ul { margin-left: -30px; }
    #logo { width: 300px !important; max-width: 300px; height: 100%; bottom: inherit; right: inherit; margin: 0 auto; margin-top: 3px; position: static; padding: 0px 10px 0px 10px; }
    #kopfzeile { height: 250px; position: absolute !important; width: 100%; }
    #kopfzeile .innerwrapper .menu { top: 107px; bottom: inherit; text-align: center; padding: 0px; margin: 0px; width: 100%; }
    #openmenubutton { bottom: inherit; right: inherit; left: -113px; top: -9px; position: relative; }
    #kopfzeile .innerwrapper .mobilemenu { top: 138px; width: 100%; border-width: 0px 0px 1px 0px; text-align: center; padding: 0px; }
    #kopfzeile .innerwrapper .mobilemenu ul { margin-left: -25px; }
}


@media (max-width: 400px) {
    .modul_bildleiste { height: 300px !important; margin-top: 17px !important;}
    .modul_bildleiste .textbox h3 { letter-spacing: 0px; font-size: 26px; line-height: 34px; }
    .modul_kontakt a { letter-spacing: -0.5px;}
    h4 { letter-spacing: -0.5px; }
    h1,h2 { letter-spacing: -0.5px; }
}

@media (max-width: 320px) {
    #content { max-width: 320px; }
}