/**
 *
 * Theme Name:        Wilder Wurz X MOLECO GmbH
 * Theme URI:         https://www.moleco.de
 * Description:       Dieses Theme wurde erstellt durch die MOLECO GmbH - Agentur für digitale Kommunikation
 * Version:           1.0.0
 * Author:            MOLECO GmbH
 * Author URI:        https://www.moleco.de
 * Tested up to:      6.8.1
 * Requires at least: 6.8.1
 * Requires PHP:      8.3.22
 *
 */

:root{
    --main: #0F1B11 ;
    --lightmain: #132F18;
    --sec: #FD682B;
    --creme: #FDF2EB;
    --white: #ffffff;
    --lightgray: #E9E9E9;
}

body,html,*{font-size:20px;line-height:1.5;font-family:'Belanosima';font-weight:normal;}
html{scroll-behavior: smooth;}

a{color:var(--main);text-decoration:underline;font-size:100%;transition:all .3s ease;}
a:hover{color:var(--sec);transition:all .3s ease;}

li{list-style:none;padding-left:30px;position:relative;}
li:before{content:'';width:7.5px;height:7.5px;display:block;background:var(--main);position:absolute;top:7.5px;left:0;border-radius:50%;}

ul{padding:0;margin:0;}

img{max-width:100%;height:auto;}

h1{font-size:500%;display:block;width:max-content;position:relative;color:var(--main);margin:0;line-height:1;}
h2{font-size:300%;display:block;color:var(--main);margin:0;line-height:1;}
h3{font-size:225%;display:block;color:var(--main);margin:0;line-height:1;}

.headline{font-weight:bold;display:block;color:var(--main);margin-bottom:10px;line-height:1.1;text-transform:uppercase;}
.headline strong{position:relative;display:inline-block;}
.headline strong:before{content:'';position:absolute;bottom:-10px;left:-5%;display:block;width:110%;height:80px;background:url('media/headline_brusch.svg');background-position:center;background-size:100%;background-repeat:no-repeat;z-index:-1;}
.subline{font-size:150%;font-weight:bold;display:block;color:var(--sec);margin-bottom:25px;text-transform:uppercase;}

.btn{position:relative;padding:10px 35px;font-size:100%;font-weight:400;background:var(--sec);color:var(--white);transition:all .3s ease;line-height:1;text-align:center;text-decoration:none;border-radius:0;}
.btn:hover{background:var(--white);color:var(--main);transition:all .3s ease;}

strong{font-weight:bold;font-size:100%;}

.container{max-width:1640px;}
.container.wide{max-width:1850px;}

#herstellung{padding-top:125px;margin-top:-50px;}

.nopaddingright{padding-right:0;}
.nopaddingleft{padding-left:0;}

.owl-carousel .owl-item:last-child{display:none;}

.fancybox-overlay{z-index:99999;background:rgba(0,0,0,0.7);}

/*------------------------------------Altersabfrage-------------------------------------------------*/

#altersnachweis{position:fixed;left:0;right:0;top:0;bottom:0;z-index:999999;background:url('media/altersabfrage_background.webp');background-position:center;background-size:cover;background-repeat:no-repeat;}
#altersnachweis .logo{margin-bottom:100px;max-width:50%;}
#altersnachweis .inner{text-align:center;padding:40px;width:100%;max-width:45%;position: fixed;top:0;left: 50%;transform: translateX(-50%);}
#altersnachweis .inner .altersfrage{display:none;color:var(--sec);font-size:400%;font-weight:bold;}
#altersnachweis .inner .altersfrage.active{display:block;}
#altersnachweis .inner .altersfrage.nope{font-size:250%;}
#altersnachweis .inner .altersantwort{background:none;border:solid 3px var(--sec);color:var(--sec);width: 200px;margin: 40px;text-transform: uppercase;transition:all .3s ease;}
#altersnachweis .inner .altersantwort:hover{background:var(--sec);color:var(--main);transition:all .3s ease;}

/*------------------------------------Kontaktformular-------------------------------------------------*/

.wpcf7-form-control-wrap{padding:5px;display:inline-block;width:50%;}
.wpcf7-form-control-wrap[data-name="anrede"]{width:50%;display:block;}
.wpcf7-form-control-wrap[data-name="mailadresse"], .wpcf7-form-control-wrap[data-name="nachricht"], .wpcf7-form-control-wrap[data-name="angebote"], .wpcf7-form-control-wrap[data-name="datenschutz"]{width:100%;}
.wpcf7-list-item{margin-left:0!important;}

input, textarea, select{border:none;background:rgba(255,255,255,0.7);color:var(--main);padding:10px 25px;width:100%;}
input[type="checkbox"]{width:15px;display:inline-block;margin-right:5px;}
input[type="submit"]{width:max-content;padding:10px 50px;margin-top:25px;background:var(--main);}
input[type="submit"]:hover{background:var(--white);}
textarea{height:150px;}
select{padding:12.5px 25px;}

/*------------------------------------Header-------------------------------------------------*/

