@charset "utf-8";
/* CSS Document */

/* Globals */

h1, h2, h3, h4, h5, h6, h7 {font-family: "Arial Narrow", sans-serif;}
html * {font-family: "Arial", sans-serif;}

/* WEIHNACHTEN
body > div.container:before {content: "Frohe Weihnachten. \A In dieser besinnlichen Zeit w\00fc nschen wir Ihnen und Ihrer Familie ein frohes Weihnachtsfest und ein erfolgreiches neues Jahr. Vielen Dank f\00fc r Ihre Treue im vergangenen Jahr. Wir freuen uns darauf, Sie auch 2024 wiederzusehen."; width: 100%; box-sizing: border-box; padding: 180px 20px 30px; margin-top: 30px; font-size: 20px; color: #212529; display: block; text-align: center; white-space: pre-wrap; background: no-repeat center top url("https://schwartz-kosmetik.de/zeug/weihnachten.png");}
*/

/* Navigation */

.navbar {
    -webkit-box-shadow: 0 0 7px 0 rgb(128 128 128 / 50%);
    box-shadow: 0 0 7px 0 rgb(128 128 128 / 50%);
}
.navbar-collapse {text-align: center;}

.nav-link {text-transform: uppercase; font-size: 12px; letter-spacing: 2px; }

/* 3er Box Startseite */

.jumbo_wrapper {display: flex; align-items: stretch; height: 60vh;}
.jumbo_wrapper a {flex-grow: 1; width: 100%; text-align: center; align-self: center; background: transparent; height: 100%; display: flex; align-items: stretch; text-decoration: none!important;}

.jumbo_wrapper a .jumbotron {background: url("hygge.jpg"); background-size: cover; background-position: center center;}

.jumbo_wrapper a .jumbotron {width: 100%; height: 100%; padding: 0;}

.jumbo_wrapper .jumbotron .btn {background: #000; border: none; display: block;
    width: 50%;
    margin: 30px auto; transition: all ease 0.3s; max-width: 180px;}

.jumbo_wrapper .jumbotron .btn:hover {background: #222;}

.jumbo_wrapper .jumbotron .container p.h2 {background: #fff; display: inline; padding: 5px; line-height: 1.4; color: #000; font-family: "Arial Narrow", sans-serif; letter-spacing: 5px;}

.jumbo_wrapper .jumbotron .container {position: relative; padding: 0; width: 100%; max-width: 100% !important; height: 100%; background: rgba(0, 0, 0, 0.75); margin: 0; display: flex; align-items: center; justify-content: center; transition: all ease 0.3s;}

.jumbo_wrapper .jumbotron .container .inhalt {width: 100%;}

.jumbo_wrapper a:hover .jumbotron .container {background: rgba(0, 0, 0, 0.35);}

a {color: #666; text-decoration: none!important; transition: all ease 0.3s;}
a:hover {color: #000;}
.footer_bottom a:hover {color: #fff;}
.kontakt a:hover {margin-left: 5px;}
.insta svg {width: 30px;}

.footer_contact {background: rgba(200,200,200,0.12); padding-top: 40px;
    padding-bottom: 30px; font-size: 14px;}
.footer_contact .h5 {padding-bottom: 10px; border-bottom: 1px dotted #999; letter-spacing: 5px;}

.footer_bottom {background: #111; color: #fff; padding: 10px 0;}
.footer_bottom p {margin-bottom: 0;}

.kontakt {position: sticky; top: 20px; padding-bottom: 20px; align-self: flex-start;}

@media only screen and (max-width: 900px) {
	.jumbo_wrapper {display: block; height: auto;}
	.jumbo_wrapper a, .jumbo_wrapper .jumbotron .container {width: 100%; max-width: 100%; display: block;}
	.jumbo_wrapper a, .jumbo_wrapper .jumbotron {margin-bottom: 0;}
	.jumbo_wrapper .jumbotron .btn {margin: 30px auto 0 auto;}
	.jumbo_wrapper a .jumbotron .inhalt {padding: 30px 0; box-sizing: border-box;}
	.footer_contact {display: none;}
}

#bonjour {display: none;}