#page-header{position:absolute;top:0;right:0;left:0;padding:50px 0;background:linear-gradient(180deg,rgba(15, 27, 17, 1) 0%, rgba(15, 27, 17, 0) 100%);;z-index:9999;}

#page-header .logo img{max-width:75%;}

#page-header .topheader{padding:10px 0;background:var(--main);text-align:right;}
#page-header .topheader a{color:var(--white);text-decoration:none;margin-left:35px;position:relative;}
#page-header .topheader a::before{content: '';position: absolute;width: 100%;height: 2px;border-radius: 5px;background-color: var(--white);bottom: -3px;left: 0;transform-origin: right;transform: scaleX(0);transition: transform .3s ease-in-out;}
#page-header .topheader a:hover::before{transform-origin: left;transform: scaleX(1);}

#page-header .mainheader{padding:15px 0;}
#page-header .mainheader #toppermenu{height:100%;align-content:center;text-align:right;}
#page-header .mainheader #toppermenu .menu{position:unset;}
#page-header .mainheader #toppermenu .menu li{display:inline-block;margin:0 10px;padding:5px 25px;position:unset;}
#page-header .mainheader #toppermenu .menu li:before{display:none;}
#page-header .mainheader #toppermenu .menu li a{padding:30px 0;text-decoration:none;position:relative;text-transform:uppercase;color:var(--white);}
#page-header .mainheader #toppermenu .menuburgerbutton{display:none;width:40px;height:40px;padding:0;background:none;border:none;float:right;}
#page-header .mainheader #toppermenu .menuburgerbutton span{display:block;width:100%;height:4px;background:var(--white);transition:all .3s ease;}
#page-header .mainheader #toppermenu .menuburgerbutton span:nth-child(2){margin:10px 0;}
#page-header .mainheader #toppermenu.active .menuburgerbutton span:nth-child(1){transform:rotate(-45deg);margin-top:5px;transition:all .3s ease;}
#page-header .mainheader #toppermenu.active .menuburgerbutton span:nth-child(2){opacity:0;transition:all .3s ease;}
#page-header .mainheader #toppermenu.active .menuburgerbutton span:nth-child(3){transform:rotate(45deg);margin-top:-27px;transition:all .3s ease;}

#page-header.bottom{padding:10px 0;position:fixed;top:0;left:0;right:0;background:var(--main);-webkit-animation: fadein 2s; /* Safari, Chrome and Opera > 12.1 */              -moz-animation: fadein 2s; /* Firefox < 16 */-ms-animation: fadein 2s; /* Internet Explorer */-o-animation: fadein 2s; /* Opera < 12.1 */animation: fadein 2s;z-index:9999;}
#page-header.bottom .logo img{max-width:50%;}
#page-header.bottom .mainheader{padding:0;}

@keyframes fadein {
    from { top: -150px; }
    to   { top: 0; }
}
@-moz-keyframes fadein {
    from { top: -150px; }
    to   { top: 0; }
}
@-webkit-keyframes fadein {
    from { top: -150px; }
    to   { top: 0; }
}
@-ms-keyframes fadein {
    from { top: -150px; }
    to   { top: 0; }
}


/*------------------------------------Footer-------------------------------------------------*/

#page-footer{background:var(--lightmain);padding:50px 0 25px;position:relative;z-index:9999;}
#page-footer:before{content:'';position:absolute;top:0;right:0;bottom:0;left:0;background:url('media/footer-background.svg');background-position:top;background-repeat:no-repeat;background-size:cover;z-index:5;}
#page-footer .topper{position:relative;z-index:9;}
#page-footer .topper .infos{color:var(--white);}
#page-footer .topper .infos .btn{display:block;width:max-content;margin-top:50px;}
#page-footer .topper .logo{display:block;text-align:right;}
#page-footer .topper .logo img{max-width:30%;}

#page-footer .copyright{display:block;width:100%;padding:15px 0;margin-top:50px;position:relative;z-index:8;}
#page-footer .copyright span{display:inline-block;color:var(--white);font-size:100%;font-weight:normal;text-decoration:none;transition:all .3s ease;width:25%;}
#page-footer .copyright .links{display:inline-block;width:74%;text-align:right;}
#page-footer .copyright .links a{display:inline-block;color:var(--white);font-size:100%;font-weight:normal;text-decoration:none;transition:all .3s ease;position: relative;}
#page-footer .copyright .links a:hover{color:var(--sec);}
#page-footer .copyright .placer{display:inline-block;margin:0 5px;width:max-content;}

.kontaktpopupbackground{display:none;position:fixed;top:0;right:0;left:0;bottom:0;background:var(--main);opacity:0.7;z-index:9;}
.kontaktpopup{display:none;position: fixed;top: 50%;left: 25%;right: 25%;transform: translateY(-50%);padding: 25px;background: var(--sec);z-index:99;}
.kontaktpopupbackground.active, .kontaktpopup.active{display:block;}
.kontaktpopup .closepopup{position:absolute;top:0;right:0;background:var(--main);color:var(--white);font-size:150%;font-weight:normal;text-align:center;align-content:center;padding:5px 20px;cursor:pointer;}


